增加车间指令单相关页面

src/assets/iconfont/demo_index.html

@@ -540,6 +540,12 @@
                 <div class="code-name">&amp;#xe624;</div>
               </li>
           
+            <li class="dib">
+              <span class="icon iconfont">&#xe664;</span>
+                <div class="name">部分发货</div>
+                <div class="code-name">&amp;#xe664;</div>
+              </li>
+          
             <li class="dib">
               <span class="icon iconfont">&#xe644;</span>
                 <div class="name">消息</div>
@@ -666,6 +672,12 @@
                 <div class="code-name">&amp;#xe658;</div>
               </li>
           
+            <li class="dib">
+              <span class="icon iconfont">&#xe73f;</span>
+                <div class="name">指令</div>
+                <div class="code-name">&amp;#xe73f;</div>
+              </li>
+          
             <li class="dib">
               <span class="icon iconfont">&#xe913;</span>
                 <div class="name">步骤</div>
@@ -774,6 +786,12 @@
                 <div class="code-name">&amp;#xebf1;</div>
               </li>
           
+            <li class="dib">
+              <span class="icon iconfont">&#xe66d;</span>
+                <div class="name">指令</div>
+                <div class="code-name">&amp;#xe66d;</div>
+              </li>
+          
             <li class="dib">
               <span class="icon iconfont">&#xe60d;</span>
                 <div class="name">同意</div>
@@ -1026,6 +1044,12 @@
                 <div class="code-name">&amp;#xe65e;</div>
               </li>
           
+            <li class="dib">
+              <span class="icon iconfont">&#xe666;</span>
+                <div class="name">指令</div>
+                <div class="code-name">&amp;#xe666;</div>
+              </li>
+          
             <li class="dib">
               <span class="icon iconfont">&#xe686;</span>
                 <div class="name">标签</div>
@@ -1913,6 +1937,15 @@
             </div>
           </li>
           
+          <li class="dib">
+            <span class="icon iconfont icon-bufenfahuo"></span>
+            <div class="name">
+              部分发货
+            </div>
+            <div class="code-name">.icon-bufenfahuo
+            </div>
+          </li>
+          
           <li class="dib">
             <span class="icon iconfont icon-xiaoxi"></span>
             <div class="name">
@@ -2102,6 +2135,15 @@
             </div>
           </li>
           
+          <li class="dib">
+            <span class="icon iconfont icon-zhiling"></span>
+            <div class="name">
+              指令
+            </div>
+            <div class="code-name">.icon-zhiling
+            </div>
+          </li>
+          
           <li class="dib">
             <span class="icon iconfont icon-shoucang-"></span>
             <div class="name">
@@ -2264,6 +2306,15 @@
             </div>
           </li>
           
+          <li class="dib">
+            <span class="icon iconfont icon-instructions"></span>
+            <div class="name">
+              指令
+            </div>
+            <div class="code-name">.icon-instructions
+            </div>
+          </li>
+          
           <li class="dib">
             <span class="icon iconfont icon-tongyi"></span>
             <div class="name">
@@ -2642,6 +2693,15 @@
             </div>
           </li>
           
+          <li class="dib">
+            <span class="icon iconfont icon-zhiling1"></span>
+            <div class="name">
+              指令
+            </div>
+            <div class="code-name">.icon-zhiling1
+            </div>
+          </li>
+          
           <li class="dib">
             <span class="icon iconfont icon-biaoqian1"></span>
             <div class="name">
@@ -3459,6 +3519,14 @@
                 <div class="code-name">#icon-xuanxiang</div>
             </li>
           
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-bufenfahuo"></use>
+                </svg>
+                <div class="name">部分发货</div>
+                <div class="code-name">#icon-bufenfahuo</div>
+            </li>
+          
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-xiaoxi"></use>
@@ -3627,6 +3695,14 @@
                 <div class="code-name">#icon-cuowu1</div>
             </li>
           
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhiling"></use>
+                </svg>
+                <div class="name">指令</div>
+                <div class="code-name">#icon-zhiling</div>
+            </li>
+          
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-shoucang-"></use>
@@ -3771,6 +3847,14 @@
                 <div class="code-name">#icon-kongjianyixuan</div>
             </li>
           
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-instructions"></use>
+                </svg>
+                <div class="name">指令</div>
+                <div class="code-name">#icon-instructions</div>
+            </li>
+          
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-tongyi"></use>
@@ -4107,6 +4191,14 @@
                 <div class="code-name">#icon-shenhe1</div>
             </li>
           
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhiling1"></use>
+                </svg>
+                <div class="name">指令</div>
+                <div class="code-name">#icon-zhiling1</div>
+            </li>
+          
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-biaoqian1"></use>

