mooho-base-admin-plus 2.3.7 → 2.3.8

package/src/components/view/view-table.vue

@@ -205,14 +205,17 @@
                 <Option v-for="item in getDataSource(rowData(row, index), column)" :key="item.id" :value="item.id">{{ item.name }}</Option>
               </Select>
             </template>
-            <template v-else-if="column.controlType === 'ComboSelect'">
+            <!-- <template v-else-if="column.controlType === 'ComboSelect'">
               <Select
+                :ref="'control_' + column.code + '_' + index"
                 size="small"
-                :model-value="parseData(rowData(row, index), column.code)"
+                :model-value="parseComboData(rowData(row, index), column, index)"
                 @update:model-value="$event => setData(rowData(row, index), column.code, $event)"
                 :disabled="isReadonly(rowData(row, index), column)"
-                clearable
+                :clearable="true"
                 filterable
+                remote
+                :remote-method="search => loadOption(rowData(row, index), column, search)"
                 :style="{ width: column.controlWidth == null ? null : column.controlWidth - 8 + 'px' }"
                 :placeholder="column.description"
                 :transfer="true"
@@ -221,6 +224,25 @@
                 <Option v-for="item in getDataSource(rowData(row, index), column)" :key="item.id" :value="item.id">{{ item.name }}</Option>
               </Select>
             </template>
+            <template v-else-if="column.controlType === 'MultiComboSelect'">
+              <Select
+                :ref="'control_' + column.code + '_' + index"
+                :model-value="parseMultiComboData(rowData(row, index), column, index)"
+                @update:model-value="$event => setArrayData(rowData(row, index), column.code, $event)"
+                :disabled="isReadonly(rowData(row, index), column)"
+                :clearable="true"
+                :multiple="true"
+                filterable
+                remote
+                :remote-method="search => loadOption(rowData(row, index), column, search)"
+                :style="{ width: column.controlWidth == null ? null : column.controlWidth - 8 + 'px' }"
+                :placeholder="column.description"
+                :transfer="true"
+                @on-change="selected => onSelectDataChange(rowData(row, index), column, selected)"
+              >
+                <Option v-for="item in getDataSource(rowData(row, index), column)" :key="item.id" :value="item.id">{{ item.name }}</Option>
+              </Select>
+            </template> -->
             <template v-else-if="column.controlType === 'DialogSelect'">
               <dialog-select
                 :model-value="parseData(rowData(row, index), column.code)"
