55

pages/index/order.vue

@@ -0,0 +1,214 @@
+<template>
+	<view class="all">
+		<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" 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 @click="goToOrderDetail(item)" v-for="(item, index) in tabItem.orderList" :key="index" class="order-item">
+						<view class="i-top b-b">
+							<text class="time">{{ item._add_time }}</text>
+							<text class="state" :style="{ color: item.stateTipColor }">{{ item._status._title }}</text>
+							<text v-if="item.status === 4" class="del-btn iconfont icondelete" @click="deleteOrder(index)"></text>
+						</view>
+		
+						<scroll-view v-if="item.cartInfo.length > 1" class="goods-box" scroll-x>
+							<view v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex" class="goods-item">
+								<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
+							</view>
+						</scroll-view>
+						<!-- <view v-if="item.cartInfo.length === 1" class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex">
+							<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
+							<view class="right">
+								<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
+								<text class="attr-box">{{ goodsItem.attrInfo ? goodsItem.attrInfo.suk : '' }} x {{ goodsItem.cart_num }}</text>
+								<text class="price">{{ moneyNum(goodsItem.productInfo.price)}}</text>
+							</view>
+						</view> -->
+						<view class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex">
+							<image class="goods-img" :src="goodsItem.productInfo.image" mode="scaleToFill"></image>
+							<view class="right">
+								<view class="flex-start">
+									<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
+									<text class="price">{{ goodsItem.productInfo.price|moneyNum }}</text>
+								</view>
+								<view class="row flex">
+									<text class="row_title">{{ goodsItem.productInfo.attrInfo ? goodsItem.productInfo.attrInfo.suk : '' }}</text>
+									<text class="attr-box"> x {{ goodsItem.cart_num }}</text>
+								</view>
+							</view>
+						</view>
+		
+						<view class="price-box">
+							共
+							<text class="num">{{ item.cartInfo.length }}</text>
+							件商品 邮费
+							<text class="price">{{ moneyNum(item.pay_postage)}}</text>
+							实付款
+							<text class="price">{{ moneyNum(item.pay_price)}}</text>
+						</view>
+						<view class="action-box b-t" v-if="item.status != 5">
+							<button v-if="item._status._title == '未支付'" class="action-btn" @click.stop="cancelOrder(item)">取消订单</button>
+							<button v-if="item._status._title == '未支付'" @click.stop="orderPay(item)" class="action-btn recom">立即支付</button>
+							<button v-if="item._status._title == '待评价'" class="action-btn">评价</button>
+							<button v-if="item._status._title == '待收货'" @click.stop="orderTake(item, index)" class="action-btn">确认收货</button>
+							<button v-if="item._status._title == '未发货'" class="action-btn" @click.stop="orderRefund(item)">申请退款</button>
+						</view>
+					</view>
+					<uni-load-more :status="tabItem.loadingType" color='#FFF'></uni-load-more>
+				</scroll-view>
+			</swiper-item>
+		</swiper>
+	</view>
+</template>
+
+<script>
+	import {
+		getsell
+	} from '@/api/game.js';
+	import {
+		mapState
+	} from 'vuex';
+	export default {
+		computed: {
+			...mapState('user', ['hasLogin'])
+		},
+		data() {
+			return {
+			tabCurrentIndex: 0,
+			navList: [
+				{
+					state: 0,
+					text: '待付款',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 1,
+					text: '待发货',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 2,
+					text: '待收货',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 3,
+					text: '待评价',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 4,
+					text: '已完成',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				}
+			]
+		}
+		},
+		
+		onNavigationBarButtonTap(res){
+			console.log(res,['res']);
+		},
+		onLoad() {
+			this.loadData()
+		},
+		onReachBottom() {
+			this.loadData()
+		},
+		methods: {
+			nav(url) {
+				if (!this.hasLogin) {
+					// 保存地址
+					saveUrl();
+					// 登录拦截
+					interceptor();
+				} else {
+					uni.navigateTo({
+						url
+					});
+				}
+			},
+			loadData(source) {
+				//这里是将订单挂载到tab列表下
+				let index = this.tabCurrentIndex;
+				let navItem = this.navList[index];
+				let state = navItem.state;
+				if (source === 'tabChange' && navItem.loaded === true) {
+					//tab切换只有第一次需要加载数据
+					return;
+				}
+				if (navItem.loadingType === 'loading') {
+					//防止重复加载
+					return;
+				}
+				if (navItem.loadingType === 'noMore') {
+					//防止重复加载
+					return;
+				}
+				// 修改当前对象状态为加载中
+				navItem.loadingType = 'loading';
+				if(index==0){
+					getsell({
+						type: state,
+						page: navItem.page,
+						limit: navItem.limit
+					})
+						.then(({ data }) => {
+							let arr = data.map(e => {
+								let b = this.orderStateExp(e.status);
+								e.stateTip = b.stateTip;
+								e.stateTipColor = b.stateTipColor;
+								return e;
+							});
+							navItem.orderList = navItem.orderList.concat(arr);
+							// console.log(navItem.orderList);
+							navItem.page++;
+							if (navItem.limit == data.length) {
+								//判断是否还有数据， 有改为 more， 没有改为noMore
+								navItem.loadingType = 'more';
+								return;
+							} else {
+								//判断是否还有数据， 有改为 more， 没有改为noMore
+								navItem.loadingType = 'noMore';
+							}
+							uni.hideLoading();
+							this.$set(navItem, 'loaded', true);
+						})
+						.catch(e => {
+							console.log(e);
+						});
+				}
+				
+			},
+		}
+	};
+</script>
+
+<style lang="scss">
+	.all {
+		width: 750rpx;
+		height: 100%;
+		background-color: #051137;
+		padding-top: var(--status-bar-height);
+	}
+</style>

