n20-common-lib 2.4.5 → 2.4.7

package/nstc-g6/components/Form/SelectindialogCustom/index.vue

@@ -30,14 +30,8 @@
         @click="!disabled && (dialogVisible = true) && handleSelectClick()"
       />
     </div>
-    <div
-      v-else
-      class="select-in-dialog-result"
-      @click="!disabled && (dialogVisible = true) && handleSelectClick()"
-    >
-      <span :class="{ 'select-in-dialog-result-null': !resultLabel }">{{
-        resultLabel || $t("common_w_0018")
-      }}</span>
+    <div v-else class="select-in-dialog-result" @click="!disabled && (dialogVisible = true) && handleSelectClick()">
+      <span :class="{ 'select-in-dialog-result-null': !resultLabel }">{{ resultLabel || $t('common_w_0018') }}</span>
       <el-button
         v-if="clearable && !disabled && hasValue"
         type="text"
@@ -90,182 +84,182 @@
 </template>
 
 <script>
-import DialogCustom from "^/Dialog/src/main";
-import TableRadioCustom from "../TableRadioCustom/index";
-import SelectCustom from "../SelectCustom/index";
-import NstcFormDialog from "../ComponentSecond";
-import variables from "@/theme/theme1/styles/variables.scss";
+import DialogCustom from '^/Dialog/src/main'
+import TableRadioCustom from '../TableRadioCustom/index'
+import SelectCustom from '../SelectCustom/index'
+import NstcFormDialog from '../ComponentSecond'
+import variables from '@/theme/theme1/styles/variables.scss'
 
-import request from "@/utils/request";
+import request from '@/utils/request'
 
 export default {
-  name: "NstcSelectInDialog",
+  name: 'NstcSelectInDialog',
 
   components: {
     DialogCustom,
     TableRadioCustom,
     SelectCustom,
-    NstcFormDialog,
+    NstcFormDialog
   },
 
   props: {
     // 双向绑定值,单选时为{ [valueKey]: 'xxx', [labelKey]: 'xxx' },多选时为[{ [valueKey]: 'xxx', [labelKey]: 'xxx' }, { [valueKey]: 'xxx', [labelKey]: 'xxx' },...]
     value: {
       type: [Object, Array, String],
-      default: null,
+      default: null
     },
 
     width: {
       type: [Number, String],
-      default: variables.formItemDefaultWidth,
+      default: variables.formItemDefaultWidth
     },
 
     // 是否多选
     multiple: {
       type: Boolean,
-      default: false,
+      default: false
     },
 
     // 是否可清空
     clearable: {
       type: Boolean,
-      default: false,
+      default: false
     },
 
     // 是否禁用
     disabled: {
       type: Boolean,
-      default: false,
+      default: false
     },
 
     // 弹窗标题
     title: {
       type: String,
-      default: "",
+      default: ''
     },
 
     // 弹窗表单配置项
     formConfig: {
       type: Array,
-      default: () => [],
+      default: () => []
     },
 
     formLabelWidth: {
-      default: "80px",
-      type: [String, Number],
+      default: '80px',
+      type: [String, Number]
     },
 
     // 弹窗表单请求的url
     url: {
       type: String,
-      default: "",
+      default: ''
     },
 
     // 弹窗表格列配置
     columns: {
       type: Array,
-      default: () => [],
+      default: () => []
     },
 
     // 双向绑定值的valueKey，需对应到表格行数据的某个属性
     valueKey: {
       type: String,
-      default: "key",
+      default: 'key'
     },
 
     // 双向绑定值的labelKey，需对应到表格行数据的某个属性
     labelKey: {
       type: String,
-      default: "",
+      default: ''
     },
 
     // 对请求参数的格式化
     queryParamFormatter: {
       type: Function,
-      default: undefined,
+      default: undefined
     },
 
     // 对请求返回数据的格式化
     queryDataFormatter: {
       type: Function,
-      default: undefined,
+      default: undefined
     },
 
     // 分页器是否展示
     showPagination: {
       default: false,
-      type: Boolean,
+      type: Boolean
     },
 
     // 是否支持远程搜索
     remote: {
       type: Boolean,
-      default: false,
+      default: false
     },
 
     // 远程搜索传参的key
     query: {
       type: String,
-      default: "query",
+      default: 'query'
     },
 
     // 远程搜索的其他参数
     queryParams: {
       type: Object,
-      default: () => ({}),
+      default: () => ({})
     },
 
     placeholder: {
       type: String,
       default: function () {
-        return "请选择";
-      },
+        return '请选择'
+      }
     },
 
     // 如果该标志设置为true, 将缓存查询结果
     cache: {
       type: Boolean,
-      default: false,
+      default: false
     },
 
     // 接收外部组件传来的表单默认值 (特殊)
     account: {
       type: String,
-      default: "",
+      default: ''
     },
 
     // 弹框宽度
     dialogWidth: {
       type: String,
-      default: "",
+      default: ''
     },
 
     // 请求方式
     httpMethod: {
       type: String,
-      default: "post",
+      default: 'post'
     },
 
     // 是否使用原始查询表单
     originalForm: {
       type: Boolean,
-      default: true,
+      default: true
     },
 
     // 是否使用原始表格
     originalTable: {
       type: Boolean,
-      default: true,
+      default: true
     },
     optionValueIsObject: {
       type: Boolean,
-      default: false,
+      default: false
     },
     // 表格数据选择的key
     tableDataKey: {
       type: String,
-      default: null,
-    },
+      default: null
+    }
   },
 
   data() {
@@ -282,25 +276,25 @@ export default {
       pagination: {
         page: 1,
         limit: 20,
-        total: 0,
+        total: 0
       },
 
       multipleSelected: [],
       footerHandlers: {
         confirm: {
-          text: "确认",
-        },
-      },
-    };
+          text: '确认'
+        }
+      }
+    }
   },
 
   computed: {
     resultLabel() {
       return this.value
         ? this.multiple
-          ? this.value.map((item) => item[this.labelKey]).join(",")
-          : this.value[this.labelKey] || ""
-        : "";
+          ? this.value.map((item) => item[this.labelKey]).join(',')
+          : this.value[this.labelKey] || ''
+        : ''
     },
 
     _formConfig() {
@@ -308,30 +302,30 @@ export default {
         if (Array.isArray(item)) {
           return item.map((cItem) => ({
             ...cItem,
-            clearable: true,
-          }));
+            clearable: true
+          }))
         }
 
         return {
           ...item,
-          clearable: true,
-        };
-      });
+          clearable: true
+        }
+      })
 
       if (_formConfig[0] && _formConfig[0][0]) {
-        return [..._formConfig, [{ mold: "querybutton" }]];
+        return [..._formConfig, [{ mold: 'querybutton' }]]
       }
 
