aa

src/application/zk/mixins/DetailComponents.js

@@ -9,6 +9,9 @@ export default {
         DetailUrlData: {
             type: Object
         },
+        DetailFieldName: {
+            type: String
+        },
     },
     methods: {},
 }

src/components/zk/zkTable.vue

@@ -0,0 +1,61 @@
+<template>
+  <vxe-grid ref='xGrid' v-bind="gridOptions" @form-submit="initListData">
+    <template #empty>
+      <a-empty/>
+    </template>
+  </vxe-grid>
+</template>
+<script>
+import ListMixin from "@/application/zk/mixins/ListComponents.js";
+import DeleteMixin from "@/application/zk/mixins/DeleteComponents.js";
+import DetailMixin from "@/application/zk/mixins/DetailComponents.js";
+import UpdateMixin from "@/application/zk/mixins/UpdateComponents.js";
+
+export default {
+  mixins: [ListMixin, DeleteMixin, DetailMixin, UpdateMixin],
+  props: {
+    Columns: {
+      type: Array
+    },
+  },
+  data() {
+    return {
+      gridOptions: { // 表格配置
+        resizable: false,  // 是否允许拖动列宽调整大小
+        border: false,  // 是否带有纵向边框
+        showOverflow: false,  // 当内容过长时显示为省略号
+        loading: false,  // 是否显示加载中
+        minHeight: '600',   // 最小高度
+        maxHeight: '1200',  // 最大高度
+        // 间隔条纹
+        stripe: true,
+
+        pagerConfig: {// 分页配置
+          total: 0, // 总条数
+          currentPage: this.ListUrlData.page, // 当前页
+          pageSize: this.ListUrlData.limit, // 默认每页显示条数
+          pageSizes: [10, 20, 30, 50, 100, 500, 1000, 2000] // 每页显示条数选项
+        },
+        columns: this.Columns,  // 表格列配置
+        data: []
+      },
+    }
+  },
+  created() {
+    // 初始化列表数据
+    this.initListData()
+  },
+  methods: {
+
+    // 初始化列表数据
+    initListData() {
+    }
+  }
+}
+
+</script>
+<style scoped lang="less">
+.ant-btn {
+  margin-right: 10px;
+}
+</style>

src/components/zk/zkTableList.vue

@@ -269,11 +269,11 @@ export default {
         pageOptions: {
           ApiUrl: this.DetailUrl,
           ApiData: this.DetailUrlData,
-          FieldName: 'truck',
+          FieldName: this.DetailFieldName,
-          title: "车辆详情",
+          title: "详情",
         },
         callback: ({success}) => {
-          success && this.initListData();
+          success && this.initListData(); // 如果成功，初始化列表数据
         }
       })
     }

src/components/zk/zkTableView.md

@@ -0,0 +1,3 @@
+:title
+:thCenter
+:options

src/pages/Middle/transport/Truck/Truck/Detail.vue

@@ -50,10 +50,22 @@
       </a-descriptions-item>
     </a-descriptions>
 
+
+    <ZkTable
+        :ListUrl="this.$data.actions.TruckSearch"
+        :ListUrlData="this.$data.zkSelectData"
+        :ListFieldName="this.$data.zkSelectDataFieldName"
+        :Columns="this.$data.columns"
+    >
+    </ZkTable>
+
   </div>
 </template>
 <script>
+import ZkTable from "@/components/zk/zkTable.vue";
+
 export default {
+  components: {ZkTable},
   props: {
     dataId: {
       type: String

src/pages/Middle/transport/Truck/Truck/List.vue

@@ -4,6 +4,7 @@
         :ListUrl="this.$data.actions.TruckSearch"
         :ListUrlData="this.$data.zkSelectData"
         :ListFieldName="this.$data.zkSelectDataFieldName"
+        :DetailFieldName="this.$data.zkSelectDataFieldName"
         :DetailUrl="this.$data.actions.TruckDetail"
         :AddUrl="this.$data.actions.TruckCreate"
         :UpdateUrl="this.$data.actions.TruckUpdate"
@@ -12,9 +13,11 @@
         :Columns="this.$data.columns"
         CreateRouter="/Truck/TruckCreate"
         UpdateRouter="/Truck/TruckUpdate"
-        DetailVueComponent='@/pages/Middle/transport/Truck/Truck/Detail.vue'
+        DetailVueComponent='./zkTableView.vue'
     >
     </ZkTableList>
+
+
   </div>
 </template>
 
@@ -25,7 +28,7 @@ export default {
   name: 'TruckList',
   i18n: require('./i18n'), // 国际化
   components: {
-    ZkTableList
+    ZkTableList,
   },
   data() {
     return {