From 4db5d1b113d76a26b48834909cbdd03b3286e85d Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Fri, 18 Jun 2021 14:57:35 +0800
Subject: [PATCH] Merge branch 'master' of ssh://dev.zhiheiot.com:29418/mob-components

---
 forms/select/CSelect.vue |   71 +++++++++++++++++++++++++++++++----
 1 files changed, 62 insertions(+), 9 deletions(-)

diff --git a/forms/select/CSelect.vue b/forms/select/CSelect.vue
index c7f0381..08ee2f4 100644
--- a/forms/select/CSelect.vue
+++ b/forms/select/CSelect.vue
@@ -6,6 +6,7 @@
 <template>
     <view class="c-select">
         <picker
+            v-if="!selectByPage"
             mode="selector"
             :range="options"
             :value="current"
@@ -14,20 +15,38 @@
         >
             <AtInput
                 ref="input"
-                :name="itemData.name"
-                :title="itemData.label"
-                :required="itemData.required"
-                :error="itemData.error"
+                :name="itemRes.name"
+                :title="itemRes.label"
+                :required="itemRes.required"
+                :disabled="itemRes.disabled"
+                :error="itemRes.error"
                 :placeholder="placeholder"
                 :value="selected"
             >
                 <view class="at-icon at-icon-chevron-right" />
             </AtInput>
         </picker>
+        <view
+            v-else-if="selectByPage.length > 5"
+            @tap="evt => onGoToSelectorPage()"
+        >
+            <AtInput
+                :name="itemRes.name"
+                :title="itemRes.label"
+                :required="itemRes.required"
+                :disabled="itemRes.disabled"
+                :error="itemRes.error"
+                :placeholder="placeholder"
+                :value="chose.name"
+            >
+                <view class="at-icon at-icon-chevron-right" />
+            </AtInput>
+        </view>
     </view>
 </template>
 
 <script>
+import Taro from '@tarojs/taro';
 import { AtInput } from 'taro-ui-vue';
 import './cSelect.scss';
 
@@ -37,19 +56,28 @@
         AtInput,
     },
     props: {
+        // 表单数据资源（表单组件内部机制专用）
+        itemRes: Object,
+        // 选择菜单选项（浮窗模式）
         options: Array,
+        // 占位提示
         placeholder: String,
-        itemData: Object,
+        // 开启选择菜单跳转选择页面模式，并指定功能页面
+        selectByPage: String,
+        // 页面模式下，选择完成后的回调
+        onSelectFromPage: Function,
     },
     data() {
-        return {};
+        return {
+            chose: {},
+        };
     },
     computed: {
         optionKey() {
             return typeof (this.options[0] || {}).value === 'undefined' ? 'id' : 'value';
         },
         current() {
-            const curVal = this.itemData.formData[this.itemData.name];
+            const curVal = this.itemRes.formData[this.itemRes.name];
             for (let i = 0, item; (item = this.options[i]); i++) {
                 if (curVal === item[this.optionKey]) {
                     return i;
@@ -58,7 +86,7 @@
             return -1;
         },
         selected() {
-            const curVal = this.itemData.formData[this.itemData.name];
+            const curVal = this.itemRes.formData[this.itemRes.name];
             for (let i = 0, item; (item = this.options[i]); i++) {
                 if (curVal === item[this.optionKey]) {
                     return item.name;
@@ -70,7 +98,32 @@
     methods: {
         handleChange(evt) {
             const item = this.options[evt.value];
-            this.itemData.onChange(item[this.optionKey]);
+            this.itemRes.onChange(item[this.optionKey]);
+        },
+        onGoToSelectorPage() {
+            let url = this.selectByPage;
+            if (this.selectByPage.indexOf('?') > 0) {
+                url += '&mode=CSelect';
+            } else {
+                url += '?mode=CSelect';
+            }
+            if (this.chose && typeof this.chose.value !== 'undefined') {
+                url += '&value=' + JSON.stringify(this.chose.value);
+            }
+            Taro.navigateTo({
+                url,
+                events: {
+                    'CSelect:onSelected': data => {
+                        const value = data.id || data.value || data.key;
+                        this.chose = {
+                            name: data.name,
+                            value,
+                        };
+                        this.itemRes.onChange(value);
+                        this.onSelectFromPage && this.onSelectFromPage(data);
+                    },
+                },
+            });
         },
     },
     mounted() {},

--
Gitblit v1.9.1