yangjun
/
hldy_vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

长者标签

This commit is contained in:
1378012178@qq.com 2025-08-15 08:56:00 +08:00
parent 6b6d4c06d3
commit a0a069be47
19 changed files with 3157 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

107
src/components/OrgCard/OrgCardCom copy.vue Normal file
View File

@ -0,0 +1,107 @@
<template>
<a-card :class="{
'selected-card': isSelected,
'directive-selected-card': isDirectiveSelected,
'org-card': clickable
}"
style="width: 100%; border-radius: 8px;"
:style="{ cursor: clickable ? 'pointer' : 'default' }"
:bodyStyle="{ padding: '24px' }"
@click="handleClick">
<div>
<a-row style="font-weight: normal; margin-bottom: 12px;">
<a-col :span="layout === 'full' ? 16 : 13" style="font-size: 14px;">
<div>
<span style="font-weight: bold;">{{ orgInfo.departName }}</span>
</div>
</a-col>
<a-col :span="layout === 'full' ? 8 : 11" style="text-align: right;">
<div style="display: flex; align-items: center; justify-content: flex-end; gap: 8px;">
<span v-if="isDirectiveMain" style="color: green; font-size: 12px; font-weight: bold; white-space: nowrap;">
标准指令库
</span>
<div class="zxClass" style="min-width: 35px;">{{ orgInfo.orgCode }}</div>
</div>
</a-col>
</a-row>
<a-divider />
<div style="position: relative;">
<div v-show="showDetail" style="text-align:center;position: absolute;top: 0px;right:0px">
<a-button type="link" size="small" @click.stop="handleDetail">详情</a-button>
</div>
<div>
<p>加盟时间：{{ orgInfo.franchiseTime?.substring(0, 10) }}</p>
<p>机构负责人：{{ orgInfo.orgLeader }}</p>
<p>负责人电话：{{ orgInfo.orgLeaderPhone }}</p>
<p class="ellipsis-one-lines" :title="orgInfo.comRegisterAddress">机构地址：{{ orgInfo.comRegisterAddress }}</p>
</div>
</div>
</div>
</a-card>
</template>
<script setup lang="ts">
import { defineProps, defineEmits } from 'vue'
const props = defineProps({
orgInfo: { type: Object, required: true },
layout: { type: String, default: 'full' },
isSelected: { type: Boolean, default: false },
isDirectiveSelected: { type: Boolean, default: false },
isDirectiveMain: { type: Boolean, default: false },
showDetail: { type: Boolean, default: false },
clickable: { type: Boolean, default: false }
})
const emit = defineEmits(['click', 'detail'])
const handleClick = () => {
emit('click', props.orgInfo)
}
const handleDetail = () => {
emit('detail', props.orgInfo)
}
</script>
<style lang="less" scoped>
.zxClass {
font-size: 12px;
background: linear-gradient(to right, #1ea0fa, #017de9);
border-radius: 8px;
height: 25px;
color: white;
line-height: 25px;
padding: 0 8px;
flex-shrink: 0;
}
.ellipsis-one-lines {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
}
.selected-card {
border: 2px solid #1890ff;
box-shadow: 0 0 8px rgba(24, 144, 255, 0.3);
}
.directive-selected-card {
border: 2px solid #1890FF;
box-shadow: 0 0 8px rgba(37, 149, 255, 0.3);
}
.org-card {
&:hover {
border-color: #55a9f8;
box-shadow: 0 2px 8px rgba(37, 149, 255, 0.3);
}
}
:deep .ant-divider {
margin: 0 0 8px 0;
}
</style>

153
src/components/OrgCard/OrgCardCom.vue Normal file
View File

@ -0,0 +1,153 @@
<template>
<a-card :class="{
'selected-card': isSelected,
'directive-selected-card': isDirectiveSelected,
'org-card': clickable
}" style="width: 100%; border-radius: 8px;" :style="{ cursor: clickable ? 'pointer' : 'default' }"
:bodyStyle="{ padding: '24px' }" @click="handleClick">
<div>
<a-row style="font-weight: normal; margin-bottom: 12px;">
<a-col :span="existTagFunc() ? 16 : 21">
<div>
<span class="ellipsis-one-lines1" :title="orgInfo.departName" style="font-size: 17px; font-weight: bold;">{{
orgInfo.departName
}}</span>
</div>
</a-col>
<a-col :span="existTagFunc() ? 8 : 3" style="text-align: right;">
<div style="display: flex; align-items: center; justify-content: flex-end; gap: 8px;">
<span v-if="isDirectiveMain"
style="color: #909399; font-size: 12px; font-weight: bold; white-space: nowrap;">
标准指令库
</span>
<span v-if="isElderTagMain"
style="color: #909399; font-size: 12px; font-weight: bold; white-space: nowrap;">
标准标签库
</span>
<div class="zxClass" :class="{ 'zxbkClass': existTagFunc() }" style="min-width: 35px;">{{ orgInfo.orgCode
}}
</div>
</div>
</a-col>
</a-row>
<div style="position: relative;">
<div>
<div><span style="color: #909399;">机构负责人：</span>{{ orgInfo.orgLeader }}</div>
<div><span style="color: #909399;">负责人电话：</span>{{ orgInfo.orgLeaderPhone }}</div>
</div>
<div class="org-address">
<span class="ellipsis-one-lines2" :title="orgInfo.comRegisterAddress">{{ orgInfo.comRegisterAddress }}</span>
</div>
<div
style="font-size: 12px; display: flex; justify-content: space-between; align-items: center; margin-top: 12px;">
<span style="color: #909399;">加盟时间：{{ orgInfo.franchiseTime?.substring(0, 10) }}</span>
<a-button style="font-size: 12px;" v-show="showDetail" type="link" size="small"
@click.stop="handleDetail">了解更多</a-button>
</div>
</div>
</div>
</a-card>
</template>
<script setup lang="ts">
import { defineProps, defineEmits } from 'vue'
const props = defineProps({
orgInfo: { type: Object, required: true },
layout: { type: String, default: 'full' },
isSelected: { type: Boolean, default: false },
isDirectiveSelected: { type: Boolean, default: false },
isDirectiveMain: { type: Boolean, default: false },//标准指令库
isElderTagMain: { type: Boolean, default: false },//标准标签库
showDetail: { type: Boolean, default: false },
clickable: { type: Boolean, default: false }
})
const emit = defineEmits(['click', 'detail'])
const existTagFunc = () => {
return props.isDirectiveMain || props.isElderTagMain
}
const handleClick = () => {
emit('click', props.orgInfo)
}
const handleDetail = () => {
emit('detail', props.orgInfo)
}
</script>
<style lang="less" scoped>
.zxClass {
font-size: 12px;
background-color: white;
border: 1px solid #e4e4e4;
border-radius: 8px;
height: 25px;
color: #7c7c7c;
line-height: 25px;
padding: 0 8px;
flex-shrink: 0;
}
.zxbkClass {
background-color: #F5F7FF;
}
.selected-card {
border: 2px solid #1890ff;
box-shadow: 0 0 8px rgba(24, 144, 255, 0.3);
}
.directive-selected-card {
border: 2px solid #1890FF;
box-shadow: 0 0 8px rgba(37, 149, 255, 0.3);
}
.org-card {
&:hover {
border-color: #55a9f8;
box-shadow: 0 2px 8px rgba(37, 149, 255, 0.3);
}
}
:deep .ant-divider {
margin: 0 0 8px 0;
}
.org-address {
width: 100%;
height: 65px;
background-color: #f8fbff;
background-image: url('./orgaddressbk.png');
background-repeat: no-repeat;
background-position: center;
background-size: cover;
padding: 13px;
padding-right: 100px;
color: #696c7f;
display: flex;
align-items: center;
margin-top: 10px;
border-radius: 10px;
font-size: 12.5px;
}
.ellipsis-one-lines1 {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.ellipsis-one-lines2 {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
line-height: 1.8;
}
</style>

BIN
src/components/OrgCard/orgaddressbk.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

BIN
src/components/OrgCard/orgaddressbk2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 44 KiB

15
src/views/synchronization/eldertag/canaddet/CanAddElderTag.api.ts Normal file
View File

@ -0,0 +1,15 @@
import { defHttp } from '/@/utils/http/axios';
import { useMessage } from "/@/hooks/web/useMessage";
const { createConfirm } = useMessage();
enum Api {
list = '/eldertag/canAddElderTag/list',
}
/**
* 列表接口
* @param params
*/
export const list = (params) => defHttp.get({ url: Api.list, params });

31
src/views/synchronization/eldertag/canaddet/CanAddElderTag.data.ts Normal file
View File

@ -0,0 +1,31 @@
import { BasicColumn } from '/@/components/Table';
import { FormSchema } from '/@/components/Table';
import { rules } from '/@/utils/helper/validator';
import { render } from '/@/utils/common/renderUtils';
import { getWeekMonthQuarterYear } from '/@/utils';
//列表数据
export const columns: BasicColumn[] = [
{
title: '所属机构',
align: 'center',
dataIndex: 'sysOrgCode_dictText',
},
{
title: '标签类型',
align: 'center',
dataIndex: 'type_dictText',
},
{
title: '标签名称',
align: 'center',
dataIndex: 'tagName',
},
{
title: '价格(元)',
align: 'center',
dataIndex: 'price',
},
];
// 高级查询数据
export const superQuerySchema = {};

234
src/views/synchronization/eldertag/canaddet/CanAddElderTagList.vue Normal file
View File

@ -0,0 +1,234 @@
<template>
<div class="p-2">
<!--查询区域-->
<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="sysOrgCode">
<template #label><span title="所属机构">所属机构</span></template>
<j-dict-select-tag placeholder="请选择所属机构" v-model:value="queryParam.sysOrgCode"
dictCode="sys_depart,depart_name,org_code" allow-clear />
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="type">
<template #label><span title="标签类型">标签类型</span></template>
<j-dict-select-tag v-model:value="queryParam.type" dictCode="elder_tag_type" placeholder="请选择标签类型"
allowClear :ignoreDisabled="true" />
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="tagName">
<template #label><span title="标签名称">标签名称</span></template>
<JInput v-model:value="queryParam.tagName" placeholder="请输入标签名称" allowClear />
</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>
<!--引用表格-->
<BasicTable @register="registerTable" :rowSelection="rowSelection">
<!--插槽:table标题-->
<template #tableTitle>
</template>
<!--操作栏-->
<template #action="{ record }">
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
</template>
<template v-slot:bodyCell="{ column, record, index, text }">
</template>
</BasicTable>
<!-- 表单区域 -->
<CanAddElderTagModal ref="registerModal" @success="handleSuccess"></CanAddElderTagModal>
</div>
</template>
<script lang="ts" name="canadddirective-canAddElderTag" setup>
import { ref, reactive } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage';
import { columns, superQuerySchema } from './CanAddElderTag.data';
import { list } from './CanAddElderTag.api';
import { downloadFile } from '/@/utils/common/renderUtils';
import CanAddElderTagModal from './components/CanAddElderTagModal.vue'
import { useUserStore } from '/@/store/modules/user';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
import { useMessage } from '/@/hooks/web/useMessage';
const props = defineProps({
elderTagMainOrgInfo: {},
existETIds: [],
})
const { createMessage, createConfirm } = useMessage();
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: list,
columns,
canResize: false,
useSearchForm: false,
actionColumn: {
width: 120,
fixed: 'right',
},
beforeFetch: async (params) => {
return Object.assign(params, queryParam);
},
},
});
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
const labelCol = reactive({
xs: 24,
sm: 4,
xl: 6,
xxl: 5
});
const wrapperCol = reactive({
xs: 24,
sm: 20,
xl: 18,
xxl: 19
});
/**
* 详情
*/
function handleDetail(record: Recordable) {
registerModal.value.disableSubmit = true;
registerModal.value.edit(record);
}
/**
* 成功回调
*/
function handleSuccess() {
(selectedRowKeys.value = []) && reload();
}
/**
* 镜像
*/
function handlePull(record) {
createConfirm({
iconType: 'warning',
title: '镜像确认',
content: '请确认是否将' + record.sysOrgCode_dictText + '新增的长者标签“' + record.type_dictText + ' - ' + record.tagName + '”镜像给当前标准标签库：' + props.elderTagMainOrgInfo.departName,
okText: '确认',
cancelText: '取消',
onOk: () => {
// syncDirective(
// record.orgCode,
// {
// syncIds: record.directiveId,
// upIds: '',
// syncOrgCodes: props.elderTagMainOrgInfo.orgCode,
// syncOption: 'all',
// }
// ).then(res => {
// createMessage.success('已开始自动同步,可在日志中查看同步结果!')
// emit('refreshExistIds', props.elderTagMainOrgInfo)
// }).catch(() => {
// createMessage.error('镜像失败，请稍后再试')
// })
}
});
}
/**
* 操作栏
*/
function getTableAction(record) {
return [
// {
// label: '详情',
// onClick: handleDetail.bind(null, record),
// },
{
label: '镜像',
onClick: handlePull.bind(null, record),
}
];
}
/**
* 下拉操作栏
*/
function getDropDownAction(record) {
return [
]
}
/**
* 查询
*/
function searchQuery() {
reload();
}
/**
* 重置
*/
function searchReset() {
formRef.value.resetFields();
selectedRowKeys.value = [];
//刷新数据
reload();
}
</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%;
}
}
</style>

