merge and update dashboard detail

src/views/dashboard/components/PortDetail.vue

@@ -2,7 +2,7 @@
  * @Author: zwq
  * @Date: 2020-12-29 16:37:56
  * @LastEditors: gtz
- * @LastEditTime: 2022-03-16 19:13:47
+ * @LastEditTime: 2022-03-16 20:06:20
  * @Description:
 -->
 <template>
@@ -10,23 +10,26 @@
     :title="'btn.detail' | i18nFilter"
     :visible.sync="visible"
   >
-    <el-form ref="dataForm" :model="dataForm" label-width="100px">
-      <el-form-item :label="$t('module.dashboard.currLocation')" prop="currLocation">
-        {{ dataForm.currLocation }}
+    <el-form ref="dataForm" :model="dataForm" label-width="150px">
+      <el-form-item :label="$t('module.dashboard.name')" prop="name">
+        {{ dataForm.name }}
+      </el-form-item>
+      <el-form-item :label="$t('module.dashboard.attribute')" prop="attribute">
+        {{ dataForm.attribute ? portAttributeObj[dataForm.attribute] : '' }}
+      </el-form-item>
+      <el-form-item :label="$t('module.dashboard.cassetteStatus')" prop="cassetteVoList">
+        {{ dataForm.cassetteVoList.length && dataForm.cassetteVoList[0].status ? cassetteStatusObj[dataForm.cassetteVoList[0].status] : '' }}
+      </el-form-item>
+      <el-form-item :label="$t('module.dashboard.workOrderNo')" prop="workOrderNo">
+        {{ dataForm.workOrderNo }}
       </el-form-item>
       <el-form-item :label="$t('module.dashboard.storageBoxCode')" prop="storageBoxCode">
         {{ dataForm.storageBoxCode }}
       </el-form-item>
-      <el-form-item :label="$t('module.dashboard.isEmpty')" prop="isEmpty">
-        {{ dataForm.isEmpty >= 0 ? emptyDict[dataForm.isEmpty] : '' }}
-      </el-form-item>
-      <el-form-item :label="$t('module.dashboard.status')" prop="status">
-        {{ dataForm.status >= 0 ? statusDict[dataForm.status] : '' }}
-      </el-form-item>
     </el-form>
-    <div class="drawer-footer">
+    <span slot="footer" class="dialog-footer">
       <el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
-    </div>
+    </span>
   </el-dialog>
 </template>
 
@@ -48,32 +51,25 @@ export default {
         storageBoxId: null,
         updateTime: null
       },
-      emptyDict: {
-        0: this.$t('module.dashboard.empty'),
-        1: this.$t('module.dashboard.notEmpty')
+      cassetteStatusObj: {
+        '1': 'Empty Cassette',
+        '2': 'Dummy Cassette',
+        '3': 'OK Cassette',
+        '4': 'NOK Cassette'
       },
-      statusDict: {
-        0: this.$t('module.dashboard.initialize'),
-        1: this.$t('module.dashboard.finish')
+      portAttributeObj: {
+        1: 'Working Port',
+        2: 'Buffer Port',
+        3: 'Exception Port'
       }
     }
   },
   methods: {
     init(data) {
-      this.visible = true
       console.log(data)
+      this.visible = true
+      this.dataForm = data
     }
   }
 }
 </script>
-
-<style scoped>
-.drawer-footer {
-  width: 100%;
-  margin-top: 50px;
-  border-top: 1px solid #e8e8e8;
-  padding: 10px 50px;
-  text-align: left;
-  background: #fff;
-}
-</style>

src/views/dashboard/index.vue

@@ -2,7 +2,7 @@
  * @Author: gtz
  * @Date: 2022-03-03 09:16:10
  * @LastEditors: gtz
- * @LastEditTime: 2022-03-16 19:12:35
+ * @LastEditTime: 2022-03-16 20:07:40
  * @Description: file content
  * @FilePath: \mt-ck-wms-ui\src\views\dashboard\index.vue
 -->
@@ -23,9 +23,10 @@
           {{ item.name }}
         </div>
         <div class="dashboard-legend-search">
-          <el-select v-model="current" size="mini" placeholder="请选择库存范围" @change="handleChange">
+          <el-select v-model="current" size="mini" @change="handleChange">
             <el-option v-for="item in totalPage" :key="'select' + item" :label="$t('module.dashboard.pageHeader') + item + $t('module.dashboard.pageFooter')" :value="item" />
           </el-select>
+          <el-button type="primary" @click="refresh">{{ 'btn.refresh' | i18nFilter }}</el-button>
         </div>
       </el-row>
       <el-row v-if="current * 80 < shelfVoList[0].rowVoList[0].portVoList.length" class="dashboard-layout" :gutter="12">
@@ -92,34 +93,28 @@ export default {
   },
   created() {
     this.totalPage = Math.ceil(this.shelfVoList[0].rowVoList[0].portVoList.length / 80)
-    getPortList().then(res => {
-      console.log(res.data[0].shelfVoList)
-      this.shelfVoList = res.data[0].shelfVoList.map(item => {
-        item.rowVoList.map(i => {
-          i.portVoList.map(z => {
-            if (!(z.attribute)) {
-              z.attribute = 0
-            }
-            return z
-          })
-          return i
-        })
-        return item
-      })
-      this.totalPage = Math.ceil(this.shelfVoList[0].rowVoList[0].portVoList.length / 80)
-    })
+    this.init()
   },
   methods: {
+    init() {
+      getPortList().then(res => {
+        this.shelfVoList = res.data[0].shelfVoList
+        this.totalPage = Math.ceil(this.shelfVoList[0].rowVoList[0].portVoList.length / 80)
+      })
+    },
     handleChange(v) {
       console.log(v)
     },
     handlePort(z, x) {
-      getPortDetail(z.portVoList[x].id).then(res => {
+      getPortDetail(z.portVoList[x - 1].id).then(res => {
         this.addOrUpdateVisible = true
         this.$nextTick(() => {
-          this.$refs.addOrUpdate.init(res.data)
+          this.$refs.addOrUpdate.init({ ...(res.data), ...z.portVoList[x - 1] })
         })
       })
+    },
+    refresh() {
+      this.init()
     }
   }
 }