RRSWithSmartHome
/
wms_vue
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

hgwms-2098 fix 用户管理弹窗修改

hwork-master
A0066811 2025-11-07 14:40:27 +08:00
parent dda045dde0
commit 84633099a9
3 changed files with 330 additions and 231 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
src/view/user/modal/edit.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<a-modal <a-modal
:open="visible" :open="visible"
title="新增用户" title="修改用户"
cancelText="取消" cancelText="取消"
okText="提交" okText="提交"
@ok="submit" @ok="submit"
@ -11,34 +11,55 @@
ref="formRef" ref="formRef"
:model="formState" :model="formState"
:rules="formRules" :rules="formRules"
:label-col="labelCol" layout="vertical"
:wrapper-col="wrapperCol"> >
<a-row :gutter="[16, 0]">
<a-col :span="12">
<a-form-item ref="nickname" label="昵称" name="nickname"> <a-form-item ref="nickname" label="昵称" name="nickname">
<a-input v-model:value="formState.nickname" /> <a-input v-model:value="formState.nickname" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="username" label="账户" name="username"> <a-form-item ref="username" label="账户" name="username">
<a-input v-model:value="formState.username" /> <a-input v-model:value="formState.username" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="email" label="邮箱" name="email"> <a-form-item ref="email" label="邮箱" name="email">
<a-input v-model:value="formState.email" /> <a-input v-model:value="formState.email" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="phone" label="电话" name="phone"> <a-form-item ref="phone" label="电话" name="phone">
<a-input v-model:value="formState.phone" /> <a-input v-model:value="formState.phone" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="性别" name="gender"> <a-form-item label="性别" name="gender">
<a-radio-group v-model:value="formState.gender"> <a-radio-group v-model:value="formState.gender">
<a-radio value="0">男</a-radio> <a-radio value="0">男</a-radio>
<a-radio value="1">女</a-radio> <a-radio value="1">女</a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="状态" name="enable"> <a-form-item label="状态" name="enable">
<a-switch v-model:checked="formState.enable" /> <a-switch v-model:checked="formState.enable" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="岗位" name="postId"> <a-form-item label="岗位" name="postId">
<a-select v-model:value="formState.postId"> <a-select v-model:value="formState.postId">
<a-select-option :value="post.id" v-bind:key="index" v-for="(post,index) in state.posts">{{post.name}}</a-select-option> <a-select-option
:value="post.id"
v-bind:key="index"
v-for="(post, index) in state.posts"
>{{ post.name }}</a-select-option
>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="部门" name="deptId"> <a-form-item label="部门" name="deptId">
<a-tree-select <a-tree-select
v-model:value="formState.deptId" v-model:value="formState.deptId"
@ -51,14 +72,18 @@
> >
</a-tree-select> </a-tree-select>
</a-form-item> </a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark"> <a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" /> <a-textarea v-model:value="formState.remark" />
</a-form-item> </a-form-item>
</a-col>
</a-row>
</a-form> </a-form>
</a-modal> </a-modal>
</template> </template>
<script> <script>
import { message } from '@hwork/ant-design-vue'; import { message } from "@hwork/ant-design-vue";
import { list } from "@/api/module/post"; import { list } from "@/api/module/post";
import { edit } from "@/api/module/user"; import { edit } from "@/api/module/user";
import { tree } from "@/api/module/dept"; import { tree } from "@/api/module/dept";
@ -70,17 +95,16 @@ export default defineComponent({
}, },
record: { record: {
type: Object, type: Object,
} },
}, },
emit: ["close"], emit: ["close"],
setup(props, context) { setup(props, context) {
const formRef = ref(); const formRef = ref();
const state = reactive({ const state = reactive({
posts: [], posts: [],
depts: [], depts: [],
}) });
const formState = reactive({ const formState = reactive({
enable: true, enable: true,
@ -88,42 +112,45 @@ export default defineComponent({
}); });
const formRules = { const formRules = {
username: [ { required: true, message: '请输入账户', trigger: 'blur'} ], username: [{ required: true, message: "请输入账户", trigger: "blur" }],
nickname: [ { required: true, message: '请输入昵称', trigger: 'blur'} ], nickname: [{ required: true, message: "请输入昵称", trigger: "blur" }],
password: [ { required: true, message: '请输入密码', trigger: 'blur'} ], password: [{ required: true, message: "请输入密码", trigger: "blur" }],
email: [ { required: true, message: '请输入邮箱', trigger: 'blur'} ], email: [{ required: true, message: "请输入邮箱", trigger: "blur" }],
phone: [ { required: true, message: '请输入电话', trigger: 'blur'} ], phone: [{ required: true, message: "请输入电话", trigger: "blur" }],
postId: [ { required: true, message: '请选择岗位', trigger: 'blur'} ], postId: [{ required: true, message: "请选择岗位", trigger: "blur" }],
deptId: [ { required: true, message: '请选择部门', trigger: 'blur'} ], deptId: [{ required: true, message: "请选择部门", trigger: "blur" }],
}; };
const loadPost = () => { const loadPost = () => {
list({}).then((response)=>{ list({}).then((response) => {
state.posts = response.data; state.posts = response.data;
}) });
} };
const loadTree = () => { const loadTree = () => {
tree({}).then((response)=>{ tree({}).then((response) => {
state.depts = response.data; state.depts = response.data;
}) });
} };
const submit = (e) => { const submit = (e) => {
formRef.value.validate().then(() => { formRef.value
edit(toRaw(formState)).then((response)=>{ .validate()
if(response.success){ .then(() => {
message.success({ content: '保存成功', duration: 1 }).then(()=>{ edit(toRaw(formState)).then((response) => {
if (response.success) {
message.success({ content: "保存成功", duration: 1 }).then(() => {
cancel(); cancel();
}); });
}else{ } else {
message.error({ content: '保存失败', duration: 1 }).then(()=>{ message.error({ content: "保存失败", duration: 1 }).then(() => {
cancel(); cancel();
}); });
} }
});
}) })
}).catch(error => { .catch((error) => {
console.log('error', error); console.log("error", error);
}); });
}; };
@ -137,7 +164,7 @@ export default defineComponent({
/// 加载部门 /// 加载部门
loadTree(); loadTree();
watch(props,(props) => { watch(props, (props) => {
formState.id = props.record.id; formState.id = props.record.id;
formState.username = props.record.username; formState.username = props.record.username;
formState.nickname = props.record.nickname; formState.nickname = props.record.nickname;
@ -148,7 +175,7 @@ export default defineComponent({
formState.deptId = props.record.deptId; formState.deptId = props.record.deptId;
formState.enable = props.record.enable; formState.enable = props.record.enable;
formState.remark = props.record.remark; formState.remark = props.record.remark;
}) });
return { return {
state, state,
@ -161,7 +188,12 @@ export default defineComponent({
labelCol: { span: 6 }, labelCol: { span: 6 },
wrapperCol: { span: 18 }, wrapperCol: { span: 18 },
replaceFields: {children:'children', title:'name', key:'id', value: 'id' } replaceFields: {
children: "children",
title: "name",
key: "id",
value: "id",
},
}; };
}, },
}); });

59
src/view/user/modal/info.vue
View File

@ -11,34 +11,55 @@
ref="formRef" ref="formRef"
:model="formState" :model="formState"
:rules="formRules" :rules="formRules"
:label-col="labelCol" layout="vertical"
:wrapper-col="wrapperCol"> >
<a-row :gutter="[16, 0]">
<a-col :span="12">
<a-form-item ref="nickname" label="昵称" name="nickname"> <a-form-item ref="nickname" label="昵称" name="nickname">
<a-input v-model:value="formState.nickname" /> <a-input v-model:value="formState.nickname" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="username" label="账户" name="username"> <a-form-item ref="username" label="账户" name="username">
<a-input v-model:value="formState.username" /> <a-input v-model:value="formState.username" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="email" label="邮箱" name="email"> <a-form-item ref="email" label="邮箱" name="email">
<a-input v-model:value="formState.email" /> <a-input v-model:value="formState.email" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="phone" label="电话" name="phone"> <a-form-item ref="phone" label="电话" name="phone">
<a-input v-model:value="formState.phone" /> <a-input v-model:value="formState.phone" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="性别" name="gender"> <a-form-item label="性别" name="gender">
<a-radio-group v-model:value="formState.gender"> <a-radio-group v-model:value="formState.gender">
<a-radio value="0">男</a-radio> <a-radio value="0">男</a-radio>
<a-radio value="1">女</a-radio> <a-radio value="1">女</a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="状态" name="enable"> <a-form-item label="状态" name="enable">
<a-switch v-model:checked="formState.enable" /> <a-switch v-model:checked="formState.enable" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="岗位" name="postId"> <a-form-item label="岗位" name="postId">
<a-select v-model:value="formState.postId"> <a-select v-model:value="formState.postId">
<a-select-option :value="post.id" v-bind:key="index" v-for="(post,index) in state.posts">{{post.name}}</a-select-option> <a-select-option
:value="post.id"
v-bind:key="index"
v-for="(post, index) in state.posts"
>{{ post.name }}</a-select-option
>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="部门" name="deptId"> <a-form-item label="部门" name="deptId">
<a-tree-select <a-tree-select
v-model:value="formState.deptId" v-model:value="formState.deptId"
@ -51,9 +72,13 @@
> >
</a-tree-select> </a-tree-select>
</a-form-item> </a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark"> <a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" /> <a-textarea v-model:value="formState.remark" />
</a-form-item> </a-form-item>
</a-col>
</a-row>
</a-form> </a-form>
</a-modal> </a-modal>
</template> </template>
@ -68,17 +93,16 @@ export default defineComponent({
}, },
record: { record: {
type: Object, type: Object,
} },
}, },
emit: ["close"], emit: ["close"],
setup(props, context) { setup(props, context) {
const formRef = ref(); const formRef = ref();
const state = reactive({ const state = reactive({
posts: [], posts: [],
depts: [], depts: [],
}) });
const formState = reactive({ const formState = reactive({
enable: true, enable: true,
@ -88,16 +112,16 @@ export default defineComponent({
const formRules = {}; const formRules = {};
const loadPost = () => { const loadPost = () => {
list({}).then((response)=>{ list({}).then((response) => {
state.posts = response.data; state.posts = response.data;
}) });
} };
const loadTree = () => { const loadTree = () => {
tree({}).then((response)=>{ tree({}).then((response) => {
state.depts = response.data; state.depts = response.data;
}) });
} };
const submit = (e) => { const submit = (e) => {
formRef.value.resetFields(); formRef.value.resetFields();
@ -114,7 +138,7 @@ export default defineComponent({
/// 加载部门 /// 加载部门
loadTree(); loadTree();
watch(props,(props) => { watch(props, (props) => {
formState.id = props.record.id; formState.id = props.record.id;
formState.username = props.record.username; formState.username = props.record.username;
formState.nickname = props.record.nickname; formState.nickname = props.record.nickname;
@ -125,7 +149,7 @@ export default defineComponent({
formState.deptId = props.record.deptId; formState.deptId = props.record.deptId;
formState.enable = props.record.enable; formState.enable = props.record.enable;
formState.remark = props.record.remark; formState.remark = props.record.remark;
}) });
return { return {
state, state,
@ -138,7 +162,12 @@ export default defineComponent({
labelCol: { span: 6 }, labelCol: { span: 6 },
wrapperCol: { span: 18 }, wrapperCol: { span: 18 },
replaceFields: {children:'children', title:'name', key:'id', value: 'id' } replaceFields: {
children: "children",
title: "name",
key: "id",
value: "id",
},
}; };
}, },
}); });

114
src/view/user/modal/save.vue
View File

@ -11,37 +11,48 @@
ref="formRef" ref="formRef"
:model="formState" :model="formState"
:rules="formRules" :rules="formRules"
:label-col="labelCol" layout="vertical"
:wrapper-col="wrapperCol"> >
<a-row :gutter="[16, 0]">
<a-col :span="12">
<a-form-item ref="nickname" label="昵称" name="nickname"> <a-form-item ref="nickname" label="昵称" name="nickname">
<a-input v-model:value="formState.nickname" /> <a-input v-model:value="formState.nickname" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="username" label="账户" name="username"> <a-form-item ref="username" label="账户" name="username">
<a-input v-model:value="formState.username" /> <a-input v-model:value="formState.username" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="password" label="密码" name="password"> <a-form-item ref="password" label="密码" name="password">
<a-input v-model:value="formState.password" /> <a-input v-model:value="formState.password" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="email" label="邮箱" name="email"> <a-form-item ref="email" label="邮箱" name="email">
<a-input v-model:value="formState.email" /> <a-input v-model:value="formState.email" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="phone" label="电话" name="phone"> <a-form-item ref="phone" label="电话" name="phone">
<a-input v-model:value="formState.phone" /> <a-input v-model:value="formState.phone" />
</a-form-item> </a-form-item>
<a-form-item label="性别" name="gender"> </a-col>
<a-radio-group v-model:value="formState.gender">
<a-radio value="0">男</a-radio> <a-col :span="12">
<a-radio value="1">女</a-radio>
</a-radio-group>
</a-form-item>
<a-form-item label="状态" name="enable">
<a-switch v-model:checked="formState.enable" />
</a-form-item>
<a-form-item label="岗位" name="postId"> <a-form-item label="岗位" name="postId">
<a-select v-model:value="formState.postId"> <a-select v-model:value="formState.postId">
<a-select-option :value="post.id" v-bind:key="index" v-for="(post,index) in state.posts">{{post.name}}</a-select-option> <a-select-option
:value="post.id"
v-bind:key="index"
v-for="(post, index) in state.posts"
>{{ post.name }}</a-select-option
>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="部门" name="deptId"> <a-form-item label="部门" name="deptId">
<a-tree-select <a-tree-select
v-model:value="formState.deptId" v-model:value="formState.deptId"
@ -54,14 +65,34 @@
> >
</a-tree-select> </a-tree-select>
</a-form-item> </a-form-item>
</a-col>
</a-row>
<a-row :gutter="[16, 0]">
<a-col :span="12">
<a-form-item label="状态" name="enable">
<a-switch v-model:checked="formState.enable" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="性别" name="gender">
<a-radio-group v-model:value="formState.gender">
<a-radio value="0">男</a-radio>
<a-radio value="1">女</a-radio>
</a-radio-group>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark"> <a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" /> <a-textarea v-model:value="formState.remark" />
</a-form-item> </a-form-item>
</a-col>
</a-row>
</a-form> </a-form>
</a-modal> </a-modal>
</template> </template>
<script> <script>
import { message } from '@hwork/ant-design-vue'; import { message } from "@hwork/ant-design-vue";
import { list } from "@/api/module/post"; import { list } from "@/api/module/post";
import { save } from "@/api/module/user"; import { save } from "@/api/module/user";
import { tree } from "@/api/module/dept"; import { tree } from "@/api/module/dept";
@ -74,13 +105,12 @@ export default defineComponent({
}, },
emit: ["close"], emit: ["close"],
setup(props, context) { setup(props, context) {
const formRef = ref(); const formRef = ref();
const state = reactive({ const state = reactive({
posts: [], posts: [],
depts: [], depts: [],
}) });
const formState = reactive({ const formState = reactive({
enable: true, enable: true,
@ -88,43 +118,46 @@ export default defineComponent({
}); });
const formRules = { const formRules = {
username: [ { required: true, message: '请输入账户', trigger: 'blur'} ], username: [{ required: true, message: "请输入账户", trigger: "blur" }],
nickname: [ { required: true, message: '请输入昵称', trigger: 'blur'} ], nickname: [{ required: true, message: "请输入昵称", trigger: "blur" }],
password: [ { required: true, message: '请输入密码', trigger: 'blur'} ], password: [{ required: true, message: "请输入密码", trigger: "blur" }],
email: [ { required: true, message: '请输入邮箱', trigger: 'blur'} ], email: [{ required: true, message: "请输入邮箱", trigger: "blur" }],
phone: [ { required: true, message: '请输入电话', trigger: 'blur'} ], phone: [{ required: true, message: "请输入电话", trigger: "blur" }],
postId: [ { required: true, message: '请选择岗位', trigger: 'blur'} ], postId: [{ required: true, message: "请选择岗位", trigger: "blur" }],
deptId: [ { required: true, message: '请选择部门', trigger: 'blur'} ], deptId: [{ required: true, message: "请选择部门", trigger: "blur" }],
tenantId: [ { required: true, message: '请选择租户', trigger: 'blur'} ] tenantId: [{ required: true, message: "请选择租户", trigger: "blur" }],
}; };
const loadPost = () => { const loadPost = () => {
list({}).then((response)=>{ list({}).then((response) => {
state.posts = response.data; state.posts = response.data;
}) });
} };
const loadTree = () => { const loadTree = () => {
tree({}).then((response)=>{ tree({}).then((response) => {
state.depts = response.data; state.depts = response.data;
}) });
} };
const submit = (e) => { const submit = (e) => {
formRef.value.validate().then(() => { formRef.value
save(toRaw(formState)).then((response)=>{ .validate()
if(response.success){ .then(() => {
message.success({ content: '保存成功', duration: 1 }).then(()=>{ save(toRaw(formState)).then((response) => {
if (response.success) {
message.success({ content: "保存成功", duration: 1 }).then(() => {
cancel(); cancel();
}); });
}else{ } else {
message.error({ content: '保存失败', duration: 1 }).then(()=>{ message.error({ content: "保存失败", duration: 1 }).then(() => {
cancel(); cancel();
}); });
} }
});
}) })
}).catch(error => { .catch((error) => {
console.log('error', error); console.log("error", error);
}); });
}; };
@ -149,7 +182,12 @@ export default defineComponent({
labelCol: { span: 6 }, labelCol: { span: 6 },
wrapperCol: { span: 18 }, wrapperCol: { span: 18 },
replaceFields: {children:'children', title:'name', key:'id', value: 'id' } replaceFields: {
children: "children",
title: "name",
key: "id",
value: "id",
},
}; };
}, },
}); });