Blame view

components/thorui/tui-link/tui-link.vue 2.27 KB
46b6767c   刘淇   init 提交到库
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
  <template>
  	<a v-if="isShowA" class="tui-link__text" :href="href" :class="{'tui-link__underline':underline}"
  		:style="{color:getColor,fontSize:size+'rpx'}" :download="download">
  		<slot>{{text || href}}</slot>
  	</a>
  	<!-- #ifndef APP-NVUE -->
  	<text v-else class="tui-link__text" :class="{'tui-link__underline':underline}"
  		:style="{color:getColor,fontSize:size+'rpx'}" @tap="openURL">
  		<slot>{{text || href}}</slot>
  	</text>
  	<!-- #endif -->
  	<!-- #ifdef APP-NVUE -->
  	<text v-else class="tui-link__text" :class="{'tui-link__underline':underline}"
  		:style="{color:getColor,fontSize:size+'rpx'}" @tap="openURL">{{text || href}}</text>
  	<!-- #endif -->
  </template>
  
  <script>
  	export default {
  		name: 'tuiLink',
  		options: {
  			virtualHost: true
  		},
  		props: {
  			href: {
  				type: String,
  				default: ''
  			},
  			text: {
  				type: String,
  				default: ''
  			},
  			download: {
  				type: String,
  				default: ''
  			},
  			underline: {
  				type: [Boolean, String],
  				default: false
  			},
  			copyTips: {
  				type: String,
  				default: '链接已复制'
  			},
  			color: {
  				type: String,
  				default: ''
  			},
  			size: {
  				type: [Number, String],
  				default: 28
  			}
  		},
  		computed: {
  			isShowA() {
  				let h5 = false
  				// #ifdef H5
  				h5 = true;
  				// #endif
  				if ((this.isMail() || this.isTel()) && h5) {
  					return true;
  				}
  				return false;
  			},
  			getColor() {
  				return this.color || (uni && uni.$tui && uni.$tui.color.link) || '#586c94'
  			}
  		},
  		methods: {
  			isMail() {
  				return this.href.startsWith('mailto:');
  			},
  			isTel() {
  				return this.href.startsWith('tel:');
  			},
  			openURL() {
  				// #ifdef APP-PLUS
  				if (this.isTel()) {
  					this.makePhoneCall(this.href.replace('tel:', ''));
  				} else {
  					plus.runtime.openURL(this.href);
  				}
  				// #endif
  				// #ifdef H5
  				window.open(this.href)
  				// #endif
  				// #ifdef MP
  				uni.setClipboardData({
  					data: this.href,
  					success: () => {
  						uni.showToast({
  							title: this.copyTips,
  							icon: 'none'
  						});
  					}
  				});
  
  				// #endif
  			},
  			makePhoneCall(phoneNumber) {
  				uni.makePhoneCall({
  					phoneNumber
  				})
  			}
  		}
  	}
  </script>
  
  <style scoped>
  	/* #ifdef H5 */
  	.tui-link__text {
  		cursor: pointer;
  	}
  
  	/* #endif */
  	.tui-link__underline {
  		text-decoration: underline;
  	}
  </style>