From 2582a6783913abe7afacb1968763eb52c032d95f Mon Sep 17 00:00:00 2001
From: huliyong <2783385703@qq.com>
Date: Sun, 25 Aug 2024 11:44:49 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E4=BC=A0=E8=AE=A2=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 locale/en.js            |   6 +-
 pages/center/center.vue |   4 +-
 pages/order/order.vue   | 255 ++++++++++++++++++++++++++++++++----------------
 3 files changed, 178 insertions(+), 87 deletions(-)

diff --git a/locale/en.js b/locale/en.js
index e6ceddd..177a35d 100644
--- a/locale/en.js
+++ b/locale/en.js
@@ -148,10 +148,10 @@ export default {
 			"login-now": "Lonin Now"
 		},
 		"order": {
-			"Submit_New": "Submit New",
+			"Submit_New": "Submit",
 			"Speedip": "Speedip",
-			"Total_Amount": "Total Amount",
-			"Profit": "Profit",
+			"Total_Amount": "Need to recharge",
+			"Profit": "Commission",
 			"no-Order": "No Order",
 			"take-stroll": "Take a Stroll",
 			"class_1": "ALL",
diff --git a/pages/center/center.vue b/pages/center/center.vue
index f1ac791..eb1ab51 100644
--- a/pages/center/center.vue
+++ b/pages/center/center.vue
@@ -206,7 +206,7 @@
 		</view>
 
 		<!-- 填写地址弹框 -->
-		<u-popup :show="showAddress" mode="center" bgColor="fff" @close="showAddress=false;$play()">
+		<!-- <u-popup :show="showAddress" mode="center" bgColor="fff" @close="showAddress=false;$play()">
 			<view class="address-content">
 				<view class="address-top">
 					<view class="title">{{ $t('page.center.Tips') }}</view>
@@ -219,7 +219,7 @@
 				</view>
 				<view @click="editMoneyAddress" class="save">{{ $t('page.center.save') }}</view>
 			</view>
-		</u-popup>
+		</u-popup> -->
 
 		<sTabbar select="4" />
 
diff --git a/pages/order/order.vue b/pages/order/order.vue
index 0b51628..b9030d5 100644
--- a/pages/order/order.vue
+++ b/pages/order/order.vue
@@ -1,7 +1,8 @@
 <template>
 	<view class="order  bx">
-		<u-sticky>
-			<view style="width: 100%;display: flex;padding: 20rpx 0rpx;font-size: 28rpx;">
+		<!-- <u-sticky> -->
+		<!-- <view style="width: 100%;display: flex;padding: 20rpx 0rpx;
+			font-size: 28rpx;">
 				<view style="flex: 1;
 				text-align: center;padding: 10rpx 0;
 				margin: 20rpx;"
@@ -10,90 +11,103 @@
 				v-for="(item, index) in classifyList">
 					{{ item.name }}
 				</view>
+			</view> -->
+		<!-- </u-sticky> -->
+
+		<view class="type">
+			<view :class="{select : index == currentIndex}" :key="index" @click="tabChange(index)"
+				v-for="(item, index) in classifyList">
+				<text>{{ item.name }}</text>
 			</view>
-		</u-sticky>
-		
-		
+		</view>
+
+
+		<!-- <view style="color: #333;border: 1px solid #333;
+		padding: 7rpx 15rpx;font-size: 24rpx;" 
+		v-if="item.state != 0">
+			{{ $t('page.order.Submit_New') }}
+		</view>
+		<view style="color: #f90;border: 1px solid #f90;
+		padding: 7rpx 15rpx;font-size: 24rpx;"
+		v-else @click="order = item;show = true;$play()">
+			{{ $t('page.order.pay') }}
+		</view> -->
+
+
 		<view v-if="!noOrder" class="order-list">
 			<u-list @scrolltolower="scrolltolower" height="calc(100vh - 90rpx)">
-				<view v-for="(item,index) in productList" :key="index" 
-				class="order-item">
+				<view v-for="(item,index) in productList" :key="index" class="order-item">
 					<view class="top">
 						<view style="font-size: 28rpx;" class="time">
-							{{ item.createTime }}
-						</view>
-						<view style="color: #333;border: 1px solid #333;
-						padding: 7rpx 15rpx;font-size: 24rpx;" 
-						v-if="item.state != 0">
-							{{ $t('page.order.Submit_New') }}
-						</view>
-						<view style="color: #f90;border: 1px solid #f90;
-						padding: 7rpx 15rpx;font-size: 24rpx;"
-						v-else @click="order = item;show = true;$play()">
-							{{ $t('page.order.pay') }}
-						</view>
-					</view>
-					<view class="con"
-					style="border-bottom: 1px solid #333;
-					padding: 20rpx 0;">
-						<view class="img-box" style="width: 150rpx;height: 150rpx;
-						overflow: hidden;border-radius: 10rpx;display: flex;
-						align-items: center;">
-							<image :src="item.image" mode="widthFix" style="width: 150rpx;"></image>
-						</view>
-						<view style="font-weight: 900;margin-left: 20rpx;font-size: 28rpx;color: #333;">
 							{{ item.subTitle }}
 						</view>
+						<view style="font-size: 28rpx;" class="time">
+							{{ item.createTime }}
+						</view>
 					</view>
-					<view class="con"
-					style="margin-top: 20rpx;font-size: 28rpx;font-weight: 500;">
-						<view style="flex: 1;">
-							{{ $t('page.order.Total_Amount') }}
+					<view class="center-box">
+						<view class="img-box">
+							<image :src="item.image" mode="widthFix" style=""></image>
 						</view>
-						<view style="flex: 1;">
-							{{ $t('page.order.Profit') }}
+						<view class="content">
+							<view class="title">
+								{{ item.subTitle }}
+							</view>
+							<view class="con">
+								<view>
+									{{ $t('page.order.Total_Amount') }}
+								</view>
+								<view>
+									{{ item.price }} USD
+								</view>
+							</view>
+							<view class="con" style="color: #b00;font-size: 26rpx;">
+								<view>
+									{{ $t('page.order.Profit') }}
+								</view>
+								<view>
+									{{ item.giveMoney }} USD
+								</view>
+							</view>
 						</view>
 					</view>
-					<view class="con"
-					style="margin-top: 10rpx;
-					color: #333;font-weight: 900;font-size: 28rpx;">
-						<view style="flex: 1;">
-							USDT {{ item.price }}
-						</view>
-						<view style="flex: 1;">
-							USDT {{ item.giveMoney }}
+
+					<view class="buttom">
+						<view class="btn">
+							{{ $t('page.order.Submit_New') }}
 						</view>
 					</view>
 				</view>
-				
+
 				<view style="justify-content: center;display: flex;
 				margin-top: 150rpx;" v-if="loading">
-					<u-loading-icon
-					mode="semicircle"
-					size="30"></u-loading-icon>
+					<u-loading-icon mode="semicircle" size="30"></u-loading-icon>
 				</view>
 			</u-list>
 		</view>
 
+		<!-- <view class="list"
+		v-if="!noOrder">
+			
+			<view class="item">
+				
+			</view>
+		</view> -->
+
 		<view v-else class="no-order">
 			<view class="box">
 				<view class="no-product-title">{{ $t('page.order.no-Order') }}</view>
 				<view @click="toHome()" class="to-home">{{ $t('page.order.take-stroll')}}</view>
 			</view>
 		</view>
-		
-		
-		
-		<u-modal :show="show" 
-		:title="$t('page.order.confirm_pay')"
-		:confirmText="$t('page.order.ok')"
-		:cancelText="$t('page.order.no')"
-		@cancel="show = false;$play()"
-		@confirm="payOrder"
-		:showCancelButton="true"
-		></u-modal>
-		
-		<sTabbar select="1"/>
+
+
+
+		<u-modal :show="show" :title="$t('page.order.confirm_pay')" :confirmText="$t('page.order.ok')"
+			:cancelText="$t('page.order.no')" @cancel="show = false;$play()" @confirm="payOrder"
+			:showCancelButton="true"></u-modal>
+
+		<sTabbar select="1" />
 	</view>
 </template>
 
@@ -107,8 +121,7 @@
 		},
 		data() {
 			return {
-				classifyList: [
-					{
+				classifyList: [{
 						name: this.$t('page.order.class_1')
 					},
 					{
@@ -129,9 +142,9 @@
 					pageSize: 10
 				},
 				noOrder: false,
-				loading : false,
-				show : false,
-				order : {}
+				loading: false,
+				show: false,
+				order: {}
 			}
 		},
 		onShow() {
@@ -146,11 +159,11 @@
 				let data = {
 					...this.queryParams,
 				}
-				
-				if(this.currentIndex) data.state = this.currentIndex - 1
-				
+
+				if (this.currentIndex) data.state = this.currentIndex - 1
+
 				this.request('orderPage', {}, data).then(res => {
-					if(res.code == 200){
+					if (res.code == 200) {
 						this.loading = false
 						this.productList = res.result.records
 					}
@@ -167,7 +180,7 @@
 				this.$play()
 				uni.showLoading()
 				this.request('pay', {}, {
-					id : this.order.id
+					id: this.order.id
 				}).then(res => {
 					uni.hideLoading()
 					this.show = false
@@ -176,13 +189,13 @@
 					}
 				})
 			},
-			toHome(){		//去首页
+			toHome() { //去首页
 				this.$play()
 				uni.switchTab({
 					url: '/pages/home/home'
 				})
 			},
-			scrolltolower(){
+			scrolltolower() {
 				this.queryParams.pageSize += 10
 				this.getOrderList()
 			}
@@ -200,31 +213,109 @@
 		font-weight: bold;
 		min-height: 100vh;
 		padding-bottom: 200rpx;
-		
-		.act{
-			background-color: #000;
-			border-radius: 10rpx;
-			color: #fff;
+
+		.type {
+			display: flex;
+			background-color: #fff;
+			// position: fixed;
+			width: 100%;
+			top: 0;
+			left: 0;
+			height: 90rpx;
+			justify-content: center;
+			align-items: center;
+			color: #989898;
+			font-size: 28rpx;
+
+			&>view {
+				flex: 1;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+			}
+
+			.select {
+				color: #000;
+
+				text {
+					padding-bottom: 10rpx;
+					border-bottom: 3px solid #000;
+				}
+			}
 		}
 
 		.order-list {
 			box-sizing: border-box;
-			margin-top: 50px;
+			// margin-top: 50px;
 
 			.order-item {
 				position: relative;
 				padding: 20rpx;
 				border-radius: 5px;
 				background-color: $uni-bg-color;
-				box-shadow: 0px 0px 5rpx 5rpx #00000023;
+				box-shadow: 0px 0px 5rpx 5rpx #00000010;
 				margin: 0rpx 20rpx 20rpx 20rpx;
-				.top{
+
+				.top {
 					display: flex;
 					justify-content: space-between;
 				}
-				.con{
+
+				.center-box {
 					display: flex;
-					align-items: center;
+					padding: 20rpx 0;
+
+					.img-box {
+						width: 200rpx;
+						height: 200rpx;
+						overflow: hidden;
+						border-radius: 10rpx;
+						display: flex;
+						align-items: center;
+
+						image {
+							width: 100%;
+							height: 100%;
+						}
+					}
+
+					.content {
+						font-weight: 500;
+						width: 430rpx;
+						font-size: 28rpx;
+						padding-left: 10rpx;
+						padding-top: 10rpx;
+
+						.title {
+							overflow: hidden;
+							text-overflow: ellipsis;
+							display: -webkit-box;
+							-webkit-line-clamp: 2;
+							-webkit-box-orient: vertical;
+							width: 100%;
+						}
+
+						.con {
+							display: flex;
+							align-items: center;
+							justify-content: space-between;
+							margin-top: 15rpx;
+						}
+					}
+				}
+
+				.buttom {
+					display: flex;
+					justify-content: flex-end;
+
+					.btn {
+						padding: 10rpx 20rpx;
+						font-size: 26rpx;
+						font-weight: 500;
+						background-color: #f33;
+						color: #fff;
+						border-radius: 10rpx;
+					}
 				}
 			}
 		}