reactor:回访不满意原因重构;

src/views/statistics/department/detailHandleOrg.vue

@@ -1,40 +1,218 @@
 <template>
 	<div class="statistics-department-handle-container layout-padding">
-    <div class="layout-padding-auto layout-padding-view pd20">
-			<ProTable
-				ref="proTableRef"
-				:pagination="false"
-				:columns="columns"
-				:data="state.tableData"
-				@updateTable="queryList"
+		<div class="layout-padding-auto layout-padding-view pd20">
+			<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline>
+				<el-form-item label="来电主体" prop="TypeId">
+					<el-select v-model="state.queryParams.TypeId" placeholder="请选择来电主体" @change="handleQuery">
+						<el-option :value="0" label="全部" />
+						<el-option :value="1" label="市民" />
+						<el-option :value="2" label="企业" />
+					</el-select>
+				</el-form-item>
+				<el-form-item label="部门名称" prop="OrgName">
+					<el-input v-model="state.queryParams.OrgName" placeholder="部门名称" clearable @keyup.enter="handleQuery" class="keyword-input" />
+				</el-form-item>
+				<el-form-item>
+					<el-button type="primary" @click="handleQuery" :loading="state.loading"> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
+					<el-button @click="resetQuery(ruleFormRef)" class="default-button" :loading="state.loading">
+						<SvgIcon name="ele-Refresh" class="mr5" />重置
+					</el-button>
+				</el-form-item>
+			</el-form>
+			<vxe-toolbar
+				ref="toolbarRef"
 				:loading="state.loading"
-				show-summary
-				:summary-method="getSummaries"
-				:toolButton="['refresh', 'setting', 'exportAll']"
-				:exportMethod="departmentOrderOrgExport"
-				:exportParams="requestParams"
+				custom
+				:refresh="{
+					queryMethod: handleQuery,
+				}"
+				:tools="[{ toolRender: { name: 'exportAll' } }]"
 			>
