style(inspectTask): 调整巡视整改表单标签列与查询列宽格式

- 查询筛选列 xl 4 6 加宽 - 新增编辑表单 labelCol 6/18 8/16 - 流程表单宽字段 labelCol 3/21 7/17 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-08-06 14:26:32 +08:00
parent 343b906c01
commit 1d1c8773c9
4 changed files with 97 additions and 10 deletions
@@ -4,22 +4,22 @@
    <div class="jeecg-basic-table-form-container">
      <a-form ref="formRef" @keyup.enter="reload" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
        <a-row :gutter="24">
-          <a-col :xl="4" :lg="6" :md="8" :sm="12">
+          <a-col :xl="6" :lg="6" :md="8" :sm="12">
            <a-form-item label="整改措施" name="improveMeasure">
              <JInput v-model:value="queryParam.improveMeasure" type="like" placeholder="请输入整改措施" allow-clear trim @change="reload" />
            </a-form-item>
          </a-col>
-          <a-col :xl="4" :lg="6" :md="8" :sm="12">
+          <a-col :xl="6" :lg="6" :md="8" :sm="12">
            <a-form-item label="分管所领导" name="chargeLeaderId">
              <DeptRoleUserSelectDropDown v-model:value="queryParam.chargeLeaderId" :deptId="PARTY_COMMITTEE_DEPT_ID" :roleId="CHARGE_LEADER_ROLE_ID" placeholder="请选择分管所领导" allow-clear style="width: 100%" @change="reload" />
            </a-form-item>
          </a-col>
-          <a-col :xl="4" :lg="6" :md="8" :sm="12">
+          <a-col :xl="6" :lg="6" :md="8" :sm="12">
            <a-form-item label="措施责任部门" name="measureResDept">
              <SzSelectDept v-model:value="queryParam.measureResDept" :multiple="true" checkStrictly allow-clear @change="reload" />
            </a-form-item>
          </a-col>
-          <a-col :xl="4" :lg="6" :md="8" :sm="12">
+          <a-col :xl="6" :lg="6" :md="8" :sm="12">
            <a-form-item name="bpmStatus" label="督办状态">
              <a-select v-model:value="bpmStatusFilter" placeholder="请选择" allow-clear @change="handleBpmStatusChange">
                <a-select-option value="1">未开始</a-select-option>
@@ -28,7 +28,7 @@
              </a-select>
            </a-form-item>
          </a-col>
-          <a-col :xl="4" :lg="6" :md="8" :sm="12">
+          <a-col :xl="6" :lg="6" :md="8" :sm="12">
            <span class="table-page-search-submitButtons">
              <a-button type="primary" preIcon="ant-design:search-outlined" @click="reload">查询</a-button>
              <a-button preIcon="ant-design:reload-outlined" style="margin-left: 8px" @click="searchReset">重置</a-button>
