Commit 3e544636 by 谢中龙

修改海报和完成领券对接

parent ae572dfa
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
// 修改 BRANCH_ID 为对应的商户id // 修改 BRANCH_ID 为对应的商户id
// app.js 中brandId 修改为对应 // app.js 中brandId 修改为对应
const PROJECT_ENV = 'test' // 生产 prod, 开发 dev, 测试 test , 测试门户 test_store, 预生产 pre const PROJECT_ENV = 'prod' // 生产 prod, 开发 dev, 测试 test , 测试门户 test_store, 预生产 pre
//仅生产环境时 配置 : //仅生产环境时 配置 :
//3001 3001 , wx313ec36b710125d4 //3001 3001 , wx313ec36b710125d4
//2006 泰华 , wx40fec8944623c8b3 //2006 泰华 , wx40fec8944623c8b3
...@@ -21,7 +21,7 @@ const PROJECT_ENV = 'test' // 生产 prod, 开发 dev, 测试 test , 测试门 ...@@ -21,7 +21,7 @@ const PROJECT_ENV = 'test' // 生产 prod, 开发 dev, 测试 test , 测试门
//2015 花在花园 //2015 花在花园
//2016 阿吉豆 //2016 阿吉豆
//2017 ACTREE wx2aae34874e88cdf5 //2017 ACTREE wx2aae34874e88cdf5
const BRANCH_ID = 1002 const BRANCH_ID = 3001
const isMall = true const isMall = true
// const needMock = '' // // const needMock = '' //
......
...@@ -2,7 +2,9 @@ ...@@ -2,7 +2,9 @@
// pages/addAddress/addAddress.js // pages/addAddress/addAddress.js
const wxService = require('../../utils/wxService') const wxService = require('../../utils/wxService')
const city = require('../../utils/city') const city = require('../../utils/city')
const { memberId } = wx.getStorageSync('_baseUserInfo') const hotwindCity = require('../../utils/hotwindCity')
const { memberId } = wx.getStorageSync('_baseUserInfo');
const envInfo = require('../../config/index').envInfo;
wxService.page({ wxService.page({
...@@ -64,7 +66,15 @@ wxService.page({ ...@@ -64,7 +66,15 @@ wxService.page({
}, },
init() { init() {
let cityData = city.default; let cityData = [];
//热风地址库特殊处理
if (envInfo.brandId == 2010){
cityData = hotwindCity.default;
}
else{
cityData = city.default;
}
let province = [] let province = []
let cityList = [] let cityList = []
let district = [] let district = []
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
const wxService = require('../../utils/wxService') const wxService = require('../../utils/wxService')
const app = getApp() const app = getApp()
const city = require('../../utils/city') const city = require('../../utils/city')
const hotwindCity = require('../../utils/hotwindCity')
const utils = require('../../utils/util') const utils = require('../../utils/util')
const envInfo = require('../../config/index').envInfo; const envInfo = require('../../config/index').envInfo;
...@@ -383,7 +384,15 @@ wxService.page({ ...@@ -383,7 +384,15 @@ wxService.page({
} }
}, },
initCitys() { initCitys() {
let cityData = city.default; let cityData = [];
//热风地址库特殊处理
if (envInfo.brandId == 2010) {
cityData = hotwindCity.default;
}
else {
cityData = city.default;
}
let province = [] let province = []
let cityList = [] let cityList = []
let district = [] let district = []
......
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
} }
.address-wrap{ .address-wrap{
padding: 0 30rpx; padding: 0 30rpx;
margin-top: 20rpx;
} }
.vip-right { .vip-right {
width: 100rpx; width: 100rpx;
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
}, },
"compileType": "miniprogram", "compileType": "miniprogram",
"libVersion": "2.8.2", "libVersion": "2.8.2",
"appid": "wxac09792264c49b5c", "appid": "wx313ec36b710125d4",
"projectname": "%E5%BE%AE%E5%95%86%E5%9F%8E", "projectname": "%E5%BE%AE%E5%95%86%E5%9F%8E",
"debugOptions": { "debugOptions": {
"hidedInDevtools": [] "hidedInDevtools": []
...@@ -148,7 +148,7 @@ ...@@ -148,7 +148,7 @@
"id": 16, "id": 16,
"name": "商品详情页", "name": "商品详情页",
"pathName": "pages/productDetail/productDetail", "pathName": "pages/productDetail/productDetail",
"query": "id=639868160153096192", "query": "id=634719195157905408",
"scene": null "scene": null
}, },
{ {
......
...@@ -4,9 +4,7 @@ const utils = require('../../../../utils/util') ...@@ -4,9 +4,7 @@ const utils = require('../../../../utils/util')
const envInfo = require('../../../../config/index').envInfo const envInfo = require('../../../../config/index').envInfo
const app = getApp() const app = getApp()
const deviceWidth = app.globalData.systemInfo.windowWidth; const deviceWidth = app.globalData.systemInfo.windowWidth;
console.log(app.globalData.systemInfo)
const isIPX = app.globalData.systemInfo.model == 'iPhone X'; const isIPX = app.globalData.systemInfo.model == 'iPhone X';
console.log(isIPX)
let deviceHeight = app.globalData.systemInfo.windowHeight; let deviceHeight = app.globalData.systemInfo.windowHeight;
const ratio = deviceWidth / deviceHeight; const ratio = deviceWidth / deviceHeight;
// 单位转换 // 单位转换
...@@ -56,6 +54,19 @@ const setTextLine = (ctx, text, lineNum = 1, width = 610) => { ...@@ -56,6 +54,19 @@ const setTextLine = (ctx, text, lineNum = 1, width = 610) => {
return row_arr return row_arr
} }
//获取图片信息
function getImageInfo(url) {
if (url) {
return new Promise((resolve, reject) => {
wx.getImageInfo({
src: url,
success: resolve,
fail: reject,
})
})
}
}
wxService.page({ wxService.page({
/** /**
...@@ -70,16 +81,16 @@ wxService.page({ ...@@ -70,16 +81,16 @@ wxService.page({
productName: '', productName: '',
price: '', price: '',
productId: '', productId: '',
type : '', type: '',
}, },
tempShareLogo: '', tempShareLogo: '',
username: '', username: '',
height: '1100rpx', height: '1100rpx',
canvasTempFileUrl: '', canvasTempFileUrl: '',
btnIsDisabled: true, btnIsDisabled: true,
isInput : false, isInput: false,
inputText : '', inputText: '',
sourceText : '', sourceText: '',
}, },
/** /**
...@@ -89,7 +100,7 @@ wxService.page({ ...@@ -89,7 +100,7 @@ wxService.page({
let shareInfo = options.shareInfo ? JSON.parse(options.shareInfo) : null; let shareInfo = options.shareInfo ? JSON.parse(options.shareInfo) : null;
this.getCurrentUserName(); this.getCurrentUserName();
wx.hideShareMenu(); wx.hideShareMenu();
if (shareInfo){ if (shareInfo) {
this.data.productImg = shareInfo.productImg; this.data.productImg = shareInfo.productImg;
this.data.qrcodeImg = shareInfo.qrcodeImg; this.data.qrcodeImg = shareInfo.qrcodeImg;
this.data.product.productName = shareInfo.productName; this.data.product.productName = shareInfo.productName;
...@@ -108,17 +119,17 @@ wxService.page({ ...@@ -108,17 +119,17 @@ wxService.page({
}, },
//获取登录用户系信息 //获取登录用户系信息
getCurrentUserName(){ getCurrentUserName() {
let userInfo = wx.getStorageSync('_baseUserInfo') ? wx.getStorageSync('_baseUserInfo') : null; let userInfo = wx.getStorageSync('_baseUserInfo') ? wx.getStorageSync('_baseUserInfo') : null;
if (!userInfo){ if (!userInfo) {
this.data.username = '匿名'; this.data.username = '匿名';
} }
else{ else {
this.data.username = userInfo.member.name; this.data.username = userInfo.member.name;
} }
this.setData({ this.setData({
username : this.data.username username: this.data.username
}); });
}, },
//下载商品图 //下载商品图
...@@ -255,152 +266,89 @@ wxService.page({ ...@@ -255,152 +266,89 @@ wxService.page({
//生成canvas //生成canvas
sharePosteCanvas(productSrc, qrcodeUrl, productImgInfo) { sharePosteCanvas(productSrc, qrcodeUrl, productImgInfo) {
const self = this; const self = this;
const ctx = wx.createCanvasContext('myCanvas', this) const ctx = wx.createCanvasContext('myCanvas', this)
// 绘制背景 const canvasWidth = rpx2px(281 * 2)
const canvas_W = rpx2px(deviceWidth * 2) const canvasHeight = rpx2px(500 * 2)
console.log(deviceHeight) // 绘制背景,填充满整个canvas画布
console.log(ratio) ctx.setFillStyle('#fff')
if (ratio < 0.55) { ctx.fillRect(0, 0, canvasWidth, canvasHeight)
self.data.height = '1180rpx';
deviceHeight = 1180;
}
else if (ratio > 0.62) {
deviceHeight = 1200;
self.data.height = '1200rpx';
}
else {
deviceHeight = 1120;
self.data.height = '1120rpx';
}
self.setData({ //商品图片
height: self.data.height const proUrlWidth = rpx2px(240 * 2)
const proUrlHeight = rpx2px(240 * 2)
const proUrlX = rpx2px(15 * 2)
const proUrlY = rpx2px(108 * 2)
ctx.drawImage(productSrc, proUrlX, proUrlY, proUrlWidth, proUrlHeight)
//二维码
const proQrWidth = rpx2px(85 * 2)
const proQrHeight = rpx2px(85 * 2)
const proQrX = rpx2px(175 * 2)
const proQrY = rpx2px(370 * 2)
ctx.drawImage(qrcodeUrl, proQrX, proQrY, proQrWidth, proQrHeight)
ctx.setFillStyle('#999')
ctx.setFontSize(rpx2px(11 * 2))
ctx.fillText('长按识别小程序码', rpx2px(170 * 2), rpx2px(470 * 2))
//顶部显示名称
const nickNameTop = rpx2px(30 * 2)
ctx.setFillStyle('#999') // 昵称
ctx.setFontSize(rpx2px(13 * 2)) // 文字字号
ctx.setTextAlign('left')
ctx.fillText(self.data.username, rpx2px(66 * 2), rpx2px(65 * 2))
ctx.setFillStyle('#000')
ctx.fillText('我发现的精美好物,分享给你哟~', rpx2px(66 * 2), rpx2px(85 * 2))
//商品文字
self.data.product.productName = self.data.product.productName ? self.data.product.productName : '暂无商品名称信息~';
ctx.setTextAlign('left') //
ctx.setFillStyle('#333333') // 文字颜色:黑色
ctx.setFontSize(rpx2px(13 * 2)) // 文字字号
const proNameX = rpx2px(15 * 2)
const proNameFY = rpx2px(427 * 2)
const proCodeX = rpx2px(20 * 2)
const proCodeY = rpx2px(470 * 2)
const proNameMW = rpx2px(240 * 2)
// let proNameShow = self.data.product.productName;
let textArr = setTextLine(ctx, self.data.product.productName, 3, rpx2px(240 * 2));
// ctx.fillText(textArr[0], proNameX, proNameFY, proNameMW)
// console.log(textArr)
textArr.forEach((item, index) => {
ctx.fillText(item, proNameX, proNameFY + rpx2px(18 * 2) * index, proNameMW)
}); });
const canvas_H = rpx2px(deviceHeight) //价格
ctx.setFillStyle('#ffffff') if (self.data.product.price){
//画一个圈 const priceActX = rpx2px(345 * 2)
// ctx.setShadow(0, canvas_H, 20, 'black') ctx.setFillStyle('#cb3c3c') // 文字颜色
ctx.fillRect(0, 0, canvas_W, canvas_H); ctx.setFontSize(rpx2px(15 * 2))
//分享商户logo和 ctx.fillText('¥', rpx2px(15 * 2), priceActX + rpx2px(50 * 2))
let width = '', height = ''; ctx.setFontSize(rpx2px(20 * 2)) // 文字字号
if (productImgInfo.width > deviceWidth) { ctx.setTextAlign('left')
width = deviceWidth; let proActPrice = parseFloat(self.data.product.price / 10 / 10).toFixed(2);
height = parseInt(productImgInfo.height * (deviceWidth / productImgInfo.width)); if (proActPrice && proActPrice.indexOf('-') > 0) {
} proActPrice = proActPrice.substring(0, proActPrice.indexOf('-'))
else {
width = productImgInfo.width;
height = productImgInfo.height;
}
let imageSize = self.getImageSizeByAspectFit(productImgInfo, deviceWidth, height);
//绘制头部部分
// self.data.tempShareLogo
if (self.data.tempShareLogo) {
ctx.drawImage(self.data.tempShareLogo, rpx2px(30), rpx2px(50), rpx2px(100), rpx2px(100));
}
//绘制文案
ctx.setFontSize(16);
ctx.setFillStyle('#000000');
ctx.setTextAlign('left');
ctx.fillText(self.data.shareTitle ? self.data.shareTitle : '小程序分享' , rpx2px(140), rpx2px(90));
//设置分享标题文案
ctx.setFontSize(14);
ctx.setFillStyle('#999999');
ctx.setTextAlign('left');
let shareText = '';
if (this.data.product.type == 'spread'){
ctx.fillText(self.data.username + '给您推荐了一些好东西', rpx2px(140), rpx2px(130));
}
else{
ctx.fillText(self.data.username + '给您分享了一个好东西', rpx2px(140), rpx2px(130));
}
//绘制商品图片
if (productSrc) {
//计算出绘制商品图左右边距
console.log(imageSize.height)
let fiexLeft = parseInt(deviceWidth - width) / 2;
ctx.drawImage(productSrc, rpx2px(30 + fiexLeft * 2), rpx2px(170), imageSize.width - 30, imageSize.height-30);
}
//绘制商品价格 单位是分
if (self.data.product.price) {
let price = parseFloat(self.data.product.price / 10 / 10).toFixed(2);
ctx.setFontSize(12);
ctx.setFillStyle('red');
ctx.setTextAlign('left');
if (!isIPX){
ctx.fillText('¥', rpx2px(30), rpx2px(190 + (deviceWidth - 30) * 2));
} }
else{
ctx.fillText('¥', rpx2px(30), rpx2px(280 + (imageSize.height - 30) * 2));
}
ctx.setFillStyle('red');
ctx.setTextAlign('left');
ctx.font = 'bold 24px sans-serif';
if(!isIPX){
ctx.fillText(price, rpx2px(60), rpx2px(190 + (deviceWidth - 30) * 2));
}
else{
ctx.fillText(price, rpx2px(60), rpx2px(280 + (imageSize.height - 30) * 2));
}
}
else{
ctx.setFillStyle('#333333');
ctx.setTextAlign('left');
ctx.font = 'bold 16px sans-serif';
if (ratio < 0.55) { ctx.fillText(proActPrice, rpx2px(30 * 2), priceActX + rpx2px(50 * 2))
ctx.fillText('推广商品', rpx2px(60), rpx2px(250 + (imageSize.height - 30) * 2)); }
}
else if (ratio > 0.62) {
ctx.fillText('推广商品', rpx2px(60), rpx2px(240 + (imageSize.height - 30) * 2));
}
else {
ctx.fillText('推广商品', rpx2px(60), rpx2px(180 + (imageSize.height - 30) * 2));
}
}
//绘制商品名称
if (self.data.product.productName) {
ctx.setFontSize(15);
ctx.setFillStyle('#333333');
ctx.setTextAlign('left');
let textArr = setTextLine(ctx, self.data.product.productName, 3, 400);
textArr.forEach((item, index) => {
if(!isIPX){
ctx.fillText(item, rpx2px(30), rpx2px(250 + (deviceWidth - 30) * 2) + rpx2px(index * 35));
}
else{
ctx.fillText(item, rpx2px(30), rpx2px(330 + (deviceWidth - 30) * 2) + rpx2px(index * 35));
}
})
}
//绘制二维码
if (qrcodeUrl) {
ctx.setFontSize(12);
ctx.setFillStyle('#999999');
ctx.setTextAlign('left');
if (ratio < 0.55) {
ctx.drawImage(qrcodeUrl, deviceWidth - 100, (imageSize.height - 30) + 125, 80, 80);
ctx.fillText('长按识别小程序', deviceWidth - 100, (imageSize.height -30) + 225);
}
else if (ratio > 0.62) {
ctx.drawImage(qrcodeUrl, deviceWidth - 100, (imageSize.height -30) + 120, 80, 80);
ctx.fillText('长按识别小程序', deviceWidth - 100, (imageSize.height -30) + 220);
}
else {
ctx.drawImage(qrcodeUrl, deviceWidth - 100, (imageSize.height -30) + 120, 80, 80);
ctx.fillText('长按识别小程序', deviceWidth - 100, (imageSize.height -30) + 220);
}
//商户logo
if (self.data.tempShareLogo) {
// const circleX = rpx2px(40 * 2)
// const circleY = rpx2px(55 * 2)
// const circleR = rpx2px(25 * 2)
// const circleSAngle = rpx2px(0 * 2)
// ctx.arc(circleX, circleY, circleR, circleSAngle, Math.PI * 2, false)
// ctx.clip()
const avatarWidth = rpx2px(50 * 2)
const avatarHeight = rpx2px(50 * 2)
const avatarTop = rpx2px(70 * 2)
ctx.drawImage(self.data.tempShareLogo, rpx2px(38 * 2) - avatarWidth / 2, avatarTop - avatarHeight / 2, avatarWidth, avatarHeight)
} }
ctx.draw(false, () => { ctx.stroke()
ctx.draw(false , () => {
wx.canvasToTempFilePath({ wx.canvasToTempFilePath({
canvasId: 'myCanvas', canvasId: 'myCanvas',
quality: 1, quality: 1,
...@@ -412,8 +360,8 @@ wxService.page({ ...@@ -412,8 +360,8 @@ wxService.page({
btnIsDisabled: self.data.btnIsDisabled btnIsDisabled: self.data.btnIsDisabled
}); });
} }
}, self) }, self);
}) });
wx.hideLoading(); wx.hideLoading();
}, },
...@@ -456,45 +404,45 @@ wxService.page({ ...@@ -456,45 +404,45 @@ wxService.page({
}, 1000); }, 1000);
}, },
//编辑文案 //编辑文案
onTapEditShareContent(){ onTapEditShareContent() {
this.data.isInput = true; this.data.isInput = true;
this.setData({ this.setData({
inputText : this.data.product.productName, inputText: this.data.product.productName,
isInput : this.data.isInput isInput: this.data.isInput
}); });
}, },
//输入 //输入
onShareTextInput(e){ onShareTextInput(e) {
let value = e.detail.value; let value = e.detail.value;
this.data.inputText = value; this.data.inputText = value;
}, },
//取消 //取消
onTapCancal(){ onTapCancal() {
this.setData({ this.setData({
isInput : false isInput: false
}); });
}, },
//确认 //确认
onTapSure(){ onTapSure() {
if(!this.data.inputText){ if (!this.data.inputText) {
wx.showToast({ wx.showToast({
title: '请输入分享文案', title: '请输入分享文案',
icon : 'none' icon: 'none'
}); });
return ; return;
} }
this.data.product.productName = this.data.inputText; this.data.product.productName = this.data.inputText;
//重新绘制一下图 //重新绘制一下图
this.setData({ this.setData({
isInput : false isInput: false
},() => { }, () => {
this.downloadProductImg(); this.downloadProductImg();
}); });
}, },
//重置文案 //重置文案
onTapReset(){ onTapReset() {
this.data.product.productName = this.data.sourceText; this.data.product.productName = this.data.sourceText;
//重新绘制一下图 //重新绘制一下图
this.setData({ this.setData({
......
<!--share/share.wxml--> <!--share/share.wxml-->
<view hidden="{{isInput}}"> <view hidden="{{isInput}}" class="canvas-container">
<canvas class='canvas' canvas-id="myCanvas" style="height:{{height}};"></canvas> <canvas class='canvas' canvas-id="myCanvas" style="height:{{height}};"></canvas>
</view> </view>
......
...@@ -11,17 +11,27 @@ view{ ...@@ -11,17 +11,27 @@ view{
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
} }
.canvas{ .canvas-container{
width: 100%; display: flex;
justify-content: center;
padding-top: 20rpx;
}
.canvas-container canvas{
box-shadow: 0 0 8rpx 3rpx rgba(0, 0, 0, 0.1);
} }
.btns-containers{ .btns-containers{
width: 100%; /* width: 100%; */
height: auto; height: auto;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 30rpx 50rpx; /* padding: 30rpx 80rpx; */
width: 562rpx;
margin: auto;
margin-top: 30rpx;
padding-bottom: 30rpx;
} }
.btns-containers .save-btn{ .btns-containers .save-btn{
...@@ -70,7 +80,9 @@ view{ ...@@ -70,7 +80,9 @@ view{
.statistic-img image{ .statistic-img image{
display: block; display: block;
width: 100%; width: 562rpx;
height: 1000rpx;
box-shadow: 0 0 8rpx 6rpx rgba(0, 0, 0, 0.1);
} }
.input-text{ .input-text{
......
This source diff could not be displayed because it is too large. You can view the blob instead.
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