-        <template #table-search>
-          <el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline>
-            <el-form-item label="来电主体" prop="TypeId">
-              <el-select v-model="state.queryParams.TypeId" placeholder="请选择来电主体" @change="handleQuery">
-                <el-option :value="0" label="全部" />
-                <el-option :value="1" label="市民" />
-                <el-option :value="2" label="企业" />
-              </el-select>
-            </el-form-item>
-            <el-form-item label="部门名称" prop="OrgName">
-              <el-input v-model="state.queryParams.OrgName" placeholder="部门名称" clearable @keyup.enter="handleQuery" class="keyword-input" />
-            </el-form-item>
-            <el-form-item>
-              <el-button type="primary" @click="handleQuery" :loading="state.loading"> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
-              <el-button @click="resetQuery(ruleFormRef)" class="default-button" :loading="state.loading">
-                <SvgIcon name="ele-Refresh" class="mr5" />重置
-              </el-button>
-            </el-form-item>
-          </el-form>
-        </template>
-			</ProTable>
+			</vxe-toolbar>
+			<div style="overflow: hidden; width: 100%; height: 100%; flex: 1">
+				<vxe-table
+					border
+					:loading="state.loading"
+					:data="state.tableData"
+					:column-config="{ resizable: true }"
+					:row-config="{ isCurrent: true, isHover: true, height: 30 }"
+					ref="tableRef"
+					height="auto"
+					auto-resize
+					show-overflow
+					:scrollY="{ enabled: true, gt: 0 }"
+					id="statisticsDepartmentDetailHandleOrg"
+					:custom-config="{
+						storage: true,
+					}"
+					showHeaderOverflow
+					:params="{ exportMethod: departmentOrderOrgExport, exportParams: requestParams }"
+					show-footer
+					:footer-method="footerMethod"
+				>
+					<vxe-column field="orgName" title="部门名称" min-width="200" fixed="left">
+						<template #default="scope">
+							<el-button type="primary" link @click="linkDetail(scope)">
+								{{ scope.row.orgName }}
+							</el-button>
+						</template>
+					</vxe-column>
+					<vxe-column field="orgTypeText" title="部门类别" min-width="100" fixed="left"> </vxe-column>
+					<vxe-column field="orderCountNum" title="信件总量" min-width="90" fixed="left"> </vxe-column>
+					<vxe-colgroup title="办件信息" align="center">
+						<vxe-column title="已办案件" field="ybOrderCountNum" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '0')">
+									{{ scope.row.ybOrderCountNum }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="在办案件" field="zbOrderCountNum" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '1')">
+									{{ scope.row.zbOrderCountNum }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="办结率" field="orderCompletionRate" min-width="100"> </vxe-column>
+						<vxe-column title="按时办结率" field="completeOnTimeRate" min-width="100"></vxe-column>
+					</vxe-colgroup>
+					<vxe-colgroup title="延期次数" align="center">
+						<vxe-column title="延期次数" field="orderDelayCount" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '2')">
+									{{ scope.row.orderDelayCount }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="延期率" field="orderDelayRate" min-width="100"></vxe-column>
+					</vxe-colgroup>
+					<vxe-colgroup title="超期信息" align="center">
+						<vxe-column title="已办超期" field="ybOverdue" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '3')">
+									{{ scope.row.ybOverdue }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="待办超期" field="zbOverdue" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '4')">
+									{{ scope.row.zbOverdue }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="会签已办超期" field="hqybOverdue" min-width="110">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '5')">
+									{{ scope.row.hqybOverdue }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="会签待办超期" field="hqzbOverdue" min-width="110">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '6')">
+									{{ scope.row.hqzbOverdue }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="超期件数" field="subtotalOverdue" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '7')">
+									{{ scope.row.subtotalOverdue }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="延期率" field="hqOverdueRate" min-width="100"></vxe-column>
+					</vxe-colgroup>
+					<vxe-colgroup title="会签信息" align="center">
+						<vxe-column title="会签已办" field="delayEnd" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '8')">
+									{{ scope.row.delayEnd }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="会签待办" field="delayWait" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '9')">
+									{{ scope.row.delayWait }}
+								</el-button>
+							</template>
+						</vxe-column>
+					</vxe-colgroup>
+					<vxe-colgroup title="归档信息" align="center">
+						<vxe-column title="待归档" field="toBeArchived" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '10')">
+									{{ scope.row.toBeArchived }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="已归档" field="archived" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '11')">
+									{{ scope.row.archived }}
+								</el-button>
+							</template>
+						</vxe-column>
+					</vxe-colgroup>
+					<vxe-colgroup title="发布信息" align="center">
+						<vxe-column title="待发布" field="waitPublished" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '12')">
+									{{ scope.row.waitPublished }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="公开件" field="publishedOpen" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '13')">
+									{{ scope.row.publishedOpen }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="不公开件" field="publishedNoOpen" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '14')">
+									{{ scope.row.publishedNoOpen }}
+								</el-button>
+							</template>
+						</vxe-column>
+					</vxe-colgroup>
+					<vxe-colgroup title="甄别件" align="center">
+						<vxe-column title="申请总量" field="screenCount" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '15')">
+									{{ scope.row.screenCount }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="待甄别" field="screenApproval" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '16')">
+									{{ scope.row.screenApproval }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="已同意" field="screenPass" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '17')">
+									{{ scope.row.screenPass }}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="未同意" field="screenNotPass" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '18')">
+									{{ scope.row.screenNotPass }}
+								</el-button>
+							</template>
+						</vxe-column>
+					</vxe-colgroup>
+					<vxe-column field="satisfactionRate" title="总满意率" min-width="100"> </vxe-column>
+				</vxe-table>
+			</div>
 		</div>
 	</div>
 </template>
@@ -43,363 +221,15 @@ import { onMounted, reactive, ref } from 'vue';
 import { FormInstance } from 'element-plus';
 import { departmentOrderOrg, departmentOrderOrgExport } from '@/api/statistics/department';
 import { useRoute, useRouter } from 'vue-router';
+import XEUtils from 'xe-utils';
 
 // 定义变量内容
 const ruleFormRef = ref<RefType>(); // 表单ref
