优化

ghsApp/src/admin/shopYeChange/list.vue

@@ -5,29 +5,43 @@
 		</view>
 		<view class="main-view">
 			<block v-if="!$util.isEmpty(list.data)">
-				<t-table :headerBackgroundColor="'#F0F2F6'">
-					<t-tr header>
-						<t-th><view style="width:150upx;">来源</view></t-th>
-						<t-th><view style="width:200upx;">事项</view></t-th>
-						<t-th>金额</t-th>
-						<t-th>余额</t-th>
-						<t-th>可提现</t-th>
-					</t-tr>
-					<view v-for="(item, index) in list.data" :key="index" @click="goDetail(item)">
-						<t-tr>
-							<t-td align="center" color="info">
-								<view style="width:150upx;color:black;">
-									<view>{{ item.addTime.substr(5,11) }}</view>
-									<view>{{item.ptStyle==1?'零售':'批发'}}-{{ item.fromType ==1 ? '门店' : item.fromType == 2 ? '商城' : item.fromType ==3 ? '朋友圈' : '其它' }}</view>
-								</view>
-							</t-td>
-							<t-td align="center" color="info"><view style="width:200upx;color:black;font-size:24upx;">{{ item.event }}</view></t-td>
-							<t-td align="center" color="info"><view style="color:black;">{{ parseFloat(item.amount) }}</view></t-td>
-							<t-td align="center" color="info"><view style="color:black;">{{ parseFloat(item.balance) }}</view></t-td>
-							<t-td align="center" color="info"><view style="color:black;">{{ parseFloat(item.txBalance) }}</view></t-td>
-						</t-tr>
+				<!-- 表头 -->
+				<view class="table-header">
+					<view class="header-item source-col">来源</view>
+					<view class="header-item event-col">事项</view>
+					<view class="header-item amount-col">金额</view>
+					<view class="header-item balance-col">余额</view>
+					<view class="header-item tx-col">可提现</view>
+				</view>
+				
+				<!-- 数据行 -->
+				<view class="table-body">
+					<view 
+						v-for="(item, index) in list.data" 
+						:key="index" 
+						class="table-row"
+						@click="goDetail(item)"
+					>
+						<view class="row-item source-col">
+							<view class="source-info">
+								<view class="time">{{ item.addTime.substr(5,11) }}</view>
+								<view class="type">{{item.ptStyle==1?'零售':'批发'}}-{{ item.fromType ==1 ? '门店' : item.fromType == 2 ? '商城' : item.fromType ==3 ? '朋友圈' : '其它' }}</view>
+							</view>
+						</view>
+						<view class="row-item event-col">
+							<view class="event-text">{{ item.event }}</view>
+						</view>
+						<view class="row-item amount-col">
+							<view class="amount-text">{{ parseFloat(item.amount) }}</view>
+						</view>
+						<view class="row-item balance-col">
+							<view class="balance-text">{{ parseFloat(item.balance) }}</view>
+						</view>
+						<view class="row-item tx-col">
+							<view class="tx-text">{{ parseFloat(item.txBalance) }}</view>
+						</view>
 					</view>
-				</t-table>
+				</view>
 			</block>
 			<block v-else>
 				<AppWrapperEmpty title="暂无数据" :is-empty="$util.isEmpty(list.data)" />
