From 109470ca1ace205b7589f579ddc45f50cdeba2aa Mon Sep 17 00:00:00 2001
From: "DESKTOP-6C3NK6N\\WXS" <815034831@qq.com>
Date: Sat, 12 Oct 2024 10:31:36 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E9=82=AE=E4=BB=B6=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E6=A8=A1=E6=9D=BF=E6=B7=BB=E5=8A=A0=E9=A2=84=E8=A7=88=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../template/email/components/EmailForm.vue   | 214 ++++++++++--------
 .../template/email/components/EmailList.vue   | 154 +++++++------
 2 files changed, 207 insertions(+), 161 deletions(-)

diff --git a/src/views/dictionary/template/email/components/EmailForm.vue b/src/views/dictionary/template/email/components/EmailForm.vue
index f69ffe45..b8bd2c27 100644
--- a/src/views/dictionary/template/email/components/EmailForm.vue
+++ b/src/views/dictionary/template/email/components/EmailForm.vue
@@ -99,7 +99,7 @@
             v-model="form.EmailUrgentEnum"
             @change="
               (v) => {
-                v === 1 ? (form.EmailCron = null) : null;
+                v === 1 ? (form.EmailCron = null) : null
               }
             "
             clearable
@@ -146,7 +146,7 @@
             v-model="form.IsDistinguishCriteria"
             @change="
               () => {
-                form.CriterionTypeEnum = null;
+                form.CriterionTypeEnum = null
               }
             "
           >
@@ -196,7 +196,7 @@
               size="small"
               type="primary"
               :disabled="fileListCN.length > 0"
-              >{{ $t("common:button:upload") }}</el-button
+              >{{ $t('common:button:upload') }}</el-button
             >
           </el-upload>
         </el-form-item>
@@ -218,25 +218,49 @@
               size="small"
               type="primary"
               :disabled="fileListEN.length > 0"
-              >{{ $t("common:button:upload") }}</el-button
+              >{{ $t('common:button:upload') }}</el-button
             >
           </el-upload>
         </el-form-item>
       </el-col>
     </el-row>
-    <el-form-item label="邮件内容模版（CN）" prop="EmailHtmlContentCN">
+    <el-form-item
+      label="邮件内容模版（CN）"
+      prop="EmailHtmlContentCN"
+      style="position: relative"
+    >
       <el-input
         v-model="form.EmailHtmlContentCN"
         type="textarea"
         :autosize="{ minRows: 8, maxRows: 8 }"
       />
+      <el-button
+        :disabled="!form.EmailHtmlContentCN"
+        type="text"
+        @click="PreviewHTML(form.EmailHtmlContentCN)"
+        style="position: absolute; left: -50px; top: 30px"
+      >
+        {{ $t('common:button:preview') }}
+      </el-button>
     </el-form-item>
-    <el-form-item label="邮件内容模版（EN）" prop="EmailHtmlContent">
+    <el-form-item
+      label="邮件内容模版（EN）"
+      prop="EmailHtmlContent"
+      style="position: relative"
+    >
       <el-input
         v-model="form.EmailHtmlContent"
         type="textarea"
         :autosize="{ minRows: 8, maxRows: 8 }"
       />
+      <el-button
+        :disabled="!form.EmailHtmlContent"
+        type="text"
+        @click="PreviewHTML(form.EmailHtmlContent)"
+        style="position: absolute; left: -50px; top: 30px"
+      >
+        {{ $t('common:button:preview') }}
+      </el-button>
     </el-form-item>
     <div
       class="base-dialog-footer"
@@ -259,44 +283,44 @@
   </el-form>
 </template>
 <script>
