集成删除相关流程按钮

src/views/bg/xispeak/BgXiSpeak.api.ts

@@ -166,3 +166,7 @@ export const setProcessVariable = (params) => {
 export const updateLaunchType = (params) => {
   return defHttp.post({ url: '/bg/xispeak/bgXiSpeak/edit', params }, { isTransformResponse: false });
 };
+
+export const withDrawXiSpeak = (params) => {
+  return defHttp.post({ url: '/bg/xispeak/bgXiSpeak/withDrawXiSpeak', params }, { joinParamsToUrl: true, isTransformResponse: false });
+};

src/views/bg/xispeak/BgXiSpeakList.vue

@@ -1,8 +1,6 @@
 <template>
-  <div class="erpNativeList">
+  <div>
-    <div class="content">
+    <BasicTable @register="registerTable" :expandedRowKeys="expandedRowKeys" @expand="handleExpand" @fetch-success="onFetchSuccess">
-      <!--引用表格-->
-      <BasicTable @register="registerTable" :expandedRowKeys="expandedRowKeys" @expand="handleExpand" @fetch-success="onFetchSuccess">
         <!--插槽:table标题-->
         <template #tableTitle>
           <a-button type="primary" v-auth="'bg.xispeak:bg_xi_speak:add'" @click="handleAdd" preIcon="ant-design:plus-outlined">新增</a-button>
@@ -30,15 +28,6 @@
           <super-query :config="superQueryConfig" @search="handleSuperQuery" />
         </template>
 
-        <!-- 自定义展开图标，完全复刻 Jeecg 原生树形效果 -->
-        <template #expandIcon="{ expanded, onExpand, record }">
-          <span v-if="record.hasChild === '1'" class="jeecg-tree-expand-icon" @click="(e) => onExpand(record, e)">
-            <!-- 用方块样式的加减号，和 Jeecg 原生一致 -->
-            <Icon :icon="expanded ? 'ant-design:minus-square-outlined' : 'ant-design:plus-square-outlined'" />
-          </span>
-          <span v-else class="jeecg-tree-expand-placeholder"></span>
-        </template>
-
         <!--操作栏-->
         <template #action="{ record }">
           <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
@@ -92,7 +81,6 @@
           </div>
         </template>
       </BasicTable>
-    </div>
     <!-- 表单区域 -->
     <BgXiSpeakModal ref="registerModal" @success="handleSuccess"></BgXiSpeakModal>
     <!-- 审批记录 -->
@@ -131,6 +119,7 @@
     updateLaunchType,
     saveOrUpdateDict,
     bgXiSpeakFeedbackList,
+    withDrawXiSpeak,
   } from './BgXiSpeak.api';
 
   const FLOW_CODE = 'dev_bg_xi_speak_001';
@@ -171,6 +160,7 @@
   const showSdwLeaderSelect = computed(() => queryParam.value.needSdwApproval === '1');
 
   const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
