服装款式管理详情

ant-design-vue-jeecg/src/views/zyclothsstyle/modules/ZyClothsStyleListDetail.vue

@@ -1,5 +1,6 @@
 <template>
   <div>
+
     <a-modal
       title="服装款式详情"
       :visible="visible"
@@ -45,22 +46,22 @@
 <!--        </tr>-->
 
 <!--      </table>-->
+      <a-spin :spinning="confirmLoading">
       <h3 style="width: 98%;;margin:0px auto">款式详情</h3>
-      <a-table  style="width: 98%;font-size:14px;margin:10px auto" :columns="columns1" :data-source="data1" bordered :pagination="false">
+      <a-table   style="width: 98%;font-size:14px;margin:10px auto" :columns="columns1" :data-source="data1" bordered rowKey="nums" :pagination="false">
       </a-table>
 
       <h3 style="width: 98%;;margin:20px auto 0">管理模块</h3>
-      <a-table style="width: 98%;font-size:14px;margin:10px auto 0" :columns="columns" :data-source="data" bordered :pagination="false">
+      <a-table style="width: 98%;font-size:14px;margin:10px auto 0" :columns="columns" :data-source="data" rowKey="id" bordered :pagination="false">
-
       </a-table>
 
       <h3 style="width: 98%;;margin:20px auto 0">管理面料</h3>
-      <a-table style="width: 98%;font-size:14px;margin:10px auto 0" :columns="columns2" :data-source="data2" bordered :pagination="false">
+      <a-table style="width: 98%;font-size:14px;margin:10px auto 0" :columns="columns2" :data-source="data2" rowKey="id" bordered :pagination="false">
 
       </a-table>
 
       <h3 style="width: 98%;;margin:20px auto 0">管理辅料</h3>
-      <a-table style="width: 98%;font-size:14px;margin:10px auto 0" :columns="columns3" :data-source="data3" bordered :pagination="false">
+      <a-table style="width: 98%;font-size:14px;margin:10px auto 0" :columns="columns3" :data-source="data3" rowKey="id" bordered :pagination="false">
 
       </a-table>
 
@@ -70,221 +71,155 @@
 <!--      </a-table>-->
 
       <h3 style="width: 98%;;margin:20px auto 0">管理工序</h3>
-      <a-table style="width: 98%;font-size:14px;margin:10px auto 0" :columns="columns5" :data-source="data5" bordered :pagination="false">
+      <a-table style="width: 98%;font-size:14px;margin:10px auto 0" :columns="columns5" :data-source="data5" rowKey="id" bordered :pagination="false">
 
       </a-table>
+      </a-spin>
     </a-modal>
+
   </div>
 </template>
 <script>
   const columns1 = [
     {
       title: '款式名称',
-      dataIndex: 'a',
+      dataIndex: 'styleNames',
-      key: 'a',
+      key: 'styleNames',
       align:'center'
     },
     {
       title: '款式编号',
-      dataIndex: 'b',
+      dataIndex: 'nums',
-      key: 'b',
+      key: 'nums',
       align:'center'
     },
     {
       title: '款式规格',
-      dataIndex: 'c',
+      dataIndex: 'specification',
-      key: 'c',
+      key: 'specification',
       align:'center'
     },
     {
       title: '款式形式',
-      dataIndex: 'd',
+      dataIndex: 'shape',
-      key: 'd',
+      key: 'shape',
       align:'center'
     },
     {
       title: '企业',
-      dataIndex: 'e',
+      dataIndex: 'enterpriseId',
-      key: 'e',
+      key: 'enterpriseId',
       align:'center'
     },
     {
       title: '款式创建时间',
-      dataIndex: 'f',
+      dataIndex: 'createTime',
-      key: 'f',
+      key: 'createTime',
       align:'center'
     },
   ];
-  const data1 = [
-    {
-      key:'1',
-      a:'tttt',
-      b:'QIYE80301100000130',
-      c:'123',
-      d:'预制',
-      e:'黄淮服装智能制造中心',
-      f:'2022-12-06 10:02:59',
-    }
-  ];
   const columns = [
     {
       title: '服装类型',
-      dataIndex: 'a',
+      dataIndex: 'typeName',
-      key: 'a',
+      key: 'typeName',
       align:'center'
     },
     {
       title: '款式编号',
-      dataIndex: 'b',
+      dataIndex: 'styleNums',
-      key: 'b',
+      key: 'styleNums',
       align:'center'
     },
     {
       title: '款式名称',
-      dataIndex: 'c',
+      dataIndex: 'styleNames',
-      key: 'c',
+      key: 'styleNames',
       align:'center'
     },
     {
       title: '模块编号',
-      dataIndex: 'd',
+      dataIndex: 'modularNums',
-      key: 'd',
+      key: 'modularNums',
       align:'center'
     },
     {
       title: '模块名称',
-      dataIndex: 'e',
+      dataIndex: 'modularName',
-      key: 'e',
+      key: 'modularName',
       align:'center'
     },
     {
       title: '创建时间',
-      dataIndex: 'f',
+      dataIndex: 'createTime',
-      key: 'f',
+      key: 'createTime',
       align:'center'
     }
   ];
-  const data = [
-    {
-      key: '1',
-      a:'女衬衫',
-      b:'a000400000014',
-      c:'test010',
-      d:'QIYE80301100000021',
-      e:'tttt',
-      f:'2022-12-06 10:02:59',
-    },
-    {
-      key: '2',
-      a:'女衬衫',
-      b:'a000400000014',
-      c:'test010',
-      d:'a000180301100000022',
-      e:'袖口模块A1',
-      f:'2022-12-06 10:02:59',
-    },    {
-      key: '3',
-      a:'女衬衫',
-      b:'a000400000014',
-      c:'test010',
-      d:'b0005',
-      e:'领子模块',
-      f:'2022-12-06 10:02:59',
-    }
-  ];
   const columns2 = [
     {
       title: '服装类型',
-      dataIndex: 'a',
+      dataIndex: 'typeName',
-      key: 'a',
+      key: 'typeName',
       align:'center'
     },
     {
       title: '款式编号',
-      dataIndex: 'b',
+      dataIndex: 'styleNums',
-      key: 'b',
+      key: 'styleNums',
       align:'center'
     },
     {
       title: '款式名称',
-      dataIndex: 'c',
+      dataIndex: 'styleNames',
-      key: 'c',
+      key: 'styleNames',
       align:'center'
     },
     {
       title: '面料编号',
-      dataIndex: 'd',
+      dataIndex: 'fabricNumber',
-      key: 'd',
+      key: 'fabricNumber',
       align:'center'
     },
     {
       title: '面料名称',
-      dataIndex: 'e',
+      dataIndex: 'fabricName',
-      key: 'e',
+      key: 'fabricName',
       align:'center'
     },
     {
       title: '创建时间',
-      dataIndex: 'f',
+      dataIndex: 'createTime',
-      key: 'f',
+      key: 'createTime',
       align:'center'
     }
   ];
-  const data2 = [
-    {
-      key: '1',
-      a:'女衬衫',
-      b:'a000400000014',
-      c:'test010',
-      d:'1002',
-      e:'面料2',
-      f:'2022-12-06 10:02:59',
-    },
-    {
-      key: '2',
-      a:'女衬衫',
-      b:'a000400000014',
-      c:'test010',
-      d:'1003',
-      e:'面料3',
-      f:'2022-12-06 10:02:59',
-    }
-  ];
   const columns3 = [
     {
       title: '服装类型名称',
-      dataIndex: 'a',
+      dataIndex: 'typeName',
-      key: 'a',
+      key: 'typeName',
       align:'center'
     },
     {
       title: '款式名称',
-      dataIndex: 'c',
+      dataIndex: 'styleId',
-      key: 'c',
+      key: 'styleId',
       align:'center'
     },
     {
       title: '辅料名称',
-      dataIndex: 'e',
+      dataIndex: 'accessoriesId',
-      key: 'e',
+      key: 'accessoriesId',
       align:'center'
     },
     {
       title: '创建时间',
-      dataIndex: 'f',
+      dataIndex: 'createTime',
-      key: 'f',
+      key: 'createTime',
       align:'center'
     }
   ];