120
src/views/synchronization/eldertag/canaddet/components/CanAddElderTagForm.vue Normal file
View File

@ -0,0 +1,120 @@
<template>
<a-spin :spinning="confirmLoading">
<JFormContainer :disabled="disabled">
<template #detail>
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol"
name="CanAddElderTagForm">
<a-row>
<a-col :span="24">
<a-form-item label="标签类型" v-bind="validateInfos.type" id="ElderTagForm-type" name="type">
<j-dict-select-tag v-model:value="formData.type" dictCode="elder_tag_type" placeholder="请选择标签类型"
allowClear :ignoreDisabled="true" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="标签名称" v-bind="validateInfos.tagName" id="ElderTagForm-tagName" name="tagName">
<a-input v-model:value="formData.tagName" placeholder="请输入标签名称" allow-clear></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="价格(元)" v-bind="validateInfos.price" id="ElderTagForm-price" name="price">
<a-input-number v-model:value="formData.price" placeholder="请输入价格" style="width: 100%" :min="0"
:max="99.99" :precision="2" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="图标" v-bind="validateInfos.pic" id="ElderTagForm-pic" name="pic">
<JImageUpload :fileMax="1" v-model:value="formData.pic"></JImageUpload>
</a-form-item>
</a-col>
</a-row>
</a-form>
</template>
</JFormContainer>
</a-spin>
</template>
<script lang="ts" setup>
import { ref, reactive, defineExpose, nextTick, defineProps, computed, onMounted } from 'vue';
import { defHttp } from '/@/utils/http/axios';
import { useMessage } from '/@/hooks/web/useMessage';
import { getValueType } from '/@/utils';
import { Form } from 'ant-design-vue';
import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
const props = defineProps({
formDisabled: { type: Boolean, default: false },
formData: { type: Object, default: () => ({}) },
formBpm: { type: Boolean, default: true }
});
const formRef = ref();
const useForm = Form.useForm;
const emit = defineEmits(['register', 'ok']);
const formData = reactive<Record<string, any>>({
id: '',
type: '',
tagName: '',
price: undefined,
createTime: '',
sysOrgCode: '',
});
const { createMessage } = useMessage();
const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 5 } });
const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
const confirmLoading = ref<boolean>(false);
//表单验证
const validatorRules = reactive({
});
const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: false });
// 表单禁用
const disabled = computed(() => {
if (props.formBpm === true) {
if (props.formData.disabled === false) {
return false;
} else {
return true;
}
}
return props.formDisabled;
});
/**
* 新增
*/
function add() {
edit({});
}
/**
* 编辑
*/
function edit(record) {
nextTick(() => {
resetFields();
const tmpData = {};
Object.keys(formData).forEach((key) => {
if (record.hasOwnProperty(key)) {
tmpData[key] = record[key]
}
})
//赋值
Object.assign(formData, tmpData);
});
}
defineExpose({
add,
edit,
});
</script>
<style lang="less" scoped>
.antd-modal-form {
padding: 14px;
}
</style>

