jeecgBootUniapp/src/pages-humanResource/personnel/standingbook.vue

<template>
	<PageLayout :navbarShow="false">
		<wd-card style="margin: 10px;" id="top1">
			<wd-row>
				<wd-col :span="24"><uni-title title="所属单位" align="left" type="h5"></uni-title></wd-col>
			</wd-row>
			<wd-row>
				<wd-col :span="24">
					<SelectDept label="" v-model="orgCode" @change="getList" rowKey="orgCode" :multiple="false">
					</SelectDept>
				</wd-col>
			</wd-row>
			<wd-row>
				<wd-col :span="12"><uni-title title="姓名" align="left" type="h5"></uni-title></wd-col>
				<wd-col :span="12"><uni-title title="劳动合同号" align="left" type="h5"></uni-title></wd-col>
			</wd-row>
			<wd-row>
				<wd-col :span="12">
					<uni-easyinput v-model="realname" placeholder="姓名模糊查询" @change="getList" @clear="getList" />
				</wd-col>
				<wd-col :span="12">
					<uni-easyinput v-model="contractNumber" placeholder="劳动合同号模糊查询" @change="getList"
						@clear="getList" />
				</wd-col>
			</wd-row>
		</wd-card>
		<wd-table :data="list" :height="tableHeight">
			<wd-table-col prop="xh" label="序号" align="center" :width="screenWidth / 5"></wd-table-col>
			<wd-table-col prop="xm" label="姓名" align="center" :width="screenWidth / 5"></wd-table-col>
			<wd-table-col prop="xb_dictText" label="性别" align="center" :width="screenWidth / 5"></wd-table-col>
			<wd-table-col prop="nl" label="年龄" align="center" :width="screenWidth /5"></wd-table-col>
			<wd-table-col prop="" label="操作" align="center" :width="screenWidth / 5">
				<template #value="{row}">
					<text style="color: red;" @click="detail(row)">详情</text>
				</template>
			</wd-table-col>
		</wd-table>
		<wd-pagination custom-style="border: 1px solid #ececec;border-top:none" v-model="pageNo" :total="total"
			@change="handleChange"></wd-pagination>
	</PageLayout>
</template>

<script setup>
	import {
		useMessage,
		useToast
	} from 'wot-design-uni'
	import SelectDept from '@/components/SelectDept/SelectDept'
	import {
		listApi
	} from '@/api/humanResource/personnel'
	const message = useMessage()
	const toast = useToast()
	const realname = ref('') //姓名查询
	const contractNumber = ref('') //劳动合同号查询
	const orgCode = ref('') //单位查询
	const list = ref([])
	let pageNo = 0
	let pageSize = 10
	const total = ref(0)
	const screenHeight = ref(0)
	const screenWidth = ref(0)
	const tableHeight = ref(0)
	const getList = (e) => {
		if (e != 1) { //为1时是切换页码
			pageNo = 1
		}
		let params = {
			xm: '*' + realname.value + '*',
			ldhth: '*' + contractNumber.value + '*'
		}
		if (orgCode.value.length <= 9) {
			params.orgCode = orgCode.value + '*';
		} else {
			params.jcxd_code = orgCode.value + '*';
		}
		listApi({
				...params,
				pageNo,
				pageSize
			}).then((res) => {
				if (res.success) {
					list.value = res.result.records.map((item, index) => ({
						...item, // 保留原有字段
						xh: index + 1, // 添加序号 xh，从 1 开始
					}));
					total.value = res.result.total
				}
				// getHeight();
			})
			.catch((err) => {
				console.log(err);
			});
	}

	/*切换页码*/
	const handleChange = ({
		value
	}) => {
		pageNo = value
		getList(1)
	}

	const calculateTableHeight = () => {
		const systemInfo = uni.getSystemInfoSync();
		screenWidth.value = systemInfo.screenWidth;
		screenHeight.value = systemInfo.screenHeight;
		// 获取页面顶部元素高度（导航栏+日期选择器）
		const query = uni.createSelectorQuery();
		query.select('#top1').boundingClientRect(data => {
			const topHeight = data ? data.height : 0;
			const navHeight = 88; // 导航栏高度
			const margin = 20; // 上下边距
			// 计算表格可用高度
			tableHeight.value = screenHeight.value - topHeight - navHeight;
		}).exec();
	}

	function detail(record) {
		uni.navigateTo({
			url: './detail?data=' + encodeURIComponent(JSON.stringify(record))
		});
	}

	onMounted(() => {
		getList();
		calculateTableHeight();
		// 监听屏幕旋转变化
		uni.onWindowResize(() => {
			calculateTableHeight();
		});
	})
</script>

<style>
</style>