-import { Upload, addOrUpdateEmailNoticeConfigList } from "@/api/dictionary";
+import { Upload, addOrUpdateEmailNoticeConfigList } from '@/api/dictionary'
 export default {
   props: {
     data: {
       type: Object,
       default() {
-        return {};
+        return {}
       },
     },
     systemLevel: {
       type: Number,
       default() {
-        return 0;
+        return 0
       },
     },
   },
   data() {
     return {
-      expression: "",
+      expression: '',
       showCron: false,
       form: {
-        Id: "",
-        Code: "",
-        EmailTopicCN: "",
-        EmailTopic: "",
-        BusinessLevelEnum: "",
-        BusinessModuleEnum: "",
-        ToUserTypeList: "",
-        CopyUserTypeList: "",
-        EmailUrgentEnum: "",
-        EmailCron: "",
+        Id: '',
+        Code: '',
+        EmailTopicCN: '',
+        EmailTopic: '',
+        BusinessLevelEnum: '',
+        BusinessModuleEnum: '',
+        ToUserTypeList: '',
+        CopyUserTypeList: '',
+        EmailUrgentEnum: '',
+        EmailCron: '',
         BusinessScenarioEnum: null,
-        EmailHtmlContentCN: "",
-        EmailHtmlContent: "",
-        AttachPath: "",
-        AttachName: "",
-        AttachNameCN: "",
-        AttachCNPath: "",
+        EmailHtmlContentCN: '',
+        EmailHtmlContent: '',
+        AttachPath: '',
+        AttachName: '',
+        AttachNameCN: '',
+        AttachCNPath: '',
         IsDistinguishCriteria: true,
         IsReturnRequired: true,
         IsUrgent: true,
@@ -305,173 +329,177 @@ export default {
         CriterionTypeEnum: null,
       },
       rules: {
-        Code: [{ required: true, message: "Please select", trigger: ["blur"] }],
+        Code: [{ required: true, message: 'Please select', trigger: ['blur'] }],
         BusinessScenarioEnum: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
         EmailTopicCN: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
         EmailTopic: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
         BusinessLevelEnum: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
         ToUserTypeList: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
         EmailCron: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
         EmailUrgentEnum: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
         EmailHtmlContentCN: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
         EmailHtmlContent: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
         CriterionTypeEnum: [
-          { required: true, message: "Please select", trigger: ["blur"] },
+          { required: true, message: 'Please select', trigger: ['blur'] },
         ],
       },
       scenarioOption: [],
       fileListCN: [],
       fileListEN: [],
       loading: false,
-    };
+    }
   },
   mounted() {
-    this.initForm();
+    this.initForm()
     if (this.systemLevel) {
       if (this.systemLevel === 1) {
-        this.form.ToUserTypeList = [];
+        this.form.ToUserTypeList = []
       }
-      this.form.CopyUserTypeList = [];
-      this.form.EmailUrgentEnum = "3";
-      this.form.IsReturnRequired = false;
-      this.form.IsDistinguishCriteria = false;
+      this.form.CopyUserTypeList = []
+      this.form.EmailUrgentEnum = '3'
+      this.form.IsReturnRequired = false
+      this.form.IsDistinguishCriteria = false
     }
   },
   methods: {
     showDialog() {
-      this.expression = this.form.EmailCron; //传入的 cron 表达式，可以反解析到 UI 上
-      this.showCron = true;
+      this.expression = this.form.EmailCron //传入的 cron 表达式，可以反解析到 UI 上
+      this.showCron = true
     },
     crontabFill(value) {
-      this.form.EmailCron = value;
+      this.form.EmailCron = value
     },
     handleRemoveFileCN() {
-      this.form.AttachNameCN = null;
-      this.form.AttachCNPath = null;
-      this.fileListCN = [];
+      this.form.AttachNameCN = null
+      this.form.AttachCNPath = null
+      this.fileListCN = []
     },
     beforeUploadCN() {
       if (this.fileListCN.length > 0) {
-        this.$alert("最多只能传一个附件");
-        return;
+        this.$alert('最多只能传一个附件')
+        return
       }
     },
     handlePreviewCN(row, r2) {
       if (row.fullPath) {
-        window.open(row.fullPath, "_blank");
+        window.open(row.fullPath, '_blank')
       }
     },
     handleUploadFileCN(param) {
-      this.btnLoading = true;
-      const formData = new FormData();
-      formData.append("file", param.file);
-      this.form.AttachNameCN = param.file.name;
+      this.btnLoading = true
+      const formData = new FormData()
+      formData.append('file', param.file)
+      this.form.AttachNameCN = param.file.name
       Upload(formData, 3).then((res) => {
-        this.form.AttachCNPath = res.Result.FilePath;
-        this.btnLoading = false;
+        this.form.AttachCNPath = res.Result.FilePath
+        this.btnLoading = false
         this.fileListCN.push({
           name: param.file.name,
           path: res.Result.FilePath,
           fullPath: res.Result.FullFilePath,
           url: res.Result.FilePath,
-        });
-      });
+        })
+      })
     },
     handleUploadFileEN(param) {
-      this.btnLoading = true;
-      const formData = new FormData();
-      formData.append("file", param.file);
-      this.form.AttachName = param.file.name;
+      this.btnLoading = true
+      const formData = new FormData()
+      formData.append('file', param.file)
+      this.form.AttachName = param.file.name
       Upload(formData, 3).then((res) => {
-        this.form.AttachPath = res.Result.FilePath;
-        this.btnLoading = false;
+        this.form.AttachPath = res.Result.FilePath
+        this.btnLoading = false
         this.fileListEN.push({
           name: param.file.name,
           path: res.Result.FilePath,
           fullPath: res.Result.FullFilePath,
           url: res.Result.FilePath,
-        });
-      });
+        })
+      })
     },
     handleRemoveFileEN() {
-      this.form.AttachName = null;
-      this.form.AttachPath = null;
-      this.fileListEN = [];
+      this.form.AttachName = null
+      this.form.AttachPath = null
+      this.fileListEN = []
     },
     beforeUploadEN() {
       if (this.fileListEN.length > 0) {
-        this.$alert("最多只能传一个附件");
-        return;
+        this.$alert('最多只能传一个附件')
+        return
       }
     },
     handlePreviewEN(row, r2) {
       if (row.fullPath) {
-        window.open(row.fullPath, "_blank");
+        window.open(row.fullPath, '_blank')
       }
     },
     async initForm() {
-      this.loading = true;
+      this.loading = true
       // await this.getScenarios()
       for (const k in this.form) {
         if (this.data.hasOwnProperty(k)) {
-          this.form[k] = this.data[k];
+          this.form[k] = this.data[k]
         }
-        if (k === "AttachPath" && this.form[k]) {
+        if (k === 'AttachPath' && this.form[k]) {
           this.fileListEN.push({
             name: this.data.AttachName,
             path: this.data.AttachPath,
             fullPath: this.data.AttachPath,
             url: this.data.AttachPath,
-          });
+          })
         }
-        if (k === "AttachCNPath" && this.form[k]) {
+        if (k === 'AttachCNPath' && this.form[k]) {
           this.fileListCN.push({
             name: this.data.AttachNameCN,
             path: this.data.AttachCNPath,
             fullPath: this.data.AttachCNPath,
             url: this.data.AttachCNPath,
-          });
+          })
         }
       }
