服务指令同步
This commit is contained in:
parent
b93ea0f6a2
commit
51f72af404
|
|
@ -1,6 +1,7 @@
|
|||
<template>
|
||||
<div class="p-2">
|
||||
<a-row :style="props.layout === 'half' ? { height: '68vh', overflow: 'auto' } : {}">
|
||||
<!-- <a-row :style="props.layout === 'half' ? { height: '68vh', overflow: 'auto' } : {}"> -->
|
||||
<a-row>
|
||||
<a-col v-for="item in orgTableList.records" :key="item.id" :xs="24" :sm="24" :md="props.layout == 'full' ? 12 : 8"
|
||||
:lg="props.layout == 'full' ? 12 : 8" :xl="props.layout == 'full' ? 8 : 8" :xxl="props.layout == 'full' ? 6 : 8"
|
||||
style="padding: 8px;">
|
||||
|
|
@ -29,7 +30,7 @@
|
|||
<p class="ellipsis-one-lines" :title="item.comRegisterAddress">机构地址：{{ item.comRegisterAddress }}</p>
|
||||
<a-divider />
|
||||
<p style="text-align:center;">
|
||||
<span style="display:inline-block;cursor: pointer;" @click.stop="handleDetail(item)">
|
||||
<span v-show="showDetail" style="display:inline-block;cursor: pointer;" @click.stop="handleDetail(item)">
|
||||
<span class="tbClass"><img src="/@/assets/images/a14.png" style="width:20px;" /></span><br />
|
||||
<span class="antTitle">详情</span>
|
||||
</span>
|
||||
|
|
@ -51,7 +52,7 @@
|
|||
|
||||
<div
|
||||
style="float:right;bottom: 20px;z-index: 999;padding: 8px 16px;border-radius: 4px;display: flex;align-items: center;"
|
||||
v-show="props.layout == 'full'">
|
||||
v-show="props.layout == 'full' && pageSize != -1">
|
||||
<span style="margin-right: 10px;">共 {{ orgTableList.total }} 条数据</span>
|
||||
<Pagination showLessItems v-model:current="pageParams.pageNo" :pageSize="pageParams.pageSize" size="small"
|
||||
show-quick-jumper :total="orgTableList.total" @change="reload" />
|
||||
|
|
@ -66,6 +67,8 @@ import { getOrgInfo } from '/@/views/admin/orgapplyinfo/OrgApplyInfo.api'
|
|||
|
||||
const props = defineProps({
|
||||
showChoose: { type: Boolean, default: false },
|
||||
pageSize: { type: Number, default: 8 },
|
||||
showDetail: { type: Boolean, default: false },
|
||||
title: { type: String, default: '' },
|
||||
allowMultipleSelection: { type: Boolean, default: false }, // 多选控制
|
||||
layout: { type: String, default: 'full' }, // 控制布局: 'full' 或 'half'
|
||||
|
|
@ -76,7 +79,7 @@ const emit = defineEmits(['handleOrgDetail', 'handleOrgChoose'])
|
|||
|
||||
const orgTableList = ref<any>({ records: [], total: 0 })
|
||||
const queryParam = reactive<any>({})
|
||||
const pageParams = ref({ pageNo: 1, pageSize: 8 })
|
||||
const pageParams = ref({ pageNo: 1, pageSize: props.pageSize })
|
||||
|
||||
// 当前选中的卡片 ID 数组
|
||||
const selectedOrgs = ref<string[]>([])
|
||||
|
|
@ -95,10 +98,12 @@ function handleCardClick(item: any) {
|
|||
// 单选模式：直接选中该卡片
|
||||
selectedOrgs.value = [item] // 只保留当前选中的机构
|
||||
}
|
||||
emit('handleOrgChoose', selectedOrgs.value) // 传递完整的选中机构信息
|
||||
// emit('handleOrgChoose', selectedOrgs.value) // 传递完整的选中机构信息
|
||||
}
|
||||
}
|
||||
|
||||
function commitOrgsInfo() {
|
||||
emit('handleOrgChoose', selectedOrgs.value) // 传递完整的选中机构信息
|
||||
}
|
||||
/** 点击详情 */
|
||||
function handleDetail(item: any) {
|
||||
emit('handleOrgDetail', item)
|
||||
|
|
@ -148,6 +153,9 @@ function checkAllOrEmpty(isCheckAll = true) {
|
|||
emit('handleOrgChoose', selectedOrgs.value);
|
||||
}
|
||||
|
||||
function resetSeleted(orgs) {
|
||||
selectedOrgs.value = [...orgs]
|
||||
}
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
|
|
@ -159,6 +167,8 @@ defineExpose({
|
|||
searchReset,
|
||||
selectedOrgs,
|
||||
checkAllOrEmpty,
|
||||
commitOrgsInfo,
|
||||
resetSeleted
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { defHttp } from '/@/utils/http/axios';
|
||||
import { useMessage } from "/@/hooks/web/useMessage";
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
|
||||
const { createConfirm } = useMessage();
|
||||
|
||||
|
|
@ -25,9 +25,9 @@ export const listByDS = (params) => defHttp.get({ url: Api.listByDS, params });
|
|||
|
||||
/**
|
||||
* 同步
|
||||
* @param params
|
||||
* @returns
|
||||
* @param params
|
||||
* @returns
|
||||
*/
|
||||
export const syncDirective = (params) => {
|
||||
return defHttp.get({ url: Api.syncDirective, params });
|
||||
};
|
||||
export const syncDirective = (dataSourceCode: string, params: any) => {
|
||||
return defHttp.post({ url: `${Api.syncDirective}?dataSourceCode=${encodeURIComponent(dataSourceCode)}`, params });
|
||||
};
|
||||
|
|
|
|||
|
|
@ -106,6 +106,13 @@ export const columns: BasicColumn[] = [
|
|||
];
|
||||
|
||||
export const sourceColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '状态',
|
||||
align: 'center',
|
||||
dataIndex: 'izExist',
|
||||
width: 70,
|
||||
fixed: 'left',
|
||||
},
|
||||
{
|
||||
title: '分类标签',
|
||||
align: 'center',
|
||||
|
|
@ -146,28 +153,28 @@ export const sourceColumns: BasicColumn[] = [
|
|||
align: 'center',
|
||||
dataIndex: 'bodyTagList',
|
||||
ellipsis: false,
|
||||
defaultHidden: true,
|
||||
// format(text, record, index) {
|
||||
// if (!!text) {
|
||||
// return text.map((item) => item.tagName).join('、');
|
||||
// } else {
|
||||
// return '-';
|
||||
// }
|
||||
// },
|
||||
// defaultHidden: true,
|
||||
format(text, record, index) {
|
||||
if (!!text) {
|
||||
return text.map((item) => item.tagName).join('、');
|
||||
} else {
|
||||
return '-';
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '情绪标签',
|
||||
align: 'center',
|
||||
dataIndex: 'emotionTagList',
|
||||
ellipsis: false,
|
||||
defaultHidden: true,
|
||||
// format(text, record, index) {
|
||||
// if (!!text) {
|
||||
// return text.map((item) => item.tagName).join('、');
|
||||
// } else {
|
||||
// return '-';
|
||||
// }
|
||||
// },
|
||||
// defaultHidden: true,
|
||||
format(text, record, index) {
|
||||
if (!!text) {
|
||||
return text.map((item) => item.tagName).join('、');
|
||||
} else {
|
||||
return '-';
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '收费价格',
|
||||
|
|
@ -205,6 +212,213 @@ export const sourceColumns: BasicColumn[] = [
|
|||
},
|
||||
];
|
||||
|
||||
export const targetSourceColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '分类标签',
|
||||
align: 'center',
|
||||
dataIndex: 'instructionTagId_dictText',
|
||||
customCell: (record, index, column) => {
|
||||
if (record.instructionRowSpan != null) {
|
||||
return { rowSpan: record.instructionRowSpan };
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '服务类别',
|
||||
align: 'center',
|
||||
dataIndex: 'categoryId_dictText',
|
||||
customCell: (record, index, column) => {
|
||||
if (record.categoryRowSpan != null) {
|
||||
return { rowSpan: record.categoryRowSpan };
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '服务类型',
|
||||
align: 'center',
|
||||
dataIndex: 'typeId_dictText',
|
||||
customCell: (record, index, column) => {
|
||||
if (record.typeRowSpan != null) {
|
||||
return { rowSpan: record.typeRowSpan };
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '服务指令',
|
||||
align: 'center',
|
||||
dataIndex: 'directiveName',
|
||||
},
|
||||
{
|
||||
title: '体型标签',
|
||||
align: 'center',
|
||||
dataIndex: 'bodyTagList',
|
||||
ellipsis: false,
|
||||
// defaultHidden: true,
|
||||
format(text, record, index) {
|
||||
if (!!text) {
|
||||
return text.map((item) => item.tagName).join('、');
|
||||
} else {
|
||||
return '-';
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '情绪标签',
|
||||
align: 'center',
|
||||
dataIndex: 'emotionTagList',
|
||||
ellipsis: false,
|
||||
// defaultHidden: true,
|
||||
format(text, record, index) {
|
||||
if (!!text) {
|
||||
return text.map((item) => item.tagName).join('、');
|
||||
} else {
|
||||
return '-';
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '收费价格',
|
||||
align: 'center',
|
||||
dataIndex: 'tollPrice',
|
||||
defaultHidden: true,
|
||||
},
|
||||
{
|
||||
title: '提成价格',
|
||||
align: 'center',
|
||||
dataIndex: 'comPrice',
|
||||
defaultHidden: true,
|
||||
},
|
||||
{
|
||||
title: '医保报销',
|
||||
align: 'center',
|
||||
dataIndex: 'izReimbursement_dictText',
|
||||
defaultHidden: true,
|
||||
},
|
||||
{
|
||||
title: '机构优惠',
|
||||
align: 'center',
|
||||
dataIndex: 'izPreferential_dictText',
|
||||
defaultHidden: true,
|
||||
},
|
||||
{
|
||||
title: '周期类型',
|
||||
align: 'center',
|
||||
dataIndex: 'cycleType_dictText',
|
||||
},
|
||||
{
|
||||
title: '服务时长（分钟）',
|
||||
align: 'center',
|
||||
dataIndex: 'serviceDuration',
|
||||
},
|
||||
];
|
||||
|
||||
export const targetColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '分类标签',
|
||||
align: 'center',
|
||||
dataIndex: 'instructionTagId_dictText',
|
||||
customCell: (record, index, column) => {
|
||||
if (record.instructionRowSpan != null) {
|
||||
return { rowSpan: record.instructionRowSpan };
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '服务类别',
|
||||
align: 'center',
|
||||
dataIndex: 'categoryId_dictText',
|
||||
customCell: (record, index, column) => {
|
||||
if (record.categoryRowSpan != null) {
|
||||
return { rowSpan: record.categoryRowSpan };
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '服务类型',
|
||||
align: 'center',
|
||||
dataIndex: 'typeId_dictText',
|
||||
customCell: (record, index, column) => {
|
||||
if (record.typeRowSpan != null) {
|
||||
return { rowSpan: record.typeRowSpan };
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '服务指令',
|
||||
align: 'center',
|
||||
dataIndex: 'directiveName',
|
||||
},
|
||||
{
|
||||
title: '体型标签',
|
||||
align: 'center',
|
||||
dataIndex: 'bodyTagList',
|
||||
ellipsis: false,
|
||||
// defaultHidden: true,
|
||||
format(text, record, index) {
|
||||
if (!!text) {
|
||||
return text.map((item) => item.tagName).join('、');
|
||||
} else {
|
||||
return '-';
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '情绪标签',
|
||||
align: 'center',
|
||||
dataIndex: 'emotionTagList',
|
||||
ellipsis: false,
|
||||
// defaultHidden: true,
|
||||
format(text, record, index) {
|
||||
if (!!text) {
|
||||
return text.map((item) => item.tagName).join('、');
|
||||
} else {
|
||||
return '-';
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '收费价格',
|
||||
align: 'center',
|
||||
dataIndex: 'tollPrice',
|
||||
defaultHidden: true,
|
||||
},
|
||||
{
|
||||
title: '提成价格',
|
||||
align: 'center',
|
||||
dataIndex: 'comPrice',
|
||||
defaultHidden: true,
|
||||
},
|
||||
{
|
||||
title: '医保报销',
|
||||
align: 'center',
|
||||
dataIndex: 'izReimbursement_dictText',
|
||||
defaultHidden: true,
|
||||
},
|
||||
{
|
||||
title: '机构优惠',
|
||||
align: 'center',
|
||||
dataIndex: 'izPreferential_dictText',
|
||||
defaultHidden: true,
|
||||
},
|
||||
{
|
||||
title: '周期类型',
|
||||
align: 'center',
|
||||
dataIndex: 'cycleType_dictText',
|
||||
},
|
||||
{
|
||||
title: '服务时长（分钟）',
|
||||
align: 'center',
|
||||
dataIndex: 'serviceDuration',
|
||||
},
|
||||
{
|
||||
title: '同步类型',
|
||||
align: 'center',
|
||||
dataIndex: 'izExist',
|
||||
width: 80,
|
||||
fixed: 'right',
|
||||
},
|
||||
];
|
||||
|
||||
// 高级查询数据
|
||||
export const superQuerySchema = {
|
||||
categoryId: { title: '服务类别', order: 0, view: 'list', type: 'string', dictCode: '' },
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol"
|
||||
:wrapper-col="wrapperCol">
|
||||
<a-row :gutter="24">
|
||||
<a-col :lg="6">
|
||||
<a-col :lg="5">
|
||||
<a-form-item name="instructionTagId">
|
||||
<template #label><span title="分类标签">分类标签</span></template>
|
||||
<j-dict-select-tag v-model:value="queryParam.instructionTagId" v-if="showJSCom"
|
||||
|
|
@ -15,7 +15,7 @@
|
|||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :lg="6">
|
||||
<a-col :lg="5">
|
||||
<a-form-item name="categoryId">
|
||||
<template #label><span title="服务类别">服务类别</span></template>
|
||||
<j-dict-select-tag type="list" v-model:value="queryParam.categoryId" v-if="showJSCom"
|
||||
|
|
@ -25,7 +25,7 @@
|
|||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :lg="6">
|
||||
<a-col :lg="5">
|
||||
<a-form-item name="typeId">
|
||||
<template #label><span title="服务类型">服务类型</span></template>
|
||||
<j-dict-select-tag type="list" v-model:value="queryParam.typeId" v-if="showJSCom"
|
||||
|
|
@ -34,7 +34,7 @@
|
|||
placeholder="请选择服务类型" allowClear :ignoreDisabled="true" @select="reload()" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6">
|
||||
<a-col :lg="5">
|
||||
<a-form-item name="directiveName">
|
||||
<template #label><span title="服务指令">服务指令</span></template>
|
||||
<JInput v-model:value="queryParam.directiveName" placeholder="请输入服务指令名称" allowClear />
|
||||
|
|
@ -63,7 +63,7 @@
|
|||
:ignoreDisabled="true" placeholder="请选择是否启用" allowClear @select="reload()" />
|
||||
</a-form-item>
|
||||
</a-col> -->
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<a-col :xl="4" :lg="4" :md="4" :sm="4">
|
||||
<span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
|
||||
<a-col :lg="6">
|
||||
<!-- <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button> -->
|
||||
|
|
@ -75,67 +75,130 @@
|
|||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<a-row :gutter="24" style="margin-top: -10px;padding-left: 20px;padding-right: 20px;">
|
||||
<a-col :lg="3" :push="21">
|
||||
<a-button type="primary" @click="selectAll">一键全选</a-button>
|
||||
<a-button type="default" @click="removeAll" style="margin-left: 8px">全部移除</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24" style="padding-left: 20px;padding-right: 20px;">
|
||||
<a-col :lg="12" :sm="24">
|
||||
<!-- 引用表格 -->
|
||||
<a-tag color="blue" style="margin-left: 10px;margin-top: 10px;">源数据 - {{ sourceOrgInfo.departName }}</a-tag>
|
||||
<a-tag color="blue" style="margin-left: 10px;margin-top: 10px;">源平台 - {{ sourceOrgInfo.departName }}</a-tag>
|
||||
<a-divider type="vertical" style="background-color: #CDCDCF" />
|
||||
<a-radio-group v-model:value="sourceType" size="small" @change="sourceTypeChanged">
|
||||
<a-radio-button value="all">全部</a-radio-button>
|
||||
<a-radio-button value="unsel">未选择</a-radio-button>
|
||||
<a-radio-button value="unsel">可同步</a-radio-button>
|
||||
</a-radio-group>
|
||||
<a-divider type="vertical" style="background-color: #CDCDCF" />
|
||||
<a-button type="primary" @click="selectAll" size="small">一键全选</a-button>
|
||||
<BasicTable @register="registerTable" :dataSource="leftList" size="small" :rowClassName="rowClassName"
|
||||
:scroll="{ y: '46vh' }">
|
||||
:columns="targetChooseType == 'one' ? sourceColumns : targetSourceColumns" :scroll="{ y: '57vh' }">
|
||||
<template #tableTitle></template>
|
||||
<template v-slot:bodyCell="{ column, record, index, text }">
|
||||
<template v-if="column.dataIndex === 'bodyTagList'">
|
||||
<!-- <template v-if="column.dataIndex === 'bodyTagList'">
|
||||
<span :title="text.map((item) => item.tagName).join('、')">{{text.map((item) =>
|
||||
item.tagName).join('、')}}</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'emotionTagList'">
|
||||
<template v-if="column.dataIndex === 'emotionTagList'">
|
||||
<span :title="text.map((item) => item.tagName).join('、')">{{text.map((item) =>
|
||||
item.tagName).join('、')}}</span>
|
||||
</template> -->
|
||||
<template v-if="column.dataIndex === 'izExist'">
|
||||
<a-tag v-if="rightSourceList.some(item => item.id === record.id)" color="orange">已存在</a-tag>
|
||||
<a-tag v-else>可新增</a-tag>
|
||||
<!-- <span v-if="rightSourceList.some(item => item.id === record.id)" style="color: #EFBD48;">已存在</span>
|
||||
<span v-else>可新增</span> -->
|
||||
</template>
|
||||
</template>
|
||||
<template #action="{ record }">
|
||||
<a-button type="link" v-if="!selectedRecordIds.includes(record.id)" @click="selectRecord(record)"
|
||||
size="small">选择</a-button>
|
||||
<!-- :disabled="rightSourceList.some(item => item.id === record.id)" -->
|
||||
<a-button type="link" v-else @click="removeRecord(record)" size="small">移除</a-button>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</a-col>
|
||||
<a-col :lg="12" :sm="24">
|
||||
<a-tag color="green" style="margin-left: 10px;margin-top: 10px;">已选择 {{ rightList.length }} 条</a-tag>
|
||||
<BasicTable :dataSource="rightList" :columns="sourceColumns" size="small" :scroll="{ y: '46vh' }"
|
||||
:pagination="{ current: 1, pageSize: 50, total: rightList.length, showSizeChanger: true, pageSizeOptions: ['10', '20', '50', '100'] }">
|
||||
<a-tag v-if="targetChooseType == 'one'" color="green" style="margin-left: 10px;margin-top: 10px;">
|
||||
目标平台 - {{ targetOrgs[0]?.departName }} - 已选择 {{ rightNeedAddList.length }} 条
|
||||
</a-tag>
|
||||
<a-tag v-else color="green" style="margin-left: 10px;margin-top: 10px;">
|
||||
已选择 {{ rightNeedAddList.length }} 条
|
||||
</a-tag>
|
||||
<a-divider v-if="targetChooseType == 'one'" type="vertical" style="background-color: #CDCDCF" />
|
||||
<a-radio-group v-if="targetChooseType == 'one'" v-model:value="targetType" size="small"
|
||||
@change="targetTypeChanged">
|
||||
<a-radio-button value="exist">已有</a-radio-button>
|
||||
<a-radio-button value="needsync">待同步</a-radio-button>
|
||||
</a-radio-group>
|
||||
<a-divider type="vertical" style="background-color: #CDCDCF" />
|
||||
<a-button type="primary" @click="removeAll" size="small">全部移除</a-button>
|
||||
<a-divider type="vertical" style="background-color: #CDCDCF" />
|
||||
<a-button type="warning" @click="syncFunc" size="small">同步</a-button>
|
||||
<BasicTable
|
||||
:dataSource="targetChooseType == 'one' ? (targetType == 'needsync' ? rightNeedAddList : rightSourceList) : rightNeedAddList"
|
||||
:columns="targetChooseType == 'one' ? (targetType == 'needsync' ? targetColumns : targetSourceColumns) : targetSourceColumns"
|
||||
size="small" :scroll="{ y: '57vh' }"
|
||||
:pagination="{ current: 1, pageSize: 50, total: rightNeedAddList.length, showSizeChanger: true, pageSizeOptions: ['10', '20', '50', '100'] }">
|
||||
<template v-slot:bodyCell="{ column, record, index, text }">
|
||||
<template v-if="column.dataIndex === 'izExist'">
|
||||
<a-tag v-if="rightSourceList.some(item => item.id === record.id)" color="orange">更新</a-tag>
|
||||
<a-tag v-else color="green">新增</a-tag>
|
||||
<!-- <span v-if="rightSourceList.some(item => item.id === record.id)" style="color: #EFBD48;">待更新</span>
|
||||
<span v-else>待新增</span> -->
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
</div>
|
||||
<a-modal v-model:visible="visible" width="30vw" title="数据同步确认" :ok-text="'确认'" :cancel-text="'取消'" @ok="handleOk"
|
||||
@cancel="handleCancel">
|
||||
<!-- 指定机构同步 -->
|
||||
<div style="padding: 20px;" v-if="targetChooseType == 'one'">
|
||||
<p>目标机构 ：{{ targetOrg?.departName }}</p>
|
||||
<p>新增服务指令： {{ getNewCount() }} 条</p>
|
||||
<p>更新服务指令： {{ getUpdateCount() }} 条</p>
|
||||
<span>请选择"新增指令"需要同步的内容：</span>
|
||||
<a-radio-group v-model:value="syncOption">
|
||||
<a-radio value="all">全部</a-radio>
|
||||
<a-radio value="business">业务字段</a-radio>
|
||||
<a-radio value="media">指令资源</a-radio>
|
||||
</a-radio-group>
|
||||
</div>
|
||||
<!-- 批量同步 -->
|
||||
<div style="padding: 20px;" v-else>
|
||||
<p>同步服务指令： {{ rightNeedAddList.length }} 条</p>
|
||||
<span>请选择"服务指令"需要同步的内容：</span>
|
||||
<a-radio-group v-model:value="syncOption">
|
||||
<a-radio value="all">全部</a-radio>
|
||||
<a-radio value="business">业务字段</a-radio>
|
||||
<a-radio value="media">指令资源</a-radio>
|
||||
</a-radio-group>
|
||||
</div>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" name="serviceDirective-configServiceDirective" setup>
|
||||
import { ref, reactive, onMounted, watch } from 'vue';
|
||||
import { BasicTable, TableAction } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { columns, sourceColumns, superQuerySchema } from './ConfigServiceDirective.data';
|
||||
import { columns, sourceColumns, superQuerySchema, targetSourceColumns, targetColumns } from './ConfigServiceDirective.data';
|
||||
import { listByDS } from './ConfigServiceDirective.api';
|
||||
import { useUserStore } from '/@/store/modules/user';
|
||||
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
|
||||
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||
import { cloneDeep } from "lodash-es";
|
||||
import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { syncDirective } from '/@/views/synchronization/directive/serviceDirective/ConfigServiceDirective.api';
|
||||
|
||||
const { createConfirm } = useMessage();
|
||||
const props = defineProps({
|
||||
targetOrgs: [],//已选择目标机构
|
||||
targetChooseType: '',
|
||||
})
|
||||
const leftList = ref<any[]>([]); // 左侧列表的数据
|
||||
const rightList = ref<any[]>([]); // 右侧列表的数据
|
||||
const rightSourceList = ref<any[]>([]); // 右侧列表已同步的数据
|
||||
const rightNeedAddList = ref<any[]>([]); // 右侧列表待同步的数据
|
||||
const sourceOrgInfo = ref({})//源数据机构信息
|
||||
const sourceType = ref('all')
|
||||
const sourceType = ref('all')//源平台列表单选
|
||||
const targetType = ref('needsync')//目标平台列表单选
|
||||
const showJSCom = ref(false)
|
||||
const selectedRecordIds = ref<string[]>([]); // 存储已选择记录的 ID
|
||||
const formRef = ref();
|
||||
|
|
@ -143,12 +206,15 @@ const queryParam = reactive<any>({});
|
|||
const toggleSearchStatus = ref<boolean>(false);
|
||||
const registerModal = ref();
|
||||
const userStore = useUserStore();
|
||||
const targetOrg = ref()//目标机构 仅“指定”时可用
|
||||
const { createMessage } = useMessage();
|
||||
const visible = ref(false);
|
||||
const syncOption = ref('all');
|
||||
//注册table数据
|
||||
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
||||
tableProps: {
|
||||
title: '服务指令',
|
||||
api: listByDS,
|
||||
columns: sourceColumns,
|
||||
canResize: false,
|
||||
useSearchForm: false,
|
||||
showIndexColumn: true,
|
||||
|
|
@ -164,7 +230,7 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
|||
return Object.assign(params, queryParam);
|
||||
},
|
||||
actionColumn: {
|
||||
width: 80,
|
||||
width: 60,
|
||||
fixed: 'right',
|
||||
},
|
||||
},
|
||||
|
|
@ -202,35 +268,72 @@ function init(record) {
|
|||
sourceOrgInfo.value = record.orgInfo
|
||||
//初始化各参数
|
||||
{
|
||||
rightList.value = []
|
||||
rightNeedAddList.value = []
|
||||
leftList.value = []
|
||||
selectedRecordIds.value = []
|
||||
formRef.value.resetFields();
|
||||
selectedRowKeys.value = [];
|
||||
sourceType.value = 'all'
|
||||
targetType.value = 'needsync'
|
||||
}
|
||||
queryParam.dataSourceCode = record.orgInfo.orgCode;
|
||||
reload();
|
||||
}
|
||||
|
||||
function resetTargetData() {
|
||||
//初始化各参数
|
||||
{
|
||||
rightNeedAddList.value = []
|
||||
selectedRecordIds.value = []
|
||||
formRef.value.resetFields();
|
||||
selectedRowKeys.value = [];
|
||||
sourceType.value = 'all'
|
||||
targetType.value = 'needsync'
|
||||
}
|
||||
}
|
||||
|
||||
function initTargetList(record) {
|
||||
targetOrg.value = {}
|
||||
//传值了说明是指定平台同步 - 重置数据+查询更新数据
|
||||
if (!!record.orgCode) {
|
||||
targetOrg.value = record
|
||||
resetTargetData()
|
||||
listByDS({
|
||||
dataSourceCode: record.orgCode,
|
||||
pageNo: 1,
|
||||
pageSize: -1,
|
||||
}).then(res => {
|
||||
rightNeedAddList.value = []
|
||||
selectedRecordIds.value = []
|
||||
rightSourceList.value = res.records
|
||||
// selectedRecordIds.value = rightSourceList.value?.map(d => d.id)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 选择记录
|
||||
function selectRecord(record: any) {
|
||||
if (!selectedRecordIds.value.includes(record.id)) {
|
||||
selectedRecordIds.value.push(record.id); // 记录 ID
|
||||
rightList.value.push(record); // 将记录添加到右侧
|
||||
rightNeedAddList.value.push(record); // 将记录添加到右侧
|
||||
leftList.value = leftList.value.filter(item => item.id !== record.id); // 从左侧移除
|
||||
rightList.value = [...rightList.value]; // 强制更新引用，确保视图更新
|
||||
rightNeedAddList.value = [...rightNeedAddList.value]; // 强制更新引用，确保视图更新
|
||||
leftList.value = [...leftList.value]; // 强制更新引用，确保视图更新
|
||||
}
|
||||
}
|
||||
|
||||
// 移除记录
|
||||
function removeRecord(record: any) {
|
||||
// 如果记录在rightSourceList中，不允许移除
|
||||
// if (rightSourceList.value.some(item => item.id === record.id)) {
|
||||
// return;
|
||||
// }
|
||||
if (selectedRecordIds.value.includes(record.id)) {
|
||||
selectedRecordIds.value = selectedRecordIds.value.filter(id => id !== record.id); // 移除记录 ID
|
||||
leftList.value.push(record); // 添加回左侧
|
||||
rightList.value = rightList.value.filter(item => item.id !== record.id); // 从右侧移除
|
||||
rightList.value = [...rightList.value]; // 强制更新引用，确保视图更新
|
||||
rightNeedAddList.value = rightNeedAddList.value.filter(item => item.id !== record.id); // 从右侧移除
|
||||
rightNeedAddList.value = [...rightNeedAddList.value]; // 强制更新引用，确保视图更新
|
||||
leftList.value = [...leftList.value]; // 强制更新引用，确保视图更新
|
||||
}
|
||||
}
|
||||
|
|
@ -250,15 +353,18 @@ function selectAll() {
|
|||
pageSize: -1,
|
||||
}).then(res => {
|
||||
const allRecords = res.records || [];
|
||||
// 只添加没有选择的记录到右侧
|
||||
const unselectedRecords = allRecords.filter(record => !selectedRecordIds.value.includes(record.id));
|
||||
// 只添加没有选择的记录到右侧，并且不在rightSourceList中
|
||||
const unselectedRecords = allRecords.filter(record =>
|
||||
!selectedRecordIds.value.includes(record.id)
|
||||
// && !rightSourceList.value.some(item => item.id === record.id)
|
||||
);
|
||||
if (unselectedRecords.length) {
|
||||
// 把新记录推到右侧列表
|
||||
rightList.value.push(...unselectedRecords);
|
||||
rightNeedAddList.value.push(...unselectedRecords);
|
||||
// 把新记录的 id 推入已选 id 列表
|
||||
selectedRecordIds.value.push(...unselectedRecords.map(r => r.id));
|
||||
// 刷新引用，确保视图更新
|
||||
rightList.value = [...rightList.value];
|
||||
rightNeedAddList.value = [...rightNeedAddList.value];
|
||||
selectedRecordIds.value = [...selectedRecordIds.value];
|
||||
}
|
||||
})
|
||||
|
|
@ -268,10 +374,12 @@ function selectAll() {
|
|||
* 全部移除，将右侧数据移回左侧
|
||||
*/
|
||||
function removeAll() {
|
||||
rightList.value = []; // 清空右侧列表
|
||||
rightNeedAddList.value = []; // 清空右侧列表
|
||||
// selectedRecordIds.value = rightSourceList.value?.map(d => d.id)
|
||||
selectedRecordIds.value = []
|
||||
}
|
||||
|
||||
//源平台查看全部all/可同步unsel
|
||||
function sourceTypeChanged(val_) {
|
||||
if (val_.target.value == 'all') {
|
||||
//全部
|
||||
|
|
@ -283,6 +391,12 @@ function sourceTypeChanged(val_) {
|
|||
reload()
|
||||
}
|
||||
|
||||
//目标平台查看已有exist/待同步needsync
|
||||
function targetTypeChanged(val_) {
|
||||
|
||||
}
|
||||
|
||||
|
||||
watch(
|
||||
() => queryParam.directiveName,
|
||||
(newVal) => {
|
||||
|
|
@ -297,10 +411,88 @@ function controlShowJSCom() {
|
|||
}, 1000)
|
||||
}
|
||||
|
||||
function cleanTargetSourceData() {
|
||||
if (rightSourceList.value?.length) {
|
||||
rightSourceList.value = []
|
||||
selectedRecordIds.value = []
|
||||
}
|
||||
}
|
||||
|
||||
//开始同步
|
||||
function syncFunc() {
|
||||
if (props.targetChooseType == 'one') {
|
||||
if (!targetOrg.value || !targetOrg.value.orgCode) {
|
||||
createMessage.warning('请选择业务平台')
|
||||
return
|
||||
}
|
||||
} else {
|
||||
if (!props.targetOrgs.length) {
|
||||
createMessage.warning('请选择业务平台')
|
||||
return
|
||||
}
|
||||
}
|
||||
if (!rightNeedAddList.value?.length) {
|
||||
createMessage.warning('请选择需要同步的指令')
|
||||
return
|
||||
} else {
|
||||
visible.value = true
|
||||
}
|
||||
}
|
||||
//开始同步
|
||||
function handleOk() {
|
||||
let params = {}
|
||||
if (props.targetChooseType == 'one') {
|
||||
params = {
|
||||
syncIds: rightNeedAddList.value
|
||||
.filter(item => !rightSourceList.value.some(sourceItem => sourceItem.id === item.id))
|
||||
.map(item => item.id)
|
||||
.join(','),
|
||||
upIds: rightNeedAddList.value
|
||||
.filter(item => rightSourceList.value.some(sourceItem => sourceItem.id === item.id))
|
||||
.map(item => item.id)
|
||||
.join(','),
|
||||
syncOrgCodes: targetOrg.value.orgCode,
|
||||
syncOption:syncOption.value,
|
||||
}
|
||||
} else {
|
||||
params = {
|
||||
syncIds: rightNeedAddList.value.map(item => item.id).join(','),
|
||||
upIds: '',
|
||||
syncOrgCodes: props.targetOrgs.map(item => item.orgCode).join(','),
|
||||
syncOption:syncOption.value,
|
||||
}
|
||||
}
|
||||
|
||||
syncDirective(sourceOrgInfo.value.orgCode,params)
|
||||
createMessage.success('已开始自动同步!')
|
||||
visible.value = false
|
||||
}
|
||||
//取消同步
|
||||
function handleCancel() {
|
||||
visible.value = false
|
||||
}
|
||||
|
||||
// 计算新增数量
|
||||
function getNewCount() {
|
||||
if (!rightNeedAddList.value || !rightSourceList.value) return 0;
|
||||
return rightNeedAddList.value.filter(item =>
|
||||
!rightSourceList.value.some(sourceItem => sourceItem.id === item.id)
|
||||
).length;
|
||||
}
|
||||
|
||||
// 计算更新数量
|
||||
function getUpdateCount() {
|
||||
if (!rightNeedAddList.value || !rightSourceList.value) return 0;
|
||||
return rightNeedAddList.value.filter(item =>
|
||||
rightSourceList.value.some(sourceItem => sourceItem.id === item.id)
|
||||
).length;
|
||||
}
|
||||
defineExpose({
|
||||
init,
|
||||
rightList,
|
||||
rightNeedAddList,
|
||||
controlShowJSCom,
|
||||
initTargetList,
|
||||
cleanTargetSourceData,
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,373 @@
|
|||
<template>
|
||||
<div class="p-2" style="overflow-x: hidden;">
|
||||
<!--查询区域-->
|
||||
<div class="jeecg-basic-table-form-container">
|
||||
<a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol"
|
||||
:wrapper-col="wrapperCol">
|
||||
<a-row :gutter="24">
|
||||
<a-col :lg="6">
|
||||
<a-form-item name="instructionTagId">
|
||||
<template #label><span title="分类标签">分类标签</span></template>
|
||||
<j-dict-select-tag v-model:value="queryParam.instructionTagId" v-if="showJSCom"
|
||||
:orgCode="sourceOrgInfo?.orgCode"
|
||||
:dictCode="`nu_config_service_instruction_tag,instruction_name,id,del_flag = 0 order by sort asc`"
|
||||
placeholder="请选择分类标签" allowClear :ignoreDisabled="true" @select="reload()" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :lg="6">
|
||||
<a-form-item name="categoryId">
|
||||
<template #label><span title="服务类别">服务类别</span></template>
|
||||
<j-dict-select-tag type="list" v-model:value="queryParam.categoryId" v-if="showJSCom"
|
||||
:orgCode="sourceOrgInfo?.orgCode"
|
||||
:dictCode="`nu_config_service_category,category_name,id,del_flag = 0 and instruction_id = '${queryParam.instructionTagId || ''}' order by sort asc`"
|
||||
placeholder="请选择服务类别" allowClear :ignoreDisabled="true" @select="reload()" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :lg="6">
|
||||
<a-form-item name="typeId">
|
||||
<template #label><span title="服务类型">服务类型</span></template>
|
||||
<j-dict-select-tag type="list" v-model:value="queryParam.typeId" v-if="showJSCom"
|
||||
:orgCode="sourceOrgInfo?.orgCode"
|
||||
:dictCode="`nu_config_service_type,type_name,id,del_flag = 0 and category_id = '${queryParam.categoryId || ''}' order by sort asc`"
|
||||
placeholder="请选择服务类型" allowClear :ignoreDisabled="true" @select="reload()" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6">
|
||||
<a-form-item name="directiveName">
|
||||
<template #label><span title="服务指令">服务指令</span></template>
|
||||
<JInput v-model:value="queryParam.directiveName" placeholder="请输入服务指令名称" allowClear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!-- <a-col :lg="6">
|
||||
<a-form-item name="bodyTags">
|
||||
<template #label><span title="体型标签">体型标签</span></template>
|
||||
<j-dict-select-tag type='list' v-model:value="queryParam.bodyTags"
|
||||
:dictCode="`nu_config_body_tag,tag_name,id,del_flag = '0' order by sort asc`" :ignoreDisabled="true"
|
||||
placeholder="请选择体型标签" allowClear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6">
|
||||
<a-form-item name="emotionTags">
|
||||
<template #label><span title="情绪标签">情绪标签</span></template>
|
||||
<j-dict-select-tag type="list" v-model:value="queryParam.emotionTags"
|
||||
:dictCode="`nu_config_emotion_tag,tag_name,id,del_flag = '0' order by sort asc`" :ignoreDisabled="true"
|
||||
placeholder="请选择情绪标签" allowClear />
|
||||
</a-form-item>
|
||||
</a-col> -->
|
||||
<!-- <a-col :lg="6">
|
||||
<a-form-item name="izEnabled">
|
||||
<template #label><span title="是否启用">是否启用</span></template>
|
||||
<j-dict-select-tag type='list' v-model:value="queryParam.izEnabled" dictCode="iz_enabled"
|
||||
:ignoreDisabled="true" placeholder="请选择是否启用" allowClear @select="reload()" />
|
||||
</a-form-item>
|
||||
</a-col> -->
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
|
||||
<a-col :lg="6">
|
||||
<!-- <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button> -->
|
||||
<a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset"
|
||||
style="margin-left: 8px">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<a-row :gutter="24" style="margin-top: -10px;padding-left: 20px;padding-right: 20px;">
|
||||
<a-col :lg="3" :push="21">
|
||||
<a-button type="primary" @click="selectAll">一键全选</a-button>
|
||||
<a-button type="default" @click="removeAll" style="margin-left: 8px">全部移除</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24" style="padding-left: 20px;padding-right: 20px;">
|
||||
<a-col :lg="12" :sm="24">
|
||||
<!-- 引用表格 -->
|
||||
<a-tag color="blue" style="margin-left: 10px;margin-top: 10px;">源数据 - {{ sourceOrgInfo.departName }}</a-tag>
|
||||
<a-radio-group v-model:value="sourceType" size="small" @change="sourceTypeChanged">
|
||||
<a-radio-button value="all">全部</a-radio-button>
|
||||
<a-radio-button value="unsel">未选择</a-radio-button>
|
||||
</a-radio-group>
|
||||
<BasicTable @register="registerTable" :dataSource="leftList" size="small" :rowClassName="rowClassName"
|
||||
:scroll="{ y: '46vh' }">
|
||||
<template #tableTitle></template>
|
||||
<template v-slot:bodyCell="{ column, record, index, text }">
|
||||
<template v-if="column.dataIndex === 'bodyTagList'">
|
||||
<span :title="text.map((item) => item.tagName).join('、')">{{text.map((item) =>
|
||||
item.tagName).join('、')}}</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'emotionTagList'">
|
||||
<span :title="text.map((item) => item.tagName).join('、')">{{text.map((item) =>
|
||||
item.tagName).join('、')}}</span>
|
||||
</template>
|
||||
</template>
|
||||
<template #action="{ record }">
|
||||
<a-button type="link" v-if="!selectedRecordIds.includes(record.id)" @click="selectRecord(record)"
|
||||
size="small">选择</a-button>
|
||||
<a-button type="link" v-else @click="removeRecord(record)" size="small">移除</a-button>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</a-col>
|
||||
<a-col :lg="12" :sm="24">
|
||||
<a-tag color="green" style="margin-left: 10px;margin-top: 10px;">已选择 {{ rightList.length }} 条</a-tag>
|
||||
<BasicTable :dataSource="rightList" :columns="sourceColumns" size="small" :scroll="{ y: '46vh' }"
|
||||
:pagination="{ current: 1, pageSize: 50, total: rightList.length, showSizeChanger: true, pageSizeOptions: ['10', '20', '50', '100'] }">
|
||||
</BasicTable>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" name="serviceDirective-configServiceDirective" setup>
|
||||
import { ref, reactive, onMounted, watch } from 'vue';
|
||||
import { BasicTable, TableAction } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { columns, sourceColumns, superQuerySchema } from './ConfigServiceDirective.data';
|
||||
import { listByDS } from './ConfigServiceDirective.api';
|
||||
import { useUserStore } from '/@/store/modules/user';
|
||||
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
|
||||
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||
import { cloneDeep } from "lodash-es";
|
||||
import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
|
||||
|
||||
const leftList = ref<any[]>([]); // 左侧列表的数据
|
||||
const rightList = ref<any[]>([]); // 右侧列表的数据
|
||||
const sourceOrgInfo = ref({})//源数据机构信息
|
||||
const sourceType = ref('all')
|
||||
const showJSCom = ref(false)
|
||||
const selectedRecordIds = ref<string[]>([]); // 存储已选择记录的 ID
|
||||
const formRef = ref();
|
||||
const queryParam = reactive<any>({});
|
||||
const toggleSearchStatus = ref<boolean>(false);
|
||||
const registerModal = ref();
|
||||
const userStore = useUserStore();
|
||||
//注册table数据
|
||||
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
||||
tableProps: {
|
||||
title: '服务指令',
|
||||
api: listByDS,
|
||||
columns: sourceColumns,
|
||||
canResize: false,
|
||||
useSearchForm: false,
|
||||
showIndexColumn: true,
|
||||
showTableSetting: false,
|
||||
immediate: false,
|
||||
pagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '50', '100'],
|
||||
},
|
||||
beforeFetch: async (params) => {
|
||||
queryParam.izEnabled = '0'
|
||||
return Object.assign(params, queryParam);
|
||||
},
|
||||
actionColumn: {
|
||||
width: 80,
|
||||
fixed: 'right',
|
||||
},
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
|
||||
const labelCol = reactive({
|
||||
xs: 24,
|
||||
sm: 6,
|
||||
xl: 6,
|
||||
xxl: 6
|
||||
});
|
||||
const wrapperCol = reactive({
|
||||
xs: 24,
|
||||
sm: 18,
|
||||
});
|
||||
|
||||
/**
|
||||
* 查询
|
||||
*/
|
||||
function searchQuery() {
|
||||
reload();
|
||||
}
|
||||
|
||||
/**
|
||||
* 重置
|
||||
*/
|
||||
function searchReset() {
|
||||
formRef.value.resetFields();
|
||||
selectedRowKeys.value = [];
|
||||
//刷新数据
|
||||
reload();
|
||||
}
|
||||
|
||||
function init(record) {
|
||||
sourceOrgInfo.value = record.orgInfo
|
||||
//初始化各参数
|
||||
{
|
||||
rightList.value = []
|
||||
leftList.value = []
|
||||
selectedRecordIds.value = []
|
||||
formRef.value.resetFields();
|
||||
selectedRowKeys.value = [];
|
||||
sourceType.value = 'all'
|
||||
}
|
||||
queryParam.dataSourceCode = record.orgInfo.orgCode;
|
||||
reload();
|
||||
}
|
||||
|
||||
// 选择记录
|
||||
function selectRecord(record: any) {
|
||||
if (!selectedRecordIds.value.includes(record.id)) {
|
||||
selectedRecordIds.value.push(record.id); // 记录 ID
|
||||
rightList.value.push(record); // 将记录添加到右侧
|
||||
leftList.value = leftList.value.filter(item => item.id !== record.id); // 从左侧移除
|
||||
rightList.value = [...rightList.value]; // 强制更新引用，确保视图更新
|
||||
leftList.value = [...leftList.value]; // 强制更新引用，确保视图更新
|
||||
}
|
||||
}
|
||||
|
||||
// 移除记录
|
||||
function removeRecord(record: any) {
|
||||
if (selectedRecordIds.value.includes(record.id)) {
|
||||
selectedRecordIds.value = selectedRecordIds.value.filter(id => id !== record.id); // 移除记录 ID
|
||||
leftList.value.push(record); // 添加回左侧
|
||||
rightList.value = rightList.value.filter(item => item.id !== record.id); // 从右侧移除
|
||||
rightList.value = [...rightList.value]; // 强制更新引用，确保视图更新
|
||||
leftList.value = [...leftList.value]; // 强制更新引用，确保视图更新
|
||||
}
|
||||
}
|
||||
|
||||
// 行样式
|
||||
function rowClassName(record: any) {
|
||||
return selectedRecordIds.value.includes(record.id) ? 'selected-row' : '';
|
||||
}
|
||||
|
||||
/**
|
||||
* 一键全选，将所有左侧数据移至右侧
|
||||
*/
|
||||
function selectAll() {
|
||||
listByDS({
|
||||
...queryParam,
|
||||
pageNo: 1,
|
||||
pageSize: -1,
|
||||
}).then(res => {
|
||||
const allRecords = res.records || [];
|
||||
// 只添加没有选择的记录到右侧
|
||||
const unselectedRecords = allRecords.filter(record => !selectedRecordIds.value.includes(record.id));
|
||||
if (unselectedRecords.length) {
|
||||
// 把新记录推到右侧列表
|
||||
rightList.value.push(...unselectedRecords);
|
||||
// 把新记录的 id 推入已选 id 列表
|
||||
selectedRecordIds.value.push(...unselectedRecords.map(r => r.id));
|
||||
// 刷新引用，确保视图更新
|
||||
rightList.value = [...rightList.value];
|
||||
selectedRecordIds.value = [...selectedRecordIds.value];
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 全部移除，将右侧数据移回左侧
|
||||
*/
|
||||
function removeAll() {
|
||||
rightList.value = []; // 清空右侧列表
|
||||
selectedRecordIds.value = []
|
||||
}
|
||||
|
||||
function sourceTypeChanged(val_) {
|
||||
if (val_.target.value == 'all') {
|
||||
//全部
|
||||
queryParam.excludeIds = null
|
||||
} else {
|
||||
//未选择
|
||||
queryParam.excludeIds = selectedRecordIds.value.join(',')
|
||||
}
|
||||
reload()
|
||||
}
|
||||
|
||||
watch(
|
||||
() => queryParam.directiveName,
|
||||
(newVal) => {
|
||||
reload()
|
||||
}
|
||||
);
|
||||
|
||||
function controlShowJSCom() {
|
||||
showJSCom.value = false
|
||||
setTimeout(() => {
|
||||
showJSCom.value = true
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
init,
|
||||
rightList,
|
||||
controlShowJSCom,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.jeecg-basic-table-form-container {
|
||||
padding: 0;
|
||||
|
||||
.table-page-search-submitButtons {
|
||||
display: block;
|
||||
margin-bottom: 24px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.query-group-cust {
|
||||
min-width: 100px !important;
|
||||
}
|
||||
|
||||
.query-group-split-cust {
|
||||
width: 30px;
|
||||
display: inline-block;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.ant-form-item:not(.ant-form-item-with-help) {
|
||||
margin-bottom: 16px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
:deep(.ant-picker),
|
||||
:deep(.ant-input-number) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
audio::-webkit-media-controls-timeline {
|
||||
display: none;
|
||||
}
|
||||
|
||||
audio::-webkit-media-controls-current-time-display,
|
||||
audio::-webkit-media-controls-time-remaining-display {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.btnPrivate {
|
||||
height: 34px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
/* 添加深度选择器确保样式能穿透组件 */
|
||||
:deep(.ant-table-tbody) {
|
||||
tr.selected-row {
|
||||
td {
|
||||
background-color: #e6f7ff !important;
|
||||
}
|
||||
|
||||
&:hover td {
|
||||
background-color: #e6f7ff !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep .ant-table-title {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:deep .jeecg-basic-table-form-container .ant-form {
|
||||
padding: 0px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -3,46 +3,255 @@
|
|||
<div class="left">
|
||||
<a-card class="top">
|
||||
<div class="source-platform">
|
||||
<span>源平台</span>
|
||||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="showOrgListModal"
|
||||
size="small">请选择</a-button>
|
||||
<span class="section-title">源平台</span>
|
||||
<a-button type="link" @click="showSourceOrgListModal" size="small">请选择</a-button>
|
||||
</div>
|
||||
<div class="selected-orgs" v-if="!!orgInfo.length">
|
||||
<a-card class="org-card" :headStyle="{ height: '60px', padding: '0 24px' }"
|
||||
:bodyStyle="{ padding: '24px 24px 4px 24px' }">
|
||||
<template #title>
|
||||
<a-row style="font-weight: normal;">
|
||||
<a-col :span="21" style="font-size: 14px; padding-top: 4px;">
|
||||
<div>
|
||||
<span style="font-weight: bold;">{{ orgInfo[0]?.departName }}</span>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="3" style="text-align: center; padding-top: 4px;">
|
||||
<div class="zxClass">{{ orgInfo[0]?.orgCode }}</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
<p>加盟时间：{{ orgInfo[0]?.franchiseTime?.substring(0, 10) }}</p>
|
||||
<p>机构负责人：{{ orgInfo[0]?.orgLeader }}</p>
|
||||
<p>负责人电话：{{ orgInfo[0]?.orgLeaderPhone }}</p>
|
||||
<p class="ellipsis-one-lines" :title="orgInfo[0]?.comRegisterAddress">机构地址：{{ orgInfo[0]?.comRegisterAddress
|
||||
}}</p>
|
||||
</a-card>
|
||||
</div>
|
||||
<a-empty v-else :description="'暂未选择'" />
|
||||
</a-card>
|
||||
<a-card class="bottom">
|
||||
<div class="source-platform">
|
||||
<span>目标平台</span>
|
||||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="showOrgListModal"
|
||||
size="small">请选择</a-button>
|
||||
<span class="section-title">目标平台</span>
|
||||
<div>
|
||||
<a-radio-group v-model:value="targetChooseType" size="small" @change="targetChooseTypeChanged">
|
||||
<a-radio-button value="one">指定</a-radio-button>
|
||||
<a-radio-button value="multi">批量</a-radio-button>
|
||||
</a-radio-group>
|
||||
<a-divider type="vertical" style="background-color: #CDCDCF" />
|
||||
<a-button type="link" @click="showTargetOrgListModal" size="small">请选择</a-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="selected-orgs" ref="selectedOrgsContainer" style="height: 46vh; overflow: auto;"
|
||||
v-if="!!syncOrgs.length">
|
||||
<a-card v-for="orgItem of syncOrgs" class="org-card"
|
||||
:class="{ 'selected-card': selectedTargetOrgs.some(org => org.orgCode === orgItem.orgCode) }"
|
||||
:headStyle="{ height: '60px', padding: '0 24px' }" :bodyStyle="{ padding: '24px 24px 4px 24px' }"
|
||||
@click="handleTargetOrgChange(orgItem)">
|
||||
<template #title>
|
||||
<a-row style="font-weight: normal;">
|
||||
<a-col :span="21" style="font-size: 14px; padding-top: 4px;">
|
||||
<div>
|
||||
<span style="font-weight: bold;">{{ orgItem?.departName }}</span>
|
||||
<span v-show="selectedTargetOrgs.some(org => org.orgCode === orgItem.orgCode)"
|
||||
style="color: green; font-size: 12px; margin-left: 8px;">已选择</span>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="3" style="text-align: center; padding-top: 4px;">
|
||||
<div class="zxClass">{{ orgItem?.orgCode }}</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
<p>加盟时间：{{ orgItem?.franchiseTime?.substring(0, 10) }}</p>
|
||||
<p>机构负责人：{{ orgItem?.orgLeader }}</p>
|
||||
<p>负责人电话：{{ orgItem?.orgLeaderPhone }}</p>
|
||||
<p class="ellipsis-one-lines" :title="orgItem?.comRegisterAddress">机构地址：{{ orgItem?.comRegisterAddress
|
||||
}}</p>
|
||||
</a-card>
|
||||
</div>
|
||||
<a-empty style="margin-top: 50px;" v-else :description="'暂未选择'" />
|
||||
</a-card>
|
||||
</div>
|
||||
<a-card class="right">
|
||||
<div class="source-platform">
|
||||
<span>指令镜像</span>
|
||||
<div class="zljx-platform">
|
||||
<span class="section-title">指令镜像</span>
|
||||
<div class="directive-choose-wrapper">
|
||||
<DirectiveChooseCom v-show="!!orgInfo.length" ref="directiveChooseRef" :targetChooseType="targetChooseType" :targetOrgs="selectedTargetOrgs">
|
||||
</DirectiveChooseCom>
|
||||
</div>
|
||||
</div>
|
||||
</a-card>
|
||||
<a-modal v-model:visible="orgListVisible" title="选择源平台" width="800px" :footer="null">
|
||||
<OrgListCom class="step-content" ref="orgListComRef" :showChoose="true" @handleOrgChoose="handleOrgChoose" />
|
||||
<a-modal v-model:visible="sourceOrgListVisible" title="选择源平台" width="90vw"
|
||||
:bodyStyle="{ padding: '0', height: '70vh', display: 'flex', flexDirection: 'column', overflow: 'hidden' }"
|
||||
wrapClassName="org-list-modal" @cancel="handleCancelSource">
|
||||
<template #footer>
|
||||
<a-button @click="handleCancelSource" type="primary">取消</a-button>
|
||||
<a-button @click="handleGetSource" type="primary">确认</a-button>
|
||||
</template>
|
||||
<OrgListCom class="step-content" ref="sourceOrgListComRef" @handleOrgChoose="handleSourceOrgChoose"
|
||||
:showChoose="true" />
|
||||
</a-modal>
|
||||
<a-modal v-model:visible="targetOrgListVisible" title="选择源平台" width="90vw" @cancel="handleCancelTarget">
|
||||
<template #footer>
|
||||
<a-button @click="handleCancelTarget" type="primary">取消</a-button>
|
||||
<a-button @click="handleGetTarget" type="primary">确认</a-button>
|
||||
</template>
|
||||
<OrgListCom class="step-content" ref="targetOrgListComRef" @handleOrgChoose="handleTargetOrgChoose"
|
||||
:showChoose="true" :allowMultipleSelection="true" :pageSize="-1" :excludeOrgCode="orgInfo[0]?.orgCode" />
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { ref, nextTick, watch } from 'vue';
|
||||
import OrgListCom from '/@/views/synchronization/directive/orgCom/OrgListCom.vue';
|
||||
import DirectiveChooseCom from '/@/views/synchronization/directive/serviceDirective/DirectiveChooseCom.vue'
|
||||
|
||||
const orgListVisible = ref(false);
|
||||
const orgListComRef = ref();
|
||||
const sourceOrgListVisible = ref(false);
|
||||
const targetOrgListVisible = ref(false);
|
||||
const sourceOrgListComRef = ref();
|
||||
const targetOrgListComRef = ref();
|
||||
const orgInfo = ref([])
|
||||
const syncOrgs = ref([])
|
||||
const directiveChooseRef = ref()
|
||||
const selectedTargetOrgs = ref([])//已选择目标平台
|
||||
const targetChooseType = ref('one')
|
||||
const selectedOrgsContainer = ref<HTMLElement>();
|
||||
|
||||
// 显示机构列表弹窗
|
||||
function showOrgListModal() {
|
||||
orgListVisible.value = true;
|
||||
function showSourceOrgListModal() {
|
||||
sourceOrgListComRef.value?.reload()
|
||||
targetOrgListComRef.value?.reload()
|
||||
sourceOrgListVisible.value = true;
|
||||
}
|
||||
|
||||
// 处理机构选择
|
||||
function handleOrgChoose(orgInfo_) {
|
||||
orgListVisible.value = false;
|
||||
// 这里可以处理选择的机构信息
|
||||
// 显示机构列表弹窗
|
||||
function showTargetOrgListModal() {
|
||||
sourceOrgListComRef.value?.reload()
|
||||
targetOrgListComRef.value?.reload()
|
||||
targetOrgListVisible.value = true;
|
||||
}
|
||||
|
||||
//重置目标平台数据
|
||||
function resetTargetOrgs(orgInfo_) {
|
||||
// 检查是否已存在该机构
|
||||
const syncOrgsIndex = syncOrgs.value.findIndex(
|
||||
org => org.orgCode === orgInfo_.orgCode
|
||||
);
|
||||
|
||||
if (syncOrgsIndex >= 0) {
|
||||
// 如果已存在，则移除
|
||||
syncOrgs.value.splice(syncOrgsIndex, 1);
|
||||
}
|
||||
syncOrgs.value = [...syncOrgs.value];
|
||||
//处理已选择数据
|
||||
const selectedTargetOrgsIndex = selectedTargetOrgs.value.findIndex(
|
||||
org => org.orgCode === orgInfo_.orgCode
|
||||
);
|
||||
|
||||
if (selectedTargetOrgsIndex >= 0) {
|
||||
// 如果已存在，则移除
|
||||
selectedTargetOrgs.value.splice(selectedTargetOrgsIndex, 1);
|
||||
}
|
||||
selectedTargetOrgs.value = [...selectedTargetOrgs.value];
|
||||
//如果是"指定"且“已选机构仍有值”且"已被选中" 则 默认选中第一个并定位
|
||||
if (targetChooseType.value == 'one' && !!syncOrgs.value?.length && selectedTargetOrgsIndex >= 0) {
|
||||
selectedTargetOrgs.value = [{ ...syncOrgs.value?.[0] }]
|
||||
// 滚动到顶部
|
||||
nextTick(() => {
|
||||
if (selectedOrgsContainer.value) {
|
||||
selectedOrgsContainer.value.scrollTop = 0;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 处理源数据机构选择
|
||||
function handleSourceOrgChoose(orgInfo_) {
|
||||
//重置目标平台数据
|
||||
resetTargetOrgs(orgInfo_[0])
|
||||
orgInfo.value = orgInfo_
|
||||
//重置目标平台数据
|
||||
targetOrgListComRef.value?.resetSeleted(syncOrgs.value)
|
||||
directiveChooseRef.value?.controlShowJSCom()
|
||||
//是否已选择目标平台 否则为初始化原平台
|
||||
if (selectedTargetOrgs.value.length) {
|
||||
if (targetChooseType.value == 'one') {
|
||||
directiveChooseRef.value?.initTargetList(selectedTargetOrgs.value[0])
|
||||
}
|
||||
} else {
|
||||
directiveChooseRef?.value?.init({ orgInfo: orgInfo.value[0] })
|
||||
}
|
||||
}
|
||||
|
||||
// 处理目标平台机构选择
|
||||
function handleTargetOrgChoose(orgInfo_) {
|
||||
if (!syncOrgs.value || syncOrgs.value.length == 0) {
|
||||
if (targetChooseType.value == 'one' && orgInfo_.length > 0) {
|
||||
selectedTargetOrgs.value = [{ ...orgInfo_[0] }]
|
||||
directiveChooseRef.value?.initTargetList(orgInfo_[0])
|
||||
}
|
||||
}
|
||||
syncOrgs.value = orgInfo_
|
||||
}
|
||||
|
||||
function handleCancelSource() {
|
||||
sourceOrgListVisible.value = false;
|
||||
sourceOrgListComRef.value?.resetSeleted(orgInfo.value)
|
||||
}
|
||||
|
||||
function handleCancelTarget() {
|
||||
targetOrgListVisible.value = false;
|
||||
targetOrgListComRef.value?.resetSeleted(syncOrgs.value)
|
||||
}
|
||||
|
||||
//目标平台被点击（选中/移除）
|
||||
function handleTargetOrgChange(org_) {
|
||||
if (targetChooseType.value == 'one') {
|
||||
selectedTargetOrgs.value = [{ ...org_ }]
|
||||
directiveChooseRef.value?.initTargetList(org_)
|
||||
} else {
|
||||
// 检查是否已存在该机构
|
||||
const index = selectedTargetOrgs.value.findIndex(
|
||||
org => org.orgCode === org_.orgCode
|
||||
);
|
||||
|
||||
if (index >= 0) {
|
||||
// 如果已存在，则移除
|
||||
selectedTargetOrgs.value.splice(index, 1);
|
||||
} else {
|
||||
// 如果不存在，则添加
|
||||
selectedTargetOrgs.value.push(org_);
|
||||
}
|
||||
//响应式刷新
|
||||
selectedTargetOrgs.value = [...selectedTargetOrgs.value];
|
||||
// directiveChooseRef.value?.cleanTargetSourceData()
|
||||
}
|
||||
}
|
||||
|
||||
//目标平台选取方式 单个/多个
|
||||
function targetChooseTypeChanged(val_) {
|
||||
if (val_.target.value == 'one' && !!syncOrgs.value?.length) {
|
||||
selectedTargetOrgs.value = [{ ...syncOrgs.value?.[0] }]
|
||||
// 滚动到顶部
|
||||
nextTick(() => {
|
||||
if (selectedOrgsContainer.value) {
|
||||
selectedOrgsContainer.value.scrollTop = 0;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
//源平台机构变更确认
|
||||
function handleGetSource() {
|
||||
sourceOrgListComRef.value?.commitOrgsInfo()
|
||||
handleCancelSource()
|
||||
}
|
||||
|
||||
//目标平台机构变更确认
|
||||
function handleGetTarget() {
|
||||
targetOrgListComRef.value?.commitOrgsInfo()
|
||||
handleCancelTarget()
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -96,19 +305,43 @@ function handleOrgChoose(orgInfo_) {
|
|||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.zljx-platform {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
/* 改为垂直排列 */
|
||||
gap: 8px;
|
||||
/* 添加间距 */
|
||||
|
||||
.section-title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
position: relative;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.directive-choose-wrapper {
|
||||
width: 100%;
|
||||
/* 可以根据需要添加其他样式 */
|
||||
}
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
position: relative;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.left .top {
|
||||
flex: 0 0 28%;
|
||||
margin-bottom: 1%;
|
||||
//background-color: lightblue;
|
||||
/* 可根据需要修改 */
|
||||
}
|
||||
|
||||
.left .bottom {
|
||||
flex: 1;
|
||||
/* 占剩余部分 */
|
||||
margin-bottom: 1%;
|
||||
//background-color: lightgreen;
|
||||
/* 可根据需要修改 */
|
||||
}
|
||||
|
||||
.right {
|
||||
|
|
@ -117,7 +350,50 @@ function handleOrgChoose(orgInfo_) {
|
|||
max-height: 85vh;
|
||||
}
|
||||
|
||||
:deep .ant-card-body{
|
||||
padding:8px;
|
||||
:deep .ant-card-body {
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.step-content {
|
||||
overflow: auto;
|
||||
height: 70vh;
|
||||
}
|
||||
|
||||
.zxClass {
|
||||
font-size: 12px;
|
||||
background: linear-gradient(to right, #1ea0fa, #017de9);
|
||||
border-radius: 8px;
|
||||
height: 25px;
|
||||
color: white;
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
.tbClass {
|
||||
background: #f6f6f6;
|
||||
padding: 8px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.antTitle {
|
||||
margin-top: 10px;
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.ellipsis-one-lines {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.selected-card {
|
||||
border: 2px solid #1890ff;
|
||||
box-shadow: 0 0 2px rgba(24, 144, 255, 0.3);
|
||||
}
|
||||
|
||||
.org-card {
|
||||
margin-top: 8px;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue