报表改用新样式；taskview兼容设备维护类型的任务

src/pages/report/custreport.vue

@@ -1,11 +1,8 @@
 // 排名类报表通用UI
 <template>
   <div class="daily">
-    <div class="reportcom-header-wap">
+    <!-- <div class="reportcom-header-wap">
       <div class="reportcom-header">
-        <!-- <div class='reportcom-logo'>
-          <img src="../../assets/longjoe.png" class="reportcom-img-responsive"></img>
-        </div> -->
         <div class="reportcom-header-title" style="font-size:28px" v-if="reporttype==0">业务员销售排名统计表</div>
         <div class="reportcom-header-title" style="font-size:28px" v-if="reporttype==1">客户销售排名统计表</div>
         <div class="reportcom-header-title" style="font-size:28px" v-if="reporttype==2">产品销售排名统计表</div>
@@ -19,63 +16,90 @@
       </div>
       <div class="reportcom-header-sub"></div>
       <div class="reportcom-header-sub-two"></div>
-    </div>
+    </div> -->
 
-    <div class="report_selection">
-      <div class='report_selection_check'>销售额</div>
-      <div style="margin-left:50px">利润</div>
+<!-- 顶部标题栏 -->
+    <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">
+        <span v-if="reporttype==0">业务员销售排名统计表</span>
+        <span v-if="reporttype==1">客户销售排名统计表</span>
+        <span v-if="reporttype==2">产品销售排名统计表</span>
+      </div>
+      <div class="topbar_right">
+      </div>
     </div>
 
-    <div class="daily-sale">
+<!-- 增加了 class="rpmain" 的div 包裹原有报表主体内容
+增加 class="rpdate" 的div 去实现原有的日期范围功能 -->
+    <div class="rpmain">
+      <div class="rpdate">2019.01 ~ 2019.06
+        <span style="font-size:15px">
+          <svg class="icon" aria-hidden="true">
+            <use xlink:href="#icon-xuanze1"></use>
+          </svg>
+        </span>
+      </div>
 
-      <div class="img_wap" v-if="reporttype != 2">
-        <div style="flex:0 0 90%;margin: 0 auto;">
-          <img src="../../assets/bingtu_01.jpg" class="img-bingtu" v-if="reporttype==0"></img>
-          <img src="../../assets/bingtu_02.jpg" class="img-bingtu" v-if="reporttype==1"></img>
-        </div>
+      <div class="report_selection">
+        <div class='report_selection_check'>销售额</div>
+        <div style="margin-left:50px">利润</div>
       </div>
 
-      <div class="daily-sale-cust">
+      <div class="daily-sale">
 
-        <div class="daily-sale-cust-list" v-for="(saleritem,index) in saleramtlist" :key="index">
-          <div class="daily-sale-cust-index">
-            <div v-if="index>2">
-              {{index+1}}
-            </div>
-            <svg class="icon" aria-hidden="true" v-if="index<=2">
-              <use xlink:href="#icon-jiangpai-" v-if="index == 0"></use>
-              <use xlink:href="#icon-jiangpai-2" v-if="index == 1"></use>
-              <use xlink:href="#icon-jiangpai-1" v-if="index == 2"></use>
-            </svg>
+        <div class="img_wap" v-if="reporttype != 2">
+          <div style="flex:0 0 90%;margin: 0 auto;">
+            <img src="../../assets/bingtu_01.jpg" class="img-bingtu" v-if="reporttype==0"></img>
+            <img src="../../assets/bingtu_02.jpg" class="img-bingtu" v-if="reporttype==1"></img>
           </div>
