315 lines
6.6 KiB
Vue
315 lines
6.6 KiB
Vue
<template>
|
||
<view class="content">
|
||
<uni-section class="card">
|
||
<view class="test">家长信息绑定</view>
|
||
<uni-card>
|
||
<view class="bind">
|
||
<view class="name">
|
||
<view class="bindtitle">
|
||
家长姓名:
|
||
</view>
|
||
<input type="text" v-model="data.parentName">
|
||
</view>
|
||
<view class="phone">
|
||
<view class="bindtitle">
|
||
家长电话:
|
||
</view>
|
||
<input type="text" v-model="data.phone" maxlength="11">
|
||
</view>
|
||
<view class="id">
|
||
<view class="bindtitle">
|
||
学生身份证:
|
||
</view>
|
||
<input type="text" v-model="data.cardNo" maxlength="18">
|
||
</view>
|
||
<view class="" style="margin:50rpx 0 0 15rpx;font-size: 28rpx;line-height: 50rpx;">
|
||
<checkbox value="cb" :checked="checked" />我已阅读并同意
|
||
<view class="" style="display: inline-block;color:#4D8CE9;border-bottom:1rpx solid #4D8CE9;"
|
||
@tap='maskshow=true'>
|
||
《隐私保护协议》
|
||
</view>
|
||
<!-- <u-checkbox-group @change="checkboxGroupChange">
|
||
<u-checkbox @change="checkboxChange" v-model="checkeds.checked" :name="checkeds.name">
|
||
{{checkeds.name}}
|
||
</u-checkbox>
|
||
</u-checkbox-group> -->
|
||
</view>
|
||
<view class="btn">
|
||
<button @tap="cancel()">取消</button>
|
||
<button @tap="bindParent">确定</button>
|
||
</view>
|
||
</view>
|
||
</uni-card>
|
||
</uni-section>
|
||
<view class="masks" style="" v-if="maskshow">
|
||
<view class="mask">
|
||
<view class="title">
|
||
智慧幼儿体质评估与促进系统隐私保护
|
||
</view>
|
||
<view class="text" style="">
|
||
<P>本指引是智慧幼儿体质评估与促进系统小程序开发者为收集、使用和存储您的信息而制定。</P>
|
||
<p>开发者收集信息：</p>
|
||
<ul>
|
||
<li>1、开发者收集您的姓名，用于绑定学生家长信息；</li>
|
||
<li>2、开发者收集学生身份证号，用于确认学生身份及成绩信息；</li>
|
||
<li>3、开发者收集您的手机号，用于查询学生绑定的信息；</li>
|
||
</ul>
|
||
开发者对信息的存储：
|
||
<li>1、存储地点：境内</li>
|
||
<li>2、存储期限：小程序停止运营后及时删除；</li>
|
||
<view class="" style="margin-top: 50rpx;">
|
||
本次操作遵守国家相关法律法规，采集的信息仅用于学生体质评估报告的相关信息查询。
|
||
</view>
|
||
</view>
|
||
<view class="btns">
|
||
<view class="btn1" @tap='maskshow=false'>取消</view>
|
||
<view class="btn2" @tap='checkeds'>阅读并同意</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- <img src="/static/name.png" alt="" sizes="" srcset=""> -->
|
||
<!-- <text v-model="data.parentName">{{data.parentName}}</text> -->
|
||
<!-- <input type="text" v-model="data.phone">-->
|
||
<u-toast ref="uToast" />
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
bindParent
|
||
} from '@/api/index/index.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
checked: false,
|
||
maskshow: false,
|
||
data: {
|
||
// 370883199909083232
|
||
// 18363008969
|
||
// 小刘
|
||
cardNo: "",
|
||
parentName: "",
|
||
phone: "",
|
||
openId: '',
|
||
list: [{
|
||
type: 'error',
|
||
icon: false,
|
||
title: '确定',
|
||
message: "",
|
||
}],
|
||
},
|
||
}
|
||
},
|
||
methods: {
|
||
//点击隐私保护的确定
|
||
checkeds() {
|
||
this.checked = true;
|
||
this.maskshow = false
|
||
},
|
||
//点击确定
|
||
bindParent() {
|
||
if (this.checked == false) {
|
||
this.$refs.uToast.show({
|
||
title: '请先阅读《隐私保护协议》',
|
||
type: 'error'
|
||
})
|
||
setTimeout(() => {
|
||
this.maskshow = true
|
||
}, 500)
|
||
} else {
|
||
uni.removeStorage({
|
||
key: 'phone',
|
||
success: function(res) {}
|
||
});
|
||
bindParent(this.data).then(res => {
|
||
if (res.code == 200) {
|
||
uni.setStorage({
|
||
key: 'phone',
|
||
data: res.msg
|
||
});
|
||
uni.navigateTo({
|
||
url: '/pages/index/index'
|
||
})
|
||
this.$refs.uToast.show({
|
||
title: '添加成功',
|
||
type: 'success'
|
||
})
|
||
} else if (res.code == 500) {
|
||
this.$refs.uToast.show({
|
||
title: res.msg,
|
||
type: 'error'
|
||
})
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
},
|
||
//取消按钮
|
||
cancel() {
|
||
uni.removeStorageSync('user');
|
||
uni.navigateTo({
|
||
url: '/pages/index/index'
|
||
})
|
||
},
|
||
|
||
},
|
||
//开局获取
|
||
onLoad(options) {
|
||
this.data.openId = options.openId
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.text {
|
||
margin-top: 40rpx;
|
||
padding-bottom: 80rpx;
|
||
}
|
||
|
||
.btn1,
|
||
.btn2 {
|
||
width: 50%;
|
||
height: 80rpx;
|
||
line-height: 80rpx;
|
||
text-align: center;
|
||
display: inline-block;
|
||
position: absolute;
|
||
background-color: #fff;
|
||
bottom: -80rpx;
|
||
}
|
||
|
||
.btn2 {
|
||
border-top: 1px solid #eeeeee;
|
||
/* background-color: #4486e8; */
|
||
right: 0;
|
||
}
|
||
|
||
.btn1 {
|
||
border-top: 1px solid #eeeeee;
|
||
border-right: 1px solid #eeeeee;
|
||
background-color: #4486e8;
|
||
color: #fff;
|
||
left: 0;
|
||
}
|
||
|
||
.masks {
|
||
background-color: rgba(246, 247, 248, 0.5);
|
||
height: 100%;
|
||
width: 100%;
|
||
position: absolute;
|
||
top: 0;
|
||
z-index: 999;
|
||
}
|
||
|
||
.mask {
|
||
width: 90%;
|
||
padding: 0 30rpx 0 30rpx;
|
||
background-color: #fff;
|
||
margin: 150rpx auto;
|
||
opacity: 1;
|
||
position: relative;
|
||
}
|
||
|
||
.title {
|
||
height: 100rpx;
|
||
line-height: 100rpx;
|
||
border-bottom: 1px solid #eeeeee;
|
||
/* background-color: red; */
|
||
font-size: 36rpx;
|
||
margin: 0px auto;
|
||
width: 100%;
|
||
text-align: center;
|
||
/* line-height: 80rpx; */
|
||
}
|
||
|
||
.content {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
min-height: 100vh;
|
||
background-image: linear-gradient(#8CCDDF, #fff);
|
||
color: #707374;
|
||
// height: 1230rpx;
|
||
// margin-top: 50rpx;
|
||
}
|
||
|
||
::v-deep .u-checkbox__icon-wrap {
|
||
border: 1rpx solid #000000;
|
||
}
|
||
|
||
.bind {
|
||
|
||
// background-color: #eeeeee;
|
||
width: 670rpx;
|
||
height: 750rpx;
|
||
border-radius: 20rpx;
|
||
font-size: 37rpx;
|
||
// margin-right: -50rpx;
|
||
}
|
||
|
||
.test {
|
||
line-height: 104rpx;
|
||
margin: 0 auto;
|
||
color: #4486e8;
|
||
font-size: 45rpx;
|
||
margin-top: 80rpx;
|
||
text-align: center;
|
||
margin-bottom: 50rpx;
|
||
}
|
||
|
||
img {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
float: left;
|
||
margin-top: 30rpx;
|
||
margin-left: 30rpx;
|
||
margin-right: 40rpx;
|
||
}
|
||
|
||
.name,
|
||
.id,
|
||
.phone {
|
||
font-size: 34rpx;
|
||
width: 100%;
|
||
margin: 0 auto;
|
||
display: flex;
|
||
height: 130rpx;
|
||
line-height: 130rpx;
|
||
border-bottom: mediumaquamarine 2rpx solid;
|
||
|
||
input {
|
||
height: 130rpx;
|
||
width: 65%;
|
||
line-height: 130rpx;
|
||
// padding-left: 30rpx;
|
||
}
|
||
|
||
.bindtitle {
|
||
width: 35%;
|
||
}
|
||
}
|
||
|
||
.btn {
|
||
width: 500rpx;
|
||
height: 90rpx;
|
||
margin: 0 auto;
|
||
display: flex;
|
||
justify-content: center;
|
||
margin-top: 140rpx;
|
||
}
|
||
|
||
button {
|
||
width: 220rpx;
|
||
// height: 100rpx;
|
||
background-color: #79E7E1;
|
||
color: #fff;
|
||
}
|
||
</style>
|