You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
86 lines
2.3 KiB
86 lines
2.3 KiB
11 months ago
|
<template>
|
||
|
|
<div>
|
||
|
|
<el-form ref="formRef" v-loading="formLoading" :model="formData" label-width="0px">
|
||
|
|
<el-form-item>
|
||
|
|
<el-tree
|
||
|
|
ref="treeRef"
|
||
|
|
:data="menuOptions"
|
||
|
|
:props="defaultProps"
|
||
|
|
empty-text="加载中，请稍候"
|
||
|
|
node-key="id"
|
||
|
|
show-checkbox
|
||
|
|
style="width: 100%"
|
||
|
|
/>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item>
|
||
|
|
<el-button :disabled="formLoading" type="primary" @click="submitForm">保存权限</el-button>
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script lang="ts" name="RoleAssignMenuForm" setup>
|
||
|
|
import { defaultProps } from '@/utils/tree'
|
||
|
|
// import * as MenuApi from '@/api/system/menu'
|
||
|
|
// import * as PermissionApi from '@/api/system/permission'
|
||
|
|
|
||
|
|
const { t } = useI18n() // 国际化
|
||
|
|
const message = useMessage() // 消息弹窗
|
||
|
|
|
||
|
|
const dialogVisible = ref(false) // 弹窗的是否展示
|
||
|
|
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
|
||
|
|
const formData = reactive({
|
||
|
|
id: 0,
|
||
|
|
name: '',
|
||
|
|
menuIds: []
|
||
|
|
})
|
||
|
|
const formRef = ref() // 表单 Ref
|
||
|
|
const menuOptions = ref<any[]>([]) // 菜单树形结构
|
||
|
|
const treeRef = ref() // 菜单树组件 Ref
|
||
|
|
|
||
|
|
/** 提交表单 */
|
||
|
|
const submitForm = async () => {
|
||
|
|
// 校验表单
|
||
|
|
if (!formRef.value) return
|
||
|
|
const valid = await formRef.value.validate()
|
||
|
|
if (!valid) return
|
||
|
|
// 提交请求
|
||
|
|
formLoading.value = true
|
||
|
|
try {
|
||
|
|
// const data = {
|
||
|
|
// roleId: formData.id,
|
||
|
|
// menuIds: [
|
||
|
|
// ...(treeRef.value.getCheckedKeys(false) as unknown as Array<number>), // 获得当前选中节点
|
||
|
|
// ...(treeRef.value.getHalfCheckedKeys() as unknown as Array<number>) // 获得半选中的父节点
|
||
|
|
// ]
|
||
|
|
// }
|
||
|
|
// await PermissionApi.assignRoleMenu(data)
|
||
|
|
message.success(t('common.updateSuccess'))
|
||
|
|
dialogVisible.value = false
|
||
|
|
} finally {
|
||
|
|
formLoading.value = false
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
onMounted(() => {
|
||
|
|
menuOptions.value = [
|
||
|
|
{
|
||
|
|
name: '统计报表',
|
||
|
|
id: '10001',
|
||
|
|
children: [
|
||
|
|
{ name: '首页', id: '20001' },
|
||
|
|
{ name: 'XX统计', id: '20002' }
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '线索管理',
|
||
|
|
id: '10002',
|
||
|
|
children: [
|
||
|
|
{ name: '线索库', id: '20002' },
|
||
|
|
{ name: '成交管理', id: '20003' }
|
||
|
|
]
|
||
|
|
}
|
||
|
|
]
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped></style>
|