reactor:市州通用-回访待办、回访列表增加查询条件和导出功能;

src/api/business/publish.ts

@@ -22,6 +22,23 @@ export const publishedListFixed = (params: object) => {
 		params,
 	});
 };
+/**
+ * @description 工单已发布列表导出
+ * @param {any} data
+ */
+export const publishedListExport = (data: object) => {
+	return request(
+		{
+			url: `/api/v1/Order/publishedorder/export`,
+			method: 'post',
+			responseType: 'blob',
+			data,
+		},
+		{
+			reduce_data_format: false,
+		}
+	);
+};
 export const publishedListFixedCount = (params: object) => {
 	return request({
 		url: `/api/v1/Order/published/count`,

src/api/business/visit.ts

@@ -16,6 +16,20 @@ export const visitList = (params: object) => {
         paramsSerializer: (params:any) => qs.stringify(params)
     });
 };
+/**
+ * @description 工单回访列表导出
+ * @param {object} data
+ */
+export const visitListExport = (data: object) => {
+    return request({
+        url: `/api/v1/Order/visit/export`,
+        method: 'post',
+        data,
+        responseType: 'blob'
+    }, {
+        reduce_data_format: false
+    });
+};
 /**
  * @description 工单回访保存
  * @param data

src/api/todo/publish.ts

@@ -32,6 +32,23 @@ export const publishListFixed = (params: object) => {
 		params,
 	});
 };
+/**
+ * @description 工单发布列表--待办导出
+ * @param {any} data
+ */
+export const publishListExport = (data: any) => {
+	return request(
+		{
+			url: `/api/v1/Order/publishorder/export`,
+			method: 'post',
+			responseType: 'blob',
+			data,
+		},
+		{
+			reduce_data_format: false,
+		}
+	);
+};
 export const publishListFixedCount = (params: object) => {
 	return request({
 		url: `/api/v1/Order/publish/count`,

src/views/business/publish/index.vue

@@ -1,130 +1,62 @@
 <template>
 	<div class="business-publish-container layout-padding">
 		<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="Title">
-					<el-input v-model.trim="state.queryParams.Title" placeholder="工单标题" clearable @keyup.enter="handleQuery" class="keyword-input" />
-				</el-form-item>
-				<el-form-item label="工单编码" prop="No">
-					<el-input v-model.trim="state.queryParams.No" 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="drawer = true" class="default-button"> <SvgIcon name="ele-Search" class="mr5" />更多查询</el-button>
-				</el-form-item>
-			</el-form>
-			<vxe-toolbar
-				ref="toolbarRef"
-				:loading="state.loading"
-				custom
-				:refresh="{
-					queryMethod: handleQuery,
-				}"
-			>
-				<template #buttons>
-					<el-button type="primary" @click="onJbExport" :loading="state.loading" :disabled="isChecked"
+				<vxe-grid v-bind="gridOptions"  ref="gridRef" @checkbox-all="selectAllChangeEvent" @checkbox-change="selectChangeEvent">
+					<template #form>
+						<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline :disabled="gridOptions.loading">
+							<el-form-item label="工单标题" prop="Title">
+								<el-input v-model.trim="state.queryParams.Title" placeholder="工单标题" clearable @keyup.enter="handleQuery" class="keyword-input" />
+							</el-form-item>
+							<el-form-item label="工单编码" prop="No">
+								<el-input v-model.trim="state.queryParams.No" 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="drawer = true" class="default-button"> <SvgIcon name="ele-Search" class="mr5" />更多查询</el-button>
+							</el-form-item>
+						</el-form>
+					</template>
+					<template #toolbar_buttons>
+						<el-button type="primary" @click="onJbExport" :loading="state.loading" :disabled="isChecked"
 						><SvgIcon name="iconfont icon-daochu" class="mr5" />交办单导出<span v-if="checkTable.length">({{ checkTable.length }})</span>
-					</el-button>
-				</template>
-			</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, useKey: true }"
-					ref="tableRef"
-					@checkbox-all="selectAllChangeEvent"
-					@checkbox-change="selectChangeEvent"
-					height="auto"
-					auto-resize
-					show-overflow
-					:scrollY="{ enabled: true, gt: 100 }"
-					id="businessPublish"
-					:custom-config="{ storage: true }"
-				>
-					<vxe-column type="checkbox" width="60" align="center"></vxe-column>
-					<vxe-column field="order.expiredStatusText" title="超期状态" width="90" align="center">
-						<template #default="{ row }">
-							<span :class="'overdue-status-' + row.order?.expiredStatus" :title="row.order?.expiredStatusText"></span>
-						</template>
-					</vxe-column>
-					<vxe-column field="order.no" title="工单编码" width="140"></vxe-column>
-					<vxe-column field="order.isProvinceText" title="省/市工单" width="100"></vxe-column>
-					<vxe-column field="order.statusText" title="工单状态" width="100">
-						<template #default="{ row }">
-							<el-text type="danger" tag="b" v-if="[1, 2, 3, 9, 101, 102, 103, 104, 105, 200].includes(row.order.status)">{{ row.order.statusText }}</el-text>
-							<span v-else>{{ row.order.statusText }}</span>
-						</template>
-					</vxe-column>
-					<vxe-column field="order.title" title="工单标题" width="200">
-						<template #default="{ row }">
-							<order-detail :order="row.order" @updateList="queryList(true)">{{ row.order?.title }}</order-detail>
-						</template>
-					</vxe-column>
-					<vxe-column field="order.counterSignTypeText" title="是否会签" width="90"></vxe-column>
-					<vxe-column field="order.sourceChannel" title="来源渠道" width="100"></vxe-column>
-					<vxe-column field="order.acceptType" title="受理类型" width="100"></vxe-column>
-					<vxe-column field="order.acceptorName" title="受理人" width="120"></vxe-column>
-					<vxe-column field="order.hotspotName" title="热点分类" width="140"></vxe-column>
-					<vxe-column field="order.actualHandleOrgName" title="接办部门" width="140"></vxe-column>
-					<vxe-column field="publishMan" title="发布人" width="120"></vxe-column>
-					<vxe-column field="publishTime" title="发布时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.publishTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="order.filedTime" title="办结时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.order?.filedTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="order.startTime" title="受理时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.order?.startTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="lastModificationTime" title="更新时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.lastModificationTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="publishState" title="是否公开" width="120">
-						<template #default="{ row }">
-							<span>{{ row.publishState ? '公开' : '不公开' }}</span>
-						</template>
-					</vxe-column>
-					<vxe-column title="操作" fixed="right" width="160" align="center">
-						<template #default="{ row }">
-							<el-button
-								link
-								type="primary"
-								@click="editPublish(row)"
-								v-if="!row.order?.isProvince"
-								title="编辑发布"
-								v-auth="'business:publish:edit'"
-							>
-								编辑发布
-							</el-button>
-							<el-button link type="primary" @click="onCancelPublish(row)" title="取消发布" v-auth="'business:publish:cancel'"> 取消发布 </el-button>
-						</template>
-					</vxe-column>
-				</vxe-table>
-			</div>
-			<div class="flex-end" style="align-items: center">
-				<span v-loading="totalLoading" class="mr10">共 {{ totalCount }} 条</span>
-				<!--				sizes-->
-				<el-pagination
-					layout="prev, pager, next"
-					:total="state.total"
-					@current-change="handleCurrentChange"
-					:page-size="state.queryParams.PageSize"
-					:current-page="state.queryParams.PageIndex"
-					@size-change="handleSizeChange"
-					:disabled="state.loading"
-				/>
-			</div>
+						</el-button>
+					</template>
+					<template #statusText="{ row }">
+						<el-text type="danger" tag="b" v-if="[1, 2, 3, 9, 101, 102, 103, 104, 105, 200].includes(row.order?.status)">{{ row.order?.statusText }}</el-text>
+						<span v-else>{{ row.order?.statusText }}</span>
+					</template>
+					<template #order_detail="{ row }">
+						<order-detail :order="row.order" @updateList="queryList(true)">{{ row.order?.title }}</order-detail>
+					</template>
+					<template #action="{row}">
+						<el-button
+							link
+							type="primary"
+							@click="editPublish(row)"
+							v-if="!row.order?.isProvince"
+							title="编辑发布"
+							v-auth="'business:publish:edit'"
+						>
+							编辑发布
+						</el-button>
+						<el-button link type="primary" @click="onCancelPublish(row)" title="取消发布" v-auth="'business:publish:cancel'"> 取消发布 </el-button>
+					</template>
+					<template #pager>
+						<div class="flex-end" style="align-items: center">
+							<span v-loading="totalLoading" class="mr10">共 {{ totalCount }} 条</span>
+							<!--				sizes-->
+							<el-pagination
+								layout="prev, pager, next"
+								:total="state.total"
+								@current-change="handleCurrentChange"
+								:page-size="state.queryParams.PageSize"
+								:current-page="state.queryParams.PageIndex"
+								@size-change="handleSizeChange"
+								:disabled="state.loading"
+							/>
+						</div>
+					</template>
+				</vxe-grid>
 		</div>
 		<!--	更多查询	-->
 		<el-drawer v-model="drawer" title="更多查询" size="500px">
@@ -143,11 +75,20 @@
 						:default-time="defaultTimeStartEnd"
 					/>
 				</el-form-item>
+				<el-form-item label="来电主体" prop="IdentityType">
+					<el-select v-model="state.queryParams.IdentityType" placeholder="请选择来电主体" clearable @change="handleQuery">
+						<el-option :value="1" label="市民" />
+						<el-option :value="2" label="企业" />
+					</el-select>
+				</el-form-item>
 				<el-form-item label="来电号码" prop="FromPhone">
 					<el-input v-model.trim="state.queryParams.FromPhone" placeholder="来电号码" clearable @keyup.enter="handleQuery" />
 				</el-form-item>
+				<el-form-item label="一级部门" prop="OrgLevelOneName">
+					<el-input v-model="state.queryParams.OrgLevelOneName" placeholder="一级部门" clearable @keyup.enter="handleQuery" />
+				</el-form-item>
 				<el-form-item label="接办部门" prop="ActualHandleOrgName">
-					<el-input v-model="state.queryParams.ActualHandleOrgName" placeholder="请填写接办部门名称" clearable @keyup.enter="handleQuery" />
+					<el-input v-model="state.queryParams.ActualHandleOrgName" placeholder="接办部门" clearable @keyup.enter="handleQuery" />
 				</el-form-item>
 				<el-form-item label="受理类型" prop="AcceptType">
 					<el-select v-model="state.queryParams.AcceptType" placeholder="请选择受理类型" clearable @change="handleQuery">
@@ -203,8 +144,7 @@
 <script setup lang="tsx" name="businessPublish">
 import { computed, defineAsyncComponent, onMounted, reactive, ref } from 'vue';
 import { ElMessage, ElMessageBox, FormInstance } from 'element-plus';
-import { formatDate } from '@/utils/formatTime';
-import { cancelPublish, publishedListFixed, publishedListFixedCount } from '@/api/business/publish';
+import { cancelPublish, publishedListExport, publishedListFixed, publishedListFixedCount } from '@/api/business/publish';
 import { defaultTimeStartEnd, shortcuts } from '@/utils/constants';
 import Other from '@/utils/other';
 import { publishBaseInfo } from '@/api/todo/publish';
@@ -228,11 +168,125 @@ const state = reactive<any>({
 		fbTime: [], // 发布时间
 		StartTime: null,
 		EndTime: null,
+		IdentityType:null,
+		FromPhone:null,
+		OrgLevelOneName:null,
+		ActualHandleOrgName:null,
+		AcceptType:null,
+		Hotspot:null,
+		PublishName:null,
+		NameOrNo:null,
+		IsOverTime:null,
 	},
 	tableData: [], //表单
 	loading: false, // 加载
 	total: 0, // 总数
 });
+
+const requestParams = ref<EmptyObjectType>({});
+const gridOptions = reactive<any>({
+	loading: false,
+	border: true,
+	showOverflow: true,
+	columnConfig: {
+		resizable: true,
+	},
+	scrollY: {
+		enabled: true,
+		gt: 100,
+	},
+	toolbarConfig: {
+		zoom: true,
+		custom: true,
+		refresh: {
+			queryMethod: () => {
+				handleQuery();
+			},
+		},
+		tools: [{ toolRender: { name: 'exportCurrent' } }, { toolRender: { name: 'exportAll' } }],
+		slots: {
+			buttons: 'toolbar_buttons',
+		},
+	},
+	customConfig: {
+		storage: true,
+	},
+	id: 'businessPublish',
+	rowConfig: { isHover: true, height: 30, isCurrent: true, useKey: true },
+	height: 'auto',
+	columns: [
+		{ type: 'checkbox', width: 50, align: 'center' },
+		{
+			field: 'order.expiredStatusText',
+			title: '状态',
+			width: 60,
+			align: 'center',
+			slots: {
+				default: ({ row }) => {
+					return <span class={'overdue-status-' + row.order?.expiredStatus} title={row.order.expiredStatusText}></span>;
+				},
+			},
+		},
+		{ field: 'order.no', title: '工单编码', width: 140 },
+		{ field: 'order.isProvinceText', title: '省/市工单', width: 90 },
+		{
+			field: 'order.statusText',
+			title: '工单状态',
+			width: 110,
+			slots: {
+				default: 'statusText',
+			},
+		},
+		{
+			field: 'order.title',
+			title: '工单标题',
+			minWidth: 200,
+			slots: { default: 'order_detail' },
+		},
+
+		{ field: 'order.counterSignTypeText', title: '是否会签', width: 90 },
+		{ field: 'order.sourceChannel', title: '来源渠道', width: 110 },
+		{ field: 'order.acceptType', title: '受理类型', width: 110 },
+		{ field: 'order.acceptorName', title: '受理人', width: 120 },
+		{ field: 'order.hotspotName', title: '热点分类', width: 150 },
+		{ field: 'order.actualHandleOrgName', title: '接办部门', width: 140 },
+		{ field: 'publishMan', title: '发布人', width: 120 },
+		{
+			field: 'publishTime',
+			title: '发布时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'order.filedTime',
+			title: '办结时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'order.startTime',
+			title: '受理时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'lastModificationTime',
+			title: '更新时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{ field: 'publishStateText', title: '是否公开', width: 120 },
+		{ title: '操作', width: 160, fixed: 'right', align: 'center', slots: { default: 'action' } },
+	],
+	data: [],
+	params: {
+		exportMethod: publishedListExport,
+		exportParams: requestParams,
+	},
+	sortConfig: {
+		remote: true,
+	},
+});
 // 手动查询，将页码设置为1
 const handleQuery = () => {
 	state.queryParams.PageIndex = 1;
@@ -262,12 +316,12 @@ const handleSizeChange = (val: any) => {
 	}
 };
 /** 获取列表 */
-const requestParams = ref<EmptyObjectType>({});
 const totalCount = ref(0);
 const totalLoading = ref(false);
 const queryList = (isQuery: boolean = false) => {
 	return new Promise((resolve, reject) => {
 		state.loading = true;
+		gridOptions.loading = true;
 		requestParams.value = Other.deepClone(state.queryParams);
 		requestParams.value.CreationTimeStart = state.queryParams.slTime === null ? null : state.queryParams.slTime[0]; // 受理时间
 		requestParams.value.CreationTimeEnd = state.queryParams.slTime === null ? null : state.queryParams.slTime[1];
@@ -285,15 +339,18 @@ const queryList = (isQuery: boolean = false) => {
 					totalTable.value = res?.result;
 					state.total = totalTable.value.length;
 					state.tableData = getNeedArr(totalTable.value, state.queryParams.PageSize)[state.queryParams.PageIndex - 1]; //当前页的表格数据
+					gridOptions.data = state.tableData;
 					queryIndex.value = 1; // 请求完成之后，页码加一避免重复
 				} else {
 					if (res?.result.length) queryIndex.value++;
 					totalTable.value = totalTable.value.concat(res?.result);
 					state.total = totalTable.value.length;
 					state.tableData = getNeedArr(totalTable.value, state.queryParams.PageSize)[state.queryParams.PageIndex - 1]; //当前页的表格数据
+					gridOptions.data = state.tableData;
 				}
 				state.loading = false;
-				tableRef.value.clearCheckboxRow();
+				gridOptions.loading = false;
+				gridRef.value.clearCheckboxRow();
 				checkTable.value = [];
 				resolve(res);
 			})
@@ -311,7 +368,8 @@ const queryList = (isQuery: boolean = false) => {
 			.catch(() => {
 				state.loading = false;
 				totalLoading.value = false;
-				tableRef.value.clearCheckboxRow();
+				gridOptions.loading = false;
+				gridRef.value.clearCheckboxRow();
 				checkTable.value = [];
 				reject();
 			});
@@ -371,19 +429,19 @@ const onJbExport = () => {
 	const ids = checkTable.value.map((item: any) => item.order?.id);
 	exportAssignment(ids);
 };
-const tableRef = ref<RefType>();
 const checkTable = ref<EmptyArrayType>([]);
+const gridRef = ref<RefType>();
 const selectAllChangeEvent = ({ checked }) => {
-	if (tableRef.value) {
-		const records = tableRef.value.getCheckboxRecords();
+	if (gridRef.value) {
+		const records = gridRef.value.getCheckboxRecords();
 		checkTable.value = records;
 		console.log(checked ? '所有勾选事件' : '所有取消事件', records);
 	}
 };
 
 const selectChangeEvent = ({ checked }) => {
-	if (tableRef.value) {
-		const records = tableRef.value.getCheckboxRecords();
+	if (gridRef.value) {
+		const records = gridRef.value.getCheckboxRecords();
 		checkTable.value = records;
 		console.log(checked ? '勾选事件' : '取消事件', records);
 	}
@@ -391,13 +449,9 @@ const selectChangeEvent = ({ checked }) => {
 const isChecked = computed(() => {
 	return !Boolean(checkTable.value.length);
 });
-const toolbarRef = ref<RefType>();
 onMounted(() => {
 	queryList().then(() => {
 		getBaseInfo();
 	});
-	if (tableRef.value && toolbarRef.value) {
-		tableRef.value.connect(toolbarRef.value);
-	}
 });
 </script>

src/views/business/publish/todo.vue

@@ -1,134 +1,72 @@
 <template>
 	<div class="business-publish-todo-container layout-padding">
 		<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="QuerySelf" v-auth="'business:publish:todo:querySelf'">
-					<el-segmented
-						:options="[
-							{ label: '我的', value: 'true' },
-							{ label: '全部', value: 'false' },
-						]"
-						v-model="state.queryParams.QuerySelf"
-						@change="handleQuery"
-						:disabled="state.loading"
-					/>
-				</el-form-item>
-				<el-form-item label="省市工单" prop="fastSearch">
-					<el-segmented
-						:options="fastSearchOptions"
-						v-model="fastSearch"
-						@change="fastSearchChange"
-						:disabled="state.loading"
-					/>
-				</el-form-item>
-				<el-form-item label="工单标题" prop="Title">
-					<el-input v-model.trim="state.queryParams.Title" placeholder="工单标题" clearable @keyup.enter="handleQuery" class="keyword-input" />
-				</el-form-item>
-				<el-form-item label="工单编码" prop="No">
-					<el-input v-model.trim="state.queryParams.No" 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="drawer = true" class="default-button"> <SvgIcon name="ele-Search" class="mr5" />更多查询</el-button>
-				</el-form-item>
-			</el-form>
-			<vxe-toolbar
-				ref="toolbarRef"
-				:loading="state.loading"
-				custom
-				:refresh="{
-					queryMethod: handleQuery,
-				}"
-			>
-				<template #buttons>
+			<vxe-grid v-bind="gridOptions" ref="gridRef" @checkbox-all="selectAllChangeEvent" @checkbox-change="selectChangeEvent">
+				<template #form>
+					<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline :disabled="gridOptions.loading">
+						<el-form-item label="数据范围" prop="QuerySelf" v-auth="'business:publish:todo:querySelf'">
+							<el-segmented
+								:options="[
+									{ label: '我的', value: true },
+									{ label: '全部', value: false },
+								]"
+								v-model="state.queryParams.QuerySelf"
+								@change="handleQuery"
+								:disabled="state.loading"
+							/>
+						</el-form-item>
+						<el-form-item label="省市工单" prop="fastSearch">
+							<el-segmented :options="fastSearchOptions" v-model="fastSearch" @change="fastSearchChange" :disabled="state.loading" />
+						</el-form-item>
+						<el-form-item label="工单标题" prop="Title">
+							<el-input v-model.trim="state.queryParams.Title" placeholder="工单标题" clearable @keyup.enter="handleQuery" class="keyword-input" />
+						</el-form-item>
+						<el-form-item label="工单编码" prop="No">
+							<el-input v-model.trim="state.queryParams.No" 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="drawer = true" class="default-button"> <SvgIcon name="ele-Search" class="mr5" />更多查询</el-button>
+						</el-form-item>
+					</el-form>
+				</template>
+				<template #toolbar_buttons>
 					<el-button type="primary" @click="onJbExport" :loading="state.loading" :disabled="isChecked"
-						><SvgIcon name="iconfont icon-daochu" class="mr5" />交办单导出<span v-if="checkTable.length">({{checkTable.length}})</span>
+						><SvgIcon name="iconfont icon-daochu" class="mr5" />交办单导出<span v-if="checkTable.length">({{ checkTable.length }})</span>
 					</el-button>
 					<el-button type="primary" @click="publishMultiple" v-auth="'business:publish:todo:multiple'" :disabled="isChecked">
-						<SvgIcon name="iconfont icon-tianjiawenjian" class="mr5" />批量发布<span v-if="checkTable.length">({{checkTable.length}})</span>
+						<SvgIcon name="iconfont icon-tianjiawenjian" class="mr5" />批量发布<span v-if="checkTable.length">({{ checkTable.length }})</span>
 					</el-button>
 					<el-button type="primary" @click="onMigration" v-auth="'business:publish:todo:migration'" :disabled="isChecked">
-						<SvgIcon name="ele-Rank" class="mr5" />平级移动<span v-if="checkTable.length">({{checkTable.length}})</span>
+						<SvgIcon name="ele-Rank" class="mr5" />平级移动<span v-if="checkTable.length">({{ checkTable.length }})</span>
 					</el-button>
 				</template>
-			</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, useKey: true }"
-					ref="tableRef"
-					@checkbox-all="selectAllChangeEvent"
-					@checkbox-change="selectChangeEvent"
-					height="auto"
-					auto-resize
-					show-overflow
-					:scrollY="{ enabled: true, gt: 100 }"
-					id="businessPublishTodo"
-					:custom-config="{ storage: true }"
-				>
-					<vxe-column type="checkbox" width="60" align="center"></vxe-column>
-					<vxe-column field="expiredStatusText" title="超期状态" width="90" align="center">
-						<template #default="{ row }">
-							<span :class="'overdue-status-' + row.expiredStatus" :title="row.expiredStatusText"></span>
-						</template>
-					</vxe-column>
-					<vxe-column field="no" title="工单编码" width="140"></vxe-column>
-					<vxe-column field="isProvinceText" title="省/市工单" width="100"></vxe-column>
-					<vxe-column field="statusText" title="工单状态" width="100">
-						<template #default="{ row }">
-							<el-text type="danger" tag="b" v-if="[1, 2, 3, 9, 101, 102, 103, 104, 105, 200].includes(row.status)">{{ row.statusText }}</el-text>
-							<span v-else>{{ row.statusText }}</span>
-						</template>
-					</vxe-column>
-					<vxe-column field="title" title="工单标题" width="200">
-						<template #default="{ row }">
-							<order-detail :order="row" @updateList="queryList(true)">{{ row.title }}</order-detail>
-						</template>
-					</vxe-column>
-					<vxe-column field="sourceChannel" title="来源渠道" width="100"></vxe-column>
-					<vxe-column field="acceptType" title="受理类型" width="100"></vxe-column>
-					<vxe-column field="counterSignTypeText" title="是否会签" width="90"></vxe-column>
-					<vxe-column field="actualHandleOrgName" title="接办部门" width="140"></vxe-column>
-					<vxe-column field="hotspotName" title="热点分类" width="140"></vxe-column>
-					<vxe-column field="acceptorName" title="受理人" width="120"></vxe-column>
-					<vxe-column field="actualHandleTime" title="接办时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.actualHandleTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="startTime" title="受理时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.startTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="filedTime" title="办结时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.filedTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column title="操作" fixed="right" width="90" align="center">
-						<template #default="{ row }">
-							<el-button link type="primary" @click="publish(row)" title="发布工单" v-auth="'business:publish:todo:publish'"> 发布 </el-button>
-						</template>
-					</vxe-column>
-				</vxe-table>
-			</div>
-			<div class="flex-end" style="align-items: center">
-				<span v-loading="totalLoading" class="mr10">共 {{ totalCount }} 条</span>
-				<!--				sizes-->
-				<el-pagination
-					layout="prev, pager, next"
-					:total="state.total"
-					@current-change="handleCurrentChange"
-					:page-size="state.queryParams.PageSize"
-					:current-page="state.queryParams.PageIndex"
-					@size-change="handleSizeChange"
-					:disabled="state.loading"
-				/>
-			</div>
+				<template #statusText="{ row }">
+					<el-text type="danger" tag="b" v-if="[1, 2, 3, 9, 101, 102, 103, 104, 105, 200].includes(row.status)">{{ row.statusText }}</el-text>
+					<span v-else>{{ row.statusText }}</span>
+				</template>
+				<template #order_detail="{ row }">
+					<order-detail :order="row" @updateList="queryList(true)">{{ row.title }}</order-detail>
+				</template>
+				<template #action="{ row }">
+					<el-button link type="primary" @click="publish(row)" title="发布工单" v-auth="'business:publish:todo:publish'"> 发布 </el-button>
+				</template>
+				<template #pager>
+					<div class="flex-end" style="align-items: center">
+						<span v-loading="totalLoading" class="mr10">共 {{ totalCount }} 条</span>
+						<!--				sizes-->
+						<el-pagination
+							layout="prev, pager, next"
+							:total="state.total"
+							@current-change="handleCurrentChange"
+							:page-size="state.queryParams.PageSize"
+							:current-page="state.queryParams.PageIndex"
+							@size-change="handleSizeChange"
+							:disabled="state.loading"
+						/>
+					</div>
+				</template>
+			</vxe-grid>
 		</div>
 		<!-- 工单发布详情 -->
 		<order-publish ref="orderPublishRef" @updateList="queryList(true)" />
@@ -163,11 +101,20 @@
 						:default-time="defaultTimeStartEnd"
 					/>
 				</el-form-item>
+				<el-form-item label="来电主体" prop="IdentityType">
+					<el-select v-model="state.queryParams.IdentityType" placeholder="请选择来电主体" clearable @change="handleQuery">
+						<el-option :value="1" label="市民" />
+						<el-option :value="2" label="企业" />
+					</el-select>
+				</el-form-item>
 				<el-form-item label="来电号码" prop="FromPhone">
 					<el-input v-model.trim="state.queryParams.FromPhone" placeholder="来电号码" clearable @keyup.enter="handleQuery" />
 				</el-form-item>
+				<el-form-item label="一级部门" prop="OrgLevelOneName">
+					<el-input v-model="state.queryParams.OrgLevelOneName" placeholder="一级部门" clearable @keyup.enter="handleQuery" />
+				</el-form-item>
 				<el-form-item label="接办部门" prop="ActualHandleOrgName">
-					<el-input v-model="state.queryParams.ActualHandleOrgName" placeholder="请填写接办部门名称" clearable @keyup.enter="handleQuery" />
+					<el-input v-model="state.queryParams.ActualHandleOrgName" placeholder="接办部门" clearable @keyup.enter="handleQuery" />
 				</el-form-item>
 				<el-form-item label="受理类型" prop="AcceptType">
 					<el-select v-model="state.queryParams.AcceptType" placeholder="请选择受理类型" clearable @change="handleQuery">
@@ -231,8 +178,7 @@
 <script setup lang="tsx" name="businessPublishTodo">
 import { computed, defineAsyncComponent, onMounted, reactive, ref } from 'vue';
 import { ElMessage, ElMessageBox, FormInstance } from 'element-plus';
-import { formatDate } from '@/utils/formatTime';
-import { batchPublishOrder, publishBaseInfo, publishListFixed, publishListFixedCount } from '@/api/todo/publish';
+import { batchPublishOrder, publishBaseInfo, publishListExport, publishListFixed, publishListFixedCount } from '@/api/todo/publish';
 import { defaultTimeStartEnd, shortcuts } from '@/utils/constants';
 import { useThemeConfig } from '@/stores/themeConfig';
 import { storeToRefs } from 'pinia';
@@ -257,7 +203,7 @@ const state = reactive<any>({
 		FiledType: null, // 归档类型
 		IsCountersign: null, // 是否会签
 		Keyword: null, // 标题
-		QuerySelf: 'true', // 是否只查询自己的待发布工单
+		QuerySelf: true, // 是否只查询自己的待发布工单
 		IsProvinceOrder: null, // 是否省工单
 		Channel: null,
 		slTime: [],
@@ -266,11 +212,112 @@ const state = reactive<any>({
 		bjTime: [],
 		FiledTimeStart: null,
 		FiledTimeEnd: null,
+		IdentityType:null,
+		FromPhone:null,
+		OrgLevelOneName:null,
+		ActualHandleOrgName:null,
 	},
 	tableData: [], //表单
 	loading: false, // 加载
 	total: 0, // 总数
 });
+
+const requestParams = ref<EmptyObjectType>({});
+const gridOptions = reactive<any>({
+	loading: false,
+	border: true,
+	showOverflow: true,
+	columnConfig: {
+		resizable: true,
+	},
+	scrollY: {
+		enabled: true,
+		gt: 100,
+	},
+	toolbarConfig: {
+		zoom: true,
+		custom: true,
+		refresh: {
+			queryMethod: () => {
+				handleQuery();
+			},
+		},
+		tools: [{ toolRender: { name: 'exportCurrent' } }, { toolRender: { name: 'exportAll' } }],
+		slots: {
+			buttons: 'toolbar_buttons',
+		},
+	},
+	customConfig: {
+		storage: true,
+	},
+	id: 'businessPublishTodo',
+	rowConfig: { isHover: true, height: 30, isCurrent: true, useKey: true },
+	height: 'auto',
+	columns: [
+		{ type: 'checkbox', width: 50, align: 'center' },
+		{
+			field: 'expiredStatusText',
+			title: '状态',
+			width: 60,
+			align: 'center',
+			slots: {
+				default: ({ row }) => {
+					return <span class={'overdue-status-' + row.expiredStatus} title={row.expiredStatusText}></span>;
+				},
+			},
+		},
+		{ field: 'no', title: '工单编码', width: 140 },
+		{ field: 'isProvinceText', title: '省/市工单', width: 90 },
+		{
+			field: 'statusText',
+			title: '工单状态',
+			width: 110,
+			slots: {
+				default: 'statusText',
+			},
+		},
+		{
+			field: 'title',
+			title: '工单标题',
+			minWidth: 200,
+			slots: { default: 'order_detail' },
+		},
+		{ field: 'sourceChannel', title: '来源渠道', width: 110 },
+		{ field: 'acceptType', title: '受理类型', width: 110 },
+		{ field: 'counterSignTypeText', title: '是否会签', width: 90 },
+		{ field: 'actualHandleOrgName', title: '接办部门', width: 140 },
+		{ field: 'hotspotName', title: '热点分类', width: 150 },
+		{ field: 'acceptorName', title: '受理人', width: 120 },
+		{
+			field: 'actualHandleTime',
+			title: '接办时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'startTime',
+			title: '受理时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'filedTime',
+			title: '办结时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{ title: '操作', width: 90, fixed: 'right', align: 'center', slots: { default: 'action' } },
+	],
+	data: [],
+	params: {
+		exportMethod: publishListExport,
+		exportParams: requestParams,
+	},
+	sortConfig: {
+		remote: true,
+	},
+});
+
 const fastSearchOptions = ref([
 	{
 		value: 'all',
@@ -286,15 +333,17 @@ const fastSearchOptions = ref([
 	},
 ]);
 const fastSearch = ref('all'); // tab位置
-if(themeConfig.value.appScope === 'LuZhou'){
-	fastSearchOptions.value = [{
-		value: 'city',
-		label: '市工单',
-	},
+if (themeConfig.value.appScope === 'LuZhou') {
+	fastSearchOptions.value = [
+		{
+			value: 'city',
+			label: '市工单',
+		},
 		{
 			value: 'province',
 			label: '省工单',
-		},]
+		},
+	];
 	fastSearch.value = 'city';
 	state.queryParams.IsProvinceOrder = false;
 }
@@ -342,12 +391,12 @@ const handleSizeChange = (val: any) => {
 	}
 };
 /** 获取列表 */
-const requestParams = ref<EmptyObjectType>({});
 const totalCount = ref(0);
 const totalLoading = ref(false);
 const queryList = (isQuery: boolean = false) => {
 	return new Promise((resolve, reject) => {
 		state.loading = true;
+		gridOptions.loading = true;
 		requestParams.value = Other.deepClone(state.queryParams);
 		requestParams.value.CreationTimeStart = state.queryParams.slTime === null ? null : state.queryParams.slTime[0]; // 受理时间
 		requestParams.value.CreationTimeEnd = state.queryParams.slTime === null ? null : state.queryParams.slTime[1];
@@ -356,7 +405,7 @@ const queryList = (isQuery: boolean = false) => {
 		requestParams.value.FiledTimeEnd = state.queryParams.bjTime === null ? null : state.queryParams.bjTime[1];
 		Reflect.deleteProperty(requestParams.value, 'bjTime'); // 删除无用的参数
 		requestParams.value.QueryIndex = queryIndex.value; // 数据批次
-		if(isQuery) requestParams.value.QueryIndex = 0;
+		if (isQuery) requestParams.value.QueryIndex = 0;
 		publishListFixed(requestParams.value)
 			.then((res: any) => {
 				if (isQuery) {
@@ -365,15 +414,18 @@ const queryList = (isQuery: boolean = false) => {
 					totalTable.value = res?.result;
 					state.total = totalTable.value.length;
 					state.tableData = getNeedArr(totalTable.value, state.queryParams.PageSize)[state.queryParams.PageIndex - 1]; //当前页的表格数据
+					gridOptions.data = state.tableData;
 					queryIndex.value = 1; // 请求完成之后，页码加一避免重复
 				} else {
 					if (res?.result.length) queryIndex.value++;
 					totalTable.value = totalTable.value.concat(res?.result);
 					state.total = totalTable.value.length;
 					state.tableData = getNeedArr(totalTable.value, state.queryParams.PageSize)[state.queryParams.PageIndex - 1]; //当前页的表格数据
+					gridOptions.data = state.tableData;
 				}
 				state.loading = false;
-				tableRef.value.clearCheckboxRow();
+				gridOptions.loading = false;
+				gridRef.value.clearCheckboxRow();
 				checkTable.value = [];
 				resolve(res);
 			})
@@ -391,7 +443,8 @@ const queryList = (isQuery: boolean = false) => {
 			.catch(() => {
 				state.loading = false;
 				totalLoading.value = false;
-				tableRef.value.clearCheckboxRow();
+				gridOptions.loading = false;
+				gridRef.value.clearCheckboxRow();
 				checkTable.value = [];
 				reject();
 			});
@@ -404,11 +457,11 @@ const drawer = ref(false);
 const resetQuery = (formEl: FormInstance | undefined) => {
 	if (!formEl) return;
 	formEl.resetFields();
-	state.queryParams.QuerySelf = 'true';
+	state.queryParams.QuerySelf = true;
 	ruleFormRef.value?.resetFields();
 	state.queryParams.IsProvinceOrder = null;
 	fastSearch.value = 'all';
-	queryList();
+	queryList(true);
 };
 // 批量发布
 const publishMultiple = () => {
@@ -465,19 +518,19 @@ const onJbExport = () => {
 	const ids = checkTable.value.map((item: any) => item.id);
 	exportAssignment(ids);
 };
-const tableRef = ref<RefType>();
 const checkTable = ref<EmptyArrayType>([]);
+const gridRef = ref<RefType>();
 const selectAllChangeEvent = ({ checked }) => {
-	if (tableRef.value) {
-		const records = tableRef.value.getCheckboxRecords();
+	if (gridRef.value) {
+		const records = gridRef.value.getCheckboxRecords();
 		checkTable.value = records;
 		console.log(checked ? '所有勾选事件' : '所有取消事件', records);
 	}
 };
 
 const selectChangeEvent = ({ checked }) => {
-	if (tableRef.value) {
-		const records = tableRef.value.getCheckboxRecords();
+	if (gridRef.value) {
+		const records = gridRef.value.getCheckboxRecords();
 		checkTable.value = records;
 		console.log(checked ? '勾选事件' : '取消事件', records);
 	}
@@ -485,13 +538,9 @@ const selectChangeEvent = ({ checked }) => {
 const isChecked = computed(() => {
 	return !Boolean(checkTable.value.length);
 });
-const toolbarRef = ref<RefType>();
 onMounted(() => {
 	queryList().then(() => {
 		getBaseInfo();
 	});
-	if (tableRef.value && toolbarRef.value) {
-		tableRef.value.connect(toolbarRef.value);
-	}
 });
 </script>

src/views/business/visit/index.vue

@@ -1,10 +1,12 @@
 <template>
 	<div class="business-visit-container layout-padding">
 		<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="IsProvince">
-					<el-segmented
-						:options="[
+			<vxe-grid v-bind="gridOptions"  ref="gridRef">
+				<template #form>
+					<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline :disabled="gridOptions.loading">
+						<el-form-item label="数据范围" prop="IsProvince">
+							<el-segmented
+								:options="[
 							{
 								value: 'all',
 								label: '全部',
@@ -18,137 +20,52 @@
 								label: '省工单',
 							},
 						]"
-						v-model="fastSearch"
-						@change="fastSearchChange"
+								v-model="fastSearch"
+								@change="fastSearchChange"
+								:disabled="state.loading"
+							/>
+						</el-form-item>
+						<el-form-item label="工单标题" prop="Keyword">
+							<el-input v-model.trim="state.queryParams.Keyword" placeholder="工单标题" clearable @keyup.enter="handleQuery" class="keyword-input" />
+						</el-form-item>
+						<el-form-item label="工单编码" prop="No">
+							<el-input v-model.trim="state.queryParams.No" placeholder="工单编码" clearable @keyup.enter="handleQuery" class="keyword-input" />
+						</el-form-item>
+						<el-form-item label="" label-width="0">
+							<el-button type="primary" @click="handleQuery" :loading="state.loading"> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
+							<el-button @click="drawer = true" class="default-button"> <SvgIcon name="ele-Search" class="mr5" />更多查询</el-button>
+						</el-form-item>
+					</el-form>
+				</template>
+				<template #order_detail="{ row }">
+					<order-detail :order="row.order" @updateList="queryList">{{ row.order?.title }}</order-detail>
+				</template>
+				<template #actionYB="{row}">
+					<el-button link type="primary" @click="visitDetail(row)" title="查看回访详情"> 回访详情 </el-button>
+				</template>
+				<template #action="{row}">
+					<el-button link type="primary" @click="visitDetail(row)" title="查看回访详情"> 回访详情 </el-button>
+					<el-button
+						link
+						type="primary"
+						@click="updateVisitResult(row)"
+						title="修改回访结果"
+						v-auth="'business:visit:visitEdit'"
+						v-if="row.visitState === 30"
+					>
+						修改回访结果
+					</el-button>
+				</template>
+				<template #pager>
+					<pagination
+						@pagination="queryList"
+						:total="state.total"
+						v-model:current-page="state.queryParams.PageIndex"
+						v-model:page-size="state.queryParams.PageSize"
 						:disabled="state.loading"
 					/>
-				</el-form-item>
-				<el-form-item label="工单标题" prop="Keyword">
-					<el-input v-model.trim="state.queryParams.Keyword" placeholder="工单标题" clearable @keyup.enter="handleQuery" class="keyword-input" />
-				</el-form-item>
-				<el-form-item label="工单编码" prop="No">
-					<el-input v-model.trim="state.queryParams.No" placeholder="工单编码" clearable @keyup.enter="handleQuery" class="keyword-input" />
-				</el-form-item>
-				<el-form-item label="" label-width="0">
-					<el-button type="primary" @click="handleQuery" :loading="state.loading"> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
-					<el-button @click="drawer = true" class="default-button"> <SvgIcon name="ele-Search" class="mr5" />更多查询</el-button>
-				</el-form-item>
-			</el-form>
-			<vxe-toolbar
-				ref="toolbarRef"
-				:loading="state.loading"
-				custom
-				:refresh="{
-					queryMethod: handleQuery,
-				}"
-			>
-			</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, useKey: true }"
-					ref="tableRef"
-					height="auto"
-					auto-resize
-					show-overflow
-					:scrollY="{ enabled: true, gt: 100 }"
-					id="businessVisit"
-					:custom-config="{
-						storage: true,
-					}"
-					showHeaderOverflow
-				>
-					<vxe-column field="order.expiredStatusText" title="超期状态" width="90" align="center">
-						<template #default="{ row }">
-							<span :class="'overdue-status-' + row.order?.expiredStatus" :title="row.order?.expiredStatusText"></span>
-						</template>
-					</vxe-column>
-					<vxe-column field="order.no" title="工单编码" width="140"></vxe-column>
-					<vxe-column field="order.isProvinceText" title="省/市工单" width="100"></vxe-column>
-					<vxe-column field="title" title="工单标题" min-width="200">
-						<template #default="{ row }">
-							<order-detail :order="row.order" @updateList="queryList">{{ row.order?.title }}</order-detail>
-						</template>
-					</vxe-column>
-					<vxe-column field="order.sourceChannel" title="来源渠道" width="110"></vxe-column>
-					<vxe-column field="visitStateText" title="回访状态" width="100"></vxe-column>
-					<vxe-column field="visitTypeText" title="回访方式" width="100"></vxe-column>
-					<vxe-column
-						field="isEffectiveAiVisitText"
-						title="有效智能回访"
-						width="150"
-						v-if="['YiBin'].includes(themeConfig.appScope)"
-					></vxe-column>
-					<vxe-column field="order.acceptType" title="受理类型" width="110"></vxe-column>
-					<vxe-column field="order.hotspotName" title="热点分类" width="150"></vxe-column>
-					<vxe-column field="order.acceptorName" title="受理人" width="120"></vxe-column>
-					<vxe-column field="order.orgLevelOneName" title="一级部门" width="150"></vxe-column>
-					<vxe-column field="order.actualHandleOrgName" title="接办部门" width="150"></vxe-column>
-					<vxe-column field="order.startTime" title="受理时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.order?.startTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="order.filedTime" title="办结时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.order?.filedTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="publishTime" title="发布时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.publishTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="creationTime" title="回访任务创建时间" width="170">
-						<template #default="{ row }">
-							{{ formatDate(row.creationTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="employeeName" title="回访人" width="150"></vxe-column>
-					<vxe-column field="visitTime" title="回访时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.visitTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="hwyPj" title="话务员满意度" width="120">
-						<template #default="{ row }">
-							<span v-for="item in row.orderVisitDetails">
-								<span v-if="item.visitTarget === 10">{{ item.seatEvaluateText }}</span>
-							</span>
-						</template>
-					</vxe-column>
-					<vxe-column title="操作" fixed="right" width="200" align="center" v-if="['ZiGong', 'LuZhou'].includes(themeConfig.appScope)">
-						<template #default="{ row }">
-							<el-button link type="primary" @click="visitDetail(row)" title="查看回访详情"> 回访详情 </el-button>
-							<el-button
-								link
-								type="primary"
-								@click="updateVisitResult(row)"
-								title="修改回访结果"
-								v-auth="'business:visit:visitEdit'"
-								v-if="row.visitState === 30"
-							>
-								修改回访结果
-							</el-button>
-						</template>
-					</vxe-column>
-					<vxe-column title="操作" fixed="right" width="100" align="center" v-else>
-						<template #default="{ row }">
-							<el-button link type="primary" @click="visitDetail(row)" title="查看回访详情"> 回访详情 </el-button>
-						</template>
-					</vxe-column>
-				</vxe-table>
-			</div>
-			<pagination
-				@pagination="queryList"
-				:total="state.total"
-				v-model:current-page="state.queryParams.PageIndex"
-				v-model:page-size="state.queryParams.PageSize"
-				:disabled="state.loading"
-			/>
+				</template>
+			</vxe-grid>
 		</div>
 		<!--	更多查询	-->
 		<el-drawer v-model="drawer" title="更多查询" size="500px">
@@ -165,9 +82,21 @@
 						<el-option label="否" value="false" />
 					</el-select>
 				</el-form-item>
+				<el-form-item label="来电主体" prop="IdentityType">
+					<el-select v-model="state.queryParams.IdentityType" placeholder="请选择来电主体" clearable @change="handleQuery">
+						<el-option :value="1" label="市民" />
+						<el-option :value="2" label="企业" />
+					</el-select>
+				</el-form-item>
+				<el-form-item label="来电号码" prop="FromPhone">
+					<el-input v-model.trim="state.queryParams.FromPhone" placeholder="来电号码" clearable @keyup.enter="handleQuery" />
+				</el-form-item>
 				<el-form-item label="一级部门" prop="OrgLevelOneName">
 					<el-input v-model="state.queryParams.OrgLevelOneName" placeholder="一级部门" clearable @keyup.enter="handleQuery" />
 				</el-form-item>
+				<el-form-item label="接办部门" prop="ActualHandleOrgName">
+					<el-input v-model="state.queryParams.ActualHandleOrgName" placeholder="接办部门" clearable @keyup.enter="handleQuery" />
+				</el-form-item>
 				<!--				<el-form-item label="回访状态" prop="VisitStateQuery" v-if="['YiBin','LuZhou'].includes(themeConfig.appScope)">
 					<el-select v-model="state.queryParams.VisitStateQuery" placeholder="请选择回访状态" @change="handleQuery">
 						<el-option v-for="item in visitStateQuery" :value="item.key" :key="item.key" :label="item.value" />
@@ -246,8 +175,7 @@
 <script setup lang="tsx" name="businessVisit">
 import { defineAsyncComponent, onMounted, reactive, ref } from 'vue';
 import { FormInstance } from 'element-plus';
-import { formatDate } from '@/utils/formatTime';
-import { visitList, visitSearchBaseData } from '@/api/business/visit';
+import { visitList, visitListExport, visitSearchBaseData } from '@/api/business/visit';
 import { defaultTimeStartEnd, shortcuts } from '@/utils/constants';
 import Other from '@/utils/other';
 import { useThemeConfig } from '@/stores/themeConfig';
@@ -298,13 +226,126 @@ const state = reactive<any>({
 		SeatEvaluate: [],
 		OrgProcessingResults: [],
 		OrgHandledAttitude: [],
-		OrgLevelOneName:null, // 一级部门
+		IdentityType:null,
+		FromPhone:null,
+		OrgLevelOneName:null,
+		ActualHandleOrgName:null,
 	},
 	tableData: [], //表单
 	loading: false, // 加载
 	total: 0, // 总数
 	visitTypeOptions: [], // 回访方式
 });
+
+const requestParams = ref<EmptyObjectType>({});
+const gridOptions = reactive<any>({
+	loading: false,
+	border: true,
+	showOverflow: true,
+	columnConfig: {
+		resizable: true,
+	},
+	scrollY: {
+		enabled: true,
+		gt: 100,
+	},
+	toolbarConfig: {
+		zoom: true,
+		custom: true,
+		refresh: {
+			queryMethod: () => {
+				handleQuery();
+			},
+		},
+		tools: [{ toolRender: { name: 'exportCurrent' } }, { toolRender: { name: 'exportAll' } }],
+	},
+	customConfig: {
+		storage: true,
+	},
+	id: 'businessVisit',
+	rowConfig: { isHover: true, height: 30, isCurrent: true, useKey: true },
+	height: 'auto',
+	columns:[
+		{
+			field: 'order.expiredStatusText',
+			title: '状态',
+			width: 60,
+			align: 'center',
+			slots: {
+				default: ({ row }) => {
+					return <span class={'overdue-status-' + row.order?.expiredStatus} title={row.order.expiredStatusText}></span>;
+				},
+			},
+		},
+		{ field: 'order.no', title: '工单编码', width: 140 },
+		{ field: 'order.isProvinceText', title: '省/市工单', width: 90 },
+		{
+			field: 'order.title',
+			title: '工单标题',
+			minWidth: 200,
+			slots: { default: 'order_detail' },
+		},
+		{ field: 'order.sourceChannel', title: '来源渠道', width: 110 },
+		{ field: 'visitStateText', title: '回访状态', width: 100 },
+		{ field: 'visitTypeText', title: '回访方式', width: 100 },
+		{ field: 'isEffectiveAiVisitText', title: '有效智能回访', width: 120 },
+		{ field: 'order.acceptType', title: '受理类型', width: 110 },
+		{ field: 'order.acceptorName', title: '受理人', width: 120 },
+		{ field: 'order.hotspotName', title: '热点分类', width: 150 },
+		{ field: 'order.orgLevelOneName', title: '一级部门', width: 150 },
+		{ field: 'order.actualHandleOrgName', title: '接办部门', width: 140 },
+		{
+			field: 'order.startTime',
+			title: '受理时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'order.filedTime',
+			title: '办结时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'publishTime',
+			title: '发布时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'creationTime',
+			title: '回访任务创建时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{ field: 'employeeName', title: '回访人', width: 120 },
+		{
+			field: 'visitTime',
+			title: '回访时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{ field: 'order.seatEvaluateTxt', title: '话务员满意度', width: 140 },
+	],
+	data: [],
+	params: {
+		exportMethod: visitListExport,
+		exportParams: requestParams,
+	},
+	sortConfig: {
+		remote: true,
+	},
+});
+if(['YiBin'].includes(themeConfig.value.appScope)){
+	gridOptions.columns.push({
+		title: '操作', width: 100, fixed: 'right', align: 'center', slots: { default: 'actionYB' }
+	})
+}else if(['ZiGong','LuZhou'].includes(themeConfig.value.appScope)){
+	gridOptions.columns = gridOptions.columns.filter((item:any) => item.field !== 'isEffectiveAiVisitText');
+	gridOptions.columns.push({
+		title: '操作', width: 200, fixed: 'right', align: 'center', slots: { default: 'action' }
+	})
+}
 // 获取基础数据
 const seatEvaluate = ref<EmptyArrayType>([]); // 话务员评价
 const voiceEvaluate = ref<EmptyArrayType>([]); // 语音评价
@@ -329,10 +370,10 @@ const handleQuery = () => {
 	queryList();
 };
 /** 获取列表 */
-const requestParams = ref<EmptyObjectType>({});
 const queryList = () => {
 	return new Promise((resolve, reject) => {
 		state.loading = true;
+		gridOptions.loading = true;
 		requestParams.value = Other.deepClone(state.queryParams);
 		requestParams.value.StartTime = state.queryParams.crTime === null ? null : state.queryParams.crTime[0];
 		requestParams.value.EndTime = state.queryParams.crTime === null ? null : state.queryParams.crTime[1];
@@ -341,11 +382,14 @@ const queryList = () => {
 			.then((res: any) => {
 				state.tableData = res.result?.items ?? [];
 				state.total = res.result?.total ?? 0;
+				gridOptions.data = state.tableData;
 				state.loading = false;
+				gridOptions.loading = false;
 				resolve(res);
 			})
 			.catch(() => {
 				state.loading = false;
+				gridOptions.loading = false;
 				reject();
 			});
 	});
@@ -372,14 +416,9 @@ const visitDetail = (row: any) => {
 const updateVisitResult = (row: any) => {
 	visitDetailRef.value.openDialog(row, '修改回访结果');
 };
-const toolbarRef = ref<RefType>();
-const tableRef = ref<RefType>();
 onMounted(() => {
 	queryList().then(() => {
 		getBaseData();
 	});
-	if (tableRef.value && toolbarRef.value) {
-		tableRef.value.connect(toolbarRef.value);
-	}
 });
 </script>

src/views/business/visit/todo.vue

@@ -1,21 +1,23 @@
 <template>
 	<div class="business-visit-todo-container layout-padding">
 		<div class="layout-padding-auto layout-padding-view pd20">
-			<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline label-width="100px">
-				<el-form-item label="数据范围" prop="QuerySelf" v-auth="'business:visit:todo:querySelf'">
-					<el-segmented
-						:options="[
-							{ label: '我的', value: 'true' },
-							{ label: '全部', value: 'false' },
+			<vxe-grid v-bind="gridOptions" ref="gridRef" @checkbox-all="selectAllChangeEvent" @checkbox-change="selectChangeEvent">
+				<template #form>
+					<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline label-width="100px" :disabled="gridOptions.loading">
+						<el-form-item label="数据范围" prop="QuerySelf" v-auth="'business:visit:todo:querySelf'">
+							<el-segmented
+								:options="[
+							{ label: '我的', value: true },
+							{ label: '全部', value: false },
 						]"
-						v-model="state.queryParams.QuerySelf"
-						@change="handleQuery"
-						:disabled="state.loading"
-					/>
-				</el-form-item>
-				<el-form-item label="工单类型" prop="IsProvince" v-auth="'business:visit:todo:orderType'">
-					<el-segmented
-						:options="[
+								v-model="state.queryParams.QuerySelf"
+								@change="handleQuery"
+								:disabled="state.loading"
+							/>
+						</el-form-item>
+						<el-form-item label="工单类型" prop="IsProvince" v-auth="'business:visit:todo:orderType'">
+							<el-segmented
+								:options="[
 							{
 								value: 'all',
 								label: '全部',
@@ -29,40 +31,32 @@
 								label: '省工单',
 							},
 						]"
-						v-model="fastSearch"
-						@change="fastSearchChange"
-						:disabled="state.loading"
-					/>
-				</el-form-item>
-				<el-form-item label="回访状态" prop="VisitStateQuery">
-					<el-segmented :options="visitStateOptions" v-model="state.queryParams.VisitStateQuery" @change="handleQuery" :disabled="state.loading" />
-				</el-form-item>
-				<el-form-item label="工单标题" prop="Keyword">
-					<el-input v-model.trim="state.queryParams.Keyword" placeholder="工单标题" clearable @keyup.enter="handleQuery" class="keyword-input" />
-				</el-form-item>
-				<el-form-item label="工单编码" prop="No">
-					<el-input v-model.trim="state.queryParams.No" 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="drawer = true" class="default-button"> <SvgIcon name="ele-Search" class="mr5" />更多查询</el-button>
-				</el-form-item>
-			</el-form>
-			<vxe-toolbar
-				ref="toolbarRef"
-				:loading="state.loading"
-				custom
-				:refresh="{
-					queryMethod: handleQuery,
-				}"
-			>
-				<template #buttons>
+								v-model="fastSearch"
+								@change="fastSearchChange"
+								:disabled="state.loading"
+							/>
+						</el-form-item>
+						<el-form-item label="回访状态" prop="VisitStateQuery">
+							<el-segmented :options="visitStateOptions" v-model="state.queryParams.VisitStateQuery" @change="handleQuery" :disabled="state.loading" />
+						</el-form-item>
+						<el-form-item label="工单标题" prop="Keyword">
+							<el-input v-model.trim="state.queryParams.Keyword" placeholder="工单标题" clearable @keyup.enter="handleQuery" class="keyword-input" />
+						</el-form-item>
+						<el-form-item label="工单编码" prop="No">
+							<el-input v-model.trim="state.queryParams.No" 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="drawer = true" class="default-button"> <SvgIcon name="ele-Search" class="mr5" />更多查询</el-button>
+						</el-form-item>
+					</el-form>
+				</template>
+				<template #toolbar_buttons>
 					<el-button
 						type="primary"
 						@click="messageVisit"
 						:disabled="isChecked"
 						v-auth="'business:visit:todo:message'"
-						v-if="['ZiGong', 'LuZhou'].includes(themeConfig.appScope)"
 					>
 						<SvgIcon name="ele-Message" class="mr5" />短信回访</el-button
 					>
@@ -82,84 +76,22 @@
 						<SvgIcon name="ele-Rank" class="mr5" />平级移动<span v-if="checkTable.length">({{ checkTable.length }})</span>
 					</el-button>
 				</template>
-			</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, useKey: true }"
-					ref="tableRef"
-					@checkbox-all="selectAllChangeEvent"
-					@checkbox-change="selectChangeEvent"
-					height="auto"
-					auto-resize
-					show-overflow
-					:print-config="{}"
-					:scrollY="{ enabled: true, gt: 100 }"
-					id="businessVisitTodo"
-					:custom-config="{
-						storage: true,
-					}"
-					showHeaderOverflow
-				>
-					<vxe-column type="checkbox" width="50" align="center"></vxe-column>
-					<vxe-column field="order.expiredStatusText" title="超期状态" width="90" align="center">
-						<template #default="{ row }">
-							<span :class="'overdue-status-' + row.order?.expiredStatus" :title="row.order?.expiredStatusText"></span>
-						</template>
-					</vxe-column>
-					<vxe-column field="order.no" title="工单编码" width="140"></vxe-column>
-					<vxe-column field="order.isProvinceText" title="省/市工单" width="100"></vxe-column>
-					<vxe-column field="title" title="工单标题" min-width="200">
-						<template #default="{ row }">
-							<order-detail :order="row.order" @updateList="queryList">{{ row.order?.title }}</order-detail>
-						</template>
-					</vxe-column>
-					<vxe-column field="order.sourceChannel" title="来源渠道" width="100"></vxe-column>
-					<vxe-column field="visitStateText" title="回访状态" width="100"></vxe-column>
-					<vxe-column field="visitTypeText" title="回访方式" width="100"></vxe-column>
-					<vxe-column field="order.acceptType" title="受理类型" width="110"></vxe-column>
-					<vxe-column field="order.hotspotName" title="热点分类" width="150"></vxe-column>
-					<vxe-column field="order.acceptorName" title="受理人" width="120"></vxe-column>
-					<vxe-column field="order.orgLevelOneName" title="一级部门" width="150"></vxe-column>
-					<vxe-column field="order.actualHandleOrgName" title="接办部门" width="150"></vxe-column>
-					<vxe-column field="order.startTime" title="受理时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.order?.startTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="order.filedTime" title="办结时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.order?.filedTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="publishTime" title="发布时间" width="160">
-						<template #default="{ row }">
-							{{ formatDate(row.publishTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="creationTime" title="回访任务创建时间" width="170">
-						<template #default="{ row }">
-							{{ formatDate(row.creationTime, 'YYYY-mm-dd HH:MM:SS') }}
-						</template>
-					</vxe-column>
-					<vxe-column field="employeeName" title="回访人" width="150"></vxe-column>
-					<vxe-column title="操作" fixed="right" width="80" align="center">
-						<template #default="{ row }">
-							<el-button link type="primary" @click="onManpower(row)" title="工单回访" v-auth="'business:visit:todo:manpower'"> 回访 </el-button>
-						</template>
-					</vxe-column>
-				</vxe-table>
-			</div>
-			<pagination
-				@pagination="queryList"
-				:total="state.total"
-				v-model:current-page="state.queryParams.PageIndex"
-				v-model:page-size="state.queryParams.PageSize"
-				:disabled="state.loading"
-			/>
+				<template #order_detail="{ row }">
+					<order-detail :order="row.order" @updateList="queryList">{{ row.order?.title }}</order-detail>
+				</template>
+				<template #action="{row}">
+					<el-button link type="primary" @click="onManpower(row)" title="工单回访" v-auth="'business:visit:todo:manpower'"> 回访 </el-button>
+				</template>
+				<template #pager>
+					<pagination
+						@pagination="queryList"
+						:total="state.total"
+						v-model:current-page="state.queryParams.PageIndex"
+						v-model:page-size="state.queryParams.PageSize"
+						:disabled="state.loading"
+					/>
+				</template>
+			</vxe-grid>
 		</div>
 		<!--	更多查询	-->
 		<el-drawer v-model="drawer" title="更多查询" size="500px">
@@ -173,12 +105,18 @@
 				<el-form-item label="回访人" prop="EmployeeName">
 					<el-input v-model="state.queryParams.EmployeeName" placeholder="回访人" clearable @keyup.enter="handleQuery" />
 				</el-form-item>
-				<el-form-item label="接办部门" prop="ActualHandleOrgName">
-					<el-input v-model="state.queryParams.ActualHandleOrgName" placeholder="接办部门" clearable @keyup.enter="handleQuery" />
+				<el-form-item label="来电主体" prop="IdentityType">
+					<el-select v-model="state.queryParams.IdentityType" placeholder="请选择来电主体" clearable @change="handleQuery">
+						<el-option :value="1" label="市民" />
+						<el-option :value="2" label="企业" />
+					</el-select>
 				</el-form-item>
 				<el-form-item label="一级部门" prop="OrgLevelOneName">
 					<el-input v-model="state.queryParams.OrgLevelOneName" placeholder="一级部门" clearable @keyup.enter="handleQuery" />
 				</el-form-item>
+				<el-form-item label="接办部门" prop="ActualHandleOrgName">
+					<el-input v-model="state.queryParams.ActualHandleOrgName" placeholder="接办部门" clearable @keyup.enter="handleQuery" />
+				</el-form-item>
 				<el-form-item label="归档类型" prop="FiledType">
 					<el-select v-model="state.queryParams.FiledType" placeholder="请选择归档类型" @change="handleQuery" clearable>
 						<el-option label="中心归档" value="10" />
@@ -241,9 +179,8 @@
 <script setup lang="tsx" name="businessVisitTodo">
 import { computed, defineAsyncComponent, onMounted, reactive, ref } from 'vue';
 import { ElMessageBox, FormInstance, ElMessage } from 'element-plus';
-import { formatDate } from '@/utils/formatTime';
 import { visitList } from '@/api/todo/visit';
-import { visitSearchBaseData, visitSendSms } from '@/api/business/visit';
+import { visitListExport, visitSearchBaseData, visitSendSms } from '@/api/business/visit';
 import { useThemeConfig } from '@/stores/themeConfig';
 import { storeToRefs } from 'pinia';
 import { defaultTimeStartEnd, shortcuts } from '@/utils/constants';
@@ -284,7 +221,7 @@ const state = reactive<any>({
 		VisitStateQuery: 2, // 回访状态  2待回访
 		VisitType: null, // 回访方式
 		No: null,
-		QuerySelf: 'true', // 是否只查询自己的待回访工单
+		QuerySelf: true, // 是否只查询自己的待回访工单
 		EmployeeName: null, // 回访人
 		IsProvince: null, // 是否省工单
 		FromPhone: null, //来电号码
@@ -294,6 +231,7 @@ const state = reactive<any>({
 		StartPublishTime: null,
 		EndPublishTime: null,
 		OrgLevelOneName: null, // 一级部门
+		IdentityType:null,
 	},
 	tableData: [], //表单
 	loading: false, // 加载
@@ -303,6 +241,103 @@ const state = reactive<any>({
 const storesThemeConfig = useThemeConfig();
 const { themeConfig } = storeToRefs(storesThemeConfig);
 
+const requestParams = ref<EmptyObjectType>({});
+const gridOptions = reactive<any>({
+	loading: false,
+	border: true,
+	showOverflow: true,
+	columnConfig: {
+		resizable: true,
+	},
+	scrollY: {
+		enabled: true,
+		gt: 100,
+	},
+	toolbarConfig: {
+		zoom: true,
+		custom: true,
+		refresh: {
+			queryMethod: () => {
+				handleQuery();
+			},
+		},
+		tools: [{ toolRender: { name: 'exportCurrent' } }, { toolRender: { name: 'exportAll' } }],
+		slots: {
+			buttons: 'toolbar_buttons',
+		},
+	},
+	customConfig: {
+		storage: true,
+	},
+	id: 'businessVisitTodo',
+	rowConfig: { isHover: true, height: 30, isCurrent: true, useKey: true },
+	height: 'auto',
+	columns:[
+		{ type: 'checkbox', width: 50, align: 'center' },
+		{
+			field: 'order.expiredStatusText',
+			title: '状态',
+			width: 60,
+			align: 'center',
+			slots: {
+				default: ({ row }) => {
+					return <span class={'overdue-status-' + row.order?.expiredStatus} title={row.order.expiredStatusText}></span>;
+				},
+			},
+		},
+		{ field: 'order.no', title: '工单编码', width: 140 },
+		{ field: 'order.isProvinceText', title: '省/市工单', width: 90 },
+		{
+			field: 'order.title',
+			title: '工单标题',
+			minWidth: 200,
+			slots: { default: 'order_detail' },
+		},
+		{ field: 'order.sourceChannel', title: '来源渠道', width: 110 },
+		{ field: 'visitStateText', title: '回访状态', width: 100 },
+		{ field: 'visitTypeText', title: '回访方式', width: 100 },
+		{ field: 'order.acceptType', title: '受理类型', width: 110 },
+		{ field: 'order.acceptorName', title: '受理人', width: 120 },
+		{ field: 'order.hotspotName', title: '热点分类', width: 150 },
+		{ field: 'order.orgLevelOneName', title: '一级部门', width: 150 },
+		{ field: 'order.actualHandleOrgName', title: '接办部门', width: 140 },
+		{
+			field: 'order.startTime',
+			title: '受理时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'order.filedTime',
+			title: '办结时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'publishTime',
+			title: '发布时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{
+			field: 'creationTime',
+			title: '回访任务创建时间',
+			width: 160,
+			formatter: 'formatDate',
+		},
+		{ field: 'employeeName', title: '回访人', width: 120 },
+		{ title: '操作', width: 80, fixed: 'right', align: 'center', slots: { default: 'action' } },
+	],
+	data: [],
+	params: {
+		exportMethod: visitListExport,
+		exportParams: requestParams,
+	},
+	sortConfig: {
+		remote: true,
+	},
+});
+
 const visitStateOptions = ref<EmptyArrayType>([
 	{ label: '待回访', value: 2 },
 	{ label: '短信回访中', value: 21 },
@@ -339,10 +374,10 @@ const handleQuery = () => {
 	queryList();
 };
 /** 获取列表 */
-const requestParams = ref<EmptyObjectType>({});
 const queryList = () => {
 	return new Promise((resolve, reject) => {
 		state.loading = true;
+		gridOptions.loading = true;
 		requestParams.value = Other.deepClone(state.queryParams);
 		requestParams.value.StartPublishTime = state.queryParams.fbTime === null ? null : state.queryParams.fbTime[0];
 		requestParams.value.EndPublishTime = state.queryParams.fbTime === null ? null : state.queryParams.fbTime[1];
@@ -350,16 +385,19 @@ const queryList = () => {
 		visitList(requestParams.value)
 			.then((res: any) => {
 				state.tableData = res.result?.items ?? [];
+				gridOptions.data = state.tableData;
 				state.total = res.result?.total ?? 0;
 				state.loading = false;
 				resolve(res);
-				tableRef.value.clearCheckboxRow();
+				gridRef.value.clearCheckboxRow();
 				checkTable.value = [];
+				gridOptions.loading = false;
 			})
 			.catch(() => {
 				state.loading = false;
-				tableRef.value.clearCheckboxRow();
+				gridRef.value.clearCheckboxRow();
 				checkTable.value = [];
+				gridOptions.loading = false;
 				reject();
 			});
 	});
@@ -372,7 +410,7 @@ const drawer = ref(false);
 const resetQuery = (formEl: FormInstance | undefined) => {
 	if (!formEl) return;
 	formEl.resetFields();
-	state.queryParams.QuerySelf = 'true';
+	state.queryParams.QuerySelf = true;
 	state.queryParams.IsProvince = null;
 	fastSearch.value = 'all';
 	ruleFormRef.value?.resetFields();
@@ -429,19 +467,19 @@ const batchVisit = () => {
 	});
 	visitBatchRef.value.openDialog(visit);
 };
-const tableRef = ref<RefType>();
 const checkTable = ref<EmptyArrayType>([]);
+const gridRef = ref<RefType>();
 const selectAllChangeEvent = ({ checked }) => {
-	if (tableRef.value) {
-		const records = tableRef.value.getCheckboxRecords();
+	if (gridRef.value) {
+		const records = gridRef.value.getCheckboxRecords();
 		checkTable.value = records;
 		console.log(checked ? '所有勾选事件' : '所有取消事件', records);
 	}
 };
 
 const selectChangeEvent = ({ checked }) => {
-	if (tableRef.value) {
-		const records = tableRef.value.getCheckboxRecords();
+	if (gridRef.value) {
+		const records = gridRef.value.getCheckboxRecords();
 		checkTable.value = records;
 		console.log(checked ? '勾选事件' : '取消事件', records);
 	}
@@ -449,13 +487,9 @@ const selectChangeEvent = ({ checked }) => {
 const isChecked = computed(() => {
 	return !Boolean(checkTable.value.length);
 });
-const toolbarRef = ref<RefType>();
 onMounted(() => {
 	queryList().then(() => {
 		getBaseData();
 	});
-	if (tableRef.value && toolbarRef.value) {
-		tableRef.value.connect(toolbarRef.value);
-	}
 });
 </script>