|
|
|
|
|
$(() => {
|
|
|
|
|
|
moduleTitle()
|
|
|
|
|
|
// 公共请求地址
|
|
|
|
|
|
let url = '/broad/month'
|
|
|
|
|
|
|
|
|
|
|
|
// 轮询间隔时间
|
|
|
|
|
|
const INTERVAL = 30000
|
|
|
|
|
|
|
|
|
|
|
|
autoUpdate(url + "/selectUserSatisfaction", INTERVAL, data => {
|
|
|
|
|
|
multipleVerticalBarChartTwo({
|
|
|
|
|
|
xName: ['产品体验', "购物体验", "服务体验", "订单履行率"],
|
|
|
|
|
|
yDataOne: [data[0].productRate, data[0].shoppingRate, data[0].serviceRate, data[0].orderRate],
|
|
|
|
|
|
yDataOneName: '' + data.map(val => val.yearName)[0],
|
|
|
|
|
|
yDataTwo: [data[1].productRate, data[1].shoppingRate, data[1].serviceRate, data[1].orderRate],
|
|
|
|
|
|
yDataTwoName: '' + data.map(val => val.yearName)[1],
|
|
|
|
|
|
}, document.getElementById("satisfaction"), undefined, '%')
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
autoUpdate(url + "/selectMonthNumberQaS", INTERVAL, data => {
|
|
|
|
|
|
multipleVerticalBarChartTwo({
|
|
|
|
|
|
xName:data.map(val => `${val.monthName}月`),
|
|
|
|
|
|
yDataOne: data.map(val => val.bhNumber),
|
|
|
|
|
|
yDataOneName: '闭环数',
|
|
|
|
|
|
yDataTwo: data.map(val => val.qaNumber),
|
|
|
|
|
|
yDataTwoName: "隐患数",
|
|
|
|
|
|
}, document.getElementById("safe"), '')
|
|
|
|
|
|
})
|
|
|
|
|
|
autoUpdate(url + "/selectMonthQANumber", INTERVAL, data => {
|
|
|
|
|
|
pieChart(data.map((val,index) => {
|
|
|
|
|
|
if (index == 0 ) {
|
|
|
|
|
|
return {
|
|
|
|
|
|
name: val.name,
|
|
|
|
|
|
value: val.rate,
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
color: 'red',
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if (index == 1) {
|
|
|
|
|
|
return {
|
|
|
|
|
|
name: val.name,
|
|
|
|
|
|
value: val.rate,
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
color: 'yellow',
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
return {
|
|
|
|
|
|
name: val.name,
|
|
|
|
|
|
value: val.rate
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}), document.getElementById("abnormal"),'%');
|
|
|
|
|
|
})
|
|
|
|
|
|
autoUpdate(url + "/selectProductInStoreGroupMonth", INTERVAL, data => {
|
|
|
|
|
|
|
|
|
|
|
|
total(data.map(val => val.qty).reduce((val1, val2) => val1 + val2, 0), '#total')
|
|
|
|
|
|
verticalBarChart({
|
|
|
|
|
|
xName: data.map(val => `${val.name}月`),
|
|
|
|
|
|
yData: data.map(val => val.qty),
|
|
|
|
|
|
}, document.getElementById("outputStatistics"), '')
|
|
|
|
|
|
})
|
|
|
|
|
|
autoUpdate(url + "/selectHighlightProducts", 40000, data => {
|
|
|
|
|
|
let url = data.map(val => val.picturePath)
|
|
|
|
|
|
$('#HighlightOne').attr("src" , `http://10.100.70.5:9090/${url[0]}`)
|
|
|
|
|
|
$('#HighlightTwo').attr("src" , `http://10.100.70.5:9090/${url[1]}`)
|
|
|
|
|
|
$('#HighlightThree').attr("src" , `http://10.100.70.5:9090/${url[2]}`)
|
|
|
|
|
|
$('#HighlightFour').attr("src" , `http://10.100.70.5:9090/${url[3]}`)
|
|
|
|
|
|
let options = {
|
|
|
|
|
|
navButton:false,
|
|
|
|
|
|
sideButton:false,
|
|
|
|
|
|
effects: ['fade', 'slideX', 'slideY', 'page', 'circle', 'rollingX', 'rollingY', 'blindsX', 'blindsY'],
|
|
|
|
|
|
data: [
|
|
|
|
|
|
{
|
|
|
|
|
|
src: `http://10.100.70.5:9090/${url[0]}`,
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
src: `http://10.100.70.5:9090/${url[1]}`,
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
src: `http://10.100.70.5:9090/${url[2]}`,
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
src: `http://10.100.70.5:9090/${url[3]}`,
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
};
|
|
|
|
|
|
$('#slide').vmcSlide(options);
|
|
|
|
|
|
})
|
|
|
|
|
|
autoUpdate(url + "/selectBaseQilist", 40000, data => {
|
|
|
|
|
|
console.log(data)
|
|
|
|
|
|
lineChart(null, document.getElementById("quality"))
|
|
|
|
|
|
})
|
|
|
|
|
|
autoUpdate(url + "/selectDtNenglist", INTERVAL, data => {
|
|
|
|
|
|
let month = ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"]
|
|
|
|
|
|
let value = []
|
|
|
|
|
|
for (let i = 1; i <= 12; i++) {
|
|
|
|
|
|
if(data[0][`month${i}`]){
|
|
|
|
|
|
value.push(data[0][`month${i}`])
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
lineChart({
|
|
|
|
|
|
xName: month.splice(0,value.length),
|
|
|
|
|
|
yData: value,
|
|
|
|
|
|
yDataName: "单台能耗(元/台)"
|
|
|
|
|
|
}, document.getElementById("energyConsumption"), '')
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
const curWeek = () => {
|
|
|
|
|
|
let today = new Date();
|
|
|
|
|
|
let firstDayOfYear = new Date(today.getFullYear(), 0, 1);
|
|
|
|
|
|
let dayOfWeek = firstDayOfYear.getDay();
|
|
|
|
|
|
let spendDay = 1;
|
|
|
|
|
|
if (dayOfWeek != 0) {
|
|
|
|
|
|
spendDay = 7 - dayOfWeek + 1;
|
|
|
|
|
|
}
|
|
|
|
|
|
firstDayOfYear = new Date(today.getFullYear(), 0, spendDay);
|
|
|
|
|
|
let d = Math.ceil((today.valueOf() - firstDayOfYear.valueOf()) / 86400000);
|
|
|
|
|
|
return Math.ceil((d / 7) + 1);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const moduleTitle = () => {
|
|
|
|
|
|
const html = `
|
|
|
|
|
|
<span style="position: absolute;top: 2.9%;left: 50%;color: #fff;font-size: 1.1vw;transform: translateX(-50%);letter-spacing: 0.3vw">智能冷柜中央管控平台</span>
|
|
|
|
|
|
<span style="position: absolute;top: 14.5%;left: 2.6%;color: #CFD2D0;font-size: 1.0vw">用户满意度</span>
|
|
|
|
|
|
<span style="position: absolute;top: 14.5%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">产品升级</span>
|
|
|
|
|
|
<span style="position: absolute;top: 14.5%;left: 68%;color: #CFD2D0;font-size: 1.0vw">场景升级</span>
|
|
|
|
|
|
<span style="position: absolute;top: 14.5%;left: 92%;color: #CFD2D0;font-size: 1.0vw">品质提升</span>
|
|
|
|
|
|
<span style="position: absolute;top: 57.8%;left: 3.3%;color: #CFD2D0;font-size: 1.0vw">产量统计</span>
|
|
|
|
|
|
<span style="position: absolute;top: 57.8%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">单台能耗</span>
|
|
|
|
|
|
<span style="position: absolute;top: 57.8%;left: 68%;color: #CFD2D0;font-size: 1.0vw">质量分析</span>
|
|
|
|
|
|
<span style="position: absolute;top: 57.8%;left: 93%;color: #CFD2D0;font-size: 1.0vw">安全生产</span>
|
|
|
|
|
|
`
|
|
|
|
|
|
$('body').append(html)
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const total = (val1 = 0, el) => {
|
|
|
|
|
|
const html = `
|
|
|
|
|
|
<span style="position: absolute;top: 54.2%;left: 10.7%;color: #fff;font-size: 1vw;">${new Date().getFullYear()}年 合计:${val1} 台</span>
|
|
|
|
|
|
`
|
|
|
|
|
|
$(el).html(html)
|
|
|
|
|
|
}
|