mirror of https://github.com/jeecgboot/jeecg-boot
【v3.8.3】我的租户大改造
parent
6a11ff8a64
commit
862aaa8632
|
@ -4,10 +4,20 @@
|
|||
<BasicTable @register="registerTable" :rowSelection="rowSelection">
|
||||
<!--插槽:table标题-->
|
||||
<template #tableTitle>
|
||||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
|
||||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate">新增</a-button>
|
||||
<a-button
|
||||
preIcon="ant-design:user-add-outlined"
|
||||
type="primary"
|
||||
@click="handleInvitation"
|
||||
style="margin-right: 5px">
|
||||
邀请用户加入
|
||||
</a-button>
|
||||
<JThirdAppButton biz-type="user" :selected-row-keys="selectedRowKeys" syncToApp syncToLocal @sync-finally="onSyncFinally" />
|
||||
<a-button type="primary" @click="openQuitModal(true, {})" preIcon="ant-design:user-delete-outlined">离职信息</a-button>
|
||||
<a-button type="primary" @click="openQuitModal(true, {})" preIcon="ant-design:user-delete-outlined">离职人员</a-button>
|
||||
<div style="margin-left: 10px;margin-top: 5px"> 当前登录租户: <span class="tenant-name">{{loginTenantName}}</span> </div>
|
||||
<a-tooltip title="租户用户更多操作说明">
|
||||
<a-icon type="question-circle" style="margin-left: 8px; cursor: pointer " @click="tipShow = true"/>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<!--操作栏-->
|
||||
<template #action="{ record }">
|
||||
|
@ -16,12 +26,23 @@
|
|||
</BasicTable>
|
||||
<!--用户抽屉-->
|
||||
<TenantUserDrawer @register="registerDrawer" @success="handleSuccess" />
|
||||
<!-- 离职受理人弹窗 -->
|
||||
<UserQuitAgentModal @register="registerQuitAgentModal" @success="handleQuitSuccess" />
|
||||
<!-- 离职人员列弹窗 -->
|
||||
<UserQuitModal @register="registerQuitModal" @success="reload" />
|
||||
<!-- 变更拥有者弹窗 -->
|
||||
<UserSelectModal @register="registerUserModal" :excludeUserIdList="excludeUserIdList" :maxSelectCount="1" @getSelectResult="selectResult" />
|
||||
<!-- 套餐分配弹窗 -->
|
||||
<TenantPackAllotModal @register="registerPackAllotModal"></TenantPackAllotModal>
|
||||
<!-- 邀请人弹窗 -->
|
||||
<TenantInviteUserModal @register="registerSelUserModal" @inviteOk="handleInviteUserOk" />
|
||||
<a-modal v-model:open="tipShow" :footer="null" title="租户用户更多操作说明" :width="800">
|
||||
<ul class="user-tenant-tip">
|
||||
<li>移除:将用户从当前租户中移除</li>
|
||||
<li>删除:仅可删除当天创建的用户,删除后可在系统用户回收站恢复</li>
|
||||
<li>离职:非租户创建者可进行离职操作,离职员工可在离职人员列表查看</li>
|
||||
<li>交接:租户创建者可进行租户交接,交接后员工信息可在离职人员列表查看</li>
|
||||
</ul>
|
||||
<div style="height: 10px"></div>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -31,14 +52,13 @@
|
|||
import { BasicTable, TableAction, ActionItem } from '/@/components/Table';
|
||||
import UserDrawer from '../user/UserDrawer.vue';
|
||||
import JThirdAppButton from '/@/components/jeecg/thirdApp/JThirdAppButton.vue';
|
||||
import UserQuitAgentModal from '../user/UserQuitAgentModal.vue';
|
||||
import UserQuitModal from '../user/UserQuitModal.vue';
|
||||
import { useDrawer } from '/@/components/Drawer';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { columns, searchFormSchema } from '../user/user.data';
|
||||
import { list , deleteUser, batchDeleteUser, getImportUrl, getExportUrl, frozenBatch , getUserTenantPageList, updateUserTenantStatus } from '../user/user.api';
|
||||
import { list , deleteUser, batchDeleteUser, getImportUrl, getExportUrl, frozenBatch, getUserTenantPageList, updateUserTenantStatus } from '../user/user.api';
|
||||
// import { usePermission } from '/@/hooks/web/usePermission'
|
||||
// const { hasPermission } = usePermission();
|
||||
import { userTenantColumns, userTenantFormSchema } from '../user/user.data';
|
||||
|
@ -46,9 +66,11 @@
|
|||
import UserSelectModal from '/@/components/Form/src/jeecg/components/modal/UserSelectModal.vue';
|
||||
import { getTenantId } from "/@/utils/auth";
|
||||
import { changeOwenUserTenant } from "/@/views/system/usersetting/UserSetting.api";
|
||||
import { getLoginTenantName } from "/@/views/system/tenant/tenant.api";
|
||||
import {getLoginTenantName, invitationUserJoin, leaveTenant} from "/@/views/system/tenant/tenant.api";
|
||||
import TenantUserDrawer from './components/TenantUserDrawer.vue';
|
||||
import { tenantSaasMessage } from "@/utils/common/compUtils";
|
||||
import { sameDay, tenantSaasMessage } from "@/utils/common/compUtils";
|
||||
import TenantPackAllotModal from './components/TenantPackAllotModal.vue'
|
||||
import TenantInviteUserModal from "@/views/system/tenant/components/TenantInviteUserModal.vue";
|
||||
|
||||
const { createMessage, createConfirm } = useMessage();
|
||||
|
||||
|
@ -58,8 +80,12 @@
|
|||
const [registerQuitAgentModal, { openModal: openQuitAgentModal }] = useModal();
|
||||
//离职用户列表model
|
||||
const [registerQuitModal, { openModal: openQuitModal }] = useModal();
|
||||
//分配套餐弹窗
|
||||
const [registerPackAllotModal, { openModal: openPackAllotModal }] = useModal();
|
||||
const userStore = useUserStore();
|
||||
const createBy = userStore.getUserInfo.username;
|
||||
//弹窗提示显示
|
||||
const tipShow = ref<boolean>(false);
|
||||
|
||||
// 列表页面公共参数、方法
|
||||
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
||||
|
@ -153,22 +179,23 @@
|
|||
function getDropDownAction(record): ActionItem[] {
|
||||
return [
|
||||
{
|
||||
label: '详情',
|
||||
label: '查看详情',
|
||||
onClick: handleDetail.bind(null, record),
|
||||
},
|
||||
{
|
||||
label: '离职',
|
||||
//update-begin---author:wangshuai---date:2023-10-25---for:【QQYUN-6822】9.离职交接人选的是自己,完成之后数据没了---
|
||||
onClick: handleQuit.bind(null,record.username, record.id),
|
||||
//update-end---author:wangshuai---date:2023-10-25---for:【QQYUN-6822】9.离职交接人选的是自己,完成之后数据没了---
|
||||
//update-begin---author:wangshuai ---date:20230130 for:[QQYUN-3974]租户的创建人 不应该有离职按钮------------
|
||||
ifShow: () =>{
|
||||
return record.status === '1' && record.username!== record.createBy;
|
||||
}
|
||||
//update-end---author:wangshuai ---date:20230130 for:[QQYUN-3974]租户的创建人 不应该有离职按钮------------
|
||||
label: '移除用户',
|
||||
onClick: handleLeave.bind(null, record.id),
|
||||
},
|
||||
{
|
||||
label: '交接',
|
||||
label: '删除用户',
|
||||
popConfirm: {
|
||||
title: '是否确认删除该用户',
|
||||
confirm: handleDeleteUser.bind(null, record),
|
||||
},
|
||||
ifShow: () => record.username!== userStore.getUserInfo?.username && sameDay(record.createTime),
|
||||
},
|
||||
{
|
||||
label: '变更拥有者',
|
||||
onClick: handleHandover.bind(null, record),
|
||||
ifShow: () =>{
|
||||
return record.username === record.createBy;
|
||||
|
@ -191,19 +218,13 @@
|
|||
return record.status === '3' && record.createBy === createBy;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '用户套餐',
|
||||
onClick: handleAllotPack.bind(null, record),
|
||||
}
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* 离职
|
||||
* @param userName
|
||||
* @param userId
|
||||
*/
|
||||
function handleQuit(userName, userId) {
|
||||
//打开离职代理人弹窗
|
||||
openQuitAgentModal(true, { userName, userId });
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新用户租户状态
|
||||
* @param id
|
||||
|
@ -228,6 +249,8 @@
|
|||
const excludeUserIdList = ref<any>([]);
|
||||
//离职代理人model
|
||||
const [registerUserModal, { openModal: openUserModal }] = useModal();
|
||||
//邀请用户加入弹窗
|
||||
const [registerSelUserModal, { openModal: userOpenModal }] = useModal();
|
||||
const handOverUserName = ref<string>('');
|
||||
|
||||
/**
|
||||
|
@ -277,21 +300,59 @@
|
|||
loginTenantName.value = await getLoginTenantName();
|
||||
}
|
||||
//update-end---author:wangshuai ---date:20230710 for:【QQYUN-5723】4、显示当前登录租户------------
|
||||
|
||||
|
||||
/**
|
||||
* 离职成功之后需要判断一下是否为当前用户,当前用户需要刷新浏览器
|
||||
* @param userName
|
||||
* 分配套餐
|
||||
*
|
||||
* @param record
|
||||
*/
|
||||
function handleQuitSuccess(userName) {
|
||||
//判断如果当前离职的是当前登录用户,需要刷新页面,便将租户id设置成null
|
||||
let username = userStore.getUserInfo.username;
|
||||
if (username && userName === username) {
|
||||
userStore.setTenant(null);
|
||||
window.location.reload();
|
||||
}else{
|
||||
function handleAllotPack(record) {
|
||||
openPackAllotModal(true,{
|
||||
record
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除用户
|
||||
*/
|
||||
function handleDeleteUser(record) {
|
||||
deleteUser({ id: record.id }, reload);
|
||||
}
|
||||
|
||||
/**
|
||||
* 邀请用户加入租户
|
||||
*/
|
||||
function handleInvitation() {
|
||||
userOpenModal(true, {});
|
||||
}
|
||||
|
||||
/**
|
||||
* 用户选择回调事件
|
||||
* @param username
|
||||
* @param phone
|
||||
* @param userSelectId
|
||||
*/
|
||||
async function handleInviteUserOk(phone, username) {
|
||||
let tId = getTenantId();
|
||||
if (phone) {
|
||||
await invitationUserJoin({ ids: tId, phone: phone });
|
||||
reload();
|
||||
}
|
||||
if (username) {
|
||||
await invitationUserJoin({ ids: tId, username: username });
|
||||
reload();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 请离
|
||||
* @param id
|
||||
*/
|
||||
async function handleLeave(id) {
|
||||
await leaveTenant({ userIds: id, tenantId: getTenantId() }, reload)
|
||||
}
|
||||
|
||||
|
||||
onMounted(()=>{
|
||||
tenantSaasMessage('租户用户')
|
||||
|
@ -304,4 +365,11 @@
|
|||
margin: 5px;
|
||||
font-size: 15px;
|
||||
}
|
||||
.user-tenant-tip{
|
||||
margin: 20px;
|
||||
background-color: #f8f9fb;
|
||||
color: #99a1a9;
|
||||
border-radius: 4px;
|
||||
padding: 12px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -0,0 +1,77 @@
|
|||
<!-- 用户套餐分配页面 -->
|
||||
<template>
|
||||
<BasicModal @register="registerModal" :width="500" title="分配套餐" @ok="handleSubmit">
|
||||
<BasicForm @register="registerForm">
|
||||
<template #packId="{ model, field }">
|
||||
<a-checkbox-group v-model:value="model[field]" :options="packOption"></a-checkbox-group>
|
||||
</template>
|
||||
</BasicForm>
|
||||
</BasicModal>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { BasicModal, useModalInner } from '@/components/Modal';
|
||||
import { BasicForm, useForm } from '@/components/Form';
|
||||
import { packUserAllotSchemas } from '@/views/system/tenant/tenant.data';
|
||||
import { listPackByTenantUserId } from '@/views/system/tenant/tenant.api';
|
||||
import { getTenantId } from '@/utils/auth';
|
||||
import { ref, defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'TenantCurrentPackList',
|
||||
components: {
|
||||
BasicModal,
|
||||
BasicForm,
|
||||
},
|
||||
setup() {
|
||||
//产品包的option
|
||||
const packOption = ref<any>([]);
|
||||
//表单配置
|
||||
const [registerForm, { resetFields, setFieldsValue, setProps }] = useForm({
|
||||
schemas: packUserAllotSchemas,
|
||||
showActionButtonGroup: false,
|
||||
});
|
||||
//表单赋值
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
setModalProps({ confirmLoading: false, showCancelBtn: false, showOkBtn: false });
|
||||
//重置表单
|
||||
await resetFields();
|
||||
let tenantId = getTenantId();
|
||||
let result = await listPackByTenantUserId({ tenantId: tenantId, userId: data.record.id });
|
||||
if (result) {
|
||||
if (result.packList) {
|
||||
for (const item of result.packList) {
|
||||
if (item.packCode) {
|
||||
item.label = item.packName + "(默认产品包)";
|
||||
} else {
|
||||
item.label = item.packName;
|
||||
}
|
||||
item.value = item.id;
|
||||
item.key = item.id;
|
||||
}
|
||||
packOption.value = result.packList;
|
||||
} else {
|
||||
packOption.value = [];
|
||||
}
|
||||
if(result.userPackIdList){
|
||||
data.record.packId = result.userPackIdList;
|
||||
}
|
||||
}
|
||||
setModalProps({ confirmLoading: false });
|
||||
await setFieldsValue({
|
||||
...data.record,
|
||||
userId: data.record.id,
|
||||
});
|
||||
setProps({ disabled: true });
|
||||
})
|
||||
|
||||
return {
|
||||
registerForm,
|
||||
registerModal,
|
||||
packOption,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less"></style>
|
|
@ -0,0 +1,181 @@
|
|||
<template>
|
||||
<BasicTable @register="registerTable" style="padding-top: 10px">
|
||||
<template #departNames="{ text, record }">
|
||||
<template v-if="text && text.length > 0">
|
||||
{{ getName(text) }}
|
||||
</template>
|
||||
</template>
|
||||
<template #positionNames="{ text, record }">
|
||||
<template v-if="text && text.length > 0">
|
||||
{{ getName(text) }}
|
||||
</template>
|
||||
</template>
|
||||
<template #tableTitle>
|
||||
<a-button preIcon="ant-design:usergroup-add-outlined" type="primary" @click="addUser" :disabled="tenantPackData.izSysn == '1'">邀请成员</a-button>
|
||||
<a-button preIcon="ant-design:rollback-outlined" @click="cancel">关闭</a-button>
|
||||
</template>
|
||||
<!--操作栏-->
|
||||
<template #action="{ record }">
|
||||
<TableAction :actions="getTableAction(record)" />
|
||||
</template>
|
||||
</BasicTable>
|
||||
<tenant-user-select-modal :multi="true" @register="registerUserModal" @on-select="onSelected" :tenantId="getTenantId"></tenant-user-select-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, defineEmits } from 'vue';
|
||||
import { BasicModal } from '@/components/Modal';
|
||||
import { BasicTable, TableAction } from '@/components/Table';
|
||||
import TenantUserSelectModal from '@/views/system/tenant/components/TenantUserSelectModal.vue';
|
||||
import { addTenantPackUser, deleteTenantPackUser } from '@/views/system/tenant/tenant.api';
|
||||
//注册table数据
|
||||
import { useListPage } from '@/hooks/system/useListPage';
|
||||
import { queryTenantPackUserList } from '@/views/system/tenant/tenant.api';
|
||||
import { tenantPackUserColumns } from '@/views/system/tenant/tenant.data';
|
||||
import { useModal } from '@/components/Modal';
|
||||
import { computed, reactive } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'TenantUserRightList',
|
||||
components: { BasicModal, BasicTable, TableAction, TenantUserSelectModal },
|
||||
emits: ['cancel'],
|
||||
setup(props, { emit }) {
|
||||
const [registerUserModal, { openModal: openUserModal, closeModal: closeUserModal }] = useModal();
|
||||
//获取租户id
|
||||
const getTenantId = computed(() => {
|
||||
return tenantPackData.tenantId;
|
||||
});
|
||||
|
||||
//套餐包信息
|
||||
const tenantPackData = reactive<any>({});
|
||||
const { tableContext } = useListPage({
|
||||
tableProps: {
|
||||
api: queryTenantPackUserList,
|
||||
immediate: false,
|
||||
columns: tenantPackUserColumns,
|
||||
canResize: false,
|
||||
useSearchForm: false,
|
||||
beforeFetch: (params) => {
|
||||
params.tenantId = tenantPackData.tenantId;
|
||||
params.packId = tenantPackData.id;
|
||||
params.status = 1;
|
||||
return params;
|
||||
},
|
||||
actionColumn: {
|
||||
width: 120,
|
||||
fixed: 'right',
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
|
||||
|
||||
/**
|
||||
* 初始化数据
|
||||
* @param value
|
||||
*/
|
||||
function initData(value) {
|
||||
console.log('value::', value);
|
||||
Object.assign(tenantPackData, value);
|
||||
reload();
|
||||
}
|
||||
|
||||
/**
|
||||
* 表格操作列
|
||||
* @param record
|
||||
*/
|
||||
function getTableAction(record) {
|
||||
return [
|
||||
{
|
||||
label: '移除',
|
||||
popConfirm: {
|
||||
title: '是否确认移除',
|
||||
confirm: handleDelete.bind(null, record),
|
||||
},
|
||||
ifShow:() => tenantPackData.izSysn != '1'
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
async function handleDelete(record) {
|
||||
let params = {
|
||||
packId: record.packId,
|
||||
packName: record.packName,
|
||||
tenantId: tenantPackData.tenantId,
|
||||
userId: record.id,
|
||||
realname: record.realname,
|
||||
};
|
||||
await deleteTenantPackUser(params);
|
||||
await reload();
|
||||
}
|
||||
|
||||
/**
|
||||
* 添加用户弹窗
|
||||
*/
|
||||
function addUser() {
|
||||
openUserModal(true, {
|
||||
list: [],
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 邀请人回调事件
|
||||
* @param arr
|
||||
*/
|
||||
async function onSelected(arr) {
|
||||
if (arr && arr.length > 0) {
|
||||
let names: any[] = [];
|
||||
let ids: any[] = [];
|
||||
for (let u of arr) {
|
||||
names.push(u.realname);
|
||||
ids.push(u.id);
|
||||
}
|
||||
let params = {
|
||||
packId: tenantPackData.id,
|
||||
packName: tenantPackData.packName,
|
||||
tenantId: tenantPackData.tenantId,
|
||||
userId: ids.join(','),
|
||||
realname: names.join(','),
|
||||
};
|
||||
await addTenantPackUser(params);
|
||||
await reload();
|
||||
closeUserModal();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取部门/职务名称
|
||||
* @param value
|
||||
*/
|
||||
function getName(value) {
|
||||
return value.join(',');
|
||||
}
|
||||
|
||||
/**
|
||||
* 关闭
|
||||
*/
|
||||
function cancel() {
|
||||
emit('cancel');
|
||||
}
|
||||
|
||||
return {
|
||||
getTableAction,
|
||||
onSelected,
|
||||
registerTable,
|
||||
registerUserModal,
|
||||
getTenantId,
|
||||
rowSelection,
|
||||
addUser,
|
||||
initData,
|
||||
getName,
|
||||
cancel,
|
||||
tenantPackData,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less"></style>
|
|
@ -0,0 +1,296 @@
|
|||
<!--我的租户详情-->
|
||||
<template>
|
||||
<div class="message-set-container">
|
||||
<div class="message-set-box">
|
||||
<div class="message-set-header">
|
||||
<span class="font17">组织信息</span>
|
||||
</div>
|
||||
<a-form :model="formState">
|
||||
<div class="message-set-content">
|
||||
<div class="common-info">
|
||||
<div class="common-info-row">
|
||||
<div class="common-info-row-label">组织LOGO</div>
|
||||
<div class="common-info-row-content">
|
||||
<img :src="getImageSrc()" style="width: 100px;cursor: pointer" @click="previewImage">
|
||||
</div>
|
||||
</div>
|
||||
<div class="common-info-row m-top24">
|
||||
<div class="common-info-row-label">组织名称</div>
|
||||
<span class="m-right16">{{ formState.name }}</span>
|
||||
</div>
|
||||
<div class="common-info-row m-top24">
|
||||
<div class="common-info-row-label">组织门牌号</div>
|
||||
<div class="common-info-row-content">
|
||||
<span class="pointer">
|
||||
<span>{{ formState.houseNumber }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="common-info-row m-top24">
|
||||
<div class="common-info-row-label">组织编号(ID)</div>
|
||||
<div class="common-info-row-content">
|
||||
<span class="pointer">
|
||||
<span>{{ formState.id }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="split-line"></div>
|
||||
<div class="common-info-row">
|
||||
<div class="common-info-row-label">所在地</div>
|
||||
<span class="m-right16">{{ formState.companyAddress_dictText }}</span>
|
||||
</div>
|
||||
<div class="common-info-row m-top24">
|
||||
<div class="common-info-row-label">所在行业</div>
|
||||
<span class="m-right16">{{ formState.trade_dictText }}</span>
|
||||
</div>
|
||||
<div class="common-info-row m-top24">
|
||||
<div class="common-info-row-label">工作地点</div>
|
||||
<span class="m-right16">{{ formState.workPlace }}</span>
|
||||
</div>
|
||||
<div class="cancel-split-line"></div>
|
||||
</div>
|
||||
</div>
|
||||
</a-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" name="tenant-my-tenant-list" setup>
|
||||
import { onMounted, reactive } from 'vue';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import {getFileAccessHttpUrl, tenantSaasMessage} from '@/utils/common/compUtils';
|
||||
import { getTenantById } from '@/views/system/tenant/tenant.api';
|
||||
import { getTenantId } from '@/utils/auth';
|
||||
import { getDataByCode, getRealCode, provinceOptions } from '@/components/Form/src/utils/areaDataUtil';
|
||||
import { initDictOptions } from '@/utils/dict';
|
||||
import {createImgPreview} from "@/components/Preview";
|
||||
|
||||
const { createMessage } = useMessage();
|
||||
const formState = reactive({
|
||||
id: '',
|
||||
name: '',
|
||||
houseNumber: '',
|
||||
companyAddress_dictText: '',
|
||||
trade_dictText: '',
|
||||
workPlace: '',
|
||||
createBy: '',
|
||||
companyLogo: '',
|
||||
});
|
||||
let tradeOptions: any[] = [];
|
||||
|
||||
/**
|
||||
* 初始化租户信息
|
||||
*/
|
||||
async function initTenant() {
|
||||
let result = await getTenantById({ id: getTenantId() });
|
||||
if (result) {
|
||||
if (result.companyAddress) {
|
||||
formState.companyAddress_dictText = getPcaText(result.companyAddress);
|
||||
} else {
|
||||
formState.companyAddress_dictText = '';
|
||||
}
|
||||
if (result.trade) {
|
||||
formState.trade_dictText = await getTradeText(result.trade);
|
||||
} else {
|
||||
formState.trade_dictText = '';
|
||||
}
|
||||
Object.assign(formState, result);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取省市区文本
|
||||
* @param code
|
||||
*/
|
||||
function getPcaText(code) {
|
||||
let arr = getRealCode(code, 3);
|
||||
console.log("arr:::",arr)
|
||||
let provinces: any = provinceOptions.filter((item) => item.value == arr[0]);
|
||||
let cities: any[] = getDataByCode(arr[0]);
|
||||
let areas: any[] = getDataByCode(arr[1]);
|
||||
let str = '';
|
||||
if (provinces && provinces.length > 0) {
|
||||
str = provinces[0].label;
|
||||
if (cities && cities.length > 0) {
|
||||
let temp1 = cities.filter((item) => item.value == arr[1]);
|
||||
str = str + '/' + temp1[0].label;
|
||||
if (areas && areas.length > 0) {
|
||||
let temp2 = areas.filter((item) => item.value == arr[2]);
|
||||
str = str + '/' + temp2[0].label;
|
||||
}
|
||||
}
|
||||
}
|
||||
return str;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取行业文本
|
||||
*
|
||||
* @param trade
|
||||
*/
|
||||
async function getTradeText(trade) {
|
||||
if (tradeOptions.length == 0) {
|
||||
let options: any = await initDictOptions('trade');
|
||||
tradeOptions = options;
|
||||
}
|
||||
let arr = tradeOptions.filter((item) => item.value == trade);
|
||||
if (arr.length > 0) {
|
||||
return arr[0].label;
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取图片路径
|
||||
*/
|
||||
function getImageSrc() {
|
||||
return getFileAccessHttpUrl(formState.companyLogo) || "";
|
||||
}
|
||||
|
||||
/**
|
||||
* 预览图片
|
||||
*/
|
||||
function previewImage() {
|
||||
let fileAccessHttpUrl = getFileAccessHttpUrl(formState.companyLogo);
|
||||
createImgPreview({ imageList: [fileAccessHttpUrl], defaultWidth: 700, rememberState: true });
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
//提示信息
|
||||
tenantSaasMessage('我的租户');
|
||||
initTenant();
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.message-set-container {
|
||||
box-sizing: border-box;
|
||||
flex: 1;
|
||||
margin: 16px;
|
||||
min-height: 0;
|
||||
}
|
||||
.message-set-box {
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 750px;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
}
|
||||
.message-set-header {
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
border-bottom: 1px solid #eaeaea;
|
||||
box-sizing: border-box;
|
||||
color: #333;
|
||||
display: flex;
|
||||
font-weight: 600;
|
||||
height: 57px;
|
||||
line-height: 57px;
|
||||
padding: 0 18px 0 24px;
|
||||
}
|
||||
.message-set-content {
|
||||
box-sizing: border-box;
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.font17 {
|
||||
font-size: 17px;
|
||||
}
|
||||
.common-info {
|
||||
padding: 20px 24px;
|
||||
background: #ffffff;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.common-info-row {
|
||||
color: #333;
|
||||
display: flex;
|
||||
font-size: 13px;
|
||||
}
|
||||
.common-info-row-label {
|
||||
color: #757575;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
width: 140px;
|
||||
}
|
||||
.common-info-row-content {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
}
|
||||
.pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
.delete-color {
|
||||
color: #f51744;
|
||||
cursor: pointer;
|
||||
}
|
||||
.set-describe {
|
||||
color: #757575;
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
.m-top24 {
|
||||
margin-top: 24px;
|
||||
}
|
||||
.edit-name {
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
box-sizing: border-box;
|
||||
color: #1e88e5;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
outline: none;
|
||||
text-shadow: none;
|
||||
user-select: none;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.m-right16 {
|
||||
margin-right: 16px;
|
||||
}
|
||||
.split-line {
|
||||
background: #eaeaea;
|
||||
height: 1px;
|
||||
margin: 40px 0;
|
||||
width: 100%;
|
||||
}
|
||||
.cancel-split-line {
|
||||
background: #eaeaea;
|
||||
height: 1px;
|
||||
margin: 40px 0 20px;
|
||||
width: 100%;
|
||||
}
|
||||
.form-item-padding {
|
||||
padding: 0 24px 22px;
|
||||
}
|
||||
.form-group {
|
||||
display: table;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
.form-label {
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
line-height: 29px;
|
||||
}
|
||||
.txt-middle {
|
||||
vertical-align: middle !important;
|
||||
}
|
||||
}
|
||||
.red {
|
||||
color: red;
|
||||
}
|
||||
.domain-background {
|
||||
height: 56px;
|
||||
margin-top: 6px;
|
||||
width: 100px;
|
||||
margin-left: 142px;
|
||||
}
|
||||
.cancellation {
|
||||
color: #333333;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
</style>
|
|
@ -10,14 +10,14 @@
|
|||
:disabled="selectedRowKeys.length === 0"
|
||||
>邀请用户加入</a-button
|
||||
>
|
||||
<a-button
|
||||
<!-- <a-button
|
||||
preIcon="ant-design:plus-outlined"
|
||||
type="primary"
|
||||
@click="handlePack"
|
||||
style="margin-right: 5px"
|
||||
:disabled="selectedRowKeys.length === 0"
|
||||
>套餐</a-button
|
||||
>
|
||||
>-->
|
||||
</template>
|
||||
<template #action="{ record }">
|
||||
<TableAction :actions="getActions(record)" />
|
||||
|
|
|
@ -0,0 +1,188 @@
|
|||
<!-- 当前租户下套餐 -->
|
||||
<template>
|
||||
<div style="display: flex; width: 100%">
|
||||
<div :style="leftStyle">
|
||||
<BasicTable @register="registerTable">
|
||||
<template #tableTitle>
|
||||
<div style="margin-left: 10px; margin-top: 5px"
|
||||
>当前登录租户: <span class="tenant-name">{{ loginTenantName }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<!--操作栏-->
|
||||
<template #action="{ record }">
|
||||
<TableAction :actions="getTableAction(record)" />
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
<div v-if="showRight" style="width: 49%; transition: width 0.3s">
|
||||
<TenantUserRightList ref="rightListRef" @cancel="handleCancel"></TenantUserRightList>
|
||||
</div>
|
||||
</div>
|
||||
<TenantPackMenuModal @register="registerPackMenu" @success="success" />
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { ref, unref, defineComponent, defineEmits } from 'vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { packFormSchema, tenantPackColumns } from '../tenant.data';
|
||||
import { getLoginTenantName, packList } from '../tenant.api';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { BasicTable, TableAction } from '/@/components/Table';
|
||||
import TenantPackMenuModal from './TenantPackMenuModal.vue';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { getTenantId } from '/@/utils/auth';
|
||||
import TenantUserRightList from '../components/TenantUserRightList.vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'TenantCurrentPackList',
|
||||
components: {
|
||||
TenantUserRightList,
|
||||
BasicTable,
|
||||
TableAction,
|
||||
TenantPackMenuModal,
|
||||
},
|
||||
setup() {
|
||||
const [registerPackMenu, { openModal }] = useModal();
|
||||
const [registerPackUser, { openModal: packUserOpenModal }] = useModal();
|
||||
|
||||
const tenantId = ref<number>();
|
||||
const rightListRef = ref<any>();
|
||||
//是否显示右侧用户列表
|
||||
const showRight = ref<any>();
|
||||
//左侧样式
|
||||
const leftStyle = ref<any>({
|
||||
width: '100%',
|
||||
transition: 'width 0.3s',
|
||||
});
|
||||
|
||||
// 列表页面公共参数、方法
|
||||
const { prefixCls, tableContext } = useListPage({
|
||||
designScope: 'tenant-template',
|
||||
tableProps: {
|
||||
api: packList,
|
||||
columns: tenantPackColumns,
|
||||
immediate: false,
|
||||
formConfig: {
|
||||
schemas: packFormSchema,
|
||||
labelCol: {
|
||||
xxl: 8,
|
||||
},
|
||||
actionColOptions: {
|
||||
xs: 24,
|
||||
sm: 8,
|
||||
md: 8,
|
||||
lg: 8,
|
||||
xl: 8,
|
||||
xxl: 8,
|
||||
},
|
||||
},
|
||||
beforeFetch: (params) => {
|
||||
return Object.assign(params, { tenantId: tenantId.value, status: '1', packType: 'custom' });
|
||||
},
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload }, { rowSelection, selectedRowKeys, selectedRows }] = tableContext;
|
||||
//当前登录的租户名称
|
||||
const loginTenantName = ref<string>('');
|
||||
const { createMessage } = useMessage();
|
||||
|
||||
/**
|
||||
* 获取租户名称
|
||||
*/
|
||||
getTenantName();
|
||||
|
||||
async function getTenantName() {
|
||||
let id = getTenantId();
|
||||
if (id) {
|
||||
loginTenantName.value = await getLoginTenantName();
|
||||
tenantId.value = Number(id);
|
||||
await reload();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 表格操作
|
||||
* @param record
|
||||
*/
|
||||
function getTableAction(record) {
|
||||
return [
|
||||
{
|
||||
label: '用户',
|
||||
onClick: seeTenantPackUser.bind(null, record),
|
||||
},
|
||||
{
|
||||
label: '权限详情',
|
||||
onClick: handleDetail.bind(null, record),
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* 成功
|
||||
*/
|
||||
function success() {
|
||||
(selectedRowKeys.value = []) && reload();
|
||||
}
|
||||
|
||||
/**
|
||||
* 套餐包下面的用户
|
||||
* @param record
|
||||
*/
|
||||
function seeTenantPackUser(record) {
|
||||
showRight.value = true;
|
||||
leftStyle.value = {
|
||||
width: '50%',
|
||||
transition: 'width 0.3s',
|
||||
};
|
||||
setTimeout(() => {
|
||||
rightListRef.value.initData(record);
|
||||
}, 300);
|
||||
}
|
||||
|
||||
/**
|
||||
* 详情
|
||||
* @param record
|
||||
*/
|
||||
function handleDetail(record) {
|
||||
openModal(true, {
|
||||
isUpdate: true,
|
||||
record: record,
|
||||
tenantId: unref(tenantId),
|
||||
packType: 'custom',
|
||||
showFooter: false,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 关闭回调
|
||||
*/
|
||||
function handleCancel() {
|
||||
showRight.value = false;
|
||||
leftStyle.value = {
|
||||
width: '100%',
|
||||
transition: 'width 0.3s',
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
registerPackMenu,
|
||||
success,
|
||||
getTableAction,
|
||||
registerTable,
|
||||
rowSelection,
|
||||
rightListRef,
|
||||
showRight,
|
||||
registerPackUser,
|
||||
loginTenantName,
|
||||
leftStyle,
|
||||
handleCancel,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.tenant-name {
|
||||
text-decoration: underline;
|
||||
margin: 5px;
|
||||
font-size: 15px;
|
||||
}
|
||||
</style>
|
|
@ -137,6 +137,12 @@
|
|||
return;
|
||||
}
|
||||
//update-end---author:wangshuai ---date:20230222 for:系统默认套餐包不允许删除------------
|
||||
//update-begin---author:wangshuai---date:2025-09-03---for:默认套餐不允许删除---
|
||||
if(record.packCode && record.packCode.indexOf("default") != -1){
|
||||
createMessage.warning("默认套餐包不允许删除");
|
||||
return;
|
||||
}
|
||||
//update-end---author:wangshuai---date:2025-09-03---for:默认套餐不允许删除---
|
||||
await deleteTenantPack({ ids: record.id }, success);
|
||||
}
|
||||
|
||||
|
@ -151,6 +157,12 @@
|
|||
createMessage.warning("默认系统套餐包不允许删除");
|
||||
return;
|
||||
}
|
||||
//update-begin---author:wangshuai---date:2025-09-03---for:默认套餐不允许删除---
|
||||
if(value[i].packCode && value[i].packCode.indexOf("default") != -1){
|
||||
createMessage.warning("默认套餐包不允许删除");
|
||||
return;
|
||||
}
|
||||
//update-end---author:wangshuai---date:2025-09-03---for:默认套餐不允许删除---
|
||||
}
|
||||
}
|
||||
Modal.confirm({
|
||||
|
|
|
@ -29,8 +29,10 @@ enum Api {
|
|||
getTenantPageListByUserId = '/sys/tenant/getTenantPageListByUserId',
|
||||
|
||||
//新增、编辑用户租户
|
||||
saveUser = '/sys/user/add',
|
||||
saveUser = '/sys/user/addTenantUser',
|
||||
editUser = '/sys/user/editTenantUser',
|
||||
//根据租户id和用户获取用户的产品包列表和当前用户下的产品包id
|
||||
listPackByTenantUserId = '/sys/tenant/listPackByTenantUserId',
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -112,7 +114,7 @@ export const getTenantUserList = (params) => {
|
|||
export const leaveTenant = (params, handleSuccess) => {
|
||||
Modal.confirm({
|
||||
title: '请离',
|
||||
content: '是否请离该用户',
|
||||
content: '是否将此用户请离当前租户',
|
||||
okText: '确认',
|
||||
cancelText: '取消',
|
||||
onOk: () => {
|
||||
|
@ -253,3 +255,11 @@ export const saveOrUpdateTenantUser = (params, isUpdate) => {
|
|||
let url = isUpdate ? Api.editUser : Api.saveUser;
|
||||
return defHttp.post({ url: url, params },{ joinParamsToUrl: true });
|
||||
};
|
||||
/**
|
||||
* 根据租户id和用户获取用户的产品包列表和当前用户下的产品包id
|
||||
*
|
||||
* @param params
|
||||
*/
|
||||
export const listPackByTenantUserId = (params) => {
|
||||
return defHttp.get({ url: Api.listPackByTenantUserId, params });
|
||||
}
|
||||
|
|
|
@ -147,12 +147,21 @@ export const formSchema: FormSchema[] = [
|
|||
}, {
|
||||
field: 'companyAddress',
|
||||
label: '公司地址',
|
||||
component: 'InputTextArea',
|
||||
component: 'JAreaSelect',
|
||||
componentProps: {
|
||||
placeholder: '请输入公司地址',
|
||||
rows: 4,
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'workPlace',
|
||||
label: '工作地点',
|
||||
component: 'InputTextArea',
|
||||
componentProps: {
|
||||
placeholder: '请输入工作地点',
|
||||
rows: 4,
|
||||
}
|
||||
},
|
||||
/* {
|
||||
field: 'beginDate',
|
||||
label: '开始时间',
|
||||
|
@ -257,6 +266,25 @@ export const packColumns: BasicColumn[] = [
|
|||
title: '套餐包名称',
|
||||
dataIndex: 'packName',
|
||||
width: 100,
|
||||
customRender: ( { record, text }) => {
|
||||
if(record.packCode && record.packCode.indexOf('default') != -1) {
|
||||
return text + '(默认产品包)';
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '是否自动分配用户',
|
||||
dataIndex: 'izSysn',
|
||||
width: 100,
|
||||
customRender: ( { text }) => {
|
||||
if(text === '1') {
|
||||
return '是';
|
||||
} else {
|
||||
return '否';
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
|
@ -277,6 +305,39 @@ export const packColumns: BasicColumn[] = [
|
|||
},
|
||||
];
|
||||
|
||||
//套餐包列表
|
||||
export const tenantPackColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '套餐包名称',
|
||||
dataIndex: 'packName',
|
||||
width: 100,
|
||||
customRender: ( { record, text }) => {
|
||||
if(record.packCode && record.packCode.indexOf('default') != -1) {
|
||||
return text + '(默认产品包)';
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '是否自动分配用户',
|
||||
dataIndex: 'izSysn',
|
||||
width: 100,
|
||||
customRender: ( { text }) => {
|
||||
if(text === '1') {
|
||||
return '是';
|
||||
} else {
|
||||
return '否';
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '备注说明',
|
||||
dataIndex: 'remarks',
|
||||
width: 150,
|
||||
},
|
||||
];
|
||||
|
||||
//套餐包列表
|
||||
export const defalutPackColumns: BasicColumn[] = [
|
||||
{
|
||||
|
@ -337,9 +398,11 @@ export const packMenuFormSchema: FormSchema[] = [
|
|||
componentProps: {
|
||||
dict: 'sys_permission,name,id',
|
||||
pidField: 'parent_id',
|
||||
hasChildField:'is_leaf',
|
||||
multiple: true,
|
||||
treeCheckAble:true,
|
||||
treeCheckStrictly: true,
|
||||
converIsLeafVal: 0,
|
||||
getPopupContainer: () => document.body,
|
||||
},
|
||||
},
|
||||
|
@ -348,6 +411,19 @@ export const packMenuFormSchema: FormSchema[] = [
|
|||
label: '备注说明',
|
||||
component: 'InputTextArea',
|
||||
},
|
||||
{
|
||||
field: 'izSysn',
|
||||
label: '自动分配用户',
|
||||
component: 'Switch',
|
||||
componentProps: {
|
||||
checkedValue: "1",
|
||||
checkedChildren: '是',
|
||||
unCheckedValue: "0",
|
||||
unCheckedChildren: '否',
|
||||
},
|
||||
defaultValue: "1",
|
||||
helpMessage: "默认会自动分配给用户,个性高级套餐,需要租户管理员手工分配人员(拥有更灵活性权限控制)"
|
||||
},
|
||||
{
|
||||
field: 'status',
|
||||
label: '开启状态',
|
||||
|
@ -366,6 +442,18 @@ export const packMenuFormSchema: FormSchema[] = [
|
|||
component: 'Input',
|
||||
show: false
|
||||
},
|
||||
{
|
||||
field: 'packCode',
|
||||
label: '产品包编码',
|
||||
component: 'Input',
|
||||
show: false
|
||||
},
|
||||
{
|
||||
field: 'packType',
|
||||
label: '产品包类型',
|
||||
component: 'Input',
|
||||
show: false
|
||||
},
|
||||
];
|
||||
|
||||
//回收站列表
|
||||
|
@ -479,7 +567,7 @@ export const tenantUserSchema: FormSchema[] = [
|
|||
},
|
||||
},
|
||||
{ field: 'selecteddeparts', label: '部门', component: 'JSelectDept', componentProps: { checkStrictly: true } },
|
||||
{
|
||||
/* {
|
||||
field: 'post',
|
||||
label: '职位',
|
||||
component: 'JSelectPosition',
|
||||
|
@ -489,9 +577,33 @@ export const tenantUserSchema: FormSchema[] = [
|
|||
label: '工号',
|
||||
component: 'Input',
|
||||
dynamicRules: ({ model, schema }) => {
|
||||
return [{ required: true, message: '请输入工号' }, { ...rules.duplicateCheckRule('sys_user', 'work_no', model, schema, false)[0] }];
|
||||
return [{ required: false, message: '请输入工号' }, { ...rules.duplicateCheckRule('sys_user', 'work_no', model, schema, false)[0] }];
|
||||
},
|
||||
},
|
||||
},*/
|
||||
{ field: 'relTenantIds', label: '租户', component: 'Input',show:false },
|
||||
{ field: 'selectedroles', label: '角色', component: 'Input',show:false },
|
||||
];
|
||||
|
||||
// 分配用户套餐
|
||||
export const packUserAllotSchemas: FormSchema[] = [
|
||||
{
|
||||
field: 'userId',
|
||||
label: '用户id',
|
||||
component: 'Input',
|
||||
show: false
|
||||
},
|
||||
{
|
||||
field: 'realname',
|
||||
label: '用户姓名',
|
||||
component: 'Input',
|
||||
componentProps:{
|
||||
readonly : true
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'packId',
|
||||
label: '套餐',
|
||||
component: 'Select',
|
||||
slot: 'packId'
|
||||
}
|
||||
];
|
Loading…
Reference in New Issue