Преглед изворни кода

fix:调整表单脚本打开对话框时调用主列表上的onload问题

liujiayin пре 2 година
родитељ
комит
d74cbeef17

+ 1 - 0
src/business/platform/data/templaterender/custom-dialog/index.vue

@@ -22,6 +22,7 @@
             :value="selectorValue"
             :label-key="labelKey"
             :preview="false"
+            :temp-search="tempSearch"
             type="dialog"
             @close="visible=>selectorVisible =visible"
             @action-event="handleSelectorActionEvent"

+ 5 - 0
src/business/platform/data/templaterender/index.vue

@@ -12,6 +12,7 @@
         :height="height"
         :fields="fields"
         :preview="preview"
+        :temp-search="tempSearch"
         v-on="$listeners"
     />
 </template>
@@ -40,6 +41,10 @@ export default {
         preview: {
             type: Boolean,
             default: false
+        },
+        tempSearch: { // 是否是数据模板使用的筛选条件
+            type: Boolean,
+            default: false
         }
     },
     data () {

+ 166 - 162
src/business/platform/data/templaterender/preview/index.vue

@@ -1,41 +1,42 @@
 <template>
-  <div>
-    <!--默认-->
-    <template-default
-      v-if="type==='default'"
-      :visible="dialogVisible"
-      :data="dataTemplate"
-      :dynamic-params="dynamicParams"
-      :preview="preview"
-      @close="closeDialog"
-    />
-    <!--对话框-->
-    <template-dialog
-      v-else-if="type==='dialog'"
-      ref="dataTemplate"
-      :visible="dialogVisible"
-      :title="title"
-      :value.sync="selectedValue"
-      :data="dataTemplate"
-      :dynamic-params="dynamicParams"
-      :multiple="multiple"
-      :width="width"
-      :height="height"
-      :dialog-height="dialogHeight"
-      :label-key="labelKey"
-      :toolbars="toolbars"
-      :preview="preview"
-      @close="closeDialog"
-    />
-    <!--值来源-->
-    <template-value-source
-      v-else-if="type==='valueSource'"
-      :visible="dialogVisible"
-      :data="dataTemplate"
-      :dynamic-params="dynamicParams"
-      @close="closeDialog"
-    />
-  </div>
+    <div>
+        <!--默认-->
+        <template-default
+            v-if="type==='default'"
+            :visible="dialogVisible"
+            :data="dataTemplate"
+            :dynamic-params="dynamicParams"
+            :preview="preview"
+            @close="closeDialog"
+        />
+        <!--对话框-->
+        <template-dialog
+            v-else-if="type==='dialog'"
+            ref="dataTemplate"
+            :visible="dialogVisible"
+            :title="title"
+            :value.sync="selectedValue"
+            :data="dataTemplate"
+            :dynamic-params="dynamicParams"
+            :multiple="multiple"
+            :width="width"
+            :height="height"
+            :dialog-height="dialogHeight"
+            :label-key="labelKey"
+            :toolbars="toolbars"
+            :preview="preview"
+            :temp-search="tempSearch"
+            @close="closeDialog"
+        />
+        <!--值来源-->
+        <template-value-source
+            v-else-if="type==='valueSource'"
+            :visible="dialogVisible"
+            :data="dataTemplate"
+            :dynamic-params="dynamicParams"
+            @close="closeDialog"
+        />
+    </div>
 </template>
 <script>
 import ButtonsConstants from '@/business/platform/data/constants/buttons'
@@ -44,140 +45,143 @@ import TemplateDialog from './types/dialog'
 import TemplateValueSource from './types/value-source'
 
 export default {
-  components: {
-    TemplateDefault,
-    TemplateDialog,
-    TemplateValueSource
-  },
-  props: {
-    visible: {
-      type: Boolean,
-      default: false
+    components: {
+        TemplateDefault,
+        TemplateDialog,
+        TemplateValueSource
     },
-    value: {
-      type: [Array, Object]
+    props: {
+        visible: {
+            type: Boolean,
+            default: false
+        },
+        value: {
+            type: [Array, Object]
+        },
+        multiple: {
+            type: Boolean,
+            default: true
+        },
+        dynamicParams: {
+            type: Object
+        },
+        data: {
+            type: Object
+        },
+        labelKey: {
+            type: [String, Function]
+        },
+        preview: {
+            type: Boolean,
+            default: true
+        },
+        tempSearch: { // 是否是数据模板使用的筛选条件
+            type: Boolean,
+            default: false
+        }
     },
-    multiple: {
-      type: Boolean,
-      default: true
+    data () {
+        return {
+            dialogVisible: this.visible,
+            dataTemplate: {},
+            type: 'default',
+            title: '',
+            width: null,
+            height: null,
+            dialogHeight: null,
+            toolbars: [],
+            selectedValue: this.multiple ? [] : {}
+        }
     },
-    dynamicParams: {
-      type: Object
+    watch: {
+        visible: {
+            handler: function (val, oldVal) {
+                this.dialogVisible = val
+            },
+            immediate: true
+        },
+        data: {
+            handler: function (val, oldVal) {
+                this.initDataTemplate(val)
+                this.dataTemplate = val
+            },
+            deep: true,
+            immediate: true
+        },
+        value: {
+            handler (val, oldVal) {
+                this.selectedValue = this.$utils.isNotEmpty(val) ? JSON.parse(JSON.stringify(val)) : val
+            },
+            deep: true,
+            immediate: true
+        }
     },
-    data: {
-      type: Object
-    },
-    labelKey: {
-      type: [String, Function]
-    },
-    preview: {
-      type: Boolean,
-      default: true
-    }
-  },
-  data() {
-    return {
-      dialogVisible: this.visible,
-      dataTemplate: {},
-      type: 'default',
-      title: '',
-      width: null,
-      height: null,
-      dialogHeight: null,
-      toolbars: [],
-      selectedValue: this.multiple ? [] : {}
-    }
-  },
-  watch: {
-    visible: {
-      handler: function(val, oldVal) {
-        this.dialogVisible = val
-      },
-      immediate: true
-    },
-    data: {
-      handler: function(val, oldVal) {
-        this.initDataTemplate(val)
-        this.dataTemplate = val
-      },
-      deep: true,
-      immediate: true
-    },
-    value: {
-      handler(val, oldVal) {
-        this.selectedValue = this.$utils.isNotEmpty(val) ? JSON.parse(JSON.stringify(val)) : val
-      },
-      deep: true,
-      immediate: true
-    }
-  },
-  methods: {
+    methods: {
     // 关闭当前窗口
-    closeDialog() {
-      this.$emit('close', false)
-    },
-    initDataTemplate(dataTemplate) {
-      if (!dataTemplate) return
-      this.type = dataTemplate.type
-      this.title = dataTemplate.name
-      if (this.type === 'dialog') {
-        const dialogs = dataTemplate.dialogs
-        const width = parseInt(dialogs.attrs ? dialogs.attrs.width || '80' : '80')
-        const height = parseInt(dialogs.attrs ? (dialogs.attrs.height || '80') : '80')
-        this.width = width <= 100 ? `${width}%` : `${width}px`
-        this.height = height <= 100 ? `${height}%` : `${height}px`
-        const h = height <= 100 ? document.body.clientHeight : height
+        closeDialog () {
+            this.$emit('close', false)
+        },
+        initDataTemplate (dataTemplate) {
+            if (!dataTemplate) return
+            this.type = dataTemplate.type
+            this.title = dataTemplate.name
+            if (this.type === 'dialog') {
+                const dialogs = dataTemplate.dialogs
+                const width = parseInt(dialogs.attrs ? dialogs.attrs.width || '80' : '80')
+                const height = parseInt(dialogs.attrs ? (dialogs.attrs.height || '80') : '80')
+                this.width = width <= 100 ? `${width}%` : `${width}px`
+                this.height = height <= 100 ? `${height}%` : `${height}px`
+                const h = height <= 100 ? document.body.clientHeight : height
 
-        const vh = height === 100 ? 0 : (document.body.clientHeight / 100 * 7)
+                const vh = height === 100 ? 0 : (document.body.clientHeight / 100 * 7)
 
-        this.dialogHeight = h - 130 - (this.multiple ? 60 : 40) - vh
-        this.toolbars = this.handleToolbars(dialogs.buttons ? dialogs.buttons.dialog_buttons : [])
-      }
-    },
-    handleToolbars(buttons) {
-      const toolbars = []
-      buttons.forEach(button => {
-        const buttonType = button.button_type
-        const btn = ButtonsConstants[buttonType] || {}
-        toolbars.push({
-          key: buttonType,
-          label: button.label || btn.label,
-          type: button.style || btn.type,
-          icon: button.icon || btn.icon,
-          action: () => {
-            if (buttonType === 'ok') {
-              if (this.$utils.isEmpty(this.selectedValue)) {
-                this.$message.closeAll()
-                this.$message.warning('请选择记录!')
-                return
-              }
-            } else if (buttonType === 'clean' || buttonType === 'cleanClose') {
-              this.$refs['dataTemplate'].clearSelection()
+                this.dialogHeight = h - 130 - (this.multiple ? 60 : 40) - vh
+                this.toolbars = this.handleToolbars(dialogs.buttons ? dialogs.buttons.dialog_buttons : [])
             }
-            this.handleActionEvent(buttonType)
-          }
-        })
-      })
-      return toolbars
-    },
-    handleActionEvent(key) {
-      if (key === 'clean' || key === 'cleanClose') {
-        this.selectedValue = this.multiple ? [] : {}
-        this.setSelectRow()
-      }
-      this.$emit('close', false)
-      if(typeof this.selectedValue != 'undefined'){
-        this.$emit('action-event', key, JSON.parse(JSON.stringify(this.selectedValue)))
-      }
-      
-    },
-    setSelectRow() {
-      if (this.$refs['dataTemplate'] && this.$refs['dataTemplate'].setSelectRow) {
-        this.$refs['dataTemplate'].setSelectRow()
-      }
-    }
+        },
+        handleToolbars (buttons) {
+            const toolbars = []
+            buttons.forEach(button => {
+                const buttonType = button.button_type
+                const btn = ButtonsConstants[buttonType] || {}
+                toolbars.push({
+                    key: buttonType,
+                    label: button.label || btn.label,
+                    type: button.style || btn.type,
+                    icon: button.icon || btn.icon,
+                    action: () => {
+                        if (buttonType === 'ok') {
+                            if (this.$utils.isEmpty(this.selectedValue)) {
+                                this.$message.closeAll()
+                                this.$message.warning('请选择记录!')
+                                return
+                            }
+                        } else if (buttonType === 'clean' || buttonType === 'cleanClose') {
+                            this.$refs['dataTemplate'].clearSelection()
+                        }
+                        this.handleActionEvent(buttonType)
+                    }
+                })
+            })
+            return toolbars
+        },
+        handleActionEvent (key) {
+            if (key === 'clean' || key === 'cleanClose') {
+                this.selectedValue = this.multiple ? [] : {}
+                this.setSelectRow()
+            }
+            this.$emit('close', false)
+            if (typeof this.selectedValue !== 'undefined') {
+                this.$emit('action-event', key, JSON.parse(JSON.stringify(this.selectedValue)))
+            }
+        },
+        setSelectRow () {
+            if (this.$refs['dataTemplate'] && this.$refs['dataTemplate'].setSelectRow) {
+                this.$refs['dataTemplate'].setSelectRow()
+            }
+        }
 
-  }
+    }
 }
 </script>
 <style lang="scss" >

+ 201 - 196
src/business/platform/data/templaterender/preview/types/dialog.vue

@@ -26,6 +26,7 @@
                 :multiple="multiple"
                 :height="dialogHeight"
                 :preview="preview"
+                :temp-search="tempSearch"
                 @close="closeDialog"
                 @selected="handleSelectChange"
             />
@@ -33,225 +34,229 @@
     </ibps-selector-dialog>
 </template>
 <script>
-    import TypeMixin from '../mixins/types'
-    import { buildLabelTitle } from '../../utils'
-    import JDialog from '../../utils/JDialogTemplate' // 自定义脚本
-    // import ActionUtils from '@/utils/action'
+import TypeMixin from '../mixins/types'
+import { buildLabelTitle } from '../../utils'
+import JDialog from '../../utils/JDialogTemplate' // 自定义脚本
+// import ActionUtils from '@/utils/action'
 
-    import IbpsSelectorDialog from '@/components/ibps-selector/dialog'
-    import Vue from 'vue'
-    Vue.component('ibps-data-template-render', () =>
-        import('@/business/platform/data/templaterender/index.vue')
-    )
+import IbpsSelectorDialog from '@/components/ibps-selector/dialog'
+import Vue from 'vue'
+Vue.component('ibps-data-template-render', () =>
+    import('@/business/platform/data/templaterender/index.vue')
+)
 
-    export default {
-        components: {
-            IbpsSelectorDialog
+export default {
+    components: {
+        IbpsSelectorDialog
+    },
+    mixins: [TypeMixin],
+    props: {
+        visible: {
+            type: Boolean,
+            default: false
         },
-        mixins: [TypeMixin],
-        props: {
-            visible: {
-                type: Boolean,
-                default: false
-            },
-            data: {
-                type: Object
-            },
-            dynamicParams: {
-                type: Object
-            },
-            value: {
-                type: [Object, Array]
-            },
-            title: String,
-            width: {
-                type: [String, Number],
-                default: '80%'
-            },
-            height: {
-                type: [String, Number],
-                default: '100%'
-            },
-            dialogHeight: {
-                type: [String, Number],
-                default: 400
-            },
-            multiple: {
-                type: Boolean,
-                default: false
-            },
-            toolbars: {
-                type: Array
-            },
-            labelKey: {
-                type: [String, Function]
-            },
-            preview: {
-                type: Boolean,
-                default: false
-            }
+        data: {
+            type: Object
         },
-        data() {
-            return {
-                dialogVisible: this.visible,
-                selectedValue: this.multiple ? [] : {},
-                dataTemplate: {},
-                initialization: false,
-                showLabel: this.labelKey
-            }
+        dynamicParams: {
+            type: Object
         },
-        computed: {
-            marginTop() {
-                if (this.height === '100%' || this.height === 100) {
-                    return '0'
-                } else {
-                    return '5vh'
-                }
-            }
+        value: {
+            type: [Object, Array]
         },
-        watch: {
-            visible: {
-                handler: function (val, oldVal) {
-                    this.dialogVisible = val
-                    if (val) {
-                        this.initUI()
-                        this.getFormData()
-                    }
-                },
-                immediate: true
-            },
-            value(val) {
-                this.selectedValue = val
-            },
-            selectedValue: {
-                handler(val, oldVal) {
-                    if (val !== oldVal) {
-                        this.$emit('update:value', val)
-                    }
-                },
-                deep: true
-            },
-            labelKey: {
-                handler: function (val, oldVal) {
-                    if (val) {
-                        this.showLabel = val
-                    }
-                },
-                immediate: true
-            }
+        title: String,
+        width: {
+            type: [String, Number],
+            default: '80%'
         },
-        methods: {
-            // 关闭当前窗口
-            closeDialog() {
-                this.JDialogTemplate()
-                this.$emit('close', false)
-                this.$emit('update:value', {})
+        height: {
+            type: [String, Number],
+            default: '100%'
+        },
+        dialogHeight: {
+            type: [String, Number],
+            default: 400
+        },
+        multiple: {
+            type: Boolean,
+            default: false
+        },
+        toolbars: {
+            type: Array
+        },
+        labelKey: {
+            type: [String, Function]
+        },
+        preview: {
+            type: Boolean,
+            default: false
+        },
+        tempSearch: { // 是否是数据模板使用的筛选条件
+            type: Boolean,
+            default: false
+        }
+    },
+    data () {
+        return {
+            dialogVisible: this.visible,
+            selectedValue: this.multiple ? [] : {},
+            dataTemplate: {},
+            initialization: false,
+            showLabel: this.labelKey
+        }
+    },
+    computed: {
+        marginTop () {
+            if (this.height === '100%' || this.height === 100) {
+                return '0'
+            } else {
+                return '5vh'
+            }
+        }
+    },
+    watch: {
+        visible: {
+            handler: function (val, oldVal) {
+                this.dialogVisible = val
+                if (val) {
+                    this.initUI()
+                    this.getFormData()
+                }
             },
-            getFormData() {
-                this.initData(JSON.parse(JSON.stringify(this.data)))
+            immediate: true
+        },
+        value (val) {
+            this.selectedValue = val
+        },
+        selectedValue: {
+            handler (val, oldVal) {
+                if (val !== oldVal) {
+                    this.$emit('update:value', val)
+                }
             },
-            setSelectRow() {
-                this.$refs['dataTemplate'].setSelectRow()
+            deep: true
+        },
+        labelKey: {
+            handler: function (val, oldVal) {
+                if (val) {
+                    this.showLabel = val
+                }
             },
-            handleSelectChange(val, dataTemplate) {
-                // if (typeof this.labelKey === 'function') {
-                //     if (this.$utils.isNotEmpty(val)) {
-                //         ActionUtils.warning('配置错误,请设置一个返回字段')
-                //         this.clearSelection()
-                //         return
-                //     }
-                // } else if (typeof this.labelKey === 'string') {
-                //     return data[config]
-                // } else if (typeof this.labelKey === 'undefined') {
+            immediate: true
+        }
+    },
+    methods: {
+        // 关闭当前窗口
+        closeDialog () {
+            this.JDialogTemplate()
+            this.$emit('close', false)
+            this.$emit('update:value', {})
+        },
+        getFormData () {
+            this.initData(JSON.parse(JSON.stringify(this.data)))
+        },
+        setSelectRow () {
+            this.$refs['dataTemplate'].setSelectRow()
+        },
+        handleSelectChange (val, dataTemplate) {
+            // if (typeof this.labelKey === 'function') {
+            //     if (this.$utils.isNotEmpty(val)) {
+            //         ActionUtils.warning('配置错误,请设置一个返回字段')
+            //         this.clearSelection()
+            //         return
+            //     }
+            // } else if (typeof this.labelKey === 'string') {
+            //     return data[config]
+            // } else if (typeof this.labelKey === 'undefined') {
 
-                // }
-                if (this.dataTemplate.type !== 'dialog' && !this.dataTemplate.templates[0].result_columns) {
+            // }
+            if (this.dataTemplate.type !== 'dialog' && !this.dataTemplate.templates[0].result_columns) {
+                this.$message({
+                    message: '请检查是否设置返回字段!',
+                    type: 'warning'
+                })
+                return
+            } else if (dataTemplate) {
+                if (!dataTemplate.templates[0].result_columns) {
                     this.$message({
                         message: '请检查是否设置返回字段!',
                         type: 'warning'
                     })
                     return
-                } else if (dataTemplate) {
-                    if (!dataTemplate.templates[0].result_columns) {
-                        this.$message({
-                            message: '请检查是否设置返回字段!',
-                            type: 'warning'
-                        })
-                        return
-                    } else {
-                        this.showLabel = buildLabelTitle(dataTemplate)
-                    }
-                }
-                this.selectedValue = val
-            },
-            clearSelection() {
-                this.$refs['dataTemplate'].clearSelection()
-            },
-            initUI() {
-                this.initialization = false
-                if (!this.initialization) {
-                    this.JDialogTemplate()
-                    this.initialization = true
+                } else {
+                    this.showLabel = buildLabelTitle(dataTemplate)
                 }
-            },
-            /**
+            }
+            this.selectedValue = val
+        },
+        clearSelection () {
+            this.$refs['dataTemplate'].clearSelection()
+        },
+        initUI () {
+            this.initialization = false
+            if (!this.initialization) {
+                this.JDialogTemplate()
+                this.initialization = true
+            }
+        },
+        /**
              * 初始化脚本
              */
-            JDialogTemplate() {
-                const dialogId = 'JDialog'
-                let script = document.getElementById(dialogId)
-                if (script) {
-                    script.parentNode.removeChild(script)
-                }
-                if (this.data.dialogs.attrs && this.data.dialogs.attrs.script) {
-                    const codeScript = this.data.dialogs.attrs.script
-                    script = document.createElement('script')
-                    script.type = 'text/javascript'
-                    script.id = dialogId
-                    document.body.appendChild(script)
-                    try {
-                        script.appendChild(document.createTextNode(codeScript))
-                    } catch (ex) {
-                        console.error(ex)
-                        script.text = codeScript
-                    }
-                    document.body.appendChild(script)
-                    setTimeout(() => {
-                        this.loadScript()
-                    }, 10)
-                }
-            },
-            // 处理脚本
-            hasScript() {
-                return true
-            },
-            // 加载脚本
-            loadScript() {
-                if (!this.hasScript()) {
-                    return
-                }
-                JDialog._onLoad(this)
-            },
-            // 前置脚本
-            beforeScript(action, position, selection, data, callback) {
-                if (!this.hasScript()) {
-                    const flag = true
-                    callback(flag)
-                    return
-                }
-                JDialog._beforeSubmit(this, action, position, selection, data, callback)
-            },
-            // 后置脚本
-            afterScript(action, position, selection, data, callback) {
-                if (!this.hasScript()) {
-                    const flag = true
-                    callback(flag)
-                    return
+        JDialogTemplate () {
+            const dialogId = 'JDialog'
+            let script = document.getElementById(dialogId)
+            if (script) {
+                script.parentNode.removeChild(script)
+            }
+            if (this.data.dialogs.attrs && this.data.dialogs.attrs.script) {
+                const codeScript = this.data.dialogs.attrs.script
+                script = document.createElement('script')
+                script.type = 'text/javascript'
+                script.id = dialogId
+                document.body.appendChild(script)
+                try {
+                    script.appendChild(document.createTextNode(codeScript))
+                } catch (ex) {
+                    console.error(ex)
+                    script.text = codeScript
                 }
-                JDialog._afterSubmit(this, action, position, selection, data, callback)
+                document.body.appendChild(script)
+                setTimeout(() => {
+                    this.loadScript()
+                }, 10)
+            }
+        },
+        // 处理脚本
+        hasScript () {
+            return true
+        },
+        // 加载脚本
+        loadScript () {
+            if (!this.hasScript()) {
+                return
+            }
+            JDialog._onLoad(this)
+        },
+        // 前置脚本
+        beforeScript (action, position, selection, data, callback) {
+            if (!this.hasScript()) {
+                const flag = true
+                callback(flag)
+                return
+            }
+            JDialog._beforeSubmit(this, action, position, selection, data, callback)
+        },
+        // 后置脚本
+        afterScript (action, position, selection, data, callback) {
+            if (!this.hasScript()) {
+                const flag = true
+                callback(flag)
+                return
             }
+            JDialog._afterSubmit(this, action, position, selection, data, callback)
         }
     }
+}
 </script>
 <style lang="scss">
     .preview-type-dialog {

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

@@ -315,6 +315,8 @@ import FormPrintTemplate from '@/business/platform/form/form-print/template'
 import importTable from '@/business/platform/form/formrender/dynamic-form/components/import-table'
 
 import JTemplate from '../utils/JTemplate' // 自定义脚本
+import JDialogTemplate from '../utils/JDialogTemplate' // 对话框自定义脚本
+
 import Scan from '@/views/system/jbdScan/scan.vue'
 
 // import BpmnFormrender from '@/vuew/business/platform/bpmn/form/dialog'//新增流程打开页面
@@ -374,7 +376,11 @@ export default {
             type: Boolean,
             default: false
         },
-        xlsxFileVisible: false
+        xlsxFileVisible: false,
+        tempSearch: { // 是否是数据模板使用的筛选条件
+            type: Boolean,
+            default: false
+        }
     },
     data () {
         return {
@@ -461,6 +467,7 @@ export default {
             },
             grooveList: [],
             hadDoSearch: false
+
         }
     },
     computed: {
@@ -1810,7 +1817,8 @@ export default {
          * 初始化脚本
          */
         initJTemplate () {
-            const id = 'JTemplate'
+            const { data_title = '' } = this.template.attrs
+            const id = data_title && !this.tempSearch ? 'JDialogTemplate' : 'JTemplate'
             let script = document.getElementById(id)
             if (script) {
                 script.parentNode.removeChild(script)
@@ -1838,7 +1846,13 @@ export default {
             if (!this.hasScript()) {
                 return
             }
-            JTemplate._onLoad(this)
+            // type:default,那么表示是一般的列表
+            // type:dialog,表示对话框列表
+            // tempSearch为true的时候是列表搜索框点击打开的对话框
+            if (this.dataTemplate.type == 'default' || this.tempSearch) {
+                // 脚本里打开的对话框列表,不需要执行本模块代码,否则会执行到底层列表的onload脚本
+                JTemplate._onLoad(this)
+            }
         },
         // 前置脚本
         beforeScript (action, position, selection, data, callback) {