Introducing new features. 增加字典管理

This commit is contained in:
aeizzz 2023-02-07 15:46:57 +08:00
parent d18f1e3ddd
commit f7e3df12a1
9 changed files with 512 additions and 262 deletions

View File

@ -7,3 +7,86 @@ export const getDicts = (type: String) => {
method: "get",
})
}
export function fetchList(query: any) {
return request({
url: '/admin/dict/page',
method: 'get',
params: query
})
}
export function fetchItemList(query: any) {
return request({
url: '/admin/dict/item/page',
method: 'get',
params: query
})
}
export function addItemObj(obj: any) {
return request({
url: '/admin/dict/item',
method: 'post',
data: obj
})
}
export function getItemObj(id: string) {
return request({
url: '/admin/dict/item/' + id,
method: 'get'
})
}
export function delItemObj(id: string) {
return request({
url: '/admin/dict/item/' + id,
method: 'delete'
})
}
export function putItemObj(obj: any) {
return request({
url: '/admin/dict/item',
method: 'put',
data: obj
})
}
export function addObj(obj: any) {
return request({
url: '/admin/dict/',
method: 'post',
data: obj
})
}
export function getObj(id: string) {
return request({
url: '/admin/dict/' + id,
method: 'get'
})
}
export function delObj(row: any) {
return request({
url: '/admin/dict/' + row.id,
method: 'delete'
})
}
export function putObj(obj: any) {
return request({
url: '/admin/dict/',
method: 'put',
data: obj
})
}
export function refreshCache() {
return request({
url: '/admin/dict/sync',
method: 'put'
})
}

View File

