Skip to content

7
7-Eleven
Commit 292a06cc by 谢中龙
Options

提交版本

parent bfe4b315
Showing with 120 additions and 331 deletions
src/ec-canvas/ec-canvas.js deleted 100644 → 0
import WxCanvas from './wx-canvas';
import * as echarts from './echarts';
let ctx;
Component({
properties: {
canvasId: {
type: String,
value: 'ec-canvas'
},
ec: {
type: Object
}
},
data: {
},
ready: function () {
if (!this.data.ec) {
console.warn('组件需绑定 ec 变量，例：<ec-canvas id="mychart-dom-bar" '
+ 'canvas-id="mychart-bar" ec="{{ ec }}"></ec-canvas>');
return;
}
if (!this.data.ec.lazyLoad) {
this.init();
}
},
methods: {
init: function (callback) {
const version = wx.version.version.split('.').map(n => parseInt(n, 10));
const isValid = version[0] > 1 || (version[0] === 1 && version[1] > 9)
|| (version[0] === 1 && version[1] === 9 && version[2] >= 91);
if (!isValid) {
console.error('微信基础库版本过低，需大于等于 1.9.91。'
+ '参见：https://github.com/ecomfe/echarts-for-weixin'
+ '#%E5%BE%AE%E4%BF%A1%E7%89%88%E6%9C%AC%E8%A6%81%E6%B1%82');
return;
}
ctx = wx.createCanvasContext(this.data.canvasId, this);
const canvas = new WxCanvas(ctx, this.data.canvasId);
echarts.setCanvasCreator(() => {
return canvas;
});
var query = wx.createSelectorQuery().in(this);
query.select('.ec-canvas').boundingClientRect(res => {
if (typeof callback === 'function') {
this.chart = callback(canvas, res.width, res.height);
}
else if (this.data.ec && typeof this.data.ec.onInit === 'function') {
this.chart = this.data.ec.onInit(canvas, res.width, res.height);
}
else {
this.triggerEvent('init', {
canvas: canvas,
width: res.width,
height: res.height
});
}
}).exec();
},
canvasToTempFilePath(opt) {
if (!opt.canvasId) {
opt.canvasId = this.data.canvasId;
}
ctx.draw(true, () => {
wx.canvasToTempFilePath(opt, this);
});
},
touchStart(e) {
if (this.chart && e.touches.length > 0) {
var touch = e.touches[0];
var handler = this.chart.getZr().handler;
handler.dispatch('mousedown', {
zrX: touch.x,
zrY: touch.y
});
handler.dispatch('mousemove', {
zrX: touch.x,
zrY: touch.y
});
handler.processGesture(wrapTouch(e), 'start');
}
},
touchMove(e) {
if (this.chart && e.touches.length > 0) {
var touch = e.touches[0];
var handler = this.chart.getZr().handler;
handler.dispatch('mousemove', {
zrX: touch.x,
zrY: touch.y
});
handler.processGesture(wrapTouch(e), 'change');
}
},
touchEnd(e) {
if (this.chart) {
const touch = e.changedTouches ? e.changedTouches[0] : {};
var handler = this.chart.getZr().handler;
handler.dispatch('mouseup', {
zrX: touch.x,
zrY: touch.y
});
handler.dispatch('click', {
zrX: touch.x,
zrY: touch.y
});
handler.processGesture(wrapTouch(e), 'end');
}
}
}
});
function wrapTouch(event) {
for (let i = 0; i < event.touches.length; ++i) {
const touch = event.touches[i];
touch.offsetX = touch.x;
touch.offsetY = touch.y;
}
return event;
}
src/ec-canvas/ec-canvas.json deleted 100644 → 0
{
"component": true,
"usingComponents": {}
}
\ No newline at end of file
src/ec-canvas/ec-canvas.wxml deleted 100644 → 0
<canvas class="ec-canvas" canvas-id="{{ canvasId }}"
bindinit="init"
bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}">
</canvas>
src/ec-canvas/ec-canvas.wxss deleted 100644 → 0
.ec-canvas {
width: 100%;
height: 100%;
}
src/ec-canvas/echarts.js deleted 100644 → 0
This source diff could not be displayed because it is too large. You can view the blob instead.
src/ec-canvas/wx-canvas.js deleted 100644 → 0
export default class WxCanvas {
constructor(ctx, canvasId) {
this.ctx = ctx;
this.canvasId = canvasId;
this.chart = null;
// this._initCanvas(zrender, ctx);
this._initStyle(ctx);
this._initEvent();
}
getContext(contextType) {
if (contextType === '2d') {
return this.ctx;
}
}
// canvasToTempFilePath(opt) {
// if (!opt.canvasId) {
// opt.canvasId = this.canvasId;
// }
// return wx.canvasToTempFilePath(opt, this);
// }
setChart(chart) {
this.chart = chart;
}
attachEvent () {
// noop
}
detachEvent() {
// noop
}
_initCanvas(zrender, ctx) {
zrender.util.getContext = function () {
return ctx;
};
zrender.util.$override('measureText', function (text, font) {
ctx.font = font || '12px sans-serif';
return ctx.measureText(text);
});
}
_initStyle(ctx) {
var styles = ['fillStyle', 'strokeStyle', 'globalAlpha',
'textAlign', 'textBaseAlign', 'shadow', 'lineWidth',
'lineCap', 'lineJoin', 'lineDash', 'miterLimit', 'fontSize'];
styles.forEach(style => {
Object.defineProperty(ctx, style, {
set: value => {
if (style !== 'fillStyle' && style !== 'strokeStyle'
|| value !== 'none' && value !== null
) {
ctx['set' + style.charAt(0).toUpperCase() + style.slice(1)](value);
}
}
});
});
ctx.createRadialGradient = () => {
return ctx.createCircularGradient(arguments);
};
}
_initEvent() {
this.event = {};
const eventNames = [{
wxName: 'touchStart',
ecName: 'mousedown'
}, {
wxName: 'touchMove',
ecName: 'mousemove'
}, {
wxName: 'touchEnd',
ecName: 'mouseup'
}, {
wxName: 'touchEnd',
ecName: 'click'
}];
eventNames.forEach(name => {
this.event[name.wxName] = e => {
const touch = e.touches[0];
this.chart.getZr().handler.dispatch(name.ecName, {
zrX: name.wxName === 'tap' ? touch.clientX : touch.x,
zrY: name.wxName === 'tap' ? touch.clientY : touch.y
});
};
});
}
}
src/shoppingGuid/page/pages/achievement/achievement.js
// shoppingGuid/page/pages/achievement/achievement.js // shoppingGuid/page/pages/achievement/achievement.js
const wxService = require('../../../../utils/wxService'); const wxService = require('../../../../utils/wxService');
const app = getApp(); const app = getApp();
import * as echarts from '../../../../ec-canvas/echarts'; // import wxCharts from '../../../../charts/wxcharts-min.js'
const wxCharts = require('../../../../charts/wxcharts-min.js')
wxService.page({ wxService.page({
...@@ -19,9 +20,7 @@ wxService.page({ ...@@ -19,9 +20,7 @@ wxService.page({
info : {}, info : {},
achievement : {}, achievement : {},
ec: {
lazyLoad: true
}
}, },
//切换 //切换
...@@ -45,7 +44,7 @@ wxService.page({ ...@@ -45,7 +44,7 @@ wxService.page({
* 生命周期函数--监听页面加载 * 生命周期函数--监听页面加载
*/ */
onLoad: function (options) { onLoad: function (options) {
let currentUserInfo = wx.getStorageSync('guidBaseInfo'); let currentUserInfo = wx.getStorageSync('_baseUserInfo');
if (!currentUserInfo) { //未登录成功 if (!currentUserInfo) { //未登录成功
wx.redirectTo({ wx.redirectTo({
url: '/shoppingGuid/page/pages/welcomGuider/welcomGuider', url: '/shoppingGuid/page/pages/welcomGuider/welcomGuider',
...@@ -53,7 +52,7 @@ wxService.page({ ...@@ -53,7 +52,7 @@ wxService.page({
return ; return ;
} }
let userInfo = wx.getStorageSync('guidInfo'); let userInfo = wx.getStorageSync('_userInfo');
if (currentUserInfo.member) { if (currentUserInfo.member) {
if (!currentUserInfo.member.name) { if (!currentUserInfo.member.name) {
currentUserInfo.member.name = userInfo.nickName; currentUserInfo.member.name = userInfo.nickName;
...@@ -65,8 +64,23 @@ wxService.page({ ...@@ -65,8 +64,23 @@ wxService.page({
}); });
//获取导购业绩 //获取导购业绩
this.echartsComponnet = this.selectComponent('#barChart'); // this.echartsComponnet = this.selectComponent('#barChart');
this.getGuidAchievement(); this.getGuidAchievement();
let series = [
{
name: '本月',
color: 'rgba(0,145,255,0.2)',
data: [10, 15, 100],
},
{
name: '累计',
color: 'rgba(0, 145, 255, 1)',
data: [20, 30, 300],
}
];
this.initBarChart(series);
}, },
/** /**
...@@ -77,54 +91,32 @@ wxService.page({ ...@@ -77,54 +91,32 @@ wxService.page({
}, },
//初始化barchart //初始化barchart
initBarChart(series){ initBarChart(series){
this.echartsComponnet.init((canvas, width, height) => { let width = app.globalData.systemInfo.screenWidth - 30;
// 初始化图表 let chart = new wxCharts({
const Chart = echarts.init(canvas, null, { canvasId: 'columnCanvas',
width: width, type: 'column',
height: height animation: true,
}); categories: ['普通会员', '付费会员', '销售额'],
Chart.setOption(this.getOption(series)); series: series,
// 注意这里一定要返回 chart 实例，否则会影响事件处理等 legend : false,
return Chart; yAxis: {
}); format: function (val) {
}, return val;
//获取optiosn
getOption(series){
var option = {
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器，坐标轴触发有效
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}, },
min: 0
}, },
xAxis: { xAxis: {
type: 'category', disableGrid: false,
data: ['普通会员', '付费会员', '销售额'], type: 'calibration'
axisLine: {
lineStyle: {
color: '#dddddd'
}
}, },
axisLabel: { extra: {
color: '#666666' column: {
width: 20
} }
}, },
yAxis: { width: width,
type: 'value', height: 250,
axisLine: { });
lineStyle: {
color: '#dddddd'
}
},
axisLabel: {
color: '#666666'
}
},
series: series
};
return option;
}, },
//获取导购业绩 //获取导购业绩
...@@ -138,20 +130,19 @@ wxService.page({ ...@@ -138,20 +130,19 @@ wxService.page({
}); });
let obj = res.data.data; let obj = res.data.data;
console.log(obj)
let series = [ let series = [
{ {
name: '本月',type: 'bar', color: 'rgba(0,145,255,0.2)', barWidth: '20', name: '本月',
data: [obj.memberRecruitAmountMonth, obj.plusMemberRecruitAmountMonth, obj.achievementMonth] color: 'rgba(0,145,255,0.2)',
data: [obj.memberRecruitAmountMonth, obj.plusMemberRecruitAmountMonth, obj.achievementMonth],
}, },
{ {
name: '累计', name: '累计',
type: 'bar',
barWidth: '20',
color: 'rgba(0, 145, 255, 1)', color: 'rgba(0, 145, 255, 1)',
data: [obj.memberRecruitAmountTotal, obj.plusMemberRecruitAmountTotal, obj.achievementTotal] data: [obj.memberRecruitAmountTotal, obj.plusMemberRecruitAmountTotal, obj.achievementTotal],
}, }
]; ];
this.initBarChart(series); this.initBarChart(series);
}); });
}, },
......
src/shoppingGuid/page/pages/achievement/achievement.json
{ {
"navigationBarTitleText": "业绩", "navigationBarTitleText": "业绩",
"usingComponents": { "usingComponents": {
"tab-bar": "../../../component/tabBar/tabBar", "tab-bar": "../../../component/tabBar/tabBar"
"ec-canvas": "../../../../ec-canvas/ec-canvas"
} }
} }
\ No newline at end of file
src/shoppingGuid/page/pages/achievement/achievement.wxml
...@@ -77,7 +77,7 @@ ...@@ -77,7 +77,7 @@
<view class='chart-con'> <view class='chart-con'>
<view class='title'>会员数据概览</view> <view class='title'>会员数据概览</view>
<view class='chart'> <view class='chart'>
<ec-canvas id="barChart" canvas-id="mychart-bar" ec="{{ ec }}"></ec-canvas> <canvas canvas-id="columnCanvas" disable-scroll="true" class="columnCanvas"></canvas>
</view> </view>
</view> </view>
......
src/shoppingGuid/page/pages/achievement/achievement.wxss
...@@ -225,6 +225,7 @@ view{ ...@@ -225,6 +225,7 @@ view{
padding: 30rpx 20rpx; padding: 30rpx 20rpx;
font-size: 28rpx; font-size: 28rpx;
border-bottom: solid 1px #eeeeee; border-bottom: solid 1px #eeeeee;
margin-bottom: 20rpx;
} }
.chart-con .chart{ .chart-con .chart{
...@@ -243,7 +244,7 @@ view{ ...@@ -243,7 +244,7 @@ view{
box-sizing: border-box; box-sizing: border-box;
} }
.chart ec-canvas{ .chart canvas{
width: 100%; width: 100%;
height: 500rpx; height: 500rpx;
} }
\ No newline at end of file
src/shoppingGuid/page/pages/welcomGuider/welcomGuider.js
...@@ -7,32 +7,85 @@ wxService.page({ ...@@ -7,32 +7,85 @@ wxService.page({
* 页面的初始数据 * 页面的初始数据
*/ */
data: { data: {
code : null,
jsCodeSession : {}
}, },
/** /**
* 生命周期函数--监听页面加载 * 生命周期函数--监听页面加载
*/ */
onLoad: function (options) { onLoad: function (options) {
const currentEnv = wx.getStorageSync('_qyWeChat');
if (currentEnv) {
wx.qy.login({
success: res => {
console.log('企业微信登录获取code---', res.code);
this.setData({
code: res.code
});
this.jscode2session(res.code);
}, },
fail: res => {
console.log('fail -----', res)
}
})
}
else{
//不是在企业微信内打开的 提示信息
wx.showToast({
title: '请在企业微信内打开!',
icon: 'none'
});
}
//授权获取用户信息之后 },
getGuidUserInfo(e){ //获取session_key
console.log(e) jscode2session(code){
let userInfo = e.detail; wxService.post(`/member/qiyeweixin/jscode2session?brandId=${app.globalData.brandId}&code=${code}`).then(r => {
console.log('jscode2session ----',r);
this.setData({
jsCodeSession : r.data.data,
});
})
},
//获取企业微信信息
onTapGetEnterpriseUserInfo(){
const currentEnv = wx.getStorageSync('_qyWeChat'); const currentEnv = wx.getStorageSync('_qyWeChat');
console.log(currentEnv) if(currentEnv){
//判断是在企业微信中登录 wx.qy.getEnterpriseUserInfo({
if (currentEnv) {
wx.qy.login({
success: res => { success: res => {
let code = res.code; console.log('获取企业微信信息为----', res)
this.getGuidUserInfo(res);
},
fail: err => {
console.log('获取企业微信信息失败，失败信息是----', err)
}
})
}
else{
//不是在企业微信内打开的 提示信息
wx.showToast({
title: '请在企业微信内打开!',
icon: 'none'
});
}
},
//授权获取用户信息之后
getGuidUserInfo(userInfo){
//判断是在企业微信中登录
let param = { let param = {
code: code, code: this.data.code,
wechatInfo: userInfo, wechatInfo: userInfo,
brandId: app.globalData.brandId, brandId: app.globalData.brandId,
deviceid: this.data.jsCodeSession.deviceid,
userid: this.data.jsCodeSession.userid,
corpid: this.data.jsCodeSession.corpid,
sessionKey: this.data.jsCodeSession.session_key,
}; };
console.log('调用企业微信登录接口参数----------', param) console.log('调用企业微信登录接口参数----------', param)
wxService.post('/member/qiyeweixin/minaLogin', param).then(r => { wxService.post('/member/qiyeweixin/minaLogin', param).then(r => {
...@@ -45,19 +98,6 @@ wxService.page({ ...@@ -45,19 +98,6 @@ wxService.page({
url: '/shoppingGuid/page/pages/home/home', url: '/shoppingGuid/page/pages/home/home',
}); });
}) })
},
fail: res => {
console.log('fail -----', res)
}
})
}
else {
//不是在企业微信内打开的 提示信息
wx.showToast({
title: '请在企业微信内打开!',
icon: 'none'
});
}
}, },
......
src/shoppingGuid/page/pages/welcomGuider/welcomGuider.wxml
<!--shoppingGuid/page/pages/welcomGuider/welcomGuider.wxml--> <!--shoppingGuid/page/pages/welcomGuider/welcomGuider.wxml-->
<view class='login'> <view class='login'>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/welcom.png' mode='widthFix'></image> <image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/welcom.png' mode='widthFix'></image>
<button type='primary' <!-- <button type='primary'
bindgetuserinfo="getGuidUserInfo" bindgetuserinfo="getGuidUserInfo"
open-type='getUserInfo'> open-type='getUserInfo'>
立即进入</button> 立即进入</button> -->
<button type='primary' bindtap='onTapGetEnterpriseUserInfo'>立即进入</button>
<button class='enter-mall' bindtap='onTapToMall'>进入商城</button> <button class='enter-mall' bindtap='onTapToMall'>进入商城</button>
</view> </view>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment