|
|
@@ -0,0 +1,617 @@
|
|
|
+<template>
|
|
|
+ <div class="content">
|
|
|
+ <dv-full-screen-container>
|
|
|
+ <!-- 头部内容 -->
|
|
|
+ <div class="header">
|
|
|
+ <dv-decoration-8 class="left" />
|
|
|
+ <dv-decoration-5 class="center" />
|
|
|
+ <dv-decoration-8 class="right" :reverse="true" />
|
|
|
+ <div class="title">{{ titleName }}</div>
|
|
|
+ <div class="time">
|
|
|
+ <span>月份:</span>
|
|
|
+ <el-date-picker v-model="month" type="month" value-format="yyyy-MM" format="yyyy-MM" placeholder="日期选择" style="width: 120px" :readonly="false" :editable="true" :clearable="false" @change="updateAll" />
|
|
|
+ </div>
|
|
|
+ <div class="back" @click.prevent="goBack()">
|
|
|
+ <dv-border-box-8>返回</dv-border-box-8>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <dv-border-box-1>
|
|
|
+ <!-- 顶部数据 -->
|
|
|
+ <div class="topCard">
|
|
|
+ <top-bar v-if="topBarData.length" :info="topBarData" />
|
|
|
+ </div>
|
|
|
+ <div class="middleCard" >
|
|
|
+ <div style="width:100%">
|
|
|
+ <div class="middleCardLeft" >
|
|
|
+ <middleCard v-if="MiddleLeftPieViewList.data.length" :info="MiddleLeftPieViewList" ref="middleCardLeft"/>
|
|
|
+ </div>
|
|
|
+ <dv-decoration-2 :reverse="true" style="width:5px;height:350px;margin:0 15px;" />
|
|
|
+ <div class="middleCardCenter">
|
|
|
+ <middleCard v-if="eBgRateData.data.length" :info="eBgRateData" ref="middleCardCenter"/>
|
|
|
+ </div>
|
|
|
+ <dv-decoration-2 :reverse="true" style="width:5px;height:350px;margin:0 15px;" />
|
|
|
+ <div class="middleCardRight">
|
|
|
+ <CarouselTabl v-if="config.data.length" :info="config"/>
|
|
|
+ </div>
|
|
|
+ <dv-decoration-2 :reverse="true" style="width:5px;height:350px;margin:0 15px;" />
|
|
|
+ <div class="middleCardRight1">
|
|
|
+ <CarouselTabl v-if="shiyonglvConfig.data.length" :info="shiyonglvConfig"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <dv-decoration-10 />
|
|
|
+ <div class="bottomCard">
|
|
|
+ <div style="width:31%;display:flex;">
|
|
|
+ <div class="bottomCardLeft0">
|
|
|
+ <middleCard v-if="weiHuSheBeiData.data.length" :info="weiHuSheBeiData" ref="sheBeiWeiHuRef"/>
|
|
|
+ </div>
|
|
|
+ <dv-decoration-2 :reverse="true" style="width:3%;height:330px;margin: 0 10px;" />
|
|
|
+ <div style="width:37%">
|
|
|
+ <zhuzhuangtu v-if="sheBeiweiHuData.data.length" :info="sheBeiweiHuData" ref="sheBeiWeiHuDataref"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <dv-decoration-2 :reverse="true" style="width:5px;height:330px;margin: 0 10px;" />
|
|
|
+ <div style="width:31%;display:flex;">
|
|
|
+ <div class="bottomCardLeft">
|
|
|
+ <middleCard v-if="sheBeiHeChaData.data.length" :info="sheBeiHeChaData" ref="sheBeiHeChaRef"/>
|
|
|
+ </div>
|
|
|
+ <dv-decoration-2 :reverse="true" style="width:5px;height:330px;margin: 0 10px;" />
|
|
|
+ <div style="width:37%">
|
|
|
+ <zhuzhuangtu v-if="bottomData.data.length" :info="bottomData" ref="bottomCardLeft"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <dv-decoration-2 :reverse="true" style="width:5px;height:330px;margin: 0 10px;" />
|
|
|
+ <div style="width:31%;display:flex;">
|
|
|
+ <div class="bottomCardright">
|
|
|
+ <middleCard v-if="jianDingjiaoZhunSheBeiData.data.length" :info="jianDingjiaoZhunSheBeiData" ref="jiandingRef"/>
|
|
|
+ </div>
|
|
|
+ <dv-decoration-2 :reverse="true" style="width:3%;height:330px;margin: 0 10px;" />
|
|
|
+ <div style="width:40%">
|
|
|
+ <zhuzhuangtu v-if="zhuantaiEData.data.length" :info="zhuantaiEData" ref="zhuantaiEDataref"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </dv-border-box-1>
|
|
|
+ </dv-full-screen-container>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import screenfull from "screenfull";
|
|
|
+import curdPost from "@/business/platform/form/utils/custom/joinCURD.js";
|
|
|
+import { color } from 'echarts/lib/export';
|
|
|
+// import { config } from 'public/lib/UEditor/third-party/zeroclipboard/ZeroClipboard';
|
|
|
+// import { acceptList } from "./data.js";
|
|
|
+// import { number } from 'echarts/lib/export';
|
|
|
+export default {
|
|
|
+ name: "checkBoard",
|
|
|
+ components: {
|
|
|
+ topBar: () => import('./component/equipmentBoardTopcard'),
|
|
|
+ middleCard: () => import('./component/getPieView'),
|
|
|
+ zhuzhuangtu: () => import('./component/zhuzhuangtu'),
|
|
|
+ CarouselTabl: () => import('./component/CarouselTabl')
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ const d = new Date();
|
|
|
+ return {
|
|
|
+ titleName: "设备管理看板",
|
|
|
+ year: d.toJSON().slice(0, 4),
|
|
|
+ month: d.toJSON().slice(0, 7),
|
|
|
+ today: d.toJSON().slice(0, 10),
|
|
|
+ topBarData: [],
|
|
|
+ timer: null,
|
|
|
+ MiddleLeftPieViewList:{
|
|
|
+ data:[],
|
|
|
+ config:{idSelector:"main"}, //{name:,value}
|
|
|
+ color:[]
|
|
|
+ },
|
|
|
+ eBgRateData:{
|
|
|
+ data:[],
|
|
|
+ config:{}
|
|
|
+ },
|
|
|
+ sheBeiHeChaData:{
|
|
|
+ data:[],
|
|
|
+ config:{}
|
|
|
+ },
|
|
|
+ jianDingjiaoZhunSheBeiData:{
|
|
|
+ data:[],
|
|
|
+ config:{}
|
|
|
+ },
|
|
|
+ weiHuSheBeiData:{
|
|
|
+ data:[],
|
|
|
+ config:{}
|
|
|
+ },
|
|
|
+ bottomData:{xData:[],data:[],config:{idSelector:""}},
|
|
|
+ zhuantaiEData:{xData:[],data:[],config:{idSelector:""}},
|
|
|
+ sheBeiweiHuData:{xData:[],data:[],config:{idSelector:""}},
|
|
|
+ config:{ header:['设备名称','设备编号','规格型号','设备状态'],data:[]},
|
|
|
+ shiyonglvConfig:{ header:['设备名称','设备编号','设备状态','频率'],data:[]},
|
|
|
+ zichan:0,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ if (screenfull.isEnabled && !screenfull.isFullscreen) {
|
|
|
+ this.allView();
|
|
|
+ }
|
|
|
+ this.updateAll();
|
|
|
+ },
|
|
|
+ beforeDestroy() {
|
|
|
+ if (screenfull.isFullscreen) {
|
|
|
+ screenfull.toggle();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ allView() { // 默认显示全屏
|
|
|
+ screenfull.request();
|
|
|
+ },
|
|
|
+ goBack() {
|
|
|
+ this.$router.back(-1);
|
|
|
+ },
|
|
|
+ updateAll(e) {
|
|
|
+ // this.getSheBeiMony();
|
|
|
+ this.getTopBarData();
|
|
|
+ this.getMiddleLeftPieView();
|
|
|
+ this.getCarouselTable();
|
|
|
+ this.getCarouselShiYonglvTable();
|
|
|
+ // this.getbottomData();
|
|
|
+ },
|
|
|
+ async getTopBarData(){
|
|
|
+ let this_ = this;
|
|
|
+ let sql1 = `select fei_yong_ as feiyong from t_mjsbxzqrb where shi_fou_guo_shen_ ='1'`
|
|
|
+ let zichan
|
|
|
+ await curdPost("sql",sql1).then(res=>{
|
|
|
+ const data = res.variables.data
|
|
|
+ zichan = this_.getAllMonyInt(data);
|
|
|
+ })
|
|
|
+ let sql2 = `select yu_suan_ as feiyong from t_mjyqsbwxsqb where shi_fou_guo_shen_ ='1'`
|
|
|
+ let shenqinngfeiyong
|
|
|
+ await curdPost("sql",sql1).then(res=>{
|
|
|
+ const data = res.variables.data
|
|
|
+ shenqinngfeiyong = this_.getAllMonyInt(data);
|
|
|
+ })
|
|
|
+ let sql3 = `select shi_ji_zhi_chu_ as feiyong from t_mjsbwxqrb where shi_fou_guo_shen_ ='1'`
|
|
|
+ let querennfeiyong
|
|
|
+ await curdPost("sql",sql1).then(res=>{
|
|
|
+ const data = res.variables.data
|
|
|
+ querennfeiyong = this_.getAllMonyInt(data);
|
|
|
+ })
|
|
|
+ let weixiufeiyongbi = shenqinngfeiyong / querennfeiyong;
|
|
|
+ let sql =`select a.Equipments,a1.mony,b.addEquipments,c.testEquipments,c1.testNoEquipments,d.checkEquipments,
|
|
|
+ d1.checkNoEquipments,e.goodEquipments,f.scrapEquipments,g.limitedEquipments,h.weiHuNoEquipments,h1.weiHuEquipments
|
|
|
+ from
|
|
|
+ (select count(*) as Equipments from t_sbdj) as a,
|
|
|
+ (select bei_zhu_ as mony FROM t_sbdj) as a1,
|
|
|
+ (select count(*) as addEquipments from t_sbdj where gou_jin_ri_qi_ LIKE '${this_.month}') as b,
|
|
|
+ (select count(*) as testEquipments from t_mjsbxzqrb where shi_fou_guo_shen_ ='1') as c,
|
|
|
+ (select count(*) as testNoEquipments from t_mjsbjdxzjhzb) as c1,
|
|
|
+ (select count(*) as checkEquipments from t_mjyqsbwxsqb where create_time_ LIKE '${this_.month}' ) as d,
|
|
|
+ (select count(*) as checkNoEquipments from t_mjsbwxqrb where create_time_ LIKE '${this_.month}' and shi_fou_guo_shen_ ='1') as d1,
|
|
|
+ (select count(*) as goodEquipments from t_sbdj where she_bei_zhuang_ta ='正常使用') as e,
|
|
|
+ (select count(*) as scrapEquipments from t_sbdj where she_bei_zhuang_ta ='禁止使用' or she_bei_zhuang_ta ='报废/停用') as f,
|
|
|
+ (select count(*) as limitedEquipments from t_sbdj where she_bei_zhuang_ta ='限制使用') as g,
|
|
|
+ (select count(*) as weiHuNoEquipments from t_mjsbwhjhzb where create_time_ LIKE '${this_.month}') as h,
|
|
|
+ (select count(*) as weiHuEquipments from t_mjsbwhbyjlby where create_time_ LIKE '${this_.month}' and shi_fou_guo_shen_ ='1') as h1`;
|
|
|
+
|
|
|
+ await curdPost("sql",sql).then(res=>{
|
|
|
+ const data = res.variables.data
|
|
|
+ // let zichan = '待确认';
|
|
|
+ let eIntactnessRate = Number(((data[0].goodEquipments/data[0].Equipments).toFixed(3)+"").slice(2,4));
|
|
|
+ let eBadRate = 100 - parseInt(eIntactnessRate);
|
|
|
+ let obj ={};
|
|
|
+ obj.value = data[0].goodEquipments;
|
|
|
+ obj.name = "正常设备";
|
|
|
+ this_.MiddleLeftPieViewList.data.push(obj);
|
|
|
+ obj ={};
|
|
|
+ obj.value = data[0].limitedEquipments;
|
|
|
+ obj.name = "备用设备";
|
|
|
+ this_.MiddleLeftPieViewList.data.push(obj);
|
|
|
+ obj ={};
|
|
|
+ obj.value = data[0].scrapEquipments;
|
|
|
+ obj.name = "停用/报废";
|
|
|
+ this_.MiddleLeftPieViewList.data.push(obj);
|
|
|
+ this_.MiddleLeftPieViewList.color = ['#339933','#FFFF66','#FF0033'];
|
|
|
+ this_.MiddleLeftPieViewList.config.title = "设备状态工作分布";
|
|
|
+ this_.MiddleLeftPieViewList.config.idSelector = "main2";
|
|
|
+ this_.$nextTick(()=>{
|
|
|
+ setTimeout(() => {
|
|
|
+ this_.$refs.middleCardLeft.getMiddleLeft()// hhhh xxxx
|
|
|
+ }, 1000)
|
|
|
+ })
|
|
|
+ obj ={};
|
|
|
+ let result =[
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ label: '设备总数',
|
|
|
+ value: data[0].Equipments,
|
|
|
+ danwei:'台'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '本月新增设备',
|
|
|
+ value: data[0].addEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '正常设备',
|
|
|
+ value: data[0].goodEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '报废/停用设备',
|
|
|
+ value: data[0].scrapEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '受限设备',
|
|
|
+ value: data[0].limitedEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ label: '本月计划维护设备',
|
|
|
+ value: data[0].weiHuNoEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '本月已维护设备',
|
|
|
+ value: data[0].weiHuEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ label: '本月计划检定/校准设备',
|
|
|
+ value: data[0].testNoEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '本月已检定/校准设备',
|
|
|
+ value: data[0].testEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: `检定校准费用`,
|
|
|
+ value: zichan,
|
|
|
+ danwei:'元'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ label: '本月申请维修设备',
|
|
|
+ value: data[0].checkNoEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '本月完成维修设备',
|
|
|
+ value: data[0].checkEquipments,
|
|
|
+ danwei:'台'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '费用比',
|
|
|
+ value: weixiufeiyongbi||0,
|
|
|
+ danwei:'%'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ label: '设备完好率',
|
|
|
+ value: eIntactnessRate,
|
|
|
+ danwei:'%'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '设备故障率',
|
|
|
+ value: eBadRate,
|
|
|
+ danwei:'%'
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // label: '设备总值',
|
|
|
+ // value:zichan,
|
|
|
+ // danwei:'元'
|
|
|
+ // },
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ];
|
|
|
+ //
|
|
|
+ this_.bottomData.xData =["计划核查设备","已核查设备"];
|
|
|
+ this_.bottomData.data.push(data[0].checkNoEquipments);
|
|
|
+ this_.bottomData.data.push(data[0].checkEquipments);
|
|
|
+ this_.bottomData.config.title ="核查设备柱状图";
|
|
|
+ this_.bottomData.config.idSelector ="main4";
|
|
|
+ this_.zhuantaiEData.xData =["计划检定/校准设备","已完成检定/校准设备",];
|
|
|
+ this_.zhuantaiEData.data.push(data[0].testNoEquipments);
|
|
|
+ this_.zhuantaiEData.data.push(data[0].testEquipments);
|
|
|
+ this_.zhuantaiEData.config.title ="设备检定/校准设备柱状图";
|
|
|
+ this_.zhuantaiEData.config.idSelector ="main3";
|
|
|
+ //维护设备柱状图
|
|
|
+ this_.sheBeiweiHuData.xData =["计划维护设备","已完成设备",];
|
|
|
+ this_.sheBeiweiHuData.data.push(data[0].weiHuNoEquipments);
|
|
|
+ this_.sheBeiweiHuData.data.push(data[0].weiHuEquipments);
|
|
|
+ this_.sheBeiweiHuData.config.title ="设备维护柱状图";
|
|
|
+ this_.sheBeiweiHuData.config.idSelector ="mainWeiHuZ";
|
|
|
+ this_.$nextTick(()=>{
|
|
|
+ setTimeout(() => {
|
|
|
+ this_.$refs.zhuantaiEDataref.getMiddleLeft()// hhhh xxxx
|
|
|
+ this_.$refs.bottomCardLeft.getMiddleLeft()// hhhh xxxx
|
|
|
+ this_.$refs.sheBeiWeiHuDataref.getMiddleLeft();
|
|
|
+ }, 1000)
|
|
|
+ })
|
|
|
+
|
|
|
+ let objRate = {};
|
|
|
+ objRate.name ="设备完好率";
|
|
|
+ objRate.value = eIntactnessRate;
|
|
|
+ this_.eBgRateData.data.push(objRate);
|
|
|
+ objRate ={};
|
|
|
+ objRate.value = eBadRate;
|
|
|
+ objRate.name = "设备故障率";
|
|
|
+ this_.eBgRateData.data.push(objRate);
|
|
|
+ this_.eBgRateData.color = ['#339933','#FF0033'];
|
|
|
+ this_.eBgRateData.config.title = "设备完好率分布";
|
|
|
+ this_.eBgRateData.config.idSelector = "main1";
|
|
|
+ //设备维护
|
|
|
+ let objweihu ={};
|
|
|
+ objweihu.name ="计划维护设备";
|
|
|
+ objweihu.value = data[0].weiHuNoEquipments;
|
|
|
+ this_.weiHuSheBeiData.data.push(objweihu);
|
|
|
+ objweihu ={};
|
|
|
+ objweihu.value = data[0].weiHuEquipments;
|
|
|
+ objweihu.name = "已维护设备";
|
|
|
+ this_.weiHuSheBeiData.data.push(objweihu);
|
|
|
+ this_.weiHuSheBeiData.color = ['#5470c6','#38a838'];
|
|
|
+ this_.weiHuSheBeiData.config.title = "设备维护分布";
|
|
|
+ this_.weiHuSheBeiData.config.idSelector = "mainWeiHu";
|
|
|
+ //设备核查
|
|
|
+ let objHeCha ={}; //核查改维修
|
|
|
+ objHeCha.name ="维修设备申请";
|
|
|
+ objHeCha.value = data[0].checkNoEquipments;
|
|
|
+ this_.sheBeiHeChaData.data.push(objHeCha);
|
|
|
+ objHeCha ={};
|
|
|
+ objHeCha.value = data[0].checkEquipments;
|
|
|
+ objHeCha.name = "已完成维修设备";
|
|
|
+ this_.sheBeiHeChaData.data.push(objHeCha);
|
|
|
+ this_.sheBeiHeChaData.color = ['#5470c6','#38a838'];
|
|
|
+ this_.sheBeiHeChaData.config.title = "设备维修分布";
|
|
|
+ this_.sheBeiHeChaData.config.idSelector = "mainHeCha";
|
|
|
+ //设备检定校准
|
|
|
+ let objJianding ={};
|
|
|
+ objJianding.name ="计划检定/校准设备";
|
|
|
+ objJianding.value = data[0].testNoEquipments;
|
|
|
+ this_.jianDingjiaoZhunSheBeiData.data.push(objJianding);
|
|
|
+ objJianding ={};
|
|
|
+ objJianding.value = data[0].testEquipments;
|
|
|
+ objJianding.name = "已完成设备";
|
|
|
+ this_.jianDingjiaoZhunSheBeiData.data.push(objJianding);
|
|
|
+ this_.jianDingjiaoZhunSheBeiData.color = ['#5470c6','#38a838'];
|
|
|
+ this_.jianDingjiaoZhunSheBeiData.config.title = "设备检定校准分布";
|
|
|
+ this_.jianDingjiaoZhunSheBeiData.config.idSelector = "mainJianDing";
|
|
|
+ this_.$nextTick(()=>{
|
|
|
+ setTimeout(() => {
|
|
|
+ this_.$refs.middleCardCenter.getMiddleLeft();// hhhh xxxx
|
|
|
+ this_.$refs.sheBeiHeChaRef.getMiddleLeft();//
|
|
|
+ this_.$refs.jiandingRef.getMiddleLeft();
|
|
|
+ }, 1000)
|
|
|
+ })
|
|
|
+ objRate = {};
|
|
|
+ this_.topBarData = result;
|
|
|
+ }).catch(err=>{
|
|
|
+ console.log(err)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getMiddleLeftPieView(){
|
|
|
+ // [ { value: 1048, name: 'Search Engine' },]
|
|
|
+ console.log(1)
|
|
|
+ },
|
|
|
+ async getCarouselTable() {
|
|
|
+ let this_ = this;
|
|
|
+ const sql = "select * from t_sbdj where she_bei_zhuang_ta ='禁止使用' or she_bei_zhuang_ta ='报废/停用'";
|
|
|
+ let data1 = [];
|
|
|
+ await curdPost("sql", sql)
|
|
|
+ .then((res) => {
|
|
|
+ const result = res.variables.data;
|
|
|
+ result.forEach((item) => {
|
|
|
+ data1 = [];
|
|
|
+ data1.push(item.she_bei_ming_cheng_);
|
|
|
+ data1.push(item.she_bei_shi_bie_h);
|
|
|
+ data1.push(item.gui_ge_xing_hao_);
|
|
|
+ data1.push(item.she_bei_zhuang_ta);
|
|
|
+ this_.config.data.push(data1);
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async getCarouselShiYonglvTable() {
|
|
|
+ let this_ = this;
|
|
|
+ const sql = `select she_bei_ming_chen,she_bei_bian_hao_ ,she_bei_zhuang_ku,COUNT(*) AS pinlv FROM t_mjsbsy GROUP BY she_bei_bian_hao_ AND create_time_ LIKE '%${this.month}%' ORDER BY pinlv DESC`;
|
|
|
+ let data1 = [];
|
|
|
+ let res1 =[]
|
|
|
+ await curdPost("sql", sql)
|
|
|
+ .then((res) => {
|
|
|
+ const result = res.variables.data;
|
|
|
+ result.forEach((item) => {
|
|
|
+ data1 = [];
|
|
|
+ data1.push(item.she_bei_ming_chen);
|
|
|
+ data1.push(item.she_bei_bian_hao_);
|
|
|
+ data1.push(item.she_bei_zhuang_ku);
|
|
|
+ data1.push(item.pinlv);
|
|
|
+ this_.shiyonglvConfig.data.push(data1);
|
|
|
+ });
|
|
|
+ console.log(this_.shiyonglvConfig.data)
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getAllMonyInt (monyArr){
|
|
|
+ debugger
|
|
|
+ let mony = 0;
|
|
|
+ let filterMony = 0
|
|
|
+ monyArr.forEach(item=>{
|
|
|
+ filterMony = item.feiyong*1;
|
|
|
+ mony +=filterMony
|
|
|
+
|
|
|
+ })
|
|
|
+ return mony;
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.content {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #030409;
|
|
|
+ position: absolute;
|
|
|
+ color: #fff;
|
|
|
+ z-index: 999;
|
|
|
+ #dv-full-screen-container {
|
|
|
+ background-image: url("./img/bg.png");
|
|
|
+ background-size: 100% 100%;
|
|
|
+ box-shadow: 0 0 3px blue;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ }
|
|
|
+ .main-content {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ }
|
|
|
+
|
|
|
+ .block-left-right-content {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ margin-top: 0.8%;
|
|
|
+ }
|
|
|
+ .block-top-bottom-content {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 0.8%;
|
|
|
+ }
|
|
|
+ .block-top-content {
|
|
|
+ height: 55%;
|
|
|
+ display: flex;
|
|
|
+ flex-grow: 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-bottom: 0.8%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .header {
|
|
|
+ position: relative;
|
|
|
+ width: 100%;
|
|
|
+ height: 100px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-shrink: 0;
|
|
|
+ .left,
|
|
|
+ .right {
|
|
|
+ width: 25%;
|
|
|
+ height: 60px;
|
|
|
+ }
|
|
|
+ .center {
|
|
|
+ width: 40%;
|
|
|
+ height: 60px;
|
|
|
+ margin-top: 30px;
|
|
|
+ }
|
|
|
+ .title {
|
|
|
+ position: absolute;
|
|
|
+ font-size: 30px;
|
|
|
+ font-weight: bold;
|
|
|
+ left: 50%;
|
|
|
+ top: 15px;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ }
|
|
|
+ .time,
|
|
|
+ .back {
|
|
|
+ width: 8%;
|
|
|
+ cursor: pointer;
|
|
|
+ height: 2.825rem;
|
|
|
+ line-height: 2.825rem;
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 2.5%;
|
|
|
+ flex: 1;
|
|
|
+ position: absolute;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ .time {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ width: 20%;
|
|
|
+ right: 75%;
|
|
|
+ }
|
|
|
+ .back {
|
|
|
+ left: 75%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .topCard{
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .middleCard,.bottomCard{
|
|
|
+ width: 100%;
|
|
|
+ margin-left: 30px;
|
|
|
+ // margin-top: 30px;
|
|
|
+ div{
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ .middleCardLeft{
|
|
|
+ width: 19%;
|
|
|
+ }
|
|
|
+ .middleCardCenter{
|
|
|
+ width: 19%;
|
|
|
+ }
|
|
|
+ .middleCardRight{
|
|
|
+ width: 28%;
|
|
|
+ }
|
|
|
+ .middleCardRight1{
|
|
|
+ width: 25%;
|
|
|
+ }
|
|
|
+ padding: 10px;
|
|
|
+ }
|
|
|
+ .bottomCard{
|
|
|
+ display: flex;
|
|
|
+ div{
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ .bottomCardLeft0,.bottomCardLeft,.bottomCardright{
|
|
|
+ width: 70%;
|
|
|
+ }
|
|
|
+ // .bottomCardCenter0{
|
|
|
+
|
|
|
+ // }
|
|
|
+ // .bottomCardLeft{
|
|
|
+
|
|
|
+ // margin-left: 30px;
|
|
|
+ // }
|
|
|
+ // .bottomCardCenter{
|
|
|
+ // margin-left: 15px;
|
|
|
+ // }
|
|
|
+ // .bottomCardright{
|
|
|
+
|
|
|
+ // margin-left: 15px;
|
|
|
+ // }
|
|
|
+ // .bottomCardright2{
|
|
|
+
|
|
|
+ // margin-left: 15px;
|
|
|
+ // }
|
|
|
+ }
|
|
|
+}
|
|
|
+.dv-decoration-10 {
|
|
|
+ width: 96%;
|
|
|
+ margin: 7px 2% 0;
|
|
|
+ height: 5px;
|
|
|
+}
|
|
|
+</style>
|