web-africa-h5/pages/product/list.vue

2101 lines
51 KiB
Vue
Raw Normal View History

2025-03-21 14:49:01 +08:00
<template>
<view style="height: 100vh" class="o-h">
<!-- <view v-if="cid == 21" class="form-top-nav d-b-c">
<view class="form-top-nav-item" :class="{ active: qdtype == 1 }" @click="changeRegistType(0)">云仓
</view>
<view class="form-top-nav-item" :class="{ active: qdtype == 17 }" @click="changeRegistType(17)">精选
</view>
</view> -->
<template v-if="cid == -1">
<image crossorigin="anonymous" data-etype="image" :data-enode="haifx" class="share-bg Poster1" :src="haifx"
mode=""></image>
<view class="Poster1 share-text d-c-c f30 mb20 pr gray3" style="z-index: 2">
<view class="Poster1" :data-enode="userinfo.memberCode || ''">{{
userinfo.memberCode || ""
}}</view>
</view>
<image crossorigin="anonymous" data-etype="image" :data-enode="qrcode" class="share-codeimg Poster1"
:src="qrcode" mode=""></image>
<image class="btnShare" src="/static/bg/btnShare.png" @click="downImage('Poster1')" mode=""></image>
<!-- <button class="domation-sharebtn" @click="startDownload(qrcode)">保存</button> -->
</template>
<!-- 新海粉分享 -->
<template v-if="cid == 7 && showPop">
<image @click="showPop = false" style="
width: 60rpx;
height: 60rpx;
position: absolute;
left: 40rpx;
top: 60rpx;
z-index: 120;
" src="/static/icon/back.png" mode=""></image>
<image crossorigin="anonymous" data-etype="image" :data-enode="haifxnews" class="share-bg Poster2"
:src="haifxnews" mode=""></image>
<view class="Poster2 share-text d-c-c f30 mb20 pr gray3" style="z-index: 2">
<view class="Poster2" :data-enode="userinfo.memberCode || ''">{{
userinfo.memberCode || ""
}}</view>
</view>
<image crossorigin="anonymous" data-etype="image" :data-enode="qrcode" class="share-codeimg Poster2"
:src="qrcode" mode=""></image>
<image class="btnShare Poster3" src="/static/bg/btnShare.png" @click="downImage('Poster2')" mode=""></image>
<!-- <button class="domation-sharebtn" @click="startDownload(qrcode)">保存</button> -->
</template>
<!-- <view class="share-pop" v-if="showPop">
<view class="d-e-c mb10" @click="showPop = false"><u-icon name="close" size="32rpx" bold color="#999"></u-icon></view>
<view class="d-c-c f30 fb gray3">{{ $t('w_0009') }}</view>
<view class="share-box">
<image crossorigin="anonymous" data-etype="image" data-enode="/static/bg/share-code.png" class="share-code Poster2" src="/static/bg/share-code.png"></image>
<image crossorigin="anonymous" data-etype="image" :data-enode="qrcode" class="share-image Poster2" :src="qrcode"></image>
</view>
<view class="d-c-c">
<button class="domation-btn" @click="downImage('Poster2')">{{ $t('PER_DA_12') }}</button>
</view>
</view> -->
<template v-else>
<view class="zone">
<view class="pop-tips" v-if="isMaxGrade && cid == 201">
<u-icon name="info-circle-fill" color="#fff" size="32rpx" style="margin-right: 10rpx"></u-icon>
{{ $t("fn_013") }}
<text class="tips-num">{{ formatNum(nextText) }}PV</text>
{{ $t("MN_F_T_953") }}
</view>
<view class="pop-tips" v-if="!isMaxGrade && cid == 201">{{
$t("fn_058")
}}</view>
<view class="pop-tips" v-if="cid == 30">
{{ $t("fn_012") }}:{{ currencyIcon() }}
<text class="tips-num">{{ formatNum(resaleIncomeBonus) }}</text>
</view>
<view class="d-b-s">
<view class="category-left">
<template v-if="cid == 21">
<view v-for="(item, index) in category1" :key="index" class="hf-leftmenu">
<view class="category-left-item" @click="changeCategory1(item.pkId)"
:class="{ active: category1_id == item.pkId }">
<text>{{ item.title }}</text>
</view>
<template v-if="category1_id == item.pkId">
<view class="left-item-child" @click="changeCategory2(0)"
:class="{ active: category2_id == 0 }">
<text>{{ $t("ENU_GIFT_T_1") }}</text>
</view>
<view @click="changeCategory2(sitem.pkId)" v-for="(sitem, sindex) in category2"
:key="sindex" class="left-item-child"
:class="{ active: category2_id == sitem.pkId }">
<text>{{ sitem.title }}</text>
</view>
</template>
</view>
</template>
<template v-else>
<view class="category-left-item" @click="changeCategory1(0)"
:class="{ active: category1_id == 0 }">{{ $t("ENU_GIFT_T_1") }}</view>
<view class="category-left-item" @click="changeCategory1(item.pkId)"
:class="{ active: category1_id == item.pkId }" v-for="(item, index) in category1"
:key="index">
<text>{{ item.classifyName }}</text>
</view>
</template>
</view>
<view class="right-box">
<template v-if="cid == 21">
<view class="category-right-top21">
<view class="category-right-top hftop">
<view class="flex-1 lefttopbox">
<view class="category-right-top-item" @click="changeCategory3(0)"
:class="{ active: category3_id == 0 }">{{ $t("ENU_GIFT_T_1") }}</view>
<view class="category-right-top-item" @click="changeCategory3(item.pkId)"
:class="{ active: item.pkId == category3_id }"
v-for="(item, index) in category3" :key="index">
{{ item.title }}
</view>
</view>
<view @click="openTop" class="open-top-btn mr20"><u-icon name="arrow-down"
size="26rpx" bold color="#333"></u-icon></view>
</view>
<view class="d-b-c border-t p-20-0">
<view class="f24 gray6 flex-1 tc" @click="changeType(1)"
:class="{ activeColor: activeType == 1 }">{{ $t("w_0326") }}</view>
<view class="f24 gray6 d-c-c flex-1 tc" @click="changeType(2)">
<text class="mr10"
:class="{ activeColor: activeType == 2 }">{{ $t("w_0149") }}</text>
<u-icon :name="
priceSorting == 1 ? 'arrow-down-fill' : 'arrow-up-fill'
" size="22rpx" :color="activeType == 2 ? '#E03030' : '#999999'"></u-icon>
</view>
<view class="f24 gray6 d-c-c flex-1 tc" @click="changeType(3)"
:class="{ activeColor: activeType == 3 }">
<text class="mr10">{{ $t("CK_KS_102") }}</text>
<u-icon :name="
salesSorting == 1 ? 'arrow-down-fill' : 'arrow-up-fill'
" size="22rpx" :color="activeType == 3 ? '#E03030' : '#999999'"></u-icon>
</view>
<view @click="isRight = true" class="icon iconfont icon-shaixuan p-0-20"
style="color: #fff; font-size: 32rpx"></view>
</view>
</view>
</template>
<template v-else>
<view class="d-b-c">
<view class="category-right-top flex-1">
<view class="category-right-top-item" @click="changeCategory2(0)"
:class="{ active: category2_id == 0 }">{{ $t("ENU_GIFT_T_1") }}</view>
<view class="category-right-top-item" @click="changeCategory2(item.pkId)"
:class="{ active: item.pkId == category2_id }"
v-for="(item, index) in category2" :key="index">
{{ item.classifyName }}
</view>
</view>
<view class="d-c-c pr20" v-if="cid == 101 || cid == 102 || cid == 201 || cid == 202"
@click.stop="openCPop('pkCountry')">
<image class="queryimg mr10" mode="heightFix" :src="
pkCountryIndex >= 0 && countryList[pkCountryIndex]
? countryList[pkCountryIndex].nationalFlag2
: ''
">
</image>
<u-icon name="arrow-down" size="28rpx" color="#999"></u-icon>
</view>
</view>
</template>
<scroll-view scroll-y="true" class="scroll-Y scroll-3"
:style="'height:' + scrollviewHigh + 'px;'" lower-threshold="50"
@scrolltolower="scrolltolowerFunc">
<view class="product-list">
<view class="product-item" v-for="(item, index) in listData" :key="index" @click.stop="
gotoPage(
'/pages/product/detail?pkCountry=' +
pkCountry +
'&cid=' +
cid +
'&' +
(cid != 21
? 'waresCode=' + item.waresCode
: 'pkId=' + item.pkId)
)
">
<view class="pr">
<!-- <view class="pop-stock-null">已售罄</view> -->
<image class="product-img" :src="item.cover1" mode=""></image>
</view>
<view class="product-info">
<view class="ww100">
<view class="f24 gray3 line-h-15 text-ellipsis mb10">{{ item.waresName }}
</view>
<view class="f22 gray9 line-h-15"
v-if="cid != 10 && cid != 13 && cid != 30">
{{ $t("ENU_TOTAL_V_1") }}{{
formatNum(item.waresAchieve)
}}
</view>
<view class="f22 gray9 line-h-15" v-if="cid == 10">
{{ $t("w_0118") }}{{ formatNum(item.deductMoney) }}
</view>
<view class="f22 gray9 line-h-15" v-if="cid == 13">
{{ $t("BV") }}{{ formatNum(item.assAchieve) }}
</view>
<!-- <view class="f22 gray9 line-h-15">
{{ $t('fn_105') }}{{item.inventoryNum*1>999?'999+':item.inventoryNum*1}}
</view> -->
</view>
<view class="ww100 d-b-c">
<view class="price-color f24 fb">
<view class="prices" v-if="
(cid == 101 ||
cid == 102 ||
cid == 201 ||
cid == 202) &&
userinfo.pkSettleCountry != pkCountry
">
{{ item.borderUnit }}{{ formatNum(item.borderPrice) }}
<text>({{ currencyIcon()
}}{{ formatNum(item.waresPrice) }})</text>
</view>
<view v-else>
{{ currencyIcon() }}
<text class="f30">{{
formatNum(item.waresPrice)
}}</text>
</view>
</view>
<image @click.stop="addProduct(item)" class="icon iconfont icon-cart"
src="/static/icon/cart-icon.png" mode=""></image>
<!-- <image class="icon iconfont icon-cart" src="/static/icon/share-icon.png" mode=""></image> -->
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</view>
<view class="pop-icons">
<image @click="getCode" v-if="cid == 7" class="pop-icon" src="/static/icon/product/pop-share.png"
mode=""></image>
<!-- <image class="pop-icon" src="/static/icon/product/pop-service.png" mode=""></image> -->
<view class="pop-icon" v-if="!showPop">
<image @click="getShopping" src="/static/icon/product/pop-cart.png" mode=""></image>
<view v-if="sCount > 0" class="scount-pop">{{ sCount }}</view>
</view>
</view>
<template v-if="showCart">
<view class="pop-cart">
<view class="d-e-c" style="padding: 0 24rpx"><u-icon name="close" size="32rpx" color="#999"
@click="showCart = false"></u-icon></view>
<view class="f32 gray3 d-c-c">{{ $t("N_I_194") }}</view>
<view class="cart-list">
<view class="cart-item" v-for="(item, index) in cartData" :key="index">
<view class="radio-check checked d-c-c"><u-icon name="checkbox-mark" color="#fff"
size="26rpx"></u-icon></view>
<view class="order-product">
<view class="product-item">
<view class="d-b-s mb20">
<image class="product-img" :src="item.cover1" mode=""></image>
<view class="product-info d-c d-b-s flex-1">
<view class="text-ellipsis-2 f28 gray3">{{
item.waresName
}}</view>
<view class="price-color f24">
<view v-if="
(cid == 101 ||
cid == 102 ||
cid == 201 ||
cid == 202) &&
userinfo.pkSettleCountry != pkCountry
">
{{
item.productParams[0].waresItemsParamsList[0]
.borderUnit
}}
<text class="f32 fb">{{
formatNum(
item.productParams[0].waresItemsParamsList[0]
.borderPrice
)
}}</text>
({{ currencyIcon() }}
<text class="f32 fb">{{
formatNum(item.waresPrice)
}}</text>)
</view>
<view v-else>
{{ currencyIcon() }}
<text class="f32 fb">{{
formatNum(item.waresPrice)
}}</text>
</view>
</view>
</view>
</view>
<view class="secend-product">
<template v-if="cid != 21">
<view class="d-b-s mb20" v-for="(pitem, pindex) in item.productParams"
:key="pindex">
<view class="d-s-c">
<image :src="pitem.waresItemsParamsList[0].specCover" mode=""
class="s-product-img"></image>
<view class="f28">
{{ pitem.productName }}
<text class="ml20">{{
pitem.waresItemsParamsList[0].specsName
}}</text>
</view>
</view>
<view class="f24 gray9 ml20">
X{{ pitem.waresItemsParamsList[0].quantity }}
</view>
</view>
</template>
<template v-else>
<view class="d-b-s mb20" v-for="(pitem, pindex) in item.waresSkuList"
:key="pindex">
<view class="d-s-c">
<view class="f28">{{ pitem.specValueNames }}</view>
</view>
</view>
</template>
</view>
<view class="d-b-c mt20">
<view class="counter-box">
<view class="d-c-c counter-add"
@click="plusReduceShopping(item, 'reduce')">
<u-icon name="minus" size="26rpx" color="#666"></u-icon>
</view>
<view class="counter-num">{{ item.number }}</view>
<view class="d-c-c counter-add"
@click="plusReduceShopping(item, 'add')">
<u-icon name="plus" size="26rpx" color="#666"></u-icon>
</view>
</view>
<u-icon @click="deleteCart(item)" width="34rpx" height="36rpx"
name="/static/icon/product/cart-delete.png"></u-icon>
</view>
</view>
</view>
</view>
</view>
</view>
<!--底部按钮-->
<view class="bottom-btns d-e-c f28">
<view class="total d-s-c flex-1 mr20">
<view class="cart-img">
<image src="/static/icon/cart-cart.png" mode=""></image>
<!-- <view class="cart-num">10</view> -->
</view>
<view>
<view class="price f32">
<view v-if="
(cid == 101 || cid == 102 || cid == 201 || cid == 202) &&
userinfo.pkSettleCountry != pkCountry
">
{{ borderUnits
}}<text class="num f38 fb">{{
formatNum(cartMoney1)
}}</text>
({{ currencyIcon()
}}<text class="num f38 fb">{{ formatNum(cartMoney) }}</text>)
</view>
<view v-else>
{{ currencyIcon() }}
<text class="num f38 fb">{{ formatNum(cartMoney) }}</text>
</view>
</view>
<view class="f24 gray3" v-if="cid != 30">
{{ $t("ENU_TOTAL_V_1") }}:{{ formatNum(cartAchieve) }}
</view>
</view>
</view>
<button :disabled="payClock()" type="primary" class="buy-btn theme-btn" @click="toPay">
{{ $t("w_0312") }}
</button>
</view>
<view class="pop-bg" @click.stop="showCart = false"></view>
</template>
</view>
</template>
<u-popup :show="showTop" mode="top" @close="closeTop" round="25rpx">
<view class="zone" style="padding: 40rpx 20rpx">
<view class="f28 gray3">{{ getC2Name() }}</view>
<view class="category-right-top hftop h-at" style="padding-left: 0">
<view class="flex-1 lefttopbox fw">
<view class="category-right-top-item mt20" @click="changeCategory3(0)"
:class="{ active: category3_id == 0 }">{{ $t("ENU_GIFT_T_1") }}</view>
<view class="category-right-top-item mt20" @click="changeCategory3(item.pkId)"
:class="{ active: item.pkId == category3_id }" v-for="(item, index) in category3"
:key="index">
{{ item.title }}
</view>
</view>
</view>
</view>
</u-popup>
<!-- 筛选 -->
<u-popup :show="isRight" mode="right" @close="closeRight()">
<view class="pop-content rightpop" style="padding-top: 0">
<view class="pop-title d-b-c">
<view class="f28 gray3">{{ $t("MY_ORD_50") }}</view>
<view class="f28 domation" @click="isRight = false">{{
$t("N_I_241")
}}</view>
</view>
<view class="right-item-title">{{ $t("w_0078") }}</view>
<view style="padding: 0 24rpx">
<view class="search-box">
<u-icon name="search" size="36rpx" color="#999"></u-icon>
<input v-model="form.waresName" class="search-input" type="text" value=""
:placeholder="$t('w_0253')" />
</view>
</view>
<view class="right-item-title">{{ $t("w_0254") }}</view>
<view class="d-c-c" style="padding-left: 20rpx">
<view class="search-box"><input v-model="form.startPrice" class="search-input" type="text" value=""
:placeholder="$t('w_0255')" /></view>
<view style="
width: 30rpx;
height: 1rpx;
background-color: #333;
margin: 0 24rpx;
"></view>
<view class="search-box"><input v-model="form.endPrice" class="search-input" type="text" value=""
:placeholder="$t('w_0256')" /></view>
</view>
<view class="pop-btns">
<view class="pop-left-btn" @click="resetSubmit()">{{
$t("w_0257")
}}</view>
<view class="pop-right-btn" @click="searchSubmit()">{{
$t("w_0035")
}}</view>
</view>
</view>
</u-popup>
<view v-if="isQuery" @touchmove.stop.prevent="moveHandle">
<view class="pop-up-bg" @click="isQuery = false"></view>
<view class="pop-up">
<view class="d-e-c p20">
<view class="blue f28" @click="closeQuery">{{
$t("MY_ORD_57")
}}</view>
</view>
<picker-view :indicator-style="'height: 80px;'" @change="changeQuery" class="picker-view">
<picker-view-column>
<view class="item d-c d-c-c" v-for="(item, index) in countryList" :key="index">
<image style="height: 50px" mode="heightFix" :src="item.nationalFlag2"></image>
<view class="f28 gray9 mt10">{{ item.name }}</view>
</view>
</picker-view-column>
</picker-view>
</view>
</view>
<Store v-if="isStore" :isPop="isStore" @close="closeStore"></Store>
<Eposter width="750" height="1334" :list="list" backgroundColor="rgb(255, 255, 255)" @on-success="onSuccess"
@on-error="onErrorFunc" ref="Eposter"></Eposter>
</view>
</template>
<script>
import Eposter from "@/components/evils-el-poster/Poster.vue";
import haifxnews from "@/static/bg/haifxnews.jpg";
import haifx from "@/static/bg/haifx.jpg";
import Store from "./popup/store.vue";
export default {
components: {
Eposter,
Store,
},
data() {
return {
haifx,
haifxnews,
list: [],
showTop: false,
showCart: false,
cid: 0,
showPop: false,
/*手机高度*/
phoneHeight: 0,
/*可滚动视图区域高度*/
scrollviewHigh: 0,
category1: [],
category2: [],
category3: [],
category1_id: 0,
category2_id: 0,
category3_id: 0,
isAll2: true,
isAll3: true,
listData: [],
cartData: [],
addLock: false,
qrcode: "",
downImg: "",
sCount: 0,
qdtype: 1,
pageNum: 1,
total: 0,
no_more: false,
priceSorting: 1,
salesSorting: 1,
comprehensive: 0,
newProduct: 0,
menu_id1: 0,
menu_id2: 0,
menu_id3: 0,
loading: false,
activeType: 1,
isRight: false,
borderPrice: "",
borderUnits: "",
form: {
waresName: "",
startPrice: "",
endPrice: "",
},
userinfo: {},
countryList: [],
pkCountry: "",
pkCountry1: "",
pkCountryIndex: 0,
queryValue: 0,
isQuery: false,
posterImg: "",
isStore: false,
storeProduct: null,
isInit: true,
nextText: "",
resaleIncomeBonus: "",
isMaxGrade: 1,
};
},
computed: {
cartMoney: function() {
let self = this;
let price = 0;
self.cartData.forEach((item) => {
price += item.waresPrice * 1 * item.number;
});
return price.toFixed(2);
},
cartMoney1: function() {
let self = this;
let price1 = 0;
self.cartData.forEach((item) => {
item.productParams.forEach((etem) => {
price1 += etem.waresItemsParamsList[0].borderPrice * 1 * item.number;
});
});
return price1.toFixed(2);
},
cartAchieve: function() {
let self = this;
let achieve = 0;
self.cartData.forEach((item) => {
achieve += item.achieve * 1 * item.number;
});
return achieve;
},
},
onLoad(e) {
this.pkCountry1 = uni.getStorageSync("currencyIcon");
this.cid = e.cid;
let title = this.$t("ENU_TRADE_T_121");
switch (e.cid * 1) {
case -1:
title = this.$t("ENU_MENU_303");
break;
case 0:
title = this.$t("ENU_TRADE_T_121");
break;
case 1:
title = this.$t("ENU_MENU_311");
break;
case 2:
title = this.$t("ENU_MENU_321");
break;
case 3:
title = this.$t("ENU_TRADE_T_121");
break;
case 7:
title = this.$t("N_I_2");
break;
case 10:
title = this.$t("ENU_MENU_360");
break;
case 11:
title = this.$t("ENU_MENU_350");
break;
case 12:
title = this.$t("ENU_MENU_333");
break;
case 13:
title = this.$t("ENU_MENU_340");
break;
case 14:
title = this.$t("ENU_MENU_334");
break;
case 18:
title = this.$t("ENU_SPECIAL_A_18");
break;
case 19:
title = this.$t("ENU_SPECIAL_A_19");
break;
case 21:
title = this.$t("N_I_4");
break;
case 22:
title = this.$t("ENU_SPECIAL_A_22");
break;
case 23:
title = this.$t("ENU_SPECIAL_A_8");
break;
case 24:
// title = '乐学易考';
title = this.$t("ENU_MENU_312");
break;
case 25:
// title = '乐学易考';
title = this.$t("ENU_MENU_322");
break;
case 26:
// title = '乐学易考';
title = this.$t("ENU_MENU_335");
break;
case 27:
// title = '海粉升级';
title = this.$t("ENU_ORDER_T_27");
break;
case 101:
title = this.$t("fn_004");
break;
case 102:
title = this.$t("fn_005");
break;
case 201:
title = this.$t("fn_007");
break;
case 202:
title = this.$t("fn_008");
break;
case 30:
title = this.$t("fn_009");
break;
case 33:
title = this.$t("APP_ADD_27");
break;
}
uni.setNavigationBarTitle({
title: title,
});
},
onShow() {
if (this.cid == 201) {
this.getNextLevelPv();
}
if (this.cid == 30) {
this.getMemberAnnuity();
}
this.getShoppingCount();
this.borderUnits = uni.getStorageSync("borderUnit");
console.log(this.borderUnits, "borderUnits");
},
mounted() {
this.getInfo();
if (this.cid == -1) {
this.getCode();
} else {
this.getCategory1();
}
},
methods: {
getMemberAnnuity() {
let self = this;
2025-08-28 10:54:21 +08:00
self._get("member/api/member/get-member-annuity-time", {}, (res) => {
2025-03-21 14:49:01 +08:00
self.resaleIncomeBonus = res.data.resaleIncomeBonus;
});
},
getNextLevelPv() {
let self = this;
2025-08-28 10:54:21 +08:00
self._get("member/api/member/next-level-pv", {}, (res) => {
2025-03-21 14:49:01 +08:00
self.nextText = res.data.gradeValue;
self.isMaxGrade = res.data.isMaxGrade;
});
},
payClock() {
let self = this;
if (self.cartData && self.cartData.length > 0) {
return false;
} else {
return true;
}
},
closeStore(e) {
let self = this;
if (e) {
let params = {};
let product = self.storeProduct;
if (self.cid != 21) {
params = {
number: 1,
pkCountry: self.userinfo.pkCountry,
pkId: product.pkId,
productGroup: product.productGroup,
specialArea: self.cid * 1,
waresCode: product.waresCode,
pkCountry: self.pkCountry,
pkMakerSpace: e,
};
} else {
params = {
number: 1, //数量
pkId: product.pkId,
productGroup: product.productGroup,
source: 2,
//所属专区
specialArea: 21,
pkMakerSpace: e,
};
}
self._post("sale/api/shopping/addShopping", params, (res) => {
self.getShoppingCount();
uni.showToast({
title: self.$t("fn_056"),
icon: "none",
});
});
}
this.storeProduct = null;
this.isStore = false;
},
getCountry() {
let self = this;
self._get("system/api/country/list", {}, (res) => {
self.countryList = res.data;
self.pkCountryIndex = 0;
self.countryList.forEach((item, index) => {
if (item.pkId == self.pkCountry) {
self.pkCountryIndex = index;
}
});
});
},
openCPop() {
this.isQuery = true;
},
getInfo() {
let self = this;
self._get("member/api/member/get-info", {}, (res) => {
self.userinfo = res.data;
self.pkCountry = res.data.pkCountry;
self.getCountry();
});
},
resetSubmit: function() {
this.form.waresName = "";
this.form.startPrice = "";
this.form.endPrice = "";
this.searchSubmit();
},
searchSubmit: function() {
this.isRight = false;
/*获取数据*/
this.listData = [];
this.pageNum = 1;
this.getData();
},
closeRight() {
this.isRight = false;
},
changeType(e) {
if (this.loading) {
return;
}
this.loading = true;
if (e == 2 && this.activeType == e) {
if (this.priceSorting == 1) {
this.priceSorting = 2;
} else {
this.priceSorting = 1;
}
}
if (e == 3 && this.activeType == e) {
if (this.salesSorting == 1) {
this.salesSorting = 2;
} else {
this.salesSorting = 1;
}
}
this.activeType = e;
this.listData = [];
this.pageNum = 1;
this.getData();
},
getC2Name() {
let list = this.category2;
let id = this.category2_id;
let name = "";
if (id == 0) {
return this.$t("ENU_GIFT_T_1");
} else {
list.forEach((item, index) => {
if (item.pkId == id) {
name = item.title;
}
});
return name;
}
},
closeTop() {
this.showTop = false;
},
openTop() {
this.showTop = true;
},
scrolltolowerFunc() {
let self = this;
if (self.cid != 21) {
return;
}
if (self.pageNum * 50 < self.total) {
self.pageNum++;
self.getData();
}
self.no_more = true;
},
changeRegistType(e) {
this.qdtype = e;
},
getShoppingCount() {
let self = this;
self._get(
"sale/api/shopping/getShoppingCount", {
specialArea: self.cid,
pkCountry: self.pkCountry,
},
(res) => {
self.sCount = res.data.smallCount;
}
);
},
downImage(elClass) {
this.$refs.Eposter.createForElRect(elClass, false);
},
startDownload(img) {
let self = this;
let title = self.$t("S_C_63");
uni.showLoading({
title: title,
});
self.downImg = "";
let n = 0;
uni.downloadFile({
//获得的临时地址
url: img,
success: (res) => {
if (res.statusCode == 200) {
self.downImg = res.tempFilePath;
self.posterImg = res.tempFilePath;
uni.hideLoading();
self.downloadImg();
} else {
uni.hideLoading();
uni.showModal({
title: self.$t("w_0034"),
content: self.$t("MY_ORD_64"),
showCancel: false,
});
}
},
fail(err) {
console.log(err);
uni.hideLoading();
uni.showModal({
title: self.$t("w_0034"),
content: self.$t("MY_ORD_64"),
showCancel: false,
});
},
});
},
downloadImg() {
let self = this;
let n = 0;
uni.showLoading({
title: self.$t("w_0413"),
});
self.downImg = [this.posterImg];
self.downImg.forEach((item, index) => {
console.log(item);
// 图片保存到本地
uni.saveImageToPhotosAlbum({
filePath: item,
success(data) {
n++;
if (n == self.downImg.length) {
uni.showToast({
icon: "none",
title: self.$t("w_0311"),
duration: 2000,
});
uni.hideLoading();
}
},
fail(err) {
console.log(err);
if (err.errMsg === "saveImageToPhotosAlbum:fail auth deny") {
uni.showToast({
title: self.$t("w_0412"),
icon: "none",
duration: 1000,
});
setTimeout(() => {
uni.openSetting();
}, 1000);
}
uni.hideLoading();
uni.showModal({
title: self.$t("w_0414"),
});
return;
},
complete(res) {
console.log("complete");
},
});
});
},
getCode() {
let self = this;
let url = "member/api/share/fans-code";
if (self.cid == -1) {
url = "member/api/share/share-code-h5";
}
self._get(url, {}, (res) => {
if (self.cid == -1) {
self.qrcode = res.data.dataUrl;
} else {
self.qrcode = res.data;
}
self.showPop = true;
});
},
deleteCart(e) {
let self = this;
if (self.addLock) {
return;
}
self.addLock = true;
self._post(
"sale/api/shopping/batchDelShopping", {
deleteList: [{
shoppingId: e.shoppingId,
}, ],
},
(res) => {
uni.showToast({
title: self.$t("fn_056"),
icon: "none",
success() {
self.getShopping();
},
});
},
false,
() => {
self.addLock = false;
}
);
},
plusReduceShopping(e, type) {
let self = this;
if (self.addLock) {
return;
}
self.addLock = true;
let num = e.number;
if (type == "add") {
num++;
}
if (type == "reduce") {
num--;
if (num <= 0) {
num = 1;
}
}
self._post(
"sale/api/shopping/plusReduceShopping", {
number: num,
shoppingId: e.shoppingId,
specialArea: self.cid,
},
(res) => {
uni.showToast({
title: self.$t("fn_056"),
icon: "none",
success() {
self.getShopping();
},
});
},
false,
() => {
self.addLock = false;
}
);
},
addProduct(e) {
let self = this;
let params = {};
if (e.isMakerGift == 2) {
this.storeProduct = e;
this.isStore = true;
return;
}
if (self.cid != 21) {
params = {
number: 1,
pkCountry: self.userinfo.pkCountry,
pkId: e.pkId,
productGroup: e.productGroup,
specialArea: self.cid * 1,
waresCode: e.waresCode,
pkCountry: self.pkCountry,
};
} else {
params = {
number: 1, //数量
pkId: e.pkId,
productGroup: e.productGroup,
source: 2,
specialArea: 21, //所属专区
};
}
self._post("sale/api/shopping/addShopping", params, (res) => {
self.getShoppingCount();
uni.showToast({
title: self.$t("fn_056"),
icon: "none",
});
});
},
getShopping() {
let self = this;
self._get(
"sale/api/shopping/getShopping", {
specialArea: self.cid,
pkCountry: self.pkCountry,
},
(res) => {
if (res.data != "") {
self.cartData = res.data[0].shoppingCartList;
} else {
self.cartData = [];
}
self.showCart = true;
}
);
self.getShoppingCount();
},
getCategory3() {
let self = this;
if (self.cid == 21) {
let ids = [];
console.log("---");
console.log(self.menu_id2);
console.log(self.category2);
if (self.menu_id2 == 0) {
self.category2.forEach((item) => {
ids.push(item.pkId);
});
} else {
ids = [self.menu_id2];
}
console.log(ids);
self._post(
"sale/api/twares-category-category/option-list", {
parentIds: ids,
},
(res) => {
self.category3 = res.data;
// self.category3_id = self.category3[0] ? self.category3[0].pkId : '';
self.menu_id3 = self.category3[0] ? self.category3[0].pkId : 0;
self.getData();
}
);
} else {
self._get(
"sale/api/area-classify/list", {
specialArea: self.cid,
pkParent: "",
hierarchy: 1,
pkCountry: self.pkCountry,
},
(res) => {
self.category2 = res.data;
self.getData();
}
);
}
},
getCategory2() {
let self = this;
console.log(2222);
if (self.cid == 21) {
self._post(
"sale/api/twares-category-category/option-list", {
parentIds: [self.menu_id1],
},
(res) => {
self.category2 = res.data;
// self.category2_id = self.category2[0] ? self.category2[0].pkId : '';
self.category2_id = 0;
self.menu_id2 = 0;
self.getCategory3();
}
);
} else {
self._get(
"sale/api/area-classify/list", {
specialArea: self.cid,
pkParent: "",
hierarchy: 1,
pkCountry: self.pkCountry,
},
(res) => {
self.category2 = res.data;
self.getData();
}
);
}
},
getCategory1() {
let self = this;
console.log(1111);
self.pageNum = 1;
if (self.cid == 21) {
self._post(
"sale/api/twares-category-category/option-list", {
parentIds: [0],
},
(res) => {
self.category1 = res.data;
self.category1_id = self.category1[0] ? self.category1[0].pkId : 0;
self.menu_id1 = self.category1[0] ? self.category1[0].pkId : 0;
self.getCategory2();
}
);
} else {
self._get(
"sale/api/area-classify/list", {
specialArea: self.cid,
hierarchy: 0,
pkCountry: self.pkCountry,
},
(res) => {
self.category1 = res.data;
self.getCategory2();
}
);
}
},
changeCategory1(id) {
if (this.loading) {
return;
}
this.loading = true;
this.menu_id1 = id;
this.menu_id2 = 0;
this.menu_id3 = 0;
this.category1_id = id;
this.category2_id = 0;
this.category3_id = 0;
this.listData = [];
this.pageNum = 1;
if (this.cid == 21) {
this.getCategory2();
} else {
this.getData();
}
},
changeCategory2(id) {
if (this.loading) {
return;
}
this.loading = true;
this.menu_id2 = id;
this.menu_id3 = 0;
this.category2_id = id;
this.category3_id = 0;
this.listData = [];
this.pageNum = 1;
if (this.cid == 21) {
this.getCategory3();
} else {
this.getData();
}
},
changeCategory3(id) {
if (this.loading) {
return;
}
this.loading = true;
this.menu_id3 = id;
this.category3_id = id;
this.listData = [];
this.pageNum = 1;
this.getData();
},
getData() {
let self = this;
let id = "";
if (self.cid == 21) {
if (self.category2_id) {
id = self.category2_id;
} else {
id = self.category1_id || 0;
}
self._get(
"sale/api/wares/sharing-zone-wares", {
pageNum: self.pageNum,
pkCategoryOne: self.category1_id || "",
pkCategoryTwo: self.category2_id || "",
pkCategoryThree: self.category3_id || "",
priceSorting: self.priceSorting,
salesSorting: self.salesSorting,
waresName: self.form.waresName,
startPrice: self.form.startPrice,
endPrice: self.form.endPrice,
pageSize: 50,
},
(res) => {
self.listData = [...self.listData, ...res.rows];
self.total = res.total;
if (self.total < self.pageNum * 50) {
self.no_more = true;
}
self.loading = false;
},
(err) => {
self.loading = false;
}
);
} else {
if (self.category2_id) {
id = self.category2_id;
} else {
id = self.category1_id || "";
}
self._post(
"sale/api/wares/query-spe-wares", {
pkAreaClassify: id,
specialArea: self.cid,
pkCountry: self.pkCountry,
},
(res) => {
self.loading = false;
self.listData = res.data;
uni.setStorageSync("borderUnit", self.listData[0].borderUnit);
},
(err) => {
self.loading = false;
}
);
}
if (self.isInit) {
self.init();
}
},
/*初始化*/
init() {
let self = this;
uni.getSystemInfo({
success(res) {
self.phoneHeight = res.windowHeight;
// 计算组件的高度
let view = uni.createSelectorQuery().select(".category-right-top");
if (self.cid == 21) {
view = uni.createSelectorQuery().select(".category-right-top21");
}
view
.boundingClientRect((data) => {
let h = self.phoneHeight - data.height;
self.scrollviewHigh = h;
})
.exec();
self.isInit = false;
},
});
},
checkresorder(deleteList, callback) {
let self = this;
let params = {
specialArea: self.cid,
deleteList: deleteList,
};
callback();
// self._post("/sale/api/order/valid-enough-shop", params, (res) => {
// if (res.code != 500) {
// callback();
// }
// });
},
toPay() {
let self = this;
let arr = [];
self.cartData.forEach((item) => {
arr.push(item.shoppingId);
});
let callback = function() {
self.showCart = false;
uni.setStorageSync("cartinfo", arr);
let id = self.cid;
if (
self.cid == 101 ||
self.cid == 102 ||
self.cid == 201 ||
self.cid == 202
) {
id = self.cid + "&userCountry=" + self.pkCountry;
}
self.gotoPage("/pages/prefecture/confirm-order?specialArea=" + id);
};
if (self.cid == 101 || self.cid == 102 || self.cid == 2) {
let deleteList = [];
self.cartData.forEach((item) => {
deleteList.push({
shoppingId: item.shoppingId,
});
});
self.checkresorder(deleteList, callback);
return;
}
if (self.cid == 21) {
arr = [];
let arr2 = [];
self.cartData.forEach((item) => {
arr.push({
pkTWares: item.waresSkuList[0].pkTWares,
pkTWaresSku: item.waresSkuList[0].pkThWaresSku,
quantity: item.number,
source: 2,
shoppingId: item.shoppingId,
});
});
}
callback();
},
changeQuery(e) {
this.queryValue = e.detail.value[0];
},
closeQuery() {
this.pkCountryIndex = this.queryValue;
this.pkCountry = this.countryList[this.pkCountryIndex].pkId;
this.isQuery = false;
this.getCategory1();
},
moveHandle() {
return false;
},
saveImage(e) {},
onSuccess(val) {
this.posterImg = val;
this.downloadImg(this.posterImg);
},
onErrorFunc(err) {
console.log(`err`, err);
},
},
};
</script>
<style lang="scss">
.prices {
display: flex;
flex-direction: column !important;
}
.zone {
.category-left {
height: 100vh;
padding-bottom: 100rpx;
width: 198rpx;
background-color: #f2f2f2;
box-sizing: border-box;
overflow-y: auto;
flex-shrink: 0;
}
.hf-leftmenu {
.category-left-item {}
.category-left-item.active {
background: #ee252a;
color: #fff;
}
.category-left-item.active::after {
display: none;
}
.left-item-child {
background: #ffffff;
display: flex;
justify-content: center;
align-items: center;
padding: 15rpx 0;
text {
font-size: 24rpx;
colo: #666;
display: inline-block;
padding: 15rpx 26rpx;
border-radius: 200rpx;
background: #fff;
width: 142rpx;
box-sizing: border-box;
text-align: center;
}
}
.left-item-child.active {
text {
background: #ee252a;
color: #fff;
}
}
}
.category-left-item {
font-size: 26rpx;
color: #666;
width: 198rpx;
padding: 36rpx 25rpx;
box-sizing: border-box;
word-break: break-all;
line-height: 1.5;
text-align: center;
}
.category-left-item.active {
position: relative;
color: #fb3024;
}
.category-left-item.active::after {
content: "";
position: absolute;
left: 0;
top: 0;
bottom: 0;
z-index: 1;
margin: auto;
width: 6rpx;
height: 22rpx;
background: #fb3024;
}
.category-right-top {
height: 86rpx;
display: flex;
justify-content: flex-start;
align-items: center;
overflow-x: auto;
padding-left: 22rpx;
}
.category-right-top.hftop {
overflow-x: hidden;
}
.category-right-top.hftop.h-at {
height: auto;
overflow: hidden;
}
.category-right-top.hftop .lefttopbox {
display: flex;
justify-content: flex-start;
align-items: center;
overflow-x: auto;
}
.category-right-top.hftop .lefttopbox.fw {
flex-wrap: wrap;
}
.category-right-top-item {
flex-shrink: 0;
white-space: nowrap;
padding: 0 20rpx;
position: relative;
color: #666;
font-size: 26rpx;
line-height: 86rpx;
}
.category-right-top-item.active {
color: #fb3024;
}
.category-right-top-item.active::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 2rpx;
width: 40%;
height: 6rpx;
margin: auto;
background: #fb3024;
border-radius: 4rpx;
}
.lefttopbox .category-right-top-item {
padding: 0 20rpx;
height: 58rpx;
background: #f6f6f6;
color: #666;
font-size: 24rpx;
border-radius: 58rpx;
line-height: 1.5;
display: flex;
justify-content: center;
align-items: center;
margin-right: 14rpx;
}
.lefttopbox .category-right-top-item.active {
background: #fb3024;
color: #fff;
}
.lefttopbox .category-right-top-item.active::after {
display: none;
}
.right-box {
overflow: hidden;
background-color: #ffffff;
height: 100vh;
flex: 1;
.product-list {
width: 100%;
padding: 0 21rpx 100rpx 19rpx;
box-sizing: border-box;
.product-item {
width: 100%;
box-sizing: border-box;
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 20rpx 0 16rpx 0;
border-bottom: 1rpx solid #eee;
.product-img {
width: 152rpx;
height: 152rpx;
flex-shrink: 0;
margin-right: 20rpx;
border-radius: 10rpx;
}
.pop-stock-null {
width: 120rpx;
height: 120rpx;
background-color: rgba(0, 0, 0, 0.55);
text-align: center;
line-height: 1.5;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
z-index: 2;
border-radius: 50%;
}
.product-info {
flex: 1;
height: 152rpx;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-direction: column;
.icon-cart {
flex-shrink: 0;
width: 46rpx;
height: 46rpx;
border-radius: 50%;
box-shadow: 0rpx 3rpx 7rpx 0px rgba(0, 0, 0, 0.25);
}
}
}
}
}
}
.pop-bg {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.65);
z-index: 99;
}
.share-pop {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
margin: auto;
background-color: #fff;
width: 665rpx;
height: 704rpx;
background: #ffffff;
border-radius: 20rpx;
z-index: 100;
padding: 32rpx 20rpx 0 20rpx;
box-sizing: border-box;
}
.share-box {
width: 586rpx;
height: 522rpx;
position: relative;
margin: 0 auto;
margin-bottom: 68rpx;
margin-top: 30rpx;
}
.share-code {
width: 586rpx;
height: 522rpx;
z-index: 1;
}
.share-bg {
width: 100%;
height: 100%;
z-index: 1;
}
.share-image {
width: 180rpx;
height: 180rpx;
position: absolute;
left: 202rpx;
bottom: 44rpx;
z-index: 2;
}
.share-codeimg {
width: 320rpx;
height: 320rpx;
position: absolute;
left: 0;
right: 0;
margin: auto;
bottom: 35%;
z-index: 2;
}
.share-codeimg.Poster2 {
width: 280rpx;
height: 280rpx;
bottom: 220rpx;
}
.share-text.Poster2 {
font-size: 32rpx;
bottom: 170rpx;
}
.btnShare.Poster3 {
bottom: 40rpx;
}
.share-text {
// width: 320rpx;
// height: 320rpx;
position: absolute;
left: 0;
right: 0;
margin: 0 auto;
bottom: 29%;
z-index: 2;
font-size: 40rpx;
font-weight: bold;
}
.domation-btn {
width: 264rpx;
height: 76rpx;
border-radius: 38rpx;
display: flex;
justify-content: center;
align-items: center;
padding: 0 20rpx;
box-sizing: border-box;
word-break: break-all;
font-size: 30rpx;
line-height: 1;
overflow: hidden;
background: #fb3024;
color: #fff;
margin-right: 25rpx;
}
.btnShare {
width: 270rpx;
height: 89rpx;
position: absolute;
left: 0;
right: 0;
margin: auto;
bottom: 20%;
z-index: 1014;
}
@keyframes scale {
0% {
transform: scale(1);
}
50% {
transform: scale(1.2);
}
100% {
transform: scale(1);
}
}
/* 添加动画 */
.btnShare {
animation: scale 1s infinite;
}
.defaul-btn {
width: 264rpx;
height: 76rpx;
border-radius: 38rpx;
display: flex;
justify-content: center;
align-items: center;
padding: 0 20rpx;
box-sizing: border-box;
word-break: break-all;
font-size: 30rpx;
line-height: 1;
overflow: hidden;
background: #cccccc;
color: #fff;
}
.pop-icons {
position: fixed;
right: 10rpx;
bottom: 42rpx;
z-index: 90;
}
.pop-icon {
position: relative;
width: 110rpx;
height: 110rpx;
border-radius: 50%;
margin-top: 20rpx;
box-shadow: 0px 3rpx 7rpx 0px rgba(0, 0, 0, 0.45);
image {
width: 110rpx;
height: 110rpx;
border-radius: 50%;
}
}
.pop-cart {
position: fixed;
bottom: 96rpx;
left: 0;
width: 100%;
z-index: 101;
background-color: #fff;
padding: 0 0;
box-sizing: border-box;
padding-top: 20rpx;
border-radius: 25rpx 25rpx 0 0;
min-height: 200rpx;
}
.bottom-btns {
position: fixed;
width: 100%;
padding: 0 24rpx 0 27rpx;
box-sizing: border-box;
display: flex;
justify-content: space-between;
align-items: center;
height: 96rpx;
// /* bottom: calc(var(--window-bottom); */
bottom: 0;
left: 0;
box-shadow: 0 -2rpx 8rpx rgba(0, 0, 0, 0.1);
background: #ffffff;
z-index: 101;
}
.bottom-btns .buy-btn {
margin: 0;
padding: 0 24rpx;
height: 67rpx;
line-height: 67rpx;
border-radius: 38rpx;
// background: linear-gradient(90deg, #FF6B6B 4%, #F6220C 100%);
font-size: 28rpx;
flex-shrink: 0;
}
.bottom-btns .price {
color: $dominant-color;
}
.pop-bg {
position: fixed;
z-index: 99;
left: 0;
top: 0;
bottom: 0;
right: 0;
margin: auto;
background-color: rgba(0, 0, 0, 0.65);
}
.counter-box {
width: 168rpx;
height: 50rpx;
border-radius: 30rpx;
border: 1rpx solid #eeeeee;
display: flex;
justify-content: center;
align-items: center;
font-size: 26rpx;
color: #333;
margin-top: 26rpx;
}
.counter-num {
height: 50rpx;
min-width: 56rpx;
padding: 0 10rpx;
box-sizing: border-box;
border-left: 1rpx solid #eeeeee;
border-right: 1rpx solid #eeeeee;
line-height: 50rpx;
text-align: center;
}
.counter-add {
height: 50rpx;
width: 56rpx;
flex-shrink: 0;
font-size: 26rpx;
color: #666;
font-weight: bold;
}
.cart-list {
padding: 0 24rpx;
max-height: 60vh;
overflow-y: auto;
}
.cart-list::-webkit-scrollbar {
/*滚动条整体样式*/
/*高宽分别对应横竖滚动条的尺寸*/
display: block;
width: 5rpx !important;
height: 1rpx !important;
-webkit-appearance: default-button;
}
.cart-list::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
border-radius: 10px;
background-color: #909399;
// background-image: -webkit-linear-gradient(45deg,
// rgba(255, 255, 255, 0.2) 25%,
// transparent 25%,
// transparent 50%,
// rgba(255, 255, 255, 0.2) 50%,
// rgba(255, 255, 255, 0.2) 75%,
// transparent 75%,
// transparent);
}
.cart-list::-webkit-scrollbar-track {
/*滚动条里面轨道*/
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: #ededed;
border-radius: 10px;
}
.cart-img {
width: 50rpx;
height: 50rpx;
position: relative;
margin-right: 18rpx;
image {
width: 50rpx;
height: 50rpx;
}
}
.cart-num {
width: 28rpx;
height: 28rpx;
background: #fb3024;
box-shadow: 0px 3rpx 7rpx 0px rgba(0, 0, 0, 0.25);
border-radius: 50%;
font-size: 22rpx;
color: #ffffff;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: -10rpx;
right: -14rpx;
}
.scount-pop {
background: #fb3024;
color: #fff;
font-size: 22rpx;
width: 36rpx;
height: 36rpx;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
right: 0;
top: 0;
}
.form-top-nav {
height: 94rpx;
background: #fb3024;
}
.form-top-nav-item {
text-align: center;
font-size: 28rpx;
color: #fff;
line-height: 1.5;
word-break: break-all;
flex: 1;
padding: 0 20rpx;
flex-shrink: 0;
height: 94rpx;
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
.form-top-nav-item.active::before {
content: "";
width: 52rpx;
position: absolute;
left: 0;
right: 0;
bottom: 12rpx;
margin: auto;
height: 6rpx;
background: #ffffff;
border-radius: 4rpx;
}
.open-top-btn {
width: 58rpx;
height: 58rpx;
background: #f6f6f6;
border-radius: 29rpx;
display: flex;
justify-content: center;
align-items: center;
}
.activeColor {
color: #e03030;
}
.search-box {
flex: 1;
height: 65rpx;
background: #f5f6f8;
border-radius: 33rpx;
padding: 0 52rpx;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
.search-input {
font-size: 26rpx;
color: #333;
margin-left: 14rpx;
flex: 1;
}
}
.queryimg {
height: 40rpx;
2025-08-28 10:54:21 +08:00
width: 40rpx;
// flex-shrink: 0;
2025-03-21 14:49:01 +08:00
margin: 0 10rpx;
}
.pop-up-bg {
position: fixed;
background-color: rgba(0, 0, 0, 0.6);
left: 0;
top: 0;
width: 100%;
height: 100vh;
z-index: 99;
}
.pop-up {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 60vh;
background-color: #ffffff;
z-index: 100;
}
.picker-view {
width: 750rpx;
height: 600rpx;
margin-top: 20rpx;
}
.item {
width: 100%;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
height: 80px;
align-items: center;
justify-content: center;
text-align: center;
}
.icon.iconfont.icon-shaixuan {
background-color: #fb3024;
padding: 20rpx 40rpx;
color: #fff;
}
button[disabled][type="primary"] {
background-color: rgba(#fb3024, 0.6);
}
.pop-tips {
position: fixed;
bottom: 0;
width: 100%;
height: 84rpx;
display: flex;
justify-content: flex-start;
align-items: center;
padding: 0 25rpx;
line-height: 1.5;
background: #fb4633;
color: #fff;
font-size: 26rpx;
box-sizing: border-box;
z-index: 20;
}
</style>