From dea95896c2d0300518101a44bf93f8c30863c7a4 Mon Sep 17 00:00:00 2001
From: "@QQNZX" <cccccc420590@163.com>
Date: Tue, 28 Nov 2023 14:43:36 +0800
Subject: [PATCH] =?UTF-8?q?11.28=E5=89=8D=E7=AB=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 gasStation-uni/pages/index/index.vue          |  45 +-
 gasStation-uni/pages/my/my.vue                |  52 +-
 .../pagesMy/CardManagement/CardManagement.vue |  56 +-
 gasStation-uni/pagesMy/Recharge/Recharge.vue  |  59 +-
 gasStation-uni/pagesMy/VIP/vip.vue            | 520 ++++++++++++++++++
 gasStation-uni/pagesMy/feedback/feedback.vue  |  92 +++-
 gasStation-uni/pagesMy/writeOff/writeOff.vue  |  59 +-
 7 files changed, 844 insertions(+), 39 deletions(-)
 create mode 100644 gasStation-uni/pagesMy/VIP/vip.vue

diff --git a/gasStation-uni/pages/index/index.vue b/gasStation-uni/pages/index/index.vue
index 7837963a2..dbab47c15 100644
--- a/gasStation-uni/pages/index/index.vue
+++ b/gasStation-uni/pages/index/index.vue
@@ -19,7 +19,7 @@
 						<view class="jg-img">
 							<image src="../../static/imgs/viprwm.png" mode=""></image>
 						</view>
-						<view class="jg-size">便利店</view>
+						<view class="jg-size">二维码</view>
 					</view>
 					<view class="jg-box" @click="goActivity()">
 						<view class="jg-img">
@@ -70,9 +70,12 @@
 			<view class="station">
 				<view class="station-box">
 
-					<view class="station-title">{{store.name}}{{store.description ? "("+store.description+")" : ""}}</view><!--顺通石化加油站(工业南路站)-->
+					<view class="station-title">{{store.name}}{{store.description ? "("+store.description+")" : ""}}
+					</view><!--顺通石化加油站(工业南路站)-->
 					<view style="display: flex;">
-						<view class="bule-icon" v-if="welfare.length!=0" v-for="(item,index) in welfare" :key="index">{{item}}</view>
+						<view class="bule-icon" v-if="welfare.length!=0" v-for="(item,index) in welfare" :key="index">
+							{{item}}
+						</view>
 					</view>
 					<view class="dis-bt">
 						<view class="">
@@ -125,13 +128,13 @@
 					'https://cdn.uviewui.com/uview/swiper/swiper1.png',
 				],
 				// 当前经度信息
-				longitude:"",
+				longitude: "",
 				// 纬度
-				latitude:"",
+				latitude: "",
 				// 店铺信息
-				store:{},
+				store: {},
 				// 店铺福利信息
-				welfare:[],
+				welfare: [],
 				distance: "",
 			}
 		},
