wip(mp): mp-alipay

packages/uni-cli-shared/src/vue/utils.ts

@@ -2,6 +2,8 @@ import { isComponentTag } from '@dcloudio/uni-shared'
 import {
   AttributeNode,
   ComponentNode,
+  createSimpleExpression,
+  DirectiveNode,
   ElementNode,
   ElementTypes,
   isCoreComponent,
@@ -66,3 +68,26 @@ export function addStaticClass(node: ElementNode, clazz: string) {
     content: clazz,
   }
 }
+
+function createDirectiveNode(
+  name: string,
+  arg: string,
+  exp: string
+): DirectiveNode {
+  return {
+    type: NodeTypes.DIRECTIVE,
+    name,
+    modifiers: [],
+    loc: locStub,
+    arg: createSimpleExpression(arg, true),
+    exp: createSimpleExpression(exp, false),
+  }
+}
+
+export function createOnDirectiveNode(name: string, value: string) {
+  return createDirectiveNode('on', name, value)
+}
+
+export function createBindDirectiveNode(name: string, value: string) {
+  return createDirectiveNode('bind', name, value)
+}

packages/uni-mp-alipay/__tests__/vOn.spec.ts

 import { assert } from './testUtils'
 
 describe('mp-alipay: transform v-on', () => {
+  test('getphonenumber', () => {
+    assert(
+      `<button open-type='getPhoneNumber' @getphonenumber="getPhoneNumber">获取手机号</button>`,
+      `<button open-type="getAuthorize" scope="phoneNumber" onGetAuthorize="{{a}}" onError="{{b}}">获取手机号</button>`,
+      `(_ctx, _cache) => {
+  return { a: _o($event => _ctx.$onAliGetAuthorize('getPhoneNumber', $event)), b: _o($event => _ctx.$onAliAuthError('getPhoneNumber', $event)) }
+}`
+    )
+  })
   test('basic', () => {
     assert(
       `<view v-on:click="onClick"/>`,

packages/uni-mp-alipay/dist/uni.compiler.js

@@ -87,6 +87,43 @@ const eventMap = {
     animationfinish: 'animationEnd',
 };
 
+function transformOpenType(node) {
+    var _a;
+    if (node.type !== 1 /* ELEMENT */ || node.tag !== 'button') {
+        return;
+    }
+    const openTypeProp = compilerCore.findProp(node, 'open-type');
+    if (!openTypeProp) {
+        return;
+    }
+    if (openTypeProp.type !== 6 /* ATTRIBUTE */ ||
+        ((_a = openTypeProp.value) === null || _a === void 0 ? void 0 : _a.content) !== 'getPhoneNumber') {
+        return;
+    }
+    openTypeProp.value.content = 'getAuthorize';
+    const { props } = node;
+    props.splice(props.indexOf(openTypeProp) + 1, 0, uniCliShared.createAttributeNode('scope', 'phoneNumber'));
+    let getPhoneNumberMethodName = '';
+    const getPhoneNumberPropIndex = props.findIndex((prop) => {
+        if (prop.type === 7 /* DIRECTIVE */ && prop.name === 'on') {
+            const { arg, exp } = prop;
+            if ((arg === null || arg === void 0 ? void 0 : arg.type) === 4 /* SIMPLE_EXPRESSION */ &&
+                (exp === null || exp === void 0 ? void 0 : exp.type) === 4 /* SIMPLE_EXPRESSION */ &&
+                arg.isStatic &&
+                arg.content === 'getphonenumber') {
+                getPhoneNumberMethodName = exp.content;
+                return true;
+            }
+        }
+    });
+    if (!getPhoneNumberMethodName) {
+        return;
+    }
+    props.splice(getPhoneNumberPropIndex, 1);
+    props.push(uniCliShared.createOnDirectiveNode('getAuthorize', `$onAliGetAuthorize('${getPhoneNumberMethodName}',$event)`));
+    props.push(uniCliShared.createOnDirectiveNode('error', `$onAliAuthError('${getPhoneNumberMethodName}',$event)`));
+}
+
 const projectConfigFilename = 'mini.project.json';
 const miniProgram = {
     event,
@@ -103,6 +140,7 @@ const miniProgram = {
 // TODO getPhoneNumber 等事件
 const nodeTransforms = [
     transformRef,
+    transformOpenType,
     uniCliShared.createTransformComponentLink(uniCliShared.COMPONENT_ON_LINK, 6 /* ATTRIBUTE */),
 ];
 const tags = [

packages/uni-mp-alipay/src/compiler/options.ts

@@ -9,6 +9,7 @@ import { UniMiniProgramPluginOptions } from '@dcloudio/uni-mp-vite'
 import source from './mini.project.json'
 import { transformRef } from './transforms/transformRef'
 import { event } from './event'
+import { transformOpenType } from './transforms/transformOpenType'
 
 const projectConfigFilename = 'mini.project.json'
 
@@ -27,6 +28,7 @@ export const miniProgram: MiniProgramCompilerOptions = {
 // TODO getPhoneNumber 等事件
 export const nodeTransforms = [
   transformRef,
+  transformOpenType,
   createTransformComponentLink(COMPONENT_ON_LINK, NodeTypes.ATTRIBUTE),
 ]
 export const tags = [

packages/uni-mp-alipay/src/compiler/transforms/transformOpenType.ts

+import {
+  findProp,
+  NodeTypes,
+  RootNode,
+  TemplateChildNode,
+} from '@vue/compiler-core'
+import {
+  createAttributeNode,
+  createOnDirectiveNode,
+} from '@dcloudio/uni-cli-shared'
+
+export function transformOpenType(node: RootNode | TemplateChildNode) {
+  if (node.type !== NodeTypes.ELEMENT || node.tag !== 'button') {
+    return
+  }
+  const openTypeProp = findProp(node, 'open-type')
+  if (!openTypeProp) {
+    return
+  }
+  if (
+    openTypeProp.type !== NodeTypes.ATTRIBUTE ||
+    openTypeProp.value?.content !== 'getPhoneNumber'
+  ) {
+    return
+  }
+  openTypeProp.value.content = 'getAuthorize'
+  const { props } = node
+  props.splice(
+    props.indexOf(openTypeProp) + 1,
+    0,
+    createAttributeNode('scope', 'phoneNumber')
+  )
+  let getPhoneNumberMethodName = ''
+  const getPhoneNumberPropIndex = props.findIndex((prop) => {
+    if (prop.type === NodeTypes.DIRECTIVE && prop.name === 'on') {
+      const { arg, exp } = prop
+      if (
+        arg?.type === NodeTypes.SIMPLE_EXPRESSION &&
+        exp?.type === NodeTypes.SIMPLE_EXPRESSION &&
+        arg.isStatic &&
+        arg.content === 'getphonenumber'
+      ) {
+        getPhoneNumberMethodName = exp.content
+        return true
+      }
+    }
+  })
+  if (!getPhoneNumberMethodName) {
+    return
+  }
+  props.splice(getPhoneNumberPropIndex, 1)
+  props.push(
+    createOnDirectiveNode(
+      'getAuthorize',
+      `$onAliGetAuthorize('${getPhoneNumberMethodName}',$event)`
+    )
+  )
+  props.push(
+    createOnDirectiveNode(
+      'error',
+      `$onAliAuthError('${getPhoneNumberMethodName}',$event)`
+    )
+  )
+}

packages/uni-mp-compiler/src/ast.ts

@@ -27,12 +27,8 @@ import {
 } from '@babel/types'
 import {
   createCompilerError,
-  createSimpleExpression,
-  DirectiveNode,
   ErrorCodes,
   ExpressionNode,
-  locStub,
-  NodeTypes,
 } from '@vue/compiler-core'
 import { CodegenScope, CodegenVIfScope } from './options'
 import { TransformContext } from './transform'
@@ -150,26 +146,3 @@ export function parseStringLiteral(
   }
   return stringLiteral('')
 }
-
-function createDirectiveNode(
-  name: string,
-  arg: string,
-  exp: string
-): DirectiveNode {
-  return {
-    type: NodeTypes.DIRECTIVE,
-    name,
-    modifiers: [],
-    loc: locStub,
-    arg: createSimpleExpression(arg, true),
-    exp: createSimpleExpression(exp, false),
-  }
-}
-
-export function createOnDirectiveNode(name: string, value: string) {
-  return createDirectiveNode('on', name, value)
-}
-
-export function createBindDirectiveNode(name: string, value: string) {
-  return createDirectiveNode('bind', name, value)
-}

packages/uni-mp-compiler/src/transforms/transformComponent.ts

 import { ComponentNode } from '@vue/compiler-core'
-import { createAttributeNode, isUserComponent } from '@dcloudio/uni-cli-shared'
+import {
+  createAttributeNode,
+  createBindDirectiveNode,
+  isUserComponent,
+} from '@dcloudio/uni-cli-shared'
 import { isVForScope, NodeTransform, TransformContext } from '../transform'
-import { createBindDirectiveNode } from '../ast'
 import { ATTR_VUE_ID } from './utils'
 
 export const transformComponent: NodeTransform = (node, context) => {

packages/uni-mp-compiler/src/transforms/vModel.ts

+import { camelize } from '@vue/shared'
 import {
   Property,
   transformModel as baseTransform,
@@ -13,9 +14,12 @@ import {
   TransformContext as VueTransformContext,
 } from '@vue/compiler-core'
 import { DOMErrorCodes, createDOMCompilerError } from '@vue/compiler-dom'
-import { camelize } from '@vue/shared'
-import { V_ON } from '..'
-import { createBindDirectiveNode, createOnDirectiveNode } from '../ast'
+
+import {
+  createBindDirectiveNode,
+  createOnDirectiveNode,
+} from '@dcloudio/uni-cli-shared'
+import { V_ON } from '../runtimeHelpers'
 import { genExpr } from '../codegen'
 import { TransformContext } from '../transform'
 import { DirectiveTransformResult } from './transformElement'

packages/uni-mp-compiler/src/transforms/vSlot.ts

@@ -25,9 +25,12 @@ import {
   TemplateChildNode,
   TemplateNode,
 } from '@vue/compiler-core'
-import { isUserComponent } from '@dcloudio/uni-cli-shared'
+import {
+  createBindDirectiveNode,
+  isUserComponent,
+} from '@dcloudio/uni-cli-shared'
 import { WITH_SCOPED_SLOT } from '../runtimeHelpers'
-import { createBindDirectiveNode, parseExpr } from '../ast'
+import { parseExpr } from '../ast'
 import { genExpr } from '../codegen'
 import { CodegenScope, CodegenVForScope } from '../options'
 import { isVForScope, NodeTransform, TransformContext } from '../transform'