From 4b8d330703f833b158566a860b52d81c753c7dd7 Mon Sep 17 00:00:00 2001
From: wangxiaoshuang <825034831@qq.com>
Date: Thu, 25 Apr 2024 11:21:28 +0800
Subject: [PATCH] =?UTF-8?q?pm=E4=BA=BA=E5=91=98=E7=AE=A1=E7=90=86=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=E6=96=B0=E7=94=A8=E6=88=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../personnel-manage/components/staff.vue     |  20 +-
 .../components/staffExternalAdd.vue           | 246 +++++++++++-------
 .../personnel-manage/components/staffForm.vue |  60 +++--
 3 files changed, 212 insertions(+), 114 deletions(-)

diff --git a/src/views/trials/trials-panel/setting/personnel-manage/components/staff.vue b/src/views/trials/trials-panel/setting/personnel-manage/components/staff.vue
index 3634f83..3c16861 100644
--- a/src/views/trials/trials-panel/setting/personnel-manage/components/staff.vue
+++ b/src/views/trials/trials-panel/setting/personnel-manage/components/staff.vue
@@ -20,7 +20,6 @@
               :label="item.UserTypeShortName"
               :value="item.Id"
             >
-              <span>{{ item.UserType }}</span>
             </el-option>
           </el-select>
         </el-form-item>
@@ -74,14 +73,14 @@
             {{ $t('trials:staff:button:addExternalStaff') }}
           </el-button> -->
           <!-- 导出 -->
-          <el-button
+          <!-- <el-button
             type="primary"
             icon="el-icon-download"
             :disabled="list.length === 0"
             @click="handleExport"
           >
             {{ $t("common:button:export") }}
-          </el-button>
+          </el-button> -->
         </el-form-item>
       </el-form>
     </div>
@@ -241,7 +240,11 @@
     <!-- 分配参与人员模态框 -->
     <base-model v-if="staff_model.visible" :config="staff_model">
       <template slot="dialog-body">
-        <StaffForm v-if="isAdd == 'Add'" @closeDialog="closeDialog" />
+        <StaffForm
+          v-if="isAdd == 'Add'"
+          :userTypeOptions="userTypeOptions"
+          @closeDialog="closeDialog"
+        />
         <StaffExternalForm
           v-else
           @closeDialog="closeDialog"
@@ -335,6 +338,7 @@ import {
   updateTrialUser,
   trialUserListExport,
 } from "@/api/trials";
+import { getUserTypeListByUserType } from "@/api/admin";
 import Pagination from "@/components/Pagination";
 import StaffForm from "./staffForm";
 import StaffExternalForm from "./staffExternalForm";