-// ProTable 实例
-const proTableRef = ref<RefType>();
-
-// 表格配置项
-const columns = reactive<any[]>([
-	{
-		prop: 'orgName',
-		label: '部门名称',
-		align: 'center',
-		fixed: 'left',
-		minWidth: 200,
-		render: (scope) => {
-			return (
-				<el-button type="primary" link onClick={() => linkDetail(scope)}>
-					{scope.row.orgName}
-				</el-button>
-			);
-		},
-	},
-	{ prop: 'orgTypeText', label: '部门类别', align: 'center', fixed: 'left', minWidth: 100 },
-	{ prop: 'orderCountNum', label: '信件总量', align: 'center', fixed: 'left', minWidth: 90 },
-	{
-		prop: 'bjxx',
-		label: '办件信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'ybOrderCountNum',
-				label: '已办案件',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '0')}>
-							{scope.row.ybOrderCountNum}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'zbOrderCountNum',
-				label: '在办案件',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '1')}>
-							{scope.row.zbOrderCountNum}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'orderCompletionRate',
-				label: '办结率',
-				align: 'center',
-				minWidth: 90,
-			},
-			{
-				prop: 'completeOnTimeRate',
-				label: '按时办结率',
-				align: 'center',
-				minWidth: 120,
-			},
-		],
-	},
-	{
-		prop: 'yqcs',
-		label: '延期次数',
-		align: 'center',
-		_children: [
-			{
-				prop: 'orderDelayCount',
-				label: '延期次数',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '2')}>
-							{scope.row.orderDelayCount}
-						</el-button>
-					);
-				},
-			},
-			// { prop: 'b', label: '会签延期次数', align: 'center', minWidth: 120 },
-			{
-				prop: 'orderDelayRate',
-				label: '延期率',
-				align: 'center',
-				minWidth: 90,
-			},
-		],
-	},
-	{
-		prop: 'cqxx',
-		label: '超期信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'ybOverdue',
-				label: '已办超期',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '3')}>
-							{scope.row.ybOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'zbOverdue',
-				label: '待办超期',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '4')}>
-							{scope.row.zbOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'hqybOverdue',
-				label: '会签已办超期',
-				align: 'center',
-				minWidth: 120,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '5')}>
-							{scope.row.hqybOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'hqzbOverdue',
-				label: '会签待办超期',
-				align: 'center',
-				minWidth: 120,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '6')}>
-							{scope.row.hqzbOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'subtotalOverdue',
-				label: '超期件数',
-				align: 'center',
-				minWidth: 120,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '7')}>
-							{scope.row.subtotalOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'hqOverdueRate',
-				label: '超期率',
-				align: 'center',
-				minWidth: 90,
-			},
-		],
-	},
-	{
-		prop: 'hqxx',
-		label: '会签信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'delayWait',
-				label: '会签待办',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '9')}>
-							{scope.row.delayWait}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'delayEnd',
-				label: '会签已办',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '8')}>
-							{scope.row.delayEnd}
-						</el-button>
-					);
-				},
-			},
-		],
-	},
-	{
-		prop: 'gdxx',
-		label: '归档信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'toBeArchived',
-				label: '待归档',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '10')}>
-							{scope.row.toBeArchived}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'archived',
-				label: '已归档',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '11')}>
-							{scope.row.archived}
-						</el-button>
-					);
-				},
-			},
-		],
-	},
-	{
-		prop: 'fbxx',
-		label: '发布信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'waitPublished',
-				label: '待发布',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '12')}>
-							{scope.row.waitPublished}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'publishedOpen',
-				label: '公开件',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '13')}>
-							{scope.row.publishedOpen}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'publishedNoOpen',
-				label: '不公开件',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '14')}>
-							{scope.row.publishedNoOpen}
-						</el-button>
-					);
-				},
-			},
-		],
-	},
-	{
-		prop: 'zbj',
-		label: '甄别件',
-		align: 'center',
-		_children: [
-			{
-				prop: 'screenCount',
-				label: '申请总量',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '15')}>
-							{scope.row.screenCount}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'screenApproval',
-				label: '待甄别',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '16')}>
-							{scope.row.screenApproval}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'screenNotPass',
-				label: '未同意',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '18')}>
-							{scope.row.screenNotPass}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'screenPass',
-				label: '已同意',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '17')}>
-							{scope.row.screenPass}
-						</el-button>
-					);
-				},
-			},
-		],
-	},
-	{
-		prop: 'satisfactionRate',
-		label: '总满意率',
-		align: 'center',
-		minWidth: 90,
-	},
-]);
 const state = reactive({
 	queryParams: {
 		// 查询条件
 		OrgName: null, // 部门名称
-    TypeId:0
+		TypeId: 0,
 	},
 	tableData: [], //表单
 	loading: false, // 加载
@@ -426,7 +256,7 @@ const queryList = () => {
 		OrgName: state.queryParams.OrgName,
 		OrgCode,
 		isProvince,
-    TypeId:state.queryParams.TypeId
+		TypeId: state.queryParams.TypeId,
 	};
 	departmentOrderOrg(requestParams.value)
 		.then((res: any) => {
@@ -444,100 +274,17 @@ const resetQuery = (formEl: FormInstance | undefined) => {
 	formEl.resetFields();
 	queryList();
 };
-// 合计
-const getSummaries = (param: any) => {
-	const { columns } = param;
-	const sums: string[] = [];
-	columns.forEach((column: { property: string }, index: number) => {
-		if (index === 0) {
-			sums[index] = '合计';
-			return;
-		}
-		switch (column.property) {
-			case 'orgTypeText': // 部门类别
-				sums[index] = state.totalCount?.orgTypeText;
-				break;
-			case 'orderCountNum': // 信件总量
-				sums[index] = state.totalCount?.orderCountNum;
-				break;
-			case 'ybOrderCountNum': // 已办案件
-				sums[index] = state.totalCount?.ybOrderCountNum;
-				break;
-			case 'zbOrderCountNum': // 在办案件
-				sums[index] = state.totalCount?.zbOrderCountNum;
-				break;
-			case 'completeOnTimeRate': // 按时办结率
-				sums[index] = state.totalCount?.completeOnTimeRate;
-				break;
-			case 'orderCompletionRate': // 办结率
-				sums[index] = state.totalCount?.orderCompletionRate;
-				break;
-			case 'orderDelayCount': // 延期次数
-				sums[index] = state.totalCount?.orderDelayCount;
-				break;
-			case 'orderDelayRate': // 延期率
-				sums[index] = state.totalCount?.orderDelayRate;
-				break;
-			case 'ybOverdue': // 已办超期
-				sums[index] = state.totalCount?.ybOverdue;
-				break;
-			case 'zbOverdue': // 待办超期
-				sums[index] = state.totalCount?.zbOverdue;
-				break;
-			case 'hqybOverdue': // 会签已办超期
-				sums[index] = state.totalCount?.hqybOverdue;
-				break;
-			case 'hqzbOverdue': // 会签待办超期
-				sums[index] = state.totalCount?.hqzbOverdue;
-				break;
-			case 'subtotalOverdue': // 超期件数
-				sums[index] = state.totalCount?.subtotalOverdue;
-				break;
-			case 'hqOverdueRate': // 超期率
-				sums[index] = state.totalCount?.hqOverdueRate;
-				break;
-			case 'delayWait': // 会签待办
-				sums[index] = state.totalCount?.delayWait;
-				break;
-			case 'delayEnd': // 会签已办
-				sums[index] = state.totalCount?.delayEnd;
-				break;
-			case 'toBeArchived': // 待归档
-				sums[index] = state.totalCount?.toBeArchived;
-				break;
-			case 'archived': // 已归档
-				sums[index] = state.totalCount?.archived;
-				break;
-			case 'waitPublished': // 待发布
-				sums[index] = state.totalCount?.waitPublished;
-				break;
-			case 'publishedOpen': // 公开件
-				sums[index] = state.totalCount?.publishedOpen;
-				break;
-			case 'publishedNoOpen': // 不公开件
-				sums[index] = state.totalCount?.publishedNoOpen;
-				break;
-			case 'screenCount': // 甄别申请总量
-				sums[index] = state.totalCount?.screenCount;
-				break;
-			case 'screenApproval': // 待甄别
-				sums[index] = state.totalCount?.screenApproval;
-				break;
-			case 'screenNotPass': // 未同意
-				sums[index] = state.totalCount?.screenNotPass;
-				break;
-			case 'screenPass': // 已同意
-				sums[index] = state.totalCount?.screenPass;
-				break;
-			case 'satisfactionRate': // 总满意率
-				sums[index] = state.totalCount?.satisfactionRate;
-				break;
-			default:
-				sums[index] = '';
-				break;
-		}
-	});
-	return sums;
+// 计算合计
+const footerMethod = ({ columns, data }) => {
+	return [
+		columns.map((column: any, columnIndex: number) => {
+			if (columnIndex === 0) {
+				return '合计';
+			}
+			// 后端返回了数据集合 state.totalCount 所以不需要计算 直接进行赋值
+			return XEUtils.get(state.totalCount, column.property);
+		}),
+	];
 };
 // 查看详情
 const router = useRouter();
@@ -554,7 +301,7 @@ const linkDetail = (scope, key?: string) => {
 				OrgCode: scope.row.orgCode,
 				StatisticsType: key,
 				isProvince: routeQueryParams.isProvince,
-        ParentOrgCode:routeQueryParams.id,
+				ParentOrgCode: routeQueryParams.id,
 			},
 		});
 	} else {
@@ -566,12 +313,17 @@ const linkDetail = (scope, key?: string) => {
 				EndTime,
 				isProvince: routeQueryParams.isProvince,
 				id: scope.row.orgCode,
-        ParentOrgCode:routeQueryParams.id,
+				ParentOrgCode: routeQueryParams.id,
 			},
 		});
 	}
 };
