首页完善

This commit is contained in:
魏啾
2024-05-10 09:40:06 +08:00
parent 678c8fa053
commit 09661b8b0b
13 changed files with 707 additions and 297 deletions

View File

@@ -60,7 +60,9 @@
}
},
clickproduct(item) {
uni.pro.navigateTo('product/index', item)
uni.pro.navigateTo('product/index',{
id:item.id
})
},
}
};

View File

@@ -88,7 +88,8 @@
<view>
{{item1.name}}
</view>
<view v-for="(item2,index2) in item1.proTag" :style="{'background':item.backColor,'color':item.fontColor}" :key="index2">
<view v-for="(item2,index2) in item1.proTag"
:style="{'background':item.backColor,'color':item.fontColor}" :key="index2">
{{item2.name}}
</view>
</view>
@@ -102,7 +103,7 @@
</view>
</view>
</view>
</view>
<view class="fivecontent">
<view class="fivecontentone">
@@ -171,6 +172,36 @@
<u-icon name="arrow-right" color="#333333" size="28"></u-icon>
</view>
</view>
<view :style="{height:height}">
</view>
<view class="fixedview flex-between">
<view class="fixedview_letr flex-start">
<view class="fixedview_letr_item flex-colum" @click="eeInfoindex">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/product/index.png" mode="aspectFill"></image>
<text>首页</text>
</view>
<view class="fixedview_letr_item flex-colum" @click="makePhoneCall">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/product/Call.png" mode="aspectFill"></image>
<text>客服</text>
</view>
</view>
<view class="fixedview_tow">
<!-- <view class="fixedview_towone" @click="overlayshowsboxs(1)">
加入购物车
</view> -->
<view class="fixedview_towtow" @click="overlayshowsboxs(2)">
立即购买
</view>
<!-- <view class="fixedview_towtow" style="background: #ccc;">
立即购买
</view> -->
</view>
</view>
<!-- <view class="bottomcontent flex-between">
<view class="bottomcontent_texttop flex-start">
附近推荐
@@ -303,7 +334,8 @@
titlename: '详情',
opacity: false,
showpopup: false,
indexform: {},
indexform: '',
height: '',
listdata: {
},
@@ -323,25 +355,47 @@
},
onLoad(e) {
console.log(e)
this.indexform = e
this.indexform = e.id
this.onLoadInfo()
},
mounted() {
//#ifdef MP-WEIXIN || H5
var query = uni.createSelectorQuery().in(this).select('.fixedview')
query.boundingClientRect(ele => {
var that = this;
uni.getSystemInfo({
success(res) {
that.height = (ele.height) + "px";
that = null;
}
})
}).exec();
//#endif
//#ifdef MP-ALIPAY
my.createSelectorQuery().selectAll('.fixedview').boundingClientRect().exec(ele => {
var nodeData = ele[0]
var that = this;
that.height = (nodeData.height) + "px";
that = null;
})
//#endif
},
methods: {
//打电话
clickphone(e){
clickphone(e) {
uni.makePhoneCall({
phoneNumber: e
phoneNumber: e
});
},
// 通用门店
productgeneralstore(name){
uni.pro.navigateTo('product/generalstore',{
productgeneralstore(name) {
uni.pro.navigateTo('product/generalstore', {
name
})
},
async onLoadInfo() { //详情接口
let res = await this.api.productproductInfo({
productId: this.indexform.id,
productId: this.indexform,
lng: uni.cache.get('getLocationstorage').lng,
lat: uni.cache.get('getLocationstorage').lat
})
@@ -388,6 +442,92 @@
}
}
.fixedview {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
padding: 24rpx 28rpx;
background: #FFFFFF;
z-index: 999;
.fixedview_letr {
.fixedview_letr_item:nth-child(1) {
margin: 0;
}
.fixedview_letr_item {
margin-left: 32rpx;
image {
width: 40rpx;
height: 40rpx;
}
text {
margin-top: 8rpx;
font-size: 20rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
}
}
}
.fixedview_one {
.fixedview_oneone {
font-size: 28rpx;
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
font-weight: normal;
color: #333333;
}
.fixedview_onetow {
font-size: 44rpx;
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
font-weight: normal;
color: #F45C4C;
font-weight: bold;
text {
font-size: 28rpx;
}
}
}
.fixedview_tow {
// flex: auto;
padding-left: 24rpx;
.fixedview_towone {
width: 50%;
font-size: 28rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: var(--cart-text-color);
height: 72rpx;
line-height: 72rpx;
text-align: center;
border-radius: 50rpx 0 0 50rpx;
background: var(--cart-background-color);
}
.fixedview_towtow {
width: 302rpx;
height: 72rpx;
text-align: center;
line-height: 72rpx;
background: linear-gradient( 110deg, #F1A666 0%, #FF4C11 100%);
border-radius: 48rpx 48rpx 48rpx 48rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 36rpx;
color: #FFFFFF;
}
}
}
.towcontent {
position: relative;
margin-top: -40rpx;
@@ -484,9 +624,9 @@
background: #FFFFFF;
.towtowcontent_one {
overflow:hidden; //超出的文本隐藏
text-overflow:ellipsis; //溢出用省略号显示
white-space:nowrap; //溢出不换行
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis; //溢出用省略号显示
white-space: nowrap; //溢出不换行
padding-top: 32rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
@@ -545,9 +685,9 @@
margin-top: 32rpx;
.towtherecontent_o {
overflow:hidden; //超出的文本隐藏
text-overflow:ellipsis; //溢出用省略号显示
white-space:nowrap; //溢出不换行
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis; //溢出用省略号显示
white-space: nowrap; //溢出不换行
width: 364rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;