小程序本地假分页 自适应滚动高度
2023-10-30 本文已影响0人
糖醋里脊120625
<!-- 自定义的导航栏开始 -->
<view class="custom flex_center" style="padding-top:{{statusBarHeight}}px">
<view class="title-left">
<view class="back" bind:tap="backFun">
<van-icon color="white" name="arrow-left" size="25px" />
</view>
<view class="avatar-title">选择商品</view>
</view>
<view class="search-icon" bind:tap="searchClick" style="margin-right:{{navInfo.width}}px">
<van-icon
color="white"
class="icon-forn"
slot="left-icon"
prefix="wr"
name="search"
size="50rpx"
/>
</view>
</view>
<view class="name-all" id="nameID">
<!-- <van-search disabled bind:click-input="searchClick" placeholder="请输入搜索关键词" /> -->
<view class="business-top">
<view class="business-left">
<view class="business-name">{{postBusiness.eiName}}</view>
<view class="business-text"><van-icon name="location" color="white" />{{postBusiness.eiAddress}}</view>
<view class="business-text">
<van-icon name="friends" color="white" />
{{postBusiness.eiContact}}/
<view bind:tap="callPhone">{{postBusiness.eiAdminMobile}}</view>
</view>
</view>
</view>
</view>
<view class="main-cate">
<scroll-view class="menu-left" style="height:{{heightScroll}}px;box-sizing: border-box;" scroll-y scroll-with-animation="{{true}}">
<view class="menu-main">
<view
class="cate-list"
wx:for="{{goodsList}}"
wx:for-item="item"
wx:for-index="index"
wx:key="index"
data-bean="{{item}}"
data-index="{{index}}"
bindtap="switchCategory"
>
<text class="cate-text {{curIndex==index?'on':''}}">{{item.ptItemName}}</text>
</view>
</view>
</scroll-view>
<view class="menu-right" >
<scroll-view style="height:{{heightScroll}}px;box-sizing: border-box;" scroll-y="true" scroll-with-animation="true" bindscroll="watchScroll" scroll-into-view="{{toView}}" bindscrolltolower="Reachbottom">
<block class="cate-product">
<view class="product-list" wx:for="{{ProductList}}" wx:for-item="each" data-each="{{each}}" wx:key="key"> <van-image lazy-load src="{{each.piImageUrl}}"/>
<view class="product-left">
<view class="product-name">{{each.piProductName}}</view>
<view class="product-desc">{{each.ProductDes}}</view>
<view class="product-end">
<view class="product_price">¥{{each.standardPrice}}</view>
<view class="add-cart" wx:if="{{each.showAddOrSub==false}}">
<van-icon
name="shopping-cart"
color="#fa550f"
size="50rpx"
data-item-index="{{index}}"
data-parentIndex="{{parentIndex}}"
bindtap="addCart"/>
</view>
<view class="count-part" wx:if="{{each.showAddOrSub==true}}">
<van-stepper
data-item-index="{{index}}"
data-parentIndex="{{parentIndex}}"
min=""
value="{{ each.SelNum }}"
bind:blur="BlurItemNum"
bind:minus="MinusItemNum"
bind:plus="PlusItemNum"
input-class="stepinput"
plus-class="stepplus"
minus-class="stepplus"
input-width="60px"
button-size="25px"
/>
</view>
</view>
</view>
</view>
<view class="none-text" wx:if="{{ProductList.length==0}}">
<image src="https://pic-shop.magcloud.net/miniapp_static/empty_order_icons.png" />
<view >空空如也...</view>
</view>
</block>
</scroll-view>
</view>
</view>
<view class="pop-button" >
<van-goods-action custom-class="action-box">
<van-goods-action-icon icon="share-o" text="分享" open-type="share"/>
<van-goods-action-icon icon="shop-o" text="我要开店" bind:click="ClickShop" />
<van-goods-action-icon icon="cart-o" text="购物车" info="{{GoodsNum}}" bind:click="onClickIcon" />
<van-goods-action-button wx:if="{{ editChoose==false }}" color="#fa550f" text="去下单" bind:click="SubmitFun" />
<van-goods-action-button wx:if="{{ editChoose }}" color="#fa550f" text="去下单" bind:click="EditSubmit" />
</van-goods-action>
<view class="support-text">技术支持：400-100-9083</view>
</view>
<van-popup custom-style="height: 50%;" position="bottom" z-index="{{100}}" show="{{ showPopup }}" bind:close="onCancelCategory">
<view class="eject-product">
<view class="eject-list">
<view class="ejectselected-list" wx:for="{{HasSelectedList}}" wx:for-item="each" data-each="{{each}}" wx:key="key" wx:if="{{ each.SelNum>0}}" >
<van-image lazy-load src="{{each.piImageUrl}}"/>
<view class="ejectselected-left">
<view class="ejectselected-name">{{each.piProductName}}</view>
<view class="product-desc">{{each.ProductDes}}</view>
<view class="product-end">
<view class="product_price">¥{{each.standardPrice}}</view>
<view class="ejectselected-part" wx:if="{{each.showAddOrSub==true}}">
<van-stepper
data-item-index="{{index}}"
data-parentIndex="{{parentIndex}}"
min=""
value="{{ each.SelNum }}"
bind:blur="BlurSelectedItemNum"
bind:minus="MinusSelectedItemNum"
bind:plus="PlusSelectedItemNum"
input-class="stepinput"
plus-class="stepplus"
minus-class="stepplus"
input-width="60px"
button-size="25px"
/>
</view>
</view>
</view>
</view>
</view>
</view>
</van-popup>
//存放右侧分类的高度累加数组
var heightList = [];
import { goodsGroup, basicBusinessInfo,goodsNoTokenGroup } from '../../http/goodsApi'
import { centToYuan } from '../../unit/priceUtil'
import { getLocalUserInfo } from '../../unit/userInfo'
var dayjs = require('dayjs')
const app = getApp()
// https://www.bookstack.cn/read/vant-3.4.7-zh/8bd11acebe45f23c.md
Page({
/**
* 页面的初始数据
*/
data: {
goodsList: [],
curIndex: 0,
pageData: 1,
hasLoadData: true,
itemCateData: {},
mainActiveIndex: 0,
basicInfo: {},
SeledGoods: [],
GoodsNum: "",
showPopup: false,
heightArr: [],
distance: 0,
active: 0,
selectId: "item0",
MerchantInfo: {},
postBusiness: {},
SendTimeVal: dayjs(new Date().getTime()).format('YYYY-MM-DD'),
ProductList: [],
HasSelectedList: [],
pageTotal: 0,
pageSize: 10,
pageIndex: 1,
TotalDataList: [],
detailID:"adc8f0fe062e49daa9957deec14d4eb5",
editChoose:false,
statusBarHeight: 0,
navInfo: {},
heightScroll:0
},
setScrollHeight(){
var that =this;
let WHeight="";
let NHeight="";
wx.getSystemInfo({//微信api，可以获取页面的信息
success: (result) => {
WHeight=result.windowHeight
},
fail: (res) => {},
complete: (res) => {},
})
wx.createSelectorQuery().select('#nameID').boundingClientRect(function(rect){
let setHeight = WHeight - rect.height-166;
console.log(setHeight)
that.setData({
heightScroll: setHeight,
})
// console.log(WHeight)
// console.log(rect.height)
}).exec()
},
backFun() {
wx.navigateBack({ delta: 1 });
},
callPhone() {
wx.makePhoneCall({
phoneNumber: this.data.postBusiness.eiAdminMobile
})
},
// 选择左侧标签锚点定位
activeNav(e) {
var index = e.currentTarget.dataset.index
this.setData({
active: index,
selectId: "item" + index
})
},
//计算右侧每个锚点的高度
selectHeight() {
var list = []
var height = 0;
const query = wx.createSelectorQuery();
query.selectAll('.subtitle').boundingClientRect()
query.exec((res) => {
res[0].forEach((item) => {
height += item.height;
list.push(height)
})
this.data.heightArr = list
})
},
//监听scroll-view的滚动事件
watchScroll(e) {
let scrollTop = e.detail.scrollTop; //获取距离顶部的距离
let active = this.data.active;
if (scrollTop >= this.data.distance) {
if (active + 1 < this.data.heightArr.length && scrollTop >= this.data.heightArr[active]) {
this.setData({
active: active + 1
})
}
} else {
if (active - 1 >= 0 && scrollTop < this.data.heightArr[active - 1]) {
this.setData({
active: active - 1
})
}
}
this.data.distance = scrollTop;
},
getNavigationInfo() {
var that = this;
wx.getSystemInfo({
success(res) {
const menuButton = wx.getMenuButtonBoundingClientRect();
that.setData({
navInfo: {
top: menuButton.top,
right: res.windowWidth - menuButton.right,
width: menuButton.width + 18,
height: menuButton.height,
bottom: menuButton.top - res.statusBarHeight
}
})
}
})
},
/**
* 生命周期函数--监听页面加载
*/
// aaa
onLoad: function (options) {
wx.setNavigationBarColor({
frontColor: '#ffffff',
backgroundColor: '#FE6526',
animation: {
duration: 400,
timingFunc: 'easeIn'
}
})
var that =this;
this.getNavigationInfo()
wx.getSystemInfo({
success: function (res) {
that.setData({
statusBarHeight: res.statusBarHeight,
})
},
})
if (JSON.stringify(options) == "{}") {
return
} else {
let optionData = JSON.parse(decodeURIComponent(options.detInfo));
console.log(optionData)
if(optionData.editChose){
console.log("编辑")
this.setData({
editChoose:true,
SendTimeVal:optionData.basicInfo.SendTimeVal,
MerchantInfo: optionData,
basicInfo: optionData.basicInfo,
HasSelectedList: optionData.SeledGoods.map((item) => {
return {
piImageUrl: item.productImage,
piId: item.productId,
piProductName: item.productName,
ProductDes: item.ProductDes,
SelNum: item.productNum,
showAddOrSub: true
};
}),
detailID: optionData.basicInfo.ordSupplierId
})
}else{
console.log("新增")
this.setData({
MerchantInfo: optionData,
detailID: optionData.eiId,
})
}
console.log(getLocalUserInfo())
if(getLocalUserInfo()){
//登录状态下请求数据
console.log("登录状态下")
}else{
//没有登录
console.log("没有登录")
}
this.getGoodsLoginStatusData(this.data.detailID)
this.getBusinessBasicInfo(this.data.detailID)
}
wx.setNavigationBarTitle({
title: '商品下单',
})
this.selectHeight();
},
getBusinessBasicInfo(eiId) {
basicBusinessInfo(eiId).then((res) => {
console.log("公司的整个主体信息")
let resuleData = res.data;
let buildData = {
eiId: resuleData.eiId,
eiName: resuleData.eiName,
eiContact: resuleData.eiContact,
eiAdminMobile: resuleData.eiAdminMobile,
eiProvinceName: resuleData.eiProvinceName,
eiCityName: resuleData.eiCityName,
eiAreaName: resuleData.eiAreaName,
eiAddress: resuleData.eiAddress,
eiLicenseNo: resuleData.eiLicenseNo,
}
this.setData({
postBusiness: buildData
})
console.log("sssssssssssssssssss")
console.log(buildData)
})
},
searchClick() {
var that = this;
var selData = []
this.data.goodsList.map((item) => {
item.products.map((each) => {
if (each.SelNum > 0) {
selData.push(each)
}
})
});
const newData = JSON.stringify(
{
allData: this.data.goodsList,
hasIncludedData: that.data.HasSelectedList
}
);
wx.navigateTo({ url: `/pages/GoodsSearch/GoodsSearch?detInfo=` + encodeURIComponent(newData) });
},
onShareAppMessage: function (res) {
console.log("上面数据为空吗")
console.log(this.data.postBusiness.eiName)
const shareData = {
eiId:this.data.detailID,
}
const BuildData = JSON.stringify(shareData);
if (res.from === 'button') {
// 来自页面内转发按钮
console.log(res);
}
return {
title: this.data.postBusiness.eiName,
path: '/pages/ChoseGoods/ChoseGoods?detInfo=' + encodeURIComponent(BuildData),
}
},
switchCategory(e) {
var that = this;
var index = e.currentTarget.dataset.index;
var childData = e.currentTarget.dataset.bean.products;
function FindItem(itemID, moreList) {
let findData = moreList.find(x => x.piId == itemID.piId);
return findData
}
var changeGoods = childData.map((each) => {
if (FindItem(each, that.data.HasSelectedList)) {
return {
...each,
SelNum: FindItem(each, that.data.HasSelectedList).SelNum,
showAddOrSub: true
}
} else {
return {
...each
}
}
})
this.setData({
ProductList: [],
pageSize: 10,
pageIndex: 1,
})
let list = changeGoods
let qielist = list.slice(that.pageIndex - 1, that.data.pageSize)
this.setData({
TotalDataList: list,
ProductList: qielist,
curIndex: e.currentTarget.dataset.index ? e.currentTarget.dataset.index : 0,
toView: 'order' + e.currentTarget.dataset.bean.productTypeId,
active: index,
selectId: "item" + index,
})
},
Reachbottom() {
console.log("是个啥")
// wx.showLoading({
// title: '加载中',
// })
let shu = this.data.pageIndex
this.setData({
pageIndex: shu + 1
})
let num = (this.data.pageIndex - 1) * this.data.pageSize
let num2 = num + this.data.pageSize
let arr = this.data.TotalDataList
let qielist = arr.slice(num, num2)
let slist = this.data.ProductList
let newarr = slist.concat(qielist)
this.setData({
ProductList: newarr
})
setTimeout(function () {
wx.hideLoading()
}, 300)
},
TotalAllSelecteFun() {
this.setData({
GoodsNum: this.data.HasSelectedList.length
})
},
onCancelCategory() {
this.setData({
showPopup: false
})
},
onClickIcon() {
this.setData({
showPopup: !this.data.showPopup
})
},
ClickShop() {
wx.navigateTo({ url: `/pages/poster/poster` });
},
SubmitFun() {
if (this.data.HasSelectedList.length == 0) {
wx.showToast({
icon: 'none',
title: "请选择商品",
})
return
}
const newData = JSON.stringify(
{
FromChoseGoods: this.data.HasSelectedList,
basicInfo: this.data.postBusiness
}
);
wx.navigateTo({ url: `/pages/addOrder/addOrder?detInfo=` + encodeURIComponent(newData) });
},
EditSubmit(){
if (this.data.HasSelectedList.length == 0) {
wx.showToast({
icon: 'none',
title: "请选择商品",
})
return
}
var pages = getCurrentPages(); // 获取页面栈
var prevPage = pages[pages.length - 2]; // 上一个页面
if (prevPage.__route__ == 'pages/addOrder/addOrder') {
prevPage.changeGoods(this.data.HasSelectedList);
wx.navigateBack({
delta: 1
})
}
},
getGoodsLoginStatusData(infoID) {
let that = this;
let postData = {
enterpriseId: infoID,
}
goodsNoTokenGroup(postData).then((res) => {
function FindItem(itemID, moreList) {
let findData = moreList.find(x => x.piId == itemID.piId);
return findData
}
function FindPrice(item) {
if (item.agreementUnitPrice) {
return centToYuan(item.agreementUnitPrice);
} else if (item.customerUnitPrice) {
return centToYuan(item.customerUnitPrice);
} else {
return centToYuan(item.latestSaleUnitPrice);
}
}
let newdata = res.data.map((item) => {
if (item.products) {
var childFloor = item.products.map((each) => {
return {
...each,
ProductDes: each.piSpec + '、' + each.piNetContent + each.piNetContentUnit + '/' + each.piSpec,
standardPrice: FindPrice(each),
showAddOrSub: FindItem(each, that.data.SeledGoods) == undefined ? false : true,
SelNum: FindItem(each, that.data.SeledGoods) == undefined ? 0 : FindItem(each, this.data.SeledGoods).SelNum,
}
})
} else {
var childFloor = []
}
return {
...item,
text: item.ptItemName,
products: childFloor,
};
});
// aaa
console.log("原始数据")
console.log(newdata)
var oneChild = newdata[0].products.map((each) => {
if (FindItem(each, that.data.HasSelectedList)) {
return {
...each,
SelNum: FindItem(each, that.data.HasSelectedList).SelNum,
showAddOrSub: true
}
} else {
return {
...each
}
}
})
this.setData({
pageTotal: Math.ceil(oneChild.length / 10) //根据后台返回的总数量，判断有多少页
})
let list = oneChild
let qielist = list.slice(that.pageIndex - 1, that.data.pageSize)
this.setData({
goodsList: newdata,
TotalDataList: list,
ProductList: qielist,
curIndex: 0
})
this.TotalAllSelecteFun()
this.setScrollHeight()
})
},
DynamicCacheArray(itemData) {
let that = this;
var findData = this.data.HasSelectedList.find(x => x.piId == itemData.piId);
if (findData) {
this.data.HasSelectedList = this.data.HasSelectedList.map((item) => {
if (item.piId == itemData.piId) {
return {
...item,
SelNum: itemData.SelNum
}
} else {
return {
...item,
}
}
});
} else {
this.data.HasSelectedList.push(itemData)
}
if (itemData.SelNum == 0) {
var indexNum = this.data.HasSelectedList.findIndex((tableData) => tableData.piId == itemData.piId);
this.data.HasSelectedList.splice(indexNum, 1);
console.log("删除")
}
that.setData({
HasSelectedList: that.data.HasSelectedList,
ProductList: this.data.ProductList
});
// 最后算
this.TotalAllSelecteFun()
},
JudgeDecimal(num){
var x = String(num).indexOf('.') + 1; //小数点的位置
var y = String(num).length - x; //小数的位数
console.log(y)
return y
},
addCart(event) {
let childIndex = event.currentTarget.dataset.itemIndex;
this.data.ProductList[childIndex].showAddOrSub = true;
this.data.ProductList[childIndex].SelNum = 1;
this.setData({
ProductList: this.data.ProductList
});
this.DynamicCacheArray(this.data.ProductList[childIndex])
},
BlurItemNum(event){
var that =this;
let indexNum = event.currentTarget.dataset.itemIndex;
that.data.ProductList[indexNum].SelNum = event.detail.value;
that.ChangeItemNum(indexNum, that.data.ProductList[indexNum])
},
MinusItemNum(event){
var that =this;
let indexNum = event.currentTarget.dataset.itemIndex;
that.data.ProductList[indexNum].SelNum--;
if( that.data.ProductList[indexNum].SelNum<0 ){
console.log(that.data.ProductList[indexNum].SelNum)
that.data.ProductList[indexNum].SelNum=0
}
that.ChangeItemNum(indexNum, that.data.ProductList[indexNum])
},
PlusItemNum(event){
console.log(event)
let indexNum = event.currentTarget.dataset.itemIndex;
var that =this;
that.data.ProductList[indexNum].SelNum ++;
that.ChangeItemNum(indexNum, that.data.ProductList[indexNum])
},
// aaa
ChangeItemNum(indexNum,itemData) {
itemData.SelNum = this.JudgeDecimal(itemData.SelNum)>2?itemData.SelNum.toFixed(2):itemData.SelNum;
var that = this;
if (itemData.SelNum == 0) {
that.data.ProductList[indexNum].showAddOrSub = false;
}
that.DynamicCacheArray(that.data.ProductList[indexNum])
},
BlurSelectedItemNum(event){
var that =this;
let indexNum = event.currentTarget.dataset.itemIndex;
that.data.HasSelectedList[indexNum].SelNum = event.detail.value;
that.changedSelected(indexNum, that.data.HasSelectedList[indexNum])
},
MinusSelectedItemNum(event){
var that =this;
let indexNum = event.currentTarget.dataset.itemIndex;
that.data.HasSelectedList[indexNum].SelNum--;
if( that.data.HasSelectedList[indexNum].SelNum<0 ){
console.log(that.data.HasSelectedList[indexNum].SelNum)
that.data.HasSelectedList[indexNum].SelNum=0
}
that.changedSelected(indexNum, that.data.HasSelectedList[indexNum])
},
PlusSelectedItemNum(event){
console.log(event)
let indexNum = event.currentTarget.dataset.itemIndex
var that =this;
that.data.HasSelectedList[indexNum].SelNum ++;
that.changedSelected(indexNum, that.data.HasSelectedList[indexNum])
},
// cccc
changedSelected(indexNum,itemData) {
console.log(itemData.SelNum)
itemData.SelNum = this.JudgeDecimal(itemData.SelNum)>2?itemData.SelNum.toFixed(2):itemData.SelNum;
console.log(this.JudgeDecimal(itemData.SelNum))
let that = this;
this.data.ProductList = this.data.ProductList.map((item, index) => {
if (item.piId == itemData.piId) {
if (itemData.SelNum == 0) {
return {
...item,
showAddOrSub: false,
SelNum: 0
}
} else {
return {
...item,
SelNum: itemData.SelNum
}
}
} else {
return {
...item,
}
}
});
if (itemData.SelNum == 0) {
this.data.HasSelectedList.splice(indexNum, 1);
}
// 需要注意
that.setData({
HasSelectedList:this.data.HasSelectedList,
ProductList: this.data.ProductList
});
this.TotalAllSelecteFun()
},
haveSearchGoods(usefulData) {
var that = this;
console.log(usefulData)
console.log(this.data.HasSelectedList)
var selData = []
this.data.HasSelectedList.map((each) => {
if (each.SelNum > 0) {
selData.push(each)
}
});
let OldGoods = selData;
let NewGoods = usefulData;
NewGoods.forEach((item) => {
let index = OldGoods.findIndex(e =>
e.piId == item.piId
)
if (index > -1) {
OldGoods[index] = item
} else {
OldGoods.push(item)
}
})
this.setData({
HasSelectedList: OldGoods,
});
setTimeout(function () {
that.getGoodsLoginStatusData(that.data.detailID)
}, 10);
return
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 用户点击右上角分享
*/
})
.product-end{
display: flex;
align-items: center;
justify-content: space-between;
}
.product_price{
font-size: 28rpx;
color: #fa550f;
font-weight: bold;
}
.business-top{
display: flex;
box-sizing: border-box;
padding: 10rpx;
justify-content: space-between;
align-items: center;
}
.van-search{
padding: 4px 12px!important;
}
.business-left{
margin-left: 20rpx;
}
.business-name{
font-size: 34rpx;
color: white;
}
.business-text{
margin-top: 10rpx;
font-size: 30rpx;
color: white;
align-items: center;
display: flex;
}
.business-type{
font-size: 28rpx;
color: #bbbbbb;
}
/* page,.main-cate {
position: fixed;
display: flex;
width: 100%;
} */
.name-all{
position: relative;
width: 100%;
box-sizing: border-box;
border-bottom: 1px solid #f6f6f6;
background: #fa550f;
/* padding-top: 200px; */
}
.main-cate{
display: flex;
}
.menu-left {
width: 164rpx;
height: 100%;
box-sizing: border-box;
overflow: hidden;
/* padding-bottom: 80px; */
/* background: #f5f5f5; */
height: 100vh;
}
.menu-left .cate-list {
line-height: 40rpx;
text-align: center;
padding: 25rpx 0;
font-size: .8rem;
}
.menu-left .cate-list .on {
border-left: 3px solid #fa550f;
color: #fa550f;
font-size: 28rpx;
background: white;
padding: 25rpx 0rpx!important;
}
.cate-text{
display: block;
padding: 10rpx 0;
font-size: 28rpx;
}
.add-cart{
margin-top: 13rpx;
display: flex;
justify-content: flex-end;
}
.count-part{
margin-top: 13rpx;
display: flex;
justify-content: flex-end;
align-items: center;
}
.stepinput{
background: white!important;
margin: 0rpx 10rpx!important;
}
.stepplus{
background: #fa550f!important;
color: white!important;
font-weight: bolder!important;
border-radius: 30rpx!important;
}
.product-left input{
background-color:rgba(236,109,81,0.3)!important;
color: #fa550f!important;
}
.none-text{
width: 100%;
text-align: center;
font-size: 32rpx;
padding-top: 100px;
color: #bbbbbb;
}
.select{
color: red!important;
}
.menu-right {
/* height: 100vh; */
/* flex-grow: 1; */
background: white;
width: calc(100% - 165rpx);
/* position: fixed; */
/* padding-bottom: 200px; */
/* right: 0px; */
/* top: 198px; */
/* height: 100vh; */
}
.cate-product{
box-sizing: border-box;
padding-bottom: 82px;
padding-left: 20rpx;
padding-right: 20rpx;
width: 100%;
}
.right-list{
box-sizing: border-box;
padding: 30rpx 0rpx;
border-bottom: 1px solid #ebedf0;
}
.product-left{
box-sizing: border-box;
padding-left: 10rpx;
width: 100%;
}
.product-list{
box-sizing: border-box;
padding: 0rpx 18rpx;
display: flex;
}
.subtitle{
box-sizing: border-box;
padding: 0rpx 18rpx;
margin-bottom: 20rpx;
}
.product-name{
font-size: 30rpx;
}
.product-desc{
font-size: 24rpx;
color: #bbbbbb;
overflow: hidden;
-webkit-line-clamp: 2;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
}
.product-price{
display: flex;
color: #fa4126;
align-items: flex-end;
}
.real-icon{
font-size: 24rpx;
}
.real-num{
font-size: 32rpx;
font-weight: bolder;
}
.product-list image {
flex-shrink: 0;
width: 140rpx;
height: 140rpx;
border-radius: 16rpx;
margin-bottom: 10rpx;
}
.none-text image{
display: block;
margin-left: auto;
margin-right: auto;
width: 88px;
height: 97px;
}
.none-text{
padding-top: 260rpx;
}
.none-text view{
margin-top: 30rpx;
font-size: 30rpx;
color: #a5a5a5;
text-align: center;
}
.sub-button{
position: fixed;
width: 100%;
bottom: 8rpx;
background: salmon;
z-index: 999;
height: 200rpx;
padding: 10rpx 0rpx;
}
.sub-flex{
position: relative;
margin: auto;
height: 50px;
width: 100%;
background: white;
}
.end-sub{
width: 80%;
position: relative;
margin: auto;
background: red;
display: flex;
justify-content: space-around;
height: 50px;
line-height: 50px;
border-radius: 45px;
}
/* 弹出的部分 */
.eject-product{
margin-top: 20rpx;
width: 100%;
padding-bottom: 100rpx;
}
.ejectselected-list{
display: flex;
box-sizing: border-box;
padding: 20rpx;
border-bottom:1px solid #f1f4f8;
}
.ejectselected-list image{
display: block;
width: 60px;
height: 60px;
border-radius: 4px;
flex-shrink: 0;
}
.ejectselected-left{
box-sizing: border-box;
padding-left: 20rpx;
width: 100%;
}
.ejectselected-name{
font-size: 30rpx;
}
.ejectselected-part{
margin-top: 13rpx;
display: flex;
justify-content: flex-end;
align-items: flex-end;
}
.button-part{
position: relative;
margin: auto;
width: 80%;
height: 52px;
border-radius: 48rpx;
display: flex;
justify-content: space-between;
}
.button-left{
width: 50%;
height: 52px;
background: #ff8200;
border-top-left-radius: 48rpx;
border-bottom-left-radius: 48rpx;
display: flex;
}
.icon-buy{
text-align: center;
color: white;
margin-left: 45rpx;
}
.button-right{
font-size: 28rpx;
width: 50%;
height: 52px;
line-height: 52px;
background: #fa550f;
color: white;
border-top-right-radius: 48rpx;
border-bottom-right-radius: 48rpx;
text-align: center;
}
.business-top button{
background: none!important;
outline: none!important;
border: none !important;
}
.business-top button::after{
background: none!important;
outline: none!important;
border: none !important;
}
.action-box{
bottom: 30px!important;
padding-bottom: 6px!important;
}
.pop-button{
z-index: 999;
width: 100%;
position: fixed;
bottom: 0rpx;
background: white;
height: 30px;
}
.support-text{
text-align: center;
font-size: 28rpx;
padding: 8rpx 0rpx ;
color: #bbbbbb;
}
/* 头部 */
.custom{
/* position: fixed; */
width: 100%;
/* top: 0;
left: 0; */
height: 45px;
/* background: #c00; */
z-index: 9999;
background: #fa550f;
display: flex;
align-items: center;
justify-content: space-between;
}
.title-left{
margin-left: 18rpx;
display: flex;
align-items: center;
}
.avatar-title{
color: white;
margin-left: 20rpx;
}