81
src/views/synchronization/eldertag/canaddet/components/CanAddElderTagModal.vue Normal file
View File

@ -0,0 +1,81 @@
<template>
<a-drawer :title="title" width="50vw" v-model:visible="visible" :closable="true"
:footer-style="{ textAlign: 'right' }" @cancel="handleCancel">
<template #footer>
<a-button @click="handleCancel" style="margin-right: 8px;">关闭</a-button>
</template>
<CanAddElderTagForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"></CanAddElderTagForm>
</a-drawer>
</template>
<script lang="ts" setup>
import { ref, nextTick, defineExpose } from 'vue';
import CanAddElderTagForm from './CanAddElderTagForm.vue'
import JModal from '/@/components/Modal/src/JModal/JModal.vue';
const title = ref<string>('');
const width = ref<number>(800);
const visible = ref<boolean>(false);
const disableSubmit = ref<boolean>(false);
const registerForm = ref();
const emit = defineEmits(['register', 'success']);
/**
* 新增
*/
function add() {
title.value = '新增';
visible.value = true;
nextTick(() => {
registerForm.value.add();
});
}
/**
* 编辑
* @param record
*/
function edit(record) {
title.value = disableSubmit.value ? '详情' : '编辑';
visible.value = true;
nextTick(() => {
registerForm.value.edit(record);
});
}
/**
* 确定按钮点击事件
*/
function handleOk() {
registerForm.value.submitForm();
}
/**
* form保存回调事件
*/
function submitCallback() {
handleCancel();
emit('success');
}
/**
* 取消按钮回调事件
*/
function handleCancel() {
visible.value = false;
}
defineExpose({
add,
edit,
disableSubmit,
});
</script>
<style lang="less">
/**隐藏样式-modal确定按钮 */
.jee-hidden {
display: none !important;
}
</style>
<style lang="less" scoped></style>

97
src/views/synchronization/eldertag/eldertag/ElderTag.api.ts Normal file
View File

@ -0,0 +1,97 @@
import { defHttp } from '/@/utils/http/axios';
import { useMessage } from "/@/hooks/web/useMessage";
const { createConfirm } = useMessage();
enum Api {
list = '/elder/elderTag/list',
save='/elder/elderTag/add',
edit='/elder/elderTag/edit',
deleteOne = '/elder/elderTag/delete',
deleteBatch = '/elder/elderTag/deleteBatch',
importExcel = '/elder/elderTag/importExcel',
exportXls = '/elder/elderTag/exportXls',
listByDS = '/elder/elderTag/listByDS',
idListByDS = '/elder/elderTag/idListByDS',
syncElderTag = '/elder/elderTag/syncElderTag',
}
/**
* 导出api
* @param params
*/
export const getExportUrl = Api.exportXls;
/**
* 导入api
*/
export const getImportUrl = Api.importExcel;
/**
* 列表接口
* @param params
*/
export const list = (params) => defHttp.get({ url: Api.list, params });
/**
* 删除单个
* @param params
* @param handleSuccess
*/
export const deleteOne = (params,handleSuccess) => {
return defHttp.delete({url: Api.deleteOne, params}, {joinParamsToUrl: true}).then(() => {
handleSuccess();
});
}
/**
* 批量删除
* @param params
* @param handleSuccess
*/
export const batchDelete = (params, handleSuccess) => {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '是否删除选中数据',
okText: '确认',
cancelText: '取消',
onOk: () => {
return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
handleSuccess();
});
}
});
}
/**
* 保存或者更新
* @param params
* @param isUpdate
*/
export const saveOrUpdate = (params, isUpdate) => {
let url = isUpdate ? Api.edit : Api.save;
return defHttp.post({ url: url, params }, { isTransformResponse: false });
}
/**
* 列表接口 - 变更数据源
* @param params
*/
export const listByDS = (params) => defHttp.get({ url: Api.listByDS, params });
/**
*
* @param params 获取对应机构已有长者标签id
* @returns
*/
export const idListByDS = (params) => defHttp.get({ url: Api.idListByDS, params });
/**
* 同步
* @param params
* @returns
*/
export const syncElderTag = (dataSourceCode: string, params: any) => {
return defHttp.post({ url: `${Api.syncElderTag}?sourceOrgCode=${encodeURIComponent(dataSourceCode)}`, params });
};

77
src/views/synchronization/eldertag/eldertag/ElderTag.data.ts Normal file
View File

@ -0,0 +1,77 @@
import { BasicColumn } from '/@/components/Table';
import { FormSchema } from '/@/components/Table';
import { rules } from '/@/utils/helper/validator';
import { render } from '/@/utils/common/renderUtils';
import { getWeekMonthQuarterYear } from '/@/utils';
//列表数据
export const columns: BasicColumn[] = [
{
title: '标签类型',
align: 'center',
dataIndex: 'type_dictText',
},
{
title: '标签名称',
align: 'center',
dataIndex: 'tagName',
},
{
title: '价格(元)',
align: 'center',
dataIndex: 'price',
},
{
title: '图标',
align: 'center',
dataIndex: 'pic',
customRender: render.renderImage,
},
{
title: '排序',
align: 'center',
dataIndex: 'sort',
},
{
title: '是否启用',
align: 'center',
dataIndex: 'izEnabled_dictText',
},
];
export const columnsNoMedia: BasicColumn[] = [
{
title: '标签类型',
align: 'center',
dataIndex: 'type_dictText',
},
{
title: '标签名称',
align: 'center',
dataIndex: 'tagName',
},
{
title: '价格(元)',
align: 'center',
dataIndex: 'price',
},
{
title: '排序',
align: 'center',
dataIndex: 'sort',
},
{
title: '是否启用',
align: 'center',
dataIndex: 'izEnabled_dictText',
},
];
// 高级查询数据
export const superQuerySchema = {
type: { title: '标签类型', order: 0, view: 'text', type: 'string' },
tagName: { title: '标签名称', order: 1, view: 'text', type: 'string' },
price: { title: '价格', order: 2, view: 'number', type: 'number' },
pic: { title: '图标', order: 3, view: 'text', type: 'string' },
sort: { title: '排序', order: 4, view: 'number', type: 'number' },
izEnabled: { title: '是否启用', order: 5, view: 'text', type: 'string' },
};

249
src/views/synchronization/eldertag/eldertag/ElderTagList.vue Normal file
View File

