mirrors/pig-ui
1
0
Fork 0
mirror of https://gitee.com/log4j/pig-ui.git synced 2024-12-23 05:40:20 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of codeup.aliyun.com:pig/pigx/pigx-ui-pro

Browse Source
This commit is contained in:
lbw 2023-02-07 13:40:55 +08:00
commit 144b75f352
16 changed files with 618 additions and 273 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/api/admin/dept.ts
View File

@ -9,4 +9,62 @@ export const depttree = (params?: Object) => {
}
export const addObj = (obj: Object) => {
return request({
url: '/admin/dept/',
method: 'post',
data: obj
})
}
export const getObj = (id:string) => {
return request({
url: '/admin/dept/' + id,
method: 'get'
})
}
export const delObj = (id: string) => {
return request({
url: '/admin/dept/' + id,
method: 'delete'
})
}
export const putObj = (obj: Object) => {
return request({
url: '/admin/dept/',
method: 'put',
data: obj
})
}
export const syncUser = () => {
return request({
url: '/admin/connect/sync/ding/user',
method: 'post'
})
}
export const syncDept= () => {
return request({
url: '/admin/connect/sync/ding/dept',
method: 'post'
})
}
export const syncCpUser= () => {
return request({
url: '/admin/connect/sync/cp/user',
method: 'post'
})
}
export const syncCpDept= () => {
return request({
url: '/admin/connect/sync/cp/dept',
method: 'post'
})
}

57
src/api/admin/tenant-menu.ts Normal file
View File

@ -0,0 +1,57 @@
import request from "/@/utils/request"
export function fetchList(query?: Object) {
return request({
url: '/admin/tenant-menu/page',
method: 'get',
params: query
})
}
export function addObj (obj: object) {
return request({
url: '/admin/tenant-menu',
method: 'post',
data: obj
})
}
export function getObj(id: string) {
return request({
url: '/admin/tenant-menu/',
method: 'get',
params: {
id: id
}
})
}
export function delObj(id: string) {
return request({
url: '/admin/tenant-menu/' + id,
method: 'delete'
})
}
export function putObj(obj:Object) {
return request({
url: '/admin/tenant-menu',
method: 'put',
data: obj
})
}
export function menuList() {
return request({
url: '/admin/tenant-menu/list',
method: 'get'
})
}
export function treemenu(){
return request({
url: '/admin/tenant-menu/tree/menu',
method: 'get'
})
}

2
src/hooks/table.ts
View File

