制衣模块详情

ant-design-vue-jeecg/src/views/process/ZyClothsModularList.vue

@@ -263,8 +263,8 @@
         fieldList.push({type: 'string', value: 'pictureUrl', text: '图片', dictCode: ''})
         this.superFieldList = fieldList
       },
-      handleDetail(){
-        this.$refs.ZyClothsModularListDetail.showModal()
+      handleDetail(record){
+        this.$refs.ZyClothsModularListDetail.showModal(record)
       }
     }
   }

ant-design-vue-jeecg/src/views/process/modules/ZyClothsModularListDetail.vue

@@ -7,24 +7,127 @@
       :width='1000'
       @ok="handleOk"
       @cancel="handleCancel">
+      <p class="title">制衣模块详情</p>
       <a-descriptions title="" bordered>
-        <a-descriptions-item label="企业">Cloud Database</a-descriptions-item>
-        <a-descriptions-item label="模块名称">Prepaid</a-descriptions-item>
-        <a-descriptions-item label="服装类型">YES</a-descriptions-item>
+        <a-descriptions-item label="企业">{{model.enterpriseId_dictText}}</a-descriptions-item>
+        <a-descriptions-item label="编号">{{model.nums}}</a-descriptions-item>
+        <a-descriptions-item label="模块名称">{{model.modularName}}</a-descriptions-item>
+        <a-descriptions-item label="服装类型">{{model.clothsTypeId_dictText}}</a-descriptions-item>
+        <a-descriptions-item label="描述" :span="2">{{model.description}}</a-descriptions-item>
         <a-descriptions-item label="图片" :span="3">
-          <a-image
-            :width="200"
-            src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
-          />
-        </a-descriptions-item>
-        <a-descriptions-item label="描述" :span="3">
-          <a-badge status="processing" text="Running" />
+          <img v-if="model.pictureUrl"  :src="model.pictureUrl" alt="无法显示"></img>
+          <span v-else>暂无图片</span>
         </a-descriptions-item>
       </a-descriptions>
+      <p class="title">模块部件详情</p>
+      <a-table :columns="columns1" :data-source="data1" bordered :pagination="false">
+      </a-table>
+      <p  class="title">模块工序详情</p>
+      <a-table :columns="columns2" :data-source="data2" bordered :pagination="false">
+      </a-table>
     </a-modal>
   </div>
 </template>
 <script>
+  const columns1 = [
+    {
+      title:'索引',
+      customRender:(text, record, index)=>index+1,
+      align:'center'
+    },
+    {
+      title: '编码',
+      dataIndex: 'nums',
+      key: 'nums',
+      align:'center'
+    },
+    {
+      title: '模块名称',
+      dataIndex: 'modularId_dictText',
+      key: 'modularId_dictText',
+      align:'center'
+    },
+    {
+      title: '部件名称',
+      dataIndex: 'partsName',
+      key: 'partsName',
+      align:'center'
+    },
+    {
+      title: '创建时间',
+      key: 'createTime',
+      dataIndex: 'createTime',
+      align:'center'
+    },
+  ];
+  const data1 = [
+    {
+      key: '1',
+      nums:'tttt',
+      modularId_dictText:'tttt',
+      partsName:'大袖衩',
+      createTime:'2022-12-06 19:00:07'
+    },
+    {
+      key: '2',
+      nums:'aaff',
+      modularId_dictText:'tttt',
+      partsName:'外片',
+      createTime:'2022-12-06 18:30:49'
+    },
+    {
+      key: '3',
+      nums:'test01',
+      modularId_dictText:'tttt',
+      partsName:'大片',
+      createTime:'2022-12-06 09:07:05'
+    }
+  ]
+  const columns2 = [
+    {
+      title:'索引',
+      customRender:(text, record, index)=>index+1,
+      align:'center'
+    },
+    {
+      title: '模块名称',
+      dataIndex: 'modularId_dictText',
+      key: 'modularId_dictText',
+      align:'center'
+    },
+    {
+      title: '工序名称',
+      dataIndex: 'processId_dictText',
+      key: 'processId_dictText',
+      align:'center'
+    },
+    {
+      title: '创建时间',
+      key: 'createTime',
+      dataIndex: 'createTime',
+      align:'center'
+    },
+  ];
+  const data2 = [
+    {
+      key: '1',
+      modularId_dictText:'tttt',
+      processId_dictText:'1-3合后育克',
+      createTime:'2022-12-06 19:00:07'
+    },
+    {
+      key: '2',
+      modularId_dictText:'tttt',
+      processId_dictText:'模板运袋盖',
+      createTime:'2022-12-06 18:30:49'
+    },
+    {
+      key: '3',
+      modularId_dictText:'tttt',
+      processId_dictText:'1-4辑后育克0.1cm明线',
+      createTime:'2022-12-06 09:07:05'
+    }
+  ]
   export default {
     name: 'ZyClothsModularListDetail',//此处填组件名称
     data () {
@@ -33,11 +136,18 @@
         confirmLoading: false,
         model:{
         },
+        data1,
+        columns1,
+        data2,
+        columns2,
       }
     },
     methods: {
-      showModal(id) {
+      showModal(record) {
         this.visible = true;
+        this.model = record
+        console.log('record')
+        console.log(record)
       },
       handleOk(e) {
         this.confirmLoading = true;
@@ -51,4 +161,11 @@
       },
     },
   }
-</script >
+</script >
+<style scoped>
+  .title{
+    font-size: 18px;
+    margin: 1em 0;
+    font-weight: bold;
+  }
+</style>