WebApp【公共组件库】@前端(For Git Submodule)
Tevin
2021-06-18 4db5d1b113d76a26b48834909cbdd03b3286e85d
forms/select/CSelect.vue
@@ -18,6 +18,7 @@
                :name="itemRes.name"
                :title="itemRes.label"
                :required="itemRes.required"
                :disabled="itemRes.disabled"
                :error="itemRes.error"
                :placeholder="placeholder"
                :value="selected"
@@ -25,15 +26,18 @@
                <view class="at-icon at-icon-chevron-right" />
            </AtInput>
        </picker>
        <view v-else-if="selectByPage.length > 5">
        <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="selected"
                :onFocus="evt=>onGoToSelectorPage()"
                :value="chose.name"
            >
                <view class="at-icon at-icon-chevron-right" />
            </AtInput>
@@ -52,14 +56,21 @@
        AtInput,
    },
    props: {
        options: Array,
        placeholder: String,
        // 表单数据资源(表单组件内部机制专用)
        itemRes: Object,
        // 选择菜单选项(浮窗模式)
        options: Array,
        // 占位提示
        placeholder: String,
        // 开启选择菜单跳转选择页面模式,并指定功能页面
        selectByPage: String,
        // 页面模式下,选择完成后的回调
        onSelectFromPage: Function,
    },
    data() {
        return {};
        return {
            chose: {},
        };
    },
    computed: {
        optionKey() {
@@ -90,11 +101,26 @@
            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: this.selectByPage,
                url,
                events: {
                    'CSelect:onSelected': data => {
                        this.onSelectFromPage(data);
                        const value = data.id || data.value || data.key;
                        this.chose = {
                            name: data.name,
                            value,
                        };
                        this.itemRes.onChange(value);
                        this.onSelectFromPage && this.onSelectFromPage(data);
                    },
                },
            });