src/pages/funclist.vue

@@ -117,6 +117,16 @@
       <!-- 生产 -->
       <div class="funclist_title">生产</div>
       <div class="funclist_funcarea">
+        <div class="funclist_item">
+          <div class="funclist_icon func_icon_bg_blue">
+            <svg class="icon" aria-hidden="true">
+              <use xlink:href="#icon-zhiling1"></use>
+            </svg>
+          </div>
+          <div class="funclist_text">车间指令单</div>
+        </div>
+
+
         <div class="funclist_item">
           <div class="funclist_icon func_icon_bg_blue">
             <svg class="icon" aria-hidden="true">

src/pages/orderwkpmx.vue

@@ -0,0 +1,246 @@
+<template>
+  <div>
+    <div class="topbar">
+      <div class="topbar_left" @click="goback">
+        <svg class="icon" aria-hidden="true">
+          <use xlink:href="#icon-fanhui"></use>
+        </svg>
+      </div>
+      <div class="topbar_middle">
+        SC190907001缝纫组
+      </div>
+      <div class="topbar_right">
+        <svg class="icon" aria-hidden="true">
+          <use xlink:href="#icon-caidan"></use>
+        </svg>
+      </div>
+    </div>
+
+    <div id="content">
+      <!-- <div style="font-size:20px;font-weight:bold;padding:10px 20px">缝纫组</div> -->
+      <div class="subtitle_dt">工序进度</div>
+      <div class="jindu_wkpmx">
+        <div
+          style="display:flex;font-size:14px;margin-top:5px;border-bottom: 1px solid #eee;padding:0 0 5px 0;color:#666">
+          <div style="flex:0 0 25%;text-align: center;">工序</div>
+          <div style="flex:0 0 25%;text-align: center;">计划数</div>
+          <div style="flex:0 0 25%;text-align: center;">已派工数</div>
+          <div style="flex:0 0 25%;text-align: center;">完工数</div>
+        </div>
+
+        <div style="display:flex;margin-top:5px;border-bottom: 1px solid #eee;line-height:35px;font-size:14px;">
+          <div style="flex:0 0 25%;text-align: center;">缝纫</div>
+          <div style="flex:0 0 25%;text-align: center;">100</div>
+          <div style="flex:0 0 25%;text-align: center;">100</div>
+          <div style="flex:0 0 25%;text-align: center;">80</div>
+        </div>
+
+        <div style="display:flex;margin-top:5px;border-bottom: 1px solid #eee;line-height:35px;font-size:14px;">
+          <div style="flex:0 0 25%;text-align: center;">拼缝+围带</div>
+          <div style="flex:0 0 25%;text-align: center;">100</div>
+          <div style="flex:0 0 25%;text-align: center;">100</div>
+          <div style="flex:0 0 25%;text-align: center;">0</div>
+        </div>
+ 
+        <div style="display:flex;margin-top:5px;border-bottom: 1px solid #eee;line-height:35px;font-size:14px;">
+          <div style="flex:0 0 25%;text-align: center;">压双线</div>
+          <div style="flex:0 0 25%;text-align: center;">100</div>
+          <div style="flex:0 0 25%;text-align: center;">100</div>
+          <div style="flex:0 0 25%;text-align: center;">0</div>
+        </div>       
+      </div>
+
+      <div class="liubai_dt"></div>
+      <div class="subtitle_dt">工序派工</div>
+      <div class="jindu_wkpmx">
+        <div
+          style="display:flex;font-size:14px;margin-top:5px;border-bottom: 1px solid #eee;padding:0 0 5px 0;color:#666">
+          <div style="flex:0 0 25%;text-align: center;">工序</div>
+          <div style="flex:0 0 20%;text-align: center;">工作中心/员工</div>
+          <div style="flex:0 0 15%;text-align: center;">派工</div>
+          <div style="flex:0 0 15%;text-align: center;">完工</div>
+          <div style="flex:0 0 25%;text-align: center;">工期</div>
+        </div>
+
+        <div style="display:flex;margin-top:5px;border-bottom: 1px solid #eee;line-height:35px;font-size:14px;">
+          <div style="flex:0 0 25%;text-align: center;">缝纫</div>
+          <div style="flex:0 0 20%;text-align: center;">司秀英</div>
+          <div style="flex:0 0 15%;text-align: center;">100</div>
+          <div style="flex:0 0 15%;text-align: center;">80</div>
+          <div style="flex:0 0 25%;text-align: center;">9/10</div>
+        </div>
+
+        <div style="display:flex;margin-top:5px;border-bottom: 1px solid #eee;line-height:35px;font-size:14px;">
+          <div style="flex:0 0 25%;text-align: center;">拼缝+围带</div>
+          <div style="flex:0 0 20%;text-align: center;">李秀娟</div>
+          <div style="flex:0 0 15%;text-align: center;">50</div>
+          <div style="flex:0 0 15%;text-align: center;">0</div>
+          <div style="flex:0 0 25%;text-align: center;">9/10~9/11</div>
+        </div>
+        
+        <div style="display:flex;margin-top:5px;border-bottom: 1px solid #eee;line-height:35px;font-size:14px;">
+          <div style="flex:0 0 25%;text-align: center;">拼缝+围带</div>
+          <div style="flex:0 0 20%;text-align: center;">王秀琴</div>
+          <div style="flex:0 0 15%;text-align: center;">50</div>
+          <div style="flex:0 0 15%;text-align: center;">0</div>
+          <div style="flex:0 0 25%;text-align: center;">9/10~9/11</div>
+        </div>
+
+        <div style="display:flex;margin-top:5px;border-bottom: 1px solid #eee;line-height:35px;font-size:14px;">
+          <div style="flex:0 0 25%;text-align: center;">压双线</div>
+          <div style="flex:0 0 20%;text-align: center;">李秀娟</div>
+          <div style="flex:0 0 15%;text-align: center;">100</div>
+          <div style="flex:0 0 15%;text-align: center;">0</div>
+          <div style="flex:0 0 25%;text-align: center;">9/11</div>
+        </div> 
+      </div>
+
+      <div class="liubai_dt"></div>
+
+      <div class="subtitle_dt">用料明细</div>
+      <div class="jindu_mtrlmx">
+
+        <div class="order_mxmtrl_dt">
+          <div>
+            <svg class="icon" aria-hidden="true">
+              <use xlink:href="#icon-dian"></use>
+            </svg>W-119G-1扶手加强铁片 30*30*1.8MM内放孔10*10MM</span>
+          </div>
+          <div>
+            <span style="color:#888">100块,</span>
+            <span style="color:#888;margin-left:5px">未领100,库存80</span>
+            <span style="color:#f00;font-weight:bold;position:absolute;right:30px">缺料：20</span>
+          </div>
+        </div>
+
+        <div class="order_mxmtrl_dt">
+          <div>
+            <svg class="icon" aria-hidden="true">
+              <use xlink:href="#icon-dian"></use>
+            </svg>大扁头内六角螺丝（高等发黑） M6*20MM</span>
+          </div>
+          <div>
+            <span style="color:#888">100块,</span>
+            <span style="color:#888;margin-left:5px">已领80,未领20,库存0</span>
+            <span style="color:#f00;font-weight:bold;position:absolute;right:30px">缺料：20</span>
+          </div>
+        </div>
+
+        <div class="order_mxmtrl_dt">
+          <div>
+            <svg class="icon" aria-hidden="true">
+              <use xlink:href="#icon-dian"></use>
+            </svg>自封袋 9*13cm</span>
+          </div>
+          <div>
+            <span style="color:#888">100块,</span>
+            <span style="color:#888;margin-left:5px">已领100</span>
+            <!-- <span style="color:#f00;font-weight:bold;position:absolute;right:30px">缺料：20</span> -->
+          </div>
+        </div>
+
+      </div>
+    </div>
+  </div>
+
+</template>
+
+<script>
+  export default {
+    methods: {
+      goback() {
+        {
+          history.back();
+        }
+      }
+    }
+  }
+
+</script>
+
+<style>
+  body {
+    margin: 0;
+    padding: 0;
+    /* background-color: #fff; */
+    font-family: "微软雅黑";
+    font-size: 15px;
+  }
+
+  .liubai_dt {
+    width: 100%;
+    height: 10px;
+    background-color: #f6f6f6;
+  }
+
+  .topbar {
+    min-height: 44px;
+    border-bottom: 1px solid #e5e5e5;
+    background: #fff;
+    position: fixed;
+    width: 100%;
+    z-index: 9993;
+    display: flex;
+    font-size: 18px;
+    align-items: center;
+    /* color:#fff */
+  }
+
+  .topbar_left {
+    /* flex: 0 0 %; */
+    margin-left: 10px;
+  }
+
+  .topbar_middle {
+    text-align: center;
+    flex: 0 0 85%;
+  }
+
+  .topbar_right {
+    /* flex: 0 0 10%; */
+    position: absolute;
+    right: 10px;
+  }
+
+  #content {
+    position: absolute;
+    top: 44px;
+    background-color: #fff;
+    width: 100%;
+    padding-bottom: 30px;
+  }
+
+  .order_mxmtrl_dt {
+    border-bottom: 1px solid #f0f0f0;
+    padding: 8px 0;
+    line-height: 22px
+  }
+
+  .jindu_wkpmx {
+    border-top: 1px solid #f0f0f0;
+    /* margin: 0 20px; */
+    font-size: 14px;
+    line-height: 20px;
+    padding: 10px 0;
+  }
+
+
+  .subtitle_dt {
+    font-size: 17px;
+    font-weight: 700;
+    text-align: center;
+    margin: 0 20px;
+    height: 42px;
+    line-height: 43px;
+    color: #666
+  }
+
+  .jindu_mtrlmx {
+    border-top: 1px solid #f0f0f0;
+    margin: 0 20px;
+    font-size: 14px;
+    line-height: 20px;
+    padding: 10px 0;
+  }
+
+</style>

