|
@@ -0,0 +1,428 @@
|
|
|
|
+<template>
|
|
|
|
+ <view style="width: 100%;height: 100%;">
|
|
|
|
+ <!-- logo -->
|
|
|
|
+ <view style="height: 30vh;" class="flex justify-center align-center">
|
|
|
|
+ <image src="https://zhengda.oss-cn-chengdu.aliyuncs.com/baoma/static/img/logo.png" style="width: 404rpx;height: 156rpx;"></image>
|
|
|
|
+ </view>
|
|
|
|
+ <!--
|
|
|
|
+ 登录:
|
|
|
|
+ 输入框: 手机号 验证码
|
|
|
|
+ 按钮: 登录 一键授权 暂不登录
|
|
|
|
+ 下划线: 注册账号 账号密码登录
|
|
|
|
+ -->
|
|
|
|
+ <!-- 输入框 -->
|
|
|
|
+ <view style="height: 30vh;padding: 0 100rpx;">
|
|
|
|
+ <!-- 手机号 -->
|
|
|
|
+ <view style="padding-bottom: 36rpx;display: flex;border-bottom: 1rpx solid #E0E0E0;margin-bottom: 60rpx;">
|
|
|
|
+ <!-- 图标 手机图标-->
|
|
|
|
+ <image src="https://zhengda.oss-cn-chengdu.aliyuncs.com/baoma/static/img/phone.png" style="width: 32rpx;height: 32rpx;margin-right: 20rpx;"></image>
|
|
|
|
+ <!-- 线条 方向是竖-->
|
|
|
|
+ <view style="margin-right: 20rpx;">
|
|
|
|
+ <u-line color="#D8D8D8" direction="col" />
|
|
|
|
+ </view>
|
|
|
|
+ <input v-model="phoneData" placeholder="请输入手机号" style="height: 28rpx;" />
|
|
|
|
+ </view>
|
|
|
|
+ <!-- 验证码 -->
|
|
|
|
+ <view style="padding-bottom: 36rpx;display: flex;border-bottom: 1rpx solid #E0E0E0;margin-bottom: 60rpx" v-if="!ispwdlogin">
|
|
|
|
+ <!-- 图标 手机图标-->
|
|
|
|
+ <image src="https://zhengda.oss-cn-chengdu.aliyuncs.com/baoma/static/img/Verification.png" style="width: 32rpx;height: 32rpx;margin-right: 20rpx;"></image>
|
|
|
|
+ <!-- 线条 方向是竖-->
|
|
|
|
+ <view style="margin-right: 20rpx;">
|
|
|
|
+ <u-line color="#D8D8D8" direction="col" />
|
|
|
|
+ </view>
|
|
|
|
+ <wInput v-model="verCode" type="number" maxlength="6" placeholder="请输入验证码" isShowCode ref="runCode" @setCode="getVerCode()"></wInput>
|
|
|
|
+ </view>
|
|
|
|
+ <!-- 密码 -->
|
|
|
|
+ <view style="padding-bottom: 36rpx;display: flex;border-bottom: 1rpx solid #E0E0E0;margin-bottom: 60rpx" v-if="ispwdlogin">
|
|
|
|
+ <!-- 图标 手机图标-->
|
|
|
|
+ <image src="https://zhengda.oss-cn-chengdu.aliyuncs.com/baoma/static/img/password.png" style="width: 32rpx;height: 32rpx;margin-right: 20rpx;"></image>
|
|
|
|
+ <!-- 线条 方向是竖-->
|
|
|
|
+ <view style="margin-right: 20rpx;">
|
|
|
|
+ <u-line color="#D8D8D8" direction="col" />
|
|
|
|
+ </view>
|
|
|
|
+ <input v-model="password" placeholder="请输入密码" :password="true" style="height: 28rpx;" />
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <!-- 按钮 -->
|
|
|
|
+ <view style="height: 30vh;padding: 0 80rpx;">
|
|
|
|
+ <!-- 登录 -->
|
|
|
|
+ <u-button @click="startReg()" type="primary" shape="circle" :loading="isRotate" :custom-style="customStyle">登录</u-button>
|
|
|
|
+
|
|
|
|
+ <view class="flex align-center justify-between" style="margin: 70rpx 0 100rpx 0;">
|
|
|
|
+ <button :class="" open-type="getUserInfo" style="box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.08);border-radius: 60rpx;border: 0.3rpx solid #dedede;"
|
|
|
|
+ @getuserinfo="getinfo">
|
|
|
|
+ <view :class="rotate_loop" style="font-size: 30rpx;color: #84BB43;">
|
|
|
|
+ <slot name="text">微信授权一键登录</slot>
|
|
|
|
+ </view>
|
|
|
|
+ </button>
|
|
|
|
+ <button @click="toindex()" style="width: 45%;font-size: 30rpx;border-radius: 60rpx;box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.08);border: 0.3rpx solid #dedede;color: #7a7a7a;" :custom-style="customStyle" :class="buttonBorder">暂不登录</button>
|
|
|
|
+ </view>
|
|
|
|
+ <!-- <view class="flex align-center justify-between" style="margin: 70rpx 0 100rpx 0;">
|
|
|
|
+ <u-button open-type="getUserInfo" @getuserInfo="getinfo" shape="circle" style="width: 50%;font-size: 30rpx;color:#84BB43;" :custom-style="customStyle"
|
|
|
|
+ hair-line="false">微信授权一键登录</u-button>
|
|
|
|
+ <u-button @click="toindex()" shape="circle" style="width: 45%;font-size: 30rpx;" hair-line="false">暂不登录</u-button>
|
|
|
|
+ </view> -->
|
|
|
|
+ <view class="flex align-center justify-between">
|
|
|
|
+ <view style="width: 50%;text-align: center;">
|
|
|
|
+ <text style="text-decoration:underline; color: #666666;" @click="goreg">注册账号</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view style="width: 50%;text-align: center;">
|
|
|
|
+ <text style="text-decoration:underline ; color: #666666;" @click="ispwd">{{ispwdlogin?'验证码':'账号密码'}}登录</text>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+ var _this;
|
|
|
|
+ import wInput from '../../components/watch-input.vue' //input
|
|
|
|
+ import wButton from '../../components/watch-button.vue' //button
|
|
|
|
+ import request from '../../common/request.js'
|
|
|
|
+ var user = require('../../common/user.js');
|
|
|
|
+ import {
|
|
|
|
+ mapState,
|
|
|
|
+ mapMutations,
|
|
|
|
+ mapGetters,
|
|
|
|
+ mapActions
|
|
|
|
+ } from 'vuex';
|
|
|
|
+ import store from '@/store'
|
|
|
|
+ import auth from '../../common/authorize.js'
|
|
|
|
+ // import IMService from "../../common/goeasyimutil.js"
|
|
|
|
+ export default {
|
|
|
|
+ computed: {
|
|
|
|
+ ...mapGetters({
|
|
|
|
+ hasLogin: 'verifyJwt'
|
|
|
|
+ }),
|
|
|
|
+ ...mapState(['user'])
|
|
|
|
+ },
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ //一键登录按钮样式
|
|
|
|
+ customStyle: {
|
|
|
|
+ boxShadow: '0px 0px 16px 0px rgba(0, 0, 0, 0.08)',
|
|
|
|
+ },
|
|
|
|
+ //logo图片 base64
|
|
|
|
+ phoneData: '', // 用户/电话
|
|
|
|
+ verCode: "", //验证码
|
|
|
|
+ password: "", //密码
|
|
|
|
+ ispwdlogin: false, //是否使用密码登录
|
|
|
|
+ isRotate: false, //是否登录按钮加载旋转
|
|
|
|
+ istrue: false,
|
|
|
|
+ num: 1,
|
|
|
|
+ imgitem: {
|
|
|
|
+ istrue: false,
|
|
|
|
+ name: "https://zhengda.oss-cn-chengdu.aliyuncs.com/baoma/static/img/xieyi.png"
|
|
|
|
+ },
|
|
|
|
+ show: false,
|
|
|
|
+ isphoneNum: false
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ onLoad() {
|
|
|
|
+ const jwt = store.getters['getJwt'];
|
|
|
|
+ uni.checkSession({
|
|
|
|
+ success() {
|
|
|
|
+ uni.navigateTo({
|
|
|
|
+ url: '../index/index'
|
|
|
|
+ })
|
|
|
|
+ return;
|
|
|
|
+ },
|
|
|
|
+ fail() {
|
|
|
|
+ uni.navigateTo({
|
|
|
|
+ url: "../doctor_related/doctor_info"
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ components: {
|
|
|
|
+ wInput,
|
|
|
|
+ wButton,
|
|
|
|
+ },
|
|
|
|
+ mounted() {
|
|
|
|
+ _this = this;
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+
|
|
|
|
+ //验证码点击事件
|
|
|
|
+ getVerCode: async function() {
|
|
|
|
+ //获取验证码
|
|
|
|
+ if (_this.phoneData.length != 11) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '手机号不正确'
|
|
|
|
+ });
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ console.log(_this.phoneData)
|
|
|
|
+ let res = await this.$request.post("common/putverfiy", {
|
|
|
|
+ 'phone': _this.phoneData
|
|
|
|
+ });
|
|
|
|
+ if (res.status == 0) {
|
|
|
|
+ uni.setStorageSync('verfiyCode', res.data);
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '验证码发送,请查收'
|
|
|
|
+ });
|
|
|
|
+ this.$refs.runCode.$emit('runCode'); //触发倒计时(一般用于请求成功验证码后调用)
|
|
|
|
+ setTimeout(function() {
|
|
|
|
+ _this.$refs.runCode.$emit('runCode', 0); //假装模拟下需要 终止倒计时
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '模拟倒计时终止'
|
|
|
|
+ });
|
|
|
|
+ }, 3000)
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '请求失败'
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ //点击登录
|
|
|
|
+ startReg: async function() {
|
|
|
|
+ //注册
|
|
|
|
+ if (this.isRotate) {
|
|
|
|
+ //判断是否加载中,避免重复点击请求
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ if (this.phoneData.length != 11) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '手机号不正确'
|
|
|
|
+ });
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ if (this.ispwdlogin) {
|
|
|
|
+ // 账号密码登陆
|
|
|
|
+ if (this.password < 6) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '密码位数不低于6位'
|
|
|
|
+ });
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ // 发送登陆
|
|
|
|
+ let res = await this.$request.post('common/passLogin', {
|
|
|
|
+ 'phone': this.phoneData,
|
|
|
|
+ 'password': this.password
|
|
|
|
+ });
|
|
|
|
+ if (res.status == 0) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '登陆成功'
|
|
|
|
+ });
|
|
|
|
+ store.commit('setJwt', res.data.token);
|
|
|
|
+ store.commit('setUser', res.data);
|
|
|
|
+ store.commit('login');
|
|
|
|
+ // 写一个跳转到首页
|
|
|
|
+ setTimeout(function() {
|
|
|
|
+ uni.navigateBack({
|
|
|
|
+ delta: 1
|
|
|
|
+ })
|
|
|
|
+ uni.switchTab({
|
|
|
|
+ url: "../index/index"
|
|
|
|
+ })
|
|
|
|
+ }, 2000)
|
|
|
|
+ return false;
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: res.message
|
|
|
|
+ });
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ } else {
|
|
|
|
+ if (this.verCode.length != 4) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '验证码不正确'
|
|
|
|
+ });
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ let code = uni.getStorageSync('verfiyCode')
|
|
|
|
+
|
|
|
|
+ if (code == null || code == '') {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '验证码错误'
|
|
|
|
+ });
|
|
|
|
+ return false;
|
|
|
|
+ } else {
|
|
|
|
+ if (this.verCode == code) {
|
|
|
|
+ // 发送登陆
|
|
|
|
+ let res = await this.$request.post('common/phoneLogin', {
|
|
|
|
+ 'phone': this.phoneData
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ if (res.status == 0) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '登陆成功'
|
|
|
|
+ });
|
|
|
|
+ uni.removeStorage('verfiyCode')
|
|
|
|
+ store.commit('setJwt', res.data.token);
|
|
|
|
+ store.commit('setUser', res.data);
|
|
|
|
+ store.commit('login');
|
|
|
|
+
|
|
|
|
+ // 写一个跳转到首页
|
|
|
|
+ setTimeout(function() {
|
|
|
|
+ uni.navigateBack({
|
|
|
|
+ delta: 1
|
|
|
|
+ })
|
|
|
|
+ uni.switchTab({
|
|
|
|
+ url: "../index/index"
|
|
|
|
+ })
|
|
|
|
+ }, 2000)
|
|
|
|
+ return false;
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: res.message
|
|
|
|
+ });
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ icon: 'none',
|
|
|
|
+ position: 'bottom',
|
|
|
|
+ title: '验证码错误'
|
|
|
|
+ });
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ _this.isRotate = true
|
|
|
|
+ setTimeout(function() {
|
|
|
|
+ _this.isRotate = false
|
|
|
|
+ }, 3000)
|
|
|
|
+ },
|
|
|
|
+ toindex() {
|
|
|
|
+ uni.switchTab({
|
|
|
|
+ url: "../index/index"
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ goreg() {
|
|
|
|
+ uni.navigateTo({
|
|
|
|
+ url: "./reg"
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ ispwd() {
|
|
|
|
+ this.ispwdlogin = !this.ispwdlogin
|
|
|
|
+ },
|
|
|
|
+ // 一键登录
|
|
|
|
+ getinfo: async function(e) {
|
|
|
|
+ let that = this;
|
|
|
|
+ let meToken = user.loginByWeixin(e.detail.userInfo).then(res => {
|
|
|
|
+ console.log('返回的res',res)
|
|
|
|
+ if (res.status == 0) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: "登录成功",
|
|
|
|
+ icon: "none",
|
|
|
|
+ duration: 2000
|
|
|
|
+ })
|
|
|
|
+ console.log(res.data);
|
|
|
|
+ if (typeof res.data.token != 'undefined') {
|
|
|
|
+ console.log('我登录来 !');
|
|
|
|
+ getApp().globalData.imService = new IMService();
|
|
|
|
+ let loginResult = getApp().globalData.imService.login({
|
|
|
|
+ uuid: res.data.data.flag,
|
|
|
|
+ name: res.data.data.name,
|
|
|
|
+ avatar: res.data.data.avatar
|
|
|
|
+ });
|
|
|
|
+ if (loginResult) {
|
|
|
|
+ //连接IM
|
|
|
|
+ getApp().globalData.imService.connectIM();
|
|
|
|
+ }
|
|
|
|
+ store.commit('setJwt', res.data.token);
|
|
|
|
+ store.commit('setUser', res.data);
|
|
|
|
+ store.commit('login');
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: "登录成功",
|
|
|
|
+ icon: "none",
|
|
|
|
+ duration: 2000
|
|
|
|
+ })
|
|
|
|
+ setTimeout(function() {
|
|
|
|
+ uni.navigateBack({
|
|
|
|
+ delta: 1
|
|
|
|
+ })
|
|
|
|
+ uni.switchTab({
|
|
|
|
+ url: "../index/index"
|
|
|
|
+ })
|
|
|
|
+ }, 2000)
|
|
|
|
+ } else {
|
|
|
|
+ that.session_key = res.data.session_key
|
|
|
|
+ that.openid = res.data.openid
|
|
|
|
+ that.show = true
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ getPhoneNumber: async function(e) {
|
|
|
|
+ let res = await this.$request.post("api/v2/common/getPhoneNumber", {
|
|
|
|
+ iv: e.detail.iv,
|
|
|
|
+ encryptedData: e.detail.encryptedData,
|
|
|
|
+ session_key: this.session_key,
|
|
|
|
+ openid: this.openid
|
|
|
|
+ })
|
|
|
|
+ this.show = false
|
|
|
|
+ if (res.status == 0) {
|
|
|
|
+ if (res.data.token) {
|
|
|
|
+ store.commit('setJwt', res.data.token);
|
|
|
|
+ store.commit('setUser', res.data);
|
|
|
|
+ store.commit('login');
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: "登录成功",
|
|
|
|
+ icon: "none",
|
|
|
|
+ duration: 2000
|
|
|
|
+ })
|
|
|
|
+ // 写一个跳转到首页
|
|
|
|
+ setTimeout(function() {
|
|
|
|
+ uni.navigateBack({
|
|
|
|
+ delta: 1
|
|
|
|
+ })
|
|
|
|
+ uni.switchTab({
|
|
|
|
+ url: "../index/index"
|
|
|
|
+ })
|
|
|
|
+ }, 2000)
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style>
|
|
|
|
+ @import url("../../components/colorui/icon.css");
|
|
|
|
+ @import url("./css/main.css");
|
|
|
|
+
|
|
|
|
+ page {
|
|
|
|
+ background-color: #fff;
|
|
|
|
+ }
|
|
|
|
+</style>
|