@ -21,7 +21,7 @@ export interface BasicTableProps {
// loading
loading?: Boolean
selectObjs: any[]
selectObjs?: any[]
}
export interface Pagination {

2
src/utils/request.ts
View File

@ -1,4 +1,4 @@
import axios, {AxiosInstance, AxiosRequestConfig, InternalAxiosRequestConfig} from 'axios';
import axios, {AxiosInstance, InternalAxiosRequestConfig} from 'axios';
import errorCode from './errorCode'
import {ElMessage, ElMessageBox} from 'element-plus';
import {Session} from '/@/utils/storage';

167
src/views/admin/dept/dialog.vue
View File

@ -1,167 +0,0 @@
<template>
<div class="system-dept-dialog-container">
<el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="769px">
<el-form ref="deptDialogFormRef" :model="state.ruleForm" size="default" label-width="90px">
<el-row :gutter="35">
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item label="上级部门">
<el-cascader
:options="state.deptData"
:props="{ checkStrictly: true, value: 'deptName', label: 'deptName' }"
placeholder="请选择部门"
clearable
class="w100"
v-model="state.ruleForm.deptLevel"
>
<template #default="{ node, data }">
<span>{{ data.deptName }}</span>
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
</template>
</el-cascader>
</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.deptName" 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.person" 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.phone" 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.email" 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-number v-model="state.ruleForm.sort" :min="0" :max="999" controls-position="right" placeholder="请输入排序" class="w100" />
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" 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-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="systemDeptDialog">
import { reactive, ref } from 'vue';
// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
// 定义变量内容
const deptDialogFormRef = ref();
const state = reactive({
ruleForm: {
deptLevel: [] as string[], // 上级部门
deptName: '', // 部门名称
person: '', // 负责人
phone: '', // 手机号
email: '', // 邮箱
sort: 0, // 排序
status: true, // 部门状态
describe: '', // 部门描述
},
deptData: [] as DeptTreeType[], // 部门数据
dialog: {
isShowDialog: false,
type: '',
title: '',
submitTxt: '',
},
});
// 打开弹窗
const openDialog = (type: string, row: RowDeptType) => {
if (type === 'edit') {
row.deptLevel = ['vueNextAdmin'];
row.person = 'lyt';
row.phone = '12345678910';
row.email = 'vueNextAdmin@123.com';
state.ruleForm = row;
state.dialog.title = '修改部门';
state.dialog.submitTxt = '修 改';
} else {
state.dialog.title = '新增部门';
state.dialog.submitTxt = '新 增';
// 清空表单，此项需加表单验证才能使用
// nextTick(() => {
// deptDialogFormRef.value.resetFields();
// });
}
state.dialog.isShowDialog = true;
getMenuData();
};
// 关闭弹窗
const closeDialog = () => {
state.dialog.isShowDialog = false;
};
// 取消
const onCancel = () => {
closeDialog();
};
// 提交
const onSubmit = () => {
closeDialog();
emit('refresh');
// if (state.dialog.type === 'add') { }
};
// 初始化部门数据
const getMenuData = () => {
state.deptData.push({
deptName: 'vueNextAdmin',
createTime: new Date().toLocaleString(),
status: true,
sort: Math.random(),
describe: '顶级部门',
id: Math.random(),
children: [
{
deptName: 'IT外包服务',
createTime: new Date().toLocaleString(),
status: true,
sort: Math.random(),
describe: '总部',
id: Math.random(),
},
{
deptName: '资本控股',
createTime: new Date().toLocaleString(),
status: true,
sort: Math.random(),
describe: '分部',
id: Math.random(),
},
],
});
};
// 暴露变量
defineExpose({
openDialog,
});
</script>

130
src/views/admin/dept/form.vue Normal file
View File

@ -0,0 +1,130 @@
<template>
<div class="system-dept-dialog-container">
<el-dialog :title="dataForm.deptId ? $t('common.editBtn') : $t('common.addBtn')" v-model="visible" width="769px">
<el-form ref="deptDialogFormRef" :model="dataForm" size="default" label-width="90px" :rules="dataRules">
<el-row :gutter="35">
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item :label="$t('sysdept.parentId')" prop="parentId">
<el-tree-select v-model="dataForm.parentId" :data="parentData"
:props="{ value: 'id', label: 'name', children: 'children' }" class="w100" clearable check-strictly
:placeholder="$t('sysdept.inputparentIdTip')"/>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
<el-form-item :label="$t('sysdept.name')" prop="name">
<el-input v-model="dataForm.name" :placeholder="$t('sysdept.inputnameTip')" clearable/>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
<el-form-item :label="$t('sysdept.sortOrder')" prop="sortOrder">
<el-input-number v-model="dataForm.sortOrder" :placeholder="$t('sysdept.inputsortOrderTip')" clearable/>
</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="systemDeptDialog">
import { getObj, depttree,addObj,putObj } from '/@/api/admin/dept'
import {useMessage} from "/@/hooks/message";
// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
// 定义变量内容
const deptDialogFormRef = ref();
const dataForm = reactive({
parentId: '',
deptId: '',
name: '',
sortOrder: 9999
})
const parentData = ref<any[]>([])
const visible = ref(false)
const dataRules = ref({
parentId: [{ required: true, message: "上级部门不能为空", trigger: "blur" }],
name: [{ required: true, message: "部门名称不能为空", trigger: "blur" }],
sortOrder: [{ required: true, message: "排序不能为空", trigger: "blur" }],
})
// 打开弹窗
const openDialog = (type: string, id: string) => {
if (type === 'edit') {
getObj(id).then(res => {
Object.assign(dataForm,res.data)
}).catch(err => {
useMessage().error(err.msg)
})
} else {
// 清空表单，此项需加表单验证才能使用
nextTick(() => {
deptDialogFormRef?.value?.resetFields();
dataForm.parentId = id
});
}
visible.value = true
getDeptData()
};
// 关闭弹窗
const closeDialog = () => {
visible.value = false;
};
// 取消
const onCancel = () => {
closeDialog();
};
// 提交
const onSubmit = () => {
deptDialogFormRef.value.validate((valid: boolean) => {
if (!valid) {
return false
}
if (dataForm.deptId) {
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)
})
}
})
};
// 从后端获取菜单信息
const getDeptData = async () => {
depttree().then(res => {
parentData.value = []
const dept = {
id: '-1', name: '根部门', children: [] as any[]
};
dept.children = res.data;
parentData.value.push(dept)
})
};
// 暴露变量
defineExpose({
openDialog,
});
</script>

