feat(CrudTable): 新增columns属性

BoBoooooo · Jan 10, 2021 · 9b60405 · 9b60405
1 parent c2f0a9a
commit 9b60405
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 17 deletions.
diff --git a/README.md b/README.md
@@ -148,6 +148,7 @@ npm i element-pro-crud -S
 |          参数          |                               说明                                |      类型       |                 可选值                  |  默认值   |
 | :--------------------: | :---------------------------------------------------------------: | :-------------: | :-------------------------------------: | :-------: |
 | `el-table props` |          el-table原生属性见文档          |          https://element.eleme.cn/#/zh-CN/component/table            |
+|       columns        |                       表格json置                        |     Object      |             -             | null |
 |       listField        |                        response 中数据位置                        |     String      |             data/data.list              | data.list |
 |      readOnly       | GenerateFormDialog 中的表单禁用.null 表示均可编辑;{}表示全部只读; |     Boolean      |   true/false   |   false    |  |
 |       isMultiple       |                           是否开启多选                            |     Boolean     |               true,false                |   false   |

diff --git a/src/component/crud-table/src/CrudTable.vue b/src/component/crud-table/src/CrudTable.vue
@@ -473,6 +473,13 @@ export default class CrudTable extends Vue {
   })
   emptyText!: string;
 
+  // columns
+  @Prop({
+    type: Object,
+    default: null,
+  })
+  columns!: any;
+
 
   // 分页
   get pagination() {
@@ -553,30 +560,16 @@ export default class CrudTable extends Vue {
   }
 
   created() {
-    if (!this.$PROCRUD.getTableDetail) {
-      this.$message.warning('请先设置getTableDetail方法,请求表格json');
-      this.tableConfig = {
-        columns: [{
-          prop: '',
-          label: '请先设置tableConfig',
-          minWidth: '100',
-          sortable: 'custom',
-          slotName: '',
-          align: 'center',
-          headerAlign: 'center',
-        }],
-      } as any;
+    // 外侧传入表格json
+    if (this.columns) {
+      this.tableConfig = this.columns;
       return;
     }
     // 请求表格设计json
     const promise = this.$PROCRUD.getTableDetail(this.tableDesignerName ? this.tableDesignerName : this.tableName);
     // 加载表格结构
     promise.then((res) => {
       this.tableConfig = JSON.parse(res.data.formJson);
-      // 如果不显示操作列,则隐藏
-      // if (!this.view.actionColumn) {
-      //   this.tableConfig.columns = this.tableConfig.columns.filter((item: any) => item.slotName !== 'actionColumn');
-      // }
       const { actionColumnWidth } = this;
       // 如果显示指明了操作列列宽
       if (actionColumnWidth) {