From 9ab4955166b7b1370fc2a49b152353241ca9e64a Mon Sep 17 00:00:00 2001
From: jiangping <jp@doumee.com>
Date: 星期一, 16 十月 2023 09:22:23 +0800
Subject: [PATCH] 小程序
---
minipro_standard/uni_modules/uview-ui/components/u-picker/u-picker.vue | 283 --------------------------------------------------------
1 files changed, 0 insertions(+), 283 deletions(-)
diff --git a/minipro_standard/uni_modules/uview-ui/components/u-picker/u-picker.vue b/minipro_standard/uni_modules/uview-ui/components/u-picker/u-picker.vue
index 8885917..e69de29 100644
--- a/minipro_standard/uni_modules/uview-ui/components/u-picker/u-picker.vue
+++ b/minipro_standard/uni_modules/uview-ui/components/u-picker/u-picker.vue
@@ -1,283 +0,0 @@
-<template>
- <u-popup
- :show="show"
- @close="closeHandler"
- >
- <view class="u-picker">
- <u-toolbar
- v-if="showToolbar"
- :cancelColor="cancelColor"
- :confirmColor="confirmColor"
- :cancelText="cancelText"
- :confirmText="confirmText"
- :title="title"
- @cancel="cancel"
- @confirm="confirm"
- ></u-toolbar>
- <picker-view
- class="u-picker__view"
- :indicatorStyle="`height: ${$u.addUnit(itemHeight)}`"
- :value="innerIndex"
- :immediateChange="immediateChange"
- :style="{
- height: `${$u.addUnit(visibleItemCount * itemHeight)}`
- }"
- @change="changeHandler"
- >
- <picker-view-column
- v-for="(item, index) in innerColumns"
- :key="index"
- class="u-picker__view__column"
- >
- <text
- v-if="$u.test.array(item)"
- class="u-picker__view__column__item u-line-1"
- v-for="(item1, index1) in item"
- :key="index1"
- :style="{
- height: $u.addUnit(itemHeight),
- lineHeight: $u.addUnit(itemHeight),
- fontWeight: index1 === innerIndex[index] ? 'bold' : 'normal'
- }"
- >{{ getItemText(item1) }}</text>
- </picker-view-column>
- </picker-view>
- <view
- v-if="loading"
- class="u-picker--loading"
- >
- <u-loading-icon mode="circle"></u-loading-icon>
- </view>
- </view>
- </u-popup>
-</template>
-
-<script>
-/**
- * u-picker
- * @description 閫夋嫨鍣�
- * @property {Boolean} show 鏄惁鏄剧ずpicker寮圭獥锛堥粯璁� false 锛�
- * @property {Boolean} showToolbar 鏄惁鏄剧ず椤堕儴鐨勬搷浣滄爮锛堥粯璁� true 锛�
- * @property {String} title 椤堕儴鏍囬
- * @property {Array} columns 瀵硅薄鏁扮粍锛岃缃瘡涓�鍒楃殑鏁版嵁
- * @property {Boolean} loading 鏄惁鏄剧ず鍔犺浇涓姸鎬侊紙榛樿 false 锛�
- * @property {String | Number} itemHeight 鍚勫垪涓紝鍗曚釜閫夐」鐨勯珮搴︼紙榛樿 44 锛�
- * @property {String} cancelText 鍙栨秷鎸夐挳鐨勬枃瀛楋紙榛樿 '鍙栨秷' 锛�
- * @property {String} confirmText 纭鎸夐挳鐨勬枃瀛楋紙榛樿 '纭畾' 锛�
- * @property {String} cancelColor 鍙栨秷鎸夐挳鐨勯鑹诧紙榛樿 '#909193' 锛�
- * @property {String} confirmColor 纭鎸夐挳鐨勯鑹诧紙榛樿 '#3c9cff' 锛�
- * @property {String | Number} visibleItemCount 姣忓垪涓彲瑙侀�夐」鐨勬暟閲忥紙榛樿 5 锛�
- * @property {String} keyName 閫夐」瀵硅薄涓紝闇�瑕佸睍绀虹殑灞炴�ч敭鍚嶏紙榛樿 'text' 锛�
- * @property {Boolean} closeOnClickOverlay 鏄惁鍏佽鐐瑰嚮閬僵鍏抽棴閫夋嫨鍣紙榛樿 false 锛�
- * @property {Array} defaultIndex 鍚勫垪鐨勯粯璁ょ储寮�
- * @property {Boolean} immediateChange 鏄惁鍦ㄦ墜鎸囨澗寮�鏃剁珛鍗宠Е鍙慶hange浜嬩欢锛堥粯璁� false 锛�
- * @event {Function} close 鍏抽棴閫夋嫨鍣ㄦ椂瑙﹀彂
- * @event {Function} cancel 鐐瑰嚮鍙栨秷鎸夐挳瑙﹀彂
- * @event {Function} change 褰撻�夋嫨鍊煎彉鍖栨椂瑙﹀彂
- * @event {Function} confirm 鐐瑰嚮纭畾鎸夐挳锛岃繑鍥炲綋鍓嶉�夋嫨鐨勫��
- */
-import props from './props.js';
-export default {
- name: 'u-picker',
- mixins: [uni.$u.mpMixin, uni.$u.mixin, props],
- data() {
- return {
- // 涓婁竴娆¢�夋嫨鐨勫垪绱㈠紩
- lastIndex: [],
- // 绱㈠紩鍊� 锛屽搴攑icker-view鐨剉alue
- innerIndex: [],
- // 鍚勫垪鐨勫��
- innerColumns: [],
- // 涓婁竴娆$殑鍙樺寲鍒楃储寮�
- columnIndex: 0,
- }
- },
- watch: {
- // 鐩戝惉榛樿绱㈠紩鐨勫彉鍖栵紝閲嶆柊璁剧疆瀵瑰簲鐨勫��
- defaultIndex: {
- immediate: true,
- handler(n) {
- this.setIndexs(n, true)
- }
- },
- // 鐩戝惉columns鍙傛暟鐨勫彉鍖�
- columns: {
- immediate: true,
- handler(n) {
- this.setColumns(n)
- }
- },
- },
- methods: {
- // 鑾峰彇item闇�瑕佹樉绀虹殑鏂囧瓧锛屽垽鍒负瀵硅薄杩樻槸鏂囨湰
- getItemText(item) {
- if (uni.$u.test.object(item)) {
- return item[this.keyName]
- } else {
- return item
- }
- },
- // 鍏抽棴閫夋嫨鍣�
- closeHandler() {
- if (this.closeOnClickOverlay) {
- this.$emit('close')
- }
- },
- // 鐐瑰嚮宸ュ叿鏍忕殑鍙栨秷鎸夐挳
- cancel() {
- this.$emit('cancel')
- },
- // 鐐瑰嚮宸ュ叿鏍忕殑纭畾鎸夐挳
- confirm() {
- this.$emit('confirm', {
- indexs: this.innerIndex,
- value: this.innerColumns.map((item, index) => item[this.innerIndex[index]]),
- values: this.innerColumns
- })
- },
- // 閫夋嫨鍣ㄦ煇涓�鍒楃殑鏁版嵁鍙戠敓鍙樺寲鏃惰Е鍙�
- changeHandler(e) {
- const {
- value
- } = e.detail
- let index = 0,
- columnIndex = 0
- // 閫氳繃瀵规瘮鍓嶅悗涓ゆ鐨勫垪绱㈠紩锛屽緱鍑哄綋鍓嶅彉鍖栫殑鏄摢涓�鍒�
- for (let i = 0; i < value.length; i++) {
- let item = value[i]
- if (item !== (this.lastIndex[i] || 0)) { // 鎶妘ndefined杞负鍚堟硶鍋囧��0
- // 璁剧疆columnIndex涓哄綋鍓嶅彉鍖栧垪鐨勭储寮�
- columnIndex = i
- // index鍒欎负鍙樺寲鍒椾腑鐨勫彉鍖栭」鐨勭储寮�
- index = item
- break // 缁堟寰幆锛屽嵆浣垮皯涓�娆″惊鐜紝涔熸槸鎬ц兘鐨勬彁鍗�
- }
- }
- this.columnIndex = columnIndex
- const values = this.innerColumns
- // 灏嗗綋鍓嶇殑鍚勯」鍙樺寲绱㈠紩锛岃缃负"涓婁竴娆�"鐨勭储寮曞彉鍖栧��
- this.setLastIndex(value)
- this.setIndexs(value)
-
- this.$emit('change', {
- // #ifndef MP-WEIXIN || MP-LARK
- // 寰俊灏忕▼搴忎笉鑳戒紶閫抰his锛屼細鍥犱负寰幆寮曠敤鑰屾姤閿�
- picker: this,
- // #endif
- value: this.innerColumns.map((item, index) => item[value[index]]),
- index,
- indexs: value,
- // values涓哄綋鍓嶅彉鍖栧垪鐨勬暟缁勫唴瀹�
- values,
- columnIndex
- })
- },
- // 璁剧疆index绱㈠紩锛屾鏂规硶鍙澶栭儴璋冪敤璁剧疆
- setIndexs(index, setLastIndex) {
- this.innerIndex = uni.$u.deepClone(index)
- if (setLastIndex) {
- this.setLastIndex(index)
- }
- },
- // 璁板綍涓婁竴娆$殑鍚勫垪绱㈠紩浣嶇疆
- setLastIndex(index) {
- // 褰撹兘杩涘叆姝ゆ柟娉曪紝鎰忓懗鐫�褰撳墠璁剧疆鐨勫悇鍒楅粯璁ょ储寮曪紝鍗充负鈥滀笂涓�娆♀�濈殑閫変腑鍊硷紝闇�瑕佽褰曪紝鏄洜涓篶hangeHandler涓�
- // 闇�瑕佹嬁鍓嶅悗鐨勫彉鍖栧�艰繘琛屽姣旓紝寰楀嚭褰撳墠鍙戠敓鏀瑰彉鐨勬槸鍝竴鍒�
- this.lastIndex = uni.$u.deepClone(index)
- },
- // 璁剧疆瀵瑰簲鍒楅�夐」鐨勬墍鏈夊��
- setColumnValues(columnIndex, values) {
- // 鏇挎崲innerColumns鏁扮粍涓璫olumnIndex绱㈠紩鐨勫�间负values锛屼娇鐢ㄧ殑鏄暟缁勭殑splice鏂规硶
- this.innerColumns.splice(columnIndex, 1, values)
- // 鎷疯礉涓�浠藉師鏈夌殑innerIndex鍋氫复鏃跺彉閲忥紝灏嗗ぇ浜庡綋鍓嶅彉鍖栧垪鐨勬墍鏈夌殑鍒楃殑榛樿绱㈠紩璁剧疆涓�0
- let tmpIndex = uni.$u.deepClone(this.innerIndex)
- for (let i = 0; i < this.innerColumns.length; i++) {
- if (i > this.columnIndex) {
- tmpIndex[i] = 0
- }
- }
- // 涓�娆℃�ц祴鍊硷紝涓嶈兘鍗曚釜淇敼锛屽惁鍒欐棤鏁�
- this.setIndexs(tmpIndex)
- },
- // 鑾峰彇瀵瑰簲鍒楃殑鎵�鏈夐�夐」
- getColumnValues(columnIndex) {
- // 杩涜鍚屾闃诲锛屽洜涓哄閮ㄥ緱鍒癱hange浜嬩欢涔嬪悗锛屽彲鑳介渶瑕佹墽琛宻etColumnValues鏇存柊鍒楃殑鍊�
- // 绱㈠紩濡傛灉鍦ㄥ閮╟hange鐨勫洖璋冧腑璋冪敤getColumnValues鐨勮瘽锛屽彲鑳芥棤娉曞緱鍒板彉鏇村悗鐨勫垪鍊硷紝杩欓噷杩涜涓�瀹氬欢鏃讹紝淇濊瘉鍊肩殑鍑嗙‘鎬�
- (async () => {
- await uni.$u.sleep()
- })()
- return this.innerColumns[columnIndex]
- },
- // 璁剧疆鏁翠綋鍚勫垪鐨刢olumns鐨勫��
- setColumns(columns) {
- this.innerColumns = uni.$u.deepClone(columns)
- // 濡傛灉鍦ㄨ缃悇鍒楁暟鎹椂锛屾病鏈夎璁剧疆榛樿鐨勫悇鍒楃储寮昫efaultIndex锛岄偅涔堢敤0鍘诲~鍏呭畠锛屾暟缁勯暱搴︿负鍒楃殑鏁伴噺
- if (this.innerIndex.length === 0) {
- this.innerIndex = new Array(columns.length).fill(0)
- }
- },
- // 鑾峰彇鍚勫垪閫変腑鍊煎搴旂殑绱㈠紩
- getIndexs() {
- return this.innerIndex
- },
- // 鑾峰彇鍚勫垪閫変腑鐨勫��
- getValues() {
- // 杩涜鍚屾闃诲锛屽洜涓哄閮ㄥ緱鍒癱hange浜嬩欢涔嬪悗锛屽彲鑳介渶瑕佹墽琛宻etColumnValues鏇存柊鍒楃殑鍊�
- // 绱㈠紩濡傛灉鍦ㄥ閮╟hange鐨勫洖璋冧腑璋冪敤getValues鐨勮瘽锛屽彲鑳芥棤娉曞緱鍒板彉鏇村悗鐨勫垪鍊硷紝杩欓噷杩涜涓�瀹氬欢鏃讹紝淇濊瘉鍊肩殑鍑嗙‘鎬�
- (async () => {
- await uni.$u.sleep()
- })()
- return this.innerColumns.map((item, index) => item[this.innerIndex[index]])
- }
- },
-}
-</script>
-
-<style lang="scss" scoped>
- @import "../../libs/css/components.scss";
-
- .u-picker {
- position: relative;
-
- &__view {
-
- &__column {
- @include flex;
- flex: 1;
- justify-content: center;
-
- &__item {
- @include flex;
- justify-content: center;
- align-items: center;
- font-size: 16px;
- text-align: center;
- /* #ifndef APP-NVUE */
- display: block;
- /* #endif */
- color: $u-main-color;
-
- &--disabled {
- /* #ifndef APP-NVUE */
- cursor: not-allowed;
- /* #endif */
- opacity: 0.35;
- }
- }
- }
- }
-
- &--loading {
- position: absolute;
- top: 0;
- right: 0;
- left: 0;
- bottom: 0;
- @include flex;
- justify-content: center;
- align-items: center;
- background-color: rgba(255, 255, 255, 0.87);
- z-index: 1000;
- }
- }
-</style>
--
Gitblit v1.9.3