From 1e61215b48e59e94c1ed98e4ef956227d689d6bc Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Mon, 06 Nov 2023 08:48:39 +0800 Subject: [PATCH] fix:小程序订阅消息 --- uni_modules/uview-ui/components/u-empty/u-empty.vue | 128 ++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 128 insertions(+), 0 deletions(-) diff --git a/uni_modules/uview-ui/components/u-empty/u-empty.vue b/uni_modules/uview-ui/components/u-empty/u-empty.vue new file mode 100644 index 0000000..03d6a27 --- /dev/null +++ b/uni_modules/uview-ui/components/u-empty/u-empty.vue @@ -0,0 +1,128 @@ +<template> + <view + class="u-empty" + :style="[emptyStyle]" + v-if="show" + > + <u-icon + v-if="!isSrc" + :name="mode === 'message' ? 'chat' : `empty-${mode}`" + :size="iconSize" + :color="iconColor" + margin-top="14" + ></u-icon> + <image + v-else + :style="{ + width: $u.addUnit(width), + height: $u.addUnit(height), + }" + :src="icon" + mode="widthFix" + ></image> + <text + class="u-empty__text" + :style="[textStyle]" + >{{text ? text : icons[mode]}}</text> + <view class="u-empty__wrap" v-if="$slots.default || $slots.$default"> + <slot /> + </view> + </view> +</template> + +<script> + import props from './props.js'; + + /** + * empty ������������ + * @description ������������������������������������������������������������������������������������������"������������"������������ ������������������������������������������������������������������ + * @tutorial https://www.uviewui.com/components/empty.html + * @property {String} icon ��������������������������������������������������������� + * @property {String} text ������������ + * @property {String} textColor ������������ (������ '#c0c4cc' ) + * @property {String | Number} textSize ������������ ��������� 14 ��� + * @property {String} iconColor ��������������� ��������� '#c0c4cc' ��� + * @property {String | Number} iconSize ��������������� ��������� 90 ��� + * @property {String} mode ��������������������������� ��������� 'data' ��� + * @property {String | Number} width ���������������������px ��������� 160 ��� + * @property {String | Number} height ���������������������px ��������� 160 ��� + * @property {Boolean} show ������������������ ��������� true ��� + * @property {String | Number} marginTop ���������������������������������������������������px������ ��������� 0 ��� + * @property {Object} customStyle ��������������������������������� + * + * @event {Function} click ��������������������� + * @event {Function} close ��������������������������� + * @example <u-empty text="���������������������������" mode="list"></u-empty> + */ + export default { + name: "u-empty", + mixins: [uni.$u.mpMixin, uni.$u.mixin, props], + data() { + return { + icons: { + car: '���������������', + page: '���������������', + search: '������������������', + address: '������������������', + wifi: '������WiFi', + order: '������������', + coupon: '���������������', + favor: '������������', + permission: '���������', + history: '���������������', + news: '���������������', + message: '������������������', + list: '������������', + data: '������������', + comment: '������������', + } + } + }, + computed: { + // ������������ + emptyStyle() { + const style = {} + style.marginTop = uni.$u.addUnit(this.marginTop) + // ������customStyle������������������������mixin������props������ + return uni.$u.deepMerge(uni.$u.addStyle(this.customStyle), style) + }, + // ������������ + textStyle() { + const style = {} + style.color = this.textColor + style.fontSize = uni.$u.addUnit(this.textSize) + return style + }, + // ������icon������������������ + isSrc() { + return this.icon.indexOf('/') >= 0 + } + } + } +</script> + +<style lang="scss" scoped> + @import '../../libs/css/components.scss'; + $u-empty-text-margin-top:20rpx !default; + $u-empty-slot-margin-top:20rpx !default; + + .u-empty { + @include flex; + flex-direction: column; + justify-content: center; + align-items: center; + + &__text { + @include flex; + justify-content: center; + align-items: center; + margin-top: $u-empty-text-margin-top; + } + } + .u-slot-wrap { + @include flex; + justify-content: center; + align-items: center; + margin-top:$u-empty-slot-margin-top; + } +</style> -- Gitblit v1.8.0