915 lines
38 KiB
Vue
915 lines
38 KiB
Vue
<template>
|
|
<a-spin size="large" :spinning="loading">
|
|
<div class="page-container">
|
|
<div class="page-header">
|
|
<a-row :gutter="[16, 8]">
|
|
<a-col :lg="8" :sm="24">
|
|
<a-row :wrap="false">
|
|
<a-col flex="none">
|
|
<div style="padding: 0 "><a-input flex="none" readonly value="组别名称"
|
|
class="site-input-split" style="width: 160px;border-radius:0; border-top-left-radius: 5pt 5pt;
|
|
border-bottom-left-radius: 5pt 5pt;
|
|
pointer-events: none" /></div>
|
|
</a-col>
|
|
<a-col flex="auto">
|
|
<a-input-search :disabled="isEdit" v-model:value="groupName" flex="auto"
|
|
@search="onModalSearch" />
|
|
</a-col>
|
|
</a-row>
|
|
</a-col>
|
|
<a-col :lg="12" :sm="24">
|
|
<a-space>
|
|
<a-button type="primary" :disabled="isEdit" :icon="h(FileSearchOutlined)"
|
|
@click.prevent="onSearch">查询</a-button>
|
|
<a-button type="primary" :disabled="isEdit" :icon="h(ClearOutlined)"
|
|
@click.prevent="onReset">重置</a-button>
|
|
<a-button type="primary" :disabled="isEdit" :icon="h(FileAddOutlined)"
|
|
@click.prevent="onCreate">新增</a-button>
|
|
</a-space>
|
|
</a-col>
|
|
</a-row>
|
|
</div>
|
|
<div class="page-main ft-page" :class="{ 'ft-readonly': !isEdit }" :style="{ height: resultH }">
|
|
<!-- 顶部信息卡 -->
|
|
<div class="ft-hero">
|
|
<div class="ft-hero-icon">
|
|
<TeamOutlined />
|
|
</div>
|
|
<div class="ft-hero-main">
|
|
<div class="ft-hero-name">
|
|
{{ data.SecurityGroup.GroupLocalName || "未填写组别名称" }}
|
|
</div>
|
|
<div class="ft-hero-meta">
|
|
<span class="ft-chip">编号 {{ data.SecurityGroup.GroupName || "-" }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 组别信息 -->
|
|
<div class="ft-card">
|
|
<div class="ft-card-title">组别信息</div>
|
|
<div class="ft-grid">
|
|
<div class="ft-field">
|
|
<div class="ft-label">组别名称<span class="ft-required">*</span></div>
|
|
<a-input size="large" :maxlength="50" required placeholder="请输入组别名称"
|
|
:readonly="!isEdit || !!data.SecurityGroup.GroupName"
|
|
v-model:value="data.SecurityGroup.GroupName" />
|
|
</div>
|
|
<div class="ft-field">
|
|
<div class="ft-label">中文名称<span class="ft-required">*</span></div>
|
|
<a-input size="large" :maxlength="500" required placeholder="请输入中文名称"
|
|
:readonly="!isEdit" v-model:value="data.SecurityGroup.GroupLocalName" />
|
|
</div>
|
|
<div class="ft-field">
|
|
<div class="ft-label">英文名称</div>
|
|
<a-input size="large" :maxlength="50" placeholder="请输入英文名称" :readonly="!isEdit"
|
|
v-model:value="data.SecurityGroup.GroupEngName" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 明细 -->
|
|
<div class="ft-card">
|
|
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
|
|
<a-collapse-panel key="1" header="权限明细">
|
|
<div class="ft-list">
|
|
<div v-for="(record, index) in data.SecurityGroupPermissionViews"
|
|
:key="record.PermissionName || index" class="ft-item">
|
|
<div class="ft-item-head">
|
|
<span class="ft-item-index">{{ index + 1 }}</span>
|
|
<div class="ft-item-title">
|
|
<span v-if="!isEdit" class="ft-item-name ft-item-link"
|
|
@click="onViewPermissionOperation(record.PermissionName)">
|
|
{{ record.PermissionName || "未命名权限" }}
|
|
</span>
|
|
<span v-else class="ft-item-name">
|
|
{{ record.PermissionName || "未命名权限" }}
|
|
</span>
|
|
</div>
|
|
<div v-if="isEdit" class="ft-item-actions">
|
|
<DeleteOutlined class="ft-action ft-action-delete"
|
|
@click="deletePermission(record.PermissionName)" />
|
|
</div>
|
|
</div>
|
|
<div class="ft-item-body">
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">中文名称</span>
|
|
<span class="ft-item-text">{{ record.PermissionDescription || "-" }}</span>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">扩展名称</span>
|
|
<span v-if="isEdit" class="ft-item-text ft-item-link"
|
|
@click="addPermissionDependent(record.Dependent)">
|
|
{{ record.Dependent || "-" }}
|
|
</span>
|
|
<span v-else class="ft-item-text">{{ record.Dependent || "-" }}</span>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">查看</span>
|
|
<div class="ft-check">
|
|
<a-checkbox :disabled="!isEdit" v-model:checked="record.IsView" />
|
|
</div>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">新增</span>
|
|
<div class="ft-check">
|
|
<a-checkbox :disabled="!isEdit" v-model:checked="record.IsCreate" />
|
|
</div>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">修改</span>
|
|
<div class="ft-check">
|
|
<a-checkbox :disabled="!isEdit" v-model:checked="record.IsAmend" />
|
|
</div>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">删除</span>
|
|
<div class="ft-check">
|
|
<a-checkbox :disabled="!isEdit" v-model:checked="record.IsDelete" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-if="!data.SecurityGroupPermissionViews || !data.SecurityGroupPermissionViews.length"
|
|
class="ft-empty">
|
|
暂无权限明细
|
|
</div>
|
|
<a-button v-if="isEdit" class="ft-add-btn" type="dashed" block @click="addPermission">
|
|
<PlusSquareTwoTone /> 新增权限
|
|
</a-button>
|
|
</div>
|
|
</a-collapse-panel>
|
|
<a-collapse-panel key="2" header="扩展权限明细">
|
|
<div class="ft-list">
|
|
<div v-for="(record, index) in data.SecurityGroupPermissionDependentViews"
|
|
:key="record.DependentDetailName || index" class="ft-item">
|
|
<div class="ft-item-head">
|
|
<span class="ft-item-index">{{ index + 1 }}</span>
|
|
<div class="ft-item-title">
|
|
<span class="ft-item-name">
|
|
{{ record.DependentDetailName || "未命名扩展权限" }}
|
|
</span>
|
|
</div>
|
|
<div v-if="isEdit" class="ft-item-actions">
|
|
<DeleteOutlined class="ft-action ft-action-delete"
|
|
@click="deletePermissionDependent(record.DependentDetailName)" />
|
|
</div>
|
|
</div>
|
|
<div class="ft-item-body">
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">扩展名称</span>
|
|
<span class="ft-item-text">{{ record.Dependent || "-" }}</span>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">扩展子项目中文</span>
|
|
<span class="ft-item-text">{{ record.DependentDetailDescription || "-" }}</span>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">查看</span>
|
|
<div class="ft-check">
|
|
<a-checkbox :disabled="!isEdit" v-model:checked="record.IsView" />
|
|
</div>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">新增</span>
|
|
<div class="ft-check">
|
|
<a-checkbox :disabled="!isEdit" v-model:checked="record.IsCreate" />
|
|
</div>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">修改</span>
|
|
<div class="ft-check">
|
|
<a-checkbox :disabled="!isEdit" v-model:checked="record.IsAmend" />
|
|
</div>
|
|
</div>
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">删除</span>
|
|
<div class="ft-check">
|
|
<a-checkbox :disabled="!isEdit" v-model:checked="record.IsDelete" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-if="!data.SecurityGroupPermissionDependentViews || !data.SecurityGroupPermissionDependentViews.length"
|
|
class="ft-empty">
|
|
暂无扩展权限明细
|
|
</div>
|
|
</div>
|
|
</a-collapse-panel>
|
|
<a-collapse-panel key="3" header="组别内的角色群">
|
|
<div class="ft-list">
|
|
<div v-for="(record, index) in data.SecurityActorGroups"
|
|
:key="record.ActorName || index" class="ft-item">
|
|
<div class="ft-item-head">
|
|
<span class="ft-item-index">{{ index + 1 }}</span>
|
|
<div class="ft-item-title">
|
|
<span v-if="!isEdit" class="ft-item-name ft-item-link"
|
|
@click="onViewActorOperation(record.ActorName)">
|
|
{{ record.ActorName || "未命名角色" }}
|
|
</span>
|
|
<span v-else class="ft-item-name">
|
|
{{ record.ActorName || "未命名角色" }}
|
|
</span>
|
|
</div>
|
|
<div v-if="isEdit" class="ft-item-actions">
|
|
<DeleteOutlined class="ft-action ft-action-delete"
|
|
@click="deleteActor(record.ActorName)" />
|
|
</div>
|
|
</div>
|
|
<div class="ft-item-body">
|
|
<div class="ft-item-field">
|
|
<span class="ft-item-label">角色中文名称</span>
|
|
<span class="ft-item-text">{{ record.ActorLocalName || "-" }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-if="!data.SecurityActorGroups || !data.SecurityActorGroups.length"
|
|
class="ft-empty">
|
|
暂无角色群
|
|
</div>
|
|
<a-button v-if="isEdit" class="ft-add-btn" type="dashed" block @click="addActor">
|
|
<PlusSquareTwoTone /> 新增角色
|
|
</a-button>
|
|
</div>
|
|
</a-collapse-panel>
|
|
</a-collapse>
|
|
</div>
|
|
</div>
|
|
<div class="page-footer">
|
|
<div style="">
|
|
<a-row :gutter="24">
|
|
<a-col :lg="24" :sm="24">
|
|
<div>
|
|
<a-row v-if="isEdit" :gutter="[16, 8]">
|
|
<a-space>
|
|
<a-popconfirm v-if="data.SecurityGroup.CreatedBy" title="确定是否取消修改?" ok-text="是"
|
|
cancel-text="否" @confirm="onCancel">
|
|
<a-button type="primary" ghost :icon="h(UndoOutlined)">取消</a-button>
|
|
</a-popconfirm>
|
|
<a-button v-if="!data.SecurityGroup.CreatedBy" type="primary" ghost
|
|
:icon="h(UndoOutlined)" @click.prevent="onCancel">取消</a-button>
|
|
<a-button type="primary" ghost :icon="h(SaveOutlined)"
|
|
@click.prevent="onSave">保存</a-button>
|
|
</a-space>
|
|
</a-row>
|
|
<a-row v-else :gutter="[16, 8]">
|
|
<a-space>
|
|
<a-button type="primary" v-if="canAmend" :icon="h(EditOutlined)"
|
|
:disabled="!hasData" @click.prevent="onAmend">修改</a-button>
|
|
<a-popconfirm :disabled="!hasData" title="确定是否删除这条记录?" ok-text="是"
|
|
cancel-text="否" @confirm="onDelete">
|
|
<a-button type="primary" danger :icon="h(DeleteOutlined)"
|
|
:disabled="!hasData" v-if="canDelete">删除</a-button>
|
|
</a-popconfirm>
|
|
</a-space>
|
|
</a-row>
|
|
</div>
|
|
</a-col>
|
|
</a-row>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<dragModal v-model:open="modelOption.isModalGroup" title="组别查询" @cancel="handleCance"
|
|
:fullscreen="width < 640" :mask-closable="false" @ok="handleSelect">
|
|
<GroupEnquiry ref="enquiry" @on-row-dblclick="handleSelect"></GroupEnquiry>
|
|
</dragModal>
|
|
<dragModal v-model:open="modelOption.isModalPermission" title="权限查询" @cancel="handleCance"
|
|
:fullscreen="width < 640" :mask-closable="false" @ok="handleSelectPermission">
|
|
<PermissionEnquiry ref="permissionEnquiry" @on-row-dblclick="handleSelectPermission"></PermissionEnquiry>
|
|
</dragModal>
|
|
<dragModal v-model:open="modelOption.isModalPermissionDependent" title="扩展权限查询"
|
|
:fullscreen="width < 640" @cancel="handleCance" :mask-closable="false"
|
|
@ok="handleSelectPermissionDependent">
|
|
<PermissionDependentModal ref="permissionDependentEnquiry"
|
|
@on-row-dblclick="handleSelectPermissionDependent">
|
|
</PermissionDependentModal>
|
|
</dragModal>
|
|
<dragModal v-model:open="modelOption.isModalActor" title="角色查询" @cancel="handleCance"
|
|
:fullscreen="width < 640" :mask-closable="false" @ok="handleSelectActor">
|
|
<ActorEnquiry ref="actorEnquiry" @on-row-dblclick="handleSelectActor"></ActorEnquiry>
|
|
</dragModal>
|
|
</a-spin>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
import { ref, unref, onBeforeMount, inject, provide, h, onMounted } from "vue";
|
|
import { notification } from "ant-design-vue";
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
import { DeleteOutlined, EditOutlined, ClearOutlined, FileSearchOutlined, FileAddOutlined, UndoOutlined, SaveOutlined, PlusSquareTwoTone, DownSquareTwoTone, UpSquareTwoTone, TeamOutlined } from "@ant-design/icons-vue";
|
|
import { PermissionContext, usePermissionContext } from "@/hooks/PermissionContext"
|
|
import dragModal from "@/components/basic/DragModal.vue"
|
|
import GroupEnquiry from "./GroupEnquiry.vue";
|
|
import PermissionEnquiry from "./PermissionEnquiry.vue";
|
|
import ActorEnquiry from "./ActorEnquiry.vue";
|
|
import PermissionDependentModal from "./PermissionDependentModal.vue";
|
|
import { SecurityGroupData } from "@/data/auto/securityGroupData";
|
|
import { SecurityGroupPermissionViewEntity } from "@/data/auto/securityGroupPermissionViewEntity";
|
|
import { SecurityGroupPermissionViewDisplayData } from "@/data/auto/securityGroupPermissionViewDisplayData";
|
|
import { SecurityGroupPermissionDependentViewDisplayData } from "@/data/auto/securityGroupPermissionDependentViewDisplayData";
|
|
import SecurityGroupService from "@/service/security/securityGroupService";
|
|
import { useYesNoPolicy } from "@/hooks/useYesNoPolicy"
|
|
import { SelectOption } from "@/data/auto/selectOption";
|
|
import { useWindowSize } from '@vueuse/core'
|
|
import { SecurityGroupEntity } from "@/data/auto/securityGroupEntity";
|
|
import { BindOption } from "@/data/custom/bindOption";
|
|
import { SecurityPermissionEntity } from "@/data/auto/securityPermissionEntity";
|
|
import { SecurityPermissionDependentEntity } from "@/data/auto/securityPermissionDependentEntity";
|
|
import { SecurityActorGroupViewEntity } from "@/data/auto/securityActorGroupViewEntity";
|
|
import { SecurityActorEntity } from "@/data/auto/securityActorEntity";
|
|
import { operationToEnquiryMethodKey, OperationToEnquiryModelOption } from "@/injections"
|
|
|
|
const route = useRoute();
|
|
const router = useRouter();
|
|
|
|
const groupName = ref<string>(route.params.id as string)
|
|
const mode = ref<string>(route.params.mode as string)
|
|
|
|
const loading = ref<boolean>(false);
|
|
const { width, height } = useWindowSize()
|
|
|
|
|
|
const isEdit = ref<boolean>(false);
|
|
const canAmend = ref<boolean>(false);
|
|
const canDelete = ref<boolean>(false);
|
|
const canCreate = ref<boolean>(false);
|
|
|
|
|
|
const showModalType = ref<number>(0);
|
|
|
|
const data = ref<SecurityGroupData>(new SecurityGroupData());
|
|
const hasData = ref<boolean>(false);
|
|
|
|
const yesNoPolicy = ref<SelectOption[]>([]);
|
|
const resultH = ref('');
|
|
const oldGroupName = ref<string>(groupName.value);
|
|
|
|
interface GroupEnquiry {
|
|
keys: SecurityGroupEntity[],
|
|
setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
|
|
}
|
|
interface PermissionEnquiry {
|
|
keys: SecurityPermissionEntity[],
|
|
setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
|
|
}
|
|
|
|
interface PermissionDependentEnquiry {
|
|
keys: SecurityPermissionDependentEntity[],
|
|
setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
|
|
}
|
|
|
|
interface ActorEnquiry {
|
|
keys: SecurityActorEntity[],
|
|
setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
|
|
}
|
|
|
|
const enquiry = ref<GroupEnquiry | null>(null)
|
|
const permissionEnquiry = ref<PermissionEnquiry | null>(null)
|
|
const permissionDependentEnquiry = ref<PermissionDependentEnquiry | null>(null)
|
|
const actorEnquiry = ref<ActorEnquiry | null>(null)
|
|
|
|
const activeKey = ref(['1', '2', '3']);
|
|
|
|
const columnPermissions = ref([
|
|
{
|
|
title: '序号',
|
|
dataIndex: 'index',
|
|
width: '5%',
|
|
align: 'center',
|
|
fixed: 'left',
|
|
sequence: 0,
|
|
hidden: 'N',
|
|
format: ''
|
|
},
|
|
{
|
|
title: "权限名称",
|
|
dataIndex: SecurityGroupPermissionViewEntity.PERMISSION_NAME,
|
|
width: '20%',
|
|
sequence: 1,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "中文名称",
|
|
dataIndex: SecurityGroupPermissionViewEntity.PERMISSION_DESCRIPTION,
|
|
width: '20%',
|
|
sequence: 2,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "扩展名称",
|
|
dataIndex: SecurityGroupPermissionViewEntity.DEPENDENT,
|
|
width: '10%',
|
|
sequence: 3,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "查看",
|
|
dataIndex: SecurityGroupPermissionViewDisplayData.IS_VIEW,
|
|
width: '5%',
|
|
sequence: 4,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "新增",
|
|
dataIndex: SecurityGroupPermissionViewDisplayData.IS_CREATE,
|
|
width: '5%',
|
|
sequence: 5,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "修改",
|
|
dataIndex: SecurityGroupPermissionViewDisplayData.IS_AMEND,
|
|
width: '5%',
|
|
sequence: 6,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "删除",
|
|
dataIndex: SecurityGroupPermissionViewDisplayData.IS_DELETE,
|
|
width: '5%',
|
|
sequence: 7,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "",
|
|
dataIndex: 'operation',
|
|
width: '5%',
|
|
sequence: 8,
|
|
hidden: 'N'
|
|
}
|
|
]);
|
|
|
|
const columnPermissionDependents = ref([
|
|
{
|
|
title: '序号',
|
|
dataIndex: 'index',
|
|
width: '5%',
|
|
align: 'center',
|
|
fixed: 'left',
|
|
sequence: 0,
|
|
hidden: 'N',
|
|
format: ''
|
|
},
|
|
{
|
|
title: "扩展名称",
|
|
dataIndex: SecurityGroupPermissionDependentViewDisplayData.DEPENDENT,
|
|
width: '15%',
|
|
sequence: 1,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "扩展子项目名称",
|
|
dataIndex: SecurityGroupPermissionDependentViewDisplayData.DEPENDENT_DETAIL_NAME,
|
|
width: '20%',
|
|
sequence: 2,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "扩展子项目中文",
|
|
dataIndex: SecurityGroupPermissionDependentViewDisplayData.DEPENDENT_DETAIL_DESCRIPTION,
|
|
width: '10%',
|
|
sequence: 3,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "查看",
|
|
dataIndex: SecurityGroupPermissionDependentViewDisplayData.IS_VIEW,
|
|
width: '5%',
|
|
sequence: 4,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "新增",
|
|
dataIndex: SecurityGroupPermissionDependentViewDisplayData.IS_CREATE,
|
|
width: '5%',
|
|
sequence: 5,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "修改",
|
|
dataIndex: SecurityGroupPermissionDependentViewDisplayData.IS_AMEND,
|
|
width: '5%',
|
|
sequence: 6,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "删除",
|
|
dataIndex: SecurityGroupPermissionDependentViewDisplayData.IS_DELETE,
|
|
width: '5%',
|
|
sequence: 7,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "",
|
|
dataIndex: 'operation',
|
|
width: '5%',
|
|
sequence: 8,
|
|
hidden: 'N'
|
|
}
|
|
]);
|
|
|
|
const columnActors = ref([
|
|
{
|
|
title: '序号',
|
|
dataIndex: 'index',
|
|
width: '5%',
|
|
align: 'center',
|
|
fixed: 'left',
|
|
sequence: 0,
|
|
hidden: 'N',
|
|
format: ''
|
|
},
|
|
{
|
|
title: "角色名称",
|
|
dataIndex: SecurityActorGroupViewEntity.ACTOR_NAME,
|
|
width: '15%',
|
|
sequence: 1,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "角色中文名称",
|
|
dataIndex: SecurityActorGroupViewEntity.ACTOR_LOCAL_NAME,
|
|
width: '15%',
|
|
sequence: 1,
|
|
hidden: 'N'
|
|
},
|
|
{
|
|
title: "",
|
|
dataIndex: 'operation',
|
|
width: '5%',
|
|
sequence: 8,
|
|
hidden: 'N'
|
|
}
|
|
]);
|
|
|
|
//================provide================
|
|
const modelOption = ref<OperationToEnquiryModelOption>(new OperationToEnquiryModelOption());
|
|
modelOption.value.isModalActor = false;
|
|
modelOption.value.isModalGroup = false;
|
|
modelOption.value.isModalPermission = false;
|
|
modelOption.value.isModalPermissionDependent = false;
|
|
modelOption.value.selectionTypeActor = 'checkbox';
|
|
modelOption.value.selectionTypeDependent = 'checkbox';
|
|
modelOption.value.selectionTypeGroup = 'checkbox';
|
|
modelOption.value.initBindOptionsDependent = [];
|
|
modelOption.value.initBindOptionsGroup = [];
|
|
|
|
const getOperationToEnquiryModelOption = () => {
|
|
return modelOption.value
|
|
}
|
|
provide(
|
|
operationToEnquiryMethodKey,
|
|
{
|
|
getOperationToEnquiryModelOption,
|
|
}
|
|
);
|
|
//================provide================
|
|
|
|
onBeforeMount(async () => {
|
|
yesNoPolicy.value = await useYesNoPolicy().getSelectOption(false);
|
|
})
|
|
|
|
onMounted(() => {
|
|
let pContext: PermissionContext = usePermissionContext();
|
|
canAmend.value = pContext.canAmend(route.meta.permission as string);
|
|
canDelete.value = pContext.canDelete(route.meta.permission as string);
|
|
canCreate.value = pContext.canCreate(route.meta.permission as string);
|
|
computResultTableHeight();
|
|
|
|
if (groupName.value && groupName.value.trim().length > 0) {
|
|
onSearch();
|
|
}
|
|
if (mode.value && mode.value == 'create') {
|
|
onCreate();
|
|
isEdit.value = true;
|
|
}
|
|
else if (mode.value && mode.value == 'amend') {
|
|
isEdit.value = true;
|
|
}
|
|
})
|
|
|
|
const computResultTableHeight = () => {
|
|
if (width.value > 640) {
|
|
resultH.value = 'calc(100vh - 220px )';
|
|
}
|
|
else {
|
|
resultH.value = 'calc(100vh - 250px )';
|
|
}
|
|
}
|
|
|
|
const onModalSearch = (() => {
|
|
|
|
modelOption.value.isModalGroup = true;
|
|
modelOption.value.selectionTypeGroup = 'radio';
|
|
|
|
showModalType.value = 0;
|
|
})
|
|
|
|
const onSearch = (async () => {
|
|
|
|
if (!groupName.value || groupName.value.trim().length == 0) {
|
|
notification.info({
|
|
message: '系统提示：',
|
|
description: '请输入组别名称',
|
|
placement: "topRight",
|
|
});
|
|
hasData.value = false;
|
|
return;
|
|
}
|
|
loading.value = true;
|
|
data.value = await SecurityGroupService.FindByKey(groupName.value.trim());
|
|
loading.value = false;
|
|
if (data.value.SecurityGroup == null) {
|
|
notification.info({
|
|
message: '系统提示：',
|
|
description: '记录不存在',
|
|
placement: "topRight",
|
|
});
|
|
data.value = new SecurityGroupData();
|
|
hasData.value = false;
|
|
return;
|
|
}
|
|
|
|
|
|
hasData.value = true;
|
|
})
|
|
|
|
const onReset = (() => {
|
|
data.value = new SecurityGroupData();
|
|
data.value.SecurityGroupPermissionViews = [];
|
|
data.value.SecurityGroupPermissionDependentViews = [];
|
|
data.value.SecurityActorGroups = [];
|
|
groupName.value = '';
|
|
hasData.value = false;
|
|
})
|
|
|
|
const onCreate = (() => {
|
|
onReset();
|
|
isEdit.value = true;
|
|
})
|
|
|
|
const onAmend = (() => {
|
|
isEdit.value = true;
|
|
oldGroupName.value = unref(data.value.SecurityGroup.GroupName);
|
|
})
|
|
|
|
const onSave = (async () => {
|
|
|
|
try {
|
|
loading.value = true;
|
|
|
|
if (!data.value.SecurityGroupPermissionViews) data.value.SecurityGroupPermissionViews = [];
|
|
if (!data.value.SecurityGroupPermissionDependentViews) data.value.SecurityGroupPermissionDependentViews = [];
|
|
if (!data.value.SecurityActorGroups) data.value.SecurityActorGroups = [];
|
|
|
|
if (data.value.SecurityGroup?.CreatedBy)
|
|
data.value = await SecurityGroupService.Update(data.value);
|
|
else {
|
|
data.value = await SecurityGroupService.Insert(data.value);
|
|
}
|
|
|
|
groupName.value = data.value.SecurityGroup.GroupName;
|
|
|
|
loading.value = false;
|
|
hasData.value = true;
|
|
isEdit.value = false;
|
|
|
|
} catch (error) {
|
|
loading.value = false;
|
|
}
|
|
|
|
})
|
|
|
|
const onCancel = (() => {
|
|
onReset();
|
|
if (oldGroupName.value && oldGroupName.value.length > 0) {
|
|
groupName.value = oldGroupName.value;
|
|
onSearch();
|
|
}
|
|
isEdit.value = false;
|
|
})
|
|
|
|
const onDelete = (async () => {
|
|
try {
|
|
loading.value = true;
|
|
|
|
await SecurityGroupService.Delete(data.value.SecurityGroup.GroupName);
|
|
|
|
onReset();
|
|
loading.value = false;
|
|
|
|
} catch (error) {
|
|
loading.value = false;
|
|
console.log(error);
|
|
}
|
|
})
|
|
|
|
const handleCance = (async () => {
|
|
|
|
})
|
|
|
|
|
|
const addPermission = (event: MouseEvent) => {
|
|
|
|
modelOption.value.isModalPermission = true;
|
|
modelOption.value.selectionTypePermission = 'checkbox';
|
|
|
|
// If you don't want click extra trigger collapse, you can prevent this:
|
|
event.stopPropagation();
|
|
};
|
|
|
|
const deletePermission = (key: string) => {
|
|
data.value.SecurityGroupPermissionViews = data.value.SecurityGroupPermissionViews.filter(item => item.PermissionName !== key);
|
|
if (data.value.SecurityGroupPermissionDependentViews)
|
|
data.value.SecurityGroupPermissionDependentViews = data.value.SecurityGroupPermissionDependentViews.filter(item => item.PermissionName !== key);
|
|
};
|
|
|
|
const addPermissionDependent = (dependent: string) => {
|
|
|
|
if (!isEdit.value) return;
|
|
|
|
modelOption.value.isModalPermissionDependent = true;
|
|
modelOption.value.selectionTypeDependent = 'checkbox';
|
|
|
|
modelOption.value.initBindOptionsDependent = [];
|
|
let bo: BindOption = new BindOption();
|
|
bo.BindValue = SecurityPermissionDependentEntity.DB_DEPENDENT;
|
|
bo.Value = dependent;
|
|
bo.disabled = true;
|
|
modelOption.value.initBindOptionsDependent.push(bo);
|
|
|
|
// If you don't want click extra trigger collapse, you can prevent this:
|
|
|
|
};
|
|
|
|
const deletePermissionDependent = (key: string) => {
|
|
data.value.SecurityGroupPermissionDependentViews = data.value.SecurityGroupPermissionDependentViews.filter(item => item.DependentDetailName !== key);
|
|
};
|
|
|
|
const addActor = (event: MouseEvent) => {
|
|
|
|
modelOption.value.isModalActor = true;
|
|
modelOption.value.selectionTypeGroup = 'checkbox';
|
|
|
|
// If you don't want click extra trigger collapse, you can prevent this:
|
|
event.stopPropagation();
|
|
};
|
|
|
|
const deleteActor = (key: string) => {
|
|
data.value.SecurityActorGroups = data.value.SecurityActorGroups.filter(item => item.ActorName !== key);
|
|
};
|
|
|
|
const handleSelect = (async () => {
|
|
if (enquiry.value) {
|
|
if (enquiry.value.keys.length > 0) {
|
|
//查询弹出
|
|
if (showModalType.value == 0) {
|
|
groupName.value = enquiry.value.keys[0].GroupName;
|
|
|
|
onSearch();
|
|
}
|
|
modelOption.value.isModalGroup = false;
|
|
|
|
}
|
|
else {
|
|
notification.info({
|
|
message: '系统提示：',
|
|
description: '请选择一条记录',
|
|
placement: "topRight",
|
|
});
|
|
}
|
|
}
|
|
})
|
|
|
|
const handleSelectPermission = (async () => {
|
|
if (permissionEnquiry.value) {
|
|
if (permissionEnquiry.value.keys.length > 0) {
|
|
//查询弹出
|
|
if (!data.value.SecurityGroupPermissionViews) data.value.SecurityGroupPermissionViews = [];
|
|
permissionEnquiry.value.keys.forEach(element => {
|
|
if (data.value.SecurityGroupPermissionViews.filter(item => item.PermissionName == element.PermissionName).length == 0) {
|
|
let ent: SecurityGroupPermissionViewDisplayData = new SecurityGroupPermissionViewDisplayData();
|
|
ent.PermissionName = element.PermissionName;
|
|
ent.PermissionDescription = element.Description;
|
|
ent.Dependent = element.Dependent;
|
|
ent.IsAmend = ent.IsCreate = ent.IsDelete = ent.IsView = false;
|
|
data.value.SecurityGroupPermissionViews.push(ent);
|
|
}
|
|
});
|
|
modelOption.value.isModalPermission = false;
|
|
|
|
}
|
|
else {
|
|
notification.info({
|
|
message: '系统提示：',
|
|
description: '请选择一条记录',
|
|
placement: "topRight",
|
|
});
|
|
}
|
|
}
|
|
})
|
|
|
|
const handleSelectPermissionDependent = (async () => {
|
|
if (permissionDependentEnquiry.value) {
|
|
if (permissionDependentEnquiry.value.keys.length > 0) {
|
|
//查询弹出
|
|
if (!data.value.SecurityGroupPermissionDependentViews) data.value.SecurityGroupPermissionDependentViews = [];
|
|
permissionDependentEnquiry.value.keys.forEach(element => {
|
|
if (data.value.SecurityGroupPermissionDependentViews.filter(item => item.DependentDetailName == element.DependentDetailName).length == 0) {
|
|
let ent: SecurityGroupPermissionDependentViewDisplayData = new SecurityGroupPermissionDependentViewDisplayData();
|
|
ent.DependentDetailName = element.DependentDetailName;
|
|
ent.DependentDetailDescription = element.DependentDetailDescription;
|
|
ent.PermissionName = element.PermissionName;
|
|
ent.Dependent = element.Dependent;
|
|
ent.IsAmend = ent.IsCreate = ent.IsDelete = ent.IsView = false;
|
|
data.value.SecurityGroupPermissionDependentViews.push(ent);
|
|
}
|
|
});
|
|
modelOption.value.isModalPermissionDependent = false;
|
|
}
|
|
else {
|
|
notification.info({
|
|
message: '系统提示：',
|
|
description: '请选择一条记录',
|
|
placement: "topRight",
|
|
});
|
|
}
|
|
}
|
|
})
|
|
|
|
const handleSelectActor = (async () => {
|
|
if (actorEnquiry.value) {
|
|
if (actorEnquiry.value.keys.length > 0) {
|
|
//查询弹出
|
|
if (!data.value.SecurityActorGroups) data.value.SecurityActorGroups = [];
|
|
actorEnquiry.value.keys.forEach(element => {
|
|
if (data.value.SecurityActorGroups.filter(item => item.ActorName == element.ActorName).length == 0) {
|
|
let ent: SecurityActorGroupViewEntity = new SecurityActorGroupViewEntity();
|
|
ent.ActorName = element.ActorName;
|
|
ent.ActorLocalName = element.ActorLocalName;
|
|
data.value.SecurityActorGroups.push(ent);
|
|
}
|
|
});
|
|
modelOption.value.isModalActor = false;
|
|
|
|
}
|
|
else {
|
|
notification.info({
|
|
message: '系统提示：',
|
|
description: '请选择一条记录',
|
|
placement: "topRight",
|
|
});
|
|
}
|
|
}
|
|
})
|
|
|
|
const onViewActorOperation = ((actorName: string) => {
|
|
router.push({ name: "ActorOperation", params: { id: actorName, mode: 'view' } });
|
|
})
|
|
|
|
const onViewPermissionOperation = ((permissionName: string) => {
|
|
router.push({ name: "PermissionOperation", params: { id: permissionName, mode: 'view' } });
|
|
})
|
|
|
|
|
|
</script>
|
|
<style lang="less">
|
|
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
|
@import "../../styles/ft-mobile.less";
|
|
|
|
.page-container {
|
|
margin-right: 0px;
|
|
|
|
}
|
|
|
|
.page-header {
|
|
padding-top: 4px;
|
|
padding-bottom: 8px;
|
|
padding-right: 12px;
|
|
border-bottom: 1px solid silver;
|
|
margin-left: 6px;
|
|
}
|
|
|
|
.page-header .ant-input-search .ant-input {
|
|
border-radius: 0;
|
|
border-left: 0;
|
|
text-align: left
|
|
}
|
|
|
|
.page-main {
|
|
overflow-y: auto;
|
|
padding-top: 24px;
|
|
padding-bottom: 4px;
|
|
padding-right: 32px;
|
|
padding-left: 12px;
|
|
}
|
|
|
|
.page-footer {
|
|
z-index: 999;
|
|
padding-left: 8px;
|
|
padding-right: 18px;
|
|
padding-top: 8px;
|
|
width: 100%;
|
|
position: fixed;
|
|
bottom: 8px;
|
|
border-top: 1px solid silver;
|
|
}
|
|
</style> |