cloud-web-corejs 1.0.54-dev.8 → 1.0.54-dev.800

package/src/components/xform/form-designer/setting-panel/form-setting.vue

@@ -1,626 +1,1772 @@
-<template>
-  <div>
-    <el-form :model="formConfig" size="mini" label-position="left" label-width="120px" class="setting-form"
-             @submit.native.prevent>
-      <el-collapse v-model="formActiveCollapseNames" class="setting-collapse">
-        <el-collapse-item name="1" :title="i18nt('designer.setting.basicSetting')">
-          <el-form-item :label="i18nt('实体表')">
-            <el-input type="text" v-model="formConfig.entity"></el-input>
-          </el-form-item>
-          <el-form-item :label="i18nt('数据保存脚本编码')">
-            <el-input type="text" v-model="formConfig.saveScriptCode" placeholder="默认saveUpdatge"></el-input>
-          </el-form-item>
-          <el-form-item :label="i18nt('启用流程')">
-            <el-switch v-model="formConfig.wfEnabled"></el-switch>
-          </el-form-item>
-          <el-form-item label="流程单据定义">
-            <a href="javascript:void(0);" class="a-link link-oneLind" @click="openWfObjConfigDialog">
-              <span>{{ wfObjConfigs.length ? '已维护' : null}}</span>
-              <i class="el-icon-edit"></i>
-            </a>
-          </el-form-item>
-          <el-form-item :label="i18nt('加载详情数据')">
-            <el-switch v-model="formConfig.isLoadEntity"></el-switch>
-          </el-form-item>
-          <el-form-item :label="i18nt('详情数据脚本编码')">
-            <el-input type="text" v-model="formConfig.formScriptCode" placeholder="默认getOne"></el-input>
-          </el-form-item>
-          <el-form-item :label="i18nt('详情数据脚本参数')">
-            <a href="javascript:void(0);" class="a-link link-oneLind" @click="editFormScriptParam">
-              <span>{{ formConfig.formScriptParam }}</span>
-              <i class="el-icon-edit"></i>
-            </a>
-          </el-form-item>
-          <el-form-item :label="i18nt('详情数据脚本回调')">
-            <a href="javascript:void(0);" class="a-link link-oneLind" @click="editFormScriptSuccess">
-              <span>{{ formConfig.formScriptSuccess }}</span>
-              <i class="el-icon-edit"></i>
-            </a>
-          </el-form-item>
-          <el-form-item :label="i18nt('designer.setting.globalFunctions')">
-            <a href="javascript:void(0);" class="a-link link-oneLind" @click="editGlobalFunctions">
-              <span>{{ formConfig.functions }}</span>
-              <i class="el-icon-edit"></i>
-            </a>
-          </el-form-item>
-          <!--
-                    <el-form-item :label="i18nt('designer.setting.formSize')">
-                      <el-select v-model="formConfig.size"><el-option v-for="item in formSizes" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
-                    </el-form-item>
-                    <el-form-item :label="i18nt('designer.setting.labelPosition')">
-                      <el-radio-group v-model="formConfig.labelPosition" class="radio-group-custom">
-                        <el-radio-button label="left">{{ i18nt('designer.setting.leftPosition') }}</el-radio-button>
-                        <el-radio-button label="top">{{ i18nt('designer.setting.topPosition') }}</el-radio-button>
-                      </el-radio-group>
-                    </el-form-item>
-                    <el-form-item :label="i18nt('designer.setting.labelAlign')">
-                      <el-radio-group v-model="formConfig.labelAlign" class="radio-group-custom">
-                        <el-radio-button label="label-left-align">{{ i18nt('designer.setting.leftAlign') }}</el-radio-button>
-                        <el-radio-button label="label-center-align">{{ i18nt('designer.setting.centerAlign') }}</el-radio-button>
-                        <el-radio-button label="label-right-align">{{ i18nt('designer.setting.rightAlign') }}</el-radio-button>
-                      </el-radio-group>
-                    </el-form-item>
-                    <el-form-item :label="i18nt('designer.setting.labelWidth')">
-                      <el-input-number v-model="formConfig.labelWidth" :min="0" style="width: 100%"></el-input-number>
-                    </el-form-item>-->
-                    <el-form-item :label="i18nt('designer.setting.formCss')">
-                      <el-button type="info" icon="el-icon-edit" plain round @click="editFormCss">{{ i18nt('designer.setting.addCss') }}</el-button>
-                    </el-form-item>
-                    <!--
-                    <el-form-item :label="i18nt('designer.setting.customClass')">
-                      <el-select v-model="formConfig.customClass" multiple filterable allow-create default-first-option>
-                        <el-option v-for="(item, idx) in cssClassList" :key="idx" :label="item" :value="item"></el-option>
-                      </el-select>
-                    </el-form-item>
-                    <el-form-item :label="i18nt('designer.setting.globalFunctions')">
-                      <el-button type="info" icon="el-icon-edit" plain round @click="editGlobalFunctions">{{ i18nt('designer.setting.addEventHandler') }}</el-button>
-                    </el-form-item>
-                    <el-form-item label-width="0">
-                      <el-divider class="custom-divider">{{ i18nt('designer.setting.formSFCSetting') }}</el-divider>
-                    </el-form-item>
-                    <el-form-item :label="i18nt('designer.setting.formModelName')"><el-input type="text" v-model="formConfig.modelName"></el-input></el-form-item>
-                    <el-form-item :label="i18nt('designer.setting.formRefName')"><el-input type="text" v-model="formConfig.refName"></el-input></el-form-item>
-                    <el-form-item :label="i18nt('designer.setting.formRulesName')"><el-input type="text" v-model="formConfig.rulesName"></el-input></el-form-item>
-                  -->
-        </el-collapse-item>
-        <el-collapse-item name="3" title="详情表单信息">
-          <el-form-item :label="i18nt('表单编码')">
-            <el-input
-              class="search-input"
-              max="200"
-              v-model="formConfig.editFormCode"
-              @clear="
-                formConfig.editFormName=null;
-                $forceUpdate();
-              "
-              v-el-readonly
-              clearable
-            >
-              <i slot="suffix" class="el-input__icon el-icon-search" @click="showFormTemplateDialog = true"></i>
-            </el-input>
-          </el-form-item>
-          <el-form-item :label="i18nt('表单名称')">
-            {{ formConfig.editFormName }}
-          </el-form-item>
-        </el-collapse-item>
-        <el-collapse-item name="4" title="查询弹框展示信息">
-          <el-form-item :label="i18nt('展示字段')">
-            <el-input
-              class="search-input"
-              max="200"
-              v-model="formConfig.searchDialogNameField"
-              clearable
-            >
-            </el-input>
-          </el-form-item>
-          <el-form-item :label="i18nt('数据唯一标识')">
-            <el-input
-              class="search-input"
-              max="200"
-              v-model="formConfig.searchDialogUniqueField"
-              clearable
-            >
-            </el-input>
-          </el-form-item>
-        </el-collapse-item>
-
-        <el-collapse-item v-if="showEventCollapse()" name="2" :title="i18nt('designer.setting.eventSetting')">
-          <!--          <el-form-item label="onBeforeCreated" label-width="150px">
-                      <a href="javascript:void(0);" class="a-link link-oneLind"
-                         @click="editFormEventHandler('onBeforeCreated', ['dataId','done'])">
-                        <span>{{ formConfig.onBeforeCreated }}</span>
-                        <i class="el-icon-edit"></i>
-                      </a>
-                    </el-form-item>-->
-          <el-form-item label="onFormCreated" label-width="150px">
-            <a href="javascript:void(0);" class="a-link link-oneLind" @click="editFormEventHandler('onFormCreated')">
-              <span>{{ formConfig.onFormCreated }}</span>
-              <i class="el-icon-edit"></i>
-            </a>
-          </el-form-item>
-          <el-form-item label="onFormMounted" label-width="150px">
-            <a href="javascript:void(0);" class="a-link link-oneLind" @click="editFormEventHandler('onFormMounted')">
-              <span>{{ formConfig.onFormMounted }}</span>
-              <i class="el-icon-edit"></i>
-            </a>
-          </el-form-item>
-          <!-- -->
-          <el-form-item label="onFormDataChange" label-width="150px">
-            <a href="javascript:void(0);" class="a-link link-oneLind" @click="editFormEventHandler('onFormDataChange')">
-              <span>{{ formConfig.onFormDataChange }}</span>
-              <i class="el-icon-edit"></i>
-            </a>
-          </el-form-item>
-          <!-- -->
-          <!--
-          <el-form-item label="onFormValidate">
-            <el-button type="info" icon="el-icon-edit" plain round @click="editFormEventHandler('onFormValidate')">
-              {{i18nt('designer.setting.addEventHandler')}}</el-button>
-          </el-form-item>
-          -->
-        </el-collapse-item>
-      </el-collapse>
-    </el-form>
-
-    <el-dialog
-      :title="i18nt('designer.setting.editFormEventHandler')"
-      :visible.sync="showFormEventDialogFlag"
-      v-if="showFormEventDialogFlag"
-      :show-close="true"
-      custom-class="dialog-style list-dialog"
-      v-dialog-drag
-      :close-on-click-modal="false"
-      :close-on-press-escape="false"
-      :destroy-on-close="true"
-      :append-to-body="true"
-      :modal-append-to-body="true"
-      top="5vh"
-    >
-      <div class="cont">
-        <el-alert type="info" :closable="false" :title="'form.' + eventParamsMap[curEventName]"></el-alert>
-        <code-editor :mode="'javascript'" :readonly="false" v-model="formEventHandlerCode" ref="ecEditor"></code-editor>
-        <el-alert type="info" :closable="false" title="}"></el-alert>
-      </div>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="showFormEventDialogFlag = false" class="button-sty" icon="el-icon-close">
-          {{ i18nt('designer.hint.cancel') }}
-        </el-button>
-        <el-button type="primary" @click="saveFormEventHandler" class="button-sty" icon="el-icon-check">
-          {{ i18nt('designer.hint.confirm') }}
-        </el-button>
-      </div>
-    </el-dialog>
-
-    <el-dialog
-      :title="i18nt('designer.setting.formCss')"
-      :visible.sync="showEditFormCssDialogFlag"
-      v-if="showEditFormCssDialogFlag"
-      :show-close="true"
-      custom-class="dialog-style list-dialog"
-      v-dialog-drag
-      :close-on-click-modal="false"
-      :close-on-press-escape="false"
-      :destroy-on-close="true"
-      :append-to-body="true"
-      :modal-append-to-body="true"
-    >
-      <div class="cont">
-        <code-editor :mode="'css'" :readonly="false" v-model="formCssCode"></code-editor>
-      </div>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="showEditFormCssDialogFlag = false" class="button-sty" icon="el-icon-close">
-          {{ i18nt('designer.hint.cancel') }}
-        </el-button>
-        <el-button type="primary" @click="saveFormCss" class="button-sty" icon="el-icon-check">
-          {{ i18nt('designer.hint.confirm') }}
-        </el-button>
-      </div>
-    </el-dialog>
-
-    <el-dialog
-      :title="i18nt('designer.setting.globalFunctions')"
-      :visible.sync="showEditFunctionsDialogFlag"
-      v-if="showEditFunctionsDialogFlag"
-      :show-close="true"
-      custom-class="dialog-style list-dialog"
-      v-dialog-drag
-      :close-on-click-modal="false"
-      :close-on-press-escape="false"
-      :destroy-on-close="true"
-      :append-to-body="true"
-      :modal-append-to-body="true"
-    >
-      <div class="cont">
-        <code-editor :mode="'javascript'" :readonly="false" v-model="functionsCode" ref="gfEditor"></code-editor>
-      </div>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="showEditFunctionsDialogFlag = false" class="button-sty" icon="el-icon-close">
-          {{ i18nt('designer.hint.cancel') }}
-        </el-button>
-        <el-button type="primary" @click="saveGlobalFunctions" class="button-sty" icon="el-icon-check">
-          {{ i18nt('designer.hint.confirm') }}
-        </el-button>
-      </div>
-    </el-dialog>
-
-    <el-dialog
-      :title="i18nt('详情数据脚本参数')"
-      :visible.sync="showFormScriptParamDialog"
-      v-if="showFormScriptParamDialog"
-      :show-close="true"
-      custom-class="dialog-style list-dialog"
-      v-dialog-drag
-      :close-on-click-modal="false"
-      :close-on-press-escape="false"
-      :destroy-on-close="true"
-      :append-to-body="true"
-      :modal-append-to-body="true"
-    >
-      <div class="cont">
-        <code-editor :mode="'javascript'" :readonly="false" v-model="formScriptParam" ref="gfEditor"></code-editor>
-      </div>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="showFormScriptParamDialog = false" class="button-sty" icon="el-icon-close">
-          {{ i18nt('designer.hint.cancel') }}
-        </el-button>
-        <el-button type="primary" @click="saveFormScriptParam" class="button-sty" icon="el-icon-check">
-          {{ i18nt('designer.hint.confirm') }}
-        </el-button>
-      </div>
-    </el-dialog>
-    <el-dialog
-      :title="i18nt('详情数据脚本回调')"
-      :visible.sync="showFormScriptSuccessDialog"
-      v-if="showFormScriptSuccessDialog"
-      :show-close="true"
-      custom-class="dialog-style list-dialog"
-      v-dialog-drag
-      :close-on-click-modal="false"
-      :close-on-press-escape="false"
-      :destroy-on-close="true"
-      :append-to-body="true"
-      :modal-append-to-body="true"
-    >
-      <div class="cont">
-        <code-editor :mode="'javascript'" :readonly="false" v-model="formScriptSuccess" ref="gfEditor"></code-editor>
-      </div>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="showFormScriptSuccessDialog = false" class="button-sty" icon="el-icon-close">
-          {{ i18nt('designer.hint.cancel') }}
-        </el-button>
-        <el-button type="primary" @click="saveFormScriptSuccess" class="button-sty" icon="el-icon-check">
-          {{ i18nt('designer.hint.confirm') }}
-        </el-button>
-      </div>
-    </el-dialog>
-
-    <formTemplateDialog v-if="showFormTemplateDialog" :visiable.sync="showFormTemplateDialog"
-                        @confirm="confirmFormTemplate" multi="false"/>
-    <wfObjConfigDialog v-if="showWfObjConfigDialog" :visiable.sync="showWfObjConfigDialog"
-                       @confirm="confirmWfObjConfigDialog" :formTemplate="designer.vueInstance.reportTemplate"/>
-  </div>
-</template>
-
-<script>
-import i18n from '../../../../components/xform/utils/i18n';
-import {deepClone, insertCustomCssToHead, insertGlobalFunctionsToHtml} from '../../../../components/xform/utils/util';
-import formTemplateDialog from '../../../../views/bd/setting/form_template/dialog.vue'
-import wfObjConfigDialog from "./wfObjConfigDialog.vue";
-
-
-export default {
-  name: 'form-setting',
-  mixins: [i18n],
-  components: {
-    formTemplateDialog,
-    wfObjConfigDialog
-  },
-  props: {
-    designer: Object,
-    formConfig: Object
-  },
-  inject: ['getDesignerConfig'],
-  data() {
-    return {
-      designerConfig: this.getDesignerConfig(),
-
-      formActiveCollapseNames: ['1', '2'],
-
-      formSizes: [
-        {label: 'default', value: ''},
-        {label: 'large', value: 'large'},
-        {label: 'medium', value: 'medium'},
-        {label: 'small', value: 'small'},
-        {label: 'mini', value: 'mini'}
-      ],
-
-      showEditFormCssDialogFlag: false,
-      formCssCode: '',
-      cssClassList: [],
-
-      showEditFunctionsDialogFlag: false,
-      functionsCode: '',
-
-      showFormEventDialogFlag: false,
-      formEventHandlerCode: '',
-      curEventName: '',
-
-      eventParamsMap: {
-        onBeforeCreated: 'onBeforeCreated(dataId,formCode,done) {',
-        onFormCreated: 'onFormCreated(dataId,formCode) {',
-        onFormMounted: 'onFormMounted(dataId,formCode) {',
-        onFormDataChange: 'onFormDataChange(fieldName, newValue, oldValue, formModel, subFormName, subFormRowIndex) {'
-        //'onFormValidate':     'onFormValidate() {',
-      },
-      showVabsearchConfigDialog: false,
-      vabsearchConfigType: 1,
-      showFormTemplateDialog: false,
-
-      formScriptParam:null,
-      showFormScriptParamDialog: false,
-      formScriptSuccess:null,
-      showFormScriptSuccessDialog: false,
-      wfObjConfigs:[],
-      showWfObjConfigDialog:false
-    };
-  },
-  created() {
-    //导入表单JSON后需要重新加载自定义CSS样式！！！
-    this.designer.handleEvent('form-json-imported', () => {
-      this.formCssCode = this.formConfig.cssCode;
-      insertCustomCssToHead(this.formCssCode);
-      this.extractCssClass();
-      this.designer.emitEvent('form-css-updated', deepClone(this.cssClassList));
-    });
-  },
-  mounted() {
-    /* SettingPanel和FormWidget为兄弟组件, 在FormWidget加载formConfig时，
-         此处SettingPanel可能无法获取到formConfig.cssCode, 故加个延时函数！ */
-    setTimeout(() => {
-      this.formCssCode = this.formConfig.cssCode;
-      insertCustomCssToHead(this.formCssCode);
-      this.extractCssClass();
-      this.designer.emitEvent('form-css-updated', deepClone(this.cssClassList));
-    }, 1200);
-    this.getListByObjTypeCode();
-  },
-  methods: {
-    showEventCollapse() {
-      if (this.designerConfig['eventCollapse'] === undefined) {
-        return true;
-      }
-
-      return !!this.designerConfig['eventCollapse'];
-    },
-
-    editFormCss() {
-      this.formCssCode = this.designer.formConfig.cssCode;
-      this.showEditFormCssDialogFlag = true;
-    },
-
-    extractCssClass() {
-      let regExp = /\..*{/g;
-      let result = this.formCssCode.match(regExp);
-      let cssNameArray = [];
-
-      if (!!result && result.length > 0) {
-        result.forEach(rItem => {
-          let classArray = rItem.split(','); //切分逗号分割的多个class
-          if (classArray.length > 0) {
-            classArray.forEach(cItem => {
-              let caItem = cItem.trim();
-              if (caItem.indexOf('.', 1) !== -1) {
-                //查找第二个.位置
-                let newClass = caItem.substring(caItem.indexOf('.') + 1, caItem.indexOf('.', 1)); //仅截取第一、二个.号之间的class
-                if (!!newClass) {
-                  cssNameArray.push(newClass.trim());
-                }
-              } else if (caItem.indexOf(' ') !== -1) {
-                //查找第一个空格位置
-                let newClass = caItem.substring(caItem.indexOf('.') + 1, caItem.indexOf(' ')); //仅截取第一、二个.号之间的class
-                if (!!newClass) {
-                  cssNameArray.push(newClass.trim());
-                }
-              } else {
-                if (caItem.indexOf('{') !== -1) {
-                  //查找第一个{位置
-                  let newClass = caItem.substring(caItem.indexOf('.') + 1, caItem.indexOf('{'));
-                  cssNameArray.push(newClass.trim());
-                } else {
-                  let newClass = caItem.substring(caItem.indexOf('.') + 1);
-                  cssNameArray.push(newClass.trim());
-                }
-              }
-            });
-          }
-        });
-      }
-
-      //this.cssClassList.length = 0
-      this.cssClassList.splice(0, this.cssClassList.length); //清除数组必须用splice，length=0不会响应式更新！！
-      this.cssClassList = Array.from(new Set(cssNameArray)); //数组去重
-    },
-
-    saveFormCss() {
-      this.extractCssClass();
-      this.designer.formConfig.cssCode = this.formCssCode;
-      insertCustomCssToHead(this.formCssCode);
-      this.showEditFormCssDialogFlag = false;
-
-      this.designer.emitEvent('form-css-updated', deepClone(this.cssClassList));
-    },
-
-    editGlobalFunctions() {
-      this.functionsCode = this.designer.formConfig.functions;
-      this.showEditFunctionsDialogFlag = true;
-    },
-    editFormScriptParam(){
-      this.formScriptParam = this.designer.formConfig.formScriptParam;
-      this.showFormScriptParamDialog = true;
-    },
-
-    saveGlobalFunctions() {
-      const codeHints = this.$refs.gfEditor.getEditorAnnotations();
-      let syntaxErrorFlag = false;
-      if (!!codeHints && codeHints.length > 0) {
-        codeHints.forEach(chItem => {
-          if (chItem.type === 'error') {
-            syntaxErrorFlag = true;
-          }
-        });
-
-        if (syntaxErrorFlag) {
-          this.$message.error(this.i18nt('designer.setting.syntaxCheckWarning'));
-          return;
-        }
-      }
-
-      this.designer.formConfig.functions = this.functionsCode;
-      insertGlobalFunctionsToHtml(this.functionsCode);
-      this.showEditFunctionsDialogFlag = false;
-    },
-
-    editFormEventHandler(eventName) {
-      this.curEventName = eventName;
-      this.formEventHandlerCode = this.formConfig[eventName];
-      this.showFormEventDialogFlag = true;
-    },
-
-    saveFormEventHandler() {
-      const codeHints = this.$refs.ecEditor.getEditorAnnotations();
-      let syntaxErrorFlag = false;
-      if (!!codeHints && codeHints.length > 0) {
-        codeHints.forEach(chItem => {
-          if (chItem.type === 'error') {
-            syntaxErrorFlag = true;
-          }
-        });
-
-        if (syntaxErrorFlag) {
-          this.$message.error(this.i18nt('designer.setting.syntaxCheckWarning'));
-          return;
-        }
-      }
-
-      this.formConfig[this.curEventName] = this.formEventHandlerCode;
-      this.showFormEventDialogFlag = false;
-    },
-    confirmFormTemplate(rows) {
-      if (rows.length) {
-        let row = rows[0];
-        this.$set(this.formConfig, "editFormCode", row.formCode);
-        this.$set(this.formConfig, "editFormName", row.formName);
-      }
-    },
-    getEventButtonName(funStr) {
-      let name = this.i18nt("designer.setting.addEventHandler");
-      if (funStr) name = "已维护"
-      return name;
-    },
-    saveFormScriptParam() {
-      const codeHints = this.$refs.gfEditor.getEditorAnnotations();
-      let syntaxErrorFlag = false;
-      if (!!codeHints && codeHints.length > 0) {
-        codeHints.forEach(chItem => {
-          if (chItem.type === 'error') {
-            syntaxErrorFlag = true;
-          }
-        });
-
-        if (syntaxErrorFlag) {
-          this.$message.error(this.i18nt('designer.setting.syntaxCheckWarning'));
-          return;
-        }
-      }
-
-      this.designer.formConfig.formScriptParam = this.formScriptParam;
-      this.showFormScriptParamDialog = false;
-    },
-    editFormScriptSuccess(){
-      this.formScriptSuccess = this.designer.formConfig.formScriptSuccess;
-      this.showFormScriptSuccessDialog = true;
-    },
-    saveFormScriptSuccess() {
-      const codeHints = this.$refs.gfEditor.getEditorAnnotations();
-      let syntaxErrorFlag = false;
-      if (!!codeHints && codeHints.length > 0) {
-        codeHints.forEach(chItem => {
-          if (chItem.type === 'error') {
-            syntaxErrorFlag = true;
-          }
-        });
-
-        if (syntaxErrorFlag) {
-          this.$message.error(this.i18nt('designer.setting.syntaxCheckWarning'));
-          return;
-        }
-      }
-
-      this.designer.formConfig.formScriptSuccess = this.formScriptSuccess;
-      this.showFormScriptSuccessDialog = false;
-    },
-    openWfObjConfigDialog(){
-      this.showWfObjConfigDialog = true;
-    },
-    confirmWfObjConfigDialog(rows){
-      this.wfObjConfigs = rows || [];
-    },
-    getListByObjTypeCode(){
-      let reportTemplate = this.designer.vueInstance.reportTemplate
-      this.$http({
-        url: `/${reportTemplate.serviceName}/wf_obj_config/listByObjTypeCode`,
-        method: `post`,
-        data:{
-          stringOne:reportTemplate.objTypeCode
-        },
-        isLoading: true,
-        success: res => {
-          this.wfObjConfigs = res.objx || [];
-        }
-      });
-    },
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-.setting-form {
-  ::v-deep .el-form-item__label {
-    font-size: 13px;
-    //text-overflow: ellipsis;
-    overflow: hidden;
-    white-space: nowrap;
-  }
-
-  ::v-deep .el-form-item--mini.el-form-item {
-    margin-bottom: 6px;
-  }
-
-  .radio-group-custom {
-    ::v-deep .el-radio-button__inner {
-      padding-left: 12px;
-      padding-right: 12px;
-    }
-  }
-
-  .custom-divider.el-divider--horizontal {
-    margin: 10px 0;
-  }
-}
-
-.setting-collapse {
-  ::v-deep .el-collapse-item__content {
-    padding-bottom: 6px;
-  }
-
-  ::v-deep .el-collapse-item__header {
-    font-weight: bold;
-  }
-}
-
-.small-padding-dialog {
-  ::v-deep .el-dialog__body {
-    padding: 6px 15px 12px 15px;
-  }
-}
-</style>
+<template>
+  <div>
+    <el-form
+      :model="formConfig"
+      size="mini"
+      label-position="left"
+      label-width="120px"
+      class="setting-form"
+      @submit.native.prevent
+    >
+      <el-collapse v-model="formActiveCollapseNames" class="setting-collapse">
+        <el-collapse-item
+          name="1"
+          :title="i18nt('designer.setting.basicSetting')"
+        >
+          <el-form-item class="form-item-label-top" :label="i18nt('数据库表')">
+            <el-input type="text" v-model="formConfig.entity"></el-input>
+          </el-form-item>
+          <el-form-item class="form-item-label-top" :label="i18nt('数据保存脚本编码')">
+            <el-input
+              type="text"
+              v-model="formConfig.saveScriptCode"
+              placeholder="默认saveUpdatge"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="全局参数配置">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormEventHandler('globalConfig')"
+            >
+              <span>{{ formConfig.globalConfig }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <el-form-item :label="i18nt('designer.setting.globalFunctions')">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editGlobalFunctions"
+            >
+              <span>{{ formConfig.functions }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <el-form-item :label="i18nt('designer.setting.formCss')">
+            <el-button
+              type="info"
+              icon="el-icon-edit"
+              plain
+              round
+              @click="editFormCss"
+            >
+              {{ i18nt("designer.setting.addCss") }}
+            </el-button>
+          </el-form-item>
+        </el-collapse-item>
+        <el-collapse-item name="2" title="详情表单信息">
+          <el-form-item :label="i18nt('加载详情数据')">
+            <el-switch v-model="formConfig.isLoadEntity"></el-switch>
+          </el-form-item>
+          <el-form-item class="form-item-label-top" :label="i18nt('详情数据脚本编码')">
+            <el-input
+              type="text"
+              v-model="formConfig.formScriptCode"
+              placeholder="默认getOne"
+            ></el-input>
+          </el-form-item>
+          <el-form-item :label="i18nt('详情数据脚本参数')">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormScriptParam"
+            >
+              <span>{{ formConfig.formScriptParam }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <el-form-item :label="i18nt('详情数据脚本回调')">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormScriptSuccess"
+            >
+              <span>{{ formConfig.formScriptSuccess }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <el-form-item class="form-item-label-top" :label="i18nt('查看页面表单编码')">
+            <el-input
+              class="search-input"
+              max="200"
+              v-model="formConfig.editFormCode"
+              @clear="
+                formConfig.editFormName = null;
+                $forceUpdate();
+              "
+              v-el-readonly
+              clearable
+            >
+              <i
+                slot="suffix"
+                class="el-input__icon el-icon-search"
+                @click="openFormTemplate(2)"
+              ></i>
+            </el-input>
+          </el-form-item>
+          <el-form-item :label="i18nt('查看页面表单名称')">
+            {{ formConfig.editFormName }}
+          </el-form-item>
+          <el-form-item class="form-item-label-top" :label="i18nt('新增页面表单编码')">
+            <el-input
+              class="search-input"
+              max="200"
+              v-model="formConfig.addFormCode"
+              @clear="
+                formConfig.addFormCode = null;
+                formConfig.addFormName = null;
+                $forceUpdate();
+              "
+              v-el-readonly
+              clearable
+              placeholder="默认使用查看表单编码"
+            >
+              <i
+                slot="suffix"
+                class="el-input__icon el-icon-search"
+                @click="openFormTemplate(1)"
+              ></i>
+            </el-input>
+          </el-form-item>
+          <el-form-item :label="i18nt('新增页面表单名称')">
+            {{ formConfig.addFormName }}
+          </el-form-item>
+          <el-form-item :label="i18nt('详情翻单按钮')">
+            <el-switch v-model="formConfig.billNavEnabled"></el-switch>
+            <span style="margin-left: 8px; color: #999; font-size: 12px">
+              编辑态页签显示「上一单/下一单」
+            </span>
+          </el-form-item>
+        </el-collapse-item>
+        <el-collapse-item name="actionButtons" title="操作按钮">
+          <!-- formDialog/formDrawer 按 formCode 打开时的底部按钮（formConfig.actionButtons），
+               未配置则回退默认取消/确定；权限编码 = formCode:authName（禁用清单机制，默认放行） -->
+          <el-form-item label-width="0">
+            <draggable
+              tag="ul"
+              class="draggable-box"
+              v-if="actionButtons.length"
+              :list="actionButtons"
+              v-bind="{
+                group: 'actionBtnGroup',
+                ghostClass: 'ghost',
+                handle: '.drag-option',
+              }"
+            >
+              <li
+                v-for="(btn, btnIdx) in actionButtons"
+                :key="btnIdx"
+                class="col-item action-button-item"
+              >
+                <i class="el-icon-s-operation drag-option"></i>
+                <span class="action-button-label">{{
+                  btn.label || btn.code
+                }}</span>
+                <el-button
+                  circle
+                  plain
+                  size="mini"
+                  icon="el-icon-edit"
+                  @click="editActionButton(btnIdx)"
+                ></el-button>
+                <el-button
+                  circle
+                  plain
+                  size="mini"
+                  type="danger"
+                  icon="el-icon-minus"
+                  @click="removeActionButton(btnIdx)"
+                ></el-button>
+              </li>
+            </draggable>
+            <div>
+              <el-button
+                type="text"
+                icon="el-icon-circle-plus-outline"
+                class="add-option"
+                @click="addActionButton"
+              >
+                {{ i18nt("添加按钮") }}
+              </el-button>
+            </div>
+          </el-form-item>
+        </el-collapse-item>
+        <el-collapse-item name="3" title="流程信息">
+          <!-- 分组按单据的流程生命周期排：基础 → 提交入口 → 提交动作 → 审批过程 → 高级。
+               「提交动作」组内的顺序即真实执行顺序：前置脚本 → 确认提示 → 启动时自动保存。 -->
+          <div class="wf-group-title">基础</div>
+          <el-form-item :label="i18nt('启用流程')">
+            <el-switch
+              v-model="formConfig.wfEnabled"
+              @change="changeWfEnabled"
+            ></el-switch>
+          </el-form-item>
+          <el-form-item class="form-item-label-top" :label="i18nt('默认流程单据类型名称')">
+            <el-input
+              type="text"
+              v-model="designer.vueInstance.reportTemplate.objTypeName"
+            ></el-input>
+          </el-form-item>
+          <el-form-item>
+            <span slot="label"
+              >流程主题
+              <scriptDescriptionButton
+                title="流程主题说明"
+                path="static/readme/WfSubject.txt"
+              ></scriptDescriptionButton>
+            </span>
+          </el-form-item>
+          <div>
+            <el-input
+              style="word-break: break-word"
+              type="textarea"
+              :rows="3"
+              v-model="formConfig.wfTheme"
+              clearable
+            ></el-input>
+          </div>
+
+          <div class="wf-group-title">提交入口（按钮）</div>
+          <el-form-item v-if="formConfig.wfEnabled">
+            <span slot="label">
+              {{ i18nt("新增页启用「保存并提交流程」按钮") }}
+              <el-tooltip effect="light" placement="top">
+                <div slot="content" style="line-height: 1.6">
+                  详情页标题栏内建「保存并提交流程」按钮<br />
+                  只在新增页显示，编辑态、已启动流程的单据不显示<br />
+                  按钮名由后台流程自定义属性(param18)统一下发，此处不配
+                </div>
+                <i class="el-icon-info"></i>
+              </el-tooltip>
+            </span>
+            <el-switch v-model="formConfig.saveSubmitEnabled"></el-switch>
+          </el-form-item>
+          <el-form-item>
+            <span slot="label">
+              {{ i18nt("提交流程按钮显隐控制脚本") }}
+              <el-tooltip effect="light" placement="top">
+                <div slot="content" style="line-height: 1.6">
+                  控制详情页「提交流程」按钮显隐，return false
+                  隐藏，不配则显示<br />
+                  随表单数据实时求值，脚本内只读数据、返回布尔即可，切勿修改数据
+                </div>
+                <i class="el-icon-info"></i>
+              </el-tooltip>
+            </span>
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormEventHandler('wfStartBtnShow')"
+            >
+              <span>{{ formConfig.wfStartBtnShow }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+
+          <div class="wf-group-title">提交动作（按执行先后）</div>
+          <el-form-item>
+            <span slot="label">
+              {{ i18nt("提交前置处理脚本") }}
+              <el-tooltip effect="light" placement="top">
+                <div slot="content" style="line-height: 1.6">
+                  「提交流程」「保存并提交流程」共用<br />
+                  表单校验通过后、确认框之前执行<br />
+                  return false 中止提交；返回 Promise 则等它 resolve（false 或
+                  reject 同样中止）<br />
+                  入参 source：saveSubmit=保存并提交流程，wfStart=提交流程
+                </div>
+                <i class="el-icon-info"></i>
+              </el-tooltip>
+            </span>
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormEventHandler('onBeforeSubmitWf')"
+            >
+              <span>{{ formConfig.onBeforeSubmitWf }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <el-form-item :label="i18nt('流程启动确认提示脚本')">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormEventHandler('wfStartConfirmText')"
+            >
+              <span>{{ formConfig.wfStartConfirmText }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <el-form-item :label="i18nt('流程启动时自动保存表单数据')">
+            <el-switch v-model="formConfig.wfStartBindSave"></el-switch>
+          </el-form-item>
+
+          <div class="wf-group-title">审批过程</div>
+          <el-form-item :label="i18nt('流程通过时自动保存表单数据')">
+            <el-switch v-model="formConfig.wfAgreenBindSave"></el-switch>
+          </el-form-item>
+          <el-form-item :label="i18nt('流程通过时自动保存表单数据的节点配置')">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="openWfConfigDataDialog2"
+            >
+              <span>{{
+                formConfig.wfAgreeConfigData &&
+                formConfig.wfAgreeConfigData.length
+                  ? "已维护"
+                  : ""
+              }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <el-form-item :label="i18nt('启用流程节点可编辑表单')">
+            <el-switch v-model="formConfig.wfConfigDataEnabled"></el-switch>
+          </el-form-item>
+          <el-form-item :label="i18nt('流程节点可编辑表单配置')">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="openWfConfigDataDialog"
+            >
+              <span>{{
+                formConfig.wfConfigData && formConfig.wfConfigData.length
+                  ? "已维护"
+                  : ""
+              }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+
+          <div class="wf-group-title">高级</div>
+          <el-form-item class="form-item-label-top" :label="i18nt('引用流程的表单编码')">
+            <el-input
+              type="text"
+              v-model="designer.vueInstance.reportTemplate.fromWfFormCode"
+            ></el-input>
+          </el-form-item>
+          <el-form-item :label="i18nt('流程自定义配置')">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormEventHandler('wfConfig')"
+            >
+              <span>{{ formConfig.wfConfig }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+        </el-collapse-item>
+        <el-collapse-item name="4" title="列表标签页信息（仅列表表单生效）">
+          <el-form-item label-width="0">
+            <span style="color: #999; font-size: 12px; line-height: 1.6">
+              本组配置只从「查询列表页」所用的表单读取，在详情/编辑表单里设置不会生效
+            </span>
+          </el-form-item>
+          <el-form-item :label="i18nt('列表启用详情多标签')">
+            <el-switch v-model="formConfig.multiTabEnabled"></el-switch>
+          </el-form-item>
+          <el-form-item class="form-item-label-top" :label="i18nt('标签名称字段')">
+            <el-input
+              type="text"
+              v-model="formConfig.multiTabLabelField"
+            ></el-input>
+          </el-form-item>
+          <el-form-item
+            v-if="formConfig.multiTabEnabled"
+            :label="i18nt('新增打开页签')"
+          >
+            <el-switch v-model="formConfig.addTabEnabled"></el-switch>
+            <span style="margin-left: 8px; color: #999; font-size: 12px">
+              开启后新增打开独立可关闭页签，需配置「标签名称字段」
+            </span>
+          </el-form-item>
+          <el-form-item :label="i18nt('流程启动后行为')">
+            <el-radio-group v-model="formConfig.submitBehavior">
+              <el-radio label="closeToList">关闭页签并回列表刷新</el-radio>
+              <el-radio label="refreshCurrent">刷新当前页签</el-radio>
+            </el-radio-group>
+            <div style="color: #999; font-size: 12px; line-height: 1.6">
+              详情页「保存并提交」「直接启动流程」成功后的行为，不填默认「刷新当前页签」
+            </div>
+          </el-form-item>
+        </el-collapse-item>
+        <el-collapse-item name="5" title="其他标签页信息">
+          <el-form-item class="form-item-label-top" :label="i18nt('自定义列表标签名称')">
+            <el-input
+              type="text"
+              v-model="formConfig.customListTabLabel"
+              placeholder="默认`列表`"
+            ></el-input>
+          </el-form-item>
+          <el-form-item :label="i18nt('启用其他标签页')">
+            <el-switch v-model="formConfig.otherTabEnabled"></el-switch>
+          </el-form-item>
+          <el-form-item :label="i18nt('隐藏常规标签')">
+            <el-switch v-model="formConfig.hideNormalTab"></el-switch>
+          </el-form-item>
+          <el-form-item :label="i18nt('其他标签页配置')"> </el-form-item>
+          <el-form-item class="form-item-label-top" label-width="0">
+            <div>
+              <draggable
+                tag="ul"
+                class="draggable-box"
+                :list="formConfig.otherTabList"
+                v-bind="{
+                  group: 'optionsGroup',
+                  ghostClass: 'ghost',
+                  handle: '.drag-option',
+                }"
+              >
+                <li v-for="(option, idx) in formConfig.otherTabList" :key="idx">
+                  <el-input
+                    v-model="option.label"
+                    size="mini"
+                    style="width: 100px"
+                    placeholder="标签名称"
+                  ></el-input>
+                  <el-input
+                    v-model="option.formCode"
+                    size="mini"
+                    style="width: 100px"
+                    placeholder="表单模板编码"
+                  ></el-input>
+                  <i class="el-icon-s-operation drag-option"></i>
+                  <el-button
+                    circle
+                    plain
+                    size="mini"
+                    type="danger"
+                    @click="formConfig.otherTabList.splice(idx, 1)"
+                    icon="el-icon-minus"
+                    class="col-delete-button"
+                  ></el-button>
+                </li>
+              </draggable>
+              <el-button type="text" @click="addOtherTab">{{
+                i18nt("designer.setting.addOption")
+              }}</el-button>
+            </div>
+          </el-form-item>
+        </el-collapse-item>
+        <el-collapse-item name="6" title="查询弹框展示信息">
+          <el-form-item class="form-item-label-top" :label="i18nt('展示字段')">
+            <el-input
+              class="search-input"
+              max="200"
+              v-model="formConfig.searchDialogNameField"
+              clearable
+            >
+            </el-input>
+          </el-form-item>
+          <el-form-item class="form-item-label-top" :label="i18nt('数据唯一标识')">
+            <el-input
+              class="search-input"
+              max="200"
+              v-model="formConfig.searchDialogUniqueField"
+              clearable
+            >
+            </el-input>
+          </el-form-item>
+        </el-collapse-item>
+
+        <el-collapse-item name="8" title="动态字段规则">
+          <form-dynamic-field-setting
+            :designer="designer"
+            :form-config="formConfig"
+          ></form-dynamic-field-setting>
+        </el-collapse-item>
+
+        <el-collapse-item
+          v-if="showEventCollapse()"
+          name="7"
+          :title="i18nt('designer.setting.eventSetting')"
+        >
+          <!--          <el-form-item label="onBeforeCreated" label-width="150px">
+                      <a href="javascript:void(0);" class="a-link link-oneLind"
+                         @click="editFormEventHandler('onBeforeCreated', ['dataId','done'])">
+                        <span>{{ formConfig.onBeforeCreated }}</span>
+                        <i class="el-icon-edit"></i>
+                      </a>
+                    </el-form-item>-->
+          <el-form-item label="onFormCreated" label-width="150px">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormEventHandler('onFormCreated')"
+            >
+              <span>{{ formConfig.onFormCreated }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <el-form-item label="onFormBeforeMounted" label-width="150px">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormEventHandler('onFormBeforeMounted')"
+            >
+              <span>{{ formConfig.onFormBeforeMounted }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <el-form-item label="onFormMounted" label-width="150px">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormEventHandler('onFormMounted')"
+            >
+              <span>{{ formConfig.onFormMounted }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <!-- -->
+          <el-form-item label="onFormDataChange" label-width="150px">
+            <a
+              href="javascript:void(0);"
+              class="a-link link-oneLind"
+              @click="editFormEventHandler('onFormDataChange')"
+            >
+              <span>{{ formConfig.onFormDataChange }}</span>
+              <i class="el-icon-edit"></i>
+            </a>
+          </el-form-item>
+          <!-- -->
+          <!--
+          <el-form-item label="onFormValidate">
+            <el-button type="info" icon="el-icon-edit" plain round @click="editFormEventHandler('onFormValidate')">
+              {{i18nt('designer.setting.addEventHandler')}}</el-button>
+          </el-form-item>
+          -->
+        </el-collapse-item>
+      </el-collapse>
+    </el-form>
+
+    <el-dialog
+      :title="formEventDialogTitle"
+      :visible.sync="showFormEventDialogFlag"
+      v-if="showFormEventDialogFlag"
+      :show-close="true"
+      custom-class="dialog-style list-dialog"
+      v-dialog-drag
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :destroy-on-close="true"
+      :append-to-body="true"
+      :modal-append-to-body="true"
+      top="5vh"
+    >
+      <div class="cont">
+        <el-alert
+          type="info"
+          :closable="false"
+          :title="'form.' + eventParamsMap[curEventName]"
+        ></el-alert>
+        <code-editor
+          :mode="'javascript'"
+          :readonly="false"
+          v-model="formEventHandlerCode"
+          ref="ecEditor"
+        ></code-editor>
+        <el-alert type="info" :closable="false" title="}"></el-alert>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button
+          @click="showFormEventDialogFlag = false"
+          class="button-sty"
+          icon="el-icon-close"
+        >
+          {{ i18nt("designer.hint.cancel") }}
+        </el-button>
+        <el-button
+          type="primary"
+          @click="saveFormEventHandler"
+          class="button-sty"
+          icon="el-icon-check"
+        >
+          {{ i18nt("designer.hint.confirm") }}
+        </el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog
+      :title="i18nt('designer.setting.formCss')"
+      :visible.sync="showEditFormCssDialogFlag"
+      v-if="showEditFormCssDialogFlag"
+      :show-close="true"
+      custom-class="dialog-style list-dialog"
+      v-dialog-drag
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :destroy-on-close="true"
+      :append-to-body="true"
+      :modal-append-to-body="true"
+    >
+      <div class="cont">
+        <code-editor
+          :mode="'css'"
+          :readonly="false"
+          v-model="formCssCode"
+        ></code-editor>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button
+          @click="showEditFormCssDialogFlag = false"
+          class="button-sty"
+          icon="el-icon-close"
+        >
+          {{ i18nt("designer.hint.cancel") }}
+        </el-button>
+        <el-button
+          type="primary"
+          @click="saveFormCss"
+          class="button-sty"
+          icon="el-icon-check"
+        >
+          {{ i18nt("designer.hint.confirm") }}
+        </el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog
+      :title="i18nt('designer.setting.globalFunctions')"
+      :visible.sync="showEditFunctionsDialogFlag"
+      v-if="showEditFunctionsDialogFlag"
+      :show-close="true"
+      custom-class="dialog-style list-dialog"
+      v-dialog-drag
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :destroy-on-close="true"
+      :append-to-body="true"
+      :modal-append-to-body="true"
+    >
+      <div class="cont">
+        <code-editor
+          :mode="'javascript'"
+          :readonly="false"
+          v-model="functionsCode"
+          ref="gfEditor"
+        ></code-editor>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button
+          @click="showEditFunctionsDialogFlag = false"
+          class="button-sty"
+          icon="el-icon-close"
+        >
+          {{ i18nt("designer.hint.cancel") }}
+        </el-button>
+        <el-button
+          type="primary"
+          @click="saveGlobalFunctions"
+          class="button-sty"
+          icon="el-icon-check"
+        >
+          {{ i18nt("designer.hint.confirm") }}
+        </el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog
+      :title="i18nt('详情数据脚本参数')"
+      :visible.sync="showFormScriptParamDialog"
+      v-if="showFormScriptParamDialog"
+      :show-close="true"
+      custom-class="dialog-style list-dialog"
+      v-dialog-drag
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :destroy-on-close="true"
+      :append-to-body="true"
+      :modal-append-to-body="true"
+    >
+      <div class="cont">
+        <code-editor
+          :mode="'javascript'"
+          :readonly="false"
+          v-model="formScriptParam"
+          ref="gfEditor"
+        ></code-editor>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button
+          @click="showFormScriptParamDialog = false"
+          class="button-sty"
+          icon="el-icon-close"
+        >
+          {{ i18nt("designer.hint.cancel") }}
+        </el-button>
+        <el-button
+          type="primary"
+          @click="saveFormScriptParam"
+          class="button-sty"
+          icon="el-icon-check"
+        >
+          {{ i18nt("designer.hint.confirm") }}
+        </el-button>
+      </div>
+    </el-dialog>
+    <el-dialog
+      :title="i18nt('详情数据脚本回调')"
+      :visible.sync="showFormScriptSuccessDialog"
+      v-if="showFormScriptSuccessDialog"
+      :show-close="true"
+      custom-class="dialog-style list-dialog"
+      v-dialog-drag
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :destroy-on-close="true"
+      :append-to-body="true"
+      :modal-append-to-body="true"
+    >
+      <div class="cont">
+        <code-editor
+          :mode="'javascript'"
+          :readonly="false"
+          v-model="formScriptSuccess"
+          ref="gfEditor"
+        ></code-editor>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button
+          @click="showFormScriptSuccessDialog = false"
+          class="button-sty"
+          icon="el-icon-close"
+        >
+          {{ i18nt("designer.hint.cancel") }}
+        </el-button>
+        <el-button
+          type="primary"
+          @click="saveFormScriptSuccess"
+          class="button-sty"
+          icon="el-icon-check"
+        >
+          {{ i18nt("designer.hint.confirm") }}
+        </el-button>
+      </div>
+    </el-dialog>
+    <el-dialog
+      v-if="dialogVisible"
+      custom-class="dialog-style list-dialog"
+      :title="i18nt('流程节点可编辑表单配置')"
+      :visible.sync="dialogVisible"
+      :show-close="!0"
+      :append-to-body="true"
+      :modal="false"
+      :close-on-click-modal="!1"
+      :close-on-press-escape="!1"
+      :destroy-on-close="!0"
+      width="1220px"
+      top="5vh"
+      v-dialog-drag
+      :fullscreen="true"
+    >
+      <div class="cont" style="padding-bottom: 8px">
+        <el-table
+          ref="singleTable"
+          width="100%"
+          :data="wfConfigData"
+          height="100%"
+          border=""
+          row-key="columnId"
+          stripe=""
+          style="margin-bottom: 0px"
+        >
+          <el-table-column
+            type="index"
+            width="35"
+            fixed="left"
+          ></el-table-column>
+          <!-- <el-table-column :label="i18nt('服务')" width="150">
+            <template slot-scope="{ row }">
+              <el-select v-model="row.serveType" @change="changeServeType(row)">
+                <el-option :value="1" label="正式"></el-option>
+                <el-option :value="2" label="UAT"></el-option>
+                <el-option :value="3" label="测试"></el-option>
+                <el-option :value="4" label="自定义"></el-option>
+              </el-select>
+            </template>
+          </el-table-column>
+          <el-table-column :label="i18nt('自定义服务')" width="150">
+            <template slot-scope="{ row }">
+              <el-input
+                v-model="row.serveName"
+                clearable
+                :disabled="row.serveType !== 4"
+              ></el-input>
+            </template>
+          </el-table-column>
+          <el-table-column :label="i18nt('组织编码')" width="250">
+            <template slot-scope="{ row, $index }">
+              <el-input v-model="row.companyCodes" clearable></el-input>
+            </template>
+          </el-table-column> -->
+          <el-table-column :label="i18nt('组织编码')" width="250">
+            <template slot-scope="{ row, $index }">
+              <el-input
+                class="search-input"
+                max="200"
+                v-model="row.companyCodes"
+                @clear="clearBdCompanyEnv1(row)"
+                v-el-readonly
+                clearable
+              >
+                <i
+                  slot="suffix"
+                  class="el-input__icon el-icon-search"
+                  @click="openBdCompanyEnvDialog1($index)"
+                ></i>
+              </el-input>
+            </template>
+          </el-table-column>
+          <el-table-column :label="i18nt('服务名称')" width="150">
+            <template slot-scope="{ row }">
+              {{ row.serveName }}
+            </template>
+          </el-table-column>
+          <!-- <el-table-column :label="i18nt('流程模板编码')" width="150">
+            <template slot-scope="{ row }">
+              <el-input v-model="row.modelKey" clearable></el-input>
+            </template>
+          </el-table-column> -->
+          <el-table-column :label="i18nt('流程模板序号')" width="150">
+            <template slot-scope="{ row }">
+              <base-input-number
+                v-model="row.modelOrders"
+                clearable
+              ></base-input-number>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="i18nt('节点步骤（多个值用“,”隔开）')"
+            width="250"
+          >
+            <template slot-scope="{ row }">
+              <el-input v-model="row.taskSteps" clearable></el-input>
+            </template>
+          </el-table-column>
+          <!--          <el-table-column :label="i18nt('设置')" width="150">
+                      <template slot-scope="{row}">
+                        <el-select v-model="row.type" clearable>
+                          <el-option :value="1" label="可编辑"></el-option>
+                          <el-option :value="2" label="仅显示"></el-option>
+                          <el-option :value="3" label="隐藏"></el-option>
+                        </el-select>
+                      </template>
+                    </el-table-column>-->
+          <el-table-column
+            :label="i18nt('designer.setting.actionColumn')"
+            width="100"
+            align="center"
+          >
+            <template #header>
+              <span>{{ i18nt("designer.setting.actionColumn") }}</span>
+              <el-button
+                :title="i18nt('designer.setting.addTableColumn')"
+                size="mini"
+                type=""
+                circle=""
+                icon="el-icon-plus"
+                @click="addItem"
+              ></el-button>
+            </template>
+            <template slot-scope="scope">
+              <el-button
+                :title="i18nt('designer.setting.deleteTableColumn')"
+                size="mini"
+                type=""
+                circle=""
+                icon="el-icon-minus"
+                @click="wfConfigData.splice(scope.$index, 1)"
+              ></el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <div class="dialog-footer" slot="footer">
+        <el-button
+          @click="dialogVisible = false"
+          class="button-sty"
+          icon="el-icon-close"
+        >
+          {{ i18nt("designer.hint.cancel") }}
+        </el-button>
+        <el-button
+          type="primary"
+          @click="confirmWfConfigDataDialog"
+          class="button-sty"
+          icon="el-icon-check"
+        >
+          {{ i18nt("designer.hint.confirm") }}
+        </el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog
+      v-if="dialogVisible2"
+      custom-class="dialog-style list-dialog"
+      :title="i18nt('流程通过时自动保存表单数据的节点配置')"
+      :visible.sync="dialogVisible2"
+      :show-close="!0"
+      :append-to-body="true"
+      :modal="false"
+      :close-on-click-modal="!1"
+      :close-on-press-escape="!1"
+      :destroy-on-close="!0"
+      width="1220px"
+      top="5vh"
+      v-dialog-drag
+      :fullscreen="true"
+    >
+      <div class="cont" style="padding-bottom: 8px">
+        <el-table
+          ref="singleTable"
+          width="100%"
+          :data="wfAgreeConfigData"
+          height="100%"
+          border=""
+          row-key="columnId"
+          stripe=""
+          style="margin-bottom: 0px"
+        >
+          <el-table-column
+            type="index"
+            width="35"
+            fixed="left"
+          ></el-table-column>
+          <!-- <el-table-column :label="i18nt('服务')" width="150">
+            <template slot-scope="{ row }">
+              <el-select v-model="row.serveType" @change="changeServeType(row)">
+                <el-option :value="1" label="正式"></el-option>
+                <el-option :value="2" label="UAT"></el-option>
+                <el-option :value="3" label="测试"></el-option>
+                <el-option :value="4" label="自定义"></el-option>
+              </el-select>
+            </template>
+          </el-table-column>
+          <el-table-column :label="i18nt('自定义服务')" width="150">
+            <template slot-scope="{ row }">
+              <el-input
+                v-model="row.serveName"
+                clearable
+                :disabled="row.serveType !== 4"
+              ></el-input>
+            </template>
+          </el-table-column>
+          <el-table-column :label="i18nt('组织编码')" width="250">
+            <template slot-scope="{ row, $index }">
+              <el-input v-model="row.companyCodes" clearable></el-input>
+            </template>
+          </el-table-column> -->
+          <el-table-column :label="i18nt('组织编码')" width="250">
+            <template slot-scope="{ row, $index }">
+              <el-input
+                class="search-input"
+                max="200"
+                v-model="row.companyCodes"
+                @clear="clearBdCompanyEnv2(row)"
+                v-el-readonly
+                clearable
+              >
+                <i
+                  slot="suffix"
+                  class="el-input__icon el-icon-search"
+                  @click="openBdCompanyEnvDialog2($index)"
+                ></i>
+              </el-input>
+            </template>
+          </el-table-column>
+          <el-table-column :label="i18nt('服务名称')" width="150">
+            <template slot-scope="{ row }">
+              {{ row.serveName }}
+            </template>
+          </el-table-column>
+          <!-- <el-table-column :label="i18nt('流程模板编码')" width="150">
+            <template slot-scope="{ row }">
+              <el-input v-model="row.modelKey" clearable></el-input>
+            </template>
+          </el-table-column> -->
+          <el-table-column :label="i18nt('流程模板序号')" width="150">
+            <template slot-scope="{ row }">
+              <base-input-number
+                v-model="row.modelOrders"
+                clearable
+              ></base-input-number>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="i18nt('节点步骤（多个值用“,”隔开）')"
+            width="250"
+          >
+            <template slot-scope="{ row }">
+              <el-input v-model="row.taskSteps" clearable></el-input>
+            </template>
+          </el-table-column>
+          <!--          <el-table-column :label="i18nt('设置')" width="150">
+                      <template slot-scope="{row}">
+                        <el-select v-model="row.type" clearable>
+                          <el-option :value="1" label="可编辑"></el-option>
+                          <el-option :value="2" label="仅显示"></el-option>
+                          <el-option :value="3" label="隐藏"></el-option>
+                        </el-select>
+                      </template>
+                    </el-table-column>-->
+          <el-table-column
+            :label="i18nt('designer.setting.actionColumn')"
+            width="100"
+            align="center"
+          >
+            <template #header>
+              <span>{{ i18nt("designer.setting.actionColumn") }}</span>
+              <el-button
+                :title="i18nt('designer.setting.addTableColumn')"
+                size="mini"
+                type=""
+                circle=""
+                icon="el-icon-plus"
+                @click="addItem2"
+              ></el-button>
+            </template>
+            <template slot-scope="scope">
+              <el-button
+                :title="i18nt('designer.setting.deleteTableColumn')"
+                size="mini"
+                type=""
+                circle=""
+                icon="el-icon-minus"
+                @click="wfAgreeConfigData.splice(scope.$index, 1)"
+              ></el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <div class="dialog-footer" slot="footer">
+        <el-button
+          @click="dialogVisible2 = false"
+          class="button-sty"
+          icon="el-icon-close"
+        >
+          {{ i18nt("designer.hint.cancel") }}
+        </el-button>
+        <el-button
+          type="primary"
+          @click="confirmWfConfigDataDialog2"
+          class="button-sty"
+          icon="el-icon-check"
+        >
+          {{ i18nt("designer.hint.confirm") }}
+        </el-button>
+      </div>
+    </el-dialog>
+
+    <formTemplateDialog
+      v-if="showFormTemplateDialog"
+      :visiable.sync="showFormTemplateDialog"
+      @confirm="confirmFormTemplate"
+      multi="false"
+    />
+    <wfObjConfigDialog
+      v-if="showWfObjConfigDialog"
+      :visiable.sync="showWfObjConfigDialog"
+      @confirm="confirmWfObjConfigDialog"
+      :formTemplate="designer.vueInstance.reportTemplate"
+    />
+
+    <bdCompanyEnvDialog
+      v-if="showBdCompanyEnvDialog1"
+      :visiable.sync="showBdCompanyEnvDialog1"
+      @confirm="confirmBdCompanyEnvDialog1"
+      :multi="false"
+    />
+    <bdCompanyEnvDialog
+      v-if="showBdCompanyEnvDialog2"
+      :visiable.sync="showBdCompanyEnvDialog2"
+      @confirm="confirmBdCompanyEnvDialog2"
+      :multi="false"
+    />
+
+    <actionButtonConfigDialog
+      v-if="showActionButtonDialog && currentActionButton"
+      :visible.sync="showActionButtonDialog"
+      :button="currentActionButton"
+      :form-code="currentFormCode"
+      @confirm="confirmActionButton"
+    />
+  </div>
+</template>
+
+<script>
+import i18n from "../../../../components/xform/utils/i18n";
+import {
+  deepClone,
+  insertCustomCssToHead,
+  insertGlobalFunctionsToHtml,
+} from "../../../../components/xform/utils/util";
+import formTemplateDialog from "../../../../views/bd/setting/form_template/dialog.vue";
+import wfObjConfigDialog from "./wfObjConfigDialog.vue";
+import bdCompanyEnvDialog from "@base/views/bd/setting/bd_company_env/dialog";
+import Draggable from "vuedraggable";
+import formDynamicFieldSetting from "./form-dynamicField-setting.vue";
+import actionButtonConfigDialog from "./action-button-config-dialog.vue";
+
+export default {
+  name: "form-setting",
+  mixins: [i18n],
+  components: {
+    formTemplateDialog,
+    wfObjConfigDialog,
+    bdCompanyEnvDialog,
+    Draggable,
+    formDynamicFieldSetting,
+    actionButtonConfigDialog,
+  },
+  props: {
+    designer: Object,
+    formConfig: Object,
+  },
+  inject: ["getDesignerConfig"],
+  data() {
+    return {
+      designerConfig: this.getDesignerConfig(),
+
+      formActiveCollapseNames: ["1", "2", "7"],
+
+      formSizes: [
+        { label: "default", value: "" },
+        { label: "large", value: "large" },
+        { label: "medium", value: "medium" },
+        { label: "small", value: "small" },
+        { label: "mini", value: "mini" },
+      ],
+
+      showEditFormCssDialogFlag: false,
+      formCssCode: "",
+      cssClassList: [],
+
+      showEditFunctionsDialogFlag: false,
+      functionsCode: "",
+
+      showFormEventDialogFlag: false,
+      formEventHandlerCode: "",
+      curEventName: "",
+      formEventDialogTitle: "",
+      eventDialogTitleMap: {
+        globalConfig: "全局参数配置",
+        wfStartConfirmText: "流程启动确认提示语配置",
+        onBeforeSubmitWf: "提交前置处理脚本配置",
+        wfStartBtnShow: "提交流程按钮显隐控制脚本配置",
+        wfConfig: "流程自定义配置",
+        onBeforeCreated: "表单创建前事件配置",
+        onFormCreated: "表单创建事件配置",
+        onFormBeforeMounted: "表单挂载前事件配置",
+        onFormMounted: "表单挂载事件配置",
+        onFormDataChange: "表单数据变更事件配置",
+        onFormValidate: "表单校验事件配置",
+      },
+
+      eventParamsMap: {
+        onBeforeCreated: "onBeforeCreated(dataId,formCode,done) {",
+        onFormCreated: "onFormCreated(dataId,formCode) {",
+        onFormBeforeMounted: "onFormBeforeMounted(dataId,formCode, done) {",
+        onFormMounted: "onFormMounted(dataId,formCode) {",
+        onFormDataChange:
+          "onFormDataChange(fieldName, newValue, oldValue, formModel, subFormName, subFormRowIndex) {",
+        wfStartConfirmText: "wfStartConfirmText(dataId, formCode, formData) {",
+        onBeforeSubmitWf:
+          "onBeforeSubmitWf(dataId, formCode, formData, source) {",
+        /* 顺序以 indexMixin 的 new Function("formCode","dataId","formData") 为准，
+           不是其他脚本的 (dataId, formCode) 惯例——存量脚本按这个顺序写的，只改提示不动实参 */
+        wfConfig: "wfConfig(formCode, dataId, formData) {",
+        wfStartBtnShow: "wfStartBtnShow(dataId, formCode, formData) {",
+        globalConfig: "globalConfig(dataId, formCode) {",
+        //'onFormValidate':     'onFormValidate() {',
+      },
+      showVabsearchConfigDialog: false,
+      vabsearchConfigType: 1,
+      showFormTemplateDialog: false,
+
+      formScriptParam: null,
+      showFormScriptParamDialog: false,
+      formScriptSuccess: null,
+      showFormScriptSuccessDialog: false,
+      wfObjConfigs: [],
+      showWfObjConfigDialog: false,
+
+      dialogVisible: false,
+      wfConfigData: [],
+
+      dialogVisible2: false,
+      wfAgreeConfigData: [],
+
+      showBdCompanyEnvDialog1: false,
+      showBdCompanyEnvDialog2: false,
+
+      showActionButtonDialog: false,
+      currentActionButton: null,
+      currentActionButtonIndex: -1,
+
+      globalConfigParams: ["dataId", "formCode"],
+
+      tip1: `流程主题表达式设置说明。
+
+1、可使用参数：
+wf：流程对象
+    name：流程名称
+    objTypeCode：单据类型编码
+    objId：对象id
+    procInstId：act流程实例id
+    procDefId：act流程定义id
+    modelId：act流程模板id
+    starterId：启动人ID
+    starterName：启动人姓名
+    uuid：流程实例唯一标识
+identityInfo：身份信息对象
+    id：用户ID
+    loginAccount：用户登录名
+    nickName：用户姓名
+    companyCode：企业编码
+    parentCompanyCode：集团企业编码
+nowDate：当前时间
+nowDateStr：当前时间字符串（yyyy-MM-dd HH:mm:ss）
+nowDayStr：当前天字符串（yyyy-MM-dd）
+tableName：数据库表名，取表单设计中维护的表名作为参数名称
+    tableField1：数据库表字段名1
+    tableField2：数据库表字段名2
+    tableField3：数据库表字段名3
+    ......
+
+2、可使用函数：
+func.orgName(orgId)：根据机构id获取机构名称
+func.convertDate(date, format)：时间转换，如当前时间转为当前天字符串，则$\{func.convertDate(nowDate, 'yyyy-MM-dd')\}，当前时间转为当前月字符串，则$\{func.convertDate(nowDate, 'yyyy-MM')\}
+
+3、配置示例
+比如表名为：pm_product_project，配置如下：
+$\{wf.starterName\}提交的$\{pm_product_project.product_code\}$\{pm_product_project.product_name\}$\{wf.name\}$\{pm_product_project.sn\}$\{func.orgName(pm_product_project.f_sale_org_id)\}$\{nowDayStr\}`,
+    };
+  },
+  created() {
+    //导入表单JSON后需要重新加载自定义CSS样式！！！
+    this.designer.handleEvent("form-json-imported", () => {
+      this.formCssCode = this.formConfig.cssCode || "";
+      insertCustomCssToHead(this.formCssCcssCodeode);
+      this.extractCssClass();
+      this.designer.emitEvent("form-css-updated", deepClone(this.cssClassList));
+    });
+  },
+  computed: {
+    // formDialog/formDrawer 底部操作按钮配置（存 formConfig，随模板保存）
+    actionButtons() {
+      return this.formConfig.actionButtons || [];
+    },
+    currentFormCode() {
+      const reportTemplate =
+        this.designer && this.designer.vueInstance
+          ? this.designer.vueInstance.reportTemplate
+          : null;
+      return (reportTemplate && reportTemplate.formCode) || "";
+    },
+  },
+  mounted() {
+    /* SettingPanel和FormWidget为兄弟组件, 在FormWidget加载formConfig时，
+         此处SettingPanel可能无法获取到formConfig.cssCode, 故加个延时函数！ */
+    setTimeout(() => {
+      this.formCssCode = this.formConfig.cssCode || "";
+      insertCustomCssToHead(this.formCssCode);
+      this.extractCssClass();
+      this.designer.emitEvent("form-css-updated", deepClone(this.cssClassList));
+    }, 1200);
+    this.getListByObjTypeCode();
+  },
+  methods: {
+    ensureActionButtons() {
+      if (!Array.isArray(this.formConfig.actionButtons)) {
+        this.$set(this.formConfig, "actionButtons", []);
+      }
+      return this.formConfig.actionButtons;
+    },
+    addActionButton() {
+      this.currentActionButtonIndex = -1;
+      this.currentActionButton = {
+        code: "",
+        label: "",
+        type: "primary",
+        plain: false,
+        icon: "",
+        authName: "",
+        needValidate: false,
+        closeAfter: true,
+        visible: "",
+        onClick: "",
+      };
+      this.showActionButtonDialog = true;
+    },
+    editActionButton(index) {
+      this.currentActionButtonIndex = index;
+      this.currentActionButton = deepClone(
+        this.formConfig.actionButtons[index]
+      );
+      this.showActionButtonDialog = true;
+    },
+    removeActionButton(index) {
+      this.formConfig.actionButtons.splice(index, 1);
+    },
+    confirmActionButton(btn) {
+      const list = this.ensureActionButtons();
+      if (this.currentActionButtonIndex > -1) {
+        this.$set(list, this.currentActionButtonIndex, btn);
+      } else {
+        list.push(btn);
+      }
+      this.currentActionButton = null;
+      this.currentActionButtonIndex = -1;
+    },
+    showEventCollapse() {
+      if (this.designerConfig["eventCollapse"] === undefined) {
+        return true;
+      }
+
+      return !!this.designerConfig["eventCollapse"];
+    },
+
+    editFormCss() {
+      this.formCssCode = this.designer.formConfig.cssCode;
+      this.showEditFormCssDialogFlag = true;
+    },
+
+    extractCssClass() {
+      let regExp = /\..*{/g;
+      let result = this.formCssCode ? this.formCssCode.match(regExp) : [];
+      let cssNameArray = [];
+
+      if (!!result && result.length > 0) {
+        result.forEach((rItem) => {
+          let classArray = rItem.split(","); //切分逗号分割的多个class
+          if (classArray.length > 0) {
+            classArray.forEach((cItem) => {
+              let caItem = cItem.trim();
+              if (caItem.indexOf(".", 1) !== -1) {
+                //查找第二个.位置
+                let newClass = caItem.substring(
+                  caItem.indexOf(".") + 1,
+                  caItem.indexOf(".", 1)
+                ); //仅截取第一、二个.号之间的class
+                if (!!newClass) {
+                  cssNameArray.push(newClass.trim());
+                }
+              } else if (caItem.indexOf(" ") !== -1) {
+                //查找第一个空格位置
+                let newClass = caItem.substring(
+                  caItem.indexOf(".") + 1,
+                  caItem.indexOf(" ")
+                ); //仅截取第一、二个.号之间的class
+                if (!!newClass) {
+                  cssNameArray.push(newClass.trim());
+                }
+              } else {
+                if (caItem.indexOf("{") !== -1) {
+                  //查找第一个{位置
+                  let newClass = caItem.substring(
+                    caItem.indexOf(".") + 1,
+                    caItem.indexOf("{")
+                  );
+                  cssNameArray.push(newClass.trim());
+                } else {
+                  let newClass = caItem.substring(caItem.indexOf(".") + 1);
+                  cssNameArray.push(newClass.trim());
+                }
+              }
+            });
+          }
+        });
+      }
+
+      //this.cssClassList.length = 0
+      this.cssClassList.splice(0, this.cssClassList.length); //清除数组必须用splice，length=0不会响应式更新！！
+      this.cssClassList = Array.from(new Set(cssNameArray)); //数组去重
+    },
+
+    saveFormCss() {
+      this.extractCssClass();
+      this.designer.formConfig.cssCode = this.formCssCode;
+      insertCustomCssToHead(this.formCssCode);
+      this.showEditFormCssDialogFlag = false;
+
+      this.designer.emitEvent("form-css-updated", deepClone(this.cssClassList));
+    },
+
+    editGlobalFunctions() {
+      this.functionsCode = this.designer.formConfig.functions;
+      this.showEditFunctionsDialogFlag = true;
+    },
+    editFormScriptParam() {
+      this.formScriptParam = this.designer.formConfig.formScriptParam;
+      this.showFormScriptParamDialog = true;
+    },
+
+    saveGlobalFunctions() {
+      const codeHints = this.$refs.gfEditor.getEditorAnnotations();
+      let syntaxErrorFlag = false;
+      if (!!codeHints && codeHints.length > 0) {
+        codeHints.forEach((chItem) => {
+          if (chItem.type === "error") {
+            syntaxErrorFlag = true;
+          }
+        });
+
+        if (syntaxErrorFlag) {
+          this.$message.error(
+            this.i18nt("designer.setting.syntaxCheckWarning")
+          );
+          return;
+        }
+      }
+
+      this.designer.formConfig.functions = this.functionsCode;
+      insertGlobalFunctionsToHtml(this.functionsCode);
+      this.showEditFunctionsDialogFlag = false;
+    },
+
+    editFormEventHandler(eventName, dialogTitle) {
+      this.curEventName = eventName;
+      this.formEventHandlerCode = this.formConfig[eventName];
+      let customTitle =
+        typeof dialogTitle === "string" && dialogTitle ? dialogTitle : null;
+      let eventTitle =
+        customTitle ||
+        this.eventDialogTitleMap[eventName] ||
+        (eventName ? eventName + " 配置" : "配置");
+      this.formEventDialogTitle = this.i18nt(eventTitle);
+      this.showFormEventDialogFlag = true;
+    },
+
+    saveFormEventHandler() {
+      const codeHints = this.$refs.ecEditor.getEditorAnnotations();
+      let syntaxErrorFlag = false;
+      if (!!codeHints && codeHints.length > 0) {
+        codeHints.forEach((chItem) => {
+          if (chItem.type === "error") {
+            syntaxErrorFlag = true;
+          }
+        });
+
+        if (syntaxErrorFlag) {
+          this.$message.error(
+            this.i18nt("designer.setting.syntaxCheckWarning")
+          );
+          return;
+        }
+      }
+
+      this.formConfig[this.curEventName] = this.formEventHandlerCode;
+      this.showFormEventDialogFlag = false;
+    },
+    openFormTemplate(flag) {
+      this.formTemplateFlag = flag;
+      this.showFormTemplateDialog = true;
+    },
+    confirmFormTemplate(rows) {
+      if (rows.length) {
+        let row = rows[0];
+        if (this.formTemplateFlag == 1) {
+          //新增
+          this.$set(this.formConfig, "addFormCode", row.formCode);
+          this.$set(this.formConfig, "addFormName", row.formName);
+        } else {
+          //查看
+          this.$set(this.formConfig, "editFormCode", row.formCode);
+          this.$set(this.formConfig, "editFormName", row.formName);
+        }
+      }
+    },
+    getEventButtonName(funStr) {
+      let name = this.i18nt("designer.setting.addEventHandler");
+      if (funStr) name = "已维护";
+      return name;
+    },
+    saveFormScriptParam() {
+      const codeHints = this.$refs.gfEditor.getEditorAnnotations();
+      let syntaxErrorFlag = false;
+      if (!!codeHints && codeHints.length > 0) {
+        codeHints.forEach((chItem) => {
+          if (chItem.type === "error") {
+            syntaxErrorFlag = true;
+          }
+        });
+
+        if (syntaxErrorFlag) {
+          this.$message.error(
+            this.i18nt("designer.setting.syntaxCheckWarning")
+          );
+          return;
+        }
+      }
+
+      this.designer.formConfig.formScriptParam = this.formScriptParam;
+      this.showFormScriptParamDialog = false;
+    },
+    editFormScriptSuccess() {
+      this.formScriptSuccess = this.designer.formConfig.formScriptSuccess;
+      this.showFormScriptSuccessDialog = true;
+    },
+    saveFormScriptSuccess() {
+      const codeHints = this.$refs.gfEditor.getEditorAnnotations();
+      let syntaxErrorFlag = false;
+      if (!!codeHints && codeHints.length > 0) {
+        codeHints.forEach((chItem) => {
+          if (chItem.type === "error") {
+            syntaxErrorFlag = true;
+          }
+        });
+
+        if (syntaxErrorFlag) {
+          this.$message.error(
+            this.i18nt("designer.setting.syntaxCheckWarning")
+          );
+          return;
+        }
+      }
+
+      this.designer.formConfig.formScriptSuccess = this.formScriptSuccess;
+      this.showFormScriptSuccessDialog = false;
+    },
+    openWfObjConfigDialog() {
+      this.showWfObjConfigDialog = true;
+    },
+    confirmWfObjConfigDialog(rows) {
+      this.wfObjConfigs = rows || [];
+    },
+    getListByObjTypeCode() {
+      let reportTemplate = this.designer.vueInstance.reportTemplate;
+      this.$http({
+        url: `/${reportTemplate.serviceName}/wf_obj_config/listByObjTypeCode`,
+        method: `post`,
+        data: {
+          stringOne: reportTemplate.objTypeCode,
+        },
+        isLoading: true,
+        success: (res) => {
+          this.wfObjConfigs = res.objx || [];
+        },
+      });
+    },
+    changeWfEnabled(val) {
+      this.designer.vueInstance.reportTemplate.objTypeName = null;
+      this.designer.vueInstance.reportTemplate.fromWfFormCode = null;
+    },
+    openWfConfigDataDialog() {
+      let wfConfigData = this.formConfig.wfConfigData || [];
+      this.dialogVisible = true;
+      this.wfConfigData = this.$baseLodash.cloneDeep(wfConfigData);
+    },
+    addItem() {
+      let newItem = {
+        type: null,
+        serveType: null,
+        serveName: null,
+        modelKey: null,
+        modelOrders: undefined,
+        taskSteps: null,
+        companyCodes: null,
+      };
+      this.wfConfigData.push(newItem);
+    },
+    confirmWfConfigDataDialog() {
+      let tableData = this.wfConfigData;
+      let map = {};
+      for (let i = 0; i < tableData.length; i++) {
+        let item = tableData[i];
+        if (!item.serveName) {
+          this.$message({
+            type: "error",
+            message: "服务名称不能为空",
+          });
+          return;
+        }
+        if (!item.companyCodes) {
+          this.$message({
+            type: "error",
+            message: "组织编码不能为空",
+          });
+          return;
+        }
+        let modelOrders = item.modelOrders ?? "";
+
+        let serveName = item.serveName;
+        let companyCodes = item.companyCodes;
+        let key = serveName + "_" + companyCodes + "_" + modelOrders;
+        if (!map[key]) {
+          map[key] = true;
+        } else {
+          this.$message({
+            type: "error",
+            message: "[服务+组织+流程模板序号]不能重复",
+          });
+          return;
+        }
+      }
+
+      this.dialogVisible = !1;
+      this.formConfig.wfConfigData = this.wfConfigData;
+    },
+
+    openWfConfigDataDialog2() {
+      let wfAgreeConfigData = this.formConfig.wfAgreeConfigData || [];
+      this.dialogVisible2 = true;
+      this.wfAgreeConfigData = this.$baseLodash.cloneDeep(wfAgreeConfigData);
+    },
+    addItem2() {
+      let newItem = {
+        type: null,
+        serveType: null,
+        serveName: null,
+        modelKey: null,
+        modelOrders: undefined,
+        taskSteps: null,
+        companyCodes: null,
+      };
+      this.wfAgreeConfigData.push(newItem);
+    },
+    confirmWfConfigDataDialog2() {
+      let tableData = this.wfAgreeConfigData;
+
+      let map = {};
+      for (let i = 0; i < tableData.length; i++) {
+        let item = tableData[i];
+        if (!item.serveName) {
+          this.$message({
+            type: "error",
+            message: "服务名称不能为空",
+          });
+          return;
+        }
+        if (!item.companyCodes) {
+          this.$message({
+            type: "error",
+            message: "组织编码不能为空",
+          });
+          return;
+        }
+        let modelOrders = item.modelOrders ?? "";
+
+        let serveName = item.serveName;
+        let companyCodes = item.companyCodes;
+        let key = serveName + "_" + companyCodes + "_" + modelOrders;
+        if (!map[key]) {
+          map[key] = true;
+        } else {
+          this.$message({
+            type: "error",
+            message: "[服务+组织+流程模板序号]不能重复",
+          });
+          return;
+        }
+      }
+      this.dialogVisible2 = !1;
+      this.formConfig.wfAgreeConfigData = this.wfAgreeConfigData;
+    },
+
+    clearBdCompanyEnv1(row) {
+      row.serveName = null;
+      row.companyCodes = null;
+    },
+    openBdCompanyEnvDialog1(rowIndex) {
+      this.operateIndex = rowIndex;
+      this.showBdCompanyEnvDialog1 = true;
+    },
+    confirmBdCompanyEnvDialog1(rows) {
+      if (rows.length) {
+        let row = rows[0];
+        let item = this.wfConfigData[this.operateIndex];
+        item.serveName = row.bdService;
+        item.companyCodes = row.bdCompanyCode;
+      }
+    },
+
+    clearBdCompanyEnv2(row) {
+      row.serveName = null;
+      row.companyCodes = null;
+    },
+    openBdCompanyEnvDialog2(rowIndex) {
+      this.operateIndex = rowIndex;
+      this.showBdCompanyEnvDialog2 = true;
+    },
+    confirmBdCompanyEnvDialog2(rows) {
+      if (rows.length) {
+        let row = rows[0];
+        let item = this.wfAgreeConfigData[this.operateIndex];
+        item.serveName = row.bdService;
+        item.companyCodes = row.bdCompanyCode;
+      }
+    },
+    addOtherTab() {
+      if (!this.formConfig.otherTabList) {
+        this.$set(this.formConfig, "otherTabList", []);
+      }
+      this.formConfig.otherTabList.push({
+        label: null,
+        formCode: null,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.setting-form {
+  ::v-deep .el-form-item__label {
+    font-size: 13px;
+    //text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+  }
+
+  ::v-deep .el-form-item--mini.el-form-item {
+    margin-bottom: 6px;
+  }
+
+  .radio-group-custom {
+    ::v-deep .el-radio-button__inner {
+      padding-left: 12px;
+      padding-right: 12px;
+    }
+  }
+
+  .custom-divider.el-divider--horizontal {
+    margin: 10px 0;
+  }
+}
+
+.setting-collapse {
+  ::v-deep .el-collapse-item__content {
+    padding-bottom: 6px;
+  }
+
+  ::v-deep .el-collapse-item__header {
+    font-weight: bold;
+  }
+}
+
+/* 折叠组内部的二级分组标题，用于把长配置组切成几段（如「流程信息」） */
+.wf-group-title {
+  margin: 14px 0 8px;
+  padding-left: 8px;
+  border-left: 3px solid #409eff;
+  color: #606266;
+  font-size: 13px;
+  font-weight: 600;
+  line-height: 1.3;
+
+  &:first-child {
+    margin-top: 2px;
+  }
+}
+
+.small-padding-dialog {
+  ::v-deep .el-dialog__body {
+    padding: 6px 15px 12px 15px;
+  }
+}
+::v-deep .el-textarea .el-textarea__inner {
+  word-break: break-all;
+}
+</style>