-          <div class="daily-sale-cust-name">
-
-            <div v-if="reporttype==1">{{saleritem.cusname}}</div>
-            <div v-if="reporttype==2">{{saleritem.mtrlname}}</div>
-            <div style="display:flex;align-items: center">
-              <div style="margin-right:30px" v-if="reporttype==0">{{saleritem.salername}}</div>
-              <div class="daily-sale-cust-amt">{{saleritem.amt}}元</div>
-              <div class="saler_percent">占比 {{saleritem.percent}}</div>
+        </div>
+
+        <div class="daily-sale-cust">
+
+          <div class="daily-sale-cust-list" v-for="(saleritem,index) in saleramtlist" :key="index">
+            <div class="daily-sale-cust-index">
+              <div v-if="index>2">
+                {{index+1}}
+              </div>
+              <svg class="icon" aria-hidden="true" v-if="index<=2">
+                <use xlink:href="#icon-jiangpai-" v-if="index == 0"></use>
+                <use xlink:href="#icon-jiangpai-2" v-if="index == 1"></use>
+                <use xlink:href="#icon-jiangpai-1" v-if="index == 2"></use>
+              </svg>
+            </div>
+            <div class="daily-sale-cust-name">
+
+              <div v-if="reporttype==1">{{saleritem.cusname}}</div>
+              <div v-if="reporttype==2">{{saleritem.mtrlname}}</div>
+              <div style="display:flex;align-items: center">
+                <div style="margin-right:30px" v-if="reporttype==0">{{saleritem.salername}}</div>
+                <div class="daily-sale-cust-amt">{{saleritem.amt}}元</div>
+                <div class="saler_percent">占比 {{saleritem.percent}}</div>
+              </div>
             </div>
           </div>
         </div>
-      </div>
 
-    </div>
+      </div>
 
-    <div class="report_other">
-      <div>
-        <svg class="icon" aria-hidden="true">
-          <use xlink:href="#icon-tishi"></use>
-        </svg>
-        您还可以查看其它报表：</div>
-      <div class="report_other_link" v-if="reporttype != 0">业务员销售排名统计表</div>
-      <div class="report_other_link" v-if="reporttype != 1">客户销售排名统计表</div>
-      <div class="report_other_link" v-if="reporttype != 2">产品销售排名统计表</div>
-      <div class="report_other_link">销售订单统计表</div>
-      <div class="report_other_link">在进行出口订单异常统计表</div>
+      <div class="report_other">
+        <div>
+          <svg class="icon" aria-hidden="true">
+            <use xlink:href="#icon-tishi"></use>
+          </svg>
+          您还可以查看其它报表：</div>
+        <div class="report_other_link" v-if="reporttype != 0">业务员销售排名统计表</div>
+        <div class="report_other_link" v-if="reporttype != 1">客户销售排名统计表</div>
+        <div class="report_other_link" v-if="reporttype != 2">产品销售排名统计表</div>
+        <div class="report_other_link">销售订单统计表</div>
+        <div class="report_other_link">在进行出口订单异常统计表</div>
+      </div>
     </div>
-
   </div>
 </template>
 <script>
@@ -168,6 +192,48 @@
     font-family: "微软雅黑";
   }
 
