From b26c02f9f1be4bf7e5c6fbb64ba3a2a13428c78f Mon Sep 17 00:00:00 2001 From: chensiAb <chenchenco03@163.com> Date: Wed, 17 Apr 2024 15:37:16 +0800 Subject: [PATCH] fix:'删除小程序echarts文件,使用封装过得组件' --- forms/select/CSelect.vue | 116 ++++++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 76 insertions(+), 40 deletions(-) diff --git a/forms/select/CSelect.vue b/forms/select/CSelect.vue index 2d1edbd..5e22975 100644 --- a/forms/select/CSelect.vue +++ b/forms/select/CSelect.vue @@ -4,38 +4,61 @@ */ <template> - <view class="c-select"> - <picker + <view + class="c-select" + :class="readOnly?'read-only':''" + > + <!-- 下拉选择模式 --> + <view v-if="!selectByPage" - mode="selector" - :range="options" - :value="current" - range-key="name" - @change="evt=>handleChange(evt.detail)" + class="c-select-slot-mode" + > + <picker + class="c-select-input" + mode="selector" + :range="options" + :value="current" + range-key="name" + @change="evt=>handleChange(evt.detail)" + > + <AtInput + ref="input" + :name="itemRes.name" + :title="itemRes.label" + :required="itemRes.required" + :disabled="itemRes.disabled" + :error="itemRes.error" + :placeholder="placeholder" + :value="selected" + > + <view + v-show="!readOnly" + class="at-icon at-icon-chevron-right" + /> + </AtInput> + </picker> + <view class="c-select-slot"> + <slot /> + </view> + </view> + <!-- 跳转页面模式 --> + <view + v-else-if="selectByPage.length > 5" + @tap="evt => onGoToSelectorPage()" > <AtInput - ref="input" :name="itemRes.name" :title="itemRes.label" :required="itemRes.required" + :disabled="itemRes.disabled" :error="itemRes.error" :placeholder="placeholder" - :value="selected" + :value="choose.name" > - <view class="at-icon at-icon-chevron-right" /> - </AtInput> - </picker> - <view v-else-if="selectByPage.length > 5"> - <AtInput - :name="itemRes.name" - :title="itemRes.label" - :required="itemRes.required" - :error="itemRes.error" - :placeholder="placeholder" - :value="chose.name" - :onFocus="evt=>onGoToSelectorPage()" - > - <view class="at-icon at-icon-chevron-right" /> + <view + v-show="!readOnly" + class="at-icon at-icon-chevron-right" + /> </AtInput> </view> </view> @@ -44,6 +67,7 @@ <script> import Taro from '@tarojs/taro'; import { AtInput } from 'taro-ui-vue'; +import { $pagePoster } from '@components/common/PagePoster'; import './cSelect.scss'; export default { @@ -62,10 +86,18 @@ selectByPage: String, // 页面模式下,选择完成后的回调 onSelectFromPage: Function, + // 只读模式 + readOnly: { + type: Boolean, + default: false, + }, }, data() { return { - chose: {}, + choose: { + name: '', + value: null, + }, }; }, computed: { @@ -93,8 +125,12 @@ }, methods: { handleChange(evt) { - const item = this.options[evt.value]; - this.itemRes.onChange(item[this.optionKey]); + if (typeof this.optionKey === 'undefined') { + this.itemRes.onChange(); + } else { + const item = this.options[evt.value]; + this.itemRes.onChange(item[this.optionKey]); + } }, onGoToSelectorPage() { let url = this.selectByPage; @@ -103,22 +139,22 @@ } else { url += '?mode=CSelect'; } - 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(data); - }, - }, + if (this._eventor) { + // 销毁上次事件收发器 + this._eventor.destroy(); + } + this._eventor = $pagePoster.createEventor(); + this._eventor.on('@linked', () => { + this._eventor.emit('lastValue', this.choose.value); }); + this._eventor.on('selected', data => { + this.choose.name = data.name; + this.choose.value = data.value; + this.itemRes.onChange(data.value); + this.onSelectFromPage && this.onSelectFromPage(data.value); + }); + Taro.navigateTo({ url: url + '&eventorId=' + this._eventor.id }); }, }, - mounted() {}, }; </script> \ No newline at end of file -- Gitblit v1.9.1