|
|
@ -1,166 +1,199 @@ |
|
|
|
<template> |
|
|
|
<el-dialog :title="isShowDialog === 'add' ? '新增' : '修改'" model-value width="1000px" :close-on-click-modal="false" :before-close="cancel"> |
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-dialog |
|
|
|
:title="isShowDialog === 'add' ? '新增' : '修改'" |
|
|
|
model-value |
|
|
|
width="1000px" |
|
|
|
:close-on-click-modal="false" |
|
|
|
:before-close="cancel" |
|
|
|
> |
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="用户编号" prop="User-UserId"> |
|
|
|
<el-input v-model="form['User-UserId']" :disabled="isShowDialog === 'edit'" placeholder="请输入用户编号" /> |
|
|
|
<el-input |
|
|
|
v-model="form['User-UserId']" |
|
|
|
:disabled="isShowDialog === 'edit'" |
|
|
|
placeholder="请输入用户编号" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="用户名称" prop="User-Name"> |
|
|
|
<el-input v-model="form['User-Name']" placeholder="请输入用户名称" /> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="角色" prop="User-RoleId"> |
|
|
|
<el-select v-model="form['User-RoleId']" placeholder="请选择" @change="$forceUpdate()"> |
|
|
|
<el-option |
|
|
|
v-for="item in roleOptions" |
|
|
|
:key="item['Role-RoleId']" |
|
|
|
:label="item['Role-RoleName']" |
|
|
|
:value="item['Role-RoleId']" |
|
|
|
:disabled="item['Role-Status'] == 1" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="手机号码"> |
|
|
|
<el-input v-model="form['User-Phone']" placeholder="请输入手机号码" maxlength="11" /> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="邮箱"> |
|
|
|
<el-input v-model="form['User-Email']" placeholder="请输入邮箱" maxlength="50" /> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="状态"> |
|
|
|
<el-radio-group v-model="form['User-Status']"> |
|
|
|
<el-radio |
|
|
|
v-for="dict in statusOptions" |
|
|
|
:key="dict.dictValue" |
|
|
|
:label="dict.dictValue" |
|
|
|
>{{ dict.dictLabel }}</el-radio> |
|
|
|
</el-radio-group> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="关联员工" prop="User-CustCommissioner"> |
|
|
|
<el-select clearable v-model="form['User-CustCommissioner']" placeholder="请选择" > |
|
|
|
<el-option |
|
|
|
v-for="item in custCommissionerOptions" |
|
|
|
:key="item['FNumber']" |
|
|
|
:label="item['FName']" |
|
|
|
:value="item['FNumber']" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="24"> |
|
|
|
<el-form-item label="备注"> |
|
|
|
<el-input v-model="form['User-Remark']" type="textarea" placeholder="请输入内容" /> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
</el-form> |
|
|
|
<template #footer> |
|
|
|
<span class="dialog-footer"> |
|
|
|
<el-button type="primary" class="dialog-submit-button" @click="submitForm">确 定</el-button> |
|
|
|
<el-button class="dialog-cancel-button" @click="cancel">取 消</el-button> |
|
|
|
</span> |
|
|
|
</template> |
|
|
|
</el-dialog> |
|
|
|
<el-form-item label="角色" prop="User-RoleId"> |
|
|
|
<el-select |
|
|
|
v-model="form['User-RoleId']" |
|
|
|
placeholder="请选择" |
|
|
|
@change="$forceUpdate()" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in roleOptions" |
|
|
|
:key="item['Role-RoleId']" |
|
|
|
:label="item['Role-RoleName']" |
|
|
|
:value="item['Role-RoleId']" |
|
|
|
:disabled="item['Role-Status'] == 1" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="手机号码"> |
|
|
|
<el-input |
|
|
|
v-model="form['User-Phone']" |
|
|
|
placeholder="请输入手机号码" |
|
|
|
maxlength="11" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="邮箱"> |
|
|
|
<el-input |
|
|
|
v-model="form['User-Email']" |
|
|
|
placeholder="请输入邮箱" |
|
|
|
maxlength="50" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="状态"> |
|
|
|
<el-radio-group v-model="form['User-Status']"> |
|
|
|
<el-radio |
|
|
|
v-for="dict in statusOptions" |
|
|
|
:key="dict.dictValue" |
|
|
|
:label="dict.dictValue" |
|
|
|
>{{ dict.dictLabel }}</el-radio |
|
|
|
> |
|
|
|
</el-radio-group> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="关联员工" prop="User-CustCommissioner"> |
|
|
|
<el-select |
|
|
|
clearable |
|
|
|
v-model="form['User-CustCommissioner']" |
|
|
|
filterable |
|
|
|
placeholder="请选择" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in custCommissionerOptions" |
|
|
|
:key="item['FNumber']" |
|
|
|
:label="item['FName']" |
|
|
|
:value="item['FNumber']" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="24"> |
|
|
|
<el-form-item label="备注"> |
|
|
|
<el-input |
|
|
|
v-model="form['User-Remark']" |
|
|
|
type="textarea" |
|
|
|
placeholder="请输入内容" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
</el-form> |
|
|
|
<template #footer> |
|
|
|
<span class="dialog-footer"> |
|
|
|
<el-button type="primary" class="dialog-submit-button" @click="submitForm" |
|
|
|
>确 定</el-button |
|
|
|
> |
|
|
|
<el-button class="dialog-cancel-button" @click="cancel">取 消</el-button> |
|
|
|
</span> |
|
|
|
</template> |
|
|
|
</el-dialog> |
|
|
|
</template> |
|
|
|
<script> |
|
|
|
import { uplateUser, addUser, getRoles, getUser,getEmpInfo} from "@/server/system/user" |
|
|
|
import { uplateUser, addUser, getRoles, getUser, getEmpInfo } from "@/server/system/user"; |
|
|
|
export default { |
|
|
|
name: 'editField', |
|
|
|
props: { |
|
|
|
item: { |
|
|
|
default: {}, |
|
|
|
}, |
|
|
|
isShowDialog: { |
|
|
|
default: 'add' |
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
if (this.isShowDialog === 'edit') { |
|
|
|
this.handleUpdate(this.item) |
|
|
|
} |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
custCommissionerOptions:[], |
|
|
|
name: "editField", |
|
|
|
props: { |
|
|
|
item: { |
|
|
|
default: {}, |
|
|
|
}, |
|
|
|
isShowDialog: { |
|
|
|
default: "add", |
|
|
|
}, |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
if (this.isShowDialog === "edit") { |
|
|
|
this.handleUpdate(this.item); |
|
|
|
} |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
custCommissionerOptions: [], |
|
|
|
roleOptions: [], // 角色选项 |
|
|
|
statusOptions: [ // 状态数据字典 |
|
|
|
{ dictLabel: '正常', dictValue: '0' }, |
|
|
|
{ dictLabel: '停用', dictValue: '1' } |
|
|
|
], |
|
|
|
title: '添加', // 弹框标题 |
|
|
|
form: { |
|
|
|
'User-Status': '0' |
|
|
|
}, // 表单参数 |
|
|
|
rules: { // 表单校验 |
|
|
|
'User-UserId': [ |
|
|
|
{ required: true, message: '此项不能为空', trigger: 'blur' } |
|
|
|
], |
|
|
|
'User-Name': [ |
|
|
|
{ required: true, message: '此项不能为空', trigger: 'blur' } |
|
|
|
], |
|
|
|
'User-RoleId': [ |
|
|
|
{ required: true, message: '此项不能为空', trigger: 'blur' } |
|
|
|
], |
|
|
|
}, |
|
|
|
} |
|
|
|
}, |
|
|
|
created() { |
|
|
|
// 获取角色数据 |
|
|
|
getRoles().then((res) => { |
|
|
|
if (res.code === 200) { |
|
|
|
this.roleOptions = res.data || [] |
|
|
|
} |
|
|
|
}) |
|
|
|
this.getEmpInfo() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
cancel() { // 取消按钮 |
|
|
|
this.$emit('update:isShowDialog','') |
|
|
|
}, |
|
|
|
handleUpdate(row) { // 修改按钮操作 |
|
|
|
getUser(row['User-UserId']).then(({code, data = {}}) => { |
|
|
|
if (code === 200) { |
|
|
|
this.form = data |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
getEmpInfo(){ |
|
|
|
getEmpInfo().then( ({data = []} ) => { |
|
|
|
this.custCommissionerOptions = data |
|
|
|
}) |
|
|
|
statusOptions: [ |
|
|
|
// 状态数据字典 |
|
|
|
{ dictLabel: "正常", dictValue: "0" }, |
|
|
|
{ dictLabel: "停用", dictValue: "1" }, |
|
|
|
], |
|
|
|
title: "添加", // 弹框标题 |
|
|
|
form: { |
|
|
|
"User-Status": "0", |
|
|
|
}, // 表单参数 |
|
|
|
rules: { |
|
|
|
// 表单校验 |
|
|
|
"User-UserId": [{ required: true, message: "此项不能为空", trigger: "blur" }], |
|
|
|
"User-Name": [{ required: true, message: "此项不能为空", trigger: "blur" }], |
|
|
|
"User-RoleId": [{ required: true, message: "此项不能为空", trigger: "blur" }], |
|
|
|
}, |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
// 获取角色数据 |
|
|
|
getRoles().then((res) => { |
|
|
|
if (res.code === 200) { |
|
|
|
this.roleOptions = res.data || []; |
|
|
|
} |
|
|
|
}); |
|
|
|
this.getEmpInfo(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
cancel() { |
|
|
|
// 取消按钮 |
|
|
|
this.$emit("update:isShowDialog", ""); |
|
|
|
}, |
|
|
|
handleUpdate(row) { |
|
|
|
// 修改按钮操作 |
|
|
|
getUser(row["User-UserId"]).then(({ code, data = {} }) => { |
|
|
|
if (code === 200) { |
|
|
|
this.form = data; |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
getEmpInfo() { |
|
|
|
getEmpInfo().then(({ data = [] }) => { |
|
|
|
this.custCommissionerOptions = data; |
|
|
|
}); |
|
|
|
}, |
|
|
|
submitForm() { |
|
|
|
// 提交按钮 |
|
|
|
this.$refs["form"].validate((valid) => { |
|
|
|
if (valid) { |
|
|
|
if (this.isShowDialog === "edit") { |
|
|
|
uplateUser(this.form).then((res) => { |
|
|
|
if (res.code === 200) { |
|
|
|
this.msgSuccess("修改成功"); |
|
|
|
this.$emit("editCallBack"); |
|
|
|
} |
|
|
|
}); |
|
|
|
} else { |
|
|
|
addUser(this.form).then((res) => { |
|
|
|
if (res.code === 200) { |
|
|
|
this.msgSuccess("新增成功"); |
|
|
|
this.$emit("editCallBack"); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
submitForm() { // 提交按钮 |
|
|
|
this.$refs['form'].validate(valid => { |
|
|
|
if (valid) { |
|
|
|
if (this.isShowDialog === 'edit') { |
|
|
|
uplateUser(this.form).then(res => { |
|
|
|
if (res.code === 200) { |
|
|
|
this.msgSuccess('修改成功') |
|
|
|
this.$emit('editCallBack') |
|
|
|
} |
|
|
|
}) |
|
|
|
} else { |
|
|
|
addUser(this.form).then(res => { |
|
|
|
if (res.code === 200) { |
|
|
|
this.msgSuccess('新增成功') |
|
|
|
this.$emit('editCallBack') |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |