商品组列表

src/HDrpManagement/ProductGroupMag/index.vue

@@ -3,8 +3,12 @@
     <div class="container normal-panel normal-margin">
       <add></add>
     </div>
-    <div class="container normal-panel">
-      <list></list>
+    <div class="container normal-panel normal-margin">
+      <list ref="list">
+        <template v-slot:detail="scope">
+          <details v-if="tool.checkAuth($route.name,'detail')" :data="scope.data" @onSuccess="onSuccess"  :type="'text'"></details>
+        </template>
+      </list>
     </div>
   </div>
 </template>
@@ -13,10 +17,18 @@
 import list from './modules/list'
 
 import add from './modules/add'
+import details from './modules/details.vue'
 export default {
+  name:"index",
   components:{
     list,
-    add
+    add,
+    details
+  },
+  methods:{
+    onSuccess () {
+      this.$refs.list.listData()
+    },
   }
 }
 

src/HDrpManagement/ProductGroupMag/modules/details.vue

@@ -0,0 +1,14 @@
+<template>
+    <div class="inline-16">
+        <el-button size="small" type="text" >详情</el-button>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+  
+  }
+  
+  </script>
+  <style>
+  </style>

src/HDrpManagement/ProductGroupMag/modules/list.vue

@@ -1,10 +1,77 @@
 <template>
-  <div>list</div>
+  <div>
+    <tableLayout :layout="tablecols" :data="list" :opwidth="200" :custom="true" :height="tableHieght">
+      <template v-slot:customcol="scope">
+        <p >{{scope.column.data[scope.column.columnname]}}</p>
+      </template>
+      <template v-slot:opreation="scope">
+        <slot name="edit" :data="scope.data"></slot>
+        <slot name="del" :data="scope.data"></slot>
+        <slot name="detail" :data="scope.data"></slot>
+      </template>
+    </tableLayout>
+    <div style="margin-top:16px;text-align:right">
+      <el-pagination
+          background
+          small
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-size="params.content.pageSize"
+          layout="total, prev, pager, next, jumper"
+          :total="total">
+      </el-pagination>
+    </div>
+  </div>
 </template>
 
 <script>
 export default {
-
+  name: "list",
+  data() {
+    return {
+      tablecols:[],
+      list:[],
+      total:0,
+      currentPage:0,
+      params:{
+        "id": "20220922164403",
+        "version":1,
+        "content": {
+          "where":{
+            "condition":""
+          }
+        }
+      }
+    }
+  },
+  mounted() {
+    this.listData();
+  },
+  methods:{
+    async listData(){
+      console.log("输出")
+      const res=await this.$api.requested(this.params)
+      console.log("输出")
+      console.log(res)
+      this.list = res.data
+      this.total = res.total
+      this.currentPage = res.pageNumber
+    },
+    handleSizeChange(val) {
+      // console.log(`每页 ${val} 条`);
+      this.params.content.pageSize = val
+      this.listData()
+    },
+    handleCurrentChange(val) {
+      // console.log(`当前页: ${val}`);
+      this.params.content.pageNumber = val
+      this.listData()
+    },
+  },
+  created() {
+    this.tablecols = this.tool.tabelCol(this.$route.name).productGroupTable.tablecols
+  }
 }
 
 </script>