【模版目录】更新移动前端源码

This commit is contained in:
吴昊天 2022-10-11 10:58:07 +08:00
parent 0c9ec9bcc5
commit b34dda51f6
17 changed files with 4788 additions and 4548 deletions

View File

@ -214,6 +214,13 @@
// #ifdef MP
let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
that.globalData.navH = menuButtonInfo.top * 2 + menuButtonInfo.height / 2;
const version = uni.getSystemInfoSync().SDKVersion
if (Routine.compareVersion(version, '2.21.2') >= 0) {
console.log(version)
that.$Cache.set('MP_VERSION_ISNEW', true)
} else {
that.$Cache.set('MP_VERSION_ISNEW', false)
}
// #endif
// #ifdef H5
@ -230,87 +237,6 @@
} else {
this.globalData.isIframe = false;
}
//公众号静默授权
// if (window.location.pathname !== '/' && option.query.scope === 'snsapi_base') {
// let snsapiBase = 'snsapi_base';
// let urlData = location.pathname + location.search;
// // if (!that.$store.getters.isLogin && uni.getStorageSync('authIng')) {
// // uni.setStorageSync('authIng', false)
// // }
// if (!that.$store.getters.isLogin && Auth.isWeixin()) {
// let code,
// state,
// scope = ''
// if (option.query.code instanceof Array) {
// code = option.query.code[option.query.code.length - 1]
// } else {
// code = option.query.code
// }
// if (code && code != uni.getStorageSync('snsapiCode') && location.pathname.indexOf(
// '/pages/users/wechat_login/index') === -1) {
// // 存储静默授权code
// uni.setStorageSync('snsapiCode', code);
// let spread = that.globalData.spid ? that.globalData.spid : '';
// uni.setStorageSync('authIng', true)
// silenceAuth({
// code: code,
// spread: that.$Cache.get('spread'),
// spid: that.globalData.code
// })
// .then(res => {
// uni.setStorageSync('authIng', false)
// uni.setStorageSync('snRouter', decodeURIComponent(decodeURIComponent(option.query
// .back_url)));
// if (res.data.key !== undefined && res.data.key) {
// this.$Cache.set('snsapiKey', res.data.key);
// } else {
// let time = res.data.expires_time - this.$Cache.time();
// this.$store.commit('LOGIN', {
// token: res.data.token,
// time: time
// });
// this.$Cache.set('WX_AUTH', code);
// this.$store.commit('SETUID', res.data.userInfo.uid);
// this.$store.commit('UPDATE_USERINFO', res.data.userInfo);
// if (option.query.back_url) {
// location.replace(decodeURIComponent(decodeURIComponent(option.query
// .back_url)));
// }
// }
// })
// .catch(error => {
// uni.setStorageSync('authIng', false)
// let url = ''
// if (option.query.back_url instanceof Array) {
// url = option.query.back_url[option.query.back_url.length - 1]
// } else {
// url = option.query.back_url
// }
// if (!that.$Cache.has('snsapiKey')) {
// if (location.pathname.indexOf('/pages/users/wechat_login/index') === -1) {
// Auth.oAuth(snsapiBase, url);
// }
// }
// });
// } else {
// if (!this.$Cache.has('snsapiKey')) {
// if (location.pathname.indexOf('/pages/users/wechat_login/index') === -1) {
// Auth.oAuth(snsapiBase, urlData);
// }
// }
// }
// } else {
// if (option.query.back_url) {
// location.replace(uni.getStorageSync('snRouter'));
// }
// }
// }
// #endif
// #ifdef MP
// 小程序静默授权
@ -334,6 +260,11 @@
uni.setStorageSync('copyRight', res.data)
})
},
// #ifdef H5
onHide() {
this.$Cache.clear('snsapiKey')
},
// #endif
methods: {
// 小程序静默授权
// silenceAuth(code) {
@ -359,9 +290,7 @@
// .catch(res => {});
// },
},
onHide: function() {
}
};
</script>

View File