src/pages/orderzlmx.vue

@@ -1,13 +1,13 @@
 <template>
   <div>
-    <div class="topbar":class="colortop">
+    <div class="topbar">
       <div class="topbar_left">
         <svg class="icon" aria-hidden="true">
           <use xlink:href="#icon-fanhui"></use>
         </svg>
       </div>
       <div class="topbar_middle">
-        指令单详情
+        车间指令单详情
       </div>
       <div class="topbar_right">
         <svg class="icon" aria-hidden="true">
@@ -61,7 +61,7 @@
             <div class="taskinfo_dtitem leftsize">2018-09-10</div>
           </div>
           <div class="taskinfo_dttitle_dt">
-            <div class="title_dt rightside">交货日期：</div>
+            <div class="title_dt rightside">要求交期：</div>
             <div class="taskinfo_dtitem requiredate">2018-09-30</div>
           </div>
         </div>
@@ -86,14 +86,27 @@
           </div>
         </div>
 
+        <!-- class=dscrp这一块，只有 客户订单备注 或 特殊需求 有内容才显示 -->
         <div class="dscrp">
-          <svg class="icon" aria-hidden="true">
-            <use xlink:href="#icon-wentibuchong"></use>
-          </svg>备注
-          <!-- white-space: pre-wrap;用于正常显示回车换行 -->
-          <div style="white-space: pre-wrap;margin-top:5px">1.所有产品的汽杆质量一定要好，上票投诉很多升降有问题
+          <!-- 下面是客户订单备注字段，如果无内容，整个div不显示 -->
+          <div>
+            <svg class="icon" aria-hidden="true">
+              <use xlink:href="#icon-wentibuchong"></use>
+            </svg>备注
+            <!-- white-space: pre-wrap;用于正常显示回车换行 -->
+            <div style="white-space: pre-wrap;margin-top:5px">1.所有产品的汽杆质量一定要好，上票投诉很多升降有问题
 2.靠背网布的颜色和座垫网布的颜色要保持一致
 3.客户投诉W-42A喷塑不良，这次要注意，不要再出现此类问题</div>