-      return [..._formConfig, { mold: "querybutton" }];
+      return [..._formConfig, { mold: 'querybutton' }]
     },
 
     _value: {
       get() {
-        return this.value;
+        return this.value
       },
       set(val) {
-        const _val = val === "" ? null : val; // 避免单选时el-select清空时将_value设为'',导致value的type校验错误
-        this.$emit("input", _val);
+        const _val = val === '' ? null : val // 避免单选时el-select清空时将_value设为'',导致value的type校验错误
+        this.$emit('input', _val)
 
         // let parent = this.$parent || this.$root
         // let name = parent.$options.componentName
@@ -347,14 +341,12 @@ export default {
         // if (parent) {
         //   parent.$emit.apply(parent, ['el.form.change'].concat([value]))
         // }
-      },
+      }
     },
 
     hasValue() {
-      return this.multiple
-        ? this._value && this._value.length
-        : this._value || this._value === 0;
-    },
+      return this.multiple ? this._value && this._value.length : this._value || this._value === 0
+    }
   },
 
   watch: {
@@ -362,123 +354,117 @@ export default {
       deep: true,
       handler(val) {
         if (this.isSelectChangeValue) {
-          this.isSelectChangeValue = false;
+          this.isSelectChangeValue = false
         } else {
-          this.setSelectOptions(val);
+          this.setSelectOptions(val)
         }
-      },
+      }
     },
 
     dialogVisible(val) {
       if (this.$refs.formCustom) {
-        this.$refs.formCustom.resetFields();
+        this.$refs.formCustom.resetFields()
       }
 
-      const init =
-        (!this.formConfig || !this.formConfig.length) && !this.hasInit; // 未初始化
-      const query = init || !this.cache; // 不需要缓存
+      const init = (!this.formConfig || !this.formConfig.length) && !this.hasInit // 未初始化
+      const query = init || !this.cache // 不需要缓存
       if (query && val) {
-        this.handleQuery();
+        this.handleQuery()
       }
-    },
+    }
   },
 
   mounted() {
-    this.setSelectOptions(this.value);
+    this.setSelectOptions(this.value)
   },
 
   methods: {
     handleClear() {
       this.$nextTick(() => {
-        this._value = this.multiple ? [] : null;
-      });
+        this._value = this.multiple ? [] : null
+      })
     },
 
     async handleQuery(model, initPage = true) {
-      console.log("initPage", initPage, this.loading);
+      console.log('initPage', initPage, this.loading)
       if (this.loading) {
-        return "";
+        return ''
       }
-      this.loading = true;
-      console.log("__log_err", 11);
-      this.pagination.page = initPage.page || 1;
+      this.loading = true
+      console.log('__log_err', 11)
+      this.pagination.page = initPage.page || 1
       try {
         let param = {
-          ...this.queryParams,
-        };
+          ...this.queryParams
+        }
 
         if (this.queryParamFormatter && model) {
-          const formatParam = await this.queryParamFormatter(
-            model,
-            this.pagination
-          );
+          const formatParam = await this.queryParamFormatter(model, this.pagination)
 
           param = {
             ...param,
-            ...formatParam,
-          };
+            ...formatParam
+          }
           // 如果没有分页
-          !param.pagination && (param.pagination = this.pagination);
+          !param.pagination && (param.pagination = this.pagination)
         } else {
           if (this.showPagination) {
             param = {
               ...param,
               ...model,
-              pagination: this.pagination,
-            };
+              pagination: this.pagination
+            }
           } else {
             param = {
               ...param,
-              ...model,
-            };
+              ...model
+            }
           }
         }
