sov

src/pages/ProdCount.vue

@@ -42,18 +42,31 @@
             <div id="echart_d05" style="width: 100%; height: 100%"></div>
           </div>
         </div>
+        <!-- <div class="con3" style="position: relative">
+          <div class="title">在制品设备生产量</div>
+          <div id="echarts2" style="width: 100%; height: 100%;"></div>
+          <div class="desc1">
+            <span>当日产量：</span>
+            <span class="num">{{showNum3}}</span>
+            <span class="span3">块</span>
+            <span>当班产量：</span>
+            <span class="num">{{showNum4}}</span>
+            <span>吨</span>
+          </div>
+        </div> -->
       </div>
       <div class="con4">
         <div class="block_h2">
           <h2>生产任务</h2>
         </div>
         <div class="list_scroll_title">
-          <span>设备</span><span>物料编码</span><span>计划数量/重量</span><span>实际数量/重量</span><span>合格数量/重量</span><span>不合格数量/重量</span><span>生产状态</span><span>开始时间</span><span>结束时间</span>
+          <span>订单</span><span>工序</span><span>设备</span><span>物料号</span><span>生产物料</span><span>厂家</span><span>计划量</span><span>生产量</span><span>生产状态</span><span>计划开始时间</span><span>开始时间</span><span>结束时间</span>
         </div>
         <vue-seamless-scroll :data="taskData" :class-option="classOption" class="content-block-scroll">
           <ul class="content-block-scroll-ul">
             <li v-for="(e, i) in taskData" :key="i">
-              <span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.device_name}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.material_code}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.plan_qty}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.real_qty}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.qualified_qty}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.unqualified_qty}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.order_status_name}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.realproducestart_date}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.realproduceend_date}}</span>
+              <span>{{e.device_name}}</span><span>{{e.material_code}}</span><span>{{e.plan_qty}}</span><span>{{e.real_qty}}</span><span>{{e.qualified_qty}}</span><span>{{e.unqualified_qty}}</span><span>{{e.order_status_name}}</span><span>{{e.realproducestart_date}}</span><span>{{e.realproduceend_date}}</span>
+              <!-- <span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.device_name}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.material_code}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.plan_qty}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.real_qty}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.qualified_qty}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.unqualified_qty}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.order_status_name}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.realproducestart_date}}</span><span :class="{blue:e.order_status ==='1',yellow:e.order_status ==='2',green:e.order_status ==='3',red:e.order_status ==='4',orange:e.order_status ==='5'}">{{e.realproduceend_date}}</span> -->
             </li>
           </ul>
         </vue-seamless-scroll>
@@ -77,8 +90,8 @@ export default {
       timer: null,
       showNum1: '',
       showNum2: '',
-      showNum3: '',
+      showNum3: '222',
-      showNum4: '',
+      showNum4: '333',
       myCharts05: '',
       materData: [],
       deviceData: [],
@@ -107,6 +120,7 @@ export default {
     }
   },
   mounted () {
+    // this.getEchart2()
     this.initData()
     this.refresh()
   },
@@ -127,11 +141,135 @@ export default {
       this.showNum3 = (res.result.finishedRes[2].real_qty + '').split('')
       this.taskData = [...res.result.productionTask]
       this.setEchart05()
+      // this.getEchart2()
       this.realqty = res.result.materialTask[0].real_qty
       this.planqty = res.result.materialTask[0].plan_qty
       this.setEchart01()
       // 五种状态：未成产、已下发、生产中、停止、完成
     },