+          </div>
+
+          <!-- 下面是特殊需求字段，如果无内容，整个div不显示 -->
+          <div style="margin-top:15px">
+            <svg class="icon" aria-hidden="true">
+              <use xlink:href="#icon-jinggao"></use>
+            </svg>特殊要求
+            <div style="white-space: pre-wrap;margin-top:5px">在喇叭盘下面贴上印有：MADE IN CHINA的不干胶！</div>
+          </div>
+
         </div>
 
         <div class="ordermx_fj">
@@ -132,25 +145,42 @@
 
       <div class="subtitle_dt">工组进度</div>
       <div class="jindu">
-        <div class="jindumx">
+        <div class="jindumx" @click="gotomxjd">
           <div>
             <div style="display:flex">
               <div>
-                <span style="font-size:15px;font-weight:bold">木工组</span>
-                <span style="color:#666;margin-left:5px">0/100</span>
+                <span style="font-size:15px;font-weight:bold">木工线</span>
               </div>
-              <div style="position:absolute;right:105px">
-                领完料<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-error"></use>
+              <div style="position:absolute;right:40px;color:#888">
+                排程审
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhengque1"></use>
                 </svg>
               </div>
-              <div style="position:absolute;right:40px">
-                排程审<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-wancheng"></use>
+            </div>
+            <div style="display:flex">
+              <div style="color:#666;background-color:#ddd;width:120px;border-radius: 5px;overflow:hidden">
+                <div style="color:#666;background-color:#8dc026;text-align:left;color:#fff;font-weight:bold":style="jdtwidth(80)">
+                  <span style="margin-left:10px">80/100</span></div>
+              </div>
+              <div style="position:absolute;right:40px;color:#888">
+                库存够料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhengque1"></use>
                 </svg>
               </div>
             </div>
