mcp-vue-codegen 1.0.0

package/build/templates/form-vue.tpl.js

@@ -0,0 +1,862 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateFormVueTemplate = generateFormVueTemplate;
+/**
+ * Group fields by formSection and formRow
+ */
+function getFormFieldsBySection(fields, sectionName) {
+    const rows = new Map();
+    fields
+        .filter(f => f.showInForm && f.formSection === sectionName && f.inputType !== 'hidden')
+        .sort((a, b) => (a.formRow || 0) - (b.formRow || 0))
+        .forEach(f => {
+        const row = f.formRow || 0;
+        if (!rows.has(row))
+            rows.set(row, []);
+        rows.get(row).push(f);
+    });
+    return rows;
+}
+/**
+ * Generate a form field template based on inputType
+ */
+function generateFieldTemplate(field, processDefKey, entityPrefix) {
+    const labelExpr = `t(\`column.\${processDefKey}.${entityPrefix}.${field.fieldName}\`)`;
+    const prop = field.fieldName;
+    const colSpan = field.formColSpan || 6;
+    let inputContent = '';
+    switch (field.inputType) {
+        case 'date':
+            inputContent = `                    <el-date-picker
+                        v-model="dataForm.${prop}"
+                        type="dateTime"
+                        :placeholder="\`\${t('message.pleaseSelect')}\${${labelExpr}}\`"
+                        value-format="${field.dateFormat || 'YYYY-MM-DD'}"
+                        format="${field.dateFormat || 'YYYY-MM-DD'}"
+                      />`;
+            break;
+        case 'textarea':
+            inputContent = `                    <el-input
+                        type="textarea"
+                        rows="${field.textareaRows || 3}"${field.maxLength ? `\n                        maxlength="${field.maxLength}"` : ''}${field.showWordLimit ? `\n                        show-word-limit` : ''}
+                        v-model="dataForm.${prop}"
+                        :placeholder="\`\${t('message.pleaseEnter')}\${${labelExpr}}\`"
+                      ></el-input>`;
+            break;
+        case 'file':
+            inputContent = `                    <upload-file v-model:modelValue="dataForm.${prop}"> </upload-file>`;
+            break;
+        case 'userRef':
+        case 'personRef': {
+            const ref = field.refConfig;
+            const clickFn = field.inputType === 'userRef'
+                ? `${prop}MasterSelect${capitalizeRef(ref.refComponent)}Click`
+                : `${prop}MasterSelect${capitalizeRef(ref.refComponent)}Click`;
+            inputContent = `                    <el-input
+                        v-model="dataForm.${prop}"
+                        ${field.disabled ? 'disabled' : 'readonly'}
+                        :placeholder="\`\${t('message.pleaseSelect')}\${${labelExpr}}\`"
+                      >
+                        <template #append>
+                          <el-button @click="${clickFn}()" icon="Search"></el-button>
+                        </template>
+                      </el-input>`;
+            break;
+        }
+        default: {
+            // Regular input
+            const disabledAttr = field.disabled ? ' disabled' : '';
+            const maxLengthAttr = field.maxLength ? ` maxlength="${field.maxLength}"` : '';
+            if (field.disabled) {
+                inputContent = `                    <el-input${maxLengthAttr} v-model="dataForm.${prop}"${disabledAttr}></el-input>`;
+            }
+            else {
+                inputContent = `                    <el-input${maxLengthAttr} v-model="dataForm.${prop}"${disabledAttr}
+                        :placeholder="\`\${t('message.pleaseEnter')}\${${labelExpr}}\`"
+                      ></el-input>`;
+            }
+            break;
+        }
+    }
+    return `                  <!-- 字段：${field.label} -->
+                  <el-col :span="${colSpan}">
+                    <el-form-item :label="${labelExpr}" prop="${prop}">
+${inputContent}
+                    </el-form-item>
+                  </el-col>`;
+}
+function capitalizeRef(name) {
+    return name.split('-').map(s => s.charAt(0).toUpperCase() + s.slice(1)).join('');
+}
+/**
+ * Generate the detail table columns (from table visible fields)
+ */
+function generateDetailTableColumns(schema) {
+    if (!schema.detail)
+        return '';
+    const detail = schema.detail;
+    const visibleFields = detail.fields.filter(f => f.showInTable && !f.alwaysHide);
+    const editableFields = detail.fields.filter(f => f.editableInTable);
+    return visibleFields.map(f => {
+        const editable = editableFields.find(ef => ef.fieldName === f.fieldName);
+        if (editable) {
+            return generateEditableDetailColumn(f, schema);
+        }
+        return `                  <!-- 字段：${f.label} -->
+                  <el-table-column
+                    prop="${f.fieldName}"
+                    show-overflow-tooltip
+                    :label="t(\`column.\${processDefKey}.detail.${f.fieldName}\`)"
+                    header-align="center"
+                    :min-width="detailColumns.filter((c) => c.key === '${f.fieldName}')[0]?.width"
+                    align="center"
+                  >
+                  </el-table-column>`;
+    }).join('\n');
+}
+function generateEditableDetailColumn(field, schema) {
+    const editType = field.editInputType || field.inputType;
+    const ruleProp = field.editRuleProp || field.fieldName;
+    const bindField = field.editBindField || field.fieldName;
+    let innerTemplate = '';
+    if (editType === 'select') {
+        const dictCode = field.dictCode || '';
+        innerTemplate = `                      <el-form-item
+                        label-width="0"
+                        :rules="dataDetailRules.${ruleProp}"
+                        :prop="\`details.\${$index}.${bindField}\`"
+                      >
+                        <el-select
+                          v-model="row.${bindField}"
+                          style="width: 99%"
+                          :placeholder="\`\${t('message.pleaseSelect')}\${t(\`column.\${processDefKey}.detail.${field.fieldName}\`)}\`"
+                        >
+                          <el-option
+                            v-for="item in ${field.fieldName}Options"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value"
+                          >
+                          </el-option>
+                        </el-select>
+                      </el-form-item>`;
+    }
+    else if (editType === 'date') {
+        innerTemplate = `                      <el-form-item
+                        label-width="0"
+                        :rules="dataDetailRules.${ruleProp}"
+                        :prop="\`details.\${$index}.${field.fieldName}\`"
+                      >
+                        <el-date-picker
+                          type="date"
+                          v-model="row.${field.fieldName}"
+                          :placeholder="\`\${t('message.pleaseSelect')}\${t(\`column.\${processDefKey}.detail.${field.fieldName}\`)}\`"
+                          format="${field.dateFormat || 'YYYY-MM-DD'}"
+                          value-format="${field.dateFormat || 'YYYY-MM-DD'}"
+                          style="width: 99%"
+                        />
+                      </el-form-item>`;
+    }
+    else {
+        innerTemplate = `                      <el-form-item
+                        label-width="0"
+                        :rules="dataDetailRules.${ruleProp}"
+                        :prop="\`details.\${$index}.${field.fieldName}\`"
+                      >
+                        <el-input v-model="row.${field.fieldName}" style="width: 99%" />
+                      </el-form-item>`;
+    }
+    return `                  <!-- 字段：${field.label} -->
+                  <el-table-column
+                    prop="${field.fieldName}"
+                    show-overflow-tooltip
+                    :label="t(\`column.\${processDefKey}.detail.${field.fieldName}\`)"
+                    header-align="center"
+                    :min-width="detailColumns.filter((c) => c.key === '${field.fieldName}')[0]?.width"
+                    align="center"
+                  >
+                    <template v-slot="{ $index, row }">
+${innerTemplate}
+                    </template>
+                  </el-table-column>`;
+}
+function generateFormVueTemplate(schema) {
+    const m = schema.module;
+    const master = schema.master;
+    const detail = schema.detail;
+    const hasDetail = !!detail;
+    const perm = m.permissionPrefix;
+    // Find ref fields in master
+    const refFields = master.fields.filter(f => f.refConfig && (f.inputType === 'userRef' || f.inputType === 'personRef'));
+    // Collect all form sections
+    const sections = master.formSections;
+    // Fields with defaultValue
+    const allFormFields = master.fields;
+    // Detail editable fields with dict
+    const detailEditableSelectFields = hasDetail
+        ? detail.fields.filter(f => f.editableInTable && f.editInputType === 'select' && f.dictCode)
+        : [];
+    // Required master fields (for validation rules)
+    const requiredMasterFields = master.fields.filter(f => f.required && f.showInForm && f.inputType !== 'hidden');
+    // Required detail fields (for validation rules)
+    const requiredDetailFields = hasDetail
+        ? detail.fields.filter(f => f.required && (f.showInTable || f.editableInTable) && f.inputType !== 'hidden')
+        : [];
+    // Build collapse items
+    const collapseItems = [];
+    const collapseIndices = [];
+    sections.forEach(section => {
+        collapseIndices.push(section.collapseIndex);
+        if (section.name === 'detail' && hasDetail) {
+            // Detail section - generate table
+            const detailRowKey = detail.detailRowKey;
+            collapseItems.push(generateDetailSection(schema, section));
+        }
+        else {
+            // Regular form section
+            const rows = getFormFieldsBySection(master.fields, section.name);
+            let sectionContent = '';
+            rows.forEach((fields, rowNum) => {
+                const fieldTemplates = fields.map(f => generateFieldTemplate(f, 'processDefKey', 'master')).join('\n');
+                sectionContent += `                <!-- 行内：第${rowNum}行 -->
+                <el-row>
+${fieldTemplates}
+                </el-row>\n`;
+            });
+            // Determine the title expression
+            let titleExpr;
+            if (section.name === 'basic') {
+                titleExpr = `t(\`column.\${processDefKey}.master.${master.collapseTitle}\`)`;
+            }
+            else if (section.name === 'createInfo') {
+                titleExpr = `t(\`column.\${processDefKey}.master.${master.createInfoTitle}\`)`;
+            }
+            else {
+                titleExpr = `t(\`column.\${processDefKey}.master.${section.title}\`)`;
+            }
+            collapseItems.push(`          <!-- 内容容器：${section.title} -->
+          <div class="basic">
+            <basic-container>
+              <el-collapse-item :title="${titleExpr}" name="${section.collapseIndex}">
+${sectionContent}              </el-collapse-item>
+            </basic-container>
+          </div>`);
+        }
+    });
+    // Build ref dialog components
+    const refDialogs = refFields.map(f => {
+        const ref = f.refConfig;
+        const componentTag = ref.refComponent;
+        const refName = getRefComponentVarName(f);
+        const rootIdVar = `${refName}RootId`;
+        const titleExpr = `t(\`column.\${processDefKey}.master.${ref.refTitle}\`)`;
+        const containParent = ref.containParentFlag ? `\n      containParentFlag="${ref.containParentFlag}"` : '';
+        return `    <!-- ${f.label} 引用选择弹窗 -->
+    <${componentTag}
+      ref="${capitalizeFirst(refName)}"
+      :title="${titleExpr}"
+      :rootId="${rootIdVar}"${containParent}
+      @okHandle="${refName}OkHandle"
+    ></${componentTag}>`;
+    }).join('\n');
+    // Detail ref dialog
+    const detailRefDialog = hasDetail && detail.detailRefConfig ? (() => {
+        const drc = detail.detailRefConfig;
+        const componentTag = drc.component;
+        // import path is just the component name
+        return `
+    <!-- 选择${detail.detailTitle}弹窗 -->
+    <${componentTag} ref="registeRef" @okHandle="detailRegisteOkHandle"></${componentTag}>`;
+    })() : '';
+    // Build dataForm initialization
+    const dataFormFields = allFormFields.map(f => {
+        return `  ${f.fieldName}: ${f.defaultValue || 'null'}, //${f.label}`;
+    }).join('\n');
+    // Build master validation rules
+    const masterRulesEntries = requiredMasterFields.map(f => {
+        return `  ${f.fieldName}: [
+    {
+      required: true,
+      message: t(\`column.\${processDefKey}.master.${f.fieldName}\`) + t('message.not_empty'),
+      trigger: ['blur', 'change']
+    }
+  ]`;
+    }).join(',\n');
+    // Build detail validation rules
+    const detailRulesEntries = requiredDetailFields.map(f => {
+        const ruleProp = f.editRuleProp || f.fieldName;
+        const labelEntity = 'detail';
+        return `  ${ruleProp}: [
+    {
+      required: true,
+      message: t(\`column.\${processDefKey}.${labelEntity}.${f.fieldName}\`) + t('message.not_empty'),
+      trigger: ['blur', 'change']
+    }
+  ]`;
+    }).join(',\n');
+    // Build ref component click handlers and ok handlers
+    const refHandlers = refFields.map(f => {
+        const ref = f.refConfig;
+        const refVarName = getRefComponentVarName(f);
+        const capitalRefName = capitalizeFirst(refVarName);
+        // Click handler
+        const clickFn = `const ${f.fieldName}MasterSelect${capitalizeRef(ref.refComponent)}Click = () => {
+  ${capitalRefName}.value.data.visible = true
+  ${capitalRefName}.value.getTreeInclude()
+}`;
+        // Ok handler - map extraMappings
+        const mappings = ref.extraMappings.map(em => {
+            return `  dataForm.${em.target} = data.${em.source}`;
+        }).join('\n');
+        const okFn = `const ${refVarName}OkHandle = (data) => {
+${mappings}
+}`;
+        return `${clickFn}\n\n${okFn}`;
+    }).join('\n\n');
+    // Ref component declarations
+    const refComponentDecls = refFields.map(f => {
+        const refVarName = getRefComponentVarName(f);
+        const capitalRefName = capitalizeFirst(refVarName);
+        return `const ${capitalRefName} = ref()
+const ${refVarName}RootId = getCurrPsmInfo() ? getCurrPsmInfo().ognId : '0'`;
+    }).join('\n');
+    // Detail select options for editable fields
+    const detailSelectImports = detailEditableSelectFields.map(f => f.dictCode).filter((v, i, a) => a.indexOf(v) === i);
+    const detailSelectImportLine = detailSelectImports.length > 0
+        ? `import { ${detailSelectImports.join(', ')} } from '/@/enums/dict'`
+        : '';
+    const detailSelectOptionInits = detailEditableSelectFields.map(f => {
+        return `let ${f.fieldName}Options: any = reactive([])`;
+    }).join('\n');
+    // Collapse item names
+    const collapseNames = collapseIndices.map(i => `'${i}'`).join(', ');
+    // Print button
+    const printBtn = m.hasPrint ? `
+          <!-- 打印按钮 -->
+           <pdf-upload
+            :current-row="dataForm"
+            :fileName="\`\${getStore({ name: 'currentMenu' })}—\${dataForm ? dataForm.${m.printFileNameField || 'id'} : ' '}\`"
+          ></pdf-upload>` : '';
+    // getStore import
+    const getStoreImport = m.hasPrint ? `\nimport { getStore } from '/@/utils/store'` : '';
+    // Detail section handlers
+    const detailHandlers = hasDetail ? generateDetailHandlers(schema) : '';
+    // Detail async component import
+    const detailAsyncImport = hasDetail && detail.detailRefConfig
+        ? `const selectRegiste = defineAsyncComponent(() => import('${detail.detailRefConfig.componentPath}'))`
+        : '';
+    // Detail useTypeOptions init in show()
+    const detailOptionsInitInShow = detailEditableSelectFields.map(f => {
+        return `  ${f.fieldName}Options = ${f.dictCode}(operateType != 'view' ? '1' : '')`;
+    }).join('\n');
+    // Detail imports
+    const detailImportLine = hasDetail
+        ? `import { dataDetailEntity } from './options'
+import { useDynamicsShowColumn } from '../../../hooks/table'`
+        : '';
+    // Detail dynamic columns
+    const detailDynColumns = hasDetail
+        ? `// 使用表格列动态显示
+useDynamicsShowColumn(detailColumns, dataDetailEntity)`
+        : '';
+    // Workflow related
+    const workflowProcessComp = m.hasWorkflow ? `
+          <!-- 流程组件，仅在流程类状态时显示 -->
+          <process
+            v-if="isProcessState"
+            :operateType="showOperateType"
+            :beforeFlow="beforeFlow"
+            :currentRow="dataForm"
+            @workflowPopClose="workflowPopClose"
+            @afterFlowHandle="afterFlowHandle"
+          />` : '';
+    const workflowSubmitBtn = m.hasWorkflow ? `
+          <!-- 提交按钮，仅在非查看模式且非流程类状态时显示 -->
+          <el-button v-if="isSubmitShow" icon="Select" type="primary" @click="submitHandle(true)">
+            {{ t('common.submit') }}
+          </el-button>` : '';
+    const workflowImports = m.hasWorkflow
+        ? `import { getCurrPsmInfo, getMainPosPsmInfo, getMenuObjByMenuPath, getProcessFunction, getIsProcessByBusinessId } from '/@/util/util'`
+        : `import { getCurrPsmInfo, getMenuObjByMenuPath } from '/@/util/util'`;
+    const workflowRefs = m.hasWorkflow ? `
+const isProcessFunction = ref(false)` : '';
+    const workflowComputed = m.hasWorkflow ? `
+const isSubmitShow = computed(() => {
+  return !isProcessState.value && showOperateType.value !== 'view'
+})
+
+const isProcessState = computed(() => {
+  if (!dataForm) return
+  if (dataForm.billStateId == '0') return isProcessFunction.value
+  if (dataForm.billStateId != '4') return true
+  return dataForm.isProcessData
+})` : '';
+    const workflowBeforeFlow = m.hasWorkflow ? `
+const beforeFlow = async () => {
+  const isNext = await checkData(false, 'process')
+  if (isNext) {
+    if (oldValue.value === JSON.stringify(dataForm)) {
+      return { cancel: false, data: dataForm }
+    }
+    return postData({}, false).then((d) => {
+      return { cancel: false, data: d }
+    })
+  }
+  return { cancel: true }
+}
+
+const refreshDataForm = () => {
+  getObj(dataForm.id).then((res) => {
+    Object.assign(dataForm, res.data)
+    oldValue.value = showOperateType.value === 'view' ? null : JSON.stringify(dataForm)
+  })
+}
+
+const workflowPopClose = () => {
+  refreshDataForm()
+  emit('refresh')
+}
+
+const afterFlowHandle = () => {
+  refreshDataForm()
+  gobackClick()
+  emit('refresh')
+}` : '';
+    const workflowOnMounted = m.hasWorkflow ? `
+onMounted(() => {
+  getProcessFunction(route.path).then((res) => {
+    isProcessFunction.value = res === '0'
+  })
+})` : '';
+    const workflowSubmitHandle = m.hasWorkflow ? `
+const submitHandle = async (isBtn, isList?) => {
+  if (!(await checkData(isList, 'submit'))) return
+  useMessageBox()
+    .confirm(t('message.form_submit'))
+    .then(() => {
+      Object.assign(dataForm, { tempProp: moment().format() })
+      postData({ billStateId: '4', billState: '已完成' }, true)
+    })
+}` : '';
+    const workflowFormDisabled = m.hasWorkflow ? `
+const FormDisabled = computed(() => {
+  return (
+    showOperateType.value === 'view' ||
+    (!route.query.nodeKey && dataForm.billStateId !== '0') ||
+    (route.query.nodeKey && route.query.nodeKey !== startNodeKey.value) ||
+    (route.query.nodeKey && !route.query.psmId) ||
+    (route.query.mode && route.query.mode == 'view')
+  )
+})` : `
+const FormDisabled = computed(() => {
+  return showOperateType.value === 'view'
+})`;
+    const workflowStartNode = m.hasWorkflow ? `
+const startNodeKey = ref('userTask1')` : '';
+    const workflowIsProcessDataField = m.hasWorkflow ? `  isProcessData: '' // 当前数据是否流转类` : '';
+    const workflowShowExtra = m.hasWorkflow ? `
+        if (dataForm.billStateId == '4' && isProcessFunction == undefined)
+          dataForm.isProcessData = await getIsProcessByBusinessId(id)
+        else dataForm.isProcessData = isProcessFunction` : '';
+    // Detail validate in checkData
+    const detailValidateConfig = hasDetail ? `,
+          detailsName: [
+            {
+              listName: '${detail.detailListName}',
+              rowNameType: '${detail.detailValidateConfig.rowNameType}',
+              rowName: '${detail.detailValidateConfig.rowName}'
+            }
+          ]` : '';
+    const detailCheckList = hasDetail ? `
+    isNext = isNext && (await detailCheckOneList())` : '';
+    const detailCheckOneListFn = hasDetail ? `
+const detailCheckOneList = () => {
+  if (dataForm.${detail.detailListName}.length < 1) {
+    useMessage().error(t(\`column.\${processDefKey}.detail.checkOneList\`))
+    return false
+  }
+  return true
+}` : '';
+    const detailListField = hasDetail ? `  ${detail.detailListName}: [] as any,` : '';
+    // Detail refs
+    const detailRefDecls = hasDetail ? `
+const detailCurrentRow = reactive({})
+const detailSelectRows = ref<any>([])
+const detailTable = ref()
+const detailColumns = ref([] as any[])
+const registeRef = ref()` : '';
+    return `<template>
+  <div class="layout-padding-auto layout-padding-view bg-info" v-show="visible" v-loading="loading" :key="componentKey">
+    <!-- 按钮区域 -->
+    <div class="menu_boxs">
+      <div class="avue-crud__menu">
+        <div class="avue-crud__left">
+          <!-- 保存按钮，仅在非查看模式下显示 -->
+          <el-button
+            v-if="showOperateType !== 'view'"
+            :disabled="!saveBtn"
+            icon="DocumentChecked"
+            type="primary"
+            @click="saveClick(true)"
+          >
+            {{ t('common.saveBtn') }}
+          </el-button>
+          <!-- 返回按钮 -->
+          <el-button icon="Close" @click="gobackClick" v-if="!route.query.taskId">
+            {{ t('common.gobackBtn') }}
+          </el-button>${workflowSubmitBtn}${workflowProcessComp}
+          <!-- 一键展开收起按钮 -->
+          <el-button type="primary" @click="handleToggleCollapseExpand()">
+            {{ t('common.retract_expand') }}
+          </el-button>
+          <!-- 分享按钮 -->
+          <el-button type="primary" circle icon="Share" style="position: absolute; right: 20px" @click="gobackClick">
+          </el-button>${printBtn}
+        </div>
+      </div>
+    </div>
+
+    <!-- 表单区域 -->
+    <el-row class="rounded-1 form_h">
+      <el-collapse v-model="activeNames">
+        <el-form
+          ref="dataFormRef"
+          :model="dataForm"
+          :rules="dataMasterRules"
+          formDialogRef
+          :label-width="cfg.labelWidth"
+          :disabled="FormDisabled"
+        >
+${collapseItems.join('\n')}
+        </el-form>
+      </el-collapse>
+    </el-row>
+${refDialogs}${detailRefDialog}
+  </div>
+</template>
+<script setup lang="ts" name="${m.componentName}Dialog">
+import { useMessage, useMessageBox } from '/@/hooks/message'
+import { getObj, addObj, putObj } from '/@/${m.apiFilePath}'
+import { useI18n } from 'vue-i18n'
+import { formValidate } from '/@/utils/verify'
+import { unique } from '/@/utils/common'
+import moment from 'moment'
+${detailImportLine}
+${workflowImports}
+${detailSelectImportLine}${getStoreImport}
+${detailAsyncImport}
+
+const componentKey = ref(0)
+const emit = defineEmits(['goback', 'refresh'])
+const { t } = useI18n()
+const dataFormRef = ref()
+const saveBtn = ref(false)
+
+const oldValue = ref<any>()
+const visible = ref(false)
+const loading = ref(false)
+const showOperateType = ref('view')
+const route = useRoute()
+const processDefKey = getMenuObjByMenuPath(route.path).modelId${workflowRefs}
+const activeFlag = ref(true)
+const activeNames = ref([${collapseNames}])
+const collapseItemName: Array<string> = [${collapseNames}]${detailRefDecls}
+${refComponentDecls}
+${detailSelectOptionInits}
+const cfg = reactive({
+  gutter: 16,
+  span: 12,
+  labelWidth: '${m.labelWidth}'
+})${workflowStartNode}
+// 初始化数据表单
+const dataForm = reactive({
+${dataFormFields}
+${detailListField}
+${workflowIsProcessDataField}
+})
+const initForm = Object.assign({}, dataForm)
+// 定义主表数据验证规则
+const dataMasterRules = ref({
+${masterRulesEntries}
+})
+${hasDetail ? `
+// 定义从表数据验证规则
+const dataDetailRules = ref({
+${detailRulesEntries}
+})` : ''}
+
+${detailDynColumns}
+
+${refHandlers}
+${detailHandlers}
+${workflowFormDisabled}
+
+const show = async (operateType: string, id?: string, data?: any, isProcessFunction?: any) => {
+  showOperateType.value = operateType
+${detailOptionsInitInShow}
+  visible.value = true
+  await nextTick(() => {
+    dataFormRef.value?.resetFields()
+    componentKey.value += 1
+  })
+  Object.assign(dataForm, initForm)
+  loading.value = true
+  try {
+    if (id) {
+      getObj(id).then(async (res) => {
+        Object.assign(dataForm, res.data)${workflowShowExtra}
+        oldValue.value = operateType === 'view' ? null : JSON.stringify(dataForm)${hasDetail ? `
+        if (dataForm.${detail.detailListName}.length > 0) {
+          nextTick(() => {
+            detailTable.value.toggleRowSelection(dataForm.${detail.detailListName}[0], true)
+          })
+        }` : ''}
+      })
+    } else {
+      dataForm.version = '0'
+    }
+  } finally {
+    loading.value = false
+  }
+}
+${workflowComputed}
+
+const gobackClick = () => {
+  visible.value = false
+  emit('goback', 'cancel')
+}
+
+const handleToggleCollapseExpand = () => {
+  if (activeFlag.value) {
+    if (activeNames.value.length > 0) {
+      activeNames.value = []
+      activeFlag.value = false
+    } else {
+      activeNames.value = collapseItemName
+    }
+  } else {
+    if (activeNames.value.length === 0 || activeNames.value.length !== collapseItemName.length) {
+      activeNames.value = collapseItemName
+      activeFlag.value = true
+    } else {
+      activeNames.value = []
+    }
+  }
+}
+${workflowBeforeFlow}
+${detailCheckOneListFn}
+
+const checkData = async (isList = false, btnType = 'save') => {
+  let isNext = true
+  if (btnType === 'submit' || btnType === 'process') {
+    isNext = await formValidate(
+      [
+        {
+          dataFormName: dataForm,
+          name: dataFormRef${detailValidateConfig}
+        }
+      ],
+      isList
+    )${detailCheckList}
+  }
+  return isNext
+}
+
+const postData = async (extVals = {}, isSave = false) => {
+  loading.value = true
+  try {
+    let res = dataForm.id
+      ? await putObj(Object.assign({}, dataForm, extVals))
+      : await addObj(Object.assign({}, dataForm, extVals))
+    useMessage().success(dataForm.id ? t('common.editSuccessText') : t('common.addSuccessText'))
+    Object.assign(dataForm, res.data)
+    const query = route.query
+    if (isSave && !query.taskId) {
+      visible.value = false
+      emit('goback')
+      emit('refresh', 'save', dataForm)
+    }
+    return dataForm
+  } finally {
+    loading.value = false
+  }
+}
+
+const saveClick = async (isSave = true, extVals = {}) => {
+  let isNext = await checkData(false, 'save')
+  if (!isNext) return false
+  if (oldValue.value === JSON.stringify(dataForm)) {
+    useMessage().info(t('message.no_changed_cannot_save'))
+    return
+  }
+  postData(extVals, isSave)
+}
+${workflowSubmitHandle}
+${workflowOnMounted}
+
+watch(
+  () => dataForm,
+  () => {
+    saveBtn.value = false
+    if (JSON.stringify(initForm) != JSON.stringify(dataForm) && oldValue.value != JSON.stringify(dataForm)) {
+      saveBtn.value = true
+    }
+  },
+  { deep: true, immediate: true }
+)
+
+defineExpose({
+  show,
+  oldValue,
+  showOperateType,
+  dataFormRef,
+  dataForm,${m.hasWorkflow ? `
+  submitHandle,
+  beforeFlow,` : ''}
+  checkData
+})
+</script>
+`;
+}
+function getRefComponentVarName(field) {
+    const ref = field.refConfig;
+    const componentParts = ref.refComponent.split('-');
+    const capitalizedParts = componentParts.map(s => s.charAt(0).toUpperCase() + s.slice(1)).join('');
+    return `${field.fieldName}Master${capitalizedParts}`;
+}
+function capitalizeFirst(s) {
+    return s.charAt(0).toUpperCase() + s.slice(1);
+}
+function generateDetailSection(schema, section) {
+    const detail = schema.detail;
+    const detailRowKey = detail.detailRowKey;
+    const columns = generateDetailTableColumns(schema);
+    return `          <!-- 内容容器：${detail.detailTitle} -->
+          <div class="basic">
+            <basic-container>
+              <el-collapse-item :title="t(\`column.\${processDefKey}.master.${detail.detailCollapseTitle}\`)" name="${section.collapseIndex}">
+                <!-- 按钮区域 -->
+                <div class="btn">
+                  <!-- 新增 -->
+                  <el-button icon="Plus" type="primary" @click="addDetailClick()">
+                    {{ t('common.addBtn') }}
+                  </el-button>
+                  <!-- 删除 -->
+                  <el-button
+                    type="primary"
+                    icon="el-icon-delete"
+                    :disabled="isDelDisabled"
+                    @click="deleteDetailClick()"
+                  >
+                    {{ t('common.delBtn') }}
+                  </el-button>
+                </div>
+                <!-- 表格区域 -->
+                <el-table
+                  :data="dataForm.${detail.detailListName}"
+                  :row-class-name="
+                    ({ row }) =>
+                      detailSelectRows.find((item) => item.${detailRowKey} === row.${detailRowKey})
+                        ? 'selectRowColor'
+                        : ''
+                  "
+                  ref="detailTable"
+                  @selection-change="detailSelectChangeHandle"
+                  @current-change="detailCurrentRowChangeHandle"
+                >
+                  <el-table-column type="selection" width="40" align="center"> </el-table-column>
+                  <el-table-column type="index" align="center" width="70" label="序号"> </el-table-column>
+${columns}
+                </el-table>
+              </el-collapse-item>
+            </basic-container>
+          </div>`;
+}
+function generateDetailHandlers(schema) {
+    const detail = schema.detail;
+    const drc = detail.detailRefConfig;
+    const detailRowKey = detail.detailRowKey;
+    const listName = detail.detailListName;
+    // Build add detail click handler
+    const addMappings = [
+        `      id: x.${drc.idMapping.target},`,
+        `      name: x.${drc.nameMapping.target},`,
+    ];
+    if (drc.codeMapping) {
+        addMappings.push(`      code: x.${drc.codeMapping.target},`);
+    }
+    drc.extraMappings.forEach(em => {
+        addMappings.push(`      ${em.source}: x.${em.target},`);
+    });
+    // Build ok handle mappings
+    const okMappings = [
+        `      ${drc.idMapping.target}: x.${drc.idMapping.source},`,
+        `      ${drc.nameMapping.target}: x.${drc.nameMapping.source},`,
+    ];
+    if (drc.codeMapping) {
+        okMappings.push(`      code: x.${drc.codeMapping.source},`);
+    }
+    drc.extraMappings.forEach(em => {
+        okMappings.push(`      ${em.target}: x.${em.source},`);
+    });
+    if (drc.codeMapping) {
+        okMappings.push(`      ${drc.codeMapping.target}: x.${drc.codeMapping.source}`);
+    }
+    return `
+const addDetailClick = () => {
+  let arr = dataForm.${listName}.map((x) => {
+    return {
+${addMappings.join('\n')}
+    }
+  })
+  registeRef.value.openDialog(arr)
+}
+const detailRegisteOkHandle = (data) => {
+  dataForm.${listName} = data.map((x) => {
+    return {
+${okMappings.join('\n')}
+    }
+  })
+  nextTick(() => {
+    if (dataForm.${listName}.length > 0) {
+      detailTable.value.toggleRowSelection(dataForm.${listName}[0], true)
+    }
+  })
+}
+const isDelDisabled = computed(() => {
+  return detailSelectRows.value.length === 0 || dataForm.${listName}.length === 0
+})
+
+const deleteDetailClick = () => {
+  dataForm.${listName} = dataForm.${listName}.filter(
+    (item: any) => !detailSelectRows.value.some((ele: any) => ele.${detailRowKey} === item.${detailRowKey})
+  )
+  if (dataForm.${listName}.length > 0) {
+    nextTick(() => {
+      detailTable.value.toggleRowSelection(dataForm.${listName}[0], true)
+    })
+  } else {
+    Object.assign(detailCurrentRow, {})
+  }
+}
+
+const detailSelectChangeHandle = (rows: any) => {
+  Object.assign(detailCurrentRow, rows[0])
+  detailSelectRows.value = rows
+}
+
+const detailCurrentRowChangeHandle = (row) => {
+  detailSelectRows.value = []
+  if (row) {
+    Object.assign(detailCurrentRow, row)
+    detailTable.value.clearSelection()
+    detailSelectRows.value.push(row)
+    detailTable.value.toggleRowSelection(row, true)
+  }
+}
+
+const detailFormat = (row, column, cellValue, index) => {
+  return cellValue
+}`;
+}
+//# sourceMappingURL=form-vue.tpl.js.map