diff --git a/subPackages/user/coupon.vue b/subPackages/user/coupon.vue
index d95142d..1556779 100644
--- a/subPackages/user/coupon.vue
+++ b/subPackages/user/coupon.vue
@@ -12,9 +12,9 @@
 		    <view :class="['coupon-item',{'hasUse':navActive!=0}]"  v-for="(item, index) in coupon" :key="index">
 				<!-- 分割线上部分 -->
 				<view class="item-top">
-					<view class="top-left">
-						<view class="price price-before"  v-if="item.type == 1">
-							<span>{{item.discounts/100}}</span>
+					<view class="top-left" v-if="item.free_flag == 1">
+						<view class="price" v-if="item.type == 1">
+							<span>{{item.discounts/100}}</span>元
 						</view>
 						<view class="price" v-else>
 							<span>{{getPecenet(item.percent)}}</span>折
@@ -23,6 +23,10 @@
 							满{{item.min_limit/100}}元可用
 						</view>
 					</view>
+					<view class="top-left" v-else>
+						<image src="https://static.ticket.sz-trip.com/kunshan/activity/coffeeCoupon/miandan.png" v-if="navActive == 0"></image>
+						<image src="https://static.ticket.sz-trip.com/kunshan/activity/coffeeCoupon/miandans.png" v-else></image>
+					</view>
 					<view class="top-right">
 						<view class="title">
 							{{item.title}}
@@ -48,12 +52,12 @@
 						<image v-if="!item.openRules" src="https://yjks.oss-cn-shanghai.aliyuncs.com/uploads/20230415/6a7630c176f976bb16674dde482779fb.png" mode=""></image>
 						<image v-else src="https://yjks.oss-cn-shanghai.aliyuncs.com/uploads/20230415/f0073b18b3ab88cac62de60411360fc1.png" mode=""></image>
 					</view>
-					<!-- <view class="use" @click="use" v-if="navActive==0">
-						去使用
+					<view class="use" @click="use(item)" v-if="navActive==0">
+						{{item.free_flag == 1 ? '去使用' : '查看详情'}}
+					</view>
+					<view class="use" @click="use(item)" v-else>
+						{{item.free_flag == 1 ? '已失效' : '查看详情'}}
 					</view>
-					<view class="use" v-else>
-						已失效
-					</view> -->
 				</view>
 		    </view>
 		</view>
@@ -85,10 +89,71 @@
 				</view>
 			</view>
 		</uni-popup>
+		
+		<!-- 免单券详情弹框 -->
+		<uni-popup ref="popupMd" type="bottom" :safe-area="false">
+			<view class="info-box" v-if="Object.keys(selectInfo).length > 0">
+				<image src="https://static.ticket.sz-trip.com/kunshan/activity/coffeeCoupon/cha.png" class="cha" @click="$refs.popupMd.close()"></image>
+				
+				<canvas canvas-id="qrcodeT" mode="widthFix"
+					style="position: absolute;z-index: -1;top: -100%;left: -500rpx;"></canvas>
+				
+				<view class="code-box flex-center" v-if="false">
+					<image :src="qrcodeimg" alt=""></image>
+					
+					<view class="code-past flex-center" v-if="navActive == 1">
+						<view class="flex-center">{{getStatusText(selectInfo.status)}}</view>
+					</view>
+				</view>
+				
+				<view style="text-align: center;font-weight: bold;font-size: 40rpx;">卡密：{{selectInfo.card_key}}</view>
+				
+				<view class="coupon-item">
+					<view class="item-top">
+						<view class="top-left">
+							<image src="https://static.ticket.sz-trip.com/kunshan/activity/coffeeCoupon/miandan.png" v-if="navActive == 0"></image>
+							<image src="https://static.ticket.sz-trip.com/kunshan/activity/coffeeCoupon/miandans.png" v-else></image>
+						</view>
+						<view class="top-right">
+							<view class="title">
+								{{selectInfo.title}}
+							</view>
+							<view class="time">
+								{{selectInfo.open_time}}-{{selectInfo.end_time}}可用
+							</view>
+						</view>
+					</view>
+					<view class="item-circle">
+					    <view class="circle left"></view>
+					    <view class="line"></view>
+					    <view class="circle right"></view>
+					</view>
+					<view class="item-bottom">
+						<view class="rules text-overflow">使用规则：{{selectInfo.content}}</view>
+					</view>
+				</view>
+				
+				<view class="coupon-box">
+					<view>
+						<view class="title">券状态</view>
+						<view class="subtitle" style="color: #07C49B;">{{getStatusText(selectInfo.status)}}</view>
+					</view>
+					<view>
+						<view class="title">有效期</view>
+						<view class="subtitle">{{selectInfo.open_time}}~{{selectInfo.end_time}}可用</view>
+					</view>
+					<view v-if="selectInfo.notice">
+						<view class="title">使用须知</view>
+						<view class="subtitle">{{selectInfo.notice}}</view>
+					</view>
+				</view>
+			</view>
+		</uni-popup>
 	</view>
 </template>
 
 <script>