@@ -517,8 +521,12 @@ export default {
     },
     // 获取用户类型下拉数据
     getUserType() {
-      getTrialUserTypeList().then((res) => {
-        this.userTypeOptions = res.Result;
+      getUserTypeListByUserType(0).then((res) => {
+        this.userTypeOptions = res.Result.map((item) => {
+          if ([4, 5, 8, 9, 12].includes(item.UserTypeEnum)) {
+            return item;
+          }
+        }).filter((item) => item);
       });
     },
   },
diff --git a/src/views/trials/trials-panel/setting/personnel-manage/components/staffExternalAdd.vue b/src/views/trials/trials-panel/setting/personnel-manage/components/staffExternalAdd.vue
index 27562ac..e88dd1e 100644
--- a/src/views/trials/trials-panel/setting/personnel-manage/components/staffExternalAdd.vue
+++ b/src/views/trials/trials-panel/setting/personnel-manage/components/staffExternalAdd.vue
@@ -9,63 +9,90 @@
         size="small"
       >
         <!-- 姓 -->
-        <el-form-item :label="$t('trials:externalStaff:table:lastName')" prop="LastName">
+        <el-form-item
+          :label="$t('trials:externalStaff:table:lastName')"
+          prop="LastName"
+        >
           <el-input v-model="form.LastName" />
         </el-form-item>
         <!-- 名 -->
-        <el-form-item :label="$t('trials:externalStaff:table:firstName')" prop="FirstName">
+        <el-form-item
+          :label="$t('trials:externalStaff:table:firstName')"
+          prop="FirstName"
+        >
           <el-input v-model="form.FirstName" />
         </el-form-item>
         <!-- 用户类型 -->
-        <el-form-item :label="$t('trials:externalStaff:table:userType')" prop="UserTypeId">
-          <el-select
-            v-model="form.UserTypeId"
-            style="width:100%"
-          >
+        <el-form-item
+          :label="$t('trials:externalStaff:table:userType')"
+          prop="UserTypeId"
+        >
+          <el-select v-model="form.UserTypeId" style="width: 100%">
             <el-option
               v-for="item of userTypeOptions"
               :key="item.Id"
               :label="item.UserTypeShortName"
               :value="item.Id"
             >
-              <span>{{ item.UserType }}</span>
+              <!-- <span>{{ item.UserType }}</span> -->
             </el-option>
           </el-select>
         </el-form-item>
         <!-- 电话号码 -->
-        <el-form-item :label="$t('trials:externalStaff:table:phone')" prop="Phone">
+        <el-form-item
+          :label="$t('trials:externalStaff:table:phone')"
+          prop="Phone"
+        >
           <el-input v-model="form.Phone" />
         </el-form-item>
         <!-- 邮箱 -->
-        <el-form-item :label="$t('trials:externalStaff:table:email')" prop="Email">
+        <el-form-item
+          :label="$t('trials:externalStaff:table:email')"
+          prop="Email"
+        >
           <el-input v-model="form.Email" />
         </el-form-item>
         <!-- 单位 -->
-        <el-form-item :label="$t('trials:externalStaff:table:organization')" prop="OrganizationName">
+        <el-form-item
+          :label="$t('trials:externalStaff:table:organization')"
+          prop="OrganizationName"
+        >
           <el-input v-model="form.OrganizationName" />
         </el-form-item>
       </el-form>
-      <div v-if="errorMsg" style="font-size: 12px;color: #f66;">{{ errorMsg }}</div>
+      <div v-if="errorMsg" style="font-size: 12px; color: #f66">
+        {{ errorMsg }}
+      </div>
     </template>
     <template slot="dialog-footer">
       <!-- 取消 -->
-      <el-button size="small" type="primary" :disabled="btnLoading" @click="handleCancel">
-        {{ $t('common:button:cancel') }}
+      <el-button
+        size="small"
+        type="primary"
+        :disabled="btnLoading"
+        @click="handleCancel"
+      >
+        {{ $t("common:button:cancel") }}
       </el-button>
       <!-- 保存 -->
-      <el-button size="small" type="primary" :loading="btnLoading" @click="handleSave">
-        {{ $t('common:button:save') }}
+      <el-button
+        size="small"
+        type="primary"
+        :loading="btnLoading"
+        @click="handleSave"
+      >
+        {{ $t("common:button:save") }}
       </el-button>
       <!-- 保存且发邮件 -->
-      <el-button size="small" type="primary" :loading="btnLoading" @click="handleSave('SendEmail')">
+      <!-- <el-button size="small" type="primary" :loading="btnLoading" @click="handleSave('SendEmail')">
         {{ $t('trials:externalStaff:button:saveAndSendEmail') }}
-      </el-button>
+      </el-button> -->
     </template>
   </base-model>
 </template>
 <script>
-import { addOrUpdateTrialExternalUser } from '@/api/trials'
-import BaseModel from '@/components/BaseModel'
+import { addOrUpdateTrialExternalUser } from "@/api/trials";
+import BaseModel from "@/components/BaseModel";
 
 const formDataDefault = () => {
   return {
@@ -73,142 +100,175 @@ const formDataDefault = () => {
     TrialId: null,
     LastName: null,
     FirstName: null,
-    UserTypeId: '',
+    UserTypeId: "",
     Phone: null,
     Email: null,
-    OrganizationName: null
-  }
-}
+    OrganizationName: null,
+  };
+};
 export default {
-  name: 'StaffExternalAdd',
+  name: "StaffExternalAdd",
   components: { BaseModel },
   props: {
     userTypeOptions: {
       type: Array,
-      default: function() {
-        return {}
-      }
-    }
+      default: function () {
+        return {};
+      },
+    },
   },
   data() {
     var checkPhone = (rule, value, callback) => {
-      const phoneReg = /^1[3|4|5|7|8][0-9]{9}$/
+      const phoneReg = /^1[3|4|5|7|8][0-9]{9}$/;
       if (!value) {
-        callback()
+        callback();
       }
       setTimeout(() => {
         if (!Number.isInteger(+value)) {
-          callback(new Error(this.$t('trials:externalStaff:formRule:phone')))
+          callback(new Error(this.$t("trials:externalStaff:formRule:phone")));
         } else {
           if (phoneReg.test(value)) {
-            callback()
+            callback();
           } else {
-            callback(new Error(this.$t('trials:externalStaff:formRule:phone')))
+            callback(new Error(this.$t("trials:externalStaff:formRule:phone")));
           }
         }
-      }, 100)
-    }
+      }, 100);
+    };
     var validateEmail = (rule, value, callback) => {
-      if (value === '') {
-        callback(new Error(this.$t('common:ruleMessage:specify')))
+      if (value === "") {
+        callback(new Error(this.$t("common:ruleMessage:specify")));
       } else {
-        var reg = /^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/
+        var reg =
+          /^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/;
         if (this.form.Email && reg.test(this.form.Email)) {
-          this.sendDisabled = false
-          callback()
+          this.sendDisabled = false;
+          callback();
         } else {
-          callback(new Error(this.$t('trials:externalStaff:formRule:email')))
-          this.sendDisabled = true
+          callback(new Error(this.$t("trials:externalStaff:formRule:email")));
+          this.sendDisabled = true;
         }
       }
-    }
+    };
     return {
       form: {
         Id: null,
         LastName: null,
         FirstName: null,
-        UserTypeId: '',
+        UserTypeId: "",
         Phone: null,
         Email: null,
         TrialId: null,
-        IsSendEmail: false
+        IsSendEmail: false,
       },
       rules: {
         LastName: [
-          { required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' },
-          { min: 0, max: 50, message: `${this.$t('common:ruleMessage:maxLength')} 50`, trigger: 'blur' }
+          {
+            required: true,
+            message: this.$t("common:ruleMessage:specify"),
+            trigger: "blur",
+          },
+          {
+            min: 0,
+            max: 50,
+            message: `${this.$t("common:ruleMessage:maxLength")} 50`,
+            trigger: "blur",
+          },
         ],
         FirstName: [
-          { required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' },
-          { min: 0, max: 50, message: `${this.$t('common:ruleMessage:maxLength')} 50`, trigger: 'blur' }
+          {
+            required: true,
+            message: this.$t("common:ruleMessage:specify"),
+            trigger: "blur",
+          },
+          {
+            min: 0,
+            max: 50,
+            message: `${this.$t("common:ruleMessage:maxLength")} 50`,
+            trigger: "blur",
+          },
         ],
-        UserTypeId: [{ required: true, message: this.$t('common:ruleMessage:select'), trigger: ['blur'] }],
-        Phone: [
-          { required: false, validator: checkPhone, trigger: ['blur'] }
+        UserTypeId: [
+          {
+            required: true,
+            message: this.$t("common:ruleMessage:select"),
+            trigger: ["blur"],
+          },
         ],
+        Phone: [{ required: false, validator: checkPhone, trigger: ["blur"] }],
         Email: [
-          { required: true, validator: validateEmail, trigger: ['blur'] }
-        ]
+          { required: true, validator: validateEmail, trigger: ["blur"] },
+        ],
       },
       btnLoading: false,
       userRoles: [],
       userTypeEnumInt: 0,
-      model_cfg: { visible: false, showClose: true, width: '600px', title: '', appendToBody: true },
-      trialId: '',
-      errorMsg: null
-    }
+      model_cfg: {
+        visible: false,
+        showClose: true,
+        width: "600px",
+        title: "",
+        appendToBody: true,
+      },
+      trialId: "",
+      errorMsg: null,
+    };
   },
   watch: {
     model_cfg: {
       handler(newName, oldName) {
-        this.errorMsg = null
+        this.errorMsg = null;
       },
-      deep: true
-    }
+      deep: true,
+    },
   },
   mounted() {
-    this.trialId = this.$route.query.trialId
+    this.trialId = this.$route.query.trialId;
   },
   methods: {
     openDialog(title, data) {
-      this.model_cfg.visible = true
-      this.model_cfg.title = title
+      this.model_cfg.visible = true;
+      this.model_cfg.title = title;
       if (Object.keys(data).length) {
-        this.form = { ...data }
+        this.form = { ...data };
       } else {
-        this.form = formDataDefault()
+        this.form = formDataDefault();
       }
     },
     handleSave(v) {
-      this.$refs.anonymizationFrom.validate(valid => {
+      this.$refs.anonymizationFrom.validate((valid) => {
         if (valid) {
-          this.btnLoading = true
-          this.form.TrialId = this.trialId
-          if (v === 'SendEmail') {
-            this.form.IsSendEmail = true
-            this.form.BaseUrl = `${location.protocol}//${location.host}/login`
-            this.form.RouteUrl = `${location.protocol}//${location.host}/email-recompose`
+          this.btnLoading = true;
+          this.form.TrialId = this.trialId;
+          if (v === "SendEmail") {
+            this.form.IsSendEmail = true;
+            this.form.BaseUrl = `${location.protocol}//${location.host}/login`;
+            this.form.RouteUrl = `${location.protocol}//${location.host}/email-recompose`;
           }
-          addOrUpdateTrialExternalUser(this.form).then(res => {
-            this.btnLoading = false
-            this.$message.success(this.$t('common:message:savedSuccessfully'))
-            this.model_cfg.visible = false
-            this.$emit('getList')
-          }).catch((res) => {
-            if (res.Result) {
-              this.$set(this.form, 'LastName', res.Result.LastName)
-              this.$set(this.form, 'FirstName', res.Result.FirstName)
-              this.$set(this.form, 'Phone', res.Result.Phone)
-              this.errorMsg = res.ErrorMessage
-            }
-            this.btnLoading = false
-          })
+          addOrUpdateTrialExternalUser(this.form)
+            .then((res) => {
+              this.btnLoading = false;
+              this.$message.success(
+                this.$t("common:message:savedSuccessfully")
+              );
+              this.model_cfg.visible = false;
+              this.$emit("getList");
+            })
+            .catch((res) => {
+              if (res.Result) {
+                this.$set(this.form, "LastName", res.Result.LastName);
+                this.$set(this.form, "FirstName", res.Result.FirstName);
+                this.$set(this.form, "Phone", res.Result.Phone);
+                this.errorMsg = res.ErrorMessage;
+              }
+              this.btnLoading = false;
+            });
         }
-      })
+      });
     },
     handleCancel() {
-      this.model_cfg.visible = false
-    }
-  }
-}
+      this.model_cfg.visible = false;
+    },
+  },
+};
 </script>