+    designScope: 'bg-xispeak-template',
     tableProps: {
       title: '习总书记重要讲话指示批示情况',
       api: list,
@@ -178,13 +168,7 @@
       canResize: false,
       useSearchForm: false,
       isTreeTable: true,
-      indentSize: 24, // 和 Jeecg 原生树形缩进保持一致
-      expandIconColumnIndex: 0,
       clickToRowSelect: true,
-      treeProps: {
-        children: 'children',
-        indent: 24, // 和 indentSize 保持一致，保证缩进对齐
-      },
       actionColumn: {
         width: 120,
         fixed: 'right',
@@ -195,7 +179,6 @@
       },
       afterFetch: (result) => {
         if (result && result.length > 0) {
-          // 为有子节点的记录设置 children（用于显示展开图标）
           result.forEach((item) => {
             if (item.hasChild == '1' && (!item.children || item.children.length === 0)) {
               item.children = [{ id: item.id + '_loadChild', name: 'loading...', isLoading: true }];
@@ -279,6 +262,16 @@
     await deleteBgXiSpeak({ id: record.id }, success);
   }
 
+  async function handleWithDraw(record) {
+    const res = await withDrawXiSpeak({ id: record.id });
+    if (res.success) {
+      createMessage.success(res.message || '删除流程成功');
+      reload();
+    } else {
+      createMessage.error(res.message || '删除流程失败');
+    }
+  }
+
   /**
    * 批量删除事件
    */
@@ -476,6 +469,15 @@
         label: '查询督办流程',
         onClick: handleQueryProcess.bind(null, record),
       },
+      {
+        label: '删除关联流程',
+        popConfirm: {
+          title: '确定删除该记录关联的所有运行中流程吗？',
+          confirm: handleWithDraw.bind(null, record),
+          placement: 'topLeft',
+        },
+        ifShow: !!record.bpmStatus && record.bpmStatus !== '1',
+      },
       {
         label: selectedFeedbackId.value === record.id ? '收起反馈信息' : '查看反馈',
         onClick: handleViewFeedback.bind(null, record),
@@ -755,199 +757,6 @@
 </script>
 
 <style lang="less" scoped>
-  .erpNativeList {
-    height: 100%;
-    padding: 16px;
-    background: #f5f7fa;
-
-    // 查询区域卡片
-    .search-card {
-      background: #fff;
-      border-radius: 8px;
-      padding: 20px 24px;
-      margin-bottom: 16px;
-      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
-      transition: box-shadow 0.3s ease;
-
-      &:hover {
-        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
-      }
-
-      :deep(.ant-form-item) {
-        margin-bottom: 0;
-      }
-
-      :deep(.ant-select),
-      :deep(.ant-picker) {
-        border-radius: 6px;
-      }
-    }
-
-    // 内容区域
-    .content {
-      background: #fff;
-      border-radius: 8px;
-      padding: 0;
-      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
-      overflow: hidden;
-    }
-
-    // 表格标题区域
-    :deep(.ant-table-title) {
-      padding: 16px 20px !important;
-      border-bottom: 1px solid #f0f0f0;
-      background: #fafafa;
-
-      .ant-btn {
-        height: 32px;
-        padding: 0 16px;
-        border-radius: 6px;
-        font-size: 13px;
-        margin-right: 8px;
-        border: none;
-        transition: all 0.2s ease;
-
-        &:hover {
-          transform: translateY(-1px);
-          box-shadow: 0 4px 12px rgba(24, 144, 255, 0.3);
-        }
-
-        &:active {
-          transform: translateY(0);
-        }
-      }
-
-      .ant-btn-primary {
-        background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%);
-
-        &:hover {
-          background: linear-gradient(135deg, #40a9ff 0%, #1890ff 100%);
-        }
-      }
-    }
-
-    // 表格样式优化
-    :deep(.ant-table-thead > tr > th) {
-      background: #fafafa;
-      font-weight: 600;
-      color: #333;
-      border-bottom: 1px solid #f0f0f0;
-      padding: 12px 16px;
-    }
-
-    :deep(.ant-table-tbody > tr > td) {
-      padding: 14px 16px;
-      border-bottom: 1px solid #f5f5f5;
-      transition: background 0.2s ease;
-    }
-
-    // 树形表格缩进样式，和 Jeecg 原生对齐
-    :deep(.ant-table-row) {
-      .ant-table-row-indent {
-        display: inline-block;
-        width: 24px; // 和 indentSize 保持一致
-        height: 1px;
-      }
-    }
-
-    :deep(.ant-table-tbody > tr:hover > td) {
-      background: #f5f7fa;
-    }
-
-    // Jeecg 原生风格的树形展开图标
-    :deep(.jeecg-tree-expand-icon) {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      width: 20px;
-      height: 20px;
-      margin-right: 6px;
-      cursor: pointer;
-      border-radius: 2px;
-      transition: all 0.2s;
-
-      &:hover {
-        background-color: #f0f0f0;
-      }
-
-      .anticon {
-        font-size: 14px;
-        color: #666;
-        transition: color 0.2s;
-      }
-
-      &:hover .anticon {
-        color: #1890ff;
-      }
-    }
-
-    :deep(.jeecg-tree-expand-placeholder) {
-      display: inline-block;
-      width: 20px;
-      height: 20px;
-      margin-right: 6px;
-    }
-
-    // 操作按钮样式
-    :deep(.ant-btn-link) {
-      padding: 4px 8px;
-      height: auto;
-      border-radius: 4px;
-
-      &:hover {
-        background: rgba(24, 144, 255, 0.1);
-      }
-    }
-
-    // 标签页样式
-    :deep(.ant-tabs) {
-      margin: 16px;
-
-      .ant-tabs-nav {
-        margin-bottom: 12px;
-      }
-
-      .ant-tabs-tab {
-        padding: 8px 0;
-        font-size: 14px;
-
-        &:hover {
-          color: #1890ff;
-        }
-      }
-
-      .ant-tabs-tab-active .ant-tabs-tab-btn {
-        color: #1890ff;
-        font-weight: 500;
-      }
-    }
-
-    // 下拉菜单样式
-    :deep(.ant-dropdown-menu-item) {
-      border-radius: 4px;
-      margin: 2px 4px;
-
-      &:hover {
-        background: #e6f7ff;
-      }
-    }
-
-    // 分页样式
-    :deep(.ant-pagination) {
-      padding: 16px 20px;
-      margin: 0 !important;
-      border-top: 1px solid #f0f0f0;
-      background: #fafafa;
-    }
-
-    // 搜索和重置按钮
-    :deep(.ant-form-item-with-search) {
-      display: flex;
-      justify-content: flex-end;
-      gap: 8px;
-    }
-  }
-
   .feedback-expand-table {
     margin: 4px 10px 12px 42px;
     padding: 12px 14px 14px;
@@ -955,7 +764,6 @@
     border: 1px solid #d6e8ff;
     border-left: 4px solid #1677ff;
     border-radius: 6px;
-    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
 
     .feedback-expand-header {
       display: flex;
@@ -991,13 +799,6 @@
       margin-left: 10px;
     }
 
-    .feedback-expand-desc {
-      color: #64748b;
-      font-size: 13px;
-      line-height: 22px;
-      white-space: nowrap;
-    }
-
     .feedback-expand-actions {
       display: flex;
       align-items: center;
@@ -1049,15 +850,4 @@
       }
     }
   }
-
-  // 响应式适配
-  @media (max-width: 768px) {
-    .erpNativeList {
-      padding: 12px;
-
-      .search-card {
-        padding: 16px;
-      }
-    }
-  }
 </style>