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

package/src/views/i18n/I18nAiTaskHistoryDialog.vue

@@ -0,0 +1,173 @@
+<template>
+  <el-dialog
+    :model-value="visible"
+    :title="dialogTitle"
+    width="980px"
+    append-to-body
+    :before-close="handleClose"
+    @open="handleOpen"
+  >
+    <el-table
+      v-loading="loading"
+      :data="tasks"
+      border
+      stripe
+      max-height="480"
+      :empty-text="text('no historical tasks', '暂无历史任务')"
+    >
+      <el-table-column :label="text('status', '状态')" width="130">
+        <template v-slot:default="{ row }">
+          <el-tag :type="statusType(row.status)" size="small">{{ statusLabel(row.status) }}</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column :label="text('progress', '进度')" width="110">
+        <template v-slot:default="{ row }">{{ row.processedCount || 0 }} / {{ row.totalCount || 0 }}</template>
+      </el-table-column>
+      <el-table-column prop="successCount" :label="text('succeeded', '成功')" width="80"></el-table-column>
+      <el-table-column prop="skippedCount" :label="text('skipped', '跳过')" width="80"></el-table-column>
+      <el-table-column prop="failedCount" :label="text('failed', '失败')" width="80"></el-table-column>
+      <el-table-column :label="text('created at', '创建时间')" width="165">
+        <template v-slot:default="{ row }">{{ formatTime(row.createdAt) }}</template>
+      </el-table-column>
+      <el-table-column :label="text('finished at', '结束时间')" width="165">
+        <template v-slot:default="{ row }">{{ formatTime(row.finishedAt) }}</template>
+      </el-table-column>
+      <el-table-column
+        prop="lastError"
+        :label="text('latest issue', '最近问题')"
+        min-width="220"
+        show-overflow-tooltip
+      ></el-table-column>
+    </el-table>
+    <el-pagination
+      v-if="total > pageSize"
+      class="i18n-ai-task-history__pagination"
+      background
+      layout="total, prev, pager, next"
+      :current-page="currentPage"
+      :page-size="pageSize"
+      :total="total"
+      @current-change="handlePageChange"
+    ></el-pagination>
+    <template v-slot:footer><span>
+      <el-button @click="handleClose">{{ text('close', '关闭') }}</el-button>
+    </span></template>
+  </el-dialog>
+</template>
+
+<script>
+import workbenchText from './i18n-workbench-text'
+
+export default {
+  name: 'epx-i18n-ai-task-history-dialog',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    localeCode: {
+      type: String,
+      default: ''
+    },
+    languageName: {
+      type: String,
+      default: ''
+    }
+  },
+  data () {
+    return {
+      loading: false,
+      tasks: [],
+      total: 0,
+      currentPage: 1,
+      pageSize: 10,
+      requestSerial: 0
+    }
+  },
+  computed: {
+    dialogTitle () {
+      const title = this.text('translation task history', '历史任务')
+      return this.languageName ? `${title} - ${this.languageName}` : title
+    }
+  },
+  watch: {
+    localeCode () {
+      if (!this.visible) return
+      this.currentPage = 1
+      this.loadHistory()
+    }
+  },
+  methods: {
+    text (key, zhText) {
+      return workbenchText(this, key, zhText)
+    },
+    handleOpen () {
+      this.currentPage = 1
+      this.loadHistory()
+    },
+    handleClose () {
+      this.requestSerial++
+      this.$emit('update:visible', false)
+    },
+    handlePageChange (page) {
+      this.currentPage = page
+      this.loadHistory()
+    },
+    loadHistory () {
+      if (!this.localeCode) {
+        this.tasks = []
+        this.total = 0
+        return
+      }
+      const requestSerial = ++this.requestSerial
+      this.loading = true
+      this.$http.$request({
+        action: 'aiTranslationTaskHistory',
+        entityId: 'FM_I18N_RESOURCE',
+        localeCode: this.localeCode,
+        currentPage: this.currentPage,
+        rowsPerPage: this.pageSize
+      }, {
+        method: 'post'
+      })
+        .then(result => {
+          if (requestSerial !== this.requestSerial) return
+          this.tasks = result.entitys || []
+          this.total = Number(result.total) || 0
+        })
+        .catch(error => {
+          if (requestSerial !== this.requestSerial) return
+          this.$message.error(error.message || this.text('failed to query translation task history', '查询历史任务失败'))
+        })
+        .finally(() => {
+          if (requestSerial === this.requestSerial) this.loading = false
+        })
+    },
+    statusLabel (status) {
+      return {
+        COMPLETED: this.text('completed', '已完成'),
+        COMPLETED_WITH_ERRORS: this.text('completed with errors', '完成（有错误）'),
+        FAILED: this.text('failed', '失败')
+      }[status] || status
+    },
+    statusType (status) {
+      return {
+        COMPLETED: 'success',
+        COMPLETED_WITH_ERRORS: 'warning',
+        FAILED: 'danger'
+      }[status] || 'info'
+    },
+    formatTime (value) {
+      if (!value) return '-'
+      return this.$moment ? this.$moment(value).format('YYYY-MM-DD HH:mm:ss') : value
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.i18n-ai-task-history__pagination {
+  margin-top: 16px;
+  text-align: right;
+}
+</style>

package/src/views/i18n/I18nPublishDialog.vue

@@ -0,0 +1,360 @@
+<template>
+  <el-dialog
+    title="校验与发布语言包"
+    v-model="dialogVisible"
+    width="760px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="!publishing"
+    :show-close="!publishing"
+    @closed="reset"
+  >
+    <el-form label-width="90px">
+      <el-form-item label="目标语言">
+        <span>{{ languageName }}</span>
+      </el-form-item>
+      <el-form-item label="发布内容">
+        <span>配置资源与界面消息</span>
+        <div class="i18n-publish-dialog__scope-tip">
+          一次校验并发布全部可发布内容；没有有效内容的范围会自动跳过，不受工作台筛选条件影响。
+        </div>
+      </el-form-item>
+    </el-form>
+
+    <div v-loading="validating" class="i18n-publish-dialog__validation">
+      <template v-if="validationReady">
+        <el-alert
+          :title="validationAlertTitle"
+          :type="validationAlertType"
+          :closable="false"
+          show-icon
+        ></el-alert>
+        <div class="i18n-publish-dialog__summary">
+          资源总数：{{ totalResourceCount }}，本次有效：{{ totalValidCount }}，
+          合并后发布：{{ previewRows.length }}，
+          跳过警告：{{ issues.length }}
+        </div>
+
+        <el-table :data="scopeSummaries" border stripe size="small" class="i18n-publish-dialog__scope-table">
+          <el-table-column prop="label" label="内容范围" width="120"></el-table-column>
+          <el-table-column prop="resourceCount" label="资源总数" width="100"></el-table-column>
+          <el-table-column prop="validCount" label="本次有效" width="100"></el-table-column>
+          <el-table-column prop="previewCount" label="合并后发布" width="110"></el-table-column>
+          <el-table-column label="处理方式" min-width="120">
+            <template v-slot:default="scope">
+              <el-tag :type="scope.row.passed ? 'success' : 'info'" size="small">
+                {{ scope.row.passed ? '发布' : '跳过' }}
+              </el-tag>
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <template v-if="issues.length > 0">
+          <el-table :data="visibleIssues" border stripe max-height="320">
+            <el-table-column prop="scopeName" label="内容范围" width="100"></el-table-column>
+            <el-table-column prop="resourceKey" label="资源标识" min-width="220" show-overflow-tooltip></el-table-column>
+            <el-table-column label="问题类型" width="130">
+              <template v-slot:default="scope">{{ issueLabel(scope.row.code) }}</template>
+            </el-table-column>
+            <el-table-column prop="message" label="问题说明" min-width="220" show-overflow-tooltip></el-table-column>
+          </el-table>
+          <div v-if="issues.length > visibleIssues.length" class="i18n-publish-dialog__result-tip">
+            当前展示前 {{ visibleIssues.length }} 条，共 {{ issues.length }} 条跳过警告。
+          </div>
+          <div class="i18n-publish-dialog__result-tip">
+            缺失、过期或校验失败项不阻止其他译文发布；有历史发布值时保留旧值，否则运行时回退默认语言。
+          </div>
+        </template>
+
+        <template v-if="previewRows.length > 0">
+          <el-table :data="visiblePreviewRows" border stripe max-height="320">
+            <el-table-column prop="scopeName" label="内容范围" width="100"></el-table-column>
+            <el-table-column prop="resourceKey" label="资源标识" min-width="260" show-overflow-tooltip></el-table-column>
+            <el-table-column prop="value" label="发布译文预览" min-width="250" show-overflow-tooltip></el-table-column>
+          </el-table>
+          <div v-if="previewRows.length > visiblePreviewRows.length" class="i18n-publish-dialog__result-tip">
+            当前展示前 {{ visiblePreviewRows.length }} 条，共 {{ previewRows.length }} 条译文。
+          </div>
+        </template>
+      </template>
+    </div>
+
+    <template v-slot:footer><span class="dialog-footer">
+      <el-button :disabled="publishing" @click="dialogVisible = false">取消</el-button>
+      <el-button :loading="validating" :disabled="publishing" @click="validate">重新校验</el-button>
+      <el-button
+        type="success"
+        :loading="publishing"
+        :disabled="!canPublish"
+        @click="publish"
+      >确认发布</el-button>
+    </span></template>
+  </el-dialog>
+</template>
+
+<script>
+const RESULT_DISPLAY_LIMIT = 200
+const PUBLISH_SCOPES = [
+  { value: 'CONFIG', label: '配置资源' },
+  { value: 'UI', label: '界面消息' }
+]
+
+export default {
+  name: 'epx-i18n-publish-dialog',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    localeCode: {
+      type: String,
+      default: ''
+    },
+    languageName: {
+      type: String,
+      default: ''
+    }
+  },
+  data () {
+    return {
+      validations: {
+        CONFIG: null,
+        UI: null
+      },
+      validating: false,
+      publishing: false
+    }
+  },
+  computed: {
+    dialogVisible: {
+      get () {
+        return this.visible
+      },
+      set (value) {
+        this.$emit('update:visible', value)
+      }
+    },
+    validationReady () {
+      return PUBLISH_SCOPES.every(item => Boolean(this.validations[item.value]))
+    },
+    scopeSummaries () {
+      return PUBLISH_SCOPES.map(item => {
+        const validation = this.validations[item.value] || {}
+        return {
+          scope: item.value,
+          label: item.label,
+          resourceCount: validation.resourceCount || 0,
+          validCount: validation.validCount || 0,
+          previewCount: Object.keys(validation.preview || {}).length,
+          passed: Boolean(validation.passed)
+        }
+      })
+    },
+    issues () {
+      return PUBLISH_SCOPES.reduce((result, item) => {
+        const validation = this.validations[item.value]
+        if (!validation) return result
+        const scopedIssues = (validation.issues || []).map(issue => ({
+          ...issue,
+          scope: item.value,
+          scopeName: item.label
+        }))
+        return result.concat(scopedIssues)
+      }, [])
+    },
+    visibleIssues () {
+      return this.issues.slice(0, RESULT_DISPLAY_LIMIT)
+    },
+    previewRows () {
+      return PUBLISH_SCOPES.reduce((result, item) => {
+        const validation = this.validations[item.value]
+        const preview = (validation && validation.preview) || {}
+        const scopedRows = Object.keys(preview).map(resourceKey => ({
+          scope: item.value,
+          scopeName: item.label,
+          resourceKey,
+          value: preview[resourceKey]
+        }))
+        return result.concat(scopedRows)
+      }, [])
+    },
+    visiblePreviewRows () {
+      return this.previewRows.slice(0, RESULT_DISPLAY_LIMIT)
+    },
+    publishableScopes () {
+      return this.scopeSummaries.filter(item => item.passed)
+    },
+    totalResourceCount () {
+      return this.scopeSummaries.reduce((total, item) => total + item.resourceCount, 0)
+    },
+    totalValidCount () {
+      return this.scopeSummaries.reduce((total, item) => total + item.validCount, 0)
+    },
+    validationAlertTitle () {
+      if (!this.validationReady) return ''
+      if (this.publishableScopes.length === 0) return '当前没有任何可发布译文'
+      return this.issues.length > 0
+        ? '可以统一发布，以下问题项或空范围将被跳过'
+        : '校验通过，可以统一发布当前语言包'
+    },
+    validationAlertType () {
+      if (!this.validationReady || this.publishableScopes.length === 0) return 'error'
+      return this.issues.length > 0 ? 'warning' : 'success'
+    },
+    canPublish () {
+      return this.validationReady &&
+        this.publishableScopes.length > 0 &&
+        !this.validating &&
+        !this.publishing
+    }
+  },
+  watch: {
+    visible (value) {
+      if (!value) return
+      this.validations = {
+        CONFIG: null,
+        UI: null
+      }
+      this.$nextTick(this.validate)
+    }
+  },
+  methods: {
+    request (action, scope) {
+      return this.$http.$request({
+        action,
+        entityId: 'FM_I18N_RESOURCE',
+        localeCode: this.localeCode,
+        scope
+      }, {
+        method: 'post'
+      })
+    },
+    validate () {
+      if (!this.localeCode || this.validating || this.publishing) return
+      this.validating = true
+      this.validations = {
+        CONFIG: null,
+        UI: null
+      }
+      Promise.all(PUBLISH_SCOPES.map(item => {
+        return this.request('validateTranslations', item.value)
+          .then(validation => ({
+            scope: item.value,
+            validation
+          }))
+      }))
+        .then(results => {
+          const validations = {
+            CONFIG: null,
+            UI: null
+          }
+          results.forEach(result => {
+            validations[result.scope] = result.validation
+          })
+          this.validations = validations
+        })
+        .catch(error => this.$message.error(error.message || '校验待发布译文失败'))
+        .finally(() => {
+          this.validating = false
+        })
+    },
+    publish () {
+      if (!this.canPublish) return
+      this.$confirm(
+        `确定统一发布 ${this.languageName} 的配置资源和界面消息吗？本次将发布所有有有效内容的范围；跳过项会保留历史发布值，没有历史值的资源继续回退默认语言。`,
+        '确认发布',
+        {
+          confirmButtonText: '发布',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        this.publishing = true
+        return Promise.all(this.publishableScopes.map(item => {
+          return this.request('publishTranslations', item.scope)
+            .then(result => ({
+              ...item,
+              result
+            }))
+            .catch(error => ({
+              ...item,
+              error
+            }))
+        }))
+          .then(results => {
+            const published = results.filter(item => item.result && item.result.published)
+            const failed = results.filter(item => !item.result || !item.result.published)
+            if (failed.length === 0) {
+              const summary = published
+                .map(item => `${item.label} ${item.result.resourceCount || 0} 条`)
+                .join('、')
+              this.$message.success(`统一发布成功：${summary}`)
+              this.dialogVisible = false
+              return
+            }
+
+            const validations = {
+              ...this.validations
+            }
+            failed.forEach(item => {
+              if (item.result && item.result.validation) {
+                validations[item.scope] = item.result.validation
+              }
+            })
+            this.validations = validations
+            const publishedNames = published.map(item => item.label).join('、') || '无'
+            const failedNames = failed.map(item => item.label).join('、')
+            this.$message.error(`发布未全部完成：已成功 ${publishedNames}；失败 ${failedNames}，请查看后重新校验。`)
+          })
+          .finally(() => {
+            this.publishing = false
+          })
+      }).catch(() => {})
+    },
+    reset () {
+      this.validations = {
+        CONFIG: null,
+        UI: null
+      }
+      this.validating = false
+      this.publishing = false
+    },
+    issueLabel (code) {
+      return {
+        EMPTY_SCOPE: '范围为空',
+        MISSING_TRANSLATION: '译文缺失',
+        STALE_TRANSLATION: '原文已更新',
+        PLACEHOLDER_MISMATCH: '占位符不一致',
+        HTML_UNBALANCED: 'HTML 未闭合',
+        HTML_UNSAFE: 'HTML 不安全',
+        TOO_LONG: '译文过长',
+        FORBIDDEN_TERM: '包含禁用词'
+      }[code] || code
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.i18n-publish-dialog {
+  &__scope-tip,
+  &__result-tip {
+    margin-top: 8px;
+    color: #909399;
+    font-size: 12px;
+    line-height: 18px;
+  }
+
+  &__validation {
+    min-height: 120px;
+  }
+
+  &__scope-table {
+    margin-bottom: 12px;
+  }
+
+  &__summary {
+    margin: 14px 0 10px;
+    color: #606266;
+  }
+}
+</style>