激活码新增查看功能

src/views/trials/trials-list/components/activate-project.vue

@@ -1,26 +1,11 @@
 <template>
-  <el-dialog
-    v-dialogDrag
-    :visible.sync="visible"
-    :close-on-click-modal="false"
-    :title="$t('trials:trials-list:action:activateProject')"
-    width="500px"
-    append-to-body
-    :before-close="handleCancel"
-  >
-    <el-form
-      ref="activateProjectForm"
-      :model="form"
-      :rules="rules"
-      size="small"
-      label-width="120px"
-    >
+  <el-dialog v-dialogDrag :visible.sync="visible" :close-on-click-modal="false"
+    :title="$t('trials:trials-list:action:activateProject')" width="500px" append-to-body :before-close="handleCancel">
+    <el-form ref="activateProjectForm" :model="form" :rules="rules" size="small" label-width="120px">
       <div class="base-dialog-body">
         <p class="title">{{ $t("trials:activate:ApplyMessage") }}</p>
         <!-- 单位名称 -->
-        <el-form-item
-          :label="$t('trials:trials-list:activate:organizationName')"
-        >
+        <el-form-item :label="$t('trials:trials-list:activate:organizationName')">
           <span>{{ form.HospitalName }}</span>
         </el-form-item>
         <!-- 项目编号 -->
@@ -28,9 +13,7 @@
           <span>{{ form.TrialCode }}</span>
         </el-form-item>
         <!-- 评估标准 -->
