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-avatar-group/u-avatar-group.vue | 103 --------------------------------------------------- 1 files changed, 0 insertions(+), 103 deletions(-) diff --git a/minipro_standard/uni_modules/uview-ui/components/u-avatar-group/u-avatar-group.vue b/minipro_standard/uni_modules/uview-ui/components/u-avatar-group/u-avatar-group.vue index 7e996d7..e69de29 100644 --- a/minipro_standard/uni_modules/uview-ui/components/u-avatar-group/u-avatar-group.vue +++ b/minipro_standard/uni_modules/uview-ui/components/u-avatar-group/u-avatar-group.vue @@ -1,103 +0,0 @@ -<template> - <view class="u-avatar-group"> - <view - class="u-avatar-group__item" - v-for="(item, index) in showUrl" - :key="index" - :style="{ - marginLeft: index === 0 ? 0 : $u.addUnit(-size * gap) - }" - > - <u-avatar - :size="size" - :shape="shape" - :mode="mode" - :src="$u.test.object(item) ? keyName && item[keyName] || item.url : item" - ></u-avatar> - <view - class="u-avatar-group__item__show-more" - v-if="showMore && index === showUrl.length - 1 && (urls.length > maxCount || extraValue > 0)" - @tap="clickHandler" - > - <u--text - color="#ffffff" - :size="size * 0.4" - :text="`+${extraValue || urls.length - showUrl.length}`" - align="center" - customStyle="justify-content: center" - ></u--text> - </view> - </view> - </view> -</template> - -<script> - import props from './props.js'; - /** - * AvatarGroup 澶村儚缁� - * @description 鏈粍浠朵竴鑸敤浜庡睍绀哄ご鍍忕殑鍦版柟锛屽涓汉涓績锛屾垨鑰呰瘎璁哄垪琛ㄩ〉鐨勭敤鎴峰ご鍍忓睍绀虹瓑鍦烘墍銆� - * @tutorial https://www.uviewui.com/components/avatar.html - * - * @property {Array} urls 澶村儚鍥剧墖缁� 锛堥粯璁� [] 锛� - * @property {String | Number} maxCount 鏈�澶氬睍绀虹殑澶村儚鏁伴噺 锛� 榛樿 5 锛� - * @property {String} shape 澶村儚褰㈢姸锛� 'circle' (榛樿) | 'square' 锛� - * @property {String} mode 鍥剧墖瑁佸壀妯″紡锛堥粯璁� 'scaleToFill' 锛� - * @property {Boolean} showMore 瓒呭嚭maxCount鏃舵槸鍚︽樉绀烘煡鐪嬫洿澶氱殑鎻愮ず 锛堥粯璁� true 锛� - * @property {String | Number} size 澶村儚澶у皬 锛堥粯璁� 40 锛� - * @property {String} keyName 鎸囧畾浠庢暟缁勭殑瀵硅薄鍏冪礌涓鍙栧摢涓睘鎬т綔涓哄浘鐗囧湴鍧� - * @property {String | Number} gap 澶村儚涔嬮棿鐨勯伄鎸℃瘮渚嬶紙0.4浠h〃閬尅40%锛� 锛堥粯璁� 0.5 锛� - * @property {String | Number} extraValue 闇�棰濆鏄剧ず鐨勫�� - * @event {Function} showMore 澶村儚缁勬洿澶氱偣鍑� - * @example <u-avatar-group:urls="urls" size="35" gap="0.4" ></u-avatar-group:urls=> - */ - export default { - name: 'u-avatar-group', - mixins: [uni.$u.mpMixin, uni.$u.mixin, props], - data() { - return { - - } - }, - computed: { - showUrl() { - return this.urls.slice(0, this.maxCount) - } - }, - methods: { - clickHandler() { - this.$emit('showMore') - } - }, - } -</script> - -<style lang="scss" scoped> - @import "../../libs/css/components.scss"; - - .u-avatar-group { - @include flex; - - &__item { - margin-left: -10px; - position: relative; - - &--no-indent { - // 濡傛灉浣犳兂璐ㄧ枒浣滆�呬笉浼氫娇鐢�:first-child锛岃鏄庝綘澶勾杞伙紝鍥犱负nvue涓嶆敮鎸� - margin-left: 0; - } - - &__show-more { - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; - background-color: rgba(0, 0, 0, 0.3); - @include flex; - align-items: center; - justify-content: center; - border-radius: 100px; - } - } - } -</style> -- Gitblit v1.9.3