<template>
<view class="content">
<view class="top_img">
<image class="logo" src="/static/login/图层 1.png"></image>
<image class="logo_car" src="/static/login/y.png" style="margin-top: 35rpx;"></image>
<view class="top_title">
SIGN IN
</view>
<view class="top_login">
欢迎登录,
</view>
<view class="top_Firstaid">
院前急救
</view>
</view>
<view class="con_rectangle">
<view class="con_view">
</view>
<view class="con_phone">
<view class="phone_ico">
<image src="../../static/login/手机1.png" mode=""></image>
<text class="phone_line">|</text>
<input class="uni-input" focus placeholder="请输入账号" v-model="user_plone" />
</view>
</view>
<view class="line">
</view>
<view class="con_password">
<view class="phone_ico">
<image style="width: 25rpx; height: 27rpx;" src="../../static/login/矩形 4.png" mode=""></image>
<text class="phone_line">|</text>
<input style="width: 280rpx;" class="uni-input" placeholder="请输入密码" :password="showPassword" v-model="user_password" />
<image src="../../static/login/num.png"
style="width: 33rpx;height: 23rpx;opacity: 0.75;position: absolute;right: 50rpx;top:40rpx;line-height: 23rpx;"
@click="changePassword">
</view>
</view>
<view class="btn" @click="tap_login">
<view class="log_in" >
登 录
</view>
</view>
</view>
<u-popup :show="showclose" mode="center" >
<view class="u-popup" >
<image class="u-popup1" src="/static/chengg.png" alt="" />
<view class="u-popup2">
<view class="u-popup-title">
{{popup_title}}
</view>
<view class="button" @click="buttonCick(popup_title)">
确认
</view>
</view>
</view>
</u-popup>
<!-- 登录成功弹出层 -->
<view class="popup">
<!-- 协议勾没勾选的弹出层 -->
<uni-popup ref="popup" type="center" :animation="false" :mask-click="false" >
<view class="agreement">
<view class="agreement_title">
服务协议及隐私保护
</view>
<view class="agreement_content">
<view>
尊敬的用户，为了更好地保障您的合法权益，我们依据相关法律法规制定了用户注册使用协议、隐私保护指引以及个人信息授权书，请您在点击同意注册之前仔细阅读并充分理解相关条款，其中的重点条款已经为您标注，方便您了解自己的权利。我们将通过《隐私保护指引》以及《个人信息处理授权书》向您说明:
</view>
<view class="agreement_empty">
</view>
<view>
1、为了更好地为您提供服务，我们会根据您的授权，收集和使用对应的必要信息(如您的姓名、联系电话等);
</view>
<view>
2、您可以对上述信息进行访问、更正、删除为了更好地为您提供服务，我们会根据您的授权，收集和使用对应的必要信息(如您的姓名、联系电话等);
</view>
</view>
<view class="agreement_but">
<button type="default" class="but_no" @click="notArgree">不同意</button>
<button type="primary" class="but_yes" @click="agree">同意</button>
</view>
</view>
</uni-popup>
</view>
<!-- 内部使用 -->
<view class="tips">
<uni-icons type="info" size="35rpx" color="#5581FF" style="margin-right: 5rpx;height:30rpx;width: 30rpx;margin-top: -10rpx;"></uni-icons><text>仅限内部人员使用</text>
</view>
</view>
</template>
<script>
import {request} from '../../request/request.js'
import md5 from 'js-md5';
export default {
data() {
return {
showclose:false,
// 用户密码查看
showPassword: true,
// 用户手机号
user_plone: '',
//用户密码
user_password: '',
//用户认证提示标题
popup_title: '',
//协议是否选中
select: false,
//显示用户认证
popup1Visible: true,
//显示协议
popup2Visible: true,
}
},
onLoad() {
},
watch: {
},
methods: {
// 查看密码
changePassword() {
this.showPassword = !this.showPassword;
},
//点击登录
async tap_login() {
const password = md5(this.user_password);
const data = {
username:this.user_plone,
password,
}
if(!this.user_password || !this.user_plone){
return uni.showToast({
icon:'error',
title: '输入账号和密码'
})
}
uni.request({
url:'http://192.168.0.15:8080/wechat/authentication',
method:'POST',
data,
success:(res)=>{
if(res.data.data == '失败'){
this.showclose = true
this.popup_title = '认证不通过'
}
if(res.data.data == '成功'){
this.showclose = true
uni.setStorageSync('userName',this.user_plone)
this.popup_title = '认证通过'
setTimeout(() =>{
this.buttonCick('认证通过')
},2000)
}
},
fail:(error) => {
uni.showToast({
icon:'error',
title:'系统错误'
})
}
})
},
//认证成功时登录
buttonCick(e){
if(e == '认证不通过'){
this.showclose = false
} else {
uni.redirectTo({
url:'/pages/accredit/accredit'
})
this.showclose = false
}
},
//协议弹出层确定
// agree() {
// //弹出层关闭
// this.$refs.popup.close()
// this.select = true
// },
// //协议弹出层取消
// notArgree() {
// //弹出层关闭
// this.$refs.popup.close()
// this.select = false
// },
// //协议选中不选中
// handleChange(value) {
// var values = value.detail.value
// // 如果选中的值数组不为空，则将 select 设为 true，否则设为 false
// this.select = values.length > 0;
// }
}
}
</script>
<style lang="scss" scoped>
::v-deep .u-popup__content{
border-radius: 60rpx;
}
.u-popup {
width: 343rpx;
height: 343rpx;
position: relative;
.u-popup1 {
width: 100%;
height: 100%;
// margin-top: -100rpx;
}
.u-popup2{
position: absolute;
top:0rpx;
left: 0;
.u-popup-title {
font-family: Adobe Heiti Std;
font-size: 31rpx;
color: #333333;
line-height: 31rpx;
text-align: left;
font-style: normal;
text-transform: none;
margin-top: 200rpx;
margin-left: 110rpx;
}
.button {
width: 237rpx;
height: 63rpx;
background: #5581FF;
border-radius: 31rpx;
font-family: Adobe Heiti Std;
font-size: 28rpx;
color: #FFFFFF;
line-height: 63rpx;
text-align: center;
margin-top: 30rpx;
margin-left: 70rpx;
}
}
}
//提示信息
.tips{
position: absolute;
left: 72rpx;
top: 1235rpx;
width: 600rpx;
height: 60rpx;
color: #5581FF;
font-size: 26rpx;
display: flex;
align-items: center;
justify-content: center;
}
.content {
width: 750rpx;
height: 1334rpx;
position: relative;
}
.top_img {
width: 750rpx;
height: 600rpx;
}
.logo_car {
position: absolute;
left: 303rpx;
top: 134rpx;
width: 447rpx;
height: 333rpx;
z-index: 10;
}
.top_title {
width: 100rpx;
height: 21rpx;
position: absolute;
top: 166rpx;
left: 52rpx;
font-weight: 400;
font-size: 26rpx;
color: #FFFFFF;
text-align: left;
font-style: normal;
text-transform: none;
color: #80A5EE;
}
.top_login {
width: 275rpx;
height: 68rpx;
position: absolute;
left: 51rpx;
top: 221rpx;
font-weight: 400;
font-size: 63rpx;
color: #FFFFFF;
}
.top_Firstaid {
position: absolute;
top: 306rpx;
left: 51rpx;
width: 220rpx;
height: 52rpx;
font-size: 55rpx;
color: #FFFFFF;
text-align: left;
}
.logo {
height: 600rpx;
width: 750rpx;
}
.con_rectangle {
width: 680rpx;
height: 581rpx;
position: absolute;
left: 35rpx;
top: 400rpx;
background-color: #FFFFFF;
border-radius: 31rpx 31rpx 31rpx 31rpx;
box-shadow: 20rpx 20rpx 20rpx 20rpx rgba(0, 0, 0, 0.1);
}
.con_view {
width: 726rpx;
height: 120rpx;
}
.con_phone {
width: 567rpx;
height: 90rpx;
padding-left: 88rpx;
display: flex;
align-items: center;
}
.line {
width: 547rpx;
height: 1rpx;
position: absolute;
left: 88rpx;
background: #848484;
}
.con_password {
width: 567rpx;
height: 100rpx;
padding-left: 88rpx;
display: flex;
align-items: center;
position: relative;
}
.phone_ico {
display: flex;
align-items: center;
flex-wrap: wrap;
}
.phone_ico image {
width: 24rpx;
height: 27rpx;
vertical-align: middle;
}
.phone_line {
width: 1rpx;
opacity: 0.22;
padding-left: 21rpx;
}
.uni-input {
padding-left: 30rpx;
width: 280rpx;
height: 24rpx;
padding-top: 9rpx;
}
.uni-icon {
width: 33rpx;
height: 23rpx;
opacity: 0.75;
position: absolute;
right: 91rpx;
line-height: 23rpx;
}
.btn {
width: 567rpx;
height: 104rpx;
box-shadow: 6rpx 0rpx 10rpx 0rpx #1579FD;
background-color: #1579FD;
border-radius: 18rpx 18rpx 18rpx 18rpx;
margin-left: 72rpx;
display: flex;
align-items: center;
justify-content: center;
margin-top: 30rpx;
margin-bottom: 30rpx;
}
.log_in {
width: 77rpx;
height: 34rpx;
font-weight: 400;
font-size: 36rpx;
color: #FFFFFF;
line-height: 34rpx;
text-align: center;
font-style: normal;
text-transform: none;
}
</style>