13
src/views/admin/dept/i18n/en.ts Normal file
View File

@ -0,0 +1,13 @@
export default {
sysdept: {
name: 'dept name',
parentId: 'parent dept',
createTime: 'createTime',
weight: 'weight',
sortOrder: 'sortOrder',
inputdeptNameTip: 'input deptName',
inputnameTip: 'input deptName',
inputparentIdTip: 'select deptName',
inputsortOrderTip: 'input sortOrder',
}
}

15
src/views/admin/dept/i18n/zh-cn.ts Normal file
View File

@ -0,0 +1,15 @@
export default {
sysdept: {
name: '部门名称',
parentId: '上级部门',
createTime: '创建时间',
weight: '排序',
sortOrder: '排序',
inputdeptNameTip: '请输入部门名称',
inputnameTip: '请输入部门名称',
inputparentIdTip: '请选择上级部门',
inputsortOrderTip: '请输入排序',
},
}

151
src/views/admin/dept/index.vue
View File

@ -1,135 +1,84 @@
<template>
<div class="system-dept-container layout-padding">
<el-card shadow="hover" class="layout-padding-auto">
<div class="system-dept-search 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="onOpenAddDept('add')">
<el-icon>
<ele-FolderAdd />
</el-icon>
新增部门
</el-button>
</div>
<div class="mb15">
<el-input :placeholder="$t('sysdept.inputdeptNameTip')" style="max-width: 180px" v-model="state.queryForm.deptName"> </el-input>
<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'">
{{ $t('common.addBtn') }}
</el-button>
</div>
<el-table
:data="state.tableData.data"
v-loading="state.tableData.loading"
:data="state.dataList"
v-loading="state.loading"
style="width: 100%"
row-key="id"
default-expand-all
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
>
<el-table-column prop="deptName" label="部门名称" show-overflow-tooltip> </el-table-column>
<el-table-column label="排序" show-overflow-tooltip width="80">
<el-table-column :label="$t('sysdept.name')" prop="name" width="400" show-overflow-tooltip> </el-table-column>
<el-table-column :label="$t('sysdept.weight')" prop="weight" show-overflow-tooltip width="80"></el-table-column>
<el-table-column prop="createTime" :label="$t('sysdept.createTime')" show-overflow-tooltip></el-table-column>
<el-table-column :label="$t('common.action')" show-overflow-tooltip width="200">
<template #default="scope">
{{ scope.$index }}
</template>
</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="createTime" label="创建时间" show-overflow-tooltip></el-table-column>
<el-table-column label="操作" show-overflow-tooltip width="140">
<template #default="scope">
<el-button text type="primary" @click="onOpenAddDept('add')">新增</el-button>
<el-button text type="primary" @click="onOpenEditDept('edit', scope.row)">修改</el-button>
<el-button text type="primary" @click="onTabelRowDel(scope.row)">删除</el-button>
<el-button text type="primary" @click="onOpenAddDept('add',scope.row)" v-auth="'sys_dept_add'"> {{ $t('common.addBtn') }}</el-button>
<el-button text type="primary" @click="onOpenEditDept('edit', scope.row)" v-auth="'sys_dept_edit'">{{$t('common.editBtn') }}</el-button>
<el-button text type="primary" @click="onTabelRowDel(scope.row)" v-auth="'sys_dept_del'"> {{ $t('common.delBtn') }}</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
<DeptDialog ref="deptDialogRef" @refresh="getTableData()" />
<dept-form ref="deptDialogRef" @refresh="getDataList()" />
</div>
</template>
<script setup lang="ts" name="systemDept">
import { defineAsyncComponent, ref, reactive, onMounted } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
import {BasicTableProps, useTable} from "/@/hooks/table";
import {depttree,delObj} from "/@/api/admin/dept";
import {useMessage, useMessageBox} from "/@/hooks/message";
import {useI18n} from "vue-i18n";
// 引入组件
const DeptDialog = defineAsyncComponent(() => import('/@/views/admin/dept/dialog.vue'));
const DeptForm = defineAsyncComponent(() => import('./form.vue'));
const { t } = useI18n()
// 定义变量内容
const deptDialogRef = ref();
const state = reactive<SysDeptState>({
tableData: {
data: [],
total: 0,
loading: false,
param: {
pageNum: 1,
pageSize: 10,
},
},
const state: BasicTableProps = reactive<BasicTableProps>({
pageList: depttree,
queryForm: {
deptName: ''
},
isPage: false
});
// 初始化表格数据
const getTableData = () => {
state.tableData.loading = true;
state.tableData.data = [];
state.tableData.data.push({
deptName: 'vueNextAdmin',
createTime: new Date().toLocaleString(),
status: true,
sort: Math.random(),
describe: '顶级部门',
id: Math.random(),
children: [
{
deptName: 'IT外包服务',
createTime: new Date().toLocaleString(),
status: true,
sort: Math.random(),
describe: '总部',
id: Math.random(),
},
{
deptName: '资本控股',
createTime: new Date().toLocaleString(),
status: true,
sort: Math.random(),
describe: '分部',
id: Math.random(),
},
],
});
state.tableData.total = state.tableData.data.length;
setTimeout(() => {
state.tableData.loading = false;
}, 500);
};
const {
getDataList
} = useTable(state)
// 打开新增菜单弹窗
const onOpenAddDept = (type: string) => {
deptDialogRef.value.openDialog(type);
const onOpenAddDept = (type: string,row: any) => {
deptDialogRef.value.openDialog(type,row?.id);
};
// 打开编辑菜单弹窗
const onOpenEditDept = (type: string, row: DeptTreeType) => {
deptDialogRef.value.openDialog(type, row);
const onOpenEditDept = (type: string, row: any) => {
deptDialogRef.value.openDialog(type, row.id);
};
// 删除当前行
const onTabelRowDel = (row: DeptTreeType) => {
ElMessageBox.confirm(`此操作将永久删除部门：${row.deptName}, 是否继续?`, '提示', {
confirmButtonText: '删除',
cancelButtonText: '取消',
type: 'warning',
})
const onTabelRowDel = (row: any) => {
useMessageBox().confirm(`${t('common.delConfirmText')}：${row.name} ?`)
.then(() => {
getTableData();
ElMessage.success('删除成功');
delObj(row.id).then(() => {
getDataList();
useMessage().success('删除成功');
}).catch(err => {
useMessage().error(err.msg)
})
})
.catch(() => {});
};
// 页面加载时
onMounted(() => {
getTableData();
});
</script>

4
src/views/admin/menu/form.vue
View File

@ -61,11 +61,11 @@
<script setup lang="ts" name="systemMenuDialog">
import { info, pageList, update, addObj } from "/@/api/admin/menu";
import type { menuData } from './menu'
import {useMessage} from "/@/hooks/message";
// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
// 引入组件
const TreeSelect = defineAsyncComponent(() => import('/@/components/TreeSelect/index.vue'))
const IconSelector = defineAsyncComponent(() => import('/@/components/iconSelector/index.vue'));
// 定义变量内容
@ -155,12 +155,14 @@ const onSubmit = () => {
closeDialog(); // 关闭弹窗
emit('refresh');
}).catch(err => {
useMessage().error(err.msg)
})
} else {
addObj(state.ruleForm).then(() => {
closeDialog(); // 关闭弹窗
emit('refresh');
}).catch(err => {
useMessage().error(err.msg)
})
}

4
src/views/admin/tenant/i18n/en.ts
View File

@ -28,5 +28,7 @@ export default {
inputcreateTimeTip: 'input createTime',
inputupdateTimeTip: 'input updateTime',
inputmenuIdTip: 'input menuId',
}
}, tenantmenu: {
name: 'tenantmenu', index: 'index', status: 'status', createTime: 'createTime',
}
}

6
src/views/admin/tenant/i18n/zh-cn.ts
View File

@ -28,5 +28,11 @@ export default {
inputcreateTimeTip: '请输入创建',
inputupdateTimeTip: '请输入更新时间',
inputmenuIdTip: '请输入menuId',
},
tenantmenu: {
name: '租户套餐',
index: '序号',
status: '状态',
createTime: '创建',
}
}

