diff --git a/src/views/email-recompose/index.vue b/src/views/email-recompose/index.vue
index 29f809a9..49e12126 100644
--- a/src/views/email-recompose/index.vue
+++ b/src/views/email-recompose/index.vue
@@ -180,9 +180,9 @@ export default {
     this.$i18n.locale = this.$route.query.lang
     this.setLanguage(this.$route.query.lang)
     this.$updateDictionary()
-    if (!this.password.NewUserName) {
-      this.$alert(this.$t('recompose:message:warning'))
-    }
+    // if (!this.password.NewUserName) {
+    //   this.$alert(this.$t('recompose:message:warning'))
+    // }
   },
   methods: {
     ...mapMutations({ setLanguage: 'lang/setLanguage' }),
@@ -194,8 +194,10 @@ export default {
       } else {
         this.$router.push(`/login`)
       }
-      this.$i18n.locale = 'zh'
-      this.setLanguage('zh')
+      if (!this.$i18n.locale) {
+        this.$i18n.locale = 'zh'
+        this.setLanguage('zh')
+      }
       this.$updateDictionary()
     },
     save() {
diff --git a/src/views/error.vue b/src/views/error.vue
index db3aa915..47389a41 100644
--- a/src/views/error.vue
+++ b/src/views/error.vue
@@ -2,7 +2,8 @@
   <div class="wscn-http404-container">
     <div class="wscn-http404" style="display: flex;align-items: center">
       <div class="pic-404">
-        <img class="pic-404__parent" src="@/assets/login-bg.png" alt="404">
+        <!-- <img class="pic-404__parent" src="@/assets/login-bg.png" alt="404"> -->
+        <svg-icon icon-class="login-bg" style="width: 100%; height: 100%" />
         <img class="pic-404__child left" src="@/assets/404_images/404_cloud.png" alt="404">
         <img class="pic-404__child mid" src="@/assets/404_images/404_cloud.png" alt="404">
         <img class="pic-404__child right" src="@/assets/404_images/404_cloud.png" alt="404">
@@ -56,8 +57,10 @@ export default {
   .pic-404 {
     position: relative;
     float: left;
-    width: 400px;
+    width: 500px;
+    height: 300px;
     overflow: hidden;
+    margin-right: 10px;
     &__parent {
       width: 100%;
     }
diff --git a/src/views/trials/trials-panel/attachments/enrollment/components/Approval.vue b/src/views/trials/trials-panel/attachments/enrollment/components/Approval.vue
index 5dd4dce1..88000983 100644
--- a/src/views/trials/trials-panel/attachments/enrollment/components/Approval.vue
+++ b/src/views/trials/trials-panel/attachments/enrollment/components/Approval.vue
@@ -1,14 +1,14 @@
 <template>
   <BaseContainer>
     <template slot="search-container">
-      <div style="margin-left:auto;">
+      <div style="margin-left: auto">
         <!-- Approve -->
       </div>
     </template>
     <template slot="main-container">
       <el-table
         v-loading="listLoading"
-        v-adaptive="{bottomOffset:65}"
+        v-adaptive="{ bottomOffset: 65 }"
         height="100"
         :data="list"
         class="table"
@@ -27,17 +27,26 @@
         >
           <template slot-scope="scope">
             <!-- <el-button type="text" @click="go(`/trialsResume?doctorId=${scope.row.Id}&token=${token}`)">{{ scope.row.LastName }} / {{ scope.row.FirstName }}</el-button> -->
-             <span style="color: #428bca;cursor: pointer;" @click="go(`/trialsResume?doctorId=${scope.row.Id}&trialId=${$route.query.trialId}&token=${token}`)">{{ scope.row.LastName }} / {{ scope.row.FirstName }}</span>
+            <span
+              style="color: #428bca; cursor: pointer"
+              @click="
+                go(
+                  `/trialsResume?doctorId=${scope.row.Id}&trialId=${$route.query.trialId}&token=${token}`
+                )
+              "
+              >{{ scope.row.LastName }} / {{ scope.row.FirstName }}</span
+            >
           </template>
         </el-table-column>
         <!-- Name CN -->
-        <!-- <el-table-column
+        <el-table-column
+          v-if="!isEN"
           prop="ChineseName"
           :label="$t('trials:seletctedReviews:table:nameCN')"
           show-overflow-tooltip
           min-width="120"
           sortable="custom"
-        /> -->
+        />
         <!-- ID -->
         <el-table-column
           prop="Code"
@@ -53,8 +62,12 @@
           min-width="120"
         >
           <template slot-scope="scope">
-            <el-tag v-if="scope.row.DoctorTrialState !== 5" type="primary">{{ $fd('DoctorTrialState', scope.row.DoctorTrialState) }}</el-tag>
-            <el-tag v-else type="danger">{{ $fd('DoctorTrialState', scope.row.DoctorTrialState) }}</el-tag>
+            <el-tag v-if="scope.row.DoctorTrialState !== 5" type="primary">{{
+              $fd('DoctorTrialState', scope.row.DoctorTrialState)
+            }}</el-tag>
+            <el-tag v-else type="danger">{{
+              $fd('DoctorTrialState', scope.row.DoctorTrialState)
+            }}</el-tag>
           </template>
         </el-table-column>
         <!-- Approver -->
@@ -70,19 +83,34 @@
           min-width="150"
         />
       </el-table>
-      <pagination class="page" :total="total" :page.sync="listQuery.PageIndex" :limit.sync="listQuery.PageSize" @pagination="getList" />
+      <pagination
+        class="page"
+        :total="total"
+        :page.sync="listQuery.PageIndex"
+        :limit.sync="listQuery.PageSize"
+        @pagination="getList"
+      />
     </template>
   </BaseContainer>
 </template>
 <script>
 import BaseContainer from '@/components/BaseContainer'
 import Pagination from '@/components/Pagination'
-import { getSubmissionOrApprovalReviewerList, approveReviewer } from '@/api/trials'
+import {
+  getSubmissionOrApprovalReviewerList,
+  approveReviewer,
+} from '@/api/trials'
 import store from '@/store'
 const enrollState = 4
 export default {
   name: 'Approval',
   components: { BaseContainer, Pagination },
+  props: {
+    isEN: {
+      type: Boolean,
+      default: false,
+    },
+  },
   data() {
     return {
       list: [],
@@ -93,15 +121,17 @@ export default {
         PageIndex: 1,
         PageSize: 20,
         Asc: false,
-        SortField: ''
+        SortField: '',
       },
       total: 0,
       listLoading: false,
       approveIdArr: [],
-      token: store.getters.token
+      token: store.getters.token,
     }
   },
-  created() { this.initPage() },
+  created() {
+    this.initPage()
+  },
   methods: {
     go(path) {
       window.open(path)
@@ -112,28 +142,36 @@ export default {
     getList() {
       this.listLoading = true
       this.listQuery.TrialId = this.$route.query.trialId
-      getSubmissionOrApprovalReviewerList(this.listQuery).then(res => {
-        this.listLoading = false
-        this.list = res.Result.CurrentPageData
-        this.total = res.Result.TotalCount
-      // eslint-disable-next-line handle-callback-err
-      }).catch(() => { this.listLoading = false })
+      getSubmissionOrApprovalReviewerList(this.listQuery)
+        .then((res) => {
+          this.listLoading = false
+          this.list = res.Result.CurrentPageData
+          this.total = res.Result.TotalCount
+          // eslint-disable-next-line handle-callback-err
+        })
+        .catch(() => {
+          this.listLoading = false
+        })
     },
     handleApprove() {
       // Confirm the approval?
       this.$confirm(this.$t('trials:seletctedReviews:message:msg2'), {
-        type: 'warning'
+        type: 'warning',
       }).then(() => {
         this.loading = true
         const trialId = this.$route.query.trialId
-        approveReviewer(trialId, this.approveIdArr, 1).then(res => {
-          this.loading = false
-          if (res.IsSuccess) {
-            this.getList()
-            this.$message.success(this.$t('common:message:savedSuccessfully'))
-            this.$emit('nextStep', 'confirmation')
-          }
-        }).catch(() => {this.loading = false})
+        approveReviewer(trialId, this.approveIdArr, 1)
+          .then((res) => {
+            this.loading = false
+            if (res.IsSuccess) {
+              this.getList()
+              this.$message.success(this.$t('common:message:savedSuccessfully'))
+              this.$emit('nextStep', 'confirmation')
+            }
+          })
+          .catch(() => {
+            this.loading = false
+          })
       })
     },
     handleSelectionChange(val) {
@@ -158,12 +196,16 @@ export default {
         return 'selected'
       }
     },
-    handleSelectTable(row) { return row.DoctorTrialState !== 8 },
+    handleSelectTable(row) {
+      return row.DoctorTrialState !== 8
+    },
     handleDetail(row) {
-      const { href } = this.$router.resolve({ path: `/trialsResume?doctorId=${row.Id}&trialId=${this.$route.query.trialId}` })
+      const { href } = this.$router.resolve({
+        path: `/trialsResume?doctorId=${row.Id}&trialId=${this.$route.query.trialId}`,
+      })
       window.open(href, '_blank')
-    }
-  }
+    },
+  },
 }
 </script>
 
diff --git a/src/views/trials/trials-panel/attachments/enrollment/components/Confirmation.vue b/src/views/trials/trials-panel/attachments/enrollment/components/Confirmation.vue
index e914972b..c5e3b65b 100644
--- a/src/views/trials/trials-panel/attachments/enrollment/components/Confirmation.vue
+++ b/src/views/trials/trials-panel/attachments/enrollment/components/Confirmation.vue
@@ -50,13 +50,14 @@
           </template>
         </el-table-column>
         <!-- Name CN -->
-        <!-- <el-table-column
+        <el-table-column
+          v-if="!isEN"
           prop="ChineseName"
           :label="$t('trials:seletctedReviews:table:nameCN')"
           show-overflow-tooltip
           min-width="120"
           sortable="custom"
-        /> -->
+        />
         <!-- ID -->
         <el-table-column
           prop="Code"
@@ -119,6 +120,12 @@ import store from '@/store'
 export default {
   name: 'Confirmation',
   components: { BaseContainer, Pagination },
+  props: {
+    isEN: {
+      type: Boolean,
+      default: false,
+    },
+  },
   data() {
     return {
       list: [],
diff --git a/src/views/trials/trials-panel/attachments/enrollment/components/Selection.vue b/src/views/trials/trials-panel/attachments/enrollment/components/Selection.vue
index e04ff056..b281465a 100644
--- a/src/views/trials/trials-panel/attachments/enrollment/components/Selection.vue
+++ b/src/views/trials/trials-panel/attachments/enrollment/components/Selection.vue
@@ -186,13 +186,14 @@
           </template>
         </el-table-column>
         <!-- Name CN -->
-        <!-- <el-table-column
+        <el-table-column
+          v-if="!isEN"
           prop="ChineseName"
           :label="$t('trials:seletctedReviews:table:nameCN')"
           show-overflow-tooltip
           sortable="custom"
           width="120"
-        /> -->
+        />
 
         <el-table-column
           prop="DoctorUserName"
@@ -483,6 +484,12 @@ export default {
     curriculumVitae,
   },
   dicts: ['ReadingType', 'Subspeciality', 'Position', 'Rank'],
+  props: {
+    isEN: {
+      type: Boolean,
+      default: false,
+    },
+  },
   data() {
     return {
       list: [],
diff --git a/src/views/trials/trials-panel/attachments/enrollment/components/Submission.vue b/src/views/trials/trials-panel/attachments/enrollment/components/Submission.vue
index 8b56712f..e48bfda9 100644
--- a/src/views/trials/trials-panel/attachments/enrollment/components/Submission.vue
+++ b/src/views/trials/trials-panel/attachments/enrollment/components/Submission.vue
@@ -60,13 +60,14 @@
           </template>
         </el-table-column>
         <!-- Name CN -->
-        <!-- <el-table-column
+        <el-table-column
+          v-if="!isEN"
           prop="ChineseName"
           :label="$t('trials:seletctedReviews:table:nameCN')"
           show-overflow-tooltip
           sortable="custom"
           min-width="120"
-        /> -->
+        />
         <!-- ID -->
         <el-table-column
           prop="Code"
@@ -166,6 +167,12 @@ const enrollState = 1
 export default {
   name: 'Submission',
   components: { BaseContainer, Pagination },
+  props: {
+    isEN: {
+      type: Boolean,
+      default: false,
+    },
+  },
   data() {
     return {
       list: [],
diff --git a/src/views/trials/trials-panel/attachments/enrollment/index.vue b/src/views/trials/trials-panel/attachments/enrollment/index.vue
index c1400a3c..1549030f 100644
--- a/src/views/trials/trials-panel/attachments/enrollment/index.vue
+++ b/src/views/trials/trials-panel/attachments/enrollment/index.vue
@@ -8,50 +8,83 @@
       <div v-if="trialInfo" class="trial-wrapper">
         <div class="div-row">
           <div class="div-col">
-            <label class="el-label">{{ $t('trials:trials-list:form:indication:') }}</label>
-            <span>{{$fd('Indication', trialInfo.IndicationEnum)}}{{trialInfo.Indication ? '-' + trialInfo.Indication : '' }}</span>
-          </div>
-         
-          <div class="div-col">
-            <label class="el-label">{{ $t('trials:trials-list:form:declarationType:') }}</label>
-            <el-tooltip
-              class="item"
-              :content="trialInfo.DeclarationTypeEnumList.map(v => $fd('DeclarationType', v)).join(', ')"
-              placement="top"
+            <label class="el-label">{{
+              $t('trials:trials-list:form:indication:')
+            }}</label>
+            <span
+              >{{ $fd('Indication', trialInfo.IndicationEnum)
+              }}{{
+                trialInfo.Indication ? '-' + trialInfo.Indication : ''
+              }}</span
             >
-              <span>{{ trialInfo.DeclarationTypeEnumList.map(v => $fd('DeclarationType', v)).join(', ') }}</span>
-            </el-tooltip>
-          </div>
-           <div class="div-col">
-            <label class="el-label">{{ $t('trials:trials-list:form:criterion:') }}</label>
-            <el-tooltip
-              class="item"
-              :content="(trialInfo.CriterionList && trialInfo.CriterionList.length>0)? trialInfo.CriterionList.join(', '): ''"
-              placement="top"
-            >
-              <span>{{ (trialInfo.CriterionList && trialInfo.CriterionList.length>0)? trialInfo.CriterionList.join(', '): '' }}</span>
-            </el-tooltip>
-            
-          </div>
-          <div class="div-col">
           </div>
 
+          <div class="div-col">
+            <label class="el-label">{{
+              $t('trials:trials-list:form:declarationType:')
+            }}</label>
+            <el-tooltip
+              class="item"
+              :content="
+                trialInfo.DeclarationTypeEnumList.map((v) =>
+                  $fd('DeclarationType', v)
+                ).join(', ')
+              "
+              placement="top"
+            >
+              <span>{{
+                trialInfo.DeclarationTypeEnumList.map((v) =>
+                  $fd('DeclarationType', v)
+                ).join(', ')
+              }}</span>
+            </el-tooltip>
+          </div>
+          <div class="div-col">
+            <label class="el-label">{{
+              $t('trials:trials-list:form:criterion:')
+            }}</label>
+            <el-tooltip
+              class="item"
+              :content="
+                trialInfo.CriterionList && trialInfo.CriterionList.length > 0
+                  ? trialInfo.CriterionList.join(', ')
+                  : ''
+              "
+              placement="top"
+            >
+              <span>{{
+                trialInfo.CriterionList && trialInfo.CriterionList.length > 0
+                  ? trialInfo.CriterionList.join(', ')
+                  : ''
+              }}</span>
+            </el-tooltip>
+          </div>
+          <div class="div-col"></div>
         </div>
         <div class="div-row">
           <div class="div-col">
-            <label class="el-label">{{ $t('trials:trials-list:form:expedited:') }}</label>
-            <span>{{$fd('YesOrNoForInt', trialInfo.Expedited)}}</span>
+            <label class="el-label">{{
+              $t('trials:trials-list:form:expedited:')
+            }}</label>
+            <span>{{ $fd('YesOrNoForInt', trialInfo.Expedited) }}</span>
           </div>
           <div class="div-col">
-            <label class="el-label">{{ $t('trials:trials-list:form:totalReviewers:') }}</label>
+            <label class="el-label">{{
+              $t('trials:trials-list:form:totalReviewers:')
+            }}</label>
             <span>{{ trialInfo.TotalReviewers }}</span>
           </div>
           <div class="div-col">
-            <label class="el-label">{{ $t('trials:trials-list:form:typeofReviewers:') }}</label>
-            <span>{{ trialInfo.AttendedReviewerTypeEnumList.map(v => $fd('AttendedReviewerType', v)).join(', ') }}</span>
-          </div>
-          <div class="div-col">
+            <label class="el-label">{{
+              $t('trials:trials-list:form:typeofReviewers:')
+            }}</label>
+            <span>{{
+              trialInfo.AttendedReviewerTypeEnumList.map((v) =>
+                $fd('AttendedReviewerType', v)
+              ).join(', ')
+            }}</span>
           </div>
+          <div class="div-col"></div>
         </div>
       </div>
       <div class="title">
@@ -60,7 +93,12 @@
       </div>
     </div>
     <div class="step-wrapper">
-      <el-steps :active="activeStatus" style="margin-top: 70px" align-center :space="300">
+      <el-steps
+        :active="activeStatus"
+        style="margin-top: 70px"
+        align-center
+        :space="300"
+      >
         <!-- Selection -->
         <el-step
           :title="$t('trials:seletctedReviews:timeline:selection')"
@@ -92,22 +130,26 @@
       </el-steps>
       <div class="step-content">
         <Selection
-          v-if="activeStatus===0"
+          v-if="activeStatus === 0"
+          :isEN="isEN"
           @nextStep="nextStep"
         />
         <Submission
-          v-if="activeStatus===1"
+          v-if="activeStatus === 1"
           ref="submission"
+          :isEN="isEN"
           @nextStep="nextStep"
         />
         <Approval
-          v-if="activeStatus===2"
+          v-if="activeStatus === 2"
           ref="approval"
+          :isEN="isEN"
           @nextStep="nextStep"
         />
         <Confirmation
-          v-if="activeStatus===3"
+          v-if="activeStatus === 3"
           ref="confirmation"
+          :isEN="isEN"
         />
       </div>
     </div>
@@ -127,18 +169,30 @@ export default {
       trialInfo: null,
       TrialId: '',
       activeStatus: null,
-      TrialMaxState: 0
+      TrialMaxState: 0,
     }
   },
   mounted() {
     this.TrialId = this.$route.query.trialId
     this.initPage()
   },
+  computed: {
+    isEN() {
+      return this.$i18n.locale !== 'zh'
+    },
+  },
   methods: {
     initPage() {
-      getTrialInfoAndMaxTrialState(this.TrialId).then(res => {
+      getTrialInfoAndMaxTrialState(this.TrialId).then((res) => {
         this.trialInfo = res.Result.TrialView
-        var activeStatus = res.Result.TrialMaxState < 1 ? 0 : res.Result.TrialMaxState < 5 ? 1 : res.Result.TrialMaxState < 8 ? 2 : 3
+        var activeStatus =
+          res.Result.TrialMaxState < 1
+            ? 0
+            : res.Result.TrialMaxState < 5
+            ? 1
+            : res.Result.TrialMaxState < 8
+            ? 2
+            : 3
         this.activeStatus = activeStatus
         this.TrialMaxState = activeStatus
       })
@@ -147,95 +201,93 @@ export default {
       this.activeStatus = step
     },
     nextStep(stepName) {
-      this.activeStatus = this.activeStatus === 3 ? 3 : this.activeStatus + 1;
-      if(stepName==='confirmation'){
-        this.activeStatus = 3;
+      this.activeStatus = this.activeStatus === 3 ? 3 : this.activeStatus + 1
+      if (stepName === 'confirmation') {
+        this.activeStatus = 3
       }
       this.TrialMaxState = this.activeStatus
       this.$nextTick(
-        function() {
+        function () {
           this.$refs[stepName].getList()
         }.bind(this)
       )
-    }
-
-  }
+    },
+  },
 }
 </script>
 <style lang="scss">
-  .enroll-container {
-    height: 100%;
-    padding: 0;
-    margin: 0;
+.enroll-container {
+  height: 100%;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  flex-direction: column;
+  background-color: #fff;
+  .content-wrapper {
+    height: 100px;
+  }
+  .step-wrapper {
+    flex: 1;
     display: flex;
     flex-direction: column;
-    background-color: #fff;
-    .content-wrapper{
-      height: 100px;
+  }
+  .el-steps {
+    height: 80px;
+  }
+  .step-content {
+    flex: 1;
+  }
+  .title {
+    height: 40px;
+    line-height: 40px;
+    padding-left: 5px;
+    background: #e4ebf1;
+    border-left: 3px solid #0fc8e0;
+    font-size: 13px;
+    p {
+      padding: 0;
+      margin: 0;
     }
-    .step-wrapper{
-      flex: 1;
+  }
+  .trial-wrapper {
+    height: 60px;
+    .div-row {
       display: flex;
-      flex-direction: column;
-    }
-    .el-steps{
-      height: 80px;
-    }
-    .step-content{
-      flex: 1;
-    }
-    .title {
-      height: 40px;
-      line-height: 40px;
-      padding-left: 5px;
-      background: #e4ebf1;
-      border-left: 3px solid #0fc8e0;
+      justify-content: space-between;
+      margin: 10px 20px !important;
       font-size: 13px;
-      p{
-        padding: 0;
-        margin: 0;
-      }
-    }
-    .trial-wrapper{
-      height: 60px;
-      .div-row {
-        display: flex;
-        justify-content: space-between;
-        margin: 10px 20px !important;
-        font-size: 13px;
-        .div-col {
-          flex: 1;
-          width: 100px;
-          white-space: nowrap !important;
-          text-overflow: ellipsis !important;
-          word-break: break-word !important;
-          overflow: hidden !important;
-          label {
-            font-weight: bold;
-          }
-        }
-        .div-textarea {
-          display: inline-block;
+      .div-col {
+        flex: 1;
+        width: 100px;
+        white-space: nowrap !important;
+        text-overflow: ellipsis !important;
+        word-break: break-word !important;
+        overflow: hidden !important;
+        label {
+          font-weight: bold;
         }
+      }
+      .div-textarea {
+        display: inline-block;
+      }
+    }
+  }
 
-      }
+  .underline {
+    // .el-step__title {
+    //   text-decoration: underline;
+    // }
+    .el-step__title,
+    .el-step__title.is-process,
+    .el-step__title.is-finish {
+      text-decoration: underline;
     }
-
-    .underline{
-      // .el-step__title {
-      //   text-decoration: underline;
-      // }
-      .el-step__title,
-      .el-step__title.is-process,
-      .el-step__title.is-finish {
-        text-decoration: underline;
-      }
-    }
-    .noneUnderline{
-      .el-step__title {
-        text-decoration: none;
-      }
+  }
+  .noneUnderline {
+    .el-step__title {
+      text-decoration: none;
     }
+  }
   .el-step__head.is-process,
   .el-step__title.is-process,
   .el-step__description.is-process {
@@ -261,5 +313,5 @@ export default {
   .click_cursor {
     cursor: pointer;
   }
-  }
+}
 </style>