115 lines
3.4 KiB
Vue
115 lines
3.4 KiB
Vue
<template>
|
|
<div>
|
|
<div class="custom-table-header">
|
|
<div style="flex: 1; font-weight: 700">接口权限列表</div>
|
|
<el-input
|
|
v-model="tableStore.table.params.searchValue"
|
|
style="width: 240px"
|
|
placeholder="请输入菜单名称"
|
|
class="ml10"
|
|
clearable
|
|
@input="search"
|
|
/>
|
|
<el-button :icon="Plus" type="primary" @click="addMenu" class="ml10" :disabled="!props.id">新增</el-button>
|
|
</div>
|
|
<Table ref="tableRef" />
|
|
<popupApi ref="popupRef" @init="tableStore.index()"></popupApi>
|
|
</div>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import { Plus } from '@element-plus/icons-vue'
|
|
import { ref, Ref, inject, provide, watch } from 'vue'
|
|
import TableStore from '@/utils/tableStore'
|
|
import Table from '@/components/table/index.vue'
|
|
import popupApi from './popupApi.vue'
|
|
import { deleteMenu } from '@/api/user-boot/function'
|
|
|
|
defineOptions({
|
|
name: 'auth/menu/api'
|
|
})
|
|
const emits = defineEmits<{
|
|
(e: 'init'): void
|
|
}>()
|
|
const props = defineProps({
|
|
id: {
|
|
type: String,
|
|
default: ''
|
|
}
|
|
})
|
|
const tableRef = ref()
|
|
const popupRef = ref()
|
|
const apiList = ref([])
|
|
const tableStore = new TableStore({
|
|
showPage: false,
|
|
url: '/user-boot/function/getButtonById',
|
|
column: [
|
|
{ title: '普通接口/接口名称', field: 'name' },
|
|
{ title: '接口类型', field: 'type' },
|
|
{ title: 'URL接口路径', field: 'path' },
|
|
{
|
|
title: '操作',
|
|
align: 'center',
|
|
width: '180',
|
|
render: 'buttons',
|
|
buttons: [
|
|
{
|
|
name: 'edit',
|
|
title: '编辑',
|
|
type: 'primary',
|
|
icon: 'el-icon-EditPen',
|
|
render: 'basicButton',
|
|
click: row => {
|
|
popupRef.value.open('编辑接口权限', row)
|
|
}
|
|
},
|
|
{
|
|
name: 'del',
|
|
title: '删除',
|
|
type: 'danger',
|
|
icon: 'el-icon-Delete',
|
|
render: 'confirmButton',
|
|
popconfirm: {
|
|
confirmButtonText: '确认',
|
|
cancelButtonText: '取消',
|
|
confirmButtonType: 'danger',
|
|
title: '确定删除该菜单吗？'
|
|
},
|
|
click: row => {
|
|
deleteMenu(row.id).then(() => {
|
|
tableStore.index()
|
|
})
|
|
}
|
|
}
|
|
]
|
|
}
|
|
],
|
|
loadCallback: () => {
|
|
apiList.value = tableStore.table.data
|
|
search()
|
|
}
|
|
})
|
|
tableStore.table.loading = false
|
|
watch(
|
|
() => props.id,
|
|
() => {
|
|
tableStore.table.params.id = props.id
|
|
tableStore.index()
|
|
}
|
|
)
|
|
provide('tableStore', tableStore)
|
|
|
|
const addMenu = () => {
|
|
console.log(popupRef)
|
|
popupRef.value.open('新增接口权限', {
|
|
pid: props.id
|
|
})
|
|
}
|
|
const search = () => {
|
|
tableStore.table.data = apiList.value.filter(
|
|
(item: any) =>
|
|
!tableStore.table.params.searchValue ||
|
|
item.name.indexOf(tableStore.table.params.searchValue) !== -1 ||
|
|
item.path.indexOf(tableStore.table.params.searchValue) !== -1
|
|
)
|
|
}
|
|
</script> |