-            <div style="color:#666">9/10 08:00~18:00</div>
+
+            <div style="display:flex">
+              <div style="color:#666">9/10 08:00~18:00</div>
+              <div style="position:absolute;right:40px;color:#888">
+                领完料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhengque1"></use>
+                </svg>
+              </div>
+            </div>
+
           </div>
           <div class="jindumx_pzbtn" style="color:#ccc">
             <svg class="icon" aria-hidden="true">
@@ -163,21 +193,38 @@
           <div>
             <div style="display:flex">
               <div>
-                <span style="font-size:15px;font-weight:bold">裁棉组</span>
-                <span style="color:#666;margin-left:5px">100/100</span>
+                <span style="font-size:15px;font-weight:bold">裁棉线</span>
+              </div>
+              <div style="position:absolute;right:40px;color:#888">
+                排程审
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhengque1"></use>
+                </svg>
+              </div>
+            </div>
+            <div style="display:flex">
+              <div style="color:#666;background-color:#ddd;width:120px;border-radius: 5px;overflow:hidden">
+                <div style="color:#666;background-color:#8dc026;text-align:left;color:#fff;font-weight:bold":style="jdtwidth(40)">
+                  <span style="margin-left:10px">40/100</span></div>
               </div>
-              <div style="position:absolute;right:105px">
-                领完料<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-wancheng"></use>
+              <div style="position:absolute;right:40px;color:#888">
+                库存够料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-weiwancheng"></use>
                 </svg>
               </div>
-              <div style="position:absolute;right:40px">
-                排程审<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-wancheng"></use>
+            </div>
+
+            <div style="display:flex">
+              <div style="color:#666">9/10 08:00~18:00</div>
+              <div style="position:absolute;right:40px;color:#888">
+                部分领料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-bufenfahuo"></use>
                 </svg>
               </div>
             </div>
-            <div style="color:#666">9/10 08:00~18:00</div>
+
           </div>
           <div class="jindumx_pzbtn" style="color:#ccc">
             <svg class="icon" aria-hidden="true">
@@ -190,21 +237,38 @@
           <div>
             <div style="display:flex">
               <div>
-                <span style="font-size:15px;font-weight:bold">裁面料组</span>
-                <span style="color:#666;margin-left:5px">40/100</span>
+                <span style="font-size:15px;font-weight:bold">裁面料线</span>
+              </div>
+              <div style="position:absolute;right:40px;color:#888">
+                排程审
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhengque1"></use>
+                </svg>
               </div>
-              <div style="position:absolute;right:105px">
-                领完料<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-wancheng"></use>
+            </div>
+            <div style="display:flex">
+              <div style="color:#666;background-color:#ddd;width:120px;border-radius: 5px;overflow:hidden">
+                <div style="color:#666;background-color:#8dc026;text-align:left;color:#fff;font-weight:bold":style="jdtwidth(0)">
+                  <span style="margin-left:10px">0/100</span></div>
+              </div>
+              <div style="position:absolute;right:40px;color:#888">
+                库存够料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-weiwancheng"></use>
                 </svg>
               </div>
