wiki_enterprise_js/pages/get-code/get-code.vue

<template>
	<view>
		<form class="padding-lr cu-form-group flex-direction">
			<view class="cu-form-group flex flex-direction padding-tb">
				<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>当前所在地区</view>
				<input placeholder="请输入当前所在地区" name="input" type="text" v-model="area" />
				<button @tap="handleSelectLocation">选择位置</button>
			</view>
			<view class="cu-form-group flex flex-direction padding-tb">
				<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>当前所在详细地址</view>
				<input placeholder="请输入详细地址(含门牌号)" name="input" type="text" v-model="address" />
			</view>
			<view class="cu-form-group flex flex-direction padding-top">
				<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>当前状态</view>
				<radio-group class="block" @change="StateChange">
					<view class="cu-list menu text-left">
						<view class="cu-item" v-for="(state,index) in status" :key="index">
							<label class="flex justify-between align-center">
								<radio class="round margin-right-xs" :checked="index === current" :value="state.value"></radio>
								<view class="flex-sub" style="font-size: 34rpx;">{{ state.name }}</view>
							</label>
						</view>
					</view>
				</radio-group>
			</view>
			<view class="cu-form-group flex flex-direction padding-tb">
				<view class="title padding-bottom-sm">就诊医院（若无填无）</view>
				<input placeholder="请输入就诊医院" name="input" type="text" v-model="hospital" />
			</view>
			<view class="cu-form-group flex flex-direction padding-top">
				<view class="title padding-bottom-sm">最近14天是否有武汉居住史、旅游史或武汉亲戚来访</view>
				<radio-group class="block" @change="TourChange">
					<view class="flex">
						<view class="flex-sub margin-tb-sm" v-for="(tour,index) in tours" :key="index">
							<label class="flex justify-between align-center">
								<radio class="round margin-right-xs" :checked="index === tourCurrent" :value="tour.value"></radio>
								<text class="flex-sub" style="font-size: 34rpx;">{{ tour.name }}</text>
							</label>
						</view>
					</view>
				</radio-group>
			</view>
			
			<view class="cu-form-group flex flex-direction padding-top">
				<view class="title padding-bottom-sm">最近14天是否有新冠肺炎患者或疑似患者接触史</view>
				<radio-group class="block" @change="TouchChange">
					<view class="flex">
						<view class="flex-sub margin-tb-sm" v-for="(touch,index) in touches" :key="index">
							<label class="flex justify-between align-center">
								<radio class="round margin-right-xs" :checked="index === touchCurrent" :value="touch.value"></radio>
								<text class="flex-sub" style="font-size: 34rpx;">{{ touch.name }}</text>
							</label>
						</view>
					</view>
				</radio-group>
			</view>
			<view class="cu-form-group flex flex-direction padding-tb">
				<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>当前体温（℃）</view>
				<input placeholder="请输入当前真实体温" name="input" type="number" v-model="temperature" />
			</view>
		</form>
		
		<view class="margin flex flex-wrap">
			<view @click="agree = !agree" class="iconfont agree-box" :class="[agree ? 'text-blue icon-check-square': 'text-gray icon-border']"></view>
			<view class="text-df text-black flex-sub agree-text">
				以上信息是我本人填写，本人对信息的真实性和完整性负责。
			</view>
		</view>
		<button class="bg-cyan margin primary-btn" hover-class="cc-active" @tap="addStroke">确认提交</button>
		<!-- 历史 -->
		<button class="shadow round bg-cyan history-btn iconfont icon-history" hover-class="cc-active" @tap="openPage('/pages/my-code/my-code')"></button>
  </view>
</template>

<script>
import { showToast } from 'common/script/util';

export default {
	data() {
		return {
			area: '',
			address: '',
			status: [
				{
					value: '0',
					name: '正常',
				},
				{
					value: '1',
					name: '发烧（377.3度以上）',
				},
				{
					value: '2',
					name: '咳嗽',
				},
				{
					value: '3',
					name: '咽喉疼痛',
				},
				{
					value: '4',
					name: '流鼻涕',
				},
				{
					value: '5',
					name: '头痛',
				},
				{
					value: '6',
					name: '其他',
				}
			],
			hospital: '',
			tours: [
				{
					value: 1,
					name: '是'
				},
				{
					value: 0,
					name: '否'
				}
			],
			touches: [
				{
					value: 1,
					name: '是'
				},
				{
					value: 0,
					name: '否'
				}
			],
			temperature: '',
			current: 0,
			tourCurrent: 0,
			touchCurrent: 0,
			agree: false,
		};
	},
	methods: {
		handleSelectLocation() {
		  uni.chooseLocation({
		    success: function(res) {
		      console.log('位置名称：' + res.name);
		      console.log('详细地址：' + res.address);
		      console.log('纬度：' + res.latitude);
		      console.log('经度：' + res.longitude);
		    },
		  });
		},
		
		// 状态
		StateChange: function(evt) {
			for (let i = 0; i < this.status.length; i++) {
				if (this.status[i].value === evt.target.value) {
					this.current = i;
					break;
				}
			}
		},
		
		// 旅游
		TourChange: function(evt) {
			for (let i = 0; i < this.tours.length; i++) {
				if (this.tours[i].value === evt.target.value) {
					this.tourCurrent = i;
					break;
				}
			}
		},
		
		// 接触
		TouchChange: function(evt) {
			for (let i = 0; i < this.touches.length; i++) {
				if (this.touches[i].value === evt.target.value) {
					this.touchCurrent = i;
					break;
				}
			}
		},
		
		/**
		 * 提交基本信息
		*/
		addStroke() {
			if (!this.area) {
			  showToast('请输入当前所在地区');
			  return;
			}
			if (!this.address) {
			  showToast('请输入当前所在地址');
			  return;
			}
			if (!this.status) {
			  showToast('请选择状态');
			  return;
			}
			if (!this.temperature) {
			  showToast('请输入当前体温');
			  return;
			}
			if (!this.agree) {
				showToast('请确定是否为本人填写');
				return;
			}
			uni.reLaunch({
				url: `/pages/index/index`,
			});
		},
	
	},
};
</script>

<style lang="scss" scoped>
	.agree-box{
		width: 70rpx;
	}
	.agree-text{
		line-height: 60rpx;
	}
	.primary-btn{
		border-radius: 15rpx;
	}
	.history-btn{
		position: fixed;
		bottom: 40rpx;
		right: 40rpx;
		width: 96rpx;
		height: 96rpx;
		line-height: 96rpx;
		padding: 0;
	}
	.history-btn::after{
		border: none;
	}
</style>