From bd99a5211f3a5fcaa051e5da868d87bb870148f5 Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Fri, 01 Mar 2024 09:58:45 +0800
Subject: [PATCH] fix:手持设备

---
 uni_modules/uview-ui/components/u-icon/u-icon.vue |  234 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 234 insertions(+), 0 deletions(-)

diff --git a/uni_modules/uview-ui/components/u-icon/u-icon.vue b/uni_modules/uview-ui/components/u-icon/u-icon.vue
new file mode 100644
index 0000000..9340328
--- /dev/null
+++ b/uni_modules/uview-ui/components/u-icon/u-icon.vue
@@ -0,0 +1,234 @@
+<template>
+	<view
+	    class="u-icon"
+	    @tap="clickHandler"
+	    :class="['u-icon--' + labelPos]"
+	>
+		<image
+		    class="u-icon__img"
+		    v-if="isImg"
+		    :src="name"
+		    :mode="imgMode"
+		    :style="[imgStyle, $u.addStyle(customStyle)]"
+		></image>
+		<text
+		    v-else
+		    class="u-icon__icon"
+		    :class="uClasses"
+		    :style="[iconStyle, $u.addStyle(customStyle)]"
+		    :hover-class="hoverClass"
+		>{{icon}}</text>
+		<!-- ������������������������������������������������v-if="label"������������������������0��������������������������������� -->
+		<text
+		    v-if="label !== ''" 
+		    class="u-icon__label"
+		    :style="{
+			color: labelColor,
+			fontSize: $u.addUnit(labelSize),
+			marginLeft: labelPos == 'right' ? $u.addUnit(space) : 0,
+			marginTop: labelPos == 'bottom' ? $u.addUnit(space) : 0,
+			marginRight: labelPos == 'left' ? $u.addUnit(space) : 0,
+			marginBottom: labelPos == 'top' ? $u.addUnit(space) : 0,
+		}"
+		>{{ label }}</text>
+	</view>
+</template>
+
+<script>
+	// #ifdef APP-NVUE
+	// nvue������weex���dom������������������������������������������������
+	// https://weex.apache.org/zh/docs/modules/dom.html#addrule
+	const fontUrl = 'https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf'
+	const domModule = weex.requireModule('dom')
+	domModule.addRule('fontFace', {
+		'fontFamily': "uicon-iconfont",
+		'src': `url('${fontUrl}')`
+	})
+	// #endif
+
+	// ������������������������������������unicode
+	import icons from './icons'
+	
+	import props from './props.js';;
+
+	/**
+	 * icon ������
+	 * @description ���������������������������������������������������������������������
+	 * @tutorial https://www.uviewui.com/components/icon.html
+	 * @property {String}			name			���������������������������������
+	 * @property {String}			color			������������,������������������ ��������� color['u-content-color'] ���
+	 * @property {String | Number}	size			���������������������������px ��������� '16px' ���
+	 * @property {Boolean}			bold			������������������ ��������� false ���
+	 * @property {String | Number}	index			������������������������������������������index������������������������������������
+	 * @property {String}			hoverClass		���������������������������������������uni���view���������hoverClass������������������������
+	 * @property {String}			customPrefix	������������������������������������������������������������ ��������� 'uicon' ���
+	 * @property {String | Number}	label			���������������label������
+	 * @property {String}			labelPos		label���������������������������������right���bottom ��������� 'right' ���
+	 * @property {String | Number}	labelSize		label���������������������px ��������� '15px' ���
+	 * @property {String}			labelColor		���������������label������������ ��� ������ color['u-content-color'] ���
+	 * @property {String | Number}	space			label���������������������������px ��������� '3px' ���
+	 * @property {String}			imgMode			���������mode
+	 * @property {String | Number}	width			���������������������������������
+	 * @property {String | Number}	height			���������������������������������
+	 * @property {String | Number}	top				��������������������������������� ������������������������������������������������������������  ��������� 0 ���
+	 * @property {Boolean}			stop			������������������������ ��������� false ���
+	 * @property {Object}			customStyle		icon������������������������
+	 * @event {Function} click ���������������������
+	 * @event {Function} touchstart ���������������������
+	 * @example <u-icon name="photo" color="#2979ff" size="28"></u-icon>
+	 */
+	export default {
+		name: 'u-icon',
+		data() {
+			return {
+
+			}
+		},
+		mixins: [uni.$u.mpMixin, uni.$u.mixin,props],
+		computed: {
+			uClasses() {
+				let classes = []
+				classes.push(this.customPrefix + '-' + this.name)
+				// // uView���������������������������u-iconfont
+				// if (this.customPrefix == 'uicon') {
+				// 	classes.push('u-iconfont')
+				// } else {
+				// 	classes.push(this.customPrefix)
+				// }
+				// ���������������������������
+				if (this.color && uni.$u.config.type.includes(this.color)) classes.push('u-icon__icon--' + this.color)
+				// ���������������������������������������������������������������������������������[a, b, c]������������������������������
+				// ���������������������������������������������������������������������������
+				//#ifdef MP-ALIPAY || MP-TOUTIAO || MP-BAIDU
+				classes = classes.join(' ')
+				//#endif
+				return classes
+			},
+			iconStyle() {
+				let style = {}
+				style = {
+					fontSize: uni.$u.addUnit(this.size),
+					lineHeight: uni.$u.addUnit(this.size),
+					fontWeight: this.bold ? 'bold' : 'normal',
+					// ������������������������������������������������������������������������������������
+					top: uni.$u.addUnit(this.top)
+				}
+				// ���������������������������������������
+				if (this.color && !uni.$u.config.type.includes(this.color)) style.color = this.color
+
+				return style
+			},
+			// ���������������name������������������������������������������"/"������������������������
+			isImg() {
+				return this.name.indexOf('/') !== -1
+			},
+			imgStyle() {
+				let style = {}
+				// ������������width���height���������������������������������������size������
+				style.width = this.width ? uni.$u.addUnit(this.width) : uni.$u.addUnit(this.size)
+				style.height = this.height ? uni.$u.addUnit(this.height) : uni.$u.addUnit(this.size)
+				return style
+			},
+			// ���������������������������������������
+			icon() {
+				// ������������������������������������������������������������������name������������������������������������unicode������
+				return icons['uicon-' + this.name] || this.name
+			}
+		},
+		methods: {
+			clickHandler(e) {
+				this.$emit('click', this.index)
+				// ������������������������
+				this.stop && this.preventEvent(e)
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	@import "../../libs/css/components.scss";
+
+	// ������������
+	$u-icon-primary: $u-primary !default;
+	$u-icon-success: $u-success !default;
+	$u-icon-info: $u-info !default;
+	$u-icon-warning: $u-warning !default;
+	$u-icon-error: $u-error !default;
+	$u-icon-label-line-height:1 !default;
+
+	/* #ifndef APP-NVUE */
+	// ���nvue���������������
+	@font-face {
+		font-family: 'uicon-iconfont';
+		src: url('https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf') format('truetype');
+	}
+
+	/* #endif */
+
+	.u-icon {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		align-items: center;
+
+		&--left {
+			flex-direction: row-reverse;
+			align-items: center;
+		}
+
+		&--right {
+			flex-direction: row;
+			align-items: center;
+		}
+
+		&--top {
+			flex-direction: column-reverse;
+			justify-content: center;
+		}
+
+		&--bottom {
+			flex-direction: column;
+			justify-content: center;
+		}
+
+		&__icon {
+			font-family: uicon-iconfont;
+			position: relative;
+			@include flex;
+			align-items: center;
+
+			&--primary {
+				color: $u-icon-primary;
+			}
+
+			&--success {
+				color: $u-icon-success;
+			}
+
+			&--error {
+				color: $u-icon-error;
+			}
+
+			&--warning {
+				color: $u-icon-warning;
+			}
+
+			&--info {
+				color: $u-icon-info;
+			}
+		}
+
+		&__img {
+			/* #ifndef APP-NVUE */
+			height: auto;
+			will-change: transform;
+			/* #endif */
+		}
+
+		&__label {
+			/* #ifndef APP-NVUE */
+			line-height: $u-icon-label-line-height;
+			/* #endif */
+		}
+	}
+</style>

--
Gitblit v1.8.0