diff --git a/src/views/trials/trials-panel/setting/personnel-manage/components/staffForm.vue b/src/views/trials/trials-panel/setting/personnel-manage/components/staffForm.vue
index c7135c4..b39b01c 100644
--- a/src/views/trials/trials-panel/setting/personnel-manage/components/staffForm.vue
+++ b/src/views/trials/trials-panel/setting/personnel-manage/components/staffForm.vue
@@ -35,10 +35,10 @@
           class="mr"
         >
           <el-option
-            v-for="item in userTypeOptions"
-            :key="item.Id"
-            :label="item.UserTypeShortName"
-            :value="item.UserTypeEnum"
+            v-for="item of $d.UserType"
+            :key="item.id"
+            :label="item.label"
+            :value="item.value"
           >
           </el-option>
         </el-select>
@@ -60,17 +60,26 @@
         >
           {{ $t("common:button:reset") }}
         </el-button>
-
+        <!--添加新用户-->
+        <el-button
+          type="primary"
+          size="mini"
+          icon="el-icon-plus"
+          @click="handleAdd"
+          v-hasPremi="['role:pm']"
+        >
+          {{ $t("common:button:add") }}
+        </el-button>
+        <!--确认用户选择-->
         <el-button
           type="primary"
           size="mini"
           style="margin-left: auto"
           :disabled="selectArr.length === 0"
           :loading="assignLoadStatus"
