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"
: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);
});
},
},

View File

@ -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>

View File

@ -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>