@ -0,0 +1,249 @@
<template>
<div class="p-2">
<!--查询区域-->
<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="type">
<template #label><span title="标签类型">标签类型</span></template>
<j-dict-select-tag v-model:value="queryParam.type" dictCode="elder_tag_type" placeholder="请选择标签类型"
allowClear :ignoreDisabled="true" />
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="tagName">
<template #label><span title="标签名称">标签名称</span></template>
<JInput v-model:value="queryParam.tagName" 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' placeholder="请选择是否启用" v-model:value="queryParam.izEnabled"
dictCode="iz_enabled" allow-clear />
</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>
<!--引用表格-->
<BasicTable @register="registerTable">
<!--插槽:table标题-->
<template #tableTitle>
</template>
<!--操作栏-->
<template #action="{ record }">
<TableAction :actions="getTableAction(record)" />
</template>
<template v-slot:bodyCell="{ column, record, index, text }">
</template>
</BasicTable>
<!-- 表单区域 -->
<ElderTagModal ref="registerModal" @success="handleSuccess"></ElderTagModal>
</div>
</template>
<script lang="ts" name="eldertag-elderTag" setup>
import { ref, reactive, onMounted } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage';
import { columns, superQuerySchema } from './ElderTag.data';
import { list, deleteOne, batchDelete, getImportUrl, getExportUrl } from './ElderTag.api';
import { downloadFile } from '/@/utils/common/renderUtils';
import ElderTagModal from './components/ElderTagModal.vue'
import { useUserStore } from '/@/store/modules/user';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
import { useMessage } from '/@/hooks/web/useMessage';
const formRef = ref();
const queryParam = reactive<any>({});
const toggleSearchStatus = ref<boolean>(false);
const registerModal = ref();
const userStore = useUserStore();
const isShowDM = ref(false)//是否展示标签库功能
const mainOrgCode = ref()//标准标签库编码
//注册table数据
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
tableProps: {
title: '长者标签',
api: list,
columns,
canResize: false,
useSearchForm: false,
actionColumn: {
width: 120,
fixed: 'right',
},
defSort: {
column: 'sort',
order: 'asc',
},
beforeFetch: async (params) => {
return Object.assign(params, queryParam);
},
},
exportConfig: {
name: "长者标签",
url: getExportUrl,
params: queryParam,
},
importConfig: {
url: getImportUrl,
success: handleSuccess
},
});
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
const labelCol = reactive({
xs: 24,
sm: 4,
xl: 6,
xxl: 4
});
const wrapperCol = reactive({
xs: 24,
sm: 20,
});
// 高级查询配置
const superQueryConfig = reactive(superQuerySchema);
/**
* 高级查询事件
*/
function handleSuperQuery(params) {
Object.keys(params).map((k) => {
queryParam[k] = params[k];
});
searchQuery();
}
/**
* 新增事件
*/
function handleAdd() {
registerModal.value.disableSubmit = false;
registerModal.value.add();
}
/**
* 编辑事件
*/
function handleEdit(record: Recordable) {
registerModal.value.disableSubmit = false;
registerModal.value.edit(record);
}
/**
* 详情
*/
function handleDetail(record: Recordable) {
registerModal.value.disableSubmit = true;
registerModal.value.edit(record);
}
/**
* 删除事件
*/
async function handleDelete(record) {
await deleteOne({ id: record.id }, handleSuccess);
}
/**
* 批量删除事件
*/
async function batchHandleDelete() {
await batchDelete({ ids: selectedRowKeys.value }, handleSuccess);
}
/**
* 成功回调
*/
function handleSuccess() {
(selectedRowKeys.value = []) && reload();
}
/**
* 操作栏
*/
function getTableAction(record) {
return [
{
label: '详情',
onClick: handleDetail.bind(null, record),
}
];
}
/**
* 查询
*/
function searchQuery() {
reload();
}
/**
* 重置
*/
function searchReset() {
formRef.value.resetFields();
selectedRowKeys.value = [];
//刷新数据
reload();
}
/**
* 查看指令库
*/
function handleDirectiveMainOpen() {
registerModal.value?.openDM(mainOrgCode.value)
}
// 添加音频结束监听
onMounted(() => {
});
</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%;
}
}
</style>

567
src/views/synchronization/eldertag/eldertag/components/ElderTagChooseCom.vue Normal file
View File

@ -0,0 +1,567 @@
<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="5">
<a-form-item name="instructionTagId">
<template #label><span title="分类标签">分类标签</span></template>
<j-dict-select-tag v-model:value="queryParam.instructionTagId" :disabled="!showJSCom"
:orgCode="sourceOrgInfo?.orgCode"
:dictCode="`nu_config_service_instruction_tag,instruction_name,id,del_flag = 0 and iz_enabled = 0 order by sort asc`"
placeholder="请选择分类标签" allowClear :ignoreDisabled="true" @select="reload()" />
<!-- <span v-else>请选择源平台</span> -->
</a-form-item>
</a-col>
<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" :disabled="!showJSCom"
:orgCode="sourceOrgInfo?.orgCode"
:dictCode="`nu_config_service_category,category_name,id,del_flag = 0 and iz_enabled = 0 and instruction_id = '${queryParam.instructionTagId || ''}' order by sort asc`"
placeholder="请选择服务类别" allowClear :ignoreDisabled="true" @select="reload()" />
</a-form-item>
</a-col>
<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" :disabled="!showJSCom"
:orgCode="sourceOrgInfo?.orgCode"
:dictCode="`nu_config_service_type,type_name,id,del_flag = 0 and iz_enabled = 0 and category_id = '${queryParam.categoryId || ''}' order by sort asc`"
placeholder="请选择服务类型" allowClear :ignoreDisabled="true" @select="reload()" />
</a-form-item>
</a-col>
<a-col :lg="5">
<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' and iz_enabled = 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' and iz_enabled = 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="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> -->
<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="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-divider type="vertical" style="background-color: #CDCDCF;margin-left:5px;margin-right:10px;" />
<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>
<a-divider type="vertical" style="background-color: #CDCDCF;margin-left:10px;margin-right:10px;" />
<a-button type="primary" @click="selectAll" size="small">一键全选</a-button>
<BasicTable @register="registerTable" :dataSource="leftList" size="small" :rowClassName="rowClassName"
: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'">
<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 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 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;margin-left:5px;margin-right:10px;" />
<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;margin-left:10px;margin-right:10px;" />
<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 bordered
: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: 15, total: targetType == 'needsync' ? rightNeedAddList.length :rightSourceList.length, showSizeChanger: true, pageSizeOptions: ['15', '50', '70', '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, 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 rightSourceList = ref<any[]>([]); // 右侧列表已同步的数据
const rightNeedAddList = ref<any[]>([]); // 右侧列表待同步的数据
const sourceOrgInfo = ref({})//源数据机构信息
const sourceType = ref('all')//源平台列表单选
const targetType = ref('needsync')//目标平台列表单选
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();
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,
canResize: false,
useSearchForm: false,
showIndexColumn: true,
showTableSetting: false,
immediate: false,
pagination: {
current: 1,
pageSize: 15,
pageSizeOptions: ['15', '50', '70', '100'],
},
beforeFetch: async (params) => {
queryParam.izEnabled = '0'
return Object.assign(params, queryParam);
},
actionColumn: {
width: 60,
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
//初始化各参数
{
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
rightNeedAddList.value.push(record); // 将记录添加到右侧
leftList.value = leftList.value.filter(item => item.id !== record.id); // 从左侧移除
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); // 添加回左侧
rightNeedAddList.value = rightNeedAddList.value.filter(item => item.id !== record.id); // 从右侧移除
rightNeedAddList.value = [...rightNeedAddList.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 || [];
// 只添加没有选择的记录到右侧，并且不在rightSourceList中
const unselectedRecords = allRecords.filter(record =>
!selectedRecordIds.value.includes(record.id)
// && !rightSourceList.value.some(item => item.id === record.id)
);
if (unselectedRecords.length) {
// 把新记录推到右侧列表
rightNeedAddList.value.push(...unselectedRecords);
// 把新记录的 id 推入已选 id 列表
selectedRecordIds.value.push(...unselectedRecords.map(r => r.id));
// 刷新引用，确保视图更新
rightNeedAddList.value = [...rightNeedAddList.value];
selectedRecordIds.value = [...selectedRecordIds.value];
}
})
}
/**
* 全部移除，将右侧数据移回左侧
*/
function removeAll() {
rightNeedAddList.value = []; // 清空右侧列表
// selectedRecordIds.value = rightSourceList.value?.map(d => d.id)
selectedRecordIds.value = []
}
//源平台查看全部all/可同步unsel
function sourceTypeChanged(val_) {
if (val_.target.value == 'all') {
//全部
queryParam.excludeIds = null
} else {
//未选择
queryParam.excludeIds = selectedRecordIds.value.join(',')
}
reload()
}
//目标平台查看已有exist/待同步needsync
function targetTypeChanged(val_) {
}
watch(
() => queryParam.directiveName,
(newVal) => {
reload()
}
);
function controlShowJSCom() {
showJSCom.value = false
setTimeout(() => {
showJSCom.value = true
}, 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,
rightNeedAddList,
controlShowJSCom,
initTargetList,
cleanTargetSourceData,
syncFunc,
});
</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>

202
src/views/synchronization/eldertag/eldertag/components/ElderTagForm.vue Normal file
View File