+const toolbarRef = ref<RefType>();
+const tableRef = ref<RefType>();
 onMounted(() => {
 	queryList();
+	if (tableRef.value && toolbarRef.value) {
+		tableRef.value.connect(toolbarRef.value);
+	}
 });
 </script>

src/views/statistics/department/handle.vue

@@ -100,177 +100,164 @@
 					</vxe-column>
 					<vxe-column field="orgTypeText" title="部门类别" min-width="100" fixed="left">
 					</vxe-column>
-					<vxe-column field="total" title="信件总量" min-width="90" fixed="left">
+					<vxe-column field="orderCountNum" title="信件总量" min-width="90" fixed="left">
 					</vxe-column>
 					<vxe-colgroup title="办件信息" align="center">
-						<vxe-column title="已办案件" field="ybOrderCountNum">
+						<vxe-column title="已办案件" field="ybOrderCountNum" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope,'0')">
 									{{scope.row.ybOrderCountNum}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="在办案件" field="zbOrderCountNum">
+						<vxe-column title="在办案件" field="zbOrderCountNum" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope,'1')">
 									{{scope.row.zbOrderCountNum}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="办结率" field="orderCompletionRate">
+						<vxe-column title="办结率" field="orderCompletionRate" min-width="100">
 						</vxe-column>
-						<vxe-column title="按时办结率" field="completeOnTimeRate"></vxe-column>
+						<vxe-column title="按时办结率" field="completeOnTimeRate" min-width="100"></vxe-column>
 					</vxe-colgroup>
 					<vxe-colgroup title="延期次数" align="center">
-						<vxe-column title="延期次数" field="orderDelayCount">
+						<vxe-column title="延期次数" field="orderDelayCount" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '2')">
 									{{scope.row.orderDelayCount}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="延期率" field="orderDelayRate"></vxe-column>
+						<vxe-column title="延期率" field="orderDelayRate" min-width="100"></vxe-column>
 					</vxe-colgroup>
 					<vxe-colgroup title="超期信息" align="center">
-						<vxe-column title="已办超期" field="ybOverdue">
+						<vxe-column title="已办超期" field="ybOverdue" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '3')">
 									{{scope.row.ybOverdue}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="待办超期" field="zbOverdue">
+						<vxe-column title="待办超期" field="zbOverdue" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '4')">
 									{{scope.row.zbOverdue}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="会签已办超期" field="hqybOverdue">
+						<vxe-column title="会签已办超期" field="hqybOverdue" min-width="110">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '5')">
 									{{scope.row.hqybOverdue}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="超期件数" field="subtotalOverdue">
+						<vxe-column title="会签待办超期" field="hqzbOverdue" min-width="110">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '6')">
+									{{scope.row.hqzbOverdue}}
+								</el-button>
+							</template>
+						</vxe-column>
+						<vxe-column title="超期件数" field="subtotalOverdue" min-width="100">
+							<template #default="scope">
+								<el-button type="primary" link @click="linkDetail(scope, '7')">
 									{{scope.row.subtotalOverdue}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="延期率" field="hqOverdueRate"></vxe-column>
+						<vxe-column title="延期率" field="hqOverdueRate" min-width="100"></vxe-column>
 					</vxe-colgroup>
 					<vxe-colgroup title="会签信息" align="center">
-						<vxe-column title="会签待办" field="delayWait">
+						<vxe-column title="会签已办" field="delayEnd" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
-									{{scope.row.delayWait}}
+								<el-button type="primary" link @click="linkDetail(scope, '8')">
+									{{scope.row.delayEnd}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="会签已办" field="delayEnd">
+						<vxe-column title="会签待办" field="delayWait" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
-									{{scope.row.delayEnd}}
+								<el-button type="primary" link @click="linkDetail(scope, '9')">
+									{{scope.row.delayWait}}
 								</el-button>
 							</template>
 						</vxe-column>
 					</vxe-colgroup>
 					<vxe-colgroup title="归档信息" align="center">
-						<vxe-column title="待归档" field="toBeArchived">
+						<vxe-column title="待归档" field="toBeArchived" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '10')">
 									{{scope.row.toBeArchived}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="已归档" field="archived">
+						<vxe-column title="已归档" field="archived" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '11')">
 									{{scope.row.archived}}
 								</el-button>
 							</template>
 						</vxe-column>
 					</vxe-colgroup>
 					<vxe-colgroup title="发布信息" align="center">
-						<vxe-column title="待发布" field="waitPublished">
+						<vxe-column title="待发布" field="waitPublished" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '12')">
 									{{scope.row.waitPublished}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="公开件" field="publishedOpen">
+						<vxe-column title="公开件" field="publishedOpen" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '13')">
 									{{scope.row.publishedOpen}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="不公开件" field="publishedNoOpen">
+						<vxe-column title="不公开件" field="publishedNoOpen" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '14')">
 									{{scope.row.publishedNoOpen}}
 								</el-button>
 							</template>
 						</vxe-column>
 					</vxe-colgroup>
 					<vxe-colgroup title="甄别件" align="center">
