|
@@ -7,20 +7,23 @@
|
|
|
<div class="blockDiv blockBg1">
|
|
|
<p>在线设备</p>
|
|
|
<h1>
|
|
|
- <countTo :duration="3000" :end-val="15" :start-val="0"/>
|
|
|
+ <countTo :duration="3000" :end-val="indexCount.deviceCount.onlineCount" :start-val="0"/>
|
|
|
<span class="danweiSpan">{{$t("common.individual")}}</span>
|
|
|
- </h1>
|
|
|
+ </h1>
|
|
|
<h2 class="num">
|
|
|
- <span><countTo :duration="3000" :end-val="25" :start-val="0"/></span>
|
|
|
- <span><countTo :duration="3000" :end-val="2" :start-val="0"/></span>
|
|
|
- <span><countTo :duration="3000" :end-val="3" :start-val="0"/></span>
|
|
|
- <span><countTo :duration="3000" :end-val="3" :start-val="0"/></span>
|
|
|
+ <span><countTo :duration="3000" :end-val="indexCount.deviceCount.totalCount" :start-val="0"/></span>
|
|
|
+ <span><countTo :duration="3000" :end-val="indexCount.deviceCount.offlineCount" :start-val="0"/></span>
|
|
|
+ <span><countTo :duration="3000" :end-val="indexCount.deviceCount.exceptCount" :start-val="0"/></span>
|
|
|
+
|
|
|
</h2>
|
|
|
<h3 class="col">
|
|
|
<span>总设备</span>
|
|
|
+ <span>离线设备</span>
|
|
|
<span>故障设备</span>
|
|
|
+ <!--
|
|
|
<span>人工下线</span>
|
|
|
<span>待补货</span>
|
|
|
+ -->
|
|
|
</h3>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -28,16 +31,14 @@
|
|
|
<el-col :xs="24" :sm="12" :lg="8">
|
|
|
<div class="blockDiv blockBg3">
|
|
|
<p>今日销售额</p>
|
|
|
- <h1>¥<countTo :duration="3000" :end-val="1534" :start-val="0"/><span class="danweiSpan">元</span></h1>
|
|
|
- <h2>
|
|
|
- <span style="width:30%;">¥<countTo :duration="3000" :end-val="2568" :start-val="0"/></span>
|
|
|
- <span style="width:30%;">¥<countTo :duration="3000" :end-val="13246" :start-val="0"/></span>
|
|
|
- <span style="width:30%;">¥<countTo :duration="3000" :end-val="53261" :start-val="0"/></span>
|
|
|
+ <h1>¥<countTo :duration="3000" :end-val="indexCount.amountCount.todayAmount" :start-val="0"/><span class="danweiSpan">元</span></h1>
|
|
|
+ <h2>
|
|
|
+ <span style="width:30%;">¥<countTo :duration="3000" :end-val="indexCount.amountCount.yesterdayAmount" :start-val="0"/></span>
|
|
|
+ <span style="width:30%;">¥<countTo :duration="3000" :end-val="indexCount.amountCount.sevenAmount" :start-val="0"/></span>
|
|
|
</h2>
|
|
|
<h3 class="col">
|
|
|
<span>昨日收入</span>
|
|
|
- <span>本周收入</span>
|
|
|
- <span>本月收入</span>
|
|
|
+ <span>近七天收入</span>
|
|
|
</h3>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -45,17 +46,15 @@
|
|
|
<el-col :xs="24" :sm="12" :lg="8">
|
|
|
<div class="blockDiv blockBg4">
|
|
|
<p>今日新增会员</p>
|
|
|
- <h1><countTo :duration="3000" :end-val="8" :start-val="0"/><span class="danweiSpan">{{$t("common.individual")}}</span></h1>
|
|
|
+ <h1><countTo :duration="3000" :end-val="indexCount.memberCount.todayCount" :start-val="0"/><span class="danweiSpan">{{$t("common.individual")}}</span></h1>
|
|
|
<h2>
|
|
|
- <span style="margin:0 12px;"><countTo :duration="3000" :end-val="6" :start-val="0"/></span>
|
|
|
- <span style="margin:0 12px;"><countTo :duration="3000" :end-val="500" :start-val="0"/></span>
|
|
|
- <span style="margin:0 12px;"><countTo :duration="3000" :end-val="900" :start-val="0"/></span>
|
|
|
- <span style="margin:0 12px;"><countTo :duration="3000" :end-val="89098" :start-val="0"/></span>
|
|
|
+ <span style="margin:0 12px;"><countTo :duration="3000" :end-val="indexCount.memberCount.yesterdayCount" :start-val="0"/></span>
|
|
|
+ <span style="margin:0 12px;"><countTo :duration="3000" :end-val="indexCount.memberCount.sevenCount" :start-val="0"/></span>
|
|
|
+ <span style="margin:0 12px;"><countTo :duration="3000" :end-val="indexCount.memberCount.totalCount" :start-val="0"/></span>
|
|
|
</h2>
|
|
|
<h3>
|
|
|
<span>昨日新增</span>
|
|
|
- <span>本周新增</span>
|
|
|
- <span>本月新增</span>
|
|
|
+ <span>本周新增</span>
|
|
|
<span>全部会员</span>
|
|
|
</h3>
|
|
|
</div>
|
|
@@ -161,7 +160,7 @@
|
|
|
<a :class="btnActive == '2' ? 'tongjiA activeA' : 'tongjiA'" @click="searchDate('2')">{{ $t("index.dates.week" )}}</a>
|
|
|
<a :class="btnActive == '3' ? 'tongjiA activeA' : 'tongjiA'" @click="searchDate('3')">{{ $t("index.dates.month" )}}</a>
|
|
|
<a :class="btnActive == '4' ? 'tongjiA activeA' : 'tongjiA'" @click="searchDate('4')">{{ $t("index.dates.year" )}}</a>
|
|
|
- <span style="margin-left: 40px;">
|
|
|
+ <span style="margin-left: 40px;" v-if="btnActive == '3'">
|
|
|
<el-date-picker
|
|
|
type="daterange"
|
|
|
v-model="timeRange"
|
|
@@ -171,7 +170,7 @@
|
|
|
:range-separator='$t("common.separator")'
|
|
|
:start-placeholder='$t("common.startTime")'
|
|
|
:end-placeholder='$t("common.endTime")'
|
|
|
- :style="btnActive == '5' ? 'width: 250px;border: 1px solid #1890ff;' : 'width: 250px;'"
|
|
|
+ style="width:250px;border: 1px solid #1890ff;"
|
|
|
@change="changeDate"
|
|
|
/>
|
|
|
</span>
|
|
@@ -189,7 +188,7 @@
|
|
|
<el-col :xs="24" :sm="10" :lg="8">
|
|
|
<div class="chart-wrapper">
|
|
|
<!-- 生产资源保养计划倒计时 -->
|
|
|
- <h3>今日销售排行榜</h3>
|
|
|
+ <h3>销售排行榜</h3>
|
|
|
<table border="0" cellspacing="0" cellpadding="9" style="width: 100%;table-layout: fixed;">
|
|
|
<tr v-for="(item, index) in indexTable" :key="index">
|
|
|
<td>
|
|
@@ -197,7 +196,7 @@
|
|
|
<span v-else class="indexSpan">{{index+1}}</span>
|
|
|
</td>
|
|
|
<td width="60%"><div class="indexTd" :title="item.name">{{item.name}}</div></td>
|
|
|
- <td width="30%"><countTo :duration="4000" :end-val="item.cnt" :start-val="0"/></td>
|
|
|
+ <td width="30%"><countTo :duration="4000" :end-val="parseInt(item.cnt)" :start-val="0"/></td>
|
|
|
</tr>
|
|
|
</table>
|
|
|
</div>
|
|
@@ -224,6 +223,9 @@
|
|
|
// 加载【共通】函数
|
|
|
import { initQueryParams } from '@/utils/commons'
|
|
|
import productionResourceApi from "@/api/Productionresource.js"
|
|
|
+ import orderApi from "@/api/Order.js"
|
|
|
+ import goodsApi from "@/api/goods/Goods.js"
|
|
|
+ import memberApi from "@/api/Member.js"
|
|
|
import {regionData, CodeToText } from 'element-china-area-data'
|
|
|
|
|
|
export default {
|
|
@@ -237,6 +239,25 @@
|
|
|
// 地图中心点
|
|
|
mapCenter: { lng: 121.472644, lat: 31.231706 },
|
|
|
BAddress: '',
|
|
|
+ indexCount:{
|
|
|
+ deviceCount:{
|
|
|
+ allCount: 0,
|
|
|
+ onlineCount: 0,
|
|
|
+ offlineCount: 0,
|
|
|
+ exceptCount: 0,
|
|
|
+ },
|
|
|
+ amountCount: {
|
|
|
+ yesterdayAmount: 0.00,
|
|
|
+ todayAmount: 0.00,
|
|
|
+ sevenAmount: 0.00,
|
|
|
+ },
|
|
|
+ memberCount: {
|
|
|
+ todayCount: 0,
|
|
|
+ sevenCount: 0,
|
|
|
+ totalCount: 0,
|
|
|
+ yesterdayCount: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
areaIds:{
|
|
|
plc_pid:[],
|
|
|
plc_cid:[],
|
|
@@ -247,10 +268,11 @@
|
|
|
plc_pid:"",
|
|
|
plc_cid:"",
|
|
|
plc_aid:"",
|
|
|
- btnActive: "4",
|
|
|
+ btnActive: "1",
|
|
|
timeRange: null,
|
|
|
+ initHour:['00:00', '01:00', '02:00', '03:00', '04:00', '05:00', '06:00', '07:00', '08:00', '09:00', '10:00', '11:00', '12:00','13:00','14:00','15:00','16:00','17:00','18:00','19:00','20:00','21:00','22:00','23:00'],
|
|
|
topTongjiData: {orderNum: 0, planNum: 0, taskNum: 0, onlineNum: 0, allNum: 0},
|
|
|
- indexTable: [{name:"燕麦奶茶",cnt:50},{name:"牛奶奶茶",cnt:40},{name:"咖啡奶茶",cnt:36},{name:"卡布奇诺",cnt:32},{name:"猫屎咖啡",cnt:18},{name:"果汁奶",cnt:12},{name:"蛋奶",cnt:8}],
|
|
|
+ indexTable: [],
|
|
|
loading: false,
|
|
|
mapImg: 'map.png',
|
|
|
locImg: 'location.png',
|
|
@@ -278,34 +300,85 @@
|
|
|
// 企业用户新增数量统计-数据
|
|
|
barData: [{
|
|
|
name: '销售金额',
|
|
|
- xData: ['00:00', '1:00', '2:00', '3:00', '4:00', '5:00', '6:00', '7:00', '8:00', '9:00', '10:00', '11:00'],
|
|
|
- yData: [79, 152, 200, 334, 390, 330, 220, 145, 67, 432, 123, 100]
|
|
|
+ xData: this.initHour,
|
|
|
+ //yData: [79, 152, 200, 334, 390, 330, 220, 145, 67, 432, 123, 100]
|
|
|
+ yData: []
|
|
|
},{
|
|
|
name: '销售销量',
|
|
|
- xData: ['00:00', '1:00', '2:00', '3:00', '4:00', '5:00', '6:00', '7:00', '8:00', '9:00', '10:00', '11:00'],
|
|
|
- yData: [68, 146, 215, 308, 350, 320, 240, 148, 88, 401, 136, 90]
|
|
|
+ xData: this.initHour,
|
|
|
+ //yData: [68, 146, 215, 308, 350, 320, 240, 148, 88, 401, 136, 90]
|
|
|
+ yData: []
|
|
|
}]
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
- // 查询数据
|
|
|
- this.searchBarData("4")
|
|
|
+ // 查询数据
|
|
|
+ this.searchBarData("1")
|
|
|
// 查询企业、产线、生产资源统计
|
|
|
- this.searchBlock()
|
|
|
+ //this.searchBlock()
|
|
|
// 查询企业生产资源数量排名 首页404
|
|
|
// this.searchResourceNum()
|
|
|
// 查询[登录监控]数据
|
|
|
- this.getLoginData()
|
|
|
+ //this.getLoginData()
|
|
|
// 查询【企产线运行时间统计】
|
|
|
// this.getTaskCountStatistics()
|
|
|
// 查询设备地址
|
|
|
this.getResourceData()
|
|
|
+ this.getDeviceCount()
|
|
|
+ this.getAmountSum()
|
|
|
+ this.getMemberSum()
|
|
|
+ this.getIndexTable()
|
|
|
+
|
|
|
},
|
|
|
computed: {
|
|
|
},
|
|
|
mounted(){
|
|
|
},
|
|
|
methods: {
|
|
|
+ getIndexTable(){
|
|
|
+ goodsApi.indexTable({}).then(response => {
|
|
|
+ const res = response.data;
|
|
|
+ let that = this
|
|
|
+ if (res.isSuccess) {
|
|
|
+ that.indexTable = res.data
|
|
|
+ }
|
|
|
+ }).finally(() => this.loading = false);
|
|
|
+ },
|
|
|
+ getMemberSum(){
|
|
|
+ memberApi.getStatisticMap({}).then(response => {
|
|
|
+ const res = response.data;
|
|
|
+ let that = this
|
|
|
+ if (res.isSuccess) {
|
|
|
+ that.indexCount.memberCount.totalCount = parseInt(res.data.totalNum)
|
|
|
+ that.indexCount.memberCount.sevenCount = parseInt(res.data.sevenNum)
|
|
|
+ that.indexCount.memberCount.todayCount = parseInt(res.data.todayNum)
|
|
|
+ that.indexCount.memberCount.yesterdayCount = parseInt(res.data.yesterdayNum)
|
|
|
+ }
|
|
|
+ }).finally(() => this.loading = false);
|
|
|
+ },
|
|
|
+ getAmountSum(){
|
|
|
+ orderApi.getStatisticMap({}).then(response => {
|
|
|
+ const res = response.data;
|
|
|
+ let that = this
|
|
|
+ if (res.isSuccess) {
|
|
|
+ that.indexCount.amountCount.sevenAmount = parseFloat(res.data.sevenAmount)
|
|
|
+ that.indexCount.amountCount.todayAmount = parseFloat(res.data.todayAmount)
|
|
|
+ that.indexCount.amountCount.yesterdayAmount = parseFloat(res.data.yesterdayAmount)
|
|
|
+ }
|
|
|
+ }).finally(() => this.loading = false);
|
|
|
+ },
|
|
|
+ getDeviceCount(){
|
|
|
+ productionResourceApi.equStatistics({}).then(response => {
|
|
|
+ const res = response.data;
|
|
|
+ let that = this
|
|
|
+ if (res.isSuccess) {
|
|
|
+ that.indexCount.deviceCount.onLineCount = res.data.onLineCount
|
|
|
+ that.indexCount.deviceCount.offlineCount = res.data.offlineCount
|
|
|
+ that.indexCount.deviceCount.exceptCount = res.data.exceptCount
|
|
|
+ that.indexCount.deviceCount.totalCount = res.data.onLineCount + res.data.offlineCount +res.data.exceptCount
|
|
|
+ }
|
|
|
+ }).finally(() => this.loading = false);
|
|
|
+ },
|
|
|
getResourceData(){
|
|
|
this.loading = true;
|
|
|
this.queryParams.size = 100
|
|
@@ -369,7 +442,7 @@
|
|
|
// 【日期期间】值变化-事件
|
|
|
changeDate(val){
|
|
|
// 日期区间,被选中
|
|
|
- this.btnActive = "5";
|
|
|
+ this.btnActive = "3";
|
|
|
//console.log("【日期期间】值变化 == ", val)
|
|
|
let start = new Date(val[0]);
|
|
|
let end = new Date(val[1]);
|
|
@@ -384,7 +457,7 @@
|
|
|
return false;
|
|
|
}
|
|
|
// 查询数据
|
|
|
- this.searchBarData("date", val);
|
|
|
+ this.searchBarData("3");
|
|
|
},
|
|
|
|
|
|
// 【常用功能】点击-事件
|
|
@@ -399,26 +472,72 @@
|
|
|
}
|
|
|
},
|
|
|
// 查询企业新增统计数据-函数
|
|
|
- searchBarData(flag, val){
|
|
|
+ async searchBarData(flag){
|
|
|
let obj = {
|
|
|
- type: this.btnActive,
|
|
|
+ type: parseInt(flag),
|
|
|
startTime: this.timeRange ? this.timeRange[0] : undefined,
|
|
|
endTime: this.timeRange ? this.timeRange[1] : undefined
|
|
|
}
|
|
|
- //登陆首页 404 notfound
|
|
|
- // indexApi.getTaskCountStatistics(obj).then(res => {
|
|
|
- // res = res.data;
|
|
|
- // // console.log("【企产线运行时间统计】数据22122:",res)
|
|
|
- // if(res.isSuccess){
|
|
|
- // if(res.data.barData.xData && res.data.barData.xData.length < 10){
|
|
|
- // this.barData = res.data.barData;
|
|
|
- // // 防止数据太少,柱子太大,很丑。
|
|
|
- // this.barData.barWidth = "35px";
|
|
|
- // }else{
|
|
|
- // this.barData = res.data.barData;
|
|
|
- // }
|
|
|
- // }
|
|
|
- // })
|
|
|
+
|
|
|
+ let timeLen = 0;
|
|
|
+ //获取图形数据
|
|
|
+ let barArr = []
|
|
|
+ let barArr2 = []
|
|
|
+ if(flag=="1"){
|
|
|
+ this.barData[0].xData = this.initHour
|
|
|
+ this.barData[1].xData = this.barData[0].xData
|
|
|
+ timeLen = 24
|
|
|
+ }else if(flag=="4"){
|
|
|
+ this.barData[0].xData = [1,2,3,4,5,6,7,8,9,10,11,12]
|
|
|
+ this.barData[1].xData = this.barData[0].xData
|
|
|
+ timeLen = 12
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ await orderApi.orderBarData(obj).then(res => {
|
|
|
+ res = res.data;
|
|
|
+ let that = this
|
|
|
+ if(res.isSuccess){
|
|
|
+ if(res.data.length>0){
|
|
|
+ if(flag =="2" || flag=="3"){
|
|
|
+ let strDate = res.data[0].strDate
|
|
|
+ that.barData[0].xData = strDate.split(',')
|
|
|
+ that.barData[1].xData = that.barData[0].xData
|
|
|
+ timeLen = that.barData[1].xData.length
|
|
|
+ }
|
|
|
+ barArr = Array(timeLen).fill().map(()=>{
|
|
|
+ return 0.00;
|
|
|
+ });
|
|
|
+ barArr2 = Array(timeLen).fill().map(()=>{
|
|
|
+ return 0;
|
|
|
+ });
|
|
|
+ res.data.forEach(item=>{
|
|
|
+ if(flag=="1"|| flag=="4"){
|
|
|
+ barArr[item.xData]= parseFloat(item.orderAmount)
|
|
|
+ barArr2[item.xData]= parseInt(item.orderCount)
|
|
|
+ }else{
|
|
|
+ let index = that.barData[0].xData.findIndex(e=>{
|
|
|
+ return e == item.xData;
|
|
|
+ });
|
|
|
+ barArr[index]= parseFloat(item.orderAmount)
|
|
|
+ barArr2[index]= parseInt(item.orderCount)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ that.barData[0].yData = barArr
|
|
|
+ that.barData[1].yData = barArr2
|
|
|
+ }
|
|
|
+ /*
|
|
|
+ if(res.data && res.data.length < 10){
|
|
|
+ //this.barData = res.data.barData;
|
|
|
+ //this.barData.barWidth = "35px";
|
|
|
+ }else{
|
|
|
+ this.barData = res.data.barData;
|
|
|
+ } */
|
|
|
+ //this.barData = res.data.barData;
|
|
|
+
|
|
|
+ }
|
|
|
+ })
|
|
|
+ console.log(this.barData)
|
|
|
/*var arr = []
|
|
|
for (let i = 0; i < 12; i++) {
|
|
|
arr.push(Math.floor(Math.random()*6000 + 500))
|