pm人员管理增加新用户

main
wangxiaoshuang 2024-04-25 11:21:28 +08:00
parent 709a811b75
commit 4b8d330703
3 changed files with 212 additions and 114 deletions

View File

@ -20,7 +20,6 @@
:label="item.UserTypeShortName" :label="item.UserTypeShortName"
:value="item.Id" :value="item.Id"
> >
<span>{{ item.UserType }}</span>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -74,14 +73,14 @@
{{ $t('trials:staff:button:addExternalStaff') }} {{ $t('trials:staff:button:addExternalStaff') }}
</el-button> --> </el-button> -->
<!-- 导出 --> <!-- 导出 -->
<el-button <!-- <el-button
type="primary" type="primary"
icon="el-icon-download" icon="el-icon-download"
:disabled="list.length === 0" :disabled="list.length === 0"
@click="handleExport" @click="handleExport"
> >
{{ $t("common:button:export") }} {{ $t("common:button:export") }}
</el-button> </el-button> -->
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
@ -241,7 +240,11 @@
<!-- 分配参与人员模态框 --> <!-- 分配参与人员模态框 -->
<base-model v-if="staff_model.visible" :config="staff_model"> <base-model v-if="staff_model.visible" :config="staff_model">
<template slot="dialog-body"> <template slot="dialog-body">
<StaffForm v-if="isAdd == 'Add'" @closeDialog="closeDialog" /> <StaffForm
v-if="isAdd == 'Add'"
:userTypeOptions="userTypeOptions"
@closeDialog="closeDialog"
/>
<StaffExternalForm <StaffExternalForm
v-else v-else
@closeDialog="closeDialog" @closeDialog="closeDialog"
@ -335,6 +338,7 @@ import {
updateTrialUser, updateTrialUser,
trialUserListExport, trialUserListExport,
} from "@/api/trials"; } from "@/api/trials";
import { getUserTypeListByUserType } from "@/api/admin";
import Pagination from "@/components/Pagination"; import Pagination from "@/components/Pagination";
import StaffForm from "./staffForm"; import StaffForm from "./staffForm";
import StaffExternalForm from "./staffExternalForm"; import StaffExternalForm from "./staffExternalForm";
@ -517,8 +521,12 @@ export default {
}, },
// //
getUserType() { getUserType() {
getTrialUserTypeList().then((res) => { getUserTypeListByUserType(0).then((res) => {
this.userTypeOptions = res.Result; this.userTypeOptions = res.Result.map((item) => {
if ([4, 5, 8, 9, 12].includes(item.UserTypeEnum)) {
return item;
}
}).filter((item) => item);
}); });
}, },
}, },

View File

