海报:完善小程序码获取和海报生成
parent
8815972188
commit
004294ae7c
4
.env
4
.env
|
@ -5,7 +5,7 @@ SHOPRO_VERSION = v1.8.3
|
|||
SHOPRO_BASE_URL = http://api-dashboard.yudao.iocoder.cn
|
||||
|
||||
# 后端接口 - 测试环境(通过 process.env.NODE_ENV = development)
|
||||
SHOPRO_DEV_BASE_URL = http://127.0.0.1:48080
|
||||
SHOPRO_DEV_BASE_URL = https://192.168.2.21:48080
|
||||
### SHOPRO_DEV_BASE_URL = http://yunai.natapp1.cc
|
||||
|
||||
# 后端接口前缀(一般不建议调整)
|
||||
|
@ -18,4 +18,4 @@ SHOPRO_DEV_PORT = 3000
|
|||
SHOPRO_STATIC_URL = https://file.sheepjs.com
|
||||
|
||||
# 是否开启直播 1 开启直播 | 0 关闭直播 (小程序官方后台未审核开通直播权限时请勿开启)
|
||||
SHOPRO_MPLIVE_ON = 0
|
||||
SHOPRO_MPLIVE_ON = 0
|
||||
|
|
|
@ -194,20 +194,20 @@
|
|||
if (isEmpty(state.goodsInfo)) return {};
|
||||
return sheep.$platform.share.getShareInfo({
|
||||
title: state.goodsInfo.name,
|
||||
image: sheep.$url.cdn(state.goodsInfo.image),
|
||||
desc: state.goodsInfo.subtitle,
|
||||
image: sheep.$url.cdn(state.goodsInfo.picUrl),
|
||||
desc: state.goodsInfo.introduction,
|
||||
path: 'pages/goods/index',
|
||||
params: {
|
||||
page: '2',
|
||||
query: state.goodsInfo.id,
|
||||
},
|
||||
}, {
|
||||
type: 'goods', // 商品海报
|
||||
title: state.goodsInfo.name, // 商品标题
|
||||
// image: sheep.$url.cdn(state.goodsInfo.image), // 商品主图
|
||||
title: state.goodsInfo.name, // 商品名称
|
||||
image: sheep.$url.cdn(state.goodsInfo.picUrl), // 商品主图
|
||||
price: fen2yuan(state.goodsInfo.price), // 商品价格
|
||||
original_price: fen2yuan(state.goodsInfo.maretPrice), // 商品原价
|
||||
}, );
|
||||
original_price: fen2yuan(state.goodsInfo.marketPrice), // 商品原价
|
||||
});
|
||||
});
|
||||
|
||||
async function getCoupon() {
|
||||
|
@ -410,4 +410,4 @@
|
|||
color: #333333;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
import request from '@/sheep/request';
|
||||
import { baseUrl, apiPath } from '@/sheep/config';
|
||||
|
||||
const socialType = 34; // 社交类型 - 微信小程序
|
||||
|
||||
export default {
|
||||
// 微信相关
|
||||
|
@ -19,12 +20,18 @@ export default {
|
|||
}),
|
||||
|
||||
// 获取微信小程序码
|
||||
getWxacode: (path) =>
|
||||
`${baseUrl}${apiPath}third/wechat/wxacode?platform=miniProgram&payload=${encodeURIComponent(
|
||||
JSON.stringify({
|
||||
getWxacode: async (path, query) => {
|
||||
return await request({
|
||||
url: '/member/social-user/wxa-qrcode',
|
||||
method: 'POST',
|
||||
data: {
|
||||
type: socialType,
|
||||
scene: query,
|
||||
isCheckPath: false, // TODO 开发环境暂不检查 path 是否存在
|
||||
path,
|
||||
}),
|
||||
)}`,
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
// 苹果相关
|
||||
|
|
|
@ -16,12 +16,12 @@ const BrokerageApi = {
|
|||
});
|
||||
},
|
||||
// 获得分销记录分页
|
||||
getBrokerageRecordPage: (params) => {
|
||||
getBrokerageRecordPage: params => {
|
||||
if (params.status === undefined) {
|
||||
delete params.status
|
||||
}
|
||||
const queryString = Object.keys(params)
|
||||
.map((key) => encodeURIComponent(key) + '=' + params[key])
|
||||
.map(key => encodeURIComponent(key) + '=' + params[key])
|
||||
.join('&');
|
||||
return request({
|
||||
url: `/trade/brokerage-record/page?${queryString}`,
|
||||
|
@ -29,7 +29,7 @@ const BrokerageApi = {
|
|||
});
|
||||
},
|
||||
// 创建分销提现
|
||||
createBrokerageWithdraw: (data) => {
|
||||
createBrokerageWithdraw: data => {
|
||||
return request({
|
||||
url: '/trade/brokerage-withdraw/create',
|
||||
method: 'POST',
|
||||
|
@ -37,17 +37,15 @@ const BrokerageApi = {
|
|||
});
|
||||
},
|
||||
// 获得商品的分销金额
|
||||
getProductBrokeragePrice: (spuId) => {
|
||||
getProductBrokeragePrice: spuId => {
|
||||
return request({
|
||||
url: '/trade/brokerage-record/get-product-brokerage-price',
|
||||
method: 'GET',
|
||||
params: {
|
||||
spuId
|
||||
}
|
||||
params: { spuId }
|
||||
});
|
||||
},
|
||||
// 获得分销用户排行(基于佣金)
|
||||
getRankByPrice: (params) => {
|
||||
getRankByPrice: params => {
|
||||
const queryString = `times=${params.times[0]}×=${params.times[1]}`;
|
||||
return request({
|
||||
url: `/trade/brokerage-user/get-rank-by-price?${queryString}`,
|
||||
|
@ -55,9 +53,9 @@ const BrokerageApi = {
|
|||
});
|
||||
},
|
||||
// 获得分销用户排行分页(基于佣金)
|
||||
getBrokerageUserChildSummaryPageByPrice: (params) => {
|
||||
getBrokerageUserChildSummaryPageByPrice: params => {
|
||||
const queryString = Object.keys(params)
|
||||
.map((key) => encodeURIComponent(key) + '=' + params[key])
|
||||
.map(key => encodeURIComponent(key) + '=' + params[key])
|
||||
.join('&');
|
||||
return request({
|
||||
url: `/trade/brokerage-user/rank-page-by-price?${queryString}`,
|
||||
|
@ -65,9 +63,9 @@ const BrokerageApi = {
|
|||
});
|
||||
},
|
||||
// 获得分销用户排行分页(基于用户量)
|
||||
getBrokerageUserRankPageByUserCount: (params) => {
|
||||
getBrokerageUserRankPageByUserCount: params => {
|
||||
const queryString = Object.keys(params)
|
||||
.map((key) => encodeURIComponent(key) + '=' + params[key])
|
||||
.map(key => encodeURIComponent(key) + '=' + params[key])
|
||||
.join('&');
|
||||
return request({
|
||||
url: `/trade/brokerage-user/rank-page-by-user-count?${queryString}`,
|
||||
|
@ -75,7 +73,7 @@ const BrokerageApi = {
|
|||
});
|
||||
},
|
||||
// 获得下级分销统计分页
|
||||
getBrokerageUserChildSummaryPage: (params) => {
|
||||
getBrokerageUserChildSummaryPage: params => {
|
||||
return request({
|
||||
url: '/trade/brokerage-user/child-summary-page',
|
||||
method: 'GET',
|
||||
|
|
|
@ -101,12 +101,12 @@
|
|||
// 使用 canvas 生成海报
|
||||
async function getPoster(params) {
|
||||
poster.src = '';
|
||||
|
||||
poster.shareInfo = props.shareInfo;
|
||||
// #ifdef APP-PLUS
|
||||
poster.canvasId = 'canvasId-' + new Date().getTime();
|
||||
// #endif
|
||||
const canvas = await useCanvas(poster, vm);
|
||||
console.log('canvas',canvas);
|
||||
return canvas;
|
||||
}
|
||||
|
||||
|
|
|
@ -1,10 +1,11 @@
|
|||
import sheep from '@/sheep';
|
||||
import { formatImageUrlProtocol } from './index';
|
||||
import third from '@/sheep/api/migration/third';
|
||||
import { formatImageUrlProtocol, getBase64Src } from './index';
|
||||
|
||||
const goods = (poster) => {
|
||||
const goods = async (poster) => {
|
||||
const width = poster.width;
|
||||
const userInfo = sheep.$store('user').userInfo;
|
||||
|
||||
const wxa_qrcode = (await third.wechat.getWxacode(poster.shareInfo.path, poster.shareInfo.query)).data;
|
||||
return {
|
||||
background: formatImageUrlProtocol(sheep.$url.cdn(sheep.$store('app').platform.share.posterInfo.goods_bg)),
|
||||
list: [
|
||||
|
@ -107,7 +108,7 @@ const goods = (poster) => {
|
|||
{
|
||||
name: 'wxacode',
|
||||
type: 'image',
|
||||
val: sheep.$api.third.wechat.getWxacode(poster.shareInfo.path),
|
||||
val: wxa_qrcode,
|
||||
x: width * 0.75,
|
||||
y: width * 1.3,
|
||||
width: width * 0.2,
|
||||
|
|
|
@ -30,3 +30,30 @@ export function formatImageUrlProtocol(url) {
|
|||
|
||||
return url;
|
||||
}
|
||||
|
||||
|
||||
export function getBase64Src(base64data, appType) {
|
||||
const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64data) || [];
|
||||
switch (appType) {
|
||||
case 'wechat':
|
||||
const filePath = `${wx.env.USER_DATA_PATH}/tmp_base64src.${format}`;
|
||||
return new Promise((resolve, reject) => {
|
||||
const fileManager = uni.getFileSystemManager();
|
||||
fileManager.writeFile({
|
||||
filePath: filePath,
|
||||
data: bodyData, // base64 数据
|
||||
encoding: 'base64', // 字符编码
|
||||
success: () => {
|
||||
resolve(filePath);
|
||||
},
|
||||
file: (err) => {
|
||||
console.log('base64 保存失败', err);
|
||||
},
|
||||
});
|
||||
});
|
||||
default:
|
||||
console.warn('获得 base64 图片地址只做了微信小程序端的转换,其它端请自行实现!!!');
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -22,8 +22,8 @@ export default async function useCanvas(options, vm) {
|
|||
vm,
|
||||
);
|
||||
|
||||
let drawer = getPosterData(options);
|
||||
|
||||
let drawer = await getPosterData(options);
|
||||
console.log(drawer);
|
||||
// 绘制背景图
|
||||
const background = await qsc.drawImg({
|
||||
type: 'image',
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
// import third from '@/sheep/api/third';
|
||||
import third from '@/sheep/api/migration/third'
|
||||
import AuthUtil from '@/sheep/api/member/auth';
|
||||
import SocialApi from '@/sheep/api/member/social';
|
||||
import UserApi from '@/sheep/api/member/user';
|
||||
|
|
|
@ -19,6 +19,7 @@ const getShareInfo = (
|
|||
title: '', // 自定义分享标题
|
||||
desc: '', // 自定义描述
|
||||
image: '', // 自定义分享图片
|
||||
path: '', // 页面基础路径,不要以 / 开头
|
||||
params: {}, // 自定义分享参数
|
||||
},
|
||||
poster = {
|
||||
|
@ -26,7 +27,7 @@ const getShareInfo = (
|
|||
type: 'user',
|
||||
},
|
||||
) => {
|
||||
let shareInfo = {
|
||||
const shareInfo = {
|
||||
title: '', // 分享标题
|
||||
desc: '', // 描述
|
||||
image: '', // 分享图片
|
||||
|
@ -48,6 +49,7 @@ const getShareInfo = (
|
|||
|
||||
// 配置转发参数
|
||||
if (shareConfig.methods.includes('forward')) {
|
||||
// TODO puhui999: forward 这块有点问题
|
||||
if (shareConfig.forwardInfo.title === '' || shareConfig.forwardInfo.image === '') {
|
||||
console.log('请在平台设置中配置转发信息');
|
||||
}
|
||||
|
@ -55,9 +57,10 @@ const getShareInfo = (
|
|||
shareInfo.title = scene.title || shareConfig.forwardInfo.title;
|
||||
shareInfo.image = $url.cdn(scene.image || shareConfig.forwardInfo.image);
|
||||
shareInfo.desc = scene.desc || shareConfig.forwardInfo.subtitle;
|
||||
shareInfo.path = buildSpmPath(query);
|
||||
shareInfo.path = buildSpmPath(scene.path, query);
|
||||
}
|
||||
|
||||
shareInfo.path = scene.path;
|
||||
console.log('shareInfo', shareInfo);
|
||||
return shareInfo;
|
||||
};
|
||||
|
||||
|
@ -89,8 +92,8 @@ const buildSpmQuery = (params) => {
|
|||
};
|
||||
|
||||
// 构造页面分享参数
|
||||
const buildSpmPath = (query) => {
|
||||
return `/pages/index/index?${query}`;
|
||||
const buildSpmPath = (path, query) => {
|
||||
return `/${path}?${query}`;
|
||||
};
|
||||
|
||||
// 构造分享链接
|
||||
|
|
|
@ -72,7 +72,7 @@ const app = defineStore({
|
|||
};
|
||||
this.platform = {
|
||||
share: {
|
||||
methods: [ "poster", "link" ],
|
||||
methods: ["poster", "link"],
|
||||
linkAddress: "https://shopro.sheepjs.com/#/",
|
||||
posterInfo: {
|
||||
"user_bg": "/static/img/shop/config/user-poster-bg.png",
|
||||
|
|
Loading…
Reference in New Issue