Merge branch 'main' of https://gitea.frp.extimaging.com/XCKJ/irc_web

邮件管理编辑内容方式修改
2025-06-05 16:59:56 +08:00 · 2025-06-05 16:59:44 +08:00
3 changed files with 117 additions and 197 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -48,6 +48,7 @@
        "nprogress": "^0.2.0",
        "path-to-regexp": "^0.1.10",
        "pdfobject": "^2.3.0",
+        "prismjs": "^1.30.0",
        "qrcodejs2": "^0.0.2",
        "screenfull": "^6.0.2",
        "sortablejs": "^1.15.5",
@ -62,6 +63,7 @@
        "vue-count-to": "^1.0.13",
        "vue-demi": "^0.14.10",
        "vue-i18n": "^8.28.2",
+        "vue-prism-editor": "^1.3.0",
        "vue-puzzle-vcode": "^1.1.10",
        "vue-router": "^3.0.6",
        "vue-seamless-scroll": "^1.1.23",
@ -18044,6 +18046,15 @@
        "renderkid": "^3.0.0"
      }
    },
+    "node_modules/prismjs": {
+      "version": "1.30.0",
+      "resolved": "https://registry.npmmirror.com/prismjs/-/prismjs-1.30.0.tgz",
+      "integrity": "sha512-DEvV2ZF2r2/63V+tK8hQvrR2ZGn10srHbXviTlcv7Kpzw8jWiNTqbVgjO3IY8RxrrOUF8VPMQQFysYYYv0YZxw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
    "node_modules/process": {
      "version": "0.11.10",
      "resolved": "https://registry.npmmirror.com/process/-/process-0.11.10.tgz",
@ -22997,6 +23008,18 @@
        "url": "https://github.com/chalk/chalk?sponsor=1"
      }
    },