-        console.log("查询参数", param);
+        console.log('查询参数', param)
 
-        const key = this.httpMethod === "get" ? "params" : "data";
-        if (this.httpMethod === "get" && param.pagination) {
-          param["page.current"] = param.pagination.page;
-          param["page.size"] = param.pagination.limit;
-          delete param.pagination;
+        const key = this.httpMethod === 'get' ? 'params' : 'data'
+        if (this.httpMethod === 'get' && param.pagination) {
+          param['page.current'] = param.pagination.page
+          param['page.size'] = param.pagination.limit
+          delete param.pagination
         }
-        let res = [];
+        let res = []
         await request({
           url: this.url,
           method: this.httpMethod,
-          [key]: param,
+          [key]: param
         })
           .then((data) => {
-            res = data;
-            this.loading = false;
-            console.log("__log_返回数据", data);
+            res = data
+            this.loading = false
+            console.log('__log_返回数据', data)
           })
           .catch(() => {
-            this.loading = false;
-          });
+            this.loading = false
+          })
 
-        let tableData = res.list || res;
+        let tableData = res.list || res
 
         if (this.tableDataKey) {
-          tableData = tableData[this.tableDataKey];
+          tableData = tableData[this.tableDataKey]
         }
 
         // 后台报错时
         if (!(tableData instanceof Array)) {
-          tableData = [];
+          tableData = []
         }
 
-        this.tableData = this.queryDataFormatter
-          ? await this.queryDataFormatter(tableData)
-          : tableData;
-        this.hasInit = true;
-        this.loading = false;
+        this.tableData = this.queryDataFormatter ? await this.queryDataFormatter(tableData) : tableData
+        this.hasInit = true
+        this.loading = false
 
         if (this.showPagination) {
-          this.pagination.total = res.total;
+          this.pagination.total = res.total
         }
       } catch (err) {
-        this.loading = false;
-        console.error(err);
+        this.loading = false
+        console.error(err)
       }
     },
 
@@ -486,58 +472,58 @@ export default {
       this.$nextTick(() => {
         this.$refs.formCustom.handleExpectQuery({
           initPage: page === 1,
-          page,
-        });
-      });
+          page
+        })
+      })
     },
 
     setSelectOptions(val) {
       if (this.remote && val) {
-        let options;
+        let options
 
         if (this.multiple) {
           options = val.map((item) => {
             return {
               label: item[this.labelKey],
-              value: item,
-            };
-          });
+              value: item
+            }
+          })
         } else {
           options = [
             {
               label: val[this.labelKey],
-              value: val,
-            },
-          ];
+              value: val
+            }
+          ]
         }
 
-        this.$refs.selectCustom.setRemoteOptions(options);
+        this.$refs.selectCustom.setRemoteOptions(options)
       }
     },
 
     handleMultipleChange(val) {
-      this.multipleSelected = val;
+      this.multipleSelected = val
     },
 
     handleMultipleConfirm() {
-      this._value = this.multipleSelected;
+      this._value = this.multipleSelected
     },
 
     async handleSelectClick() {
       if (this.account) {
-        this._formConfig[0].default = this.account;
-        this._formConfig[1].default = null;
+        this._formConfig[0].default = this.account
+        this._formConfig[1].default = null
       }
     },
 
     handleTableChange({ recordId, ...val }) {
-      this.dialogVisible = false;
+      this.dialogVisible = false
       // console.log(recordId, val)
-      this.$emit("recordId-change", { recordId });
-      this.$emit("selectindialog-change", val);
-    },
-  },
-};
+      this.$emit('recordId-change', { recordId })
+      this.$emit('selectindialog-change', val)
+    }
+  }
+}
 </script>
 
 <style lang="scss">
@@ -631,14 +617,13 @@ export default {
   }
   .select-in-dialog-result {
     height: 32px;
-    .el-select .el-tag__close{
+    .el-select .el-tag__close {
       font-size: 14px;
       &::before {
         transform: none;
-      color: #fff;
+        color: #fff;
       }
-      
-  }
+    }
   }
   .form-base-wrapper {
     display: flex;

package/nstc-g6/components/Form/SelectindialogCustom/install.js

@@ -1,7 +1,7 @@
 import NstcSelectInDialog from './index.vue'
 
-NstcSelectInDialog.install = function(Vue) {
-    Vue.component(NstcSelectInDialog.name, NstcSelectInDialog)
+NstcSelectInDialog.install = function (Vue) {
+  Vue.component(NstcSelectInDialog.name, NstcSelectInDialog)
 }
 
-export default NstcSelectInDialog
+export default NstcSelectInDialog

package/nstc-g6/components/Form/TableRadioCustom/demo/index.vue

@@ -1,11 +1,5 @@
 <template>
-  <TableRadioCustom
-    v-model="value"
-    :columns="columns"
-    :data="data"
-    value-key="prop1"
-    @change="handleChange"
-  />
+  <TableRadioCustom v-model="value" :columns="columns" :data="data" value-key="prop1" @change="handleChange" />
 </template>
 
 <script>