+	import QRCode from '@/static/js/weapp-qrcode.js'
 	export default {
 		data() {
 			return {
@@ -99,13 +164,33 @@
 				navActive:'', // 当前导航
 				coupon:[],
 				// openRules: false,
-				password:''
+				password:'',
+				selectInfo: {},
+				qrcodeimg: ''
 			}
 		},
 		onShow() {
 			this.getList(this.navList[0])
 		},
 		methods: {
+			// 优惠券状态文字
+			getStatusText(text) {
+				let statusText = ''
+				switch (text){
+					case 'wait_use':
+						statusText = '等待使用'
+						break;
+					case 'past':
+						statusText = '已过期'
+						break;
+					case 'complete':
+						statusText = '已使用'
+						break;
+					default:
+						break;
+				}
+				return statusText;
+			},
 			getPecenet:function (percent) {
 				if(percent>=100 || percent<=0) return "";
 					percent = 100 - percent;
@@ -114,9 +199,33 @@
 				}
 				return percent
 			},
-			use() {
-				uni.switchTab({
-					url: "/pages/index/index",
+			use(item) {
+				if(this.navActive == 1 && item.free_flag == 1) return;
+				if(item.free_flag == 1) {
+					uni.switchTab({
+						url: "/pages/index/index",
+					});
+				}else {
+					this.selectInfo = item
+					this.getCodeImg()
+					this.$refs.popupMd.open()
+				}
+			},
+			// 二维码
+			getCodeImg() {
+				new QRCode('qrcodeT', {
+					text: this.selectInfo.card_key,
+					width: 120,
+					height: 120,
+					padding: 2,
+					colorDark: 'rgb(0,0,0)',
+					colorLight: 'rgb(255,255,255)',
+					correctLevel: QRCode.CorrectLevel.H, // 二维码可辨识度
+					callback: res => {
+						this.qrcodeimg = res.path;
+						console.log(this.qrcodeimg)
+						this.$forceUpdate();
+					}
 				});
 			},
 			submitPassword() {
@@ -244,13 +353,13 @@
 	padding-bottom: 30rpx;
 }
 
-.coupon-list .coupon-item {
+.coupon-item {
     background: #ffffff;
 	margin-top: 20rpx;
     border-radius: 13rpx;
 }
 	
-.coupon-list .coupon-item .item-top {
+.coupon-item .item-top {
 	display: flex;
 	padding: 30rpx 16rpx 24rpx 36rpx;
 	align-items: center;
@@ -284,6 +393,11 @@
 	font-size: 32rpx;
 }
 
+.top-left image {
+	width: 133.33rpx;
+	height: 104rpx;
+}
+
 .top-right {
 	margin-left: 46.67rpx;
 	font-size: 25rpx;
@@ -355,7 +469,7 @@
 }
 
 .item-bottom .rules span {
-	width: 569rpx;
+	width: 425rpx;
 	overflow: hidden;  //超出隐藏
 	white-space: nowrap; //不折行
 	text-overflow: ellipsis;
@@ -364,7 +478,7 @@
 .item-bottom .rules image {
 	width: 20rpx;
 	height: 20rpx;
-	margin-left: 68rpx;
+	margin-left: 20rpx;
 	margin-top: 15rpx;
 }
 
@@ -491,4 +605,87 @@
 		margin-bottom: 15rpx;
 	}
 }
+
+.info-box {
+	max-height: 100vh;
+	overflow-x: hidden;
+	overflow-y: auto;
+	background: #F7F7F7;
+	border-radius: 27rpx 27rpx 0rpx 0rpx;
+	padding: 90rpx 26rpx 20rpx;
+	box-sizing: border-box;
+	position: relative;
+	
+	.cha {
+		width: 31.33rpx;
+		height: 31.33rpx;
+		position: absolute;
+		top: 32rpx;
+		right: 37rpx;
+	}
+	
+	.code-box {
+		width: 275rpx;
+		height: 269rpx;
+		background: #FFFFFF;
+		box-shadow: 0rpx 0rpx 33rpx 0rpx rgba(102,102,102,0.26);
+		border-radius: 20rpx;
+		overflow: hidden;
+		margin: 0 auto;
+		position: relative;
+		
+		image {
+			width: 243rpx;
+			height: 243rpx;
+		}
+		
+		.code-past {
+			width: 275rpx;
+			height: 269rpx;
+			position: absolute;
+			top: 0;
+			left: 0;
+			font-weight: bold;
+			font-size: 25rpx;
+			color: #000000;
+			background-color: rgba(0, 0, 0, .6);
+			
+			view {
+				width: 143rpx;
+				height: 143rpx;
+				background: #FFFFFF;
+				border-radius: 71rpx;
+			}
+		}
+	}
+	
+	.coupon-box {
+		width: 697rpx;
+		height: auto;
+		background: #FFFFFF;
+		border-radius: 13rpx;
+		padding: 34rpx 18rpx;
+		box-sizing: border-box;
+		margin: 28rpx auto 0;
+		
+		&>view {
+			margin-bottom: 25rpx;
+			display: flex;
+		}
+		
+		.title {
+			font-weight: 500;
+			font-size: 27rpx;
+			color: #111111;
+			min-width: 130rpx;
+			white-space: nowrap;
+		}
+		
+		.subtitle {
+			font-weight: 500;
+			font-size: 25rpx;
+			color: #444444;
+		}
+	}
+}
 </style>