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:48:53 +08:00
parent 84633099a9
commit f907724c24
4 changed files with 169 additions and 146 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
src/view/role/modal/edit.vue
View File

@ -11,29 +11,40 @@
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="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-col>
<a-col :span="12">
<a-form-item ref="code" label="标识" name="code"> <a-form-item ref="code" label="标识" name="code">
<a-input v-model:value="formState.code" /> <a-input v-model:value="formState.code" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<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>
</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="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 { edit } from "@/api/module/role"; import { edit } from "@/api/module/role";
import { defineComponent, reactive, ref, toRaw, watch } from "vue"; import { defineComponent, reactive, ref, toRaw, watch } from "vue";
export default defineComponent({ export default defineComponent({
@ -43,51 +54,46 @@ 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 formState = reactive({}); const formState = reactive({});
const formRules = { const formRules = {
name: [ name: [{ required: true, message: "请输入名称", trigger: "blur" }],
{ required: true, message: '请输入名称', trigger: 'blur'}, code: [{ required: true, message: "请输入标识", trigger: "blur" }],
],
code: [
{ required: true, message: '请输入标识', trigger: 'blur'},
]
}; };
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.code = props.record.code; formState.code = props.record.code;
formState.sort = props.record.sort; formState.sort = props.record.sort;
formState.enable = props.record.enable; formState.enable = props.record.enable;
formState.remark = props.record.remark; formState.remark = props.record.remark;
}) });
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);
}); });
}; };

53
src/view/role/modal/give.vue
View File