+
+  .topbar {
+    min-height: 44px;
+    border-bottom: 1px solid #e5e5e5;
+    background: #fff;
+    position: fixed;
+    width: 100%;
+    z-index: 9997;
+    display: flex;
+    font-size: 18px;
+    align-items: center;
+  }
+
+  .topbar_left {
+    flex: 0 0 20px;
+    margin-left: 10px;
+  }
+
+  .topbar_middle {
+    /* text-align: center; */
+    padding: 0 0 0 10px;
+    flex: 0 0 89%;
+  }
+
+  .topbar_right {
+    flex: 0 0 20px;
+    position: absolute;
+    right: 10px;
+  }
+
+  .rpmain {
+    position: absolute;
+    top: 44px;
+    width: 100%;
+  }
+
+  .rpdate {
+    padding: 15px 20px;
+    margin: 0 0 10px 0;
+    background-color: #f6f6f6;
+  }
+
   .img_wap {
     display: flex;
     margin-top: 20px;

src/pages/report/saletaskreport.vue

@@ -1,13 +1,8 @@
-
 <template>
   <div class="daily">
-    <div class="reportcom-header-wap">
+    <!-- <div class="reportcom-header-wap">
       <div class="reportcom-header">
-        <!-- <div class='reportcom-logo'>
-          <img src="../../assets/longjoe.png" class="reportcom-img-responsive"></img>
-        </div> -->
         <div class="reportcom-header-title" style="font-size:28px">销售订单收款统计表</div>
-        <!-- <div class="reportcom-header-title" style="font-size:28px">新增销售订单统计表</div> -->
         <div class="reportcom-header-title" style="font-size:18px">2019.01 ~ 2019.06
           <span style="font-size:15px">
             <svg class="icon" aria-hidden="true">
@@ -18,6 +13,20 @@
       </div>
       <div class="reportcom-header-sub"></div>
       <div class="reportcom-header-sub-two"></div>
+    </div> -->
+
+<!-- 顶部标题栏 -->
+    <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">
+      </div>
     </div>
 
     <!-- <div class="report_selection">
@@ -25,81 +34,91 @@
       <div style="margin-left:50px">利润</div>
     </div> -->
 
+<!-- 增加了 class="rpmain" 的div 包裹原有报表主体内容
+增加 class="rpdate" 的div 去实现原有的日期范围功能 -->
+    <div class="rpmain">
 
+      <div class="rpdate">2019.01 ~ 2019.06
+        <span style="font-size:15px">
+          <svg class="icon" aria-hidden="true">
+            <use xlink:href="#icon-xuanze1"></use>
+          </svg>
+        </span>
+      </div>
 
-    <div class="daily-sale">
-      <div style="font-size:14px;color:#666;display:flex">
+      <div class="daily-sale">
+        <div style="font-size:14px;color:#666;display:flex">
           <div style="margin:0 auto">
-        <span>总金额:7900万</span>
-        <span style="margin-left:10px">柜数:700</span>
-        <span style="margin-left:10px">客户数:48</span>
-        <span style="margin-left:10px">订单数:680</span>
+            <span>总金额:7900万</span>
+            <span style="margin-left:10px">柜数:700</span>
+            <span style="margin-left:10px">客户数:48</span>
+            <span style="margin-left:10px">订单数:680</span>
+          </div>
+        </div>
+        <div class="img_wap">
+          <div style="flex:0 0 90%;margin: 0 auto;">
+            <img src="../../assets/zhexian_0619_01.jpg" class="img-bingtu"></img>
           </div>
-      </div>
-      <div class="img_wap">
-        <div style="flex:0 0 90%;margin: 0 auto;">
-          <img src="../../assets/zhexian_0619_01.jpg" class="img-bingtu"></img>
         </div>
-      </div>
 
-      <div class="liubai"></div>
+        <div class="liubai"></div>
 
-      <div style="display:flex;font-size:16px;font-weight:bold;color:#666;">
-        <div style="margin:0 auto">区域占比</div>
-      </div>
-      <div class="img_wap">
-        <div style="flex:0 0 90%;margin: 0 auto;">
-          <img src="../../assets/bingtu_0619_01.jpg" class="img-bingtu"></img>
+        <div style="display:flex;font-size:16px;font-weight:bold;color:#666;">
+          <div style="margin:0 auto">区域占比</div>
+        </div>
+        <div class="img_wap">
+          <div style="flex:0 0 90%;margin: 0 auto;">
+            <img src="../../assets/bingtu_0619_01.jpg" class="img-bingtu"></img>
+          </div>
         </div>
-      </div>
-
-      <div class="liubai"></div>
 
+        <div class="liubai"></div>
 
-      <div style="display:flex;font-size:16px;font-weight:bold;color:#666;">
-        <div style="margin:0 auto">业务员占比</div>
-      </div>
 
-      <div class="daily-sale-cust">
+        <div style="display:flex;font-size:16px;font-weight:bold;color:#666;">
+          <div style="margin:0 auto">业务员占比</div>
+        </div>
 
-        <div class="daily-sale-cust-list" v-for="(saleritem,index) in saleramtlist" :key="index">
-          <div class="daily-sale-cust-index">
-            <div v-if="index>2">
-              {{index+1}}
+        <div class="daily-sale-cust">
+
+          <div class="daily-sale-cust-list" v-for="(saleritem,index) in saleramtlist" :key="index">
+            <div class="daily-sale-cust-index">
+              <div v-if="index>2">
+                {{index+1}}
+              </div>
+              <svg class="icon" aria-hidden="true" v-if="index<=2">
+                <use xlink:href="#icon-jiangpai-" v-if="index == 0"></use>
+                <use xlink:href="#icon-jiangpai-2" v-if="index == 1"></use>
+                <use xlink:href="#icon-jiangpai-1" v-if="index == 2"></use>
+              </svg>
             </div>
-            <svg class="icon" aria-hidden="true" v-if="index<=2">
-              <use xlink:href="#icon-jiangpai-" v-if="index == 0"></use>
-              <use xlink:href="#icon-jiangpai-2" v-if="index == 1"></use>
-              <use xlink:href="#icon-jiangpai-1" v-if="index == 2"></use>
-            </svg>
-          </div>
-          <div class="daily-sale-cust-name">
+            <div class="daily-sale-cust-name">
 
-            <!-- <div v-if="reporttype==1">{{saleritem.cusname}}</div>
+              <!-- <div v-if="reporttype==1">{{saleritem.cusname}}</div>
             <div v-if="reporttype==2">{{saleritem.mtrlname}}</div> -->
-            <div style="display:flex;align-items: center">
-              <div style="margin-right:30px" >{{saleritem.salername}}</div>
-              <div class="daily-sale-cust-amt">{{saleritem.amt}}元</div>
-              <div class="saler_percent">占比 {{saleritem.percent}}</div>
+              <div style="display:flex;align-items: center">
+                <div style="margin-right:30px">{{saleritem.salername}}</div>
+                <div class="daily-sale-cust-amt">{{saleritem.amt}}元</div>
+                <div class="saler_percent">占比 {{saleritem.percent}}</div>
+              </div>
             </div>
           </div>
         </div>
-      </div>
 
-    </div>
+      </div>
 
-    <div class="report_other">
-      <div>
-        <svg class="icon" aria-hidden="true">
-          <use xlink:href="#icon-tishi"></use>
-        </svg>
-        您还可以查看其它报表：</div>
-      <div class="report_other_link">业务员销售排名统计表</div>
-      <div class="report_other_link">客户销售排名统计表</div>
-      <div class="report_other_link">产品销售排名统计表</div>
-      <div class="report_other_link">在进行出口订单异常统计表</div>
+      <div class="report_other">
+        <div>
+          <svg class="icon" aria-hidden="true">
+            <use xlink:href="#icon-tishi"></use>
+          </svg>
+          您还可以查看其它报表：</div>
+        <div class="report_other_link">业务员销售排名统计表</div>
+        <div class="report_other_link">客户销售排名统计表</div>
+        <div class="report_other_link">产品销售排名统计表</div>
+        <div class="report_other_link">在进行出口订单异常统计表</div>
+      </div>
     </div>
-
   </div>
 </template>
 <script>
@@ -192,6 +211,47 @@
     font-family: "微软雅黑";
   }
 
