feat(WMS历史轨迹): WMS历史轨迹增加字段显示隐藏设置

WMS历史轨迹增加字段显示隐藏设置。

Closes 20240717314

src/views/WMS/historical-route/index.vue

@@ -5,31 +5,103 @@
         <div id="body" :style="{width: width - 100 + 'px'}">
           <!--导出按钮-->
           <el-button class="OutCss" v-print="'#print'" type="primary">导出</el-button>
+          <!--筛选按钮-->
+          <el-button class="OutCss" type="info" plain @click="dialogFormVisible = true">字段设置</el-button>
+          <!--弹出框-->
+          <el-dialog title="字段显示/隐藏设置" :visible.sync="dialogFormVisible">
+            <el-form :model="hiddenData">
+              <el-row :gutter="20">
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.customerName">客户名称</el-checkbox>
+                </el-col>
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.wmsBillCode">发运订单编号</el-checkbox>
+                </el-col>
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.billCode">配送订单编号</el-checkbox>
+                </el-col>
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.customerAddress">收货地址</el-checkbox>
+                </el-col>
+              </el-row>
+              <el-row :gutter="20">
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.consigneeName">收货单位</el-checkbox>
+                </el-col>
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.customerContact">联系人</el-checkbox>
+                </el-col>
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.startTime">开始时间</el-checkbox>
+                </el-col>
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.endTime">结束时间</el-checkbox>
+                </el-col>
+              </el-row>
+              <el-row :gutter="20">
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.customerTel">联系电话</el-checkbox>
+                </el-col>
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.licenseNumber">车牌号</el-checkbox>
+                </el-col>
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.boxNo">保温箱号</el-checkbox>
+                </el-col>
+                <el-col :span="6">
+                  <el-checkbox v-model="hiddenData.probeHead">探头</el-checkbox>
+                </el-col>
+              </el-row>
+            </el-form>
+          </el-dialog>
           <el-timeline>
             <!-- 数据表 -->
             <h2 v-if="isCarData">订单温度列表</h2>
             <div v-for="(item, index) in dataCar">
               <el-descriptions>
