新增部分优惠券页面

components/my-components/my-coupon-item.vue

@@ -0,0 +1,110 @@
+<!-- 优惠券item -->
+<template>
+	<view class="item">
+		<view class="header">
+			<text class="title">{{ item.title }}</text>
+			<text class="id">ID:83713</text>
+		</view>
+		<view class="content">
+			<slot></slot>
+		</view>
+		<view class="total-info">
+			<view class="item">
+				<text class="info">{{ item.giveNum }}</text>
+				<text class="title">总发放</text>
+			</view>
+			<view class="item">
+				<text class="info">{{ item.giftNum }}</text>
+				<text class="title">已领取</text>
+			</view>
+			<view class="item">
+				<text class="info">{{ item.useNum }}</text>
+				<text class="title">已使用</text>
+			</view>
+			<view class="item">
+				<text class="info">
+					<template v-if="item.giveNum == -10086">无限</template>
+					<template v-else>{{ item.leftNum }}</template>
+				</text>
+				<text class="title">剩余</text>
+			</view>
+		</view>
+		<view class="footer-wrap">
+			<view class="btn">
+				<u-button shape="circle">删除</u-button>
+			</view>
+			<view class="btn">
+				<u-button shape="circle" type="primary">编辑</u-button>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+const props = defineProps({
+	item: {
+		type: Object,
+		default: {}
+	}
+});
+</script>
+
+<style scoped lang="scss">
+.item {
+	background-color: #fff;
+	border-radius: 20upx;
+	padding: 28upx;
+	.header {
+		display: flex;
+		justify-content: space-between;
+		.title {
+			font-size: 32upx;
+			color: #333;
+		}
+		.id {
+			font-size: 24upx;
+			color: #999;
+			background-color: #f8f8f8;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			padding: 0 8upx;
+			border-radius: 4upx;
+		}
+	}
+	.content {
+		margin-top: 28upx;
+		padding: 20upx;
+		background-color: #f8f8f8;
+		border-radius: 12upx;
+	}
+	.total-info {
+		display: flex;
+		.item {
+			flex: 1;
+			display: flex;
+			gap: 12upx;
+			align-items: center;
+			justify-content: center;
+			flex-direction: column;
+			.info {
+				font-weight: bold;
+				font-size: 28upx;
+				color: #333;
+			}
+			.title {
+				font-size: 24upx;
+				color: #999;
+			}
+		}
+	}
+	.footer-wrap {
+		display: flex;
+		justify-content: flex-end;
+		gap: 28upx;
+		.btn {
+			width: 200upx;
+		}
+	}
+}
+</style>

components/my-components/my-footer-btn.vue

@@ -25,7 +25,7 @@ const props = defineProps({
 	},
 	shape: {
 		type: String,
-		default: 'squre' // squre circle
+		default: 'circle' // squre circle
 	}
 });
 

components/my-components/my-select-goods.vue

@@ -141,10 +141,6 @@ function updateSelectGoods() {
 }
 
 // 确定
-const foods = defineModel('foods', {
-	type: [Array, String],
-	default: []
-});
 function confirmHandle() {
 	confirmSelectGoods();
 	popupShow.value = false;
@@ -162,7 +158,7 @@ function confirmSelectGoods() {
 		});
 	});
 
-	foods.value = selectGoodsCount.value.map((item) => item.id);
+	modelValue.value = selectGoodsCount.value.map((item) => item.id);
 }
 
 // 获取商品列表
@@ -170,8 +166,8 @@ async function getProductListAjax() {
 	try {
 		const res = await getProductList();
 		res.forEach((item, index) => {
-			console.log('modelValue.value===', modelValue.value);
-			console.log('index===', item.id.includes(modelValue.value));
+			// console.log('modelValue.value===', modelValue.value);
+			// console.log('index===', item.id.includes(modelValue.value));
 			if (modelValue.value.includes(item.id)) {
 				item.selected = true;
 			} else {
@@ -226,6 +222,13 @@ onMounted(async () => {
 					font-size: 28upx;
 					color: #999;
 				}
+				.t {
+					display: block;
+					max-width: 400upx;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					white-space: nowrap;
+				}
 			}
 		}
 	}