jeecgBootUniapp/src/pages-politics/healthfollow/send.vue

<template>
	<PageLayout :navbarShow="false">
		<wd-card style="margin: 10px; display: flex; justify-content: center; align-items: center;" id="top1">
			<wd-row>
				<wd-col :span="12" style="display: flex; justify-content: center;">
					<uni-easyinput v-model="realname" placeholder="姓名模糊查询" @change="getpersonList"
						@clear="getpersonList" />
				</wd-col>
				<wd-col :span="12" style="display: flex; justify-content: center;">
					<wd-button @click="sendMessage">发送消息</wd-button>
				</wd-col>
			</wd-row>
		</wd-card>
		<wd-table :data="list" :height="tableHeight">
			<wd-table-col prop="ldhth" label="" align="center" :width="screenWidth / 5">
				<template #value="{row}">
					<wd-checkbox v-model="row.checked" @change="handleCheckboxChange(row)"></wd-checkbox>
				</template>
			</wd-table-col>
			<wd-table-col prop="xh" label="序号" align="center" :width="screenWidth / 5"></wd-table-col>
			<!-- <wd-table-col prop="dw" 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="nl" 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>
		<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 {
		followpersonList
	} from '@/api/healthfollow/healthfllow'


	const realname = 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 getpersonList = (e) => {
		if (e != 1) { //为1时是切换页码
			pageNo = 1
		}
		let params = {
			xm: '*' + realname.value + '*'
		}
		followpersonList({
				...params,
				pageNo,
				pageSize
			}).then((res) => {
				console.log("res--健康随访---", res)
				if (res.success) {
					list.value = res.result.records.map((item, index) => ({
						...item, // 保留原有字段
						xh: index + 1, // 添加序号 xh，从 1 开始
						checked: true // 新增选中状态字段，默认设置为true
					}));
					total.value = res.result.total
				}
				// getHeight();
			})
			.catch((err) => {
				console.log(err);
			});
	}

	const sendMessage = () => {
		// 过滤出选中的行
		const selectedData = list.value.filter(item => item.checked);

		if (selectedData.length === 0) {
			useToast().show('请先选择要发送消息的人员');
			return;
		}
		// 收集所有选中项的 ldhth 字段并以逗号拼接
		const ldhthValues = selectedData.map(item => item.ldhth).join(',');
		console.log('拼接后的 ldhth 值:', ldhthValues);


	}

	const handleCheckboxChange = (row) => {
		// 这里可以添加额外的选中状态处理逻辑
		console.log(`选中状态变更: ${row.xm}，当前状态: ${row.checked}`);
	}

	/*切换页码*/
	const handleChange = ({
		value
	}) => {
		pageNo = value
		getpersonList(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();
	}


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

<style>
</style>