feat: 授权测试

project.config.json

@@ -2,7 +2,7 @@
   "miniprogramRoot": "miniprogram/",
   "pluginRoot": "plugin/",
   "compileType": "plugin",
-  "appid": "wxf7261ed54f2e450e",
+  "appid": "wx58cb402db1e94bb7",
   "projectname": "wx-custom-plugin",
   "description": "",
   "setting": {
@@ -21,7 +21,7 @@
     },
     "condition": false
   },
-  "pluginAppid": "wxf7261ed54f2e450e",
+  "pluginAppid": "wx58cb402db1e94bb7",
   "libVersion": "3.2.0",
   "srcMiniprogramRoot": "miniprogram/",
   "packOptions": {

src/app.config.ts

@@ -2,6 +2,9 @@ export default {
   pages: [
     'pages/index/index'
   ],
+  functionalPages: {
+    independent: true
+  },
   window: {
     backgroundTextStyle: 'light',
     navigationBarBackgroundColor: '#fff',
@@ -11,7 +14,7 @@ export default {
   plugins: {
     myPlugin: {
       version: 'dev',
-      provider: 'wxf7261ed54f2e450e'
+      provider: 'wx58cb402db1e94bb7'
     }
   }
 }

src/plugin/components/custom/index.less

@@ -0,0 +1,3 @@
+view {
+  width: 100vw;
+}

src/plugin/components/custom/index.tsx

@@ -1,5 +1,5 @@
-import Taro from '@tarojs/taro'
-import { View, Video, Navigator, Button } from '@tarojs/components'
+import Taro, { useLoad, useReady } from '@tarojs/taro'
+import { View, Video, Navigator, Button, FunctionalPageNavigator } from '@tarojs/components'
 import React from 'react'
 import './index.less'
 
@@ -8,23 +8,84 @@ const Custom: React.FC = () => {
 
   }
 
+  useReady(async () => {
+    // Taro.getSetting({
+    //   success(res) {
+    //     console.log('getSetting', res)
+    //   }
+    // })
+
+    // Taro.getUserInfo({
+    //   withCredentials: true,
+    //   success(res) {
+    //     console.log('success', res)
+    //   },
+    //   fail(res) {
+    //     console.log('fail', res)
+    //   }
+    // })
+
+    const systemInfo = await Taro.getNetworkType()
+    console.log(systemInfo)
+
+    // Taro.login({
+    //   success(res) {
+    //     console.log('success', res)
+    //   },
+    //   fail(res) {
+    //     console.log('fail', res)
+    //   }
+    // })
+  })
+
+  function clickPayment() {
+    console.log('支付')
+    wx.requestPluginPayment({
+      version: 'develop',
+      fee: 1,
+      success(res) {
+        console.log('success', res)
+      },
+      fail(res) {
+        console.log('fail', res)
+      }
+    })
+  }
+
+  function loginSuccess(res) {
+    console.log(res)
+  }
+
+  function loginFail(res) {
+    console.log(res)
+  }
+
   return (
     <View onClick={clickCustom}>
-      <Navigator url='plugin-private://wxf7261ed54f2e450e/pages/h5/index'>
+      <Navigator url='plugin-private://wx58cb402db1e94bb7/pages/h5/index'>
         <Button>H5</Button>
       </Navigator>
 
-      <Navigator url='plugin-private://wxf7261ed54f2e450e/pages/miniWeb/index'>
+      <Navigator url='plugin-private://wx58cb402db1e94bb7/pages/miniWeb/index'>
         <Button>半屏</Button>
       </Navigator>
 
-      <Navigator url='plugin-private://wxf7261ed54f2e450e/pages/webview/index'>
+      <Navigator url='plugin-private://wx58cb402db1e94bb7/pages/webview/index'>
         <Button>全屏</Button>
       </Navigator>
 
-      <Navigator url='plugin-private://wxf7261ed54f2e450e/pages/webview/index'>
+      {/* <Navigator url='plugin-private://wx58cb402db1e94bb7/pages/webview/index'>
         <Video autoplay controls={false} loop src='https://xycdn.yishihui.com/ad/prod/video/material_AD_1700025739_1700025739924.mp4' />
-      </Navigator>
+      </Navigator> */}
+      <Button onClick={clickPayment}>支付</Button>
+      {/* <FunctionalPageNavigator
+        name="loginAndGetUserInfo"
+        version="develop"
+        onSuccess={loginSuccess}
+        onFail={loginFail}
+      >
+        <Button className="login">登录到插件</Button>
+      </FunctionalPageNavigator> */}
     </View>
   )
 }

src/plugin/pages/miniWeb/index.less

@@ -0,0 +1,66 @@
+.mini-web {
+  width: 100vw;
+  height: 100vh;
+  position: relative;
+
+  .modal {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    left: 0;
+    background: rgba(0, 0, 0, .2);
+
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    animation-name: fadeIn;
+    animation-duration: 1s;
+    // animation-fill-mode: both;
+
+    .modal-content {
+      background: #fff;
+      width: 600rpx;
+      height: 300rpx;
+      border-radius: 10rpx;
+    }
+
+    .modal-body {
+      height: 200rpx;
+      line-height: 200rpx;
+      text-align: center;
+      font-weight: 500;
+      font-size: 35rpx;
+    }
+
+    .modal-footer {
+      display: flex;
+      height: 100rpx;
+
+      .button {
+        height: 100rpx;
+        line-height: 100rpx;
+        flex: 1;
+        text-align: center;
+        border-top: 2px solid #e3e0e0;
+        font-weight: 500;
+        font-size: 35rpx;
+      }
+
+      .confirm {
+        border-left: 2px solid #e3e0e0;
+        color: #3a5dcf
+      }
+    }
+  }
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}

src/plugin/pages/miniWeb/index.tsx

@@ -1,15 +1,24 @@
 import Taro from '@tarojs/taro'
 import { View } from '@tarojs/components'
-import React from 'react'
+import React, { useState } from 'react'
 import './index.less'
-import { useDidShow } from '@tarojs/taro'
+import { useDidShow, useUnload } from '@tarojs/taro'
+let count = 0
 
 const MiniWeb: React.FC = () => {
+  const [showModal, setShowModal] = useState(false)
+
   useDidShow(() => {
-    Taro.openEmbeddedMiniProgram({
-      appId: 'wx89e7eb06478361d7',
-      path: 'pages/category'
-    })
+    count++
+    if (count < 2) {
+      setShowModal(true)
+    } else {
+      Taro.navigateBack()
+    }
+  })
+
+  useUnload(() => {
+    count = 0
   })
 
   function btnClick() {
@@ -19,9 +28,28 @@ const MiniWeb: React.FC = () => {
     })
   }
 
+  function onCancel() {
+    Taro.navigateBack()
+  }
+
+  function onConfirm() {
+    setShowModal(false)
+    btnClick()
+  }
+
   return (
-    <View>
-      <button onClick={btnClick}>点击</button>
+    <View className='mini-web'>
+      {showModal && <View className='modal'>
+        <View className='modal-content'>
+          <View className='modal-body'>
+            是否打开半屏小程序
+          </View>
+          <View className='modal-footer'>
+            <View className='button cancel' onClick={onCancel}>取消</View>
+            <View className='button confirm' onClick={onConfirm}>确认</View>
+          </View>
+        </View>
+      </View>}
       半屏小程序
     </View>
   )

src/plugin/plugin.json

@@ -7,5 +7,5 @@
     "miniWeb": "pages/miniWeb/index",
     "h5": "pages/h5/index"
   },
-    "main": "index.ts"
-  }
+  "main": "index.ts"
+}

types/global.d.ts

@@ -22,3 +22,5 @@ declare namespace JSX {
     custom: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>
   }
 }
+
+declare const wx