89 lines
2.1 KiB
Vue
89 lines
2.1 KiB
Vue
<template>
|
|
<a-drawer :open="visible" title="权限配置" width="560">
|
|
<a-tree
|
|
style="padding: 0 6px"
|
|
checkable
|
|
checkStrictly
|
|
show-line="true"
|
|
:tree-data="state.powers"
|
|
:replace-fields="state.powerReplaceFields"
|
|
v-model:checkedKeys="state.checkedPowerIds"
|
|
/>
|
|
<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";
|
|
import { tree as powerTree } from "@/api/module/power";
|
|
import { power, give } from "@/api/module/tenant";
|
|
import { defineComponent, reactive, ref, watch } from "vue";
|
|
export default defineComponent({
|
|
props: {
|
|
visible: {
|
|
type: Boolean,
|
|
},
|
|
record: {
|
|
type: Object,
|
|
},
|
|
},
|
|
emit: ["close"],
|
|
setup(props, context) {
|
|
const state = reactive({
|
|
powers: [],
|
|
checkedPowerIds: { checked: [] },
|
|
powerReplaceFields: { key: "id" },
|
|
});
|
|
|
|
const loadPower = async () => {
|
|
var response = await powerTree();
|
|
state.powers = response.data;
|
|
};
|
|
|
|
/// 监听数据
|
|
watch(props, (props) => {
|
|
let powerIds = [];
|
|
power({ tenantId: props.record.id }).then((response) => {
|
|
response.data.forEach((element) => {
|
|
powerIds.push(element.id);
|
|
});
|
|
state.checkedPowerIds = powerIds;
|
|
});
|
|
});
|
|
|
|
loadPower();
|
|
|
|
const submit = (e) => {
|
|
give({
|
|
tenantId: props.record.id,
|
|
powerIds: state.checkedPowerIds.checked
|
|
? state.checkedPowerIds.checked
|
|
: state.checkedPowerIds,
|
|
}).then((response) => {
|
|
if (response.success) {
|
|
message.success({ content: "保存成功", duration: 1 }).then(() => {
|
|
cancel();
|
|
});
|
|
} else {
|
|
message.error({ content: "保存失败", duration: 1 }).then(() => {
|
|
cancel();
|
|
});
|
|
}
|
|
});
|
|
};
|
|
|
|
const cancel = (e) => {
|
|
context.emit("close", false);
|
|
};
|
|
|
|
return {
|
|
state,
|
|
submit,
|
|
cancel,
|
|
};
|
|
},
|
|
});
|
|
</script>
|