first commit

components/ttMsg/ttMsg.vue

@@ -0,0 +1,92 @@
+<template>
+	<view>
+		<!-- #ifdef MP-TOUTIAO -->
+		<!-- 抖音im客服 -->
+		<view class="imKefu">
+			<button open-type="im" class="imKefu-btn" :data-im-id="imId" @im="imCallback" @error="onimError">
+				<image class="imKefu-img" src="../../static/images/me/imMsg.png" mode=""></image>
+				<view class="imKefu-txt">
+					在线客服
+				</view>
+			</button>
+		</view>
+		<!-- #endif -->
+	</view>
+</template>
+
+<script>
+	export default {
+		name: "ttMsg",
+		data() {
+			return {
+				imId: '', //客服抖音号
+			};
+		},
+		created() {
+			this.imId = uni.getStorageSync('imId')
+		},
+		methods: {
+			imCallback(e) {
+				console.log("跳转IM客服成功", e.detail);
+			},
+			onimError(e) {
+				uni.showToast({
+					title: '拉起IM客服失败',
+					icon: 'none'
+				})
+				console.log("拉起IM客服失败", e.detail);
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.imKefu-btn::after {
+		border: none;
+		background-color: none;
+	}
+
+	.imKefu-btn {
+		display: flex;
+		align-items: center;
+		position: relative;
+		display: block;
+		margin-left: auto;
+		margin-right: auto;
+		padding-left: 0px;
+		padding-right: 0px;
+		box-sizing: border-box;
+		text-decoration: none;
+		// line-height: 140rpx;
+		overflow: hidden;
+		color: #000000;
+		/* background-color: #fff; */
+		background: rgba(255, 255, 255, 0);
+		font-size: 22rpx;
+		width: 100rpx;
+		height: 150rpx;
+	}
+
+	.imKefu {
+		position: fixed;
+		right: 30rpx;
+		bottom: 200rpx;
+		width: 100rpx;
+		height: 150rpx;
+		z-index: 999999;
+
+		.imKefu-img {
+			width: 100rpx;
+			height: 100rpx;
+		}
+
+		.imKefu-txt {
+			width: 100rpx;
+			text-align: center;
+			color: #000000;
+			position: absolute;
+			bottom: 0;
+			font-size: 22rpx;
+		}
+	}
+</style>