@@ -95,4 +109,108 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
+.app-content {
+	background-color: #f5f5f5;
+	min-height: 100vh;
+}
+
+.main-view {
+	padding: 0;
+}
+
+.table-header {
+	display: flex;
+	background-color: #F0F2F6;
+	padding: 24upx 16upx;
+	margin-bottom: 2upx;
+	font-size: 32upx;
+	font-weight: 600;
+	color: #000;
+}
+
+.table-body {
+	background-color: #fff;
+	overflow: hidden;
+}
+
+.table-row {
+	display: flex;
+	padding: 24upx 16upx;
+	border-bottom: 1upx solid #f0f0f0;
+	transition: background-color 0.2s ease;
+	
+	&:last-child {
+		border-bottom: none;
+	}
+	
+	&:active {
+		background-color: #f8f9fa;
+	}
+}
+
+.header-item {
+	font-size: 32upx;
+	font-weight: 600;
+	color: #000;
+}
+
+.row-item {
+	font-size: 30upx;
+	color: #000;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
+.source-col {
+	flex: 0 0 180upx;
+	justify-content: flex-start;
+}
+
+.event-col {
+	flex: 1;
+	justify-content: flex-start;
+}
+
+.amount-col {
+	flex: 0 0 100upx;
+}
+
+.balance-col {
+	flex: 0 0 100upx;
+}
+
+.tx-col {
+	flex: 0 0 100upx;
+}
+
+.source-info {
+	text-align: left;
+	
+	.time {
+		font-size: 28upx;
+		color: #000;
+		margin-bottom: 8upx;
+	}
+	
+	.type {
+		font-size: 26upx;
+		color: #000;
+	}
+}
+
+.event-text {
+	font-size: 28upx;
+	color: #000;
+	text-align: left;
+	line-height: 1.4;
+}
+
+.amount-text,
+.balance-text,
+.tx-text {
+	font-size: 30upx;
+	color: #000;
+	font-weight: 500;
+}
 </style>

ghsApp/src/pagesStore/me/withdraw.vue

@@ -1,31 +1,50 @@
 <template>
 	<view class="app-content">
-		<block v-if="!$util.isEmpty(list.data)">
-			<t-table :headerBackgroundColor="'#F0F2F6'">
-				<t-tr header>
-					<t-th><view style="width:150upx;">申请时间</view></t-th>
-					<t-th>到账时间</t-th>
-					<t-th>提现</t-th>
-					<t-th>实到</t-th>
-					<t-th>状态</t-th>
-				</t-tr>
-				<t-tr v-for="(item, index) in list.data" :key="index">
-					<t-td>
-						<view style="width:150upx;">
-							<view @click="getDetail(item.id)">{{item.addTime.substr(5,11)}}</view>
-							<view @click="getDetail(item.id)">{{item.ptStyle==1?'零售':'批发'}}</view>
+		<view class="main-view">
+			<block v-if="!$util.isEmpty(list.data)">
+				<!-- 表头 -->
+				<view class="table-header">
+					<view class="header-item time-col">申请时间</view>
+					<view class="header-item arrival-col">到账时间</view>
+					<view class="header-item amount-col">提现</view>
+					<view class="header-item actual-col">实到</view>
+					<view class="header-item status-col">状态</view>
+				</view>
+				
+				<!-- 数据行 -->
+				<view class="table-body">
+					<view 
+						v-for="(item, index) in list.data" 
+						:key="index" 
+						class="table-row"
+					>
+						<view class="row-item time-col" @click="getDetail(item.id)">
+							<view class="time-info">
+								<view class="time">{{item.addTime.substr(5,11)}}</view>
+								<view class="type">{{item.ptStyle==1?'零售':'批发'}}</view>
+							</view>
 						</view>
-						</t-td>
-					<t-td> <view @click="getDetail(item.id)" v-if="item.status==2">{{item.updateTime.substr(5,11)}}</view><view v-else></view> </t-td>
-					<t-td> <view @click="getDetail(item.id)">{{item.amount}}</view> </t-td>
-					<t-td> <view @click="getDetail(item.id)" v-if="item.status==2"></view><view v-else></view> </t-td>
-					<t-td> <view @click="getDetail(item.id)">{{item.status==1?'处理中':item.status==2?'已到账':'失败'}}</view> </t-td>
-				</t-tr>
-			</t-table>
-		</block>
-		<block v-else>
-			<AppWrapperEmpty title="暂无数据" :is-empty="$util.isEmpty(list.data)" />
-		</block>
+						<view class="row-item arrival-col" @click="getDetail(item.id)">
+							<view class="arrival-text" v-if="item.status==2">{{item.updateTime.substr(5,11)}}</view>
+							<view class="arrival-text" v-else></view>
+						</view>
+						<view class="row-item amount-col" @click="getDetail(item.id)">
+							<view class="amount-text">{{item.amount}}</view>
+						</view>
+						<view class="row-item actual-col" @click="getDetail(item.id)">
+							<view class="actual-text" v-if="item.status==2"></view>
+							<view class="actual-text" v-else></view>
+						</view>
+						<view class="row-item status-col" @click="getDetail(item.id)">
+							<view class="status-text">{{item.status==1?'处理中':item.status==2?'已到账':'失败'}}</view>
+						</view>
+					</view>
+				</view>
+			</block>
+			<block v-else>
+				<AppWrapperEmpty title="暂无数据" :is-empty="$util.isEmpty(list.data)" />
+			</block>
+		</view>
 	</view>
 </template>
 
@@ -76,4 +95,102 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.app-content {
+	background-color: #f5f5f5;
+	min-height: 100vh;
+}
+
+.main-view {
+	padding: 0;
+}
+
+.table-header {
+	display: flex;
+	background-color: #F0F2F6;
+	padding: 24upx 16upx;
+	margin-bottom: 2upx;
+	font-size: 32upx;
+	font-weight: 600;
+	color: #000;
+}
+
+.table-body {
+	background-color: #fff;
+	overflow: hidden;
+}
+
+.table-row {
+	display: flex;
+	padding: 24upx 16upx;
+	border-bottom: 1upx solid #f0f0f0;
+	transition: background-color 0.2s ease;
+	
+	&:last-child {
+		border-bottom: none;
+	}
+	
+	&:active {
+		background-color: #f8f9fa;
+	}
+}
+
+.header-item {
+	font-size: 32upx;
+	font-weight: 600;
+	color: #000;
+}
+
+.row-item {
+	font-size: 30upx;
+	color: #000;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
+.time-col {
+	flex: 0 0 180upx;
+	justify-content: flex-start;
+}
+
+.arrival-col {
+	flex: 0 0 150upx;
+}
+
+.amount-col {
+	flex: 0 0 120upx;
+}
+
+.actual-col {
+	flex: 0 0 100upx;
+}
+
+.status-col {
+	flex: 0 0 100upx;
+}
+
+.time-info {
+	text-align: left;
+	
+	.time {
+		font-size: 28upx;
+		color: #000;
+		margin-bottom: 8upx;
+	}
+	
+	.type {
+		font-size: 26upx;
+		color: #000;
+	}
+}
+
+.arrival-text,
+.amount-text,
+.actual-text,
+.status-text {
+	font-size: 30upx;
+	color: #000;
+	font-weight: 500;
+}
+</style>