jeecgBootUniapp/src/pages-politics/health/add.vue

<route lang="json5" type="page">
	{
	layout: 'default',
	style: {
	navigationStyle: 'custom',
	navigationBarTitleText: '健康填报',
	},
	}
</route>
<template>
	<PageLayout navTitle="健康填报">
		<view class="form-container">
			<wd-form ref="form" :model="model">
				<!-- 血压数据卡片 -->
				<view class="card">
					<wd-cell-group title="血压数据">
						<wd-input type="number" label="高压值(mmHg)" prop="gyz" v-model="model.gyz" label-width="200px"
							:rules="[{ required: true, message: '请输入高压值' }]" />
						<wd-input type="number" label="低压值(mmHg)" prop="dyz" v-model="model.dyz" label-width="200px"
							:rules="[{ required: true, message: '请输入低压值' }]" />
					</wd-cell-group>
				</view>
				<!-- 健康指标卡片 -->
				<view class="card">
					<wd-cell-group title="健康指标">
						<wd-input type="number" label="心率(次/分)" prop="xl" v-model="model.xl" label-width="200px"
							:rules="[{ required: true, message: '请输入心率' }]" />
						<wd-input type="number" label="血糖值(mmol/L)" prop="xtz" v-model="model.xtz" label-width="200px"
							:rules="[{ required: true, message: '请输入血糖值' }]" />
						<wd-input type="number" label="体重(kg)" prop="tz" v-model="model.tz" label-width="200px"
							:rules="[{ required: true, message: '请输入体重' }]" />
					</wd-cell-group>
				</view>
				<!-- 其他信息卡片 -->
				<view class="card">
					<wd-cell-group title="其他信息">
						<wd-input label="当前位置" prop="wzzb" v-model="model.wzzb" label-width="200px" />
						<wd-cell title="附件" prop="path" title-width="200px">
							<wd-upload :accept="accept" v-model:file-list="model.path" :action="uploadUrl"
								multiple></wd-upload>
						</wd-cell>
					</wd-cell-group>
				</view>

				<!-- 提交按钮 -->
				<view class="footer">
					<wd-button type="primary" size="large" @click="handleSubmit" block>
						提交健康数据
					</wd-button>
				</view>
			</wd-form>
		</view>
	</PageLayout>
</template>

<script setup>
	import {
		useMessage,
		useToast
	} from 'wot-design-uni'
	import {
		useAppStore
	} from '@/store';
	import {
		useUserStore
	} from '@/store/user';
	import {
		addApi,
		queryIf3rdGxyApi
	} from '@/api/politics/health'
	import {
		getEnvBaseUrl
	} from '@/utils/index'

	const message = useMessage()
	const toast = useToast()
	const appStore = useAppStore();
	const userStore = useUserStore(); //登录人信息
	const form = ref()
	const model = reactive({
		gyz: '', // 高压值
		dyz: '', // 低压值
		xl: '', // 心率
		xtz: '', // 血糖值
		tz: '', // 体重
		wzzb: appStore.location, // 位置坐标
		path: [] // 附件
	})
	const accept = ref('image')
	const uploadUrl = ref(getEnvBaseUrl() + '/sys/common/upload?appPath=健康填报/' + userStore.userInfo.department + '/' +
		userStore.userInfo.realname)

	const handleSubmit = () => {
		form.value.validate().then(({
			valid,
			errors
		}) => {
			if (valid) {
				const submitData = {
					...model,
					path: model.path.map(item => {
						const response = JSON.parse(item.response);
						return response.message;
					}).join(',')
				}
				message
					.confirm({
						msg: '确认提交健康数据？',
						title: '提示',
					})
					.then(() => {
						addApi(submitData).then(res => {
							if (res.success) {
								toast.success(res.message)
							} else {
								toast.warning(res.message)
							}
						})
					})
					.catch(() => {})
			}
		})
	}

	const if3rdGxy = () => {
		/**获取当前用户是否是三级高血压，是需要上传视频，否可以上传图片*/
		queryIf3rdGxyApi(userStore.userInfo.workNo).then(res => {
			if (res) {
				accept.value = 'video';
			} else {
				accept.value = 'image';
			}
		})
	}

	onLoad(() => {
		if3rdGxy()
	})
</script>

<style lang="scss" scoped>
	.form-container {
		padding: 20rpx;
		background-color: #f5f7fa;
		min-height: 100vh;
	}

	.card {
		background: #ffffff;
		border-radius: 16rpx;
		box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
		margin-bottom: 30rpx;
		overflow: hidden;
	}

	.footer {
		padding: 40rpx 0;
	}
</style>