9.24

gasStation-uni/pagesHome/giftExchange/index.vue

@@ -0,0 +1,156 @@
+<template>
+	<view class="content">
+		<view class="container">
+			<view class="box-hang">
+				<view class=""><span style="color: red;">*</span>卡类型</view>
+				<view class="dis">
+					<text>储值卡</text>
+				</view>
+			</view>
+			<view style="margin: 10px 10px;font-size: 16px;font-weight: bold;">礼品卡信息</view>
+			<view class="box-hang">
+				<view class=""><span style="color: red;">*</span>卡号</view>
+				<view class="dis">
+					<input v-model="value" style="text-align: right;" placeholder="请输入"></input>
+				</view>
+			</view>
+			<view class="box-hang">
+				<view class=""><span style="color: red;">*</span>卡密码</view>
+				<view class="dis">
+					<input v-model="value" style="text-align: right;" placeholder="请输入"></input>
+				</view>
+			</view>
+			<view class="box-hang">
+				<view class=""><span style="color: red;">*</span>礼品卡金额</view>
+				<view class="dis">
+					<input v-model="value" style="text-align: right;" placeholder="--"></input>
+				</view>
+			</view>
+
+			<view class="but-sub">兑换</view>
+
+			<u-modal :show="show" :title="title" :content='content' :showCancelButton='true' @confirm="confirm"
+				@cancel="cancel" confirmColor="#FA6400"></u-modal>
+		</view>
+
+	</view>
+</template>
+
+<script>
+	import request from '../../utils/request';
+	export default {
+		data() {
+			return {
+				title: '',
+				List: [],
+				pageNo: 1,
+				pageSize: 10,
+				totalPage: '',
+				value: "",
+				show: false,
+				title: "温馨提示",
+				content: '礼品卡已兑换成功，请在礼品卡兑换记录中查看!'
+			}
+		},
+		onLoad() {
+
+		},
+		onPullDownRefresh() {
+			//下拉刷新
+
+		},
+		onReachBottom() {
+			// 触底加载
+			if (this.pageNo >= this.totalPage) {
+
+			} else {
+				this.pageNo++
+
+			}
+		},
+
+		components: {
+
+		},
+		methods: {
+			cancel() {
+				this.show = false
+			},
+			confirm() {
+				this.show = false
+			},
+			goback() {
+				uni.navigateBack()
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.content {
+		background: #f4f5f6;
+	}
+
+	.container {
+		width: 100%;
+		height: 100vh;
+		box-sizing: border-box;
+		padding-top: 10px;
+	}
+
+	.my-header {
+		width: 100%;
+		height: 88px;
+		background: #ffffff;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		color: #000;
+		box-sizing: border-box;
+		padding: 0px 15px;
+		padding-top: 40px;
+		z-index: 99999;
+
+		.my-icons {
+			width: 20px;
+
+		}
+
+		position: fixed;
+		top: 0px;
+	}
+
+	.box-hang {
+		background-color: white;
+		width: 100%;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		box-sizing: border-box;
+		padding: 15px 15px;
+		border-bottom: 1px solid #f4f5f6;
+	}
+
+	.dis {
+		color: #a69999;
+	}
+
+	.box-end {
+		text-align: center;
+		margin-top: 10px;
+	}
+
+	.but-sub {
+		width: 305px;
+		height: 40px;
+		line-height: 40px;
+		margin: 0 auto;
+		background-color: #FF9655;
+		color: white;
+		border-radius: 50px;
+		text-align: center;
+		position: absolute;
+		bottom: 40px;
+		left: 11%;
+	}
+</style>