pages/index/pledge.vue

@@ -1,69 +1,57 @@
 <template>
 	<view class="all">
-		<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 class="navList flex">
+			<view v-for="(item, index) in navList" :key="index" class="navItem" 
+			:class="{ activeItem: tabCurrentIndex === index,tip:index == 0 }" @click="tabClick(index)">{{ item }}</view>
 		</view>
-		<swiper :current="tabCurrentIndex" 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 @click="goToOrderDetail(item)" v-for="(item, index) in tabItem.orderList" :key="index" class="order-item">
-						<view class="i-top b-b">
-							<text class="time">{{ item._add_time }}</text>
-							<text class="state" :style="{ color: item.stateTipColor }">{{ item._status._title }}</text>
-							<text v-if="item.status === 4" class="del-btn iconfont icondelete" @click="deleteOrder(index)"></text>
-						</view>
-		
-						<scroll-view v-if="item.cartInfo.length > 1" class="goods-box" scroll-x>
-							<view v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex" class="goods-item">
-								<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
-							</view>
-						</scroll-view>
-						<!-- <view v-if="item.cartInfo.length === 1" class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex">
-							<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
-							<view class="right">
-								<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
-								<text class="attr-box">{{ goodsItem.attrInfo ? goodsItem.attrInfo.suk : '' }} x {{ goodsItem.cart_num }}</text>
-								<text class="price">{{ moneyNum(goodsItem.productInfo.price)}}</text>
-							</view>
-						</view> -->
-						<view class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex">
-							<image class="goods-img" :src="goodsItem.productInfo.image" mode="scaleToFill"></image>
-							<view class="right">
-								<view class="flex-start">
-									<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
-									<text class="price">{{ goodsItem.productInfo.price|moneyNum }}</text>
-								</view>
-								<view class="row flex">
-									<text class="row_title">{{ goodsItem.productInfo.attrInfo ? goodsItem.productInfo.attrInfo.suk : '' }}</text>
-									<text class="attr-box"> x {{ goodsItem.cart_num }}</text>
-								</view>
-							</view>
-						</view>
-		
-						<view class="price-box">
-							共
-							<text class="num">{{ item.cartInfo.length }}</text>
-							件商品 邮费
-							<text class="price">{{ moneyNum(item.pay_postage)}}</text>
-							实付款
-							<text class="price">{{ moneyNum(item.pay_price)}}</text>
-						</view>
-						<view class="action-box b-t" v-if="item.status != 5">
-							<button v-if="item._status._title == '未支付'" class="action-btn" @click.stop="cancelOrder(item)">取消订单</button>
-							<button v-if="item._status._title == '未支付'" @click.stop="orderPay(item)" class="action-btn recom">立即支付</button>
-							<button v-if="item._status._title == '待评价'" class="action-btn">评价</button>
-							<button v-if="item._status._title == '待收货'" @click.stop="orderTake(item, index)" class="action-btn">确认收货</button>
-							<button v-if="item._status._title == '未发货'" class="action-btn" @click.stop="orderRefund(item)">申请退款</button>
-						</view>
+		<view style="padding-top: 44px;" v-if="tabCurrentIndex == 0">
+			<view class="listBox">
+				<view class="titleTetx">数量</view>
+				<view class="flex listTpl">
+					<input type="number" class="inputBox" v-model="number" placeholder="请输入数量"/>
+					<view class="flex_item">
+						<view class="listTip">USDT</view>
+						<view class="listAll">全部</view>
 					</view>