@ -32,6 +32,9 @@ service.interceptors.request.use((config: InternalAxiosRequestConfig) => {
// 添加响应拦截器
service.interceptors.response.use((res: any) => {
if(res.data.code === 1){
throw res.data
}
return res.data;
}, error => {
const status = Number(error.response.status) || 200

View File

@ -6,7 +6,7 @@
<el-button icon="search" type="primary" class="ml10" @click="getDataList">
{{ $t('common.queryBtn') }}
</el-button>
<el-button icon="folder-add" type="success" class="ml10" @click="deptDialogRef.openDialog('add');" v-auth="'sys_dept_add'">
<el-button icon="folder-add" type="primary" class="ml10" @click="deptDialogRef.openDialog('add');" v-auth="'sys_dept_add'">
{{ $t('common.addBtn') }}
</el-button>
</div>

View File

@ -1,150 +0,0 @@
<template>
<div class="system-dic-dialog-container">
<el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="769px">
<el-alert title="半成品,交互过于复杂,请自行扩展!" type="warning" :closable="false" class="mb20"> </el-alert>
<el-form ref="dicDialogFormRef" :model="state.ruleForm" size="default" label-width="90px">
<el-row :gutter="35">
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
<el-form-item label="字典名称">
<el-input v-model="state.ruleForm.dicName" placeholder="请输入字典名称" clearable></el-input>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
<el-form-item label="字段名">
<el-input v-model="state.ruleForm.fieldName" placeholder="请输入字段名,拼接 ruleForm.list" clearable></el-input>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item label="字典状态">
<el-switch v-model="state.ruleForm.status" inline-prompt active-text="启" inactive-text="禁"></el-switch>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-row :gutter="35" v-for="(v, k) in state.ruleForm.list" :key="k">
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
<el-form-item :prop="`list[${k}].label`">
<template #label>
<el-button type="primary" circle size="small" @click="onAddRow" v-if="k === 0">
<el-icon>
<ele-Plus />
</el-icon>
</el-button>
<el-button type="danger" circle size="small" @click="onDelRow(k)" v-else>
<el-icon>
<ele-Delete />
</el-icon>
</el-button>
<span class="ml10">字段</span>
</template>
<el-input v-model="v.label" style="width: 100%" placeholder="请输入字段名"> </el-input>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
<el-form-item label="属性" :prop="`list[${k}].value`">
<el-input v-model="v.value" style="width: 100%" placeholder="请输入属性值"> </el-input>
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item label="字典描述">
<el-input v-model="state.ruleForm.describe" type="textarea" placeholder="请输入字典描述" maxlength="150"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="onCancel" size="default"> </el-button>
<el-button type="primary" @click="onSubmit" size="default">{{ state.dialog.submitTxt }}</el-button>
</span>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts" name="systemDicDialog">
import { reactive, ref } from 'vue';
// /
const emit = defineEmits(['refresh']);
//
const dicDialogFormRef = ref();
const state = reactive({
ruleForm: {
dicName: '', //
fieldName: '', //
status: true, //
list: [] as ListType[], // +
describe: '', //
},
dialog: {
isShowDialog: false,
type: '',
title: '',
submitTxt: '',
},
});
//
const openDialog = (type: string, row: RowDicType) => {
if (type === 'edit') {
if (row.fieldName === 'SYS_UERINFO') {
row.list = [
{ id: Math.random(), label: 'sex', value: '1' },
{ id: Math.random(), label: 'sex', value: '0' },
];
} else {
row.list = [
{ id: Math.random(), label: 'role', value: 'admin' },
{ id: Math.random(), label: 'role', value: 'common' },
{ id: Math.random(), label: 'roleName', value: '超级管理员' },
{ id: Math.random(), label: 'roleName', value: '普通用户' },
];
}
state.ruleForm = row;
state.dialog.title = '修改字典';
state.dialog.submitTxt = '修 改';
} else {
state.dialog.title = '新增字典';
state.dialog.submitTxt = '新 增';
// 使
// nextTick(() => {
// dicDialogFormRef.value.resetFields();
// });
}
state.dialog.isShowDialog = true;
};
//
const closeDialog = () => {
state.dialog.isShowDialog = false;
};
//
const onCancel = () => {
closeDialog();
};
//
const onSubmit = () => {
closeDialog();
emit('refresh');
// if (state.dialog.type === 'add') { }
};
//
const onAddRow = () => {
state.ruleForm.list.push({
id: Math.random(),
label: '',
value: '',
});
};
//
const onDelRow = (k: number) => {
state.ruleForm.list.splice(k, 1);
};
//
defineExpose({
openDialog,
});
</script>

View File

@ -0,0 +1,122 @@
<template>
<div class="system-dic-dialog-container">
<el-dialog v-model="visible" :title="dataForm.id ? $t('common.editBtn') : $t('common.addBtn')" width="60%">
<el-form ref="dicDialogFormRef" :model="dataForm" label-width="90px" size="default">
<el-row :gutter="35">
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20" v-if="dataForm.id">
<el-form-item label="类型" prop="dictType">
<el-input v-model="dataForm.dictType" clearable disabled placeholder="请输入字典名称"></el-input>
</el-form-item>
</el-col>
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
<el-form-item label="数据值" prop="value">
<el-input v-model="dataForm.value" placeholder="请输入数据值" clearable></el-input>
</el-form-item>
</el-col>
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
<el-form-item label="标签名" prop="label">
<el-input v-model="dataForm.label" placeholder="请输入标签名" clearable></el-input>
</el-form-item>
</el-col>
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
<el-form-item label="描述" prop="description">
<el-input v-model="dataForm.description" placeholder="请输入描述" clearable></el-input>
</el-form-item>
</el-col>
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
<el-form-item label="排序" prop="sortOrder">
<el-input-number v-model="dataForm.sortOrder" placeholder="请输入排序" clearable></el-input-number>
</el-form-item>
</el-col>
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
<el-form-item label="备注信息" prop="remarks">
<el-input v-model="dataForm.remarks" type="textarea" placeholder="请输入字典描述" maxlength="150"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="onCancel" size="default">{{ $t('common.cancelButtonText') }}</el-button>
<el-button type="primary" @click="onSubmit" size="default">{{ $t('common.confirmButtonText') }}</el-button>
</span>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts" name="dict-item-form">
import { getItemObj, addItemObj, putItemObj } from '/@/api/admin/dict'
import {useMessage} from "/@/hooks/message";
// /
const emit = defineEmits(['refresh']);
//
const dicDialogFormRef = ref();
const visible = ref(false)
const dataForm = reactive({
id: '',
dictType: '',
value: '',
label: '',
description: '',
sortOrder: '',
remarks: '',
})
const dataRules = reactive({})
//
const openDialog = (row: any) => {
dataForm.id = ''
if (row?.id) {
getItemObj(row.id).then(res => {
Object.assign(dataForm,res.data)
})
} else {
// 使
nextTick(() => {
dicDialogFormRef?.value?.resetFields();
});
}
visible.value = true
};
//
const closeDialog = () => {
visible.value = false
};
//
const onCancel = () => {
closeDialog();
};
//
const onSubmit = () => {
if (dataForm.id) {
putItemObj(dataForm).then(() => {
closeDialog(); //
emit('refresh');
}).catch(err => {
useMessage().error(err.msg)
})
}else{
addItemObj(dataForm).then(() => {
closeDialog(); //
emit('refresh');
}).catch(err => {
useMessage().error(err.msg)
})
}
};
//
defineExpose({
openDialog,
});
</script>

View File

@ -0,0 +1,89 @@
<template>
<el-drawer v-model="visible" title="字典项" size="80%">
<el-card shadow="hover" class="layout-padding-auto">
<el-row>
<div class="mb8" style="width: 100%">
<el-button icon="folder-add" type="primary" class="ml10" @click="dictformRef.openDialog()">
{{ $t('common.addBtn') }}
</el-button>
<right-toolbar :search='false' class="ml10" style="float: right;margin-right: 20px"
@queryTable="getDataList"></right-toolbar>
</div>
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%">
<el-table-column prop="dictType" label="类型" show-overflow-tooltip></el-table-column>
<el-table-column prop="value" label="数据值" show-overflow-tooltip></el-table-column>
<el-table-column prop="label" label="标签" show-overflow-tooltip></el-table-column>
<el-table-column prop="description" label="描述" show-overflow-tooltip></el-table-column>
<el-table-column prop="sortOrder" label="排序" show-overflow-tooltip></el-table-column>
<el-table-column prop="remarks" label="备注信息" show-overflow-tooltip></el-table-column>
<el-table-column prop="createTime" label="创建日期" show-overflow-tooltip></el-table-column>
<el-table-column :label="$t('common.action')" width="150">
<template #default="scope">
<el-button text type="primary" @click="dictformRef.openDialog(scope.row)"> {{$t('common.editBtn') }}
</el-button>
<el-button text type="primary" @click="handleDelete(scope.row)">
{{ $t('common.delBtn') }}
</el-button>
</template>
</el-table-column>
</el-table>
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination">
</pagination>
</el-row>
</el-card>
<dict-form ref="dictformRef" @refresh="getDataList"></dict-form>
</el-drawer>
</template>
<script setup lang="ts" name="dict-item">
import {BasicTableProps, useTable} from "/@/hooks/table";
import {fetchItemList,delItemObj} from "/@/api/admin/dict";
import {useMessage, useMessageBox} from "/@/hooks/message";
import {useI18n} from "vue-i18n";
const { t } = useI18n()
const visible = ref(false)
const DictForm = defineAsyncComponent(() => import("./form.vue"))
const dictformRef = ref()
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {
dictId: ''
},
createdIsNeed: false,
pageList: fetchItemList
})
const {
getDataList,
currentChangeHandle,
sizeChangeHandle,
} = useTable(state)
const handleDelete = (row: any) => {
useMessageBox().confirm(`${t('common.delConfirmText')}${row.name} ?`).then(() => {
//
delItemObj(row.id).then(() => {
getDataList();
useMessage().success(t('common.delSuccessText'))
}).catch(err => {
useMessage().error(err.msg)
})
})
};
const open = (row: any) => {
state.queryForm.dictId = row.id
visible.value = true
getDataList()
}
//
defineExpose({
open,
});
</script>
<style scoped>
</style>

View File

@ -0,0 +1,113 @@
<template>
<div class="system-dic-dialog-container">
<el-dialog v-model="visible" :title="dataForm.id ? $t('common.editBtn') : $t('common.addBtn')" width="60%">
<el-form ref="dicDialogFormRef" :model="dataForm" label-width="90px" size="default">
<el-row :gutter="35">
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
<el-form-item label="类型" prop="dictType">
<el-input v-model="dataForm.dictType" clearable placeholder="请输入字典名称"></el-input>
</el-form-item>
</el-col>
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
<el-form-item label="描述" prop="description">
<el-input v-model="dataForm.description" placeholder="请输入描述" clearable></el-input>
</el-form-item>
</el-col>
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
<el-form-item label="字典类型" prop="systemFlag">
<el-radio-group v-model="dataForm.systemFlag">
<el-radio-button :label="item.value" v-for="(item,index) in dict_type" :key="index">{{item.label}}</el-radio-button>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
<el-form-item label="备注信息" prop="remarks">
<el-input v-model="dataForm.remarks" type="textarea" placeholder="请输入字典描述" maxlength="150"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="onCancel" size="default">{{ $t('common.cancelButtonText') }}</el-button>
<el-button type="primary" @click="onSubmit" size="default">{{ $t('common.confirmButtonText') }}</el-button>
</span>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts" name="systemDicDialog">
import { getObj, addObj, putObj } from '/@/api/admin/dict'
import {useDict} from "/@/hooks/dict";
import {useMessage} from "/@/hooks/message";
// /
const emit = defineEmits(['refresh']);
const { dict_type } = useDict('dict_type')
//
const dicDialogFormRef = ref();
const visible = ref(false)
const dataForm = reactive({
id: '',
dictType: '',
description: '',
systemFlag: '',
remarks: '',
})
const dataRules = reactive({})
//
const openDialog = (type: string, row: any) => {
if (row?.id) {
getObj(row.id).then(res => {
Object.assign(dataForm,res.data)
})
} else {
// 使
nextTick(() => {
dicDialogFormRef?.value?.resetFields();
});
}
visible.value = true
};
//
const closeDialog = () => {
visible.value = false
};
//
const onCancel = () => {
closeDialog();
};
//
const onSubmit = () => {
if (dataForm.id) {
putObj(dataForm).then(() => {
closeDialog(); //
emit('refresh');
}).catch(err => {
useMessage().error(err.msg)
})
}else{
addObj(dataForm).then(() => {
closeDialog(); //
emit('refresh');
}).catch(err => {
useMessage().error(err.msg)
})
}
};
//
defineExpose({
openDialog,
});
</script>

View File

@ -1,132 +1,122 @@
<template>
<div class="layout-padding">
<el-card shadow="hover" class="layout-padding-auto">
<div class="mb15">
<el-input size="default" placeholder="请输入字典名称" style="max-width: 180px"> </el-input>
<el-button size="default" type="primary" class="ml10">
<el-icon>
<ele-Search />
</el-icon>
查询
</el-button>
<el-button size="default" type="success" class="ml10" @click="onOpenAddDic('add')">
<el-icon>
<ele-FolderAdd />
</el-icon>
新增字典
</el-button>
</div>
<el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
<el-row v-show="showSearch" class="mb8">
<el-form :model="state.queryForm" ref="queryRef" :inline="true">
<el-form-item :label="$t('post.postName')" prop="postName">
<el-input :placeholder="$t('post.inputpostNameTip')" v-model="state.queryForm.postName"
style="max-width: 180px" />
</el-form-item>
<el-form-item class="ml2">
<el-button icon="search" type="primary" @click="getDataList">
{{ $t('common.queryBtn') }}
</el-button>
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
</el-form-item>
</el-form>
</el-row>
<el-row>
<div class="mb8" style="width: 100%">
<el-button icon="folder-add" type="primary" class="ml10" @click="dicDialogRef.openDialog()">
{{ $t('common.addBtn') }}
</el-button>
<el-button :disabled="multiple" icon="Delete" type="primary" class="ml10"
v-auth="'sys_dict_del'" @click="handleDelete(undefined)">
{{ $t('common.delBtn') }}
</el-button>
<right-toolbar v-model:showSearch="showSearch" class="ml10" style="float: right;margin-right: 20px"
@queryTable="getDataList"></right-toolbar>
</div>
</el-row>
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%">
<el-table-column type="index" label="序号" width="50" />
<el-table-column prop="dicName" label="字典名称" show-overflow-tooltip></el-table-column>
<el-table-column prop="fieldName" label="字段名" show-overflow-tooltip></el-table-column>
<el-table-column prop="status" label="字典状态" show-overflow-tooltip>
<template #default="scope">
<el-tag type="success" v-if="scope.row.status">启用</el-tag>
<el-tag type="info" v-else>禁用</el-tag>
</template>
</el-table-column>
<el-table-column prop="describe" label="字典描述" show-overflow-tooltip></el-table-column>
<el-table-column prop="dictType" label="类型" show-overflow-tooltip></el-table-column>
<el-table-column prop="description" label="描述" show-overflow-tooltip></el-table-column>
<el-table-column prop="systemFlag" label="字典类型" show-overflow-tooltip>
<template #default="scope">
<dict-tag :options="dict_type" :value="scope.row.systemFlag"></dict-tag>
</template>
</el-table-column>
<el-table-column prop="remarks" label="备注信息" show-overflow-tooltip></el-table-column>
<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column>
<el-table-column label="操作" width="100">
<el-table-column label="操作" width="200">
<template #default="scope">
<el-button text type="primary" @click="onOpenEditDic('edit', scope.row)">修改</el-button>
<el-button text type="primary" @click="onRowDel(scope.row)">删除</el-button>
<el-button text type="primary" @click="onOpenEditDic('edit', scope.row)">修改</el-button>
<el-button text type="primary" @click="showDictITem(scope.row)">字典项</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="onHandleSizeChange"
@current-change="onHandleCurrentChange"
class="mt15"
:pager-count="5"
:page-sizes="[10, 20, 30]"
v-model:current-page="state.tableData.param.pageNum"
background
v-model:page-size="state.tableData.param.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="state.tableData.total"
>
</el-pagination>
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
</el-card>
<DicDialog ref="dicDialogRef" @refresh="getTableData()" />
</div>
<DicDialog ref="dicDialogRef" @refresh="getDataList()" />
<dict-item-dialog ref="dictItemDialogRef"></dict-item-dialog>
</template>
<script setup lang="ts" name="systemDic">
import { defineAsyncComponent, reactive, onMounted, ref } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
import {BasicTableProps, useTable} from "/@/hooks/table";
import {fetchList,delObj} from "/@/api/admin/dict";
import {useMessage, useMessageBox} from "/@/hooks/message";
import {useDict} from "/@/hooks/dict";
import {useI18n} from "vue-i18n";
const { dict_type } = useDict('dict_type')
//
const DicDialog = defineAsyncComponent(() => import('/@/views/admin/dict/dialog.vue'));
const DicDialog = defineAsyncComponent(() => import('./form.vue'));
const DictItemDialog = defineAsyncComponent(() => import('./dictItem/index.vue'))
const { t } = useI18n()
//
const dicDialogRef = ref();
const state = reactive<SysDicState>({
tableData: {
data: [],
total: 0,
loading: false,
param: {
pageNum: 1,
pageSize: 10,
},
},
});
const dictItemDialogRef = ref()
const queryRef = ref()
const showSearch = ref(true)
//
const selectObjs = ref([])
const multiple = ref(true)
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {},
pageList: fetchList
})
const {
getDataList,
currentChangeHandle,
sizeChangeHandle,
} = useTable(state)
//
const getTableData = () => {
state.tableData.loading = true;
const data = [];
for (let i = 0; i < 2; i++) {
data.push({
dicName: i === 0 ? '角色标识' : '用户性别',
fieldName: i === 0 ? 'SYS_ROLE' : 'SYS_UERINFO',
describe: i === 0 ? '这是角色字典' : '这是用户性别字典',
status: true,
createTime: new Date().toLocaleString(),
list: [],
});
}
state.tableData.data = data;
state.tableData.total = state.tableData.data.length;
setTimeout(() => {
state.tableData.loading = false;
}, 500);
};
//
const onOpenAddDic = (type: string) => {
dicDialogRef.value.openDialog(type);
};
//
const onOpenEditDic = (type: string, row: RowDicType) => {
const onOpenEditDic = (type: string, row: any) => {
dicDialogRef.value.openDialog(type, row);
};
//
const onRowDel = (row: RowDicType) => {
ElMessageBox.confirm(`此操作将永久删除字典名称:“${row.dicName}”,是否继续?`, '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
getTableData();
ElMessage.success('删除成功');
})
.catch(() => {});
const showDictITem = (row: any) => {
dictItemDialogRef.value.open(row)
}
//
const resetQuery = () => {
queryRef.value.resetFields()
getDataList()
}
//
const handleDelete = (row: any) => {
if (!row) {
selectObjs.value.forEach((val: any) => {
handleDelete(val)
});
return
}
useMessageBox().confirm(t('common.delConfirmText') + row.postId)
.then(() => {
delObj(row.postId).then(() => {
getDataList();
useMessage().success(t('common.delSuccessText'));
}).catch((err: any) => {
useMessage().error(err.msg)
})
})
};
//
const onHandleSizeChange = (val: number) => {
state.tableData.param.pageSize = val;
getTableData();
};
//
const onHandleCurrentChange = (val: number) => {
state.tableData.param.pageNum = val;
getTableData();
};
//
onMounted(() => {
getTableData();
});
</script>

View File

@ -6,7 +6,7 @@
<el-button icon="search" type="primary" class="ml10" @click="getDataList">
{{ $t('common.queryBtn') }}
</el-button>
<el-button icon="folder-add" type="success" class="ml10" @click="onOpenAddMenu">
<el-button icon="folder-add" type="primary" class="ml10" @click="onOpenAddMenu" v-auth="'sys_menu_add'">
{{ $t('common.addBtn') }}
</el-button>
</div>