refactor(block-mixin): 重构block-mixin 相关初始化field代码

Author: ly525

src/ams/mixins/block-mixin.js

@@ -1,4 +1,5 @@
 import Vue from 'vue';
+import lodashGet from 'lodash.get'
 import ams from '../index';
 import { listStringHasValue, get, getByOrder, deepExtend, getType, watermark } from '../../utils';
 import { getRouter } from './router';
@@ -158,10 +159,7 @@ export default {
         async initBlock() {
             this.block = await ams.getBlock(this.name);
             if (this.block) {
-                this.resource =
-                    typeof this.block.resource === 'string'
-                        ? ams.resources[this.block.resource]
-                        : ams.resource('', this.block.resource);
+                this.initResource();
                 ams.$blocks[this.name] = this;
                 this.initFields();
                 this.getOperationsCounts();
@@ -215,94 +213,79 @@ export default {
                 field.ctx = this.block.ctx || 'view';
             }
         },
+        /**
+         * 初始化 列表/表格 字段信息
+         * @param {String} fieldKey 字段key
+         * @param {Object} field 字段对应的对象，即 { type, props, width }
+         * @returns
+         */
+        initListField(fieldKey, field) {
+            const blockType = ams.configs.baseBlockType[this.block.type]
+            if (blockType !== 'list') return
+            // 排序
+            if (this.block.sorts[fieldKey]) {
+                field.props.sortable = 'custom';
+            }
+            // 过滤
+            const filter = this.block.filters[fieldKey];
+            if (!filter) return
+            let filterOptions = filter.options || field.props.options;
+            if (!filterOptions) return
+            if (Array.isArray(filterOptions)) {
+                filterOptions = filterOptions.map(option => ({
+                    text: option.label,
+                    value: option.value,
+                }));
+            } else {
+                filterOptions = Object.keys(filterOptions).map(key => ({
+                    text: filterOptions[key],
+                    value: key
+                }));
+            }
+            field.props.filters = filterOptions;
+            field.props['filter-multiple'] = !!filter.multiple;
+            if (filter.remote) return
+            field.props['filter-method'] = (value, row, column) => listStringHasValue(
+                row[fieldKey],
+                value
+            );
+        },
         initFields() {
+            const resourceFields = this.resources && this.resources.fields;
+            const blockFields = this.block.fields || {};
+            if (!resourceFields) {
+                this.fields = null;
+                return;
+            }
             // 为了可以做过滤、合并props等功能、通过computed属性重新处理field列表
             // 为了上层可以快速定位修改
-            if (this.resource && this.resource.fields) {
-                const fields = {};
-                let fieldKeys = Object.keys(this.resource.fields);
-                fieldKeys.forEach(name => {
-                    const resourceField = this.resource.fields[name];
-                    let blockField =
-                        this.block.fields && this.block.fields[name];
-                    // 字段隐藏，bock内可以通过 fields: {testMarkdown: false} 隐藏字段
-                    if (blockField === false) {
-                        return;
-                    }
-                    blockField = blockField || {};
-
-                    const field = {
-                        // 默认block级ctx
-                        name,
-                        ctx: this.block.ctx || 'view',
-                        props: {},
-                        on: {}
-                    };
-                    // 按优先级测试合并
-                    // deepExtend(field, defaultFieldConfig[blockField.type || resourceField.type]);
-                    deepExtend(field, resourceField);
-                    deepExtend(field, blockField);
-                    this.initDefaultField(field);
-                    // console.log(field);
-                    // 处理列表
-                    if (ams.configs.baseBlockType[this.block.type] === 'list') {
-                        // 排序
-                        if (this.block.sorts[name]) {
-                            field.props.sortable = 'custom';
-                        }
-                        // 过滤
-                        const filter = this.block.filters[name];
-                        if (filter) {
-                            let filterOptions =
-                                filter.options || field.props.options;
+            const fields = {};
+            let fieldKeys = Object.keys(resourceFields);
+            fieldKeys.forEach(fieldKey => {
+                const resourceField = resourceFields[fieldKey];
+                let blockField = blockFields[fieldKey];
+                // 字段隐藏，bock内可以通过 fields: {[fieldKey]: false} 隐藏字段
+                if (blockField === false) return;
+                blockField = blockField || {};
 
-                            if (filterOptions) {
-                                if (Array.isArray(filterOptions)) {
-                                    filterOptions = filterOptions.map(option => {
-                                        return {
-                                            text: option.label,
-                                            value: option.value,
-                                        };
-                                    });
-                                } else {
-                                    filterOptions = Object.keys(filterOptions).map(
-                                        key => {
-                                            const label = filterOptions[key];
-                                            return {
-                                                text: label,
-                                                value: key
-                                            };
-                                        }
-                                    );
-                                }
-                                field.props.filters = filterOptions;
-                                field.props[
-                                    'filter-multiple'
-                                ] = !!filter.multiple;
-                                if (!filter.remote) {
-                                    field.props['filter-method'] = (
-                                        value,
-                                        row,
-                                        column
-                                    ) => {
-                                        // console.log('filter-method', value, row, column);
-                                        return listStringHasValue(
-                                            row[name],
-                                            value
-                                        );
-                                    };
-                                }
-                            }
-                        }
-                    }
-                    fields[name] = field;
-                });
-                this.fields = fields;
-                this.layout = this.getFieldsLayout(fields, this.block.layout);
-                // console.log(this.layout)
-            } else {
-                this.fields = null;
-            }
+                const field = {
+                    // 默认block级ctx
+                    name: fieldKey,
+                    ctx: this.block.ctx || 'view',
+                    props: {},
+                    on: {}
+                };
+                // 按优先级测试合并
+                // deepExtend(field, defaultFieldConfig[blockField.type || resourceField.type]);
+                deepExtend(field, resourceField);
+                deepExtend(field, blockField);
+                this.initDefaultField(field);
+                this.initListField(fieldKey, field) // 处理列表
+                fields[fieldKey] = field;
+            });
+            this.fields = fields;
+            this.layout = this.getFieldsLayout(fields, this.block.layout);
+            // console.log(this.layout)
         },
         getFieldsLayout(fields, layout) {
             let la = {};
@@ -431,16 +414,15 @@ export default {
         },
         async emitEvent(name, args) {
             // console.log('emitEvent', name, args)
-            if (name) {
-                const action = this.block.events[name];
-                // 保证传入action的都是一个对象
-                args = args || {};
-                if (action) {
-                    await this.callAction(action, args);
-                } else {
-                    // 如果没有绑定event、默认调用同名action、这样可以简化减少如 evnets:{list:'@list'} 的配置
-                    await this.callAction(`@${name}`, args);
-                }
+            if (!name) return;
+            const action = this.block.events[name];
+            // 保证传入action的都是一个对象
+            args = args || {};
+            if (action) {
+                await this.callAction(action, args);
+            } else {
+                // 如果没有绑定event、默认调用同名action、这样可以简化减少如 events:{list:'@list'} 的配置
+                await this.callAction(`@${name}`, args);
             }
         },
         async callAction(...args) {