Kaynağa Gözat

feat: 短剧组推广 - 企微跳转小程序demo

zhengxy 2 yıl önce
ebeveyn
işleme
e56f24f254

+ 7 - 7
project/src/components/manage/playletManageV2/dialog/playletSendDialog.vue

@@ -35,8 +35,8 @@
35 35
           <el-radio :label="0">小程序</el-radio>
36 36
         </el-radio-group>
37 37
       </div>
38
-      <div v-if="isShowMiniApp" class="form-item">
39
-        <span class="lable"><em>*</em>小程序</span>
38
+      <div class="form-item">
39
+        <span class="lable"><em v-if="isShowMiniApp">*</em>小程序</span>
40 40
         <el-select v-model="form.mini_app_id" size="small" placeholder="请选择小程序" clearable filterable>
41 41
           <el-option v-for="item in miniProOptions" :key="item.app_id" :label="item.app_name" :value="item.app_id" />
42 42
         </el-select>
@@ -60,10 +60,10 @@ export default {
60 60
       type: Boolean,
61 61
       default: () => false
62 62
     },
63
-    // 标题
64
-    title: {
65
-      type: String,
66
-      default: () => '剧集群发'
63
+    // 是否为“加入剧组”
64
+    isCreateGroup: {
65
+      type: Boolean,
66
+      default: () => false
67 67
     },
68 68
     // 剧集信息
69 69
     playletInfo: {
@@ -90,7 +90,7 @@ export default {
90 90
   computed: {
91 91
     // 弹框标题
92 92
     dialogTitle() {
93
-      return `${this.title}${this.playletInfo.name ? ('-' + this.playletInfo.name) : ''}`
93
+      return `${this.isCreateGroup ? '加入剧组' : '剧集群发'}${this.playletInfo.name ? ('-' + this.playletInfo.name) : ''}`
94 94
     },
95 95
     // 控制是否展示"小程序"
96 96
     isShowMiniApp() {

+ 4 - 4
project/src/components/manage/playletManageV2/playletManage.vue

@@ -63,7 +63,7 @@
63 63
     <playletSendDialog
64 64
       :dialogVisible="playletSendDialogVisible"
65 65
       :playletInfo="currentPlayletInfo"
66
-      :title="currentDialogTitle"
66
+      :isCreateGroup="isCreateGroup"
67 67
       @confirm="handlePlayletSendConfirm"
68 68
       @cancel="handlePlayletSendCancel"
69 69
     />
@@ -115,7 +115,7 @@ export default {
115 115
       playletSendDialogVisible: false, // 控制"添加账号"弹框显示
116 116
       currentPlayletInfo: {}, // 当前编辑的账号信息
117 117
       currentJumpRoutePath: '', // 当前路由跳转路径 创建群发 & 创建欢迎语
118
-      currentDialogTitle: '', // 当前操作的标题
118
+      isCreateGroup: false, // 当前操作是否为“加入剧组”
119 119
 
120 120
       playletList_selected: [], // 当前已选的短剧列表数据
121 121
       groupDialogVisible: false, // 控制"创建组"弹框显示
@@ -210,14 +210,14 @@ export default {
210 210
     // S 创建群发、"创建欢迎语"
211 211
     // 监听点击"创建群发"、"创建欢迎语"
212 212
     onClickCreateSend(playletInfo, { jumpPath }) {
213
-      this.currentDialogTitle = '剧集群发'
213
+      this.isCreateGroup = false
214 214
       this.currentPlayletInfo = playletInfo
215 215
       this.currentJumpRoutePath = jumpPath
216 216
       this.playletSendDialogVisible = true
217 217
     },
218 218
     // 监听点击“加入剧组”
219 219
     onClickSelectPlaylet(playletInfo) {
220
-      this.currentDialogTitle = '加入剧组'
220
+      this.isCreateGroup = true
221 221
       this.currentPlayletInfo = playletInfo
222 222
       this.currentJumpRoutePath = ''
223 223
       this.playletSendDialogVisible = true

+ 2 - 2
qwh5/src/utils/getWxConfig.ts

@@ -38,7 +38,7 @@ export function initQYConfig(authInfo, cb) { // 企业
38 38
     timestamp: authInfo.timestamp, // 必填,生成签名的时间戳
39 39
     nonceStr: authInfo.nonce_str, // 必填,生成签名的随机串
40 40
     signature: authInfo.signature, // 必填,签名,见 附录-JS-SDK使用权限签名算法 企业签名
41
-    jsApiList: ['getCurExternalContact','sendChatMessage','getCurExternalContact', 'openUserProfile', 'shareToExternalChat'] // 必填,需要使用的JS接口列表,凡是要调用的接口都需要传进来
41
+    jsApiList: ['getCurExternalContact','sendChatMessage','getCurExternalContact', 'openUserProfile', 'shareToExternalChat', 'launchMiniprogram'] // 必填,需要使用的JS接口列表,凡是要调用的接口都需要传进来
42 42
   })
43 43
   wx.ready(function (res) {
44 44
     console.log(res, 'QYready')
@@ -58,7 +58,7 @@ function initYYConfig(authInfo, cb) { // 应用
58 58
     timestamp: authInfo.timestamp, // 必填,生成签名的时间戳
59 59
     nonceStr: authInfo.nonce_str, // 必填,生成签名的随机串
60 60
     signature: authInfo.app_signature, // 必填,签名,见附录-JS-SDK使用权限签名算法  应用签名
61
-    jsApiList: ['getCurExternalContact','sendChatMessage','getCurExternalContact', 'openUserProfile', 'shareToExternalChat'], // 必填,传入需要使用的接口名称
61
+    jsApiList: ['getCurExternalContact','sendChatMessage','getCurExternalContact', 'openUserProfile', 'shareToExternalChat', 'launchMiniprogram'], // 必填,传入需要使用的接口名称
62 62
     success: function (res) {
63 63
       console.log(res, 'YYready')
64 64
       cb ? cb(authInfo) : ''

+ 38 - 23
qwh5/src/views/playletGroupH5.vue

@@ -1,6 +1,6 @@
1 1
 <template>
2 2
   <div class="playlet-group-wrap">
3
-    <van-list
3
+    <!-- <van-list
4 4
       v-model:loading="playletGroup.loading"
5 5
       :finished="playletGroup.finished"
6 6
       finished-text="没有更多了"
@@ -11,7 +11,8 @@
11 11
         <div class="p-name">{{ item.name }}</div>
12 12
         <van-image class="p-img" :src="item.avatar" radius="10" fit="cover" />
13 13
       </div>
14
-    </van-list>
14
+    </van-list> -->
15
+    <button @click="onClickMiniapp">跳转小程序</button>
15 16
   </div>
16 17
 </template>
17 18
 
@@ -35,29 +36,29 @@ const params = reactive({
35 36
   user_id: getQueryString('user_id'),
36 37
 })
37 38
 
38
-// onBeforeMount(() => {//组件挂载之前
39
-//   if (getQueryString('againJump')) {
40
-//     params.corpid = getQueryString('corpid')
41
-//     params.rule_id = getQueryString('rule_id')
42
-//     params.user_id = getQueryString('user_id')
43
-//     getWxConfig(() => {
44
-//       // handleGetSopDetail()
45
-//     });
46
-//   } else {//获取用户信息
47
-//     getWxConfig('', (authInfo) => {
48
-//       let redirect_uri = encodeURIComponent(window.location.href + '&againJump=true')
49
-//       let url = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${authInfo.corpid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_base&state=1&agentid=${authInfo.agent_id}#wechat_redirect`;
50
-//       let link = document.createElement("a");
51
-//       link.href = url;
52
-//       document.body.appendChild(link);
53
-//       link.click();
54
-//       document.body.removeChild(link);
55
-//     });
56
-//   }
57
-// });
39
+onBeforeMount(() => {//组件挂载之前
40
+  if (getQueryString('againJump')) {
41
+    params.corpid = getQueryString('corpid')
42
+    params.rule_id = getQueryString('rule_id')
43
+    params.user_id = getQueryString('user_id')
44
+    getWxConfig(() => {
45
+      // handleGetPlayletGroup()
46
+    });
47
+  } else {//获取用户信息
48
+    getWxConfig('', (authInfo) => {
49
+      let redirect_uri = encodeURIComponent(window.location.href + '&againJump=true')
50
+      let url = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${authInfo.corpid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_base&state=1&agentid=${authInfo.agent_id}#wechat_redirect`;
51
+      let link = document.createElement("a");
52
+      link.href = url;
53
+      document.body.appendChild(link);
54
+      link.click();
55
+      document.body.removeChild(link);
56
+    });
57
+  }
58
+});
58 59
 
59 60
 onMounted(() => {
60
-  handleGetPlayletGroup()
61
+  // handleGetPlayletGroup()
61 62
 })
62 63
 
63 64
 
@@ -102,6 +103,20 @@ const handleGetPlayletGroup = async () => {
102 103
   }
103 104
 }
104 105
 
106
+const onClickMiniapp = () => {
107
+  wx.invoke('launchMiniprogram', {
108
+      "appid" : "wx34a41e0e17327363", // 需跳转的小程序appid
109
+      "path" : "/pages/index/index.html?pathId=63856f98b86c030805fad962", // 所需跳转的小程序内页面路径及参数。非必填
110
+    }, function(res) {
111
+      if(res.err_msg == "launchMiniprogram:ok") {
112
+        // 正常
113
+      } else {
114
+        // 错误处理
115
+      }
116
+    }
117
+  );
118
+}
119
+
105 120
 </script>
106 121
 
107 122
 <style lang="scss" scoped>