reactor:菜单搜索优化;数据统计表格优化;

src/components/ProTable/index.vue

@@ -54,10 +54,6 @@
 						<el-radio v-if="item.type == 'radio'" v-model="radio" :label="scope.row[rowKey]">
 							<i></i>
 						</el-radio>
-						<!-- sort -->
-						<el-tag v-if="item.type == 'sort'" class="move">
-							<SvgIcon name="ele-Rank" />
-						</el-tag>
 					</template>
 				</el-table-column>
 				<!-- other -->
@@ -93,7 +89,6 @@ import { ColumnProps, TypeProps } from '@/components/ProTable/interface';
 import PaginationEl from './components/Pagination.vue';
 import ColSetting from './components/ColSetting.vue';
 import TableColumn from './components/TableColumn.vue';
-import Sortable from 'sortablejs';
 import { handleProp } from '@/utils/tools';
 
 // 接受父组件参数，配置默认值
@@ -207,7 +202,6 @@ const clearSelection = () => tableRef.value!.clearSelection();
 
 // 初始化表格数据 && 拖拽排序
 onMounted(() => {
-	dragSort();
 	getSelectColumns();
 });
 
@@ -278,19 +272,6 @@ const colSetting = tableColumns!.filter((item) => {
 });
 const openColSetting = () => colRef.value.openColSetting();
 
