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:32:00 +08:00
parent 82a5263854
commit dda045dde0
3 changed files with 162 additions and 122 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

123
src/view/dept/modal/edit.vue
View File

@ -8,14 +8,14 @@
@cancel="cancel" @cancel="cancel"
> >
<a-form <a-form
ref="formRef" ref="formRef"
:model="formState" :model="formState"
:rules="formRules" :rules="formRules"
:label-col="labelCol" layout="vertical"
:wrapper-col="wrapperCol"
> >
<!-- 当前部门为根部门, 则不提供上级部门选择 --> <a-col :span="12" v-if="formState.parent != 0">
<a-form-item label="上级" name="parent" v-if="formState.parent != 0 "> <!-- 当前部门为根部门, 则不提供上级部门选择 -->
<a-form-item label="上级" name="parent">
<a-tree-select <a-tree-select
v-model:value="formState.parent" v-model:value="formState.parent"
style="width: 100%" style="width: 100%"
@ -26,27 +26,38 @@
:replaceFields="replaceFields" :replaceFields="replaceFields"
> >
</a-tree-select> </a-tree-select>
</a-form-item> </a-form-item>
<a-form-item ref="name" label="名称" name="name"> </a-col>
<a-input v-model:value="formState.name" /> <a-col :span="24">
</a-form-item> <a-form-item ref="name" label="名称" name="name">
<a-form-item ref="sort" label="排序" name="sort"> <a-input v-model:value="formState.name" />
<a-input-number v-model:value="formState.sort" /> </a-form-item>
</a-form-item> </a-col>
<a-form-item label="状态" name="state"> <a-col :span="24">
<a-switch v-model:checked="formState.enable" /> <a-form-item ref="sort" label="排序" name="sort">
</a-form-item> <a-input-number style="width: 100%" v-model:value="formState.sort" />
<a-form-item ref="address" label="地址" name="address"> </a-form-item>
<a-input v-model:value="formState.address" /> </a-col>
</a-form-item> <a-col :span="24">
<a-form-item label="备注" name="remark"> <a-form-item ref="address" label="地址" name="address">
<a-textarea v-model:value="formState.remark" /> <a-input v-model:value="formState.address" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="状态" name="state">
<a-switch v-model:checked="formState.enable" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" />
</a-form-item>
</a-col>
</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 { edit, tree } from "@/api/module/dept"; import { edit, tree } from "@/api/module/dept";
import { defineComponent, reactive, ref, toRaw, watch } from "vue"; import { defineComponent, reactive, ref, toRaw, watch } from "vue";
export default defineComponent({ export default defineComponent({
@ -56,14 +67,13 @@ export default defineComponent({
}, },
record: { record: {
type: Object, type: Object,
} },
}, },
emit: ["close"], emit: ["close"],
setup(props, context) { setup(props, context) {
const state = reactive({ const state = reactive({
depts: [], depts: [],
}) });
const formRef = ref(); const formRef = ref();
@ -72,40 +82,42 @@ export default defineComponent({
enable: true, enable: true,
}); });
watch(props,(props) => { watch(props, (props) => {
formState.id = props.record.id formState.id = props.record.id;
formState.name = props.record.name formState.name = props.record.name;
formState.sort = props.record.sort formState.sort = props.record.sort;
formState.parent = props.record.parent formState.parent = props.record.parent;
formState.remark = props.record.remark formState.remark = props.record.remark;
formState.enable = props.record.enable formState.enable = props.record.enable;
formState.address = props.record.address formState.address = props.record.address;
}) });
const formRules = { const formRules = {
name: [ { required: true, message: '请输入部门名称', trigger: 'blur'} ], name: [{ required: true, message: "请输入部门名称", trigger: "blur" }],
address: [ { required: true, message: '请输入详细地址', trigger: 'blur'} ], address: [{ required: true, message: "请输入详细地址", trigger: "blur" }],
parent: [ { required: true, message: '请选择上级部门', trigger: 'change'} ] parent: [
{ required: true, message: "请选择上级部门", trigger: "change" },
],
}; };
const submit = (e) => { const submit = (e) => {
formRef.value formRef.value
.validate() .validate()
.then(() => { .then(() => {
edit(toRaw(formState)).then((response)=>{ edit(toRaw(formState)).then((response) => {
if(response.success){ if (response.success) {
message.success({ content: '保存成功', duration: 1 }).then(()=>{ message.success({ content: "保存成功", duration: 1 }).then(() => {
cancel(); cancel();
}); });
}else{ } else {
message.success({ content: '保存失败', duration: 1 }).then(()=>{ message.success({ content: "保存失败", duration: 1 }).then(() => {
cancel(); cancel();
}); });
} }
}); });
}) })
.catch(error => { .catch((error) => {
console.log('error', error); console.log("error", error);
}); });
}; };
@ -115,10 +127,10 @@ export default defineComponent({
}; };
const loadTree = () => { const loadTree = () => {
tree({}).then((response)=>{ tree({}).then((response) => {
state.depts = response.data; state.depts = response.data;
}) });
} };
/// 加载部门 /// 加载部门
loadTree(); loadTree();
@ -134,7 +146,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",
},
}; };
}, },
}); });

15
src/view/dept/modal/info.vue
View File

