服务指令同步（临时提交）

src/views/synchronization/directive/orgCom/OrgListCom.vue

@@ -3,7 +3,7 @@
     <a-row>
       <a-col v-for="item in orgTableList.records" :key="item.id" :xs="24" :sm="24" :md="12" :lg="12" :xl="8" :xxl="6"
         style="padding: 8px;">
-        <a-card :class="{ 'selected-card': selectedOrgCodes.includes(item.orgCode) }"
+        <a-card :class="{ 'selected-card': selectedOrgCodes.some(org => org.orgCode === item.orgCode) }"
           style="width: 100%; border-radius: 8px; " :headStyle="{ height: '60px', padding: '0 24px' }"
           :style="{ cursor: showChoose ? 'pointer' : 'default' }" :bodyStyle="{ padding: '24px 24px 4px 24px' }"
           @click="handleCardClick(item)">
@@ -13,8 +13,8 @@
                 <div>
                   <span style="font-weight: bold;">{{ item.departName }}</span>
                   <!-- 如果是已选择，显示"已选择" -->
-                  <span v-if="selectedOrgCodes.includes(item.orgCode)"
+                  <span style="color: green; font-size: 12px; margin-left: 8px;"
-                    style="color: green; font-size: 12px; margin-left: 8px;">已选择</span>
+                    v-if="selectedOrgCodes.some(org => org.orgCode === item.orgCode)">已选择</span>
                 </div>
               </a-col>
               <a-col :span="2" style="text-align: center; padding-top: 4px;">