@ -0,0 +1,202 @@
<template>
<a-spin :spinning="confirmLoading">
<JFormContainer :disabled="disabled">
<template #detail>
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol" name="ElderTagForm">
<a-row>
<a-col :span="24">
<a-form-item label="标签类型" v-bind="validateInfos.type" id="ElderTagForm-type" name="type">
<j-dict-select-tag v-model:value="formData.type" dictCode="elder_tag_type" placeholder="请选择标签类型"
allowClear :ignoreDisabled="true" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="标签名称" v-bind="validateInfos.tagName" id="ElderTagForm-tagName" name="tagName">
<a-input v-model:value="formData.tagName" placeholder="请输入标签名称" allow-clear></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="价格(元)" v-bind="validateInfos.price" id="ElderTagForm-price" name="price">
<a-input-number v-model:value="formData.price" placeholder="请输入价格" style="width: 100%" :min="0"
:max="99.99" :precision="2" @keydown="onPriceKeydown" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="图标" v-bind="validateInfos.pic" id="ElderTagForm-pic" name="pic">
<JImageUpload :fileMax="1" v-model:value="formData.pic"></JImageUpload>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="排序" v-bind="validateInfos.sort" id="ElderTagForm-sort" name="sort">
<a-input-number v-model:value="formData.sort" placeholder="请输入排序" style="width: 100%" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="是否启用" v-bind="validateInfos.izEnabled" id="ElderTagForm-izEnabled" name="izEnabled">
<j-dict-select-tag type='radio' v-model:value="formData.izEnabled" dictCode="iz_enabled"
placeholder="请选择是否启用"  allowClear />
</a-form-item>
</a-col>
</a-row>
</a-form>
</template>
</JFormContainer>
</a-spin>
</template>
<script lang="ts" setup>
import { ref, reactive, defineExpose, nextTick, defineProps, computed, onMounted } from 'vue';
import { defHttp } from '/@/utils/http/axios';
import { useMessage } from '/@/hooks/web/useMessage';
import { getValueType } from '/@/utils';
import { saveOrUpdate } from '../ElderTag.api';
import { Form } from 'ant-design-vue';
import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import JImageUpload from '/@/components/Form/src/jeecg/components/JImageUpload.vue';
const props = defineProps({
formDisabled: { type: Boolean, default: false },
formData: { type: Object, default: () => ({}) },
formBpm: { type: Boolean, default: true }
});
const onPriceKeydown = (e: KeyboardEvent) => {
const key = e.key;
// 放行控制键
if (['Backspace', 'Delete', 'ArrowLeft', 'ArrowRight', 'Tab'].includes(key)) return;
// 只能输数字和点
if (!/[\d.]/.test(key)) {
e.preventDefault();
return;
}
const input = e.target as HTMLInputElement;
const { value, selectionStart: s, selectionEnd: t } = input;
const next = value.slice(0, s!) + key + value.slice(t!);
// 整数最多2位，小数最多2位
if (!/^\d{0,2}(?:\.\d{0,2})?$/.test(next)) {
e.preventDefault();
}
};
const formRef = ref();
const useForm = Form.useForm;
const emit = defineEmits(['register', 'ok']);
const formData = reactive<Record<string, any>>({
id: '',
type: '',
tagName: '',
price: 0,
pic: '',
sort: 99,
izEnabled: '0',
});
const { createMessage } = useMessage();
const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 5 } });
const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
const confirmLoading = ref<boolean>(false);
//表单验证
const validatorRules = reactive({
type: [{ required: true, message: '请输入标签类型!' },],
tagName: [{ required: true, message: '请输入标签名称!' },],
price: [{ required: true, message: '请输入价格!' }, { pattern: /^(([0-9][0-9]*)|([0]\.\d{0,2}|[1-9][0-9]*\.\d{0,2}))$/, message: '请输入正确的金额!' },],
izEnabled: [{ required: true, message: '请输入是否启用!' },],
});
const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: false });
// 表单禁用
const disabled = computed(() => {
if (props.formBpm === true) {
if (props.formData.disabled === false) {
return false;
} else {
return true;
}
}
return props.formDisabled;
});
/**
* 新增
*/
function add() {
edit({});
}
/**
* 编辑
*/
function edit(record) {
nextTick(() => {
resetFields();
const tmpData = {};
Object.keys(formData).forEach((key) => {
if (record.hasOwnProperty(key)) {
tmpData[key] = record[key]
}
})
//赋值
Object.assign(formData, tmpData);
});
}
/**
* 提交数据
*/
async function submitForm() {
try {
// 触发表单验证
await validate();
} catch ({ errorFields }) {
if (errorFields) {
const firstField = errorFields[0];
if (firstField) {
formRef.value.scrollToField(firstField.name, { behavior: 'smooth', block: 'center' });
}
}
return Promise.reject(errorFields);
}
confirmLoading.value = true;
const isUpdate = ref<boolean>(false);
//时间格式化
let model = formData;
if (model.id) {
isUpdate.value = true;
}
//循环数据
for (let data in model) {
//如果该数据是数组并且是字符串类型
if (model[data] instanceof Array) {
let valueType = getValueType(formRef.value.getProps, data);
//如果是字符串类型的需要变成以逗号分割的字符串
if (valueType === 'string') {
model[data] = model[data].join(',');
}
}
}
await saveOrUpdate(model, isUpdate.value)
.then((res) => {
if (res.success) {
createMessage.success(res.message);
emit('ok');
} else {
createMessage.warning(res.message);
}
})
.finally(() => {
confirmLoading.value = false;
});
}
defineExpose({
add,
edit,
submitForm,
});
</script>
<style lang="less" scoped>
.antd-modal-form {
padding: 14px;
}
</style>

126
src/views/synchronization/eldertag/eldertag/components/ElderTagModal.vue Normal file
View File

@ -0,0 +1,126 @@
<template>
<a-drawer :title="title" width="50vw" v-model:visible="visible" :closable="true"
:footer-style="{ textAlign: 'right' }" @cancel="handleCancel">
<template #footer>
<a-button @click="handleCancel" style="margin-right: 8px;">关闭</a-button>
<a-button @click="handleOk" v-show="!disableSubmit">确认</a-button>
</template>
<ElderTagForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"></ElderTagForm>
</a-drawer>
</template>
<script lang="ts" setup>
import { ref, nextTick, defineExpose } from 'vue';
import ElderTagForm from './ElderTagForm.vue'
import JModal from '/@/components/Modal/src/JModal/JModal.vue';
import { useMessage } from '/@/hooks/web/useMessage';
import ElderTagRespositoryList from './ElderTagRespositoryList.vue'
import { syncElderTag } from '../ElderTag.api'
const mainOrgCode = ref('')
const dmRef = ref()
const title = ref<string>('');
const visible = ref<boolean>(false);
const disableSubmit = ref<boolean>(false);
const registerForm = ref();
const emit = defineEmits(['register', 'success']);
const dmVisible = ref(false)
const { createMessage, createConfirm } = useMessage();
const loading = ref(false)
function handleCancelDM() {
dmVisible.value = false
emit('success')
}
/**
* 新增
*/
function add() {
title.value = '新增';
visible.value = true;
nextTick(() => {
registerForm.value.add();
});
}
/**
* 编辑
* @param record
*/
function edit(record) {
title.value = disableSubmit.value ? '详情' : '编辑';
visible.value = true;
nextTick(() => {
registerForm.value.edit(record);
});
}
/**
* 确定按钮点击事件
*/
function handleOk() {
registerForm.value.submitForm();
}
/**
* form保存回调事件
*/
function submitCallback() {
handleCancel();
emit('success');
}
/**
* 取消按钮回调事件
*/
function handleCancel() {
visible.value = false;
}
function openDM(orgCode) {
dmVisible.value = true
mainOrgCode.value = orgCode
nextTick(() => {
dmRef.value?.init()
})
}
function handlePullDM() {
let selectedData = dmRef.value?.getSelectedIds()
if (!selectedData.count) {
createMessage.warning('未选择服务指令')
return
}
createConfirm({
iconType: 'warning',
title: '镜像确认',
content: '是否确认将<span style="font-weight:500;color:#efac0e;"> ' + selectedData.count + ' </span>条长者标签拉取到本平台？',
okText: '确认',
cancelText: '取消',
onOk: () => {
syncElderTag(mainOrgCode.value, { syncIds: selectedData.ids, })
createMessage.success('从标准标签库开始拉取')
// dmRef.value?.init()
handleCancelDM()
}
});
}
defineExpose({
add,
edit,
disableSubmit,
openDM
});
</script>
<style lang="less">
/**隐藏样式-modal确定按钮 */
.jee-hidden {
display: none !important;
}
</style>
<style lang="less" scoped></style>

146
src/views/synchronization/eldertag/orgCom/OrgListCom.vue Normal file
View File

@ -0,0 +1,146 @@
<template>
<div>
<a-row>
<a-col v-for="(item, index) 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" :xxxl="props.layout == 'full' ? 4 : 8"
:style="{ 'padding-right': ((index + 1) % 4 != 0) ? '14px' : '0px', 'padding-bottom': '14px' }">
<OrgCard :orgInfo="item" :layout="props.layout"
:is-selected="selectedOrgs.some(org => org.orgCode === item.orgCode)"
:is-directive-selected="directiveMainSelectedOrg?.orgCode === item.orgCode"
:is-elder-tag-main="etmOrg?.orgCode === item.orgCode" :show-detail="props.showDetail"
:clickable="props.showChoose || props.showDirectiveChoose" @click="handleCardClick" @detail="handleDetail" />
</a-col>
<a-col v-if="orgTableList.length == 0">
<div style="margin: 30px auto;">
<a-empty />
</div>
</a-col>
</a-row>
<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' && 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" />
</div>
</div>
</template>
<script setup lang="ts" name="synchronization-directive2">
import { ref, reactive, onMounted } from 'vue'
import { Pagination } from 'ant-design-vue'
import { getOrgInfo } from '/@/views/admin/orgapplyinfo/OrgApplyInfo.api'
import OrgCard from '/@/components/OrgCard/OrgCardCom.vue'
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' },
excludeOrgCode: { type: String, default: '' },
showDirectiveMain: { type: Boolean, default: false },
showDirectiveChoose: { type: Boolean, default: false },
showDMTip: { type: Boolean, default: false },
})
const emit = defineEmits(['handleOrgDetail', 'handleOrgChoose'])
const orgTableList = ref<any>({ records: [], total: 0 })
const queryParam = reactive<any>({})
const pageParams = ref({ pageNo: 1, pageSize: props.pageSize })
const directiveMainSelectedOrg = ref<any>(null)
const etmOrg = ref<any>('')
const selectedOrgs = ref<any[]>([])
function handleCardClick(item: any) {
if (props.showDirectiveChoose) {
directiveMainSelectedOrg.value = item
emit('handleOrgChoose', item)
}
if (props.showChoose) {
if (props.allowMultipleSelection) {
if (selectedOrgs.value.some(selected => selected.orgCode === item.orgCode)) {
selectedOrgs.value = selectedOrgs.value.filter(selected => selected.orgCode !== item.orgCode)
} else {
selectedOrgs.value.push(item)
}
} else {
selectedOrgs.value = [item]
}
}
}
function commitOrgsInfo() {
emit('handleOrgChoose', selectedOrgs.value)
}
function handleDetail(item: any) {
emit('handleOrgDetail', item)
}
function reload() {
directiveMainSelectedOrg.value = {}
queryParam.pageSize = pageParams.value.pageSize
queryParam.pageNo = pageParams.value.pageNo
queryParam.title = props.title
if (props.layout == 'half') {
queryParam.pageSize = -1
}
getOrgInfo(queryParam).then(res => {
res.records = res.records.filter(o => o.orgCode != props.excludeOrgCode)
orgTableList.value = res
if (props.showDirectiveChoose || props.showDMTip) {
const defaultSelected = res.records.find(item => item.izElderTagMain === '0')
if (defaultSelected) {
etmOrg.value = defaultSelected
emit('handleOrgChoose', defaultSelected)
}
}
})
}
function searchReset() {
queryParam.title = null
if (props.layout == 'half') {
queryParam.pageSize = -1
}
getOrgInfo(queryParam).then(res => {
res.records = res.records.filter(o => o.orgCode != props.excludeOrgCode)
orgTableList.value = res
})
}
function checkAllOrEmpty(isCheckAll = true) {
if (isCheckAll) {
orgTableList.value.records.forEach(item => {
if (!selectedOrgs.value.some(selected => selected.orgCode === item.orgCode)) {
selectedOrgs.value.push(item);
}
});
} else {
selectedOrgs.value = [];
}
emit('handleOrgChoose', selectedOrgs.value);
}
function resetSeleted(orgs: any[]) {
selectedOrgs.value = [...orgs]
}
onMounted(() => {
reload()
})
defineExpose({
reload,
searchReset,
selectedOrgs,
checkAllOrEmpty,
commitOrgsInfo,
resetSeleted
})
</script>

396
src/views/synchronization/eldertag/syncList.vue Normal file
View File

