charles/frontend-app
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

no message

Browse Source
This commit is contained in:
money
2025-11-16 18:30:50 +08:00
parent 9b48bd07d9
commit 3fe89ed7ee
22 changed files with 2426 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/other_package/productInfo/productInfo.vue
+353 -3
View File
@@ -1,5 +1,6 @@
<template>
<view class="product_info_warp">
<!-- <image v-if="tmpImg" :src="tmpImg" style="width:620rpx;height:960rpx"></image> -->
<!-- 头部产品描述图 -->
<view class="product_info_header_warp">
<up-swiper
@@ -22,11 +23,13 @@
width="30"
height="30"
bgColor="#f1f6ff00"
v-if="!isShareUrl"
@click="jumpLeft"
></up-image>
</view>
<view class="img_comm right_warp">
<up-image
v-if="!isShareUrl"
src="/static/common/share_st.png"
width="30"
height="30"
@@ -197,7 +200,7 @@
<view>购物车</view>
</view>
</view>
<view class="product_but_right">
<view class="product_but_right" v-if="!isShareUrl">
<view
v-if="!ji"
class="but_comm join_warp"
@@ -211,6 +214,7 @@
>立即购买</view
>
</view>
<MyBtn v-if="isShareUrl" mh="88rpx" text="打开APP" wd="200rpx" @ok="onOpenApp"></MyBtn>
</view>
<!-- 选择规格的弹框 -->
<up-popup
@@ -330,6 +334,7 @@
@click="addCart(false)"
>加入购物车</view
>
<view v-else class="product_but_right popup_buts">
<view class="but_comm join_warp" @click="addCart(false)"
>加入购物车</view
@@ -419,6 +424,25 @@
<view class="popup_but" @click="addressOk"> 确认 </view>
</view>
</up-popup>
<SharePopup
ref="share"
v-if="shareOpen"
:show="shareShow"
@close="onClose"
@share="onShare"
:id="id"
:text="orderInfo.name ? orderInfo.name : ''"
:price="orderInfo.minPrice ? orderInfo.minPrice : ''"
:tu="swiperList.length && swiperList[0]"></SharePopup>
<view class="hideCanvasView">
<canvas
id="myCanvas"
canvas-id="myCanvas"
:style="{
height: ((bgObj.height) + 'px'),
width: ((bgObj.width) + 'px')
}"></canvas>
</view>
</view>
</template>
@@ -426,14 +450,22 @@
import { getGoodsDetail, addGoods, getGoodsSpecs } from "@/api/product.js";
import { getValue, PRODUCT_DELIVERY_TIME } from "@/utils/enumUtils.js";
import { copyData } from "@/utils/index.js";
import SharePopup from "@/components/common/share-popup.vue"
import MyBtn from '@/components/common/my-btn.vue'
import { getPostageQuery } from "@/api/cart.js";
import { assembleAddress } from "@/utils/index.js";
// const QSCanvas = require('qs-canvas')
import QSCanvas from 'qs-canvas';
// import {getSharePoster} from "@/components/QuShe-SharerPoster/QS-SharePoster/QS-SharePoster.js";
import func from "@/utils/func.js";
import Address from "@/components/address.vue";
import {
CUSTOMER_SERVICE_PHONE_NUMBER,
CLOUD_SERVICE_PHONE_NUMBER,
SHARE_URL,
} from "@/utils/config.js";
let qsc = null;
let timer = null;
export default {
computed: {
PRODUCT_DELIVERY_TIME() {
@@ -448,11 +480,15 @@ export default {
},
components: {
Address,
SharePopup,
MyBtn
},
data() {
return {
id: 0,
shareShow:false,
addressShow: false, // 收件地址选择
shareOpen:false,
swiperList: [],
currentNum: 0,
specificationShow: false,
@@ -469,6 +505,17 @@ export default {
selectAddress: {}, // 选择的地址
postage: null, // 邮费
adressInfo: "",
urlPath:'',
posterImage:'',
canvasId: 'default_PosterCanvasId',
poster:'',
bgObj: {
height: 480,
width: 310
},
draw:null,
tmpImg:'',
isShareUrl:false
};
},
onLoad(options) {
@@ -484,15 +531,292 @@ export default {
this.getById();
}
}
// #ifdef H5
let url = window.location.href;
if(url.indexOf(SHARE_URL) != -1){
this.isShareUrl = true;
}
console.log('url',url,SHARE_URL)
// #endif
qsc = new QSCanvas({
canvasId: 'myCanvas',
setCanvasWH: bg => {
this.bgObj = bg
}
}, this);
},
onHide(){
timer && clearTimeout(timer);
timer = null;
},
onUnload(){
timer && clearTimeout(timer);
timer = null;
},
methods: {
assembleAddress,
onOpenApp(){
//https://download.tbmall.xin/1002/apppacket/20251113/20251113183449483.apk
let iphone = this.iosOrAnd();
window.location = 'trustbridgeapp://';
timer = setTimeout(()=>{
if(timer != null){
uni.showModal({
title:'未成功唤起APP',
content:'是否前往下载?',
success:(res=>{
if(res.confirm){
window.open('https://app.tbmall.xin')
}
})
})
}
},3000)
},
iosOrAnd() {
let userAgent = navigator.userAgent || navigator.vendor || window.opera;
if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
return "ios";
}
if (/Android/.test(userAgent)) {
return "and";
}
return "Other";
},
onZiXun() {
if(this.isShareUrl){
return;
}
uni.navigateTo({
url: "/pages/rwa_package/setting/kefu?type=5260",
});
},
getValue,
onShare(index){
if(index == 0){
// WXSceneTimeline
uni.share({
provider:'weixin',
scene:'WXSceneSession',
type:1,
summary:`${SHARE_URL}/#/pages/other_package/productInfo/productInfo?id=${this.id}`,
})
this.onClose()
}else if(index == 1){
uni.share({
provider:'weixin',
scene:'WXSceneTimeline',
type:1,
summary:`${SHARE_URL}/#/pages/other_package/productInfo/productInfo?id=${this.id}`,
})
}else if(index == 2){
this.onClose()
}else if(index == 3){
setTimeout(()=>{
this.onDraw();
},1000)
this.onClose()
}else if(index == 4){
func.myToast('暂未开放')
}
},
async onDraw(){
let _this = this;
try {
let last
// qsc.setRect({ x: 0, y: 0,r:12, height: 960, width: 620});
qsc.setPaintbrush({
strokeStyle:'#EBEBEB',
font: {
fontSize: 16
}
})
last = await qsc.drawImg({
val: '../../../static/new/di.png',
x: 0,
y: 0,
height: 480,
width: 310,
})
last = await qsc.drawImg({
val: '../../../static/new/logo.png',
x: 228,
y: 393,
height: 62,
width: 62,
})
// last = await qsc.drawImg({
// val:'https://niu8.letaocm.top/17557729915067836.jpg',
// x: 20,
// y: 20,
// height: 270,
// width: 270,
// })
// #ifndef H5
last = await qsc.drawImg({
val:_this.swiperList[0],
x: 20,
y: 20,
height: 270,
width: 270,
})
// #endif
qsc.setPaintbrush({
strokeStyle:'#EBEBEB'
})
// { x1: obj.x, y1: y, x2: obj.x + tw, y2: y, style, gap, width, color }
last = await qsc.drawLine({
style:'solide',
x1:210,
y1:313,
x2:210,
y2:342,
width:1,
gap:1
})
last = await qsc.drawLine({
style:'solide',
x1:20,
y1:368,
x2:290,
y2:368,
width:1,
gap:1
})
// last = await qsc.drawImg({
// val:'https://hashmall-prod.oss-cn-shenzhen.aliyuncs.com/1002/image/20250818/20250818134614672.jpg',
// x: 20,
// y: 20,
// height: 270,
// width: 270,
// })
last = await qsc.drawText({
val: this.orderInfo.name,
x: 20,
y: 310,
maxWidth: 180,
line: 2
})
last = await qsc.drawText({
val: '1、保存图片到相册',
x: 93,
y: 397,
paintbrushProps: { fillStyle: '#7f7f7f',font: { fontSize: 12, fontWeight: 400 } } ,
})
last = await qsc.drawText({
val: '2、扫一扫下载信任桥',
x: 93,
y: 438,
paintbrushProps: { fillStyle: '#7f7f7f',font: { fontSize: 12, fontWeight: 400 } } ,
})
last = await qsc.drawText({
val: '￥:' + this.orderInfo.minPrice,
x: 230,
y: 317,
paintbrushProps: { fillStyle: '#7A35F6',font: { fontSize: 20, fontWeight: 700 } } ,
})
last = await qsc.drawQrCode({
val: `${SHARE_URL}/#/pages/other_package/productInfo/productInfo?id=${this.id}`,
x: 20,
y: 391,
size: 65,
})
// await qsc.updateCanvasWH({ width: '300px', height: '960px'})
await qsc.draw();
setTimeout(()=>{
uni.canvasToTempFilePath({
canvasId: 'myCanvas',
success: function (res) {
const tempFilePath = res.tempFilePath;
_this.tmpImg = tempFilePath;
// #ifdef H5
uni.downloadFile({
url: tempFilePath,
success: function () {
let link = document.createElement('a');
link.href = tempFilePath;
link.download = '分享图片';
link.click();
},
fail: function (err) {
uni.showToast({
title: '保存失败',
icon: 'none',
duration: 2000
});
}
});
// #endif
// #ifndef H5
uni.saveImageToPhotosAlbum({
filePath: tempFilePath,
success: function () {
uni.showToast({
title: '保存成功',
icon: 'success',
duration: 2000
});
},
fail: function (err) {
console.error('保存失败:', err);
uni.showModal({
title: '错误',
content: '保存图片到相册失败',
showCancel: false
});
}
});
// #endif
},
fail: function (error) {
console.error('获取图片失败:', error);
}
});
},200)
// let img = await qsc.toImage({x:0,y:0,width:620,height:960,
// destWidth:310 * 4,destHeight:480 * 4,fileType:'png'});
// uni.saveImageToPhotosAlbum({filePath:img});
// console.log('img',img)
} catch (e) {
//TODO handle the exception
console.log('绘制异常',e)
uni.showModal({
content: JSON.stringify(e)
})
}
},
onClose(){
this.shareShow = false;
setTimeout(()=>{
this.shareOpen = false;
},1000)
},
onSwiper(index) {
uni.previewImage({
current: index,
@@ -501,6 +825,9 @@ export default {
});
},
jumpAddAddress() {
if(this.isShareUrl){
return;
}
this.addressShow = true;
},
// 地址选中
@@ -553,6 +880,9 @@ export default {
});
},
jumpOther(type) {
if(this.isShareUrl){
return;
}
if (type === "home") {
uni.switchTab({
// 首页
@@ -642,6 +972,9 @@ export default {
});
},
async checkSpecification(val, type) {
if(this.isShareUrl){
return;
}
const source = this.source;
if (type == "n" && this.ji == 1) {
type = "buy";
@@ -827,7 +1160,12 @@ export default {
}
},
// 跳转到分享页面
jumpShare() {},
jumpShare() {
console.log('jumpShare')
this.shareOpen = true;
this.shareShow = true;
},
},
};
</script>
@@ -1300,4 +1638,16 @@ export default {
}
}
}
.hideCanvasView{
width:100%;
height:100%;
position: fixed;
top:10000;
left:10000;
z-index: 1000000000000;
// background-color: rgba(0,0,0,0.2);
display: flex;
align-items: center;
justify-content: center;
}
</style>