| | |
|---|
| | | <template> |
|---|
| | | <view class="main-container login-container img100 relative" style="margin-top: 0rpx;"> |
|---|
| | | <image class="component-bg" |
|---|
| | | src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/a5/a54508de179a4942918ecb2c5a4aa9f5bg.png" |
|---|
| | | mode="scaleToFill" /> |
|---|
| | | |
|---|
| | | |
|---|
| | | <view class="t-login top-bg"> |
|---|
| | | <view class="nav-title">注册</view> |
|---|
| | | <view class="login"> |
|---|
| | | <form class="cl"> |
|---|
| | | <view class="t-a titles-top"> |
|---|
| | | <view class="title-1">HELLO</view> |
|---|
| | | <view class="title-2">欢迎入驻<span class="title-3">花满芜</span></view> |
|---|
| | | </view> |
|---|
| | | |
|---|
| | | |
|---|
| | | <view class="t-a input" v-if="loginType=='code'"> |
|---|
| | | |
|---|
| | | |
|---|
| | | <input type="text" name="userName" placeholder="请输入手机号" v-model="phoneNumber" /> |
|---|
| | | <view class="get-code" :style="{'color':getCodeBtnColor}" @click.stop="getCode()"> |
|---|
| | | {{getCodeText}} |
|---|
| | | </view> |
|---|
| | | </view> |
|---|
| | | |
|---|
| | | |
|---|
| | | <view class="t-a input" v-if="loginType=='code'"> |
|---|
| | | <input type="text" name="userName" placeholder="请输入手机验证码" v-model="smsCode" /> |
|---|
| | | </view> |
|---|
| | | <view class="t-a input" v-if="loginType=='code'"> |
|---|
| | | <input type="text" :password="true" name="password" placeholder="请输入密码" v-model="password" /> |
|---|
| | | </view> |
|---|
| | | <button @tap="login()" class="bottom-button">注 册</button> |
|---|
| | | |
|---|
| | | <view class="flex"> |
|---|
| | | <view class="topic-font m-l-a m-r-0" @click="toLogin">前往登录</view> |
|---|
| | | </view> |
|---|
| | | <view class="flex flex-wrap-normal" style="position: fixed;bottom: 40rpx;left: 40rpx;right: 40rpx;" v-if="false"> |
|---|
| | | <view :style="{'margin-top': '8rpx','margin-right': '12rpx','font-size':'24rpx'}" |
|---|
| | | @click="protocal=!protocal" |
|---|
| | | class="component-radio" :class="[protocal?'cur':'']"> |
|---|
| | | |
|---|
| | | </view> |
|---|
| | | <view class="topic-gray" @click="toProtocol">请仔细阅读《花满芜合伙人供应商入口小程序隐私保护指引》如您同意该指引，请勾选开始使用本小程序</view> |
|---|
| | | </view> |
|---|
| | | </form> |
|---|
| | | </view> |
|---|
| | | </view> |
|---|
| | | </view> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | // import util from '@/utils/util.js' |
|---|
| | | // import gzmzApi from '@/api/gzmzApi.js' |
|---|
| | | // import myCache from '@/utils/myCache.js' |
|---|
| | | export default { |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | openId: '-1', |
|---|
| | | |
|---|
| | | userName: '', |
|---|
| | | password: '', |
|---|
| | | |
|---|
| | | phoneNumber: '', |
|---|
| | | smsCode: '', |
|---|
| | | |
|---|
| | | checked: false, |
|---|
| | | loginType: 'code', //pwd和code，密码和验证码登录 |
|---|
| | | pcfvalue: undefined, |
|---|
| | | getCodeText: '获取验证码', |
|---|
| | | getCodeBtnColor: "#20613D", |
|---|
| | | getCodeisWaiting: false, |
|---|
| | | Timer: undefined, |
|---|
| | | protocal:false |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | toProtocol(){ |
|---|
| | | uni.navigateTo({ |
|---|
| | | url:'/sub_pages/supplier/protocol' |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | async getCode() { |
|---|
| | | // await this.$message.confirm('是否同意入驻协议') |
|---|
| | | // this.protocal = true |
|---|
| | | console.log('getCode') |
|---|
| | | uni.hideKeyboard() //隐藏已经显示的软键盘，如果软键盘没有显示则不做任何操作。 |
|---|
| | | if (this.getCodeisWaiting) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.phoneNumber))) { //校验手机号码是否有误 |
|---|
| | | uni.showToast({ |
|---|
| | | title: '请填写正确手机号码', |
|---|
| | | icon: "none" |
|---|
| | | }); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | this.getCodeText = "发送中..." //发送验证码 |
|---|
| | | this.getCodeisWaiting = true; |
|---|
| | | this.getCodeBtnColor = "#000" //追加样式，修改颜色 |
|---|
| | | //示例用定时器模拟请求效果 |
|---|
| | | //setTimeout(()用于在指定的毫秒数后调用函数或计算表达式 |
|---|
| | | const { |
|---|
| | | code |
|---|
| | | } = await this.$http.request('post', '/api/sms/send/code', { |
|---|
| | | data: { |
|---|
| | | tel: this.phoneNumber, |
|---|
| | | userType: 'supplier' |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | if (code == 0) { |
|---|
| | | uni.showToast({ |
|---|
| | | title: '验证码已发送', |
|---|
| | | icon: "none" |
|---|
| | | }); |
|---|
| | | this.setTimer(); //调用定时器方法 |
|---|
| | | } |
|---|
| | | // setTimeout(() => { |
|---|
| | | // //弹出提示框 |
|---|
| | | // //示例默认1234，生产中请删除这一句。 |
|---|
| | | // // this.code = '1234'; //发送验证码，进行填入 |
|---|
| | | |
|---|
| | | // }, 1000) |
|---|
| | | }, |
|---|
| | | //setTimer： 需要每隔一段时间执行一件事的的时候就需要使用SetTimer函数 |
|---|
| | | setTimer() { |
|---|
| | | let holdTime = 60; //定义变量并赋值 |
|---|
| | | this.getCodeText = "重新获取(60)" |
|---|
| | | //setInterval（）是一个实现定时调用的函数，可按照指定的周期（以毫秒计）来调用函数或计算表达式。 |
|---|
| | | //setInterval方法会不停地调用函数，直到 clearInterval被调用或窗口被关闭。 |
|---|
| | | this.Timer = setInterval(() => { |
|---|
| | | if (holdTime <= 0) { |
|---|
| | | this.getCodeisWaiting = false; |
|---|
| | | this.getCodeBtnColor = "#20613D"; |
|---|
| | | this.getCodeText = "获取验证码" |
|---|
| | | clearInterval(this.Timer); //清除该函数 |
|---|
| | | return; //返回前面 |
|---|
| | | } |
|---|
| | | this.getCodeText = "重新获取(" + holdTime + ")" |
|---|
| | | holdTime--; |
|---|
| | | }, 1000) |
|---|
| | | }, |
|---|
| | | toLogin() { |
|---|
| | | uni.redirectTo({ |
|---|
| | | url: '/pages/login/supplier-login' |
|---|
| | | }) |
|---|
| | | |
|---|
| | | }, |
|---|
| | | changeAll(e) { |
|---|
| | | this.pcfvalue = e.detail.value[0] |
|---|
| | | }, |
|---|
| | | async login() { |
|---|
| | | uni.showLoading({ |
|---|
| | | title: '登陆中' |
|---|
| | | }); |
|---|
| | | var that = this; |
|---|
| | | if (!that.phoneNumber) { |
|---|
| | | uni.showToast({ |
|---|
| | | title: '请输入手机号', |
|---|
| | | icon: 'none' |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (!that.smsCode) { |
|---|
| | | uni.showToast({ |
|---|
| | | title: '请输入手机验证码', |
|---|
| | | icon: 'none' |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (!that.password) { |
|---|
| | | uni.showToast({ |
|---|
| | | title: '请输入密码', |
|---|
| | | icon: 'none' |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | // if (this.pcfvalue == undefined) { |
|---|
| | | // util.showMyToast('必须勾选《用户服务协议》及《隐私政策》'); |
|---|
| | | // return; |
|---|
| | | // } |
|---|
| | | let post = { |
|---|
| | | tel: this.phoneNumber, |
|---|
| | | smsCode: this.smsCode, |
|---|
| | | password: this.password, |
|---|
| | | // openId: '123456789' |
|---|
| | | } |
|---|
| | | // const { |
|---|
| | | // code |
|---|
| | | // } = await this.$http.request('get', '/api/login/admin') |
|---|
| | | const resp = await this.$store.dispatch('regSupplier', post); |
|---|
| | | // uni.hideLoading() |
|---|
| | | |
|---|
| | | if (resp.code == 0) { |
|---|
| | | |
|---|
| | | // myCache.cache("userToken", res.data.accessToken) |
|---|
| | | // let userRes = await gzmzApi.getMemberInfo(); |
|---|
| | | // if (userRes.status) { |
|---|
| | | // myCache.cache("userInfo", JSON.stringify(userRes.data)) |
|---|
| | | // } |
|---|
| | | uni.showToast({ |
|---|
| | | title: '注册成功！', |
|---|
| | | icon: 'none' |
|---|
| | | }); |
|---|
| | | setTimeout(() => { |
|---|
| | | this.toLogin() |
|---|
| | | }, 1000); |
|---|
| | | |
|---|
| | | } else { |
|---|
| | | uni.showToast({ |
|---|
| | | title: '登录失败！', |
|---|
| | | icon: 'none' |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | tc1(id) { |
|---|
| | | uni.navigateTo({ |
|---|
| | | url: '/pages/users/xieyi?id=' + id, |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="scss" scoped> |
|---|
| | | @import '@/pages/login/login.scss'; |
|---|
| | | |
|---|
| | | .main-container { |
|---|
| | | margin: 20px 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .img-a { |
|---|
| | | position: absolute; |
|---|
| | | width: 100%; |
|---|
| | | top: -150rpx; |
|---|
| | | right: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .img-b { |
|---|
| | | position: absolute; |
|---|
| | | width: 50%; |
|---|
| | | bottom: 0; |
|---|
| | | left: -120rpx; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .to-home { |
|---|
| | | margin-top: 30rpx; |
|---|
| | | font-size: 30rpx; |
|---|
| | | color: #5af; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: row-reverse; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login { |
|---|
| | | width: 100%; |
|---|
| | | margin: 0 auto; |
|---|
| | | font-size: 28rpx; |
|---|
| | | color: #000; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .bg { |
|---|
| | | width: 100%; |
|---|
| | | position: relative; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .login { |
|---|
| | | width: 650rpx; |
|---|
| | | margin: 60rpx auto; |
|---|
| | | margin-top: 0rpx; |
|---|
| | | font-size: 28rpx; |
|---|
| | | color: #000; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login button { |
|---|
| | | font-size: 28rpx; |
|---|
| | | background: #5677fc; |
|---|
| | | color: #fff; |
|---|
| | | height: 90rpx; |
|---|
| | | line-height: 90rpx; |
|---|
| | | border-radius: 50rpx; |
|---|
| | | box-shadow: 0 5px 7px 0 rgba(86, 119, 252, 0.2); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login input { |
|---|
| | | padding: 0 20rpx 0 120rpx; |
|---|
| | | height: 90rpx; |
|---|
| | | line-height: 90rpx; |
|---|
| | | <template>
|
|---|
| | | <view class="main-container login-container img100 relative" style="margin-top: 0rpx;">
|
|---|
| | | <image class="component-bg"
|
|---|
| | | src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/a5/a54508de179a4942918ecb2c5a4aa9f5bg.png"
|
|---|
| | | mode="scaleToFill" />
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | <view class="t-login top-bg">
|
|---|
| | | <view class="nav-title">注册</view>
|
|---|
| | | <view class="login">
|
|---|
| | | <form class="cl">
|
|---|
| | | <view class="t-a titles-top">
|
|---|
| | | <view class="title-1">HELLO</view>
|
|---|
| | | <view class="title-2">欢迎入驻<span class="title-3">花满芜</span></view>
|
|---|
| | | </view>
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | <view class="t-a form-input" v-if="loginType=='code'">
|
|---|
| | | <u-input placeholder="请输入手机号" :border="false" v-model="phoneNumber">
|
|---|
| | | <template slot="suffix">
|
|---|
| | | <view class="get-code" :style="{'color':getCodeBtnColor}" @click.stop="getCode()">
|
|---|
| | | {{getCodeText}}
|
|---|
| | | </view>
|
|---|
| | | </template>
|
|---|
| | | </u-input>
|
|---|
| | |
|
|---|
| | | <!-- <u-input type="text" name="userName" placeholder="请输入手机号" v-model="phoneNumber"
|
|---|
| | | style="position: relative;z-index: 1;" /> -->
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | </view>
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | <view class="t-a form-input" v-if="loginType=='code'">
|
|---|
| | | <!-- <input type="text" name="userName" placeholder="请输入手机验证码" v-model="smsCode"
|
|---|
| | | style="position: relative;z-index: 1;" /> -->
|
|---|
| | | <u-input placeholder="请输入手机验证码" :border="false" v-model="smsCode"></u-input>
|
|---|
| | |
|
|---|
| | | </view>
|
|---|
| | | <view class="t-a form-input" v-if="loginType=='code'">
|
|---|
| | | <!-- <input type="text" :password="true" name="password" placeholder="请输入密码" v-model="password" /> -->
|
|---|
| | |
|
|---|
| | | <u-input :password="true" :border="false" placeholder="请输入密码" v-model="password"></u-input>
|
|---|
| | | </view>
|
|---|
| | |
|
|---|
| | | <button @tap="login()" class="bottom-button">注 册</button>
|
|---|
| | |
|
|---|
| | | <view class="flex">
|
|---|
| | | <view class="topic-font m-l-a m-r-0" @click="toLogin">前往登录</view>
|
|---|
| | | </view>
|
|---|
| | | <view class="flex flex-wrap-normal" style="position: fixed;bottom: 40rpx;left: 40rpx;right: 40rpx;"
|
|---|
| | | v-if="false">
|
|---|
| | | <view :style="{'margin-top': '8rpx','margin-right': '12rpx','font-size':'24rpx'}"
|
|---|
| | | @click="protocal=!protocal" class="component-radio" :class="[protocal?'cur':'']">
|
|---|
| | |
|
|---|
| | | </view>
|
|---|
| | | <view class="topic-gray" @click="toProtocol">请仔细阅读《花满芜合伙人供应商入口小程序隐私保护指引》如您同意该指引，请勾选开始使用本小程序
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | </form>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | </template>
|
|---|
| | | <script>
|
|---|
| | | // import util from '@/utils/util.js'
|
|---|
| | | // import gzmzApi from '@/api/gzmzApi.js'
|
|---|
| | | // import myCache from '@/utils/myCache.js'
|
|---|
| | | export default {
|
|---|
| | | data() {
|
|---|
| | | return {
|
|---|
| | | openId: '-1',
|
|---|
| | |
|
|---|
| | | userName: '',
|
|---|
| | | password: '',
|
|---|
| | |
|
|---|
| | | phoneNumber: '',
|
|---|
| | | smsCode: '',
|
|---|
| | |
|
|---|
| | | checked: false,
|
|---|
| | | loginType: 'code', //pwd和code，密码和验证码登录
|
|---|
| | | pcfvalue: undefined,
|
|---|
| | | getCodeText: '获取验证码',
|
|---|
| | | getCodeBtnColor: "#20613D",
|
|---|
| | | getCodeisWaiting: false,
|
|---|
| | | Timer: undefined,
|
|---|
| | | protocal: false
|
|---|
| | | };
|
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | | toProtocol() {
|
|---|
| | | uni.navigateTo({
|
|---|
| | | url: '/sub_pages/supplier/protocol'
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | async getCode() {
|
|---|
| | | // await this.$message.confirm('是否同意入驻协议')
|
|---|
| | | // this.protocal = true
|
|---|
| | | console.log('getCode')
|
|---|
| | | setTimeout(() => {
|
|---|
| | | uni.hideKeyboard() //隐藏已经显示的软键盘，如果软键盘没有显示则不做任何操作。
|
|---|
| | | }, 200)
|
|---|
| | |
|
|---|
| | | if (this.getCodeisWaiting) {
|
|---|
| | | return;
|
|---|
| | | }
|
|---|
| | | if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.phoneNumber))) { //校验手机号码是否有误
|
|---|
| | | uni.showToast({
|
|---|
| | | title: '请填写正确手机号码',
|
|---|
| | | icon: "none"
|
|---|
| | | });
|
|---|
| | | return false;
|
|---|
| | | }
|
|---|
| | | this.getCodeText = "发送中..." //发送验证码
|
|---|
| | | this.getCodeisWaiting = true;
|
|---|
| | | this.getCodeBtnColor = "#000" //追加样式，修改颜色
|
|---|
| | | //示例用定时器模拟请求效果
|
|---|
| | | //setTimeout(()用于在指定的毫秒数后调用函数或计算表达式
|
|---|
| | | const {
|
|---|
| | | code
|
|---|
| | | } = await this.$http.request('post', '/api/sms/send/code', {
|
|---|
| | | data: {
|
|---|
| | | tel: this.phoneNumber,
|
|---|
| | | userType: 'supplier'
|
|---|
| | | }
|
|---|
| | | })
|
|---|
| | | if (code == 0) {
|
|---|
| | | uni.showToast({
|
|---|
| | | title: '验证码已发送',
|
|---|
| | | icon: "none"
|
|---|
| | | });
|
|---|
| | | this.setTimer(); //调用定时器方法
|
|---|
| | | }
|
|---|
| | | // setTimeout(() => {
|
|---|
| | | // //弹出提示框
|
|---|
| | | // //示例默认1234，生产中请删除这一句。
|
|---|
| | | // // this.code = '1234'; //发送验证码，进行填入
|
|---|
| | |
|
|---|
| | | // }, 1000)
|
|---|
| | | },
|
|---|
| | | //setTimer： 需要每隔一段时间执行一件事的的时候就需要使用SetTimer函数
|
|---|
| | | setTimer() {
|
|---|
| | | let holdTime = 60; //定义变量并赋值
|
|---|
| | | this.getCodeText = "重新获取(60)"
|
|---|
| | | //setInterval（）是一个实现定时调用的函数，可按照指定的周期（以毫秒计）来调用函数或计算表达式。
|
|---|
| | | //setInterval方法会不停地调用函数，直到 clearInterval被调用或窗口被关闭。
|
|---|
| | | this.Timer = setInterval(() => {
|
|---|
| | | if (holdTime <= 0) {
|
|---|
| | | this.getCodeisWaiting = false;
|
|---|
| | | this.getCodeBtnColor = "#20613D";
|
|---|
| | | this.getCodeText = "获取验证码"
|
|---|
| | | clearInterval(this.Timer); //清除该函数
|
|---|
| | | return; //返回前面
|
|---|
| | | }
|
|---|
| | | this.getCodeText = "重新获取(" + holdTime + ")"
|
|---|
| | | holdTime--;
|
|---|
| | | }, 1000)
|
|---|
| | | },
|
|---|
| | | toLogin() {
|
|---|
| | | uni.redirectTo({
|
|---|
| | | url: '/pages/login/supplier-login'
|
|---|
| | | })
|
|---|
| | |
|
|---|
| | | },
|
|---|
| | | changeAll(e) {
|
|---|
| | | this.pcfvalue = e.detail.value[0]
|
|---|
| | | },
|
|---|
| | | async login() {
|
|---|
| | | uni.showLoading({
|
|---|
| | | title: '登陆中'
|
|---|
| | | });
|
|---|
| | | var that = this;
|
|---|
| | | if (!that.phoneNumber) {
|
|---|
| | | uni.showToast({
|
|---|
| | | title: '请输入手机号',
|
|---|
| | | icon: 'none'
|
|---|
| | | });
|
|---|
| | | return;
|
|---|
| | | }
|
|---|
| | | if (!that.smsCode) {
|
|---|
| | | uni.showToast({
|
|---|
| | | title: '请输入手机验证码',
|
|---|
| | | icon: 'none'
|
|---|
| | | });
|
|---|
| | | return;
|
|---|
| | | }
|
|---|
| | | if (!that.password) {
|
|---|
| | | uni.showToast({
|
|---|
| | | title: '请输入密码',
|
|---|
| | | icon: 'none'
|
|---|
| | | });
|
|---|
| | | return;
|
|---|
| | | }
|
|---|
| | | // if (this.pcfvalue == undefined) {
|
|---|
| | | // util.showMyToast('必须勾选《用户服务协议》及《隐私政策》');
|
|---|
| | | // return;
|
|---|
| | | // }
|
|---|
| | | let post = {
|
|---|
| | | tel: this.phoneNumber,
|
|---|
| | | smsCode: this.smsCode,
|
|---|
| | | password: this.password,
|
|---|
| | | // openId: '123456789'
|
|---|
| | | }
|
|---|
| | | // const {
|
|---|
| | | // code
|
|---|
| | | // } = await this.$http.request('get', '/api/login/admin')
|
|---|
| | | const resp = await this.$store.dispatch('regSupplier', post);
|
|---|
| | | // uni.hideLoading()
|
|---|
| | |
|
|---|
| | | if (resp.code == 0) {
|
|---|
| | |
|
|---|
| | | // myCache.cache("userToken", res.data.accessToken)
|
|---|
| | | // let userRes = await gzmzApi.getMemberInfo();
|
|---|
| | | // if (userRes.status) {
|
|---|
| | | // myCache.cache("userInfo", JSON.stringify(userRes.data))
|
|---|
| | | // }
|
|---|
| | | uni.showToast({
|
|---|
| | | title: '注册成功！',
|
|---|
| | | icon: 'none'
|
|---|
| | | });
|
|---|
| | | setTimeout(() => {
|
|---|
| | | this.toLogin()
|
|---|
| | | }, 1000);
|
|---|
| | |
|
|---|
| | | } else {
|
|---|
| | | uni.showToast({
|
|---|
| | | title: '登录失败！',
|
|---|
| | | icon: 'none'
|
|---|
| | | });
|
|---|
| | | return;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | },
|
|---|
| | | tc1(id) {
|
|---|
| | | uni.navigateTo({
|
|---|
| | | url: '/pages/users/xieyi?id=' + id,
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | };
|
|---|
| | | </script>
|
|---|
| | | <style lang="scss" scoped>
|
|---|
| | | .form-input {
|
|---|
| | | background-color: #f8f7fc;
|
|---|
| | | border-radius: 50rpx;
|
|---|
| | | margin-bottom: 50rpx; |
|---|
| | | background: #f8f7fc; |
|---|
| | | border: 1px solid #e9e9e9; |
|---|
| | | font-size: 28rpx; |
|---|
| | | border-radius: 50rpx; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-a { |
|---|
| | | position: relative; |
|---|
| | | |
|---|
| | | .get-code { |
|---|
| | | position: absolute; |
|---|
| | | right: 40rpx; |
|---|
| | | top: 25rpx; |
|---|
| | | z-index: 99; |
|---|
| | | border: 1px solid #e9e9e9;
|
|---|
| | | /deep/ .u-input{ |
|---|
| | | padding-left: 60rpx !important; |
|---|
| | | padding-right: 40rpx !important; |
|---|
| | | }
|
|---|
| | | /deep/ input {
|
|---|
| | | height: 70rpx;
|
|---|
| | | line-height: 70rpx; |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-a .icon { |
|---|
| | | width: 40rpx; |
|---|
| | | height: 40rpx; |
|---|
| | | position: absolute; |
|---|
| | | left: 24rpx; |
|---|
| | | top: 14rpx; |
|---|
| | | margin-right: 20rpx; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-a .line { |
|---|
| | | width: 2rpx; |
|---|
| | | height: 40rpx; |
|---|
| | | background-color: #dedede; |
|---|
| | | position: absolute; |
|---|
| | | top: 28rpx; |
|---|
| | | left: 98rpx; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-b { |
|---|
| | | text-align: left; |
|---|
| | | font-size: 46rpx; |
|---|
| | | color: #000; |
|---|
| | | padding: 300rpx 0 30rpx 0; |
|---|
| | | font-weight: bold; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-b2 { |
|---|
| | | text-align: left; |
|---|
| | | font-size: 32rpx; |
|---|
| | | color: #aaaaaa; |
|---|
| | | padding: 0rpx 0 120rpx 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-c { |
|---|
| | | position: absolute; |
|---|
| | | right: 22rpx; |
|---|
| | | top: 22rpx; |
|---|
| | | background: #5677fc; |
|---|
| | | color: #fff; |
|---|
| | | font-size: 24rpx; |
|---|
| | | border-radius: 50rpx; |
|---|
| | | height: 50rpx; |
|---|
| | | line-height: 50rpx; |
|---|
| | | padding: 0 25rpx; |
|---|
| | | z-index: 999; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-d { |
|---|
| | | text-align: center; |
|---|
| | | color: #999; |
|---|
| | | margin: 80rpx 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-e { |
|---|
| | | text-align: center; |
|---|
| | | width: 250rpx; |
|---|
| | | margin: 80rpx auto 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-g { |
|---|
| | | float: left; |
|---|
| | | width: 50%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-e image { |
|---|
| | | width: 50rpx; |
|---|
| | | height: 50rpx; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-f { |
|---|
| | | text-align: center; |
|---|
| | | margin: 200rpx 0 0 0; |
|---|
| | | color: #666; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .t-f text { |
|---|
| | | margin-left: 20rpx; |
|---|
| | | color: #aaaaaa; |
|---|
| | | font-size: 27rpx; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-login .uni-input-placeholder { |
|---|
| | | color: #000; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .cl { |
|---|
| | | zoom: 1; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .cl:after { |
|---|
| | | clear: both; |
|---|
| | | display: block; |
|---|
| | | visibility: hidden; |
|---|
| | | height: 0; |
|---|
| | | content: '\20'; |
|---|
| | | } |
|---|
| | |
|
|---|
| | | }
|
|---|
| | | </style>
|
|---|
| | | <style lang="scss" scoped>
|
|---|
| | | @import '@/pages/login/login.scss';
|
|---|
| | |
|
|---|
| | | .main-container {
|
|---|
| | | margin: 20px 0;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .img-a {
|
|---|
| | | position: absolute;
|
|---|
| | | width: 100%;
|
|---|
| | | top: -150rpx;
|
|---|
| | | right: 0;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .img-b {
|
|---|
| | | position: absolute;
|
|---|
| | | width: 50%;
|
|---|
| | | bottom: 0;
|
|---|
| | | left: -120rpx;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .to-home {
|
|---|
| | | margin-top: 30rpx;
|
|---|
| | | font-size: 30rpx;
|
|---|
| | | color: #5af;
|
|---|
| | | display: flex;
|
|---|
| | | flex-direction: row-reverse;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login {
|
|---|
| | | width: 100%;
|
|---|
| | | margin: 0 auto;
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | color: #000;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .bg {
|
|---|
| | | width: 100%;
|
|---|
| | | position: relative;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .login {
|
|---|
| | | width: 650rpx;
|
|---|
| | | margin: 60rpx auto;
|
|---|
| | | margin-top: 0rpx;
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | color: #000;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login button {
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | background: #5677fc;
|
|---|
| | | color: #fff;
|
|---|
| | | height: 90rpx;
|
|---|
| | | line-height: 90rpx;
|
|---|
| | | border-radius: 50rpx;
|
|---|
| | | box-shadow: 0 5px 7px 0 rgba(86, 119, 252, 0.2);
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login input {
|
|---|
| | | padding: 0 20rpx 0 60rpx;
|
|---|
| | | height: 90rpx;
|
|---|
| | | line-height: 90rpx;
|
|---|
| | | margin-bottom: 50rpx;
|
|---|
| | | background: #f8f7fc;
|
|---|
| | | border: 1px solid #e9e9e9;
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | border-radius: 50rpx;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-a {
|
|---|
| | | position: relative;
|
|---|
| | |
|
|---|
| | | .get-code {
|
|---|
| | | // position: absolute;
|
|---|
| | | // right: 0rpx;
|
|---|
| | | // top: 0rpx;
|
|---|
| | | // z-index: 99;
|
|---|
| | | // padding-top: 25rpx;
|
|---|
| | | // bottom: 0;
|
|---|
| | | // padding-right: 40rpx;
|
|---|
| | | // padding-left: 20rpx;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-a .icon {
|
|---|
| | | width: 40rpx;
|
|---|
| | | height: 40rpx;
|
|---|
| | | position: absolute;
|
|---|
| | | left: 24rpx;
|
|---|
| | | top: 14rpx;
|
|---|
| | | margin-right: 20rpx;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-a .line {
|
|---|
| | | width: 2rpx;
|
|---|
| | | height: 40rpx;
|
|---|
| | | background-color: #dedede;
|
|---|
| | | position: absolute;
|
|---|
| | | top: 28rpx;
|
|---|
| | | left: 98rpx;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-b {
|
|---|
| | | text-align: left;
|
|---|
| | | font-size: 46rpx;
|
|---|
| | | color: #000;
|
|---|
| | | padding: 300rpx 0 30rpx 0;
|
|---|
| | | font-weight: bold;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-b2 {
|
|---|
| | | text-align: left;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | color: #aaaaaa;
|
|---|
| | | padding: 0rpx 0 120rpx 0;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-c {
|
|---|
| | | position: absolute;
|
|---|
| | | right: 22rpx;
|
|---|
| | | top: 22rpx;
|
|---|
| | | background: #5677fc;
|
|---|
| | | color: #fff;
|
|---|
| | | font-size: 24rpx;
|
|---|
| | | border-radius: 50rpx;
|
|---|
| | | height: 50rpx;
|
|---|
| | | line-height: 50rpx;
|
|---|
| | | padding: 0 25rpx;
|
|---|
| | | z-index: 999;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-d {
|
|---|
| | | text-align: center;
|
|---|
| | | color: #999;
|
|---|
| | | margin: 80rpx 0;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-e {
|
|---|
| | | text-align: center;
|
|---|
| | | width: 250rpx;
|
|---|
| | | margin: 80rpx auto 0;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-g {
|
|---|
| | | float: left;
|
|---|
| | | width: 50%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-e image {
|
|---|
| | | width: 50rpx;
|
|---|
| | | height: 50rpx;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-f {
|
|---|
| | | text-align: center;
|
|---|
| | | margin: 200rpx 0 0 0;
|
|---|
| | | color: #666;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .t-f text {
|
|---|
| | | margin-left: 20rpx;
|
|---|
| | | color: #aaaaaa;
|
|---|
| | | font-size: 27rpx;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .t-login .uni-input-placeholder {
|
|---|
| | | color: #000;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .cl {
|
|---|
| | | zoom: 1;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .cl:after {
|
|---|
| | | clear: both;
|
|---|
| | | display: block;
|
|---|
| | | visibility: hidden;
|
|---|
| | | height: 0;
|
|---|
| | | content: '\20';
|
|---|
| | | }
|
|---|
| | | </style> |
|---|