@@ -139,21 +142,21 @@
 
 		},
 		onShow() {
-			this.getAddress();
+			// this.getAddress();
 		},
 		components: {
 			tabbar
 		},
 		methods: {
 			// 获取当前位置
-			getAddress(){
+			getAddress() {
 				let _this = this;
 				uni.getLocation({
 					// 谷歌使用wgs84  其他使用gcj02
-					type: 'wgs84',   // 使用国测局坐标系
+					type: 'wgs84', // 使用国测局坐标系
 					success: function(res) {
-					_this.longitude = res.longitude;
-					_this.latitude = res.latitude
+						_this.longitude = res.longitude;
+						_this.latitude = res.latitude
 						// console.log('经度: ' + res.longitude);
 						// console.log('纬度: ' + res.latitude);
 						uni.request({
@@ -163,16 +166,16 @@
 								"lon": res.longitude,
 								"lat": res.latitude
 							},
-							success: function(response){
-							_this.distance = (response.data.data.distance).toFixed(1)
-							_this.store = response.data.data.store
+							success: function(response) {
+								_this.distance = (response.data.data.distance).toFixed(1)
+								_this.store = response.data.data.store
 								let welfare = response.data.data.store.welfare
-								if (welfare != undefined && welfare!=null && welfare!=""){
-								  if (welfare.includes(",")){
-									_this.welfare = response.data.data.store.welfare.split(",")
-								  }else {
-									_this.welfare.push(response.data.data.store.welfare)
-								  }
+								if (welfare != undefined && welfare != null && welfare != "") {
+									if (welfare.includes(",")) {
+										_this.welfare = response.data.data.store.welfare.split(",")
+									} else {
+										_this.welfare.push(response.data.data.store.welfare)
+									}
 								}
 							}
 						})
diff --git a/gasStation-uni/pages/my/my.vue b/gasStation-uni/pages/my/my.vue
index 536ca1745..8b299f717 100644
--- a/gasStation-uni/pages/my/my.vue
+++ b/gasStation-uni/pages/my/my.vue
@@ -17,7 +17,8 @@
 									size="12"></uni-icons> </view>
 						</view>
 					</view>
-					<view class="vipnber">会员等级 <uni-icons type="right" color="#ffffff" size="16"></uni-icons></view>
+					<view class="vipnber" @click="govip()">会员等级 <uni-icons type="right" color="#ffffff"
+							size="16"></uni-icons></view>
 				</view>
 				<view class="my-top-box">
 					<view class="jg-box" @click="gomony()">
@@ -100,7 +101,7 @@
 
 					</view>
 
-					<view class="centenr-sx">
+					<view class="centenr-sx" @click="gowriteoff()">
 						<view class="centenr-img">
 							<image src="../../static/my/jl.png" mode=""></image>
 						</view>
@@ -109,7 +110,7 @@
 						</view>
 
 					</view>
-					<view class="centenr-sx">
+					<view class="centenr-sx" @click="gorecharge()">
 						<view class="centenr-img">
 							<image src="../../static/my/chongzhi.png" style="width: 30px;height: 30px; "></image>
 						</view>
@@ -117,7 +118,7 @@
 							充值记录
 						</view>
 					</view>
-					<view class="centenr-sx">
+					<view class="centenr-sx" @click="goinvte()">
 						<view class="centenr-img">
 							<image src="../../static/my/lp.png" style="width: 30px;height: 30px; "></image>
 						</view>
@@ -125,7 +126,7 @@
 							邀请有礼
 						</view>
 					</view>
-					<view class="centenr-sx">
+					<view class="centenr-sx" @click="goPoints()">
 						<view class="centenr-img">
 							<image src="../../static/my/jfsc.png" style="width: 30px;height: 30px; "></image>
 						</view>
@@ -133,7 +134,7 @@
 							积分商城
 						</view>
 					</view>
-					<view class="centenr-sx">
+					<view class="centenr-sx" @click="gocard()">
 						<view class="centenr-img">
 							<image src="../../static/my/kb.png"></image>
 						</view>
@@ -141,7 +142,7 @@
 							子卡管理
 						</view>
 					</view>
-					<view class="centenr-sx">
+					<view class="centenr-sx" @click="gofeedback()">
 						<view class="centenr-img">
 							<image src="../../static/my/yj.png"></image>
 						</view>
@@ -150,14 +151,12 @@
 						</view>
 					</view>
 				</view>
-
 			</view>
 			<u-divider text="蓝鲸智慧加油站" :hairline="true"></u-divider>
 			<tabbar :msg="msg"></tabbar>
 		</view>
 	</view>
 </template>
-
 <script>
 	import tabbar from "../../components/tabbar/tabbar.vue"
 	export default {
@@ -207,6 +206,41 @@
 				uni.navigateTo({
 					url: '/pagesRefuel/pagesRefuel/index'
 				})
+			},
+			gowriteoff() {
+				uni.navigateTo({
+					url: '/pagesMy/writeOff/writeOff'
+				})
+			},
+			gorecharge() {
+				uni.navigateTo({
+					url: '/pagesMy/Recharge/Recharge'
+				})
+			},
+			goPoints() {
+				uni.navigateTo({
+					url: '/pagesHome/PointsMall/PointsMall'
+				})
+			},
+			goinvte() {
+				uni.navigateTo({
+					url: "/pagesMy/invite/invite"
+				})
+			},
+			gocard() {
+				uni.navigateTo({
+					url: '/pagesMy/CardManagement/CardManagement'
+				})
+			},
+			govip() {
+				uni.navigateTo({
+					url: '/pagesMy/VIP/vip'
+				})
+			},
+			gofeedback() {
+				uni.navigateTo({
+					url: '/pagesMy/feedback/feedback'
+				})
 			}
 		}
 	}
diff --git a/gasStation-uni/pagesMy/CardManagement/CardManagement.vue b/gasStation-uni/pagesMy/CardManagement/CardManagement.vue
index f76859878..bb82fbe8f 100644
--- a/gasStation-uni/pagesMy/CardManagement/CardManagement.vue
+++ b/gasStation-uni/pagesMy/CardManagement/CardManagement.vue
@@ -7,7 +7,16 @@
 				<view class="my-icons"></view>
 			</view>
 			<!-- 顶部区域 -->
-
+			<view class="tap-top">
+				<view class="tap-box" :class="{ 'act' : tindex == index }" v-for="(item,index) in tapList" :key="index"
+					@click="tapindex(index)">
+					<view class="">{{ item.text }}</view>
+					<view class="gang" :class="{ 'lan' : tindex == index }"></view>
+				</view>
+			</view>
+			<u-empty v-if="list.length == 0 " mode="coupon" text="内容为空"
+				icon="http://cdn.uviewui.com/uview/empty/coupon.png">
+			</u-empty>
 
 		</view>
 	</view>
@@ -18,6 +27,16 @@
 		data() {
 			return {
 				title: '',
+				tindex: 0,
+				tapList: [{
+						text: "子卡管理"
+					},
+					{
+						text: "交易统计"
+					},
+
+				],
+				list: []
 
 
 			}
@@ -27,6 +46,9 @@
 
 		},
 		methods: {
+			tapindex(index) {
+				this.tindex = index
+			},
 			goback() {
 				uni.navigateBack()
 			}
@@ -66,4 +88,36 @@
 		position: fixed;
 		top: 0px;
 	}
+
+	.tap-top {
+		width: 100%;
+		height: 50px;
+		background-color: #ffffff;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+	}
+
+	.tap-box {
+		width: 50%;
+		text-align: center;
+		color: #666666;
+	}
+
+	.gang {
+		width: 35px;
+		height: 4px;
+		// background: #0000ff;
+		margin: 0 auto;
+		margin-top: 10px;
+	}
+
+	.act {
+		font-weight: bold;
+		color: #000;
+	}
+
+	.lan {
+		background: #0000ff;
+	}
 </style>
\ No newline at end of file
diff --git a/gasStation-uni/pagesMy/Recharge/Recharge.vue b/gasStation-uni/pagesMy/Recharge/Recharge.vue
index bea048fae..26c0ba5cd 100644
--- a/gasStation-uni/pagesMy/Recharge/Recharge.vue
+++ b/gasStation-uni/pagesMy/Recharge/Recharge.vue
@@ -7,8 +7,17 @@
 				<view class="my-icons"></view>
 			</view>
 			<!-- 顶部区域 -->
+			<view class="tap-top">
+				<view class="tap-box" :class="{ 'act' : tindex == index }" v-for="(item,index) in tapList" :key="index"
+					@click="tapindex(index)">
+					<view class="">{{ item.text }}</view>
+					<view class="gang" :class="{ 'lan' : tindex == index }"></view>
+				</view>
+			</view>
 			<!-- Recharge -->
-
+			<u-empty v-if="list.length == 0 " mode="coupon" text="内容为空"
+				icon="http://cdn.uviewui.com/uview/empty/coupon.png">
+			</u-empty>
 		</view>
 	</view>
 </template>
@@ -18,6 +27,19 @@
 		data() {
 			return {
 				title: '',
+				tindex: 0,
+				list: [],
+				tapList: [{
+						text: "全部"
+					},
+					{
+						text: "储值卡"
+					},
+					{
+						text: "升数卡"
+					},
+				]
+
 
 
 			}
@@ -27,6 +49,9 @@
 
 		},
 		methods: {
+			tapindex(index) {
+				this.tindex = index
+			},
 			goback() {
 				uni.navigateBack()
 			}
@@ -66,4 +91,36 @@
 		position: fixed;
 		top: 0px;
 	}
+
+	.tap-top {
+		width: 100%;
+		height: 50px;
+		background-color: #ffffff;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+	}
+
+	.tap-box {
+		width: 33%;
+		text-align: center;
+		color: #666666;
+	}
+
+	.gang {
+		width: 35px;
+		height: 4px;
+		// background: #0000ff;
+		margin: 0 auto;
+		margin-top: 10px;
+	}
+
+	.act {
+		font-weight: bold;
+		color: #000;
+	}
+
+	.lan {
+		background: #0000ff;
+	}
 </style>
\ No newline at end of file
diff --git a/gasStation-uni/pagesMy/VIP/vip.vue b/gasStation-uni/pagesMy/VIP/vip.vue
new file mode 100644
index 000000000..361d1c21f
--- /dev/null
+++ b/gasStation-uni/pagesMy/VIP/vip.vue
@@ -0,0 +1,520 @@
+<template>
+	<view class="content">
+		<!-- <view class="my-header">
+			<view class="my-icons" @click="goback"> <uni-icons type="left" size="16"></uni-icons> </view>
+			<view class="my-text">核销记录</view>
+			<view class="my-icons"></view>
+		</view> -->
+		<view class="">
+
+
+			<swiper class="swiper">
+				<swiper-item v-for="(items,indexs) in levelList" :key="indexs">
+					<div class="topBg">
+						<view class="progress b-card" :class="{'b-level-1': items.level === 1,
+					'b-level-2': items.level === 2,'b-level-3': items.level === 3,'b-level-4': items.level === 4}">
+							<view class="heard">
+								尊贵会员
+							</view>
+							<view class="title">
+								这是一段描述：感谢您支持开源项目！
+							</view>
+							<view class="progress-artice">
+								<view class="outer">
+									<view class="inside" :style="{'width': items.ratio+'%'}">
+
+									</view>
+								</view>
+								<view class="content">
+									<view class="content-item" :style="{'flex':item.flex}"
+										v-for="(item,index) in items.list" :key="index">
+										<view class="rangle">
+											<view class="rangle-text" v-show="index<items.list.length-1"></view>
+											<image class="rangle-gift"
+												src="https://zhoukaiwen.com/img/medal/icon-medal-gift.png" mode=""
+												v-show="index == items.list.length-1"></image>
+										</view>
+										<view class="level">
+											{{item.name}}
+										</view>
+									</view>
+								</view>
+							</view>
+							<view class="text">
+								<text>分享小程序解锁其他开源项目！</text>
+								<text class="text-des">1.5k人已解锁</text>
+							</view>
+						</view>
+					</div>
+				</swiper-item>
+			</swiper>
+
+
+			<view class="medal">
+				<view class="medal-title">
+					<text>特别奖章</text>
+					<text class="text">0个</text>
+				</view>
+
+				<view class="medal-box">
+					<view class="medal-item" v-for="(item,index) in medalList" :key="index">
+						<image class="img" :src="item.imgUrl">
+						</image>
+						<view class="title">
+							{{item.title}}
+						</view>
+						<view class="text">
+							{{item.text}}
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				levelList: [{
+					level: 1,
+					ratio: 10,
+					list: [{
+						flex: 2,
+						achieve: 25,
+						name: 'LV.1'
+					}, {
+						flex: 2,
+						achieve: 50,
+						name: 'LV.2'
+					}, {
+						flex: 2,
+						achieve: 75,
+						name: 'LV.3'
+					}, {
+						flex: 2,
+						achieve: 100,
+						name: 'LV.4'
+					}]
+				}, {
+					level: 2,
+					ratio: 50,
+					list: [{
+						flex: 1,
+						achieve: 14.2,
+						name: 'LV.1'
+					}, {
+						flex: 2,
+						achieve: 42.8,
+						name: 'LV.2'
+					}, {
+						flex: 2,
+						achieve: 71.5,
+						name: 'LV.3'
+					}, {
+						flex: 2,
+						achieve: 100,
+						name: 'LV.4'
+					}]
+				}, {
+					level: 3,
+					ratio: 80,
+					list: [{
+						flex: 1,
+						achieve: 14.2,
+						name: 'LV.1'
+					}, {
+						flex: 2,
+						achieve: 42.8,
+						name: 'LV.2'
+					}, {
+						flex: 2,
+						achieve: 71.5,
+						name: 'LV.3'
+					}, {
+						flex: 2,
+						achieve: 100,
+						name: 'LV.4'
+					}]
+				}, {
+					level: 4,
+					ratio: 10,
+					list: [{
+						flex: 1,
+						achieve: 14.2,
+						name: 'LV.1'
+					}, {
+						flex: 2,
+						achieve: 42.8,
+						name: 'LV.2'
+					}, {
+						flex: 2,
+						achieve: 71.5,
+						name: 'LV.3'
+					}, {
+						flex: 2,
+						achieve: 100,
+						name: 'LV.4'
+					}]
+				}],
+
+
+				medalList: [{
+					imgUrl: "https://zhoukaiwen.com/img/medal/icon-medal-1.png",
+					title: "VIP专属",
+					text: "成为VIP会员"
+				}, {
+					imgUrl: "https://zhoukaiwen.com/img/medal/icon-medal-2.png",
+					title: "栏目真粉",
+					text: "订阅10个栏目"
+				}, {
+					imgUrl: "https://zhoukaiwen.com/img/medal/icon-medal-3.png",
+					title: "实力听霸",
+					text: "完成200个音频"
+				}, {
+					imgUrl: "https://zhoukaiwen.com/img/medal/icon-medal-4.png",
+					title: "时间管家",
+					text: "完成50组短听"
+				}, {
+					imgUrl: "https://zhoukaiwen.com/img/medal/icon-medal-5.png",
+					title: "养成习惯",
+					text: "连续21天登录音频"
+				}, {
+					imgUrl: "https://zhoukaiwen.com/img/medal/icon-medal-6.png",
+					title: "乐享达人",
+					text: "分享好友20次"
+				}]
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.my-header {
+		width: 100%;
+		height: 88px;
+		background: #1678ff;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		color: #ffffff;
+		box-sizing: border-box;
+		padding: 0px 15px;
+		padding-top: 40px;
+
+		.my-icons {
+			width: 20px;
+
+		}
+
+		position: fixed;
+		top: 0px;
+	}
+
+	.topBg {
+		width: 100%;
+		background: url(https://zhoukaiwen.com/img/qdpz/topBg.png);
+		height: 400rpx;
+		padding-top: 80rpx;
+		background-repeat: no-repeat;
+		background-size: 100%;
+	}
+
+	.b-card {
+		background-color: #fefefe;
+		background-image: linear-gradient(-45deg, #e8e9ec, #f2f2f2);
+		padding: 30rpx 40rpx;
+		margin: 0 30rpx;
+		height: 500rpx;
+		border-radius: 20rpx;
+		box-shadow: 2rpx 2rpx 2rpx #efeef3;
+		color: #9a9ca1;
+
+		.heard {
+			color: #6f7275;
+		}
+
+		.text {
+			background-color: #d8dcdd;
+		}
+
+		.outer {
+			background-color: #d8dcdd;
+
+			.inside {
+				background-color: #6f7275;
+			}
+		}
+
+		.rangle {
+			.rangle-text {
+				background-color: #6f7275;
+			}
+		}
+	}
+
+	.b-level-1 {
+		background-image: linear-gradient(45deg, #dde1ea, #a3abb8);
+		color: #34424b;
+
+		.heard {
+			color: #34424b;
+		}
+
+		.text {
+			background-color: #e4e9ed;
+		}
+
+		.outer {
+			background-color: #e4e9ed;
+
+			.inside {
+				background-color: #34424b;
+			}
+		}
+
+		.rangle {
+			.rangle-text {
+				background-color: #34424b;
+			}
+		}
+	}
+
+	.b-level-2 {
+		background-image: linear-gradient(45deg, #f0daa4, #d1a165);
+		color: #323b4a;
+
+		.heard {
+			color: #313a49;
+		}
+
+		.text {
+			background-color: #e4e7ec;
+		}
+
+		.outer {
+			background-color: #e4e7ec;
+
+			.inside {
+				background-color: #313a49;
+			}
+		}
+
+		.rangle {
+			.rangle-text {
+				background-color: #323b4a;
+			}
+		}
+	}
+
+	.b-level-3 {
+		background-image: linear-gradient(45deg, #ddc1b5, #c59073);
+		color: #333333;
+
+		.heard {
+			color: #333333;
+		}
+
+		.text {
+			background-color: #e8e8e8;
+		}
+
+		.outer {
+			background-color: #e8e8e8;
+
+			.inside {
+				background-color: #333333;
+			}
+		}
+
+		.rangle {
+			.rangle-text {
+				background-color: #333333;
+			}
+		}
+
+	}
+
+	.b-level-4 {
+		background-image: linear-gradient(45deg, #303030, #1a1a1a);
+		color: #f0daa4;
+
+		.heard {
+			color: #f0daa4;
+		}
+
+		.text {
+			background-color: #f2e3c4;
+			color: #77582a;
+		}
+
+		.outer {
+			background-color: #f2e3c4;
+
+			.inside {
+				background-color: #f2e3c4;
+			}
+		}
+
+		.rangle {
+			.rangle-text {
+				background-color: #77582a;
+			}
+		}
+	}
+
+	.warp {}
+
+	.swiper {
+		height: 600rpx;
+
+		.progress {
+			.heard {
+				font-size: 36rpx;
+				font-weight: 600;
+				text-align: center;
+				line-height: 120rpx;
+			}
+
+			.title {
+				font-size: 28rpx;
+			}
+
+			.progress-artice {
+				margin-top: 30rpx;
+				font-size: 28rpx;
+
+				.outer {
+					height: 10rpx;
+					border-radius: 20rpx;
+					margin: 0;
+					overflow: hidden;
+
+					.inside {
+						height: 100%;
+					}
+				}
+
+				.content {
+					margin: 0;
+					display: flex;
+					text-align: right;
+
+					.content-item {
+						display: flex;
+						flex-direction: column;
+
+						.rangle {
+							height: 10rpx;
+							line-height: 10rpx;
+							margin-top: -10rpx;
+							display: flex;
+							justify-content: flex-end;
+							align-items: center;
+
+							.rangle-text {
+								width: 10rpx;
+								height: 10rpx;
+								display: inline-block;
+								border-radius: 50%;
+								display: none;
+							}
+
+							.rangle-gift {
+								width: 60rpx;
+								height: 60rpx;
+								background-color: #cacdd0;
+								display: inline-block;
+								border-radius: 50%;
+							}
+
+							.achieveClass {
+								background-color: #765528;
+							}
+						}
+
+						.level {
+							margin-top: 50rpx;
+							margin-right: -20rpx;
+						}
+
+						&:nth-child(4) {
+							.level {
+								margin-right: 0rpx;
+							}
+						}
+					}
+
+				}
+			}
+
+			.text {
+				margin-top: 60rpx;
+				padding: 20rpx 20rpx;
+				border-radius: 10rpx;
+				font-size: 28rpx;
+				font-weight: 600;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+
+				.text-des {
+					font-size: 20rpx;
+					font-weight: 300;
+				}
+			}
+		}
+	}
+
+	.medal {
+		margin: 10rpx 30rpx;
+
+		.medal-title {
+			font-size: 32rpx;
+			font-weight: 700;
+			color: #30333b;
+			padding: 0 10rpx;
+
+			.text {
+				font-size: 28rpx;
+				font-weight: 300;
+				color: #7c7f81;
+				margin-left: 10rpx;
+			}
+		}
+
+		.medal-box {
+			display: flex;
+			flex-wrap: wrap;
+
+			.medal-item {
+				width: 33.3333333333333%;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				flex-direction: column;
+				margin-top: 40rpx;
+
+				.img {
+					width: 140rpx;
+					height: 140rpx;
+					border-radius: 50%;
+				}
+
+				.title {
+					font-size: 24rpx;
+					line-height: 60rpx;
+					font-weight: 600;
+					color: #30333b;
+				}
+
+				.text {
+					font-size: 24rpx;
+					color: #7c7f81;
+				}
+			}
+
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/gasStation-uni/pagesMy/feedback/feedback.vue b/gasStation-uni/pagesMy/feedback/feedback.vue
index 4631b8338..48bdf5f6d 100644
--- a/gasStation-uni/pagesMy/feedback/feedback.vue
+++ b/gasStation-uni/pagesMy/feedback/feedback.vue
@@ -2,11 +2,26 @@
 	<view class="content">
 		<view class="container">
 			<view class="my-header">
-				<view class="my-icons" @click="goback"> <uni-icons type="left" size="16"></uni-icons> </view>
+				<view class="my-icons" @click="goback"> <uni-icons type="left" color="#ffffff" size="16"></uni-icons>
+				</view>
 				<view class="my-text">意见反馈</view>
 				<view class="my-icons"></view>
 			</view>
 			<!-- 顶部区域 -->
+			<view class="box-top">
+				<view class="top-title">
+					反馈内容
+				</view>
+				<u--textarea v-model="value5" placeholder="请填写您的反馈和建议" border="bottom"></u--textarea>
+				<view class="top-title" style="border-bottom: none;">
+					相关截图（选填）
+				</view>
+				<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
+					:maxCount="5"></u-upload>
+				<view class="anniu">
+					<text>提交反馈</text>
+				</view>
+			</view>
 
 
 		</view>
@@ -14,11 +29,13 @@
 </template>
 
 <script>
+	import upload from '@/utils/upload.js'
 	export default {
 		data() {
 			return {
 				title: '',
-
+				value5: '',
+				fileList1: [],
 
 			}
 		},
@@ -27,6 +44,41 @@
 
 		},
 		methods: {
+			deletePic(event) {
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			uploadFilePromise(url) {
+				upload({
+					url: '/common/upload',
+					filePath: url,
+				}).then((res) => {
+					// console.log('images', res.fileName);
+					// this.images.push(res.fileName)
+				})
+
+			},
 			goback() {
 				uni.navigateBack()
 			}
@@ -36,24 +88,24 @@
 
 <style scoped lang="scss">
 	.content {
-		background: #f4f5f6;
+		background: #ffffff;
 	}
 
 	.container {
 		width: 100%;
-		height: 100vh;
 		box-sizing: border-box;
 		padding-top: 88px;
+		z-index: 999999999;
 	}
 
 	.my-header {
 		width: 100%;
 		height: 88px;
-		background: #ffffff;
+		background: #1678ff;
 		display: flex;
 		align-items: center;
 		justify-content: space-between;
-		color: #000;
+		color: #ffffff;
 		box-sizing: border-box;
 		padding: 0px 15px;
 		padding-top: 40px;
@@ -66,4 +118,32 @@
 		position: fixed;
 		top: 0px;
 	}
+
+	.box-top {
+		width: 100%;
+
+		box-sizing: border-box;
+		padding: 10px;
+	}
+
+	.top-title {
+		width: 100%;
+		box-sizing: border-box;
+		padding: 10px 0px;
+		border-bottom: 1px solid #e6e6e6;
+	}
+
+	.anniu {
+		width: 95%;
+		background: #1678ff;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		color: white;
+		margin: 10px auto;
+		border-radius: 50px;
+		box-sizing: border-box;
+		padding: 10px 0px;
+
+	}
 </style>
\ No newline at end of file
diff --git a/gasStation-uni/pagesMy/writeOff/writeOff.vue b/gasStation-uni/pagesMy/writeOff/writeOff.vue
index ad68394ec..4e1129a4a 100644
--- a/gasStation-uni/pagesMy/writeOff/writeOff.vue
+++ b/gasStation-uni/pagesMy/writeOff/writeOff.vue
@@ -7,7 +7,17 @@
 				<view class="my-icons"></view>
 			</view>
 			<!-- 顶部区域 -->
-			<view class=""> </view>
+			<view class="tap-top">
+				<view class="tap-box" :class="{ 'act' : tindex == index }" v-for="(item,index) in tapList" :key="index"
+					@click="tapindex(index)">
+					<view class="">{{ item.text }}</view>
+					<view class="gang" :class="{ 'lan' : tindex == index }"></view>
+				</view>
+			</view>
+
+			<u-empty v-if="list.length == 0 " mode="coupon" text="内容为空"
+				icon="http://cdn.uviewui.com/uview/empty/coupon.png">
+			</u-empty>
 
 		</view>
 	</view>
@@ -18,6 +28,18 @@
 		data() {
 			return {
 				title: '',
+				tindex: 0,
+				list: [],
+				tapList: [{
+						text: "洗车券"
+					},
+					{
+						text: "兑换券"
+					},
+					{
+						text: "商家券"
+					},
+				]
 
 
 			}
@@ -27,6 +49,9 @@
 
 		},
 		methods: {
+			tapindex(index) {
+				this.tindex = index
+			},
 			goback() {
 				uni.navigateBack()
 			}
@@ -66,4 +91,36 @@
 		position: fixed;
 		top: 0px;
 	}
+
+	.tap-top {
+		width: 100%;
+		height: 50px;
+		background-color: #ffffff;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+	}
+
+	.tap-box {
+		width: 33%;
+		text-align: center;
+		color: #666666;
+	}
+
+	.gang {
+		width: 35px;
+		height: 4px;
+		// background: #0000ff;
+		margin: 0 auto;
+		margin-top: 10px;
+	}
+
+	.act {
+		font-weight: bold;
+		color: #000;
+	}
+
+	.lan {
+		background: #0000ff;
+	}
 </style>
\ No newline at end of file