新增限时折扣并增加头部底部按钮公共组件

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

@@ -0,0 +1,55 @@
+<template>
+	<view class="fixed-wrap" :style="{ '--num': showCancel ? '63px' : '0px' }">
+		<view class="fixed-btn" id="targetRef">
+			<div class="btn">
+				<u-button type="primary" :shape="shape" size="large" @click="emits('confirm')">{{ confirmText }}</u-button>
+			</div>
+			<div class="btn" v-if="showCancel">
+				<u-button :shape="shape" size="large" @click="emits('cancel')">取消</u-button>
+			</div>
+		</view>
+	</view>
+</template>
+
+<script setup>
+import { ref, onMounted, nextTick, getCurrentInstance } from 'vue';
+
+const props = defineProps({
+	confirmText: {
+		type: String,
+		default: '添加'
+	},
+	showCancel: {
+		type: Boolean,
+		default: false
+	},
+	shape: {
+		type: String,
+		default: 'squre' // squre circle
+	}
+});
+
+const emits = defineEmits(['confirm', 'cancel']);
+</script>
+
+<style scoped lang="scss">
+.fixed-wrap {
+	--height: calc(83px + var(--num) + env(safe-area-inset-bottom) / 2);
+	width: 100%;
+	height: var(--height);
+	.fixed-btn {
+		width: 100%;
+		height: var(--height);
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		padding: 10px 14px calc(20px + env(safe-area-inset-bottom) / 2) 10px;
+		background-color: #fff;
+		.btn {
+			&:first-child {
+				margin-bottom: 14px;
+			}
+		}
+	}
+}
+</style>