+    // getEchart2 () {
+    //   // 基于准备好的dom，初始化echarts实例
+    //   var lineData = [4, 9, 8, 6, 8, 7, 3, 8]
+    //   var barData = [50002, 34120, 48370, 57370, 67582, 90892, 32321, 57370]
+    //   var xData = ['1号机', '2号机', '3号机', '4号机', '5号机', '6号机', '7号机', '8号机']
+    //   // var lineData = []
+    //   // var barData = []
+    //   // var xData = []
+    //   // this.deviceData.map(el => {
+    //   //   console.log(el.produce_qty)
+    //   //   lineData.push(el.produce_qty)
+    //   //   barData.push(el.produce_num)
+    //   //   xData.push(el.device_name)
+    //   // })
+    //   var myChart = echarts.init(document.getElementById('echarts2'))
+    //   var option = {
+    //     legend: {
+    //       top: 20,
+    //       right: 10,
+    //       textStyle: {
+    //         color: '#ffffff',
+    //         fontSize: 12,
+    //         lineHeight: 20
+    //       },
+    //       itemGap: 20,
+    //       itemHeight: 8,
+    //       data: ['数量', '重量']
+    //     },
+    //     // tooltip: {
+    //     //   trigger: 'axis'
+    //     // },
+    //     xAxis: {
+    //       // name: '设备',
+    //       type: 'category',
+    //       data: xData,
+    //       nameGap: 60, // 坐标轴名称与轴线之间的距离。
+    //       axisLine: {
+    //         show: true,
+    //         lineStyle: {
+    //           color: '#fff'
+    //         }
+    //       },
+    //       axisLabel: {
+    //         color: '#fff'
+    //       }
+    //     },
+    //     yAxis: [
+    //       {
+    //         // name: '交易额（亿元）',
+    //         type: 'value',
+    //         min: 0,
+    //         // max: 100000,
+    //         max: Math.max.apply(null, barData),
+    //         splitNumber: 10,
+    //         splitLine: {
+    //           show: true,
+    //           lineStyle: {
+    //             color: ['#315070'],
+    //             width: 1,
+    //             type: 'dotted'
+    //           }
+    //         },
+    //         axisLine: {
+    //           show: false,
+    //           lineStyle: {
+    //             color: '#fff'
+    //           }
+    //         }
+    //       },
+    //       {
+    //         // name: '增长率',
+    //         type: 'value',
+    //         min: 0,
+    //         // max: 10,
+    //         max: Math.max.apply(null, lineData),
+    //         splitNumber: 10,
+    //         // position: 'right',
+    //         // formatter: '{value}',
+    //         axisLine: {
+    //           show: false,
+    //           lineStyle: {
+    //             color: '#fff'
+    //           }
+    //         },
+    //         itemStyle: {
+    //           color: '#F7B502'
+    //         }
+    //       }
+    //     ],
+    //     series: [
+    //       {
+    //         name: '数量',
+    //         type: 'bar',
+    //         data: barData,
+    //         barWidth: 10,
+    //         itemStyle: {
+    //           color: '#32C5FF'
+    //         }
+    //       },
+    //       {
+    //         name: '重量',
+    //         type: 'line',
+    //         symbolSize: 12, // 拐点圆的大小
+    //         symbol: 'circle',
+    //         data: lineData,
+    //         lineStyle: {
+    //           color: '#F7B502'
+    //         },
+    //         itemStyle: {
+    //           normal: {
+    //             color: '#F7B502'
+    //           }
+    //         },
+    //         yAxisIndex: 1
+    //       }
+    //     ]
+    //   }
+    //   // 使用刚指定的配置项和数据显示图表。
+    //   myChart.setOption(option)
+    //   window.addEventListener('resize', function () {
+    //     myChart.resize()
+    //   })
+    // },
     setEchart01 () {
       let data = [
         {
@@ -670,16 +808,17 @@ export default {
   height 100%
   overflow hidden
   position relative
-  background center center / 100% 100% url(../assets/images/sctj_bg1.png) no-repeat
   .title
-    _wh(calc(100% - 34px), 22px)
+    _wh(calc(100% - 34px), 32px)
     margin 17px
-    _font(16px, 22px, #fff,,left)
+    padding-left 0.48rem
+    _font(16px, 32px, #fff,,left)
+    background center center / 100% 100% url(../assets/images/screen1/title_bg_d1.png) no-repeat
   .desc
-    _wh(100%, 22px)
+    _wh(100%, 32px)
     _fj(row, center)
     div
-      _font(16px, 22px, #fff,,)
+      _font(16px, 32px, #fff,,)
       span
         font-size 16px
         color #F7B502
@@ -692,11 +831,12 @@ export default {
   height 100%
   overflow hidden
   position relative
-  background center center / 100% 100% url(../assets/images/sctj_bg2.png) no-repeat
   .title
-    _wh(calc(100% - 34px), 22px)
+    _wh(calc(100% - 34px), 32px)
     margin 17px
-    _font(16px, 22px, #fff,,left)
+    padding-left 0.48rem
+    _font(16px, 32px, #fff,,left)
+    background center center / 100% 100% url(../assets/images/screen1/title_bg_d2.png) no-repeat
   .item_content_1
     _wh(calc(100% - 44px), calc(100% - 90px))
     margin 17px auto
@@ -705,12 +845,13 @@ export default {
   margin-top 16px
   overflow hidden
   position relative
-  background center center / 100% 100% url(../assets/images/sctj_bg3.png) no-repeat
   .block_h2
-    _wh(calc(100% - 34px), 22px)
+    _wh(calc(100% - 34px), 32px)
-    margin 17px auto
+    margin 17px 0 10px 0
+    padding-left 0.55rem
+    background center center / 100% 100% url(../assets/images/screen1/title_bg_d2.png) no-repeat
     h2
-      _font(16px, 22px, #fff,,left)
+      _font(16px, 32px, #fff,,left)
   .list_scroll_title
     _wh(calc(100% - 50px), 32px)
     margin 0 auto
@@ -718,7 +859,7 @@ export default {
     line-height 32px
     span
       display inline-block
-      width 11%
+      width 8%
       text-align center
       line-height 32px
       // float left
@@ -726,7 +867,7 @@ export default {
       &:nth-child(1)
         width 8%
       &:nth-child(2)
-        width 15%
+        width 12%
   .content-block-scroll
     _wh(calc(100% - 50px), calc(100% - 113px))
     margin 0 auto 25px auto
@@ -741,7 +882,7 @@ export default {
         background rgba(38,47,82,0.50)
       span
         display inline-block
-        width 11%
+        width 8%
         font-size 12px
         // padding 0 .1rem
         text-align center
@@ -751,5 +892,5 @@ export default {
         &:nth-child(1)
           width 8%
         &:nth-child(2)
-          width 15%
+          width 12%
 </style>

src/router/index.js

@@ -8,6 +8,7 @@ const WorkshopScreen = r => require.ensure([], () => r(require('@page/WorkshopSc
 const HomeScreen = r => require.ensure([], () => r(require('@page/HomeScreen')), 'HomeScreen')
 
 const ProdCount = r => require.ensure([], () => r(require('@page/ProdCount')), 'ProdCount')
+const LogisticsProcess = r => require.ensure([], () => r(require('@page/shunhe/LogisticsProcess')), 'LogisticsProcess')
 
 Vue.use(Router)
 
@@ -41,6 +42,10 @@ export default new Router({
     {
       path: '/ProdCount',
       component: ProdCount
+    },
+    {
+      path: '/LogisticsProcess',
+      component: LogisticsProcess
     }
   ]
 })