14
src/views/admin/tenant/index.vue
View File

@ -29,10 +29,15 @@
v-auth="'admin_systenant_add'">
{{ $t('common.exportBtn') }}
</el-button>
<el-button :disabled="multiple" icon="Delete" type="primary" class="ml10"
v-auth="'admin_systenant_del'" @click="handleDelete(undefined)">
{{ $t('common.delBtn') }}
</el-button>
<el-button type="primary" class="ml10" @click="handleTenantMenu()" v-auth="'admin_systenant_tenantmenu'">
{{ $t('tenantmenu.name') }}
</el-button>
<right-toolbar v-model:showSearch="showSearch" class="ml10" style="float: right;margin-right: 20px"
@queryTable="getDataList"></right-toolbar>
</div>
@ -80,6 +85,8 @@
<!-- 导入excel -->
<upload-excel ref="excelUploadRef" :title="$t('tenant.importTenantTip')" url="/admin/tenant/import"
temp-url="/admin/sys-file/local/file/tenant.xlsx" @refreshDataList="getDataList" />
<tenant-menu ref="TenantMenuRef"></tenant-menu>
</div>
</template>
@ -92,11 +99,13 @@ import { useDict } from "/@/hooks/dict";
// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
const TenantMenu = defineAsyncComponent(() => import('./tenantMenu/index.vue'))
const { t } = useI18n()
// 定义变量内容
const formDialogRef = ref()
const excelUploadRef = ref()
const TenantMenuRef = ref()
// 搜索变量
const queryRef = ref()
const showSearch = ref(true)
@ -157,4 +166,9 @@ const handleDelete = (row: any) => {
})
})
};
const handleTenantMenu = () => {
TenantMenuRef.value.open()
}
</script>

