bawangcan-shop/components/tui-icon/tui-icon.vue

<template>
	<text class="tui-icon-class tui-icon" :class="'tui-icon-' + name" :style="{ color: color || '#999', fontSize: size + unit, fontWeight: bold ? 'bold' : 'normal',margin:margin }"
	 @tap="handleClick"></text>

</template>

<script>
	export default {
		name: 'tuiIcon',
		props: {
			name: {
				type: String,
				default: ''
			},
			size: {
				type: Number,
				default: 32
			},
			//px或者rpx
			unit:{
				type: String,
				default: 'px'
			},
			color: {
				type: String,
				default: '#999'
			},
			bold: {
				type: Boolean,
				default: false
			},
			margin: {
				type: String,
				default: "0"
			},
			index: {
				type: Number,
				default: 0
			}
		},
		methods: {
			handleClick() {
				this.$emit('click', {
					index: this.index
				});
			}
		}
	};
</script>

<style scoped>
	@charset "UTF-8";

	@font-face {
		font-family: 'thoruiFont';
		src: url(data:application/font-woff;charset=utf-8;base64,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
		font-weight: normal;
		font-style: normal;
	}

	.tui-icon {
		font-family: 'thoruiFont' !important;
		font-style: normal;
		-webkit-font-smoothing: antialiased;
		text-align: center;
		text-decoration: none;
	}

	.tui-icon-about:before {
		content: '\e772';
	}

	.tui-icon-about-fill:before {
		content: '\e771';
	}

	.tui-icon-add:before {
		content: '\e770';
	}

	.tui-icon-add-fill:before {
		content: '\e76f';
	}

	.tui-icon-addmessage:before {
		content: '\e76e';
	}

	.tui-icon-addressbook:before {
		content: '\e76d';
	}

	.tui-icon-agree:before {
		content: '\e76c';
	}

	.tui-icon-agree-fill:before {
		content: '\e76b';
	}

	.tui-icon-alarm:before {
		content: '\e76a';
	}

	.tui-icon-alarm-fill:before {
		content: '\e769';
	}

	.tui-icon-alipay:before {
		content: '\e768';
	}

	.tui-icon-android:before {
		content: '\e767';
	}

	.tui-icon-applets:before {
		content: '\e766';
	}

	.tui-icon-arrowdown:before {
		content: '\e765';
	}

	.tui-icon-arrowleft:before {
		content: '\e764';
	}

	.tui-icon-arrowright:before {
		content: '\e763';
	}

	.tui-icon-arrowup:before {
		content: '\e762';
	}

	.tui-icon-attestation:before {
		content: '\e761';
	}

	.tui-icon-back:before {
		content: '\e760';
	}

	.tui-icon-bag:before {
		content: '\e75f';
	}

	.tui-icon-bag-fill:before {
		content: '\e75e';
	}

	.tui-icon-balloon:before {
		content: '\e75d';
	}

	.tui-icon-bankcard:before {
		content: '\e75c';
	}

	.tui-icon-bankcard-fill:before {
		content: '\e75b';
	}

	.tui-icon-bottom:before {
		content: '\e75a';
	}

	.tui-icon-calendar:before {
		content: '\e759';
	}

	.tui-icon-camera:before {
		content: '\e758';
	}

	.tui-icon-camera-fill:before {
		content: '\e757';
	}

	.tui-icon-camera-add:before {
		content: '\e756';
	}

	.tui-icon-card:before {
		content: '\e755';
	}

	.tui-icon-card-fill:before {
		content: '\e754';
	}

	.tui-icon-cart:before {
		content: '\e753';
	}

	.tui-icon-cart-fill:before {
		content: '\e752';
	}

	.tui-icon-category:before {
		content: '\e751';
	}

	.tui-icon-category-fill:before {
		content: '\e750';
	}

	.tui-icon-check:before {
		content: '\e74f';
	}

	.tui-icon-circle:before {
		content: '\e74e';
	}

	.tui-icon-circle-fill:before {
		content: '\e74d';
	}

	.tui-icon-circle-selected:before {
		content: '\e74c';
	}

	.tui-icon-clock:before {
		content: '\e74b';
	}

	.tui-icon-clock-fill:before {
		content: '\e74a';
	}

	.tui-icon-close:before {
		content: '\e749';
	}

	.tui-icon-close-fill:before {
		content: '\e748';
	}

	.tui-icon-community:before {
		content: '\e747';
	}

	.tui-icon-community-fill:before {
		content: '\e746';
	}

	.tui-icon-computer:before {
		content: '\e745';
	}

	.tui-icon-computer-fill:before {
		content: '\e744';
	}

	.tui-icon-coupon:before {
		content: '\e743';
	}

	.tui-icon-delete:before {
		content: '\e742';
	}

	.tui-icon-deletekey:before {
		content: '\e741';
	}

	.tui-icon-dingtalk:before {
		content: '\e740';
	}

	.tui-icon-dissatisfied:before {
		content: '\e73f';
	}

	.tui-icon-down:before {
		content: '\e73e';
	}

	.tui-icon-download:before {
		content: '\e73d';
	}

	.tui-icon-edit:before {
		content: '\e73c';
	}

	.tui-icon-ellipsis:before {
		content: '\e73b';
	}

	.tui-icon-enlarge:before {
		content: '\e73a';
	}

	.tui-icon-evaluate:before {
		content: '\e739';
	}

	.tui-icon-exchange:before {
		content: '\e738';
	}

	.tui-icon-explain:before {
		content: '\e737';
	}

	.tui-icon-explain-fill:before {
		content: '\e736';
	}

	.tui-icon-explore:before {
		content: '\e735';
	}

	.tui-icon-explore-fill:before {
		content: '\e734';
	}

	.tui-icon-eye:before {
		content: '\e733';
	}

	.tui-icon-feedback:before {
		content: '\e732';
	}

	.tui-icon-fingerprint:before {
		content: '\e730';
	}

	.tui-icon-friendadd:before {
		content: '\e72f';
	}

	.tui-icon-friendadd-fill:before {
		content: '\e72e';
	}

	.tui-icon-gps:before {
		content: '\e72d';
	}

	.tui-icon-histogram:before {
		content: '\e72c';
	}

	.tui-icon-home:before {
		content: '\e72b';
	}

	.tui-icon-home-fill:before {
		content: '\e72a';
	}

	.tui-icon-house:before {
		content: '\e729';
	}

	.tui-icon-imface:before {
		content: '\e728';
	}

	.tui-icon-imkeyboard:before {
		content: '\e727';
	}

	.tui-icon-immore:before {
		content: '\e726';
	}

	.tui-icon-imvoice:before {
		content: '\e725';
	}

	.tui-icon-ios:before {
		content: '\e724';
	}

	.tui-icon-kefu:before {
		content: '\e723';
	}

	.tui-icon-label:before {
		content: '\e722';
	}

	.tui-icon-label-fill:before {
		content: '\e721';
	}

	.tui-icon-like:before {
		content: '\e720';
	}

	.tui-icon-like-fill:before {
		content: '\e71f';
	}

	.tui-icon-link:before {
		content: '\e71e';
	}

	.tui-icon-listview:before {
		content: '\e71d';
	}

	.tui-icon-loading:before {
		content: '\e71c';
	}

	.tui-icon-location:before {
		content: '\e71b';
	}

	.tui-icon-mail:before {
		content: '\e71a';
	}

	.tui-icon-mail-fill:before {
		content: '\e719';
	}

	.tui-icon-manage:before {
		content: '\e718';
	}

	.tui-icon-manage-fill:before {
		content: '\e717';
	}

	.tui-icon-member:before {
		content: '\e716';
	}

	.tui-icon-member-fill:before {
		content: '\e715';
	}

	.tui-icon-message:before {
		content: '\e714';
	}

	.tui-icon-message-fill:before {
		content: '\e713';
	}

	.tui-icon-mobile:before {
		content: '\e712';
	}

	.tui-icon-moments:before {
		content: '\e711';
	}

	.tui-icon-more:before {
		content: '\e710';
	}

	.tui-icon-more-fill:before {
		content: '\e70f';
	}

	.tui-icon-narrow:before {
		content: '\e70e';
	}

	.tui-icon-news:before {
		content: '\e70d';
	}

	.tui-icon-news-fill:before {
		content: '\e70c';
	}

	.tui-icon-nodata:before {
		content: '\e70b';
	}

	.tui-icon-notice:before {
		content: '\e699';
	}

	.tui-icon-notice-fill:before {
		content: '\e698';
	}

	.tui-icon-offline:before {
		content: '\e697';
	}

	.tui-icon-offline-fill:before {
		content: '\e696';
	}

	.tui-icon-oppose:before {
		content: '\e695';
	}

	.tui-icon-oppose-fill:before {
		content: '\e694';
	}

	.tui-icon-order:before {
		content: '\e693';
	}

	.tui-icon-partake:before {
		content: '\e692';
	}

	.tui-icon-people:before {
		content: '\e691';
	}

	.tui-icon-people-fill:before {
		content: '\e690';
	}

	.tui-icon-pic:before {
		content: '\e68f';
	}

	.tui-icon-pic-fill:before {
		content: '\e68e';
	}

	.tui-icon-picture:before {
		content: '\e68d';
	}

	.tui-icon-pie:before {
		content: '\e68c';
	}

	.tui-icon-play:before {
		content: '\e68b';
	}

	.tui-icon-plus:before {
		content: '\e689';
	}

	.tui-icon-polygonal:before {
		content: '\e688';
	}

	.tui-icon-position:before {
		content: '\e687';
	}

	.tui-icon-position-fill:before {
		content: '\e686';
	}

	.tui-icon-pwd:before {
		content: '\e685';
	}

	.tui-icon-qq:before {
		content: '\e684';
	}

	.tui-icon-qrcode:before {
		content: '\e682';
	}

	.tui-icon-redpacket:before {
		content: '\e681';
	}

	.tui-icon-redpacket-fill:before {
		content: '\e680';
	}

	.tui-icon-reduce:before {
		content: '\e67f';
	}

	.tui-icon-refresh:before {
		content: '\e67e';
	}

	.tui-icon-revoke:before {
		content: '\e67d';
	}

	.tui-icon-satisfied:before {
		content: '\e67c';
	}

	.tui-icon-screen:before {
		content: '\e67b';
	}

	.tui-icon-search:before {
		content: '\e67a';
	}

	.tui-icon-search-2:before {
		content: '\e679';
	}

	.tui-icon-send:before {
		content: '\e678';
	}

	.tui-icon-service:before {
		content: '\e677';
	}

	.tui-icon-service-fill:before {
		content: '\e676';
	}

	.tui-icon-setup:before {
		content: '\e675';
	}

	.tui-icon-setup-fill:before {
		content: '\e674';
	}

	.tui-icon-share:before {
		content: '\e673';
	}

	.tui-icon-share-fill:before {
		content: '\e672';
	}

	.tui-icon-shield:before {
		content: '\e671';
	}

	.tui-icon-shop:before {
		content: '\e670';
	}

	.tui-icon-shop-fill:before {
		content: '\e66f';
	}

	.tui-icon-shut:before {
		content: '\e66e';
	}

	.tui-icon-signin:before {
		content: '\e66d';
	}

	.tui-icon-sina:before {
		content: '\e66c';
	}

	.tui-icon-skin:before {
		content: '\e66b';
	}

	.tui-icon-soso:before {
		content: '\e669';
	}

	.tui-icon-square:before {
		content: '\e668';
	}

	.tui-icon-square-fill:before {
		content: '\e667';
	}

	.tui-icon-square-selected:before {
		content: '\e666';
	}

	.tui-icon-star:before {
		content: '\e665';
	}

	.tui-icon-star-fill:before {
		content: '\e664';
	}

	.tui-icon-strategy:before {
		content: '\e663';
	}

	.tui-icon-sweep:before {
		content: '\e662';
	}

	.tui-icon-time:before {
		content: '\e661';
	}

	.tui-icon-time-fill:before {
		content: '\e660';
	}

	.tui-icon-todown:before {
		content: '\e65f';
	}

	.tui-icon-toleft:before {
		content: '\e65e';
	}

	.tui-icon-tool:before {
		content: '\e65d';
	}

	.tui-icon-top:before {
		content: '\e65c';
	}

	.tui-icon-toright:before {
		content: '\e65b';
	}

	.tui-icon-towardsleft:before {
		content: '\e65a';
	}

	.tui-icon-towardsright:before {
		content: '\e659';
	}

	.tui-icon-towardsright-fill:before {
		content: '\e658';
	}

	.tui-icon-transport:before {
		content: '\e657';
	}

	.tui-icon-transport-fill:before {
		content: '\e656';
	}

	.tui-icon-turningdown:before {
		content: '\e654';
	}

	.tui-icon-turningleft:before {
		content: '\e653';
	}

	.tui-icon-turningright:before {
		content: '\e652';
	}

	.tui-icon-turningup:before {
		content: '\e651';
	}

	.tui-icon-unreceive:before {
		content: '\e650';
	}

	.tui-icon-unseen:before {
		content: '\e64f';
	}

	.tui-icon-up:before {
		content: '\e64e';
	}

	.tui-icon-upload:before {
		content: '\e64c';
	}

	.tui-icon-video:before {
		content: '\e64b';
	}

	.tui-icon-voice:before {
		content: '\e649';
	}

	.tui-icon-voice-fill:before {
		content: '\e648';
	}

	.tui-icon-voipphone:before {
		content: '\e647';
	}

	.tui-icon-wallet:before {
		content: '\e646';
	}

	.tui-icon-warning:before {
		content: '\e645';
	}

	.tui-icon-wealth:before {
		content: '\e644';
	}

	.tui-icon-wealth-fill:before {
		content: '\e643';
	}

	.tui-icon-weather:before {
		content: '\e642';
	}

	.tui-icon-wechat:before {
		content: '\e641';
	}

	.tui-icon-wifi:before {
		content: '\e640';
	}
</style>