diff --git a/pages/info/activityInfo/index.js b/pages/info/activityInfo/index.js
index dca8a01..0137f04 100644
--- a/pages/info/activityInfo/index.js
+++ b/pages/info/activityInfo/index.js
@@ -7,104 +7,104 @@ Page({
* 页面的初始数据
*/
data: {
- id:null,
- info:null,
- retailId:"",
- shareImg:null,
- showShareFlag:false
+ id: null,
+ info: null,
+ retailId: "",
+ shareImg: null,
+ showShareFlag: false
},
- // 分享
- share:function(){
- if(!wx.getStorageSync("jstrip_token")){
- commonApi.user_post("user/getMyInfo",{}).then(res=>{
+ // 分享
+ share: function () {
+ if (!wx.getStorageSync("jstrip_token")) {
+ commonApi.user_post("user/getMyInfo", {}).then(res => {
})
return;
}
- if(!this.data.shareImg){
+ if (!this.data.shareImg) {
wx.showToast({
title: '图片生成中，稍后再试',
- icon:'none'
+ icon: 'none'
})
return;
}
this.setData({
- showShareFlag:!this.data.showShareFlag
+ showShareFlag: !this.data.showShareFlag
})
},
// 保存
- save(){
- let url = this.data.shareImg,that = this;
+ save() {
+ let url = this.data.shareImg, that = this;
wx.authorize({
/* 这个就是保存相册的 */
scope: 'scope.writePhotosAlbum',
success() {
wx.saveImageToPhotosAlbum({
- filePath:url,
- success(res) {
+ filePath: url,
+ success(res) {
wx.showToast({
title: '保存成功',
- icon:"success"
+ icon: "success"
})
that.setData({
- showShareFlag:!this.data.showShareFlag
+ showShareFlag: !this.data.showShareFlag
})
},
- fail(res){
+ fail(res) {
wx.showToast({
title: '保存失败',
- icon:'none'
+ icon: 'none'
})
}
- })
+ })
},
complete(res) {
- console.log(res);
- /* 这里判断一下如果没有授权重新打开设置选项 */
- wx.getSetting({
- success(res) {
- if (!res.authSetting['scope.writePhotosAlbum']) {
- /* 打开设置的方法 */
- // opensit();
- wx.showToast({
- title: '请打开权限后再试',
- icon:'none'
- })
- }
- }
- });
+ console.log(res);
+ /* 这里判断一下如果没有授权重新打开设置选项 */
+ wx.getSetting({
+ success(res) {
+ if (!res.authSetting['scope.writePhotosAlbum']) {
+ /* 打开设置的方法 */
+ // opensit();
+ wx.showToast({
+ title: '请打开权限后再试',
+ icon: 'none'
+ })
+ }
+ }
+ });
}
- });
-
+ });
+
},
// 绘制海报
- drawImg:function(){
- var that = this,userinfo = wx.getStorageSync('jstrip_userInfo');
- if(!userinfo){
+ drawImg: function () {
+ var that = this, userinfo = wx.getStorageSync('jstrip_userInfo');
+ if (!userinfo) {
// 去登录
return false;
}
const ctx = wx.createCanvasContext('imageCanvas');
// const device = wx.getSystemInfoSync();
// const ratio = device.screenWidth / 750;
-
+
// 先获取到图片信息
- let promise2 = new Promise(function(resolve,reject){
+ let promise2 = new Promise(function (resolve, reject) {
wx.getImageInfo({
- src:that.data.info.post_url,
- success:function(res){
+ src: that.data.info.post_url,
+ success: function (res) {
resolve(res);
},
- fail:function(res){
+ fail: function (res) {
reject(res);
}
})
})
- let promise3 = new Promise(function(resolve,reject){
+ let promise3 = new Promise(function (resolve, reject) {
let userid = wx.getStorageSync('jstrip_userid')
- new QRCode('myQrcode',{
- text: 'https://m.cloud.sz-trip.com/AppointmentDetail?id='+that.data.info.id+'&userId='+userid,
+ new QRCode('myQrcode', {
+ text: 'https://m.cloud.sz-trip.com/AppointmentDetail?id=' + that.data.info.id + '&userId=' + userid + '&channel=-1',
width: 500,
height: 500,
padding: 12, // 生成二维码四周自动留边宽度，不传入默认为0
@@ -115,52 +115,52 @@ Page({
})
})
//成功得到图片信息后，开始绘图
- Promise.all([promise2,promise3]).then(imgs=>{
+ Promise.all([promise2, promise3]).then(imgs => {
ctx.save();
ctx.beginPath(); //开始绘制
- that.handleBorderRect(ctx,0,0,551 * ratio,407 * ratio,25 * ratio,'#ccc')
+ that.handleBorderRect(ctx, 0, 0, 551 * ratio, 407 * ratio, 25 * ratio, '#ccc')
ctx.clip();//画好了圆 剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内 这也是我们要save上下文的原因
- ctx.drawImage(imgs[0].path, 0, 0,551 * ratio,407 * ratio);
+ ctx.drawImage(imgs[0].path, 0, 0, 551 * ratio, 407 * ratio);
ctx.restore();
ctx.save();
- that.handleBorderRect2(ctx,0,407 * ratio,551 * ratio,236*ratio,25 * ratio,'#fff')
+ that.handleBorderRect2(ctx, 0, 407 * ratio, 551 * ratio, 236 * ratio, 25 * ratio, '#fff')
ctx.restore();
// 绘制二维码
- ctx.drawImage(imgs[1].path, 373 * ratio, 495 * ratio,137 * ratio, 137 * ratio);
+ ctx.drawImage(imgs[1].path, 373 * ratio, 495 * ratio, 137 * ratio, 137 * ratio);
// 开始文字绘制
ctx.setFillStyle("#000");
ctx.setFontSize(30 * ratio); //字大小
ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- that.drawText(ctx,that.data.info.title, 25*ratio, 450*ratio,480 * ratio,ratio);
+ that.drawText(ctx, that.data.info.title, 25 * ratio, 450 * ratio, 480 * ratio, ratio);
// 售价
ctx.setFillStyle("#D62828");
ctx.setFontSize(40 * ratio); //字大小
ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- let price = "￥"+(that.data.info.price/100);
+ let price = "￥" + (that.data.info.price / 100);
let width = ctx.measureText(price).width;
- ctx.fillText(price, 25*ratio, 620*ratio);
+ ctx.fillText(price, 25 * ratio, 620 * ratio);
// 副标题
ctx.setFillStyle("#999999");
ctx.setFontSize(28 * ratio); //字大小
ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
let subtitle = that.data.info.subtitle;
- if(that.data.info.subtitle.length>10){
- subtitle = that.data.info.subtitle.substr(0,10)+'...'
+ if (that.data.info.subtitle.length > 10) {
+ subtitle = that.data.info.subtitle.substr(0, 10) + '...'
}
- ctx.fillText(subtitle, 25*ratio, 540*ratio);
+ ctx.fillText(subtitle, 25 * ratio, 540 * ratio);
// ctx.draw();
// 划线价
ctx.setFillStyle("#999999");
ctx.setFontSize(32 * ratio); //字大小
ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- let market_price = "￥"+(that.data.info.market_price/100)
- ctx.fillText(market_price, 40*ratio + width, 620*ratio);
+ let market_price = "￥" + (that.data.info.market_price / 100)
+ ctx.fillText(market_price, 40 * ratio + width, 620 * ratio);
let market_price_width = ctx.measureText(market_price).width;
// 划线
ctx.beginPath()
ctx.setLineWidth(1)
- ctx.moveTo(40*ratio + width, 608*ratio)
- ctx.lineTo(45*ratio + width + market_price_width, 608*ratio)
+ ctx.moveTo(40 * ratio + width, 608 * ratio)
+ ctx.lineTo(45 * ratio + width + market_price_width, 608 * ratio)
ctx.stroke();
// 长按识别二维码
// ctx.setFillStyle("#666");
@@ -172,33 +172,33 @@ Page({
// ctx.setFontSize(24 * ratio); //字大小
// ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
// ctx.fillText("长按图片保存到本地",(592*ratio - ctx.measureText("长按图片保存到本地").width)/2, 740*ratio);
- ctx.draw();
+ ctx.draw();
// 转为图片
- setTimeout(()=>{
+ setTimeout(() => {
wx.canvasToTempFilePath({
x: 0,
y: 0,
canvasId: 'imageCanvas',
success: function (res) {
that.setData({
- shareImg:res.tempFilePath
+ shareImg: res.tempFilePath
})
},
- fail(err){
- console.log('agdgjgdajhg',err)
+ fail(err) {
+ console.log('agdgjgdajhg', err)
}
})
- },500)
+ }, 500)
return false;
- }).catch(err=>{
- console.log("this err",err)
+ }).catch(err => {
+ console.log("this err", err)
})
},
// 圆角矩形
- handleBorderRect(ctx, x, y, w, h, r, color){
+ handleBorderRect(ctx, x, y, w, h, r, color) {
ctx.beginPath();
- ctx.moveTo(x+w,y+h);
- ctx.lineTo(x,y+h)
+ ctx.moveTo(x + w, y + h);
+ ctx.lineTo(x, y + h)
// 左上角
ctx.arc(x + r, y + r, r, Math.PI, 1.5 * Math.PI);
ctx.moveTo(x + r, y);
@@ -206,16 +206,16 @@ Page({
ctx.lineTo(x + w, y + r);
// 右上角
ctx.arc(x + w - r, y + r, r, 1.5 * Math.PI, 2 * Math.PI);
- ctx.lineTo(x + w, y + h );
+ ctx.lineTo(x + w, y + h);
ctx.lineTo(x + w - r, y + h);
ctx.fillStyle = color;
ctx.fill();
ctx.closePath();
},
- handleBorderRect2(ctx, x, y, w, h, r, color){
+ handleBorderRect2(ctx, x, y, w, h, r, color) {
ctx.beginPath();
- ctx.moveTo(x,y);
- ctx.lineTo(x+w,y)
+ ctx.moveTo(x, y);
+ ctx.lineTo(x + w, y)
// 右下角
ctx.arc(x + w - r, y + h - r, r, 0, 0.5 * Math.PI);
ctx.lineTo(x + r, y + h);
@@ -229,8 +229,8 @@ Page({
ctx.closePath();
},
// 绘制两行文字
- drawText: function(ctx, str, x, y, canvasWidth,ratio) {
- let row = [],temp="",chr=str.split("");
+ drawText: function (ctx, str, x, y, canvasWidth, ratio) {
+ let row = [], temp = "", chr = str.split("");
for (var a = 0; a < chr.length; a++) {
if (ctx.measureText(temp).width < canvasWidth) {
temp += chr[a];
@@ -273,57 +273,57 @@ Page({
onLoad: function (options) {
let id = options.id;
this.setData({
- id:id
+ id: id
})
- if(options.retailId){
+ if (options.retailId) {
this.setData({
- retailId:options.retailId
+ retailId: options.retailId
})
}
- commonApi._post("pbservice/Actcalendar/getActDetail",{
- id:id
- }).then(res=>{
+ commonApi._post("pbservice/Actcalendar/getActDetail", {
+ id: id
+ }).then(res => {
this.setData({
- info:res.data
+ info: res.data
})
this.BroswerRecord()
})
},
- BroswerRecord:function(){
- setTimeout(()=>{
- if(app.globalData.uuid){
- commonApi._post('browse/browse_record',{
- type:"page",
- title:this.data.info.name,
- drive:"mini",
- source_id:this.data.info.id,
- url:"/pages/info/activityInfo/index?id="+this.data.info.id,
- uuid:app.globalData.uuid
- }).then(res=>{
+ BroswerRecord: function () {
+ setTimeout(() => {
+ if (app.globalData.uuid) {
+ commonApi._post('browse/browse_record', {
+ type: "page",
+ title: this.data.info.name,
+ drive: "mini",
+ source_id: this.data.info.id,
+ url: "/pages/info/activityInfo/index?id=" + this.data.info.id,
+ uuid: app.globalData.uuid
+ }).then(res => {
})
}
else {
this.BroswerRecord();
}
- },500)
+ }, 500)
},
- order:function(){
+ order: function () {
let skuid = this.data.info.sku_id;
- if(!skuid) return;
- commonApi._post("product/get_sku_detail_by_id",{
- sku_id:skuid
- }).then(res=>{
- if(!res.data){
+ if (!skuid) return;
+ commonApi._post("product/get_sku_detail_by_id", {
+ sku_id: skuid
+ }).then(res => {
+ if (!res.data) {
wx.showToast({
title: '本活动不支持预约',
- icon:'none'
+ icon: 'none'
})
return;
}
app.globalData.couponInfo = null;
app.globalData.product = {
- sku:res.data,
- product:res.data.product
+ sku: res.data,
+ product: res.data.product
}
app.globalData.retailId = this.data.retailId;
wx.navigateTo({
@@ -343,6 +343,17 @@ Page({
* 生命周期函数--监听页面显示
*/
onShow: function () {
+ // if (!wx.getStorageSync('jstrip_token')) {
+ // return;
+ // }
+ // if (this.data.info && this.data.info.id) {
+ // this.drawImg()
+ // }
+ // else {
+ // setTimeout(() => {
+ // this.onShow()
+ // }, 200)
+ // }
},
/**
diff --git a/pages/info/activityInfo/index.wxml b/pages/info/activityInfo/index.wxml
index a46a441..2fb6811 100644
--- a/pages/info/activityInfo/index.wxml
+++ b/pages/info/activityInfo/index.wxml
@@ -1,7 +1,7 @@
-
+
-
+
diff --git a/pages/info/hotelProductInfo/index.js b/pages/info/hotelProductInfo/index.js
index 0ce7f1f..3ce384a 100644
--- a/pages/info/hotelProductInfo/index.js
+++ b/pages/info/hotelProductInfo/index.js
@@ -407,7 +407,7 @@ Page({
let promise3 = new Promise(function (resolve, reject) {
let userid = wx.getStorageSync('jstrip_userid')
new QRCode('myQrcode', {
- text: 'https://m.cloud.sz-trip.com/ScenicDetail?id=' + that.data.sceneInfo.id + '&sharedUserId=' + userid + '&channel=-1',
+ text: 'https://m.cloud.sz-trip.com/HotelDetail?id=' + that.data.sceneInfo.id + '&sharedUserId=' + userid + '&channel=-1',
width: 500,
height: 500,
padding: 12, // 生成二维码四周自动留边宽度，不传入默认为0
diff --git a/pages/info/hotelProductInfo/index.wxml b/pages/info/hotelProductInfo/index.wxml
index 4776f20..a18432d 100644
--- a/pages/info/hotelProductInfo/index.wxml
+++ b/pages/info/hotelProductInfo/index.wxml
@@ -1,6 +1,6 @@
-
+
diff --git a/pages/info/museumInfo/index.js b/pages/info/museumInfo/index.js
index a5221f6..33ef036 100644
--- a/pages/info/museumInfo/index.js
+++ b/pages/info/museumInfo/index.js
@@ -5,6 +5,7 @@ let device = wx.getSystemInfoSync();
const ratio = device.windowWidth / 750;
let rect = wx.getMenuButtonBoundingClientRect();
let height = (rect.top - device.statusBarHeight) * 2 + rect.height + device.statusBarHeight;
+import QRCode from '../../../utils/weapp-qrcode.js'
Page({
/**
@@ -216,7 +217,7 @@ Page({
let promise3 = new Promise(function (resolve, reject) {
let userid = wx.getStorageSync('jstrip_userid')
new QRCode('myQrcode', {
- text: 'https://m.cloud.sz-trip.com/ScenicDetail?id=' + that.data.info.id + '&sharedUserId=' + userid + '&channel=-1',
+ text: 'https://m.cloud.sz-trip.com/PavilionDetail?id=' + that.data.info.id + '&sharedUserId=' + userid + '&channel=-1',
width: 500,
height: 500,
padding: 12, // 生成二维码四周自动留边宽度，不传入默认为0
@@ -248,14 +249,14 @@ Page({
ctx.setFillStyle("#D62828");
ctx.setFontSize(40 * ratio); //字大小
ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- let price = that.data.info.price ? ("￥" + (that.data.info.price / 100)) : '免费';
+ let price = that.data.info.price ? ("￥" + (that.data.info.price / 100)) : '免费';
let width = ctx.measureText(price).width;
ctx.fillText(price, 25 * ratio, 620 * ratio);
// 副标题
ctx.setFillStyle("#999999");
ctx.setFontSize(28 * ratio); //字大小
ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- let subtitle = that.data.info.display_tags[0];
+ let subtitle = that.data.info.product_venue.subtitle;
if (subtitle.length > 10) {
subtitle = subtitle.substr(0, 10) + '...'
}
@@ -429,17 +430,17 @@ Page({
})
}
- // if (!wx.getStorageSync('jstrip_token')) {
- // return;
- // }
- // if (this.data.info && this.data.info.id) {
- // this.drawImg()
- // }
- // else {
- // setTimeout(() => {
- // this.onShow()
- // }, 200)
- // }
+ if (!wx.getStorageSync('jstrip_token')) {
+ return;
+ }
+ if (this.data.info && this.data.info.id) {
+ this.drawImg()
+ }
+ else {
+ setTimeout(() => {
+ this.onShow()
+ }, 200)
+ }
},
/**
diff --git a/pages/info/museumInfo/index.wxml b/pages/info/museumInfo/index.wxml
index 2eb01f0..e7bafd6 100644
--- a/pages/info/museumInfo/index.wxml
+++ b/pages/info/museumInfo/index.wxml
@@ -48,7 +48,6 @@
参观预约
-
diff --git a/pages/info/roadInfo/index.js b/pages/info/roadInfo/index.js
index d926014..258dfe8 100644
--- a/pages/info/roadInfo/index.js
+++ b/pages/info/roadInfo/index.js
@@ -2,6 +2,7 @@
let device = wx.getSystemInfoSync();
const ratio = device.windowWidth / 750;
import commonApi from "../../../utils/https/common"
+import QRCode from '../../../utils/weapp-qrcode.js'
let app = getApp()
Page({
@@ -9,14 +10,16 @@ Page({
* 页面的初始数据
*/
data: {
- fixed:false,
- type:1,
- top:0,
- info:null,
- comment:[],
- commentTotal:0,
- retailId:"",
- retailSkuId:""
+ fixed: false,
+ type: 1,
+ top: 0,
+ info: null,
+ comment: [],
+ commentTotal: 0,
+ retailId: "",
+ retailSkuId: "",
+ shareImg: null,
+ showShareFlag: false
},
/**
@@ -26,140 +29,392 @@ Page({
let rect = wx.getMenuButtonBoundingClientRect();
let height = (rect.top - device.statusBarHeight) * 2 + rect.height + device.statusBarHeight;
this.setData({
- top:height,
- id:options.id
+ top: height,
+ id: options.id
})
- if(options.retailId){
+ if (options.retailId) {
this.setData({
- retailId:options.retailId
+ retailId: options.retailId
})
}
let api = commonApi._post;
- if(wx.getStorageSync("jstrip_token")){
+ if (wx.getStorageSync("jstrip_token")) {
api = commonApi.user_post;
}
- api("product/get_product_detail",{
- id:options.id
- }).then(res=>{
- res.data.display_tags = (res.data.display_tags?res.data.display_tags.split(","):[]).splice(0,2);
- if(options.skuid){
- let sku = res.data.sku.find(item=>item.id==options.skuid);
+ api("product/get_product_detail", {
+ id: options.id
+ }).then(res => {
+ res.data.display_tags = (res.data.display_tags ? res.data.display_tags.split(",") : []).splice(0, 2);
+ if (options.skuid) {
+ let sku = res.data.sku.find(item => item.id == options.skuid);
res.data.sku = [sku];
this.setData({
- retailSkuId:options.skuid
+ retailSkuId: options.skuid
})
}
this.setData({
- info:res.data
+ info: res.data
})
this.BroswerRecord()
})
- commonApi._post("product/product_comment_list",{
- product_id:options.id,
- offset:0,
- limit:3
- }).then(res=>{
- res.data.list.map(item=>{
+ commonApi._post("product/product_comment_list", {
+ product_id: options.id,
+ offset: 0,
+ limit: 3
+ }).then(res => {
+ res.data.list.map(item => {
item.rate = Number(item.rate)
})
this.setData({
- commentTotal:res.data.total,
- comment:res.data.list
+ commentTotal: res.data.total,
+ comment: res.data.list
})
})
},
- BroswerRecord:function(){
- setTimeout(()=>{
- if(app.globalData.uuid){
- commonApi._post('browse/browse_record',{
- type:"goods",
- title:this.data.info.title,
- drive:"mini",
- source_id:this.data.info.id,
- url:"/pages/info/cardInfo/index?id="+this.data.info.id,
- uuid:app.globalData.uuid
- }).then(res=>{
+ BroswerRecord: function () {
+ setTimeout(() => {
+ if (app.globalData.uuid) {
+ commonApi._post('browse/browse_record', {
+ type: "goods",
+ title: this.data.info.title,
+ drive: "mini",
+ source_id: this.data.info.id,
+ url: "/pages/info/cardInfo/index?id=" + this.data.info.id,
+ uuid: app.globalData.uuid
+ }).then(res => {
})
}
else {
this.BroswerRecord();
}
- },500)
+ }, 500)
},
- changeMenu:function(e){
- let index = e.currentTarget.dataset.index,that = this;
- const query=wx.createSelectorQuery(); //创建节点查询器
- query.select("#box"+index).boundingClientRect() //选择toViewid获取位置信息
+ changeMenu: function (e) {
+ let index = e.currentTarget.dataset.index, that = this;
+ const query = wx.createSelectorQuery(); //创建节点查询器
+ query.select("#box" + index).boundingClientRect() //选择toViewid获取位置信息
query.selectViewport().scrollOffset() //获取页面查询位置的
- query.exec(function(res) {
+ query.exec(function (res) {
let scrollTop = res[0].top + res[1].scrollTop - 110 * ratio - that.data.top;
wx.pageScrollTo({
scrollTop: scrollTop + 4,
duration: 0
})
that.setData({
- type:index
+ type: index
})
})
},
- onPageScroll:function(e){
- let that = this,height = this.data.top;
+ onPageScroll: function (e) {
+ let that = this, height = this.data.top;
let topHeight = height;
- wx.createSelectorQuery().select('#menus').boundingClientRect(function(rect){
- console.log(rect.top,topHeight)
- if(rect.top<=topHeight){
+ wx.createSelectorQuery().select('#menus').boundingClientRect(function (rect) {
+ console.log(rect.top, topHeight)
+ if (rect.top <= topHeight) {
// 此时应该把menus固定在顶部
that.setData({
- fixed:true
+ fixed: true
})
}
- else{
+ else {
that.setData({
- fixed:false
+ fixed: false
})
}
// 滚动时判断滚动到哪个部分了
- const query=wx.createSelectorQuery(); //创建节点查询器
+ const query = wx.createSelectorQuery(); //创建节点查询器
query.select("#box1").boundingClientRect() //选择toViewid获取位置信息
query.select("#box2").boundingClientRect() //选择toViewid获取位置信息
query.select("#box3").boundingClientRect() //选择toViewid获取位置信息
query.select("#box4").boundingClientRect() //选择toViewid获取位置信息
- let minHeight = that.data.fixed?(110 * ratio + height): topHeight;
- query.exec(function(res) {
- if(res[3].top {
+
+ })
+ return;
+ }
+ if (!this.data.shareImg) {
+ wx.showToast({
+ title: '图片生成中，稍后再试',
+ icon: 'none'
+ })
+ return;
+ }
+ this.setData({
+ showShareFlag: !this.data.showShareFlag
+ })
+ },
+ // 保存
+ save() {
+ let url = this.data.shareImg, that = this;
+ wx.authorize({
+ /* 这个就是保存相册的 */
+ scope: 'scope.writePhotosAlbum',
+ success() {
+ wx.saveImageToPhotosAlbum({
+ filePath: url,
+ success(res) {
+ wx.showToast({
+ title: '保存成功',
+ icon: "success"
+ })
+ that.setData({
+ showShareFlag: !this.data.showShareFlag
+ })
+ },
+ fail(res) {
+ wx.showToast({
+ title: '保存失败',
+ icon: 'none'
+ })
+ }
+ })
+ },
+ complete(res) {
+ console.log(res);
+ /* 这里判断一下如果没有授权重新打开设置选项 */
+ wx.getSetting({
+ success(res) {
+ if (!res.authSetting['scope.writePhotosAlbum']) {
+ /* 打开设置的方法 */
+ // opensit();
+ wx.showToast({
+ title: '请打开权限后再试',
+ icon: 'none'
+ })
+ }
+ }
+ });
+ }
+ });
+
+ },
+ // 绘制海报
+ drawImg: function () {
+ var that = this, userinfo = wx.getStorageSync('jstrip_userInfo');
+ if (!userinfo) {
+ // 去登录
+ return false;
+ }
+ const ctx = wx.createCanvasContext('imageCanvas');
+ // const device = wx.getSystemInfoSync();
+ // const ratio = device.screenWidth / 750;
+ // 先获取到图片信息
+ let promise2 = new Promise(function (resolve, reject) {
+ wx.getImageInfo({
+ src: that.data.info.headimg,
+ success: function (res) {
+ resolve(res);
+ },
+ fail: function (res) {
+ reject(res);
+ }
+ })
+ })
+ let promise3 = new Promise(function (resolve, reject) {
+ let userid = wx.getStorageSync('jstrip_userid')
+ new QRCode('myQrcode', {
+ text: 'https://m.cloud.sz-trip.com/LineDetail?id=' + that.data.info.id + '&sharedUserId=' + userid + '&channel=-1',
+ width: 500,
+ height: 500,
+ padding: 12, // 生成二维码四周自动留边宽度，不传入默认为0
+ correctLevel: QRCode.CorrectLevel.H, // 二维码可辨识度
+ callback: (res) => {
+ resolve(res);
+ }
+ })
+ })
+ //成功得到图片信息后，开始绘图
+ Promise.all([promise2, promise3]).then(imgs => {
+ ctx.save();
+ ctx.beginPath(); //开始绘制
+ that.handleBorderRect(ctx, 0, 0, 551 * ratio, 407 * ratio, 25 * ratio, '#ccc')
+ ctx.clip();//画好了圆 剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内 这也是我们要save上下文的原因
+ ctx.drawImage(imgs[0].path, 0, 0, 551 * ratio, 407 * ratio);
+ ctx.restore();
+ ctx.save();
+ that.handleBorderRect2(ctx, 0, 407 * ratio, 551 * ratio, 236 * ratio, 25 * ratio, '#fff')
+ ctx.restore();
+ // 绘制二维码
+ ctx.drawImage(imgs[1].path, 373 * ratio, 495 * ratio, 137 * ratio, 137 * ratio);
+ // 开始文字绘制
+ ctx.setFillStyle("#000");
+ ctx.setFontSize(30 * ratio); //字大小
+ ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ that.drawText(ctx, that.data.info.title, 25 * ratio, 450 * ratio, 480 * ratio, ratio);
+ // 售价
+ ctx.setFillStyle("#D62828");
+ ctx.setFontSize(40 * ratio); //字大小
+ ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ let price = that.data.info.price ? ("￥" + (that.data.info.price / 100)) : '免费';
+ let width = ctx.measureText(price).width;
+ ctx.fillText(price, 25 * ratio, 620 * ratio);
+ // 副标题
+ ctx.setFillStyle("#999999");
+ ctx.setFontSize(28 * ratio); //字大小
+ ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ let subtitle = that.data.info.display_tags[0];
+ if (subtitle.length > 10) {
+ subtitle = subtitle.substr(0, 10) + '...'
+ }
+ ctx.fillText(subtitle, 25 * ratio, 540 * ratio);
+ // ctx.draw();
+ // 划线价
+ // ctx.setFillStyle("#999999");
+ // ctx.setFontSize(32 * ratio); //字大小
+ // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ // let market_price = "￥" + (Number(that.data.info.market_price) / 100)
+ // ctx.fillText(market_price, 40 * ratio + width, 620 * ratio);
+ // let market_price_width = ctx.measureText(market_price).width;
+ // 划线
+ // ctx.beginPath()
+ // ctx.setLineWidth(1)
+ // ctx.moveTo(40 * ratio + width, 608 * ratio)
+ // ctx.lineTo(45 * ratio + width + market_price_width, 608 * ratio)
+ // ctx.stroke();
+ // 长按识别二维码
+ // ctx.setFillStyle("#666");
+ // ctx.setFontSize(22 * ratio); //字大小
+ // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ // ctx.fillText("长按识别二维码", 404*ratio, 710*ratio);
+ // 长按图片转发或保存
+ // ctx.setFillStyle("#000");
+ // ctx.setFontSize(24 * ratio); //字大小
+ // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ // ctx.fillText("长按图片保存到本地",(592*ratio - ctx.measureText("长按图片保存到本地").width)/2, 740*ratio);
+ ctx.draw();
+ // 转为图片
+ setTimeout(() => {
+ wx.canvasToTempFilePath({
+ x: 0,
+ y: 0,
+ canvasId: 'imageCanvas',
+ success: function (res) {
+ that.setData({
+ shareImg: res.tempFilePath
+ })
+ },
+ fail(err) {
+ console.log('agdgjgdajhg', err)
+ }
+ })
+ }, 500)
+ return false;
+ }).catch(err => {
+ console.log("this err", err)
})
},
+ // 圆角矩形
+ handleBorderRect(ctx, x, y, w, h, r, color) {
+ ctx.beginPath();
+ ctx.moveTo(x + w, y + h);
+ ctx.lineTo(x, y + h)
+ // 左上角
+ ctx.arc(x + r, y + r, r, Math.PI, 1.5 * Math.PI);
+ ctx.moveTo(x + r, y);
+ ctx.lineTo(x + w - r, y);
+ ctx.lineTo(x + w, y + r);
+ // 右上角
+ ctx.arc(x + w - r, y + r, r, 1.5 * Math.PI, 2 * Math.PI);
+ ctx.lineTo(x + w, y + h);
+ ctx.lineTo(x + w - r, y + h);
+ ctx.fillStyle = color;
+ ctx.fill();
+ ctx.closePath();
+ },
+ handleBorderRect2(ctx, x, y, w, h, r, color) {
+ ctx.beginPath();
+ ctx.moveTo(x, y);
+ ctx.lineTo(x + w, y)
+ // 右下角
+ ctx.arc(x + w - r, y + h - r, r, 0, 0.5 * Math.PI);
+ ctx.lineTo(x + r, y + h);
+ ctx.lineTo(x, y + h - r);
+ // 左下角
+ ctx.arc(x + r, y + h - r, r, 0.5 * Math.PI, Math.PI);
+ ctx.lineTo(x, y);
+ ctx.lineTo(x, y);
+ ctx.fillStyle = color;
+ ctx.fill();
+ ctx.closePath();
+ },
+ // 绘制两行文字
+ drawText: function (ctx, str, x, y, canvasWidth, ratio) {
+ let row = [], temp = "", chr = str.split("");
+ for (var a = 0; a < chr.length; a++) {
+ if (ctx.measureText(temp).width < canvasWidth) {
+ temp += chr[a];
+ }
+ else {
+ a--; //这里添加了a-- 是为了防止字符丢失，效果图中有对比
+ row.push(temp);
+ temp = "";
+ }
+ }
+ row.push(temp);
+
+ //如果数组长度大于2 则截取前两个
+ if (row.length > 2) {
+ var rowCut = row.slice(0, 2);
+ var rowPart = rowCut[1];
+ var test = "";
+ var empty = [];
+ for (var a = 0; a < rowPart.length; a++) {
+ if (ctx.measureText(test).width < canvasWidth - 30 * ratio) {
+ test += rowPart[a];
+ }
+ else {
+ break;
+ }
+ }
+ empty.push(test);
+ var group = empty[0] + "..."//这里只显示两行，超出的用...表示
+ rowCut.splice(1, 1, group);
+ row = rowCut;
+ }
+ for (var b = 0; b < row.length; b++) {
+ ctx.fillText(row[b], x, y + b * 40 * ratio, canvasWidth);
+ }
+ },
/**
* 生命周期函数--监听页面初次渲染完成
@@ -172,7 +427,17 @@ Page({
* 生命周期函数--监听页面显示
*/
onShow: function () {
-
+ if (!wx.getStorageSync('jstrip_token')) {
+ return;
+ }
+ if (this.data.info && this.data.info.id) {
+ this.drawImg()
+ }
+ else {
+ setTimeout(() => {
+ this.onShow()
+ }, 200)
+ }
},
/**
diff --git a/pages/info/roadInfo/index.wxml b/pages/info/roadInfo/index.wxml
index 24b011d..b28f7ae 100644
--- a/pages/info/roadInfo/index.wxml
+++ b/pages/info/roadInfo/index.wxml
@@ -1,6 +1,7 @@
+
@@ -90,4 +91,30 @@
客服
立即预订
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 保存图片到相册
+
+
+
+
+
+ 微信识别二维码
+
+
+
+ 保存到相册
+
\ No newline at end of file
diff --git a/pages/info/roadInfo/index.wxss b/pages/info/roadInfo/index.wxss
index 9f3581f..96f30f8 100644
--- a/pages/info/roadInfo/index.wxss
+++ b/pages/info/roadInfo/index.wxss
@@ -359,4 +359,81 @@ page {
background: #D62828;
border-radius: 39rpx;
text-align: center;
+}
+
+.mask-content {
+ position: absolute;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ width: 100%;
+}
+.mask-content .icon-close {
+ position: absolute;
+ right: 40rpx;
+ top: 40rpx;
+}
+
+.share-img-box {
+ /* width: 551rpx; */
+ position: static;
+ background: none;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+.share-img {
+ display: block;
+ width: 551rpx;
+}
+.share-tips {
+ width: 426rpx;
+ height: 150rpx;
+ background: #FFFFFF;
+ border-radius: 25rpx;
+ margin-top: 25rpx;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 65rpx;
+ color: #999;
+ font-size: 24rpx;
+ text-align: center;
+ line-height: 40rpx;
+}
+.share-tips .img {
+ display: block;
+ width: 55rpx;
+ margin: 0 auto;
+ margin-bottom: 4rpx;
+}
+.tipimg {
+ position: absolute;
+ left: 50%;
+ margin-left: 16rpx;
+ width: 24rpx;
+ height: 24rpx;
+ background: #D62828;
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ top: 34rpx;
+}
+.tipimg image {
+ width: 21rpx;
+ display: block;
+
+}
+.save-btn {
+ width: 403rpx;
+ line-height: 77rpx;
+ background: #D62828;
+ border-radius: 39rpx;
+ text-align: center;
+ color: #fff;
+ font-size: 31rpx;
+ font-weight: 500;
+ margin-top: 50rpx;
}
\ No newline at end of file
diff --git a/pages/info/sceneProductInfo/index.js b/pages/info/sceneProductInfo/index.js
index d0965ad..37af081 100644
--- a/pages/info/sceneProductInfo/index.js
+++ b/pages/info/sceneProductInfo/index.js
@@ -11,185 +11,185 @@ Page({
* 页面的初始数据
*/
data: {
- info:null,
- bookingInfo:null,
- bookingInfoTitle:"",
- safeBottom:app.globalData.safeBottom,
- isLike:0,
- comment:[],
- commentTotal:0,
- isTest:true,
- retailId:"",
- shareImg:null,
- showShareFlag:false
+ info: null,
+ bookingInfo: null,
+ bookingInfoTitle: "",
+ safeBottom: app.globalData.safeBottom,
+ isLike: 0,
+ comment: [],
+ commentTotal: 0,
+ isTest: true,
+ retailId: "",
+ shareImg: null,
+ showShareFlag: false
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
- if(!options.id){
+ if (!options.id) {
util.back()
return;
}
- if(options.retailId){
+ if (options.retailId) {
this.setData({
- retailId:options.retailId
+ retailId: options.retailId
})
}
- commonApi._post("pbservice/Other/getClientConfig",{
- unique_key:"wechatxcx"
- }).then(res=>{
+ commonApi._post("pbservice/Other/getClientConfig", {
+ unique_key: "wechatxcx"
+ }).then(res => {
let data = JSON.parse(res.data);
this.setData({
- isTest:data.isTest
+ isTest: data.isTest
})
})
this.setData({
- id:options.id
+ id: options.id
})
- commonApi._post("scene/detail",{
- id:options.id
- }).then(res=>{
- if(!res.data){
+ commonApi._post("scene/detail", {
+ id: options.id
+ }).then(res => {
+ if (!res.data) {
wx.showToast({
title: '产品已下架',
- icon:'none'
+ icon: 'none'
})
- setTimeout(()=>{
+ setTimeout(() => {
util.back();
- },1000)
+ }, 1000)
return;
}
- res.data.display_tags = (res.data.display_tags?res.data.display_tags.split(","):[]).splice(0,2);
+ res.data.display_tags = (res.data.display_tags ? res.data.display_tags.split(",") : []).splice(0, 2);
// 如果是带有指定good_id的 那么取指定的
- if(options.gid){
- let pItem = res.data.product.find(item=>item.id==options.gid);
- if(pItem){
+ if (options.gid) {
+ let pItem = res.data.product.find(item => item.id == options.gid);
+ if (pItem) {
res.data.product = [pItem];
}
}
// 如果带有指定skuid的话 那么取指定的sku展示
- if(options.skuid){
+ if (options.skuid) {
let pItem = null;
- for(let i = 0;i{
- product.sku.map(sku=>{
- sku.display_tags = (sku.display_tags?sku.display_tags.split(","):[]).splice(0,2);
+ res.data.product.map(product => {
+ product.sku.map(sku => {
+ sku.display_tags = (sku.display_tags ? sku.display_tags.split(",") : []).splice(0, 2);
})
})
this.setData({
- info:res.data
+ info: res.data
})
this.BroswerRecord()
})
// 获取收藏的状态
- if(wx.getStorageSync("jstrip_token")){
- commonApi.user_post("scene/is_scene_collection",{
- scene_id:options.id
- }).then(res=>{
+ if (wx.getStorageSync("jstrip_token")) {
+ commonApi.user_post("scene/is_scene_collection", {
+ scene_id: options.id
+ }).then(res => {
this.setData({
- isLike:res.data
+ isLike: res.data
})
})
}
- commonApi._post("ask/getQuestionList",{
- scene_id:options.id,
- page_no:1,
- page_num:3
- }).then(res=>{
+ commonApi._post("ask/getQuestionList", {
+ scene_id: options.id,
+ page_no: 1,
+ page_num: 3
+ }).then(res => {
this.setData({
- ask:res.data.rows
+ ask: res.data.rows
})
console.log(res)
})
// 获取评价列表
- commonApi._post("scene/get_comment",{
- scene_id:options.id
- }).then(res=>{
- res.data.list.map(item=>{
+ commonApi._post("scene/get_comment", {
+ scene_id: options.id
+ }).then(res => {
+ res.data.list.map(item => {
item.rate = Number(item.rate)
})
this.setData({
- comment:res.data.list.splice(0,3),
- commentTotal:res.data.total
+ comment: res.data.list.splice(0, 3),
+ commentTotal: res.data.total
})
console.log(res)
})
},
- BroswerRecord:function(){
- setTimeout(()=>{
- if(app.globalData.uuid){
- commonApi._post('browse/browse_record',{
- type:"scene",
- title:this.data.info.title,
- drive:"mini",
- source_id:this.data.info.id,
- url:"/pages/info/sceneProductInfo/index?id="+this.data.info.id,
- uuid:app.globalData.uuid
- }).then(res=>{
+ BroswerRecord: function () {
+ setTimeout(() => {
+ if (app.globalData.uuid) {
+ commonApi._post('browse/browse_record', {
+ type: "scene",
+ title: this.data.info.title,
+ drive: "mini",
+ source_id: this.data.info.id,
+ url: "/pages/info/sceneProductInfo/index?id=" + this.data.info.id,
+ uuid: app.globalData.uuid
+ }).then(res => {
})
}
else {
this.BroswerRecord();
}
- },500)
+ }, 500)
},
- like:function(){
- let id = this.data.id,isLike = Number(this.data.isLike);
+ like: function () {
+ let id = this.data.id, isLike = Number(this.data.isLike);
console.log(isLike)
- commonApi.user_post(isLike!=1?"scene/scene_collection":"scene/scene_cancel_collection",{
- scene_id:id
- }).then(res=>{
- if(res.code==1){
+ commonApi.user_post(isLike != 1 ? "scene/scene_collection" : "scene/scene_cancel_collection", {
+ scene_id: id
+ }).then(res => {
+ if (res.code == 1) {
console.log(isLike)
wx.showToast({
title: '操作成功',
})
this.setData({
- isLike:isLike==1?0:1
+ isLike: isLike == 1 ? 0 : 1
})
}
})
},
- gotolocation:function(){
+ gotolocation: function () {
let info = this.data.info;
wx.openLocation({
latitude: Number(info.lat),
longitude: Number(info.lon)
})
},
- audioGuide:function(){
+ audioGuide: function () {
wx.navigateToMiniProgram({
appId: 'wx74f380bc721a0379',
- path:'/pages/listen/listen?title=君到苏州'
+ path: '/pages/listen/listen?title=君到苏州'
})
},
- showBookingInfo:function(e){
+ showBookingInfo: function (e) {
this.setData({
- bookingInfo:e.currentTarget.dataset.item.sku_model,
- bookingInfoTitle:e.currentTarget.dataset.item.sku_name
+ bookingInfo: e.currentTarget.dataset.item.sku_model,
+ bookingInfoTitle: e.currentTarget.dataset.item.sku_name
})
},
- closeMask:function(){
+ closeMask: function () {
this.setData({
- bookingInfo:null
+ bookingInfo: null
})
},
- order:function(e){
+ order: function (e) {
app.globalData.couponInfo = null;
app.globalData.retailId = this.data.retailId;
// let sku = e.currentTarget.dataset.sku,product = e.currentTarget.dataset.product;
@@ -199,257 +199,257 @@ Page({
})
},
- // 分享
- share:function(){
- if(!wx.getStorageSync("jstrip_token")){
- commonApi.user_post("user/getMyInfo",{}).then(res=>{
-
- })
- return;
- }
- if(!this.data.shareImg){
- wx.showToast({
- title: '图片生成中，稍后再试',
- icon:'none'
- })
- return;
- }
- this.setData({
- showShareFlag:!this.data.showShareFlag
+ // 分享
+ share: function () {
+ if (!wx.getStorageSync("jstrip_token")) {
+ commonApi.user_post("user/getMyInfo", {}).then(res => {
+
})
- },
- // 保存
- save(){
- let url = this.data.shareImg,that = this;
- wx.authorize({
- /* 这个就是保存相册的 */
- scope: 'scope.writePhotosAlbum',
- success() {
- wx.saveImageToPhotosAlbum({
- filePath:url,
- success(res) {
- wx.showToast({
- title: '保存成功',
- icon:"success"
- })
- that.setData({
- showShareFlag:!this.data.showShareFlag
- })
- },
- fail(res){
+ return;
+ }
+ if (!this.data.shareImg) {
+ wx.showToast({
+ title: '图片生成中，稍后再试',
+ icon: 'none'
+ })
+ return;
+ }
+ this.setData({
+ showShareFlag: !this.data.showShareFlag
+ })
+ },
+ // 保存
+ save() {
+ let url = this.data.shareImg, that = this;
+ wx.authorize({
+ /* 这个就是保存相册的 */
+ scope: 'scope.writePhotosAlbum',
+ success() {
+ wx.saveImageToPhotosAlbum({
+ filePath: url,
+ success(res) {
+ wx.showToast({
+ title: '保存成功',
+ icon: "success"
+ })
+ that.setData({
+ showShareFlag: !this.data.showShareFlag
+ })
+ },
+ fail(res) {
+ wx.showToast({
+ title: '保存失败',
+ icon: 'none'
+ })
+ }
+ })
+ },
+ complete(res) {
+ console.log(res);
+ /* 这里判断一下如果没有授权重新打开设置选项 */
+ wx.getSetting({
+ success(res) {
+ if (!res.authSetting['scope.writePhotosAlbum']) {
+ /* 打开设置的方法 */
+ // opensit();
wx.showToast({
- title: '保存失败',
- icon:'none'
+ title: '请打开权限后再试',
+ icon: 'none'
})
}
- })
+ }
+ });
+ }
+ });
+
+ },
+ // 绘制海报
+ drawImg: function () {
+ var that = this, userinfo = wx.getStorageSync('jstrip_userInfo');
+ if (!userinfo) {
+ // 去登录
+ return false;
+ }
+ const ctx = wx.createCanvasContext('imageCanvas');
+ // const device = wx.getSystemInfoSync();
+ // const ratio = device.screenWidth / 750;
+ // 先获取到图片信息
+ let promise2 = new Promise(function (resolve, reject) {
+ wx.getImageInfo({
+ src: that.data.info.headimg,
+ success: function (res) {
+ resolve(res);
},
- complete(res) {
- console.log(res);
- /* 这里判断一下如果没有授权重新打开设置选项 */
- wx.getSetting({
- success(res) {
- if (!res.authSetting['scope.writePhotosAlbum']) {
- /* 打开设置的方法 */
- // opensit();
- wx.showToast({
- title: '请打开权限后再试',
- icon:'none'
- })
- }
- }
- });
+ fail: function (res) {
+ reject(res);
}
- });
-
- },
- // 绘制海报
- drawImg:function(){
- var that = this,userinfo = wx.getStorageSync('jstrip_userInfo');
- if(!userinfo){
- // 去登录
- return false;
+ })
+ })
+ let promise3 = new Promise(function (resolve, reject) {
+ let userid = wx.getStorageSync('jstrip_userid')
+ new QRCode('myQrcode', {
+ text: 'https://m.cloud.sz-trip.com/ScenicDetail?id=' + that.data.info.id + '&sharedUserId=' + userid + '&channel=-1',
+ width: 500,
+ height: 500,
+ padding: 12, // 生成二维码四周自动留边宽度，不传入默认为0
+ correctLevel: QRCode.CorrectLevel.H, // 二维码可辨识度
+ callback: (res) => {
+ resolve(res);
+ }
+ })
+ })
+ //成功得到图片信息后，开始绘图
+ Promise.all([promise2, promise3]).then(imgs => {
+ ctx.save();
+ ctx.beginPath(); //开始绘制
+ that.handleBorderRect(ctx, 0, 0, 551 * ratio, 407 * ratio, 25 * ratio, '#ccc')
+ ctx.clip();//画好了圆 剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内 这也是我们要save上下文的原因
+ ctx.drawImage(imgs[0].path, 0, 0, 551 * ratio, 407 * ratio);
+ ctx.restore();
+ ctx.save();
+ that.handleBorderRect2(ctx, 0, 407 * ratio, 551 * ratio, 236 * ratio, 25 * ratio, '#fff')
+ ctx.restore();
+ // 绘制二维码
+ ctx.drawImage(imgs[1].path, 373 * ratio, 495 * ratio, 137 * ratio, 137 * ratio);
+ // 开始文字绘制
+ ctx.setFillStyle("#000");
+ ctx.setFontSize(30 * ratio); //字大小
+ ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ that.drawText(ctx, that.data.info.title, 25 * ratio, 450 * ratio, 480 * ratio, ratio);
+ // 售价
+ ctx.setFillStyle("#D62828");
+ ctx.setFontSize(40 * ratio); //字大小
+ ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ let price = "￥" + (that.data.info.price / 100);
+ let width = ctx.measureText(price).width;
+ ctx.fillText(price, 25 * ratio, 620 * ratio);
+ // 副标题
+ ctx.setFillStyle("#999999");
+ ctx.setFontSize(28 * ratio); //字大小
+ ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ let subtitle = that.data.info.display_tags[0];
+ if (subtitle.length > 10) {
+ subtitle = subtitle.substr(0, 10) + '...'
}
- const ctx = wx.createCanvasContext('imageCanvas');
- // const device = wx.getSystemInfoSync();
- // const ratio = device.screenWidth / 750;
- // 先获取到图片信息
- let promise2 = new Promise(function(resolve,reject){
- wx.getImageInfo({
- src:that.data.info.headimg,
- success:function(res){
- resolve(res);
+ ctx.fillText(subtitle, 25 * ratio, 540 * ratio);
+ // ctx.draw();
+ // 划线价
+ // ctx.setFillStyle("#999999");
+ // ctx.setFontSize(32 * ratio); //字大小
+ // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ // let market_price = "￥"+(Number(that.data.info.market_price)/100)
+ // ctx.fillText(market_price, 40*ratio + width, 620*ratio);
+ // let market_price_width = ctx.measureText(market_price).width;
+ // 划线
+ // ctx.beginPath()
+ // ctx.setLineWidth(1)
+ // ctx.moveTo(40*ratio + width, 608*ratio)
+ // ctx.lineTo(45*ratio + width, 608*ratio)
+ // ctx.stroke();
+ // 长按识别二维码
+ // ctx.setFillStyle("#666");
+ // ctx.setFontSize(22 * ratio); //字大小
+ // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ // ctx.fillText("长按识别二维码", 404*ratio, 710*ratio);
+ // 长按图片转发或保存
+ // ctx.setFillStyle("#000");
+ // ctx.setFontSize(24 * ratio); //字大小
+ // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
+ // ctx.fillText("长按图片保存到本地",(592*ratio - ctx.measureText("长按图片保存到本地").width)/2, 740*ratio);
+ ctx.draw();
+ // 转为图片
+ setTimeout(() => {
+ wx.canvasToTempFilePath({
+ x: 0,
+ y: 0,
+ canvasId: 'imageCanvas',
+ success: function (res) {
+ that.setData({
+ shareImg: res.tempFilePath
+ })
},
- fail:function(res){
- reject(res);
- }
- })
- })
- let promise3 = new Promise(function(resolve,reject){
- let userid = wx.getStorageSync('jstrip_userid')
- new QRCode('myQrcode',{
- text: 'https://m.cloud.sz-trip.com/ScenicDetail?id='+that.data.info.id+'&sharedUserId='+userid+'&channel=-1',
- width: 500,
- height: 500,
- padding: 12, // 生成二维码四周自动留边宽度，不传入默认为0
- correctLevel: QRCode.CorrectLevel.H, // 二维码可辨识度
- callback: (res) => {
- resolve(res);
+ fail(err) {
+ console.log('agdgjgdajhg', err)
}
})
- })
- //成功得到图片信息后，开始绘图
- Promise.all([promise2,promise3]).then(imgs=>{
- ctx.save();
- ctx.beginPath(); //开始绘制
- that.handleBorderRect(ctx,0,0,551 * ratio,407 * ratio,25 * ratio,'#ccc')
- ctx.clip();//画好了圆 剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内 这也是我们要save上下文的原因
- ctx.drawImage(imgs[0].path, 0, 0,551 * ratio,407 * ratio);
- ctx.restore();
- ctx.save();
- that.handleBorderRect2(ctx,0,407 * ratio,551 * ratio,236*ratio,25 * ratio,'#fff')
- ctx.restore();
- // 绘制二维码
- ctx.drawImage(imgs[1].path, 373 * ratio, 495 * ratio,137 * ratio, 137 * ratio);
- // 开始文字绘制
- ctx.setFillStyle("#000");
- ctx.setFontSize(30 * ratio); //字大小
- ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- that.drawText(ctx,that.data.info.title, 25*ratio, 450*ratio,480 * ratio,ratio);
- // 售价
- ctx.setFillStyle("#D62828");
- ctx.setFontSize(40 * ratio); //字大小
- ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- let price = "￥"+(that.data.info.price/100);
- let width = ctx.measureText(price).width;
- ctx.fillText(price, 25*ratio, 620*ratio);
- // 副标题
- ctx.setFillStyle("#999999");
- ctx.setFontSize(28 * ratio); //字大小
- ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- let subtitle = that.data.info.display_tags[0];
- if(subtitle.length>10){
- subtitle = subtitle.substr(0,10)+'...'
- }
- ctx.fillText(subtitle, 25*ratio, 540*ratio);
- // ctx.draw();
- // 划线价
- // ctx.setFillStyle("#999999");
- // ctx.setFontSize(32 * ratio); //字大小
- // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- // let market_price = "￥"+(Number(that.data.info.market_price)/100)
- // ctx.fillText(market_price, 40*ratio + width, 620*ratio);
- // let market_price_width = ctx.measureText(market_price).width;
- // 划线
- // ctx.beginPath()
- // ctx.setLineWidth(1)
- // ctx.moveTo(40*ratio + width, 608*ratio)
- // ctx.lineTo(45*ratio + width, 608*ratio)
- // ctx.stroke();
- // 长按识别二维码
- // ctx.setFillStyle("#666");
- // ctx.setFontSize(22 * ratio); //字大小
- // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- // ctx.fillText("长按识别二维码", 404*ratio, 710*ratio);
- // 长按图片转发或保存
- // ctx.setFillStyle("#000");
- // ctx.setFontSize(24 * ratio); //字大小
- // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线
- // ctx.fillText("长按图片保存到本地",(592*ratio - ctx.measureText("长按图片保存到本地").width)/2, 740*ratio);
- ctx.draw();
- // 转为图片
- setTimeout(()=>{
- wx.canvasToTempFilePath({
- x: 0,
- y: 0,
- canvasId: 'imageCanvas',
- success: function (res) {
- that.setData({
- shareImg:res.tempFilePath
- })
- },
- fail(err){
- console.log('agdgjgdajhg',err)
- }
- })
- },500)
- return false;
- }).catch(err=>{
- console.log("this err",err)
- })
- },
- // 圆角矩形
- handleBorderRect(ctx, x, y, w, h, r, color){
- ctx.beginPath();
- ctx.moveTo(x+w,y+h);
- ctx.lineTo(x,y+h)
- // 左上角
- ctx.arc(x + r, y + r, r, Math.PI, 1.5 * Math.PI);
- ctx.moveTo(x + r, y);
- ctx.lineTo(x + w - r, y);
- ctx.lineTo(x + w, y + r);
- // 右上角
- ctx.arc(x + w - r, y + r, r, 1.5 * Math.PI, 2 * Math.PI);
- ctx.lineTo(x + w, y + h );
- ctx.lineTo(x + w - r, y + h);
- ctx.fillStyle = color;
- ctx.fill();
- ctx.closePath();
- },
- handleBorderRect2(ctx, x, y, w, h, r, color){
- ctx.beginPath();
- ctx.moveTo(x,y);
- ctx.lineTo(x+w,y)
- // 右下角
- ctx.arc(x + w - r, y + h - r, r, 0, 0.5 * Math.PI);
- ctx.lineTo(x + r, y + h);
- ctx.lineTo(x, y + h - r);
- // 左下角
- ctx.arc(x + r, y + h - r, r, 0.5 * Math.PI, Math.PI);
- ctx.lineTo(x, y);
- ctx.lineTo(x, y);
- ctx.fillStyle = color;
- ctx.fill();
- ctx.closePath();
- },
- // 绘制两行文字
- drawText: function(ctx, str, x, y, canvasWidth,ratio) {
- let row = [],temp="",chr=str.split("");
- for (var a = 0; a < chr.length; a++) {
- if (ctx.measureText(temp).width < canvasWidth) {
- temp += chr[a];
+ }, 500)
+ return false;
+ }).catch(err => {
+ console.log("this err", err)
+ })
+ },
+ // 圆角矩形
+ handleBorderRect(ctx, x, y, w, h, r, color) {
+ ctx.beginPath();
+ ctx.moveTo(x + w, y + h);
+ ctx.lineTo(x, y + h)
+ // 左上角
+ ctx.arc(x + r, y + r, r, Math.PI, 1.5 * Math.PI);
+ ctx.moveTo(x + r, y);
+ ctx.lineTo(x + w - r, y);
+ ctx.lineTo(x + w, y + r);
+ // 右上角
+ ctx.arc(x + w - r, y + r, r, 1.5 * Math.PI, 2 * Math.PI);
+ ctx.lineTo(x + w, y + h);
+ ctx.lineTo(x + w - r, y + h);
+ ctx.fillStyle = color;
+ ctx.fill();
+ ctx.closePath();
+ },
+ handleBorderRect2(ctx, x, y, w, h, r, color) {
+ ctx.beginPath();
+ ctx.moveTo(x, y);
+ ctx.lineTo(x + w, y)
+ // 右下角
+ ctx.arc(x + w - r, y + h - r, r, 0, 0.5 * Math.PI);
+ ctx.lineTo(x + r, y + h);
+ ctx.lineTo(x, y + h - r);
+ // 左下角
+ ctx.arc(x + r, y + h - r, r, 0.5 * Math.PI, Math.PI);
+ ctx.lineTo(x, y);
+ ctx.lineTo(x, y);
+ ctx.fillStyle = color;
+ ctx.fill();
+ ctx.closePath();
+ },
+ // 绘制两行文字
+ drawText: function (ctx, str, x, y, canvasWidth, ratio) {
+ let row = [], temp = "", chr = str.split("");
+ for (var a = 0; a < chr.length; a++) {
+ if (ctx.measureText(temp).width < canvasWidth) {
+ temp += chr[a];
+ }
+ else {
+ a--; //这里添加了a-- 是为了防止字符丢失，效果图中有对比
+ row.push(temp);
+ temp = "";
+ }
+ }
+ row.push(temp);
+
+ //如果数组长度大于2 则截取前两个
+ if (row.length > 2) {
+ var rowCut = row.slice(0, 2);
+ var rowPart = rowCut[1];
+ var test = "";
+ var empty = [];
+ for (var a = 0; a < rowPart.length; a++) {
+ if (ctx.measureText(test).width < canvasWidth - 30 * ratio) {
+ test += rowPart[a];
}
else {
- a--; //这里添加了a-- 是为了防止字符丢失，效果图中有对比
- row.push(temp);
- temp = "";
- }
- }
- row.push(temp);
-
- //如果数组长度大于2 则截取前两个
- if (row.length > 2) {
- var rowCut = row.slice(0, 2);
- var rowPart = rowCut[1];
- var test = "";
- var empty = [];
- for (var a = 0; a < rowPart.length; a++) {
- if (ctx.measureText(test).width < canvasWidth - 30 * ratio) {
- test += rowPart[a];
- }
- else {
- break;
- }
+ break;
}
- empty.push(test);
- var group = empty[0] + "..."//这里只显示两行，超出的用...表示
- rowCut.splice(1, 1, group);
- row = rowCut;
}
- for (var b = 0; b < row.length; b++) {
- ctx.fillText(row[b], x, y + b * 40 * ratio, canvasWidth);
- }
- },
+ empty.push(test);
+ var group = empty[0] + "..."//这里只显示两行，超出的用...表示
+ rowCut.splice(1, 1, group);
+ row = rowCut;
+ }
+ for (var b = 0; b < row.length; b++) {
+ ctx.fillText(row[b], x, y + b * 40 * ratio, canvasWidth);
+ }
+ },
/**
* 生命周期函数--监听页面初次渲染完成
@@ -462,17 +462,17 @@ Page({
* 生命周期函数--监听页面显示
*/
onShow: function () {
- // if(!wx.getStorageSync('jstrip_token')){
- // return;
- // }
- // if(this.data.info && this.data.info.id){
- // this.drawImg()
- // }
- // else {
- // setTimeout(()=>{
- // this.onShow()
- // },200)
- // }
+ if (!wx.getStorageSync('jstrip_token')) {
+ return;
+ }
+ if (this.data.info && this.data.info.id) {
+ this.drawImg()
+ }
+ else {
+ setTimeout(() => {
+ this.onShow()
+ }, 200)
+ }
},
/**
diff --git a/pages/info/sceneProductInfo/index.wxml b/pages/info/sceneProductInfo/index.wxml
index 6e12acb..0148e00 100644
--- a/pages/info/sceneProductInfo/index.wxml
+++ b/pages/info/sceneProductInfo/index.wxml
@@ -1,6 +1,6 @@
-
+