优化提交页面样式，优化商品默认为第一个热词进行搜索，修复分销商铺bug
lemon橪
parent
c53af2fcc3
commit
275d76c0dd
|
|
@ -2,8 +2,8 @@
|
|||
"name" : "lili商城",
|
||||
"appid" : "__UNI__C100675",
|
||||
"description" : "",
|
||||
"versionName" : "4.0.32",
|
||||
"versionCode" : 4000032,
|
||||
"versionName" : "4.0.34",
|
||||
"versionCode" : 4000034,
|
||||
"transformPx" : false,
|
||||
"app-plus" : {
|
||||
"compatible" : {
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<div class="empty" v-if="couponsList.length <= 0">
|
||||
<u-empty text="暂无优惠券" mode="coupon"></u-empty>
|
||||
</div>
|
||||
<view class="coupon-item" v-for="(item, index) in couponsList" :key="index" v-if="item.memberCouponStatus == 'NEW'">
|
||||
<view class="coupon-item" v-for="(item, index) in couponsList" :key="index" >
|
||||
<view class="left">
|
||||
<view class="wave-line">
|
||||
<view class="wave" v-for="(item, index) in 12" :key="index"></view>
|
||||
|
|
@ -31,7 +31,7 @@
|
|||
<view class="reason" v-if="item.reason">{{item.reason}}</view>
|
||||
<view class="end-time">有效期至:{{item.endTime}}</view>
|
||||
</view>
|
||||
<view class="receive" @click="clickWay(item)">
|
||||
<view class="receive" v-if="current ==0" @click="clickWay(item)">
|
||||
<text>立即</text><br />
|
||||
<text>使用</text>
|
||||
</view>
|
||||
|
|
@ -53,7 +53,7 @@ export default {
|
|||
name: "可用优惠券",
|
||||
},
|
||||
{
|
||||
name: "不可能优惠券",
|
||||
name: "不可用优惠券",
|
||||
},
|
||||
],
|
||||
couponsList: [], //优惠券集合
|
||||
|
|
|
|||
|
|
@ -222,7 +222,7 @@ export default {
|
|||
*/
|
||||
handleNavgationGoods(val) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/product/goods?id=${val.skuId}&goodsId=${val.id}`,
|
||||
url: `/pages/product/goods?id=${val.skuId}&goodsId=${val.goodsId}`,
|
||||
});
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<u-navbar :background="navObj" :is-back="false">
|
||||
<!-- mSearch组件 如果使用原样式，删除组件元素-->
|
||||
|
||||
<mSearch ref="mSearch" class="mSearch-input-box" @clickLeft="back" :mode="2" :placeholder="defaultKeyword" @search="doSearch(false)" @input="inputChange" @confirm="doSearch(false)"
|
||||
@SwitchType="doSearchSwitch()" v-model="keyword" :isFocusVal="!isShowSeachGoods"></mSearch>
|
||||
<mSearch ref="mSearch" class="mSearch-input-box" @clickLeft="back" :mode="2" :placeholder="defaultKeyword"
|
||||
@search="doSearch(false)" @confirm="doSearch(false)" @SwitchType="doSearchSwitch()" v-model="keyword"
|
||||
:isFocusVal="!isShowSeachGoods"></mSearch>
|
||||
</u-navbar>
|
||||
|
||||
<view class="search-keyword" v-if="!isShowSeachGoods">
|
||||
|
|
@ -23,22 +22,19 @@
|
|||
<view class="u-tips">热门搜索</view>
|
||||
</view>
|
||||
<view class="keyword keywordBox">
|
||||
<view class="wes" v-for="(keyword, index) in hotKeywordList" @tap="doSearch(keyword)" :key="index">{{ keyword }}</view>
|
||||
<view class="wes" v-for="(keyword, index) in hotKeywordList" @tap="doSearch(keyword)" :key="index">
|
||||
{{ keyword }}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="keyword-block" v-if="oldKeywordList.length > 0">
|
||||
<view class="keyword-list-header">
|
||||
<view class="u-tips">搜索历史</view>
|
||||
|
||||
</view>
|
||||
<div class="oldKeyList">
|
||||
|
||||
<div class="oldKeyItem" v-if="keyword" v-for="(keyword, index) in oldKeywordList" :key="index" @click="doSearch(keyword)">
|
||||
<div class="oldKeyItem" v-if="keyword" v-for="(keyword, index) in oldKeywordList" :key="index"
|
||||
@click="doSearch(keyword)">
|
||||
<span>{{ keyword }} </span>
|
||||
</div>
|
||||
|
||||
<div @click="showMore" v-if=" oldKeywordIndex > loadIndex" class="oldKeyItem">展示更多</div>
|
||||
</div>
|
||||
</view>
|
||||
|
|
@ -54,11 +50,13 @@
|
|||
<text>销量</text>
|
||||
<view class="p-box">
|
||||
<view class="index-nav-arrow">
|
||||
<image class="img" src="/static/index/arrow-up-1.png" v-if="params.sort === 'buyCount' && params.order === 'asc'" mode="aspectFit"></image>
|
||||
<image class="img" src="/static/index/arrow-up-1.png"
|
||||
v-if="params.sort === 'buyCount' && params.order === 'asc'" mode="aspectFit"></image>
|
||||
<image class="img" src="/static/index/arrow-up.png" v-else mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="index-nav-arrow">
|
||||
<image class="img" src="/static/index/arrow-down.png" v-if="params.sort === 'buyCount' && params.order === 'desc'" mode="aspectFit"></image>
|
||||
<image class="img" src="/static/index/arrow-down.png"
|
||||
v-if="params.sort === 'buyCount' && params.order === 'desc'" mode="aspectFit"></image>
|
||||
<image class="img" src="/static/index/arrow-down-1.png" v-else mode="aspectFit"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -67,11 +65,13 @@
|
|||
<text>价格</text>
|
||||
<view class="p-box">
|
||||
<view class="index-nav-arrow">
|
||||
<image class="img" src="/static/index/arrow-up-1.png" v-if="params.sort === 'price' && params.order === 'asc'" mode="aspectFit"></image>
|
||||
<image class="img" src="/static/index/arrow-up-1.png"
|
||||
v-if="params.sort === 'price' && params.order === 'asc'" mode="aspectFit"></image>
|
||||
<image class="img" src="/static/index/arrow-up.png" v-else mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="index-nav-arrow">
|
||||
<image class="img" src="/static/index/arrow-down.png" v-if="params.sort === 'price' && params.order === 'desc'" mode="aspectFit"></image>
|
||||
<image class="img" src="/static/index/arrow-down.png"
|
||||
v-if="params.sort === 'price' && params.order === 'desc'" mode="aspectFit"></image>
|
||||
<image class="img" src="/static/index/arrow-down-1.png" v-else mode="aspectFit"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -80,7 +80,8 @@
|
|||
</view>
|
||||
<!-- 一行一个商品展示 -->
|
||||
<div v-if="isSWitch">
|
||||
<scroll-view :style="{ height: goodsHeight }" enableBackToTop="true" lower-threshold="250" @scrolltolower="loadmore()" scroll-with-animation scroll-y class="scoll-page">
|
||||
<scroll-view :style="{ height: goodsHeight }" enableBackToTop="true" lower-threshold="250"
|
||||
@scrolltolower="loadmore()" scroll-with-animation scroll-y class="scoll-page">
|
||||
<div class="goodsClass">
|
||||
<u-row v-for="(item, index) in goodsList" :key="index" class="goodsRow">
|
||||
<u-col :span="4" @click.native="navigateToDetailPage(item)" class="switchType1">
|
||||
|
|
@ -113,7 +114,8 @@
|
|||
<u-col :span="12" class="storeSellerBox">
|
||||
<div class="storeSellerName" @click="clickTostore()">
|
||||
<div class="textHidden">
|
||||
<u-tag style="margin-right: 10rpx" size="mini" mode="dark" v-if="item.selfOperated" text="自营" type="error" />
|
||||
<u-tag style="margin-right: 10rpx" size="mini" mode="dark" v-if="item.selfOperated" text="自营"
|
||||
type="error" />
|
||||
|
||||
<span style="
|
||||
color: #333333;
|
||||
|
|
@ -148,9 +150,11 @@
|
|||
!isSWitch &&
|
||||
!(goodsList == [] || goodsList == '' || goodsList == null)
|
||||
">
|
||||
<scroll-view :style="{ height: goodsHeight }" scroll-anchoring enableBackToTop="true" @scrolltolower="loadmore()" scroll-with-animation scroll-y lower-threshold="250" class="scoll-page">
|
||||
<scroll-view :style="{ height: goodsHeight }" scroll-anchoring enableBackToTop="true"
|
||||
@scrolltolower="loadmore()" scroll-with-animation scroll-y lower-threshold="250" class="scoll-page">
|
||||
<view class="goods-list">
|
||||
<view v-for="(item, index) in goodsList" :key="index" class="goods-item" @click="navigateToDetailPage(item)">
|
||||
<view v-for="(item, index) in goodsList" :key="index" class="goods-item"
|
||||
@click="navigateToDetailPage(item)">
|
||||
<view class="image-wrapper">
|
||||
<image :src="item.thumbnail" mode="aspectFill"></image>
|
||||
</view>
|
||||
|
|
@ -179,7 +183,8 @@
|
|||
</div>
|
||||
<div class="storeSellerName">
|
||||
<div class="textHidden">
|
||||
<u-tag style="margin-right: 10rpx" size="mini" mode="dark" v-if="item.selfOperated" text="自营" type="error" />
|
||||
<u-tag style="margin-right: 10rpx" size="mini" mode="dark" v-if="item.selfOperated" text="自营"
|
||||
type="error" />
|
||||
<span>{{ item.storeName || "暂无" }}</span>
|
||||
</div>
|
||||
<span>
|
||||
|
|
@ -201,7 +206,8 @@
|
|||
<view class="sort-item">
|
||||
<view class="sort-title"> 品牌 </view>
|
||||
<view class="flex" v-if="sortData.brands">
|
||||
<view class="sort-brand-item" :key="brandsIndex" v-for="(brand, brandsIndex) in sortData.brands" @click="handleSort(brand, brandsIndex, 'brand')">
|
||||
<view class="sort-brand-item" :key="brandsIndex" v-for="(brand, brandsIndex) in sortData.brands"
|
||||
@click="handleSort(brand, brandsIndex, 'brand')">
|
||||
<view class="sort-radius" :class="{
|
||||
'sort-active': brand.__selected,
|
||||
}">
|
||||
|
|
@ -214,7 +220,9 @@
|
|||
<view class="sort-item">
|
||||
<view class="sort-title"> 全部分类 </view>
|
||||
<view class="flex" style="flex-wrap: wrap;" v-if="sortData.categories">
|
||||
<view class="sort-brand-item" :key="categoriesIndex" v-for="(categoryId, categoriesIndex) in sortData.categories" @click="handleSort(categoryId, categoriesIndex, 'categoryId')">
|
||||
<view class="sort-brand-item" :key="categoriesIndex"
|
||||
v-for="(categoryId, categoriesIndex) in sortData.categories"
|
||||
@click="handleSort(categoryId, categoriesIndex, 'categoryId')">
|
||||
<view class="sort-radius" :class="{
|
||||
'sort-active': categoryId.__selected,
|
||||
}">
|
||||
|
|
@ -248,7 +256,8 @@
|
|||
<view class="sort-item" :key="paramIndex" v-for="(param, paramIndex) in sortData.paramOptions">
|
||||
<view class="sort-title"> {{ param.key }} </view>
|
||||
<view class="flex" style="flex-warp:warp" v-if="param.values">
|
||||
<view class="sort-brand-item" :key="i" v-for="(value, i) in param.values" @click="handleSort(value, i, 'prop', param)">
|
||||
<view class="sort-brand-item" :key="i" v-for="(value, i) in param.values"
|
||||
@click="handleSort(value, i, 'prop', param)">
|
||||
<view class="sort-radius" :class="{
|
||||
'sort-active': value.__selected,
|
||||
}">
|
||||
|
|
@ -337,7 +346,6 @@ export default {
|
|||
};
|
||||
},
|
||||
onLoad(val) {
|
||||
// return false
|
||||
this.init();
|
||||
this.initSortGoods();
|
||||
// 接收分类的数据
|
||||
|
|
@ -360,9 +368,27 @@ export default {
|
|||
this.loadData();
|
||||
},
|
||||
components: {
|
||||
//引用mSearch组件，如不需要删除即可
|
||||
mSearch,
|
||||
},
|
||||
watch: {
|
||||
/**
|
||||
* 将搜索的字和热词进行匹配,如果为热词则不改商品搜索关键字
|
||||
*/
|
||||
keyword(val) {
|
||||
if (val) {
|
||||
let identical = this.hotKeywordList.some((item) => {
|
||||
return item == val;
|
||||
});
|
||||
if (!identical) {
|
||||
this.defaultKeyword = "请输入搜索商品";
|
||||
} else {
|
||||
this.defaultKeyword = val;
|
||||
}
|
||||
} else {
|
||||
this.defaultKeyword = "请输入搜索商品";
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
onReachBottom() {
|
||||
this.params.pageNumber++;
|
||||
|
|
@ -497,8 +523,9 @@ export default {
|
|||
},
|
||||
|
||||
init() {
|
||||
this.loadDefaultKeyword();
|
||||
// 加载搜索记录
|
||||
this.loadOldKeyword(this.loadIndex);
|
||||
// 加载热词
|
||||
this.loadHotKeyword();
|
||||
},
|
||||
blur() {
|
||||
|
|
@ -577,8 +604,16 @@ export default {
|
|||
},
|
||||
//加载默认搜索关键字
|
||||
loadDefaultKeyword() {
|
||||
//定义默认搜索关键字，可以自己实现ajax请求数据再赋值,用户未输入时，以水印方式显示在输入框，直接不输入内容搜索会搜索默认关键字
|
||||
this.defaultKeyword = "请输入搜索商品";
|
||||
/**
|
||||
* 定义默认搜索关键字会根据当前热门搜索来进行显示
|
||||
* 如果当前热门搜索没有的话，则会显示默认关键字
|
||||
*/
|
||||
if (this.hotKeywordList.length != 0) {
|
||||
//
|
||||
this.defaultKeyword = this.hotKeywordList[0];
|
||||
} else {
|
||||
this.defaultKeyword = "请输入搜索商品";
|
||||
}
|
||||
},
|
||||
//加载历史搜索,自动读取本地Storage
|
||||
loadOldKeyword(index) {
|
||||
|
|
@ -626,6 +661,7 @@ export default {
|
|||
this.hotKeywordList.push(item);
|
||||
});
|
||||
}
|
||||
this.loadDefaultKeyword();
|
||||
},
|
||||
//加载商品 ，带下拉刷新和上滑加载
|
||||
async loadData(type, loading) {
|
||||
|
|
@ -643,19 +679,7 @@ export default {
|
|||
this.initSortGoods();
|
||||
uni.hideLoading();
|
||||
},
|
||||
//监听输入
|
||||
inputChange(event) {
|
||||
//兼容引入组件时传入参数情况
|
||||
var keyword = event.detail ? event.detail.value : event;
|
||||
if (!keyword) {
|
||||
this.keywordList = [];
|
||||
this.isShowKeywordList = false;
|
||||
return;
|
||||
}
|
||||
this.isShowKeywordList = true;
|
||||
|
||||
this.getKeywordNumFun(keyword);
|
||||
},
|
||||
//高亮关键字
|
||||
drawCorrelativeKeyword(keywords, keyword) {
|
||||
var len = keywords.length,
|
||||
|
|
@ -696,14 +720,27 @@ export default {
|
|||
},
|
||||
|
||||
// 样式修改布局
|
||||
doSearchSwitch(val) {
|
||||
doSearchSwitch() {
|
||||
this.isSWitch = !this.isSWitch;
|
||||
this.isShowSeachGoods = true;
|
||||
},
|
||||
|
||||
//执行搜索
|
||||
/**
|
||||
* 执行搜索
|
||||
*/
|
||||
doSearch(keyword) {
|
||||
// 用户自行搜索/热门搜索/搜索历史
|
||||
keyword = keyword === false ? this.keyword : keyword;
|
||||
|
||||
if (!keyword) {
|
||||
/**
|
||||
* 进行空搜索
|
||||
* 第一次搜索如果没有关键词会将热门搜索中第一个热词进行判定
|
||||
* 如果没有热词则会展示一个空词搜索
|
||||
*/
|
||||
keyword = (this.hotKeywordList.length && this.hotKeywordList[0]) || "";
|
||||
}
|
||||
this.defaultKeyword == "请输入搜索商品" ? (keyword = "") : "";
|
||||
this.keyword = keyword;
|
||||
this.saveKeyword(keyword); //保存为历史
|
||||
this.isShowSeachGoods = true;
|
||||
|
|
@ -711,7 +748,6 @@ export default {
|
|||
this.params.keyword = keyword;
|
||||
this.params.pageNumber = 1;
|
||||
this.$set(this.sortParams, "keyword", keyword);
|
||||
|
||||
this.loadData("refresh", 1);
|
||||
},
|
||||
//保存关键字到历史记录
|
||||
|
|
@ -747,12 +783,6 @@ export default {
|
|||
},
|
||||
});
|
||||
},
|
||||
|
||||
// 搜索关键字
|
||||
getKeywordNumFun(keywords) {
|
||||
this.params.keyword = keywords;
|
||||
this.$set(this.sortParams, "keyword", keywords);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,49 +1,38 @@
|
|||
<template>
|
||||
<div class="wrapper">
|
||||
<!-- 选择地址 -->
|
||||
<div class="box1 box">
|
||||
<u-row style="margin-top: 32rpx">
|
||||
<u-col style="padding: 0 !important" :offset="0" :span="11" @click.native="clickToAddress()">
|
||||
<div class="address-box" @click="clickToAddress()">
|
||||
<div class="user-box flex">
|
||||
<div class="flex-8">
|
||||
<div v-if="!address.id">请选择地址</div>
|
||||
<div v-else>
|
||||
<div class="userClass">
|
||||
{{ address.name }}
|
||||
<span>
|
||||
{{ address.mobile | secrecyMobile }}
|
||||
<u-tag v-if="address.isDefault" text="默认" style="margin-left: 24rpx" mode="plain" type="error"
|
||||
size="mini" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="userAdress">
|
||||
<span v-if="address.consigneeAddressPath[0]">{{
|
||||
address.consigneeAddressPath[0]
|
||||
}}</span>
|
||||
|
||||
<span v-if="address.consigneeAddressPath[1]">{{
|
||||
address.consigneeAddressPath[1]
|
||||
}}</span>
|
||||
<span v-if="address.consigneeAddressPath[2]">{{
|
||||
address.consigneeAddressPath[2]
|
||||
}}</span>
|
||||
|
||||
<span v-if="address.consigneeAddressPath[3]">{{
|
||||
address.consigneeAddressPath[3]
|
||||
}}</span>
|
||||
<span>
|
||||
<div class="user-address">
|
||||
<!-- 省市区 -->
|
||||
<div class="flex flex-a-c">
|
||||
<span class="default" v-if="address.isDefault">默认</span>
|
||||
<div class="address-list" v-if="address.consigneeAddressPath.length != 0">
|
||||
<span class="address-item" v-for="(item,index) in address.consigneeAddressPath" :key="index">
|
||||
{{item}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 详细地址 -->
|
||||
<div class="user-address-detail wes-2">
|
||||
{{ address.detail }}
|
||||
</span>
|
||||
</div>
|
||||
<!-- 姓名 手机号 -->
|
||||
<div>
|
||||
<span>{{ address.name }}</span>
|
||||
<span class="mobile">{{ address.mobile | secrecyMobile }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</u-col>
|
||||
<u-col :span="1" @click.native="
|
||||
navigateTo('/pages/mine/address/address?way=' + routerVal.way)
|
||||
" style="text-align: right">
|
||||
<u-icon name="arrow-right" style="color: #bababa"></u-icon>
|
||||
</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
<u-icon name="arrow-right" style="color: #bababa"></u-icon>
|
||||
</div>
|
||||
<!-- 背景 -->
|
||||
<div class="bar"></div>
|
||||
</div>
|
||||
<!-- 背景 -->
|
||||
<div class="bar"></div>
|
||||
|
||||
<!-- 开团信息 -->
|
||||
<view class="group-box" v-if="isAssemble">
|
||||
|
|
@ -64,7 +53,6 @@
|
|||
width="81rpx" height="81rpx">
|
||||
<view slot="loading"></view>
|
||||
</u-image>
|
||||
|
||||
<u-image class="head-img" borderRadius="50%" shape="square" v-else width="81rpx" height="81rpx"
|
||||
:src="endWay.face || '/static/missing-face.png'"></u-image>
|
||||
|
||||
|
|
@ -75,43 +63,30 @@
|
|||
|
||||
<!-- 店铺商品信息 -->
|
||||
<div class="box box2" v-for="(item, index) in orderMessage.cartList" :key="index">
|
||||
<u-row class="tab1" @click="navigateToStore(item)">
|
||||
<u-col :offset="0">
|
||||
<span class="ybname">{{ item.storeName }}</span>
|
||||
</u-col>
|
||||
</u-row>
|
||||
<div @click="navigateToStore(item)">
|
||||
<div class="store-name">
|
||||
<span>{{ item.storeName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="promotionNotice">{{ item.promotionNotice || '' }}</div>
|
||||
<u-row class="goodsBorder" v-for="(val, i) in item.skuList" :key="i">
|
||||
<u-col class="tabL" :offset="0"
|
||||
<div class="flex goods-item" v-for="(val, i) in item.skuList" :key="i">
|
||||
<div class="goods-image"
|
||||
@click="navigateTo('/pages/product/goods?id=' + val.goodsSku.id+'&goodsId='+val.goodsSku.goodsId)" :span="3">
|
||||
<u-image borderRadius="10rpx" :src="val.goodsSku.thumbnail" alt />
|
||||
</u-col>
|
||||
<u-col :span="9"
|
||||
@click="navigateTo('/pages/product/goods?id=' + val.goodsSku.id+'&goodsId='+val.goodsSku.goodsId)"
|
||||
class="tabC">
|
||||
<div style="overflow: hidden">
|
||||
<p class="sp_name">{{ val.goodsSku.goodsName }}</p>
|
||||
<p class="sp_promotion" v-if="val.promotion_tags">
|
||||
<view class="sp_tag sp_tag_plain" v-for="(promotion_item, promotion_index) in val.promotion_tags"
|
||||
:key="promotion_index">{{ promotion_item }}</view>
|
||||
</p>
|
||||
<u-image borderRadius="10rpx" width="200rpx" height="200rpx" :src="val.goodsSku.thumbnail" alt />
|
||||
</div>
|
||||
<div @click="navigateTo('/pages/product/goods?id=' + val.goodsSku.id+'&goodsId='+val.goodsSku.goodsId)"
|
||||
class="goods-detail">
|
||||
<div class="flex">
|
||||
<p class="goods-name">{{ val.goodsSku.goodsName }}</p>
|
||||
<span class="nums">x{{ val.num }}</span>
|
||||
</div>
|
||||
|
||||
<p class="sp_number">￥{{ val.goodsSku.price | unitPrice }}</p>
|
||||
|
||||
</u-col>
|
||||
</u-row>
|
||||
|
||||
<u-row>
|
||||
<u-col :offset="0" :span="4" class="tl" style="text-align: left">备注信息</u-col>
|
||||
<u-col :span="8" textAlign="right">
|
||||
<u-input style="text-align:right;" class="uinput" v-model="remarkVal[index].remark" />
|
||||
</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
<!-- 订单信息 -->
|
||||
<div class="box box3">
|
||||
<p class="goods-prices">
|
||||
<span>￥</span>
|
||||
<span class="goods-price">{{formatPrice(val.goodsSku.price)[0]}}</span>
|
||||
<span>.{{formatPrice(val.goodsSku.price)[1] }}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<u-row>
|
||||
<u-col :offset="0" :span="4">发票信息</u-col>
|
||||
<u-col :span="8" class="tipsColor" textAlign="right" @click.native="invoice()">
|
||||
|
|
@ -119,37 +94,25 @@
|
|||
<span v-else>不开发票</span>
|
||||
</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
|
||||
<!-- 发票信息 -->
|
||||
<invoices :res="receiptList" @callbackInvoice="callbackInvoice" v-if="invoiceFlag" />
|
||||
<u-select v-model="shippingFlag" :list="shippingMethod"></u-select>
|
||||
|
||||
<!-- 优惠券 -->
|
||||
<div class="box box4">
|
||||
<u-row>
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :offset="0" :span="9" @click="shippingFlag = true">配送方式
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :offset="0" :span="9" @click="shippingFlag = true">配送
|
||||
</u-col>
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :span="3" textAlign="right" @click="shippingFlag = true">
|
||||
{{shippingMethod.find(e=>{ return e.value == shippingText; }).label }}
|
||||
</u-col>
|
||||
</u-row>
|
||||
<u-row>
|
||||
<u-col :offset="0" :span="9" @click="GET_Discount()">优惠券</u-col>
|
||||
|
||||
<u-col :span="3" v-if="orderMessage.priceDetailDTO && orderMessage.priceDetailDTO.couponPrice" textAlign="right"
|
||||
@click="GET_Discount()">
|
||||
<span class="main-color">-￥{{orderMessage.priceDetailDTO.couponPrice | unitPrice}}</span>
|
||||
</u-col>
|
||||
<!-- orderMessage.priceDetailDTO.couponPrice | unitPrice -->
|
||||
<u-col :span="3" v-else textAlign="right" @click="GET_Discount()">
|
||||
{{ orderMessage.canUseCoupons.length || "0" }}张可用
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
<u-col :offset="0" :span="4" class="tl" style="text-align: left">备注信息</u-col>
|
||||
<u-col :span="8" textAlign="right">
|
||||
<u-input style="text-align:right;" class="uinput" v-model="remarkVal[index].remark" />
|
||||
</u-col>
|
||||
</u-row>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 发票信息 -->
|
||||
<invoices :res="receiptList" @callbackInvoice="callbackInvoice" v-if="invoiceFlag" />
|
||||
<u-select v-model="shippingFlag" :list="shippingMethod"></u-select>
|
||||
|
||||
<div class="box box5" v-if="orderMessage.priceDetailDTO">
|
||||
<div>
|
||||
<u-row>
|
||||
|
|
@ -163,34 +126,45 @@
|
|||
<u-row>
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :span="7">运费</u-col>
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :span="5" class="tr tipsColor" textAlign="right">
|
||||
<u-tag v-if="orderMessage.priceDetailDTO.freightPrice == 0" style="margin-right: 20rpx" color="#FF6262"
|
||||
text="包邮" type="warning" size="mini" mode="plain" shape="circle" />
|
||||
<span v-if="orderMessage.priceDetailDTO.freightPrice == 0">包邮</span>
|
||||
<span v-else>￥{{
|
||||
orderMessage.priceDetailDTO.freightPrice | unitPrice
|
||||
}}</span>
|
||||
</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
<u-row>
|
||||
<u-col :offset="0" :span="9" @click="GET_Discount()">优惠券</u-col>
|
||||
|
||||
<u-col :span="3" v-if="orderMessage.priceDetailDTO && orderMessage.priceDetailDTO.couponPrice" textAlign="right"
|
||||
@click="GET_Discount()">
|
||||
<span class="main-color">-￥{{orderMessage.priceDetailDTO.couponPrice | unitPrice}}</span>
|
||||
</u-col>
|
||||
<!-- orderMessage.priceDetailDTO.couponPrice | unitPrice -->
|
||||
<u-col :span="3" v-else textAlign="right" @click="GET_Discount()">
|
||||
{{ orderMessage.canUseCoupons.length || "0" }} 张可用
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</u-col>
|
||||
</u-row>
|
||||
<div>
|
||||
<u-row>
|
||||
<u-col :span="9">优惠金额</u-col>
|
||||
<u-col :span="3" textAlign="right">-￥{{ orderMessage.priceDetailDTO.couponPrice | unitPrice }}</u-col>
|
||||
<u-col :span="3" textAlign="right" v-if=" orderMessage.priceDetailDTO.couponPrice">
|
||||
-￥{{ orderMessage.priceDetailDTO.couponPrice | unitPrice }}</u-col>
|
||||
<u-col :span="3" textAlign="right" v-else>0.00</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
<div>
|
||||
<u-row>
|
||||
<u-col :span="6">活动优惠</u-col>
|
||||
<u-col :span="6" class="tr tipsColor" textAlign="right">
|
||||
<u-tag style="margin-right: 20rpx" v-if="orderMessage.priceDetailDTO.discountPrice != 0" color="#FF6262"
|
||||
:text="`优惠 ${orderMessage.priceDetailDTO.discountPrice} 元`" type="warning" size="mini" mode="plain"
|
||||
shape="circle" />
|
||||
<span>{{
|
||||
orderMessage.priceDetailDTO.discountPrice | unitPrice
|
||||
}}</span>
|
||||
<span
|
||||
v-if="orderMessage.priceDetailDTO.discountPrice">-￥{{orderMessage.priceDetailDTO.discountPrice | unitPrice}}</span>
|
||||
<span v-else>0.00</span>
|
||||
</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 配送地区没有提示 -->
|
||||
|
|
@ -200,13 +174,14 @@
|
|||
</div>
|
||||
|
||||
<!-- 结账 -->
|
||||
|
||||
<div class="box6 mp-iphonex-bottom" v-if="orderMessage.priceDetailDTO">
|
||||
<div class="tabbar-left">
|
||||
合计：
|
||||
<span v-if="!orderMessage.priceDetailDTO.payPoint" class="number">
|
||||
¥
|
||||
<span>{{ orderMessage.priceDetailDTO.flowPrice | unitPrice }}</span>
|
||||
</span>
|
||||
<div v-if="!orderMessage.priceDetailDTO.payPoint" class="number">
|
||||
<span>¥</span>
|
||||
<span class="price">{{ formatPrice(orderMessage.priceDetailDTO.flowPrice)[0] }}</span>
|
||||
<span>.{{formatPrice(orderMessage.priceDetailDTO.flowPrice)[1] }} </span>
|
||||
</div>
|
||||
<span v-else class="number"><span
|
||||
style="margin-right:10rpx;">{{orderMessage.priceDetailDTO.payPoint | unitPrice }}</span>积分</span>
|
||||
</div>
|
||||
|
|
@ -338,6 +313,13 @@ export default {
|
|||
mounted() {},
|
||||
|
||||
methods: {
|
||||
// 格式化金钱 1999 --> [1999,00]
|
||||
formatPrice(val) {
|
||||
if (typeof val == "undefined") {
|
||||
return val;
|
||||
}
|
||||
return val.toFixed(2).split(".");
|
||||
},
|
||||
//发票回调 选择发票之后刷新购物车
|
||||
async callbackInvoice(val) {
|
||||
this.invoiceFlag = false;
|
||||
|
|
@ -567,7 +549,16 @@ export default {
|
|||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
page {
|
||||
background: #ededed !important;
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.flex-8 {
|
||||
flex: 8;
|
||||
}
|
||||
|
||||
.main-color {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
@ -578,12 +569,13 @@ export default {
|
|||
}
|
||||
.promotionNotice {
|
||||
font-size: 24rpx;
|
||||
margin: 20rpx 0;
|
||||
color: $aider-light-color;
|
||||
}
|
||||
.nums {
|
||||
flex: 2;
|
||||
color: $light-color;
|
||||
float: right;
|
||||
width: 15%;
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
.wait {
|
||||
|
|
@ -632,11 +624,8 @@ export default {
|
|||
|
||||
.group-title {
|
||||
text-align: center;
|
||||
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC, PingFang SC-Regular;
|
||||
font-weight: 400;
|
||||
|
||||
color: $light-color;
|
||||
}
|
||||
|
||||
|
|
@ -652,7 +641,6 @@ export default {
|
|||
|
||||
.group {
|
||||
width: 100%;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
|
@ -673,15 +661,7 @@ export default {
|
|||
height: 4rpx;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
background: url("/pages/floor/imgs/line.png") no-repeat;
|
||||
}
|
||||
|
||||
.tabC {
|
||||
> p {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
background: url("@/pages/order/imgs/line.png") no-repeat;
|
||||
}
|
||||
|
||||
.box2 {
|
||||
|
|
@ -710,21 +690,6 @@ export default {
|
|||
width: 100% !important;
|
||||
}
|
||||
|
||||
.userClass {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: $u-content-color;
|
||||
> span {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.userAdress {
|
||||
margin: 20rpx 0;
|
||||
color: $u-tips-color;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.box6 {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
|
|
@ -763,7 +728,7 @@ export default {
|
|||
border-radius: 0.4em;
|
||||
}
|
||||
|
||||
.sp_promotion {
|
||||
.goods-promotion {
|
||||
float: left;
|
||||
width: 75%;
|
||||
margin: 4rpx 0;
|
||||
|
|
@ -783,15 +748,9 @@ export default {
|
|||
margin-left: 0;
|
||||
}
|
||||
|
||||
.sp_name {
|
||||
float: left;
|
||||
width: 75%;
|
||||
.goods-name {
|
||||
flex: 8;
|
||||
font-size: 28rpx;
|
||||
overflow: hidden;
|
||||
|
||||
text-overflow: ellipsis;
|
||||
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.sp_type {
|
||||
|
|
@ -803,28 +762,21 @@ export default {
|
|||
.number {
|
||||
color: $main-color;
|
||||
font-size: 26rpx;
|
||||
margin-left: 10rpx;
|
||||
|
||||
font-weight: bold;
|
||||
> span {
|
||||
font-size: 36rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sp_number {
|
||||
color: $light-color;
|
||||
.goods-prices {
|
||||
margin: 10rpx 0;
|
||||
color: $main-color;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.box1 {
|
||||
background: #f6f6f6 !important;
|
||||
min-height: 166rpx;
|
||||
// height: 200rpx;
|
||||
|
||||
/deep/ .u-row {
|
||||
border: none;
|
||||
font-weight: bold;
|
||||
> .goods-price {
|
||||
font-size: 38rpx;
|
||||
padding: 0 2rpx;
|
||||
}
|
||||
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.box {
|
||||
|
|
@ -832,18 +784,19 @@ export default {
|
|||
overflow: hidden;
|
||||
background: #fff;
|
||||
margin-bottom: 20rpx;
|
||||
color: #666;
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
background: #f9f9f9;
|
||||
height: auto;
|
||||
background: #ededed;
|
||||
padding-bottom: 200rpx;
|
||||
overflow: auto !important;
|
||||
}
|
||||
|
||||
.ybname {
|
||||
margin-left: 20rpx;
|
||||
.store-name {
|
||||
margin-top: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
|
@ -854,18 +807,67 @@ export default {
|
|||
|
||||
/deep/ .u-col-3,
|
||||
.tipsColor {
|
||||
color: $u-tips-color;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.tabL {
|
||||
.goods-image {
|
||||
text-align: left;
|
||||
overflow: hidden;
|
||||
}
|
||||
.default {
|
||||
background: $main-color;
|
||||
font-size: 24rpx;
|
||||
border-radius: 8rpx;
|
||||
padding: 0rpx 12rpx;
|
||||
color: #fff;
|
||||
}
|
||||
.address-box {
|
||||
border-radius: 40rpx;
|
||||
border-top-left-radius: 0 !important;
|
||||
border-top-right-radius: 0 !important;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
margin-bottom: 20rpx;
|
||||
color: #666;
|
||||
}
|
||||
.address-list {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
.address-item {
|
||||
font-weight: normal;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
.user-box {
|
||||
padding: 32rpx;
|
||||
}
|
||||
.user-address-detail {
|
||||
color: #333;
|
||||
font-size: 38rpx;
|
||||
font-weight: bold;
|
||||
margin: 20rpx 0;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
.mobile {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
.price {
|
||||
font-size: 50rpx !important;
|
||||
margin: 0 2rpx;
|
||||
}
|
||||
.goods-detail {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
/deep/ .u-image,
|
||||
.u-image__image {
|
||||
width: 132rpx !important;
|
||||
height: 132rpx !important;
|
||||
border-radius: 0.4em !important;
|
||||
justify-content: center;
|
||||
flex: 8;
|
||||
margin-left: 20rpx !important;
|
||||
> p {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
.goods-item {
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 367 B After Width: | Height: | Size: 367 B |
|
|
@ -81,7 +81,7 @@ page {
|
|||
</style>
|
||||
<style scoped lang="scss">
|
||||
.box {
|
||||
padding: 32rpx;
|
||||
padding: 0 32rpx;
|
||||
background: #fff;
|
||||
}
|
||||
.buy {
|
||||
|
|
@ -99,6 +99,7 @@ page {
|
|||
flex: 1;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
|
||||
align-items: center;
|
||||
}
|
||||
.tips {
|
||||
|
|
@ -119,6 +120,12 @@ page {
|
|||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
.flex {
|
||||
border-bottom: 1rpx solid #f7f7f7;
|
||||
|
||||
padding: 20rpx 0;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
.SUCCESS {
|
||||
color: $light-color;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,8 @@
|
|||
<scroll-view scroll-x>
|
||||
<view class="index-navs">
|
||||
<view class="index-nav-v">
|
||||
<view class="index-nav" :class="{ 'index-nav-active': nav == index }" @click="clickNavigateTime(index)" v-for="(item, index) in timeLine" :key="index">
|
||||
<view class="index-nav" :class="{ 'index-nav-active': nav == index }" @click="clickNavigateTime(index)"
|
||||
v-for="(item, index) in timeLine" :key="index">
|
||||
{{ item.timeLine }}:00
|
||||
<view class="index-nav-desc">{{ index === 0 && item.distanceStartTime === 0 ? '抢购中' : '即将开始' }}
|
||||
</view>
|
||||
|
|
@ -34,7 +35,8 @@
|
|||
</view>
|
||||
<view class="sale-item-surplus">
|
||||
仅剩{{ item.quantity - item.salesNum }}件
|
||||
<view class="sale-item-surplus-text" :style="{ width: (item.quantity / (item.quantity - item.salesNum)) * 100 + '%' }">
|
||||
<view class="sale-item-surplus-text"
|
||||
:style="{ width: (item.quantity / (item.quantity - item.salesNum)) * 100 + '%' }">
|
||||
</view>
|
||||
</view>
|
||||
<view class="sale-item-btn" @click="navigateToGoodsDetail(item)">
|
||||
|
|
@ -160,6 +162,7 @@ export default {
|
|||
*/
|
||||
clickNavigateTime(type) {
|
||||
this.nav = type;
|
||||
this.goodsList = [];
|
||||
this.diffTime = parseInt(new Date().getTime() / 1000) - this.resTime;
|
||||
this.time =
|
||||
this.timeLine[this.nav].distanceStartTime ||
|
||||
|
|
|
|||
|
|
@ -1,14 +1,18 @@
|
|||
|
||||
<template>
|
||||
<div class="layout">
|
||||
<div class="goods-cell-title">
|
||||
<div class="goods-item-title" :class="{ 'selected-title': selected.index == index }" @click="handleClickTitle(title, index)" v-for="(title, index) in res.list[0].titleWay" :key="index">
|
||||
<h4 class="h4">{{ title.title }}</h4>
|
||||
<div>{{ title.desc }}</div>
|
||||
<u-sticky >
|
||||
<div class="goods-cell-title">
|
||||
<div class="goods-item-title" :class="{ 'selected-title': selected.index == index }"
|
||||
@click="handleClickTitle(title, index)" v-for="(title, index) in res.list[0].titleWay" :key="index">
|
||||
<h4 class="h4">{{ title.title }}</h4>
|
||||
<div>{{ title.desc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</u-sticky>
|
||||
<div class="goods-list">
|
||||
<div v-if="selected.val == item.type" @click="handleClick(item)" class="goods-item" v-for="(item, item_index) in res.list[0].listWay" :key="item_index">
|
||||
<div v-if="selected.val == item.type" @click="handleClick(item)" class="goods-item"
|
||||
v-for="(item, item_index) in res.list[0].listWay" :key="item_index">
|
||||
<div class="goods-img">
|
||||
<u-image :src="item.img" height="350rpx" mode="aspectFit" width="100%">
|
||||
<u-loading slot="loading"></u-loading>
|
||||
|
|
@ -49,6 +53,11 @@ export default {
|
|||
immediate: true,
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
this.$u.getRect('.goods-cell-title').then(res=>{
|
||||
console.log(res)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
handleClick(item) {
|
||||
uni.navigateTo({
|
||||
|
|
@ -86,6 +95,7 @@ $w_94: 94%;
|
|||
}
|
||||
|
||||
.goods-cell-title {
|
||||
background: #f9f9f9;
|
||||
padding: 10px;
|
||||
transition: 0.35s;
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -25,7 +25,9 @@
|
|||
<textPicture v-if="item.type == 'textPicture'" :res="item.options" />
|
||||
<menuLayout v-if="item.type == 'menu'" :res="item.options" />
|
||||
<flexOne v-if="item.type == 'flexOne'" :res="item.options" />
|
||||
|
||||
<goods v-if="item.type == 'goods'" :res="item.options" />
|
||||
|
||||
<group v-if="item.type == 'group'" :res="item.options" />
|
||||
<!-- <joinGroup v-if="item.type == 'joinGroup'" :res="item.options" /> -->
|
||||
<!-- <integral v-if="item.type == 'integral'" :res="item.options" /> -->
|
||||
|
|
@ -94,8 +96,6 @@ export default {
|
|||
},
|
||||
|
||||
mounted() {
|
||||
|
||||
|
||||
this.init();
|
||||
// #ifdef MP-WEIXIN
|
||||
// 小程序默认分享
|
||||
|
|
|
|||
Loading…
Reference in New Issue