@ -11,11 +11,11 @@
ref="formRef" ref="formRef"
:model="formState" :model="formState"
:rules="formRules" :rules="formRules"
:label-col="labelCol" layout="vertical"
:wrapper-col="wrapperCol"
> >
<a-col :span="12" v-if="formState.parent != 0 ">
<!-- 当前部门为根部门, 则不提供上级部门选择 --> <!-- 当前部门为根部门, 则不提供上级部门选择 -->
<a-form-item label="上级" name="parent" v-if="formState.parent != 0 "> <a-form-item label="上级" name="parent" >
<a-tree-select <a-tree-select
v-model:value="formState.parent" v-model:value="formState.parent"
style="width: 100%" style="width: 100%"
@ -27,18 +27,19 @@
> >
</a-tree-select> </a-tree-select>
</a-form-item> </a-form-item>
</a-col>
<a-form-item ref="name" label="名称" name="name"> <a-form-item ref="name" label="名称" name="name">
<a-input v-model:value="formState.name" /> <a-input v-model:value="formState.name" />
</a-form-item> </a-form-item>
<a-form-item ref="sort" label="排序" name="sort"> <a-form-item ref="sort" label="排序" name="sort">
<a-input-number v-model:value="formState.sort" /> <a-input-number style="width: 100%" v-model:value="formState.sort" />
</a-form-item>
<a-form-item label="状态" name="state">
<a-switch v-model:checked="formState.enable" />
</a-form-item> </a-form-item>
<a-form-item ref="address" label="地址" name="address"> <a-form-item ref="address" label="地址" name="address">
<a-input v-model:value="formState.address" /> <a-input v-model:value="formState.address" />
</a-form-item> </a-form-item>
<a-form-item label="状态" name="state">
<a-switch v-model:checked="formState.enable" />
</a-form-item>
<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>

126
src/view/dept/modal/save.vue
View File

@ -8,44 +8,60 @@
@cancel="cancel" @cancel="cancel"
> >
<a-form <a-form
ref="formRef" ref="formRef"
:model="formState" :model="formState"
:rules="formRules" :rules="formRules"
:label-col="labelCol" layout="vertical"
:wrapper-col="wrapperCol"
> >
<a-form-item label="上级" name="parent"> <a-row :gutter="[16, 0]">
<a-tree-select <a-col :span="12">
v-model:value="formState.parent" <a-form-item label="上级" name="parent">
style="width: 100%" <a-tree-select
:tree-data="state.depts" v-model:value="formState.parent"
placeholder="所属部门" style="width: 100%"
replace :tree-data="state.depts"
tree-default-expand-all placeholder="所属部门"
:replaceFields="replaceFields" replace
> tree-default-expand-all
</a-tree-select> :replaceFields="replaceFields"
</a-form-item> >
<a-form-item ref="name" label="名称" name="name"> </a-tree-select>
<a-input v-model:value="formState.name" /> </a-form-item>
</a-form-item> </a-col>
<a-form-item ref="sort" label="排序" name="sort"> <a-col :span="12">
<a-input-number v-model:value="formState.sort" /> <a-form-item ref="name" label="名称" name="name">
</a-form-item> <a-input v-model:value="formState.name" />
<a-form-item label="状态" name="state"> </a-form-item>
<a-switch v-model:checked="formState.enable" /> </a-col>
</a-form-item> <a-col :span="12">
<a-form-item ref="address" label="地址" name="address"> <a-form-item ref="sort" label="排序" name="sort">
<a-input v-model:value="formState.address" /> <a-input-number
</a-form-item> style="width: 100%"
<a-form-item label="备注" name="remark"> v-model:value="formState.sort"
<a-textarea v-model:value="formState.remark" /> />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<a-form-item ref="address" label="地址" name="address">
<a-input v-model:value="formState.address" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="状态" name="state">
<a-switch v-model:checked="formState.enable" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" name="remark">
<a-textarea v-model:value="formState.remark" />
</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 { save, tree } from "@/api/module/dept"; import { save, tree } from "@/api/module/dept";
import { defineComponent, reactive, ref, toRaw } from "vue"; import { defineComponent, reactive, ref, toRaw } from "vue";
export default defineComponent({ export default defineComponent({
@ -56,10 +72,9 @@ export default defineComponent({
}, },
emit: ["close"], emit: ["close"],
setup(props, context) { setup(props, context) {
const state = reactive({ const state = reactive({
depts: [], depts: [],
}) });
const formRef = ref(); const formRef = ref();
@ -69,29 +84,31 @@ export default defineComponent({
}); });
const formRules = { const formRules = {
name: [ { required: true, message: '请输入部门名称', trigger: 'blur'} ], name: [{ required: true, message: "请输入部门名称", trigger: "blur" }],
address: [ { required: true, message: '请输入详细地址', trigger: 'blur'} ], address: [{ required: true, message: "请输入详细地址", trigger: "blur" }],
parent: [ { required: true, message: '请选择上级部门', trigger: 'change'} ] parent: [
{ required: true, message: "请选择上级部门", trigger: "change" },
],
}; };
const submit = (e) => { const submit = (e) => {
formRef.value formRef.value
.validate() .validate()
.then(() => { .then(() => {
save(toRaw(formState)).then((response)=>{ save(toRaw(formState)).then((response) => {
if(response.success){ if (response.success) {
message.success({ content: '保存成功', duration: 1 }).then(()=>{ message.success({ content: "保存成功", duration: 1 }).then(() => {
cancel(); cancel();
}); });
}else{ } else {
message.success({ content: '保存失败', duration: 1 }).then(()=>{ message.success({ content: "保存失败", duration: 1 }).then(() => {
cancel(); cancel();
}); });
} }
}); });
}) })
.catch(error => { .catch((error) => {
console.log('error', error); console.log("error", error);
}); });
}; };
@ -101,10 +118,10 @@ export default defineComponent({
}; };
const loadTree = () => { const loadTree = () => {
tree({}).then((response)=>{ tree({}).then((response) => {
state.depts = response.data; state.depts = response.data;
}) });
} };
/// 加载部门 /// 加载部门
loadTree(); loadTree();
@ -120,7 +137,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",
},
}; };
}, },
}); });