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

project/src/components/manage/playletManageV2/dialog/playletSendDialog.vue

           <el-radio :label="0">小程序</el-radio>
         </el-radio-group>
       </div>
-      <div v-if="isShowMiniApp" class="form-item">
-        <span class="lable"><em>*</em>小程序</span>
+      <div class="form-item">
+        <span class="lable"><em v-if="isShowMiniApp">*</em>小程序</span>
         <el-select v-model="form.mini_app_id" size="small" placeholder="请选择小程序" clearable filterable>
           <el-option v-for="item in miniProOptions" :key="item.app_id" :label="item.app_name" :value="item.app_id" />
         </el-select>
       type: Boolean,
       default: () => false
     },
-    // 标题
-    title: {
-      type: String,
-      default: () => '剧集群发'
+    // 是否为“加入剧组”
+    isCreateGroup: {
+      type: Boolean,
+      default: () => false
     },
     // 剧集信息
     playletInfo: {
   computed: {
     // 弹框标题
     dialogTitle() {
-      return `${this.title}${this.playletInfo.name ? ('-' + this.playletInfo.name) : ''}`
+      return `${this.isCreateGroup ? '加入剧组' : '剧集群发'}${this.playletInfo.name ? ('-' + this.playletInfo.name) : ''}`
     },
     // 控制是否展示"小程序"
     isShowMiniApp() {

project/src/components/manage/playletManageV2/playletManage.vue

     <playletSendDialog
       :dialogVisible="playletSendDialogVisible"
       :playletInfo="currentPlayletInfo"
-      :title="currentDialogTitle"
+      :isCreateGroup="isCreateGroup"
       @confirm="handlePlayletSendConfirm"
       @cancel="handlePlayletSendCancel"
     />
       playletSendDialogVisible: false, // 控制"添加账号"弹框显示
       currentPlayletInfo: {}, // 当前编辑的账号信息
       currentJumpRoutePath: '', // 当前路由跳转路径 创建群发 & 创建欢迎语
-      currentDialogTitle: '', // 当前操作的标题
+      isCreateGroup: false, // 当前操作是否为“加入剧组”
 
       playletList_selected: [], // 当前已选的短剧列表数据
       groupDialogVisible: false, // 控制"创建组"弹框显示
     // S 创建群发、"创建欢迎语"
     // 监听点击"创建群发"、"创建欢迎语"
     onClickCreateSend(playletInfo, { jumpPath }) {
-      this.currentDialogTitle = '剧集群发'
+      this.isCreateGroup = false
       this.currentPlayletInfo = playletInfo
       this.currentJumpRoutePath = jumpPath
       this.playletSendDialogVisible = true
     },
     // 监听点击“加入剧组”
     onClickSelectPlaylet(playletInfo) {
-      this.currentDialogTitle = '加入剧组'
+      this.isCreateGroup = true
       this.currentPlayletInfo = playletInfo
       this.currentJumpRoutePath = ''
       this.playletSendDialogVisible = true

qwh5/src/utils/getWxConfig.ts

     timestamp: authInfo.timestamp, // 必填，生成签名的时间戳
     nonceStr: authInfo.nonce_str, // 必填，生成签名的随机串
     signature: authInfo.signature, // 必填，签名，见 附录-JS-SDK使用权限签名算法 企业签名
-    jsApiList: ['getCurExternalContact','sendChatMessage','getCurExternalContact', 'openUserProfile', 'shareToExternalChat'] // 必填，需要使用的JS接口列表，凡是要调用的接口都需要传进来
+    jsApiList: ['getCurExternalContact','sendChatMessage','getCurExternalContact', 'openUserProfile', 'shareToExternalChat', 'launchMiniprogram'] // 必填，需要使用的JS接口列表，凡是要调用的接口都需要传进来
   })
   wx.ready(function (res) {
     console.log(res, 'QYready')
     timestamp: authInfo.timestamp, // 必填，生成签名的时间戳
     nonceStr: authInfo.nonce_str, // 必填，生成签名的随机串
     signature: authInfo.app_signature, // 必填，签名，见附录-JS-SDK使用权限签名算法  应用签名
-    jsApiList: ['getCurExternalContact','sendChatMessage','getCurExternalContact', 'openUserProfile', 'shareToExternalChat'], // 必填，传入需要使用的接口名称
+    jsApiList: ['getCurExternalContact','sendChatMessage','getCurExternalContact', 'openUserProfile', 'shareToExternalChat', 'launchMiniprogram'], // 必填，传入需要使用的接口名称
     success: function (res) {
       console.log(res, 'YYready')
       cb ? cb(authInfo) : ''

qwh5/src/views/playletGroupH5.vue

 <template>
   <div class="playlet-group-wrap">
-    <van-list
+    <!-- <van-list
       v-model:loading="playletGroup.loading"
       :finished="playletGroup.finished"
       finished-text="没有更多了"
         <div class="p-name">{{ item.name }}</div>
         <van-image class="p-img" :src="item.avatar" radius="10" fit="cover" />
       </div>
-    </van-list>
+    </van-list> -->
+    <button @click="onClickMiniapp">跳转小程序</button>
   </div>
 </template>
 
   user_id: getQueryString('user_id'),
 })
 
-// onBeforeMount(() => {//组件挂载之前
-//   if (getQueryString('againJump')) {
-//     params.corpid = getQueryString('corpid')
-//     params.rule_id = getQueryString('rule_id')
-//     params.user_id = getQueryString('user_id')
-//     getWxConfig(() => {
-//       // handleGetSopDetail()
-//     });
-//   } else {//获取用户信息
-//     getWxConfig('', (authInfo) => {
-//       let redirect_uri = encodeURIComponent(window.location.href + '&againJump=true')
-//       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`;
-//       let link = document.createElement("a");
-//       link.href = url;
-//       document.body.appendChild(link);
-//       link.click();
-//       document.body.removeChild(link);
-//     });
-//   }
-// });
+onBeforeMount(() => {//组件挂载之前
+  if (getQueryString('againJump')) {
+    params.corpid = getQueryString('corpid')
+    params.rule_id = getQueryString('rule_id')
+    params.user_id = getQueryString('user_id')
+    getWxConfig(() => {
+      // handleGetPlayletGroup()
+    });
+  } else {//获取用户信息
+    getWxConfig('', (authInfo) => {
+      let redirect_uri = encodeURIComponent(window.location.href + '&againJump=true')
+      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`;
+      let link = document.createElement("a");
+      link.href = url;
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+    });
+  }
+});
 
 onMounted(() => {
-  handleGetPlayletGroup()
+  // handleGetPlayletGroup()
 })
 
 
   }
 }
 
+const onClickMiniapp = () => {
+  wx.invoke('launchMiniprogram', {
+      "appid" : "wx34a41e0e17327363", // 需跳转的小程序appid
+      "path" : "/pages/index/index.html?pathId=63856f98b86c030805fad962", // 所需跳转的小程序内页面路径及参数。非必填
+    }, function(res) {
+      if(res.err_msg == "launchMiniprogram:ok") {
+        // 正常
+      } else {
+        // 错误处理
+      }
+    }
+  );
+}
+
 </script>
 
 <style lang="scss" scoped>