-      this.loading = false;
+      this.loading = false
     },
 
     // 保存
     handleSave() {
       this.$refs.emailForm.validate((valid) => {
-        if (!valid) return;
-        this.loading = true;
-        this.form.systemLevel = this.systemLevel;
+        if (!valid) return
+        this.loading = true
+        this.form.systemLevel = this.systemLevel
         addOrUpdateEmailNoticeConfigList(this.form)
           .then((res) => {
-            this.loading = false;
-            this.$emit("closeDialog");
-            this.$emit("getList");
-            this.$message.success("Saved successfully");
+            this.loading = false
+            this.$emit('closeDialog')
+            this.$emit('getList')
+            this.$message.success('Saved successfully')
           })
           .catch(() => {
-            this.loading = false;
-          });
-      });
+            this.loading = false
+          })
+      })
+    },
+    // 预览模板
+    PreviewHTML(html) {
+      this.$emit('PreviewHTML', html)
     },
   },
-};
+}
 </script>
diff --git a/src/views/dictionary/template/email/components/EmailList.vue b/src/views/dictionary/template/email/components/EmailList.vue
index c9ba8ce1..9c8718f3 100644
--- a/src/views/dictionary/template/email/components/EmailList.vue
+++ b/src/views/dictionary/template/email/components/EmailList.vue
@@ -111,7 +111,7 @@
         min-width="120"
       >
         <template slot-scope="scope">
-          {{ $fd("CriterionType", scope.row.CriterionTypeEnum) }}
+          {{ $fd('CriterionType', scope.row.CriterionTypeEnum) }}
         </template>
       </el-table-column>
       <el-table-column
@@ -136,7 +136,7 @@
         min-width="100"
       >
         <template slot-scope="scope">
-          {{ $fd("BusinessLevel", scope.row.BusinessLevelEnum) }}
+          {{ $fd('BusinessLevel', scope.row.BusinessLevelEnum) }}
         </template>
       </el-table-column>
       <el-table-column
@@ -147,7 +147,7 @@
         min-width="100"
       >
         <template slot-scope="scope">
-          {{ $fd("BusinessModule", scope.row.BusinessModuleEnum) }}
+          {{ $fd('BusinessModule', scope.row.BusinessModuleEnum) }}
         </template>
       </el-table-column>
       <el-table-column
@@ -158,7 +158,7 @@
         min-width="130"
       >
         <template slot-scope="scope">
-          {{ $fd("Email_BusinessScenario", scope.row.BusinessScenarioEnum) }}
+          {{ $fd('Email_BusinessScenario', scope.row.BusinessScenarioEnum) }}
         </template>
       </el-table-column>
       <!-- 收件人 -->
