101 lines
2.0 KiB
Vue
101 lines
2.0 KiB
Vue
|
<template>
|
||
|
|
<div>
|
||
|
|
<Curd
|
||
|
|
:columns="columns"
|
||
|
|
:api-conf="apiConf"
|
||
|
|
:form-items="formItems"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
import base from "~/templates/base";
|
||
|
|
import Curd from "../../components/smallCommon/Curd.vue";
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: "role",
|
||
|
|
extends: base,
|
||
|
|
components: {
|
||
|
|
Curd
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
menus: [],
|
||
|
|
columns: [
|
||
|
|
{
|
||
|
|
dataIndex: 'name',
|
||
|
|
key: 'name',
|
||
|
|
title: '菜单名'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
dataIndex: 'url',
|
||
|
|
key: 'url',
|
||
|
|
title: '菜单URL'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
apiConf: {
|
||
|
|
addApi: {api: '/api/Menu/add', method: 'post',},
|
||
|
|
listApi: {api: '/api/Menu/list', method: 'get', noPage: true},
|
||
|
|
deleteApi: {api: '/api/Menu/remove', method: 'delete', paramsType: 'Array'},
|
||
|
|
editApi: {api: '/api/Menu/update', method: 'put'},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
|
||
|
|
computed: {
|
||
|
|
formItems() {
|
||
|
|
const self = this
|
||
|
|
return [
|
||
|
|
{
|
||
|
|
type: 'input',
|
||
|
|
key: 'name',
|
||
|
|
label: '菜单名',
|
||
|
|
isSearch: true,
|
||
|
|
placeholder: '请输入菜单名',
|
||
|
|
rules: [
|
||
|
|
{required: true, message: '请输入菜单名'}
|
||
|
|
]
|
||
|
|
},
|
||
|
|
|
||
|
|
{
|
||
|
|
type: 'input',
|
||
|
|
key: 'url',
|
||
|
|
label: '路由',
|
||
|
|
rules: [
|
||
|
|
{required: true, message: '请输入菜单名'}
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
type: 'treeSelect',
|
||
|
|
key: 'parentId',
|
||
|
|
label: '父级菜单',
|
||
|
|
placeholder: '',
|
||
|
|
children: self.menus,
|
||
|
|
props: {
|
||
|
|
replaceFields: {
|
||
|
|
title: 'name',
|
||
|
|
value: 'id',
|
||
|
|
key: 'id',
|
||
|
|
children: 'children'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
this.getMenus()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
getMenus() {
|
||
|
|
this.$get('/api/Menu/list').then(({data}) => {
|
||
|
|
this.menus = data
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style scoped lang="less">
|
||
|
|
|
||
|
|
</style>
|