lhl 3 tahun lalu
induk
melakukan
3f49a3e6f1
5 mengubah file dengan 166 tambahan dan 35 penghapusan
  1. 33 0
      js_sdk/xb-copy/uni-copy.js
  2. 0 33
      pages/money/wallet.vue
  3. 133 2
      pages/user/user.vue
  4. TEMPAT SAMPAH
      static/img/img009.png
  5. TEMPAT SAMPAH
      static/img/img010.png

+ 33 - 0
js_sdk/xb-copy/uni-copy.js

@@ -0,0 +1,33 @@
+export default function uniCopy(content) {
+	/**
+	 * 小程序端 和 app端的复制逻辑
+	 */
+	//#ifndef H5
+	uni.setClipboardData({
+		data: content,
+		success: function() {
+			console.log('success');
+			return true
+		}
+	});
+	//#endif
+	
+	/**
+	 * H5端的复制逻辑
+	 */
+	// #ifdef H5
+	if (!document.queryCommandSupported('copy')) { //为了兼容有些浏览器 queryCommandSupported 的判断
+		// 不支持
+		return false
+	}
+	let textarea = document.createElement("textarea")
+	textarea.value = content
+	textarea.readOnly = "readOnly"
+	document.body.appendChild(textarea)
+	textarea.select() // 选择对象
+	textarea.setSelectionRange(0, content.length) //核心
+	let result = document.execCommand("copy") // 执行浏览器复制命令
+	textarea.remove()
+	return result
+	// #endif
+}

+ 0 - 33
pages/money/wallet.vue

@@ -58,39 +58,6 @@
 			</swiper-item>
 		</swiper>
 	</view>
-<!-- 	<view class="content">
-		<view class="content-money">
-			<view class="money-box">
-				<view class="text">可提现金额(元)</view>
-				<view class="money">{{ money | getMoneyStyle }}</view>
-			</view>
-			<view class="moneyTx" @click="navto('/pages/money/recharge')">充值</view>
-		</view>
-		<view class="navbar">
-			<view v-for="(item, index) in navList" :key="index" class="nav-item" :class="{ current: tabCurrentIndex === index }" @click="tabClick(index)">{{ item.text }}</view>
-		</view>
-		<swiper :current="tabCurrentIndex" :style="{'height':maxheight+'px'}" class="swiper-box" duration="300" @change="changeTab">
-			<swiper-item class="tab-content" v-for="(tabItem, tabIndex) in navList" :key="tabIndex">
-				<scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData">
-					<empty v-if="tabItem.loaded === true && tabItem.orderList.length === 0"></empty>
-					<view v-for="(item, index) in tabItem.orderList" :key="index" class="order-item flex">
-						<view class="title-box">
-							<view class="title">
-								<text>{{ item.title }}</text>
-							</view>
-							<view class="time">
-								<text>{{ item.add_time }}</text>
-							</view>
-						</view>
-						<view class="money">
-							<text>{{ (item.pm == 0 ? '-' : '+') + item.number }}</text>
-						</view>
-					</view>
-					<uni-load-more :status="tabItem.loadingType"></uni-load-more>
-				</scroll-view>
-			</swiper-item>
-		</swiper>
-	</view> -->
 </template>
 
 <script>

+ 133 - 2
pages/user/user.vue

@@ -106,7 +106,7 @@
 			<view class="">收货地址</view>
 			<image src="../../static/icon/goto.png" mode="widthFix" class="right-img"></image>
 		</view>
-		<view class="btm-box flex">
+		<view class="btm-box flex" @click="kfOpen">
 			<image src="../../static/icon/kf.png" mode="widthFix" class="left-img"></image>
 			<view class="">客服</view>
 			<image src="../../static/icon/goto.png" mode="widthFix" class="right-img"></image>
@@ -117,6 +117,25 @@
 			<image src="../../static/icon/goto.png" mode="widthFix" class="right-img"></image>
 		</view>
 		<view class="btm" style="height: 44px;"></view>
+		<!-- 客服 -->
+		<uni-popup ref="popupkf" type="center">
+			<view class="popup-box">
+				<view class="img">
+					<image src="../../static/img/img009.png" mode=""></image>
+				</view>
+				<view class="mian">
+					<view class="delivery">
+						<view class="title">已经为您定制专属客服</view>
+						<image src="../../static/img/img010.png" mode=""></image>
+					</view>
+					<view class="nocancel">客服VX:{{ text }}</view>
+					<view class="comfirm-box">
+						<view class="cancel" @click="kfClose()">取消</view>
+						<view class="comfirm" @click="comfirm(text)">复制微信</view>
+					</view>
+				</view>
+			</view>
+		</uni-popup>
 		<u-tabbar activeColor="#EE0979" v-model="current" :list="tabbar" :mid-button="true"></u-tabbar>
 	</view>
 </template>
@@ -127,6 +146,7 @@ import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
 import { orderData, userinfo } from '@/api/user.js';
 import { saveUrl, interceptor } from '@/utils/loginUtils.js';
 import { tabbar } from '@/utils/tabbar.js';
+import uniCopy from '@/js_sdk/xb-copy/uni-copy.js';
 let startY = 0,
 	moveY = 0,
 	pageAtTop = true;
@@ -137,6 +157,7 @@ export default {
 	},
 	data() {
 		return {
+			text: '',
 			tabbar: tabbar,
 			current: 4,
 			coverTransform: 'translateY(0px)',
@@ -283,7 +304,28 @@ export default {
 			this.moving = false;
 			this.coverTransition = 'transform 0.3s cubic-bezier(.21,1.93,.53,.64)';
 			this.coverTransform = 'translateY(0px)';
-		}
+		},
+		kfOpen() {
+			this.$refs.popupkf.open()
+		},
+		kfClose() {
+			this.$refs.popupkf.close()
+		},
+		comfirm(text) {
+			console.log(text);
+			const result = uniCopy(text);
+			if (result === false) {
+				uni.showToast({
+					title: '不支持'
+				});
+			} else {
+				uni.showToast({
+					title: '复制成功',
+					icon: 'none'
+				});
+			}
+			this.$refs.popup.close();
+		},
 	}
 };
 </script>
@@ -666,4 +708,93 @@ page {
 		padding-left: 12rpx;
 	}
 }
+.popup-box {
+		width: 522rpx;
+		height: 605rpx;
+		background-color: #ffffff;
+		border-radius: 20rpx;
+		position: relative;
+
+		.img {
+			position: relative;
+			top: -56rpx;
+			left: 0;
+			width: 522rpx;
+			height: 132rpx;
+			display: flex;
+			justify-content: center;
+
+			image {
+				border-radius: 20rpx 20rpx 0 0;
+				width: 450rpx;
+				height: 132rpx;
+			}
+		}
+
+		.mian {
+			margin-top: -44rpx;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			// padding: 32rpx 32rpx;
+			background-color: #ffffff;
+			border-radius: 0 0 20rpx 20rpx;
+			text-align: center;
+
+			.delivery {
+				font-size: 40rpx;
+				color: #333333;
+				display: flex;
+				align-items: center;
+				flex-direction: column;
+
+				.title {}
+
+				image {
+					margin-top: 48rpx;
+					width: 172rpx;
+					height: 160rpx;
+				}
+			}
+
+			.nocancel {
+				font-size: 32rpx;
+				color: #333333;
+				margin-top: 14rpx;
+			}
+
+			.comfirm-box {
+				margin-top: 52rpx;
+				display: flex;
+				// margin-bottom: 32rpx;
+
+				// justify-content: space-around;
+				.cancel {
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					width: 197rpx;
+					height: 74rpx;
+					border: 1px solid #dcc786;
+					border-radius: 38rpx;
+
+					font-size: 32rpx;
+					color: #605128;
+				}
+
+				.comfirm {
+					margin-left: 32rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					width: 197rpx;
+					height: 74rpx;
+					background: linear-gradient(-90deg, #d1ba77 0%, #f7e8ad 100%);
+					border-radius: 38px;
+					font-size: 32rpx;
+					color: #605128;
+				}
+			}
+		}
+	}
 </style>

TEMPAT SAMPAH
static/img/img009.png


TEMPAT SAMPAH
static/img/img010.png