-  const data3 = [
-    {
-      key: '1',
-      a:'女衬衫',
-      c:'test010',
-      e:'123',
-      f:'2022-12-06 10:02:59',
-    }
-  ];
   const columns4 = [
     {
       title: '服装款式',
@@ -383,70 +318,89 @@
   const columns5 = [
     {
       title: '款式名称',
-      dataIndex: 'a',
+      dataIndex: 'styleId',
-      key: 'a',
+      key: 'styleId',
       align:'center'
     },
     {
       title: '工序',
-      dataIndex: 'c',
+      dataIndex: 'processId',
-      key: 'c',
+      key: 'processId',
       align:'center'
     },
     {
       title: '创建时间',
-      dataIndex: 'f',
+      dataIndex: 'createTime',
-      key: 'f',
+      key: 'createTime',
       align:'center'
     }
   ];
-  const data5 = [
-    {
-      key: '1',
-      a:'test010',
-      c:'9',
-      f:'2022-12-06 10:02:59',
-    },
-    {
-      key: '2',
-      a:'test010',
-      c:'8',
-      f:'2022-12-06 10:02:59',
-    }
-  ];
   export default {
     name: 'ZyClothsStyleListDetail',//此处填组件名称
     data () {
       return {
         visible: false,
-        confirmLoading: false,
         model:{
         },
-        data,
+        confirmLoading:true,
+        // 管理模块
+        data:[],
         columns,
-        data1,
+        // 款式详情
+        data1:[],
         columns1,
-        data2,
+        // 管理面料
+        data2:[],
         columns2,
-        data3,
+        // 管理辅料
+        data3:[],
         columns3,
+        // 管理型号
         columns4,
         data4,
+        // 管理工序
         columns5,
-        data5,
+        data5:[],
+        url: {
+          detail: "/zyclothsstyle/zyClothsStyle/detail",
+        },
+        id:'',
       }
     },
     methods: {
       showModal(record) {
         this.visible = true;
         this.model = record
-        this.$http.get('/zyclothsstyle/zyClothsStyle/detail?id='+record.id).then(
+        this.id = record.id
-          res=>{
+        // this.$http.get('/zyclothsstyle/zyClothsStyle/detail?id='+record.id).then(
-
+        //   res=>{
+        //     console.log('res')
+        //     console.log(res.result.zyClothsStyle)
+        //     this.data1.push(res.result.zyClothsStyle)
+        //   }
+        // )
+        this.getDetailData()
+      },
+      async getDetailData(){
+        const {data:res} = await this.$axios.get('/jeecg-boot/zyclothsstyle/zyClothsStyle/detail?id='+this.id)
+        if (res.code !== 200) {
+          this.$message({
+            type: 'error',
+            message: '查询不到知识点数据'
+          });
+        }
+        this.confirmLoading = false
+        console.log('res.result')
+        console.log(res.result)
+        if(this.data1.length == 0){
+          this.data1.push(res.result.zyClothsStyle)
         }
-        )
+        this.data2 = res.result.zyStyleFabricList
-        console.log('this.model'+record.id)
+        this.data3 = res.result.zyStyleAccessoriesList
-        console.log(this.model)
+        this.data = res.result.zyStyleModuleList
+        this.data5 = res.result.zyStyleModularList
+        console.log('data')
+        console.log(this.data)
       },
       handleOk(e) {
         this.confirmLoading = true;