角色管理
This commit is contained in:
parent
9f07ceda4a
commit
b390fb6b0b
|
|
@ -1,6 +1,20 @@
|
|||
import http from "@/utils/request"
|
||||
|
||||
export default {
|
||||
account: {
|
||||
list: async function(data={}){
|
||||
return await http.get("account/list", data);
|
||||
},
|
||||
add: async function(data={}){
|
||||
return await http.post("account/add", data);
|
||||
},
|
||||
edit: async function(data={}){
|
||||
return await http.put("account/edit", data);
|
||||
},
|
||||
del: async function(data={}){
|
||||
return await http.delete("account/del", data);
|
||||
},
|
||||
},
|
||||
menu: {
|
||||
list: async function(data={}){
|
||||
return await http.get("menu/list", data);
|
||||
|
|
@ -55,4 +69,21 @@ export default {
|
|||
return await http.get("role/option", data);
|
||||
},
|
||||
},
|
||||
post: {
|
||||
list: async function (data = {}) {
|
||||
return await http.get("post/list", data);
|
||||
},
|
||||
add: async function (data = {}) {
|
||||
return await http.post("post/add", data);
|
||||
},
|
||||
edit: async function (data = {}) {
|
||||
return await http.put("post/edit", data);
|
||||
},
|
||||
del: async function (data = {}) {
|
||||
return await http.delete("post/del", data);
|
||||
},
|
||||
option: async function (data = {}) {
|
||||
return await http.get("post/option", data);
|
||||
},
|
||||
},
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<svg t="1750749932455" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5140" width="256" height="256"><path d="M547.84 969.547294a32.286118 32.286118 0 0 1-31.744-32.707765V376.952471c0-7.830588 2.710588-15.36 7.710118-21.323295L764.385882 66.861176H111.917176l220.882824 289.912471a33.551059 33.551059 0 0 1 6.806588 20.239059v334.305882l95.472941 98.544941c5.903059 6.144 9.155765 14.456471 9.09553 23.130353a33.129412 33.129412 0 0 1-9.456941 23.070118 31.021176 31.021176 0 0 1-44.513883 0L285.515294 747.881412a33.069176 33.069176 0 0 1-9.276235-23.130353V388.276706L21.744941 54.332235A33.490824 33.490824 0 0 1 27.045647 8.372706 31.201882 31.201882 0 0 1 46.622118 1.325176h786.793411c8.432941 0 16.504471 3.433412 22.40753 9.637648a33.370353 33.370353 0 0 1 1.626353 44.453647L579.523765 389.12v547.719529c0 18.070588-14.215529 32.707765-31.683765 32.707765" p-id="5141"></path><path d="M701.680941 475.015529a32.286118 32.286118 0 0 1-31.201882-33.129411 32.045176 32.045176 0 0 1 31.322353-32.346353h245.157647c17.528471 0 31.744 14.697412 31.744 32.768 0 18.070588-14.215529 32.707765-31.683765 32.707764h-245.338353z m0 202.511059a32.286118 32.286118 0 0 1-31.683765-32.768c0-18.070588 14.215529-32.647529 31.683765-32.707764h245.338353c17.468235 0.060235 31.623529 14.697412 31.683765 32.768-0.060235 18.070588-14.215529 32.647529-31.683765 32.707764h-245.338353z m0 204.8a31.021176 31.021176 0 0 1-22.407529-9.517176 33.069176 33.069176 0 0 1-9.276236-23.190588c0-18.070588 14.215529-32.647529 31.683765-32.707765h245.338353c17.468235 0 31.623529 14.697412 31.683765 32.768-0.060235 18.070588-14.215529 32.647529-31.683765 32.707765h-245.338353z" p-id="5142"></path></svg>
|
||||
</template>
|
||||
|
|
@ -1,3 +1,3 @@
|
|||
<template>
|
||||
<svg t="1750647322351" class="icon" viewBox="0 0 1194 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="972" width="256" height="256"><path d="M455.111111 14.222222a270.222222 270.222222 0 1 0 0 540.444445 270.222222 270.222222 0 0 0 0-540.444445z m0 85.333334a184.888889 184.888889 0 1 1 0 369.777777 184.888889 184.888889 0 0 1 0-369.777777z" p-id="973"></path><path d="M739.555556 14.222222a270.222222 270.222222 0 0 1 12.344888 540.16L739.555556 554.666667v-85.333334a184.888889 184.888889 0 1 0-95.061334-343.495111l-10.467555 6.769778-48.753778-69.973333A269.084444 269.084444 0 0 1 739.555556 14.222222z" p-id="974"></path><path d="M455.111111 469.333333c244.849778 0 440.888889 224.028444 440.888889 497.777778a42.666667 42.666667 0 1 1-85.333333 0c0-228.977778-160.540444-412.444444-355.555556-412.444444S99.555556 738.133333 99.555556 967.111111a42.666667 42.666667 0 1 1-85.333334 0c0-273.749333 196.039111-497.777778 440.888889-497.777778z" p-id="975"></path><path d="M739.555556 469.333333c244.849778 0 440.888889 224.028444 440.888888 497.777778a42.666667 42.666667 0 1 1-85.333333 0c0-228.977778-160.540444-412.444444-355.555555-412.444444a42.666667 42.666667 0 1 1 0-85.333334z" fill="#333333" p-id="976"></path></svg>
|
||||
<svg t="1750647322351" class="icon" viewBox="0 0 1194 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="972" width="256" height="256"><path d="M455.111111 14.222222a270.222222 270.222222 0 1 0 0 540.444445 270.222222 270.222222 0 0 0 0-540.444445z m0 85.333334a184.888889 184.888889 0 1 1 0 369.777777 184.888889 184.888889 0 0 1 0-369.777777z" p-id="973"></path><path d="M739.555556 14.222222a270.222222 270.222222 0 0 1 12.344888 540.16L739.555556 554.666667v-85.333334a184.888889 184.888889 0 1 0-95.061334-343.495111l-10.467555 6.769778-48.753778-69.973333A269.084444 269.084444 0 0 1 739.555556 14.222222z" p-id="974"></path><path d="M455.111111 469.333333c244.849778 0 440.888889 224.028444 440.888889 497.777778a42.666667 42.666667 0 1 1-85.333333 0c0-228.977778-160.540444-412.444444-355.555556-412.444444S99.555556 738.133333 99.555556 967.111111a42.666667 42.666667 0 1 1-85.333334 0c0-273.749333 196.039111-497.777778 440.888889-497.777778z" p-id="975"></path><path d="M739.555556 469.333333c244.849778 0 440.888889 224.028444 440.888888 497.777778a42.666667 42.666667 0 1 1-85.333333 0c0-228.977778-160.540444-412.444444-355.555555-412.444444a42.666667 42.666667 0 1 1 0-85.333334z" p-id="976"></path></svg>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,149 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-aside width="200px" v-loading="showGrouploading">
|
||||
<el-container>
|
||||
<el-header>
|
||||
<el-input placeholder="输入关键字进行过滤" v-model="groupFilterText" clearable></el-input>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<el-tree :default-expand-all="true" ref="groupRef" class="menu" node-key="dept_id" :data="group" :props="groupsProps" :current-node-key="''" :highlight-current="true" :expand-on-click-node="false" :filter-node-method="groupFilterNode" @node-click="groupClick"></el-tree>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-aside>
|
||||
<pi-table ref="tableRef" :apiObj="api.system.account.list" @selection-change="selectionChange" stripe remoteSort remoteFilter>
|
||||
<template #do>
|
||||
<el-button v-auth="'account:add'" type="primary" icon="el-icon-plus" @click="add"></el-button>
|
||||
</template>
|
||||
<template #search>
|
||||
<el-input v-model="search.name" placeholder="登录账号" clearable style="width: 200px;"></el-input>
|
||||
<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
|
||||
</template>
|
||||
<el-table-column type="selection" width="50"></el-table-column>
|
||||
<el-table-column label="ID" prop="account_id" width="100"></el-table-column>
|
||||
<el-table-column label="头像" width="100">
|
||||
<template #default="scope">
|
||||
<el-avatar :src="scope.row.avatar" size="small"></el-avatar>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="账号" prop="username"></el-table-column>
|
||||
<el-table-column label="昵称" prop="nickname"></el-table-column>
|
||||
<el-table-column label="角色" prop="roles">
|
||||
<template #default="scope">
|
||||
{{scope.row.roles.map(item=>item.role_name).toString()}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" prop="create_time"></el-table-column>
|
||||
<el-table-column label="操作" fixed="right" align="right" width="160">
|
||||
<template #default="scope">
|
||||
<el-button-group>
|
||||
<el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
|
||||
<el-button v-auth="'account:edit'" text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
|
||||
<el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
|
||||
<template #reference>
|
||||
<el-button v-auth="'account:del'" text type="primary" size="small">删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</pi-table>
|
||||
</el-container>
|
||||
<save-dialog v-if="dialogShow" ref="saveRef" @success="tableRef.refresh()" @closed="dialogShow=false"></save-dialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import saveDialog from './save'
|
||||
import {ref, watch, onMounted, getCurrentInstance, nextTick} from "vue";
|
||||
import api from "@/api/index";
|
||||
import tools from "@/utils/tools";
|
||||
|
||||
defineOptions({
|
||||
name: 'systemAccount'
|
||||
})
|
||||
|
||||
const {proxy} = getCurrentInstance()
|
||||
const tableRef = ref(null)
|
||||
const saveRef = ref(null)
|
||||
const groupRef = ref(null)
|
||||
|
||||
let dialogShow = ref(false)
|
||||
let showGrouploading = ref(false)
|
||||
let groupFilterText = ref('')
|
||||
let group = ref([])
|
||||
let groupsProps = ref({
|
||||
value: "dept_id",
|
||||
label: "dept_name",
|
||||
emitPath: false,
|
||||
checkStrictly: true
|
||||
})
|
||||
let selection = ref([])
|
||||
let search = ref({
|
||||
name: null,
|
||||
dept_id: null
|
||||
})
|
||||
|
||||
watch(groupFilterText, (val) => {
|
||||
groupRef.value.filter(val);
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
getGroup()
|
||||
})
|
||||
|
||||
//添加
|
||||
function add(){
|
||||
dialogShow.value = true
|
||||
nextTick(() => {
|
||||
saveRef.value.open('add', null, group.value)
|
||||
})
|
||||
}
|
||||
//编辑
|
||||
function table_edit(row){
|
||||
dialogShow.value = true
|
||||
nextTick(() => {
|
||||
saveRef.value.open('edit', row, group.value)
|
||||
})
|
||||
}
|
||||
//查看
|
||||
function table_show(row){
|
||||
dialogShow.value = true
|
||||
nextTick(() => {
|
||||
saveRef.value.open('show', row, group.value)
|
||||
})
|
||||
}
|
||||
//删除
|
||||
async function table_del(row){
|
||||
const loading = proxy.$loading();
|
||||
var res = await api.system.account.del({ids: row.account_id});
|
||||
tableRef.value.refresh()
|
||||
loading.close();
|
||||
proxy.$message.success(res.msg)
|
||||
}
|
||||
//表格选择后回调事件
|
||||
function selectionChange(e){
|
||||
selection.value = e;
|
||||
}
|
||||
//加载树数据
|
||||
async function getGroup(){
|
||||
showGrouploading.value = true;
|
||||
const res = await api.system.dept.option();
|
||||
showGrouploading.value = false;
|
||||
group.value = tools.makeTreeData(res.data, 0, "dept_id");
|
||||
group.value.unshift({'dept_id': null, 'dept_name': '所有部门'})
|
||||
}
|
||||
//树过滤
|
||||
function groupFilterNode(value, data){
|
||||
if (!value) return true;
|
||||
return data.label.indexOf(value) !== -1;
|
||||
}
|
||||
//树点击事件
|
||||
function groupClick(data){
|
||||
var params = {
|
||||
dept_id: data.dept_id
|
||||
}
|
||||
tableRef.value.reload(params)
|
||||
}
|
||||
//搜索
|
||||
function upsearch(){
|
||||
tableRef.value.upData(search.value)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,124 @@
|
|||
<template>
|
||||
<el-dialog :title="titleMap[mode]" v-model="visible" :width="500" destroy-on-close @closed="$emit('closed')">
|
||||
<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="formRef" label-width="100px" label-position="right">
|
||||
<el-form-item label="账号" prop="username">
|
||||
<el-input v-model="form.username" placeholder="用于登录系统" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="登录密码" prop="password">
|
||||
<el-input type="password" v-model="form.password" clearable show-password></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属部门" prop="dept_id">
|
||||
<el-cascader ref="deptRef" v-model="form.dept_id" :options="depts" :props="deptsProps" clearable style="width: 100%;"></el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属岗位" prop="posts">
|
||||
<el-select v-model="form.posts" multiple filterable style="width: 100%">
|
||||
<el-option v-for="item in groups2" :key="item.post_id" :label="item.post_name" :value="item.post_id"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属角色" prop="roles">
|
||||
<el-select v-model="form.roles" multiple filterable style="width: 100%">
|
||||
<el-option v-for="item in groups" :key="item.role_id" :label="item.role_name" :value="item.role_id"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="visible=false" >取 消</el-button>
|
||||
<el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import {ref, onMounted, getCurrentInstance} from 'vue'
|
||||
import api from "@/api/index"
|
||||
import tools from "@/utils/tools.js";
|
||||
|
||||
defineExpose({
|
||||
open
|
||||
})
|
||||
|
||||
const {proxy} = getCurrentInstance()
|
||||
const emit = defineEmits(['success', 'closed'])
|
||||
const formRef = ref(null)
|
||||
const deptRef = ref(null)
|
||||
let mode = ref('add')
|
||||
let titleMap = ref({
|
||||
add: '新增',
|
||||
edit: '编辑',
|
||||
show: '查看'
|
||||
})
|
||||
let visible = ref(false)
|
||||
let isSaveing = ref(false)
|
||||
const form = ref({
|
||||
account_id:null,
|
||||
username: "",
|
||||
password: "",
|
||||
dept_id: 0,
|
||||
roles: [],
|
||||
posts: []
|
||||
})
|
||||
const rules = ref({
|
||||
username: [
|
||||
{required: true, message: '请输入登录账号'}
|
||||
],
|
||||
realname: [
|
||||
{required: true, message: '请输入真实姓名'}
|
||||
],
|
||||
dept_id: [
|
||||
{required: true, message: '请选择所属部门'}
|
||||
],
|
||||
roles: [
|
||||
{required: true, message: '请选择所属角色', trigger: 'change'}
|
||||
]
|
||||
})
|
||||
let groups = ref([])
|
||||
let groups2 = ref([])
|
||||
let depts = ref([])
|
||||
let deptsProps = ref({
|
||||
value: "dept_id",
|
||||
label: "dept_name",
|
||||
checkStrictly: true
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
getGroup()
|
||||
getGroup2()
|
||||
})
|
||||
|
||||
function open(m='add', data = {}, d = []){
|
||||
mode.value = m;
|
||||
if (data) {
|
||||
Object.assign(form.value, data)
|
||||
form.value.roles = data.roles.map(item => item.role_id)
|
||||
form.value.posts = data.posts.map(item => item.post_id)
|
||||
}
|
||||
depts.value = d
|
||||
visible.value = true
|
||||
}
|
||||
|
||||
//加载树数据
|
||||
async function getGroup(){
|
||||
const res = await api.system.role.option();
|
||||
groups.value = res.data;
|
||||
}
|
||||
|
||||
async function getGroup2(){
|
||||
const res = await api.system.post.option();
|
||||
groups2.value = res.data;
|
||||
}
|
||||
|
||||
//表单提交方法
|
||||
async function submit(){
|
||||
// 校验登录
|
||||
const validate = await formRef.value.validate().catch(() => {});
|
||||
if(!validate){ return false }
|
||||
// 部门获取最后一项
|
||||
form.value.dept_id = deptRef.value.getCheckedNodes()[0].data.dept_id
|
||||
if (form.value.password) form.value.password = tools.crypto.MD5(form.value.password)
|
||||
isSaveing.value = true;
|
||||
const res = form.value.account_id ? await api.system.account.edit(form.value) : await api.system.account.add(form.value);
|
||||
isSaveing.value = false;
|
||||
emit('success')
|
||||
visible.value = false;
|
||||
proxy.$message.success(res.msg)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,131 @@
|
|||
<template>
|
||||
<pi-table ref="tableRef" :apiObj="api.system.dept.list" row-key="dept_id" @selection-change="selectionChange"
|
||||
hidePagination>
|
||||
<template #do>
|
||||
<el-button v-auth="'dept:add'" type="primary" icon="el-icon-plus" @click="add"></el-button>
|
||||
<el-button v-auth="'dept:del'" type="danger" plain icon="el-icon-delete" :disabled="selection.length===0"
|
||||
@click="batch_del"></el-button>
|
||||
</template>
|
||||
<template #search>
|
||||
<el-input v-model="search.dept_name" placeholder="部门名称" clearable style="width: 200px;"></el-input>
|
||||
<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
|
||||
</template>
|
||||
<el-table-column type="selection" width="50"></el-table-column>
|
||||
<el-table-column label="部门名称" prop="dept_name"></el-table-column>
|
||||
<el-table-column label="排序" prop="rank"></el-table-column>
|
||||
<el-table-column label="状态" prop="status">
|
||||
<template #default="scope">
|
||||
<el-tag v-if="scope.row.status===1" type="success">启用</el-tag>
|
||||
<el-tag v-if="scope.row.status===0" type="danger">停用</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" prop="create_time"></el-table-column>
|
||||
<el-table-column label="备注" prop="remark"></el-table-column>
|
||||
<el-table-column label="操作" fixed="right" align="right" width="170">
|
||||
<template #default="scope">
|
||||
<el-button-group>
|
||||
<el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看
|
||||
</el-button>
|
||||
<el-button v-auth="'dept:edit'" text type="primary" size="small"
|
||||
@click="table_edit(scope.row, scope.$index)">编辑
|
||||
</el-button>
|
||||
<el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
|
||||
<template #reference>
|
||||
<el-button v-auth="'dept:del'" text type="primary" size="small">删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</pi-table>
|
||||
<save-dialog v-if="dialogShow" ref="saveRef" @success="tableRef.refresh()"
|
||||
@closed="dialogShow=false"></save-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import saveDialog from './save'
|
||||
import {getCurrentInstance, nextTick, ref} from "vue";
|
||||
import api from "@/api/index";
|
||||
|
||||
defineOptions({
|
||||
name: "systemDept"
|
||||
})
|
||||
|
||||
const {proxy} = getCurrentInstance()
|
||||
const saveRef = ref(null)
|
||||
const tableRef = ref(null)
|
||||
|
||||
let dialogShow = ref(false)
|
||||
let selection = ref([])
|
||||
let search = ref({
|
||||
dept_name: null
|
||||
})
|
||||
|
||||
|
||||
//添加
|
||||
function add() {
|
||||
dialogShow.value = true
|
||||
nextTick(() => {
|
||||
saveRef.value.open()
|
||||
})
|
||||
}
|
||||
|
||||
//编辑
|
||||
function table_edit(row) {
|
||||
dialogShow.value = true
|
||||
nextTick(() => {
|
||||
saveRef.value.open('edit', row)
|
||||
})
|
||||
}
|
||||
|
||||
//查看
|
||||
function table_show(row) {
|
||||
dialogShow.value = true
|
||||
nextTick(() => {
|
||||
saveRef.value.open('show', row)
|
||||
})
|
||||
}
|
||||
|
||||
//删除
|
||||
async function table_del(row) {
|
||||
const res = await api.system.dept.del({ids: row.dept_id});
|
||||
tableRef.value.refresh()
|
||||
proxy.$message.success(res.msg)
|
||||
}
|
||||
|
||||
//批量删除
|
||||
async function batch_del() {
|
||||
proxy.$confirm(`确定删除选中的 ${selection.value.length} 项吗？如果删除项中含有子集将会被一并删除`, '提示', {
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
const loading = proxy.$loading();
|
||||
const res = await api.system.dept.del({ids: selection.value.map(item => item.dept_id).toString()});
|
||||
tableRef.value.refresh()
|
||||
loading.close();
|
||||
proxy.$message.success(res.msg)
|
||||
})
|
||||
}
|
||||
|
||||
//表格选择后回调事件
|
||||
function selectionChange(e) {
|
||||
selection.value.value = e;
|
||||
}
|
||||
|
||||
//搜索
|
||||
function upsearch() {
|
||||
tableRef.value.upData(search)
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
<template>
|
||||
<el-dialog :title="titleMap[mode]" v-model="visible" :width="500" destroy-on-close @closed="$emit('closed')">
|
||||
<el-form :model="form" :rules="rules" :disabled="mode==='show'" ref="formRef" label-width="100px"
|
||||
label-position="right">
|
||||
<el-form-item label="上级部门" prop="pid">
|
||||
<el-cascader v-model="form.pid" :options="groups" :props="groupsProps" :show-all-levels="false"
|
||||
clearable style="width: 100%;" placeholder="默认一级部门"></el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="部门名称" prop="dept_name">
|
||||
<el-input v-model="form.dept_name" placeholder="请输入部门名称" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="rank">
|
||||
<el-input-number v-model="form.rank" controls-position="right" :min="1" :max="9999"
|
||||
style="width: 100%;"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否有效" prop="status">
|
||||
<el-switch v-model="form.status" :active-value="1" :inactive-value="0"></el-switch>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="visible=false">取 消</el-button>
|
||||
<el-button v-if="mode!=='show'" type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {ref, onMounted, getCurrentInstance} from "vue";
|
||||
import api from "@/api/index";
|
||||
import tools from "@/utils/tools";
|
||||
|
||||
defineExpose({
|
||||
open
|
||||
})
|
||||
|
||||
const emit = defineEmits(['success', 'closed'])
|
||||
const formRef = ref(null)
|
||||
const {proxy} = getCurrentInstance()
|
||||
|
||||
let mode = ref('add')
|
||||
let titleMap = ref({
|
||||
add: '新增',
|
||||
edit: '编辑',
|
||||
show: '查看'
|
||||
})
|
||||
let visible = ref(false)
|
||||
let isSaveing = ref(false)
|
||||
let form = ref({
|
||||
dept_id: "",
|
||||
pid: 0,
|
||||
dept_name: "",
|
||||
rank: 1,
|
||||
status: 1,
|
||||
remark: ""
|
||||
})
|
||||
let rules = ref({
|
||||
rank: [
|
||||
{required: true, message: '请输入排序', trigger: 'change'}
|
||||
],
|
||||
dept_name: [
|
||||
{required: true, message: '请输入部门名称'}
|
||||
]
|
||||
})
|
||||
let groups = ref([])
|
||||
let groupsProps = ref({
|
||||
value: "dept_id",
|
||||
label: "dept_name",
|
||||
emitPath: false,
|
||||
checkStrictly: true
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
getGroup()
|
||||
})
|
||||
|
||||
//显示
|
||||
function open(m = 'add', data = null) {
|
||||
mode.value = m;
|
||||
visible.value = true;
|
||||
Object.assign(form.value, data)
|
||||
}
|
||||
|
||||
//加载树数据
|
||||
async function getGroup() {
|
||||
const res = await api.system.dept.list();
|
||||
groups.value = tools.makeTreeData(res.data, 0, "dept_id");
|
||||
}
|
||||
|
||||
//表单提交方法
|
||||
async function submit() {
|
||||
// 校验登录
|
||||
const validate = await formRef.value.validate().catch(() => {});
|
||||
if (!validate) {
|
||||
return false
|
||||
}
|
||||
isSaveing.value = true;
|
||||
const res = form.value.dept_id ? await api.system.dept.edit(form.value) : await api.system.dept.add(form.value);
|
||||
isSaveing.value = false;
|
||||
emit('success')
|
||||
visible.value = false;
|
||||
proxy.$message.success(res.msg)
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
|
|
@ -0,0 +1,118 @@
|
|||
<template>
|
||||
<pi-table ref="tableRef" :apiObj="api.system.post.list" @selection-change="selectionChange">
|
||||
<template #do>
|
||||
<el-button v-auth="'post:add'" type="primary" icon="el-icon-plus" @click="add"></el-button>
|
||||
<el-button v-auth="'post:del'" type="danger" plain icon="el-icon-delete" :disabled="selection.length===0"
|
||||
@click="batch_del"></el-button>
|
||||
</template>
|
||||
<template #search>
|
||||
<el-input v-model="search.post_name" placeholder="岗位名称" clearable style="width: 200px;"></el-input>
|
||||
<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
|
||||
</template>
|
||||
<el-table-column type="selection" width="50"></el-table-column>
|
||||
<el-table-column label="#" type="index" width="50"></el-table-column>
|
||||
<el-table-column label="岗位名称" prop="post_name"></el-table-column>
|
||||
<el-table-column label="状态" prop="status">
|
||||
<template #default="scope">
|
||||
<el-tag v-if="scope.row.status===1" type="success">启用</el-tag>
|
||||
<el-tag v-if="scope.row.status===0" type="danger">停用</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="排序" prop="rank"></el-table-column>
|
||||
<el-table-column label="创建时间" prop="create_time"></el-table-column>
|
||||
<el-table-column label="操作" fixed="right" align="right" width="170">
|
||||
<template #default="scope">
|
||||
<el-button-group>
|
||||
<el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看
|
||||
</el-button>
|
||||
<el-button v-auth="'post:edit'" text type="primary" size="small"
|
||||
@click="table_edit(scope.row, scope.$index)">编辑
|
||||
</el-button>
|
||||
<el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
|
||||
<template #reference>
|
||||
<el-button v-auth="'post:del'" text type="primary" size="small">删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</pi-table>
|
||||
<save-dialog v-if="dialogShow" ref="dialogRef" @success="tableRef.refresh()"
|
||||
@closed="dialogShow=false"></save-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import saveDialog from './save'
|
||||
import api from "@/api/index";
|
||||
import {getCurrentInstance, nextTick, ref} from "vue";
|
||||
|
||||
defineOptions({
|
||||
name: "systemPost"
|
||||
})
|
||||
|
||||
const {proxy} = getCurrentInstance()
|
||||
const tableRef = ref(null)
|
||||
const dialogRef = ref(null)
|
||||
|
||||
let dialogShow = ref(false)
|
||||
let selection = ref([])
|
||||
let search = ref({
|
||||
post_name: null
|
||||
})
|
||||
|
||||
//添加
|
||||
function add() {
|
||||
dialogShow.value = true
|
||||
nextTick(() => {
|
||||
dialogRef.value.open()
|
||||
})
|
||||
}
|
||||
|
||||
//编辑
|
||||
async function table_edit(row) {
|
||||
dialogShow.value = true
|
||||
nextTick(() => {
|
||||
dialogRef.value.open('edit', row)
|
||||
})
|
||||
}
|
||||
|
||||
//查看
|
||||
async function table_show(row) {
|
||||
dialogShow.value = true
|
||||
nextTick(() => {
|
||||
dialogRef.value.open('show', row)
|
||||
})
|
||||
}
|
||||
|
||||
//删除
|
||||
async function table_del(row) {
|
||||
const loading = proxy.$loading();
|
||||
const res = await api.system.post.del({ids: row.post_id});
|
||||
tableRef.value.refresh()
|
||||
loading.close();
|
||||
proxy.$message.success(res.msg)
|
||||
}
|
||||
|
||||
//批量删除
|
||||
async function batch_del() {
|
||||
proxy.$confirm(`确定删除选中的 ${selection.value.length} 项吗？如果删除项中含有子集将会被一并删除`, '提示', {
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
const loading = proxy.$loading();
|
||||
const res = await api.system.post.del({ids: selection.value.map(item => item.post_id).toString()});
|
||||
tableRef.value.refresh()
|
||||
loading.close();
|
||||
proxy.$message.success(res.msg)
|
||||
})
|
||||
}
|
||||
|
||||
//表格选择后回调事件
|
||||
function selectionChange(e) {
|
||||
selection.value = e;
|
||||
}
|
||||
|
||||
//搜索
|
||||
function upsearch() {
|
||||
tableRef.value.upData(search)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
<template>
|
||||
<el-dialog :title="titleMap[mode]" v-model="visible" :width="500" destroy-on-close @closed="$emit('closed')">
|
||||
<el-form :model="form" :rules="rules" :disabled="mode==='show'" ref="formRef" label-width="100px">
|
||||
<el-form-item label="岗位名称" prop="post_name">
|
||||
<el-input type="text" v-model="form.post_name" placeholder="请输入岗位名称" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序权重" prop="rank">
|
||||
<el-input-number v-model="form.rank" controls-position="right" :min="1" :max="9999" style="width: 100%;"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否启用" prop="status">
|
||||
<el-switch v-model="form.status" :active-value="1" :inactive-value="0"></el-switch>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="visible=false" >取 消</el-button>
|
||||
<el-button v-if="mode!=='show'" type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {getCurrentInstance, ref} from 'vue'
|
||||
import api from "@/api/index.js";
|
||||
|
||||
defineExpose({
|
||||
open
|
||||
})
|
||||
const emit = defineEmits(['success', 'closed'])
|
||||
const formRef = ref(null)
|
||||
const {proxy} = getCurrentInstance()
|
||||
|
||||
let mode = ref('add')
|
||||
let titleMap = ref({
|
||||
add: '新增',
|
||||
edit: '编辑',
|
||||
show: '查看'
|
||||
})
|
||||
let visible = ref(false)
|
||||
let isSaveing = ref(false)
|
||||
let form = ref({
|
||||
post_id: '',
|
||||
post_name: '',
|
||||
status: 1,
|
||||
rank: 1
|
||||
})
|
||||
const rules = ref({
|
||||
post_name:[
|
||||
{required: true, message: '请填写岗位名称'}
|
||||
],
|
||||
})
|
||||
|
||||
function open(m = 'add', data = null) {
|
||||
mode.value = m
|
||||
visible.value = true
|
||||
Object.assign(form.value, data)
|
||||
}
|
||||
|
||||
async function submit(){
|
||||
// 校验登录
|
||||
const validate = await formRef.value.validate().catch(() => {});
|
||||
if(!validate){ return false }
|
||||
isSaveing.value = true;
|
||||
const res = form.value.post_id? await api.system.post.edit(form.value) : await api.system.post.add(form.value);
|
||||
isSaveing.value = false;
|
||||
emit('success')
|
||||
visible.value = false;
|
||||
proxy.$message.success(res.msg)
|
||||
}
|
||||
</script>
|
||||
Loading…
Reference in New Issue