-                <el-descriptions-item label="客户名称" v-if="bill">{{ carMessage.customerName }}</el-descriptions-item>
-                <el-descriptions-item label="发运订单编号" v-if="bill">{{
+                <el-descriptions-item label="客户名称" v-if="bill && hiddenData.customerName">{{
+                    carMessage.customerName
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="发运订单编号" v-if="bill && hiddenData.wmsBillCode">{{
                     carMessage.wmsBillCode
                   }}
                 </el-descriptions-item>
-                <el-descriptions-item label="配送订单编号">{{ item[0].billCode }}</el-descriptions-item>
-                <el-descriptions-item label="收货地址" v-if="bill">{{
+                <el-descriptions-item label="配送订单编号" v-if="hiddenData.billCode">{{
+                    item[0].billCode
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="收货地址" v-if="bill && hiddenData.customerAddress">{{
                     carMessage.customerAddress
                   }}
                 </el-descriptions-item>
-                <el-descriptions-item label="收货单位" v-if="bill">{{
+                <el-descriptions-item label="收货单位" v-if="bill && hiddenData.consigneeName">{{
                     carMessage.consigneeName
                   }}
                 </el-descriptions-item>
-                <el-descriptions-item label="联系人" v-if="bill">{{ carMessage.customerContact }}</el-descriptions-item>
-                <el-descriptions-item label="开始时间">{{ item[0].hisDate }}</el-descriptions-item>
-                <el-descriptions-item label="结束时间">{{ item[item.length - 1].end }}</el-descriptions-item>
-                <el-descriptions-item label="联系电话" v-if="bill">{{ carMessage.customerTel }}</el-descriptions-item>
-                <el-descriptions-item label="车牌号">{{ item[0].measuringPointName }}</el-descriptions-item>
-                <el-descriptions-item label="探头">{{ item[0].measuringPointAddr }}</el-descriptions-item>
+                <el-descriptions-item label="联系人" v-if="bill && hiddenData.customerContact">
+                  {{ carMessage.customerContact }}
+                </el-descriptions-item>
+                <el-descriptions-item label="开始时间" v-if="hiddenData.startTime">{{
+                    item[0].hisDate
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="结束时间" v-if="hiddenData.endTime">{{
+                    item[item.length - 1].end
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="联系电话" v-if="bill && hiddenData.customerTel">{{
+                    carMessage.customerTel
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="车牌号" v-if="hiddenData.licenseNumber">{{
+                    item[0].measuringPointName
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="探头" v-if="hiddenData.probeHead">{{
+                    item[0].measuringPointAddr
+                  }}
+                </el-descriptions-item>
               </el-descriptions>
               <el-table :data="item" stripe border style="width: 96%; font-size: 20px">
                 <el-table-column prop="hisDate" label="时间点" align="center" min-width="160"/>
@@ -48,26 +120,49 @@
             </div>
             <div v-for="(item, index) in dataBox">
               <el-descriptions>
-                <el-descriptions-item label="客户名称" v-if="bill">{{ carMessage.customerName }}</el-descriptions-item>
-                <el-descriptions-item label="发运订单编号" v-if="bill">{{
+                <el-descriptions-item label="客户名称" v-if="bill && hiddenData.customerName">{{
+                    carMessage.customerName
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="发运订单编号" v-if="bill && hiddenData.wmsBillCode">{{
                     carMessage.wmsBillCode
                   }}
                 </el-descriptions-item>
-                <el-descriptions-item label="配送订单编号">{{ item[0].billCode }}</el-descriptions-item>
-                <el-descriptions-item label="收货地址" v-if="bill">{{
+                <el-descriptions-item label="配送订单编号" v-if="hiddenData.billCode">{{
+                    item[0].billCode
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="收货地址" v-if="bill && hiddenData.customerAddress">{{
                     carMessage.customerAddress
                   }}
                 </el-descriptions-item>
-                <el-descriptions-item label="收货单位" v-if="bill">{{
+                <el-descriptions-item label="收货单位" v-if="bill && hiddenData.consigneeName">{{
                     carMessage.consigneeName
                   }}
                 </el-descriptions-item>
-                <el-descriptions-item label="联系人" v-if="bill">{{ carMessage.customerContact }}</el-descriptions-item>
-                <el-descriptions-item label="开始时间">{{ item[0].hisDate }}</el-descriptions-item>
-                <el-descriptions-item label="结束时间">{{ item[item.length - 1].end }}</el-descriptions-item>
-                <el-descriptions-item label="联系电话" v-if="bill">{{ carMessage.customerTel }}</el-descriptions-item>
-                <el-descriptions-item label="保温箱号">{{ item[0].measuringPointName }}</el-descriptions-item>
-                <el-descriptions-item label="探头">{{ item[0].measuringPointAddr }}</el-descriptions-item>
+                <el-descriptions-item label="联系人" v-if="bill && hiddenData.customerContact">
+                  {{ carMessage.customerContact }}
+                </el-descriptions-item>
+                <el-descriptions-item label="开始时间" v-if="hiddenData.startTime">{{
+                    item[0].hisDate
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="结束时间" v-if="hiddenData.endTime">{{
+                    item[item.length - 1].end
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="联系电话" v-if="bill && hiddenData.customerTel">{{
+                    carMessage.customerTel
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="保温箱号" v-if="hiddenData.boxNo">{{
+                    item[0].measuringPointName
+                  }}
+                </el-descriptions-item>
+                <el-descriptions-item label="探头" v-if="hiddenData.probeHead">{{
+                    item[0].measuringPointAddr
+                  }}
+                </el-descriptions-item>
               </el-descriptions>
               <el-table :data="item" stripe border style="width: 96%; font-size: 20px">
                 <el-table-column prop="hisDate" label="时间点" align="center" min-width="160"/>
@@ -244,7 +339,36 @@ export default {
       isBoxData:
         false,
       bill:
-        false
+        false,
+      // 弹出框的显示与隐藏
+      dialogFormVisible: false,
+      // 字段的显示与隐藏
+      hiddenData: {
+        // 客户名称
+        customerName: true,
+        // 发运订单编号
+        wmsBillCode: true,
+        // 配送订单编号
+        billCode: true,
+        // 收货地址
+        customerAddress: true,
+        // 收货单位
+        consigneeName: true,
+        // 联系人
+        customerContact: true,
+        // 开始时间
+        startTime: true,
+        // 结束时间
+        endTime: true,
+        // 联系电话
+        customerTel: true,
+        // 车牌号
+        licenseNumber: true,
+        // 保温箱号
+        boxNo: true,
+        // 探头
+        probeHead: true
+      }
     }
   },
   mounted() {
@@ -877,6 +1001,18 @@ export default {
 
 <style scoped>
 
+.el-row {
+  margin-bottom: 20px;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.el-col {
+  border-radius: 4px;
+}
+
 .el-descriptions {
   font-size: 22px;
 }