|
|
<template>
|
|
|
<div class="mmtt111">
|
|
|
<!-- <span @click="aa1" style="font-size:36px;color:#fff;position:relative;cursor: pointer;">1111</span> -->
|
|
|
<div v-if="!isShow">
|
|
|
<a-form :selfUpdate="true" :form="formScreen" class="formDiv" @submit="handleSubmit">
|
|
|
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="口令">
|
|
|
<a-input type="password" id='inputId' v-focus="true" ref="id" v-decorator="['passowrd',{ rules: [{ required: true, message: '请输入口令' }] }]" onfocus="this.removeAttribute('readonly');" onblur="this.setAttribute('readonly',true);" :readonly="true" autocomplete="new-password" autoComplete="new-password" placeholder="请输入口令" />
|
|
|
</a-form-item>
|
|
|
<a-form-item :label-col="formTailLayout.labelCol" :wrapper-col="formTailLayout.wrapperCol">
|
|
|
<a-button type="primary" html-type="submit">
|
|
|
确定
|
|
|
</a-button>
|
|
|
</a-form-item>
|
|
|
</a-form>
|
|
|
</div>
|
|
|
<div v-else>
|
|
|
<!-- <div> -->
|
|
|
<div class="static" v-if="!imgCarouselShow">
|
|
|
<div class="s_left">
|
|
|
<h4 class="f24 cf s_title fwb">交付中心实时数据
|
|
|
<!-- <span @click="aa1">1111</span> <span @click="aa2">2222</span> -->
|
|
|
<div class="f14 pr">
|
|
|
<!-- <span>昨日18:15-当日18:15</span> -->
|
|
|
<!-- <span class="right-h5">延误 {{delayNum.delay18}} 逾期 {{delayNum.delay36}}</span> -->
|
|
|
</div>
|
|
|
</h4>
|
|
|
<div class="tth" style="margin-top:48px;position:relative;">
|
|
|
<div style="display:table-row;font-weight:500">
|
|
|
<div class="ttd tc1 fwb" style="">排名</div>
|
|
|
<div class="ttd tc2 fwb" style="">姓名</div>
|
|
|
<!-- <div class="ttd tc7" style=""></div> -->
|
|
|
<!-- @click="ani" -->
|
|
|
<div class="ttd tc3 fwb" style="">简历数</div>
|
|
|
<!-- <div class="ttd">已处理</div> -->
|
|
|
<!-- <div class="ttd">约面数</div> -->
|
|
|
<div class="ttd tc4 fwb" style=""><span @click="playAudio1">约面丨到面</span>丨<span @click="playAudio2">通过</span></div>
|
|
|
<!-- @click="playAudio1" -->
|
|
|
<!-- <div class="ttd" @click="playAudio2">通过数</div> -->
|
|
|
<div class="ttd tc5 fwb" style="" @click="playAudio3"> 入职数</div>
|
|
|
<!-- @click="aaa" -->
|
|
|
<div class="ttd tc6 fwb">转化率丨漏斗</div>
|
|
|
<!-- @click="aaa" -->
|
|
|
</div>
|
|
|
</div>
|
|
|
<a-carousel effect="scrollx" ref="welcome" autoplay :autoplaySpeed="autoSpeed" :speed="1000" :pauseOnHover="false">
|
|
|
<div v-for="(item1, index1) in array" v-bind:key="index1">
|
|
|
<div v-for="(item, index) in item1" v-bind:key="index">
|
|
|
<div class="tth" style="margin-top:48px;position:relative;margin-top: 0 !important;">
|
|
|
<div style="display:table-row;font-weight:500">
|
|
|
<div class="ttd tc1" style="">{{index1 * pageSize + index + 1}}</div>
|
|
|
<div class="ttd tc2" :class="showUserName_curr == item.userName ?'numeAni' : ''" style="">{{item.aliasName}}</div>
|
|
|
<!-- <div class="ttd tc7"></div> -->
|
|
|
<div class="ttd tc3">{{item.resumeNum}}</div>
|
|
|
<div class="ttd tc4" style="">{{item.signUps}} | {{item.arrived}} | {{item.passed}}</span></div>
|
|
|
<div class="ttd tc5" style="">{{item.entry}}</span>
|
|
|
<!-- /{{parseFloat(item.entryMonthNum).toFixed(1).replace(/(.0)$/,'')}} -->
|
|
|
</div>
|
|
|
<div class="ttd tc6">
|
|
|
{{item.transferRatio}}丨<span style="display: inline-block;">{{item.funnel}}</span></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</a-carousel>
|
|
|
<!-- </div> -->
|
|
|
<!-- <div class="f14 cf tl" style="margin-left: 146px;margin-top: 10px;">
|
|
|
（昨天 18:30 - 今天 18:30 招聘数据）
|
|
|
</div> -->
|
|
|
</div>
|
|
|
<div class="clb"></div>
|
|
|
<div class=" fullPage" v-if="ifani">
|
|
|
<div class="bgppp">
|
|
|
</div>
|
|
|
<div class="animate__animated animate__zoomInDown animate_h animate__infinite animate__zoomOutUp">
|
|
|
<!-- {{showUserName}} -->
|
|
|
墨竹/王泽流
|
|
|
<!-- 12 -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- <div class="imgPlay" @click="hideImg" v-if="imgCarouselShow">
|
|
|
<a-carousel autoplay effect="fade" :autoplaySpeed="5000" :speed="1000" :dots="false" :pauseOnHover="false">
|
|
|
<div class="tcImg" v-for="(image, index) in slideImages">
|
|
|
<div class="pr">
|
|
|
<h3 class="imgText" v-text="image.aliasName">1</h3>
|
|
|
<img :src="image.url" class="mw100" alt="" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</a-carousel>
|
|
|
</div> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { axios, doAsyncHttpRequest } from '@/utils/request';
|
|
|
import { isNotEmptyCheck, timeagoOfDateStr } from '@/utils/commonUtil';
|
|
|
import {
|
|
|
screen
|
|
|
} from "../../api/screen";
|
|
|
// import { serverAddress, numFormat3 } from '@/utils/global';
|
|
|
// import store from '@/store';
|
|
|
|
|
|
const formItemLayout = {
|
|
|
labelCol: { span: 6 },
|
|
|
wrapperCol: { span: 16 },
|
|
|
};
|
|
|
const formTailLayout = {
|
|
|
labelCol: { span: 6 },
|
|
|
wrapperCol: { span: 8, offset: 6 },
|
|
|
};
|
|
|
var timeClear;
|
|
|
var timer //定时器
|
|
|
var flag = false;
|
|
|
var timeStamp = 0;
|
|
|
|
|
|
var tempJson = { "classify": 0, "message": [] }
|
|
|
export default {
|
|
|
directives: {
|
|
|
focus: {
|
|
|
inserted: function(el, { value }) {
|
|
|
console.log(el, { value })
|
|
|
if (value) {
|
|
|
el.focus();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
|
|
|
data() {
|
|
|
return {
|
|
|
recordTodayList: [],
|
|
|
delayNum: { delay18: 0, delay36: 0 },
|
|
|
formLayout: 'horizontal',
|
|
|
formScreen: this.$form.createForm(this),
|
|
|
isShow: true,
|
|
|
formItemLayout,
|
|
|
formTailLayout,
|
|
|
passowrd: '',
|
|
|
// audioUrl1: 'http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/money.wav', //声音文件
|
|
|
// audioUrl2: 'http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/mario.wav', //声音文件
|
|
|
// audioUrl3: 'http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/huanhu.wav', //声音文件
|
|
|
//websocket参数===================start
|
|
|
// wsUri: 'ws://127.0.0.1:9004/webSocket/' + this.$route.query.id,
|
|
|
// wsUri: 'ws://127.0.0.1:9004/webSocket/',
|
|
|
isWebSocket: false, //判断是否链接成功！
|
|
|
reconnect: 0,
|
|
|
ifani: false,
|
|
|
showUserName: '',
|
|
|
showUserName_curr: '专员B',
|
|
|
nameArray: [],
|
|
|
daomianStyle: '',
|
|
|
tongguoStyle: '',
|
|
|
ruzhiStyle: '',
|
|
|
array: [],
|
|
|
isAuto: true,
|
|
|
autoSpeed: 10000,
|
|
|
pageSize: 10,
|
|
|
// pageSize: 5,
|
|
|
|
|
|
imgCarouselShow: false,
|
|
|
// [{"allotNum":1,"disposeNum":0,"entryMonthNum":15,"entryNum":0,"funnelRate7":"2.03","interviewNum":0,"interviewPassNum":0,"interviewPassPercent":"3.23","interviewedNum":1,"showScreen":0,"userId":236530,"userName":"百合/刘月霞"}
|
|
|
|
|
|
//websocket参数===================end
|
|
|
//所有店铺信息
|
|
|
storeImages: [],
|
|
|
//轮播的店铺图片
|
|
|
slideImages: [],
|
|
|
slideImgNum: 10,
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
var that = this;
|
|
|
// document.getElementById('inputId').focus();
|
|
|
// this.$refs.id.focus();
|
|
|
// document.querySelector('html').setAttribute('style', 'background-image: url(http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/screen_bg.png);background-size: 100% 100%;min-height:100vh;');
|
|
|
// // overflow:hidden;
|
|
|
// document.querySelector('body').setAttribute('style', 'background: none');
|
|
|
|
|
|
// that.initWebSocket();
|
|
|
// that.initClock();
|
|
|
|
|
|
// if (that.isShow) {
|
|
|
// setInterval(() => that.websocketHeartCheck(), 60000); //每隔1分钟刷新一次
|
|
|
// }
|
|
|
|
|
|
that.getData()
|
|
|
|
|
|
timer = setInterval(() => that.getData(), 60000*5); //每隔5分钟刷新一次
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
destroyed() {
|
|
|
// this.websock.close() //离开路由之后断开websocket连接
|
|
|
},
|
|
|
beforeDestroy() { //在组件生命周期结束的时候销毁。
|
|
|
var that = this;
|
|
|
if(timer){
|
|
|
clearInterval(timer);
|
|
|
}
|
|
|
document.querySelector('html').removeAttribute('style', '')
|
|
|
document.querySelector('body').removeAttribute('style', '')
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
async getData(){
|
|
|
var that = this;
|
|
|
try {
|
|
|
const data = await screen();
|
|
|
console.log(data);
|
|
|
if (data.status === 200) {
|
|
|
that.array = [];
|
|
|
// this.array = data.data.data.list
|
|
|
for (var i = 0; i < data.data.data.list.length; i += that.pageSize) {
|
|
|
this.array.push(data.data.data.list.slice(i, i + that.pageSize));
|
|
|
}
|
|
|
} else {
|
|
|
console.log(1);
|
|
|
}
|
|
|
} catch (error) {
|
|
|
console.log(error);
|
|
|
this.$message.warning(error.message);
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
showTargetResume(item) {
|
|
|
/*if(item.targetResume - item.monthEntryNum <= 0) {
|
|
|
return "（★）";
|
|
|
}
|
|
|
return "（" + new Number(item.targetResume - item.monthEntryNum).toFixed(1) + "）";*/
|
|
|
return "（" + item.monthEntryNum + "/" + item.targetResume + "）";
|
|
|
},
|
|
|
ani() { //点击专员
|
|
|
var that = this;
|
|
|
|
|
|
console.log(that.nameArray);
|
|
|
return new Promise((resolve, reject) => {
|
|
|
// alert(that.showUserName);
|
|
|
if (that.showUserName != '' && flag) {
|
|
|
this.ifani = true;
|
|
|
that.playAudio3();
|
|
|
setTimeout(function() {
|
|
|
that.ifani = false;
|
|
|
flag = false;
|
|
|
resolve();
|
|
|
}, 15000)
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
func() {
|
|
|
var that = this;
|
|
|
// console.log(that.nameArray);
|
|
|
// console.log("==================");
|
|
|
//1.到面 2.通过 3.入职
|
|
|
clearTimeout(timeClear);
|
|
|
|
|
|
if (this.nameArray[0].type == '1') {
|
|
|
|
|
|
that.showUserName_curr = this.nameArray[0].name
|
|
|
that.daomianStyle = this.nameArray[0].name;
|
|
|
that.playAudio1();
|
|
|
|
|
|
|
|
|
let pageInt = parseInt(this.nameArray[0].indexA / that.pageSize)
|
|
|
console.log("到面===" + pageInt);
|
|
|
setTimeout(function() {
|
|
|
that.autoSpeed = 10000;
|
|
|
that.$refs.welcome.goTo(pageInt, true);
|
|
|
}, 0);
|
|
|
|
|
|
|
|
|
setTimeout(function() {
|
|
|
that.showUserName_curr = '';
|
|
|
that.daomianStyle = '';
|
|
|
// console.log(JSON.stringify(that.nameArray));
|
|
|
that.nameArray.shift();
|
|
|
if (that.nameArray.length > 0) {
|
|
|
that.func();
|
|
|
|
|
|
that.imgCarouselShow = false;
|
|
|
|
|
|
} else {
|
|
|
|
|
|
// that.imgCarouselShow = false;
|
|
|
// that.showPictures(90000);
|
|
|
|
|
|
that.autoSpeed = 10000;
|
|
|
}
|
|
|
}, 10000)
|
|
|
|
|
|
} else if (this.nameArray[0].type == '2') {
|
|
|
that.showUserName_curr = this.nameArray[0].name
|
|
|
that.tongguoStyle = this.nameArray[0].name;
|
|
|
that.playAudio2();
|
|
|
|
|
|
|
|
|
let pageInt = parseInt(this.nameArray[0].indexA / that.pageSize)
|
|
|
console.log("通过===" + pageInt);
|
|
|
console.log("序列===" + this.nameArray[0].indexA);
|
|
|
console.log("↑↑↑↑↑↑↑");
|
|
|
|
|
|
// that.$refs.welcome.goTo(pageInt, true)
|
|
|
setTimeout(function() {
|
|
|
that.autoSpeed = 10000;
|
|
|
that.$refs.welcome.goTo(pageInt, true)
|
|
|
|
|
|
}, 0);
|
|
|
|
|
|
|
|
|
setTimeout(function() {
|
|
|
that.showUserName_curr = '';
|
|
|
that.tongguoStyle = '';
|
|
|
// console.log(JSON.stringify(that.nameArray));
|
|
|
that.nameArray.shift();
|
|
|
if (that.nameArray.length > 0) {
|
|
|
that.func();
|
|
|
that.imgCarouselShow = false;
|
|
|
} else {
|
|
|
// debugger;
|
|
|
// that.showPictures(90000);
|
|
|
that.autoSpeed = 10000;
|
|
|
}
|
|
|
}, 10000)
|
|
|
} else if (this.nameArray[0].type == '3') {
|
|
|
that.showUserName = this.nameArray[0].name;
|
|
|
that.showUserName_curr = this.nameArray[0].name
|
|
|
that.ruzhiStyle = this.nameArray[0].name;
|
|
|
|
|
|
// if (that.showUserName != '') {
|
|
|
// that.playAudio3();
|
|
|
// that.ani();
|
|
|
|
|
|
let pageInt = parseInt(this.nameArray[0].indexA / that.pageSize)
|
|
|
console.log("入职===" + pageInt);
|
|
|
// that.$refs.welcome.goTo(pageInt, true)
|
|
|
setTimeout(function() {
|
|
|
that.autoSpeed = 30000;
|
|
|
that.$refs.welcome.goTo(pageInt, true)
|
|
|
}, 0);
|
|
|
flag = true;
|
|
|
// }
|
|
|
console.log("00=====================")
|
|
|
that.ani().then(() => {
|
|
|
setTimeout(function() {
|
|
|
flag = false;
|
|
|
console.log("11111=====================")
|
|
|
that.nameArray.shift();
|
|
|
that.showUserName_curr = '';
|
|
|
// that.showUserName = '';
|
|
|
that.ruzhiStyle = '';
|
|
|
// console.log(JSON.stringify(that.nameArray));
|
|
|
if (that.nameArray.length > 0) {
|
|
|
console.log("=====================")
|
|
|
console.log(new Date());
|
|
|
|
|
|
setTimeout(function() {
|
|
|
that.func();
|
|
|
}, 15000)
|
|
|
|
|
|
|
|
|
that.imgCarouselShow = false;
|
|
|
} else {
|
|
|
// debugger;
|
|
|
console.log("33333=====================")
|
|
|
|
|
|
// that.showPictures(90000);
|
|
|
that.autoSpeed = 10000;
|
|
|
}
|
|
|
}, 10000)
|
|
|
})
|
|
|
}
|
|
|
|
|
|
|
|
|
// }
|
|
|
},
|
|
|
aa1() {
|
|
|
var that = this;
|
|
|
console.log(tempJson)
|
|
|
|
|
|
var tempList = tempJson.message;
|
|
|
that.recordTodayList = JSON.parse(JSON.stringify(tempList));
|
|
|
|
|
|
tempJson.message[7].entryNum = tempJson.message[7].entryNum + 1;
|
|
|
tempJson.message[8].entryNum = tempJson.message[8].entryNum + 1;
|
|
|
tempJson.message[8].interviewPassNum = tempJson.message[8].interviewPassNum + 1;
|
|
|
|
|
|
console.log(that.recordTodayList);
|
|
|
console.log(tempList);
|
|
|
|
|
|
// debugger;
|
|
|
if (timeStamp == 0 || new Date().getTime() - timeStamp >= 180 ) {
|
|
|
|
|
|
console.log("ssssssssssssss");
|
|
|
timeStamp = new Date().getTime();
|
|
|
if (tempJson.classify == 0) {
|
|
|
// var tempList = JSON.parse(e.data);
|
|
|
if (that.recordTodayList != null && that.recordTodayList.length > 0) {
|
|
|
//到面
|
|
|
that.recordTodayList.forEach(item1 => {
|
|
|
tempList.forEach((item2, index) => {
|
|
|
if (item1.userId == item2.userId && item1.interviewedNum != item2.interviewedNum) {
|
|
|
this.nameArray.push({ type: '1', name: item1.userName, daomianStyle: item1.userName, indexA: index });
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
//面试通过
|
|
|
that.recordTodayList.forEach(item1 => {
|
|
|
tempList.forEach((item2, index) => {
|
|
|
if (item1.userId == item2.userId && item1.interviewPassNum != item2.interviewPassNum) {
|
|
|
this.nameArray.push({ type: '2', name: item1.userName, tongguoStyle: item1.userName, indexA: index });
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
//入职
|
|
|
that.recordTodayList.forEach(item1 => {
|
|
|
tempList.forEach((item2, index) => {
|
|
|
if (item1.userId == item2.userId && item1.entryNum != item2.entryNum) {
|
|
|
this.nameArray.push({ type: '3', name: item1.userName, ruzhiStyle: item1.userName, indexA: index });
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
|
|
|
console.log(this.nameArray);
|
|
|
|
|
|
if (this.nameArray.length >= 1) {
|
|
|
this.func();
|
|
|
that.imgCarouselShow = false;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
} else if (tempJson.classify == 1) {
|
|
|
|
|
|
that.delayNum = tempJson.message;
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
websocketonmessage(e) { //数据接收
|
|
|
// const redata = JSON.parse(e.data);
|
|
|
var that = this;
|
|
|
console.log("接收消息", e.data)
|
|
|
console.log(new Date());
|
|
|
|
|
|
// 180000
|
|
|
|
|
|
if (isNotEmptyCheck(e.data) && (timeStamp == 0 || new Date().getTime() - timeStamp >= 180000 )) {
|
|
|
timeStamp = new Date().getTime();
|
|
|
var tempJson = JSON.parse(e.data);
|
|
|
|
|
|
if (tempJson.classify == 1) {
|
|
|
var tempList = tempJson.message.cols.concat(tempJson.message.pmls);
|
|
|
|
|
|
that.array = [];
|
|
|
for (var i = 0; i < tempList.length; i += that.pageSize) {
|
|
|
this.array.push(tempList.slice(i, i + that.pageSize));
|
|
|
}
|
|
|
for (var i = 0; i < this.array.length; i ++) {
|
|
|
i.disposeNum = 100
|
|
|
}
|
|
|
// console.log(that.recordTodayList);
|
|
|
// console.log(tempList);
|
|
|
// console.log(that.recordTodayList == tempList);
|
|
|
|
|
|
|
|
|
if (that.recordTodayList != null && that.recordTodayList.length > 0) {
|
|
|
//到面
|
|
|
that.recordTodayList.forEach(item1 => {
|
|
|
tempList.forEach((item2, index) => {
|
|
|
if (item1.userId == item2.userId && item1.interviewedNum != item2.interviewedNum && item2.interviewedNum > 0) {
|
|
|
// for (var i = 0; i <= Math.floor(item2.interviewedNum - item1.interviewedNum); i++) {
|
|
|
this.nameArray.push({ type: '1', name: item1.userName, daomianStyle: item1.userName, indexA: index });
|
|
|
// }
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
//面试通过
|
|
|
that.recordTodayList.forEach(item1 => {
|
|
|
tempList.forEach((item2, index) => {
|
|
|
if (item1.userId == item2.userId && item1.interviewPassNum != item2.interviewPassNum && item2.interviewPassNum > 0) {
|
|
|
// for (var i = 0; i <= Math.floor(item2.interviewPassNum - item1.interviewPassNum); i++) {
|
|
|
this.nameArray.push({ type: '2', name: item1.userName, tongguoStyle: item1.userName, indexA: index });
|
|
|
// }
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
//入职
|
|
|
that.recordTodayList.forEach(item1 => {
|
|
|
tempList.forEach((item2, index) => {
|
|
|
if (item1.userId == item2.userId && item1.entryNum != item2.entryNum && item2.entryNum > 0) {
|
|
|
this.nameArray.push({ type: '3', name: item1.userName, ruzhiStyle: item1.userName, indexA: index });
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
if (this.nameArray.length >= 1) {
|
|
|
this.func();
|
|
|
that.imgCarouselShow = false;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
that.recordTodayList = tempList;
|
|
|
|
|
|
} else if (tempJson.classify == 0) {
|
|
|
|
|
|
that.delayNum = tempJson.message;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
},
|
|
|
|
|
|
playAudio1() { //点击约面 到面
|
|
|
var that = this;
|
|
|
let audio1 = new Audio()
|
|
|
audio1.src = "http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/money.wav"
|
|
|
audio1.play();
|
|
|
this.showUserName_curr = '木槿/韩丽蕊'
|
|
|
setTimeout(function() {
|
|
|
that.showUserName_curr = '';
|
|
|
}, 5000)
|
|
|
|
|
|
},
|
|
|
playAudio2() {
|
|
|
var that = this;
|
|
|
let audio2 = new Audio()
|
|
|
audio2.src = "http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/mario.wav"
|
|
|
audio2.play();
|
|
|
this.showUserName_curr = '木槿/韩丽蕊'
|
|
|
setTimeout(function() {
|
|
|
that.showUserName_curr = '';
|
|
|
}, 5000)
|
|
|
|
|
|
|
|
|
},
|
|
|
playAudio3() {
|
|
|
var that = this;
|
|
|
let audio3 = new Audio()
|
|
|
this.ifani = true;
|
|
|
|
|
|
audio3.src = "http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/huanhu.wav"
|
|
|
audio3.play();
|
|
|
|
|
|
setTimeout(function() {
|
|
|
that.ifani = false;
|
|
|
}, 15000)
|
|
|
|
|
|
|
|
|
},
|
|
|
playClockAudio(type) {
|
|
|
let clockAudio = new Audio()
|
|
|
var _src = "http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/5416.wav";
|
|
|
if (type == 2) {
|
|
|
_src = "http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/4031076792.mp3";
|
|
|
}
|
|
|
clockAudio.src = _src;
|
|
|
clockAudio.play();
|
|
|
|
|
|
},
|
|
|
|
|
|
initClock() { //初始化闹钟，每天12：00，13：30执行
|
|
|
var that = this;
|
|
|
console.log('初始化闹钟')
|
|
|
setInterval(() => {
|
|
|
var d = new Date();
|
|
|
var hour = d.getHours();
|
|
|
var minues = d.getMinutes();
|
|
|
var seconds = d.getSeconds();
|
|
|
if (hour - 11 == 0 && minues - 59 == 0) { //12：00
|
|
|
setTimeout(function() {
|
|
|
that.playClockAudio(1);
|
|
|
}, 1000 * (60 - seconds));
|
|
|
|
|
|
}
|
|
|
if (hour - 13 == 0 && minues - 29 == 0) { //13：30
|
|
|
setTimeout(function() {
|
|
|
that.playClockAudio(2);
|
|
|
}, 1000 * (60 - seconds));
|
|
|
}
|
|
|
|
|
|
//that.playClockAudio();
|
|
|
|
|
|
|
|
|
//console.log(hour + ":" + minues);
|
|
|
}, 60000); //每隔1分钟刷新一次
|
|
|
},
|
|
|
initWebSocket() { //初始化weosocket
|
|
|
var wsUri = serverAddress + '/websocket/statisticsServer/' + this.reconnect;
|
|
|
wsUri = wsUri.replace("https", "ws").replace("http", "ws");
|
|
|
this.websock = new WebSocket(wsUri);
|
|
|
this.websock.onmessage = this.websocketonmessage;
|
|
|
this.websock.onopen = this.websocketonopen;
|
|
|
this.websock.onerror = this.websocketonerror;
|
|
|
},
|
|
|
websocketonopen() { //连接建立之后执行send方法发送数据
|
|
|
this.isWebSocket = true;
|
|
|
this.reconnect = 0;
|
|
|
console.log("链接成功！", this.isWebSocket)
|
|
|
// this.websocketsend(JSON.stringify(actions));
|
|
|
},
|
|
|
websocketonerror() { //连接建立失败重连
|
|
|
console.log("连接建立失败");
|
|
|
|
|
|
var that = this;
|
|
|
that.reconnect = 1;
|
|
|
|
|
|
setTimeout(function() {
|
|
|
that.initWebSocket();
|
|
|
}, 2000);
|
|
|
|
|
|
// this.$message.info("重新建立链接中");
|
|
|
// this.initWebSocket();
|
|
|
},
|
|
|
|
|
|
websocketsend(data) { //数据发送
|
|
|
let actions = {
|
|
|
"msg": data
|
|
|
};
|
|
|
console.log("您正在发送消息", actions);
|
|
|
if (this.isWebSocket) {
|
|
|
this.websock.send(JSON.stringify(actions));
|
|
|
} else {
|
|
|
console.log("请先建立链接");
|
|
|
// this.$message.error("请先建立链接")
|
|
|
}
|
|
|
|
|
|
},
|
|
|
websocketclose(e) { //关闭
|
|
|
console.log('断开连接', e);
|
|
|
this.isWebSocket = false;
|
|
|
this.websock.close();
|
|
|
this.initWebSocket();
|
|
|
},
|
|
|
websocketHeartCheck() {
|
|
|
console.log("readyState===", this.websock.readyState);
|
|
|
|
|
|
if (this.websock.readyState == 2 || this.websock.readyState == 3) {
|
|
|
this.reconnect = 1;
|
|
|
this.initWebSocket();
|
|
|
} else {
|
|
|
console.log('连接中...');
|
|
|
}
|
|
|
this.websocketsend("保持联系");
|
|
|
},
|
|
|
handleSubmit(e) {
|
|
|
var that = this;
|
|
|
e.preventDefault();
|
|
|
this.formScreen.validateFields((err, values) => {
|
|
|
if (!err) {
|
|
|
console.log('Received values of form: ', values);
|
|
|
that.passowrd = values.passowrd;
|
|
|
that.checkPagePassowrd();
|
|
|
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
checkPagePassowrd() {
|
|
|
var that = this;
|
|
|
axios({
|
|
|
url: '/admin/v3/user/allotOrder/checkPagePassowrd',
|
|
|
method: 'post',
|
|
|
data: {
|
|
|
passowrd: that.passowrd
|
|
|
},
|
|
|
}).then(response => {
|
|
|
console.log(response);
|
|
|
if (response.status == 200) {
|
|
|
|
|
|
|
|
|
// 测试的时候需要注释
|
|
|
|
|
|
that.initWebSocket();
|
|
|
that.initClock();
|
|
|
|
|
|
if (that.isShow) {
|
|
|
setInterval(() => that.websocketHeartCheck(), 60000); //每隔1分钟刷新一次
|
|
|
}
|
|
|
// 测试的时候需要注释
|
|
|
that.isShow = false;
|
|
|
} else {
|
|
|
that.isShow = true;
|
|
|
that.$message.error(response.msg);
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
timeagoOfDateStr(_time) {
|
|
|
|
|
|
return timeagoOfDateStr(_time);
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
}
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
@import 'http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/ant.css';
|
|
|
@import 'http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/animate.min.css';
|
|
|
@import 'http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/bigScreen1.css';
|
|
|
div{
|
|
|
color: #fff;
|
|
|
}
|
|
|
.mmtt111{
|
|
|
background-image: url('http://matripeweb.oss-cn-hangzhou.aliyuncs.com/antd/screen_bg.png');background-size: 100% 100%;
|
|
|
background-repeat: no-repeat;
|
|
|
min-height:100vh;
|
|
|
}
|
|
|
.imgPlay .ant-carousel .slick-slide img {
|
|
|
display: inline-block;
|
|
|
}
|
|
|
|
|
|
|
|
|
.imgPlay .slick-list {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
|
|
|
|
|
|
.imgPlay .ant-carousel {
|
|
|
|
|
|
background-color: rgba(0, 0, 0, 1);
|
|
|
}
|
|
|
|
|
|
|
|
|
.imgPlay .tcImg {
|
|
|
position: relative;
|
|
|
width: 100vw;
|
|
|
height: 100vh;
|
|
|
display: flex !important;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
}
|
|
|
|
|
|
|
|
|
.imgPlay .mw100 {
|
|
|
max-width: 100%;
|
|
|
max-height: 100vh;
|
|
|
}
|
|
|
|
|
|
|
|
|
.imgPlay .imgText {
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
text-align: left;
|
|
|
font-size: 36px;
|
|
|
margin-left: 24px;
|
|
|
color: #FFF;
|
|
|
}
|
|
|
|
|
|
.imgPlay .slick-track {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.ant-carousel>>>.slick-slide {
|
|
|
/*text-align: center;*/
|
|
|
/*height: 560px;
|
|
|
line-height: 160px;
|
|
|
background: #364d79;*/
|
|
|
color: #fff;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.ant-carousel>>>.slick-slide h3 {
|
|
|
color: #fff
|
|
|
}
|
|
|
|
|
|
.tth {
|
|
|
width: 100%;
|
|
|
}
|
|
|
|
|
|
.tc1, .tc7 {
|
|
|
width: 4%;
|
|
|
min-width: 70px;
|
|
|
}
|
|
|
|
|
|
.tc2 {
|
|
|
width: 25%;
|
|
|
padding-left: 60px;
|
|
|
text-align: left;
|
|
|
}
|
|
|
|
|
|
.tc3 {
|
|
|
width: 10%;
|
|
|
}
|
|
|
|
|
|
.tc4 {
|
|
|
width: 25%;
|
|
|
}
|
|
|
|
|
|
.tc5 {
|
|
|
width: 14%;
|
|
|
}
|
|
|
|
|
|
@media screen and (max-width: 1400px) {
|
|
|
.s_left {
|
|
|
width: 96%;
|
|
|
}
|
|
|
|
|
|
.tc1 {
|
|
|
min-width: 50px;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
</style>
|
|
|
<style>
|
|
|
::-webkit-scrollbar {
|
|
|
display: none;
|
|
|
}
|
|
|
</style> |