-          icon="el-icon-plus"
           @click="handleAssign"
         >
-          {{ $t("common:button:add") }}
+          {{ $t("common:button:confirm") }}
         </el-button>
       </div>
     </el-header>
@@ -149,6 +158,11 @@
         @pagination="getList"
       />
     </div>
+    <staffExternalAdd
+      ref="StaffExternalAdd"
+      :userTypeOptions="userTypeOptions"
+      @getList="getList"
+    />
   </el-container>
 </template>
 <script>
@@ -158,6 +172,7 @@ import {
   getUserTypeList,
 } from "@/api/trials";
 import Pagination from "@/components/Pagination";
+import staffExternalAdd from "./staffExternalAdd.vue";
 const getListQueryDefault = () => {
   return {
     UserRealName: "",
@@ -169,7 +184,15 @@ const getListQueryDefault = () => {
   };
 };
 export default {
-  components: { Pagination },
+  components: { Pagination, staffExternalAdd },
+  props: {
+    userTypeOptions: {
+      required: true,
+      default: () => {
+        return [];
+      },
+    },
+  },
   data() {
     return {
       list: [],
@@ -178,17 +201,24 @@ export default {
       selectArr: [],
       assignLoadStatus: false,
       isAdmin: JSON.parse(zzSessionStorage.getItem("IsAdmin")),
-      userTypeOptions: [],
       trialId: "",
       qCProcessEnum: null,
     };
   },
   mounted() {
     this.trialId = this.$route.query.trialId;
-    this.getUserType();
+    // this.getUserType();
     this.getList();
   },
   methods: {
+    handleAdd() {
+      this.$nextTick(() => {
+        this.$refs["StaffExternalAdd"].openDialog(
+          this.$t("trials:externalStaff:dialogTitle:add"),
+          {}
+        );
+      });
+    },
     getList() {
       const loading = this.$loading({
         target: document.querySelector(".participant-container"),
@@ -263,11 +293,11 @@ export default {
         return false;
       }
     },
-    getUserType() {
-      getUserTypeList(2).then((res) => {
-        this.userTypeOptions = res.Result;
-      });
-    },
+    // getUserType() {
+    //   getUserTypeList(2).then((res) => {
+    //     this.userTypeOptions = res.Result;
+    //   });
+    // },
   },
 };
 </script>