@ -0,0 +1,396 @@
<template>
<div class="p-2">
<!--查询区域-->
<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="title">
<template #label><span title="机构名称">机构名称</span></template>
<a-input placeholder="请输入机构名称" v-model:value="queryParam.title" allow-clear></a-input>
</a-form-item>
</a-col>
<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>
<a-col :lg="12" style="text-align: right;">
<a-button type="primary" preIcon="ant-design:cloud-sync-outlined" @click="handleJingxiang"
style="margin-right: 10px;">镜像</a-button>
<a-button type="primary" preIcon="ant-design:file-text-twotone" @click="handleViewLogs"
style="margin-right: 10px;">日志</a-button>
<a-button type="primary" preIcon="ant-design:safety-certificate-twotone" @click="handleElderTagMainFunc"
style="margin-right: 10px;">标准标签库</a-button>
<!-- <a-badge :count="609" style="margin-right: 10px;"> -->
<a-button type="primary" preIcon="ant-design:eye-outlined" style="margin-right: 10px;"
@click="handleLookNewDirectives">新增标签</a-button>
<!-- </a-badge> -->
</a-col>
</a-row>
</a-form>
</div>
<OrgListCom ref="orgListComRef" :title="queryParam.title" @handleOrgDetail="handleDetail" :showDetail=true
:showDMTip="true">
</OrgListCom>
<ElderTagModal ref="configServiceDirectiveListModal" />
<SyncStepListModal ref="syncStepListModal" />
<!-- <a-modal v-model:visible="logsVisible" title="日志" width="90vw"
:bodyStyle="{ height: '70vh', display: 'flex', flexDirection: 'column', overflow: 'auto' }"
wrapClassName="org-list-modal" @cancel="handleCancelLogs">
<a-row>
<a-col :span="2" :push="22" style="margin-top: 15px;margin-left: 60px;">
<a-button type="primary" @click="handleRefreshLogs" title="刷新">
刷新
</a-button>
</a-col>
</a-row>
<template #footer>
<a-button @click="handleCancelLogs" type="primary">关闭</a-button>
</template>
<AsyncListComponent ref="logsRef"></AsyncListComponent>
</a-modal> -->
<a-drawer title="日志" width="85vw" v-model:visible="logsVisible"
:bodyStyle="{ height: '70vh', display: 'flex', flexDirection: 'column', overflow: 'auto' }"
wrapClassName="org-list-modal" @cancel="handleCancelLogs">
<a-row style="overflow-x: hidden !important; background-color: white;">
<a-col :span="2" :push="22" style="margin-top: 18px;margin-left: 30px;">
<a-button type="primary" @click="handleRefreshLogs" title="刷新">
刷新
</a-button>
</a-col>
<a-col :span="24">
<AsyncListComponent ref="logsRef" :type="'elderTag'"></AsyncListComponent>
</a-col>
</a-row>
<template #footer>
<a-button @click="handleCancelLogs" type="primary" style="float:right;">关闭</a-button>
</template>
</a-drawer>
<!-- 标准指令库 -->
<a-drawer v-model:visible="elderTagMainVisible" title="标准指令库" width="85vw" :footer-style="{ textAlign: 'right' }"
:bodyStyle="{ height: '70vh', display: 'flex', flexDirection: 'column', overflow: 'auto' }"
wrapClassName="org-list-modal" @cancel="handleCancelelderTagMain">
<template #footer>
<a-button @click="handleCancelelderTagMain" type="primary" style="margin-right: 10px;">关闭</a-button>
<a-button @click="handleAsyncelderTagMain" type="primary">确认</a-button>
</template>
<OrgListCom ref="elderTagMainComRef" :showElderTagMain=true :showDirectiveChoose="true"
@handleOrgDetail="handleDetail" :showDetail=true @handleOrgChoose="elderTagMainFunc">
</OrgListCom>
</a-drawer>
<!-- 新增标签 -->
<a-drawer v-model:visible="newElderTagVisible" title="新增标签" width="85vw" :footer-style="{ textAlign: 'right' }"
:bodyStyle="{ height: '80vh', display: 'flex', flexDirection: 'column', overflow: 'auto' }"
wrapClassName="org-list-modal" @cancel="handleCancelNewElderTag">
<template #footer>
<a-button @click="handleCancelNewElderTag" type="primary">关闭</a-button>
</template>
<div style="padding:0px 8px;">
<CanAddElderTagList ref="canAddElderTagRef" :elderTagMainOrgInfo="elderTagMainOrgInfo" :existETIds="existETIds"
@refreshExistIds="refreshDMExistedIds"></CanAddElderTagList>
</div>
</a-drawer>
</div>
</template>
<script setup name="synchronization-directive2" lang="ts">
import { ref, reactive, computed, onMounted, watch } from 'vue'
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
// 以下为服务指令引用：
import { list, asyncFunc, departList } from '@/views/services/serviceDirective/ConfigServiceDirective.api';
import { Pagination } from 'ant-design-vue';
import ElderTagModal from '/@/views/synchronization/eldertag/eldertag/components/ElderTagModal.vue';
import SyncStepListModal from '/@/views/synchronization/eldertag/syncStep/SyncStepListModal.vue';
//机构信息
import { getOrgInfo } from '/@/views/admin/orgapplyinfo/OrgApplyInfo.api';
//机构列表
import OrgListCom from '/@/views/synchronization/eldertag/orgCom/OrgListCom.vue'
//可新增指令
import { useMessage } from '/@/hooks/web/useMessage';
import AsyncListComponent from '@/components/dataAsync/AsyncMainList0731.vue'
import { getElderTagMain, changeElderTagMain } from '/@/api/common/api'
import { idListByDS } from '/@/views/synchronization/eldertag/eldertag/ElderTag.api';
import CanAddElderTagList from '/@/views/synchronization/eldertag/canaddet/CanAddElderTagList.vue'
import { nextTick } from 'process';
const { createMessage } = useMessage()
const canAddElderTagRef = ref()
const newElderTagVisible = ref(false)
const elderTagMainComRef = ref();
const newDirectiveRef = ref()
const logsRef = ref()
const formRef = ref();
const configServiceDirectiveListModal = ref();
const syncStepListModal = ref();
const orgTableList = ref<any>([]);
const queryParam = reactive<any>({});
const pageParams = ref({ pageNo: 1, pageSize: 8 })
const orgListComRef = ref()
const logsVisible = ref(false)
const elderTagMainVisible = ref(false)
const { createConfirm } = useMessage();
const existETIds = ref([])//指令库已存在指令id
const elderTagMainOrgInfo = ref()
const labelCol = reactive({
xs: 24,
sm: 4,
xl: 6,
xxl: 4
});
const wrapperCol = reactive({
xs: 24,
sm: 20,
});
/**
* 镜像
*/
function handleJingxiang() {
syncStepListModal.value.init(null);
syncStepListModal.value.disableSubmit = true;
}
/**
* 详情
* @param record
*/
function handleDetail(record) {
configServiceDirectiveListModal.value.init(record);
configServiceDirectiveListModal.value.disableSubmit = true;
}
/**
* 查询
*/
function searchQuery() {
orgListComRef.value?.reload();
}
function reload() {
//刷新数据
queryParam.pageSize = pageParams.value.pageSize;
queryParam.pageNo = pageParams.value.pageNo;
getOrgInfo(queryParam).then(res => {
orgTableList.value = res;
});
}
/**
* 重置
*/
function searchReset() {
queryParam.title = null
orgListComRef.value?.searchReset()
}
/**
* 日志
*/
function handleViewLogs() {
logsVisible.value = true
handleRefreshLogs()
}
function handleLookNewDirectives() {
newElderTagVisible.value = true
refreshDMExistedIds(elderTagMainOrgInfo.value, true)
}
//关闭日志模态框
function handleCancelLogs() {
logsVisible.value = false
}
//刷新日志
function handleRefreshLogs() {
logsRef.value?.searchQuery()
}
/**
* 关闭新增指令
*/
function handleCancelNewElderTag() {
newElderTagVisible.value = false
}
/**
* 同步新增指令
*/
function handleAsyncNewDirective() {
// newDirectiveRef
}
/**
* 打开指令库
*/
function handleElderTagMainFunc() {
elderTagMainVisible.value = true
elderTagMainComRef.value?.reload();
}
/**
* 关闭指令库
*/
function handleCancelelderTagMain() {
elderTagMainVisible.value = false
}
//刷新已有指令库
function refreshDMExistedIds(dmOrgInfo, izReset = false, izQuery = true) {
idListByDS({ dataSourceCode: dmOrgInfo.orgCode }).then(res => {
existETIds.value = res.records
if (izReset) {
canAddElderTagRef.value?.searchReset()
} else {
canAddElderTagRef.value?.reload()
}
})
}
watch(elderTagMainOrgInfo, (newValue, oldValue) => {
refreshDMExistedIds(newValue)
}, { deep: true })
const tempDM = ref()
/**
* 指令库对应机构信息
*/
function elderTagMainFunc(orgInfo_) {
tempDM.value = orgInfo_
}
/**
* 确认指令库
*/
function handleAsyncelderTagMain() {
// createConfirm({
// iconType: 'warning',
// title: '指令库变更提醒',
// content: '是否变更指令库为：' + tempDM.value.departName,
// okText: '确认',
// cancelText: '取消',
// onOk: () => {
elderTagMainOrgInfo.value = tempDM.value
changeElderTagMain(elderTagMainOrgInfo.value.orgCode).then(() => {
createMessage.success('标准指令库已变更')
handleCancelelderTagMain()
canAddElderTagRef.value?.reload()
orgListComRef.value?.reload()
}).catch(() => {
createMessage.error('指令库变更失败，请稍后再试')
})
// }
// });
}
//获取指令库机构信息
function getElderTagMainOrgInfo() {
getElderTagMain().then(res => {
elderTagMainOrgInfo.value = res
})
}
// 自动请求并暴露内部方法
onMounted(() => {
reload();
getElderTagMainOrgInfo()
orgListComRef.value?.reload();
});
</script>
<style lang="less" scoped>
.jeecg-basic-table-form-container {
padding: 0;
margin-bottom: 18px;
.table-page-search-submitButtons {
display: block;
margin-bottom: 0px;
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: 18px;
height: 32px;
}
:deep(.ant-picker),
:deep(.ant-input-number) {
width: 100%;
}
}
.cardTitle {
background: #1ea0fa;
width: 100%;
margin: -28px -24px;
padding-top: 15px;
border-radius: 5px 5px 0px 0px;
color: white;
height: 55px;
display: block;
position: absolute;
}
.zxClass {
font-size: 12px;
background: linear-gradient(to right, #1ea0fa, #017de9);
border-radius: 8px;
height: 25px;
color: white;
line-height: 25px;
}
.lxClass {
font-size: 14px;
background: linear-gradient(to right, #cccccc, #cccccc);
border-radius: 8px;
height: 35px;
color: white;
line-height: 35px;
}
.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;
/* 限制文本为2行 */
overflow: hidden;
text-overflow: ellipsis;
}
.content-refresh-btn {
position: absolute;
top: 60px;
right: 20px;
z-index: 1;
}
</style>

432
src/views/synchronization/eldertag/syncStep/SyncStepList.vue Normal file
View File

@ -0,0 +1,432 @@
<template>
<div class="container2 jeecg-basic-table-form-container">
<div class="left">
<a-card class="top">
<div class="source-platform">
<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 :headStyle="{ height: '60px', padding: '0 24px' }" :bodyStyle="{ padding: '24px 24px 4px 24px' }">
<a-row style="font-weight: normal; margin-bottom: 12px;">
<a-col :span="18" style="font-size: 14px;">
<div>
<span style="font-weight: bold;">{{ orgInfo[0]?.departName }}</span>
</div>
</a-col>
<a-col :span="6" style="text-align: right;">
<div style="display: flex; align-items: center; justify-content: flex-end; gap: 8px;">
<div class="zxClass" style="min-width: 25px;">{{ orgInfo[0]?.orgCode }}</div>
</div>
</a-col>
</a-row>
<a-divider />
<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 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), 'org-card': true }"
:headStyle="{ height: '60px', padding: '0 24px' }" :bodyStyle="{ padding: '24px 24px 4px 24px' }"
@click="handleTargetOrgChange(orgItem)">
<a-row style="font-weight: normal; margin-bottom: 12px;">
<a-col :span="18" style="font-size: 14px;">
<div>
<span style="font-weight: bold;">{{ orgItem.departName }}</span>
</div>
</a-col>
<a-col :span="6" style="text-align: right;">
<div style="display: flex; align-items: center; justify-content: flex-end; gap: 8px;">
<div class="zxClass" style="min-width: 25px;">{{ orgItem.orgCode }}</div>
</div>
</a-col>
</a-row>
<a-divider />
<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="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="sourceOrgListVisible" title="请选择源平台" width="90vw"
:bodyStyle="{ padding: '14px', height: '70vh', display: 'flex', flexDirection: 'column', overflow: 'auto' }"
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"
:bodyStyle="{ padding: '14px', height: '70vh', display: 'flex', flexDirection: 'column', overflow: 'auto' }">
<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, nextTick, watch } from 'vue';
import OrgListCom from '/@/views/synchronization/eldertag/orgCom/OrgListCom.vue';
// import DirectiveChooseCom from '/@/views/synchronization/eldertag/serviceDirective/DirectiveChooseCom.vue'
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>();
const emit = defineEmits(['changeSyncText']);
// 显示机构列表弹窗
function showSourceOrgListModal() {
sourceOrgListComRef.value?.reload()
targetOrgListComRef.value?.reload()
sourceOrgListVisible.value = true;
}
// 显示机构列表弹窗
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?.init({ orgInfo: orgInfo.value[0] })
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;
}
});
}
emit('changeSyncText', val_.target.value)
}
//源平台机构变更确认
function handleGetSource() {
sourceOrgListComRef.value?.commitOrgsInfo()
handleCancelSource()
}
//目标平台机构变更确认
function handleGetTarget() {
targetOrgListComRef.value?.commitOrgsInfo()
handleCancelTarget()
}
function syncFunc() {
directiveChooseRef.value?.syncFunc()
}
defineExpose({
syncFunc
});
</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%;
}
}
.container2 {
display: flex;
margin: 1%;
max-height: 85vh;
}
.left {
display: flex;
flex-direction: column;
width: 18%;
margin-right: 1%;
}
.source-platform {
display: flex;
align-items: center;
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%;
}
.left .bottom {
flex: 1;
margin-bottom: 1%;
}
.right {
flex: 1;
width: 80%;
max-height: 85vh;
}
: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;
padding: 0 8px;
/* 增加内边距 */
flex-shrink: 0;
/* 防止被压缩 */
}
.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: 2;
overflow: hidden;
text-overflow: ellipsis;
}
.selected-card {
border: 2px solid #1890ff;
box-shadow: 0 0 8px rgba(24, 144, 255, 0.3);
}
.directive-selected-card {
border: 2px solid #1890FF;
box-shadow: 0 0 8px rgba(37, 149, 255, 0.3);
}
.org-card {
margin-top: 8px;
&:hover {
border-color: #55a9f8;
/* 这是悬停时的蓝色边框 */
box-shadow: 0 2px 8px rgba(37, 149, 255, 0.3);
/* 这是悬停时的淡蓝色阴影 */
}
}
:deep .ant-divider {
margin: 0 0 8px 0;
}
</style>

