22大屏完成

src/router/generator-platform-routers.js

@@ -297,7 +297,7 @@ const constantRouterComponents = {
   // 自定义管理
   'CustomizeReport': () => import('@/views/customize/report/CustomizeReport'), // 自定义报表
   'CustomFieldTemplate': () => import('@/views/customize/fieldTemplate/CustomFieldTemplate'), // 自定义模板
-  'CustomFieldTemplateData': () => import('@/views/customize/fieldTemplateData/CustomFieldTemplateData')// 自定义模板数据
+  'CustomFieldTemplateData': () => import('@/views/customize/fieldTemplateData/CustomFieldTemplateData') // 自定义模板数据
 }
 
 // 前端未找到页面路由（固定不用改）
@@ -384,6 +384,11 @@ export const constantRouterMap = [
     path: '/404',
     component: () => import(/* webpackChunkName: "fail" */ '@/views/exception/404')
   },
+  {
+    path: '/22',
+    component: () => import('@/views/statisticView/22')
+
+  },
   {
     path: '/single/login',
     name: 'SingleLogin',

src/utils/install.js

@@ -18,7 +18,7 @@ import iconfont from '@/components/IconSelector/iconfont.js'
 import ImportForm from '@/components/custom/ImportForm'
 const MyIcon = Icon.createFromIconfontCN({
   // scriptUrl: iconfont // //at.alicdn.com/t/font_1314041_9qgpnn1vvko.js在 iconfont.cn 上生成
-  scriptUrl: '//at.alicdn.com/t/font_3266072_h1qg9yrgg57.js'
+  scriptUrl: '//at.alicdn.com/t/font_3266072_o1c09mppthi.js'
 })
 
 export default {

src/views/Login.vue

@@ -234,15 +234,8 @@ export default {
       })
     },
     loginSuccess (res) {
-      getInfo().then((value) => {
-        const roles = value.data.roles
-        const workplaceType = this.DictCache.VALUE.WORKPLACE_TYPE
-        if (roles.find(value => value === workplaceType.WORKPLACE_REPAIR_NORMAL)) {
-          this.$router.push({ path: '/NewWorkplaceBacklog?type=' + workplaceType.WORKPLACE_REPAIR_NORMAL })
-        }
-      })
       // 延迟 1 秒显示欢迎信息
-      // this.$router.push({ path: '/WorkplaceBacklog' })
+      this.$router.push({ path: '/WorkplaceBacklog' })
       setTimeout(() => {
         this.$notification.success({
           message: '欢迎',

src/views/repair/application-form/RepairApplicationForm.vue

@@ -169,7 +169,8 @@ export default {
       // 查询参数
       queryParam: {
         filter: this.filter,
-        searchType: this.searchType
+        searchType: this.searchType,
+        status: this.$route.query.status
       },
       visible: true,
       // 表头

src/views/sb/info/modules/DetailC.vue

@@ -25,14 +25,11 @@
               <a-button style="margin-left: 20px" type="default" @click="handleRepairReportSbInfo()">工单分析</a-button>
               <a-button style="margin-left: 20px" type="default" @click="handleRepairReportSbInfoFee()">费用分析</a-button>
               <a-button style="margin-left: 20px" type="primary" @click="handleCancel()">返回</a-button>
-<<<<<<< HEAD
             <!-- <a-button style="margin-left: 20px" type="default" >检定记录</a-button>
             <a-button style="margin-left: 20px" type="error" >保养日历</a-button>
             <a-button style="margin-left: 20px" type="default">工单分析</a-button>
             <a-button style="margin-left: 20px" type="default">费用分析</a-button>
             <a-button style="margin-left: 20px" type="primary">返回</a-button> -->
-=======
->>>>>>> 771e778e064235dd496ade6ed93af1283d7743cd
             </span>
           </a-col>
         </a-row>

src/views/statisticView/22.vue

@@ -0,0 +1,475 @@
+<template>
+  <div style="width:1920px;height:1080px;background:#16171C; padding:35px 21px">
+    <div class="title">
+      <div style="position: absolute;">
+        <img src="@/assets/22title.png" alt="">
+      </div>
+      <div class="text">
+        <div> 设备管理系统数据大屏展示平台</div>
+        <div style="font-size: 15px;color: #A7DBFF;">Internet Food and Beverage Data Display Platform</div>
+      </div>
+    </div>
+    <div class="main">
+      <a-row :gutter="16">
+        <a-col :span="8">
+          <div class="box">
+            <div class="box-title">
+              <div></div>
+              <div class="box-title-text">
+                <span style="padding: 0 40px;">
+                  故障月统计
+                </span>
+              </div>
+              <div></div>
+            </div>
+            <div class="box-chart" >
+              <div id="chart1"></div>
+            </div>
+          </div>
+          <div class="box" style="height:452px;">
+            <div class="box-title">
+              <div></div>
+              <div class="box-title-text">
+                <span style="padding: 0 40px;">
+                  保养率月统计
+                </span>
+              </div>
+              <div></div>
+            </div>
+            <div class="box-chart" >
+              <div id="chart2"></div>
+            </div>
+          </div>
+        </a-col>
+        <a-col :span="8">
+          <div class="box" style="height:886px;">
+            <div class="box-title">
+              <div></div>
+              <div class="box-title-text">
+                <span style="padding: 0 40px;">
+                  设备指标
+                </span>
+              </div>
+              <div></div>
+            </div>
+            <div class="box-chart2" >
+              <div style="display:flex;justify-content: space-between; position: relative;">
+                <span class="card-num">1</span>
+                <span class="card-num">2</span>
+                <span class="card-num">3</span>
+                <span class="card-num">4</span>
+                <span class="card-num">5</span>
+                <span class="card-num">6</span>
+                <span style=" position: absolute; bottom:-15px;right:-30px;color: #CDFBFF;line-height: 73px;font-size: 23px;">个</span>
+              </div>
+              <div>
+                <a-row type="flex" justify="space-between">
+                  <a-col :span="8" class="box-middle-sum">
+                    <div style="font-size:14px;">OEE</div>
+                    <div style="font-size:22px;">55%</div>
+                  </a-col>
+                  <a-col :span="8" class="box-middle-sum">
+                    <div style="font-size:14px;">故障率</div>
+                    <div style="font-size:22px;">55%</div>
+                  </a-col>
+                  <a-col :span="8" class="box-middle-sum">
+                    <div style="font-size:14px;">MTTR</div>
+                    <div style="font-size:22px;">55min</div>
+                  </a-col>
+                  <a-col :span="8" class="box-middle-sum">
+                    <div style="font-size:14px;">MTBF</div>
+                    <div style="font-size:22px;">55h</div>
+                  </a-col>
+                  <a-col :span="8" class="box-middle-sum">
+                    <div style="font-size:14px;">保养完成率</div>
+                    <div style="font-size:22px;">55%</div>
+                  </a-col>
+                  <a-col :span="8" class="box-middle-sum">
+                    <div style="font-size:14px;">严重事故</div>
+                    <div style="font-size:22px;">5</div>
+                  </a-col>
+                </a-row>
+              </div>
+              <div id="chart3"></div>
+            </div>
+          </div>
+        </a-col>
+        <a-col :span="8">
+          <div class="box">
+            <div class="box-title">
+              <div></div>
+              <div class="box-title-text">
+                <span style="padding: 0 40px;">
+                  三率指标
+                </span>
+              </div>
+              <div></div>
+            </div>
+            <div class="box-chart" >
+              <div id="chart4"></div>
+              <div style="font-size:17px; color:rgba(0, 190, 189, 1); display:flex;justify-content: space-around;">
+                <span>完成率</span>
+                <span>待修率</span>
+                <span>故障率</span>
+              </div>
+            </div>
+          </div>
+          <div class="box" style="height:452px;">
+            <div class="box-title">
+              <div></div>
+              <div class="box-title-text">
+                <span style="padding: 0 40px;">
+                  设备费用排行
+                </span>
+              </div>
+              <div></div>
+            </div>
+            <div class="box-chart" >
+              <a-list item-layout="horizontal" :data-source="list1">
+                <a-list-item slot="renderItem" slot-scope="item" class="list">
+                  <a-list-item-metas>
+                    <span slot="title"> <my-icon type="icon-lingxing" /> {{ item.title }}</span>
+                  </a-list-item-metas>
+                  <div>{{ item.time }}</div>
+                </a-list-item>
+              </a-list>
+            </div>
+          </div>
+        </a-col>
+      </a-row>
+    </div>
+  </div>
+</template>
+
+<script>
+import { Chart, registerTheme } from '@antv/g2'
+export default {
+  data () {
+    return {
+      chart1: [
+        { name: 'A', year: '2019', value: 3 },
+        { name: 'B', year: '2019', value: 5 },
+        { name: 'C', year: '2019', value: 21 },
+        { name: 'D', year: '2019', value: 12 },
+
+        { name: 'A', year: '2020', value: 15 },
+        { name: 'B', year: '2020', value: 12 },
+        { name: 'C', year: '2020', value: 13 },
+        { name: 'D', year: '2020', value: 12 },
+
+        { name: 'A', year: '2021', value: 12 },
+        { name: 'B', year: '2021', value: 13 },
+        { name: 'C', year: '2021', value: 11 },
+        { name: 'D', year: '2021', value: 12 },
+
+        { name: 'A', year: '2022', value: 17 },
+        { name: 'B', year: '2022', value: 12 },
+        { name: 'C', year: '2022', value: 11 },
+        { name: 'D', year: '2022', value: 15 }
+      ],
+      chart3: [
+        { year: '2001', population: 41.8 },
+        { year: '2002', population: 38 },
+        { year: '2003', population: 33.7 },
+        { year: '2004', population: 30.7 },
+        { year: '2005', population: 25.8 },
+        { year: '2006', population: 31.7 }
+      ],
+      chart4: [
+        { type: '完好率', value: 90 },
+        { type: '待修率', value: 5 },
+        { type: '故障率', value: 5 }
+      ],
+      list1: [
+        { title: '武汉市xxx餐饮集团有限公司',
+          time: '2017-08-08' },
+        { title: '武汉市xxx餐饮集团有限公司',
+          time: '2017-08-08' },
+        { title: '武汉市xxx餐饮集团有限公司',
+          time: '2017-08-08' },
+        { title: '武汉市xxx餐饮集团有限公司',
+          time: '2017-08-08' },
+        { title: '武汉市xxx餐饮集团有限公司',
+          time: '2017-08-08' },
+        { title: '武汉市xxx餐饮集团有限公司',
+          time: '2017-08-08' }
+      ]
+    }
+  },
+  mounted () {
+    this.getChart()
+  },
+  methods: {
+    getChart () {
+      this.getChart1('chart1', this.chart1)
+      this.getChart2('chart2', this.chart1)
+      this.getChart3('chart3', this.chart3)
+      this.getChart4('chart4', this.chart4)
+    },
+    getChart1 (id, data) {
+      registerTheme('myTheme', {
+        columnWidthRatio: 0.2,
+        colors10: ['#FFDB5C', '#FF9F7F', '#FB7293', '#E7BCF3', '#E7BCF3', '#78D3F8', '#9661BC', '#F6903D', '#008685', '#F08BB4']
+      })
+      const chart = new Chart({
+        container: id,
+        autoFit: true,
+        height: 300
+      })
+
+      chart.data(data)
+      chart.scale('value', {
+        nice: true,
+        range: [0, 1]
+
+      })
+      chart.tooltip({
+        shared: true,
+        showMarkers: false
+      })
+
+      chart
+        .interval()
+        .position('year*value')
+        .color('name')
+        .adjust('stack')
+
+      chart.interaction('active-region')
+      chart.theme('myTheme')
+      chart.render()
+    },
+    getChart2 (id, data) {
+      const chart = new Chart({
+        container: id,
+        autoFit: true,
+        height: 300
+      })
+
+      chart.data(data)
+      chart.scale({
+        year: {
+          range: [0, 1]
+        },
+        value: {
+          nice: true
+        }
+      })
+      chart.tooltip({
+        shared: true,
+        showCrosshairs: true
+      })
+
+      chart.axis('value', {
+        label: {
+          formatter: (val) => {
+            return val
+          }
+        }
+      })
+
+      chart
+        .line()
+        .position('year*value')
+        .color('name')
+        .shape('smooth')
+
+      chart.theme({ 'styleSheet': { 'brandColor': '#  ', 'paletteQualitative10': ['#FFDB5C', '#FF9F7F', '#FB7293', '#E7BCF3', '#E7BCF3', '#78D3F8', '#9661BC', '#F6903D', '#008685', '#F08BB4'], 'paletteQualitative20': ['#5B8FF9', '#CDDDFD', '#61DDAA', '#CDF3E4', '#65789B', '#CED4DE', '#F6BD16', '#FCEBB9', '#7262fd', '#D3CEFD', '#78D3F8', '#D3EEF9', '#9661BC', '#DECFEA', '#F6903D', '#FFE0C7', '#008685', '#BBDEDE', '#F08BB4', '#FFE0ED'] } })
+      chart.render()
+    },
+    getChart3 (id, data) {
+      const chart = new Chart({
+        container: id,
+        autoFit: true,
+        height: 400,
+        padding: [50, 0, 20, 0]
+      })
+      chart.data(data)
+      chart.coordinate('polar', {
+        innerRadius: 0.2
+      })
+      chart.legend('year', {
+        position: 'bottom',
+        offsetY: 10
+      })
+      chart.axis(false)
+      chart.tooltip({
+        showMarkers: false
+      })
+      chart.interaction('element-highlight')
+      chart
+        .interval()
+        .position('year*population')
+        .color('year')
+        .style({
+          lineWidth: 1,
+          stroke: '#fff'
+        }).label('population', {
+          style: {
+            fill: '#03D3D3',
+            fontSize: 16
+          },
+          layout: {
+            type: 'fixed-overlap'
+          },
+          offset: 30,
+          content: (data) => {
+            return `${data.population}个`
+          }
+        })
+      chart.render()
+    },
+    getChart4 (id, data) {
+      const chart = new Chart({
+        container: id,
+        autoFit: true,
+        height: 250
+      })
+      chart.data(data)
+      chart.legend(false)
+      chart.tooltip({
+        showMarkers: false
+      })
+      chart.facet('rect', {
+        fields: ['type'],
+        padding: 20,
+        showTitle: false,
+        eachView: (view, facet) => {
+          const data = facet.data
+          let color
+          if (data[0].type === '完好率') {
+            color = 'RGBA(13, 212, 219, 1)'
+          } else if (data[0].type === '待修率') {
+            color = 'RGBA(40, 254, 8, 1)'
+          } else {
+            color = 'RGBA(255, 0, 0, 1)'
+          }
+          data.push({ type: '其他', value: 100 - data[0].value })
+          view.data(data)
+          view.coordinate('theta', {
+            radius: 0.8,
+            innerRadius: 0.9
+          })
+          view
+            .interval()
+            .adjust('stack')
+            .position('value')
+            .color('type', [color, 'RGBA(20, 60, 145, 1)'])
+            .style({
+              opacity: 1
+            })
+
+          view.annotation().text({
+            position: ['50%', '50%'],
+            content: data[0].value + '%',
+            style: {
+              fontSize: 25,
+              fill: 'RGBA(13, 212, 219, 1)',
+              fontWeight: 500,
+              textAlign: 'center'
+            }
+          })
+
+          view.interaction('element-active')
+        }
+      })
+      chart.render()
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.title{
+  height: 89px;
+  position: relative;
+  .text{
+height: 26px;
+font-size: 27px;
+display:flex;
+flex-direction: column;
+align-items: center;
+padding-top: 30px;
+font-family: Microsoft YaHei;
+font-weight: bold;
+color: #BDE4FF;
+line-height: 25px;
+}
+}
+
+.main{
+padding-top:35px;
+.box{
+  width: 609px;
+  height: 404px;
+  background: rgba(3, 129, 255, 0.05);
+  border: 1px solid #0096FF;
+  box-shadow: 0px 0px 30px 0px rgba(0, 128, 202, 0.8) inset;
+  border-radius: 5px;
+  margin-bottom: 30px;;
+  .box-title{
+  display: flex;
+  justify-content: space-between;
+  font-size: 22px;
+  font-family: Microsoft YaHei;
+  font-weight: bold;
+  color: #A7DBFF;
+  line-height: 25px;
+  .box-title-text{
+    position: relative;
+    z-index: 999;
+    padding-bottom: 7px;;
+  }
+  .box-title-text::before{
+    content: '';
+  position: absolute;
+  top:0;left:0;right:0;bottom:0;
+  z-index: -1;
+   background-color: #16171C;
+    border: 1px solid #0096FF;
+    border-top: none;
+   box-shadow: 0px 29px 30px 0px rgba(0, 128, 202, 0.3);
+  transform: perspective(.5em) rotateX(-3deg);
+  }
+  }
+  .box-chart{
+   padding: 20px;
+   .list{
+     padding: 22px 16px;
+     background:RGBA(19, 42, 62, 1);
+     color:rgba(0, 190, 189, 1);
+     border-bottom:1px solid RGBA(21, 72, 62, 1);
+   }
+  }
+  .box-chart2{
+   padding: 70px;
+      .box-middle-sum{
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+     margin-top:30px;
+     color: #00FFFF;
+     width: 117px;
+     height: 74px;
+     background: rgba(28, 45, 104, 0.24);
+     border: 2px solid #4574D6;
+     border-radius: 20px;
+     box-shadow: 0px 0px 30px 0px RGBA(28, 59, 138, 1) inset;
+   }
+   #chart3{
+     padding-top:20px;
+   }
+  }
+  .card-num{
+  padding:15px;
+  font-size: 55px;
+  font-family: Microsoft YaHei;
+  font-weight: bold;
+  color: #CDFBFF;
+  line-height: 73px;
+  background:linear-gradient(#00EDFE,#006DC5);
+  border-radius: 3px;
+  }
+}
+}
+</style>

src/views/workplace/backlog/NewWorkplaceBacklog.vue

@@ -5,13 +5,13 @@
         <a-col class="gutter-row" :span="8">
           <div class="gutter-box">
             <a-row type="flex" justify="space-between" style="flex:1; font-size:22px;font-weight: 500;color: #373737;">
-              <a-col>今日维修数据</a-col>
-              <a-col>{{ topData.repairTotalNum }}</a-col>
+              <a-col>维修数据</a-col>
+              <a-col><a href="/repair/form" target="_block">{{ topData.repairTotalNum }}</a></a-col>
             </a-row>
             <a-row type="flex" justify="space-between" :gutter="[0,16]" style="flex:1;font-size:18px;font-weight: 500;">
               <a-col >
                 <a-badge color="#E4007F"/>
-                <span style="color:#E4007F;">待维修 &nbsp; {{ topData.waitForRepairNum }}</span>
+                <span style="color:#E4007F;"><a style="color:#E4007F;" href="/repair/form?status=2">待维修 &nbsp; {{ topData.waitForRepairNum }}</a></span>
               </a-col>
               <a-col >
                 <a-badge color="#5864FF"/>
@@ -20,23 +20,24 @@
               </a-col>
             </a-row>
             <a-row type="flex" justify="space-between" :gutter="[0,16]" style="flex:1;font-size:18px;font-weight: 500;">
-              <a-col >
-                <a-badge color="#F19149"/>
-                <span style="color:#F19149;">已完成 &nbsp; {{ topData.completedRepairNum }}</span>
 
-              </a-col>
               <a-col>
                 <a-badge color="#009944"/>
                 <span style="color:#009944;">已驳回 &nbsp; {{ topData.refusedRepairNum }}</span>
 
               </a-col>
+              <a-col >
+                <a-badge color="#F19149"/>
+                <span style="color:#F19149;">待接单 &nbsp; {{ topData.completedRepairNum }}</span>
+
+              </a-col>
             </a-row>
           </div>
         </a-col>
         <a-col class="gutter-row" :span="8">
           <div class="gutter-box">
             <a-row type="flex" justify="space-between" style="flex:1; font-size:22px;font-weight: 500;color: #373737;">
-              <a-col>今日委外数据</a-col>
+              <a-col>委外数据</a-col>
               <a-col>{{ topData.outRepairTotalNum }}</a-col>
             </a-row>
             <a-row type="flex" justify="space-between" :gutter="[0,16]" style="flex:1;font-size:18px;font-weight: 500;">
@@ -51,16 +52,17 @@
               </a-col>
             </a-row>
             <a-row type="flex" justify="space-between" :gutter="[0,16]" style="flex:1;font-size:18px;font-weight: 500;">
-              <a-col >
-                <a-badge color="#F19149"/>
-                <span style="color:#F19149;">已完成 &nbsp; {{ topData.outCompletedRepairNum }}</span>
-
-              </a-col>
               <a-col>
                 <a-badge color="#009944"/>
                 <span style="color:#009944;">已驳回 &nbsp; {{ topData.outRefusedRepairNum }}</span>
 
               </a-col>
+              <a-col >
+                <a-badge color="#F19149"/>
+                <span style="color:#F19149;">待接单 &nbsp; {{ topData.outCompletedRepairNum }}</span>
+
+              </a-col>
+
             </a-row>
           </div>
         </a-col>
@@ -85,7 +87,6 @@
           <div style="height: 471px;background: #FFFFFF;padding:24px">
             <div style="display:flex;justify-content: space-between;width:160px;height: 18px; font-size:16px;color: #555555; ">
               <div>维修费用类别统计</div>
-              <!-- <div>设备总数100</div> -->
             </div>
             <div id="container-pie"></div>
           </div>
@@ -103,19 +104,19 @@
           <div style="height: 471px;display:flex;flex-direction:column;justify-content: space-between">
             <div class="btn" style="background:linear-gradient(to right,#36B5FA,#26ECF5);">
               <my-icon type="icon-chukuguanli" style="font-size:58px;"/>
-              <span>出库</span>
+              <span>维修</span>
             </div>
             <div class="btn" style="background:linear-gradient(to right,#FF416D,#FF847F);">
               <my-icon type="icon-rukuguanli" style="font-size:58px;"/>
-              <span>入库</span>
+              <span>报修</span>
             </div>
             <div class="btn" style="background:linear-gradient(to right,#FB47D1,#F96EFE);">
               <my-icon type="icon-zichanguanli-zichantiaobo" style="font-size:58px;"/>
-              <span>调拨</span>
+              <span>领用</span>
             </div>
             <div class="btn" style="background:linear-gradient(to right,#941FFF,#BC72FB);">
               <my-icon type="icon-xinzengyugengxinhuopindangan-copy" style="font-size:58px;"/>
-              <span>新增</span>
+              <span>退库</span>
             </div>
           </div>
         </a-col>
@@ -151,6 +152,16 @@
         </a-col>
         <a-col class="gutter-row" :span="18">
           <div class="information">
+            <div style="display:flex;justify-content: space-between;align-items: center; padding-bottom:20px;">
+              <div style="display:flex; width:65px;height:17px;justify-content: space-between;align-items: center;">
+                <div style=" width: 17px;height: 17px;background: #3462FD;border-radius: 50%;"></div>
+                <div style="font-size: 18px;font-weight: 800;color: #333333;">通知</div>
+              </div>
+              <a href="WorkplaceBacklog" target="_block">
+                查看全部
+                <my-icon type="icon-xiangyou-copy" style="font-size:13px;"/>
+              </a>
+            </div>
             <s-table
               ref="table"
               size="small"
@@ -471,7 +482,7 @@ justify-content: space-around;
 .information{
   background: #fff;
   padding: 30px 12px;
-  height: 260px;
+  height: 500px;
   color:#666;
 }
 .discolor{
@@ -479,7 +490,7 @@ justify-content: space-around;
 }
 .demo-infinite-container {
   overflow: auto;
-  height: 190px;
+  height: 430px;
 }
 ::-webkit-scrollbar { width: 0; height: 0; color: transparent; }
 </style>

vue.config.js

@@ -41,7 +41,10 @@ const vueConfig = {
     // webpack plugins
     plugins: [
       // Ignore all locale files of moment.js
-      new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
+      new webpack.IgnorePlugin({
+        resourceRegExp: /^\.\/locale$/,
+        contextRegExp: /moment$/
+      })
 
     ],
     // if prod is on, add externals
@@ -101,7 +104,7 @@ const vueConfig = {
     // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
     proxy: {
       '/api': {
-        target: 'http://localhost:5000',
+        target: 'http://192.168.1.4:5000',
         ws: false,
         changeOrigin: true,
         pathRewrite: {
@@ -109,7 +112,7 @@ const vueConfig = {
         }
       },
       '/files': {
-        target: 'http://localhost:5000',
+        target: 'http://192.168.1.4:5000',
         ws: false,
         changeOrigin: true
       }