feat: keepAlive功能

This commit is contained in:
H0nGzA1
2023-05-17 23:34:41 +08:00
parent adc522c180
commit 60035767ad
15 changed files with 352 additions and 360 deletions

View File

@@ -18,7 +18,7 @@ export const handleMenu = (menuData: Array<any>) => {
roles: ['admin'],
icon: item.icon
}
item.name = item.component_name
return item
}
menuData.forEach((val) => {
@@ -45,5 +45,6 @@ export const handleMenu = (menuData: Array<any>) => {
},
...data
]
console.log(menu)
return menu
}

View File

@@ -4,7 +4,7 @@
</fs-page>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="areas">
import { ref, onMounted } from 'vue';
import { useFs } from '@fast-crud/fast-crud';
import { createCrudOptions } from './crud';

View File

@@ -39,7 +39,7 @@
</el-card>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="config">
import { Edit, FolderAdd } from '@element-plus/icons-vue';
import * as api from './api';
import addTabs from './components/addTabs.vue';

View File

@@ -98,7 +98,7 @@
</fs-page>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="dept">
import {Splitpanes, Pane} from 'splitpanes';
import 'splitpanes/dist/splitpanes.css';
import * as api from './api';

View File

@@ -5,7 +5,7 @@
</fs-page>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="dictionary">
import { ref, onMounted, defineAsyncComponent } from 'vue';
import { useFs } from '@fast-crud/fast-crud';
import { createCrudOptions } from './crud';

View File

@@ -1,18 +0,0 @@
<template>
<fs-page>
<fs-crud ref="crudRef" v-bind="crudBinding"> </fs-crud>
</fs-page>
</template>
<script lang="ts" setup>
import { ref, onMounted } from 'vue';
import { useFs } from '@fast-crud/fast-crud';
import { createCrudOptions } from './crud';
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
// 页面打开后获取列表数据
onMounted(() => {
crudExpose.doRefresh();
});
</script>

View File

@@ -79,7 +79,7 @@
</fs-page>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="fileList">
import {DelObj, GetList} from "./api";
import {ref, onMounted,reactive} from "vue";
import {getBaseURL} from "/@/utils/baseUrl";

View File

@@ -4,7 +4,7 @@
</fs-page>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="loginLog">
import { ref, onMounted } from 'vue';
import { useFs } from '@fast-crud/fast-crud';
import { createCrudOptions } from './crud';

View File

@@ -1,18 +1,19 @@
<template>
<fs-page>
<fs-crud ref="crudRef" v-bind="crudBinding"> </fs-crud>
<fs-crud ref="crudRef" v-bind="crudBinding"></fs-crud>
</fs-page>
</template>
<script lang="ts" setup>
import { ref, onMounted } from 'vue';
import { useFs } from '@fast-crud/fast-crud';
import { createCrudOptions } from './crud';
<script lang="ts" setup name="operationLog">
import {ref, onMounted} from 'vue';
import {useFs} from '@fast-crud/fast-crud';
import {createCrudOptions} from './crud';
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
const {crudBinding, crudRef, crudExpose} = useFs({createCrudOptions});
// 页面打开后获取列表数据
onMounted(() => {
crudExpose.doRefresh();
});
</script>

View File