@@ -1633,9 +1655,10 @@
         this.columns.forEach(column => {
           if (
             column.controlType == 'Select' ||
+            column.controlType == 'MultiSelect' ||
             column.controlType == 'SelectWithOther' ||
             column.controlType == 'ComboSelect' ||
-            column.controlType == 'MultiSelect' ||
+            column.controlType == 'MultiComboSelect' ||
             column.controlType == 'Radio' ||
             column.controlType == 'CheckGroup'
           ) {
@@ -1729,13 +1752,19 @@
           data._needClear = {};
         }
 
+        if (column.controlType === 'ComboSelect' || column.controlType === 'MultiComboSelect') {
+          param.per = 20;
+        }
+
         // 参数完整，查询数据
+        this.disableLoader();
         let res;
         if (column.isSourceCustom) {
           res = await customModelApi.query(column.source, param);
         } else {
           res = await modelApi.query(column.source, param);
         }
+        this.enableLoader();
 
         data._rawData[column.code] = res.data;
 
@@ -1775,42 +1804,13 @@
       },
       // 获取数据源
       getDataSource(data, column) {
-        if (!column.isStaticItem && column.dataType.indexOf('Enum:') === 0) {
+        if (!column.isStaticItem && column.dataType.startsWith('Enum:')) {
           // 枚举
           return this.getEnumList(column.dataType.split(':')[1]);
         } else if (data._dataSource != null && data._dataSource[column.code] != null) {
           return data._dataSource[column.code];
         }
       },
-      // // 可筛选下拉框加载数据
-      // loadOption(data, column, keyword) {
-      //     if (!data._dataSource) {
-      //         data._dataSource = {};
-      //     }
-
-      //     let param = this.getParam(data, column, this.parentData);
-
-      //     if (param != null) {
-      //         if (!(keyword || '').trim() && this.parseData(data, column.code) != null) {
-      //             param.id = this.parseData(data, column.code);
-      //         } else {
-      //             param.keyword = keyword;
-      //         }
-      //         param.per = 20;
-
-      //         this.fillDataSource(data, column, param);
-      //     } else {
-      //         // 参数不完整，清空数据
-      //         data._dataSource[column.code] = [];
-      //         this.setData(data, column.code, null);
-      //         // column.displayValue = null;
-
-      //         // 触发
-      //         column.triggers.forEach(item => {
-      //             item.needRefresh = true;
-      //         });
-      //     }
-      // },
       // 每页数量切换
       pageSizeChange(size) {
         this.size = size;
@@ -1838,7 +1838,7 @@
 
         this.loadData();
       },
-      columnWidthResize(newWidth, oldWidth, column, event) {
+      columnWidthResize(newWidth, oldWidth, column) {
         let widthSetting = {};
         let widthSettingStr = localStorage.getItem('columnWidth_' + this.tableView.code);
 
@@ -2098,7 +2098,10 @@
         };
 
         for (let key in filter) {
-          if (typeof filter[key] == 'object' && !(filter[key] instanceof Date)) {
+          if (this.isJSON(filter[key])) {
+            // 数组转换为逗号分隔的字符串
+            filter[key] = JSON.parse(filter[key]).join(',');
+          } else if (typeof filter[key] == 'object' && !(filter[key] instanceof Date)) {
             delete filter[key];
           }
         }
@@ -2213,12 +2216,11 @@
                 // 相等
                 let c = column;
                 if (typeof value == 'string') {
-                  for (let i = 0; i < value.split(',').length; i++) {
-                    if (this.parseData(item, c) == value.split(',')[i]) {
-                      return true;
-                    }
+                  if (this.isJSON(value)) {
+                    return JSON.parse(value).some(i => i == this.parseData(item, c));
+                  } else {
+                    return value.split(',').some(i => i == this.parseData(item, c));
                   }
-                  return false;
                 } else if (value instanceof Date) {
                   return new Date(this.parseData(item, c)) == value;
                 } else {
@@ -2580,6 +2582,113 @@
         } else {
           return 'end';
         }
+      },
+      // 可筛选下拉框加载数据
+      async loadOption(data, column, keyword) {
+        if (column.isStaticItem || (column.dataType && column.dataType.startsWith('Enum:'))) {
+          return;
+        }
+
+        let param = this.getParam(data, column);
+
+        if (param != null) {
+          param[column.sourceDisplayCode + '_c'] = keyword;
+          this.fillDataSource(data, column, param);
+        } else {
+          // 参数不完整，清空数据
+          data._rawData[column.code] = [];
+          data._dataSource[column.code] = [];
+          this.setData(data, column.code, null);
+          // column.displayValue = null;
+
+          // 触发
+          column.triggers.forEach(item => {
+            item.needClear = true;
+          });
+        }
+      },
+      // 根据表达式取值(可筛选选择框)
+      parseComboData(model, column, index) {
+        let value = this.parseData(model, column.code);
+
+        this.loadComboDataLabel(model, column, value, index);
+
+        return value;
+      },
+      // 根据表达式取值(可筛选多选选择框)
+      parseMultiComboData(model, column, index) {
+        let data = [];
+        let value = this.parseData(model, column.code);
+
+        if (this.isJSON(value)) {
+          data = JSON.parse(value);
+        }
+
+        this.loadComboDataLabel(model, column, data, index);
+
+        return data;
+      },
+      // 加载可筛选选择框显示内容
+      async loadComboDataLabel(model, column, data, index) {
+        if (column.isStaticItem || (column.dataType && column.dataType.startsWith('Enum:'))) {
+          return;
+        }
+
+        // 取不到ref对象，无法给values赋值。所以可筛选选择框控件在table中暂时不可用
+        if (this.$refs['control_' + column.code + '_' + index]) {
+          let values = this.$refs['control_' + column.code + '_' + index].$data.values;
+
+          let pendings = [];
+          if (column.controlType == 'MultiComboSelect') {
+            data.forEach(value => {
+              if (!values.some(v => v.value == value)) {
+                // 不在选中项中
+                let newValue = { value, label: null, disabled: false };
+                values.push(newValue);
+                pendings.push(newValue);
+              }
+            });
+          } else {
+            if (!values.some(v => v.value == data)) {
+              // 不在选中项中
+              let newValue = { value: data, label: null, disabled: false };
+              values.push(newValue);
+              pendings.push(newValue);
+            }
+          }
+
+          // 读取显示内容
+          if (pendings.length > 0) {
+            let param = this.getParam(model, column);
+            param[column.sourceDataCode] = pendings.map(item => item.value).join(',');
+            let res;
+
+            if (column.isSourceCustom) {
+              res = await customModelApi.query(column.source, param);
+            } else {
+              res = await modelApi.query(column.source, param);
+            }
+
+            res.data.forEach(item => {
+              let v = this.parseData(item, column.sourceDataCode);
+              let label = this.parseData(item, column.sourceDisplayCode);
+
+              if (column.controlType == 'ComboSelect') {
+                // 添加筛选内容
+                this.$refs['control_' + column.code + '_' + index].$data.query = label;
+                //this.$refs['control_' + column.code + '_' + index].setQuery(label);
+              }
+
+              let newValue = pendings.find(i => i.value == v);
+
+              if (newValue) {
+                newValue.label = label;
+              }
+
+              this.$forceUpdate();
+            });
+          }
+        }
       }
     }
   };

package/src/mixins/page.js

@@ -1,7 +1,7 @@
 import util from '../libs/util';
 import { cloneDeep, get, set } from 'lodash';
 import router from '../router';
-import { mapState, mapActions } from 'vuex';
+import { mapState, mapActions, mapMutations } from 'vuex';
 import dateFormat from 'date-fns/format';
 import Setting from '../setting';
 import sweetalert2 from 'sweetalert2';
@@ -98,6 +98,8 @@ export default {
   },
   methods: {
     ...mapActions('admin/cache', ['loadEnum', 'loadDict', 'loadUserName', 'loadCache']),
+    ...mapMutations('admin/loader', { enableLoader: 'enable' }),
+    ...mapMutations('admin/loader', { disableLoader: 'disable' }),
     copy(model) {
       return cloneDeep(model);
       //return JSON.parse(JSON.stringify(model));
@@ -232,7 +234,7 @@ export default {
         return null;
       }
 
-      if (dataType.indexOf('Enum:') === 0) {
+      if (dataType.startsWith('Enum:')) {
         return this.getEnum(dataType.replace('Enum:', ''), this.parseData(model, expression));
       } else if (dataType === 'BigInteger' && format == 'User') {
         return this.getUserName(this.parseData(model, expression));
@@ -282,9 +284,16 @@ export default {
         }
       } else if (dataType === 'String') {
         if (format === 'Array') {
-          let array = JSON.parse(value);
+          let result = '';
+          try {
+            let array = JSON.parse(value);
 
-          return array.join(', ');
+            result = array.join(', ');
+          } catch (e) {
+            //console.log(e);
+          }
+
+          return result;
         } else {
           //if (this.layout.showI18n) {
           return this.tParam(value);
@@ -793,7 +802,7 @@ export default {
     },
     // 判断是否JSON
     isJSON(str) {
-      if (!!(str || '').trim()) {
+      if (typeof str == 'string' && !!(str || '').trim()) {
         try {
           var obj = JSON.parse(str);
           if (typeof obj == 'object' && obj) {