124
src/views/synchronization/eldertag/syncStep/SyncStepListModal.vue Normal file
View File

@ -0,0 +1,124 @@
<template>
<!-- <j-modal :title="title" :visible="visible" :fullscreen="true" width="100vw" :bodyStyle="{ padding: 0 }"
:maskClosable="false" :keyboard="false" wrapClassName="modal-fullscreen" @cancel="handleCancel">
<template #footer>
<a-button @click="handleCancel">关闭</a-button>
<a-button @click="handleSyncFunc">{{syncText}}</a-button>
<a-button @click="previousStep"
v-show="!!registerForm && (registerForm?.stepVal == 1 || registerForm?.stepVal == 2 || registerForm?.stepVal == 3)">上一步</a-button>
<a-button @click="nextStep"
v-show="!!registerForm && (registerForm?.stepVal == 0 || registerForm?.stepVal == 1 || registerForm?.stepVal == 2)">下一步</a-button>
<a-button @click="registerForm?.syncFunc" type="primary"
v-show="!!registerForm && registerForm?.stepVal == 3">确认</a-button>
</template>
<SyncStepList ref="registerForm" v-if="visible" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"
:fullscreen="true" style="height:100vh;" @closeModal="closeModal" @changeSyncText="changeSyncText"/>
</j-modal> -->
<a-drawer :title="title" width="100vw" v-model:visible="visible" :closable="true" :bodyStyle="{ padding: 0 }" :maskClosable="false" :keyboard="false"
:footer-style="{ textAlign: 'right' }" @close="handleCancel">
<SyncStepList ref="registerForm" v-if="visible" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"
:fullscreen="true" style="height:100vh;" @closeModal="closeModal" @changeSyncText="changeSyncText"/>
<template #footer>
<a-button @click="handleCancel" style="margin-right: 10px;">关闭</a-button>
<a-button @click="handleSyncFunc">{{syncText}}</a-button>
<a-button @click="previousStep"
v-show="!!registerForm && (registerForm?.stepVal == 1 || registerForm?.stepVal == 2 || registerForm?.stepVal == 3)">上一步</a-button>
<a-button @click="nextStep"
v-show="!!registerForm && (registerForm?.stepVal == 0 || registerForm?.stepVal == 1 || registerForm?.stepVal == 2)">下一步</a-button>
<a-button @click="registerForm?.syncFunc" type="primary"
v-show="!!registerForm && registerForm?.stepVal == 3">确认</a-button>
</template>
</a-drawer>
</template>
<script lang="ts" setup>
import { ref, nextTick, defineExpose, defineProps } from 'vue';
import SyncStepList from './SyncStepList.vue';
import JModal from '/@/components/Modal/src/JModal/JModal.vue';
const props = defineProps({
sysUrlValue: { type: String, default: '' },
});
const emit = defineEmits(['register', 'success']);
const title = ref<string>('');
const visible = ref<boolean>(false);
const disableSubmit = ref<boolean>(false);
const registerForm = ref<InstanceType<typeof SyncStepList>>();
const syncText = ref('同步')
function changeSyncText(v_){
if(v_ == 'one'){
syncText.value = '同步'
}else{
syncText.value = '批量同步'
}
}
function handleSyncFunc(){
registerForm.value?.syncFunc()
}
/**
* 编辑或初始化弹窗
*/
function init(record: any) {
title.value = '镜像';
visible.value = true;
nextTick(() => {
registerForm.value?.init(record);
});
}
/**
* 子组件提交完成回调
*/
function submitCallback() {
visible.value = false;
emit('success');
}
/**
* 上一步
*/
function previousStep() {
registerForm.value?.changeStepVal(false)
}
/**
* 下一步
*/
function nextStep() {
registerForm.value?.changeStepVal(true)
}
/**
* 取消按钮回调
*/
function handleCancel() {
visible.value = false;
}
function closeModal() {
visible.value = false;
}
defineExpose({
init,
disableSubmit,
});
</script>
<style lang="less" scoped>
.modal-fullscreen :deep(.ant-modal) {
max-width: 100vw !important;
width: 100vw !important;
top: 0 !important;
margin: 0 !important;
}
.modal-fullscreen :deep(.ant-modal-body) {
padding: 0 !important;
height: 100vh !important;
}
</style>