-        <el-form-item
-          :label="$t('trials:trials-list:activate:evaluationCriteria')"
-        >
+        <el-form-item :label="$t('trials:trials-list:activate:evaluationCriteria')">
           <span>{{
             form.CriterionTypeList.map((item) =>
               $fd("CriterionType", Number(item))
@@ -38,16 +21,9 @@
           }}</span>
         </el-form-item>
         <!-- 购买时长 -->
-        <el-form-item
-          :label="$t('trials:trials-list:activate:purchaseDuration')"
-        >
-          <el-input-number
-            v-model="form.PurchaseDuration"
-            @change="handleChange"
-            :min="0"
-            :max="100"
-            step-strictly
-          ></el-input-number>
+        <el-form-item :label="$t('trials:trials-list:activate:purchaseDuration')">
+          <el-input-number v-model="form.PurchaseDuration" @change="handleChange" :min="0" :max="100"
+            step-strictly></el-input-number>
         </el-form-item>
         <!-- 授权码 -->
         <el-form-item :label="$t('trials:trials-list:form:authorizationCode')">
@@ -58,47 +34,26 @@
             <span class="copy" @click.stop="copy">{{
               $t("trials:trials-list:action:copy")
             }}</span>
-            <span
-              class="copy"
-              style="margin-left: 10px"
-              @click.stop="getCode"
-              >{{ $t("trials:reading:button:download") }}</span
-            >
+            <span class="copy" style="margin-left: 10px" @click.stop="getCode">{{ $t("trials:reading:button:download")
+            }}</span>
+            <span class="copy" style="margin-left: 10px" @click.stop="view">{{
+              $t("trials:trials-list:action:view")
+            }}</span>
           </p>
         </el-form-item>
         <!-- 激活码 -->
-        <el-form-item
-          :label="$t('trials:trials-list:form:activateCode')"
-          prop="Activate"
-        >
+        <el-form-item :label="$t('trials:trials-list:form:activateCode')" prop="Activate">
           <el-input v-model="form.Activate" :disabled="isActivate" />
-          <input
-            type="file"
-            id="uploadFileInp"
-            @change="uploadFile"
-            style="display: none"
-          />
-          <label
-            class="copy"
-            style="margin-left: 10px"
-            for="uploadFileInp"
-            v-if="!isActivate"
-            >{{ $t("trials:activate:button:upload") }}</label
-          >
-          <span
-            v-if="form.Activate"
-            class="copy"
-            @click.stop="getActivationCodeInfo"
-            style="margin-left: 10px"
-            >{{ $t("trials:reviewTrack:impactList:save") }}</span
-          >
+          <input type="file" id="uploadFileInp" @change="uploadFile" style="display: none" />
+          <label class="copy" style="margin-left: 10px" for="uploadFileInp" v-if="!isActivate">{{
+            $t("trials:activate:button:upload") }}</label>
+          <span v-if="form.Activate" class="copy" @click.stop="getActivationCodeInfo" style="margin-left: 10px">{{
+            $t("trials:reviewTrack:impactList:save") }}</span>
         </el-form-item>
         <div v-if="isActivate">
           <p class="title">{{ $t("trials:activate:Message") }}</p>
           <!-- 单位名称 -->
-          <el-form-item
-            :label="$t('trials:trials-list:activate:organizationName')"
-          >
+          <el-form-item :label="$t('trials:trials-list:activate:organizationName')">
             <span>{{ ActivateData.HospitalName }}</span>
           </el-form-item>
           <!-- 项目编号 -->
@@ -106,9 +61,7 @@
             <span>{{ ActivateData.TrialCode }}</span>
           </el-form-item>
           <!-- 评估标准 -->
-          <el-form-item
-            :label="$t('trials:trials-list:activate:evaluationCriteria')"
-          >
+          <el-form-item :label="$t('trials:trials-list:activate:evaluationCriteria')">
             <span>{{
               ActivateData.CriterionTypeList.map((item) =>
                 $fd("CriterionType", Number(item))
@@ -116,35 +69,19 @@
             }}</span>
           </el-form-item>
           <!-- 授权时长 -->
-          <el-form-item
-            :label="$t('trials:trials-list:activate:durationAuthorized')"
-          >
+          <el-form-item :label="$t('trials:trials-list:activate:durationAuthorized')">
             <span>{{ ActivateData.PurchaseDuration }}</span>
           </el-form-item>
         </div>
       </div>
-      <div
-        class="base-dialog-footer"
-        style="text-align: right; margin-top: 10px"
-      >
+      <div class="base-dialog-footer" style="text-align: right; margin-top: 10px">
         <el-form-item>
           <!-- 取消 -->
-          <el-button
-            :disabled="btnLoading"
-            size="small"
-            type="primary"
-            @click="handleCancel"
-          >
+          <el-button :disabled="btnLoading" size="small" type="primary" @click="handleCancel">
             {{ $t("common:button:cancel") }}
           </el-button>
           <!-- 保存 -->
-          <el-button
-            size="small"
-            type="primary"
-            :disabled="!isActivate"
-            :loading="btnLoading"
-            @click="handleSave"
-          >
+          <el-button size="small" type="primary" :disabled="!isActivate" :loading="btnLoading" @click="handleSave">
             {{ $t("trials:trials-list:action:activate") }}
           </el-button>
         </el-form-item>
@@ -222,6 +159,11 @@ export default {
     }
   },
   methods: {
+    view() {
+      return this.$alert(`${this.form.HospitalCode}<br>${this.form.HospitalName}<br>${this.form.TrialId}<br>${this.form.TrialCode}<br>${this.form.CriterionTypeList}<br>${this.form.CreateUserId}`, this.$t("trials:trials-list:form:authorizationCode:view"), {
+        dangerouslyUseHTMLString: true
+      })
+    },
     handleCancel() {
       this.$emit("update:visible", false);
     },
@@ -360,32 +302,38 @@ export default {
   padding-bottom: 10px;
   padding-top: 0;
 }
+
 .Authorization {
-  width: 70%;
+  width: 65%;
   display: inline-block;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+
 .el-form-item__content {
   .el-input {
     width: 60%;
   }
 }
+
 .copy {
   cursor: pointer;
   color: #409eff;
 }
+
 .AuthorizationBox {
   padding: 0;
   margin: 0;
   display: flex;
   align-items: center;
 }
+
 .title {
   font-size: 16px;
   font-weight: bold;
 }
+
 ::v-deep .el-form-item__label {
   font-weight: bold;
 }