-						<vxe-column title="申请总量" field="screenCount">
+						<vxe-column title="申请总量" field="screenCount" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '15')">
 									{{scope.row.screenCount}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="待甄别" field="screenApproval">
+						<vxe-column title="待甄别" field="screenApproval" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
+								<el-button type="primary" link @click="linkDetail(scope, '16')">
 									{{scope.row.screenApproval}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="未同意" field="screenNotPass">
+						<vxe-column title="已同意" field="screenPass" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
-									{{scope.row.screenNotPass}}
+								<el-button type="primary" link @click="linkDetail(scope, '17')">
+									{{scope.row.screenPass}}
 								</el-button>
 							</template>
 						</vxe-column>
-						<vxe-column title="已同意" field="screenPass">
+						<vxe-column title="未同意" field="screenNotPass" min-width="100">
 							<template #default="scope">
-								<el-button type="primary" link @click="linkDetail(scope)">
-									{{scope.row.screenPass}}
+								<el-button type="primary" link @click="linkDetail(scope, '18')">
+									{{scope.row.screenNotPass}}
 								</el-button>
 							</template>
 						</vxe-column>
 					</vxe-colgroup>
-					<vxe-column field="satisfactionRate" title="总满意率" min-width="100" fixed="left">
+					<vxe-column field="satisfactionRate" title="总满意率" min-width="100">
 					</vxe-column>
 				</vxe-table>
 			</div>
-			<ProTable
-				ref="proTableRef"
-				:pagination="false"
-				:columns="columns"
-				:data="state.tableData"
-				@updateTable="queryList"
-				:loading="state.loading"
-				show-summary
-				:summary-method="getSummaries"
-				:toolButton="['refresh', 'setting', 'exportAll']"
-				:exportMethod="departmentOrderExport"
-				:exportParams="requestParams"
-			>
-        <template #table-search>
-
-        </template>
-				<template #description>
-
-				</template>
-			</ProTable>
 		</div>
 	</div>
 </template>
@@ -287,352 +274,6 @@ import XEUtils from 'xe-utils';
 const StatisticalTime = defineAsyncComponent(() => import('@/components/StatisticalTime/index.vue')); // 日期类型选择组件
 // 定义变量内容
 const ruleFormRef = ref<RefType>(); // 表单ref
-
-// 表格配置项
-const columns = reactive<any[]>([
-	{
-		prop: 'orgName',
-		label: '部门名称',
-		align: 'center',
-		fixed: 'left',
-		minWidth: 200,
-		render: (scope) => {
-			return (
-				<el-button type="primary" link onClick={() => linkDetail(scope)}>
-					{scope.row.orgName}
-				</el-button>
-			);
-		},
-	},
-	{ prop: 'orgTypeText', label: '部门类别', align: 'center', fixed: 'left', minWidth: 100 },
-	{ prop: 'orderCountNum', label: '信件总量', align: 'center', fixed: 'left', minWidth: 90 },
-	{
-		prop: 'bjxx',
-		label: '办件信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'ybOrderCountNum',
-				label: '已办案件',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '0')}>
-							{scope.row.ybOrderCountNum}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'zbOrderCountNum',
-				label: '在办案件',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '1')}>
-							{scope.row.zbOrderCountNum}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'orderCompletionRate',
-				label: '办结率',
-				align: 'center',
-				minWidth: 90,
-			},
-			{
-				prop: 'completeOnTimeRate',
-				label: '按时办结率',
-				align: 'center',
-				minWidth: 120,
-			},
-		],
-	},
-	{
-		prop: 'yqcs',
-		label: '延期次数',
-		align: 'center',
-		_children: [
-			{
-				prop: 'orderDelayCount',
-				label: '延期次数',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '2')}>
-							{scope.row.orderDelayCount}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'orderDelayRate',
-				label: '延期率',
-				align: 'center',
-				minWidth: 90,
-			},
-		],
-	},
-	{
-		prop: 'cqxx',
-		label: '超期信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'ybOverdue',
-				label: '已办超期',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '3')}>
-							{scope.row.ybOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'zbOverdue',
-				label: '待办超期',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '4')}>
-							{scope.row.zbOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'hqybOverdue',
-				label: '会签已办超期',
-				align: 'center',
-				minWidth: 120,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '5')}>
-							{scope.row.hqybOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'hqzbOverdue',
-				label: '会签待办超期',
-				align: 'center',
-				minWidth: 120,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '6')}>
-							{scope.row.hqzbOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'subtotalOverdue',
-				label: '超期件数',
-				align: 'center',
-				minWidth: 120,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '7')}>
-							{scope.row.subtotalOverdue}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'hqOverdueRate',
-				label: '超期率',
-				align: 'center',
-				minWidth: 90,
-			},
-		],
-	},
-	{
-		prop: 'hqxx',
-		label: '会签信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'delayWait',
-				label: '会签待办',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '9')}>
-							{scope.row.delayWait}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'delayEnd',
-				label: '会签已办',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '8')}>
-							{scope.row.delayEnd}
-						</el-button>
-					);
-				},
-			},
-		],
-	},
-	{
-		prop: 'gdxx',
-		label: '归档信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'toBeArchived',
-				label: '待归档',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '10')}>
-							{scope.row.toBeArchived}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'archived',
-				label: '已归档',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '11')}>
-							{scope.row.archived}
-						</el-button>
-					);
-				},
-			},
-		],
-	},
-	{
-		prop: 'fbxx',
-		label: '发布信息',
-		align: 'center',
-		_children: [
-			{
-				prop: 'waitPublished',
-				label: '待发布',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '12')}>
-							{scope.row.waitPublished}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'publishedOpen',
-				label: '公开件',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '13')}>
-							{scope.row.publishedOpen}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'publishedNoOpen',
-				label: '不公开件',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '14')}>
-							{scope.row.publishedNoOpen}
-						</el-button>
-					);
-				},
-			},
-		],
-	},
-	{
-		prop: 'zbj',
-		label: '甄别件',
-		align: 'center',
-		_children: [
-			{
-				prop: 'screenCount',
-				label: '申请总量',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '15')}>
-							{scope.row.screenCount}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'screenApproval',
-				label: '待甄别',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '16')}>
-							{scope.row.screenApproval}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'screenNotPass',
-				label: '未同意',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '18')}>
-							{scope.row.screenNotPass}
-						</el-button>
-					);
-				},
-			},
-			{
-				prop: 'screenPass',
-				label: '已同意',
-				align: 'center',
-				minWidth: 90,
-				render: (scope) => {
-					return (
-						<el-button type="primary" link onClick={() => linkDetail(scope, '17')}>
-							{scope.row.screenPass}
-						</el-button>
-					);
-				},
-			},
-		],
-	},
-	{
-		prop: 'satisfactionRate',
-		label: '总满意率',
-		align: 'center',
-		minWidth: 90,
-	},
-]);
 const state = reactive<any>({
 	queryParams: {
 		// 查询条件
@@ -677,101 +318,6 @@ const resetQuery = (formEl: FormInstance | undefined) => {
 	statisticalTimeRef.value.reset();
 	queryList();
 };
-// 合计
-const getSummaries = (param: any) => {
-	const { columns } = param;
-	const sums: string[] = [];
-	columns.forEach((column: { property: string }, index: number) => {
-		if (index === 0) {
-			sums[index] = '合计';
-			return;
-		}
-		switch (column.property) {
-			case 'orgTypeText': // 部门类别
-				sums[index] = state.totalCount?.orgTypeText;
-				break;
-			case 'orderCountNum': // 信件总量
-				sums[index] = state.totalCount?.orderCountNum;
-				break;
-			case 'ybOrderCountNum': // 已办案件
-				sums[index] = state.totalCount?.ybOrderCountNum;
-				break;
-			case 'zbOrderCountNum': // 在办案件
-				sums[index] = state.totalCount?.zbOrderCountNum;
-				break;
-			case 'completeOnTimeRate': // 按时办结率
-				sums[index] = state.totalCount?.completeOnTimeRate;
-				break;
-			case 'orderCompletionRate': // 办结率
-				sums[index] = state.totalCount?.orderCompletionRate;
-				break;
-			case 'orderDelayCount': // 延期次数
-				sums[index] = state.totalCount?.orderDelayCount;
-				break;
-			case 'orderDelayRate': // 延期率
-				sums[index] = state.totalCount?.orderDelayRate;
-				break;
-			case 'ybOverdue': // 已办超期
-				sums[index] = state.totalCount?.ybOverdue;
-				break;
-			case 'zbOverdue': // 待办超期
-				sums[index] = state.totalCount?.zbOverdue;
-				break;
-			case 'hqybOverdue': // 会签已办超期
-				sums[index] = state.totalCount?.hqybOverdue;
-				break;
-			case 'hqzbOverdue': // 会签待办超期
-				sums[index] = state.totalCount?.hqzbOverdue;
-				break;
-			case 'subtotalOverdue': // 超期件数
-				sums[index] = state.totalCount?.subtotalOverdue;
-				break;
-			case 'hqOverdueRate': // 超期率
-				sums[index] = state.totalCount?.hqOverdueRate;
-				break;
-			case 'delayWait': // 会签待办
-				sums[index] = state.totalCount?.delayWait;
-				break;
-			case 'delayEnd': // 会签已办
-				sums[index] = state.totalCount?.delayEnd;
-				break;
-			case 'toBeArchived': // 待归档
-				sums[index] = state.totalCount?.toBeArchived;
-				break;
-			case 'archived': // 已归档
-				sums[index] = state.totalCount?.archived;
-				break;
-			case 'waitPublished': // 待发布
-				sums[index] = state.totalCount?.waitPublished;
-				break;
-			case 'publishedOpen': // 公开件
-				sums[index] = state.totalCount?.publishedOpen;
-				break;
-			case 'publishedNoOpen': // 不公开件
-				sums[index] = state.totalCount?.publishedNoOpen;
-				break;
-			case 'screenCount': // 甄别申请总量
-				sums[index] = state.totalCount?.screenCount;
-				break;
-			case 'screenApproval': // 待甄别
-				sums[index] = state.totalCount?.screenApproval;
-				break;
-			case 'screenNotPass': // 未同意
-				sums[index] = state.totalCount?.screenNotPass;
-				break;
-			case 'screenPass': // 已同意
-				sums[index] = state.totalCount?.screenPass;
-				break;
-			case 'satisfactionRate': // 总满意率
-				sums[index] = state.totalCount?.satisfactionRate;
-				break;
-			default:
-				sums[index] = '';
-				break;
-		}
-	});
-	return sums;
-};
 // 计算合计
 const footerMethod = ({ columns, data }) => {
 	return [
@@ -820,7 +366,12 @@ const onDetailList = () => {
 		path: '/statistics/department/detailHandleList',
 	});
 };
+const toolbarRef = ref<RefType>();
+const tableRef = ref<RefType>();
 onMounted(() => {
 	queryList();
+	if (tableRef.value && toolbarRef.value) {
+		tableRef.value.connect(toolbarRef.value);
+	}
 });
 </script>