+    "node_modules/vue-prism-editor": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmmirror.com/vue-prism-editor/-/vue-prism-editor-1.3.0.tgz",
+      "integrity": "sha512-54RfgtMGRMNr9484zKMOZs1wyLDR6EfFylzE2QrMCD9alCvXyYYcS0vX8oUHh+6pMUu6ts59uSN9cHglpU2NRQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "peerDependencies": {
+        "vue": "^2.6.11"
+      }
+    },
    "node_modules/vue-puzzle-vcode": {
      "version": "1.1.10",
      "resolved": "https://registry.npmmirror.com/vue-puzzle-vcode/-/vue-puzzle-vcode-1.1.10.tgz",
--- a/package.json
+++ b/package.json
@ -54,6 +54,7 @@
    "nprogress": "^0.2.0",
    "path-to-regexp": "^0.1.10",
    "pdfobject": "^2.3.0",
+    "prismjs": "^1.30.0",
    "qrcodejs2": "^0.0.2",
    "screenfull": "^6.0.2",
    "sortablejs": "^1.15.5",
@ -68,6 +69,7 @@
    "vue-count-to": "^1.0.13",
    "vue-demi": "^0.14.10",
    "vue-i18n": "^8.28.2",
+    "vue-prism-editor": "^1.3.0",
    "vue-puzzle-vcode": "^1.1.10",
    "vue-router": "^3.0.6",
    "vue-seamless-scroll": "^1.1.23",
--- a/src/views/dictionary/template/email/components/EmailForm.vue
+++ b/src/views/dictionary/template/email/components/EmailForm.vue
@ -1,12 +1,5 @@
 <template>
-  <el-form
-    ref="emailForm"
-    v-loading="loading"
-    :model="form"
-    label-width="180px"
-    size="small"
-    :rules="rules"
-  >
+  <el-form ref="emailForm" v-loading="loading" :model="form" label-width="180px" size="small" :rules="rules">
    <el-row>
      <el-col :span="24">
        <!-- Code -->
@ -29,12 +22,7 @@
      <el-col :span="12">
        <!-- 邮件延时发送s数 -->
        <el-form-item :label="$t('dictionary:email:label:emailDelaySeconds')" prop="EmailDelaySeconds">
-          <el-input
-            v-model.number="form.EmailDelaySeconds"
-            style="width: 300px"
-            type="number"
-            clearable
-          >
+          <el-input v-model.number="form.EmailDelaySeconds" style="width: 300px" type="number" clearable>
          </el-input>
        </el-form-item>
      </el-col>
@ -42,12 +30,8 @@
        <!-- 业务层级 -->
        <el-form-item :label="$t('dictionary:email:label:businessLevel')" prop="BusinessLevelEnum">
          <el-select v-model="form.BusinessLevelEnum" clearable class="mr">
-            <el-option
-              v-for="item of $d.BusinessLevel"
-              :key="`BusinessLevel${item.label}`"
-              :label="item.label"
-              :value="item.value"
-            />
+            <el-option v-for="item of $d.BusinessLevel" :key="`BusinessLevel${item.label}`" :label="item.label"
+              :value="item.value" />
          </el-select>
        </el-form-item>
      </el-col>
@ -55,12 +39,8 @@
        <!-- 业务模块 -->
        <el-form-item :label="$t('dictionary:email:label:businessModule')" prop="BusinessModuleEnum">
          <el-select v-model="form.BusinessModuleEnum" clearable class="mr">
-            <el-option
-              v-for="item of $d.BusinessModule"
-              :key="`BusinessModule${item.label}`"
-              :label="item.label"
-              :value="item.value"
-            />
+            <el-option v-for="item of $d.BusinessModule" :key="`BusinessModule${item.label}`" :label="item.label"
+              :value="item.value" />
          </el-select>
        </el-form-item>
      </el-col>
@ -68,80 +48,46 @@
        <!-- 业务场景 -->
        <el-form-item :label="$t('trials:emailManageCfg:table:BusinessScenarioEnum')" prop="BusinessScenarioEnum">
          <el-select v-model="form.BusinessScenarioEnum" clearable class="mr">
-            <el-option
-              v-for="item of $d.Email_BusinessScenario"
-              :key="`BusinessScenarioEnum${item.label}`"
-              :label="item.label"
-              :value="item.value"
-            />
+            <el-option v-for="item of $d.Email_BusinessScenario" :key="`BusinessScenarioEnum${item.label}`"
+              :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <!-- 收件人 -->
        <el-form-item :label="$t('trials:emailManageCfg:title:toUserTypeList')" prop="ToUserTypeList">
-          <el-select
-            v-model="form.ToUserTypeList"
-            clearable
-            multiple
-            class="mr"
-          >
-            <el-option
-              v-for="item of $d.UserType"
-              :key="`ToUserTypeList${item.label}`"
-              :label="item.label"
-              :value="item.value"
-            />
+          <el-select v-model="form.ToUserTypeList" clearable multiple class="mr">
+            <el-option v-for="item of $d.UserType" :key="`ToUserTypeList${item.label}`" :label="item.label"
+              :value="item.value" />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <!-- 抄送人 -->
        <el-form-item :label="$t('trials:emailManageCfg:title:copyUserTypeList')" prop="CopyUserTypeList">
-          <el-select
-            v-model="form.CopyUserTypeList"
-            clearable
-            multiple
-            class="mr"
-          >
-            <el-option
-              v-for="item of $d.UserType"
-              :key="`CopyUserTypeList${item.label}`"
-              :label="item.label"
-              :value="item.value"
-            />
+          <el-select v-model="form.CopyUserTypeList" clearable multiple class="mr">
+            <el-option v-for="item of $d.UserType" :key="`CopyUserTypeList${item.label}`" :label="item.label"
+              :value="item.value" />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <!-- 加急状态 -->
        <el-form-item :label="$t('dictionary:email:label:IsUrgent')" prop="EmailUrgentEnum">
-          <el-select
-            v-model="form.EmailUrgentEnum"
-            @change="
+          <el-select v-model="form.EmailUrgentEnum" @change="
            (v) => {
              v === 1 ? (form.EmailCron = null) : null
            }
-            "
-            clearable
-            class="mr"
-          >
-            <el-option
-              v-for="item of $d.EmailUrgent"
-              :key="`EmailUrgent${item.label}`"
-              :label="item.label"
-              :value="item.value"
-            />
+          " clearable class="mr">
+            <el-option v-for="item of $d.EmailUrgent" :key="`EmailUrgent${item.label}`" :label="item.label"
+              :value="item.value" />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <!-- 发送周期和时间 -->
-        <el-form-item
-          :label="$t('trials:emailManageCfg:table:EmailCron')"
-          v-if="form.EmailUrgentEnum !== 1"
-          prop="EmailCron"
-        >
+        <el-form-item :label="$t('trials:emailManageCfg:table:EmailCron')" v-if="form.EmailUrgentEnum !== 1"
+          prop="EmailCron">
          <el-input style="width: 300px" readonly v-model="form.EmailCron" />
          <!-- 生成 cron -->
          <el-button type="primary" @click="showDialog"> {{ $t('dictionary:email:button:cron') }} </el-button>
@ -151,12 +97,8 @@
        <!-- 是否需要回执 -->
        <el-form-item :label="$t('trials:emailManageCfg:title:isReturnRequired')" prop="IsReturnRequired">
          <el-radio-group v-model="form.IsReturnRequired">
-            <el-radio
-              v-for="item of $d.YesOrNo"
-              :label="item.value"
-              :key="`IsReturnRequired${item.value}`"
-              >{{ item.label }}</el-radio
-            >
+            <el-radio v-for="item of $d.YesOrNo" :label="item.value" :key="`IsReturnRequired${item.value}`">{{
+              item.label }}</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-col>
@ -164,48 +106,30 @@
        <!-- 是否自动发送 -->
        <el-form-item :label="$t('trials:emailManageCfg:table:IsAutoSend')" prop="IsAutoSend">
          <el-radio-group v-model="form.IsAutoSend">
-            <el-radio
-              v-for="item of $d.YesOrNo"
-              :label="item.value"
-              :key="`IsAutoSend${item.value}`"
-              >{{ item.label }}</el-radio
-            >
+            <el-radio v-for="item of $d.YesOrNo" :label="item.value" :key="`IsAutoSend${item.value}`">{{ item.label
+            }}</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-col>
      <el-col :span="12" v-if="systemLevel">
        <!-- 是否区分标准 -->
        <el-form-item :label="$t('dictionary:email:button:isDistinguishCriteria')" prop="IsDistinguishCriteria">
-          <el-radio-group
-            v-model="form.IsDistinguishCriteria"
-            @change="
+          <el-radio-group v-model="form.IsDistinguishCriteria" @change="
            () => {
              form.CriterionTypeEnum = null
            }
-            "
-          >
-            <el-radio
-              v-for="item of $d.YesOrNo"
-              :label="item.value"
-              :key="`IsDistinguishCriteria${item.value}`"
-              >{{ item.label }}</el-radio
-            >
+          ">
+            <el-radio v-for="item of $d.YesOrNo" :label="item.value" :key="`IsDistinguishCriteria${item.value}`">{{
+              item.label }}</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-col>
      <el-col :span="12">
-        <el-form-item
-          :label="$t('trials:auditRecord:table:criterion')"
-          v-if="form.IsDistinguishCriteria"
-          prop="CriterionTypeEnum"
-        >
+        <el-form-item :label="$t('trials:auditRecord:table:criterion')" v-if="form.IsDistinguishCriteria"
+          prop="CriterionTypeEnum">
          <el-select v-model="form.CriterionTypeEnum" clearable class="mr">
-            <el-option
-              v-for="item of $d.CriterionType"
-              :key="`CriterionType${item.label}`"
-              :label="item.label"
-              :value="item.value"
-            />
+            <el-option v-for="item of $d.CriterionType" :key="`CriterionType${item.label}`" :label="item.label"
+              :value="item.value" />
          </el-select>
        </el-form-item>
      </el-col>
@ -213,106 +137,65 @@
        <!-- 是否启用 -->
        <el-form-item :label="$t('trials:emailManageCfg:table:IsEnable')" prop="IsEnable">
          <el-radio-group v-model="form.IsEnable">
-            <el-radio
-              v-for="item of $d.YesOrNo"
-              :label="item.value"
-              :key="`IsEnable${item.value}`"
-              >{{ item.label }}</el-radio
-            >
+            <el-radio v-for="item of $d.YesOrNo" :label="item.value" :key="`IsEnable${item.value}`">{{ item.label
+            }}</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <!-- 附件（CN） -->
        <el-form-item :label="$t('trials:emailManageCfg:table:fileListCN')" prop="IsEnable">
-          <el-upload
-            class="upload-demo"
-            action
-            :before-upload="beforeUploadCN"
-            :http-request="handleUploadFileCN"
-            :on-preview="handlePreviewCN"
-            :on-remove="handleRemoveFileCN"
-            :show-file-list="true"
-            :limit="1"
-            :file-list="fileListCN"
-          >
-            <el-button
-              size="small"
-              type="primary"
-              :disabled="fileListCN.length > 0"
-              >{{ $t('common:button:upload') }}</el-button
-            >
+          <el-upload class="upload-demo" action :before-upload="beforeUploadCN" :http-request="handleUploadFileCN"
+            :on-preview="handlePreviewCN" :on-remove="handleRemoveFileCN" :show-file-list="true" :limit="1"
+            :file-list="fileListCN">
+            <el-button size="small" type="primary" :disabled="fileListCN.length > 0">{{ $t('common:button:upload')
+            }}</el-button>
          </el-upload>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <!-- 附件（EN） -->
        <el-form-item :label="$t('trials:emailManageCfg:table:fileListEN')" prop="IsEnable">
-          <el-upload
-            class="upload-demo"
-            action
-            :before-upload="beforeUploadEN"
-            :http-request="handleUploadFileEN"
-            :on-preview="handlePreviewEN"
-            :on-remove="handleRemoveFileEN"
-            :show-file-list="true"
-            :limit="1"
-            :file-list="fileListEN"
-          >
-            <el-button
-              size="small"
-              type="primary"
-              :disabled="fileListEN.length > 0"
-              >{{ $t('common:button:upload') }}</el-button
-            >
+          <el-upload class="upload-demo" action :before-upload="beforeUploadEN" :http-request="handleUploadFileEN"
+            :on-preview="handlePreviewEN" :on-remove="handleRemoveFileEN" :show-file-list="true" :limit="1"
+            :file-list="fileListEN">
+            <el-button size="small" type="primary" :disabled="fileListEN.length > 0">{{ $t('common:button:upload')
+            }}</el-button>
          </el-upload>
        </el-form-item>
      </el-col>
    </el-row>
    <!-- 邮件内容模版（CN） -->
-    <el-form-item
-      :label="$t('dictionary:email:label:emailHtmlContentCN')"
-      prop="EmailHtmlContentCN"
-      style="position: relative"
-    >
-      <el-input
-        v-model="form.EmailHtmlContentCN"
-        type="textarea"
-        :autosize="{ minRows: 8, maxRows: 8 }"
-      />
-      <el-button
-        :disabled="!form.EmailHtmlContentCN && form.EmailHtmlContent"
-        type="text"
+    <el-form-item :label="$t('dictionary:email:label:emailHtmlContentCN')" prop="EmailHtmlContentCN"
+      style="position: relative">
+      <div class="html_temp">
+        <prism-editor class="my-editor" v-model="form.EmailHtmlContentCN" :highlight="highlighter" :line-numbers="true"
+          style="width: 50%;max-height: 500px;"></prism-editor>
+        <div v-html="form.EmailHtmlContentCN" style="width: 50%;"></div>
+      </div>
+      <!-- <el-input v-model="form.EmailHtmlContentCN" type="textarea" :autosize="{ minRows: 8, maxRows: 8 }" />
+      <el-button :disabled="!form.EmailHtmlContentCN && form.EmailHtmlContent" type="text"
        @click="PreviewHTML(form.EmailHtmlContentCN, form.EmailHtmlContent)"
-        style="position: absolute; left: -50px; top: 30px"
-      >
+        style="position: absolute; left: -50px; top: 30px">
        {{ $t('common:button:preview') }}
-      </el-button>
+      </el-button> -->
    </el-form-item>
    <!-- 邮件内容模版（EN） -->
-    <el-form-item
-      :label="$t('dictionary:email:label:emailHtmlContent')"
-      prop="EmailHtmlContent"
-      style="position: relative"
-    >
-      <el-input
-        v-model="form.EmailHtmlContent"
-        type="textarea"
-        :autosize="{ minRows: 8, maxRows: 8 }"
-      />
-      <el-button
-        :disabled="!form.EmailHtmlContentCN && form.EmailHtmlContent"
-        type="text"
+    <el-form-item :label="$t('dictionary:email:label:emailHtmlContent')" prop="EmailHtmlContent"
+      style="position: relative">
+      <div class="html_temp">
+        <prism-editor class="my-editor" v-model="form.EmailHtmlContent" :highlight="highlighter" :line-numbers="true"
+          style="width: 50%;max-height: 500px;"></prism-editor>
+        <div v-html="form.EmailHtmlContent" style="width: 50%;"></div>
+      </div>
+      <!-- <el-input v-model="form.EmailHtmlContent" type="textarea" :autosize="{ minRows: 8, maxRows: 8 }" />
+      <el-button :disabled="!form.EmailHtmlContentCN && form.EmailHtmlContent" type="text"
        @click="PreviewHTML(form.EmailHtmlContentCN, form.EmailHtmlContent)"
-        style="position: absolute; left: -50px; top: 30px"
-      >
+        style="position: absolute; left: -50px; top: 30px">
        {{ $t('common:button:preview') }}
-      </el-button>
+      </el-button> -->
    </el-form-item>
-    <div
-      class="base-dialog-footer"
-      style="text-align: right; margin-top: 10px; padding-bottom: 10px"
-    >
+    <div class="base-dialog-footer" style="text-align: right; margin-top: 10px; padding-bottom: 10px">
      <el-form-item style="text-align: right">
        <el-button size="small" type="primary" @click="handleSave">
          {{ $t('common:button:save') }}
@ -321,12 +204,7 @@
    </div>
    <!-- 生成 cron -->
    <el-dialog append-to-body :title="$t('dictionary:email:button:cron')" :visible.sync="showCron">
-      <vcrontab
-        :hideComponent="['year']"
-        @hide="showCron = false"
-        @fill="crontabFill"
-        :expression="expression"
-      >
+      <vcrontab :hideComponent="['year']" @hide="showCron = false" @fill="crontabFill" :expression="expression">
      </vcrontab>
    </el-dialog>
  </el-form>
@ -334,6 +212,14 @@
 <script>
 import { Upload, addOrUpdateEmailNoticeConfigList } from '@/api/dictionary'
 import vcrontab from 'vcrontab'
+
+import { PrismEditor } from 'vue-prism-editor';
+import 'vue-prism-editor/dist/prismeditor.min.css';
+import { highlight, languages } from 'prismjs/components/prism-core';
+import 'prismjs/components/prism-clike';
+import 'prismjs/components/prism-javascript';
+import 'prismjs/themes/prism.css';
+
 export default {
  props: {
    data: {
@ -355,7 +241,7 @@ export default {
      },
    },
  },
-  components: { vcrontab },
+  components: { vcrontab, PrismEditor },
  data() {
    return {
      expression: '',
@ -440,6 +326,9 @@ export default {
    }
  },
  methods: {
+    highlighter(code) {
+      return highlight(code, languages.js);
+    },
    showDialog() {
      this.expression = this.form.EmailCron //传入的 cron 表达式，可以反解析到 UI 上
      this.showCron = true
@ -563,3 +452,9 @@ export default {
  },
 }
 </script>
+<style lang="scss" scoped>
+.html_temp {
+  display: flex;
+
+}
+</style>
Author	SHA1	Message	Date
wangxiaoshuang	1ffd9e3863	Merge branch 'main' of https://gitea.frp.extimaging.com/XCKJ/irc_web continuous-integration/drone/push Build is failing Details	2025-06-05 16:59:56 +08:00
wangxiaoshuang	3bcf097c52	邮件管理编辑内容方式修改	2025-06-05 16:59:44 +08:00