feat: 小程序界面优化

This commit is contained in:
2026-07-23 14:00:03 +08:00
committed by charles
parent 4b7334d278
commit 26c863fbfb
6 changed files with 51 additions and 25 deletions
+17 -18
View File
@@ -14,13 +14,13 @@
<view class="remain-count"> 剩余抽奖次数: {{ prizesObj.times }} </view>
<!-- 九宫格抽奖组件 -->
<!-- <LotteryGrid
<LotteryGrid
:prizesObj="prizesObj"
:remainCount="prizesObj.times"
:is-disabled="isRotating"
@start="handleStartLottery"
@complete="handleLotteryComplete"
/> -->
/>
<view class="notice-view">
<view class="notice-li">
<u-notice-bar
@@ -40,21 +40,20 @@
</view>
<!-- 中奖结果弹窗 -->
<!-- #ifdef APP-PLUS -->
<!-- <ResultModal :visible="showResult" :prize="currentPrize" @close="showResult = false" /> -->
<!-- #endif -->
<ResultModal :visible="showResult" :prize="currentPrize" @close="showResult = false" />
</view>
</template>
<script>
// import LotteryGrid from "./components/LotteryGrid.vue";
// import ResultModal from './components/ResultModal.vue'
import LotteryGrid from "./components/LotteryGrid.vue";
import ResultModal from './components/ResultModal.vue'
import { getActivityList, getCommonRaffle } from "@/api/raffle.js";
export default {
components: {
// LotteryGrid,
// ResultModal
LotteryGrid,
ResultModal
},
data() {
return {
@@ -72,14 +71,14 @@ export default {
backPath: null,
};
},
// onLoad(option) {
// const backPath = option.backPath;
// console.log("option backPath", backPath);
// if (backPath && backPath !== "null") {
// this.backPath = backPath;
// }
// this.getCommon();
// },
onLoad(option) {
const backPath = option.backPath;
console.log("option backPath", backPath);
if (backPath && backPath !== "null") {
this.backPath = backPath;
}
this.getCommon();
},
mounted() {
this.getActivityList();
},
@@ -160,7 +159,7 @@ export default {
};
</script>
<style scoped>
<style scoped lang="scss">
.notice-view {
width: 100%;
min-height: 64rpx;
@@ -136,7 +136,7 @@
<!-- 商品详情 -->
<view class="content_details">
<view class="content_details_title">商品详情</view>
<view v-html="orderInfo.detailInfo"></view>
<view v-html="detailRich" class="content_details_content"></view>
</view>
</view>
@@ -432,6 +432,7 @@ export default {
activedType: "", // 活动类型
activityId: "", // 秒杀活动ID
skuBySpecInfo: {},
detailRich: "",
};
},
onBackPress(options) {
@@ -902,6 +903,11 @@ export default {
console.log("查询详细内容---", data)
this.orderInfo = data;
this.detailRich = this.orderInfo.detailInfo.replace(
/<img([^>]*?)>/gi,
'<img$1 style="max-width:100%;height:auto;display:block;">'
);
}
},
/**
@@ -1305,6 +1311,10 @@ export default {
.product_info_header_swiper {
height: 800rpx !important;
.u-swiper {
height: 800rpx !important;
}
::v-deep(.u-swiper__wrapper) {
height: 800rpx !important;
@@ -1510,10 +1520,17 @@ export default {
margin-top: 30rpx;
// margin-bottom: 200rpx;
.content_details_title {
padding: 20rpx 30rpx;
}
.content_details_content {
rich-text {
width: 700rpx;
}
}
img,
img[alt] {
max-width: 100%;
+5
View File
@@ -148,6 +148,11 @@ export default {
flex-direction: column;
align-items: center;
box-sizing: border-box;
/* 兼容 iOS 11~12.1 */
padding-top:calc(80rpx + constant(safe-area-inset-top));
/* 主流写法,iOS 11+、Android 9+ 均支持 */
padding-top:calc(env(safe-area-inset-top) + 80rpx) ;
background-color: #fff;
.top-view{
width:100%;
min-height:150rpx;
+6 -4
View File
@@ -440,7 +440,8 @@ export default {
<style lang="scss" scoped>
.shopping_cart_warp {
background-color: $app-bj;
padding: 104rpx 30rpx 30rpx;
padding: constant(safe-area-inset-top) 30rpx 30rpx;
padding: env(safe-area-inset-top) 30rpx 30rpx;
overflow: hidden;
&.isDataNull-calss {
@@ -455,7 +456,7 @@ export default {
height: calc(100vh - 100rpx - 50rpx) !important;
.shopping_cart_content {
height: calc(100vh - 104rpx - 30rpx - 30rpx - 100rpx - 10rpx) !important;
// height: calc(100vh - 104rpx - 30rpx - 30rpx - 100rpx - 10rpx) !important;
}
.shopping_cart_but {
@@ -468,7 +469,7 @@ export default {
display: flex;
justify-content: space-between;
color: #222222;
margin-top: 160rpx;
.cart {
font-weight: bold;
font-size: 38rpx;
@@ -543,7 +544,8 @@ export default {
.shopping_cart_but {
position: fixed;
bottom: calc(90rpx + env(safe-area-inset-bottom));
bottom: 0;
// bottom: calc(90rpx + env(safe-area-inset-bottom));
left: 0;
width: calc(100% - 40rpx);
background: #ffffff;
+2 -1
View File
@@ -88,6 +88,7 @@ export default {
platformType: true,
};
},
onShow() {
/*#ifdef APP-PLUS*/
uni.hideTabBar({
@@ -236,7 +237,7 @@ export default {
display: flex;
justify-content: space-between;
padding: 0 30rpx;
height: 100rpx;
margin-top: 80rpx;
.sort_category_header {
display: flex;
+3 -1
View File
@@ -240,7 +240,9 @@ export default {
<style lang="scss" scoped>
.content-two {
height: calc(100vh);
background-color: $app-bj;
padding-top: 80rpx;
background-color: #fff;
// background-color: $app-bj;
}
.head-view {