demo

src/views/leger/equipmentledger.vue

@@ -25,6 +25,14 @@
                    v-if="permission.equipmentledger_delete"
                    @click="handleDelete">删 除
         </el-button>
+        <el-button
+                   size="small"
+                   plain
+                   @click="handleDetail">详情
+        </el-button>
+      </template>
+      <template #menu="{}">
+        <el-button @click="handleDetail" type="primary">详情</el-button>
       </template>
     </avue-crud>
   </basic-container>
@@ -469,6 +477,14 @@
             });
           });
       },
+      handleDetail() {
+        this.$router.push({
+          path: "/leger/equipmentledgerDetail",
+          query: {
+            // id:id
+          },
+        });
+      },
       handleDelete() {
         if (this.selectionList.length === 0) {
           this.$message.warning("请选择至少一条数据");

src/views/leger/equipmentledgerDetail.vue

@@ -0,0 +1,123 @@
+<template>
+  <basic-container>
+      <avue-tabs :option="option"
+                 @change="handleChange"></avue-tabs>
+      <span v-if="type.prop==='tab1'">
+        选项卡内容1
+        <avue-form :option="tab1_option"
+                   v-model="tab1_form"></avue-form>
+      </span>
+      <span v-else-if="type.prop==='tab2'">
+        选项卡内容2 https://avuejs.com/crud/crud-fun.html
+        <avue-crud :data="tab2_data"
+                   :option="tab2_option"
+                   @row-save="tab2_rowSave"></avue-crud>
+      </span>
+      <span v-else-if="type.prop==='tab3'">
+        选项卡内容3  https://avuejs.com/crud/crud-fun.html
+        <avue-crud :data="tab3_data"
+                   :option="tab3_option"
+                   @row-save="tab3_rowSave"></avue-crud>
+      </span>
+      <div>
+        <el-button type="primary"
+                   size="small"
+                   @click="$refs.form.submit()">按钮</el-button>
+<!--        <el-button size="small"-->
+<!--                   @click="$refs.form.resetForm()">取消</el-button>-->
+        <el-button size="small"
+                   @click="back">返回</el-button>
+      </div>
+  </basic-container>
+<!--   https://avuejs.com/form/form-rules.html#%E5%A4%96%E7%BD%AE%E9%AA%8C%E8%AF%81-->
+</template>
+<script>
+  export default {
+    name: "equipmentledgerDetail",
+    data () {
+      return {
+        type: {},
+        option: {
+          column: [{
+            icon: 'el-icon-info',
+            label: '选项卡1',
+            prop: 'tab1',
+          }, {
+            icon: 'el-icon-warning',
+            label: '选项卡2',
+            prop: 'tab2',
+          }, {
+            icon: 'el-icon-question',
+            label: '选项卡3',
+            prop: 'tab3',
+          }]
+        },
+        tab1_form: {},
+        tab1_option: {
+          submitBtn: false,
+          emptyBtn: false,
+          column: [{
+            label: "测试",
+            prop: "test"
+          }]
+        },
+        tab2_page: {
+          pageSize: 20,
+          pagerCount: 5
+        },
+        tab2_data: [],
+        tab2_option: {
+          align: 'center',
+          menuAlign: 'center',
+          column: [
+            {
+              label: '姓名',
+              prop: 'name'
+            },
+            {
+              label: '性别',
+              prop: 'sex'
+            }
+          ]
+        },
+        tab3_page: {
+          pageSize: 20,
+          pagerCount: 5
+        },
+        tab3_data: [],
+        tab3_option: {
+          align: 'center',
+          menuAlign: 'center',
+          column: [
+            {
+              label: '主题',
+              prop: 'name'
+            },
+            {
+              label: '附件',
+              prop: 'sex'
+            }
+          ]
+        }
+      }
+    },
+    created () {
+      this.type = this.option.column[0];
+    },
+    methods: {
+      back() {
+        this.$router.push({ path: "/leger/equipmentledger"});
+      },
+      handleChange (column) {
+        this.type = column
+        this.$message.success(JSON.stringify(column))
+      },
+      tab2_rowSave (form, done, loading) {
+        loading();
+        setTimeout(() => {
+          done(form);
+        }, 2000)
+      }
+    }
+  }
+</script>

src/views/leger/inventorydocument.vue

@@ -173,9 +173,6 @@
     computed: {
       ...mapGetters(["permission"]),
       permissionList() {
-          this.option.column = this.option.column.filter(v => {
-              return this.permission['inventorydocument_col_' + v.prop]
-          })
         return {
           addBtn: this.vaildData(this.permission.inventorydocument_add, false),
           viewBtn: this.vaildData(this.permission.inventorydocument_view, false),

src/views/leger/techparameters.vue

@@ -119,9 +119,6 @@
     computed: {
       ...mapGetters(["permission"]),
       permissionList() {
-          this.option.column = this.option.column.filter(v => {
-              return this.permission['techparameters_col_' + v.prop]
-          })
         return {
           addBtn: this.vaildData(this.permission.techparameters_add, false),
           viewBtn: this.vaildData(this.permission.techparameters_view, false),