hgwms-2098 fix 角色管理弹窗修改
parent
84633099a9
commit
f907724c24
|
|
@ -8,32 +8,43 @@
|
|||
@cancel="cancel"
|
||||
>
|
||||
<a-form
|
||||
ref="formRef"
|
||||
ref="formRef"
|
||||
:model="formState"
|
||||
:rules="formRules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
layout="vertical"
|
||||
>
|
||||
<a-form-item ref="name" label="名称" name="name">
|
||||
<a-input v-model:value="formState.name" />
|
||||
</a-form-item>
|
||||
<a-form-item ref="code" label="标识" name="code">
|
||||
<a-input v-model:value="formState.code" />
|
||||
</a-form-item>
|
||||
<a-form-item ref="sort" label="排序" name="sort">
|
||||
<a-input-number v-model:value="formState.sort" />
|
||||
</a-form-item>
|
||||
<a-form-item label="状态" name="enable">
|
||||
<a-switch v-model:checked="formState.enable" />
|
||||
</a-form-item>
|
||||
<a-form-item label="备注" name="remark">
|
||||
<a-textarea v-model:value="formState.remark" />
|
||||
</a-form-item>
|
||||
<a-row :gutter="[16, 0]">
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="name" label="名称" name="name">
|
||||
<a-input v-model:value="formState.name" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="code" label="标识" name="code">
|
||||
<a-input v-model:value="formState.code" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="sort" label="排序" name="sort">
|
||||
<a-input-number style="width: 100%" v-model:value="formState.sort" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<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="24">
|
||||
<a-form-item label="备注" name="remark">
|
||||
<a-textarea v-model:value="formState.remark" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script>
|
||||
import { message } from '@hwork/ant-design-vue';
|
||||
import { message } from "@hwork/ant-design-vue";
|
||||
import { edit } from "@/api/module/role";
|
||||
import { defineComponent, reactive, ref, toRaw, watch } from "vue";
|
||||
export default defineComponent({
|
||||
|
|
@ -43,51 +54,46 @@ export default defineComponent({
|
|||
},
|
||||
record: {
|
||||
type: Object,
|
||||
}
|
||||
},
|
||||
},
|
||||
emit: ["close"],
|
||||
setup(props, context) {
|
||||
|
||||
const formRef = ref();
|
||||
|
||||
const formState = reactive({});
|
||||
|
||||
const formRules = {
|
||||
name: [
|
||||
{ required: true, message: '请输入名称', trigger: 'blur'},
|
||||
],
|
||||
code: [
|
||||
{ required: true, message: '请输入标识', trigger: 'blur'},
|
||||
]
|
||||
name: [{ required: true, message: "请输入名称", trigger: "blur" }],
|
||||
code: [{ required: true, message: "请输入标识", trigger: "blur" }],
|
||||
};
|
||||
|
||||
watch(props,(props)=>{
|
||||
watch(props, (props) => {
|
||||
formState.id = props.record.id;
|
||||
formState.name = props.record.name;
|
||||
formState.code = props.record.code;
|
||||
formState.sort = props.record.sort;
|
||||
formState.enable = props.record.enable;
|
||||
formState.remark = props.record.remark;
|
||||
})
|
||||
});
|
||||
|
||||
const submit = (e) => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
edit(toRaw(formState)).then((response)=>{
|
||||
if(response.success){
|
||||
message.success({ content: '保存成功', duration: 1 }).then(()=>{
|
||||
cancel();
|
||||
});
|
||||
}else{
|
||||
message.success({ content: '保存失败', duration: 1 }).then(()=>{
|
||||
cancel();
|
||||
});
|
||||
}
|
||||
edit(toRaw(formState)).then((response) => {
|
||||
if (response.success) {
|
||||
message.success({ content: "保存成功", duration: 1 }).then(() => {
|
||||
cancel();
|
||||
});
|
||||
} else {
|
||||
message.success({ content: "保存失败", duration: 1 }).then(() => {
|
||||
cancel();
|
||||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
console.log('error', error);
|
||||
.catch((error) => {
|
||||
console.log("error", error);
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -1,12 +1,5 @@
|
|||
<template>
|
||||
<a-modal
|
||||
:open="visible"
|
||||
title="权限配置"
|
||||
cancelText="取消"
|
||||
okText="保存"
|
||||
@ok="submit"
|
||||
@cancel="cancel"
|
||||
>
|
||||
<a-drawer :open="visible" title="权限配置" style="padding: 0 8px">
|
||||
<a-tabs v-model:activeKey="state.active">
|
||||
<a-tab-pane key="1" tab="菜单权限">
|
||||
<a-tree
|
||||
|
|
@ -23,11 +16,13 @@
|
|||
<a-select-option value="ALL">全部</a-select-option>
|
||||
<a-select-option value="SELF">仅自己</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>
|
||||
<br/>
|
||||
<br/>
|
||||
<br />
|
||||
<br />
|
||||
<a-tree
|
||||
checkable
|
||||
show-line="true"
|
||||
|
|
@ -38,7 +33,11 @@
|
|||
/>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-modal>
|
||||
<template #footer>
|
||||
<a-button @click="cancel">取消</a-button>
|
||||
<a-button type="primary" @click="submit">保存</a-button>
|
||||
</template>
|
||||
</a-drawer>
|
||||
</template>
|
||||
<script>
|
||||
import { message } from "@hwork/ant-design-vue";
|
||||
|
|
@ -58,7 +57,6 @@ export default defineComponent({
|
|||
},
|
||||
emit: ["close"],
|
||||
setup(props, context) {
|
||||
|
||||
const scope = ref("ALL");
|
||||
|
||||
const state = reactive({
|
||||
|
|
@ -66,8 +64,8 @@ export default defineComponent({
|
|||
powers: [],
|
||||
active: "1",
|
||||
showDept: false,
|
||||
checkedPowerIds: {checked:[]},
|
||||
checkedDeptIds: {checked:[]},
|
||||
checkedPowerIds: { checked: [] },
|
||||
checkedDeptIds: { checked: [] },
|
||||
powerReplaceFields: { key: "id" },
|
||||
deptReplaceFields: { key: "id", title: "name" },
|
||||
});
|
||||
|
|
@ -86,13 +84,13 @@ export default defineComponent({
|
|||
|
||||
/// 监听数据
|
||||
watch(scope, (scope) => {
|
||||
if(scope === "CUSTOM") {
|
||||
if (scope === "CUSTOM") {
|
||||
state.showDept = true;
|
||||
} else {
|
||||
state.checkedDeptIds = [];
|
||||
state.showDept = false;
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
/// 监听数据
|
||||
watch(props, (props) => {
|
||||
|
|
@ -104,12 +102,12 @@ export default defineComponent({
|
|||
state.checkedPowerIds = powerIds;
|
||||
});
|
||||
let deptIds = [];
|
||||
dept({ roleId: props.record.id}).then((response) => {
|
||||
dept({ roleId: props.record.id }).then((response) => {
|
||||
response.data.forEach((element) => {
|
||||
deptIds.push(element.id);
|
||||
})
|
||||
});
|
||||
state.checkedDeptIds = deptIds;
|
||||
})
|
||||
});
|
||||
scope.value = props.record.scope;
|
||||
});
|
||||
|
||||
|
|
@ -120,20 +118,23 @@ export default defineComponent({
|
|||
give({
|
||||
scope: scope.value,
|
||||
roleId: props.record.id,
|
||||
powerIds: state.checkedPowerIds.checked?state.checkedPowerIds.checked:state.checkedPowerIds,
|
||||
deptIds: state.checkedDeptIds.checked?state.checkedDeptIds.checked:state.checkedDeptIds }).then(
|
||||
(response) => {
|
||||
if (response.success) {
|
||||
message.success({ content: "保存成功", duration: 1 }).then(() => {
|
||||
cancel();
|
||||
});
|
||||
} else {
|
||||
message.error({ content: "保存失败", duration: 1 }).then(() => {
|
||||
cancel();
|
||||
});
|
||||
}
|
||||
powerIds: state.checkedPowerIds.checked
|
||||
? state.checkedPowerIds.checked
|
||||
: state.checkedPowerIds,
|
||||
deptIds: state.checkedDeptIds.checked
|
||||
? state.checkedDeptIds.checked
|
||||
: state.checkedDeptIds,
|
||||
}).then((response) => {
|
||||
if (response.success) {
|
||||
message.success({ content: "保存成功", duration: 1 }).then(() => {
|
||||
cancel();
|
||||
});
|
||||
} else {
|
||||
message.error({ content: "保存失败", duration: 1 }).then(() => {
|
||||
cancel();
|
||||
});
|
||||
}
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
const cancel = (e) => {
|
||||
|
|
@ -145,7 +146,7 @@ export default defineComponent({
|
|||
state,
|
||||
submit,
|
||||
cancel,
|
||||
SHOW_PARENT
|
||||
SHOW_PARENT,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
|||
|
|
@ -8,27 +8,38 @@
|
|||
@cancel="cancel"
|
||||
>
|
||||
<a-form
|
||||
ref="formRef"
|
||||
ref="formRef"
|
||||
:model="formState"
|
||||
:rules="formRules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
layout="vertical"
|
||||
>
|
||||
<a-form-item ref="name" label="名称" name="name">
|
||||
<a-input v-model:value="formState.name" />
|
||||
</a-form-item>
|
||||
<a-form-item ref="code" label="标识" name="code">
|
||||
<a-input v-model:value="formState.code" />
|
||||
</a-form-item>
|
||||
<a-form-item ref="sort" label="排序" name="sort">
|
||||
<a-input-number v-model:value="formState.sort" />
|
||||
</a-form-item>
|
||||
<a-form-item label="状态" name="enable">
|
||||
<a-switch v-model:checked="formState.enable" />
|
||||
</a-form-item>
|
||||
<a-form-item label="备注" name="remark">
|
||||
<a-textarea v-model:value="formState.remark" />
|
||||
</a-form-item>
|
||||
<a-row :gutter="[16, 0]">
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="name" label="名称" name="name">
|
||||
<a-input v-model:value="formState.name" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="code" label="标识" name="code">
|
||||
<a-input v-model:value="formState.code" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="sort" label="排序" name="sort">
|
||||
<a-input-number style="width: 100%" v-model:value="formState.sort" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<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="24">
|
||||
<a-form-item label="备注" name="remark">
|
||||
<a-textarea v-model:value="formState.remark" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
|
@ -41,25 +52,24 @@ export default defineComponent({
|
|||
},
|
||||
record: {
|
||||
type: Object,
|
||||
}
|
||||
},
|
||||
},
|
||||
emit: ["close"],
|
||||
setup(props, context) {
|
||||
|
||||
const formRef = ref();
|
||||
|
||||
const formState = reactive({});
|
||||
|
||||
const formRules = {};
|
||||
|
||||
watch(props,(props)=>{
|
||||
watch(props, (props) => {
|
||||
formState.id = props.record.id;
|
||||
formState.name = props.record.name;
|
||||
formState.code = props.record.code;
|
||||
formState.sort = props.record.sort;
|
||||
formState.enable = props.record.enable;
|
||||
formState.remark = props.record.remark;
|
||||
})
|
||||
});
|
||||
|
||||
const cancel = (e) => {
|
||||
formRef.value.resetFields();
|
||||
|
|
|
|||
|
|
@ -8,32 +8,43 @@
|
|||
@cancel="cancel"
|
||||
>
|
||||
<a-form
|
||||
ref="formRef"
|
||||
ref="formRef"
|
||||
:model="formState"
|
||||
:rules="formRules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
layout="vertical"
|
||||
>
|
||||
<a-form-item ref="name" label="名称" name="name">
|
||||
<a-input v-model:value="formState.name" />
|
||||
</a-form-item>
|
||||
<a-form-item ref="code" label="标识" name="code">
|
||||
<a-input v-model:value="formState.code" />
|
||||
</a-form-item>
|
||||
<a-form-item ref="sort" label="排序" name="sort">
|
||||
<a-input-number v-model:value="formState.sort" />
|
||||
</a-form-item>
|
||||
<a-form-item label="状态" name="enable">
|
||||
<a-switch v-model:checked="formState.enable" />
|
||||
</a-form-item>
|
||||
<a-form-item label="备注" name="remark">
|
||||
<a-textarea v-model:value="formState.remark" />
|
||||
</a-form-item>
|
||||
<a-row :gutter="[16, 0]">
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="name" label="名称" name="name">
|
||||
<a-input v-model:value="formState.name" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="code" label="标识" name="code">
|
||||
<a-input v-model:value="formState.code" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="sort" label="排序" name="sort">
|
||||
<a-input-number style="width: 100%" v-model:value="formState.sort" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<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="24">
|
||||
<a-form-item label="备注" name="remark">
|
||||
<a-textarea v-model:value="formState.remark" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script>
|
||||
import { message } from '@hwork/ant-design-vue';
|
||||
import { message } from "@hwork/ant-design-vue";
|
||||
import { save } from "@/api/module/role";
|
||||
import { defineComponent, reactive, ref, toRaw } from "vue";
|
||||
export default defineComponent({
|
||||
|
|
@ -44,7 +55,6 @@ export default defineComponent({
|
|||
},
|
||||
emit: ["close"],
|
||||
setup(props, context) {
|
||||
|
||||
const formRef = ref();
|
||||
|
||||
const formState = reactive({
|
||||
|
|
@ -53,32 +63,28 @@ export default defineComponent({
|
|||
});
|
||||
|
||||
const formRules = {
|
||||
name: [
|
||||
{ required: true, message: '请输入名称', trigger: 'blur'},
|
||||
],
|
||||
code: [
|
||||
{ required: true, message: '请输入标识', trigger: 'blur'},
|
||||
]
|
||||
name: [{ required: true, message: "请输入名称", trigger: "blur" }],
|
||||
code: [{ required: true, message: "请输入标识", trigger: "blur" }],
|
||||
};
|
||||
|
||||
const submit = (e) => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
save(toRaw(formState)).then((response)=>{
|
||||
if(response.success){
|
||||
message.success({ content: '保存成功', duration: 1 }).then(()=>{
|
||||
cancel();
|
||||
});
|
||||
}else{
|
||||
message.success({ content: '保存失败', duration: 1 }).then(()=>{
|
||||
cancel();
|
||||
});
|
||||
}
|
||||
save(toRaw(formState)).then((response) => {
|
||||
if (response.success) {
|
||||
message.success({ content: "保存成功", duration: 1 }).then(() => {
|
||||
cancel();
|
||||
});
|
||||
} else {
|
||||
message.success({ content: "保存失败", duration: 1 }).then(() => {
|
||||
cancel();
|
||||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
console.log('error', error);
|
||||
.catch((error) => {
|
||||
console.log("error", error);
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue