update

src/plugins/wxShare.js

@@ -1,67 +1,111 @@
 import wx from 'weixin-js-sdk'
 import store from '@/store'
-// import { $toastText } from '@/config/toast'
 
 const base = {}
+
 base.install = function(Vue, options) {
+  // 初始化微信配置（只执行一次）
+  Vue.prototype.$initWechatConfig = function() {
+    return new Promise((resolve, reject) => {
+      const configData = store.state.app.configData
+      if (!configData) {
+        console.error('微信配置数据为空')
+        reject('微信配置数据为空')
+        return
+      }
+
+      wx.config(configData)
+
+      wx.ready(() => {
+        console.log('微信 JS-SDK 配置成功')
+        resolve()
+      })
+
+      wx.error((err) => {
+        console.error('微信 JS-SDK 配置失败:', err)
+        reject(err)
+      })
+    })
+  }
+
+  // 分享配置方法
   Vue.prototype.$shareList = function(imgUrl, link, desc, title) {
-    // 分享
+    // 检查 wx 是否已配置
-    let share_title = ``
+    if (!wx) {
-    if (!localStorage.getItem('from_openid') || (localStorage.getItem('from_openid') && localStorage.getItem('from_openid').length < 20)) {
+      console.error('微信 JS-SDK 未加载')
+      return
+    }
+
+    let share_title = ''
+    const fromOpenid = localStorage.getItem('from_openid')
+    const storeInfo = store.state.app.info
+
+    if (!fromOpenid || fromOpenid.length < 20) {
       share_title = ''
-    } else if (store.state.app.info.nickname && store.state.app.info.nickname.length > 4) {
+    } else if (storeInfo && storeInfo.nickname && storeInfo.nickname.length > 4) {
-      share_title = store.state.app.info.nickname.substring(0, 4) + '..推送'
+      share_title = storeInfo.nickname.substring(0, 4) + '..推送'
+    } else if (storeInfo && storeInfo.nickname) {
+      share_title = storeInfo.nickname + '推送'
     } else {
-      share_title = store.state.app.info.nickname + '推送'
+      share_title = ''
     }
-    wx.config(store.state.app.configData)
+
-    wx.ready(function() {
+    // 确保在 wx.ready 中执行分享配置
+    if (wx && typeof wx.ready === 'function') {
+      wx.ready(() => {
+        console.log('开始配置分享参数', { title, desc, link, imgUrl })
+
+        // 隐藏菜单项（可选）
         wx.hideMenuItems({
-        menuList: [] // 屏蔽复制链接
+          menuList: [] // 为空表示不隐藏任何菜单
         })
+
+        // 分享给朋友
         wx.updateAppMessageShareData({
-        title: desc !== '欢迎和我预约' ? share_title + '《' + title + '》' : `【${title}】商家预约`, // 分享标题
+          title: desc !== '欢迎和我预约' ? share_title + '《' + title + '》' : `【${title}】商家预约`,
-        desc: desc, // 分享描述
+          desc: desc,
-        link: link, // 分享链接
+          link: link,
-        imgUrl: imgUrl, // 分享图标
+          imgUrl: imgUrl,
           success: function() {
-          console.log('分享成功')
+            console.log('分享给朋友成功')
           },
           cancel: function() {
-          console.log('分享失败')
+            console.log('分享给朋友取消')
           }
         })
-      // 微信分享菜单测试
+
+        // 分享到朋友圈
         wx.updateTimelineShareData({
-        title: share_title + '《' + title + '》', // 分享标题
+          title: share_title + '《' + title + '》',
-        desc: desc, // 分享描述
+          link: link,
-        link: link, // 分享链接
+          imgUrl: imgUrl,
-        imgUrl: imgUrl, // 分享图标
           success: function() {
-          console.log('分享成功')
+            console.log('分享到朋友圈成功')
           },
           cancel: function() {
-          console.log('分享失败')
+            console.log('分享到朋友圈取消')
           }
         })
+
+        // 兼容旧版本（可选）
+        if (wx.onMenuShareAppMessage) {
           wx.onMenuShareAppMessage({
-        title: share_title + '《' + title + '》', // 分享标题
+            title: share_title + '《' + title + '》',
-        desc: desc, // 分享描述
+            desc: desc,
-        link: link, // 分享链接；在微信上分享时，该链接的域名必须与企业某个应用的可信域名一致
+            link: link,
-        imgUrl: imgUrl, // 分享图标
+            imgUrl: imgUrl,
             success: function() {
-          console.log('分享成功-企业') // 用户确认分享后执行的回调函数
+              console.log('分享成功-旧版')
             },
             cancel: function() {
-          // 用户取消分享后执行的回调函数
+              console.log('分享取消-旧版')
             }
           })
+        }
       })
-    wx.error(function(err) {
+    } else {
-      // $toastText('网络异常，请稍后重试')
+      console.error('wx.ready 不可用，请确保微信 JS-SDK 已正确加载')
-      console.log(JSON.stringify(err), '7777777777777')
+    }
-      // alert(JSON.stringify(err))
-    })
   }
 }
 

src/views/activity/activityPoster.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="poster-generator-container">
 
+
     <div class="input-card">
       <div class="card-header">
         <span class="header-icon">📋</span>
@@ -106,7 +107,7 @@
 
 import html2canvas from 'html2canvas'
 import { ImagePreview } from 'vant'
-import { $toastText, $toastSuccess, $toastLoading, $toastClear } from '@/config/toast'
+import { $toastClear, $toastLoading, $toastSuccess, $toastText } from '@/config/toast'
 import requestApp from '@/utils/request'
 import QRCode from 'qrcode'
 
@@ -125,14 +126,20 @@ export default {
       showActivityPicker: false,
       listLoading: false,
       listFinished: true,
-      openId: ''
+      openId: '',
+      wxConfigInitialized: false
       // 注意：qrcodeCanvas 作为 DOM 引用，通常在 mounted 中通过 this.$refs 访问
     }
   },
-  mounted() {
+  async mounted() {
-    // 替代 onMounted
     this.detectWeChatEnv()
-    this.getData()
+
+    // 如果在微信环境，先初始化微信配置
+    if (this.isWeChatEnv) {
+      await this.initWechatShare()
+    }
+
+    await this.getData()
     console.log('33')
   },
   computed: {
@@ -146,17 +153,29 @@ export default {
     }
   },
   methods: {
-    // 格式化标题：切割 · 符号，取最后一个
+    // 初始化微信分享
-    // formatTitle(title) {
+    async initWechatShare() {
-    //   if (!title) return ''
+      try {
-    //   // 按 · 分割，取最后一部分，并去除首尾空格
+        // 等待 store 中的 configData 加载完成
-    //   debugger
+        if (!this.$store.state.app.configData) {
-    //   const parts = title.split('·')
+          console.log('等待微信配置数据加载...')
-    //   console.log(parts)
+          // 可以设置一个延时等待，或者监听 store 变化
-    //   debugger
+          await new Promise(resolve => setTimeout(resolve, 500))
-    //   const lastPart = parts[parts.length - 1].trim()
+        }
-    //   return lastPart
+
-    // },
+        // 调用初始化方法
+        if (this.$initWechatConfig) {
+          await this.$initWechatConfig()
+          this.wxConfigInitialized = true
+          console.log('微信分享配置初始化成功')
+        } else {
+          console.error('$initWechatConfig 方法不存在')
+        }
+      } catch (err) {
+        console.error('微信分享配置初始化失败:', err)
+      }
+    },
+
 
     // 替代 script setup 中的函数
     async getData() {
@@ -164,20 +183,27 @@ export default {
       const vm = this
 
       this.listLoading = true
+      // 确保微信配置已初始化后再设置分享（可选）
+      if (this.isWeChatEnv && !this.wxConfigInitialized) {
+        await this.initWechatShare()
+      }
+
+      // 设置微信分享（在数据加载完成后）
+      this.setupWechatShare()
       // 注意：weXinShare 需要确保在 Vue 2 实例上下文中可用
-      vm.$nextTick(() => {
+      // vm.$nextTick(() => {
-        setTimeout(() => {
+      //   setTimeout(() => {
-          // if (vm.$store.state.app.configData) {
+      //     // if (vm.$store.state.app.configData) {
-          const urls = `${vm.$shareCallback}/api/official/live/wechat/FamilyAuth?from_openid=${localStorage.getItem('openid')}&merchant_id=${vm.$store.state.app.merchant_id}&spread_merchant_id=${vm.$store.state.app.spread_merchant_id}&url=` + encodeURIComponent(`${vm.$shareCallback}/pu/#/activityPoster`)
+      //     const urls = `${vm.$shareCallback}/api/official/live/wechat/FamilyAuth?from_openid=${localStorage.getItem('openid')}&merchant_id=${vm.$store.state.app.merchant_id}&spread_merchant_id=${vm.$store.state.app.spread_merchant_id}&url=` + encodeURIComponent(`${vm.$shareCallback}/pu/#/activityPoster`)
-          vm.$shareList(
+      //     vm.$shareList(
-            'https://image.fulllinkai.com/202310/28/88e931a50ec0a8094fb46191b389457e.png?x-oss-process=image/resize,w_200,h_200',
+      //       'https://image.fulllinkai.com/202310/28/88e931a50ec0a8094fb46191b389457e.png?x-oss-process=image/resize,w_200,h_200',
-            urls,
+      //       urls,
-            '查看详情',
+      //       '查看详情',
-            '活动海报生成「saas」'
+      //       '活动海报生成「saas」'
-          )
+      //     )
-          // }
+      //     // }
-        }, 300)
+      //   }, 300)
-      })
+      // })
       // vm.$shareList('https://image.fulllinkai.com/202310/28/88e931a50ec0a8094fb46191b389457e.png',
       //   `https://health.ufutx.cn/go_html/role_apply#/activityPoster`,
       //   '查看详情', '活动海报生成「saas」')
@@ -204,6 +230,22 @@ export default {
         $toastClear()
       }
     },
+    // 设置微信分享内容
+    setupWechatShare() {
+      if (!this.isWeChatEnv) return
+
+      const shareUrl = `${this.$shareCallback}/api/official/live/wechat/FamilyAuth?from_openid=${localStorage.getItem('openid')}&merchant_id=${this.$store.state.app.merchant_id}&spread_merchant_id=${this.$store.state.app.spread_merchant_id}&url=` + encodeURIComponent(`${this.$shareCallback}/pu/#/activityPoster`)
+
+      // 延迟执行，确保 wx 已配置
+      setTimeout(() => {
+        this.$shareList(
+          'https://image.fulllinkai.com/202310/28/88e931a50ec0a8094fb46191b389457e.png?x-oss-process=image/resize,w_200,h_200',
+          shareUrl,
+          '查看详情',
+          '活动海报生成「saas」'
+        )
+      }, 300)
+    },
 
     detectWeChatEnv() {
       const userAgent = navigator.userAgent.toLowerCase()
@@ -413,6 +455,7 @@ img {
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
 .poster-subtitle {
   position: absolute;
   left: 0;
@@ -439,12 +482,12 @@ img {
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
 .sponsor-name {
   position: absolute;
   left: 0;
   top: 446px;
   width: 100%;
-  letter-spacing: 0.8px;
   display: flex;
   justify-content: center;
   padding: 0;
@@ -453,6 +496,8 @@ img {
 .sponsor-name .name {
   font-size: 14px;
   color: #0e2965;
+
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
 }
 
 .poster-qrcode {
@@ -489,7 +534,6 @@ img {
   font-weight: 500;
   color: #0e2866;
 }
-
 .poster-time {
   font-weight: 400;
   font-size: 22px;
@@ -548,7 +592,6 @@ img {
   flex-direction: column;
   align-items: center;
   gap: 24px;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
 }
 
 /* 输入卡片 */