cfort пре 2 година
родитељ
комит
f1bae3abb7

+ 279 - 339
src/business/platform/data/templaterender/custom-dialog/index.vue

@@ -23,516 +23,456 @@
             :label-key="labelKey"
             :preview="false"
             type="dialog"
-            @close="(visible) => (selectorVisible = visible)"
+            @close="visible => selectorVisible = visible"
             @action-event="handleSelectorActionEvent"
         />
     </div>
 </template>
 <script>
-import {
-    getByKey,
-    transferByIds,
-    queryDataById,
-} from "@/api/platform/data/dataTemplate";
-import { valueEquals } from "@/plugins/element-ui/src/utils/util";
-import emitter from "@/plugins/element-ui/src/mixins/emitter";
+import { getByKey, transferByIds, queryDataById } from '@/api/platform/data/dataTemplate'
+import { valueEquals } from '@/plugins/element-ui/src/utils/util'
+import emitter from '@/plugins/element-ui/src/mixins/emitter'
 // remoteTransRequest
-import { remoteRequest, remoteTransRequest } from "@/utils/remote";
-import DataTemplateDialog from "../preview";
-import IbpsSelector from "@/components/ibps-selector/selector";
-import { buildLabelTitle } from "../utils";
-import { TRANSFER_DATA } from "@/constant";
+import { remoteRequest, remoteTransRequest } from '@/utils/remote'
+import DataTemplateDialog from '../preview'
+import IbpsSelector from '@/components/ibps-selector/selector'
+import { buildLabelTitle } from '../utils'
+import { TRANSFER_DATA } from '@/constant'
 
 export default {
     components: {
         DataTemplateDialog,
-        IbpsSelector,
+        IbpsSelector
     },
     mixins: [emitter],
     props: {
-        value: {
-            // value
+        value: { // value
             type: [String, Number, Object, Array],
-            default() {
-                return this.multiple ? [] : {};
-            },
+            default () {
+                return this.multiple ? [] : {}
+            }
         },
-        templateKey: {
-            // 数据模版key
-            type: String,
+        templateKey: { // 数据模版key
+            type: String
         },
-        dynamicParams: {
-            // 动态参数
-            type: Object,
+        dynamicParams: { // 动态参数
+            type: Object
         },
         // 存储类型 ,
         // ①、id:只存储id 字符串,
         // ②、json: json字符串,
         store: {
             type: String,
-            default: "id",
+            default: 'id',
             validator: function (value) {
-                return ["id", "json"].indexOf(value) !== -1;
-            },
+                return ['id', 'json'].indexOf(value) !== -1
+            }
         },
-        storeSeparator: {
-            // 存储值分割符,对应[多选]有效,对于设置字符串类型的分隔符
+        storeSeparator: { // 存储值分割符,对应[多选]有效,对于设置字符串类型的分隔符
             type: String,
-            default: ",",
+            default: ','
         },
-        placeholder: {
-            // 输入框占位文本
+        placeholder: { // 输入框占位文本
             type: String,
-            default: "请选择",
+            default: '请选择'
         },
-        multiple: {
-            // 是否多选
+        multiple: { // 是否多选
             type: Boolean,
-            default: false,
+            default: false
         },
-        disabled: {
-            // 禁用
+        disabled: { // 禁用
             type: Boolean,
-            default: false,
+            default: false
         },
         size: {
             type: String,
-            default: "mini",
+            default: 'mini'
         },
-        readonly: {
-            // 只读
+        readonly: { // 只读
             type: Boolean,
-            default: false,
+            default: false
         },
-        readonlyText: {
-            // 只读样式
+        readonlyText: { // 只读样式
             type: String,
-            default: "text",
+            default: 'text'
         },
         icon: {
             type: String,
-            default: "search-plus",
+            default: 'search-plus'
         },
         tempSearch: {
             // 是否是数据模板使用的筛选条件
             type: Boolean,
-            default: false,
+            default: false
         },
     },
-    data() {
+    data () {
         return {
             initialization: false,
             dataTemplate: {},
-            labelKey: "",
-            valueKey: "",
+            labelKey: '',
+            valueKey: '',
             selectorVisible: false,
             selectorValue: this.multiple ? [] : {},
             cacheData: {},
-            bindIdValue: "",
-        };
+            bindIdValue: ''
+        }
     },
     computed: {
-        items() {
-            if (this.$utils.isEmpty(this.selectorValue)) return [];
+        items () {
+            if (this.$utils.isEmpty(this.selectorValue)) return []
             if (this.multiple) {
-                return this.selectorValue.map((data) => {
-                    return this.handleLabel(data);
-                });
+                return this.selectorValue.map(data => {
+                    return this.handleLabel(data)
+                })
             } else {
-                return [this.handleLabel(this.selectorValue)];
+                return [this.handleLabel(this.selectorValue)]
             }
-        },
+        }
     },
     watch: {
         value: {
-            handler(val, oldVal) {
-                this.initData();
+            handler (val, oldVal) {
+                this.initData()
                 if (!valueEquals(val, oldVal)) {
-                    this.dispatch("ElFormItem", "el.form.change", val);
+                    this.dispatch('ElFormItem', 'el.form.change', val)
                 }
             },
-            immediate: true,
+            immediate: true
         },
         templateKey: {
-            handler(val, oldVal) {
+            handler (val, oldVal) {
                 if (val !== oldVal && val) {
-                    this.loadTemplateData();
+                    this.loadTemplateData()
                 } else {
-                    this.dataTemplate = {};
+                    this.dataTemplate = {}
                 }
             },
-            immediate: true,
+            immediate: true
         },
-        dynamicParams(val, oldVal) {
+        dynamicParams (val, oldVal) {
             if (val !== oldVal) {
-                this.initData();
+                this.initData()
             }
-        },
+        }
     },
-    beforeDestroy() {
-        this.dataTemplate = {};
-        this.cacheData = {};
+    beforeDestroy () {
+        this.dataTemplate = {}
+        this.cacheData = {}
     },
     methods: {
-        loadTemplateData() {
-            this.initialization = false;
+        loadTemplateData () {
+            this.initialization = false
             if (this.$utils.isEmpty(this.templateKey)) {
-                return;
+                return
             }
-            remoteRequest("dataTemplate", this.templateKey, () => {
-                return this.getRemoteDataTemplateFunc(this.templateKey);
+            remoteRequest('dataTemplate', this.templateKey, () => {
+                return this.getRemoteDataTemplateFunc(this.templateKey)
+            }).then(data => {
+                this.initialization = true
+                this.dataTemplate = this.$utils.parseData(data)
+                this.dataTemplate.showType === 'compose' ? this.initDataTemplate(this.dataTemplate.composeType === 'treeList' ? this.dataTemplate.templates[1].attrs.bind_template_key : this.dataTemplate.templates[0].attrs.bind_template_key) : this.initDataTemplate()
+            }).catch(() => {
             })
-                .then((data) => {
-                    this.initialization = true;
-                    this.dataTemplate = this.$utils.parseData(data);
-                    this.dataTemplate.showType === "compose"
-                        ? this.initDataTemplate(
-                              this.dataTemplate.composeType === "treeList"
-                                  ? this.dataTemplate.templates[1].attrs
-                                        .bind_template_key
-                                  : this.dataTemplate.templates[0].attrs
-                                        .bind_template_key
-                          )
-                        : this.initDataTemplate();
-                })
-                .catch(() => {});
         },
-        getRemoteDataTemplateFunc(templateKey) {
+        getRemoteDataTemplateFunc (templateKey) {
             return new Promise((resolve, reject) => {
-                getByKey({ dataTemplateKey: templateKey })
-                    .then((response) => {
-                        resolve(response.data);
-                    })
-                    .catch((error) => {
-                        reject(error);
-                    });
-            });
+                getByKey({ dataTemplateKey: templateKey }).then(response => {
+                    resolve(response.data)
+                }).catch((error) => {
+                    reject(error)
+                })
+            })
         },
-        initDataTemplate(key) {
+        initDataTemplate (key) {
             if (this.$utils.isEmpty(key)) {
-                this.valueKey = this.dataTemplate.unique;
-                this.labelKey = buildLabelTitle(this.dataTemplate);
-                this.initData();
+                this.valueKey = this.dataTemplate.unique
+                this.labelKey = buildLabelTitle(this.dataTemplate)
+                this.initData()
             } else {
-                remoteRequest("dataTemplate", key, () => {
-                    return this.getRemoteDataTemplateFunc(key);
+                remoteRequest('dataTemplate', key, () => {
+                    return this.getRemoteDataTemplateFunc(key)
+                }).then(res => {
+                    this.initialization = true
+                    const data = this.$utils.parseData(res)
+                    this.valueKey = data.unique
+                    this.labelKey = buildLabelTitle(data)
+                    this.initData()
+                }).catch(() => {
                 })
-                    .then((res) => {
-                        this.initialization = true;
-                        const data = this.$utils.parseData(res);
-                        this.valueKey = data.unique;
-                        this.labelKey = buildLabelTitle(data);
-                        this.initData();
-                    })
-                    .catch(() => {});
             }
         },
-        handleLabel(data) {
-            const config = this.labelKey;
-            if (typeof config === "function") {
-                return config(data);
-            } else if (typeof config === "string") {
-                return data[config];
-            } else if (typeof config === "undefined") {
-                const dataProp = data["name"];
-                return dataProp === undefined ? "" : dataProp;
+        handleLabel (data) {
+            const config = this.labelKey
+            if (typeof config === 'function') {
+                return config(data)
+            } else if (typeof config === 'string') {
+                return data[config]
+            } else if (typeof config === 'undefined') {
+                const dataProp = data['name']
+                return dataProp === undefined ? '' : dataProp
             }
         },
         /**
          * 初始化数据
          */
-        initData(init = true) {
-            const data = this.getArrayValue(this.value);
-            this.selectorValue = this.multiple ? [] : {};
+        initData (init = true) {
+            const data = this.getArrayValue(this.value)
+            this.selectorValue = this.multiple ? [] : {}
             if (this.$utils.isEmpty(data)) {
-                return;
+                return
             }
-            data.forEach((v) => {
+            data.forEach(v => {
                 if (this.cacheData[v]) {
-                    this.setSelectorValue(v);
+                    this.setSelectorValue(v)
                 } else {
                     if (init && this.initialization) {
-                        this.getDataInfo(v);
+                        this.getDataInfo(v)
                     }
                 }
-            });
-        },
-        setCacheData() {
-            if (this.$utils.isEmpty(this.selectorValue)) return;
-            const data = this.multiple
-                ? this.selectorValue
-                : [this.selectorValue];
-            data.forEach((v) => {
-                this.cacheData[v[this.valueKey]] = v;
-            });
-        },
-        setSelectorValue(v) {
+            })
+        },
+        setCacheData () {
+            if (this.$utils.isEmpty(this.selectorValue)) return
+            const data = this.multiple ? this.selectorValue : [this.selectorValue]
+            data.forEach(v => {
+                this.cacheData[v[this.valueKey]] = v
+            })
+        },
+        setSelectorValue (v) {
             if (this.multiple) {
-                this.selectorValue.push(this.cacheData[v]);
+                this.selectorValue.push(this.cacheData[v])
             } else {
-                this.selectorValue = JSON.parse(
-                    JSON.stringify(this.cacheData[v])
-                );
+                this.selectorValue = JSON.parse(JSON.stringify(this.cacheData[v]))
             }
         },
         /**
          * 获得数组数据
          */
-        getArrayValue(value, bindId) {
+        getArrayValue (value, bindId) {
             if (this.$utils.isEmpty(value)) {
-                return [];
+                return []
             }
-            if (this.store === "json") {
-                // json
-                const o =
-                    Object.prototype.toString.call(
-                        this.$utils.parseData(value)
-                    ) === "[object Object]";
+            if (this.store === 'json') { // json
+                const o = Object.prototype.toString.call(this.$utils.parseData(value)) === '[object Object]'
                 try {
-                    const data = o
-                        ? [this.$utils.parseData(value)]
-                        : this.$utils.parseData(value);
+                    const data = o ? [this.$utils.parseData(value)] : this.$utils.parseData(value)
                     return data.map((d) => {
-                        return d[this.valueKey];
-                    });
+                        return d[this.valueKey]
+                    })
                 } catch (error) {
-                    console.error(error);
-                    return [];
+                    console.error(error)
+                    return []
                 }
-            } else if (this.store === "id") {
-                // id
-                return value.split(this.storeSeparator);
-            } else if (this.store === "bind") {
-                // 绑定id
+            } else if (this.store === 'id') { // id
+                return value.split(this.storeSeparator)
+            } else if (this.store === 'bind') { // 绑定id
                 if (this.$utils.isEmpty(bindId)) {
-                    return [];
+                    return []
                 }
-                return bindId.split(this.storeSeparator);
-            } else {
-                // array
+                return bindId.split(this.storeSeparator)
+            } else { // array
                 return value.map((d) => {
-                    return d[this.valueKey];
-                });
+                    return d[this.valueKey]
+                })
             }
         },
-        getStoreValue(value) {
-            const res = [];
-            if (this.store === "json") {
-                // json
+        getStoreValue (value) {
+            const res = []
+            if (this.store === 'json') { // json
                 if (this.$utils.isEmpty(value)) {
-                    return "";
+                    return ''
                 }
                 if (this.multiple) {
-                    value.forEach((v) => {
-                        const o = {};
-                        o[this.valueKey] = v[this.valueKey];
-                        if (typeof this.labelKey === "string") {
-                            o[this.labelKey] = v[this.labelKey];
-                            o["#title#"] = v[this.labelKey];
+                    value.forEach(v => {
+                        const o = {}
+                        o[this.valueKey] = v[this.valueKey]
+                        if (typeof this.labelKey === 'string') {
+                            o[this.labelKey] = v[this.labelKey]
+                            o['#title#'] = v[this.labelKey]
                         } else {
-                            o["#title#"] = this.labelKey(v);
+                            o['#title#'] = this.labelKey(v)
                         }
-                        res.push(o);
-                    });
-                    return JSON.stringify(res);
+                        res.push(o)
+                    })
+                    return JSON.stringify(res)
                 } else {
-                    const o = {};
-                    o[this.valueKey] = value[this.valueKey];
-                    if (typeof this.labelKey === "string") {
-                        o[this.labelKey] = value[this.labelKey];
-                        o["#title#"] = value[this.labelKey];
+                    const o = {}
+                    o[this.valueKey] = value[this.valueKey]
+                    if (typeof this.labelKey === 'string') {
+                        o[this.labelKey] = value[this.labelKey]
+                        o['#title#'] = value[this.labelKey]
                     } else {
-                        o["#title#"] = this.labelKey(value);
+                        o['#title#'] = this.labelKey(value)
                     }
-                    return JSON.stringify(o);
+                    return JSON.stringify(o)
                 }
-            } else if (this.store === "id") {
-                // id
+            } else if (this.store === 'id') { // id
                 if (this.$utils.isEmpty(value)) {
-                    return "";
+                    return ''
                 }
                 if (this.multiple) {
-                    value.forEach((v) => {
-                        res.push(v[this.valueKey]);
-                    });
+                    value.forEach(v => {
+                        res.push(v[this.valueKey])
+                    })
                 } else {
-                    res.push(value[this.valueKey]);
+                    res.push(value[this.valueKey])
                 }
-                return res.join(this.storeSeparator);
-            } else if (this.store === "bind") {
-                // 绑定id
-                const res = [];
-                const bindIdValue = [];
-                value.forEach((v) => {
-                    bindIdValue.push(v[this.valueKey]);
-                    res.push(v[this.labelKey]);
-                });
-                this.bindIdValue = bindIdValue.join(this.storeSeparator);
+                return res.join(this.storeSeparator)
+            } else if (this.store === 'bind') { // 绑定id
+                const res = []
+                const bindIdValue = []
+                value.forEach(v => {
+                    bindIdValue.push(v[this.valueKey])
+                    res.push(v[this.labelKey])
+                })
+                this.bindIdValue = bindIdValue.join(this.storeSeparator)
 
-                return res.join(this.storeSeparator);
-            } else {
-                // 数组 array
-                return value || [];
+                return res.join(this.storeSeparator)
+            } else { // 数组 array
+                return value || []
             }
         },
-        getValue() {
-            return this.getStoreValue(this.selectorValue);
+        getValue () {
+            return this.getStoreValue(this.selectorValue)
         },
         /**
-         * 通过ID获取数据
-         */
-        getDataInfo(id) {
-            if (TRANSFER_DATA === "transfer") {
-                this.getTransferData(id);
+        * 通过ID获取数据
+        */
+        getDataInfo (id) {
+            if (TRANSFER_DATA === 'transfer') {
+                this.getTransferData(id)
             } else {
-                this.getRemoteData(id);
+                this.getRemoteData(id)
             }
         },
-        getTransferData(id) {
-            remoteTransRequest("dataTemplate:" + this.templateKey, id).then(
-                (idset) => {
-                    const ids = Array.from(idset);
-                    remoteRequest("dataTemplateIds", ids, () => {
-                        return this.getRemoteTransFunc(ids);
-                    })
-                        .then((response) => {
-                            if (
-                                this.$utils.isNotEmpty(response) &&
-                                this.$utils.isNotEmpty(response.data)
-                            ) {
-                                const responseData = response.data;
-                                const dataKey = id;
-                                const data = responseData[dataKey]
-                                    ? responseData[dataKey]
-                                    : {};
-                                let key = id;
-                                if (
-                                    this.$utils.isNotEmpty(data[this.valueKey])
-                                ) {
-                                    key = data[this.valueKey];
-                                }
-                                this.cacheData[key] = data;
-                                this.initData(false);
-                            }
-                        })
-                        .catch(() => {});
-                }
-            );
+        getTransferData (id) {
+            remoteTransRequest('dataTemplate:' + this.templateKey, id).then(idset => {
+                const ids = Array.from(idset)
+                remoteRequest('dataTemplateIds', ids, () => {
+                    return this.getRemoteTransFunc(ids)
+                }).then(response => {
+                    if (this.$utils.isNotEmpty(response) && this.$utils.isNotEmpty(response.data)) {
+                        const responseData = response.data
+                        const dataKey = id
+                        const data = responseData[dataKey] ? responseData[dataKey] : {}
+                        let key = id
+                        if (this.$utils.isNotEmpty(data[this.valueKey])) {
+                            key = data[this.valueKey]
+                        }
+                        this.cacheData[key] = data
+                        this.initData(false)
+                    }
+                }).catch(() => {
+                })
+            })
         },
-        getRemoteTransFunc(ids) {
+        getRemoteTransFunc (ids) {
             return new Promise((resolve, reject) => {
                 transferByIds({
-                    templateKey: this.templateKey,
-                    ids: ids,
+                    'templateKey': this.templateKey,
+                    'ids': ids
+                }).then(response => {
+                    resolve(response)
+                }).catch((error) => {
+                    reject(error)
                 })
-                    .then((response) => {
-                        resolve(response);
-                    })
-                    .catch((error) => {
-                        reject(error);
-                    });
-            });
+            })
         },
 
         /**
          * 通过ID获取数据
          */
-        getRemoteData(id) {
+        getRemoteData (id) {
             const params = {
                 key: this.templateKey,
-                id: id,
-            };
+                id: id
+            }
             if (this.$utils.isNotEmpty(this.dynamicParams)) {
-                params["dynamicParams"] = JSON.stringify(this.dynamicParams);
+                params['dynamicParams'] = JSON.stringify(this.dynamicParams)
             }
-            remoteRequest("dataTemplate", params, () => {
-                return this.getRemoteDataTemplateByIdFunc(params);
-            })
-                .then((responseData) => {
-                    if (
-                        this.$utils.isNotEmpty(responseData) &&
-                        this.$utils.isNotEmpty(responseData.data)
-                    ) {
-                        const data = responseData.data[0];
-                        let key = id;
-                        if (this.$utils.isNotEmpty(data[this.valueKey])) {
-                            key = data[this.valueKey];
-                        }
-                        this.cacheData[key] = data;
-                        this.initData(false);
+            remoteRequest('dataTemplate', params, () => {
+                return this.getRemoteDataTemplateByIdFunc(params)
+            }).then(responseData => {
+                if (this.$utils.isNotEmpty(responseData) && this.$utils.isNotEmpty(responseData.data)) {
+                    const data = responseData.data[0]
+                    let key = id
+                    if (this.$utils.isNotEmpty(data[this.valueKey])) {
+                        key = data[this.valueKey]
                     }
-                })
-                .catch(() => {});
+                    this.cacheData[key] = data
+                    this.initData(false)
+                }
+            }).catch(() => {
+            })
         },
-        getRemoteDataTemplateByIdFunc(params) {
+        getRemoteDataTemplateByIdFunc (params) {
             return new Promise((resolve, reject) => {
-                queryDataById(params)
-                    .then((response) => {
-                        resolve(response.data);
-                    })
-                    .catch((error) => {
-                        reject(error);
-                    });
-            });
+                queryDataById(params).then(response => {
+                    resolve(response.data)
+                }).catch((error) => {
+                    reject(error)
+                })
+            })
         },
         // ===================事件处理=========
 
-        handleSelectorClick() {
+        handleSelectorClick () {
             if (this.$utils.isEmpty(this.templateKey)) {
-                this.$message.closeAll();
+                this.$message.closeAll()
                 this.$message({
-                    message: "请绑定自定义对话框",
-                    type: "warning",
-                });
-                return;
+                    message: '请绑定自定义对话框',
+                    type: 'warning'
+                })
+                return
             }
-            this.selectorVisible = true;
-            this.initData();
+            this.selectorVisible = true
+            this.initData()
         },
-        handleSelectorRemove(index) {
+        handleSelectorRemove (index) {
             if (this.multiple) {
-                this.selectorValue.splice(index, 1);
+                this.selectorValue.splice(index, 1)
             } else {
-                this.selectorValue = {};
+                this.selectorValue = {}
             }
-            const val = this.getValue();
-            this.handleInput(val);
-            this.emitChange(val);
+            const val = this.getValue()
+            this.handleInput(val)
+            this.emitChange(val)
         },
 
-        handleSelectorActionEvent(buttonKey, data) {
-            let val;
+        handleSelectorActionEvent (buttonKey, data) {
+            let val
             switch (buttonKey) {
-                case "ok": // 确定
-                    this.selectorVisible = false;
-                    this.selectorValue = data;
-                    this.setCacheData(); // 设置缓存数据
-                    val = this.getValue();
-                    this.handleInput(val);
-                    this.emitChange(val);
-                    break;
-                case "cleanClose": // 清空关闭
-                    this.selectorVisible = false;
-                    this.selectorValue = this.multiple ? [] : {};
-                    this.handleInput("");
-                    this.emitChange("");
-                    break;
-                case "cancel": // 取消
-                    this.selectorVisible = false;
-                    break;
-                // TODO:自定义按钮事件处理
+                case 'ok':// 确定
+                    this.selectorVisible = false
+                    this.selectorValue = data
+                    this.setCacheData() // 设置缓存数据
+                    val = this.getValue()
+                    this.handleInput(val)
+                    this.emitChange(val)
+                    break
+                case 'cleanClose': // 清空关闭
+                    this.selectorVisible = false
+                    this.selectorValue = this.multiple ? [] : {}
+                    this.handleInput('')
+                    this.emitChange('')
+                    break
+                case 'cancel':// 取消
+                    this.selectorVisible = false
+                    break
+        // TODO:自定义按钮事件处理
             }
         },
-        emitChange(val) {
+        emitChange (val) {
             if (!valueEquals(this.value, val)) {
-                this.$emit("change", val, this.selectorValue);
-                this.$emit("change-link-data", val, this.selectorValue);
+                this.$emit('change', val, this.selectorValue)
+                this.$emit('change-link-data', val, this.selectorValue)
             }
         },
-        handleInput(val) {
-            this.$emit("input", val, this.selectorValue);
-            this.$emit("change-link-attr", val, this.selectorValue);
-        },
-    },
-};
+        handleInput (val) {
+            this.$emit('input', val, this.selectorValue)
+            this.$emit('change-link-attr', val, this.selectorValue)
+        }
+    }
+}
 </script>

+ 1 - 1
src/business/platform/data/templaterender/templates/list.vue

@@ -1776,7 +1776,7 @@ export default {
                 return str
             }
             return this.replaceAll(str.replace(find, replace), find, replace)
-        },
+        }
     }
 }
 </script>

+ 109 - 137
src/components/ibps-selector/selector.vue

@@ -1,29 +1,25 @@
 <template>
-    <div class="el-selector" @click="handleFocus">
+    <div
+        class="el-selector"
+        @click="handleFocus"
+    >
         <div
-            v-if="selected && selected.length > 0"
+            v-if="selected && selected.length >0"
             ref="tags"
-            :style="{
-                'max-width': inputWidth + 'px',
-                width: '100%',
-                overflow: 'hidden',
-                'white-space': 'ellipsis',
-                'word-break': 'break-all',
-                'text-overflow': 'ellipsis',
-            }"
+            :style="{ 'max-width': inputWidth + 'px', width: '100%',overflow: 'hidden','white-space': 'ellipsis', 'word-break': 'break-all','text-overflow': 'ellipsis'}"
             class="el-selector__tags"
         >
             <transition-group @after-leave="resetInputHeight">
                 <template v-for="(item, index) in selected">
                     <el-tag
-                            v-if="index === 0 || !tempSearch"
-                            :key="item + index"
-                            type="primary"
-                            :closable="!selectDisabled"
-                            :size="collapseTagSize"
-                            disable-transitions
-                            @close="deleteTag(index)"
-                        >
+                        v-if="index === 0 || !tempSearch"
+                        :key="item + index"
+                        type="primary"
+                        :closable="!selectDisabled"
+                        :size="collapseTagSize"
+                        disable-transitions
+                        @close="deleteTag(index)"
+                    >
                         <span class="el-selector__tags-text">{{ item }}</span>
                     </el-tag>
                     <el-tag
@@ -32,9 +28,7 @@
                         :size="collapseTagSize"
                         type="primary"
                     >
-                        <span class="el-selector__tags-text"
-                            >+ {{ selected.length - 1 }}</span
-                        >
+                        <span class="el-selector__tags-text">+ {{ selected.length - 1 }}</span>
                     </el-tag>
                 </template>
             </transition-group>
@@ -57,212 +51,190 @@
     </div>
 </template>
 <script>
-import {
-    addResizeListener,
-    removeResizeListener,
-} from "@/plugins/element-ui/src/utils/resize-event";
-import emitter from "@/plugins/element-ui/src/mixins/emitter";
+import { addResizeListener, removeResizeListener } from '@/plugins/element-ui/src/utils/resize-event'
+import emitter from '@/plugins/element-ui/src/mixins/emitter'
 const sizeMap = {
-    medium: 36,
-    small: 32,
-    mini: 28,
-};
+    'medium': 36,
+    'small': 32,
+    'mini': 28
+}
 
 export default {
-    name: "ibps-selector",
+    name: 'ibps-selector',
     mixins: [emitter],
     props: {
         items: {
-            type: Array,
+            type: Array
         },
         placeholder: {
             type: String,
-            default: "请选择",
+            default: '请选择'
         },
-        multiple: {
-            // 是否多选
+        multiple: { // 是否多选
             type: Boolean,
-            default: false,
+            default: false
         },
         icon: {
             type: String,
-            default: "el-icon-plus",
+            default: 'el-icon-plus'
         },
         disabledIcon: {
             type: Boolean,
-            default: false,
+            default: false
         },
         disabled: {
             type: Boolean,
-            default: false,
+            default: false
         },
         readonly: {
             type: Boolean,
-            default: false,
+            default: false
         },
-        showPlaceholder: {
-            // 是否显示占位符
+        showPlaceholder: { // 是否显示占位符
             type: Boolean,
-            default: false,
+            default: false
         },
         /**
          * 只读样式 【text original】
          */
         readonlyText: {
             type: String,
-            default: "original",
+            default: 'original'
         },
         inputBorderStyle: {
-            type: String,
+            type: String
         },
         size: {
             type: String,
-            default: "mini",
+            default: 'mini'
         },
         tempSearch: { // 是否是数据模板使用的筛选条件
             type: Boolean,
             default: false
         }
     },
-    data() {
+    data () {
         return {
-            query: "",
+            query: '',
             inputLength: 20,
             inputWidth: 0,
             inputHovering: false,
-            selected: [],
-        };
+            selected: []
+        }
     },
     computed: {
-        hasValue() {
-            return this.items && this.items.length > 0;
+        hasValue () {
+            return this.items && this.items.length > 0
         },
-        selectedLabel() {
-            return this.hasValue ? " " : "";
+        selectedLabel () {
+            return this.hasValue ? ' ' : ''
         },
-        prefixIconClass() {
-            let classes = ["el-selector__caret", "el-input__icon"];
+        prefixIconClass () {
+            let classes = ['el-selector__caret', 'el-input__icon']
             if ((this.disabled || this.readonly) && !this.disabledIcon) {
-                return;
+                return
             }
 
             if (this.hasValue) {
-                classes = [...classes, this.icon, "is-show-close"];
+                classes = [...classes, this.icon, 'is-show-close']
             } else {
-                classes.push(this.icon);
+                classes.push(this.icon)
             }
-            return classes;
+            return classes
         },
-        inputClass() {
-            let classes = [];
-            if (this.readonlyText === "text") {
-                classes = ["el-selector__readonly-text"];
+        inputClass () {
+            let classes = []
+            if (this.readonlyText === 'text') {
+                classes = ['el-selector__readonly-text']
             }
             if (this.inputBorderStyle) {
-                classes = [...classes, "el-selector__" + this.inputBorderStyle];
+                classes = [...classes, 'el-selector__' + this.inputBorderStyle]
             }
-            return classes;
+            return classes
         },
-        selectDisabled() {
-            return this.disabled || (this.elForm || {}).disabled;
+        selectDisabled () {
+            return this.disabled || (this.elForm || {}).disabled
         },
-        selectSize() {
-            return (
-                this.size ||
-                (this.elFormItem || {}).elFormItemSize ||
-                (this.$ELEMENT || {}).size
-            );
+        selectSize () {
+            return this.size || (this.elFormItem || {}).elFormItemSize || (this.$ELEMENT || {}).size
         },
-        collapseTagSize() {
-            return ["small", "mini"].indexOf(this.selectSize) > -1
-                ? "mini"
-                : "small";
+        collapseTagSize () {
+            return ['small', 'mini'].indexOf(this.selectSize) > -1 ? 'mini' : 'small'
         },
-        currentPlaceholder() {
-            if (
-                !this.showPlaceholder &&
-                (this.readonly || this.selectDisabled)
-            ) {
-                return "";
+        currentPlaceholder () {
+            if (!this.showPlaceholder && (this.readonly || this.selectDisabled)) {
+                return ''
             }
 
-            if (
-                !this.items ||
-                (Array.isArray(this.items) && this.items.length === 0)
-            ) {
-                return this.placeholder;
+            if (!this.items || (Array.isArray(this.items) && this.items.length === 0)) {
+                return this.placeholder
             } else {
-                return "";
+                return ''
             }
-        },
+        }
     },
     watch: {
-        items(val) {
+        items (val) {
             if (val) {
-                this.setSelected();
+                this.setSelected()
             }
-        },
+        }
     },
-    mounted() {
-        addResizeListener(this.$el, this.handleResize);
+    mounted () {
+        addResizeListener(this.$el, this.handleResize)
 
-        const reference = this.$refs.reference;
+        const reference = this.$refs.reference
         this.$nextTick(() => {
             if (reference && reference.$el) {
-                this.inputWidth = reference.$el.getBoundingClientRect().width;
+                this.inputWidth = reference.$el.getBoundingClientRect().width
             }
-        });
-        this.setSelected();
+        })
+        this.setSelected()
     },
-    beforeDestroy() {
-        removeResizeListener(this.$el, this.handleResize);
+    beforeDestroy () {
+        removeResizeListener(this.$el, this.handleResize)
     },
     methods: {
-        setSelected() {
-            const result = [];
+        setSelected () {
+            const result = []
             if (Array.isArray(this.items)) {
-                this.items.forEach((item) => {
-                    result.push(item);
-                });
+                this.items.forEach(item => {
+                    result.push(item)
+                })
             }
-            this.selected = result;
+            this.selected = result
             if (this.multiple) {
-                this.$nextTick(this.resetInputHeight);
+                this.$nextTick(this.resetInputHeight)
             }
         },
-        resetInputWidth() {
-            if (!this.$refs.reference) return;
-            this.inputWidth =
-                this.$refs.reference.$el.getBoundingClientRect().width;
+        resetInputWidth () {
+            if (!this.$refs.reference) return
+            this.inputWidth = this.$refs.reference.$el.getBoundingClientRect().width
         },
-        resetInputHeight() {
+        resetInputHeight () {
             this.$nextTick(() => {
-                if (!this.$refs.reference) return;
-                const inputEl = this.$refs.reference.$refs.input;
-                const tags = this.$refs.tags;
-                let height = sizeMap[this.selectSize] || 40;
+                if (!this.$refs.reference) return
+                const inputEl = this.$refs.reference.$refs.input
+                const tags = this.$refs.tags
+                let height = sizeMap[this.selectSize] || 40
                 if (this.selected.length !== 0) {
-                    height = Math.max(
-                        tags.clientHeight +
-                            (tags.clientHeight > height ? 6 : 0),
-                        height
-                    );
+                    height = Math.max((tags.clientHeight + (tags.clientHeight > height ? 6 : 0)), height)
                 }
-                inputEl.style.height = `${height}px`;
-            });
-        },
-        handleResize() {
-            this.resetInputWidth();
-            if (this.multiple) this.resetInputHeight();
+                inputEl.style.height = `${height}px`
+            })
         },
-        handleFocus() {
-            if (this.disabled) return;
-            this.$refs.reference.blur();
-            this.$emit("click");
+        handleResize () {
+            this.resetInputWidth()
+            if (this.multiple) this.resetInputHeight()
         },
-        deleteTag(index) {
-            this.$emit("remove", index);
+        handleFocus () {
+            if (this.disabled) return
+            this.$refs.reference.blur()
+            this.$emit('click')
         },
-    },
-};
+        deleteTag (index) {
+            this.$emit('remove', index)
+        }
+    }
+}
 </script>

+ 435 - 625
src/views/platform/bpmn/bpmInstHis/list.vue

@@ -41,36 +41,19 @@
                     trigger="click"
                     @show="getReportAndFile(scope.row)"
                 >
-                    <div slot="reference" class="div_operation el-icon-s-order">
-                        查阅记录
-                    </div>
+                    <div slot="reference" class="div_operation el-icon-s-order">查阅记录</div>
                     <div v-loading="fileLoading" class="div_content">
                         <!-- 获取所有输出报告-->
-                        <template
-                            v-if="record.report.length && record.report[0]"
-                        >
-                            <div
-                                v-for="(item, index) in record.report"
-                                :key="index"
-                                class="content_item"
-                            >
-                                <span
-                                    style="cursor: pointer"
-                                    @click="openReport(item, record.bizKey)"
-                                >
-                                    <i
-                                        class="el-icon-tickets"
-                                        style="font-size: 18px"
-                                    />
+                        <template v-if="record.report.length && record.report[0]">
+                            <div v-for="(item, index) in record.report" :key="index" class="content_item">
+                                <span style="cursor: pointer;" @click="openReport(item, record.bizKey)">
+                                    <i class="el-icon-tickets" style="font-size: 18px;" />
                                     {{ item | getReportName }}
                                 </span>
-                                <br />
+                                <br>
                             </div>
                         </template>
-                        <div
-                            v-if="record.file.length && snapshotId"
-                            class="content_item"
-                        >
+                        <div v-if="record.file.length && snapshotId" class="content_item">
                             <!-- <div class="sub_operation">快照</div> -->
                             <ibps-attachment
                                 v-model="snapshotId"
@@ -79,16 +62,11 @@
                                 multiple
                                 upload-type="attachment"
                                 store="id"
-                                style="width: 100%"
+                                style="width: 100%;"
                             />
                         </div>
-                        <div
-                            v-if="record.file.length && fileId"
-                            class="content_item"
-                        >
-                            <div class="sub_operation ibps-icon-folder-open-o">
-                                附件
-                            </div>
+                        <div v-if="record.file.length && fileId" class="content_item">
+                            <div class="sub_operation ibps-icon-folder-open-o">附件</div>
                             <ibps-attachment
                                 v-model="fileId"
                                 :download="hasRole"
@@ -96,12 +74,7 @@
                                 multiple
                                 upload-type="attachment"
                                 store="id"
-                                style="
-                                    width: 100%;
-                                    height: 100%;
-                                    max-height: 180px;
-                                    overflow-y: auto;
-                                "
+                                style="width: 100%; height: 100%; max-height: 180px; overflow-y: auto;"
                             />
                         </div>
                         <!-- <div v-if="(!record.report.length || !record.report[0]) && (!record.file.length || !fileId)">无报表及附件数据</div> -->
@@ -114,35 +87,13 @@
                                 popper-class="popverClass_sub"
                                 trigger="click"
                             >
-                                <div
-                                    slot="reference"
-                                    class="sub_operation ibps-icon-folder-o"
-                                >
-                                    {{ specialBtn[typeId].label }}
-                                </div>
-                                <div
-                                    v-if="
-                                        record.special && record.special.length
-                                    "
-                                    class="div_content"
-                                >
-                                    <div
-                                        v-for="(item, index) in record.special"
-                                        :key="index"
-                                        class="content_item"
-                                    >
+                                <div slot="reference" class="sub_operation ibps-icon-folder-o">{{ specialBtn[typeId].label }}</div>
+                                <div v-if="record.special && record.special.length" class="div_content">
+                                    <div v-for="(item, index) in record.special" :key="index" class="content_item">
                                         <div class="sub_content">
-                                            <div class="title">
-                                                {{
-                                                    specialBtn[typeId].desc
-                                                }}项{{ item.flag }}
-                                            </div>
+                                            <div class="title">{{ specialBtn[typeId].desc }}项{{ item.flag }}</div>
                                             <div class="sub_item">
-                                                <div class="desc">
-                                                    {{
-                                                        specialBtn[typeId].desc
-                                                    }}前
-                                                </div>
+                                                <div class="desc">{{ specialBtn[typeId].desc }}前</div>
                                                 <ibps-attachment
                                                     v-model="item.beforeImprove"
                                                     placeholder="请选择"
@@ -154,15 +105,11 @@
                                                     store="id"
                                                     media-type=""
                                                     media=""
-                                                    style="width: 100%"
+                                                    style="width: 100%;"
                                                 />
                                             </div>
                                             <div class="sub_item">
-                                                <div class="desc">
-                                                    {{
-                                                        specialBtn[typeId].desc
-                                                    }}后
-                                                </div>
+                                                <div class="desc">{{ specialBtn[typeId].desc }}后</div>
                                                 <ibps-attachment
                                                     v-model="item.afterImprove"
                                                     placeholder="请选择"
@@ -174,27 +121,13 @@
                                                     store="id"
                                                     media-type=""
                                                     media=""
-                                                    style="width: 100%"
+                                                    style="width: 100%;"
                                                 />
                                             </div>
                                             <div class="content_item">
-                                                <span
-                                                    style="cursor: pointer"
-                                                    @click="
-                                                        openReport(
-                                                            specialBtn[typeId]
-                                                                .path,
-                                                            item.id_
-                                                        )
-                                                    "
-                                                >
-                                                    <i
-                                                        class="el-icon-tickets"
-                                                        style="font-size: 14px"
-                                                    />
-                                                    {{
-                                                        specialBtn[typeId].name
-                                                    }}
+                                                <span style="cursor: pointer;" @click="openReport(specialBtn[typeId].path, item.id_)">
+                                                    <i class="el-icon-tickets" style="font-size: 14px;" />
+                                                    {{ specialBtn[typeId].name }}
                                                 </span>
                                             </div>
                                         </div>
@@ -210,7 +143,7 @@
         <bpmn-formrender
             :visible="dialogFormVisible"
             :instance-id="instanceId"
-            @close="(visible) => (dialogFormVisible = visible)"
+            @close="visible => dialogFormVisible = visible"
         />
         <el-dialog
             :close-on-click-modal="false"
@@ -234,79 +167,66 @@
 </template>
 
 <script>
-import { queryPageList, queryClassify } from "@/api/platform/bpmn/bpmInstHis";
-import ActionUtils from "@/utils/action";
-import IbpsTypeTree from "@/business/platform/cat/type/tree";
-import FixHeight from "@/mixins/height";
-import BpmnFormrender from "@/business/platform/bpmn/form/dialog";
-import curdPost from "@/business/platform/form/utils/custom/joinCURD.js";
-import IbpsAttachment from "@/business/platform/file/attachment/selector";
-import {
-    specialType,
-    specialBtn,
-    specialParams,
-    specialTable,
-    stateTable,
-    stateField,
-    specialField,
-} from "./corresponding/index";
+import { queryPageList, queryClassify } from '@/api/platform/bpmn/bpmInstHis'
+import ActionUtils from '@/utils/action'
+import IbpsTypeTree from '@/business/platform/cat/type/tree'
+import FixHeight from '@/mixins/height'
+import BpmnFormrender from '@/business/platform/bpmn/form/dialog'
+import curdPost from '@/business/platform/form/utils/custom/joinCURD.js'
+import IbpsAttachment from '@/business/platform/file/attachment/selector'
+import { specialType, specialBtn, specialParams, specialTable, stateTable, stateField, specialField } from './corresponding/index'
 
 export default {
     components: {
         IbpsTypeTree,
         BpmnFormrender,
-        IbpsAttachment,
+        IbpsAttachment
     },
     filters: {
         // 截取报表名称
-        getReportName(value) {
+        getReportName (value) {
             // 通过/与.截取,eg: 43罗湖/L13-LHXBJY-QP-6.4-04 标准菌株管理程序/LHXBJY-QP-6.4-04-FQ-03 标准菌株鉴定验收记录表.rpx
-            return value.slice(
-                -value.split("").reverse().join("").indexOf("/"),
-                -value.split("").reverse().join("").indexOf(".") - 1
-            );
-        },
+            return value.slice(-value.split('').reverse().join('').indexOf('/'), -value.split('').reverse().join('').indexOf('.') - 1)
+        }
     },
     mixins: [FixHeight],
     props: {
         location: {
             type: String,
-            default: "initial",
-        },
+            default: 'initial'
+        }
     },
-    data() {
-        const roleList = this.$store.getters.userInfo.role;
+    data () {
+        const roleList = this.$store.getters.userInfo.role
         // 系统管理角色、实验室主任、档案管理员具有高级权限
-        const hasRole = roleList.some((item) =>
-            ["xtgljs", "syszr", "dagly", "xxgljs"].includes(item.alias)
-        );
-        const { account = "", userList = [] } = this.$store.getters;
+        const hasRole = roleList.some(item => ['xtgljs', 'syszr', 'dagly', 'xxgljs'].includes(item.alias))
+        const { userList = [] } = this.$store.getters
         const selectOptions = [
             {
-                value: "end",
-                label: "已完成",
-                type: "success",
+                value: 'end',
+                label: '已完成',
+                type: 'success'
             },
             {
-                value: "manualend",
-                label: "已作废",
-                type: "danger",
-            },
-        ];
+                value: 'manualend',
+                label: '已作废',
+                type: 'danger'
+            }
+        ]
         return {
             hasRole,
             width: 210,
             selection: false,
             dialogFormVisible: false,
             // 编辑dialog需要使用
-            instanceId: "",
+            instanceId: '',
             // 主键 如果主键不是pk需要传主键
-            pkKey: "id",
-            tableTitle: "",
-            typeId: "",
-            srcUrl: "",
-            fileId: "",
-            snapshotId: "",
+            pkKey: 'id',
+            tableTitle: '',
+            typeId: '',
+            srcUrl: '',
+            fileId: '',
+            snapshotId: '',
             // 判断多次点击
             isDisable: false,
             visible: false,
@@ -316,170 +236,158 @@ export default {
                 table: [],
                 field: [],
                 special: [],
-                bizKey: "",
+                bizKey: ''
             },
-            title: "",
+            title: '',
             loading: true,
             fileLoading: false,
             height: document.clientHeight,
             reportAll: [],
             listData: [],
             pagination: {},
-            sorts: { END_TIME_: "DESC" },
+            sorts: { END_TIME_: 'DESC' },
             // 默认过滤部分分类
             hasPermission: true,
             specialType,
             specialBtn,
             listConfig: {
-                toolbars: [{ key: "search" }],
+                toolbars: [{ key: 'search' }],
                 searchForm: {
                     forms: [
                         {
-                            prop: "Q^subject_^SL",
-                            label: "关键字:",
+                            prop: 'Q^subject_^SL',
+                            label: '关键字:',
                             itemWidth: 330,
-                            placeholder:
-                                "可输入年份/部门/表单名称/事务说明/编制人模糊查询",
+                            placeholder: '可输入年份/部门/表单名称/事务说明/编制人模糊查询'
                         },
                         {
-                            prop: "Q^proc_def_name_^SL",
-                            label: "表单名称:",
+                            prop: 'Q^proc_def_name_^SL',
+                            label: '表单名称:',
                             itemWidth: 150,
-                            placeholder: "请输入",
+                            placeholder: '请输入'
                         },
                         {
-                            prop: ["Q^end_time_^DL", "Q^end_time_^DG"],
-                            label: "完成/作废时间",
-                            fieldType: "daterange",
-                            labelWidth: 100,
+                            prop: ['Q^end_time_^DL', 'Q^end_time_^DG'],
+                            label: '完成/作废时间',
+                            fieldType: 'daterange',
+                            labelWidth: 100
                         },
                         {
-                            prop: "Q^status_^S",
-                            label: "状态",
-                            fieldType: "select",
+                            prop: 'Q^status_^S',
+                            label: '状态',
+                            fieldType: 'select',
                             options: selectOptions,
-                            itemWidth: 100,
-                        },
-                    ],
+                            itemWidth: 100
+                        }
+                    ]
                 },
                 // 表格字段配置
                 columns: [
                     // { prop: 'subject', label: '任务标题', link: 'dialog', width: 250 },
-                    { prop: "tYear", label: "年份", width: 60 },
-                    { prop: "tDept", label: "部门", width: 90 },
+                    { prop: 'tYear', label: '年份', width: 60 },
+                    { prop: 'tDept', label: '部门', width: 90 },
                     {
-                        prop: "procDefName",
-                        label: "表单名称",
-                        sortable: "custom",
+                        prop: 'procDefName',
+                        label: '表单名称',
+                        sortable: 'custom',
                         formatter: this.replaceFormName,
-                        width: 250,
+                        width: 250
                     },
                     {
-                        prop: "subject",
-                        label: "事务说明",
+                        prop: 'subject',
+                        label: '事务说明',
                         formatter: this.getDesc,
-                        "min-width": 300,
+                        'min-width': 300
                     },
-                    { prop: "tUser", label: "编制人", width: 80 },
+                    { prop: 'tUser', label: '编制人', width: 80 },
                     {
-                        prop: "status",
-                        label: "状态",
+                        prop: 'status',
+                        label: '状态',
                         width: 80,
-                        options: selectOptions,
+                        options: selectOptions
                     },
                     {
-                        prop: "endTime",
-                        label: "完成/作废时间",
-                        sortable: "custom",
-                        dateFormat: "yyyy-MM-dd",
-                        width: 120,
-                    },
+                        prop: 'endTime',
+                        label: '完成/作废时间',
+                        sortable: 'custom',
+                        dateFormat: 'yyyy-MM-dd',
+                        width: 120
+                    }
                 ],
                 rowHandle: {
                     actions: [
                         {
-                            key: "detail",
-                            label: "详情",
-                        },
+                            key: 'detail',
+                            label: '详情'
+                        }
                     ],
-                    effect: "display",
-                    width: "100",
-                },
+                    effect: 'display',
+                    width: '100'
+                }
             },
-            userList,
-        };
+            userList
+        }
     },
-    created() {
-        this.loadData();
-        this.getConfig();
-        const roleList = this.$store.getters.userInfo.role;
+    created () {
+        this.loadData()
+        this.getConfig()
+        const roleList = this.$store.getters.userInfo.role
         // 系统管理角色添加删除按钮
-        const deleteRole = roleList.some((item) => item.alias === "xtgljs");
+        const deleteRole = roleList.some(item => item.alias === 'xtgljs')
         if (deleteRole) {
             // 系统管理角色不做分类过滤,显示删除按钮
-            this.hasPermission = false;
-            this.listConfig.toolbars.push({ key: "remove" });
-            this.selection = true;
+            this.hasPermission = false
+            this.listConfig.toolbars.push({ key: 'remove' })
+            this.selection = true
         }
     },
     methods: {
-        replaceFormName(row, column, cellValue, index) {
-            const t = cellValue === "管理评审计划";
+        replaceFormName (row, column, cellValue, index) {
+            const t = cellValue === '管理评审计划'
             if (t) {
-                return "管理评审";
+                return '管理评审'
             }
-            return cellValue;
+            return cellValue
         },
         // 截取事务说明字段内容
-        getDesc(row, column, cellValue, index) {
-            const hasDesc = cellValue.includes("#");
+        getDesc (row, column, cellValue, index) {
+            const hasDesc = cellValue.includes('#')
             if (!hasDesc) {
-                return "";
+                return ''
             }
-            return cellValue.split("#")[1];
+            return cellValue.split('#')[1]
         },
         // 加载数据
-        loadData() {
-            this.loading = true;
-            queryClassify(this.getSearcFormData())
-                .then((response) => {
-                    const data = response.data && response.data.dataResult;
-                    data.forEach((item) => {
-                        const temp = this.userList.find(
-                            (i) => item.createBy === i.userId
-                        );
-                        item.tYear = item.createTime.slice(0, 4);
-                        item.tDept = temp.groupName;
-                        item.tUser = temp.userName;
-                        if (
-                            (item.formKey == "nsssjhbfj" ||
-                                item.formKey == "nsssjhx") &&
-                            item.updateTime == item.endTime
-                        ) {
-                            item.endTime = "";
-                        }
-                    });
-                    ActionUtils.handleListData(this, response.data);
-                    this.loading = false;
+        loadData () {
+            this.loading = true
+            queryClassify(this.getSearcFormData()).then((response) => {
+                const data = response.data && response.data.dataResult
+                data.forEach(item => {
+                    const temp = this.userList.find(i => item.createBy === i.userId)
+                    item.tYear = item.createTime.slice(0, 4)
+                    item.tDept = temp.groupName
+                    item.tUser = temp.userName
+                    if ((item.formKey == 'nsssjhbfj' || item.formKey == 'nsssjhx') && item.updateTime == item.endTime) {
+                        item.endTime = ''
+                    }
                 })
-                .catch(() => {
-                    this.loading = false;
-                });
+                ActionUtils.handleListData(this, response.data)
+                this.loading = false
+            }).catch(() => {
+                this.loading = false
+            })
         },
         // 获取所有流程的报表配置数据
-        getConfig() {
-            const sql =
-                "select bao_biao_lu_jing_, fu_jian_nei_rong_, guan_lian_zi_duan, liu_cheng_xuan_ze, shi_fou_zi_biao_ from t_lcidglbdbb";
-            curdPost("sql", sql)
-                .then((res) => {
-                    this.reportAll = res.variables && res.variables.data;
-                })
-                .catch((error) => {
-                    console.log("获取流程配置报表数据失败!");
-                });
+        getConfig () {
+            const sql = 'select bao_biao_lu_jing_, fu_jian_nei_rong_, guan_lian_zi_duan, liu_cheng_xuan_ze, shi_fou_zi_biao_ from t_lcidglbdbb'
+            curdPost('sql', sql).then((res) => {
+                this.reportAll = res.variables && res.variables.data
+            }).catch(() => {
+                console.log('获取流程配置报表数据失败!')
+            })
         },
         // 获取报表数据及附件数据
-        getReportAndFile({ procDefKey, bizKey, subject }) {
+        getReportAndFile ({ procDefKey, bizKey, subject }) {
             // 每次获取前先清除原先数据
             this.record = {
                 report: [],
@@ -487,528 +395,430 @@ export default {
                 table: [],
                 field: [],
                 special: [],
-                bizKey: "",
-            };
+                bizKey: ''
+            }
             if (this.isDisable) {
-                this.$message.error("请勿快速点击!");
-                return;
+                this.$message.error('请勿快速点击!')
+                return
             }
-            this.numbersClick();
-            const temp = this.reportAll.find(
-                (item) => item.liu_cheng_xuan_ze === procDefKey
-            );
+            this.numbersClick()
+            const temp = this.reportAll.find(item => item.liu_cheng_xuan_ze === procDefKey)
             if (!temp) {
-                return;
+                return
             }
             this.record = {
-                report: temp.liu_cheng_xuan_ze
-                    ? temp.bao_biao_lu_jing_.split(",")
-                    : [],
-                file: temp.fu_jian_nei_rong_
-                    ? temp.fu_jian_nei_rong_.split(".")
-                    : [],
-                table: temp.shi_fou_zi_biao_
-                    ? temp.shi_fou_zi_biao_.split(".")
-                    : [],
-                field: temp.guan_lian_zi_duan
-                    ? temp.guan_lian_zi_duan.split(".")
-                    : [],
+                report: temp.liu_cheng_xuan_ze ? temp.bao_biao_lu_jing_.split(',') : [],
+                file: temp.fu_jian_nei_rong_ ? temp.fu_jian_nei_rong_.split('.') : [],
+                table: temp.shi_fou_zi_biao_ ? temp.shi_fou_zi_biao_.split('.') : [],
+                field: temp.guan_lian_zi_duan ? temp.guan_lian_zi_duan.split('.') : [],
                 special: [],
-                bizKey,
-            };
-            let typeIndex = 1;
+                bizKey
+            }
+            let typeIndex = 1
             // 特殊类型处理
             if (this.specialType.hasOwnProperty(this.typeId)) {
                 // 获取内审管审全局状态,根据此状态过滤报表显示
-                const sql = `select zhuang_tai_jie_di as state from ${
-                    stateTable[this.typeId]
-                } where ${stateField[this.typeId]} = '${bizKey}'`;
-                curdPost("sql", sql)
-                    .then((res) => {
-                        const { data = [] } = res.variables || {};
-                        if (data.length) {
-                            // console.log(data[0].state);
-                            this.specialType[this.typeId].forEach(
-                                (item, index) => {
-                                    // 判断当前流程在哪一步,以此决定报表展示
-                                    if (data[0].state === item) {
-                                        // 数组下标+2为当前报表文件排序
-                                        typeIndex = index + 2;
-                                    }
-                                }
-                            );
-                        }
-                        // console.log(typeIndex);
-                        this.record.report = this.record.report.slice(
-                            0,
-                            typeIndex
-                        );
-                    })
-                    .catch((error) => {
-                        console.log("获取管审内审全局状态数据失败!");
-                        this.record.report = this.record.report.slice(
-                            0,
-                            typeIndex
-                        );
-                    });
-                this.getSpecicalFile(bizKey);
+                const sql = `select zhuang_tai_jie_di as state from ${stateTable[this.typeId]} where ${stateField[this.typeId]} = '${bizKey}'`
+                curdPost('sql', sql).then((res) => {
+                    const { data = [] } = res.variables || {}
+                    if (data.length) {
+                        console.log(data[0].state)
+                        this.specialType[this.typeId].forEach((item, index) => {
+                            // 判断当前流程在哪一步,以此决定报表展示
+                            if (data[0].state === item) {
+                                // 数组下标+2为当前报表文件排序
+                                typeIndex = index + 2
+                            }
+                        })
+                    }
+                    console.log(typeIndex)
+                    this.record.report = this.record.report.slice(0, typeIndex)
+                }).catch(() => {
+                    console.log('获取管审内审全局状态数据失败!')
+                    this.record.report = this.record.report.slice(0, typeIndex)
+                })
+                this.getSpecicalFile(bizKey)
             }
             // console.log(this.record)
             if (this.record.file.length && this.record.table.length) {
-                this.getAllFile(this.record);
-                return;
+                this.getAllFile(this.record)
+                return
             }
         },
         // 获取所有附件
-        getAllFile({ file, table, field, bizKey }) {
-            this.fileId = "";
-            this.snapshotId = "";
-            this.fileLoading = true;
-            const resultList = [];
-            const requestOrder = [];
+        getAllFile ({ file, table, field, bizKey }) {
+            this.fileId = ''
+            this.snapshotId = ''
+            this.fileLoading = true
+            const resultList = []
+            const requestOrder = []
             table.forEach((item, index) => {
-                const sql = `select ${file[index]} from ${item} where ${
-                    field.length && field[index] ? field[index] : "id_"
-                } = '${bizKey}'`;
-                resultList.push(this.getFile(sql, file[index], item));
-                requestOrder.push(index);
-            });
+                const sql = `select ${file[index]} from ${item} where ${field.length && field[index] ? field[index] : 'id_'} = '${bizKey}'`
+                resultList.push(this.getFile(sql, file[index], item))
+                requestOrder.push(index)
+            })
             // console.log(resultList)
-            Promise.all(resultList)
-                .then((res) => {
-                    // console.log('所有附件ID:', res)
-                    const sortedResults = requestOrder.map(
-                        (index) => res[index]
-                    );
-                    this.fileId = [
-                        ...new Set(
-                            sortedResults.reduce(
-                                (acc, cur) => acc.concat(cur.file),
-                                []
-                            )
-                        ),
-                    ].join(",");
-                    this.snapshotId = [
-                        ...new Set(
-                            sortedResults.reduce(
-                                (acc, cur) => acc.concat(cur.snapshot),
-                                []
-                            )
-                        ),
-                    ].join(",");
-                    this.fileLoading = false;
-                })
-                .catch((err) => {
-                    this.fileLoading = false;
-                    console.log("error", err);
-                });
+            Promise.all(resultList).then(res => {
+                // console.log('所有附件ID:', res)
+                const sortedResults = requestOrder.map(index => res[index])
+                this.fileId = [...new Set(sortedResults.reduce((acc, cur) => acc.concat(cur.file), []))].join(',')
+                this.snapshotId = [...new Set(sortedResults.reduce((acc, cur) => acc.concat(cur.snapshot), []))].join(',')
+                this.fileLoading = false
+            }).catch(err => {
+                this.fileLoading = false
+                console.log('error', err)
+            })
         },
         // 获取单个请求中的文件
-        getFile(sql, fileField, table) {
+        getFile (sql, fileField, table) {
             return new Promise((resolve, reject) => {
-                curdPost("sql", sql).then((res) => {
+                curdPost('sql', sql).then(res => {
                     const result = {
                         file: [],
-                        snapshot: [],
-                    };
-                    const fileList = fileField.split(",");
+                        snapshot: []
+                    }
+                    const fileList = fileField.split(',')
                     // console.log(fileList)
-                    let { data = [] } = res.variables || {};
-                    data = data.filter((i) => i);
+                    let { data = [] } = res.variables || {}
+                    data = data.filter(i => i)
                     // 若配置的附件字段中含创建时间,先将结果按时间升序排列
-                    if (fileList.includes("create_time_")) {
-                        data.sort((a, b) => a.create_time_ - b.create_time_);
+                    if (fileList.includes('create_time_')) {
+                        data.sort((a, b) => a.create_time_ - b.create_time_)
                     }
-                    data.forEach((item) => {
+                    data.forEach(item => {
                         // 能获取到值说明文件字段只有一个,将快照文件单独拿出来(内审归档中部分快照未存放在快照字段中,需单独处理)
                         if (item[fileField]) {
-                            if (
-                                fileField === "kuai_zhao_" ||
-                                (fileField === "shang_chuan_fu_ji" &&
-                                    table === "t_nbss") ||
-                                (fileField === "bao_gao_wen_jian_" &&
-                                    table === "t_nbshbgb")
-                            ) {
-                                result.snapshot.push(
-                                    this.getFileId(item[fileField])
-                                );
+                            if (fileField === 'kuai_zhao_' || (fileField === 'shang_chuan_fu_ji' && table === 't_nbss') || (fileField === 'bao_gao_wen_jian_' && table === 't_nbshbgb')) {
+                                result.snapshot.push(this.getFileId(item[fileField]))
                             } else {
-                                result.file.push(
-                                    this.getFileId(item[fileField])
-                                );
+                                result.file.push(this.getFileId(item[fileField]))
                             }
                         } else if (fileList.length > 1) {
                             // 否则文件字段为多个,需嵌套循环,并过滤掉用于排序的创建时间字段
-                            fileList.forEach((i) => {
-                                if (item[i] && i !== "create_time_") {
-                                    if (
-                                        i === "kuai_zhao_" ||
-                                        (i === "shang_chuan_fu_ji" &&
-                                            table === "t_nbss") ||
-                                        (i === "bao_gao_wen_jian_" &&
-                                            table === "t_nbshbgb")
-                                    ) {
-                                        result.snapshot.push(
-                                            this.getFileId(item[i])
-                                        );
+                            fileList.forEach(i => {
+                                if (item[i] && i !== 'create_time_') {
+                                    if (i === 'kuai_zhao_' || (i === 'shang_chuan_fu_ji' && table === 't_nbss') || (i === 'bao_gao_wen_jian_' && table === 't_nbshbgb')) {
+                                        result.snapshot.push(this.getFileId(item[i]))
                                     } else {
-                                        result.file.push(
-                                            this.getFileId(item[i])
-                                        );
+                                        result.file.push(this.getFileId(item[i]))
                                     }
                                 }
-                            });
+                            })
                         }
-                    });
-                    resolve(result);
-                });
-            });
+                    })
+                    resolve(result)
+                })
+            })
         },
         // 获取文件ID
-        getFileId(value) {
+        getFileId (value) {
             // 判断是否为图片类型,文件类型只存储文件ID,图片会以对象形式保存
-            if (value.includes("id")) {
-                const result = [];
-                const temp = JSON.parse(value);
-                temp.forEach((item) => result.push(item.id));
-                return result.join(",");
+            if (value.includes('id')) {
+                const result = []
+                const temp = JSON.parse(value)
+                temp.forEach(item => result.push(item.id))
+                return result.join(',')
             }
-            return value;
+            return value
         },
         // 获取内审管审文件
-        getSpecicalFile(id) {
-            const sql = `select ${specialParams[this.typeId]} from ${
-                specialTable[this.typeId]
-            } where ${specialField[this.typeId]} = '${id}'`;
+        getSpecicalFile (id) {
+            const sql = `select ${specialParams[this.typeId]} from ${specialTable[this.typeId]} where ${specialField[this.typeId]} = '${id}'`
             // console.log(sql)
-            curdPost("sql", sql).then((res) => {
-                const { data = [] } = res.variables || {};
+            curdPost('sql', sql).then(res => {
+                const { data = [] } = res.variables || {}
                 if (data.length) {
-                    this.record.special = data.filter(
-                        (i) => i.beforeImprove || i.afterImprove
-                    );
+                    this.record.special = data.filter(i => i.beforeImprove || i.afterImprove)
                 }
-            });
+            })
         },
         // 打开报表
-        openReport(path, id) {
-            this.srcUrl = `${this.$reportPash.replace(
-                "show",
-                "pdf"
-            )}${path}&id_=${id}`;
-            this.visible = true;
+        openReport (path, id) {
+            this.srcUrl = `${this.$reportPash.replace('show', 'pdf')}${path}&id_=${id}`
+            this.visible = true
             // 系统管理角色、实验室主任、档案管理员、信息管理角色可下载打印
             if (this.hasRole) {
-                return;
+                return
             }
             setTimeout(() => {
-                const toolbarCover = document.createElement("div");
-                toolbarCover.classList.add("toolbar-cover");
-                toolbarCover.addEventListener("click", () => {
-                    confirm("无权操作,请联系管理员开放相关权限!", "提示");
-                });
-                document
-                    .querySelector(".js-custom-dialog")
-                    .firstElementChild.children[1].appendChild(toolbarCover);
-            }, 1000);
+                const toolbarCover = document.createElement('div')
+                toolbarCover.classList.add('toolbar-cover')
+                toolbarCover.addEventListener('click', () => {
+                    confirm('无权操作,请联系管理员开放相关权限!', '提示')
+                })
+                document.querySelector('.js-custom-dialog').firstElementChild.children[1].appendChild(toolbarCover)
+            }, 1000)
         },
-        getParenthesesStr(text) {
-            let result = "";
-            if (!text) return result;
+        getParenthesesStr (text) {
+            let result = ''
+            if (!text) return result
             // 新数据年份、部门、发起人以{}包裹
-            const regex1 = /\{(.+?)\}/g;
+            const regex1 = /\{(.+?)\}/g
             // 旧数据年份、部门、发起人以()包裹
-            const regex2 = /\((.+?)\)/g;
-            const options1 = text.match(regex1);
-            const options2 = text.match(regex2);
-            const options = options1 && options1.length ? options1 : options2;
+            const regex2 = /\((.+?)\)/g
+            const options1 = text.match(regex1)
+            const options2 = text.match(regex2)
+            const options = options1 && options1.length ? options1 : options2
             if (options) {
-                const option = options[0];
+                const option = options[0]
                 if (option) {
-                    result = option.substring(1, option.length - 1);
+                    result = option.substring(1, option.length - 1)
                 }
                 if (options[1]) {
-                    const yersOption = options[1];
+                    const yersOption = options[1]
                     if (yersOption) {
-                        result =
-                            result +
-                            "/" +
-                            yersOption.substring(1, yersOption.length - 1);
+                        result = result + '/' + yersOption.substring(1, yersOption.length - 1)
                     }
                 }
             }
-            return result.split("/");
+            return result.split('/')
         },
         // 获取格式化参数
-        getSearcFormData() {
-            const params = this.$refs["crud"]
-                ? this.$refs["crud"].getSearcFormData()
-                : {};
+        getSearcFormData () {
+            const params = this.$refs['crud'] ? this.$refs['crud'].getSearcFormData() : {}
             if (this.$utils.isNotEmpty(this.typeId)) {
-                params["Q^TYPE_ID_^S"] = this.typeId;
+                params['Q^TYPE_ID_^S'] = this.typeId
             }
             const formattedForm = {
                 arg: {
-                    relation: "AND",
-                    parameters: [],
-                },
-            };
+                    relation: 'AND',
+                    parameters: []
+                }
+            }
             if (this.$utils.isEmptyObject(params)) {
-                params["Q^status_^S"] = "end,manualend";
+                params['Q^status_^S'] = 'end,manualend'
             }
             Object.keys(params).forEach((v) => {
-                const val = params[v];
+                const val = params[v]
                 if (this.$utils.isNotEmpty(val)) {
-                    const key = v;
+                    const key = v
                     if (!Array.isArray(val)) {
-                        const valArr = val.split(",");
+                        const valArr = val.split(',')
                         if (valArr.length > 1) {
                             const parameters = valArr.map((i) => ({
                                 key,
                                 value: i,
-                                param: this.$utils.guid(),
-                            }));
+                                param: this.$utils.guid()
+                            }))
                             formattedForm.arg.parameters.push({
-                                relation: "OR",
-                                parameters,
-                            });
+                                relation: 'OR',
+                                parameters
+                            })
                         } else {
                             const o = {
-                                relation: "AND",
+                                relation: 'AND',
                                 parameters: [
                                     {
                                         key,
                                         value: val,
-                                        param: this.$utils.guid(),
-                                    },
-                                ],
-                            };
-                            formattedForm.arg.parameters.push(o);
+                                        param: this.$utils.guid()
+                                    }
+                                ]
+                            }
+                            formattedForm.arg.parameters.push(o)
                         }
                     } else {
                         const parameters = val.map((i) => ({
                             key,
                             value: i,
-                            param: this.$utils.guid(),
-                        }));
+                            param: this.$utils.guid()
+                        }))
                         formattedForm.arg.parameters.push({
-                            relation: "OR",
-                            parameters,
-                        });
+                            relation: 'OR',
+                            parameters
+                        })
                     }
                 }
-            });
-            return ActionUtils.formatParams(
-                formattedForm,
-                this.pagination,
-                this.sorts
-            );
+            })
+            return ActionUtils.formatParams(formattedForm, this.pagination, this.sorts)
         },
         // 处理分页事件
-        handlePaginationChange(page) {
-            ActionUtils.setPagination(this.pagination, page);
-            this.loadData();
+        handlePaginationChange (page) {
+            ActionUtils.setPagination(this.pagination, page)
+            this.loadData()
         },
         // 处理排序
-        handleSortChange(sort) {
-            ActionUtils.setSorts(this.sorts, sort);
-            this.loadData();
+        handleSortChange (sort) {
+            ActionUtils.setSorts(this.sorts, sort)
+            this.loadData()
         },
-        handleLinkClick(data, columns) {
-            this.handleEdit(data.id);
+        handleLinkClick (data, columns) {
+            this.handleEdit(data.id)
         },
         // 查询
-        search() {
+        search () {
             if (this.isDisable) {
-                this.$message.error("请勿快速点击!");
-                return;
+                this.$message.error('请勿快速点击!')
+                return
             }
-            this.loadData();
-            this.numbersClick();
+            this.loadData()
+            this.numbersClick()
         },
         // 防止多次快速查询
-        numbersClick() {
-            this.isDisable = true;
+        numbersClick () {
+            this.isDisable = true
             setTimeout(() => {
-                this.isDisable = false;
-            }, 1000);
+                this.isDisable = false
+            }, 1000)
         },
         // 处理按钮事件
-        handleAction(command, position, selection, data) {
+        handleAction (command, position, selection, data) {
             switch (command) {
-                case "search": // 查询
-                    ActionUtils.setFirstPagination(this.pagination);
-                    this.search();
-                    break;
-                case "remove":
+                case 'search': // 查询
+                    ActionUtils.setFirstPagination(this.pagination)
+                    this.search()
+                    break
+                case 'remove':
                     if (!data || !data.length) {
-                        this.$message.warning("请选择数据!");
-                        return;
+                        this.$message.warning('请选择数据!')
+                        return
                     }
                     if (data.length > 10) {
-                        this.$message.warning("单次最多只能删除十条!");
-                        return;
+                        this.$message.warning('单次最多只能删除十条!')
+                        return
                     }
-                    this.handleDelete(data, selection);
-                    break;
-                case "detail": // 明细
-                    ActionUtils.selectedRecord(selection)
-                        .then((id) => {
-                            this.handleEdit(id);
-                            this.title = "信息";
-                        })
-                        .catch(() => {});
-                    break;
+                    this.handleDelete(data, selection)
+                    break
+                case 'detail': // 明细
+                    ActionUtils.selectedRecord(selection).then((id) => {
+                        this.handleEdit(id)
+                        this.title = '信息'
+                    }).catch(() => {})
+                    break
                 default:
-                    break;
+                    break
             }
         },
-        handleDelete(data, selection) {
-            this.$confirm(
-                "将删除选中运行记录与对应数据表数据,删除之后无法恢复, 是否确定?",
-                "提示",
-                {
-                    confirmButtonText: "确定",
-                    cancelButtonText: "取消",
-                    type: "warning",
-                    showClose: false,
-                    closeOnClickModal: false,
-                }
-            ).then(() => {
-                const formKeyArr = [];
-                const delList = {};
-                data.forEach((item) => {
-                    const { bizKey, formKey } = item;
+        handleDelete (data, selection) {
+            this.$confirm('将删除选中运行记录与对应数据表数据,删除之后无法恢复, 是否确定?', '提示', {
+                confirmButtonText: '确定',
+                cancelButtonText: '取消',
+                type: 'warning',
+                showClose: false,
+                closeOnClickModal: false
+            }).then(() => {
+                const formKeyArr = []
+                const delList = {}
+                data.forEach(item => {
+                    const { bizKey, formKey } = item
                     if (!delList[formKey]) {
-                        delList[formKey] = [];
+                        delList[formKey] = []
                     }
-                    delList[formKey].push(bizKey);
+                    delList[formKey].push(bizKey)
                     if (!formKeyArr.includes(formKey)) {
-                        formKeyArr.push(formKey);
+                        formKeyArr.push(formKey)
                     }
-                });
+                })
                 // console.log(delList, formKeyArr)
-                const sql = `select a.bo_code_, b.key_ from ibps_form_bo a, ibps_form_def b where a.form_id_ = b.id_ and find_in_set(b.key_, '${formKeyArr.join(
-                    ","
-                )}')`;
+                const sql = `select a.bo_code_, b.key_ from ibps_form_bo a, ibps_form_def b where a.form_id_ = b.id_ and find_in_set(b.key_, '${formKeyArr.join(',')}')`
                 // 获取选中记录对应的数据表code
-                curdPost("sql", sql)
-                    .then((res) => {
-                        const result = res.variables && res.variables.data;
-                        const codeList = {};
-                        result.forEach((m) => {
-                            codeList[m.key_] = m.bo_code_;
-                        });
-                        const req = `{"tableName":"ibps_bpm_inst_his","paramWhere":"{id_:'${selection.join(
-                            ","
-                        )}'}"}`;
-                        // 删除选中记录
-                        curdPost("batchDelete", req).then(() => {
-                            // 循环删除对应数据表数据
-                            Object.keys(codeList).forEach((k) => {
-                                const temp = `{"tableName":"t_${
-                                    codeList[k]
-                                }","paramWhere":"{id_:'${delList[k].join(
-                                    ","
-                                )}'}"}`;
-                                curdPost("batchDelete", temp);
-                            });
-                            this.$message.success("删除成功!");
-                            this.search();
-                        });
+                curdPost('sql', sql).then(res => {
+                    const result = res.variables && res.variables.data
+                    const codeList = {}
+                    result.forEach(m => {
+                        codeList[m.key_] = m.bo_code_
+                    })
+                    const req = `{"tableName":"ibps_bpm_inst_his","paramWhere":"{id_:'${selection.join(',')}'}"}`
+                    // 删除选中记录
+                    curdPost('batchDelete', req).then(() => {
+                        // 循环删除对应数据表数据
+                        Object.keys(codeList).forEach(k => {
+                            const temp = `{"tableName":"t_${codeList[k]}","paramWhere":"{id_:'${delList[k].join(',')}'}"}`
+                            curdPost('batchDelete', temp)
+                        })
+                        this.$message.success('删除成功!')
+                        this.search()
                     })
-                    .catch(() => {
-                        this.$message.error(
-                            "获取数据表key值出错,请联系开发人员!"
-                        );
-                    });
-            });
+                }).catch(() => {
+                    this.$message.error('获取数据表key值出错,请联系开发人员!')
+                })
+            })
         },
-        handleNodeClick(typeId, typeName) {
-            this.tableTitle = typeName.name;
-            this.typeId = typeId;
-            this.loadData();
+        handleNodeClick (typeId, typeName) {
+            this.tableTitle = typeName.name
+            this.typeId = typeId
+            this.loadData()
         },
-        handleExpandCollapse(isExpand) {
-            this.width = isExpand ? 230 : 30;
+        handleExpandCollapse (isExpand) {
+            this.width = isExpand ? 230 : 30
         },
         // 处理编辑
-        handleEdit(id = "") {
-            this.instanceId = id;
-            this.dialogFormVisible = true;
-        },
-    },
-};
+        handleEdit (id = '') {
+            this.instanceId = id
+            this.dialogFormVisible = true
+        }
+    }
+}
 </script>
 <style lang="scss" scoped>
-.div_operation {
-    cursor: pointer;
-}
-.sub_operation {
-    width: 100%;
-    height: 20px;
-    line-height: 20px;
-    color: #08c0b7;
-    // color: #85ce61;
-    cursor: pointer;
-    &:before {
-        font-size: 18px;
-        margin-right: 5px;
+    .div_operation {
+        cursor: pointer;
     }
-    // &:last-child {
-    //     margin-top: 14px;
-    // }
-}
-.sub_content {
-    .title {
-        margin: 0;
-        margin-top: 6px;
-        font-weight: bold;
+    .sub_operation {
+        width: 100%;
+        height: 20px;
+        line-height: 20px;
+        color: #08c0b7;
+        // color: #85ce61;
+        cursor: pointer;
+        &:before {
+            font-size: 18px;
+            margin-right: 5px;
+        }
+        // &:last-child {
+        //     margin-top: 14px;
+        // }
     }
-    .sub_item {
-        display: flex;
-        align-items: baseline;
-        .desc {
+    .sub_content {
+        .title {
+            margin: 0;
             margin-top: 6px;
+            font-weight: bold;
         }
-        > div:last-child {
-            width: calc(100% - 45px) !important;
+        .sub_item {
+            display: flex;
+            align-items: baseline;
+            .desc {
+                margin-top: 6px;
+            }
+            > div:last-child {
+                width: calc(100% - 45px) !important;
+            }
         }
     }
-}
-.content_item {
-    // max-height: 200px;
-    margin-bottom: 4px;
-    &:first-child {
-        .sub_content .title {
-            margin-top: 0px;
+    .content_item {
+        // max-height: 200px;
+        margin-bottom: 4px;
+        &:first-child{
+            .sub_content .title {
+                margin-top: 0px;
+            }
+        }
+        ::v-deep .el-upload-list__item {
+            line-height: 18px;
         }
     }
-    ::v-deep .el-upload-list__item {
-        line-height: 18px;
-    }
-}
-.popverClass_sub {
-    .div_content {
-        max-height: 300px;
-        overflow-y: auto;
-        // .content_checkbox {
-        //     .el-checkbox-group {
-        //         display: flex;
-        //         flex-direction: column;
-        //         z-index: 999;
-        //     }
-        //     z-index: 999;
-        // }
-        // .content_item {
-        //     z-index: 999;
-        //     margin-top: 20px;
-        //     display: flex;
-        //     justify-content: flex-end;
-        //     .el-button {
-        //         padding: 7px 14px;
-        //     }
-        // }
+    .popverClass_sub {
+        .div_content {
+            max-height: 300px;
+            overflow-y: auto;
+            // .content_checkbox {
+            //     .el-checkbox-group {
+            //         display: flex;
+            //         flex-direction: column;
+            //         z-index: 999;
+            //     }
+            //     z-index: 999;
+            // }
+            // .content_item {
+            //     z-index: 999;
+            //     margin-top: 20px;
+            //     display: flex;
+            //     justify-content: flex-end;
+            //     .el-button {
+            //         padding: 7px 14px;
+            //     }
+            // }
+        }
     }
-}
 </style>