-					<uni-load-more :status="tabItem.loadingType" color='#FFF'></uni-load-more>
-				</scroll-view>
-			</swiper-item>
-		</swiper>
+					
+				</view>
+				<view class="flex tipBox">
+					<view class="tip1">可用余额2.12USDT</view>
+					<view class="tip1">限额10个</view>
+				</view>
+			</view>
+			<view class="listBox" style="padding-top: 0rpx;">
+				<view class="listTpl">
+					<input type="number" class="inputBox" v-model="price" placeholder="请输入单价"/>
+				</view>
+				<view class="flex tipBox">
+					<view class="tip1">单价不得大于参考汇率</view>
+				</view>
+			</view>
+			<view class="submission">
+				<button class="golden" type="golden" hover-class="none" @click="submission">一键卖币</button>
+			</view>
+			<view class="tips">*参考汇率7:23</view>
+		</view>
+		<view class="listItemBox" v-if="tabCurrentIndex == 1">
+			<view class="listItem" v-for="item,index in list" :key="index">
+				<view class="itemInfo flex">
+					<view class="flex_item">
+						<image src="/static/image/img20.png" style="width: 55rpx;" mode="widthFix"></image>
+						<view class="name">李丹丹</view>
+					</view>
+					<image src="/static/image/img21.png" style="width: 40rpx;" mode="widthFix"></image>
+				</view>
+				<view class="itemTpl">7.11</view>
+				<view class="itemTip flex">
+					<view class="tipBox">
+						<view class="tipText">数量:36212.00</view>
+						<view class="tipText">2023.06.10 12:03:02</view>
+					</view>
+					<view class="tipBtn">买入</view>
+				</view>
+			</view>
+		</view>
 	</view>
 </template>
 
@@ -80,125 +68,24 @@
 		},
 		data() {
 			return {
-			tabCurrentIndex: 0,
-			navList: [
-				{
-					state: 0,
-					text: '待付款',
-					loadingType: 'more',
-					orderList: [],
-					page: 1, //当前页数
-					limit: 10 //每次信息条数
-				},
-				{
-					state: 1,
-					text: '待发货',
-					loadingType: 'more',
-					orderList: [],
-					page: 1, //当前页数
-					limit: 10 //每次信息条数
-				},
-				{
-					state: 2,
-					text: '待收货',
-					loadingType: 'more',
-					orderList: [],
-					page: 1, //当前页数
-					limit: 10 //每次信息条数
-				},
-				{
-					state: 3,
-					text: '待评价',
-					loadingType: 'more',
-					orderList: [],
-					page: 1, //当前页数
-					limit: 10 //每次信息条数
-				},
-				{
-					state: 4,
-					text: '已完成',
-					loadingType: 'more',
-					orderList: [],
-					page: 1, //当前页数
-					limit: 10 //每次信息条数
-				}
-			]
+			tabCurrentIndex: 1,
+			navList: ['卖出','买入'],
+			number:'',
+			price:'',
+			pages:1,
+			limit:10,
+			list:[{},{},{},{},{},{},{},{},{},{},{},{}]
 		}
 		},
-		
 		onNavigationBarButtonTap(res){
 			console.log(res,['res']);
 		},
 		onLoad() {
-			this.loadData()
-		},
-		onReachBottom() {
-			this.loadData()
+			
 		},
 		methods: {
-			nav(url) {
-				if (!this.hasLogin) {
-					// 保存地址
-					saveUrl();
-					// 登录拦截
-					interceptor();
-				} else {
-					uni.navigateTo({
-						url
-					});
-				}
-			},
-			loadData(source) {
-				//这里是将订单挂载到tab列表下
-				let index = this.tabCurrentIndex;
-				let navItem = this.navList[index];
-				let state = navItem.state;
-				if (source === 'tabChange' && navItem.loaded === true) {
-					//tab切换只有第一次需要加载数据
-					return;
-				}
-				if (navItem.loadingType === 'loading') {
-					//防止重复加载
-					return;
-				}
-				if (navItem.loadingType === 'noMore') {
-					//防止重复加载
-					return;
-				}
-				// 修改当前对象状态为加载中
-				navItem.loadingType = 'loading';
-				if(index==0){
-					getsell({
-						type: state,
-						page: navItem.page,
-						limit: navItem.limit
-					})
-						.then(({ data }) => {
-							let arr = data.map(e => {
-								let b = this.orderStateExp(e.status);
-								e.stateTip = b.stateTip;
-								e.stateTipColor = b.stateTipColor;
-								return e;
-							});
-							navItem.orderList = navItem.orderList.concat(arr);
-							// console.log(navItem.orderList);
-							navItem.page++;
-							if (navItem.limit == data.length) {
-								//判断是否还有数据， 有改为 more， 没有改为noMore
-								navItem.loadingType = 'more';
-								return;
-							} else {
-								//判断是否还有数据， 有改为 more， 没有改为noMore
-								navItem.loadingType = 'noMore';
-							}
-							uni.hideLoading();
-							this.$set(navItem, 'loaded', true);
-						})
-						.catch(e => {
-							console.log(e);
-						});
-				}
-				
+			tabClick(index) {
+				this.tabCurrentIndex = index;
 			},
 		}
 	};
