729 lines
15 KiB
Vue
729 lines
15 KiB
Vue
<template>
|
|
<view class="content">
|
|
<view class="" style="width:100%">
|
|
<view class="top" v-show="top"></view>
|
|
<view class="nicheng" v-if="login" @tap='wxGetUserInfo'>
|
|
<view class="tx-w">
|
|
<view class="tx">
|
|
<image class="tx-img" src="/static/dl.png" v-if="yonghuwx.length==0"></image>
|
|
<image class="tx-img" src="/static/dl.png" v-else-if="yonghuwx.avatarUrl==''"></image>
|
|
<image class="tx-img" :src="yonghuwx.avatarUrl" v-else></image>
|
|
<view class="zx"></view>
|
|
</view>
|
|
<view class="infos">
|
|
<view class="studentName" v-if="parentList.parentName==''">姓名:{{yonghuwx.nickName}}</view>
|
|
<view class="studentName" v-else>姓名:{{parentList.parentName}}</view>
|
|
<view class="name" v-if="yonghuwx.length==0">昵称:{{parentList.parentName}} </view>
|
|
<view class="name" v-else-if="yonghuwx.nickName==''">昵称:{{parentList.parentName}} </view>
|
|
<view class="name" v-else>昵称:{{yonghuwx.nickName}} </view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="nicheng2" v-else>
|
|
<view class="tx-w">
|
|
<view class="tx" style="margin-left: 130rpx;">
|
|
<image class="tx-img" src="/static/dl.png"></image>
|
|
<view class="zx"></view>
|
|
</view>
|
|
<view class="login" style="margin-left:45% ;">
|
|
<view class="" :src="yonghuwx.avatarUrl">
|
|
暂未登录
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="top2" v-show="top2"></view>
|
|
<view class="tip" v-show="tip">
|
|
<!-- <button @tap='wxGetUserInfo'>授权登录</button> -->
|
|
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumberp">授权登录</button>
|
|
</view>
|
|
<view class="stuinfos" v-show="stuinfos">
|
|
<view class="student">
|
|
<view class="stinfo">
|
|
<img src="/static/student.png" alt="" sizes="" srcset="">
|
|
<view class="st">学生信息</view>
|
|
</view>
|
|
<view class="th">
|
|
<view class="stname">姓名</view>
|
|
<view class="sex">性别</view>
|
|
<view class="age">年龄</view>
|
|
<view class="class">班级</view>
|
|
<view class="score">成绩</view>
|
|
|
|
</view>
|
|
<view class="tr" v-for="item in studentList">
|
|
<view class="stname">{{item.studentName}}</view>
|
|
<view class="sex">{{item.studentSex | formatSex}} </view>
|
|
<view class="age">{{item.studentAge}}岁</view>
|
|
<view class="class">{{item.className}}</view>
|
|
<view class="read">
|
|
<navigator :url="`/pages/home/home?studentId=${item.studentId}`
|
|
">查看</navigator>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="kindergarten">
|
|
<view class="stinfo">
|
|
<img src="/static/children.png" alt="" sizes="" srcset="">
|
|
<text>幼儿园信息</text>
|
|
</view>
|
|
<view class="th">
|
|
<view class="kinderclass" style="line-height: 100rpx;height: 100rpx;">幼儿园</view>
|
|
<view class="teacher" style="line-height: 100rpx;height: 100rpx;">班主任</view>
|
|
</view>
|
|
<view class="tr" v-for="item in classList">
|
|
<view class="kinderclass">{{item.kindergartenName}}</view>
|
|
<view class="teacher">
|
|
<span class='teachername'> {{item.classTeacher}}</span>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="parentinfo">
|
|
<view class="stinfo">
|
|
<img src="/static/parent.png" alt="" sizes="" srcset="">
|
|
<text>家长信息</text>
|
|
</view>
|
|
<view class="th">
|
|
<view class="parent">家长</view>
|
|
<view class="phone">电话</view>
|
|
</view>
|
|
<view class="tr">
|
|
<view class="parent">{{parentList.parentName}}</view>
|
|
<view class="phone">{{parentList.phone}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="masks" style="" v-if="mask">
|
|
<view class="mask">
|
|
<view class="title">
|
|
提示
|
|
</view>
|
|
<view class="text" style="margin-top:40rpx">
|
|
系统中没有该用户手机号, 请绑定信息!
|
|
</view>
|
|
<view class="btns">
|
|
<view class="btn1" @tap='mask=false'>取消</view>
|
|
<view class="btn2" @tap='gophone()'>确定</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="masks" style="" v-if="mask2">
|
|
<view class="mask2">
|
|
<view class="title">
|
|
微信授权
|
|
</view>
|
|
<view class="sq">
|
|
<img src="/static/sq.png" alt="" sizes="" srcset="">
|
|
<img src="/static/sq1.png" alt="" sizes="" srcset="">
|
|
</view>
|
|
<view class="text">
|
|
授权绑定您的手机号码
|
|
</view>
|
|
<view class="btns">
|
|
<button class="btn1" @tap='mask2=false'>拒绝</button>
|
|
<button class="btn2" open-type="getPhoneNumber" @getphonenumber="getPhoneNumberp">允许</button>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import {
|
|
getPreOrderById,
|
|
getInfoByPhone
|
|
} from '@/api/index/index.js'
|
|
export default {
|
|
components: {},
|
|
data() {
|
|
return {
|
|
top: true,
|
|
top2: false,
|
|
login: false,
|
|
mask: false,
|
|
mask2: false,
|
|
before: false,
|
|
stuinfos: false,
|
|
tip: true,
|
|
yonghuwx: [],
|
|
logincode: '',
|
|
phonecode: '',
|
|
phone: '',
|
|
studentList: [],
|
|
classList: [],
|
|
parentList: [],
|
|
msg: '',
|
|
openId: '',
|
|
}
|
|
},
|
|
methods: {
|
|
setitem() {
|
|
let that = this;
|
|
uni.getStorage({
|
|
key: 'user',
|
|
success: function(res) {
|
|
that.yonghuwx = res.data
|
|
that.login = true
|
|
that.stuinfos = true
|
|
that.tip = false
|
|
that.top2 = true
|
|
that.top = false
|
|
that.getPreOrderById();
|
|
// that.mask = true
|
|
}
|
|
});
|
|
},
|
|
gophone() {
|
|
const openid = this.openId
|
|
uni.navigateTo({
|
|
url: `/pages/phone/phone?openId=${openid}`
|
|
})
|
|
this.mask = false;
|
|
},
|
|
getPreOrderById() {
|
|
getPreOrderById(this.logincode, this.phonecode).then(res => {
|
|
if (res.code == 200) {
|
|
if (res.data.flag == "EMPTY") {
|
|
this.mask = true;
|
|
this.openId = res.data.openId
|
|
} else {
|
|
// this.mask = true;
|
|
this.phone = res.data.phone
|
|
uni.setStorage({
|
|
key: 'phone',
|
|
data: res.data.phone
|
|
});
|
|
if (this.phone != '') {
|
|
this.getInfoByPhoneinfo()
|
|
}
|
|
this.login = true
|
|
this.stuinfos = true
|
|
this.tip = false
|
|
this.top2 = true
|
|
this.top = false
|
|
// this.mask2 = false;
|
|
}
|
|
}
|
|
})
|
|
},
|
|
|
|
getPhoneNumberp(val) {
|
|
this.phonecode = val.detail.code
|
|
let that = this;
|
|
wx.login({
|
|
provider: 'weixin',
|
|
success: function(loginRes) {
|
|
that.logincode = loginRes.code
|
|
that.getPreOrderById();
|
|
// that.mask2 = false;
|
|
}
|
|
});
|
|
},
|
|
wxGetUserInfo() {
|
|
let that = this;
|
|
uni.getUserProfile({
|
|
desc: "获取用户信息",
|
|
lang: "zh_CN",
|
|
success(res) {
|
|
that.yonghuwx = res.userInfo
|
|
uni.setStorage({
|
|
key: 'user',
|
|
data: res.userInfo
|
|
});
|
|
that.mask2 = true
|
|
},
|
|
fail(res) {
|
|
//失败则返回home页面
|
|
},
|
|
});
|
|
},
|
|
|
|
getInfoByPhoneinfo() {
|
|
var that = this
|
|
getInfoByPhone(this.phone).then(res => {
|
|
if (res.code == 200) {
|
|
this.studentList = res.data.studentInfoList;
|
|
this.classList = res.data.classInfoList;
|
|
this.parentList = res.data;
|
|
that.login = true
|
|
that.stuinfos = true
|
|
that.tip = false
|
|
that.top2 = true
|
|
that.top = false
|
|
// this.mask = true;
|
|
} else {
|
|
|
|
}
|
|
})
|
|
}
|
|
},
|
|
filters: {
|
|
// 格式化性别
|
|
formatSex(str) {
|
|
const sexEnum = {
|
|
"FEMALE": "女",
|
|
"MALE": "男"
|
|
}
|
|
return sexEnum[str];
|
|
},
|
|
},
|
|
onLoad(options) {
|
|
let that = this;
|
|
uni.getStorage({
|
|
key: 'phone',
|
|
success: function(res) {
|
|
that.phone = res.data
|
|
// that.mask = true
|
|
that.getInfoByPhoneinfo();
|
|
},
|
|
fail: function(err) {
|
|
that.login = false
|
|
that.stuinfos = false
|
|
that.tip = true
|
|
that.top2 = false
|
|
that.top = true
|
|
}
|
|
});
|
|
uni.getStorage({
|
|
key: 'user',
|
|
success: function(res) {
|
|
that.yonghuwx = res.data
|
|
// that.mask = true
|
|
},
|
|
fail: function(err) {}
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// this.yonghuwx = JSON.parse(options.userinfo)
|
|
// uni.request({
|
|
// url: '/kindergarten/applet/appletLogin', //仅为示例，并非真实接口地址。
|
|
// method:'GET'
|
|
// data: {
|
|
// text: 'uni.request'
|
|
// },
|
|
|
|
// success: (res) => {
|
|
// this.text = 'request success';
|
|
// }
|
|
// });
|
|
|
|
|
|
|
|
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.btns {}
|
|
|
|
.btn1,
|
|
.btn2 {
|
|
width: 50%;
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
text-align: center;
|
|
display: inline-block;
|
|
position: absolute;
|
|
bottom: 0;
|
|
}
|
|
|
|
.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: #f0f0f0;
|
|
height: 100%;
|
|
width: 100%;
|
|
position: absolute;
|
|
opacity: 0.9;
|
|
top: 0;
|
|
z-index: 999;
|
|
}
|
|
|
|
.mask2 {
|
|
width: 70%;
|
|
height: 400rpx;
|
|
background-color: #fff;
|
|
margin: 200rpx auto;
|
|
position: relative;
|
|
}
|
|
|
|
.sq {
|
|
width: 90rpx;
|
|
height: 90rpx;
|
|
/* background-color: red; */
|
|
margin: 0 auto;
|
|
padding-top: 25rpx;
|
|
padding-bottom: 40rpx;
|
|
}
|
|
|
|
.masks img {
|
|
width: 90rpx;
|
|
height: 90rpx;
|
|
}
|
|
|
|
.text {
|
|
font-size: 30rpx;
|
|
width: 100%;
|
|
text-align: left;
|
|
/* padding-top: 40rpx; */
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
.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; */
|
|
}
|
|
|
|
.mask {
|
|
width: 70%;
|
|
height: 300rpx;
|
|
background-color: #fff;
|
|
margin: 200rpx auto;
|
|
position: relative;
|
|
}
|
|
|
|
.content {
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
background-color: #ffffff;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
|
|
.top {
|
|
/* background-color: #4486e8; */
|
|
/* background: url(@/static/bjt.png) no-repeat; */
|
|
background-image: linear-gradient(#55C5E3, #fff);
|
|
width: 100%;
|
|
height: 600rpx;
|
|
float: left;
|
|
/* display:inline-block; */
|
|
}
|
|
|
|
.top2 {
|
|
/* background-color: #4486e8; */
|
|
background-image: linear-gradient(#55C5E3, #fff);
|
|
width: 100%;
|
|
height: 400rpx;
|
|
float: left;
|
|
|
|
}
|
|
|
|
|
|
.info {
|
|
color: #eeeeee;
|
|
text-align: center;
|
|
margin-top: 40rpx;
|
|
font-size: 36rpx;
|
|
}
|
|
|
|
/* 头像 */
|
|
.tx-w {
|
|
margin-top: 50rpx;
|
|
|
|
}
|
|
|
|
.tx {
|
|
margin-left: 90rpx;
|
|
}
|
|
|
|
.tx image {
|
|
width: 140rpx;
|
|
height: 140rpx;
|
|
border-radius: 50%;
|
|
color: #fff;
|
|
}
|
|
|
|
.studentName {
|
|
margin-left: 280rpx;
|
|
}
|
|
|
|
.infos {
|
|
margin-top: -100rpx;
|
|
color: #707374;
|
|
}
|
|
|
|
.name {
|
|
margin-left: 280rpx;
|
|
}
|
|
|
|
.name-qm {
|
|
margin-left: ;
|
|
text-align: center;
|
|
margin-top: 40rpx;
|
|
font-size: 60rpx;
|
|
}
|
|
|
|
.nicheng {
|
|
width: 700rpx;
|
|
height: 240rpx;
|
|
background-color: rgba(255, 255, 255, 0.8);
|
|
position: absolute;
|
|
margin-top: 50px;
|
|
margin-left: 3.3%;
|
|
/* display: flex;
|
|
flex-direction: column; */
|
|
|
|
/* box-shadow: 0rpx 2rpx 0rpx 0rpx #a9caf5; */
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.nicheng2 {
|
|
width: 90%;
|
|
height: 240rpx;
|
|
background-color: rgba(255, 255, 255, 0.3);
|
|
position: absolute;
|
|
margin-top: 150rpx;
|
|
margin-left: 5%;
|
|
/* display: flex;
|
|
flex-direction: column; */
|
|
|
|
/* box-shadow: 0rpx 2rpx 0rpx 0rpx #a9caf5; */
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
/* 登陆 */
|
|
.login {
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
/* background-color: red; */
|
|
margin: 0 auto;
|
|
margin-top: -100rpx;
|
|
margin-left: 40%;
|
|
font-size: 35rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
.stuinfos {
|
|
margin-left: 3.3%;
|
|
}
|
|
|
|
.tip button {
|
|
background-color: #79E7E1;
|
|
color: #fff;
|
|
}
|
|
|
|
.tip {
|
|
width: 450rpx;
|
|
height: 70rpx;
|
|
/* background-color:orchid; */
|
|
font-size: 50rpx;
|
|
margin: 0 auto;
|
|
color: #515151;
|
|
margin-top: 100%;
|
|
}
|
|
|
|
/* 学生信息 */
|
|
.student {
|
|
width: 700rpx;
|
|
/* height: 180px; */
|
|
|
|
margin-top: 360rpx;
|
|
box-shadow: 0rpx 2rpx 0rpx 0rpx #e6ebfe;
|
|
border-radius: 20rpx;
|
|
margin-bottom: 16rpx;
|
|
/* color: cornflowerblue; */
|
|
background-color: #eef9fc;
|
|
color: #707374;
|
|
/* display: flex; */
|
|
/* flex-direction: row; */
|
|
}
|
|
|
|
img {
|
|
/* margin-top: 10px; */
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
/* margin-top: 9px; */
|
|
margin-right: 30rpx;
|
|
margin-bottom: -4rpx;
|
|
}
|
|
|
|
.st {
|
|
display: inline-block;
|
|
margin-bottom: 3rpx;
|
|
/* width: 20px;
|
|
height: 20px; */
|
|
/* margin-top: 10px; */
|
|
/* background-color: red; */
|
|
}
|
|
|
|
.stinfo {
|
|
/* height: 30px; */
|
|
margin-left: 30rpx;
|
|
font-size: 40rpx;
|
|
color: #4486e8;
|
|
/* border-bottom: #eeecec 1px solid; */
|
|
/* text-align: center; */
|
|
font-weight: 500;
|
|
}
|
|
|
|
.th {
|
|
/* background-color: orange; */
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
border-top: lightsteelblue 2rpx solid;
|
|
|
|
}
|
|
|
|
.tr {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.stname {
|
|
width: 140rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
/* background-color: red; */
|
|
border-bottom: lightsteelblue 2rpx solid;
|
|
|
|
|
|
|
|
}
|
|
|
|
.sex {
|
|
width: 140rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
/* background-color: blueviolet; */
|
|
border-bottom: lightsteelblue 2rpx solid;
|
|
}
|
|
|
|
.age {
|
|
width: 140rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
/* background-color: burlywood; */
|
|
border-bottom: lightsteelblue 2rpx solid;
|
|
}
|
|
|
|
.class {
|
|
width: 140rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
/* background-color: orange; */
|
|
border-bottom: lightsteelblue 2rpx solid;
|
|
}
|
|
|
|
/* 幼儿园 */
|
|
.kindergarten {
|
|
width: 700rpx;
|
|
background-color: #eef9fc;
|
|
box-shadow: 0rpx 2rpx 0px 0px #e6ebfe;
|
|
border-radius: 20rpx;
|
|
margin-bottom: 16rpx;
|
|
color: #707374;
|
|
}
|
|
|
|
.kinderclass {
|
|
padding-left: 10rpx;
|
|
width: 400rpx;
|
|
/* height: 100rpx; */
|
|
line-height: 50rpx;
|
|
text-align: center;
|
|
/* background-color: red; */
|
|
border-bottom: lightsteelblue 1px solid;
|
|
/* overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap; */
|
|
}
|
|
|
|
.teachername {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
|
|
.teacher {
|
|
width: 360rpx;
|
|
/* height: 100rpx; */
|
|
/* line-height: 100rpx; */
|
|
text-align: center;
|
|
/* background-color: red; */
|
|
border-bottom: lightsteelblue 2rpx solid;
|
|
/* padding-left: 50px; */
|
|
position: relative;
|
|
}
|
|
|
|
|
|
.score {
|
|
width: 140rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
border-bottom: lightsteelblue 2rpx solid;
|
|
|
|
}
|
|
|
|
.read {
|
|
width: 140rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
border-bottom: lightsteelblue 2rpx solid;
|
|
color: cornflowerblue;
|
|
}
|
|
|
|
/* 家长信息 */
|
|
.parentinfo {
|
|
/* position: absolute; */
|
|
width: 700rpx;
|
|
/* height: 106px; */
|
|
/* margin-top: 510px; */
|
|
background-color: #eef9fc;
|
|
box-shadow: 0rpx 2rpx 0rpx 0rpx #e6ebfe;
|
|
border-radius: 20rpx;
|
|
color: #707374;
|
|
}
|
|
|
|
.parent {
|
|
width: 350rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
/* background-color: red; */
|
|
border-bottom: lightsteelblue 2rpx solid;
|
|
}
|
|
|
|
.phone {
|
|
width: 350rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
/* background-color: red; */
|
|
border-bottom: lightsteelblue 2rpx solid;
|
|
}
|
|
</style>
|