@ -9,63 +9,90 @@
size="small" 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-input v-model="form.LastName" />
</el-form-item> </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-input v-model="form.FirstName" />
</el-form-item> </el-form-item>
<!-- 用户类型 --> <!-- 用户类型 -->
<el-form-item :label="$t('trials:externalStaff:table:userType')" prop="UserTypeId"> <el-form-item
<el-select :label="$t('trials:externalStaff:table:userType')"
v-model="form.UserTypeId" prop="UserTypeId"
style="width:100%"
> >
<el-select v-model="form.UserTypeId" style="width: 100%">
<el-option <el-option
v-for="item of userTypeOptions" v-for="item of userTypeOptions"
:key="item.Id" :key="item.Id"
:label="item.UserTypeShortName" :label="item.UserTypeShortName"
:value="item.Id" :value="item.Id"
> >
<span>{{ item.UserType }}</span> <!-- <span>{{ item.UserType }}</span> -->
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </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-input v-model="form.Phone" />
</el-form-item> </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-input v-model="form.Email" />
</el-form-item> </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-input v-model="form.OrganizationName" />
</el-form-item> </el-form-item>
</el-form> </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>
<template slot="dialog-footer"> <template slot="dialog-footer">
<!-- 取消 --> <!-- 取消 -->
<el-button size="small" type="primary" :disabled="btnLoading" @click="handleCancel"> <el-button
{{ $t('common:button:cancel') }} size="small"
type="primary"
:disabled="btnLoading"
@click="handleCancel"
>
{{ $t("common:button:cancel") }}
</el-button> </el-button>
<!-- 保存 --> <!-- 保存 -->
<el-button size="small" type="primary" :loading="btnLoading" @click="handleSave"> <el-button
{{ $t('common:button:save') }} size="small"
type="primary"
:loading="btnLoading"
@click="handleSave"
>
{{ $t("common:button:save") }}
</el-button> </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') }} {{ $t('trials:externalStaff:button:saveAndSendEmail') }}
</el-button> </el-button> -->
</template> </template>
</base-model> </base-model>
</template> </template>
<script> <script>
import { addOrUpdateTrialExternalUser } from '@/api/trials' import { addOrUpdateTrialExternalUser } from "@/api/trials";
import BaseModel from '@/components/BaseModel' import BaseModel from "@/components/BaseModel";
const formDataDefault = () => { const formDataDefault = () => {
return { return {
@ -73,142 +100,175 @@ const formDataDefault = () => {
TrialId: null, TrialId: null,
LastName: null, LastName: null,
FirstName: null, FirstName: null,
UserTypeId: '', UserTypeId: "",
Phone: null, Phone: null,
Email: null, Email: null,
OrganizationName: null OrganizationName: null,
} };
} };
export default { export default {
name: 'StaffExternalAdd', name: "StaffExternalAdd",
components: { BaseModel }, components: { BaseModel },
props: { props: {
userTypeOptions: { userTypeOptions: {
type: Array, type: Array,
default: function() { default: function () {
return {} return {};
} },
} },
}, },
data() { data() {
var checkPhone = (rule, value, callback) => { 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) { if (!value) {
callback() callback();
} }
setTimeout(() => { setTimeout(() => {
if (!Number.isInteger(+value)) { if (!Number.isInteger(+value)) {
callback(new Error(this.$t('trials:externalStaff:formRule:phone'))) callback(new Error(this.$t("trials:externalStaff:formRule:phone")));
} else { } else {
if (phoneReg.test(value)) { if (phoneReg.test(value)) {
callback() callback();
} else { } 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) => { var validateEmail = (rule, value, callback) => {
if (value === '') { if (value === "") {
callback(new Error(this.$t('common:ruleMessage:specify'))) callback(new Error(this.$t("common:ruleMessage:specify")));
} else { } 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)) { if (this.form.Email && reg.test(this.form.Email)) {
this.sendDisabled = false this.sendDisabled = false;
callback() callback();
} else { } else {
callback(new Error(this.$t('trials:externalStaff:formRule:email'))) callback(new Error(this.$t("trials:externalStaff:formRule:email")));
this.sendDisabled = true this.sendDisabled = true;
}
} }
} }
};
return { return {
form: { form: {
Id: null, Id: null,
LastName: null, LastName: null,
FirstName: null, FirstName: null,
UserTypeId: '', UserTypeId: "",
Phone: null, Phone: null,
Email: null, Email: null,
TrialId: null, TrialId: null,
IsSendEmail: false IsSendEmail: false,
}, },
rules: { rules: {
LastName: [ 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: [ 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'] }], UserTypeId: [
Phone: [ {
{ required: false, validator: checkPhone, trigger: ['blur'] } required: true,
message: this.$t("common:ruleMessage:select"),
trigger: ["blur"],
},
], ],
Phone: [{ required: false, validator: checkPhone, trigger: ["blur"] }],
Email: [ Email: [
{ required: true, validator: validateEmail, trigger: ['blur'] } { required: true, validator: validateEmail, trigger: ["blur"] },
] ],
}, },
btnLoading: false, btnLoading: false,
userRoles: [], userRoles: [],
userTypeEnumInt: 0, userTypeEnumInt: 0,
model_cfg: { visible: false, showClose: true, width: '600px', title: '', appendToBody: true }, model_cfg: {
trialId: '', visible: false,
errorMsg: null showClose: true,
} width: "600px",
title: "",
appendToBody: true,
},
trialId: "",
errorMsg: null,
};
}, },
watch: { watch: {
model_cfg: { model_cfg: {
handler(newName, oldName) { handler(newName, oldName) {
this.errorMsg = null this.errorMsg = null;
},
deep: true,
}, },
deep: true
}
}, },
mounted() { mounted() {
this.trialId = this.$route.query.trialId this.trialId = this.$route.query.trialId;
}, },
methods: { methods: {
openDialog(title, data) { openDialog(title, data) {
this.model_cfg.visible = true this.model_cfg.visible = true;
this.model_cfg.title = title this.model_cfg.title = title;
if (Object.keys(data).length) { if (Object.keys(data).length) {
this.form = { ...data } this.form = { ...data };
} else { } else {
this.form = formDataDefault() this.form = formDataDefault();
} }
}, },
handleSave(v) { handleSave(v) {
this.$refs.anonymizationFrom.validate(valid => { this.$refs.anonymizationFrom.validate((valid) => {
if (valid) { if (valid) {
this.btnLoading = true this.btnLoading = true;
this.form.TrialId = this.trialId this.form.TrialId = this.trialId;
if (v === 'SendEmail') { if (v === "SendEmail") {
this.form.IsSendEmail = true this.form.IsSendEmail = true;
this.form.BaseUrl = `${location.protocol}//${location.host}/login` this.form.BaseUrl = `${location.protocol}//${location.host}/login`;
this.form.RouteUrl = `${location.protocol}//${location.host}/email-recompose` this.form.RouteUrl = `${location.protocol}//${location.host}/email-recompose`;
} }
addOrUpdateTrialExternalUser(this.form).then(res => { addOrUpdateTrialExternalUser(this.form)
this.btnLoading = false .then((res) => {
this.$message.success(this.$t('common:message:savedSuccessfully')) this.btnLoading = false;
this.model_cfg.visible = false this.$message.success(
this.$emit('getList') this.$t("common:message:savedSuccessfully")
}).catch((res) => { );
this.model_cfg.visible = false;
this.$emit("getList");
})
.catch((res) => {
if (res.Result) { if (res.Result) {
this.$set(this.form, 'LastName', res.Result.LastName) this.$set(this.form, "LastName", res.Result.LastName);
this.$set(this.form, 'FirstName', res.Result.FirstName) this.$set(this.form, "FirstName", res.Result.FirstName);
this.$set(this.form, 'Phone', res.Result.Phone) this.$set(this.form, "Phone", res.Result.Phone);
this.errorMsg = res.ErrorMessage this.errorMsg = res.ErrorMessage;
} }
this.btnLoading = false this.btnLoading = false;
}) });
} }
}) });
}, },
handleCancel() { handleCancel() {
this.model_cfg.visible = false this.model_cfg.visible = false;
} },
} },
} };
</script> </script>

View File

@ -35,10 +35,10 @@
class="mr" class="mr"
> >
<el-option <el-option
v-for="item in userTypeOptions" v-for="item of $d.UserType"
:key="item.Id" :key="item.id"
:label="item.UserTypeShortName" :label="item.label"
:value="item.UserTypeEnum" :value="item.value"
> >
</el-option> </el-option>
</el-select> </el-select>
@ -60,17 +60,26 @@
> >
{{ $t("common:button:reset") }} {{ $t("common:button:reset") }}
</el-button> </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 <el-button
type="primary" type="primary"
size="mini" size="mini"
style="margin-left: auto" style="margin-left: auto"
:disabled="selectArr.length === 0" :disabled="selectArr.length === 0"
:loading="assignLoadStatus" :loading="assignLoadStatus"
icon="el-icon-plus"
@click="handleAssign" @click="handleAssign"
> >
{{ $t("common:button:add") }} {{ $t("common:button:confirm") }}
</el-button> </el-button>
</div> </div>
</el-header> </el-header>
@ -149,6 +158,11 @@
@pagination="getList" @pagination="getList"
/> />
</div> </div>
<staffExternalAdd
ref="StaffExternalAdd"
:userTypeOptions="userTypeOptions"
@getList="getList"
/>
</el-container> </el-container>
</template> </template>
<script> <script>
@ -158,6 +172,7 @@ import {
getUserTypeList, getUserTypeList,
} from "@/api/trials"; } from "@/api/trials";
import Pagination from "@/components/Pagination"; import Pagination from "@/components/Pagination";
import staffExternalAdd from "./staffExternalAdd.vue";
const getListQueryDefault = () => { const getListQueryDefault = () => {
return { return {
UserRealName: "", UserRealName: "",
@ -169,7 +184,15 @@ const getListQueryDefault = () => {
}; };
}; };
export default { export default {
components: { Pagination }, components: { Pagination, staffExternalAdd },
props: {
userTypeOptions: {
required: true,
default: () => {
return [];
},
},
},
data() { data() {
return { return {
list: [], list: [],
@ -178,17 +201,24 @@ export default {
selectArr: [], selectArr: [],
assignLoadStatus: false, assignLoadStatus: false,
isAdmin: JSON.parse(zzSessionStorage.getItem("IsAdmin")), isAdmin: JSON.parse(zzSessionStorage.getItem("IsAdmin")),
userTypeOptions: [],
trialId: "", trialId: "",
qCProcessEnum: null, qCProcessEnum: null,
}; };
}, },
mounted() { mounted() {
this.trialId = this.$route.query.trialId; this.trialId = this.$route.query.trialId;
this.getUserType(); // this.getUserType();
this.getList(); this.getList();
}, },
methods: { methods: {
handleAdd() {
this.$nextTick(() => {
this.$refs["StaffExternalAdd"].openDialog(
this.$t("trials:externalStaff:dialogTitle:add"),
{}
);
});
},
getList() { getList() {
const loading = this.$loading({ const loading = this.$loading({
target: document.querySelector(".participant-container"), target: document.querySelector(".participant-container"),
@ -263,11 +293,11 @@ export default {
return false; return false;
} }
}, },
getUserType() { // getUserType() {
getUserTypeList(2).then((res) => { // getUserTypeList(2).then((res) => {
this.userTypeOptions = res.Result; // this.userTypeOptions = res.Result;
}); // });
}, // },
}, },
}; };
</script> </script>