-              <div style="position:absolute;right:40px">
-                排程审<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-wancheng"></use>
+            </div>
+
+            <div style="display:flex">
+              <div style="color:#666">9/10 08:00~18:00</div>
+              <div style="position:absolute;right:40px;color:#888">
+                未领料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-jianzhanbuzhouweiwan"></use>
                 </svg>
               </div>
             </div>
-            <div style="color:#666">9/10 08:00~18:00</div>
+
           </div>
           <div class="jindumx_pzbtn" style="color:#ccc">
             <svg class="icon" aria-hidden="true">
@@ -218,21 +282,38 @@
           <div>
             <div style="display:flex">
               <div>
-                <span style="font-size:15px;font-weight:bold">配件组</span>
-                <span style="color:#666;margin-left:5px">0/100</span>
+                <span style="font-size:15px;font-weight:bold">配件线</span>
               </div>
-              <div style="position:absolute;right:105px">
-                领完料<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-error"></use>
+              <div style="position:absolute;right:40px;color:#888">
+                排程审
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhengque1"></use>
                 </svg>
               </div>
-              <div style="position:absolute;right:40px">
-                排程审<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-wancheng"></use>
+            </div>
+            <div style="display:flex">
+              <div style="color:#666;background-color:#ddd;width:120px;border-radius: 5px;overflow:hidden">
+                <div style="color:#666;background-color:#8dc026;text-align:left;color:#fff;font-weight:bold":style="jdtwidth(0)">
+                  <span style="margin-left:10px">0/100</span></div>
+              </div>
+              <div style="position:absolute;right:40px;color:#888">
+                库存够料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-weiwancheng"></use>
                 </svg>
               </div>
             </div>
-            <div style="color:#666">9/11 08:00~18:00</div>
+
+            <div style="display:flex">
+              <div style="color:#666">9/11 08:00~18:00</div>
+              <div style="position:absolute;right:40px;color:#888">
+                未领料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-jianzhanbuzhouweiwan"></use>
+                </svg>
+              </div>
+            </div>
+
           </div>
           <div class="jindumx_pzbtn" style="color:#ccc">
             <svg class="icon" aria-hidden="true">
@@ -241,25 +322,43 @@
           </div>
         </div>
 
+
         <div class="jindumx">
           <div>
             <div style="display:flex">
               <div>
-                <span style="font-size:15px;font-weight:bold">装配组</span>
-                <span style="color:#666;margin-left:5px">0/100</span>
+                <span style="font-size:15px;font-weight:bold">装配线</span>
               </div>
-              <div style="position:absolute;right:105px">
-                领完料<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-error"></use>
+              <div style="position:absolute;right:40px;color:#888">
+                排程审
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhengque1"></use>
                 </svg>
               </div>
-              <div style="position:absolute;right:40px">
-                排程审<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-wancheng"></use>
+            </div>
+            <div style="display:flex">
+              <div style="color:#666;background-color:#ddd;width:120px;border-radius: 5px;overflow:hidden">
+                <div style="color:#666;background-color:#8dc026;text-align:left;color:#fff;font-weight:bold" :style="jdtwidth(0)">
+                  <span style="margin-left:10px">0/100</span></div>
+              </div>
+              <div style="position:absolute;right:40px;color:#888">
+                库存够料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-weiwancheng"></use>
+                </svg>
+              </div>
+            </div>
+
+            <div style="display:flex">
+              <div style="color:#666">9/11 08:00~18:00</div>
+              <div style="position:absolute;right:40px;color:#888">
+                未领料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-jianzhanbuzhouweiwan"></use>
                 </svg>
               </div>
             </div>
-            <div style="color:#666">9/11 08:00~18:00</div>
+
           </div>
           <div class="jindumx_pzbtn" style="color:#ccc">
             <svg class="icon" aria-hidden="true">
@@ -272,21 +371,38 @@
           <div>
             <div style="display:flex">
               <div>
-                <span style="font-size:15px;font-weight:bold">缝纫组</span>
-                <span style="color:#666;margin-left:5px">0/100</span>
+                <span style="font-size:15px;font-weight:bold">缝纫线</span>
               </div>
-              <div style="position:absolute;right:105px">
-                领完料<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-error"></use>
+              <div style="position:absolute;right:40px;color:#888">
+                排程审
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhengque1"></use>
                 </svg>
               </div>
-              <div style="position:absolute;right:40px">
-                排程审<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-wancheng"></use>
+            </div>
+            <div style="display:flex">
+              <div style="color:#666;background-color:#ddd;width:120px;border-radius: 5px;overflow:hidden">
+                <div style="color:#666;background-color:#8dc026;text-align:left;color:#fff;font-weight:bold" :style="jdtwidth(0)">
+                  <span style="margin-left:10px">0/100</span></div>
+              </div>
+              <div style="position:absolute;right:40px;color:#888">
+                库存够料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-weiwancheng"></use>
                 </svg>
               </div>
             </div>
-            <div style="color:#666">9/11 08:00~18:00</div>
+
+            <div style="display:flex">
+              <div style="color:#666">9/11 08:00~18:00</div>
+              <div style="position:absolute;right:40px;color:#888">
+                未领料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-jianzhanbuzhouweiwan"></use>
+                </svg>
+              </div>
+            </div>
+
           </div>
           <div class="jindumx_pzbtn" style="color:#ccc">
             <svg class="icon" aria-hidden="true">
@@ -301,20 +417,37 @@
             <div style="display:flex">
               <div>
                 <span style="font-size:15px;font-weight:bold">普通网椅线</span>
-                <span style="color:#666;margin-left:5px">0/100</span>
               </div>
-              <div style="position:absolute;right:105px">
-                领完料<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-error"></use>
+              <div style="position:absolute;right:40px;color:#888">
+                排程审
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-weiwancheng"></use>
                 </svg>
               </div>
-              <div style="position:absolute;right:40px">
-                排程审<svg class="icon" aria-hidden="true">
-                  <use xlink:href="#icon-wancheng"></use>
+            </div>
+            <div style="display:flex">
+              <div style="color:#666;background-color:#ddd;width:120px;border-radius: 5px;overflow:hidden">
+                <div style="color:#666;background-color:#8dc026;text-align:left;color:#fff;font-weight:bold":style="jdtwidth(0)">
+                  <span style="margin-left:10px">0/100</span></div>
+              </div>
+              <div style="position:absolute;right:40px;color:#888">
+                库存够料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-weiwancheng"></use>
                 </svg>
               </div>
             </div>
-            <div style="color:#666">9/11 08:00~18:00</div>
+
+            <div style="display:flex">
+              <div style="color:#666">9/11 08:00~18:00</div>
+              <div style="position:absolute;right:40px;color:#888">
+                未领料
+                <svg class="icon" aria-hidden="true">
+                  <use xlink:href="#icon-jianzhanbuzhouweiwan"></use>
+                </svg>
+              </div>
+            </div>
+
           </div>
           <div class="jindumx_pzbtn" style="color:#ccc">
             <svg class="icon" aria-hidden="true">
@@ -324,36 +457,53 @@
         </div>
       </div>
 
-
-      <div class="liubai_dt" v-if="ifqty==1"></div>
+      <!-- 以下区域暂时弃用 -->
+      <!-- <div class="liubai_dt" v-if="ifqty==1"></div>
 
       <div class="subtitle_dt" v-if="ifqty==1">缺料明细</div>
       <div class="jindu" v-if="ifqty==1">
         <div class="order_mxmtrl_dt">
-          <span
-            style="font-size:12px;background-color:#fc4e2c;color:#fff;padding: 2px 6px;border-radius: 15px;">木工组</span>
-          <span>W-119G-1扶手加强铁片 30*30*1.8MM内放孔10*10MM</span>
-          <span style="color:#888;margin-left:5px">×100块</span>
-          <span style="color:#888;margin-left:5px">未领数：100，库存可用：80，缺20</span>
+          <div>
+            <span style="font-size:12px;background-color:#fc4e2c;color:#fff;padding: 2px 6px;border-radius: 15px;">木工组
+            </span>
+            <span style="margin-left:5px">W-119G-1扶手加强铁片 30*30*1.8MM内放孔10*10MM</span>
+          </div>
+          <div>
+            <span style="color:#888">100块;</span>
+            <span style="color:#888;margin-left:5px">未领100，库存80</span>
+            <span style="color:#f00;font-weight:bold;position:absolute;right:30px">缺料：20</span>
+          </div>
         </div>
 
         <div class="order_mxmtrl_dt">
