hz-zhhq-app/components/icon/icon.vue

<template>
	<view class="tui-icon-class tui-icon" :class="'tui-icon-'+name" :style="{ color: color, fontSize: size + 'px',fontWeight:bold?'bold':'normal'}"
	 @tap="handleClick(index)"></view>
</template>

<script>
	export default {
		name: "tuiIcon",
		props: {
			name: {
				type: String,
				default: ''
			},
			size: {
				type: Number,
				default: 32
			},
			color: {
				type: String,
				default: ''
			},
			bold: {
				type: Boolean,
				default: false
			},
			visible: {
				type: Boolean,
				default: true
			},
			index: {
				type: Number,
				default: 0
			}
		},
		methods: {
			handleClick(index) {
				this.$emit('click', {
					index
				})
			}
		}
	}
</script>

<style>
	@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-size: 30px;
		font-style: normal;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		display: inline-block;
		color: #999;
		vertical-align: middle;
		line-height: 1;
		padding-top: -1px;
		margin-bottom: 1px;
	}

	.tui-icon-friendadd:before {
		content: "\e6ca";
	}

	.tui-icon-friendadd-fill:before {
		content: "\e6c9";
	}

	.tui-icon-service:before {
		content: "\e664";
	}

	.tui-icon-service-fill:before {
		content: "\e665";
	}

	.tui-icon-explore:before {
		content: "\e666";
	}

	.tui-icon-explore-fill:before {
		content: "\e667";
	}

	.tui-icon-wealth:before {
		content: "\e668";
	}

	.tui-icon-wealth-fill:before {
		content: "\e669";
	}

	.tui-icon-exchange:before {
		content: "\e638";
	}

	.tui-icon-refresh:before {
		content: "\e640";
	}

	.tui-icon-search:before {
		content: "\e622";
	}

	.tui-icon-search-2:before {
		content: "\e634";
	}

	.tui-icon-todown:before {
		content: "\e64f";
	}

	.tui-icon-toleft:before {
		content: "\e650";
	}

	.tui-icon-toright:before {
		content: "\e651";
	}

	.tui-icon-video:before {
		content: "\e657";
	}

	.tui-icon-people:before {
		content: "\e736";
	}

	.tui-icon-people-fill:before {
		content: "\e735";
	}

	.tui-icon-community:before {
		content: "\e741";
	}

	.tui-icon-community-fill:before {
		content: "\e740";
	}

	.tui-icon-ios:before {
		content: "\e66a";
	}

	.tui-icon-android:before {
		content: "\e66c";
	}

	.tui-icon-square:before {
		content: "\e720";
	}

	.tui-icon-square-fill:before {
		content: "\e721";
	}

	.tui-icon-square-selected:before {
		content: "\e722";
	}

	.tui-icon-close:before {
		content: "\e725";
	}

	.tui-icon-close-fill:before {
		content: "\e724";
	}

	.tui-icon-shut:before {
		content: "\e723";
	}

	.tui-icon-plus:before {
		content: "\e727";
	}

	.tui-icon-add:before {
		content: "\e726";
	}

	.tui-icon-add-fill:before {
		content: "\e728";
	}

	.tui-icon-reduce:before {
		content: "\e729";
	}

	.tui-icon-about:before {
		content: "\e72b";
	}

	.tui-icon-about-fill:before {
		content: "\e72a";
	}

	.tui-icon-explain:before {
		content: "\e72d";
	}

	.tui-icon-explain-fill:before {
		content: "\e72c";
	}

	.tui-icon-check:before {
		content: "\e72e";
	}

	.tui-icon-circle:before {
		content: "\e72f";
	}

	.tui-icon-circle-fill:before {
		content: "\e732";
	}

	.tui-icon-circle-selected:before {
		content: "\e733";
	}

	.tui-icon-star:before {
		content: "\e737";
	}

	.tui-icon-star-fill:before {
		content: "\e734";
	}

	.tui-icon-revoke:before {
		content: "\e738";
	}

	.tui-icon-shop:before {
		content: "\e73a";
	}

	.tui-icon-shop-fill:before {
		content: "\e739";
	}

	.tui-icon-order:before {
		content: "\e73b";
	}

	.tui-icon-feedback:before {
		content: "\e73c";
	}

	.tui-icon-share:before {
		content: "\e75c";
	}

	.tui-icon-share-fill:before {
		content: "\e75b";
	}

	.tui-icon-more:before {
		content: "\e633";
	}

	.tui-icon-more-fill:before {
		content: "\eb98";
	}

	.tui-icon-strategy:before {
		content: "\e73f";
	}

	.tui-icon-cart:before {
		content: "\e743";
	}

	.tui-icon-cart-fill:before {
		content: "\e742";
	}

	.tui-icon-sweep:before {
		content: "\e74b";
	}

	.tui-icon-screen:before {
		content: "\e74c";
	}

	.tui-icon-clock:before {
		content: "\e750";
	}

	.tui-icon-clock-fill:before {
		content: "\e74f";
	}

	.tui-icon-home:before {
		content: "\e752";
	}

	.tui-icon-home-fill:before {
		content: "\e751";
	}

	.tui-icon-category:before {
		content: "\e754";
	}

	.tui-icon-category-fill:before {
		content: "\e753";
	}

	.tui-icon-notice:before {
		content: "\e759";
	}

	.tui-icon-notice-fill:before {
		content: "\e758";
	}

	.tui-icon-like:before {
		content: "\e761";
	}

	.tui-icon-like-fill:before {
		content: "\e760";
	}

	.tui-icon-bottom:before {
		content: "\e76a";
	}

	.tui-icon-top:before {
		content: "\e76c";
	}

	.tui-icon-towardsright:before {
		content: "\e778";
	}

	.tui-icon-towardsright-fill:before {
		content: "\e777";
	}

	.tui-icon-towardsleft:before {
		content: "\e77a";
	}

	.tui-icon-camera:before {
		content: "\e77f";
	}

	.tui-icon-camera-fill:before {
		content: "\e77e";
	}

	.tui-icon-camera-add:before {
		content: "\e780";
	}

	.tui-icon-loading:before {
		content: "\e781";
	}

	.tui-icon-wifi:before {
		content: "\e783";
	}

	.tui-icon-agree:before {
		content: "\e794";
	}

	.tui-icon-agree-fill:before {
		content: "\e793";
	}

	.tui-icon-mobile:before {
		content: "\e655";
	}

	.tui-icon-qrcode:before {
		content: "\e605";
	}

	.tui-icon-coupon:before {
		content: "\e600";
	}

	.tui-icon-back:before {
		content: "\e7ed";
	}

	.tui-icon-transport:before {
		content: "\e882";
	}

	.tui-icon-transport-fill:before {
		content: "\e883";
	}

	.tui-icon-send:before {
		content: "\e893";
	}

	.tui-icon-bankcard:before {
		content: "\e937";
	}

	.tui-icon-bankcard-fill:before {
		content: "\e936";
	}

	.tui-icon-eye:before {
		content: "\e6cf";
	}

	.tui-icon-calendar:before {
		content: "\eb93";
	}

	.tui-icon-picture:before {
		content: "\e6c7";
	}

	.tui-icon-oppose:before {
		content: "\e815";
	}

	.tui-icon-oppose-fill:before {
		content: "\e814";
	}

	.tui-icon-pie:before {
		content: "\eb95";
	}

	.tui-icon-polygonal:before {
		content: "\eb96";
	}

	.tui-icon-histogram:before {
		content: "\eb99";
	}

	.tui-icon-down:before {
		content: "\ec0b";
	}

	.tui-icon-up:before {
		content: "\ec0c";
	}

	.tui-icon-narrow:before {
		content: "\ec13";
	}

	.tui-icon-enlarge:before {
		content: "\ec14";
	}

	.tui-icon-pwd:before {
		content: "\e626";
	}

	.tui-icon-ellipsis:before {
		content: "\e76b";
	}

	.tui-icon-location:before {
		content: "\e7f2";
	}

	.tui-icon-delete:before {
		content: "\e608";
	}

	.tui-icon-card:before {
		content: "\e91c";
	}

	.tui-icon-card-fill:before {
		content: "\e91b";
	}

	.tui-icon-alarm:before {
		content: "\e6e9";
	}

	.tui-icon-alarm-fill:before {
		content: "\e6e8";
	}

	.tui-icon-computer:before {
		content: "\e6ec";
	}

	.tui-icon-computer-fill:before {
		content: "\e6eb";
	}

	.tui-icon-position:before {
		content: "\e8fe";
	}

	.tui-icon-position-fill:before {
		content: "\e8ff";
	}

	.tui-icon-member:before {
		content: "\e704";
	}

	.tui-icon-member-fill:before {
		content: "\e703";
	}

	.tui-icon-label:before {
		content: "\e707";
	}

	.tui-icon-label-fill:before {
		content: "\e708";
	}

	.tui-icon-mail:before {
		content: "\e70b";
	}

	.tui-icon-mail-fill:before {
		content: "\e70c";
	}

	.tui-icon-manage:before {
		content: "\e70e";
	}

	.tui-icon-manage-fill:before {
		content: "\e70d";
	}

	.tui-icon-message:before {
		content: "\e70f";
	}

	.tui-icon-message-fill:before {
		content: "\e710";
	}

	.tui-icon-offline:before {
		content: "\e716";
	}

	.tui-icon-offline-fill:before {
		content: "\e715";
	}

	.tui-icon-redpacket:before {
		content: "\e71e";
	}

	.tui-icon-redpacket-fill:before {
		content: "\e71d";
	}

	.tui-icon-bag:before {
		content: "\e756";
	}

	.tui-icon-bag-fill:before {
		content: "\e755";
	}

	.tui-icon-setup:before {
		content: "\e75a";
	}

	.tui-icon-setup-fill:before {
		content: "\e757";
	}

	.tui-icon-news:before {
		content: "\e75e";
	}

	.tui-icon-news-fill:before {
		content: "\e75d";
	}

	.tui-icon-time:before {
		content: "\e764";
	}

	.tui-icon-time-fill:before {
		content: "\e75f";
	}

	.tui-icon-voice:before {
		content: "\e766";
	}

	.tui-icon-voice-fill:before {
		content: "\e765";
	}

	.tui-icon-nodata:before {
		content: "\e611";
	}

	.tui-icon-link:before {
		content: "\eb97";
	}

	.tui-icon-edit:before {
		content: "\e69a";
	}

	.tui-icon-unseen:before {
		content: "\e6a2";
	}

	.tui-icon-arrowup:before {
		content: "\e658";
	}

	.tui-icon-arrowleft:before {
		content: "\e659";
	}

	.tui-icon-arrowdown:before {
		content: "\e65a";
	}

	.tui-icon-arrowright:before {
		content: "\e65b";
	}

	.tui-icon-turningleft:before {
		content: "\e65c";
	}

	.tui-icon-turningright:before {
		content: "\e65d";
	}

	.tui-icon-turningup:before {
		content: "\e65e";
	}

	.tui-icon-turningdown:before {
		content: "\e65f";
	}

	.tui-icon-sina:before {
		content: "\e662";
	}

	.tui-icon-applets:before {
		content: "\e673";
	}

	.tui-icon-qq:before {
		content: "\e604";
	}

	.tui-icon-wechat:before {
		content: "\e674";
	}

	.tui-icon-moments:before {
		content: "\e61e";
	}

	.tui-icon-dingtalk:before {
		content: "\e675";
	}

	.tui-icon-alipay:before {
		content: "\e677";
	}

	.tui-icon-skin:before {
		content: "\eb9e";
	}

	.tui-icon-house:before {
		content: "\eb9f";
	}

	.tui-icon-download:before {
		content: "\e602";
	}

	.tui-icon-upload:before {
		content: "\e63b";
	}

	.tui-icon-kefu:before {
		content: "\e601";
	}

	.tui-icon-sport:before {
		content: "\eba0";
	}

	.tui-icon-gps:before {
		content: "\eb9a";
	}

	.tui-icon-shield:before {
		content: "\eba3";
	}

	.tui-icon-voipphone:before {
		content: "\eba2";
	}

	.tui-icon-wallet:before {
		content: "\eb92";
	}

	.tui-icon-attestation:before {
		content: "\eb91";
	}

	.tui-icon-addressbook:before {
		content: "\eb90";
	}

	.tui-icon-addmessage:before {
		content: "\eb8f";
	}

	.tui-icon-signin:before {
		content: "\e643";
	}

	.tui-icon-evaluate:before {
		content: "\e642";
	}

	.tui-icon-unreceive:before {
		content: "\e641";
	}

	.tui-icon-balloon:before {
		content: "\e627";
	}

	.tui-icon-partake:before {
		content: "\e603";
	}

	.tui-icon-listview:before {
		content: "\e67b";
	}

	.tui-icon-weather:before {
		content: "\e694";
	}

	.tui-icon-tool:before {
		content: "\e61b";
	}

	.tui-icon-imface:before {
		content: "\eb9b";
	}

	.tui-icon-deletekey:before {
		content: "\e7b8";
	}

	.tui-icon-fingerprint:before {
		content: "\e66e";
	}


	.tui-icon-warning:before {
		content: "\e8eb";
	}

	.tui-icon-soso:before {
		content: "\e8da";
	}

	.tui-icon-satisfied:before {
		content: "\e8db";
	}

	.tui-icon-dissatisfied:before {
		content: "\e8dc";
	}

	.tui-icon-pic:before {
		content: "\e8d2";
	}

	.tui-icon-pic-fill:before {
		content: "\e8d3";
	}

	.tui-icon-play:before {
		content: "\e606";
	}
</style>