175
src/views/admin/tenant/tenantMenu/form.vue Normal file
View File

@ -0,0 +1,175 @@
<template>
<el-dialog :title="form.id ? $t('common.editBtn') : $t('common.addBtn')" v-model="visible"
:close-on-click-modal="false" draggable>
<el-form ref="dataFormRef" :model="form" :rules="dataRules" size="default" label-width="90px">
<el-row :gutter="24">
<el-col :span="12" class="mb20">
<el-form-item :label="t('tenant.name')" prop="name">
<el-input v-model="form.name" :placeholder="t('tenant.inputnameTip')" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item :label="t('tenant.status')" prop="status">
<el-radio-group v-model="form.status">
<el-radio :label="item.value" border v-for="(item,index) in status_type" :key="index">{{item.label}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item prop="menuIds">
<el-tree show-checkbox ref="menuTreeRef"
:check-strictly="false"
v-loading="treeLoading"
:data="menuData"
:props="defaultProps"
:default-checked-keys="checkedMenu"
node-key="id"
highlight-current
default-expand-all
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="visible = false" size="default">{{ $t('common.cancelButtonText') }}</el-button>
<el-button type="primary" @click="onSubmit" size="default" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup lang="ts" name="tenant-menu-form">
import {getObj} from "/@/api/admin/tenant-menu";
import {useDict} from "/@/hooks/dict";
import {useI18n} from "vue-i18n";
const { status_type } = useDict('status_type')
const { t } = useI18n()
import { treemenu, addObj, putObj } from '/@/api/admin/tenant-menu'
import {useMessage} from "/@/hooks/message";
const emit = defineEmits(['refresh']);
const dataFormRef = ref();
const visible = ref(false)
const menuTreeRef = ref()
const form = reactive({
id: '',
status: '',
name: '',
menuIds: ''
});
const dataRules = reactive({
})
const menuData = ref<any[]>([])
const defaultProps = reactive({
label: 'name',
value: 'id'
})
const checkedMenu = ref<any[]>([])
// 打开弹窗
const openDialog = (id: string) => {
visible.value = true
form.id = ''
// 重置表单数据
if (dataFormRef.value) {
dataFormRef.value.resetFields()
}
checkedMenu.value = []
// 获取Tenant信息
if (id) {
form.id = id
getTenantMenuData(id)
}
getMenuData()
};
const loading = ref(false)
const onSubmit = () => {
loading.value = true
dataFormRef.value.validate((valid: boolean) => {
if (!valid) {
return false
}
form.menuIds = [...menuTreeRef.value.getCheckedKeys(),...menuTreeRef.value.getHalfCheckedKeys()].join(",")
if (form.id) {
putObj(form).then(() => {
useMessage().success(t('common.editSuccessText'))
visible.value = false // 关闭弹窗
loading.value = false
emit('refresh')
}).catch((err: any) => {
useMessage().error(err.msg)
loading.value = false
})
} else {
addObj(form).then(() => {
useMessage().success(t('common.addSuccessText'))
visible.value = false // 关闭弹窗
loading.value = false
emit('refresh')
}).catch((err: any) => {
useMessage().error(err.msg)
loading.value = false
})
}
})
}
const treeLoading = ref(false)
const getMenuData = () => {
treeLoading.value = true
treemenu().then(res =>{
menuData.value = res.data
if (form.menuIds) {
checkedMenu.value = resolveAllEunuchNodeId(menuData.value,form.menuIds.split(','),[])
} else {
checkedMenu.value = []
}
treeLoading.value = false
})
}
const resolveAllEunuchNodeId = (json: any[], idArr: any[], temp: any[]) => {
for (let i = 0; i < json.length; i++) {
const item = json[i]
// 国际化
item.name = t(item.name)
// 存在子节点，递归遍历;不存在子节点，将json的id添加到临时数组中
if (item.children && item.children.length !== 0) {
resolveAllEunuchNodeId(item.children, idArr, temp)
} else {
temp.push(idArr.filter(id => id === item.id))
}
}
return temp
}
const getTenantMenuData = (id: string) => {
// 获取部门数据
getObj(id).then((res: any) => {
Object.assign(form, res.data[0])
})
}
// 暴露变量
defineExpose({
openDialog
});
</script>
<style scoped>
</style>

91
src/views/admin/tenant/tenantMenu/index.vue Normal file
View File

@ -0,0 +1,91 @@
<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="tenantMenuDialogRef.openDialog()"
v-auth="'admin_systenantmenu_add'">
{{ $t('common.addBtn') }}
</el-button>
<right-toolbar :search='false' 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="$t('tenantmenu.index')" width="80" />
<el-table-column prop="name" :label="$t('tenantmenu.name')" show-overflow-tooltip></el-table-column>
<el-table-column :label="$t('tenantmenu.status')" show-overflow-tooltip>
<template #default="scope">
<dict-tag :options="status_type" :value="scope.row.status"></dict-tag>
</template>
</el-table-column>
<el-table-column prop="createTime" :label="$t('tenantmenu.createTime')"
show-overflow-tooltip></el-table-column>
<el-table-column :label="$t('common.action')" width="150">
<template #default="scope">
<el-button text type="primary" @click="tenantMenuDialogRef.openDialog(scope.row.id)"
v-auth="'admin_systenantmenu_edit'"> {{
$t('common.editBtn')
}}
</el-button>
<el-button text type="primary" @click="handleDelete(scope.row)" v-auth="'admin_systenantmenu_del'">
{{ $t('common.delBtn') }}
</el-button>
</template>
</el-table-column>
</el-table>
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination">
</pagination>
<tenant-menu-dialog ref="tenantMenuDialogRef" @refresh="getDataList"></tenant-menu-dialog>
</el-card>
</el-drawer>
</template>
<script setup lang="ts" name="tenant-menu">
import {BasicTableProps, useTable} from "/@/hooks/table";
import { fetchList,delObj } from "/@/api/admin/tenant-menu";
import {useDict} from "/@/hooks/dict";
import {useMessage, useMessageBox} from "/@/hooks/message";
import {useI18n} from "vue-i18n";
const { t } = useI18n()
const TenantMenuDialog = defineAsyncComponent(() => import('./form.vue'))
const { status_type } = useDict('status_type')
const visible = ref(false)
const tenantMenuDialogRef = ref()
const state: BasicTableProps = reactive<BasicTableProps>({
pageList: fetchList
})
const {
getDataList,
currentChangeHandle,
sizeChangeHandle,
} = useTable(state)
const handleDelete = (row: any) => {
useMessageBox().confirm(`${t('common.delConfirmText')}：${row.name} ?`).then(() => {
// 删除用户的接口
delObj(row.id).then(() => {
getDataList();
useMessage().success(t('common.delSuccessText'))
}).catch(err => {
useMessage().error(err.msg)
})
})
};
const open = () => {
visible.value = true
}
// 暴露变量
defineExpose({
open,
});
</script>
<style scoped>
</style>

2
src/views/admin/user/index.vue
View File

@ -134,7 +134,7 @@ const state: BasicTableProps = reactive<BasicTableProps>({
username: '',
phone: ''
},
pageList: pageList // H
pageList: pageList
});
// 部门树使用的数据