Selaa lähdekoodia

海报:完善小程序码获取和海报生成

puhui999 1 vuosi sitten
vanhempi
sitoutus
004294ae7c

+ 2 - 2
.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

+ 7 - 7
pages/goods/index.vue

@@ -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>

+ 13 - 6
sheep/api/migration/third.js

@@ -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,
-        }),
-      )}`,
+        },
+      });
+    },
   },
 
   // 苹果相关

+ 11 - 13
sheep/api/trade/brokerage.js

@@ -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]}&times=${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',

+ 1 - 1
sheep/components/s-share-modal/canvas-poster/index.vue

@@ -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;
   }
 

+ 5 - 4
sheep/components/s-share-modal/canvas-poster/poster/goods.js

@@ -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,

+ 27 - 0
sheep/components/s-share-modal/canvas-poster/poster/index.js

@@ -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;
+  }
+}
+

+ 2 - 2
sheep/components/s-share-modal/canvas-poster/useCanvas.js

@@ -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 - 1
sheep/platform/provider/wechat/miniProgram.js

@@ -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';

+ 8 - 5
sheep/platform/share.js

@@ -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}`;
 };
 
 // 构造分享链接

+ 1 - 1
sheep/store/app.js

@@ -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",