+  .topbar {
+    min-height: 44px;
+    border-bottom: 1px solid #e5e5e5;
+    background: #fff;
+    position: fixed;
+    width: 100%;
+    z-index: 9997;
+    display: flex;
+    font-size: 18px;
+    align-items: center;
+  }
+
+  .topbar_left {
+    flex: 0 0 20px;
+    margin-left: 10px;
+  }
+
+  .topbar_middle {
+    /* text-align: center; */
+    padding: 0 0 0 10px;
+    flex: 0 0 89%;
+  }
+
+  .topbar_right {
+    flex: 0 0 20px;
+    position: absolute;
+    right: 10px;
+  }
+
+  .rpmain {
+    position: absolute;
+    top: 44px;
+    width: 100%;
+  }
+
+  .rpdate {
+    padding: 15px 20px;
+    margin:0 0 10px 0;
+    background-color: #f6f6f6;
+  }
+
   .img_wap {
     display: flex;
     margin-top: 20px;

src/pages/taskview.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <div class="topbar">
-      <div class="topbar_left" @click="goback">
+      <div class="topbar_left">
         <svg class="icon" aria-hidden="true">
           <use xlink:href="#icon-fanhui"></use>
         </svg>
@@ -19,7 +19,9 @@
     <div class="taskview_toparea" :class="colortop">
       <div class="taskview_top_type" v-if="tasktype==0">临时任务</div>
       <div class="taskview_top_type" v-if="tasktype==1">客户走访</div>
-      <div class="taskview_top_type" v-if="tasktype==2">稽核检查</div>
+      <div class="taskview_top_type" v-if="tasktype==2">设备维护</div>
+      <div class="taskview_top_type" v-if="tasktype==3">工作节点</div>
+      <div class="taskview_top_type" v-if="tasktype==4">稽核检查</div>
       <div class="taskview_top_delay" v-if="taskflag_dt=='未完成'">超期</div>
       <div class="taskview_top_flag">{{taskflag_dt}}</div>
     </div>
@@ -29,22 +31,58 @@
     <div class="taskview">
 
       <div class="taskview_main">
-        <div class="taskview_info">
+        <div class="taskview_info" v-if="tasktype<=1">
           <span v-if="tasktype==0">跟设计公司沟通，定好最新一季宣传画册的设计。</span>
           <span v-if="tasktype==1">了解客户上一批货的销售情况及质量反馈，并介绍本季最新产品。</span>
         </div>
 
-        <div class="taskview_flex">
-          <div class="taskview_title">稽核类目</div>
-          <div class="taskview_item">车间检查-卫生检查</div>
-        </div>
+        <!-- 设备维护计划 -->
+        <div v-if="tasktype==2">
+          <div class="taskview_flex">
+            <div class="taskview_title">设备编号</div>
+            <div class="taskview_item">572-102</div>
+          </div>
 
-        <div class="taskview_flex">
-          <div class="taskview_title">责任人</div>
-          <div class="taskview_item">王磊磊</div>
+          <div class="taskview_flex">
+            <div class="taskview_title">设备名称</div>
+            <div class="taskview_item">2#气密机</div>
+          </div>
+
+          <div class="taskview_flex">
+            <div class="taskview_title">设备种类</div>
+            <div class="taskview_item">气密机</div>
+          </div>
+
+          <div class="taskview_flex">
+            <div class="taskview_title">生产线</div>
+            <div class="taskview_item">减震器焊接6线</div>
+          </div>
+
+          <div class="taskview_flex">
+            <div class="taskview_title">计划摘要</div>
+            <div class="taskview_item">控制阀门，仪表，空压</div>
+          </div>
+
+          <div class="taskview_flex" style="margin:10px 0 0 0 ;color:#777">
+            <div class="taskview_title">维护标准</div>
+          </div>
+          <div class="taskview_check_dscrp">
+            <span>无渗漏，无变形，无破损，无异响，无异物，无锈迹，无松动，功能可靠。</span>
+          </div>
         </div>
 
-        <div v-if="tasktype==2">
+        <!-- 稽核检查类型的内容 -->
+        <div v-if="tasktype==4">
+          <div class="taskview_flex">
+            <div class="taskview_title">稽核类目</div>
+            <div class="taskview_item">车间检查-卫生检查</div>
+          </div>
+
+          <div class="taskview_flex">
+            <div class="taskview_title">责任人</div>
+            <div class="taskview_item">王磊磊</div>
+          </div>
+
           <div class="taskview_flex" style="margin:10px 0 0 0 ;color:#777">
             <div class="taskview_title">及格标准</div>
           </div>
@@ -52,23 +90,48 @@
           <div class="taskview_check_dscrp">
             <span>地面清洁无灰尘、无垃圾、无油污、无积水、无死角。墙壁(角)清洁无污染、无蛛网、无死角。门窗明亮干净、无积灰、无污迹、无蛛网。</span>
           </div>
+
+          <!-- 附件图片，直接显示缩略图 -->
+          <div style="display:flex;margin:10px 0 0 20px;">
+            <div>
+              <img src="../assets/taskview_01.jpeg"
+                style="height: 60px;box-shadow: 0 2px 3px rgba(0, 0, 0, 0.302);"></img>
+            </div>
+
+            <div style="margin-left:10px">
+              <img src="../assets/taskview_02.jpg"
+                style="height: 60px;box-shadow: 0 2px 3px rgba(0, 0, 0, 0.302);"></img>
+            </div>
+          </div>
         </div>
 
-        <!-- 附件图片，直接显示缩略图 -->
-        <div style="display:flex;margin:10px 0 0 20px;" v-if="tasktype==2">
-          <div>
-            <img src="../assets/taskview_01.jpeg"
-              style="height: 60px;box-shadow: 0 2px 3px rgba(0, 0, 0, 0.302);"></img>
+        <!-- 工作节点类型的内容 -->
+        <div v-if="tasktype==3">
+          <div class="taskview_flex">
+            <div class="taskview_title">单据编号</div>
+            <div class="taskview_item">SG191026001</div>
+          </div>
+          <div class="taskview_flex">
+            <div class="taskview_title">客户名称</div>
+            <div class="taskview_item">西班牙斗牛贸易有限公司</div>
+          </div>
+          <div class="taskview_flex">
+            <div class="taskview_title">任务</div>
+            <div class="taskview_item">收唛头</div>
+          </div>
+          <div class="taskview_flex">
+            <div class="taskview_title">详细要求</div>
+            <div class="taskview_item">联系客户，让客户提供唛头版式，并整理好上传到唛头附件通知技术部。</div>
           </div>
 
-          <div style="margin-left:10px">
-            <img src="../assets/taskview_02.jpg" style="height: 60px;box-shadow: 0 2px 3px rgba(0, 0, 0, 0.302);"></img>
+          <div style="display:flex">
+            <div style="font-size:14px;color:#6495ed;margin: 10px auto 0 auto">查看单据详细信息</div>
           </div>
         </div>
 
         <!-- 下面是非图片附件区域，根据实际是否有附件决定显示与否 -->
         <div style="margin-top:10px;">
-          <div class="taskview_fjlist" v-if="tasktype!=2">
+          <div class="taskview_fjlist" v-if="tasktype==0||tasktype==1">
             <div>
               <svg class="icon" aria-hidden="true">
                 <use xlink:href="#icon-yasuobao"></use>
@@ -82,7 +145,7 @@
 
           </div>
 
-          <div class="taskview_fjlist" v-if="tasktype!=2">
+          <div class="taskview_fjlist" v-if="tasktype==0||tasktype==1">
             <div>
               <svg class="icon" aria-hidden="true">
                 <use xlink:href="#icon-yasuobao"></use>
@@ -96,7 +159,7 @@
 
           </div>
 
-          <div class="taskview_fjlist" v-if="tasktype==2">
+          <div class="taskview_fjlist" v-if="tasktype==4">
             <div>
               <svg class="icon" aria-hidden="true">
                 <use xlink:href="#icon-WORD"></use>
@@ -199,20 +262,22 @@
 
         <div class="taskview_flex" v-if="taskflag_dt!='未完成'">
           <div class="taskview_title">
-            <span v-if="tasktype!=2">任务汇报</span>
-            <span v-if="tasktype==2">检查结果</span>
+            <span v-if="tasktype!=4">任务汇报</span>
+            <span v-if="tasktype==4">检查结果</span>
           </div>
           <div class="taskview_item">
             <span v-if="tasktype==0">已沟通好设计方案，详情见附件</span>
             <span v-if="tasktype==1">已电话回访客户，销售情况及质量都比较理想，并对我司新一季产品感兴趣。</span>
-            <span v-if="tasktype==2">合格</span>
+            <span v-if="tasktype==2">已按维护标准进行了检查，一切参数正常。</span>
+            <span v-if="tasktype==3">已整理好唛头附件并通知技术部。</span>
+            <span v-if="tasktype==4">合格</span>
           </div>
         </div>
 
 
         <!-- 附件图片，直接显示缩略图 -->
         <div style="display:flex;margin:10px 0 0 20px;" v-if="taskflag_dt!='未完成'">
-          <div v-if="tasktype==2">
+          <div v-if="tasktype==4">
             <img src="../assets/taskview_03.jpg" style="height: 60px;box-shadow: 0 2px 3px rgba(0, 0, 0, 0.302);"></img>
           </div>
 
@@ -226,7 +291,7 @@
           </div>
         </div>
 
-        <div class="taskview_fjlist" style="margin-top:10px;" v-if="taskflag_dt!='未完成'">
+        <div class="taskview_fjlist" style="margin-top:10px;" v-if="taskflag_dt!='未完成'&&tasktype!=2">
           <div v-if="tasktype==0">
             <svg class="icon" aria-hidden="true">
               <use xlink:href="#icon-yasuobao"></use>
@@ -241,7 +306,7 @@
             回访记录.docx
           </div>
 
-          <div v-if="tasktype==2">
+          <div v-if="tasktype==4">
             <svg class="icon" aria-hidden="true">
               <use xlink:href="#icon-WORD"></use>
             </svg>
@@ -250,49 +315,51 @@
 
           <div class="taskview_fjsize">
             <span v-if="tasktype==0">31.4M</span>
-            <span v-if="tasktype!=0">1.4M</span>
+            <span v-if="tasktype==4">1.4M</span>
           </div>
 
         </div>
 
+        <div v-if="tasktype!=2&&tasktype!=3">
+          <div class="liubai_dt"></div>
 
-        <div class="liubai_dt"></div>
-        <div class="taskview_flex">
-          <div class="taskview_title">验收人</div>
-          <div class="taskview_item">李学朋</div>
-        </div>
+          <div class="taskview_flex">
+            <div class="taskview_title">验收人</div>
+            <div class="taskview_item">李学朋</div>
+          </div>
 
-        <div class="taskview_flex" v-if="taskflag_dt=='已验收'">
-          <div class="taskview_title">评分</div>
-          <div class="taskview_item" style="font-size:22px;">
-            <svg class="icon" aria-hidden="true">
-              <use xlink:href="#icon-xing1"></use>
-            </svg>
-            <svg class="icon" aria-hidden="true">
-              <use xlink:href="#icon-xing1"></use>
-            </svg>
-            <svg class="icon" aria-hidden="true">
-              <use xlink:href="#icon-xing1"></use>
-            </svg>
-            <svg class="icon" aria-hidden="true">
-              <use xlink:href="#icon-xing"></use>
-            </svg>
-            <svg class="icon" aria-hidden="true">
-              <use xlink:href="#icon-xing"></use>
-            </svg>
+          <div class="taskview_flex" v-if="taskflag_dt=='已验收'">
+            <div class="taskview_title">评分</div>
+            <div class="taskview_item" style="font-size:22px;">
+              <svg class="icon" aria-hidden="true">
+                <use xlink:href="#icon-xing1"></use>
+              </svg>
+              <svg class="icon" aria-hidden="true">
+                <use xlink:href="#icon-xing1"></use>
+              </svg>
+              <svg class="icon" aria-hidden="true">
+                <use xlink:href="#icon-xing1"></use>
+              </svg>
+              <svg class="icon" aria-hidden="true">
+                <use xlink:href="#icon-xing"></use>
+              </svg>
+              <svg class="icon" aria-hidden="true">
+                <use xlink:href="#icon-xing"></use>
+              </svg>
+            </div>
           </div>
-        </div>
 
-        <div class="taskview_flex" v-if="taskflag_dt=='已验收'">
-          <div class="taskview_title">评语</div>
-          <div class="taskview_item">下次争取准时完成任务。</div>
+          <div class="taskview_flex" v-if="taskflag_dt=='已验收'">
+            <div class="taskview_title">评语</div>
+            <div class="taskview_item">下次争取准时完成任务。</div>
+          </div>
         </div>
 
       </div>
 
     </div>
 
-    <div class="quote_edit_btn_wrap" v-if="taskflag_dt!='已验收'">
+    <div class="quote_edit_btn_wrap" v-if="taskflag_dt!='已验收'&&taskflag_dt!='已完成'">
       <div class="quote_edit_btn">
         <span v-if="taskflag_dt=='未完成'">完成任务</span>
         <span v-if="taskflag_dt=='待验收'">验收</span>
@@ -340,7 +407,7 @@
         </div>
 
 
-        <div style="margin:10px 20px 0px 20px;font-size:15px" v-if="tasktype==2&ifresponse!=2">
+        <div style="margin:10px 20px 0px 20px;font-size:15px" v-if="tasktype==4&ifresponse!=2">
           <span style="color:#666">检查结果</span>
           <span style="margin:0 0 0 5px;">合格</span><svg class="icon" aria-hidden="true">
             <use xlink:href="#icon-xiala"></use>
@@ -413,29 +480,29 @@
     name: 'taskview',
     data() {
       return {
-        tasktype: 2, //0-临时任务 1-客户走访 2-稽核检查
-        taskflag_dt: "未完成", //未完成,待验收,已验收
+        tasktype: 3, //0-临时任务 1-客户走访 2-设备维护 3-单据关联 4-稽核检查
+        taskflag_dt: "已完成", //未完成,待验收,已验收 已完成 （3-单据关联 2-设备维护 这两类的任务，目前只有：未完成、已完成 这两个状态。其余类型的任务，如果设了不用验收，也是这两个状态）
         ifresponse: 0, //弹窗 0：不弹  1：完成任务界面 2：验收任务界面
-        iffg: 1 //0-不是返工 1-返工
+        iffg: 0 //0-不是返工 1-返工
       }
     },
     computed: {
       colortop: function () {
         return {
           taskview_toparea_green: this.taskflag_dt == "待验收",
-          taskview_toparea_blue: this.taskflag_dt == "已验收"
+          taskview_toparea_blue: this.taskflag_dt == "已验收" || this.taskflag_dt == "已完成"
         };
       },
       colortop_sec: function () {
         return {
           taskview_toparea_green_sec: this.taskflag_dt == "待验收",
-          taskview_toparea_blue_sec: this.taskflag_dt == "已验收"
+          taskview_toparea_blue_sec: this.taskflag_dt == "已验收" || this.taskflag_dt == "已完成"
         };
       },
       colortop_thr: function () {
         return {
           taskview_toparea_green_thr: this.taskflag_dt == "待验收",
-          taskview_toparea_blue_thr: this.taskflag_dt == "已验收"
+          taskview_toparea_blue_thr: this.taskflag_dt == "已验收" || this.taskflag_dt == "已完成"
         };
       },
       response_height: function () {
@@ -621,7 +688,7 @@
 
   .taskview {
     position: absolute;
-    top: 90px;
+    top: 100px;
     width: 100%;
     margin-bottom: 80px;
   }