@@ -82,16 +82,16 @@ function handleCardClick(item: any) {
   if (props.showChoose) { // 判断是否可以选择
     if (props.allowMultipleSelection) {
       // 多选模式：点击时添加或移除该卡片
-      if (selectedOrgCodes.value.includes(item.orgCode)) {
+      if (selectedOrgCodes.value.some(selected => selected.orgCode === item.orgCode)) {
-        selectedOrgCodes.value = selectedOrgCodes.value.filter(code => code !== item.orgCode)
+        selectedOrgCodes.value = selectedOrgCodes.value.filter(selected => selected.orgCode !== item.orgCode)
       } else {
-        selectedOrgCodes.value.push(item.orgCode)
+        selectedOrgCodes.value.push(item) // 将整个机构信息添加到选中项
       }
     } else {
       // 单选模式：直接选中该卡片
-      selectedOrgCodes.value = [item.orgCode]
+      selectedOrgCodes.value = [item] // 只保留当前选中的机构
     }
-    emit('handleOrgChoose', selectedOrgCodes.value)
+    emit('handleOrgChoose', selectedOrgCodes.value) // 传递完整的选中机构信息
   }
 }
 

src/views/synchronization/directive/serviceDirective/ConfigServiceDirective.data.ts

@@ -16,6 +16,7 @@ export const columns: BasicColumn[] = [
     title: '服务类别',
     align: 'center',
     dataIndex: 'categoryId_dictText',
+    width: 100,
     customCell: (record, index, column) => {
       if (record.categoryRowSpan != null) {
         return { rowSpan: record.categoryRowSpan };
@@ -26,6 +27,7 @@ export const columns: BasicColumn[] = [
     title: '服务类型',
     align: 'center',
     dataIndex: 'typeId_dictText',
+    width: 100,
     customCell: (record, index, column) => {
       if (record.typeRowSpan != null) {
         return { rowSpan: record.typeRowSpan };
@@ -98,18 +100,19 @@ export const columns: BasicColumn[] = [
     title: '周期类型',
     align: 'center',
     dataIndex: 'cycleType_dictText',
+    width: 100,
   },
   {
     title: '服务时长（分钟）',
     align: 'center',
     dataIndex: 'serviceDuration',
-    width: 135,
+    width: 80,
   },
   {
     title: '是否启用',
     align: 'center',
     dataIndex: 'izEnabled_dictText',
-    width: 100,
+    width: 80,
   },
 ];
 

src/views/synchronization/directive/serviceDirective/DirectiveChooseCom.vue

@@ -8,24 +8,27 @@
           <a-col :lg="6">
             <a-form-item name="instructionTagId">
               <template #label><span title="分类标签">分类标签</span></template>
-              <j-dict-select-tag v-model:value="queryParam.instructionTagId" dictCode="instruction_tag"
+              <j-dict-select-tag v-model:value="queryParam.instructionTagId"
-                :ignoreDisabled="true" placeholder="请选分类标签" allowClear />
+                :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"
-                :dictCode="`nu_config_service_category,category_name,id,del_flag = 0 order by sort asc`"
+                :dictCode="`nu_config_service_category,category_name,id,del_flag = 0 and instruction_id = '${queryParam.instructionTagId || ''}' order by sort asc`"
-                :ignoreDisabled="true" placeholder="请选择服务类别" allow-clear />
+                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"
-                :dictCode="`nu_config_service_type,type_name,id,del_flag = 0 and category_id = ${queryParam.categoryId || -1} order by sort asc`"
+                :dictCode="`nu_config_service_type,type_name,id,del_flag = 0 and category_id = '${queryParam.categoryId || ''}' order by sort asc`"
-                placeholder="请选择服务类型" :ignoreDisabled="true" allowClear />
+                placeholder="请选择服务类型" allowClear :ignoreDisabled="true" @select="reload()" />
             </a-form-item>
           </a-col>
           <a-col :lg="6">
@@ -54,22 +57,21 @@
             <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 />
+                :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:search-outlined" @click="searchQuery">查询</a-button>
                 <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset"
-                  style="margin-left: 8px">重置</a-button>
+                  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>
@@ -79,7 +81,11 @@
     <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;">源数据</a-tag>
+        <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>
@@ -102,7 +108,8 @@
       </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="columns" size="small" :scroll="{ y: '46vh' }">
+        <BasicTable :dataSource="rightList" :columns="columns" 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>
@@ -111,7 +118,7 @@
 </template>
 
 <script lang="ts" name="serviceDirective-configServiceDirective" setup>
-import { ref, reactive, onMounted } from 'vue';
+import { ref, reactive, onMounted, watch } from 'vue';
 import { BasicTable, TableAction } from '/@/components/Table';
 import { useListPage } from '/@/hooks/system/useListPage';
 import { columns, superQuerySchema } from './ConfigServiceDirective.data';
@@ -124,6 +131,8 @@ import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
 
 const leftList = ref<any[]>([]);  // 左侧列表的数据
 const rightList = ref<any[]>([]);  // 右侧列表的数据
+const sourceOrgInfo = ref({})//源数据机构信息
+const sourceType = ref('all')
 const selectedRecordIds = ref<string[]>([]);  // 存储已选择记录的 ID
 const formRef = ref();
 const queryParam = reactive<any>({});
@@ -185,7 +194,17 @@ function searchReset() {
 }
 
 function init(record) {
-  queryParam.dataSourceCode = record.orgCode;
+  sourceOrgInfo.value = record.orgInfo
+  //初始化各参数
+  {
+    rightList.value = []
+    leftList.value = []
+    selectedRecordIds.value = []
+    formRef.value.resetFields();
+    selectedRowKeys.value = [];
+    sourceType.value = 'all'
+  }
+  queryParam.dataSourceCode = record.orgInfo.orgCode;
   reload();
 }
 
@@ -221,18 +240,22 @@ function rowClassName(record: any) {
  */
 function selectAll() {
   listByDS({
-    dataSourceCode: queryParam.dataSourceCode,
+    ...queryParam,
     pageNo: 1,
     pageSize: -1,
-    instructionTagId: queryParam.instructionTagId,
-    categoryId: queryParam.categoryId,
-    typeId: queryParam.typeId,
-    directiveName: queryParam.directiveName,
-    izEnabled: queryParam.izEnabled
   }).then(res => {
-    rightList.value = [...res.records];  // 将所有左侧数据移至右侧
+    const allRecords = res.records || [];
-    leftList.value = [];
+    // 只添加没有选择的记录到右侧
-
+    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];
+    }
   })
 }
 
@@ -240,12 +263,31 @@ function selectAll() {
  * 全部移除，将右侧数据移回左侧
  */
 function removeAll() {
-  leftList.value = [...rightList.value];  // 将右侧数据移回左侧
   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()
+  }
+);
+
 defineExpose({
   init,
+  rightList,
 });
 </script>
 

src/views/synchronization/directive/syncStep/SyncStepList.vue

@@ -34,38 +34,54 @@
   <div v-show="stepVal === 2">
     <div style="margin: 10px 0 16px 100px; display: flex; align-items: center; font-size: 16px; color: #8B0000;">
       <InfoCircleOutlined style="color: #1890ff; margin-right: 6px;" />
-      <span>操作指引：</span>
+      <span>操作指引：1、如何选择：将需要同步的“服务指令”，通过“选择”或“一键全选”按钮添加至右侧“已选择”列表中,如需移除请点击“移除”或“全部移除”按钮。2、搜索区域可对左侧列表进行筛选。3、左侧列表上方“全部/未选择”可快速切换源数据列表，便于更清晰的查看需要处理的“服务指令”。</span>
     </div>
     <DirectiveChooseCom ref="directiveChooseRef"></DirectiveChooseCom>
   </div>
   <!-- 第四步：选择目标机构 -->
-  <div v-show="stepVal === 3">
+  <div v-show="stepVal === 3" style="overflow-x: hidden;">
     <div style="margin: 10px 0 16px 100px; display: flex; align-items: center; font-size: 16px; color: #8B0000;">
       <InfoCircleOutlined style="color: #1890ff; margin-right: 6px;" />
-      <span>1、操作指引：①选择：点击需要同步的业务机构卡片，选中目标平台。②编辑：点击页面右下角的“下一步”，进入指令编辑页面，编辑同步内容。2、详情按钮：可查看对应平台现有服务指令。</span>
+      <span>1、操作指引：1、如果选择：在右侧卡片中通过“点击卡片”选择需要同步“指令”的目标平台（可多选）。2、左侧列表为“待同步”服务指令。3、点击右下方“确认”按钮开始自动同步，同步只会将对应平台“未有”指令进行新增，不会改变其原有指令字段。</span>
     </div>
+    <a-row :gutter="24" style="padding-left: 20px;padding-right: 20px;">
+      <a-col :lg="12" :sm="24">
+        <!-- 引用表格 -->
+        <a-tag color="green" style="margin-left: 10px;margin-top: 10px;">已选择 {{ leftList?.length }} 条</a-tag>
+        <BasicTable :dataSource="leftList" :columns="columns" size="small" :scroll="{ y: '63vh' }"
+          :showIndexColumn="false"
+          :pagination="{ current: 1, pageSize: 50, total: leftList.length, showSizeChanger: true, pageSizeOptions: ['10', '20', '50', '100'] }">
+        </BasicTable>
+      </a-col>
+      <a-col :lg="12" :sm="24">
+        <a-tag color="green" style="margin-left: 10px;margin-top: 10px;">目标平台 - 已选择 3 个</a-tag>
         <OrgListCom class="step-content" ref="orgListComRef" :allowMultipleSelection="true" :showChoose="true"
           @handleOrgDetail="handleDetail" @handleOrgChoose="orgTargetChangedFunc" />
+      </a-col>
+    </a-row>
   </div>
   <ConfigServiceDirectiveListModal class="step-content" ref="configServiceDirectiveListModal" />
 </template>
 
 <script lang="ts" setup>
-import { ref, watch } from 'vue';
+import { ref, watch, toRaw } from 'vue';
 import { InfoCircleOutlined } from '@ant-design/icons-vue';
 import OrgListCom from '/@/views/synchronization/directive/orgCom/OrgListCom.vue';
 import ConfigServiceDirectiveListModal from '/@/views/synchronization/directive/serviceDirective/ConfigServiceDirectiveListModal.vue';
 import DirectiveChooseCom from '/@/views/synchronization/directive/serviceDirective/DirectiveChooseCom.vue'
 import { useMessage } from '/@/hooks/web/useMessage';
+import { columns } from '/@/views/synchronization/directive/serviceDirective/ConfigServiceDirective.data';
+import { BasicTable, TableAction } from '/@/components/Table';
 
 const stepVal = ref(0);
 const configServiceDirectiveListModal = ref();
 const orgInfo = ref([])
 const { createMessage } = useMessage();
 const directiveChooseRef = ref()
+const leftList = ref<any[]>([]);
 
 function init(record: any) {
-  console.log('init:', record);
+
 }
 
 function handleDetail(record: any) {
@@ -79,6 +95,16 @@ function changeStepVal(isAdd) {
       createMessage.warning('请选择源数据机构！');
       return
     }
+    if (stepVal.value == 2) {
+      if (toRaw(directiveChooseRef.value?.rightList).length == 0) {
+
+        createMessage.warning('请选择服务指令！');
+        return
+      } else {
+        leftList.value = [...directiveChooseRef.value?.rightList];
+      }
+    }
+
     stepVal.value = stepVal.value + 1
   } else {
     stepVal.value = stepVal.value - 1
@@ -96,9 +122,9 @@ function orgTargetChangedFunc(orgInfo_) {
 
 watch(
   () => stepVal.value,
-  (newstepVal) => {
+  (newstepVal, oldValue) => {
-    if (newstepVal == 2) {
+    if (newstepVal == 2 && oldValue == 1) {
-      directiveChooseRef?.value?.init({ orgCode: orgInfo.value[0] })
+      directiveChooseRef?.value?.init({ orgInfo: orgInfo.value[0] })
     }
   }
 );