cxc/qiaoba-ui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

status

Browse Source
This commit is contained in:
ailanyin
2023-06-07 17:35:32 +08:00
parent 17679d0d31
commit 6feec83997
3 changed files with 348 additions and 196 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
src/api/tenant/tenant.js
View File

@ -2,43 +2,51 @@ import request from "@/utils/request";
// 查询租户列表
export function listTenant(query) {
return request({
url: "/tenant/list",
method: "get",
params: query,
});
return request({
url: "/tenant/list",
method: "get",
params: query,
});
}
// 查询租户详细
export function getTenant(tenantId) {
return request({
url: "/tenant/" + tenantId,
method: "get",
});
return request({
url: "/tenant/" + tenantId,
method: "get",
});
}
// 新增租户
export function addTenant(data) {
return request({
url: "/tenant",
method: "post",
data: data,
});
return request({
url: "/tenant",
method: "post",
data: data,
});
}
// 修改租户
export function updateTenant(data) {
return request({
url: "/tenant",
method: "put",
data: data,
});
return request({
url: "/tenant",
method: "put",
data: data,
});
}
// 删除租户
export function delTenant(tenantId) {
return request({
url: "/tenant/" + tenantId,
method: "delete",
});
return request({
url: "/tenant/" + tenantId,
method: "delete",
});
}
// 查看设置
export function getSetting(tenantId) {
return request({
url: `/tenant/getSetting/${tenantId}`,
method: "get",
});
}

82
src/constant/dict.js
View File

@ -1,52 +1,36 @@
export const sys_normal_disable = [
{
label: "正常",
value: "1",
elTagType: "success",
},
{
label: "禁用",
value: "0",
elTagType: "danger",
},
];
export const sys_normal_disable = [{
label: "正常", value: "1", elTagType: "success",
}, {
label: "禁用", value: "0", elTagType: "danger",
},];
export const sys_user_gender = [
{
label: "男",
value: "0",
},
{
label: "女",
value: "1",
},
{
label: "未知",
value: "2",
},
];
export const sys_user_gender = [{
label: "男", value: "0",
}, {
label: "女", value: "1",
}, {
label: "未知", value: "2",
},];
export const menu_show_hide = [
{
label: "隐藏",
value: "0",
elTagType: "warning",
},
{
label: "显示",
value: "1",
elTagType: "success",
},
];
export const menu_show_hide = [{
label: "隐藏", value: "0", elTagType: "warning",
}, {
label: "显示", value: "1", elTagType: "success",
},];
export const sys_yes_no = [
{
label: "否",
value: "N",
},
{
label: "是",
value: "Y",
elTagType: "danger",
},
];
export const sys_yes_no = [{
label: "否", value: "N",
}, {
label: "是", value: "Y", elTagType: "danger",
},];
export const database_type_dict = [{
label: "MySQL", value: "MySQL", elTagType: "",
}, {
label: "Oracle", value: "Oracle", elTagType: "",
}, {
label: "PostgreSQL", value: "PostgreSQL", elTagType: "",
},
{
label: "Microsoft SQL Server", value: "Microsoft SQL Server", elTagType: "",
}];

408
src/views/tenant/index.vue
View File

@ -1,31 +1,32 @@
<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryRef"
:inline="true"
v-show="showSearch"
label-width="68px"
v-show="showSearch"
ref="queryRef"
:inline="true"
:model="queryParams"
label-width="68px"
>
<el-form-item label="公司名称" prop="companyName">
<el-input
v-model="queryParams.companyName"
placeholder="请输入公司名称"
clearable
@keyup.enter="handleQuery"
v-model="queryParams.companyName"
clearable
placeholder="请输入公司名称"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="联系人" prop="contactName">
<el-input
v-model="queryParams.contactName"
placeholder="请输入联系人名称"
clearable
@keyup.enter="handleQuery"
v-model="queryParams.contactName"
clearable
placeholder="请输入联系人名称"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery"
>搜索</el-button
<el-button icon="Search" type="primary" @click="handleQuery"
>搜索
</el-button
>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
@ -34,158 +35,172 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="Plus"
@click="handleAdd"
v-hasPermi="['tenant:add']"
>新增</el-button
v-hasPermi="['tenant:add']"
icon="Plus"
plain
type="primary"
@click="handleAdd"
>新增
</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="Edit"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['tenant:edit']"
>修改</el-button
v-hasPermi="['tenant:edit']"
:disabled="single"
icon="Edit"
plain
type="success"
@click="handleUpdate"
>修改
</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="Delete"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['tenant:remove']"
>删除</el-button
v-hasPermi="['tenant:remove']"
:disabled="multiple"
icon="Delete"
plain
type="danger"
@click="handleDelete"
>删除
</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="Download"
@click="handleExport"
v-hasPermi="['tenant:export']"
>导出</el-button
v-hasPermi="['tenant:export']"
icon="Download"
plain
type="warning"
@click="handleExport"
>导出
</el-button
>
</el-col>
<right-toolbar
v-model:showSearch="showSearch"
@queryTable="getList"
v-model:showSearch="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table
v-loading="loading"
:data="tenantList"
@selection-change="handleSelectionChange"
v-loading="loading"
:data="tenantList"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="编码" align="center" prop="tenantId" />
<el-table-column label="公司名称" align="center" prop="companyName" />
<el-table-column label="联系人名称" align="center" prop="contactName" />
<el-table-column label="联系人电话" align="center" prop="contactPhone" />
<el-table-column label="公司地址" align="center" prop="address" />
<el-table-column align="center" type="selection" width="55"/>
<el-table-column align="center" label="编码" prop="tenantId"/>
<el-table-column align="center" label="公司名称" prop="companyName"/>
<el-table-column align="center" label="联系人名称" prop="contactName"/>
<el-table-column align="center" label="联系人电话" prop="contactPhone"/>
<el-table-column align="center" label="公司地址" prop="address"/>
<el-table-column
label="过期时间"
align="center"
prop="expireTime"
width="180"
align="center"
label="过期时间"
prop="expireTime"
width="180"
>
<template #default="scope">
<span>{{ parseTime(scope.row.expireTime, "{y}-{m}-{d}") }}</span>
</template>
</el-table-column>
<el-table-column label="用户数量" align="center" prop="accountCount" />
<el-table-column label="状态" align="center" prop="status" />
<el-table-column align="center" label="用户数量" prop="accountCount"/>
<el-table-column align="center" label="状态" prop="status"/>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
align="center"
class-name="small-padding fixed-width"
label="操作"
>
<template #default="scope">
<el-button
link
type="primary"
icon="Edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['tenant:edit']"
>修改</el-button
icon="Setting"
link
type="primary"
@click="handleSetting(scope.row)"
>设置
</el-button
>
<el-button
link
type="primary"
icon="Delete"
@click="handleDelete(scope.row)"
v-hasPermi="['tenant:remove']"
>删除</el-button
v-hasPermi="['tenant:edit']"
icon="Edit"
link
type="primary"
@click="handleUpdate(scope.row)"
>修改
</el-button
>
<el-button
v-hasPermi="['tenant:remove']"
icon="Delete"
link
type="primary"
@click="handleDelete(scope.row)"
>删除
</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
v-show="total > 0"
v-model:limit="queryParams.pageSize"
v-model:page="queryParams.pageNum"
:total="total"
@pagination="getList"
/>
<!-- 添加或修改租户对话框 -->
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
<el-dialog v-model="open" :title="title" append-to-body width="500px">
<el-form ref="tenantRef" :model="form" :rules="rules" label-width="130px">
<el-form-item label="公司名称" prop="companyName">
<el-input v-model="form.companyName" placeholder="请输入公司名称" />
<el-input v-model="form.companyName" placeholder="请输入公司名称"/>
</el-form-item>
<el-form-item label="联系人名称" prop="contactName">
<el-input v-model="form.contactName" placeholder="请输入联系人名称" />
<el-input v-model="form.contactName" placeholder="请输入联系人名称"/>
</el-form-item>
<el-form-item label="联系人电话" prop="contactPhone">
<el-input
v-model="form.contactPhone"
placeholder="请输入联系人电话"
v-model="form.contactPhone"
placeholder="请输入联系人电话"
/>
</el-form-item>
<el-form-item label="公司地址" prop="address">
<el-input v-model="form.address" placeholder="请输入公司地址" />
<el-input v-model="form.address" placeholder="请输入公司地址"/>
</el-form-item>
<el-form-item label="公司简介" prop="profile">
<el-input
v-model="form.profile"
type="textarea"
placeholder="请输入内容"
v-model="form.profile"
placeholder="请输入内容"
type="textarea"
/>
</el-form-item>
<el-form-item label="统一社会信用代码" prop="licenseNumber">
<el-input
v-model="form.licenseNumber"
placeholder="请输入统一社会信用代码"
v-model="form.licenseNumber"
placeholder="请输入统一社会信用代码"
/>
</el-form-item>
<el-form-item label="过期时间" prop="expireTime">
<el-date-picker
clearable
v-model="form.expireTime"
type="datetime"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择过期时间"
v-model="form.expireTime"
clearable
placeholder="请选择过期时间"
type="datetime"
value-format="YYYY-MM-DD HH:mm:ss"
>
</el-date-picker>
</el-form-item>
<el-form-item label="用户数量" prop="accountCount">
<el-input v-model="form.accountCount" placeholder="请输入用户数量" />
<el-input v-model="form.accountCount" placeholder="请输入用户数量"/>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input
v-model="form.remark"
type="textarea"
placeholder="请输入内容"
v-model="form.remark"
placeholder="请输入内容"
type="textarea"
/>
</el-form-item>
</el-form>
@ -196,19 +211,68 @@
</div>
</template>
</el-dialog>
<!-- 添加或修改租户对话框 -->
<el-dialog v-model="showTenantSetting" append-to-body title="租户设置" width="500px">
<el-form ref="tenantSettingRef" :model="tenantSettingForm" :rules="tenantSettingRules" label-width="130px">
<!--TODO:-->
<el-form-item label="模式">
<el-radio-group v-model="tenantSettingForm.mode">
<el-radio label="1">字段</el-radio>
<el-radio label="2">数据库</el-radio>
<el-radio label="3">数据源</el-radio>
</el-radio-group>
</el-form-item>
<template v-if="tenantSettingForm.mode==='3'">
<div class="data-source-item">
<div class="left">
<div class="database-type">{{ "MySQL" }}</div>
<div class="database-url">{{ "127.0.0.1" }} : {{ 3306 }}</div>
<div class="database-name">{{ "ry-vue" }}</div>
</div>
<div class="right">
<el-button circle icon="edit" plain size="small" type="primary"></el-button>
<el-button circle icon="delete" plain size="small" type="danger"></el-button>
</div>
</div>
<el-button icon="plus" plain size="small" style="margin-top: 18px" type="primary">新增数据源</el-button>
<!-- <el-form-item label="数据库类型" prop="type">-->
<!-- <el-select v-model="tenantSettingForm.host">-->
<!-- <el-option v-for="option in database_type_dict" :key="option.value" :label="option.label"-->
<!-- :value="option.value"/>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="数据库IP" prop="ip">-->
<!-- <el-input v-model="tenantSettingForm.ip"/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="数据库端口" prop="port">-->
<!-- <el-input v-model="tenantSettingForm.port"/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="数据库名称" prop="name">-->
<!-- <el-input v-model="tenantSettingForm.name"/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="数据库账号" prop="username">-->
<!-- <el-input v-model="tenantSettingForm.username"/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="数据库密码" prop="password">-->
<!-- <el-input v-model="tenantSettingForm.password"/>-->
<!-- </el-form-item>-->
</template>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitTenantSetting">确 定</el-button>
<el-button @click="cancelSettingTenant">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="Tenant">
import {
listTenant,
getTenant,
delTenant,
addTenant,
updateTenant,
} from "@/api/tenant/tenant";
<script name="Tenant" setup>
import {addTenant, delTenant, getSetting, getTenant, listTenant, updateTenant,} from "@/api/tenant/tenant";
const { proxy } = getCurrentInstance();
const {proxy} = getCurrentInstance();
const tenantList = ref([]);
const open = ref(false);
@ -219,7 +283,8 @@ const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const showTenantSetting = ref(false) /*是否显示租户设置对话框*/
const tenantSettingRef = ref()
const data = reactive({
form: {},
queryParams: {
@ -240,12 +305,30 @@ const data = reactive({
},
rules: {
companyName: [
{ required: true, message: "公司名称不能为空", trigger: "blur" },
{required: true, message: "公司名称不能为空", trigger: "blur"},
],
},
tenantSettingForm: {
// TODO:
dataSource: [
{
type: "MySQL",
ip: "127.0.0.1",
port: "",
name: "",
username: "",
password: ""
}
],
mode: '3'
}
,
tenantSettingRules: {
/*TODO:*/
}
});
const { queryParams, form, rules } = toRefs(data);
const {queryParams, form, rules, tenantSettingForm, tenantSettingRules} = toRefs(data);
/** 查询租户列表 */
function getList() {
@ -263,6 +346,14 @@ function cancel() {
reset();
}
/**
* 取消租户设置
*/
const cancelSettingTenant = () => {
showTenantSetting.value = false
resetSettingTenant()
}
// 表单重置
function reset() {
form.value = {
@ -286,6 +377,17 @@ function reset() {
proxy.resetForm("tenantRef");
}
/**
* 重置租户设置表单
*/
const resetSettingTenant = () => {
form.value = {
/*TODO:*/
datasourceList: []
}
tenantSettingRef.value?.resetFields()
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
@ -323,6 +425,18 @@ function handleUpdate(row) {
});
}
/**
* 打开租户设置
* @param row
*/
const handleSetting = (row) => {
resetSettingTenant()
getSetting(row.tenantId).then(resp => {
tenantSettingForm.value = resp.data
showTenantSetting.value = true
})
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["tenantRef"].validate((valid) => {
@ -344,31 +458,77 @@ function submitForm() {
});
}
/**
* 提交租户设置
*/
const submitTenantSetting = () => {
/*TODO:*/
showTenantSetting.value = false
}
/** 删除按钮操作 */
function handleDelete(row) {
const _tenantIds = row.tenantId || ids.value;
proxy.$modal
.confirm('是否确认删除租户编号为"' + _tenantIds + '"的数据项？')
.then(function () {
return delTenant(_tenantIds);
})
.then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
})
.catch(() => {});
.confirm('是否确认删除租户编号为"' + _tenantIds + '"的数据项？')
.then(function () {
return delTenant(_tenantIds);
})
.then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
})
.catch(() => {
});
}
/** 导出按钮操作 */
function handleExport() {
proxy.download(
"tenant/tenant/export",
{
...queryParams.value,
},
`tenant_${new Date().getTime()}.xlsx`
"tenant/tenant/export",
{
...queryParams.value,
},
`tenant_${new Date().getTime()}.xlsx`
);
}
getList();
</script>
<style lang="scss" scoped>
.data-source-item {
height: 32px;
width: 100%;
border-radius: 6px;
border: 1px solid rgb(203 213 225);
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20px 0 20px;
.left {
display: flex;
align-items: center;
.database-type {
font-size: 15px;
}
.database-url {
margin-left: 12px;
font-size: 13px;
}
.database-name {
margin-left: 10px;
font-size: 13px;
}
}
.right {
display: flex;
align-items: center;
}
}
</style>