-// 拖拽排序
-const dragSort = () => {
-	const tbody = document.querySelector('.el-table__body-wrapper tbody') as HTMLElement;
-	Sortable.create(tbody, {
-		handle: '.move',
-		animation: 300,
-		onEnd({ newIndex, oldIndex }) {
-			const [removedItem] = processTableData.value.splice(oldIndex!, 1);
-			processTableData.value.splice(newIndex!, 0, removedItem);
-			emit('dargSort', { newIndex, oldIndex });
-		},
-	});
-};
 // 刷新事件
 const onRefresh = () => {
 	clearSelection();

src/components/Upload/index.vue

@@ -1,169 +0,0 @@
-<template>
-	<div class="upload-container w100">
-		<el-upload
-			class="upload-demo w100"
-			v-model:file-list="infoList"
-			:action="props.actionUrl"
-			:limit="props.limit"
-			:disabled="props.disabled"
-			:auto-upload="props.autoUpload"
-			:multiple="props.multiple"
-			:accept="props.accept"
-			:on-exceed="handleExceed"
-			:http-request="httpRequest"
-			:on-change="handleChange"
-			ref="uploadListRef"
-		>
-			<el-button> <SvgIcon name="ele-Upload" /> 上传附件 </el-button>
-			<slot> </slot>
-			<template #file="{ file }">
-				<div class="el-upload-list__item-info" @click="handlePictureCardPreview(file)">
-					<a class="el-upload-list__item-name">
-						<SvgIcon class="mr5" :name="fileType(checkFile(file.name))" size="14px" />
-						<span class="el-upload-list__item-file-name" :title="file.name">{{ file.name }}</span>
-					</a>
-				</div>
-				<SvgIcon name="ele-Close" class="el-icon--close" size="14px" title="删除文件" @click="handleRemove(file)" />
-			</template>
-		</el-upload>
-	</div>
-</template>
-
-<script setup lang="ts">
-/**
- * @desc 封装 element UI el-upload
- * @param {fileLists} [v-model] - 双向绑定的值
- * @param {Number} [limit] [v-bind]- 上传个数限制
- * @param {String} [accept] [v-bind]- 上传后缀的限制
- * @param {disabled} [Boolean] [v-bind]- 是否禁用
- * @example <UpLoad :limit='1' v-model:fileLists='ruleForm.fileLists' accept='image/png,image/jpg'/>
- */
-import { ref, onMounted } from 'vue';
-import { checkFile, fileType } from '@/utils/tools';
-import type { UploadUserFile } from 'element-plus';
-import { ElMessage, ElMessageBox } from 'element-plus';
-// import { uploadUrl } from '@/utils/appConfig';
-const props = defineProps({
-	limit: {
-		type: Number,
-	},
-	accept: {
-		type: String,
-		default: '',
-	},
-	fileList: {
-		type: Array,
-		default: <EmptyArrayType>[],
-		required: true,
-	},
-	disabled: {
-		type: Boolean,
-		default: false,
-	},
-	multiple: {
-		type: Boolean,
-		default: false,
-	},
-	actionUrl: {
-		type: String,
-		default: 'https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15',
-	},
-	autoUpload: {
-		type: Boolean,
-		default: true,
-	},
-	// 大小限制(MB)
-	fileSize: {
-		type: Number,
-		default: 10,
-	},
-});
-
-const infoList = ref(<EmptyArrayType>[]);
-const emit = defineEmits(['update:fileList']);
-const uploadListRef = ref<RefType>();
-onMounted(() => {
-	infoList.value = props.fileList || [];
-});
-// 删除
-const handleRemove = (uploadFile: UploadUserFile) => {
-	ElMessageBox.confirm(`确定要删除？`, '提示', {
-		confirmButtonText: '确认',
-		cancelButtonText: '取消',
-		type: 'warning',
-		draggable: true,
-		cancelButtonClass: 'default-button',
-	})
-		.then(() => {
-			// infoList.value.forEach((v: any, i: any) => {
-			// 	if (v.uid == uploadFile.uid) {
-			// 		infoList.value.splice(i, 1);
-			// 	}
-			// });
-			uploadListRef.value.handleRemove(uploadFile);
-			emit('update:fileList', infoList.value);
-		})
-		.catch(() => {});
-};
-// 预览文件
-const handlePictureCardPreview = (uploadFile: UploadUserFile) => {
-	console.log(uploadFile, '121');
-};
-// 上传
-const httpRequest = async (params: any) => {
-	const file = params.file;
-	// 文件名(8位随机数)：zokcutz4.jpg
-	const fileName = Math.random().toString(36).substr(-8) + file.name.substr(file.name.lastIndexOf('.'));
-
-	// 目录加文件名【上线前修改目录名】
-	const fileSrc = `test20220824/${fileName}`;
-	console.log(fileSrc);
-	try {
-		params.onProgress({ percent: 0 });
-		//上传的自定义逻辑都在这里
-
-		infoList.value = [
-			...infoList.value,
-			
-		];
-		// console.log(`上传成功 ${res.key}`)
-		console.log(infoList.value)
-		emit('update:fileList', infoList.value);
-		params.onSuccess();
-	} catch (err) {
-		console.log(err, 'err');
-
-		ElMessage.error('网络错误，请稍后重试');
-		params.onError();
-	}
-};
-//文件限制
-const handleExceed = (files: any, fileList: any) => {
-	ElMessage.warning(`当前限制选择 ${props.limit} 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
-};
-//上传前的校验
-const handleChange = (rawFile: any) => {
-	const isLt = rawFile.size / 1024 / 1024 < props.fileSize;
-	if (!isLt) {
-		ElMessage.warning(`文件超过了最大限度 ${props.fileSize} MB!`);
-		infoList.value = infoList.value.slice(0, infoList.value.length - 1);
-		return;
-	}
-};
-</script>
-
-<style scoped lang="scss">
-.upload-container {
-	.upload-demo {
-		:deep(.el-upload-list) {
-			display: flex;
-			flex-wrap: wrap;
-			.el-upload-list__item {
-				width: calc(25% - 10px);
-				border: var(--el-border);
-				margin-right: 10px;
-			}
-		}
-	}
-}
-</style>

src/layout/navBars/breadcrumb/search.vue

@@ -9,7 +9,7 @@
 					ref="layoutMenuAutocompleteRef"
 					@select="onHandleSelect"
 					:fit-input-width="true"
-          value-key="path"
+					value-key="path"
 				>
 					<template #prefix>
 						<el-icon class="el-input__icon">
@@ -85,7 +85,7 @@ const createFilter: any = (queryString: string) => {
 const initTageView = () => {
 	if (state.tagsViewList.length > 0) return false;
 	tagsViewRoutes.value.map((v: any) => {
-		if (!v.meta.isHide) state.tagsViewList.push({ ...v });
+		if (!v.meta.isHide && v.permissionCode) state.tagsViewList.push({ ...v });
 	});
 };
 // 当前菜单选中时

src/router/route.ts

@@ -88,7 +88,7 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
 		},
 	},
 	{
-		path: '/system/roles/dataAuth',
+		path: '/system/roles/dataAuth/:id/:tagsViewName',
 		name: 'systemDataAuth',
 		component: () => import('@/views/system/dataAuth/index.vue'),
 		meta: {
@@ -112,15 +112,15 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
 		},
 	},
 	{
-		path: '/statistics/order/visitTable/:id/:startTime/:endTime/:orgId/:tagsViewName',
+		path: '/statistics/order/visitTable/:id/:tagsViewName',
 		name: 'statisticsOrderVisitTable',
 		component: () => import('@/views/statistics/order/visitTable.vue'),
 		meta: {
-			title: '不满意回访明细',
+			title: '回访不满意原因统计明细',
 		},
 	},
 	{
-		path: '/statistics/order/specialTable/:cause/:startTime:/:endTime/:tagsViewName',
+		path: '/statistics/order/specialTable/:cause/:tagsViewName',
 		name: 'statisticsOrderSpecialTable',
 		component: () => import('@/views/statistics/order/specialTable.vue'),
 		meta: {

src/views/statistics/department/orgSatisfied.vue

@@ -329,7 +329,6 @@ const getSummaries = (param: any) => {
 const router = useRouter();
 // 点击数字
 const onDetail = (key: string, row, type: string) => {
-  console.log(key, row, type);
   let StartDate = null;
   let EndDate = null;
   if (state.queryParams?.crTime) {

src/views/statistics/department/satisfied.vue

@@ -330,7 +330,6 @@ const getSummaries = (param: any) => {
 const router = useRouter();
 // 点击部门名称
 const onDetailOrg = (row: any) => {
-	console.log(row);
 	let StartDate = null;
 	let EndDate = null;
 	if (state.queryParams?.crTime) {
@@ -354,7 +353,6 @@ const onDetailOrg = (row: any) => {
 };
 // 点击数字
 const onDetail = (key: string, row, type: string) => {
-	console.log(key, row, type);
 	let StartDate = null;
 	let EndDate = null;
 	if (state.queryParams?.crTime) {

src/views/statistics/order/specialTable.vue

@@ -100,14 +100,15 @@ const state = reactive(<any>{
 const route = useRoute();
 const queryList = throttle(() => {
 	state.loading = true;
+	const historyParams = history.state;
 	const request = {
 		PageIndex: state.queryParams.PageIndex,
 		PageSize: state.queryParams.PageSize,
 		Keyword: state.queryParams.Keyword,
 		Cause: route.params.cause,
 		State: state.queryParams.State,
-		StartTime: route.params.startTime,
-		EndTime: route.params.endTime,
+		StartTime: historyParams.startTime,
+		EndTime: historyParams.endTime,
 	};
 	departmentSpecialDetail(request)
 		.then((res: any) => {
@@ -132,9 +133,6 @@ const visitDetail = (row: any) => {
 	specialAuditDetailRef.value.openDialog(row.id);
 };
 onMounted(() => {
-	if (route.params.cause && route.params.startTime && route.params.endTime) queryList();
-	else {
-		ElMessage.warning('参数错误');
-	}
+	queryList();
 });
 </script>

src/views/statistics/order/specials.vue

@@ -121,10 +121,12 @@ const handleDetail = (row: any) => {
 		name: 'statisticsOrderSpecialTable',
 		params: {
 			cause: row.cause,
-			startTime: startTime ?? 'null',
-			endTime: endTime ?? 'null',
 			tagsViewName: `特提统计明细(${row.cause})`,
 		},
+    state:{
+      startTime: startTime ?? 'null',
+      endTime: endTime ?? 'null',
+    }
 	});
 };
 onMounted(() => {

src/views/statistics/order/visitCount.vue

@@ -1,48 +1,86 @@
 <template>
-  <div class="statistics-order-visit-count-container layout-pd">
-    <!-- 搜索  -->
-    <el-card shadow="never">
-      <el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline>
-        <el-form-item label="回访员" prop="VisitName">
-          <el-input v-model="state.queryParams.VisitName" placeholder="回访员名称" clearable @keyup.enter="queryList" class="keyword-input" />
-        </el-form-item>
-        <el-form-item label="时间段" prop="crTime">
-          <el-date-picker
-            v-model="state.queryParams.crTime"
-            type="datetimerange"
-            unlink-panels
-            range-separator="至"
-            start-placeholder="开始时间"
-            end-placeholder="结束时间"
-            :shortcuts="shortcuts"
-            @change="queryList"
-            value-format="YYYY-MM-DD[T]HH:mm:ss"
-          />
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" @click="queryList" :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>
-    </el-card>
-    <el-card shadow="never">
-      <ProTable
-          ref="proTableRef"
-          :columns="columns"
-          :data="state.tableData"
-          @updateTable="queryList"
-          :loading="state.loading"
-          show-summary
-          border
-          row-key="orgId"
-          :pagination="false"
-          :summary-method="getSummaries"
-      >
-      </ProTable>
-    </el-card>
-  </div>
+	<div class="statistics-order-visit-count-container layout-pd">
+		<!-- 搜索  -->
+		<el-card shadow="never">
+			<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline>
+				<el-form-item label="回访员" prop="VisitName">
+					<el-input v-model="state.queryParams.VisitName" placeholder="回访员名称" clearable @keyup.enter="queryList" class="keyword-input" />
+				</el-form-item>
+				<el-form-item label="时间段" prop="crTime">
+					<el-date-picker
+						v-model="state.queryParams.crTime"
+						type="datetimerange"
+						unlink-panels
+						range-separator="至"
+						start-placeholder="开始时间"
+						end-placeholder="结束时间"
+						:shortcuts="shortcuts"
+						@change="queryList"
+						value-format="YYYY-MM-DD[T]HH:mm:ss"
+					/>
+				</el-form-item>
+				<el-form-item>
+					<el-button type="primary" @click="queryList" :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>
+		</el-card>
+		<el-row :gutter="20">
+			<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
+				<el-card shadow="never" v-loading="state.loading" class="statistics-item">
+					<el-statistic :value="state.data.aboutExpire">
+						<template #title>
+							<span class="color-info font14">智能回访量</span>
+						</template>
+					</el-statistic>
+				</el-card>
+			</el-col>
+			<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
+				<el-card shadow="never" v-loading="state.loading" class="statistics-item">
+					<el-statistic :value="state.data.havExpired">
+						<template #title>
+							<span class="color-info font14">智能回访满意量</span>
+						</template>
+					</el-statistic>
+				</el-card>
+			</el-col>
+			<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
+				<el-card shadow="never" v-loading="state.loading" class="statistics-item">
+					<el-statistic :value="state.data.countersignHandle">
+						<template #title>
+							<span class="color-info font14">智能回访不满意量</span>
+						</template>
+					</el-statistic>
+				</el-card>
+			</el-col>
+			<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
+				<el-card shadow="never" v-loading="state.loading" class="statistics-item">
+					<el-statistic :value="state.data.screenAudit">
+						<template #title>
+							<span class="color-info font14">智能回访失败</span>
+						</template>
+					</el-statistic>
+				</el-card>
+			</el-col>
+		</el-row>
+		<el-card shadow="never">
+			<ProTable
+				ref="proTableRef"
+				:columns="columns"
+				:data="state.tableData"
+				@updateTable="queryList"
+				:loading="state.loading"
+				show-summary
+				border
+				row-key="orgId"
+				:pagination="false"
+				:summary-method="getSummaries"
+			>
+			</ProTable>
+		</el-card>
+	</div>
 </template>
 <script setup lang="tsx" name="statisticsOrderVisitCount">
 import { onMounted, reactive, ref } from 'vue';
@@ -54,82 +92,93 @@ import dayjs from 'dayjs';
 // 定义变量内容
 
 const columns = ref<any>([
-  { type: 'index', fixed: 'left', width: 55, label: '序号', align: 'center' },
-  { prop: 'visitName', label: '回访员', align: 'center' },
-  { prop: 'aiVisitCount', label: '智能回访量', align: 'center' },
-  { prop: 'artificialVisitCount', label: '人工回访量', align: 'center' },
-  { prop: 'sumCount', label: '总回访量', align: 'center' },
+	{ type: 'index', fixed: 'left', width: 55, label: '序号', align: 'center' },
+	{ prop: 'visitName', label: '回访员', align: 'center' },
+	{ prop: 'aiVisitCount', label: '智能回访量', align: 'center' },
+	{ prop: 'artificialVisitCount', label: '人工回访量', align: 'center' },
+	{ prop: 'sumCount', label: '总回访量', align: 'center' },
 ]);
 const ruleFormRef = ref<RefType>(); // 表单ref
 const state = reactive({
-  queryParams: {
-    // 查询条件
-    VisitName: null, // 关键词
-    crTime: [dayjs().startOf('day').format('YYYY-MM-DD HH:mm:ss'), dayjs().endOf('day').format('YYYY-MM-DD HH:mm:ss')], // 时间默认今天开始到今天结束
-  },
-  tableData:[],
-  loading: false, // 加载
-  total: 0, // 总数
+	queryParams: {
+		// 查询条件
+		VisitName: null, // 关键词
+		crTime: [dayjs().startOf('day').format('YYYY-MM-DD HH:mm:ss'), dayjs().endOf('day').format('YYYY-MM-DD HH:mm:ss')], // 时间默认今天开始到今天结束
+	},
+	tableData: [],
+	loading: false, // 加载
+	total: 0, // 总数
+	data: {},
 });
 /** 获取列表 */
 const queryList = throttle(() => {
-  state.loading = true;
-  let StartDate = null;
-  let EndDate = null;
-  if (state.queryParams?.crTime) {
-    StartDate = state.queryParams?.crTime[0];
-    EndDate = state.queryParams?.crTime[1];
-  }
-  const request = {
-    StartDate,
-    EndDate,
-    VisitName: state.queryParams.VisitName,
-  };
-  departmentVisit(request)
-    .then((res: any) => {
-      state.tableData = res.result;
-      state.loading = false;
-    })
-    .catch(() => {
-      state.loading = false;
-    });
+	state.loading = true;
+	let StartDate = null;
+	let EndDate = null;
+	if (state.queryParams?.crTime) {
+		StartDate = state.queryParams?.crTime[0];
+		EndDate = state.queryParams?.crTime[1];
+	}
+	const request = {
+		StartDate,
+		EndDate,
+		VisitName: state.queryParams.VisitName,
+	};
+	departmentVisit(request)
+		.then((res: any) => {
+			state.tableData = res.result;
+			state.loading = false;
+		})
+		.catch(() => {
+			state.loading = false;
+		});
 }, 300);
 /** 重置按钮操作 */
 const resetQuery = throttle((formEl: FormInstance | undefined) => {
-  if (!formEl) return;
-  formEl.resetFields();
-  queryList();
+	if (!formEl) return;
+	formEl.resetFields();
+	queryList();
 }, 300);
 // 合计
 const getSummaries = (param: any) => {
-  const { columns, data } = param;
-  const sums: string[] = [];
-  columns.forEach((column: { property: string }, index: number) => {
-    if (index === 0) {
-      sums[index] = '合计';
-      return;
-    }
-    const values = data.map((item: { [x: string]: any }) => Number(item[column.property]));
-    if (['visitName'].includes(column.property)) {
-      //百分比不能计算
-      sums[index] = '';
-      return '';
-    } else if (!values.every((value: unknown) => Number.isNaN(value))) {
-      sums[index] = `${values.reduce((prev: any, curr: any) => {
-        const value = Number(curr);
-        if (!Number.isNaN(value)) {
-          return prev + curr;
-        } else {
-          return prev;
-        }
-      }, 0)}`;
-    } else {
-      sums[index] = ' ';
-    }
-  });
-  return sums;
+	const { columns, data } = param;
+	const sums: string[] = [];
+	columns.forEach((column: { property: string }, index: number) => {
+		if (index === 0) {
+			sums[index] = '合计';
+			return;
+		}
+		const values = data.map((item: { [x: string]: any }) => Number(item[column.property]));
+		if (['visitName'].includes(column.property)) {
+			//百分比不能计算
+			sums[index] = '';
+			return '';
+		} else if (!values.every((value: unknown) => Number.isNaN(value))) {
+			sums[index] = `${values.reduce((prev: any, curr: any) => {
+				const value = Number(curr);
+				if (!Number.isNaN(value)) {
+					return prev + curr;
+				} else {
+					return prev;
+				}
+			}, 0)}`;
+		} else {
+			sums[index] = ' ';
+		}
+	});
+	return sums;
 };
 onMounted(() => {
-  queryList();
+	queryList();
 });
 </script>
+<style scoped lang="scss">
+:deep(.el-statistic__content) {
+	font-size: 32px;
+	font-weight: bold;
+	margin-top: 15px;
+}
+.statistics-item {
+	margin-bottom: 10px;
+}
+</style>

src/views/statistics/order/visitDiscontent.vue

@@ -136,9 +136,6 @@ const resetQuery = throttle((formEl: FormInstance | undefined) => {
 const router = useRouter();
 const handleDetail = (row: any) => {
 	const columnKey = Object.keys(row.row).find((item) => item === row.column.property);
-	const columnName = columns.value.find((item) => item.prop === columnKey)?.label;
-	const columnValue = row.row[columnKey];
-	if (!columnValue) return ElMessage.warning('暂无数据');
 	let startTime = null;
 	let endTime = null;
 	if (state.queryParams?.crTime) {
@@ -149,10 +146,12 @@ const handleDetail = (row: any) => {
 		name: 'statisticsOrderVisitTable',
 		params: {
 			id: columnKey,
+			tagsViewName: `回访不满意原因统计明细`,
+		},
+		state: {
 			startTime: startTime ?? 'null',
 			endTime: endTime ?? 'null',
 			orgId: row.row?.OrgCode,
-			tagsViewName: `满意度统计明细(${row.row?.OrgName}-${columnName})`,
 		},
 	});
 };

src/views/statistics/order/visitTable.vue

@@ -121,16 +121,17 @@ const state = reactive(<any>{
 });
 /** 获取列表 */
 const route = useRoute();
+const historyParams = history.state;
 const queryList = throttle(() => {
 	state.loading = true;
 	const request = {
 		PageIndex: state.queryParams.PageIndex,
 		PageSize: state.queryParams.PageSize,
 		Keyword: state.queryParams.Keyword,
-		OrgCode: route.params.orgId,
+		OrgCode: historyParams.orgId,
 		DissatisfiedKey: route.params.id,
-		StartTime: route.params.startTime,
-		EndTime: route.params.endTime,
+		StartTime: historyParams.startTime,
+		EndTime: historyParams.endTime,
 	};
 	departmentUnsatisfiedDetail(request)
 		.then((res: any) => {
@@ -155,7 +156,7 @@ const visitDetail = (row: any) => {
 	visitDetailRef.value.openDialog(row.orderVisit, '回访详情');
 };
 onMounted(() => {
-	if (route.params.orgId && route.params.id && route.params.startTime && route.params.endTime) queryList();
+	if (route.params.id) queryList();
 	else {
 		ElMessage.warning('参数错误');
 	}

src/views/system/dataAuth/index.vue

@@ -1,22 +1,16 @@
 <template>
 	<div class="system-dataAuth-container layout-padding">
 		<div class="layout-padding-auto layout-padding-view pd20">
-			<!-- 正常 -->
-			<template v-if="state.roleId">
-				<ProTable ref="proTableRef" :columns="columns" :data="state.tableData" @updateTable="queryList" :loading="state.loading" :pagination="false">
-					<template #tableHeader="scope">
-						<el-button type="primary" @click="onAddAuth"> <SvgIcon name="ele-Plus" class="mr5" />新增 </el-button>
-					</template>
-					<!-- 表格操作 -->
-					<template #operation="{ row }">
-						<el-button link type="primary" @click="onEditAuth(row)" title="修改"> 修改 </el-button>
-						<el-button link type="danger" @click="onRowDel(row)" title="删除"> 删除 </el-button>
-					</template>
-				</ProTable>
-			</template>
-			<template v-else>
-				<Empty description="参数不正确，请关闭重新打开页面" />
-			</template>
+			<ProTable ref="proTableRef" :columns="columns" :data="state.tableData" @updateTable="queryList" :loading="state.loading" :pagination="false">
+				<template #tableHeader="scope">
+					<el-button type="primary" @click="onAddAuth"> <SvgIcon name="ele-Plus" class="mr5" />新增 </el-button>
+				</template>
+				<!-- 表格操作 -->
+				<template #operation="{ row }">
+					<el-button link type="primary" @click="onEditAuth(row)" title="修改"> 修改 </el-button>
+					<el-button link type="danger" @click="onRowDel(row)" title="删除"> 删除 </el-button>
+				</template>
+			</ProTable>
 		</div>
 
 		<data-auth-add ref="dataAuthAddRef" @updateList="queryList" />
@@ -27,7 +21,6 @@
 <script lang="tsx" setup name="systemDataAuth">
 import { defineAsyncComponent, ref, reactive, onMounted } from 'vue';
 import { ElMessageBox, ElMessage, ElButton } from 'element-plus';
-import { useRoute } from 'vue-router';
 import { throttle } from '@/utils/tools';
 import { getDataAuthorityByRole, deleteDataAuth, baseData } from '@/api/system/roles';
 
@@ -58,9 +51,10 @@ const handleQuery = throttle(() => {
 	queryList();
 }, 1000);
 /** 获取用户列表 */
+const historyParams = history.state;
 const queryList = throttle(() => {
 	state.loading = true;
-	getDataAuthorityByRole(state.roleId)
+	getDataAuthorityByRole(historyParams.roleId)
 		.then((response: any) => {
 			state.tableData = response?.result ?? [];
 			state.loading = false;
@@ -106,13 +100,9 @@ const getBaseData = async () => {
 		console.log(error);
 	}
 };
-const route = useRoute(); //路由
 onMounted(() => {
-	if (route.query.id) {
-		state.roleId = route.query.id;
-		queryList();
-		getBaseData();
-	}
+	queryList();
+	getBaseData();
 });
 </script>
 <style lang="scss" scoped>

src/views/system/roles/index.vue

@@ -168,13 +168,15 @@ const showUserList = (row: Object) => {
 // 打开数据权限
 const onDataAuth = (row: any) => {
 	router.push({
-		path: '/system/roles/dataAuth',
-		query: {
+		name: 'systemDataAuth',
+		params: {
 			id: row.id,
-			code: row.name,
-			roleDisplay: row.displayName,
 			tagsViewName: '数据权限 ' + row.displayName,
 		},
+    state:{
+      code: row.name,
+      roleDisplay: row.displayName,
+    }
 	});
 };
 // 删除角色