fix: v3-app 调整picker组件

src/platforms/app-plus/view/components/picker/index.vue

@@ -21,6 +21,24 @@ const fields = {
   MONTH: 'month',
   DAY: 'day'
 }
+function padLeft (num) {
+  return num > 9 ? num : (`0${num}`)
+}
+function getDate (str, mode_) {
+  const date = new Date()
+  if (mode_ === mode.TIME) {
+    str = str.split(':')
+    if (str.length === 2) {
+      date.setHours(parseInt(str[0]), parseInt(str[1]))
+    }
+  } else {
+    str = str.split('-')
+    if (str.length === 3) {
+      date.setFullYear(parseInt(str[0]), parseInt(str[1] - 1), parseInt(str[2]))
+    }
+  }
+  return date
+}
 export default {
   name: 'Picker',
   mixins: [emitter],
@@ -131,40 +149,54 @@ export default {
       this._showPicker(Object.assign({}, this.$props))
     },
     _showPicker (data) {
-      if (this.page) {
-        return
-      }
-      let res = { event: 'cancel' }
-      this.page = showPage({
-        url: '__uniapppicker',
-        data,
-        style: {
-          titleNView: false,
-          animationType: 'none',
-          animationDuration: 0,
-          background: 'rgba(0,0,0,0)',
-          popGesture: 'none'
-        },
-        onMessage: (message) => {
-          const event = message.event
-          if (event === 'created') {
-            this._updatePicker(data)
-            return
-          }
-          if (event === 'columnchange') {
-            delete message.event
-            this.$trigger(event, {}, message)
-            return
+      if (this.mode === mode.TIME || this.mode === mode.DATE) {
+        plus.nativeUI[this.mode === mode.TIME ? 'pickTime' : 'pickDate']((res) => {
+          const date = res.date
+          this.$trigger('change', {}, {
+            value: this.mode === mode.TIME ? `${padLeft(date.getHours())}:${padLeft(date.getMinutes())}` : `${date.getFullYear()}-${padLeft(date.getMonth() + 1)}-${padLeft(date.getDate())}`
+          })
+        }, () => {
+          this.$trigger('cancel', {}, {})
+        }, this.mode === mode.TIME ? {
+          time: getDate(this.value, mode.TIME)
+        } : {
+          date: getDate(this.value, mode.DATE),
+          minDate: getDate(this.start, mode.DATE),
+          maxDate: getDate(this.end, mode.DATE)
+        })
+      } else {
+        let res = { event: 'cancel' }
+        this.page = showPage({
+          url: '__uniapppicker',
+          data,
+          style: {
+            titleNView: false,
+            animationType: 'none',
+            animationDuration: 0,
+            background: 'rgba(0,0,0,0)',
+            popGesture: 'none'
+          },
+          onMessage: (message) => {
+            const event = message.event
+            if (event === 'created') {
+              this._updatePicker(data)
+              return
+            }
+            if (event === 'columnchange') {
+              delete message.event
+              this.$trigger(event, {}, message)
+              return
+            }
+            res = message
+          },
+          onClose: () => {
+            this.page = null
+            const event = res.event
+            delete res.event
+            this.$trigger(event, {}, res)
           }
-          res = message
-        },
-        onClose: () => {
-          this.page = null
-          const event = res.event
-          delete res.event
-          this.$trigger(event, {}, res)
-        }
-      })
+        })
+      }
     },
     _updatePicker (data) {
       this.page && this.page.sendMessage(data)

src/platforms/app-plus/view/components/picker/page.js

 let plus_
-let weex_
-let uni_
-
-let runtime
+let BroadcastChannel_
 
 function getRuntime () {
-  return runtime || (runtime = typeof window === 'object' && typeof navigator === 'object' && typeof document ===
-    'object'
-    ? 'webview' : 'v8')
-}
-
-function setRuntime (value) {
-  runtime = value
+  return typeof window === 'object' && typeof navigator === 'object' && typeof document === 'object' ? 'webview' : 'v8'
 }
 
 function getPageId () {
   return plus_.webview.currentWebview().id
 }
 
-let initedEventListener = false
+let channel
 const callbacks = {}
 
-function addEventListener (pageId, callback) {
-  const runtime = getRuntime()
-
-  function onPlusMessage (res) {
-    const message = res.data && res.data.__message
-    if (!message || !message.__page) {
-      return
-    }
-    const pageId = message.__page
-    const callback = callbacks[pageId]
-    callback && callback(message)
-    if (!message.keep) {
-      delete callbacks[pageId]
-    }
+function onPlusMessage (res) {
+  const message = res.data && res.data.__message
+  if (!message || !message.__page) {
+    return
   }
-  if (!initedEventListener) {
-    if (runtime === 'v8') {
-      const globalEvent = weex_.requireModule('globalEvent')
-      globalEvent.addEventListener('plusMessage', onPlusMessage)
-    } else if (runtime === 'v8-native') {
-      uni_.$on(getPageId(), onPlusMessage)
-    } else {
-      window.__plusMessage = onPlusMessage
-    }
-    initedEventListener = true
+  const pageId = message.__page
+  const callback = callbacks[pageId]
+  callback && callback(message)
+  if (!message.keep) {
+    delete callbacks[pageId]
+  }
+}
+
+function addEventListener (pageId, callback) {
+  if (getRuntime() === 'v8') {
+    channel && channel.close()
+    channel = new BroadcastChannel_(getPageId())
+    channel.onmessage = onPlusMessage
+  } else {
+    window.__plusMessage = onPlusMessage
   }
   callbacks[pageId] = callback
 }
@@ -55,19 +41,13 @@ class Page {
     this.webview = webview
   }
   sendMessage (data) {
-    const runtime = getRuntime()
     const message = {
       __message: {
         data
       }
     }
-    if (runtime === 'v8-native') {
-      uni_.$emit(this.webview.id, {
-        data: JSON.parse(JSON.stringify(message))
-      })
-    } else {
-      plus_.webview.postMessageToUniNView(message, this.webview.id)
-    }
+    const channel = new BroadcastChannel_(this.webview.id)
+    channel.postMessage(message)
   }
   close () {
     this.webview.close()
@@ -75,31 +55,17 @@ class Page {
 }
 
 export function showPage ({
-  context,
-  runtime,
+  context = {},
   url,
   data = {},
   style = {},
   onMessage,
   onClose
 }) {
-  if (context) {
-    plus_ = context.plus
-    weex_ = context.weex
-    uni_ = context.uni
-  } else {
-    // eslint-disable-next-line
-    plus_ = typeof plus === 'object' ? plus : null
-    // eslint-disable-next-line
-    weex_ = typeof weex === 'object' ? weex : null
-    // eslint-disable-next-line
-    uni_ = typeof uni === 'object' ? uni : null
-  }
-  if (runtime) {
-    setRuntime(runtime)
-  } else {
-    runtime = getRuntime()
-  }
+  // eslint-disable-next-line
+  plus_ = context.plus || plus
+  // eslint-disable-next-line
+  BroadcastChannel_ = context.BroadcastChannel || BroadcastChannel
   const titleNView = {
     autoBackButton: true,
     titleSize: '17px'
@@ -118,13 +84,19 @@ export function showPage ({
     animationType: 'pop-in',
     animationDuration: 200,
     uniNView: {
-      path: `/${url}.js?from=${getPageId()}&runtime=${runtime}&data=${encodeURIComponent(JSON.stringify(data))}`,
+      path: `${(typeof process === 'object' && process.env && process.env.VUE_APP_TEMPLATE_PATH) || '/template'}/${url}.js`,
       defaultFontSize: plus_.screen.resolutionWidth / 20,
       viewport: plus_.screen.resolutionWidth
     }
   }
   style = Object.assign(defaultStyle, style)
-  const page = plus_.webview.create('', pageId, style)
+  const page = plus_.webview.create('', pageId, style, {
+    extras: {
+      from: getPageId(),
+      runtime: getRuntime(),
+      data
+    }
+  })
   page.addEventListener('close', onClose)
   addEventListener(pageId, message => {
     if (typeof onMessage === 'function') {