@@ -1,7 +1,7 @@
<template>
<fs-page>
<splitpanes>
<pane max-size="20" min-size="16" >
<pane max-size="20" min-size="16">
<el-card :body-style="{ height: '100%' }">
<p class="font-mono font-black text-center text-xl pb-5">
菜单列表
@@ -29,7 +29,7 @@
</el-tree>
</el-card>
</pane>
<pane min-size="30" >
<pane min-size="30">
<el-card :body-style="{ height: '100%' }">
<el-form ref="formRef" :rules="rules" :model="form" label-width="80px"
label-position="right">
@@ -96,13 +96,13 @@
</fs-page>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="menu">
import {Splitpanes, Pane} from 'splitpanes';
import 'splitpanes/dist/splitpanes.css';
import * as api from './api';
import * as menuButoonApi from './components/menuButton/api';
import {ElForm, ElTree, FormRules, ElMessageBox} from 'element-plus';
import {ref, onMounted, watch, reactive, toRaw, defineAsyncComponent, nextTick, shallowRef} from 'vue';
import {ref, onMounted, watch, reactive, toRaw, defineAsyncComponent, nextTick, shallowRef, onActivated} from 'vue';
import XEUtils from 'xe-utils';
import {errorMessage, successMessage} from '../../../utils/message';
@@ -370,6 +370,9 @@ const drawerClose = () => {
onMounted(() => {
getData();
});
onActivated(() => {
console.log('keep-alive成功')
});
</script>
<style lang="scss" scoped>

View File

@@ -12,7 +12,7 @@
</fs-page>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="messageCenter">
import {ref, onMounted} from 'vue';
import {useExpose, useCrud} from '@fast-crud/fast-crud';
import {createCrudOptions} from './crud';

View File

@@ -9,7 +9,7 @@
</fs-page>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="role">
import { ref, onMounted } from 'vue';
import { useExpose, useCrud, dict } from '@fast-crud/fast-crud';
import { createCrudOptions } from './crud';

View File

@@ -17,7 +17,8 @@
<el-card header="菜单页面授权">
<template #header>
<div class="card-header">
<el-tooltip effect="dark" content="点击菜单项,可对菜单下的按钮/接口授权" placement="right">
<el-tooltip effect="dark" content="点击菜单项,可对菜单下的按钮/接口授权"
placement="right">
<div>
<span>菜单页面</span>
<el-icon>
@@ -57,7 +58,8 @@
</template>
<div>
<el-divider content-position="left">{{ editedMenuInfo.name }}</el-divider>
<el-button type="primary" size="small" style="margin-bottom: 0.5em" @click="createBtnPermission">新增
<el-button type="primary" size="small" style="margin-bottom: 0.5em"
@click="createBtnPermission">新增
</el-button>
<el-table size="small" :data="buttonPermissionData" border style="width: 100%">
<el-table-column prop="menu_button" label="权限名称" width="100">
@@ -73,7 +75,8 @@
<el-table-column prop="dept" label="权限涉及部门"/>
<el-table-column fixed="right" label="操作" width="120">
<template #default="scope">
<el-button type="danger" size="small" @click="onDeleteBtn(scope)">删除</el-button>
<el-button type="danger" size="small" @click="onDeleteBtn(scope)">删除
</el-button>
</template>
</el-table-column>
</el-table>
@@ -112,12 +115,14 @@
<el-form ref="buttonFormRef" :model="buttonForm" :rules="buttonRules" label-width="120px">
<el-form-item label="按钮" prop="menu_button">
<el-select v-model="buttonForm.menu_button" placeholder="请选择按钮" @change="onChangeButton">
<el-option v-for="(item,index) in buttonOptions" :key="index" :label="item.name" :value="item.id"/>
<el-option v-for="(item,index) in buttonOptions" :key="index" :label="item.name"
:value="item.id"/>
</el-select>
</el-form-item>
<el-form-item label="权限范围" prop="data_range">
<el-select v-model="buttonForm.data_range" placeholder="请选择按钮">
<el-option v-for="(item,index) in dataScopeOptions" :key="index" :label="item.label" :value="item.value"/>
<el-option v-for="(item,index) in dataScopeOptions" :key="index" :label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="数据部门" prop="dept" v-show="buttonForm.data_range === 4">
@@ -148,7 +153,7 @@
</el-drawer>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="rolePermission">
import {ref, defineExpose, reactive, toRefs} from 'vue'
import {ElMessageBox} from 'element-plus'
import * as api from './api'
@@ -354,7 +359,7 @@ const onDeleteBtn = (scope: any) => {
type: 'warning',
}
).then(() => {
api.DeletePermission({id: row.id}).then((res:any) => {
api.DeletePermission({id: row.id}).then((res: any) => {
buttonPermissionData.value.splice($index, 1)
ElMessage({
type: 'success',

View File

@@ -42,7 +42,7 @@
</fs-page>
</template>
<script lang="ts" setup>
<script lang="ts" setup name="user">
import { useExpose, useCrud } from '@fast-crud/fast-crud';
import { createCrudOptions } from './crud';
import * as api from './api';

View File

@@ -1,15 +1,15 @@
<template>
<fs-page>
<fs-crud ref="crudRef" v-bind="crudBinding"> </fs-crud>
<fs-crud ref="crudRef" v-bind="crudBinding"></fs-crud>
</fs-page>
</template>
<script lang="ts" setup>
import { ref, onMounted } from 'vue';
import { useFs } from '@fast-crud/fast-crud';
import { createCrudOptions } from './crud';
<script lang="ts" setup name="whiteList">
import {ref, onMounted} from 'vue';
import {useFs} from '@fast-crud/fast-crud';
import {createCrudOptions} from './crud';
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
const {crudBinding, crudRef, crudExpose} = useFs({createCrudOptions});
// 页面打开后获取列表数据
onMounted(() => {