-          <span
-            style="font-size:12px;background-color:#fc4e2c;color:#fff;padding: 2px 6px;border-radius: 15px;">装配组</span>
-          <span>大扁头内六角螺丝（高等发黑） M6*20MM</span>
-          <span style="color:#888;margin-left:5px">×100块</span>
-          <span style="color:#888;margin-left:5px">未领数：20，库存可用：0，缺20</span>
+          <div>
+            <span style="font-size:12px;background-color:#fc4e2c;color:#fff;padding: 2px 6px;border-radius: 15px;">装配组
+            </span>
+            <span style="margin-left:5px">大扁头内六角螺丝（高等发黑） M6*20MM</span>
+          </div>
+          <div>
+            <span style="color:#888">100块;</span>
+            <span style="color:#888;margin-left:5px">未领100，库存80</span>
+            <span style="color:#f00;font-weight:bold;position:absolute;right:30px">缺料：20</span>
+          </div>
         </div>
 
         <div class="order_mxmtrl_dt">
-          <span
-            style="font-size:12px;background-color:#fc4e2c;color:#fff;padding: 2px 6px;border-radius: 15px;">配件组</span>
-          <span>自封袋 9*13cm</span>
-          <span style="color:#888;margin-left:5px">×100只</span>
-          <span style="color:#888;margin-left:5px">未领数：100，库存可用：80，缺20</span>
+          <div>
+            <span style="font-size:12px;background-color:#fc4e2c;color:#fff;padding: 2px 6px;border-radius: 15px;">配件组
+            </span>
+            <span style="margin-left:5px">自封袋 9*13cm</span>
+          </div>
+          <div>
+            <span style="color:#888">100只;</span>
+            <span style="color:#888;margin-left:5px">未领100，库存80</span>
+            <span style="color:#f00;font-weight:bold;position:absolute;right:30px">缺料：20</span>
+          </div>
         </div>
 
-      </div>
+
+
+      </div> -->
 
     </div>
 
@@ -367,7 +517,7 @@
     data() {
       return {
         taskflag_dt: '在进行',
-        ifqty:1 //0-不缺料 1-缺料
+        ifqty: 1 //0-不缺料 1-缺料
       };
     },
     computed: {
@@ -377,7 +527,24 @@
           bgcolorgreen: this.taskflag_dt == "在进行",
           bgcolorblue: this.taskflag_dt == "已完成"
         };
+      }
+    },
+    methods: {
+      goback() {
+        {
+          history.back();
+        }
+      },
+      gotomxjd() {
+        this.$router.push({
+          path: "/orderwkpmx"
+        });
       },
+      jdtwidth:function(x){
+        return{
+          'width':x+'%'
+        }
+      }
     }
   }
 
@@ -394,7 +561,7 @@
 
   .topbar {
     min-height: 44px;
-    /* border-bottom: 1px solid #e5e5e5; */
+    border-bottom: 1px solid #e5e5e5;
     background: #fff;
     position: fixed;
     width: 100%;
@@ -402,7 +569,7 @@
     display: flex;
     font-size: 18px;
     align-items: center;
-    color:#fff
+    /* color:#fff */
   }
 
   .topbar_left {
@@ -614,7 +781,9 @@
   .order_mxmtrl_dt {
     border-bottom: 1px solid #f0f0f0;
     padding: 8px 0;
-    line-height: 22px
+    line-height: 22px;
+    /* display: flex;
+    align-items: center; */
   }
 
 </style>

src/router/index.js

@@ -42,6 +42,7 @@ import DmHome from '@/pages/dmweb/dmhome'
 import HomeRp from '@/pages/homerp'
 import OrderZl from '@/pages/orderzl'
 import OrderZLMX from '@/pages/orderzlmx'
+import OrderWkpMx from '@/pages/orderwkpmx'
 
 Vue.use(Router)
 
@@ -60,6 +61,14 @@ export default new Router({
         title: '工作任务'
       }
     },
+    {
+      path: '/orderwkpmx',
+      name: 'OrderWkpMx',
+      component: OrderWkpMx,
+      meta: {
+        title: '工组详情'
+      }
+    },
     {
       path: '/orderzlmx',
       name: 'OrderZLMX',