|
|
<script setup>
|
|
|
/**
|
|
|
* name：
|
|
|
* user：sa0ChunLuyu
|
|
|
* date：2022年12月25日 20:50:25
|
|
|
*/
|
|
|
import {
|
|
|
AdminDeleteAction,
|
|
|
AdminUpdateAction,
|
|
|
AdminEditPasswordAction,
|
|
|
AdminAuthSelectAction,
|
|
|
AdminCreateAction,
|
|
|
AdminListAction,
|
|
|
$response
|
|
|
} from '~/api'
|
|
|
import $router from '~/router'
|
|
|
import {onBeforeRouteUpdate} from "vue-router";
|
|
|
import {h} from "vue";
|
|
|
import {NTag} from 'naive-ui'
|
|
|
|
|
|
const default_page_options = {
|
|
|
page: 1,
|
|
|
status: 0,
|
|
|
search: ''
|
|
|
}
|
|
|
const page_options = ref(JSON.parse(JSON.stringify(default_page_options)))
|
|
|
onBeforeRouteUpdate((to) => {
|
|
|
routerChange(to.query)
|
|
|
})
|
|
|
const routerChange = (query) => {
|
|
|
page_options.value = {
|
|
|
page: Number(query.page) || default_page_options.page,
|
|
|
status: Number(query.status) || default_page_options.status,
|
|
|
search: query.search || default_page_options.search,
|
|
|
}
|
|
|
AdminList()
|
|
|
}
|
|
|
onMounted(() => {
|
|
|
routerChange($router.currentRoute.value.query)
|
|
|
AdminAuthSelect()
|
|
|
})
|
|
|
const admin_auth_select_list = ref([])
|
|
|
const admin_auth_loading = ref(false)
|
|
|
const AdminAuthSelect = async () => {
|
|
|
admin_auth_loading.value = true
|
|
|
const response = await AdminAuthSelectAction()
|
|
|
admin_auth_loading.value = false
|
|
|
$response(response, () => {
|
|
|
admin_auth_select_list.value = response.data.list
|
|
|
})
|
|
|
}
|
|
|
const admin_active = ref([])
|
|
|
const admin_list = ref([])
|
|
|
const admin_list_last_page = ref(0)
|
|
|
const AdminList = async () => {
|
|
|
const response = await AdminListAction(page_options.value)
|
|
|
$response(response, () => {
|
|
|
admin_list.value = response.data.data
|
|
|
admin_list_last_page.value = response.data.last_page
|
|
|
})
|
|
|
}
|
|
|
const admin_columns = [{
|
|
|
type: 'selection'
|
|
|
}, {
|
|
|
title: '昵称',
|
|
|
key: 'nickname'
|
|
|
}, {
|
|
|
title: '权限',
|
|
|
key: 'admin_auth_name',
|
|
|
render(row) {
|
|
|
return h(
|
|
|
'div',
|
|
|
{},
|
|
|
{
|
|
|
default: () => {
|
|
|
if (row.admin_auth_id === -1) return '超级管理员'
|
|
|
if (row.admin_auth_id === 0) return '无权限分组'
|
|
|
return !!row.admin_auth_name ? row.admin_auth_name : '异常权限组'
|
|
|
}
|
|
|
}
|
|
|
)
|
|
|
}
|
|
|
}, {
|
|
|
title: '状态',
|
|
|
key: 'status',
|
|
|
render(row) {
|
|
|
return h(
|
|
|
NTag,
|
|
|
{
|
|
|
type: row.status === 1 ? 'success' : 'error'
|
|
|
},
|
|
|
{
|
|
|
default: () => {
|
|
|
return row.status === 1 ? '可用' : '停用'
|
|
|
}
|
|
|
}
|
|
|
)
|
|
|
}
|
|
|
}]
|
|
|
const create_show = ref(false)
|
|
|
const create_data_default = {
|
|
|
nickname: '',
|
|
|
account: '',
|
|
|
password: '',
|
|
|
admin_auth_id: 0,
|
|
|
}
|
|
|
const create_data = ref(JSON.parse(JSON.stringify(create_data_default)))
|
|
|
const AdminCreate = async () => {
|
|
|
const response = await AdminCreateAction(create_data.value)
|
|
|
$response(response, () => {
|
|
|
window.$message().success(response.message)
|
|
|
create_show.value = false
|
|
|
create_data.value = JSON.parse(JSON.stringify(create_data_default))
|
|
|
AdminList()
|
|
|
})
|
|
|
}
|
|
|
const createShowClick = () => {
|
|
|
create_data.value = JSON.parse(JSON.stringify(create_data_default))
|
|
|
create_show.value = true
|
|
|
}
|
|
|
const searchClick = () => {
|
|
|
updatePage(1)
|
|
|
}
|
|
|
const updatePage = (page) => {
|
|
|
page_options.value.page = page
|
|
|
pagePush()
|
|
|
}
|
|
|
const pagePush = () => {
|
|
|
$router.push({
|
|
|
name: 'admin-list',
|
|
|
query: page_options.value
|
|
|
})
|
|
|
}
|
|
|
const update_show = ref(false)
|
|
|
const update_password_show = ref(false)
|
|
|
const update_data_default = {
|
|
|
id: 0,
|
|
|
nickname: '',
|
|
|
account_id: 0,
|
|
|
account: '',
|
|
|
password: '',
|
|
|
status: '',
|
|
|
admin_auth_id: 0,
|
|
|
}
|
|
|
const update_data = ref(JSON.parse(JSON.stringify(update_data_default)))
|
|
|
const updateShowClick = (type) => {
|
|
|
if (admin_active.value.length !== 1) return window.$message().error('请选择一个管理员')
|
|
|
update_data.value = JSON.parse(JSON.stringify(update_data_default))
|
|
|
for (let i = 0; i < admin_list.value.length; i++) {
|
|
|
if (admin_active.value[0] === admin_list.value[i].id) {
|
|
|
update_data.value = {
|
|
|
id: admin_list.value[i].id,
|
|
|
nickname: admin_list.value[i].nickname,
|
|
|
account_id: admin_list.value[i].account_id,
|
|
|
account: admin_list.value[i].account,
|
|
|
password: '',
|
|
|
status: admin_list.value[i].status,
|
|
|
admin_auth_id: admin_list.value[i].admin_auth_id,
|
|
|
}
|
|
|
type === 'info' ? update_show.value = true : update_password_show.value = true
|
|
|
return
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
const AdminUpdate = async () => {
|
|
|
const response = await AdminUpdateAction({
|
|
|
admin_id: update_data.value.id,
|
|
|
nickname: update_data.value.nickname,
|
|
|
status: update_data.value.status,
|
|
|
admin_auth_id: update_data.value.admin_auth_id,
|
|
|
})
|
|
|
$response(response, () => {
|
|
|
window.$message().success(response.message)
|
|
|
update_show.value = false
|
|
|
update_data.value = JSON.parse(JSON.stringify(update_data_default))
|
|
|
AdminList()
|
|
|
})
|
|
|
}
|
|
|
const AdminEditPassword = async () => {
|
|
|
const response = await AdminEditPasswordAction({
|
|
|
account_id: update_data.value.account_id,
|
|
|
password: update_data.value.password,
|
|
|
})
|
|
|
$response(response, () => {
|
|
|
window.$message().success(response.message)
|
|
|
update_password_show.value = false
|
|
|
update_data.value = JSON.parse(JSON.stringify(update_data_default))
|
|
|
AdminList()
|
|
|
})
|
|
|
}
|
|
|
const delete_show = ref(false)
|
|
|
const deleteShowClick = () => {
|
|
|
if (admin_active.value.length <= 0) return window.$message().error('请选择一个管理员')
|
|
|
delete_show.value = true
|
|
|
}
|
|
|
const AdminDelete = async () => {
|
|
|
const response = await AdminDeleteAction(admin_active.value)
|
|
|
$response(response, () => {
|
|
|
window.$message().success(response.message)
|
|
|
delete_show.value = false
|
|
|
admin_active.value = []
|
|
|
AdminList()
|
|
|
})
|
|
|
}
|
|
|
</script>
|
|
|
<template>
|
|
|
<div>
|
|
|
<n-modal v-model:show="delete_show" preset="card" :style="{width: '400px'}" title="删除确认" :auto-focus="false"
|
|
|
:bordered="false">
|
|
|
<div>
|
|
|
<n-space justify="center">
|
|
|
<n-button @click="AdminDelete()" type="info">确定</n-button>
|
|
|
<n-button @click="delete_show = false">取消</n-button>
|
|
|
</n-space>
|
|
|
</div>
|
|
|
</n-modal>
|
|
|
<n-modal v-model:show="update_password_show" preset="card" :style="{width: '500px'}" title="修改密码"
|
|
|
:auto-focus="false"
|
|
|
:bordered="false">
|
|
|
<div>
|
|
|
<n-space align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">密码</div>
|
|
|
</n-tag>
|
|
|
<n-input class="form_input_wrapper" v-model:value="update_data.password"></n-input>
|
|
|
</n-space>
|
|
|
<n-button @click="AdminEditPassword()" type="info" mt-2>确定</n-button>
|
|
|
</div>
|
|
|
</n-modal>
|
|
|
<n-modal v-model:show="update_show" preset="card" :style="{width: '500px'}" title="修改信息" :auto-focus="false"
|
|
|
:bordered="false">
|
|
|
<div>
|
|
|
<n-space align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">账号</div>
|
|
|
</n-tag>
|
|
|
<n-input disabled class="form_input_wrapper" v-model:value="update_data.account"></n-input>
|
|
|
</n-space>
|
|
|
<n-space mt-2 align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">昵称</div>
|
|
|
</n-tag>
|
|
|
<n-input class="form_input_wrapper" v-model:value="update_data.nickname"></n-input>
|
|
|
</n-space>
|
|
|
<n-space mt-2 align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">权限</div>
|
|
|
</n-tag>
|
|
|
<n-select class="form_input_wrapper" v-model:value="update_data.admin_auth_id" :options="[
|
|
|
update_data.admin_auth_id === -1 ? {value:-1,label:'超级管理员'}: {value:0,label:'暂不分配'},
|
|
|
...admin_auth_select_list
|
|
|
]"/>
|
|
|
<div>
|
|
|
<n-button @click="AdminAuthSelect()" :loading="admin_auth_loading" size="small" type="info">
|
|
|
<template #icon>
|
|
|
<n-icon>
|
|
|
<Icon type="refresh" :size="16"></Icon>
|
|
|
</n-icon>
|
|
|
</template>
|
|
|
刷新
|
|
|
</n-button>
|
|
|
</div>
|
|
|
</n-space>
|
|
|
<n-space mt-2 align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">状态</div>
|
|
|
</n-tag>
|
|
|
<n-radio-group v-model:value="update_data.status" name="update_status_radio">
|
|
|
<n-space>
|
|
|
<n-radio :value="1">可用</n-radio>
|
|
|
<n-radio :value="2">停用</n-radio>
|
|
|
</n-space>
|
|
|
</n-radio-group>
|
|
|
</n-space>
|
|
|
<n-button @click="AdminUpdate()" type="info" mt-2>确定</n-button>
|
|
|
</div>
|
|
|
</n-modal>
|
|
|
<n-modal v-model:show="create_show" preset="card" :style="{width: '500px'}" title="新建" :auto-focus="false"
|
|
|
:bordered="false">
|
|
|
<div>
|
|
|
<n-space align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">账号</div>
|
|
|
</n-tag>
|
|
|
<n-input class="form_input_wrapper" v-model:value="create_data.account"></n-input>
|
|
|
</n-space>
|
|
|
<n-space mt-2 align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">昵称</div>
|
|
|
</n-tag>
|
|
|
<n-input class="form_input_wrapper" v-model:value="create_data.nickname"></n-input>
|
|
|
</n-space>
|
|
|
<n-space mt-2 align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">密码</div>
|
|
|
</n-tag>
|
|
|
<n-input class="form_input_wrapper" v-model:value="create_data.password"></n-input>
|
|
|
</n-space>
|
|
|
<n-space mt-2 align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">权限</div>
|
|
|
</n-tag>
|
|
|
<n-select class="form_input_wrapper" v-model:value="create_data.admin_auth_id" :options="[
|
|
|
{value:0,label:'暂不分配'},
|
|
|
...admin_auth_select_list
|
|
|
]"/>
|
|
|
<div>
|
|
|
<n-button @click="AdminAuthSelect()" :loading="admin_auth_loading" size="small" type="info">
|
|
|
<template #icon>
|
|
|
<n-icon>
|
|
|
<Icon type="refresh" :size="16"></Icon>
|
|
|
</n-icon>
|
|
|
</template>
|
|
|
刷新
|
|
|
</n-button>
|
|
|
</div>
|
|
|
</n-space>
|
|
|
<n-button @click="AdminCreate()" type="info" mt-2>确定</n-button>
|
|
|
</div>
|
|
|
</n-modal>
|
|
|
<n-card title="管理员列表">
|
|
|
<div>
|
|
|
<n-space align="center">
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">昵称</div>
|
|
|
</n-tag>
|
|
|
<n-input class="form_input_wrapper" v-model:value="page_options.search"></n-input>
|
|
|
<n-tag>
|
|
|
<div class="form_tag_wrapper">状态</div>
|
|
|
</n-tag>
|
|
|
<n-radio-group v-model:value="page_options.status" name="status_radio">
|
|
|
<n-space>
|
|
|
<n-radio :value="0">全部</n-radio>
|
|
|
<n-radio :value="1">可用</n-radio>
|
|
|
<n-radio :value="2">停用</n-radio>
|
|
|
</n-space>
|
|
|
</n-radio-group>
|
|
|
<n-button @click="searchClick()" type="info">搜索</n-button>
|
|
|
</n-space>
|
|
|
<n-space mt-2>
|
|
|
<n-button @click="createShowClick()" type="success">新建</n-button>
|
|
|
<n-button @click="deleteShowClick()" type="error">删除</n-button>
|
|
|
<n-button @click="updateShowClick('info')" type="info">修改信息</n-button>
|
|
|
<n-button @click="updateShowClick('password')" type="info">修改密码</n-button>
|
|
|
</n-space>
|
|
|
<n-data-table mt-2 v-model:checked-row-keys="admin_active" :columns="admin_columns"
|
|
|
:row-key="row=>row.id" :data="admin_list"/>
|
|
|
<n-pagination v-if="admin_list_last_page > 1" @update:page="updatePage" mt-2 v-model:page="page_options.page"
|
|
|
:page-count="admin_list_last_page"/>
|
|
|
</div>
|
|
|
</n-card>
|
|
|
</div>
|
|
|
</template>
|
|
|
<style scoped>
|
|
|
|
|
|
</style>
|
|
|
<route>
|
|
|
{"meta":{"title":"管理员列表"}}
|
|
|
</route>
|
|
|
|