@@ -172,10 +172,10 @@
         <template slot-scope="scope">
           {{
             scope.row.ToUserTypeList.length > 0
-              ? scope.row.ToUserTypeList.map((v) => $fd("UserType", v)).join(
-                  "、"
+              ? scope.row.ToUserTypeList.map((v) => $fd('UserType', v)).join(
+                  '、'
                 )
-              : ""
+              : ''
           }}
         </template>
       </el-table-column>
@@ -190,10 +190,10 @@
         <template slot-scope="scope">
           {{
             scope.row.CopyUserTypeList.length > 0
-              ? scope.row.CopyUserTypeList.map((v) => $fd("UserType", v)).join(
-                  "、"
+              ? scope.row.CopyUserTypeList.map((v) => $fd('UserType', v)).join(
+                  '、'
                 )
-              : ""
+              : ''
           }}
         </template>
       </el-table-column>
@@ -206,7 +206,7 @@
         v-if="!systemLevel"
       >
         <template slot-scope="scope">
-          {{ $fd("EmailUrgent", scope.row.EmailUrgentEnum) }}
+          {{ $fd('EmailUrgent', scope.row.EmailUrgentEnum) }}
         </template>
       </el-table-column>
       <el-table-column
@@ -246,10 +246,10 @@
       >
         <template slot-scope="scope">
           <el-tag v-if="scope.row.IsReturnRequired" type="danger">
-            {{ $fd("YesOrNo", scope.row.IsReturnRequired) }}
+            {{ $fd('YesOrNo', scope.row.IsReturnRequired) }}
           </el-tag>
           <el-tag v-else type="primary">{{
-            $fd("YesOrNo", scope.row.IsReturnRequired)
+            $fd('YesOrNo', scope.row.IsReturnRequired)
           }}</el-tag>
         </template>
       </el-table-column>
@@ -264,10 +264,10 @@
       >
         <template slot-scope="scope">
           <el-tag v-if="scope.row.IsAutoSend" type="danger">
-            {{ $fd("YesOrNo", scope.row.IsAutoSend) }}
+            {{ $fd('YesOrNo', scope.row.IsAutoSend) }}
           </el-tag>
           <el-tag v-else type="primary">{{
-            $fd("YesOrNo", scope.row.IsAutoSend)
+            $fd('YesOrNo', scope.row.IsAutoSend)
           }}</el-tag>
         </template>
       </el-table-column>
@@ -281,10 +281,10 @@
       >
         <template slot-scope="scope">
           <el-tag v-if="scope.row.IsEnable" type="danger">
-            {{ $fd("YesOrNo", scope.row.IsEnable) }}
+            {{ $fd('YesOrNo', scope.row.IsEnable) }}
           </el-tag>
           <el-tag v-else type="primary">{{
-            $fd("YesOrNo", scope.row.IsEnable)
+            $fd('YesOrNo', scope.row.IsEnable)
           }}</el-tag>
         </template>
       </el-table-column>
@@ -340,6 +340,7 @@
         :system-level="systemLevel"
         @closeDialog="closeDialog"
         @getList="getList"
+        @PreviewHTML="preview"
       />
     </el-dialog>
 
@@ -359,131 +360,148 @@
         @getList="getList"
       />
     </el-dialog>
+    <!-- 预览模板 -->
+    <el-dialog
+      v-if="previewVisible"
+      :visible.sync="previewVisible"
+      :close-on-click-modal="false"
+      title="预览"
+      fullscreen
+      custom-class="base-dialog-wrapper"
+    >
+      <div v-html="previewHTML"></div>
+    </el-dialog>
   </box-content>
 </template>
 <script>
 import {
   getEmailNoticeConfigList,
   deleteEmailNoticeConfig,
-} from "@/api/dictionary";
-import BoxContent from "@/components/BoxContent";
-import Pagination from "@/components/Pagination";
-import EmailForm from "./EmailForm";
-import AttachmentList from "./AttachmentList";
+} from '@/api/dictionary'
+import BoxContent from '@/components/BoxContent'
+import Pagination from '@/components/Pagination'
+import EmailForm from './EmailForm'
+import AttachmentList from './AttachmentList'
 const searchDataDefault = () => {
   return {
-    IsReturnRequired: "",
-    IsUrgent: "",
-    IsEnable: "",
+    IsReturnRequired: '',
+    IsUrgent: '',
+    IsEnable: '',
     CriterionTypeEnum: null,
     PageIndex: 1,
     PageSize: 20,
-  };
-};
+  }
+}
 export default {
-  name: "EmailList",
+  name: 'EmailList',
   components: { BoxContent, Pagination, EmailForm, AttachmentList },
   props: {
     isDistinguishCriteria: {
       type: Boolean,
       default() {
-        return false;
+        return false
       },
     },
     systemLevel: {
       type: Number,
       default() {
-        return 0;
+        return 0
       },
     },
   },
   data() {
     return {
-      activeTab: "0",
+      activeTab: '0',
       searchData: searchDataDefault(),
       loading: false,
       list: [],
       total: 0,
       rowData: {},
-      title: "",
+      title: '',
       editVisible: false,
       attachmentVisible: false,
-    };
+      previewVisible: false,
+      previewHTML: null,
+    }
   },
   mounted() {
-    this.getList();
+    this.getList()
   },
   methods: {
     // 获取受试者列表
     getList() {
-      this.loading = true;
-      this.searchData.IsDistinguishCriteria = this.isDistinguishCriteria;
-      this.searchData.systemLevel = this.systemLevel;
+      this.loading = true
+      this.searchData.IsDistinguishCriteria = this.isDistinguishCriteria
+      this.searchData.systemLevel = this.systemLevel
       getEmailNoticeConfigList(this.searchData)
         .then((res) => {
-          this.loading = false;
-          this.list = res.Result.CurrentPageData;
-          this.total = res.Result.TotalCount;
+          this.loading = false
+          this.list = res.Result.CurrentPageData
+          this.total = res.Result.TotalCount
         })
         .catch(() => {
-          this.loading = false;
-        });
+          this.loading = false
+        })
     },
     // 新增
     handleAdd() {
-      this.rowData = {};
-      this.title = "新增";
-      this.editVisible = true;
+      this.rowData = {}
+      this.title = '新增'
+      this.editVisible = true
     },
     // 编辑
     handleEdit(row) {
-      this.rowData = { ...row };
-      this.title = "编辑";
-      this.editVisible = true;
+      this.rowData = { ...row }
+      this.title = '编辑'
+      this.editVisible = true
     },
     // 删除
     handleDelete(row) {
-      this.$confirm(this.$t("trials:staffResearch:message:confirmDel"), {
-        type: "warning",
+      this.$confirm(this.$t('trials:staffResearch:message:confirmDel'), {
+        type: 'warning',
         distinguishCancelAndClose: true,
       }).then(() => {
         deleteEmailNoticeConfig(row.Id).then((res) => {
           if (res.IsSuccess) {
-            this.getList();
-            this.$message.success("删除成功!");
+            this.getList()
+            this.$message.success('删除成功!')
           }
-        });
-      });
+        })
+      })
     },
     handleDetail(row) {
-      this.rowData = { ...row };
-      this.attachmentVisible = true;
+      this.rowData = { ...row }
+      this.attachmentVisible = true
     },
     // 查询
     handleSearch() {
-      this.searchData.PageIndex = 1;
-      this.getList();
+      this.searchData.PageIndex = 1
+      this.getList()
     },
     // 重置
     handleReset() {
-      this.searchData = searchDataDefault();
-      this.getList();
+      this.searchData = searchDataDefault()
+      this.getList()
     },
     // 排序
     handleSortByColumn(column) {
-      if (column.order === "ascending") {
-        this.searchData.Asc = true;
+      if (column.order === 'ascending') {
+        this.searchData.Asc = true
       } else {
-        this.searchData.Asc = false;
+        this.searchData.Asc = false
       }
-      this.searchData.SortField = column.prop;
-      this.searchData.PageIndex = 1;
-      this.getList();
+      this.searchData.SortField = column.prop
+      this.searchData.PageIndex = 1
+      this.getList()
     },
     // 关闭新增、编辑框
     closeDialog() {
-      this.editVisible = false;
+      this.editVisible = false
+    },
+    preview(html) {
+      this.previewHTML = html
+      this.previewVisible = true
     },
   },
-};
+}
 </script>

From c3b7fd70726b06d9ce65bb0921206c9d818062c2 Mon Sep 17 00:00:00 2001
From: "DESKTOP-6C3NK6N\\WXS" <815034831@qq.com>
Date: Sat, 12 Oct 2024 10:48:10 +0800
Subject: [PATCH 2/3] =?UTF-8?q?=E9=82=AE=E4=BB=B6=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E9=BB=98=E8=AE=A4=E6=8E=92=E5=BA=8F=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/dictionary/template/email/components/EmailList.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/views/dictionary/template/email/components/EmailList.vue b/src/views/dictionary/template/email/components/EmailList.vue
index 9c8718f3..2c2eef6c 100644
--- a/src/views/dictionary/template/email/components/EmailList.vue
+++ b/src/views/dictionary/template/email/components/EmailList.vue
@@ -390,6 +390,8 @@ const searchDataDefault = () => {
     CriterionTypeEnum: null,
     PageIndex: 1,
     PageSize: 20,
+    SortField: 'Code',
+    Asc: true,
   }
 }
 export default {

From 292151f7e1e8f0bbc969e9635beab46dbdac44c9 Mon Sep 17 00:00:00 2001
From: "DESKTOP-6C3NK6N\\WXS" <815034831@qq.com>
Date: Mon, 14 Oct 2024 16:28:20 +0800
Subject: [PATCH 3/3] =?UTF-8?q?=E7=AE=80=E5=8E=86=E6=96=B0=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/index.js                           |   5 +
 src/utils/whiteList.js                        |   2 +-
 .../components/file/agreement.vue             |  96 ++++++++
 .../components/file/certificate.vue           | 129 ++++++++++
 .../components/file/curriculum.vue            | 133 +++++++++++
 .../curriculumVitae/components/info/info.vue  |  10 +
 src/views/reviewers/curriculumVitae/index.vue | 220 ++++++++++++++++++
 7 files changed, 594 insertions(+), 1 deletion(-)
 create mode 100644 src/views/reviewers/curriculumVitae/components/file/agreement.vue
 create mode 100644 src/views/reviewers/curriculumVitae/components/file/certificate.vue
 create mode 100644 src/views/reviewers/curriculumVitae/components/file/curriculum.vue
 create mode 100644 src/views/reviewers/curriculumVitae/components/info/info.vue
 create mode 100644 src/views/reviewers/curriculumVitae/index.vue

diff --git a/src/router/index.js b/src/router/index.js
index d4b2c220..302adff7 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -223,6 +223,11 @@ export const constantRoutes = [
     component: () => import('@/views/reviewers/ReviewersResearch'),
     hidden: true
   },
+  {
+    path: '/curriculumVitae',
+    component: () => import('@/views/reviewers/curriculumVitae/index'),
+    hidden: true
+  },
   {
     path: '/ReviewersResearchForm',
     component: () => import('@/views/reviewers/ReviewersResearchForm'),
diff --git a/src/utils/whiteList.js b/src/utils/whiteList.js
index d48236ce..fc95b171 100644
--- a/src/utils/whiteList.js
+++ b/src/utils/whiteList.js
@@ -1,2 +1,2 @@
-const WHITELIST = ['/', 'researchDetail_m', '/researchForm', '/ReviewersResearch', '/login', '/error', '/resetpassword', '/recompose', '/email-recompose', '/trialStats', '/showdicom', '/imagesShare', '/audit', '/preview', '/researchLogin', '/researchLogin_m', '/blindResumeInfo', '/trialsResume', '/joinVerify', '/showNoneDicoms', '/noneDicomReading', '/clinicalData', '/readingDicoms', '/readingPage', '/visitDicomReview', '/visitNondicomReview', '/globalReview', '/adReview', '/oncologyReview', '/nonedicoms']
+const WHITELIST = ['/', "/curriculumVitae", 'researchDetail_m', '/researchForm', '/ReviewersResearch', '/login', '/error', '/resetpassword', '/recompose', '/email-recompose', '/trialStats', '/showdicom', '/imagesShare', '/audit', '/preview', '/researchLogin', '/researchLogin_m', '/blindResumeInfo', '/trialsResume', '/joinVerify', '/showNoneDicoms', '/noneDicomReading', '/clinicalData', '/readingDicoms', '/readingPage', '/visitDicomReview', '/visitNondicomReview', '/globalReview', '/adReview', '/oncologyReview', '/nonedicoms']
 export default WHITELIST
diff --git a/src/views/reviewers/curriculumVitae/components/file/agreement.vue b/src/views/reviewers/curriculumVitae/components/file/agreement.vue
new file mode 100644
index 00000000..bedfc416
--- /dev/null
+++ b/src/views/reviewers/curriculumVitae/components/file/agreement.vue
@@ -0,0 +1,96 @@
+<template>
+  <div class="agreement">
+    <div class="title">{{ $t('curriculumVitae:agreement:title') }}</div>
+    <div class="fileBox">
+      <div class="file_title">
+        {{ $t('curriculumVitae:agreement:fileTitle') }}
+      </div>
+      <template v-if="true">
+        <div class="file" v-for="item in [1, 2]" :key="item">
+          <div class="name">简历1</div>
+          <i
+            class="el-icon-view"
+            :title="$t('common:button:preview')"
+            @click.stop="preview"
+          />
+          <i class="el-icon-delete" :title="$t('common:button:delete')" />
+        </div>
+      </template>
+      <div class="noData" v-else>{{ $t('curriculumVitae:noData') }}</div>
+      <div class="btnBox">
+        <div style="position: relative">
+          <el-button
+            type="primary"
+            size="small"
+            :disabled="loading"
+            :loading="loading"
+          >
+            {{ $t('curriculumVitae:agreement:btn:upload') }}
+          </el-button>
+          <input
+            type="file"
+            name="file"
+            multiple
+            ref="upload"
+            :title="$t('curriculumVitae:agreement:btn:upload')"
+            style="
+              position: absolute;
+              top: 0;
+              left: 0;
+              width: 100%;
+              height: 100%;
+              opacity: 0;
+              cursor: pointer;
+            "
+            :accept="faccept.join(',')"
+            @change="($event) => beginScanFiles($event)"
+          />
+        </div>
+        <el-button type="text">{{ $t('common:button:downloadTpl') }}</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'agreement',
+  data() {
+    return {
+      faccept: ['.pdf'],
+      loading: false,
+    }
+  },
+  methods: {
+    preview() {
+      this.$preview({
+        path: '',
+        type: '',
+        title: '',
+      })
+    },
+    beginScanFiles(e) {
+      let files = e.target.files
+    },
+  },
+  data() {
+    return {
+      faccept: ['.pdf'],
+      loading: false,
+    }
+  },
+  methods: {
+    preview() {
+      this.$preview({
+        path: '',
+        type: '',
+        title: '',
+      })
+    },
+    beginScanFiles(e) {
+      let files = e.target.files
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+</style>
\ No newline at end of file
diff --git a/src/views/reviewers/curriculumVitae/components/file/certificate.vue b/src/views/reviewers/curriculumVitae/components/file/certificate.vue
new file mode 100644
index 00000000..93751582
--- /dev/null
+++ b/src/views/reviewers/curriculumVitae/components/file/certificate.vue
@@ -0,0 +1,129 @@
+<template>
+  <div class="certificate">
+    <div class="title">{{ $t('curriculumVitae:certificate:title') }}</div>
+    <div class="fileBox">
+      <!--最高医学学位毕业证书-->
+      <div class="file_title">
+        {{ $t('curriculumVitae:certificate:fileTitle:diploma') }}
+      </div>
+      <div class="file" v-if="true">
+        <div class="name">简历1</div>
+        <i
+          class="el-icon-view"
+          :title="$t('common:button:preview')"
+          @click.stop="preview"
+        />
+        <i class="el-icon-delete" :title="$t('common:button:delete')" />
+      </div>
+      <div class="noData" v-else>{{ $t('curriculumVitae:noData') }}</div>
+      <!--医师资格证-->
+      <div class="file_title" v-if="true">
+        {{ $t('curriculumVitae:certificate:fileTitle:certificate') }}
+      </div>
+      <div class="noData" v-else>{{ $t('curriculumVitae:noData') }}</div>
+      <div class="file">
+        <div class="name">简历1</div>
+        <i
+          class="el-icon-view"
+          :title="$t('common:button:preview')"
+          @click.stop="preview"
+        />
+        <i class="el-icon-delete" :title="$t('common:button:delete')" />
+      </div>
+      <!--医师执业证-->
+      <div class="file_title" v-if="true">
+        {{ $t('curriculumVitae:certificate:fileTitle:license') }}
+      </div>
+      <div class="noData" v-else>{{ $t('curriculumVitae:noData') }}</div>
+      <div class="file">
+        <div class="name">简历1</div>
+        <i
+          class="el-icon-view"
+          :title="$t('common:button:preview')"
+          @click.stop="preview"
+        />
+        <i class="el-icon-delete" :title="$t('common:button:delete')" />
+      </div>
+      <!--大型医用设备上岗证-->
+      <div class="file_title">
+        {{ $t('curriculumVitae:certificate:fileTitle:workPermit') }}
+      </div>
+      <template v-if="true">
+        <div v-for="item in [1, 2]" :key="item">
+          <div class="file_title">
+            {{ $t('curriculumVitae:certificate:fileTitle:CT') }}
+          </div>
+          <div class="file">
+            <div class="name">简历1</div>
+            <i
+              class="el-icon-view"
+              :title="$t('common:button:preview')"
+              @click.stop="preview"
+            />
+            <i class="el-icon-delete" :title="$t('common:button:delete')" />
+          </div>
+        </div>
+      </template>
+      <div class="noData" v-else>{{ $t('curriculumVitae:noData') }}</div>
+      <div class="btnBox">
+        <div style="position: relative">
+          <el-button
+            type="primary"
+            size="small"
+            :disabled="loading"
+            :loading="loading"
+          >
+            {{ $t('curriculumVitae:certificate:btn:upload') }}
+          </el-button>
+          <input
+            type="file"
+            name="file"
+            multiple
+            ref="upload"
+            :title="$t('curriculumVitae:certificate:btn:upload')"
+            style="
+              position: absolute;
+              top: 0;
+              left: 0;
+              width: 100%;
+              height: 100%;
+              opacity: 0;
+              cursor: pointer;
+            "
+            :accept="faccept.join(',')"
+            @change="($event) => beginScanFiles($event)"
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import PreviewFile from '@/components/PreviewFile/index'
+export default {
+  name: 'certificate',
+  components: {
+    PreviewFile,
+  },
+  data() {
+    return {
+      faccept: ['.pdf'],
+      loading: false,
+    }
+  },
+  methods: {
+    preview() {
+      this.$preview({
+        path: '',
+        type: '',
+        title: '',
+      })
+    },
+    beginScanFiles(e) {
+      let files = e.target.files
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+</style>
\ No newline at end of file
diff --git a/src/views/reviewers/curriculumVitae/components/file/curriculum.vue b/src/views/reviewers/curriculumVitae/components/file/curriculum.vue
new file mode 100644
index 00000000..6185c1d8
--- /dev/null
+++ b/src/views/reviewers/curriculumVitae/components/file/curriculum.vue
@@ -0,0 +1,133 @@
+<template>
+  <div class="curriculum">
+    <div class="title">{{ $t('curriculumVitae:curriculum:title') }}</div>
+    <div class="fileBox">
+      <div class="file_title">
+        {{ $t('curriculumVitae:curriculum:fileTitle:CN') }}
+      </div>
+      <template v-if="true">
+        <div class="file" v-for="item in [1, 2]" :key="item">
+          <div class="name">简历1</div>
+          <i class="el-icon-download" :title="$t('common:button:download')" />
+          <i class="el-icon-delete" :title="$t('common:button:delete')" />
+          <i
+            class="el-icon-circle-check"
+            :title="$t('common:button:default')"
+          />
+        </div>
+      </template>
+      <div class="noData" v-else>{{ $t('curriculumVitae:noData') }}</div>
+      <div class="file_title">
+        {{ $t('curriculumVitae:curriculum:fileTitle:EN') }}
+      </div>
+      <template v-if="true">
+        <div class="file" v-for="item in [1, 2]" :key="item">
+          <div class="name">Resume</div>
+          <i class="el-icon-download" :title="$t('common:button:download')" />
+          <i class="el-icon-delete" :title="$t('common:button:delete')" />
+          <i
+            class="el-icon-circle-check"
+            :title="$t('common:button:default')"
+          />
+        </div>
+      </template>
+      <div class="noData" v-else>{{ $t('curriculumVitae:noData') }}</div>
+      <div class="btnBox">
+        <div style="position: relative">
+          <el-button
+            type="primary"
+            size="small"
+            :disabled="loading"
+            :loading="loading"
+          >
+            {{ $t('curriculumVitae:curriculum:btn:uploadCN') }}
+          </el-button>
+          <input
+            type="file"
+            name="file"
+            multiple
+            ref="uploadCN"
+            :title="$t('curriculumVitae:curriculum:btn:uploadCN')"
+            style="
+              position: absolute;
+              top: 0;
+              left: 0;
+              width: 100%;
+              height: 100%;
+              opacity: 0;
+              cursor: pointer;
+            "
+            :accept="faccept.join(',')"
+            @change="($event) => beginScanFiles($event)"
+          />
+        </div>
+        <el-button type="text">{{ $t('common:button:downloadTpl') }}</el-button>
+      </div>
+      <div class="btnBox">
+        <div style="position: relative">
+          <el-button
+            type="primary"
+            size="small"
+            :disabled="loading"
+            :loading="loading"
+          >
+            {{ $t('curriculumVitae:curriculum:btn:uploadEN') }}
+          </el-button>
+          <input
+            type="file"
+            name="file"
+            multiple
+            ref="uploadEN"
+            :title="$t('curriculumVitae:curriculum:btn:uploadEN')"
+            style="
+              position: absolute;
+              top: 0;
+              left: 0;
+              width: 100%;
+              height: 100%;
+              opacity: 0;
+              cursor: pointer;
+            "
+            :accept="faccept.join(',')"
+            @change="($event) => beginScanFiles($event)"
+          />
+        </div>
+        <el-button type="text">{{ $t('common:button:downloadTpl') }}</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'curriculum',
+  data() {
+    return {
+      faccept: ['.pdf'],
+      loading: false,
+    }
+  },
+  methods: {
+    beginScanFiles(e) {
+      let files = e.target.files
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+.file {
+  width: 100%;
+  display: flex;
+  margin-bottom: 10px;
+  .name {
+    width: 70%;
+    white-space: nowrap; /* 文本不会换行，会在同一行内继续，直到遇到<br>标签为止 */
+    text-overflow: ellipsis; /* 当文本溢出包含它的容器时，显示省略号(...)来表示被截断的文本 */
+    overflow: hidden; /* 隐藏溢出容器的文本 */
+  }
+  i {
+    cursor: pointer;
+    margin: 3px;
+    color: #409eff;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/reviewers/curriculumVitae/components/info/info.vue b/src/views/reviewers/curriculumVitae/components/info/info.vue
new file mode 100644
index 00000000..06555a5e
--- /dev/null
+++ b/src/views/reviewers/curriculumVitae/components/info/info.vue
@@ -0,0 +1,10 @@
+<template>
+  <div class="info"></div>
+</template>
+<script>
+export default {
+  name: 'info',
+}
+</script>
+<style lang="scss" scoped>
+</style>
\ No newline at end of file
diff --git a/src/views/reviewers/curriculumVitae/index.vue b/src/views/reviewers/curriculumVitae/index.vue
new file mode 100644
index 00000000..04a065fa
--- /dev/null
+++ b/src/views/reviewers/curriculumVitae/index.vue
@@ -0,0 +1,220 @@
+<template>
+  <div class="curriculumVitae">
+    <div class="leftMenu">
+      <div class="title">{{ $t('curriculumVitae:menu:title') }}</div>
+      <el-menu
+        :default-active="activeIndex"
+        class="el-menu-demo"
+        mode="vertical"
+        @select="handleSelect"
+        background-color="#eee"
+        active-text-color="#000"
+      >
+        <el-menu-item index="info">
+          {{ $t('curriculumVitae:menu:info') }}
+        </el-menu-item>
+        <el-menu-item index="summarize">{{
+          $t('curriculumVitae:menu:summarize')
+        }}</el-menu-item>
+        <el-menu-item index="specialty">
+          {{ $t('curriculumVitae:menu:specialty') }}
+        </el-menu-item>
+        <el-menu-item index="EducationalExperience">{{
+          $t('curriculumVitae:menu:EducationalExperience')
+        }}</el-menu-item>
+        <el-menu-item index="ContinuingTraining">{{
+          $t('curriculumVitae:menu:ContinuingTraining')
+        }}</el-menu-item>
+        <el-menu-item index="ScientificResearchProject">{{
+          $t('curriculumVitae:menu:ScientificResearchProject')
+        }}</el-menu-item>
+        <el-menu-item index="clinicalTrials">{{
+          $t('curriculumVitae:menu:clinicalTrials')
+        }}</el-menu-item>
+        <el-menu-item index="treatise">{{
+          $t('curriculumVitae:menu:treatise')
+        }}</el-menu-item>
+        <el-menu-item index="other">{{
+          $t('curriculumVitae:menu:other')
+        }}</el-menu-item>
+      </el-menu>
+    </div>
+    <div class="main">
+      <div class="content">
+        <div class="title">
+          <div>{{ $t('curriculumVitae:content:title') }}</div>
+          <div class="btnBox">
+            <el-button type="text">{{
+              $t('common:button:downloadTpl')
+            }}</el-button>
+            <el-button type="text">{{
+              $t('curriculumVitae:button:importResume')
+            }}</el-button>
+            <el-button type="text">{{ $t('common:button:preview') }}</el-button>
+          </div>
+        </div>
+        <div class="box" id="info" style="height: 100vh">info</div>
+        <div class="box" id="summarize" style="height: 100vh">summarize</div>
+        <div class="box" id="specialty" style="height: 100vh">specialty</div>
+      </div>
+      <div class="rightFile">
+        <!--简历附件-->
+        <curriculum />
+        <!--资历证书-->
+        <certificate />
+        <!--协议-->
+        <agreement />
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import curriculum from './components/file/curriculum.vue'
+import certificate from './components/file/certificate.vue'
+import agreement from './components/file/agreement.vue'
+export default {
+  components: { curriculum, certificate, agreement },
+  data() {
+    return {
+      activeIndex: 'info',
+      isScrollAuto: true,
+    }
+  },
+  mounted() {
+    // 监听滚动事件
+    window.addEventListener('scroll', this.onScroll)
+  },
+  destroy() {
+    // 必须移除监听器，不然当该vue组件被销毁了，监听器还在就会出错
+    window.removeEventListener('scroll', this.onScroll)
+  },
+  methods: {
+    handleSelect(key, keyPath) {
+      const navContent = document.getElementById(key)
+      if (navContent) {
+        const scrollTop = navContent.offsetTop
+        document.body.scrollTop = scrollTop
+        document.documentElement.scrollTop = scrollTop
+      }
+    },
+    onScroll() {
+      // 获取所有锚点元素
+      const navContents = document.querySelectorAll('.content .box')
+      // 所有锚点元素的 offsetTop
+      const offsetTopArr = []
+      navContents.forEach((item) => {
+        offsetTopArr.push(item.offsetTop)
+      })
+      // 获取当前文档流的 scrollTop
+      const scrollTop =
+        document.documentElement.scrollTop || document.body.scrollTop
+      // 定义当前点亮的导航下标
+      let navItem = null
+      for (let n = 0; n < offsetTopArr.length; n++) {
+        // 如果 scrollTop 大于等于第 n 个元素的 offsetTop 则说明 n-1 的内容已经完全不可见
+        // 那么此时导航索引就应该是 n 了
+        if (scrollTop >= offsetTopArr[n]) {
+          navItem = navContents[n]
+        }
+      }
+      // 把下标赋值给 vue 的 data
+      this.activeIndex = navItem.id
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+.title {
+  line-height: 50px;
+  background-color: #fff;
+  text-align: center;
+}
+.leftMenu {
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100px;
+  height: 100vh;
+  background-color: #eee;
+  border-right: 1px solid #eee;
+  ::v-deep .el-menu {
+    padding: 5px 5px 0;
+  }
+  ::v-deep .is-active {
+    background-color: #fff !important;
+    position: relative;
+    &::before {
+      display: block;
+      content: '';
+      width: 5px;
+      height: 15px;
+      background-color: #f00;
+      position: absolute;
+      left: 8px;
+      top: calc(50% - 8px);
+    }
+  }
+}
+.main {
+  width: calc(100% - 100px);
+  height: 100vh;
+  margin-left: 100px;
+  display: flex;
+  align-items: flex-start;
+}
+.content {
+  width: calc(100% - 300px);
+  padding: 0 50px 0 20px;
+  .title {
+    line-height: 50px;
+    background-color: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+}
+.rightFile {
+  width: 300px;
+  padding-right: 10px;
+  ::v-deep .title {
+    line-height: 50px;
+    background-color: #fff;
+    text-align: left;
+  }
+  ::v-deep .fileBox {
+    background-color: #eee;
+    padding: 10px;
+    font-size: 14px;
+    border-radius: 3px;
+  }
+  ::v-deep .file_title {
+    line-height: 40px;
+  }
+  ::v-deep .btnBox {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 10px;
+  }
+  ::v-deep .noData {
+    color: #909399;
+    text-align: center;
+  }
+  ::v-deep .file {
+    width: 100%;
+    display: flex;
+    margin-bottom: 10px;
+    .name {
+      width: 70%;
+      white-space: nowrap; /* 文本不会换行，会在同一行内继续，直到遇到<br>标签为止 */
+      text-overflow: ellipsis; /* 当文本溢出包含它的容器时，显示省略号(...)来表示被截断的文本 */
+      overflow: hidden; /* 隐藏溢出容器的文本 */
+    }
+    i {
+      cursor: pointer;
+      margin: 3px;
+      color: #409eff;
+    }
+  }
+}
+</style>
\ No newline at end of file