@@ -210,5 +97,134 @@
 		height: 100%;
 		background-color: #051137;
 		padding-top: var(--status-bar-height);
+		color: #fff;
+	}
+	.navBar{
+		width: 100%;
+		position: fixed;
+		top: 0;
+		/* #ifdef H5 */
+		padding-top: calc(44px + env(safe-area-inset-top));
+		/* #endif */
+		/* #ifdef APP ||MP */
+		padding-top: calc(0px + env(safe-area-inset-top));
+		/* #endif */
+		background: #fff;
+		z-index: 99;
+		.searchBox{
+			padding: 25rpx 25rpx;
+		}
+	}
+	.navList{
+		padding: 30rpx 50rpx 20rpx 50rpx;
+		background: #1F2A4A;
+		position: fixed;
+		top: 44px;
+		left: 0;
+		width: 100%;
+		z-index: 9;
+		.navItem{
+			color: #fff;
+			font-size: 30rpx;
+			text-align: center;
+			width: 50%;
+			&.activeItem{
+				color: #0C5AFA;
+				position: relative;
+				&:after {
+					content: '';
+					position: absolute;
+					left:36%;
+					bottom: -20rpx;
+					width: 30%;
+					height: 8rpx;
+					 // transform: translateX(-50%);
+					border-bottom: 4rpx solid #0C5AFA;
+					border-radius: 0rpx 20rpx 0rpx 0rpx;
+				}
+			}
+			&.tip{
+				border-right: 1rpx solid #333D5B;
+			}
+		}
+	}
+	.listBox{
+		padding: 62rpx 32rpx;
+		.titleTetx{
+			font-weight: bold;
+			font-size: 24rpx;
+			color: #FFFFFF;
+			padding-bottom: 25rpx;
+		}
+		.tipBox{
+			padding-top: 15rpx;
+			font-size: 24rpx;
+		}
+	}
+	.listTpl{
+		border-bottom: 1rpx solid #6A7288;
+		padding-bottom: 25rpx;
+		.inputBox{
+			font-size: 35rpx;
+			color: #FFFFFF;
+		}
+		.listTip{
+			
+		}
+		.listAll{
+			padding-left: 30rpx;
+			font-size: 24rpx;
+			color: #0C5AFA;
+		}
+	}
+	.submission{
+		padding: 80rpx 25rpx;
+		padding-bottom: 25rpx;
+		.golden{
+			background: #0C5AFA;
+			color: #ffffff;
+		}
+	}
+	.tips{
+		text-align: center;
+	}
+	.listItemBox{
+		padding-top: 44px;
+		.listItem{
+			padding: 34rpx 34rpx;
+			border-bottom: 1rpx solid #6A7288;
+			.name{
+				font-family: PingFang SC;
+				font-weight: bold;
+				font-size: 30rpx;
+				color: #FFFFFF;
+				padding-left: 25rpx;
+			}
+			.itemTpl{
+				font-family: PingFang SC;
+				font-weight: bold;
+				font-size: 36rpx;
+				color: #0C5AFA;
+				padding-top: 25rpx;
+			}
+			.itemTip{
+				.tipText{
+					font-family: PingFang SC;
+					font-weight: 500;
+					font-size: 24rpx;
+					color: #C1C1C1;
+					padding-top: 15rpx;
+				}
+				.tipBtn{
+					font-family: PingFang SC;
+					font-weight: bold;
+					font-size: 24rpx;
+					color: #FFFFFF;
+					background: linear-gradient(90deg, #0C5AFA, #1356FF);
+					border-radius: 7rpx;
+					padding: 15rpx 35rpx;
+				}
+			}
+		}
 	}
 </style>