@@ -0,0 +1,87 @@
+# 巡视整改任务（inspectTask）页面格式调整与前端核查说明
+
+> 核对日期：2026-08-06
+> 核对范围：`src/views/dq/inspectTask/` 全部 Vue 组件（7 个）+ `DqInspectTask.api.ts` / `DqInspectTask.data.ts`
+> 核对方式：静态代码审查（项目 package.json 未配置 lint / vue-tsc 脚本，故采用逐文件人工核查 + 引用存在性校验），参照 `src/views/bg/xispeak/` 已完成的格式调整方案
+
+---
+
+## 一、格式调整记录（消除文字被输入框遮挡 / 对齐）
+
+### 1. `DqInspectTaskList.vue`（列表页 / 查询区）
+
+| 问题 | 调整 |
+|------|------|
+| 查询表单 4 个筛选列 + 按钮列均为 `:xl="4"`（约占 1/6 屏宽），「措施责任部门」6 字标签在窄 label 列内超宽（标签盒约 67px < 文字 84px），输入框被压缩 | 全部 5 列统一放宽为 `:xl="6"`（每行 4 个，按钮列换行），标签盒由约 67px 拓宽到约 100px，「措施责任部门」单行放下 |
+| 「整改措施」「分管所领导」「措施责任部门」「督办状态」均 ≤6 字 | 无需精简标签（与 xispeak 不同，xispeak 因有 10 字标签才精简） |
+| labelCol 为 `xl:6 / xxl:9` | 保持不动，放宽列后标签与输入框均有余量 |
+
+### 2. `DqInspectTaskForm.vue`（新增/编辑弹窗表单，弹窗宽 800）
+
+| 问题 | 调整 |
+|------|------|
+| 半行字段「是否需要党群领导审批」10 字标签约 140px，基准 `labelCol 6/18` 下标签盒仅约 90px，严重溢出换行 | 基准 `labelCol: span 6→8`、`wrapperCol: span 18→16`（8+16=24）；标签精简为 `需党群领导审批`（7 字 98px < 标签盒约 120px） |
+| 其余 6 字标签（措施责任部门/措施责任领导/整改交付成果/成效评价标准）原 84px 紧贴 90px 标签盒 | 放宽基准后单行有余量 |
+| 整行字段「具体问题」标签 4 字 | 全宽字段标签盒约 186px，无溢出，无需调整 |
+
+### 3. `DqInspectTaskBPMForm.vue`（流程表单）
+
+| 问题 | 调整 |
+|------|------|
+| 流程办理字段（是否办结 / 部门经办人）使用 `wideLabelCol span 3`，在任务办理页半行字段下标签盒窄，「部门经办人」5 字约 70px 贴边/溢出 | `wideLabelCol: span 3→7`，`wideWrapperCol: span 21→17`（7+17=24），与基准标签列 `span 7` 对齐 |
+| 基础信息区基准 `labelCol 7/17` 可容纳 ≤10 字标签（任务办理页较宽） | 保持不动 |
+
+### 4. 无需调整的文件
+
+- `DqInspectTaskModal.vue`（仅弹窗壳，宽 800，无表单布局）
+- `DqInspectTaskBPMFeedbackModal.vue`（反馈弹窗，宽 820）：标签最长 6 字（实际完成时间 84px < 半行标签盒约 106px）；整行 wide 字段（工作进展/监督意见/附件）最长 4 字，`wideLabelCol span 3` 标签盒约 93px 可容纳——无溢出，无需调整（与 xispeak 反馈弹窗不同，后者有 16 字证明材料标签才需放宽）
+- `DqInspectTaskFlowScheduleStartModal.vue`（流程调度弹窗，宽 720）：使用固定 120px 标签宽，最长标签 8 字「党群领导是否审批」112px 可容纳
+- `DqInspectTask.api.ts`、`DqInspectTask.data.ts`（无布局）
+
+---
+
+## 二、前端错误核查
+
+### 发现并修复 1 处（功能级）
+
+| 级别 | 文件 | 问题 | 处理 |
+|------|------|------|------|
+| 功能 | `DqInspectTaskList.vue` | 模板「导入」按钮 `@click="onImpportXls"` 拼写错误（双 p），脚本解构的是 `onImportXls`（单 p），点击会抛 `ReferenceError: onImpportXls is not defined` | 改为 `onImportXls`（全仓库其余 14 处均为单 p 写法） |
+
+### 引用存在性校验（全部通过）
+
+| 引用 | 校验结果 |
+|------|---------|
+| `ledgerColumns / dqInspectProgressColumns / superQuerySchema` | `DqInspectTask.data.ts` 存在 ✓ |
+| `ledgerList / deleteOne / batchDelete / getImportUrl / getExportUrl / getImportExcelByEasyExcelUrl / getCheckExcelByEasyExcelUrl / getExportXlsHeadersUrl / saveOrUpdate / statusStats / queryDataById / specificProblemOptions / queryDqInspectProgressListByMainId / saveBpmForm / saveSubApprove / setProcessVariable` | `DqInspectTask.api.ts` 均导出 ✓ |
+| `progressList / progressDelete`（`../inspectProgress/DqInspectProgress.api`）、`saveOrUpdate as progressSaveOrUpdate` | inspectProgress api 存在 ✓ |
+| `PARTY_COMMITTEE_DEPT_ID / CHARGE_LEADER_ROLE_ID / MEASURE_RES_LEADER_ROLE_ID / PARTY_MASSES_DEPT_ID / SDW_LEADER_ROLE_ID` | `src/constant/supervision/index.ts` 存在 ✓ |
+| `SzSelectDept / DeptRoleUserSelectDropDown / DeptRoleUserSelectRadioGroup / JInput / JSwitch / JDictSelectTag / JSelectDept / JSelectUser / SzDeptUserModal / JFormContainer / SUploadFile` | 均存在 ✓ |
+| `DqInspectProgressFeedbackViewModal.vue` | `src/views/dq/inspectProgress/components/` ✓ |
+| `TaskHandleInnerContent.vue` | `src/views/super/bpm/process/personalOffice/myHandleTask/content/` ✓ |
+| `useSelectNameResolver / useSubApproveUserResolver / buildDeptLeaderAssignReason / normalizeDeptNames` | `src/composables/` 均存在 ✓ |
+| `FlowScheduleStartModal / BusinessProcessListModal` | `src/components/semri/process/` 下存在 ✓ |
+| `initBpmFormData`（usePermission）、`showImportValidationErrors`、`dateUtil`、`startProcessSchedules` | 引用存在 ✓ |
+
+### 已核对、无异常
+
+- `DqInspectTaskBPMFeedbackModal.vue` 无 xispeak 反馈弹窗的 `mainId` 注入缺陷——本弹窗通过 `open(mainId, bpmProcessId)` 参数传值，不依赖 `inject('mainId')`，`unref` 未使用。
+- 各表单无 `value.format('YYYY-MM-DD')` 对 Date 调用的缺陷（xispeak FeedbackForm 存在该潜在 P2），全目录 grep `.format(` 无匹配。
+- 树形表格合并行（`calcLedgerRowSpan` / `calcGroupRowSpan`）、状态统计（`statusStats` / `fetchStatusStats`）、流程调度（`startProcessSchedules`）、导入校验（`handleCheckExcel` / `handleImportByTemplate` / `showImportValidationErrors`）回调均正常。
+
+### 发现但未改（P2 建议，不影响运行）
+
+| 文件 | 说明 |
+|------|------|
+| `DqInspectTaskBPMFeedbackModal.vue` | 3 处 `console.log` 调试输出（兜底查找/匹配成功/填充当前部门），建议后续清理 |
+| `DqInspectTaskForm.vue` | 1 处 `console.log('表单提交数据', values)` 调试输出，建议后续清理 |
+| `DqInspectTaskForm.vue` | 子表单 `dqInspectProgress` tab 及 `JVxeTable` / `dqInspectProgressTableRef` 相关代码整体被注释（预留），`getSubFormAndTableData` 的 `dqInspectProgress` 键当前空转 |
+
+---
+
+## 三、说明与假设
+
+1. 查询表单标签均 ≤6 字，本次仅放宽列宽即可消除遮挡，**未做标签文字精简**（与 xispeak 不同，xispeak 因含 10 字标签才精简）。唯一精简的标签是弹窗表单中 10 字的「是否需要党群领导审批」→「需党群领导审批」，完整语义由开关（j-switch）承载；BPM 流程表单因页面较宽保留完整标签，两处标签文字略有差异。
+2. 各弹窗 labelCol 调整依据弹窗声明宽度核算（DqInspectTaskModal=800、DqInspectTaskBPMFeedbackModal=820、DqInspectTaskFlowScheduleStartModal=720）。`DqInspectTaskForm` 基准统一为 `8/16`，可容纳 7 字标签单行显示；若后续弹窗被嵌入更窄容器，需再加大标签占比。
+3. `DqInspectTaskBPMFeedbackModal` 与 `DqInspectTaskBPMForm` 构成流程反馈链，均复用 `inspectProgress/DqInspectProgress.api` 的 `saveOrUpdate / list / deleteOne`；inspectTask 对 inspectProgress 的这 3 个函数和 FeedbackViewModal 组件存在活依赖。
+4. 项目未配置 lint/typecheck 脚本，本核对以静态审查为准；建议在开发环境实际打开列表页与弹窗目视复核一遍最终效果（可复用 `%TEMP%/pwverify` 的 Playwright 截图方案）。
@@ -269,8 +269,8 @@ import { buildDeptLeaderAssignReason, normalizeDeptNames } from '/@/composables/

  const labelCol = { xs: { span: 24 }, sm: { span: 7 } };
  const wrapperCol = { xs: { span: 24 }, sm: { span: 17 } };
-  const wideLabelCol = { xs: { span: 24 }, sm: { span: 3 } };
-  const wideWrapperCol = { xs: { span: 24 }, sm: { span: 21 } };
+  const wideLabelCol = { xs: { span: 24 }, sm: { span: 7 } };
+  const wideWrapperCol = { xs: { span: 24 }, sm: { span: 17 } };



@@ -123,7 +123,7 @@
              </a-form-item>
            </a-col>
            <a-col :span="12">
-              <a-form-item label="是否需要党群领导审批" v-bind="validateInfos.isNeedAppro" id="DqInspectTaskForm-isNeedAppro" name="isNeedAppro">
+              <a-form-item label="需党群领导审批" v-bind="validateInfos.isNeedAppro" id="DqInspectTaskForm-isNeedAppro" name="isNeedAppro">
                <j-switch v-model:value="formData.isNeedAppro" />
              </a-form-item>
            </a-col>
@@ -239,8 +239,8 @@ import { PARTY_COMMITTEE_DEPT_ID, CHARGE_LEADER_ROLE_ID as _CHARGE_LEADER_ROLE_I
        delFlag: '',
      });

-      const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 6 } });
-      const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 18 } });
+      const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 8 } });
+      const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });

      //表单验证
      const validatorRules = reactive({