@ -1,12 +1,5 @@
<template> <template>
<a-modal <a-drawer :open="visible" title="权限配置" style="padding: 0 8px">
:open="visible"
title="权限配置"
cancelText="取消"
okText="保存"
@ok="submit"
@cancel="cancel"
>
<a-tabs v-model:activeKey="state.active"> <a-tabs v-model:activeKey="state.active">
<a-tab-pane key="1" tab="菜单权限"> <a-tab-pane key="1" tab="菜单权限">
<a-tree <a-tree
@ -23,11 +16,13 @@
<a-select-option value="ALL">全部</a-select-option> <a-select-option value="ALL">全部</a-select-option>
<a-select-option value="SELF">仅自己</a-select-option> <a-select-option value="SELF">仅自己</a-select-option>
<a-select-option value="DEPT">所在部门</a-select-option> <a-select-option value="DEPT">所在部门</a-select-option>
<a-select-option value="DEPT_CHILD">所在部门及下级部门</a-select-option> <a-select-option value="DEPT_CHILD"
>所在部门及下级部门</a-select-option
>
<a-select-option value="CUSTOM">自定义数据</a-select-option> <a-select-option value="CUSTOM">自定义数据</a-select-option>
</a-select> </a-select>
<br/> <br />
<br/> <br />
<a-tree <a-tree
checkable checkable
show-line="true" show-line="true"
@ -38,7 +33,11 @@
/> />
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
</a-modal> <template #footer>
<a-button @click="cancel">取消</a-button>
<a-button type="primary" @click="submit">保存</a-button>
</template>
</a-drawer>
</template> </template>
<script> <script>
import { message } from "@hwork/ant-design-vue"; import { message } from "@hwork/ant-design-vue";
@ -58,7 +57,6 @@ export default defineComponent({
}, },
emit: ["close"], emit: ["close"],
setup(props, context) { setup(props, context) {
const scope = ref("ALL"); const scope = ref("ALL");
const state = reactive({ const state = reactive({
@ -66,8 +64,8 @@ export default defineComponent({
powers: [], powers: [],
active: "1", active: "1",
showDept: false, showDept: false,
checkedPowerIds: {checked:[]}, checkedPowerIds: { checked: [] },
checkedDeptIds: {checked:[]}, checkedDeptIds: { checked: [] },
powerReplaceFields: { key: "id" }, powerReplaceFields: { key: "id" },
deptReplaceFields: { key: "id", title: "name" }, deptReplaceFields: { key: "id", title: "name" },
}); });
@ -86,13 +84,13 @@ export default defineComponent({
/// 监听数据 /// 监听数据
watch(scope, (scope) => { watch(scope, (scope) => {
if(scope === "CUSTOM") { if (scope === "CUSTOM") {
state.showDept = true; state.showDept = true;
} else { } else {
state.checkedDeptIds = []; state.checkedDeptIds = [];
state.showDept = false; state.showDept = false;
} }
}) });
/// 监听数据 /// 监听数据
watch(props, (props) => { watch(props, (props) => {
@ -104,12 +102,12 @@ export default defineComponent({
state.checkedPowerIds = powerIds; state.checkedPowerIds = powerIds;
}); });
let deptIds = []; let deptIds = [];
dept({ roleId: props.record.id}).then((response) => { dept({ roleId: props.record.id }).then((response) => {
response.data.forEach((element) => { response.data.forEach((element) => {
deptIds.push(element.id); deptIds.push(element.id);
}) });
state.checkedDeptIds = deptIds; state.checkedDeptIds = deptIds;
}) });
scope.value = props.record.scope; scope.value = props.record.scope;
}); });
@ -120,9 +118,13 @@ export default defineComponent({
give({ give({
scope: scope.value, scope: scope.value,
roleId: props.record.id, roleId: props.record.id,
powerIds: state.checkedPowerIds.checked?state.checkedPowerIds.checked:state.checkedPowerIds, powerIds: state.checkedPowerIds.checked
deptIds: state.checkedDeptIds.checked?state.checkedDeptIds.checked:state.checkedDeptIds }).then( ? state.checkedPowerIds.checked
(response) => { : state.checkedPowerIds,
deptIds: state.checkedDeptIds.checked
? state.checkedDeptIds.checked
: state.checkedDeptIds,
}).then((response) => {
if (response.success) { if (response.success) {
message.success({ content: "保存成功", duration: 1 }).then(() => { message.success({ content: "保存成功", duration: 1 }).then(() => {
cancel(); cancel();
@ -132,8 +134,7 @@ export default defineComponent({
cancel(); cancel();
}); });
} }
} });
);
}; };
const cancel = (e) => { const cancel = (e) => {
@ -145,7 +146,7 @@ export default defineComponent({
state, state,
submit, submit,
cancel, cancel,
SHOW_PARENT SHOW_PARENT,
}; };
}, },
}); });

24
src/view/role/modal/info.vue
View File

@ -11,24 +11,35 @@
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="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-col>
<a-col :span="12">
<a-form-item ref="code" label="标识" name="code"> <a-form-item ref="code" label="标识" name="code">
<a-input v-model:value="formState.code" /> <a-input v-model:value="formState.code" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<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>
</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="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>
@ -41,25 +52,24 @@ 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 formState = reactive({}); const formState = reactive({});
const formRules = {}; const formRules = {};
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.code = props.record.code; formState.code = props.record.code;
formState.sort = props.record.sort; formState.sort = props.record.sort;
formState.enable = props.record.enable; formState.enable = props.record.enable;
formState.remark = props.record.remark; formState.remark = props.record.remark;
}) });
const cancel = (e) => { const cancel = (e) => {
formRef.value.resetFields(); formRef.value.resetFields();

42
src/view/role/modal/save.vue
View File

@ -11,29 +11,40 @@
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="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-col>
<a-col :span="12">
<a-form-item ref="code" label="标识" name="code"> <a-form-item ref="code" label="标识" name="code">
<a-input v-model:value="formState.code" /> <a-input v-model:value="formState.code" />
</a-form-item> </a-form-item>
</a-col>
<a-col :span="12">
<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>
</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="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 { save } from "@/api/module/role"; import { save } from "@/api/module/role";
import { defineComponent, reactive, ref, toRaw } from "vue"; import { defineComponent, reactive, ref, toRaw } from "vue";
export default defineComponent({ export default defineComponent({
@ -44,7 +55,6 @@ export default defineComponent({
}, },
emit: ["close"], emit: ["close"],
setup(props, context) { setup(props, context) {
const formRef = ref(); const formRef = ref();
const formState = reactive({ const formState = reactive({
@ -53,32 +63,28 @@ export default defineComponent({
}); });
const formRules = { const formRules = {
name: [ name: [{ required: true, message: "请输入名称", trigger: "blur" }],
{ required: true, message: '请输入名称', trigger: 'blur'}, code: [{ required: true, message: "请输入标识", trigger: "blur" }],
],
code: [
{ required: true, message: '请输入标识', trigger: 'blur'},
]
}; };
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);
}); });
}; };