myjtp/pages/certificate/query.vue

<template>
	<view id="myApp">
		<view class="information" >
			<form name="myform">
			<view class="input">
				<view class="img">
					<img src="@/static/img/icon-2.png" >
				</view>
				<input type="text" v-model="name" placeholder="请输入会员姓名" />
			</view>
			<view class="input">
				<view class="img">
					<img src="@/static/img/icon-1.png" >
				</view>
				<input type="text" v-model="idcard" placeholder="请输入会员身份证号" />
			</view>
			<view class="button" @click="submit">
				立即查询
			</view>
			</form>
		</view>
	</view>
</template>

<script>
import { query } from '../../api/apply.js'
import { mapMutations } from 'vuex';
	export default {
		data() {
			return {
				name: '',
				idcard: '',
				type: ''
			}
		},
		onLoad(options) {
			this.type = options.type
		},
		methods: {
			...mapMutations('user', ['setInformation']),
			submit() {
				const obj = this
				const data = obj.type == 1 ? { name: this.name, idcard: this.idcard }: { name: this.name }
				query(data,obj.type).then(res => {
					obj.setInformation(res.data.data)
					uni.navigateTo({
						url: '/pages/apply/success?type='+this.type
					})
				}).catch(res => {
					console.log(res)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
body {
	margin: 0;
	background-color: #f3f3f3;
}
.header img{
	width: 100%;
}
.information {
	padding: 10px 0;
	background-color: #fff;
	width: 95%;
	margin: 15px auto;
	border-radius: 10px;
}
.information .input{
	padding: 10px;
	padding-bottom: 10px;
	padding-top: 30px;
	margin: auto auto;
	text-align: center;
	width: 90%;
	border-bottom: solid 1px #d8d8d8;
	display: flex;
}
.information .input .img{
	width: 30px;
	margin: auto 0;
	margin-right: 5px;
}
.information .input .img img{
	height: 20px;
	margin: auto 0;
}
.information .input input{
	text-align: left;
	font-size: 15px;
	width: 90%;
	border: 0;
	height: 20px;
	padding-bottom: 0;
}
.button {
	margin: 30px auto;
	text-align: center;
	font-size: 15px;
	color: #fff;
	background-color: #3b66f5;
	border-radius: 30px;
	padding: 10px;
	width: 70%;
}
</style>