@ -1,193 +1,204 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2022 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import request from "@/utils/request.js";
import wechat from "@/libs/wechat.js";
/**
* 获取微信sdk配置
* @returns {*}
*/
export function getWechatConfig() {
return request.get(
"wechat/config", {
url: wechat.signLink()
}, {
noAuth: true
}
);
}
/**
* 获取微信sdk配置
* @returns {*}
*/
export function wechatAuth(code, spread, login_type) {
return request.get(
"wechat/auth", {
code,
spread,
login_type
}, {
noAuth: true
}
);
}
/**
* 获取登录授权login
*
*/
export function getLogo() {
return request.get('wechat/get_logo', {}, {
noAuth: true
});
}
/**
* 小程序用户登录
* @param data object 小程序用户登陆信息
*/
export function login(data) {
return request.post("wechat/mp_auth", data, {
noAuth: true
});
}
/**
* 静默授权
* @param {Object} data
*/
export function silenceAuth(data) {
//#ifdef MP
return request.get("v2/wechat/silence_auth", data, {
noAuth: true
});
//#endif
//#ifdef H5
return request.get("v2/wechat/wx_silence_auth", data, {
noAuth: true
});
//#endif
}
/**
* 分享
* @returns {*}
*/
export function getShare() {
return request.get("share", {}, {
noAuth: true
});
}
/**
* 获取关注海报
* @returns {*}
*/
export function follow() {
return request.get("wechat/follow", {}, {
noAuth: true
});
}
/**
* 获取图片base64
* @retins {*}
* */
export function imageBase64(image, code) {
return request.post(
"image_base64", {
image: image,
code: code
}, {
noAuth: true
}
);
}
/**
* 自动复制口令功能
* @returns {*}
*/
export function copyWords() {
return request.get("copy_words", {}, {
noAuth: true
});
}
/**
* 获取商城是否强制绑定手机号
*/
export function getShopConfig() {
return request.get('v2/bind_status', {}, {
noAuth: true
});
}
/**
* 小程序绑定手机号
* @param {Object} data
*/
export function getUserPhone(data) {
return request.post('v2/auth_bindind_phone', data, {
noAuth: true
});
}
/**
* 小程序用户登录
* @param data object 小程序用户登陆信息
*/
export function routineLogin(data) {
return request.get("v2/wechat/routine_auth", data, {
noAuth: true
});
}
/**
* 获取微信sdk配置
* @returns {*}
*/
export function wechatAuthV2(code, spread) {
return request.get(
"v2/wechat/auth", {
code,
spread
}, {
noAuth: true
}
);
}
/**
* 获取组件底部菜单
* @param data object 获取组件底部菜单
*/
export function getNavigation(data) {
return request.get("navigation", data, {
noAuth: true
});
}
export function getSubscribe() {
return request.get("subscribe", {}, {
noAuth: true
});
}
/**
* 获取版本信息
* @param 系统类型
*/
export function getUpdateInfo(type) {
return request.get("get_new_app/" + type, {}, {
noAuth: true
});
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2022 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import request from "@/utils/request.js";
import wechat from "@/libs/wechat.js";
/**
* 获取微信sdk配置
* @returns {*}
*/
export function getWechatConfig() {
return request.get(
"wechat/config", {
url: wechat.signLink()
}, {
noAuth: true
}
);
}
/**
* 获取微信sdk配置
* @returns {*}
*/
export function wechatAuth(code, spread, login_type) {
return request.get(
"wechat/auth", {
code,
spread,
login_type
}, {
noAuth: true
}
);
}
/**
* 获取登录授权login
*
*/
export function getLogo() {
return request.get('wechat/get_logo', {}, {
noAuth: true
});
}
/**
* 小程序用户登录
* @param data object 小程序用户登陆信息
*/
export function login(data) {
return request.post("wechat/mp_auth", data, {
noAuth: true
});
}
/**
* 静默授权
* @param {Object} data
*/
export function silenceAuth(data) {
//#ifdef MP
return request.get("v2/wechat/silence_auth", data, {
noAuth: true
});
//#endif
//#ifdef H5
return request.get("v2/wechat/wx_silence_auth", data, {
noAuth: true
});
//#endif
}
/**
* 分享
* @returns {*}
*/
export function getShare() {
return request.get("share", {}, {
noAuth: true
});
}
/**
* 获取关注海报
* @returns {*}
*/
export function follow() {
return request.get("wechat/follow", {}, {
noAuth: true
});
}
/**
* code生成用户
* @returns {*}
*/
export function authLogin(data) {
return request.get("v2/wechat/silence_auth_login", data, {
noAuth: true
});
}
/**
* 获取图片base64
* @retins {*}
* */
export function imageBase64(image, code) {
return request.post(
"image_base64", {
image: image,
code: code
}, {
noAuth: true
}
);
}
/**
* 自动复制口令功能
* @returns {*}
*/
export function copyWords() {
return request.get("copy_words", {}, {
noAuth: true
});
}
/**
* 获取商城是否强制绑定手机号
*/
export function getShopConfig() {
return request.get('v2/bind_status', {}, {
noAuth: true
});
}
/**
* 小程序绑定手机号
* @param {Object} data
*/
export function getUserPhone(data) {
return request.post('v2/auth_bindind_phone', data, {
noAuth: true
});
}
/**
* 小程序用户登录
* @param data object 小程序用户登陆信息
*/
export function routineLogin(data) {
return request.get("v2/wechat/routine_auth", data, {
noAuth: true
});
}
/**
* 获取微信sdk配置
* @returns {*}
*/
export function wechatAuthV2(code, spread) {
return request.get(
"v2/wechat/auth", {
code,
spread
}, {
noAuth: true
}
);
}
/**
* 获取组件底部菜单
* @param data object 获取组件底部菜单
*/
export function getNavigation(data) {
return request.get("navigation", data, {
noAuth: true
});
}
export function getSubscribe() {
return request.get("subscribe", {}, {
noAuth: true
});
}
/**
* 获取版本信息
* @param 系统类型
*/
export function getUpdateInfo(type) {
return request.get("get_new_app/" + type, {}, {
noAuth: true
});
}

View File

@ -1,220 +1,252 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2022 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import store from '../store';
import {
checkLogin
} from './login';
import {
login,
routineLogin,
silenceAuth
} from '../api/public';
import Cache from '../utils/cache';
import {
STATE_R_KEY,
USER_INFO,
EXPIRES_TIME,
LOGIN_STATUS
} from './../config/cache';
import {
mapGetters
} from "vuex";
class Routine {
constructor() {
this.scopeUserInfo = 'scope.userInfo';
}
async getUserCode() {
let isAuth = await this.isAuth(),
code = '';
if (isAuth)
code = await this.getCode();
return code;
}
// 小程序静默授权
// silenceAuth(code) {
// const app = getApp();
// let that = this;
// let spread = app.globalData.spid ? app.globalData.spid : '';
// return new Promise((resolve, reject) => {
// silenceAuth({
// code: code,
// spread_spid: spread,
// spread_code: app.globalData.code
// })
// .then(res => {
// if (res.data && res.data.token !== undefined) {
// uni.hideLoading();
// let time = res.data.expires_time - Math.round(new Date() / 1000);
// store.commit('LOGIN', {
// token: res.data.token,
// time: time
// });
// store.commit('SETUID', res.data.userInfo.uid);
// store.commit('UPDATE_USERINFO', res.data.userInfo);
// resolve(res)
// } else {
// reject()
// uni.navigateTo({
// url: '/pages/users/wechat_login/index'
// })
// }
// })
// .catch(err => {
// reject(err)
// });
// })
// }
/**
* 获取用户信息
*/
getUserInfo() {
let that = this,
code = this.getUserCode();
return new Promise((resolve, reject) => {
uni.getUserInfo({
lang: 'zh_CN',
success(user) {
if (code) user.code = code;
resolve({
userInfo: user,
islogin: false
});
},
fail(res) {
reject(res);
}
})
})
}
/**
* 新版小程序获取用户信息 2021 4.13微信小程序开始正式启用
*/
getUserProfile(code) {
return new Promise((resolve, reject) => {
uni.getUserProfile({
lang: 'zh_CN',
desc: '用于完善会员资料', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
success(user) {
if (code) user.code = code;
resolve({
userInfo: user,
islogin: false
});
},
fail(res) {
reject(res);
}
})
})
}
/**
* 获取用户信息
*/
authorize() {
let that = this;
return new Promise((resolve, reject) => {
if (checkLogin())
return resolve({
userInfo: Cache.get(USER_INFO, true),
islogin: true,
});
uni.authorize({
scope: that.scopeUserInfo,
success() {
resolve({
islogin: false
});
},
fail(res) {
reject(res);
}
})
})
}
async getCode() {
let provider = await this.getProvider();
return new Promise((resolve, reject) => {
// if(Cache.has(STATE_R_KEY)){
// return resolve(Cache.get(STATE_R_KEY));
// }
uni.login({
provider: provider,
success(res) {
if (res.code) Cache.set(STATE_R_KEY, res.code, 10800);
return resolve(res.code);
},
fail() {
return reject(null);
}
})
})
}
/**
* 获取服务供应商
*/
getProvider() {
return new Promise((resolve, reject) => {
uni.getProvider({
service: 'oauth',
success(res) {
resolve(res.provider);
},
fail() {
resolve(false);
}
});
});
}
/**
* 是否授权
*/
isAuth() {
let that = this;
return new Promise((resolve, reject) => {
uni.getSetting({
success(res) {
if (!res.authSetting[that.scopeUserInfo]) {
resolve(true)
} else {
resolve(true);
}
},
fail() {
resolve(false);
}
});
});
}
authUserInfo(data) {
return new Promise((resolve, reject) => {
routineLogin(data).then(res => {
if (res.data.key !== undefined && res.data.key) {} else {
store.commit('UPDATE_USERINFO', res.data.userInfo);
store.commit('SETUID', res.data.userInfo.uid);
Cache.set(USER_INFO, res.data.userInfo);
}
return resolve(res);
}).catch(res => {
return reject(res);
})
})
}
}
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2022 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import store from '../store';
import {
checkLogin
} from './login';
import {
login,
routineLogin,
silenceAuth
} from '../api/public';
import Cache from '../utils/cache';
import {
STATE_R_KEY,
USER_INFO,
EXPIRES_TIME,
LOGIN_STATUS
} from './../config/cache';
import {
mapGetters
} from "vuex";
class Routine {
constructor() {
this.scopeUserInfo = 'scope.userInfo';
}
async getUserCode() {
let isAuth = await this.isAuth(),
code = '';
if (isAuth)
code = await this.getCode();
return code;
}
// 小程序静默授权
// silenceAuth(code) {
// const app = getApp();
// let that = this;
// let spread = app.globalData.spid ? app.globalData.spid : '';
// return new Promise((resolve, reject) => {
// silenceAuth({
// code: code,
// spread_spid: spread,
// spread_code: app.globalData.code
// })
// .then(res => {
// if (res.data && res.data.token !== undefined) {
// uni.hideLoading();
// let time = res.data.expires_time - Math.round(new Date() / 1000);
// store.commit('LOGIN', {
// token: res.data.token,
// time: time
// });
// store.commit('SETUID', res.data.userInfo.uid);
// store.commit('UPDATE_USERINFO', res.data.userInfo);
// resolve(res)
// } else {
// reject()
// uni.navigateTo({
// url: '/pages/users/wechat_login/index'
// })
// }
// })
// .catch(err => {
// reject(err)
// });
// })
// }
/**
* 获取用户信息
*/
getUserInfo() {
let that = this,
code = this.getUserCode();
return new Promise((resolve, reject) => {
uni.getUserInfo({
lang: 'zh_CN',
success(user) {
if (code) user.code = code;
resolve({
userInfo: user,
islogin: false
});
},
fail(res) {
reject(res);
}
})
})
}
/**
* 新版小程序获取用户信息 2021 4.13微信小程序开始正式启用
*/
getUserProfile(code) {
return new Promise((resolve, reject) => {
uni.getUserProfile({
lang: 'zh_CN',
desc: '用于完善会员资料', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
success(user) {
if (code) user.code = code;
resolve({
userInfo: user,
islogin: false
});
},
fail(res) {
reject(res);
}
})
})
}
/**
* 获取用户信息
*/
authorize() {
let that = this;
return new Promise((resolve, reject) => {
if (checkLogin())
return resolve({
userInfo: Cache.get(USER_INFO, true),
islogin: true,
});
uni.authorize({
scope: that.scopeUserInfo,
success() {
resolve({
islogin: false
});
},
fail(res) {
reject(res);
}
})
})
}
async getCode() {
let provider = await this.getProvider();
return new Promise((resolve, reject) => {
// if(Cache.has(STATE_R_KEY)){
// return resolve(Cache.get(STATE_R_KEY));
// }
uni.login({
provider: provider,
success(res) {
console.log(res, '22222')
if (res.code) Cache.set(STATE_R_KEY, res.code, 10800);
return resolve(res.code);
},
fail() {
return reject(null);
}
})
})
}
/**
* 获取服务供应商
*/
getProvider() {
return new Promise((resolve, reject) => {
uni.getProvider({
service: 'oauth',
success(res) {
resolve(res.provider);
},
fail() {
resolve(false);
}
});
});
}
/**
* 是否授权
*/
isAuth() {
let that = this;
return new Promise((resolve, reject) => {
uni.getSetting({
success(res) {
if (!res.authSetting[that.scopeUserInfo]) {
resolve(true)
} else {
resolve(true);
}
},
fail() {
resolve(false);
}
});
});
}
/**
* 小程序比较版本信息
* @param v1 当前版本
* @param v2 进行比较的版本
* @return boolen
*
*/
compareVersion(v1, v2) {
v1 = v1.split('.')
v2 = v2.split('.')
const len = Math.max(v1.length, v2.length)
while (v1.length < len) {
v1.push('0')
}
while (v2.length < len) {
v2.push('0')
}
for (let i = 0; i < len; i++) {
const num1 = parseInt(v1[i])
const num2 = parseInt(v2[i])
if (num1 > num2) {
return 1
} else if (num1 < num2) {
return -1
}
}
return 0
}
authUserInfo(data) {
return new Promise((resolve, reject) => {
routineLogin(data).then(res => {
if (res.data.key !== undefined && res.data.key) {} else {
store.commit('UPDATE_USERINFO', res.data.userInfo);
store.commit('SETUID', res.data.userInfo.uid);
Cache.set(USER_INFO, res.data.userInfo);
}
return resolve(res);
}).catch(res => {
return reject(res);
})
})
}
}
export default new Routine();

View File

@ -167,7 +167,7 @@
"quickapp" : {},
/* 小程序特有相关 */
"mp-weixin" : {
"appid" : "wx1234567890",
"appid" : "wx3b82801238ca1b57",
"setting" : {
"urlCheck" : false,
"minified" : true,

View File

@ -1,274 +1,290 @@
<!-- #ifdef H5 -->
<template>
<view v-if="bindPhone">
<form @submit="editPwd" report-submit='true'>
<view class="ChangePassword">
<view class="list">
<view class="item">
<input type='number' :placeholder='$t(`请输入手机号`)' placeholder-class='placeholder'
v-model="phone"></input>
</view>
<view class="item acea-row row-between-wrapper">
<input type='number' :placeholder='$t(`填写验证码`)' placeholder-class='placeholder' class="codeIput"
v-model="captcha"></input>
<button class="code font-color" :class="disabled === true ? 'on' : ''" :disabled='disabled'
@click="code">
{{ text }}
</button>
</view>
</view>
<button form-type="submit" class="confirmBnt bg-color">{{$t(`确认绑定`)}}</button>
</view>
</form>
</view>
<view class="lottie-bg" v-else>
<view id="lottie">
</view>
</view>
</template>
<script>
import wechat from "@/libs/wechat";
import sendVerifyCode from "@/mixins/SendVerifyCode";
import {
getUserInfo
} from "@/api/user";
import {
WX_AUTH,
STATE_KEY,
LOGINTYPE,
BACK_URL
} from '@/config/cache';
import {
silenceAuth
} from '@/api/public';
import {
registerVerify,
bindingPhone,
verifyCode
} from '@/api/api.js';
export default {
name: "Auth",
mixins: [sendVerifyCode],
data() {
return {
phone: '',
captcha: '',
key: '',
authKey: '',
scope: '',
bindPhone: false,
};
},
mounted() {
},
onLoad(options) {
let that = this
const {
code,
state,
scope
} = options;
if (scope === 'snsapi_base') {
this.url = options.url || options.back_url || '';
let spread = this.$Cache.get("spread");
let loginType = this.$Cache.get(LOGINTYPE);
// silenceAuth({
// code: options.code || '',
// spread: spread
// }).then(res => {
// if (res.data.key !== undefined) {
// this.bindPhone = true;
// this.authKey = res.data.key;
// } else {
// this.$store.commit("LOGIN", {
// token: res.data.token,
// time: parseInt(res.data.expires_time) - this.$Cache.time()
// });
// this.$Cache.set(WX_AUTH, options.code);
// this.$Cache.clear(STATE_KEY);
// loginType && this.$Cache.clear(LOGINTYPE);
// location.href = decodeURIComponent(
// decodeURIComponent(options.back_url)
// );
// }
// })
} else {
wechat.auth(code, state).then(() => {
location.href = decodeURIComponent(
decodeURIComponent(options.back_url)
);
getUserInfo().then(res => {
that.$store.commit("SETUID", res.data.uid);
});
}).catch(() => {
location.replace("/");
});
}
},
methods: {
editPwd: function() {
let that = this;
if (!that.phone) {
return that.$util.Tips({
title: that.$t(`请输入手机号`)
});
}
if (!(/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.phone))) {
return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
}
if (!that.captcha) {
return that.$util.Tips({
title: that.$t(`填写验证码`)
});
}
bindingPhone({
phone: that.phone,
captcha: that.captcha,
key: that.authKey
}).then(res => {
let time = res.data.expires_time - this.$Cache.time();
this.$store.commit('LOGIN', {
token: res.data.token,
time: time
});
if (this.url && this.url.indexOf('http') !== -1) {
location.href = this.url;
} else {
return that.$util.Tips({
title: this.$t(`绑定成功`),
icon: 'success'
}, {
tab: 4,
url: '/pages/index/index'
});
}
}).catch(err => {
return that.$util.Tips({
title: err
});
})
},
/**
* 发送验证码
*
*/
code() {
let that = this;
if (!that.phone) return that.$util.Tips({
title: that.$t(`请输入手机号`)
});
if (!(/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.phone))) return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
verifyCode().then(res => {
registerVerify(that.phone, 'reset', res.data.key, that.captcha).then(res => {
that.$util.Tips({
title: res.msg
});
that.sendCode();
}).catch(err => {
return that.$util.Tips({
title: err
});
});
});
}
}
};
</script>
<style scoped lang="scss">
page {
background-color: #fff !important;
}
.ChangePassword .phone {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-top: 55rpx;
}
.ChangePassword .list {
width: 580rpx;
margin: 53rpx auto 0 auto;
}
.ChangePassword .list .item {
width: 100%;
height: 110rpx;
border-bottom: 2rpx solid #f0f0f0;
}
.ChangePassword .list .item input {
width: 100%;
height: 100%;
font-size: 32rpx;
}
.ChangePassword .list .item .placeholder {
color: #b9b9bc;
}
.ChangePassword .list .item input.codeIput {
width: 340rpx;
}
.ChangePassword .list .item .code {
font-size: 32rpx;
background-color: #fff;
}
.ChangePassword .list .item .code.on {
color: #b9b9bc !important;
}
.ChangePassword .confirmBnt {
font-size: 32rpx;
width: 580rpx;
height: 90rpx;
border-radius: 45rpx;
color: #fff;
margin: 92rpx auto 0 auto;
text-align: center;
line-height: 90rpx;
}
.lottie-bg {
position: fixed;
left: 0;
top: 0;
background-color: #fff;
width: 100%;
height: 100%;
z-index: 999;
display: flex;
align-items: center;
justify-content: center;
}
#lottie {
display: block;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
transform: translate3d(0, 0, 0);
margin: auto;
image {
width: 200rpx;
height: 200rpx;
}
}
</style>
<!-- #ifdef H5 -->
<template>
<view v-if="bindPhone">
<form @submit="editPwd" report-submit='true'>
<view class="ChangePassword">
<view class="list">
<view class="item">
<input type='number' :placeholder='$t(`请输入手机号`)' placeholder-class='placeholder'
v-model="phone"></input>
</view>
<view class="item acea-row row-between-wrapper">
<input type='number' :placeholder='$t(`填写验证码`)' placeholder-class='placeholder' class="codeIput"
v-model="captcha"></input>
<button class="code font-color" :class="disabled === true ? 'on' : ''" :disabled='disabled'
@click="code">
{{ text }}
</button>
</view>
</view>
<button form-type="submit" class="confirmBnt bg-color">{{$t(`确认绑定`)}}</button>
</view>
</form>
<Verify @success="success" :captchaType="'blockPuzzle'" :imgSize="{ width: '330px', height: '155px' }"
ref="verify"></Verify>
</view>
<view class="lottie-bg" v-else>
<view id="lottie">
</view>
</view>
</template>
<script>
import wechat from "@/libs/wechat";
import sendVerifyCode from "@/mixins/SendVerifyCode";
import {
getUserInfo
} from "@/api/user";
import {
WX_AUTH,
STATE_KEY,
LOGINTYPE,
BACK_URL
} from '@/config/cache';
import {
silenceAuth
} from '@/api/public';
import {
bindingPhone,
verifyCode
} from '@/api/api.js';
import {
registerVerify
} from '@/api/user.js'
import Verify from '@/pages/users/components/verify/verify.vue';
export default {
name: "Auth",
components: {
Verify
},
mixins: [sendVerifyCode],
data() {
return {
phone: '',
captcha: '',
key: '',
authKey: '',
scope: '',
bindPhone: false,
};
},
mounted() {
},
onLoad(options) {
let that = this
const {
code,
state,
scope
} = options;
if (scope === 'snsapi_base') {
this.url = options.url || options.back_url || '';
let spread = this.$Cache.get("spread");
let loginType = this.$Cache.get(LOGINTYPE);
// silenceAuth({
// code: options.code || '',
// spread: spread
// }).then(res => {
// if (res.data.key !== undefined) {
// this.bindPhone = true;
// this.authKey = res.data.key;
// } else {
// this.$store.commit("LOGIN", {
// token: res.data.token,
// time: parseInt(res.data.expires_time) - this.$Cache.time()
// });
// this.$Cache.set(WX_AUTH, options.code);
// this.$Cache.clear(STATE_KEY);
// loginType && this.$Cache.clear(LOGINTYPE);
// location.href = decodeURIComponent(
// decodeURIComponent(options.back_url)
// );
// }
// })
} else {
wechat.auth(code, state).then(() => {
location.href = decodeURIComponent(
decodeURIComponent(options.back_url)
);
getUserInfo().then(res => {
that.$store.commit("SETUID", res.data.uid);
});
}).catch(() => {
location.replace("/");
});
}
},
methods: {
editPwd: function() {
let that = this;
if (!that.phone) {
return that.$util.Tips({
title: that.$t(`请输入手机号`)
});
}
if (!(/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.phone))) {
return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
}
if (!that.captcha) {
return that.$util.Tips({
title: that.$t(`填写验证码`)
});
}
bindingPhone({
phone: that.phone,
captcha: that.captcha,
key: that.authKey
}).then(res => {
let time = res.data.expires_time - this.$Cache.time();
this.$store.commit('LOGIN', {
token: res.data.token,
time: time
});
if (this.url && this.url.indexOf('http') !== -1) {
location.href = this.url;
} else {
return that.$util.Tips({
title: this.$t(`绑定成功`),
icon: 'success'
}, {
tab: 4,
url: '/pages/index/index'
});
}
}).catch(err => {
return that.$util.Tips({
title: err
});
})
},
/**
* 发送验证码
*
*/
code() {
let that = this;
if (!that.phone) return that.$util.Tips({
title: that.$t(`请输入手机号`)
});
if (!(/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.phone))) return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
this.$refs.verify.show()
},
success(data) {
this.$refs.verify.hide()
verifyCode().then(res => {
registerVerify({
phone: that.phone,
type: 'reset',
key: res.data.key,
captchaType: 'blockPuzzle',
captchaVerification: data.captchaVerification
}).then(res => {
that.$util.Tips({
title: res.msg
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
});
},
}
};
</script>
<style scoped lang="scss">
page {
background-color: #fff !important;
}
.ChangePassword .phone {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-top: 55rpx;
}
.ChangePassword .list {
width: 580rpx;
margin: 53rpx auto 0 auto;
}
.ChangePassword .list .item {
width: 100%;
height: 110rpx;
border-bottom: 2rpx solid #f0f0f0;
}
.ChangePassword .list .item input {
width: 100%;
height: 100%;
font-size: 32rpx;
}
.ChangePassword .list .item .placeholder {
color: #b9b9bc;
}
.ChangePassword .list .item input.codeIput {
width: 340rpx;
}
.ChangePassword .list .item .code {
font-size: 32rpx;
background-color: #fff;
}
.ChangePassword .list .item .code.on {
color: #b9b9bc !important;
}
.ChangePassword .confirmBnt {
font-size: 32rpx;
width: 580rpx;
height: 90rpx;
border-radius: 45rpx;
color: #fff;
margin: 92rpx auto 0 auto;
text-align: center;
line-height: 90rpx;
}
.lottie-bg {
position: fixed;
left: 0;
top: 0;
background-color: #fff;
width: 100%;
height: 100%;
z-index: 999;
display: flex;
align-items: center;
justify-content: center;
}
#lottie {
display: block;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
transform: translate3d(0, 0, 0);
margin: auto;
image {
width: 200rpx;
height: 200rpx;
}
}
</style>
<!-- #endif -->

File diff suppressed because it is too large Load Diff

View File

@ -1,75 +1,86 @@
<template>
<view style="touch-action: none;" v-show="!isSortType">
<!-- #ifdef H5 || APP-PLUS -->
<view class="customerService" :style="'top:'+topConfig" @touchmove.stop.prevent="setTouchMove">
<navigator class="pictrue" url="/pages/extension/customer_list/chat" hover-class="none">
<image :src="logoConfig"></image>
</navigator>
</view>
<!-- #endif -->
<!-- #ifdef MP -->
<view class="customerService" :style="'top:'+topConfig" @touchmove.stop.prevent="setTouchMove" v-if="routineContact === '0'">
<navigator class="pictrue" url="/pages/extension/customer_list/chat" hover-class="none">
<image :src="logoConfig"></image>
</navigator>
</view>
<button class="customerService-sty" :style="'top:'+topConfig" @touchmove.stop.prevent="setTouchMove" open-type='contact' v-if="routineContact === '1'">
<image class="pictrue" :src="logoConfig"></image>
</button>
<!-- #endif -->
</view>
</template>
<script>
export default {
name: 'customerService',
props: {
dataConfig: {
type: Object,
default: () => {}
},
isSortType:{
type: String | Number,
default:0
}
},
data() {
return {
routineContact: this.dataConfig.routine_contact_type,
logoConfig: this.dataConfig.logoConfig.url,
topConfig: this.dataConfig.topConfig.val?this.dataConfig.topConfig.val+'%':'30%'
};
},
created() {},
methods: {
setTouchMove(e) {
var that = this;
if (e.touches[0].clientY < 545 && e.touches[0].clientY > 66) {
that.topConfig = e.touches[0].clientY+'px'
}
},
}
}
</script>
<style lang="scss">
.customerService,.customerService-sty {
position: fixed;
right: 20rpx;
z-index: 40;
.pictrue {
width: 86rpx;
height: 86rpx;
border-radius: 50%;
image {
width: 100%;
height: 100%;
}
}
}
.customerService-sty{
background-color: rgba(0,0,0,0) !important;
}
<template>
<view style="touch-action: none;" v-show="!isSortType">
<!-- #ifdef H5 || APP-PLUS -->
<view class="customerService" :style="'top:'+topConfig" @touchmove.stop.prevent="setTouchMove">
<view class="pictrue" @click="goCustomer">
<image :src="logoConfig"></image>
</view>
</view>
<!-- #endif -->
<!-- #ifdef MP -->
<view class="customerService" :style="'top:'+topConfig" @touchmove.stop.prevent="setTouchMove"
v-if="routineContact === '0'">
<view class="pictrue" @click="goCustomer">
<image :src="logoConfig"></image>
</view>
</view>
<button class="customerService-sty" :style="'top:'+topConfig" @touchmove.stop.prevent="setTouchMove"
open-type='contact' v-if="routineContact === '1'">
<image class="pictrue" :src="logoConfig"></image>
</button>
<!-- #endif -->
</view>
</template>
<script>
import {
getCustomer
} from '@/utils/index.js'
export default {
name: 'customerService',
props: {
dataConfig: {
type: Object,
default: () => {}
},
isSortType: {
type: String | Number,
default: 0
}
},
data() {
return {
routineContact: this.dataConfig.routine_contact_type,
logoConfig: this.dataConfig.logoConfig.url,
topConfig: this.dataConfig.topConfig.val ? this.dataConfig.topConfig.val + '%' : '30%'
};
},
created() {},
methods: {
setTouchMove(e) {
var that = this;
if (e.touches[0].clientY < 545 && e.touches[0].clientY > 66) {
that.topConfig = e.touches[0].clientY + 'px'
}
},
goCustomer() {
getCustomer(`/pages/extension/customer_list/chat?productId=${this.ids}`)
},
}
}
</script>
<style lang="scss">
.customerService,
.customerService-sty {
position: fixed;
right: 20rpx;
z-index: 40;
.pictrue {
width: 86rpx;
height: 86rpx;
border-radius: 50%;
image {
width: 100%;
height: 100%;
}
}
}
.customerService-sty {
background-color: rgba(0, 0, 0, 0) !important;
}
</style>

View File

@ -27,13 +27,13 @@
</button>
<!-- #endif -->
<!-- #ifdef MP -->
<button class="bntImg" v-if="userInfo.is_complete == 0" @tap="getUserProfile">
<!-- <button class="bntImg" v-if="userInfo.is_complete == 0" @tap="getUserProfile">
<image class="avatar" src='/static/images/f.png'></image>
<view class="avatarName">{{$t('获取头像')}}</view>
</button>
</button> -->
<!-- #endif -->
<!-- #ifndef APP-PLUS -->
<view v-else class="avatar-box" :class="{on:userInfo.is_money_level}">
<view class="avatar-box" :class="{on:userInfo.is_money_level}">
<image class="avatar" :src='userInfo.avatar' v-if="userInfo.avatar"
@click="goEdit()">
</image>
@ -84,7 +84,8 @@
</view> -->
</view>
<view class="phone" v-if="!userInfo.phone && isLogin" @tap="bindPhone">
{{$t('绑定手机号')}}</view>
{{$t('绑定手机号')}}
</view>
</view>
<view class="message">
<navigator url="/pages/users/user_info/index" hover-class="none">
@ -214,8 +215,8 @@
:duration="duration" indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff">
<block v-for="(item,index) in imgUrls" :key="index">
<swiper-item>
<view @click="goMenuPage(item.url)"
class='slide-navigator acea-row row-between-wrapper' hover-class='none'>
<view @click="goMenuPage(item.url)" class='slide-navigator acea-row row-between-wrapper'
hover-class='none'>
<image :src="item.pic" class="slide-image"></image>
</view>
</swiper-item>
@ -1410,4 +1411,4 @@
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
</style>
</style>

View File

@ -1,317 +1,307 @@
<template>
<view v-if="isUp">
<view class="mobile-bg" @click="close"></view>
<view class="mobile-mask animated" :class="{slideInUp:isUp}">
<view class="input-item">
<input type="text" v-model="account" :placeholder="$t(`输入手机号`)" maxlength="11" />
</view>
<view class="input-item">
<input type="text" v-model="codeNum" :placeholder="$t(`输入验证码`)" maxlength="6" />
<button class="code" :disabled="disabled" @click="code">{{text}}</button>
</view>
<view class="sub_btn" @click="loginBtn">{{$t(`立即登录`)}}</view>
</view>
<Verify @success="success" :captchaType="'blockPuzzle'" :imgSize="{ width: '330px', height: '155px' }"
ref="verify"></Verify>
</view>
</template>
<script>
const app = getApp();
import sendVerifyCode from "@/mixins/SendVerifyCode";
import Routine from '@/libs/routine';
import Verify from './../verify/verify.vue';
import {
loginMobile,
registerVerify,
getCodeApi,
getUserInfo,
phoneSilenceAuth,
phoneWxSilenceAuth
} from "@/api/user";
import {
bindingPhone
} from '@/api/api.js'
export default {
name: 'login_mobile',
components: {
Verify
},
props: {
isUp: {
type: Boolean,
default: false,
},
authKey: {
type: String,
default: '',
}
},
data() {
return {
keyCode: '',
account: '',
codeNum: ''
}
},
mixins: [sendVerifyCode],
mounted() {
this.getCode();
},
methods: {
success(data) {
let that = this;
this.$refs.verify.hide()
getCodeApi().then(res => {
registerVerify({
phone: that.account,
key: res.data.key,
captchaType: 'blockPuzzle',
captchaVerification: data.captchaVerification
}).then(res => {
that.$util.Tips({
title: res.msg
});
that.sendCode();
}).catch(err => {
return that.$util.Tips({
title: err
})
})
})
},
// 获取验证码
code() {
let that = this;
if (!that.account) return that.$util.Tips({
title: that.$t(`请填写手机号码`)
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
this.$refs.verify.show();
},
// 获取验证码api
getCode() {
let that = this
getCodeApi().then(res => {
that.keyCode = res.data.key;
}).catch(res => {
that.$util.Tips({
title: res
});
});
},
close() {
this.$emit('close', false)
},
// 登录
loginBtn() {
let that = this
// #ifdef MP
if (!that.account) return that.$util.Tips({
title: that.$t(`请填写手机号码`)
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
if (!that.codeNum) return that.$util.Tips({
title: that.$t(`请填写验证码`)
});
if (!/^[\w\d]+$/i.test(that.codeNum)) return that.$util.Tips({
title: that.$t(`请输入正确的验证码`)
});
uni.showLoading({
title: that.$t(`正在登录中`)
});
Routine.getCode()
.then(code => {
this.phoneSilenceAuth(code);
})
.catch(error => {
uni.hideLoading();
});
// #endif
// #ifdef H5
if (!that.account) return that.$util.Tips({
title: that.$t(`请填写手机号码`)
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
if (!that.codeNum) return that.$util.Tips({
title: that.$t(`请填写验证码`)
});
if (!/^[\w\d]+$/i.test(that.codeNum)) return that.$util.Tips({
title: that.$t(`请输入正确的验证码`)
});
uni.showLoading({
title: that.$t(`正在登录中`)
});
if (this.authKey) {
phoneWxSilenceAuth({
spid: app.globalData.spid,
spread: app.globalData.code,
phone: this.account,
captcha: this.codeNum,
key: this.authKey
}).then(res => {
let time = res.data.expires_time - this.$Cache.time();
this.$store.commit('LOGIN', {
token: res.data.token,
time: time
});
this.getUserInfo();
}).catch(error => {
uni.hideLoading()
this.$util.Tips({
title: error
})
})
} else {
loginMobile({
phone: this.account,
captcha: this.codeNum,
spread: app.globalData.spid,
}).then(res => {
let time = res.data.expires_time - this.$Cache.time();
this.$store.commit('LOGIN', {
token: res.data.token,
time: time
});
this.$Cache.clear('snsapiKey');
this.getUserInfo();
}).catch(error => {
uni.hideLoading()
this.$util.Tips({
title: error
})
})
}
// #endif
},
// #ifdef MP
phoneSilenceAuth(code) {
let self = this
phoneSilenceAuth({
code: code,
spread_spid: app.globalData.spid,
spread_code: app.globalData.code,
phone: this.account,
captcha: this.codeNum
}).then(res => {
let time = res.data.expires_time - this.$Cache.time();
this.$store.commit('LOGIN', {
token: res.data.token,
time: time
});
this.getUserInfo();
}).catch(error => {
self.$util.Tips({
title: error
})
})
},
// #endif
/**
* 获取个人用户信息
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
uni.hideLoading();
that.userInfo = res.data
that.$store.commit("SETUID", res.data.uid);
that.$store.commit("UPDATE_USERINFO", res.data);
// #ifdef MP
that.$util.Tips({
title: that.$t(`登录成功`),
icon: 'success'
}, {
tab: 3
})
that.close()
// #endif
// #ifdef H5
that.$emit('wechatPhone', true)
// #endif
});
},
}
}
</script>
<style lang="stylus">
.mobile-bg {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
}
.mobile-mask {
z-index: 20;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
padding: 67rpx 30rpx;
background: #fff;
.input-item {
display: flex;
justify-content: space-between;
width: 100%;
height: 86rpx;
margin-bottom: 38rpx;
input {
flex: 1;
display: block;
height: 100%;
padding-left: 40rpx;
border-radius: 43rpx;
border: 1px solid #DCDCDC;
}
.code {
display: flex;
align-items: center;
justify-content: center;
width: 220rpx;
height: 86rpx;
margin-left: 30rpx;
background: var(--view-minorColorT);
font-size: 28rpx;
color: var(--view-theme);
border-radius: 43rpx;
&[disabled] {
background: rgba(0, 0, 0, 0.05);
color: #999;
}
}
}
.sub_btn {
width: 690rpx;
height: 86rpx;
line-height: 86rpx;
margin-top: 60rpx;
background: var(--view-theme);
border-radius: 43rpx;
color: #fff;
font-size: 28rpx;
text-align: center;
}
}
.animated {
animation-duration: .4s
}
<template>
<view v-if="isUp">
<view class="mobile-bg" @click="close"></view>
<view class="mobile-mask animated" :class="{slideInUp:isUp}">
<view class="input-item">
<input type="text" v-model="account" :placeholder="$t(`输入手机号`)" maxlength="11" />
</view>
<view class="input-item">
<input type="text" v-model="codeNum" :placeholder="$t(`输入验证码`)" maxlength="6" />
<button class="code" :disabled="disabled" @click="code">{{text}}</button>
</view>
<view class="sub_btn" @click="loginBtn">{{$t(`立即登录`)}}</view>
</view>
<Verify @success="success" :captchaType="'blockPuzzle'" :imgSize="{ width: '330px', height: '155px' }"
ref="verify"></Verify>
</view>
</template>
<script>
const app = getApp();
import sendVerifyCode from "@/mixins/SendVerifyCode";
import Routine from '@/libs/routine';
import Verify from './../verify/verify.vue';
import Cache from '@/utils/cache';
import {
loginMobile,
registerVerify,
getCodeApi,
getUserInfo,
phoneSilenceAuth,
phoneWxSilenceAuth
} from "@/api/user";
import {
bindingPhone
} from '@/api/api.js'
import {
silenceAuth
} from '@/api/public.js'
export default {
name: 'login_mobile',
components: {
Verify
},
props: {
isUp: {
type: Boolean,
default: false,
},
authKey: {
type: String,
default: '',
}
},
data() {
return {
keyCode: '',
account: '',
codeNum: ''
}
},
mixins: [sendVerifyCode],
mounted() {
this.getCode();
},
methods: {
success(data) {
let that = this;
this.$refs.verify.hide()
getCodeApi().then(res => {
registerVerify({
phone: that.account,
key: res.data.key,
captchaType: 'blockPuzzle',
captchaVerification: data.captchaVerification
}).then(res => {
that.$util.Tips({
title: res.msg
});
that.sendCode();
}).catch(err => {
return that.$util.Tips({
title: err
})
})
})
},
// 获取验证码
code() {
let that = this;
if (!that.account) return that.$util.Tips({
title: that.$t(`请填写手机号码`)
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
this.$refs.verify.show();
},
// 获取验证码api
getCode() {
let that = this
getCodeApi().then(res => {
that.keyCode = res.data.key;
}).catch(res => {
that.$util.Tips({
title: res
});
});
},
close() {
this.$emit('close', false)
},
// 登录
loginBtn() {
let that = this
// #ifdef MP
if (!that.account) return that.$util.Tips({
title: that.$t(`请填写手机号码`)
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
if (!that.codeNum) return that.$util.Tips({
title: that.$t(`请填写验证码`)
});
if (!/^[\w\d]+$/i.test(that.codeNum)) return that.$util.Tips({
title: that.$t(`请输入正确的验证码`)
});
uni.showLoading({
title: that.$t(`正在登录中`)
});
Routine.getCode()
.then(code => {
this.phoneSilenceAuth(code);
})
.catch(error => {
uni.hideLoading();
});
// #endif
// #ifdef H5
if (!that.account) return that.$util.Tips({
title: that.$t(`请填写手机号码`)
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
if (!that.codeNum) return that.$util.Tips({
title: that.$t(`请填写验证码`)
});
if (!/^[\w\d]+$/i.test(that.codeNum)) return that.$util.Tips({
title: that.$t(`请输入正确的验证码`)
});
uni.showLoading({
title: that.$t(`正在登录中`)
});
if (!this.authKey) {
let key = this.$Cache.get('snsapiKey');
this.phoneAuth(key)
} else {
this.phoneAuth(this.authKey)
}
// #endif
},
phoneAuth(key) {
phoneWxSilenceAuth({
spid: app.globalData.spid,
spread: app.globalData.code,
phone: this.account,
captcha: this.codeNum,
key
}).then(res => {
let time = res.data.expires_time - this.$Cache.time();
this.$store.commit('LOGIN', {
token: res.data.token,
time: time
});
this.getUserInfo();
}).catch(error => {
uni.hideLoading()
this.$util.Tips({
title: error
})
})
},
// #ifdef MP
phoneSilenceAuth(code) {
let self = this
phoneSilenceAuth({
code: code,
spread_spid: app.globalData.spid,
spread_code: app.globalData.code,
phone: this.account,
captcha: this.codeNum
}).then(res => {
let time = res.data.expires_time - this.$Cache.time();
this.$store.commit('LOGIN', {
token: res.data.token,
time: time
});
this.getUserInfo();
}).catch(error => {
self.$util.Tips({
title: error
})
})
},
// #endif
/**
* 获取个人用户信息
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
uni.hideLoading();
that.userInfo = res.data
that.$store.commit("SETUID", res.data.uid);
that.$store.commit("UPDATE_USERINFO", res.data);
// #ifdef MP
that.$util.Tips({
title: that.$t(`登录成功`),
icon: 'success'
}, {
tab: 3
})
that.close()
// #endif
// #ifdef H5
that.$emit('wechatPhone', true)
// #endif
});
},
}
}
</script>
<style lang="stylus">
.mobile-bg {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
}
.mobile-mask {
z-index: 20;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
padding: 67rpx 30rpx;
background: #fff;
.input-item {
display: flex;
justify-content: space-between;
width: 100%;
height: 86rpx;
margin-bottom: 38rpx;
input {
flex: 1;
display: block;
height: 100%;
padding-left: 40rpx;
border-radius: 43rpx;
border: 1px solid #DCDCDC;
}
.code {
display: flex;
align-items: center;
justify-content: center;
width: 220rpx;
height: 86rpx;
margin-left: 30rpx;
background: var(--view-minorColorT);
font-size: 28rpx;
color: var(--view-theme);
border-radius: 43rpx;
&[disabled] {
background: rgba(0, 0, 0, 0.05);
color: #999;
}
}
}
.sub_btn {
width: 690rpx;
height: 86rpx;
line-height: 86rpx;
margin-top: 60rpx;
background: var(--view-theme);
border-radius: 43rpx;
color: #fff;
font-size: 28rpx;
text-align: center;
}
}
.animated {
animation-duration: .4s
}
</style>

View File

@ -1,160 +1,173 @@
<template>
<view v-if="isPhoneBox">
<view class="mobile-bg" @click="close"></view>
<view class="mobile-mask animated" :class="{slideInUp:isUp}">
<view class="info-box">
<image :src="logoUrl"></image>
<view class="title">{{$t(`获取授权`)}}</view>
<view class="txt">{{$t(`获取微信的手机号授权`)}}</view>
</view>
<button class="sub_btn" open-type="getPhoneNumber" @getphonenumber="getphonenumber">{{$t(`获取微信手机号`)}}</button>
</view>
</view>
</template>
<script>
const app = getApp();
import Routine from '@/libs/routine';
import {
loginMobile,
registerVerify,
getCodeApi,
getUserInfo
} from "@/api/user";
import { getLogo, silenceAuth, getUserPhone } from '@/api/public';
export default{
name:'routine_phone',
props:{
isPhoneBox:{
type:Boolean,
default:false,
},
logoUrl:{
type:String,
default:'',
},
authKey:{
type:String,
default:'',
}
},
data(){
return {
keyCode:'',
account:'',
codeNum:'',
isStatus:false
}
},
mounted() {
},
methods:{
// #ifdef MP
// 小程序获取手机号码
getphonenumber(e){
uni.showLoading({ title: this.$t(`加载中`) });
Routine.getCode()
.then(code => {
this.getUserPhoneNumber(e.detail.encryptedData, e.detail.iv, code);
})
.catch(error => {
uni.hideLoading();
});
},
// 小程序获取手机号码回调
getUserPhoneNumber(encryptedData, iv, code) {
getUserPhone({
encryptedData: encryptedData,
iv: iv,
code: code,
spread_spid: app.globalData.spid,
spread_code: app.globalData.code,
key:this.authKey
})
.then(res => {
let time = res.data.expires_time - this.$Cache.time();
this.$store.commit('LOGIN', {
token: res.data.token,
time: time
});
this.getUserInfo();
})
.catch(res => {
uni.hideLoading();
});
},
/**
* 获取个人用户信息
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
uni.hideLoading();
that.userInfo = res.data
that.$store.commit("SETUID", res.data.uid);
that.$store.commit("UPDATE_USERINFO", res.data);
that.isStatus = true
this.close()
});
},
// #endif
close(){
this.$emit('close',{isStatus:this.isStatus})
}
}
}
</script>
<style lang="scss">
.mobile-bg{
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.5);
}
.mobile-mask {
z-index: 20;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
padding: 67rpx 30rpx;
background: #fff;
.info-box{
display:flex;
flex-direction: column;
align-items: center;
justify-content: center;
image{
width: 150rpx;
height: 150rpx;
border-radius: 10rpx;
}
.title{
margin-top: 30rpx;
margin-bottom: 20rpx;
font-size: 36rpx;
}
.txt{
font-size: 30rpx;
color: #868686;
}
}
.sub_btn{
width: 690rpx;
height: 86rpx;
line-height: 86rpx;
margin-top: 60rpx;
background: var(--view-theme);
border-radius: 43rpx;
color: #fff;
font-size: 28rpx;
text-align: center;
}
}
.animated{
animation-duration:.4s
}
<template>
<view v-if="isPhoneBox">
<view class="mobile-bg" @click="close"></view>
<view class="mobile-mask animated" :class="{slideInUp:isUp}">
<view class="info-box">
<image :src="logoUrl"></image>
<view class="title">{{$t(`获取授权`)}}</view>
<view class="txt">{{$t(`获取微信的手机号授权`)}}</view>
</view>
<button class="sub_btn" open-type="getPhoneNumber"
@getphonenumber="getphonenumber">{{$t(`获取微信手机号`)}}</button>
</view>
</view>
</template>
<script>
const app = getApp();
import Routine from '@/libs/routine';
import {
loginMobile,
getCodeApi,
getUserInfo
} from "@/api/user";
import {
getLogo,
silenceAuth,
getUserPhone
} from '@/api/public';
export default {
name: 'routine_phone',
props: {
isPhoneBox: {
type: Boolean,
default: false,
},
logoUrl: {
type: String,
default: '',
},
authKey: {
type: String,
default: '',
}
},
data() {
return {
keyCode: '',
account: '',
codeNum: '',
isStatus: false
}
},
mounted() {},
methods: {
// #ifdef MP
// 小程序获取手机号码
getphonenumber(e) {
uni.showLoading({
title: this.$t(`加载中`)
});
Routine.getCode()
.then(code => {
this.getUserPhoneNumber(e.detail.encryptedData, e.detail.iv, code);
})
.catch(error => {
uni.hideLoading();
});
},
// 小程序获取手机号码回调
getUserPhoneNumber(encryptedData, iv, code) {
getUserPhone({
encryptedData: encryptedData,
iv: iv,
code: code,
spread_spid: app.globalData.spid,
spread_code: app.globalData.code,
key: this.authKey
})
.then(res => {
let time = res.data.expires_time - this.$Cache.time();
this.$store.commit('LOGIN', {
token: res.data.token,
time: time
});
this.getUserInfo();
})
.catch(res => {
uni.hideLoading();
});
},
/**
* 获取个人用户信息
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
uni.hideLoading();
that.userInfo = res.data
that.$store.commit("SETUID", res.data.uid);
that.$store.commit("UPDATE_USERINFO", res.data);
that.isStatus = true
this.close()
});
},
// #endif
close() {
this.$emit('close', {
isStatus: this.isStatus
})
}
}
}
</script>
<style lang="scss">
.mobile-bg {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
}
.mobile-mask {
z-index: 20;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
padding: 67rpx 30rpx;
background: #fff;
.info-box {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
image {
width: 150rpx;
height: 150rpx;
border-radius: 10rpx;
}
.title {
margin-top: 30rpx;
margin-bottom: 20rpx;
font-size: 36rpx;
}
.txt {
font-size: 30rpx;
color: #868686;
}
}
.sub_btn {
width: 690rpx;
height: 86rpx;
line-height: 86rpx;
margin-top: 60rpx;
background: var(--view-theme);
border-radius: 43rpx;
color: #fff;
font-size: 28rpx;
text-align: center;
}
}
.animated {
animation-duration: .4s
}
</style>

File diff suppressed because one or more lines are too long

View File

@ -1,8 +1,7 @@
<template>
<view class="login-wrapper" :style="colorStyle">
<view class="shading">
<image :src="logoUrl" v-if="logoUrl" />
<image src="../static/logo2.png" v-else />
<image :src="logoUrl" />
</view>
<view class="whiteBg" v-if="formItem === 1">
<view class="list" v-if="current !== 1">
@ -89,16 +88,14 @@
</checkbox-group>
</view>
</view>
<view class="bottom">
<view class="bottom">
<view class="ver" v-if="copyRight">{{copyRight}}</view>
<view v-else class="ver">© 2014-2022
<a href="https://www.crmeb.com">www.crmeb.com</a>
</view>
</view>
<Verify @success="success" :captchaType="'blockPuzzle'" :imgSize="{ width: '330px', height: '155px' }"
ref="verify"></Verify>
</view>
</template>
<script>
@ -419,6 +416,12 @@
title: '请先阅读并同意协议'
});
}
if (!that.account) return that.$util.Tips({
title: that.$t(`请填写手机号码`)
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: that.$t(`请输入正确的手机号码`)
});
this.$refs.verify.show()
},
async getLogoImage() {
@ -563,7 +566,6 @@
that.$util.Tips({
title: res.msg
});
that.sendCode();
})
.catch(res => {
that.$util.Tips({

View File

@ -34,13 +34,16 @@
<view class='list'>
<view class='item acea-row row-between-wrapper'>
<view>{{$t(`头像`)}}</view>
<view class="avatar-box" @click.stop='uploadpic'>
<view class="avatar-box" v-if="!mp_is_new" @click.stop='uploadpic'>
<image :src="userInfo.avatar"></image>
</view>
<button v-else class="avatar-box" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
<image :src="userInfo.avatar"></image>
</button>
</view>
<view class='item acea-row row-between-wrapper'>
<view>{{$t(`昵称`)}}</view>
<view class='input'><input type='text' name='nickname' :value='userInfo.nickname'></input>
<view class='input'><input type='nickname' name='nickname' :value='userInfo.nickname'></input>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
@ -200,6 +203,7 @@
version: '',
array: [],
setIndex: 0,
mp_is_new: this.$Cache.get('MP_VERSION_ISNEW') || false
};
},
computed: mapGetters(['isLogin']),
@ -369,7 +373,6 @@
'time': this.$Cache.strTotime(res.data.expires_time) - this.$Cache.time()
});
that.getUserInfo();
}).catch(err => {
uni.hideLoading();
return that.$util.Tips({
@ -455,7 +458,18 @@
this.canvasHeight = res.h
});
},
// 微信头像获取
onChooseAvatar(e) {
const {
avatarUrl
} = e.detail
console.log(avatarUrl)
this.$util.uploadImgs('upload/image', avatarUrl, (res) => {
this.userInfo.avatar = res.data.url
}, (err) => {
console.log(err)
})
},
/**
* 提交修改
*/

View File

@ -1,228 +1,247 @@
<template>
<view :style="colorStyle">
<view class="ChangePassword">
<form @submit="editPwd">
<view class="phone">{{$t(`当前手机号`)}}:{{phone}}</view>
<view class="list">
<view class="item">
<input type='password' :placeholder='$t(`设置新密码`)' placeholder-class='placeholder' name="password" :value="password"></input>
</view>
<view class="item">
<input type='password' :placeholder='$t(`确认新密码`)' placeholder-class='placeholder' name="qr_password" :value="qr_password"></input>
</view>
<view class="item acea-row row-between-wrapper">
<input type='number' :placeholder='$t(`填写验证码`)' placeholder-class='placeholder' class="codeIput" name="captcha" :value="captcha"></input>
<button class="code font-num" :class="disabled === true ? 'on' : ''" :disabled='disabled' @click="code">
{{ text }}
</button>
</view>
</view>
<button form-type="submit" class="confirmBnt bg-color">{{$t(`确认修改`)}}</button>
</form>
</view>
<!-- #ifdef MP -->
<!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> -->
<!-- #endif -->
</view>
</template>
<script>
import sendVerifyCode from "@/mixins/SendVerifyCode";
import {
phoneRegisterReset,
registerVerify,
verifyCode
} from '@/api/api.js';
import {
getUserInfo
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import colors from '@/mixins/color.js';
export default {
mixins: [sendVerifyCode,colors],
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
userInfo: {},
phone: '',
password: '',
captcha: '',
qr_password: '',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false ,//是否隐藏授权
key: '',
};
},
computed: mapGetters(['isLogin']),
watch:{
isLogin:{
handler:function(newV,oldV){
if(newV){
this.getUserInfo();
}
},
deep:true
}
},
onLoad() {
if (this.isLogin) {
this.getUserInfo();
verifyCode().then(res=>{
this.$set(this, 'key', res.data.key)
});
} else {
toLogin()
}
},
methods: {
/**
* 授权回调
*/
onLoadFun: function(e) {
this.getUserInfo();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 获取个人用户信息
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
let tel = res.data.phone;
let phone = tel.substr(0, 3) + "****" + tel.substr(7);
that.$set(that, 'userInfo', res.data);
that.phone = phone;
});
},
/**
* 发送验证码
*
*/
async code() {
let that = this;
if (!that.userInfo.phone) return that.$util.Tips({
title: that.$t(`手机号码不存在,无法发送验证码!`)
});
await registerVerify(that.userInfo.phone,'reset', that.key).then(res => {
that.$util.Tips({
title: res.msg
});
that.sendCode();
}).catch(err => {
return that.$util.Tips({
title: err
});
});
},
/**
* H5登录 修改密码
*
*/
editPwd: function(e) {
let that = this,
password = e.detail.value.password,
qr_password = e.detail.value.qr_password,
captcha = e.detail.value.captcha;
if (!password) return that.$util.Tips({
title: that.$t(`请输入新密码`)
});
if (qr_password != password) return that.$util.Tips({
title: that.$t(`两次输入的密码不一致!`)
});
if (!captcha) return that.$util.Tips({
title: that.$t(`请输入验证码`)
});
phoneRegisterReset({
account: that.userInfo.phone,
captcha: captcha,
password: password
}).then(res => {
return that.$util.Tips({
title: res.msg
}, {
tab: 3,
url: 1
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #fff !important;
}
.ChangePassword .phone {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-top: 55rpx;
}
.ChangePassword .list {
width: 580rpx;
margin: 53rpx auto 0 auto;
}
.ChangePassword .list .item {
width: 100%;
height: 110rpx;
border-bottom: 2rpx solid #f0f0f0;
}
.ChangePassword .list .item input {
width: 100%;
height: 100%;
font-size: 32rpx;
}
.ChangePassword .list .item .placeholder {
color: #b9b9bc;
}
.ChangePassword .list .item input.codeIput {
width: 340rpx;
}
.ChangePassword .list .item .code {
font-size: 32rpx;
background-color: #fff;
}
.ChangePassword .list .item .code.on {
color: #b9b9bc !important;
}
.ChangePassword .confirmBnt {
font-size: 32rpx;
width: 580rpx;
height: 90rpx;
border-radius: 45rpx;
color: #fff;
margin: 92rpx auto 0 auto;
text-align: center;
line-height: 90rpx;
}
<template>
<view :style="colorStyle">
<view class="ChangePassword">
<form @submit="editPwd">
<view class="phone">{{$t(`当前手机号`)}}:{{phone}}</view>
<view class="list">
<view class="item">
<input type='password' :placeholder='$t(`设置新密码`)' placeholder-class='placeholder'
name="password" :value="password"></input>
</view>
<view class="item">
<input type='password' :placeholder='$t(`确认新密码`)' placeholder-class='placeholder'
name="qr_password" :value="qr_password"></input>
</view>
<view class="item acea-row row-between-wrapper">
<input type='number' :placeholder='$t(`填写验证码`)' placeholder-class='placeholder' class="codeIput"
name="captcha" :value="captcha"></input>
<button class="code font-num" :class="disabled === true ? 'on' : ''" :disabled='disabled'
@click="code">
{{ text }}
</button>
</view>
</view>
<button form-type="submit" class="confirmBnt bg-color">{{$t(`确认修改`)}}</button>
</form>
</view>
<!-- #ifdef MP -->
<!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> -->
<!-- #endif -->
<Verify @success="success" :captchaType="'blockPuzzle'" :imgSize="{ width: '330px', height: '155px' }"
ref="verify"></Verify>
</view>
</template>
<script>
import sendVerifyCode from "@/mixins/SendVerifyCode";
import {
phoneRegisterReset,
verifyCode
} from '@/api/api.js';
import {
getUserInfo,
registerVerify
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import colors from '@/mixins/color.js';
import Verify from '@/pages/users/components/verify/verify.vue';
export default {
mixins: [sendVerifyCode, colors],
components: {
// #ifdef MP
authorize,
// #endif
Verify
},
data() {
return {
userInfo: {},
phone: '',
password: '',
captcha: '',
qr_password: '',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
key: '',
};
},
computed: mapGetters(['isLogin']),
watch: {
isLogin: {
handler: function(newV, oldV) {
if (newV) {
this.getUserInfo();
}
},
deep: true
}
},
onLoad() {
if (this.isLogin) {
this.getUserInfo();
verifyCode().then(res => {
this.$set(this, 'key', res.data.key)
});
} else {
toLogin()
}
},
methods: {
/**
* 授权回调
*/
onLoadFun: function(e) {
this.getUserInfo();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 获取个人用户信息
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
let tel = res.data.phone;
let phone = tel.substr(0, 3) + "****" + tel.substr(7);
that.$set(that, 'userInfo', res.data);
that.phone = phone;
});
},
/**
* 发送验证码
*
*/
async code() {
let that = this;
if (!that.userInfo.phone) return that.$util.Tips({
title: that.$t(`手机号码不存在,无法发送验证码!`)
});
this.$refs.verify.show()
},
async success(data) {
let that = this;
this.$refs.verify.hide()
console.log(that.userInfo.phone)
await registerVerify({
phone: that.userInfo.phone,
type: 'reset',
key: that.key,
captchaType: 'blockPuzzle',
captchaVerification: data.captchaVerification
}).then(res => {
that.$util.Tips({
title: res.msg
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
},
/**
* H5登录 修改密码
*
*/
editPwd: function(e) {
let that = this,
password = e.detail.value.password,
qr_password = e.detail.value.qr_password,
captcha = e.detail.value.captcha;
if (!password) return that.$util.Tips({
title: that.$t(`请输入新密码`)
});
if (qr_password != password) return that.$util.Tips({
title: that.$t(`两次输入的密码不一致!`)
});
if (!captcha) return that.$util.Tips({
title: that.$t(`请输入验证码`)
});
phoneRegisterReset({
account: that.userInfo.phone,
captcha: captcha,
password: password
}).then(res => {
return that.$util.Tips({
title: res.msg
}, {
tab: 3,
url: 1
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #fff !important;
}
.ChangePassword .phone {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-top: 55rpx;
}
.ChangePassword .list {
width: 580rpx;
margin: 53rpx auto 0 auto;
}
.ChangePassword .list .item {
width: 100%;
height: 110rpx;
border-bottom: 2rpx solid #f0f0f0;
}
.ChangePassword .list .item input {
width: 100%;
height: 100%;
font-size: 32rpx;
}
.ChangePassword .list .item .placeholder {
color: #b9b9bc;
}
.ChangePassword .list .item input.codeIput {
width: 340rpx;
}
.ChangePassword .list .item .code {
font-size: 32rpx;
background-color: #fff;
}
.ChangePassword .list .item .code.on {
color: #b9b9bc !important;
}
.ChangePassword .confirmBnt {
font-size: 32rpx;
width: 580rpx;
height: 90rpx;
border-radius: 45rpx;
color: #fff;
margin: 92rpx auto 0 auto;
text-align: center;
line-height: 90rpx;
}
</style>

View File

@ -1,487 +1,486 @@
<template>
<view :style="colorStyle">
<view class='distribution-posters'>
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :circular="circular" :interval="interval"
:duration="duration" @change="bindchange" previous-margin="40px" next-margin="40px">
<block v-for="(item,index) in spreadData" :key="index" class="img-list">
<swiper-item class="aaa">
<div class="box" ref="bill" :class="swiperIndex == index ? 'active' : 'quiet'">
<view class="user-msg">
<view class="user-code">
<image class="canvas" :style="{height:hg+'px'}" :src="posterImage[index]"
v-if="posterImage[index]"></image>
<canvas class="canvas" :style="{height:hg+'px'}" :canvas-id="'myCanvas'+ index"
v-else></canvas>
</view>
</view>
</div>
<!-- <image :src="item.wap_poster" class="slide-image" :class="swiperIndex == index ? 'active' : 'quiet'" mode='aspectFill' /> -->
</swiper-item>
</block>
</swiper>
<!-- #ifndef H5 -->
<view class='keep bg-color' @click='savePosterPathMp(posterImage[swiperIndex])'>{{$t(`保存海报`)}}</view>
<!-- #endif -->
<!-- #ifndef MP || APP-PLUS -->
<div class="preserve acea-row row-center-wrapper">
<div class="line"></div>
<div class="tip">{{$t(`长按保存图片`)}}</div>
<div class="line"></div>
</div>
<!-- #endif -->
</view>
<!-- #ifdef MP -->
<!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> -->
<!-- #endif -->
<!-- #ifndef MP -->
<home></home>
<!-- #endif -->
<view class="qrimg">
<zb-code ref="qrcode" :show="codeShow" :cid="cid" :val="val" :size="size" :unit="unit"
:background="background" :foreground="foreground" :pdground="pdground" :icon="icon" :iconSize="iconsize"
:onval="onval" :loadMake="loadMake" @result="qrR" />
</view>
</view>
</template>
<script>
import zbCode from '@/components/zb-code/zb-code.vue'
import {
getUserInfo,
spreadBanner,
userShare,
routineCode,
spreadMsg,
imgToBase
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
import {
TOKENNAME,
HTTP_REQUEST_URL
} from '@/config/app.js';
import colors from '@/mixins/color.js';
export default {
components: {
// #ifdef MP
authorize,
// #endif
home,
zbCode
},
mixins:[colors],
data() {
return {
imgUrls: [],
indicatorDots: false,
posterImageStatus: true,
circular: false,
autoplay: false,
interval: 3000,
duration: 500,
swiperIndex: 0,
spreadList: [],
userInfo: {},
poster: '',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
spreadData: [{}], //新海报数据
nickName: "",
siteName: "",
mpUrl: "",
canvasImageUrl: '',
posterImage: [],
//二维码参数
codeShow: false,
cid: '1',
ifShow: true,
val: "", // 要生成的二维码值
size: 200, // 二维码大小
unit: 'upx', // 单位
background: '#FFF', // 背景色
foreground: '#000', // 前景色
pdground: '#000', // 角标色
icon: '', // 二维码图标
iconsize: 40, // 二维码图标大小
lv: 3, // 二维码容错级别 , 一般不用设置,默认就行
onval: true, // val值变化时自动重新生成二维码
loadMake: true, // 组件加载完成后自动生成二维码
src: '', // 二维码生成后的图片地址或base64
codeSrc: "",
wd: 0,
hg: 0,
qrcode: ""
};
},
computed: mapGetters({
'isLogin': 'isLogin',
'userData': 'userInfo',
'uid': 'uid'
}),
watch: {
isLogin: {
handler: function(newV, oldV) {
if (newV) {
this.userSpreadBannerList();
}
},
deep: true
},
userData: {
handler: function(newV, oldV) {
if (newV) {
this.$set(this, 'userInfo', newV);
}
},
deep: true
}
},
async onReady() {
if (this.isLogin) {
this.val = `${HTTP_REQUEST_URL}?spread=${this.uid}`
await this.spreadMsgs()
getUserInfo().then(res=>{
this.userInfo = res.data
})
} else {
toLogin();
}
},
onShow() {
this.$nextTick(() => {
let selector = uni.createSelectorQuery().select('.aaa');
selector.fields({
size: true
}, data => {
this.wd = data.width
this.hg = data.height
}).exec();
})
},
/**
* 用户点击右上角分享
*/
// #ifdef MP
onShareAppMessage() {
return {
title: this.userInfo.nickname + '-' + this.$t(`分销海报`),
imageUrl: this.spreadList[0],
path: '/pages/index/index?spread=' + this.userInfo.uid,
};
},
// #endif
methods: {
onLoadFun: function(e) {
this.$set(this, 'userInfo', e);
this.userSpreadBannerList();
},
qrR(res) {
this.codeSrc = res
},
//获取图片
async spreadMsgs() {
let res = await spreadMsg()
this.spreadData = res.data.spread
this.nickName = res.data.nickname
this.siteName = res.data.site_name
// #ifdef MP
this.qrcode = await this.imgToBase(res.data.qrcode)
// #endif
let codeUrl = "?spread=" + this.userInfo.uid
// #ifdef MP
await this.routineCode()
let mpUrl = await this.downloadFilestoreImage(this.mpUrl)
// #endif
uni.showLoading({
title: this.$t(`海报生成中`),
mask: true
});
// #ifdef H5
if (this.$wechat.isWeixin() && res.data.qrcode) {
this.qrcode = await this.imgToBase(res.data.qrcode)
}
// #endif
for (let i = 0; i < res.data.spread.length; i++) {
let that = this
let arr2, img
// #ifdef MP
arr2 = [mpUrl, await this.downloadFilestoreImage(res.data.spread[i].pic)]
// #endif
// #ifdef H5
img = await this.imgToBase(res.data.spread[i].pic)
arr2 = [this.qrcode || this.codeSrc, img]
// #endif
// #ifdef APP-PLUS
img = await this.downloadFilestoreImage(res.data.spread[i].pic)
arr2 = [this.codeSrc, img]
// #endif
that.$util.userPosterCanvas(arr2, res.data.nickname, res.data.site_name, i, this.wd, this.hg, (
tempFilePath) => {
that.$set(that.posterImage, i, tempFilePath);
// #ifdef MP
if(!that.posterImage.length){
return that.$util.Tips({
title: that.$t(`小程序二维码需要发布正式版后才能获取到`)
});
}
// #endif
});
}
uni.hideLoading();
},
downloadImg() {
uni.saveImageToPhotosAlbum({
filePath: this.posterImage[this.swiperIndex],
success: function() {
}
});
},
async routineCode() {
let res = await routineCode()
this.mpUrl = res.data.url
},
async imgToBase(url) {
let res = await imgToBase({
image: url
})
return res.data.image
},
// 二维码生成
codeImg() {
// http://当前域名+"?spread="+用户uid
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
bindchange(e) {
let spreadList = this.spreadList;
this.swiperIndex = e.detail.current;
// this.$set(this, 'poster', spreadList[e.detail.current].poster);
},
// #ifdef MP
savePosterPathMp(url) {
let that = this;
uni.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
uni.authorize({
scope: 'scope.writePhotosAlbum',
success() {
uni.saveImageToPhotosAlbum({
filePath: url,
success: function(res) {
that.$util.Tips({
title: that.$t(`保存成功`),
icon: 'success'
});
},
fail: function(res) {
that.$util.Tips({
title: that.$t(`保存失败`),
});
}
});
}
});
} else {
uni.saveImageToPhotosAlbum({
filePath: url,
success: function(res) {
that.$util.Tips({
title: that.$t(`保存成功`),
icon: 'success'
});
},
fail: function(res) {
that.$util.Tips({
title: that.$t(`保存失败`),
});
}
});
}
}
});
},
// #endif
// #ifdef APP-PLUS
savePosterPathMp(url) {
let that = this;
uni.saveImageToPhotosAlbum({
filePath: url,
success: function(res) {
that.$util.Tips({
title: that.$t(`保存成功`),
icon: 'success'
});
},
fail: function(res) {
that.$util.Tips({
title: that.$t(`保存失败`),
});
}
});
},
// #endif
//图片转符合安全域名路径
downloadFilestoreImage(url) {
return new Promise((resolve, reject) => {
let that = this;
uni.downloadFile({
url: url,
success: function(res) {
resolve(res.tempFilePath);
},
fail: function() {
return that.$util.Tips({
title: ''
});
}
});
})
},
setShareInfoStatus: function() {
if (this.$wechat.isWeixin()) {
if (this.isLogin) {
getUserInfo().then(res => {
let configAppMessage = {
desc: this.$t(`分销海报`),
title: res.data.nickname + '-' + this.$t(`分销海报`),
link: '/pages/index/index?spread=' + res.data.uid,
imgUrl: this.spreadList[0]
};
this.$wechat.wechatEvevt(["updateAppMessageShareData", "updateTimelineShareData"],
configAppMessage)
});
} else {
toLogin();
}
}
},
userSpreadBannerList: function() {
let that = this;
uni.showLoading({
title: that.$t(`获取中`),
mask: true,
})
spreadBanner().then(res => {
uni.hideLoading();
that.$set(that, 'spreadList', res.data);
that.$set(that, 'poster', res.data[0].poster);
// #ifdef H5
that.setShareInfoStatus();
// #endif
}).catch(err => {
uni.hideLoading();
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #a3a3a3 !important;
}
.canvas {
width: 100%;
// height: 550px;
}
.box {
width: 100%;
height: 100%;
position: relative;
border-radius: 18rpx;
overflow: hidden;
.user-msg {
position: absolute;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
.user-code {
width: 100%;
// height: 100%;
display: flex;
align-items: center;
justify-content: center;
justify-content: space-between;
image {
width: 100%;
}
}
}
}
.img-list {
margin-right: 40px;
}
.distribution-posters swiper {
width: 100%;
height: 1000rpx;
position: relative;
margin-top: 40rpx;
}
.distribution-posters .slide-image {
width: 100%;
height: 100%;
margin: 0 auto;
border-radius: 15rpx;
}
.distribution-posters /deep/.active {
transform: none;
transition: all 0.2s ease-in 0s;
}
.distribution-posters /deep/ .quiet {
transform: scale(0.8333333);
transition: all 0.2s ease-in 0s;
}
.distribution-posters .keep {
font-size: 30rpx;
color: #fff;
width: 600rpx;
height: 80rpx;
border-radius: 50rpx;
text-align: center;
line-height: 80rpx;
margin: 38rpx auto;
}
.distribution-posters .preserve {
color: #fff;
text-align: center;
margin-top: 38rpx;
}
.distribution-posters .preserve .line {
width: 100rpx;
height: 1px;
background-color: #fff;
}
.distribution-posters .preserve .tip {
margin: 0 30rpx;
}
<template>
<view :style="colorStyle">
<view class='distribution-posters'>
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :circular="circular" :interval="interval"
:duration="duration" @change="bindchange" previous-margin="40px" next-margin="40px">
<block v-for="(item,index) in spreadData" :key="index" class="img-list">
<swiper-item class="aaa">
<div class="box" ref="bill" :class="swiperIndex == index ? 'active' : 'quiet'">
<view class="user-msg">
<view class="user-code">
<image class="canvas" :style="{height:hg+'px'}" :src="posterImage[index]"
v-if="posterImage[index]"></image>
<canvas class="canvas" :style="{height:hg+'px'}" :canvas-id="'myCanvas'+ index"
v-else></canvas>
</view>
</view>
</div>
<!-- <image :src="item.wap_poster" class="slide-image" :class="swiperIndex == index ? 'active' : 'quiet'" mode='aspectFill' /> -->
</swiper-item>
</block>
</swiper>
<!-- #ifndef H5 -->
<view class='keep bg-color' @click='savePosterPathMp(posterImage[swiperIndex])'>{{$t(`保存海报`)}}</view>
<!-- #endif -->
<!-- #ifndef MP || APP-PLUS -->
<div class="preserve acea-row row-center-wrapper">
<div class="line"></div>
<div class="tip">{{$t(`长按保存图片`)}}</div>
<div class="line"></div>
</div>
<!-- #endif -->
</view>
<!-- #ifdef MP -->
<!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> -->
<!-- #endif -->
<!-- #ifndef MP -->
<home></home>
<!-- #endif -->
<view class="qrimg">
<zb-code ref="qrcode" :show="codeShow" :cid="cid" :val="val" :size="size" :unit="unit"
:background="background" :foreground="foreground" :pdground="pdground" :icon="icon" :iconSize="iconsize"
:onval="onval" :loadMake="loadMake" @result="qrR" />
</view>
</view>
</template>
<script>
import zbCode from '@/components/zb-code/zb-code.vue'
import {
getUserInfo,
spreadBanner,
userShare,
routineCode,
spreadMsg,
imgToBase
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
import {
TOKENNAME,
HTTP_REQUEST_URL
} from '@/config/app.js';
import colors from '@/mixins/color.js';
export default {
components: {
// #ifdef MP
authorize,
// #endif
home,
zbCode
},
mixins: [colors],
data() {
return {
imgUrls: [],
indicatorDots: false,
posterImageStatus: true,
circular: false,
autoplay: false,
interval: 3000,
duration: 500,
swiperIndex: 0,
spreadList: [],
userInfo: {},
poster: '',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
spreadData: [{}], //新海报数据
nickName: "",
siteName: "",
mpUrl: "",
canvasImageUrl: '',
posterImage: [],
//二维码参数
codeShow: false,
cid: '1',
ifShow: true,
val: "", // 要生成的二维码值
size: 200, // 二维码大小
unit: 'upx', // 单位
background: '#FFF', // 背景色
foreground: '#000', // 前景色
pdground: '#000', // 角标色
icon: '', // 二维码图标
iconsize: 40, // 二维码图标大小
lv: 3, // 二维码容错级别 , 一般不用设置,默认就行
onval: true, // val值变化时自动重新生成二维码
loadMake: true, // 组件加载完成后自动生成二维码
src: '', // 二维码生成后的图片地址或base64
codeSrc: "",
wd: 0,
hg: 0,
qrcode: ""
};
},
computed: mapGetters({
'isLogin': 'isLogin',
'userData': 'userInfo',
'uid': 'uid'
}),
watch: {
isLogin: {
handler: function(newV, oldV) {
if (newV) {
this.userSpreadBannerList();
}
},
deep: true
},
userData: {
handler: function(newV, oldV) {
if (newV) {
this.$set(this, 'userInfo', newV);
}
},
deep: true
}
},
async onReady() {
if (this.isLogin) {
this.val = `${HTTP_REQUEST_URL}?spid=${this.uid}`
await this.spreadMsgs()
getUserInfo().then(res => {
this.userInfo = res.data
})
} else {
toLogin();
}
},
onShow() {
this.$nextTick(() => {
let selector = uni.createSelectorQuery().select('.aaa');
selector.fields({
size: true
}, data => {
this.wd = data.width
this.hg = data.height
}).exec();
})
},
/**
* 用户点击右上角分享
*/
// #ifdef MP
onShareAppMessage() {
return {
title: this.userInfo.nickname + '-' + this.$t(`分销海报`),
imageUrl: this.spreadList[0],
path: '/pages/index/index?spread=' + this.userInfo.uid,
};
},
// #endif
methods: {
onLoadFun: function(e) {
this.$set(this, 'userInfo', e);
this.userSpreadBannerList();
},
qrR(res) {
this.codeSrc = res
},
//获取图片
async spreadMsgs() {
let res = await spreadMsg()
this.spreadData = res.data.spread
this.nickName = res.data.nickname
this.siteName = res.data.site_name
// #ifdef MP
this.qrcode = await this.imgToBase(res.data.qrcode)
// #endif
let codeUrl = "?spread=" + this.userInfo.uid
// #ifdef MP
await this.routineCode()
let mpUrl = await this.downloadFilestoreImage(this.mpUrl)
// #endif
uni.showLoading({
title: this.$t(`海报生成中`),
mask: true
});
// #ifdef H5
if (this.$wechat.isWeixin() && res.data.qrcode) {
this.qrcode = await this.imgToBase(res.data.qrcode)
}
// #endif
for (let i = 0; i < res.data.spread.length; i++) {
let that = this
let arr2, img
// #ifdef MP
arr2 = [mpUrl, await this.downloadFilestoreImage(res.data.spread[i].pic)]
// #endif
// #ifdef H5
img = await this.imgToBase(res.data.spread[i].pic)
arr2 = [this.qrcode || this.codeSrc, img]
// #endif
// #ifdef APP-PLUS
img = await this.downloadFilestoreImage(res.data.spread[i].pic)
arr2 = [this.codeSrc, img]
// #endif
that.$util.userPosterCanvas(arr2, res.data.nickname, res.data.site_name, i, this.wd, this.hg, (
tempFilePath) => {
that.$set(that.posterImage, i, tempFilePath);
// #ifdef MP
if (!that.posterImage.length) {
return that.$util.Tips({
title: that.$t(`小程序二维码需要发布正式版后才能获取到`)
});
}
// #endif
});
}
uni.hideLoading();
},
downloadImg() {
uni.saveImageToPhotosAlbum({
filePath: this.posterImage[this.swiperIndex],
success: function() {}
});
},
async routineCode() {
let res = await routineCode()
this.mpUrl = res.data.url
},
async imgToBase(url) {
let res = await imgToBase({
image: url
})
return res.data.image
},
// 二维码生成
codeImg() {
// http://当前域名+"?spread="+用户uid
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
bindchange(e) {
let spreadList = this.spreadList;
this.swiperIndex = e.detail.current;
// this.$set(this, 'poster', spreadList[e.detail.current].poster);
},
// #ifdef MP
savePosterPathMp(url) {
let that = this;
uni.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
uni.authorize({
scope: 'scope.writePhotosAlbum',
success() {
uni.saveImageToPhotosAlbum({
filePath: url,
success: function(res) {
that.$util.Tips({
title: that.$t(`保存成功`),
icon: 'success'
});
},
fail: function(res) {
that.$util.Tips({
title: that.$t(`保存失败`),
});
}
});
}
});
} else {
uni.saveImageToPhotosAlbum({
filePath: url,
success: function(res) {
that.$util.Tips({
title: that.$t(`保存成功`),
icon: 'success'
});
},
fail: function(res) {
that.$util.Tips({
title: that.$t(`保存失败`),
});
}
});
}
}
});
},
// #endif
// #ifdef APP-PLUS
savePosterPathMp(url) {
let that = this;
uni.saveImageToPhotosAlbum({
filePath: url,
success: function(res) {
that.$util.Tips({
title: that.$t(`保存成功`),
icon: 'success'
});
},
fail: function(res) {
that.$util.Tips({
title: that.$t(`保存失败`),
});
}
});
},
// #endif
//图片转符合安全域名路径
downloadFilestoreImage(url) {
return new Promise((resolve, reject) => {
let that = this;
uni.downloadFile({
url: url,
success: function(res) {
resolve(res.tempFilePath);
},
fail: function() {
return that.$util.Tips({
title: ''
});
}
});
})
},
setShareInfoStatus: function() {
if (this.$wechat.isWeixin()) {
if (this.isLogin) {
getUserInfo().then(res => {
let configAppMessage = {
desc: this.$t(`分销海报`),
title: res.data.nickname + '-' + this.$t(`分销海报`),
link: '/pages/index/index?spread=' + res.data.uid,
imgUrl: this.spreadList[0]
};
this.$wechat.wechatEvevt(["updateAppMessageShareData", "updateTimelineShareData"],
configAppMessage)
});
} else {
toLogin();
}
}
},
userSpreadBannerList: function() {
let that = this;
uni.showLoading({
title: that.$t(`获取中`),
mask: true,
})
spreadBanner().then(res => {
uni.hideLoading();
that.$set(that, 'spreadList', res.data);
that.$set(that, 'poster', res.data[0].poster);
// #ifdef H5
that.setShareInfoStatus();
// #endif
}).catch(err => {
uni.hideLoading();
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #a3a3a3 !important;
}
.canvas {
width: 100%;
// height: 550px;
}
.box {
width: 100%;
height: 100%;
position: relative;
border-radius: 18rpx;
overflow: hidden;
.user-msg {
position: absolute;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
.user-code {
width: 100%;
// height: 100%;
display: flex;
align-items: center;
justify-content: center;
justify-content: space-between;
image {
width: 100%;
}
}
}
}
.img-list {
margin-right: 40px;
}
.distribution-posters swiper {
width: 100%;
height: 1000rpx;
position: relative;
margin-top: 40rpx;
}
.distribution-posters .slide-image {
width: 100%;
height: 100%;
margin: 0 auto;
border-radius: 15rpx;
}
.distribution-posters /deep/.active {
transform: none;
transition: all 0.2s ease-in 0s;
}
.distribution-posters /deep/ .quiet {
transform: scale(0.8333333);
transition: all 0.2s ease-in 0s;
}
.distribution-posters .keep {
font-size: 30rpx;
color: #fff;
width: 600rpx;
height: 80rpx;
border-radius: 50rpx;
text-align: center;
line-height: 80rpx;
margin: 38rpx auto;
}
.distribution-posters .preserve {
color: #fff;
text-align: center;
margin-top: 38rpx;
}
.distribution-posters .preserve .line {
width: 100rpx;
height: 1px;
background-color: #fff;
}
.distribution-posters .preserve .tip {
margin: 0 30rpx;
}
</style>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff