70 lines
1.7 KiB
Vue
70 lines
1.7 KiB
Vue
<template>
|
|
<fs-page>
|
|
<fs-crud ref="crudRef" v-bind="crudBinding">
|
|
<template #cell_url="scope">
|
|
<el-tag size="small">{{ scope.row.url }}</el-tag>
|
|
</template>
|
|
</fs-crud>
|
|
|
|
<permission ref="rolePermission"></permission>
|
|
|
|
<PermissionComNew v-model:drawerVisible="drawerVisible" :roleId="roleId" :roleName="roleName" @drawerClose="handleDrawerClose" />
|
|
</fs-page>
|
|
</template>
|
|
|
|
<script lang="ts" setup name="role">
|
|
import {ref, onMounted, inject, onBeforeUpdate} from 'vue';
|
|
|
|
import { GetPermission } from './api';
|
|
import { useExpose, useCrud } from '@fast-crud/fast-crud';
|
|
import { createCrudOptions } from './crud';
|
|
import PermissionComNew from './components/PermissionComNew/index.vue';
|
|
import _ from "lodash-es";
|
|
import {handleColumnPermission} from "/@/utils/columnPermission";
|
|
let drawerVisible = ref(false);
|
|
let roleId = ref(null);
|
|
let roleName = ref(null);
|
|
|
|
const rolePermission = ref();
|
|
// crud组件的ref
|
|
const crudRef = ref();
|
|
// crud 配置的ref
|
|
const crudBinding = ref();
|
|
|
|
|
|
const handleDrawerOpen = (row: any) => {
|
|
roleId.value = row.id;
|
|
roleName.value = row.name;
|
|
drawerVisible.value = true;
|
|
};
|
|
|
|
const handleDrawerClose = () => {
|
|
drawerVisible.value = false;
|
|
};
|
|
|
|
const { crudExpose } = useExpose({ crudRef, crudBinding });
|
|
|
|
// 你的crud配置
|
|
const { crudOptions } = createCrudOptions({ crudExpose, rolePermission, handleDrawerOpen });
|
|
|
|
|
|
|
|
// 页面打开后获取列表数据
|
|
onMounted( async () => {
|
|
|
|
const newOptions = await handleColumnPermission(GetPermission,crudOptions)
|
|
|
|
// 初始化crud配置
|
|
const { resetCrudOptions } = useCrud({
|
|
crudExpose,
|
|
crudOptions,
|
|
context: {},
|
|
});
|
|
//重置crudBinding
|
|
resetCrudOptions(newOptions);
|
|
crudExpose.doRefresh();
|
|
});
|
|
|
|
defineExpose(rolePermission);
|
|
</script>
|