@epxing/business 0.0.0-stage → 5.3.0-beta.1

package/src/components/GenTestData.vue

@@ -0,0 +1,787 @@
+<template>
+  <el-dialog
+    class="epx-gen-test-data"
+    :title="stage === 'success' ? '测试数据生成成功' : '生成测试数据'"
+    v-model="visible"
+    :close-on-click-modal="false"
+    :append-to-body="true"
+    width="680px"
+    @closed="handleClosed"
+  >
+    <!-- 配置表单 -->
+    <div v-show="stage === 'form'" class="gen-test-data__body">
+      <!-- 基础配置 -->
+      <div class="gen-test-data__section">
+        <div class="gen-test-data__section-title">
+          <i class="el-icon-setting"></i>基础配置
+        </div>
+        <div class="gen-test-data__objbar">
+          <i class="el-icon-coin"></i>
+          <span>当前对象：<b>{{ metaName || '未命名对象' }}</b></span>
+          <el-tag v-if="metaCode" size="small" type="info" effect="plain">{{ metaCode }}</el-tag>
+        </div>
+        <div class="gen-test-data__label">
+          <span class="gen-test-data__req">*</span>生成条数（主数据）
+        </div>
+        <div class="gen-test-data__count">
+          <span
+            v-for="preset in countPresets"
+            :key="preset.value"
+            class="gen-test-data__chip"
+            :class="{ 'is-active': mainCount === preset.value }"
+            @click="mainCount = preset.value"
+          >{{ preset.label }}</span>
+          <el-input-number
+            v-model="mainCount"
+            :min="1"
+            :max="100000"
+            :controls="false"
+            size="small"
+            class="gen-test-data__count-input"
+          />
+          <span class="gen-test-data__unit">条</span>
+        </div>
+      </div>
+
+      <!-- AI 生成规则 -->
+      <div class="gen-test-data__section">
+        <div class="gen-test-data__section-title">
+          <i class="el-icon-magic-stick is-primary"></i>AI 生成规则
+        </div>
+        <div class="gen-test-data__label">业务场景描述（提示词，选填）</div>
+        <el-input
+          v-model="prompt"
+          type="textarea"
+          :rows="3"
+          resize="vertical"
+          placeholder="用自然语言描述数据的业务背景，AI 将据此生成更贴近真实的内容。例如：三甲医院 2025 年各临床科室的月度智能分析报告，含就诊量、收入、满意度等指标。"
+        />
+        <div class="gen-test-data__tip">留空时，AI 将依据对象的字段名称、类型与备注自动推断语义并生成数据。</div>
+      </div>
+
+      <!-- 关联子集 -->
+      <div v-if="subsetsLoading || subsets.length" class="gen-test-data__section">
+        <div class="gen-test-data__section-title">
+          <i class="el-icon-share"></i>生成关联子集
+        </div>
+        <div class="gen-test-data__tip gen-test-data__tip--top">
+          勾选需要联动生成的子表 / 关联对象，并设置每条主数据对应的子数据条数。
+        </div>
+        <div v-if="subsetsLoading" class="gen-test-data__loading-sub">
+          <i class="el-icon-loading"></i> 正在加载关联子集…
+        </div>
+        <label
+          v-for="sub in subsets"
+          :key="sub.linkFlag"
+          class="gen-test-data__sub"
+          :class="{ 'is-checked': sub.checked }"
+        >
+          <el-checkbox v-model="sub.checked"></el-checkbox>
+          <span class="gen-test-data__sub-name">{{ sub.name }}</span>
+          <el-tag v-if="sub.metaCode" size="small" type="info" effect="plain">{{ sub.metaCode }}</el-tag>
+          <span class="gen-test-data__sub-per">
+            每条主数据
+            <el-input-number
+              v-model="sub.per"
+              :min="0"
+              :max="1000"
+              :controls="false"
+              size="small"
+              class="gen-test-data__sub-per-input"
+            />
+            条
+          </span>
+        </label>
+      </div>
+
+      <!-- 发起流程 -->
+      <div class="gen-test-data__section">
+        <div class="gen-test-data__section-title">
+          <i class="el-icon-connection"></i>发起流程
+        </div>
+        <div class="gen-test-data__label">生成后是否用测试数据发起流程</div>
+        <el-radio-group v-model="publishFlow">
+          <el-radio label="0">否</el-radio>
+          <el-radio label="1">是</el-radio>
+        </el-radio-group>
+        <template v-if="publishFlow === '1'">
+          <div class="gen-test-data__label gen-test-data__label--gap">
+            <span class="gen-test-data__req">*</span>选择要发起的流程
+          </div>
+          <el-select
+            v-model="processCode"
+            :loading="processLoading"
+            filterable
+            clearable
+            placeholder="请选择要发起的流程"
+            class="gen-test-data__select"
+          >
+            <el-option v-for="p in processList" :key="p.value" :label="p.label" :value="p.value" />
+          </el-select>
+          <div class="gen-test-data__tip">将为每条生成的主数据记录各发起一次所选流程，并以该条记录作为流程的业务数据。</div>
+          <div class="gen-test-data__label gen-test-data__label--gap">
+            <span class="gen-test-data__req">*</span>发起时走的连线
+          </div>
+          <el-select
+            v-model="destActivityId"
+            :loading="flowLoading"
+            :disabled="!processCode"
+            clearable
+            placeholder="请选择发起时走的连线"
+            class="gen-test-data__select"
+          >
+            <el-option v-for="f in flowList" :key="f.id" :label="f.name" :value="f.id" />
+          </el-select>
+          <div class="gen-test-data__tip">流程开始节点存在多条出口连线时，需指定本次发起走哪条分支。</div>
+        </template>
+      </div>
+    </div>
+
+    <!-- 生成中 -->
+    <div v-show="stage === 'loading'" class="gen-test-data__state">
+      <div class="gen-test-data__spinner"></div>
+      <div class="gen-test-data__state-title">正在生成测试数据…</div>
+      <div class="gen-test-data__state-desc">预计生成约 <b>{{ estTotal.toLocaleString() }}</b> 条记录，请勿关闭弹窗</div>
+      <el-progress :percentage="progressPercent" :show-text="false" class="gen-test-data__progress" />
+      <div class="gen-test-data__steps">
+        <div
+          v-for="(step, index) in steps"
+          :key="index"
+          class="gen-test-data__step"
+          :class="{ 'is-done': index < currentStep, 'is-active': index === currentStep }"
+        >
+          <i v-if="index < currentStep" class="el-icon-circle-check"></i>
+          <i v-else-if="index === currentStep" class="el-icon-loading"></i>
+          <i v-else class="el-icon-remove-outline"></i>
+          {{ step }}
+        </div>
+      </div>
+    </div>
+
+    <!-- 成功 -->
+    <div v-show="stage === 'success'" class="gen-test-data__state">
+      <div class="gen-test-data__state-icon"><i class="el-icon-circle-check"></i></div>
+      <div class="gen-test-data__state-title">测试数据生成成功</div>
+      <div class="gen-test-data__state-desc">已为「{{ metaName }}」生成下列测试数据</div>
+      <div class="gen-test-data__summary">
+        <div v-for="(row, index) in summaryRows" :key="index" class="gen-test-data__summary-row">
+          <span>{{ row.label }}</span>
+          <span>{{ row.value }}</span>
+        </div>
+        <div class="gen-test-data__summary-row is-total">
+          <span>合计</span>
+          <span>{{ estTotal.toLocaleString() }} 条</span>
+        </div>
+      </div>
+    </div>
+
+    <!-- 底部按钮 -->
+    <template #footer>
+      <span class="gen-test-data__footer" :class="{ 'is-centered': stage !== 'form' }">
+        <template v-if="stage === 'form'">
+          <span class="gen-test-data__foot-hint">预计生成 <b>{{ estTotal.toLocaleString() }}</b> 条记录</span>
+          <el-button @click="visible = false">取消</el-button>
+          <el-button type="primary" icon="el-icon-video-play" :loading="generating" @click="start">开始生成</el-button>
+        </template>
+        <template v-else-if="stage === 'loading'">
+          <el-button disabled>生成中…</el-button>
+        </template>
+        <template v-else>
+          <el-button @click="reset">再次生成</el-button>
+          <el-button type="primary" @click="visible = false">完成</el-button>
+        </template>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: 'epx-gen-test-data',
+  props: {
+    // 选中对象记录 ID（FM_ENTITY 的 ID）
+    metaId: {
+      type: String,
+      default: ''
+    },
+    // 对象编号（如 FM_REPORT_CONFIG）
+    metaCode: {
+      type: String,
+      default: ''
+    },
+    // 对象名称
+    metaName: {
+      type: String,
+      default: ''
+    },
+    // 列表组件的 $metaId（对象元数据 FM_ENTITY），作为逻辑编排请求的路由对象
+    hostMetaId: {
+      type: String,
+      default: ''
+    },
+    // 按钮配置里透传过来的额外参数（如 querySystem），会一并发给逻辑编排
+    extraParams: {
+      type: Object,
+      default () {
+        return {}
+      }
+    }
+  },
+  data () {
+    return {
+      visible: false,
+      stage: 'form', // form | loading | success
+      mainCount: 20,
+      countPresets: [
+        { label: '5', value: 5 },
+        { label: '10', value: 10 },
+        { label: '20', value: 20 },
+        { label: '50', value: 50 }
+      ],
+      prompt: '',
+      subsets: [],
+      subsetsLoading: false,
+      publishFlow: '0', // 生成后是否发起流程：'1' 是 / '0' 否
+      processList: [],
+      processLoading: false,
+      processCode: '',
+      flowList: [],
+      flowLoading: false,
+      destActivityId: '',
+      generating: false,
+      steps: ['解析对象结构与字段语义', 'AI 生成主数据记录', 'AI 生成关联子集数据', '写入数据'],
+      currentStep: 0,
+      stepTimer: null
+    }
+  },
+  computed: {
+    // 勾选的子集
+    checkedSubsets () {
+      return this.subsets.filter(s => s.checked)
+    },
+    // 预计生成总条数
+    estTotal () {
+      const main = Math.max(0, Number(this.mainCount) || 0)
+      let total = main
+      this.checkedSubsets.forEach(s => {
+        total += main * Math.max(0, Number(s.per) || 0)
+      })
+      return total
+    },
+    // 成功摘要行
+    summaryRows () {
+      const main = Math.max(0, Number(this.mainCount) || 0)
+      const rows = [{ label: `主数据（${this.metaName || '当前对象'}）`, value: main.toLocaleString() + ' 条' }]
+      this.checkedSubsets.forEach(s => {
+        rows.push({ label: s.name, value: (main * Math.max(0, Number(s.per) || 0)).toLocaleString() + ' 条' })
+      })
+      return rows
+    },
+    progressPercent () {
+      return Math.round(((this.currentStep + 1) / this.steps.length) * 100)
+    }
+  },
+  watch: {
+    // 切换流程后重新加载开始节点的出口连线
+    processCode (v) {
+      this.destActivityId = ''
+      this.flowList = []
+      if (v) this.loadFlows(v)
+    }
+  },
+  methods: {
+    // 打开弹窗（由外部调用）
+    open () {
+      this.reset()
+      this.visible = true
+      this.publishFlow = '0'
+      this.processCode = ''
+      this.destActivityId = ''
+      this.flowList = []
+      this.loadSubsets()
+      this.loadProcesses()
+    },
+    // 重置回表单态
+    reset () {
+      this.stopStepTimer()
+      this.stage = 'form'
+      this.currentStep = 0
+      this.generating = false
+    },
+    // 加载对象的一对多关联子集：getEntityMetaView + relationSort=1 返回该对象的一对多关联对象。
+    // 返回数组第一项是对象自身(relationType 为空)，其余是可联动生成的一对多子集。
+    // 拿不到就隐藏子集区，不影响主流程。
+    loadSubsets () {
+      this.subsets = []
+      const metaKey = this.metaCode || this.metaId
+      if (!metaKey) return
+      this.subsetsLoading = true
+      this.$http.$post({
+        action: 'getEntityMetaView',
+        entityId: 'FM_ENTITY_VIEW',
+        metaId: metaKey,
+        relationSort: '1'
+      })
+        .then(data => {
+          const arr = Array.isArray(data) ? data : []
+          // relationType + linkFlag 有值的节点即一对多关联对象；对象自身节点这两项为空，被排除。
+          // linkFlag 是关联标识符（同一对象编号可能对应多个关联，必须用它区分），submeta/SUBNUMBER 用它。
+          this.subsets = arr
+            .filter(n => n && n.relationType && n.linkFlag)
+            .map(n => ({
+              linkFlag: n.linkFlag,
+              metaId: n.id,
+              metaCode: n.code,
+              name: n.text || n.code || '关联对象',
+              checked: false,
+              per: 3
+            }))
+        })
+        .catch(() => {
+          this.subsets = []
+        })
+        .finally(() => {
+          this.subsetsLoading = false
+        })
+    },
+    // 加载当前对象绑定的流程列表（ACT_RE_MODEL，CATEGORY=1 为业务流程），value 取流程编号 KEY
+    loadProcesses () {
+      this.processList = []
+      const entityKey = this.metaId || this.metaCode
+      if (!entityKey) return
+      this.processLoading = true
+      this.$http.list({
+        entityId: 'ACT_RE_MODEL',
+        'scope.ENTITY': entityKey,
+        'scope.CATEGORY': '1'
+      })
+        .then(data => {
+          const arr = (data && data.entitys) || []
+          this.processList = arr.map(item => ({ label: item.NAME || item.KEY, value: item.KEY }))
+        })
+        .catch(() => {
+          this.processList = []
+        })
+        .finally(() => {
+          this.processLoading = false
+        })
+    },
+    // 加载所选流程开始节点的出口连线，返回 { id, name }；只有一条时自动选中
+    loadFlows (processCode) {
+      this.flowLoading = true
+      this.$http.get({
+        action: 'getProcessStartFlow',
+        entityId: 'ACT_RE_MODEL',
+        processCode,
+        currentMetaId: this.metaId || this.metaCode
+      })
+        .then(data => {
+          this.flowList = Array.isArray(data) ? data : []
+          if (this.flowList.length === 1) {
+            this.destActivityId = this.flowList[0].id
+          }
+        })
+        .catch(() => {
+          this.flowList = []
+        })
+        .finally(() => {
+          this.flowLoading = false
+        })
+    },
+    // 开始生成：调用 sfrescujuykz 逻辑编排
+    start () {
+      if (this.estTotal <= 0) {
+        this.$message.warning('请设置生成条数')
+        return
+      }
+      if (this.publishFlow === '1') {
+        if (!this.processCode) {
+          this.$message.warning('请选择要发起的流程')
+          return
+        }
+        if (!this.destActivityId) {
+          this.$message.warning('请选择发起时走的连线')
+          return
+        }
+      }
+      this.generating = true
+      this.stage = 'loading'
+      this.startStepTimer()
+
+      // ==== 调用 sfrescujuykz 逻辑编排（rule 参数会自动路由到 /rule/v1）====
+      // 下列入参名称按后端逻辑编排的实际入参约定调整即可
+      const payload = {
+        ...this.extraParams, // 按钮配置透传的参数（如 querySystem）
+        rule: 'sfrescujuykz',
+        // 请求路由对象：对齐原按钮 = 列表组件的 $metaId（对象元数据 FM_ENTITY），选中对象通过 mainmeta 传
+        entityId: this.hostMetaId || this.metaCode || this.metaId,
+        // —— sfrescujuykz 逻辑编排入参 ——
+        mainmeta: this.metaCode || this.metaId, // 生成主对象
+        submeta: this.checkedSubsets.map(s => s.linkFlag).join(','), // 生成子集对象（关联标识符，逗号分隔）
+        TSNUMBER: this.mainCount, // 生成条数
+        SUBNUMBER: this.checkedSubsets.map(s => `${s.linkFlag}:${s.per}`).join(','), // 每个子集条数（映射式 关联标识符:条数）
+        CJMS: this.prompt, // 业务场景描述（提示词）
+        ISPUBLISH: this.publishFlow, // 生成后是否发起流程：1 是 / 0 否
+        processCode: this.publishFlow === '1' ? this.processCode : '', // 要发起的流程编号
+        destActivityId: this.publishFlow === '1' ? this.destActivityId : '' // 发起时走的连线 ID
+      }
+
+      this.$http.$post(payload)
+        .then(res => {
+          this.finishSteps()
+          this.stage = 'success'
+          this.$message.success('成功生成 ' + this.estTotal.toLocaleString() + ' 条测试数据')
+          this.$emit('success', res)
+        })
+        .catch(err => {
+          this.stopStepTimer()
+          this.stage = 'form'
+          this.$message.error((err && err.message) || '生成测试数据失败')
+        })
+        .finally(() => {
+          this.generating = false
+        })
+    },
+    // 生成中步骤动画（仅视觉反馈，完成由请求驱动）
+    startStepTimer () {
+      this.currentStep = 0
+      this.stopStepTimer()
+      this.stepTimer = setInterval(() => {
+        if (this.currentStep < this.steps.length - 1) {
+          this.currentStep += 1
+        }
+      }, 700)
+    },
+    finishSteps () {
+      this.stopStepTimer()
+      this.currentStep = this.steps.length
+    },
+    stopStepTimer () {
+      if (this.stepTimer) {
+        clearInterval(this.stepTimer)
+        this.stepTimer = null
+      }
+    },
+    handleClosed () {
+      this.stopStepTimer()
+      this.$emit('closed')
+    }
+  },
+  beforeUnmount () {
+    this.stopStepTimer()
+  }
+}
+</script>
+
+<style lang="scss">
+@include b(gen-test-data) {
+  &__body {
+    max-height: 62vh;
+    overflow: auto;
+  }
+
+  &__section {
+    padding: 16px 0;
+    border-bottom: 1px solid var(--color-border-light, #e4e7ed);
+
+    &:first-child {
+      padding-top: 0;
+    }
+
+    &:last-child {
+      border-bottom: none;
+      padding-bottom: 0;
+    }
+  }
+
+  &__section-title {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-size: var(--font-size-base, 14px);
+    font-weight: 600;
+    color: var(--color-text-title, #222);
+    margin-bottom: 14px;
+
+    i {
+      color: var(--color-text-secondary, #666);
+    }
+
+    i.is-primary {
+      @include font_color_primary;
+    }
+  }
+
+  &__objbar {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    background: var(--color-fill-light, #f5f7fa);
+    border: 1px solid var(--color-border-light, #e4e7ed);
+    border-radius: var(--border-radius, 4px);
+    padding: 10px 14px;
+    margin-bottom: 16px;
+
+    i {
+      color: var(--color-text-secondary, #666);
+    }
+  }
+
+  &__label {
+    font-size: var(--font-size-small, 13px);
+    color: var(--color-text-primary, #444);
+    margin-bottom: 8px;
+
+    &--gap {
+      margin-top: 14px;
+    }
+  }
+
+  &__select {
+    width: 100%;
+  }
+
+  &__req {
+    color: var(--color-danger, #f56c6c);
+    margin-right: 3px;
+  }
+
+  &__count {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 8px;
+  }
+
+  &__chip {
+    height: 32px;
+    padding: 0 14px;
+    display: inline-flex;
+    align-items: center;
+    border: 1px solid var(--color-border-base, #dcdfe6);
+    border-radius: var(--border-radius, 4px);
+    background: #fff;
+    color: var(--color-text-primary, #444);
+    font-size: var(--font-size-small, 13px);
+    cursor: pointer;
+    transition: all 0.15s;
+
+    &:hover {
+      @include font_color_primary;
+      @include border_color_primary;
+    }
+
+    &.is-active {
+      @include font_color_primary;
+      @include border_color_primary;
+      @include bg_color_primary(0.08);
+      font-weight: 600;
+    }
+  }
+
+  &__count-input {
+    width: 110px;
+  }
+
+  &__unit {
+    color: var(--color-text-secondary, #666);
+  }
+
+  &__tip {
+    font-size: var(--font-size-extra-small, 12px);
+    color: var(--color-text-secondary, #666);
+    margin-top: 6px;
+    line-height: 1.6;
+
+    &--top {
+      margin-top: 0;
+      margin-bottom: 12px;
+    }
+  }
+
+  &__loading-sub {
+    padding: 8px 0;
+    color: var(--color-text-secondary, #666);
+    font-size: var(--font-size-small, 13px);
+  }
+
+  &__sub {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    padding: 11px 12px;
+    border: 1px solid var(--color-border-light, #e4e7ed);
+    border-radius: var(--border-radius, 4px);
+    margin-bottom: 8px;
+    background: #fff;
+    cursor: pointer;
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+
+    &.is-checked {
+      @include border_color_primary;
+      @include bg_color_primary(0.06);
+    }
+  }
+
+  &__sub-name {
+    font-size: var(--font-size-base, 14px);
+    color: var(--color-text-title, #222);
+  }
+
+  &__sub-per {
+    margin-left: auto;
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    font-size: var(--font-size-small, 13px);
+    color: var(--color-text-secondary, #666);
+  }
+
+  &__sub-per-input {
+    width: 60px;
+  }
+
+  &__footer {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+
+    &.is-centered {
+      justify-content: center;
+    }
+  }
+
+  &__foot-hint {
+    margin-right: auto;
+    font-size: var(--font-size-small, 13px);
+    color: var(--color-text-secondary, #666);
+
+    b {
+      @include font_color_primary;
+    }
+  }
+
+  // —— 生成中 / 成功 面板 ——
+  &__state {
+    padding: 24px;
+    text-align: center;
+  }
+
+  &__spinner {
+    width: 40px;
+    height: 40px;
+    margin: 0 auto 16px;
+    border: 3px solid var(--color-border-light, #e4e7ed);
+    border-radius: 50%;
+    @include border_color_primary(1, top);
+    animation: gen-test-data-spin 0.9s linear infinite;
+  }
+
+  &__state-icon {
+    width: 64px;
+    height: 64px;
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 16px;
+    font-size: 34px;
+    color: var(--color-success, #67c23a);
+    background: #f0f9eb;
+  }
+
+  &__state-title {
+    font-size: var(--font-size-large, 18px);
+    color: var(--color-text-title, #222);
+    font-weight: 600;
+    margin-bottom: 6px;
+  }
+
+  &__state-desc {
+    font-size: var(--font-size-small, 13px);
+    color: var(--color-text-secondary, #666);
+
+    b {
+      @include font_color_primary;
+    }
+  }
+
+  &__progress {
+    max-width: 380px;
+    margin: 22px auto 12px;
+  }
+
+  &__steps {
+    max-width: 360px;
+    margin: 18px auto 0;
+    text-align: left;
+  }
+
+  &__step {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 6px 0;
+    font-size: var(--font-size-small, 13px);
+    color: var(--color-text-secondary, #666);
+
+    &.is-done {
+      color: var(--color-text-primary, #444);
+
+      i {
+        color: var(--color-success, #67c23a);
+      }
+    }
+
+    &.is-active {
+      @include font_color_primary;
+      font-weight: 600;
+    }
+  }
+
+  &__summary {
+    max-width: 360px;
+    margin: 18px auto 0;
+    border: 1px solid var(--color-border-light, #e4e7ed);
+    border-radius: var(--border-radius, 4px);
+    overflow: hidden;
+  }
+
+  &__summary-row {
+    display: flex;
+    justify-content: space-between;
+    padding: 10px 14px;
+    font-size: var(--font-size-small, 13px);
+
+    & + & {
+      border-top: 1px solid var(--color-border-light, #e4e7ed);
+    }
+
+    span:first-child {
+      color: var(--color-text-secondary, #666);
+    }
+
+    span:last-child {
+      color: var(--color-text-title, #222);
+      font-weight: 600;
+    }
+
+    &.is-total {
+      background: var(--color-fill-light, #f5f7fa);
+
+      span:last-child {
+        @include font_color_primary;
+      }
+    }
+  }
+}
+
+@keyframes gen-test-data-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+</style>