Commit 4e6f85c0 authored by 乐宝呗666's avatar 乐宝呗666
parents fb29425b 1dc271be
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
module.exports ={
"presets": [['@vue/cli-plugin-babel/preset', { "modules": false }]],
"plugins": [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}
}
\ No newline at end of file
This diff is collapsed.
......@@ -12,6 +12,7 @@
"core-js": "^3.6.5",
"crypto-js": "^4.0.0",
"echarts": "^4.8.0",
"element-ui": "^2.15.1",
"js-base64": "^3.6.0",
"qs": "^6.10.1",
"vant": "^2.12.6",
......@@ -23,6 +24,7 @@
"@vue/cli-plugin-eslint": "^4.5.0",
"@vue/cli-service": "^4.5.0",
"babel-eslint": "^10.1.0",
"babel-plugin-component": "^1.1.1",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.2.2",
"node-sass": "^5.0.0",
......
This image diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
......@@ -50,10 +50,22 @@ export default {
};
},
components: { triangle },
props: {
data: {
type: Array,
default: () => {
return [];
},
},
},
mounted() {
this.getList();
},
methods: {
clearDom(){
[2,3,4].forEach(v=>{
document.getElementById(`area${v}`).innerHTML = ""
})
},
initScroll() {
let _this = this;
this.box = document.getElementById("areaContent");
......@@ -72,36 +84,17 @@ export default {
} else {
this.box.scrollTop++;
}
},
getList() {
let _this = this;
let requestparams = {};
requestparams._index = 1;
requestparams._size = 10;
this.$https(
{
method: "post",
url: "tBoardStatistic/getBoardDistrictPageList",
},
requestparams
)
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
this.list = res.data.data.records;
this.$nextTick(()=>{
_this.initScroll();
})
} else {
this.list = [];
}
} else {
this.list = [];
}
})
.catch((err) => {
this.$message.error(err.message);
}
},
watch: {
data() {
this.clearDom()
this.list = this.data;
if (this.list.length > 4) {
this.$nextTick(() => {
this.initScroll();
});
}
},
},
};
......
......@@ -3,11 +3,10 @@
<ul>
<li v-for="(item, index) in list" :key="index">
<img :src="getImg(item.urlName)" alt="" />
<!-- <img :src="'@/assets/images/screen/' + item.urlName + '.png'" alt="" /> -->
<div class="title">
<div class="title-name">{{ item.label }}</div>
<span>
<a class="num">{{ item.num }}</a>
<a class="num">{{ item.num || 0 }}</a>
<a class="unit">{{ item.unit }}</a>
</span>
</div>
......@@ -21,7 +20,7 @@ export default {
name: "nums",
data() {
return {
data: [
data: [
{
label: "总播放量",
num: 0,
......@@ -51,20 +50,21 @@ export default {
feild: "interactionCnt",
},
],
list: []
list: [],
};
},
props: ["areaCode"],
mounted() {
this.getList();
},
methods: {
getImg(imgUrl) {
getImg(imgUrl) {
return require("@/assets/images/screen/" + imgUrl + ".png");
},
getList() {
this.$https({
this.$shttp({
method: "post",
url: "tBoardStatistic/getBoardSurvey"
url: `tBoardStatistic/getBoardSurvey?areaCode=${this.areaCode}`,
})
.then((res) => {
if (res.status == 200) {
......@@ -86,6 +86,11 @@ export default {
});
},
},
watch: {
areaCode() {
this.getList();
},
},
};
</script>
......
......@@ -24,6 +24,7 @@ export default {
data() {
return {
title: "互动频次",
echartsDiv: "",
};
},
components: { triangle },
......@@ -35,8 +36,7 @@ export default {
},
},
},
mounted() {
},
mounted() {},
methods: {
init() {
let option = {
......@@ -45,7 +45,7 @@ export default {
},
grid: {
top: 40,
left: "3%",
left: 30,
right: 40,
bottom: "15%",
containLabel: true,
......@@ -108,8 +108,8 @@ export default {
type: "value",
name: "单位/次",
splitNumber: 5,
nameTextStyle:{
color:'#fff'
nameTextStyle: {
color: "#fff",
},
axisLabel: {
textStyle: {
......@@ -159,14 +159,24 @@ export default {
},
],
};
let echartsDiv = this.$echarts.init(document.getElementById("barDemand"));
echartsDiv.setOption(option);
this.echartsDiv = this.$echarts.init(
document.getElementById("barDemand")
);
this.echartsDiv.setOption(option);
},
// 点击事件
echartsClick() {
this.$emit("itemClick", { type: 1, title: this.title });
},
},
watch: {
data() {
if (this.echartsDiv) {
this.echartsDiv.clear();
}
this.init();
},
},
};
</script>
......
......@@ -11,7 +11,8 @@
<span class="title">{{ title }}</span>
<img class="bg" src="@/assets/images/screen/title02_bg.png" alt="" />
</div>
<div id="tends" @click="echartsClick"></div>
<div id="tends" @click="echartsClick">
</div>
</slot>
</triangle>
</div>
......@@ -25,6 +26,7 @@ export default {
data() {
return {
title: "展板点播趋势图",
echartsDiv: "",
};
},
components: { triangle },
......@@ -160,14 +162,22 @@ export default {
},
],
};
let echartsDiv = this.$echarts.init(document.getElementById("tends"));
echartsDiv.setOption(option);
this.echartsDiv = this.$echarts.init(document.getElementById("tends"));
this.echartsDiv.setOption(option);
},
// 点击事件
echartsClick() {
this.$emit("itemClick", { type: 2, title: this.title });
},
},
watch: {
data() {
if (this.echartsDiv) {
this.echartsDiv.clear();
}
this.init();
},
},
};
</script>
......
<template>
<div id="mapDiv"></div>
</template>
<script>
import "echarts/map/js/china";
export default {
name: "maps",
data() {
return {
dataList: [],
};
},
mounted() {
this.getList();
},
methods: {
getList() {
this.$https({
method: "post",
url: "tBoardStatistic/getBoardProvincePlayTotalList"
})
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
this.dataList = res.data.data;
} else {
this.dataList = [];
}
} else {
this.dataList = [];
}
this.init();
})
.catch((err) => {
this.$message.error(err.message);
this.init();
});
},
init() {
let option = {
tooltip: {
triggerOn: "click",
formatter: function (e, t, n) {
return 0.5 == e.value
? e.name + ":播放量"
: e.seriesName + "<br />" + e.name + ":" + e.value;
},
},
visualMap: [
{
dimension: 0,
left: "8%",
bottom: 20,
itemWidth: 16,
orient: "horizontal",
text: ["播放量", "由低到高"],
backgroundColor: "rgba(0,19,45,0.4)",
padding: 16,
textStyle: {
color: "gba(255,255,255,1)",
},
inRange: {
color: [
"rgba(161,255,255,1)",
"rgba(91,214,255,1)",
"rgba(38,157,255,1)",
"rgba(0,72,149,1)",
],
},
},
],
geo: {
map: "china",
roam: !1,
scaleLimit: {
min: 1,
max: 2,
},
roam: true, //是否开启平游或缩放
scaleLimit: {
//滚轮缩放的极限控制
min: 1,
max: 2,
},
zoom: 1.2,
top: 51,
label: {
normal: {
show: !0,
fontSize: "12",
color: "#fff",
},
},
itemStyle: {
normal: {
borderColor: "rgba(0, 0, 0, 0.2)",
},
emphasis: {
areaColor: "#f2d5ad",
shadowOffsetX: 0,
shadowOffsetY: 0,
borderWidth: 0,
},
},
regions: [
{
name: "南海诸岛",
itemStyle: {
// 隐藏地图
normal: {
opacity: 0, // 为 0 时不绘制该图形
},
},
label: {
show: false, // 隐藏文字
},
},
],
},
series: [
{
name: "播放量",
type: "map",
geoIndex: 0,
data:this.dataList,
},
],
};
let echartsDiv = this.$echarts.init(document.getElementById("mapDiv"));
echartsDiv.setOption(option);
},
},
};
</script>
<style lang=scss>
#mapDiv {
width: 100%;
height: 100%;
}
</style>
......@@ -42,7 +42,7 @@ export default {
httpUrl = `tBoardStatistic/getBoardCityPlayTotalList?areaCode=${areaCode}`;
}
_this
.$https({
.$shttp({
method: "post",
url: httpUrl,
})
......@@ -133,7 +133,7 @@ export default {
normal: {
show: !0,
fontSize: "12",
color:'#968f8f',
color: "#968f8f",
formatter: (p) => {
switch (p.name) {
case "内蒙古自治区":
......@@ -203,7 +203,7 @@ export default {
],
};
let echartsDiv = this.$echarts.init(document.getElementById("mapDiv"));
echartsDiv.setOption(option,true);
echartsDiv.setOption(option, true);
echartsDiv.on("click", _this.echartsMapClick);
},
handleBack() {
......@@ -211,21 +211,27 @@ export default {
return;
}
this.parentInfo.pop();
let areaCode = this.parentInfo[this.parentInfo.length - 1].code;
this.emitParent(areaCode);
this.initData(this.parentInfo[this.parentInfo.length - 1].code);
},
emitParent(areaCode) {
this.$emit("changeAreaCode", areaCode);
},
echartsMapClick(params) {
if (!params.data) {
return;
}
debugger
if(params.data.level === "district"){
return false
if (params.data.level === "district") {
return false;
}
let cityCode = params.data.cityCode;
this.emitParent(cityCode);
this.parentInfo.push({
cityName: params.data.name,
code: params.data.cityCode,
});
console.log(params.data.cityCode);
this.initData(cityCode);
},
//这里我封装了下,直接可以拿过来用
......
......@@ -57,14 +57,26 @@ export default {
};
},
components: { triangle },
props: {
data: {
type: Array,
default: () => {
return [];
},
},
},
mounted() {
this.title = this.getTitle();
this.getList();
},
methods: {
clearDom(){
[2,3,4,5,6].forEach(v=>{
document.getElementById(`con${v}`).innerHTML = ""
})
},
getTitle() {
let curTime = getCurDate();
return `全国${curTime.year}${curTime.month}月展板点播TOP10`;
return `${curTime.year}${curTime.month}月展板点播TOP10`;
},
initScroll() {
let _this = this;
......@@ -74,12 +86,6 @@ export default {
let con = document.getElementById(`con${i}`);
con.innerHTML = _this.con1.innerHTML;
}
// let con2 = document.getElementById("con2");
// let con3 = document.getElementById("con3");
// let con4 = document.getElementById("con4");
// con2.innerHTML = this.con1.innerHTML;
// con3.innerHTML = this.con1.innerHTML;
// con4.innerHTML = this.con1.innerHTML;
this.timer = setInterval(_this.scrollUp, _this.speed);
},
scrollUp() {
......@@ -96,38 +102,16 @@ export default {
Stops() {
clearInterval(this.timer);
},
getList() {
let _this = this;
let requestparams = {};
requestparams._index = 1;
requestparams._size = 10;
this.$https(
{
method: "post",
url: "tBoardStatistic/getBoardRankPageList",
},
requestparams
)
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
_this.list = res.data.data.records;
setTimeout(() => {
_this.initScroll();
}, 200);
// _this.$nextTick(() => {
// _this.initScroll();
// });
} else {
this.list = [];
}
} else {
this.list = [];
}
})
.catch((err) => {
this.$message.error(err.message);
},
watch: {
data() {
this.clearDom()
this.list = this.data;
if (this.list.length > 4) {
this.$nextTick(() => {
this.initScroll();
});
}
},
},
};
......
......@@ -7,11 +7,11 @@ import {baseUrl} from './env'
import {
Toast
} from 'vant';
// Vue.use($msg)
const axiosService = axios.create()
//axios 拦截器 请求时的拦截
axios.interceptors.request.use(config => {
// 发送请求之前做一些处理
axiosService.interceptors.request.use(config => {
// 发送请求之前做一些处理
Toast.loading({
message: '加载中...',
forbidClick: true,
......@@ -23,7 +23,7 @@ axios.interceptors.request.use(config => {
return new Promise.reject(error)
})
// 响应时拦截
axios.interceptors.response.use(response => {
axiosService.interceptors.response.use(response => {
// 返回响应时做一些处理
return response
}, error => {
......@@ -99,9 +99,9 @@ const httpServer = (opts, data, file, timeout) => {
let authToken = "";
if (opts.authType && opts.authType != "") {
if (opts.authType === "back") {
authToken =sessionStorage.getItem('token') || "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJhZG1pbiIsInVzZXJfaWQiOiIxIiwiaXNzIjoiSUFUQSIsImV4cCI6MTYxNjY2NTkzOCwiaWF0IjoxNjE2NjUxNTM4fQ._nqZq0LMwkurIBKJtfX-imXLCxQSNwJ-ueGZ8iwW-0oAW880gY7PjNEfroYYQZ91v0u5yQb73Alzvy6EIp6GGg"
authToken =sessionStorage.getItem('sToken') || "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJhZG1pbiIsInVzZXJfaWQiOiIxIiwiaXNzIjoiSUFUQSIsImV4cCI6MTYxNjY2NTkzOCwiaWF0IjoxNjE2NjUxNTM4fQ._nqZq0LMwkurIBKJtfX-imXLCxQSNwJ-ueGZ8iwW-0oAW880gY7PjNEfroYYQZ91v0u5yQb73Alzvy6EIp6GGg"
} else if (opts.authType === "front") {
authToken = sessionStorage.getItem("token");
authToken = sessionStorage.getItem("sToken");
}
httpDefaultOpts.headers["Authorization"] = authToken
}
......@@ -109,7 +109,7 @@ const httpServer = (opts, data, file, timeout) => {
delete httpDefaultOpts.data
httpDefaultOpts.params.timestamp_static = new Date().getTime();
} else {
delete httpDefaultOpts.params
// delete httpDefaultOpts.params
if (file) {
httpDefaultOpts.data = data;
}
......@@ -124,7 +124,7 @@ const httpServer = (opts, data, file, timeout) => {
let markIndex = setTimeout(function () {
Toast.clear()
}, 10000)
axios(httpDefaultOpts).then((res) => {
axiosService(httpDefaultOpts).then((res) => {
Toast.clear()
clearTimeout(markIndex)
if (res.status === 200) {
......@@ -134,8 +134,8 @@ const httpServer = (opts, data, file, timeout) => {
message: '您的登录过期,请重新登录!',
onClose: () => {
//这个时候点击确定后清除用户信息
sessionStorage.removeItem('backToken')
sessionStorage.removeItem('userId')
sessionStorage.removeItem('sToken')
sessionStorage.removeItem('sUserInfo')
router.push({
path: '/',
query: {
......
/**
* Created by supervisor on 2017/11/3.
*/
import axios from 'axios'
import router from '../router'
import {baseUrl} from './env'
import {
Message,MessageBox
} from 'element-ui';
// Vue.use($msg)
const service = axios.create()
//axios 拦截器 请求时的拦截
service.interceptors.request.use(config => {
// 发送请求之前做一些处理
return config
}, error => {
// 当请求异常时做一些处理
return new Promise.reject(error)
})
// 响应时拦截
service.interceptors.response.use(response => {
// 返回响应时做一些处理
return response
}, error => {
// 当响应异常时做一些处理
return Promise.resolve(error.response)
})
function errorState(status, data) {
if (!data) {
Message.error("网络出小差咯~")
}
if (status === 401) {
this.$confirm('您的用户权限已被禁用,请联系管理员!', '提示', {
confirmButtonText: '确定',
type: 'warning'
}).then(() => {
//这个时候点击确定后清除用户信息
sessionStorage.removeItem('sToken')
sessionStorage.removeItem('sUserInfo')
router.push({
path: '/slogin',
})
}).catch(() => {
});
}
if (status === 500 && data.message) {
if(data.message.indexOf("token invalid") !== -1){
MessageBox.alert('您的登录过期,将重新登录!', '', {
confirmButtonText: '确定',
callback: action => {
router.push({
path: '/slogin',
})
}
});
}
if(data.message.indexOf("not have permission") !== -1){
Message.error("抱歉,你无权访问该页面!")
}else{
Message.error(data.message)
}
} else {
Message.error(data)
}
}
const httpServer = (opts, data, file, timeout) => {
//如果是不需要登录就可以访问的接口 需要设置opts.open
let Public = {} //公共参数
let httpDefaultOpts = {
method: opts.method,
url: baseUrl + opts.url,
timeout: timeout ? timeout : 20000,
params: Object.assign(Public, data),
data: data,
headers: opts.headers || {},
};
httpDefaultOpts.headers["Access-control-Allow-Origin"] = "*";
httpDefaultOpts.headers["Access-Control-Allow-Headers"] = "content-type,x-requested-with";
let authToken = "";
if (opts.authType && opts.authType != "") {
if (opts.authType === "back") {
authToken =sessionStorage.getItem('sToken') || "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJhZG1pbiIsInVzZXJfaWQiOiIxIiwiaXNzIjoiSUFUQSIsImV4cCI6MTYxNjY2NTkzOCwiaWF0IjoxNjE2NjUxNTM4fQ._nqZq0LMwkurIBKJtfX-imXLCxQSNwJ-ueGZ8iwW-0oAW880gY7PjNEfroYYQZ91v0u5yQb73Alzvy6EIp6GGg"
} else if (opts.authType === "front") {
authToken = sessionStorage.getItem("sToken");
}
httpDefaultOpts.headers["Authorization"] = authToken
}
if (opts.method === 'get') {
delete httpDefaultOpts.data
httpDefaultOpts.params.timestamp_static = new Date().getTime();
} else {
// delete httpDefaultOpts.params
if (file) {
httpDefaultOpts.data = data;
}
}
let promise = new Promise(function (resolve, reject) {
let markIndex = setTimeout(function () {
}, 10000)
service(httpDefaultOpts).then((res) => {
clearTimeout(markIndex)
if (res.status === 200) {
if (res.data.resultCode == '1109') {
MessageBox.confirm({
message: '您的登录过期,请重新登录!',
callback: action => {
//这个时候点击确定后清除用户信息
sessionStorage.removeItem('sToken')
sessionStorage.removeItem('sUserInfo')
router.push({
path: '/',
query: {
redirect: router.history.current.fullPath
}
})
}
});
}else{
resolve(res)
}
}else{
errorState(res.status, res.data)
}
}).catch((response) => {
clearTimeout(markIndex)
if (response && response.response && response.response.status && response.response.data) {
errorState(response.response.status, response.response.data)
}
reject(response)
if (response.response.data) {
if (response.response.data.message) {
Message.error(response.response.data.message)
} else {
Message.error("操作失败!")
}
}
})
})
return promise
}
export default httpServer
\ No newline at end of file
......@@ -5,17 +5,26 @@ import './assets/style/public.scss'
import echarts from "echarts"
import qs from 'qs'
import http from '@/config/request'
import sRequest from '@/config/sRequest'
import {baseUrl,backToken,frontToken} from './config/env'
import Vant from 'vant';
import 'vant/lib/index.css';
import { Form,FormItem,Input,Button,Message } from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
// 自定义tabbar
import Mytabbar from '@/components/tabbar/index.vue'
Vue.component('my-tabbar',Mytabbar)
Vue.use(Vant);
Vue.component(Form.name, Form);
Vue.component(FormItem.name, FormItem);
Vue.component(Input.name, Input);
Vue.component(Button.name, Button);
Vue.component(Message.name, Message);
Vue.prototype.$echarts = echarts
Vue.prototype.$qs = qs
Vue.prototype.$https = http
Vue.prototype.$shttp = sRequest
Vue.prototype.$baseUrl=baseUrl
Vue.prototype.backToken=backToken
......
......@@ -6,6 +6,14 @@ const routes = [
path: '/',
redirect:'/login'
},
{
path: '/slogin',
name: 'slogin',
meta: {
title: '大屏登录',
},
component: () => import('@/views/slogin')
},
{
path: '/screen',
name: 'screen',
......@@ -80,15 +88,26 @@ const router = new VueRouter({
mode: "history",
base: process.env.BASE_URL
})
const whiteList =['/login','/success','/screen']
const whiteList =['/login','/success']
router.beforeEach((to, from, next) => {
let user = sessionStorage.getItem("token");
if (!user && !whiteList.includes(to.path)) { // 通过vuex state获取当前的token是否存在
next({
path: '/login',
})
}else {
next();
if(to.name == 'screen' || to.name == 'slogin' ){
let isSlogin = sessionStorage.getItem('sToken')
if(!isSlogin && to.name == 'screen'){
next({
path: '/slogin',
})
}else{
next();
}
}else{
if (!user && !whiteList.includes(to.path)) { // 通过vuex state获取当前的token是否存在
next({
path: '/login',
})
}else {
next();
}
}
})
......
......@@ -16,14 +16,14 @@
</div>
<div class="middel-part">
<!--地区展板播放统计-->
<areas class="table-list"></areas>
<areas class="table-list" :data="areaList"></areas>
<!--中间地图-->
<div class="map-container">
<borderNums></borderNums>
<mapDiv></mapDiv>
<borderNums :areaCode="areaCode"></borderNums>
<mapDiv @changeAreaCode="changeAreaCode"></mapDiv>
</div>
<!--全国点播板块-->
<top10 class="table-list"></top10>
<top10 class="table-list" :data="top10List"></top10>
</div>
<div class="echartspanel">
<demand
......@@ -68,6 +68,9 @@ export default {
trendEcharts: {},
interactList: [],
interactEcharts: {},
areaList: [],
top10List: [],
areaCode:10000
};
},
components: {
......@@ -84,9 +87,15 @@ export default {
clientWidth = clientWidth > 1920 ? 1920 : clientWidth;
let fontSize = (clientWidth / 1920) * 100;
document.getElementsByTagName("html")[0].style.fontSize = fontSize + "px";
this.getList();
this.getDataOfEcharts(100000);
this.getDataOfList(100000);
},
methods: {
changeAreaCode(areaCode) {
this.areaCode = areaCode
this.getDataOfList(areaCode);
this.getDataOfEcharts(areaCode)
},
// 接收柱状图传来的数据
itemClick(params) {
let type = "";
......@@ -111,25 +120,63 @@ export default {
goManager() {
location.href = "http://121.4.56.121:84";
},
getList() {
getDataOfList(areaCode) {
let requestparams = {};
requestparams._index = 1;
requestparams._size = 10;
requestparams.areaCode = Number(areaCode);
this.getTableList("area", requestparams);
this.getTableList("top10", requestparams);
},
getDataOfEcharts(areaCode) {
let curTime = getCurDate();
let frequencyDate = curTime.year + curTime.month;
this.getPageList("interact", frequencyDate);
this.getPageList("trend", frequencyDate);
this.getPageList("interact", frequencyDate,areaCode); // 互动
this.getPageList("trend", frequencyDate,areaCode); //趋势
},
getTableList(type, requestparams) {
let httpUrl = "";
let _this = this;
if (type === "top10") {
httpUrl = `tBoardStatistic/getBoardRankPageList`;
}
if (type === "area") {
httpUrl = `tBoardStatistic/getBoardDistrictPageList`;
}
_this
.$shttp ({
method: "post",
url: httpUrl,
},
requestparams
)
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
_this[`${type}List`] = res.data.data.records;
} else {
_this[`${type}List`] = [];
}
} else {
_this[`${type}List`] = [];
}
})
.catch((err) => {
_this[`${type}List`] = [];
_this.$message.error(err.message);
});
},
getPageList(type, frequencyDate) {
getPageList(type, frequencyDate,areaCode) {
let httpUrl = "";
let _this = this;
if (type === "interact") {
// httpUrl = "tBoardStatistic/getInteractionFrequencyPageList?frequencyDate=";
httpUrl = `tBoardStatistic/getInteractionFrequencyPageList?frequencyDate=${frequencyDate}`
httpUrl = `tBoardStatistic/getInteractionFrequencyPageList?frequencyDate=${frequencyDate}&areaCode=${areaCode}`;
}
if (type === "trend") {
// httpUrl = "tBoardStatistic/getBoardTrendPageList?playDate=";
httpUrl = `tBoardStatistic/getBoardTrendPageList?playDate=${frequencyDate}`
httpUrl = `tBoardStatistic/getBoardTrendPageList?playDate=${frequencyDate}&areaCode=${areaCode}`;
}
_this
.$https({
.$shttp ({
method: "post",
url: `${httpUrl}`,
})
......@@ -305,7 +352,7 @@ export default {
overflow-y: hidden;
.body-item {
height: 0.4rem;
background-color:rgba(98,186,255,.2);
background-color: rgba(98, 186, 255, 0.2);
margin-bottom: 0.04rem;
color: #4efffd;
}
......
<template>
<div id="backlogin">
<div class="content">
<div class="page-content">
<div class="page-title">
<p>中国国家博物馆建党百年展</p>
<p>点播院线大屏</p>
</div>
<el-form id="form" :model="form" :rules="rules" ref="loginForm">
<el-form-item prop="username">
<el-input
v-model="form.username"
type="text"
placeholder="请输入用户名"
autofocus
clearable
ininput="value = value.trim()"
>
<i class="icon-username icon-prefix" slot="prefix"> </i>
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="form.password"
type="password"
placeholder="请输入密码"
autofocus
clearable
ininput="value = value.trim()"
>
<i class="icon-pwd icon-prefix" slot="prefix"> </i>
</el-input>
</el-form-item>
<el-form-item>
<el-button
class="login"
:disabled="flag"
type="submit"
@click="handleSubmit"
>
登录
</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
</template>
<script>
// import { loginOut } from "@/config/loginOut";
import util from "@/utils/index.js";
import {Message } from 'element-ui';
export default {
data() {
return {
form: {
username: "",
password: "",
},
rules: {
username: [
{ required: true, message: "请输入用户名", trigger: "blur,change" },
],
password: [
{ required: true, message: "请输入密码", trigger: "blur,change" },
],
},
flag: false,
};
},
mounted() {
// loginOut();
},
methods: {
handleSubmit() {
let _this = this;
this.$refs.loginForm.validate((valid) => {
if (valid) {
_this.flag = true;
let requestParams = {};
requestParams.username = _this.form.username;
requestParams.password = util.encrypt(_this.form.password);
let params = this.$qs.stringify(requestParams);
_this.$shttp(
{
method: "post",
url: "ajaxLogin",
},
params
)
.then((res) => {
_this.flag = false;
if (res.data.resultCode === "200") {
let data = res.data;
const isOpt = data.user.type;
if (isOpt == 1 || isOpt == 5) {
sessionStorage.setItem("sToken", data.token);
sessionStorage.setItem("sUserInfo", JSON.stringify(data.user));
_this.$router.push('/screen')
} else {
Message.error(
"您登录的账号既不是平台用户账号也不是统计用户账号,不能查看大屏"
);
}
}else {
Message.error(
res.data.message
);
}
})
.catch((error) => {
});
} else {
this.flag = false;
return false;
}
});
},
},
};
</script>
<style lang="scss" scoped>
#backlogin {
position: absolute;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
background: #9b1f23 url("~@/assets/login/login_bg.png") no-repeat center/ 100%
100%;
.content {
min-width: 350px;
width: 33.33%;
height: 100vh;
background-color: #fff;
position: absolute;
right: 13.5%;
box-shadow: 0 0 20px 8px rgba(0, 0, 0, 0.2);
&:before,
&::after {
display: inline-block;
content: "";
width: 100%;
height: auto;
z-index: 1;
}
&:before {
height: 100px;
background: url("~@/assets/login/login_top01.png") no-repeat center/ 100%
100%;
}
&:after {
height: 130px;
position: absolute;
bottom: 0;
left: 0;
background: url("~@/assets/login/login_bt01.png") no-repeat center/ 100%
100%;
}
.page-content {
position: absolute;
top: 50%;
left: 50%;
margin-top: -50%;
margin-left: -50%;
width: 100%;
z-index: 2;
}
.page-title {
width: 100%;
margin-bottom: 60px;
p {
text-align: center;
font-weight: bold;
font-size: 44px;
color: #333333;
letter-spacing: 0;
text-align: center;
line-height: 66px;
margin: 0;
padding: 0;
}
}
.icon-prefix {
display: inline-block;
width: 24px;
height: 24px;
}
.icon-username {
background: url("~@/assets/login/user.png") no-repeat center/ 100%;
}
.icon-pwd {
background: url("~@/assets/login/pwd.png") no-repeat center/ 100%;
}
/deep/.el-form {
width: 100%;
text-align: center;
.el-form-item {
margin-bottom: 60px;
}
.el-input {
width: 320px;
height: 48px;
.el-input__inner {
height: 48px;
line-height: 48px;
background-color: #f8f8f8;
border-color: #f8f8f8;
padding-left: 68px;
font-size: 18px;
}
.el-input__prefix {
left: 20px;
padding-top: 12px;
}
}
.el-form-item__error {
left: calc(50% - 160px);
}
.el-button.login {
width: 320px;
height: 48px;
background: #a4151d;
border-radius: 4px;
color: #fff;
margin-top: 20px;
span {
font-size: 18px;
font-weight: bold;
}
&:hover {
opacity: 0.8;
}
}
}
}
}
@media (min-width: 1301px) and (max-width: 1600px) {
#backlogin .content {
.page-title {
margin-bottom: 50px;
p {
font-size: 30px;
}
}
}
}
@media screen and (max-width: 1300px) {
#backlogin .content {
.page-title {
margin-bottom: 30px;
p {
font-size: 24px;
}
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment