1572 lines
35 KiB
Vue
1572 lines
35 KiB
Vue
|
<template>
|
||
|
|
<view class="">
|
||
|
|
<!-- <view class="cloud_entrepot" :style="{'min-height': winHeight + 'px'}">
|
||
|
|
<view class="head-wrapper"></view>
|
||
|
|
<view class="town-title">{{town}}里海云仓</view>
|
||
|
|
<view class="body-wrapper">
|
||
|
|
<block v-for="(item,index) in cloudList" :key="index">
|
||
|
|
<navigator class="item"
|
||
|
|
:url="`/pages/nongKe/goods_list/index?cate_id=${item.category_id}&street=${street_code}&name=${item.category_name}`"
|
||
|
|
:style="{'background-image': `url(${item.background})`}">
|
||
|
|
<text class="item-title">{{item.category_name}}云仓服务</text>
|
||
|
|
<text>{{item.description}}</text>
|
||
|
|
<view class="chakan-btn">查看</view>
|
||
|
|
</navigator>
|
||
|
|
</block>
|
||
|
|
</view>
|
||
|
|
</view> -->
|
||
|
|
|
||
|
|
<view class="">
|
||
|
|
<view class="">
|
||
|
|
<view v-if="showtit">
|
||
|
|
<view :class="{'head':true,'show':showtit}" style="padding-top: var(--status-bar-height);">
|
||
|
|
<view style="display: flex;align-items: center;">
|
||
|
|
<u--image :showLoading="true" v-if="cloudList.length>0" src="/static/images/LHYC/FH.png"
|
||
|
|
width="50.82rpx" height="50.82rpx" @click='goBack'></u--image>
|
||
|
|
<u--image v-else :showLoading="true" src="/static/images/LHYC/PFH.png" width="50.82rpx"
|
||
|
|
height="50.82rpx" @click='goBack'></u--image>
|
||
|
|
<view class="head_tit" :style="{color:cloudList.length>0?'':'black'}">
|
||
|
|
{{town}}里海云仓
|
||
|
|
</view>
|
||
|
|
<view class="sl" :class="{actsl:showSelect}" @click="showSelect=!showSelect">
|
||
|
|
<u--image :showLoading="true" src="/static/images/GXSC/BSL.png" width="33.29rpx"
|
||
|
|
height="33.29rpx"></u--image>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="" style="display: flex;align-items: center;">
|
||
|
|
<view style="display: flex;align-items: center;z-index: 999999;">
|
||
|
|
<u--image :showLoading="true" src="/static/images/LHYC/DWB.png" width="50.82rpx"
|
||
|
|
height="50.82rpx"></u--image>
|
||
|
|
<view class="town_name" :style="{color:cloudList.length>0?'':'black'}"
|
||
|
|
@click="showpick">{{street}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="head_r" @click="showPop=true">
|
||
|
|
<u--image v-if="cloudList.length>0" :showLoading="true" src="/static/images/LHYC/QB.png"
|
||
|
|
width="50.82rpx" height="50.82rpx"></u--image>
|
||
|
|
<u--image v-else :showLoading="true" src="/static/images/LHYC/QB.png" width="50.82rpx"
|
||
|
|
height="50.82rpx"></u--image>
|
||
|
|
<text :style="{color:cloudList.length>0?'':'black'}">全部</text>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="selected-list" :style="`top:${headtop}px`" :class="{actSel:showSelect}">
|
||
|
|
<div class="triangle-up"></div>
|
||
|
|
<view
|
||
|
|
@click="navgo(`/pages/nongKe/supply_chain/supplier?type_id=10&street_id=${street_code}&townName=${street}`)">
|
||
|
|
供销综合云市场 <text></text>
|
||
|
|
</view>
|
||
|
|
<view class="selected-li">
|
||
|
|
供销综合云商品 <text> <u--image style="margin-left: 40rpx;" :showLoading="true"
|
||
|
|
src="/static/images/GXSC/XZ.png" width="24.53rpx" height="24.53rpx"></u--image>
|
||
|
|
</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<!-- 滚动 -->
|
||
|
|
<view :class="{'heads':true,'show':!showtit}" style="padding-top: var(--status-bar-height);">
|
||
|
|
<view style="align-items: center;display: flex;justify-content: space-between;">
|
||
|
|
<view class="" style="display: flex;align-items: center;">
|
||
|
|
<view class="back" style="margin-right: 17rpx;">
|
||
|
|
<u--image :showLoading="true" src="/static/images/LHYC/FH.png" width="50.82rpx"
|
||
|
|
height="50.82rpx" @click='goBack'></u--image>
|
||
|
|
</view>
|
||
|
|
<view class="" style="font-size: 40rpx;transform: skewX(-10deg);">
|
||
|
|
供销综合云市场
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view style="position: relative;width: 289.14rpx;">
|
||
|
|
<u-search borderColor="#FF6D20" bgColor="white" :showAction="false" placeholder="请输入..."
|
||
|
|
v-model="keyword" class="serch_cls"></u-search>
|
||
|
|
<u--image class="img_cls" :showLoading="true" src="/static/images/GXSC/SSBT.png"
|
||
|
|
width="115.65rpx" height="56.82rpx" @click="serch"></u--image>
|
||
|
|
</view>
|
||
|
|
<view class='head_r' @click="showPop=true">
|
||
|
|
<u--image :showLoading="true" src="/static/images/LHYC/QB.png" width="50.82rpx"
|
||
|
|
height="50.82rpx"></u--image>
|
||
|
|
<text class="">全部</text>
|
||
|
|
<view class="flags">
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="box" v-if="cloudList.length>0">
|
||
|
|
<view :class="act_swiper">
|
||
|
|
<swiper :autoplay="false" :active-class="activeClass" :interval="3000" class="swipers"
|
||
|
|
:circular="true" previous-margin='0rpx' next-margin='0rpx' :current="current"
|
||
|
|
:disable-touch="true">
|
||
|
|
<swiper-item v-for="(item,index) in cloudList">
|
||
|
|
<u--image :showLoading="true" :src="item.cover" :class="act_img" width="750rpx"
|
||
|
|
height="998.83rpx"></u--image>
|
||
|
|
</swiper-item>
|
||
|
|
</swiper>
|
||
|
|
</view>
|
||
|
|
<view class="" style="height:998.83rpx;" v-if="act_swiper">
|
||
|
|
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
<view class="menu" v-if="showtit" style="transition: 1s;">
|
||
|
|
<swiper :autoplay="false" :active-class="activeClass" :interval="3000" class="swiper"
|
||
|
|
:circular="true" previous-margin='270rpx' next-margin='270rpx' :current="current"
|
||
|
|
@change="test">
|
||
|
|
<swiper-item v-for="(item,index) in cloudList" :key="index" @click="clickSwiperFn(index)">
|
||
|
|
<view class="swiper_item" :class="{swiper_item_act:index==current}">
|
||
|
|
<u--image :showLoading="true" :src="item.background" class="swiper_b"
|
||
|
|
width="175.23rpx" height="175.23rpx"></u--image>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</swiper-item>
|
||
|
|
</swiper>
|
||
|
|
</view>
|
||
|
|
<!-- 商品列表 -->
|
||
|
|
<view class="content">
|
||
|
|
<view class="content_sift" :style="{position:pocls,top:(headtop)+'px'}" v-if="!showtit">
|
||
|
|
<view :class="{act:item.act,price_sift:true}" v-for="item,index in actList" :key="index"
|
||
|
|
@click="screenGoods(item.screen,index)">
|
||
|
|
{{item.tit}}
|
||
|
|
<view class="" v-if="index==2" style="margin-left: 10rpx;">
|
||
|
|
<u-icon name="arrow-up" :color="item.price&&item.act?'#FF6D20':'black'"
|
||
|
|
size="10"></u-icon>
|
||
|
|
<u-icon name="arrow-down" :color="!item.price&&item.act?'#FF6D20':'black'"
|
||
|
|
size="10"></u-icon>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="goods_list" v-if="goodsList.length>0">
|
||
|
|
<view class="empty" v-if='showLoading'>
|
||
|
|
<u-loading-icon v-if='showLoading' text="加载中" textSize="18"></u-loading-icon>
|
||
|
|
</view>
|
||
|
|
<view class="goods" @click="goodDetail(item)" v-else v-for="item,index in goodsList">
|
||
|
|
<view class="left">
|
||
|
|
<u--image :showLoading="true" :src="item.image" width="192.76rpx"
|
||
|
|
height="192.76rpx"></u--image>
|
||
|
|
</view>
|
||
|
|
<view class="right">
|
||
|
|
<view class="tit">
|
||
|
|
<!-- 亿福馒头粉纯天然无添加小麦粉加工 1000g/袋 -->
|
||
|
|
{{item.store_info}}
|
||
|
|
</view>
|
||
|
|
<view class="">
|
||
|
|
<view class="good_score">
|
||
|
|
<text style="margin-right: 10rpx;color: #F84221;">{{item.rate}}</text>
|
||
|
|
<text>{{item.reply_count}}评论</text>
|
||
|
|
</view>
|
||
|
|
<view class="good_price">
|
||
|
|
<view class="good_price_l">
|
||
|
|
<view class=""
|
||
|
|
style="color: #F84221;font-size: 22.78rpx;font-weight: bold;">
|
||
|
|
￥<text style="font-size: 30rpx;">{{item.price}}</text>
|
||
|
|
</view>
|
||
|
|
<view class="old_price">
|
||
|
|
￥30.00
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="good_price_r">
|
||
|
|
<view :class="{x_tra:trnList[index].bottom }"
|
||
|
|
:style="`transform:translateY(${trnList[index].bottom}px);transition:${trnList[index].bottom?1:0}s cubic-bezier(0.4, -0.9, 0.75, 1);`"
|
||
|
|
@click.stop="addcart(item,index)">
|
||
|
|
<u--image :class="'act_class'+index"
|
||
|
|
:style="`transform:translateX(${trnList[index].left}px);transition:${trnList[index].bottom?1:0}s `"
|
||
|
|
src="/static/images/LHYC/J.png" width="49.07rpx"
|
||
|
|
height="49.07rpx"></u--image>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view style="height: 100rpx;">
|
||
|
|
<u-loadmore :status="status" />
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<!-- 空 -->
|
||
|
|
<view v-else>
|
||
|
|
<view class="empty">
|
||
|
|
<view class="info">
|
||
|
|
<u--image :showLoading="true" src="/static/images/noCart.png" width="400.09rpx"
|
||
|
|
height="400.09rpx"></u--image>
|
||
|
|
<view class="" style="text-align: center;color:#999">
|
||
|
|
暂无商品
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<!-- 购物车 -->
|
||
|
|
<view class="card" :style="`bottom:${appInfo.bottom}px`"
|
||
|
|
@click="navgo('/pages/order_addcart/order_addcart')">
|
||
|
|
<view class="left">
|
||
|
|
<view class="cart" :class="{act_cart:act_cart}"
|
||
|
|
style="position: relative;z-index: 9999999;">
|
||
|
|
<u--image :showLoading="true" src="/static/images/LHYC/GWC.png" width="63.09rpx"
|
||
|
|
height="63.09rpx"></u--image>
|
||
|
|
|
||
|
|
<view class="badge" v-show="goodsNum">
|
||
|
|
{{goodsNum}}
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="tot_price">
|
||
|
|
<view class="">
|
||
|
|
￥{{totalMoney}}
|
||
|
|
</view>
|
||
|
|
<view class="">
|
||
|
|
支持配送 售后无忧
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="right">
|
||
|
|
去结算
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<!-- 组件 -->
|
||
|
|
<view class="" v-if="showPop">
|
||
|
|
<u-popup mode="right" :show="showPop" @close="showPop=false" @open="showPop=true">
|
||
|
|
<view class="pop">
|
||
|
|
<view style="height: var(--status-bar-height);"></view>
|
||
|
|
<view class="pop_head" style="display: flex;">
|
||
|
|
<u--image :showLoading="true" src="/static/images/LHYC/PFH.png" width="50.82rpx"
|
||
|
|
height="50.82rpx" @click='showPop=false'></u--image>
|
||
|
|
<view class="head_tit">
|
||
|
|
里海云仓
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="pop_content" v-if="cloudList.length">
|
||
|
|
<view class="pop_li" @click="all(index)" v-for="item,index in cloudList" :key="index">
|
||
|
|
<u--image :showLoading="true" :src="item.background" width="84.11rpx"
|
||
|
|
height="84.11rpx"></u--image>
|
||
|
|
<view class="" style="margin-left: 20rpx;">
|
||
|
|
<view style="font-size: 33.29rpx;color: black;">
|
||
|
|
{{item.category_name}}云仓服务
|
||
|
|
</view>
|
||
|
|
<view class="" style="font-size: 22.78rpx;">
|
||
|
|
{{item.description}}
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
<view v-else>
|
||
|
|
<!-- <u--image :showLoading="true" src="/static/images/LHYC/PFH.png" width="50.82rpx" height="50.82rpx"
|
||
|
|
@click='goBack'></u--image>
|
||
|
|
</view> -->
|
||
|
|
<view class="yuncangempty">
|
||
|
|
|
||
|
|
<u--image :showLoading="true" src="/static/images/noCart.png" width="400.09rpx"
|
||
|
|
height="400.09rpx"></u--image>
|
||
|
|
<view class="" style="text-align: center;color:#999">
|
||
|
|
当前区域暂无云仓
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</u-popup>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
<view class="empty" style="" v-if="cloudList.length<=0">
|
||
|
|
<view style="height: var(--status-bar-height);"></view>
|
||
|
|
<view style="padding: 10rpx;">
|
||
|
|
|
||
|
|
<view class="info">
|
||
|
|
<u--image :showLoading="true" src="/static/images/noCart.png" width="400.09rpx"
|
||
|
|
height="400.09rpx"></u--image>
|
||
|
|
<view class="" style="text-align: center;color:#999">
|
||
|
|
当前区域暂无云仓
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<!-- 多规格购物车 -->
|
||
|
|
|
||
|
|
|
||
|
|
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse">
|
||
|
|
</authorize>
|
||
|
|
<view class="" :style="`height:${appInfo.bottom}px;background-color:white`">
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="">
|
||
|
|
<u-picker :defaultIndex="defaInd" :show="showPicker" ref="uPicker" :columns="columnData" @confirm="confirm"
|
||
|
|
@cancel="showPicker = false" @change="changeHandler" keyName="name"></u-picker>
|
||
|
|
</view>
|
||
|
|
<view class="" v-if="showcartpop">
|
||
|
|
<u-popup :show="showcartpop" @close="closecartpop" @open="opencartpop">
|
||
|
|
<view class="sku">
|
||
|
|
<view class="sku_head">
|
||
|
|
<view class="sku_head_l">
|
||
|
|
<u--image :showLoading="true" :src="skuform.image" width="200.09rpx"
|
||
|
|
height="200.09rpx"></u--image>
|
||
|
|
</view>
|
||
|
|
<view class="sku_head_r">
|
||
|
|
<view class="sku_goods_tit">
|
||
|
|
{{skuform.store_info}}
|
||
|
|
</view>
|
||
|
|
<view class="">
|
||
|
|
<view class="sku_goods_price">
|
||
|
|
￥ {{skuform.price}}
|
||
|
|
</view>
|
||
|
|
<view class="sku_goods_num" v-if="this.skusize">
|
||
|
|
库存:{{skuform.sku[this.skusize].stock}}
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="sku_size">
|
||
|
|
<view class="" style="margin-bottom: 10rpx;">
|
||
|
|
尺码
|
||
|
|
</view>
|
||
|
|
<view class="">
|
||
|
|
<text class="size_li" :class="{act_size_li:item.sku==skusize}"
|
||
|
|
v-for="(item,index) in skuform.sku" @click="skusizechange(item.sku)">{{item.sku}}</text>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="sku_num">
|
||
|
|
<view class="">
|
||
|
|
数量
|
||
|
|
</view>
|
||
|
|
<view class="">
|
||
|
|
<u-number-box v-model="skuNumber" @change="valChange"></u-number-box>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="skuaddcart" @click="skuaddcart">
|
||
|
|
确定
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</u-popup>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import {
|
||
|
|
cloudWarehouse,
|
||
|
|
getCityCloundShop
|
||
|
|
} from '@/api/requesta.js'
|
||
|
|
import {
|
||
|
|
Toast
|
||
|
|
} from '@/libs/uniApi';
|
||
|
|
import {
|
||
|
|
initiateAssistApi
|
||
|
|
} from '@/api/activity.js';
|
||
|
|
import {
|
||
|
|
getCartCounts,
|
||
|
|
getCartList,
|
||
|
|
|
||
|
|
} from '@/api/requesta.js';
|
||
|
|
import {
|
||
|
|
goShopDetail
|
||
|
|
} from '@/libs/order.js'
|
||
|
|
// 7200 = 8 = 80000 8616
|
||
|
|
import {
|
||
|
|
postCartAdd,
|
||
|
|
} from '@/api/store.js';
|
||
|
|
import authorize from '@/components/Authorize';
|
||
|
|
|
||
|
|
import {
|
||
|
|
getArea,
|
||
|
|
getStreet
|
||
|
|
} from '@/api/article.js';
|
||
|
|
import {
|
||
|
|
getIndexData,
|
||
|
|
getDiy
|
||
|
|
} from '@/api/api.js'
|
||
|
|
import {
|
||
|
|
getGeocoder
|
||
|
|
} from '@/api/store.js';
|
||
|
|
import {
|
||
|
|
mapGetters
|
||
|
|
} from 'vuex'
|
||
|
|
import Cache from '@/utils/cache';
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
authorize,
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
let src = 'https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/13';
|
||
|
|
return {
|
||
|
|
skuform: {},
|
||
|
|
defaInd: [0, 0],
|
||
|
|
showPicker: false,
|
||
|
|
columnData: [],
|
||
|
|
skusize: 0,
|
||
|
|
skuNumber: 1,
|
||
|
|
showcartpop: false,
|
||
|
|
trnList: [],
|
||
|
|
act_cart: false,
|
||
|
|
appInfo: {},
|
||
|
|
pocls: "",
|
||
|
|
type: "",
|
||
|
|
act_swiper: "",
|
||
|
|
current: 3,
|
||
|
|
goodsNum: 0,
|
||
|
|
goodsList: [],
|
||
|
|
isEmpty: false,
|
||
|
|
winHeight: 0,
|
||
|
|
cloudList: [],
|
||
|
|
street: '',
|
||
|
|
street_code: '',
|
||
|
|
totalMoney: 0,
|
||
|
|
town: '',
|
||
|
|
list: [1, 1, 1, 1, 1],
|
||
|
|
showSelect: false,
|
||
|
|
showPop: false,
|
||
|
|
keyword: "",
|
||
|
|
showLoading: false,
|
||
|
|
tot_price: 1,
|
||
|
|
showtit: true,
|
||
|
|
cartList: [],
|
||
|
|
activeClass: 'activeClass',
|
||
|
|
headtop: 0,
|
||
|
|
page_num: 1,
|
||
|
|
act_img: "",
|
||
|
|
cartTagInfo: {},
|
||
|
|
isAuto: false,
|
||
|
|
actList: [{
|
||
|
|
tit: '综合',
|
||
|
|
act: "",
|
||
|
|
screen: ""
|
||
|
|
}, {
|
||
|
|
tit: '销量',
|
||
|
|
act: "",
|
||
|
|
screen: "sales"
|
||
|
|
}, {
|
||
|
|
tit: '价格',
|
||
|
|
act: "",
|
||
|
|
screen: "price_asc",
|
||
|
|
price: true,
|
||
|
|
}],
|
||
|
|
status: "loadmore",
|
||
|
|
flag: false,
|
||
|
|
isShowAuth: false, //是否隐藏授权
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
...mapGetters(['isLogin', 'viewColor', 'uid']),
|
||
|
|
},
|
||
|
|
// ...mapGetters(['isLogin', 'viewColor', 'uid']),
|
||
|
|
onLoad(e) {
|
||
|
|
// this.cartFn()
|
||
|
|
this.appInfo = this.$appInfo.safeAreaInsets
|
||
|
|
this.winHeight = this.$appInfo.windowHeight
|
||
|
|
this.street_code = e.street
|
||
|
|
this.town = e.town
|
||
|
|
this.getCloundShop()
|
||
|
|
this.street = e.town
|
||
|
|
this.Area()
|
||
|
|
let that = this
|
||
|
|
setTimeout(() => {
|
||
|
|
uni.createSelectorQuery()
|
||
|
|
.in(this)
|
||
|
|
.select('.flags')
|
||
|
|
.boundingClientRect(rect => {
|
||
|
|
that.headtop = rect.top
|
||
|
|
})
|
||
|
|
.exec();
|
||
|
|
uni.createSelectorQuery()
|
||
|
|
.in(this)
|
||
|
|
.select('.flags')
|
||
|
|
.boundingClientRect(rect => {
|
||
|
|
this.headtop = rect.top
|
||
|
|
})
|
||
|
|
.exec();
|
||
|
|
uni.createSelectorQuery()
|
||
|
|
.in(this)
|
||
|
|
.select('.cart')
|
||
|
|
.boundingClientRect(rect => {
|
||
|
|
// console.log(this.cartTagInfo, 6666)
|
||
|
|
this.cartTagInfo = rect
|
||
|
|
})
|
||
|
|
.exec();
|
||
|
|
// console.log(that.headtop)
|
||
|
|
}, 500)
|
||
|
|
|
||
|
|
// console.log(this.appInfo, "手机信息")
|
||
|
|
},
|
||
|
|
onShow() {
|
||
|
|
this.cartFn()
|
||
|
|
this.showSelect = false
|
||
|
|
},
|
||
|
|
// 分页
|
||
|
|
onReachBottom() {
|
||
|
|
if (this.flag || !this.goodsList.length) return
|
||
|
|
this.status = "loading"
|
||
|
|
this.page_num += 1
|
||
|
|
this.flag = true
|
||
|
|
cloudWarehouse({
|
||
|
|
street_code: this.street_code,
|
||
|
|
category_id: this.cloudList[this.current]?.category_id || "",
|
||
|
|
order: this.type,
|
||
|
|
keyword: this.keyword,
|
||
|
|
page_num: this.page_num
|
||
|
|
|
||
|
|
}).then(res => {
|
||
|
|
// console.log(res.data.list[0].product_id, this.goodsList[0].product_id)
|
||
|
|
if (res.data.list[0].product_id == this.goodsList[0].product_id) {
|
||
|
|
this.status = "nomore"
|
||
|
|
this.flag = false
|
||
|
|
} else {
|
||
|
|
if (res.data.list.length == 0) {
|
||
|
|
this.status = "nomore"
|
||
|
|
return
|
||
|
|
}
|
||
|
|
this.goodsList = this.goodsList.concat(res.data.list)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
// this.getList().then(res => {
|
||
|
|
// // console.log(res)
|
||
|
|
// return
|
||
|
|
// this.goodsList = this.goodsList.concat(res.data.data)
|
||
|
|
// this.flag = false
|
||
|
|
// if (!res.data.data.length) {
|
||
|
|
// this.status = "nomore"
|
||
|
|
// this.flag = true
|
||
|
|
// }
|
||
|
|
// })
|
||
|
|
},
|
||
|
|
onPageScroll(e) {
|
||
|
|
let that = this
|
||
|
|
this.showtit = !Boolean(e.scrollTop)
|
||
|
|
uni.createSelectorQuery()
|
||
|
|
.in(this)
|
||
|
|
.select('.content')
|
||
|
|
.boundingClientRect(rect => {
|
||
|
|
if (rect.top <= (this.headtop)) {
|
||
|
|
this.pocls = 'fixed'
|
||
|
|
this.act_swiper = 'act_swiper'
|
||
|
|
this.act_img = 'act_img'
|
||
|
|
|
||
|
|
} else {
|
||
|
|
this.pocls = ''
|
||
|
|
this.act_swiper = ''
|
||
|
|
this.act_img = ''
|
||
|
|
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.exec();
|
||
|
|
},
|
||
|
|
onPullDownRefresh() {
|
||
|
|
this.getCloundShop()
|
||
|
|
this.getList()
|
||
|
|
this.cartFn()
|
||
|
|
uni.stopPullDownRefresh()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
showpick() {
|
||
|
|
this.showPicker = !this.showPicker
|
||
|
|
|
||
|
|
|
||
|
|
},
|
||
|
|
swiperClick(item) {
|
||
|
|
const url = item.info[1].value
|
||
|
|
uni.navigateTo({
|
||
|
|
url: url
|
||
|
|
})
|
||
|
|
},
|
||
|
|
selectLocation() {
|
||
|
|
this.isSelectPlace ? this.showPicker = true : ''
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
confirm(e) {
|
||
|
|
this.showPicker = false
|
||
|
|
this.$emit('selectPlce', e)
|
||
|
|
this.$emit('change', e)
|
||
|
|
this.street = e.value[1].name
|
||
|
|
this.$nextTick(() => {
|
||
|
|
this.$bus.$emit('value-updated', e.value[1].name + ',' + e.value[1].code);
|
||
|
|
|
||
|
|
})
|
||
|
|
|
||
|
|
// this.sotreParam.street_id = e.value[1].code
|
||
|
|
this.street_code = e.value[1].code
|
||
|
|
this.getCloundShop()
|
||
|
|
this.town = e.value[1].name
|
||
|
|
// this.storeMerchantList()
|
||
|
|
|
||
|
|
},
|
||
|
|
changeHandler(e) {
|
||
|
|
const {
|
||
|
|
columnIndex,
|
||
|
|
value,
|
||
|
|
values,
|
||
|
|
index,
|
||
|
|
picker = this.$refs.uPicker
|
||
|
|
} = e;
|
||
|
|
if (columnIndex === 0) {
|
||
|
|
getStreet({
|
||
|
|
area_code: value[0]['code']
|
||
|
|
}).then(res => {
|
||
|
|
picker.setColumnValues(1, res.data);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
},
|
||
|
|
Area() {
|
||
|
|
let that = this
|
||
|
|
getArea({
|
||
|
|
city_code: 510500
|
||
|
|
}).then(res => {
|
||
|
|
|
||
|
|
this.$refs.uPicker.setColumnValues(0, res.data);
|
||
|
|
this.Street(res.data[0]['code']);
|
||
|
|
// console.log(res.data, 66666)
|
||
|
|
});
|
||
|
|
},
|
||
|
|
Street(code) {
|
||
|
|
getStreet({
|
||
|
|
area_code: code
|
||
|
|
}).then(res => {
|
||
|
|
this.$refs.uPicker.setColumnValues(1, res.data);
|
||
|
|
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
swiperChange(e) {
|
||
|
|
let {
|
||
|
|
current,
|
||
|
|
source
|
||
|
|
} = e.detail;
|
||
|
|
if (source === 'autoplay' || source === 'touch') {
|
||
|
|
this.bgColor = this.swiper.url[e.detail.current]['img']
|
||
|
|
this.$emit('kkchange', this.bgColor)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
|
||
|
|
// 对象转数组
|
||
|
|
objToArr(data) {
|
||
|
|
let obj = Object.keys(data).sort();
|
||
|
|
let m = obj.map(key => data[key]);
|
||
|
|
return m;
|
||
|
|
},
|
||
|
|
skusizechange(i) {
|
||
|
|
|
||
|
|
this.skusize = i
|
||
|
|
},
|
||
|
|
skuaddcart() {
|
||
|
|
this.showcartpop = false
|
||
|
|
// this.skuform = {}
|
||
|
|
let res = postCartAdd({
|
||
|
|
cart_num: this.skuNumber,
|
||
|
|
is_new: 0,
|
||
|
|
product_attr_unique: this.skuform.sku[this.skusize].unique,
|
||
|
|
product_id: this.skuform.product_id,
|
||
|
|
product_type: this.skuform.product_type,
|
||
|
|
spread_id: "",
|
||
|
|
}).then((res, err) => {
|
||
|
|
this.cartFn()
|
||
|
|
uni.showToast({
|
||
|
|
title: "加入成功",
|
||
|
|
duration: 1000,
|
||
|
|
|
||
|
|
})
|
||
|
|
}).catch(err => {
|
||
|
|
// this.act_cart = false
|
||
|
|
uni.showToast({
|
||
|
|
title: err,
|
||
|
|
icon: "none",
|
||
|
|
duration: 1000,
|
||
|
|
})
|
||
|
|
})
|
||
|
|
|
||
|
|
},
|
||
|
|
valChange(e) {
|
||
|
|
this.skuNumber = e.value
|
||
|
|
|
||
|
|
},
|
||
|
|
closecartpop() {
|
||
|
|
this.showcartpop = false
|
||
|
|
},
|
||
|
|
opencartpop() {
|
||
|
|
this.showcartpop = true
|
||
|
|
},
|
||
|
|
// 授权关闭
|
||
|
|
authColse: function(e) {
|
||
|
|
this.isShowAuth = e;
|
||
|
|
},
|
||
|
|
|
||
|
|
onLoadFun() {
|
||
|
|
this.isShowAuth = false;
|
||
|
|
},
|
||
|
|
clickSwiperFn(i) {
|
||
|
|
// console.log(i)
|
||
|
|
this.current = i
|
||
|
|
},
|
||
|
|
cartFn() {
|
||
|
|
getCartList().then(res => {
|
||
|
|
// console.log(res)
|
||
|
|
this.totalMoney = 0
|
||
|
|
this.cartList = res.data.list
|
||
|
|
this.cartList.forEach(e => {
|
||
|
|
|
||
|
|
e.list.forEach(item => {
|
||
|
|
this.totalMoney += item.cart_num * item.productAttr.price
|
||
|
|
})
|
||
|
|
|
||
|
|
})
|
||
|
|
this.totalMoney = this.totalMoney.toFixed(2)
|
||
|
|
})
|
||
|
|
getCartCounts().then(res => {
|
||
|
|
this.goodsNum = res.data[0].count
|
||
|
|
})
|
||
|
|
},
|
||
|
|
goodDetail(item) {
|
||
|
|
goShopDetail(item, this.uid).then(res => {
|
||
|
|
if (this.isLogin) {
|
||
|
|
initiateAssistApi(item.activity_id).then(res => {
|
||
|
|
let id = res.data.product_assist_set_id;
|
||
|
|
uni.hideLoading();
|
||
|
|
uni.navigateTo({
|
||
|
|
url: '/pages/activity/assist_detail/index?id=' + id
|
||
|
|
});
|
||
|
|
}).catch((err) => {
|
||
|
|
uni.showToast({
|
||
|
|
title: err,
|
||
|
|
icon: 'none'
|
||
|
|
})
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
this.isAuto = true;
|
||
|
|
this.isShowAuth = true
|
||
|
|
}
|
||
|
|
|
||
|
|
})
|
||
|
|
},
|
||
|
|
serch() {
|
||
|
|
this.getList()
|
||
|
|
},
|
||
|
|
goBack() {
|
||
|
|
uni.navigateBack()
|
||
|
|
},
|
||
|
|
screenGoods(type, i) {
|
||
|
|
this.actList.forEach(item => {
|
||
|
|
item.act = ""
|
||
|
|
})
|
||
|
|
this.actList[i].act = true
|
||
|
|
this.type = type
|
||
|
|
if (i == 2) {
|
||
|
|
this.actList[i].price = !this.actList[i].price
|
||
|
|
this.type = this.actList[i].price ? 'price_asc' : ''
|
||
|
|
}
|
||
|
|
this.getList()
|
||
|
|
|
||
|
|
// console.log(this.type)
|
||
|
|
|
||
|
|
},
|
||
|
|
navgo(url) {
|
||
|
|
uni.navigateTo({
|
||
|
|
url
|
||
|
|
})
|
||
|
|
},
|
||
|
|
getList() {
|
||
|
|
this.showLoading = true
|
||
|
|
this.status = "loading"
|
||
|
|
cloudWarehouse({
|
||
|
|
street_code: this.street_code,
|
||
|
|
category_id: this.cloudList[this.current]?.category_id || "",
|
||
|
|
order: this.type,
|
||
|
|
keyword: this.keyword,
|
||
|
|
page_num: this.page_num
|
||
|
|
|
||
|
|
}).then(res => {
|
||
|
|
this.goodsList = res.data.list
|
||
|
|
this.showLoading = false
|
||
|
|
this.goodsList.forEach(item => {
|
||
|
|
this.trnList.push({
|
||
|
|
left: 0,
|
||
|
|
bottom: 0
|
||
|
|
})
|
||
|
|
})
|
||
|
|
})
|
||
|
|
|
||
|
|
},
|
||
|
|
addcart(item, i) {
|
||
|
|
if (!this.isLogin) {
|
||
|
|
this.isAuto = true;
|
||
|
|
this.isShowAuth = true
|
||
|
|
return
|
||
|
|
}
|
||
|
|
|
||
|
|
if (item.sku['']) {
|
||
|
|
let data = {
|
||
|
|
cart_num: 1,
|
||
|
|
is_new: 0,
|
||
|
|
product_attr_unique: item.sku[''].unique,
|
||
|
|
product_id: item.product_id,
|
||
|
|
product_type: item.product_type,
|
||
|
|
spread_id: "",
|
||
|
|
}
|
||
|
|
let that = this
|
||
|
|
uni.createSelectorQuery().in(this).select(`.act_class${i}`).boundingClientRect(data1 => {
|
||
|
|
that.trnList[i].left = this.cartTagInfo.left - data1.left;
|
||
|
|
that.trnList[i].bottom = this.cartTagInfo.top - data1.top;
|
||
|
|
|
||
|
|
let timer = setTimeout(() => {
|
||
|
|
that.trnList[i].left = 0
|
||
|
|
that.trnList[i].bottom = 0
|
||
|
|
that.act_cart = true
|
||
|
|
setTimeout(() => {
|
||
|
|
that.act_cart = false
|
||
|
|
}, 500)
|
||
|
|
}, 1000)
|
||
|
|
}).exec();
|
||
|
|
let res = postCartAdd({
|
||
|
|
...data
|
||
|
|
}).then((res, err) => {
|
||
|
|
this.cartFn()
|
||
|
|
uni.showToast({
|
||
|
|
title: "加入成功",
|
||
|
|
duration: 1000,
|
||
|
|
|
||
|
|
})
|
||
|
|
}).catch(err => {
|
||
|
|
uni.showToast({
|
||
|
|
title: err,
|
||
|
|
icon: "none",
|
||
|
|
duration: 1000,
|
||
|
|
})
|
||
|
|
})
|
||
|
|
setTimeout(() => {
|
||
|
|
that.act_cart = false
|
||
|
|
}, 500)
|
||
|
|
} else {
|
||
|
|
this.skuform = item
|
||
|
|
this.showcartpop = true
|
||
|
|
const keys = Object.keys(item.sku);
|
||
|
|
const firstKey = keys[0];
|
||
|
|
this.skusize = keys[0]
|
||
|
|
|
||
|
|
}
|
||
|
|
return
|
||
|
|
|
||
|
|
|
||
|
|
},
|
||
|
|
all(index) {
|
||
|
|
this.showPop = false
|
||
|
|
this.current = index
|
||
|
|
this.getList()
|
||
|
|
},
|
||
|
|
test(e) {
|
||
|
|
// console.log(e.target.current)
|
||
|
|
this.current = e.target.current
|
||
|
|
// console.log(e)
|
||
|
|
this.getList()
|
||
|
|
},
|
||
|
|
|
||
|
|
async getCloundShop() {
|
||
|
|
const {
|
||
|
|
data
|
||
|
|
} = await getCityCloundShop({
|
||
|
|
street_code: this.street_code
|
||
|
|
})
|
||
|
|
this.cloudList = data
|
||
|
|
cloudWarehouse({
|
||
|
|
street_code: this.street_code,
|
||
|
|
category_id: this.cloudList[this.current].category_id
|
||
|
|
}).then(res => {
|
||
|
|
this.trnList = []
|
||
|
|
this.goodsList = res.data.list
|
||
|
|
this.goodsList.forEach(item => {
|
||
|
|
this.trnList.push({
|
||
|
|
left: 0,
|
||
|
|
bottom: 0
|
||
|
|
})
|
||
|
|
})
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
@keyframes addcart {
|
||
|
|
from {
|
||
|
|
// background-color: red;
|
||
|
|
opacity: 1,
|
||
|
|
}
|
||
|
|
|
||
|
|
to {
|
||
|
|
// background-color: yellow;
|
||
|
|
opacity: 0,
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.selected-list {
|
||
|
|
padding: 24rpx 14rpx;
|
||
|
|
border-radius: 10.51rpx 10.51rpx 10.51rpx 10.51rpx;
|
||
|
|
background-color: #fff;
|
||
|
|
position: absolute;
|
||
|
|
left: 100rpx;
|
||
|
|
font-size: 29.79rpx;
|
||
|
|
z-index: 9999;
|
||
|
|
// top: 100rpx;
|
||
|
|
opacity: 0;
|
||
|
|
transition: 0.5s;
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
.triangle-up {
|
||
|
|
width: 0;
|
||
|
|
height: 0;
|
||
|
|
border-left: 10rpx solid transparent;
|
||
|
|
border-right: 10rpx solid transparent;
|
||
|
|
border-bottom: 10rpx solid white;
|
||
|
|
position: absolute;
|
||
|
|
top: -10rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.selected-li {
|
||
|
|
margin-top: 35rpx;
|
||
|
|
color: #F84221;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.sku {
|
||
|
|
padding: 20rpx;
|
||
|
|
|
||
|
|
.sku_head {
|
||
|
|
display: flex;
|
||
|
|
|
||
|
|
.sku_head_r {
|
||
|
|
margin-left: 20rpx;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
.sku_goods_tit {
|
||
|
|
font-size: 30rpx;
|
||
|
|
width: 60vw;
|
||
|
|
/* 容器的宽度 */
|
||
|
|
overflow: hidden;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sku_goods_price {
|
||
|
|
color: red;
|
||
|
|
font-size: 30rpx;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// justify-content;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sku_size {
|
||
|
|
margin: 40rpx 0;
|
||
|
|
|
||
|
|
.size_li {
|
||
|
|
display: inline-block;
|
||
|
|
// width: 100rpx;
|
||
|
|
padding: 5rpx 20rpx;
|
||
|
|
margin-right: 20rpx;
|
||
|
|
text-align: center;
|
||
|
|
color: black;
|
||
|
|
border: 1px solid #EBECEE;
|
||
|
|
|
||
|
|
// height: 2;
|
||
|
|
}
|
||
|
|
|
||
|
|
.act_size_li {
|
||
|
|
background-color: #FF5C2D;
|
||
|
|
color: white;
|
||
|
|
border: #FF5C2D 1px solid;
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.sku_num {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
}
|
||
|
|
|
||
|
|
.skuaddcart {
|
||
|
|
width: 50vw;
|
||
|
|
background-color: #FEAB00;
|
||
|
|
margin: 20rpx auto;
|
||
|
|
height: 80rpx;
|
||
|
|
line-height: 80rpx;
|
||
|
|
text-align: center;
|
||
|
|
color: white;
|
||
|
|
border-radius: 80rpx;
|
||
|
|
// margin-top: 20rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.flags {
|
||
|
|
background-color: red;
|
||
|
|
z-index: 99999999;
|
||
|
|
}
|
||
|
|
|
||
|
|
.swiper_item {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-around;
|
||
|
|
transition: .5s;
|
||
|
|
padding: 40rpx;
|
||
|
|
// transform: scale(1.2);
|
||
|
|
}
|
||
|
|
|
||
|
|
.swiper_item_act {
|
||
|
|
transform: scale(1.2);
|
||
|
|
}
|
||
|
|
|
||
|
|
// .swiper_item:hover {}
|
||
|
|
|
||
|
|
|
||
|
|
// .swiper_item {
|
||
|
|
// transform: scale(1.2);
|
||
|
|
// }
|
||
|
|
|
||
|
|
.swiper_b {
|
||
|
|
transition: 1s;
|
||
|
|
}
|
||
|
|
|
||
|
|
// .swiper_b:active {
|
||
|
|
// transform: scale(1.5);
|
||
|
|
// }
|
||
|
|
|
||
|
|
.act_cart {
|
||
|
|
transition: 0.5s;
|
||
|
|
transform: scale(1.1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.box {
|
||
|
|
position: relative;
|
||
|
|
|
||
|
|
.content {
|
||
|
|
width: 100vw;
|
||
|
|
// transform: translateY(-100px);
|
||
|
|
border-radius: 50rpx 50rpx 0 0;
|
||
|
|
// position: absolute;
|
||
|
|
// top: 965rpx;
|
||
|
|
// border-top: 5px solid red;
|
||
|
|
z-index: 9999;
|
||
|
|
background-color: white;
|
||
|
|
// padding: 0 10rpx;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
.active_swiper {
|
||
|
|
transform: scale(1.3);
|
||
|
|
// transform: translateX() translateY();
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.pictrue {
|
||
|
|
position: relative;
|
||
|
|
width: 100%;
|
||
|
|
height: 345rpx;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.act {
|
||
|
|
color: #FF6D20;
|
||
|
|
}
|
||
|
|
|
||
|
|
.act_content {
|
||
|
|
width: 100vw;
|
||
|
|
// position: absolute;
|
||
|
|
// top: 965rpx;
|
||
|
|
z-index: 99;
|
||
|
|
background-color: #F4F4F4;
|
||
|
|
padding: 0 10rpx;
|
||
|
|
|
||
|
|
// transition: opt\ linear;
|
||
|
|
padding-top: 200rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.act_class {
|
||
|
|
transition: 0.5s;
|
||
|
|
}
|
||
|
|
|
||
|
|
.act_class:active {
|
||
|
|
transform: scale(2);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
.content_act {
|
||
|
|
width: 100vw;
|
||
|
|
position: absolute;
|
||
|
|
top: 165rpx;
|
||
|
|
z-index: 99;
|
||
|
|
background-color: #F4F4F4;
|
||
|
|
padding: 0 10rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.fade-enter-active,
|
||
|
|
.fade-leave-active {
|
||
|
|
transition: opacity 0.5s;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.fade-enter,
|
||
|
|
.fade-leave-to {
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.head_tits {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
align-items: center;
|
||
|
|
box-sizing: border-box;
|
||
|
|
padding: 0 20rpx;
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
.img_cls {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
right: 7rpx;
|
||
|
|
transform: translateY(-50%);
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.pop {
|
||
|
|
width: 615.07rpx;
|
||
|
|
padding: 30rpx 28rpx;
|
||
|
|
|
||
|
|
.pop_content {
|
||
|
|
width: 559rpx;
|
||
|
|
height: 80vh;
|
||
|
|
background-color: #F4F4F4;
|
||
|
|
padding: 28rpx;
|
||
|
|
border-radius: 21.03rpx 21.03rpx 0rpx 0rpx;
|
||
|
|
margin-top: 47rpx;
|
||
|
|
|
||
|
|
.pop_head {
|
||
|
|
// display: flex;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pop_li {
|
||
|
|
display: flex;
|
||
|
|
margin-bottom: 52rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.head_tit {
|
||
|
|
margin-left: 20rpx;
|
||
|
|
font-size: 40rpx;
|
||
|
|
// background-color: red;
|
||
|
|
width: 40vw;
|
||
|
|
white-space: nowrap;
|
||
|
|
overflow: hidden;
|
||
|
|
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
|
||
|
|
// font-weight: 700;
|
||
|
|
// transform: skewX(-10deg);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.act {
|
||
|
|
color: red;
|
||
|
|
}
|
||
|
|
|
||
|
|
.head {
|
||
|
|
position: fixed;
|
||
|
|
z-index: 999;
|
||
|
|
color: white;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
width: 100%;
|
||
|
|
padding: 0 20rpx;
|
||
|
|
align-items: center;
|
||
|
|
transition: .5s;
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.heads {
|
||
|
|
position: fixed;
|
||
|
|
z-index: 100;
|
||
|
|
color: white;
|
||
|
|
width: 100%;
|
||
|
|
padding: 0 20rpx;
|
||
|
|
transition: 1s;
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.show {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
.menu {
|
||
|
|
position: absolute;
|
||
|
|
top: 748rpx;
|
||
|
|
width: 750rpx;
|
||
|
|
// background-color: rgba(255, 255, 255, 0.7);
|
||
|
|
height: 250rpx;
|
||
|
|
// height: 175.23rpx;
|
||
|
|
// box-shadow: 0 0 100px 100px rgba(255, 255, 255, 0.5);
|
||
|
|
// box-shadow: 0 0 100rpx 30rpx rgba(255, 255, 255, 0.9);
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.town_name {
|
||
|
|
margin-right: 50rpx;
|
||
|
|
// background-color: red;
|
||
|
|
max-width: 15vw;
|
||
|
|
white-space: nowrap;
|
||
|
|
|
||
|
|
overflow: hidden;
|
||
|
|
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
}
|
||
|
|
|
||
|
|
.goods_list {
|
||
|
|
min-height: 95vh;
|
||
|
|
padding: 0 10rpx;
|
||
|
|
// background-color: red;
|
||
|
|
|
||
|
|
.goods {
|
||
|
|
display: flex;
|
||
|
|
padding: 21rpx;
|
||
|
|
background-color: white;
|
||
|
|
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
|
||
|
|
margin-bottom: 20rpx;
|
||
|
|
|
||
|
|
.left {
|
||
|
|
width: 192.76rpx;
|
||
|
|
height: 192.76rpx;
|
||
|
|
border-radius: 10.51rpx 10.51rpx 10.51rpx 10.51rpx;
|
||
|
|
margin-right: 21rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.right {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
.tit {
|
||
|
|
font-size: 29.79rpx;
|
||
|
|
color: black;
|
||
|
|
font-weight: bold;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.good_score {
|
||
|
|
font-size: 26rpx;
|
||
|
|
color: #B3B3B3;
|
||
|
|
margin-bottom: 15rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.good_price {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
align-items: center;
|
||
|
|
width: 60vw;
|
||
|
|
|
||
|
|
.good_price_r {
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
|
||
|
|
.good_price_l {
|
||
|
|
display: flex;
|
||
|
|
|
||
|
|
.old_price {
|
||
|
|
color: #B3B3B3;
|
||
|
|
text-decoration: line-through;
|
||
|
|
font-size: 26.29rpx;
|
||
|
|
margin-left: 15rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
// color: greenyellow;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.activeClass {
|
||
|
|
width: 400rpx;
|
||
|
|
height: 400rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.act_swiper {
|
||
|
|
height: 200rpx;
|
||
|
|
position: fixed;
|
||
|
|
z-index: 99;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
.act_img {
|
||
|
|
// transition:t;
|
||
|
|
transform: translateY(-840rpx);
|
||
|
|
/* #ifdef APP-PLUS */
|
||
|
|
transform: translateY(-800rpx);
|
||
|
|
/* #endif */
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
// .act_swiper2 {
|
||
|
|
// height: 998rpx;
|
||
|
|
// }
|
||
|
|
|
||
|
|
.content_sift {
|
||
|
|
width: 750rpx;
|
||
|
|
padding: 22rpx 0;
|
||
|
|
// padding-top: 80rpx;
|
||
|
|
background-color: white;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-around;
|
||
|
|
// background-color: white;
|
||
|
|
// background-color: green;
|
||
|
|
z-index: 99;
|
||
|
|
box-sizing: border-box;
|
||
|
|
margin-bottom: 20rpx;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.swipers {
|
||
|
|
width: 750rpx;
|
||
|
|
height: 998.83rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.card {
|
||
|
|
width: 720rpx;
|
||
|
|
z-index: 99;
|
||
|
|
// margin:auto;
|
||
|
|
left: 50%;
|
||
|
|
transform: translateX(-50%);
|
||
|
|
position: fixed;
|
||
|
|
// bottom: 0;
|
||
|
|
background-color: #333333;
|
||
|
|
height: 101.64rpx;
|
||
|
|
border-radius: 50.82rpx;
|
||
|
|
overflow: hidden;
|
||
|
|
color: white;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
box-sizing: border-box;
|
||
|
|
|
||
|
|
.left {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: 10rpx 35rpx;
|
||
|
|
|
||
|
|
.tot_price {
|
||
|
|
display: flex;
|
||
|
|
margin-left: 42rpx;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: space-between;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.right {
|
||
|
|
font-size: 33.29rpx;
|
||
|
|
line-height: 50px;
|
||
|
|
background: linear-gradient(to right, #F84221, #FF6D20);
|
||
|
|
width: 175.23rpx;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.badge {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
background-color: #F84221;
|
||
|
|
transform: translate(50%, -50%);
|
||
|
|
// padding: 10rpx 10rpx;
|
||
|
|
border-radius: 35rpx;
|
||
|
|
text-align: center;
|
||
|
|
width: 35rpx;
|
||
|
|
line-height: 35rpx;
|
||
|
|
height: 35rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
// .cloud_entrepot {
|
||
|
|
// background: url("https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/13/ycbg.png") no-repeat;
|
||
|
|
// background-size: cover;
|
||
|
|
// padding-bottom: 92.98rpx;
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .head-wrapper {
|
||
|
|
// height: 485.96rpx;
|
||
|
|
// width: 100%;
|
||
|
|
// background: url("https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/13/top.png") no-repeat;
|
||
|
|
// background-size: cover;
|
||
|
|
// margin-bottom: 49.12rpx;
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .town-title {
|
||
|
|
// margin: 0 auto;
|
||
|
|
// width: 100%;
|
||
|
|
// text-align: center;
|
||
|
|
// font-size: 50.88rpx;
|
||
|
|
// color: #fff;
|
||
|
|
// margin-bottom: 28.07rpx;
|
||
|
|
|
||
|
|
// &::after {
|
||
|
|
// content: '';
|
||
|
|
// display: inline-block;
|
||
|
|
// width: 66.67rpx;
|
||
|
|
// height: 31.58rpx;
|
||
|
|
// background: url("https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/13/you.png") no-repeat;
|
||
|
|
// background-size: cover;
|
||
|
|
// margin-left: 24.56rpx;
|
||
|
|
// }
|
||
|
|
|
||
|
|
// &::before {
|
||
|
|
// content: '';
|
||
|
|
// display: inline-block;
|
||
|
|
// width: 66.67rpx;
|
||
|
|
// height: 31.58rpx;
|
||
|
|
// background: url("https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/13/zuo.png") no-repeat;
|
||
|
|
// background-size: cover;
|
||
|
|
// margin-right: 24.56rpx;
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
|
||
|
|
// .body-wrapper {
|
||
|
|
// width: 694.74rpx;
|
||
|
|
// display: flex;
|
||
|
|
// justify-content: space-between;
|
||
|
|
// flex-wrap: wrap;
|
||
|
|
// margin: 0 auto;
|
||
|
|
|
||
|
|
// .item {
|
||
|
|
// width: 336.84rpx;
|
||
|
|
// height: 100%;
|
||
|
|
// padding: 24.56rpx 28.07rpx;
|
||
|
|
// margin-bottom: 21.05rpx;
|
||
|
|
// background-repeat: no-repeat;
|
||
|
|
// background-size: 100% 100%;
|
||
|
|
// box-sizing: border-box;
|
||
|
|
|
||
|
|
// text {
|
||
|
|
// display: block;
|
||
|
|
// font-size: 24.56rpx;
|
||
|
|
// color: #999;
|
||
|
|
// margin-bottom: 14.04rpx;
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .item-title {
|
||
|
|
// font-size: 31.58rpx;
|
||
|
|
// color: #333;
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .chakan-btn {
|
||
|
|
// width: 114.04rpx;
|
||
|
|
// height: 49.12rpx;
|
||
|
|
// font-size: 28.07rpx;
|
||
|
|
// text-align: center;
|
||
|
|
// line-height: 49.12rpx;
|
||
|
|
// color: #fff;
|
||
|
|
// margin-top: auto;
|
||
|
|
// background: linear-gradient(90deg, #FE5300 0%, #F84221 100%);
|
||
|
|
// border-radius: 50px;
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
.empty {
|
||
|
|
// display: flex;
|
||
|
|
// justify-content: space-between;
|
||
|
|
// flex-direction: column;
|
||
|
|
// align-items: center;
|
||
|
|
// padding: 20vh 0;
|
||
|
|
position: relative;
|
||
|
|
height: 100vh;
|
||
|
|
|
||
|
|
.info {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
}
|
||
|
|
|
||
|
|
// padding-top: 100px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.head_r {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cart {
|
||
|
|
z-index: 999;
|
||
|
|
}
|
||
|
|
|
||
|
|
.x_tra {
|
||
|
|
// position: relative;
|
||
|
|
z-index: 999999;
|
||
|
|
animation-name: addcatr;
|
||
|
|
animation-duration: 1s;
|
||
|
|
animation-timing-function: ease-in-out;
|
||
|
|
animation-iteration-count: 1;
|
||
|
|
animation-fill-mode: forwards; // animation-iteration-count: 1;
|
||
|
|
/* 设置为1 */
|
||
|
|
// transition: 1s cubic-bezier(0.5, -0.5, 1, 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.price_sift {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sl {
|
||
|
|
margin-left: 20rpx;
|
||
|
|
transform: rotate(180deg);
|
||
|
|
transition: 0.5s;
|
||
|
|
}
|
||
|
|
|
||
|
|
.actsl {
|
||
|
|
transform: rotate(0deg);
|
||
|
|
}
|
||
|
|
|
||
|
|
.actSel {
|
||
|
|
opacity: 1;
|
||
|
|
// transform: translateX(100rpx);
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.yuncangempty {
|
||
|
|
margin: 20vh 0;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center
|
||
|
|
}
|
||
|
|
</style>
|