This commit is contained in:
2025-10-27 15:55:29 +08:00
commit 6632080b83
513 changed files with 117442 additions and 0 deletions

View File

@@ -0,0 +1,323 @@
<template>
<page-meta :page-style="themeColor"></page-meta>
<view class="content">
<view class="head-wrap">
<!-- 搜索区域 -->
<view class="search-wrap uni-flex uni-row" style="margin-bottom: 20rpx;">
<!-- <view class="flex-item input-wrap">
<input class="uni-input" maxlength="50" v-model="keyword" @confirm="search()" placeholder="请输入您要搜索的商品" />
<text class="iconfont icon-sousuo3" @click.stop="search()"></text>
</view>
<view class="iconfont" :class="{ 'icon-apps': isList, 'icon-list': !isList }" @click="changeListStyle()"></view> -->
<view style="width: 100rpx;height: 100rpx;">
<image :src="$util.img(merch.merch_image)" mode="widthFix" style="width: 100rpx;height: 100rpx;" />
</view>
<view style="margin-left: 20rpx;padding-top: 22rpx;">
<view style="line-height: 1;font-size: 32rpx;font-weight: 600;">{{merch.merch_name}}</view>
<view style="color:rgb(255 202 40)">
<text class="icox icox-xing"></text>
<text class="icox icox-xing"></text>
<text class="icox icox-xing"></text>
<text class="icox icox-xing"></text>
<text class="icox icox-xing"></text>
</view>
</view>
</view>
<!-- 排序 -->
<view class="sort-wrap">
<view class="comprehensive-wrap" :class="{ 'color-base-text': orderType === '' }" @click="sortTabClick('')">
<text :class="{ 'color-base-text': orderType === '' }">综合</text>
</view>
<view :class="{ 'color-base-text': orderType === 'sale_num' }" @click="sortTabClick('sale_num')">销量
</view>
<view class="price-wrap" @click="sortTabClick('discount_price')">
<text :class="{ 'color-base-text': orderType === 'discount_price' }">价格</text>
<view class="iconfont-wrap">
<view class="iconfont icon-iconangledown-copy asc" :class="{ 'color-base-text': priceOrder === 'asc' && orderType === 'discount_price' }"></view>
<view class="iconfont icon-iconangledown desc" :class="{ 'color-base-text': priceOrder === 'desc' && orderType === 'discount_price' }"></view>
</view>
</view>
<!-- <view :class="{ 'color-base-text': orderType === 'screen' }" class="screen-wrap">
<text @click="sortTabClick('screen')">筛选</text>
<view @click="sortTabClick('screen')" class="iconfont-wrap">
<view class="iconfont icon-shaixuan color-tip"></view>
</view>
</view> -->
</view>
</view>
<mescroll-uni top="240" ref="mescroll" @getData="getGoodsList">
<block slot="list">
<view class="goods-list single-column" :class="{ show: isList }">
<view class="goods-item margin-bottom" v-for="(item, index) in goodsList" :key="index" @click="toDetail(item)">
<view class="goods-img">
<image :src="goodsImg(item.goods_image)" mode="widthFix" @error="imgError(index)"></image>
<view class="color-base-bg goods-tag" v-if="goodsTag(item) != ''">{{ goodsTag(item) }}</view>
<view class="sell-out" v-if="item.stock <= 0">
<text class="iconfont icon-shuqing"></text>
</view>
</view>
<view class="info-wrap">
<view class="name-wrap">
<view class="goods-name" :class="[{ 'using-hidden': config.nameLineMode == 'single' }, { 'multi-hidden': config.nameLineMode == 'multiple' }]">
{{ item.goods_name }}
</view>
</view>
<view class="lineheight-clear">
<view class="discount-price" v-if="item.isinformation == 0">
<text class="unit price-style small">{{ $lang('common.currencySymbol') }}</text>
<text class="price price-style large">{{ parseFloat(showPrice(item)).toFixed(2).split('.')[0] }}</text>
<text class="unit price-style small">.{{ parseFloat(showPrice(item)).toFixed(2).split('.')[1] }}</text>
</view>
<view class="discount-price" v-else>
<text class="price price-style large">咨询</text>
</view>
<view class="member-price-tag" v-if="item.member_price && item.member_price == showPrice(item)">
<image :src="$util.img('public/uniapp/index/VIP.png')" mode="widthFix"></image>
</view>
<view class="member-price-tag" v-else-if="item.promotion_type == 1">
<image :src="$util.img('public/uniapp/index/discount.png')" mode="widthFix"></image>
</view>
</view>
<view class="pro-info" v-if="item.isinformation == 0">
<view class="delete-price color-tip price-font" v-if="showMarketPrice(item)">
<text class="unit">{{ $lang('common.currencySymbol') }}</text>
<text>{{ showMarketPrice(item) }}</text>
</view>
<view class="block-wrap">
<view class="sale color-tip" v-if="item.sale_show">已售{{ item.sale_num }}{{ item.unit ? item.unit : '' }}</view>
</view>
<view class="cart-action-wrap" v-if="config.control && item.is_virtual == 0">
<!-- 购物车图标 -->
<view v-if="config.style == 'icon-cart'" :style="{
color: config.theme == 'diy' ? config.textColor : '',
borderColor: config.theme == 'diy' ? config.textColor : ''
}" class="cart shopping-cart-btn iconfont icon-gouwuche click-wrap" :id="'goods-' + item.id"
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
<view class="click-event"></view>
</view>
<!--加号图标 -->
<view v-else-if="config.style == 'icon-add'" :style="{
color: config.theme == 'diy' ? config.textColor : '',
borderColor: config.theme == 'diy' ? config.textColor : ''
}" class="cart plus-sign-btn iconfont icon-add1 click-wrap" :id="'goods-' + item.id"
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
<view class="click-event"></view>
</view>
<!-- 按钮 -->
<view v-else-if="config.style == 'button'" :style="{
backgroundColor: config.theme == 'diy' ? config.bgColor : '',
color: config.theme == 'diy' ? config.textColor : '',
fontWeight: config.theme == 'diy' ? (config.fontWeight ? 'bold' : 'normal') : '',
padding: config.theme == 'diy' ? '12rpx ' + config.padding * 2 + 'rpx' : ''
}" class="cart buy-btn click-wrap" :id="'goods-' + item.id"
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
{{ config.text }}
<view class="click-event"></view>
</view>
<!--自定义图标 -->
<view v-else-if="config.style == 'icon-diy'" :style="{
color: config.theme == 'diy' ? config.textColor : ''
}" class="icon-diy click-wrap" :id="'goods-' + item.id"
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
<view class="click-event"></view>
<diy-icon :icon="config.iconDiy.icon" :value="config.iconDiy.style ? config.iconDiy.style : null"></diy-icon>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="goods-list double-column" :class="{ show: !isList }">
<view class="goods-item margin-bottom" v-for="(item, index) in goodsList" :key="index"
@click="toDetail(item)" :style="{ left: listPosition[index] ? listPosition[index].left : '', top: listPosition[index] ? listPosition[index].top : '' }">
<view class="goods-img">
<image :src="goodsImg(item.goods_image)" mode="widthFix" @error="imgError(index)"></image>
<view class="color-base-bg goods-tag" v-if="goodsTag(item) != ''">{{ goodsTag(item) }}</view>
<view class="sell-out" v-if="item.stock <= 0">
<text class="iconfont icon-shuqing"></text>
</view>
</view>
<view class="info-wrap">
<view class="goods-name" :class="[{ 'using-hidden': config.nameLineMode == 'single' }, { 'multi-hidden': config.nameLineMode == 'multiple' }]">
{{ item.goods_name }}
</view>
<view class="lineheight-clear">
<view class="discount-price" v-if="item.isinformation == 0">
<text class="unit price-style small">{{ $lang('common.currencySymbol') }}</text>
<text class="price price-style large">{{ parseFloat(showPrice(item)).toFixed(2).split('.')[0] }}</text>
<text class="unit price-style small">.{{ parseFloat(showPrice(item)).toFixed(2).split('.')[1] }}</text>
</view>
<view class="discount-price" v-else>
<text class="price price-style large">咨询</text>
</view>
<view class="member-price-tag" v-if="item.member_price && item.member_price == showPrice(item)">
<image :src="$util.img('public/uniapp/index/VIP.png')" mode="widthFix"></image>
</view>
<view class="member-price-tag" v-else-if="item.promotion_type == 1">
<image :src="$util.img('public/uniapp/index/discount.png')" mode="widthFix"></image>
</view>
<view class="delete-price color-tip price-font" v-if="showMarketPrice(item)">
<text class="unit">{{ $lang('common.currencySymbol') }}</text>
<text>{{ showMarketPrice(item) }}</text>
</view>
</view>
<view class="pro-info" v-if="item.isinformation == 0">
<view class="block-wrap" >
<view class="sale color-tip" v-if="item.sale_show">已售{{ item.sale_num }}{{ item.unit ? item.unit : '' }}</view>
</view>
<view class="cart-action-wrap" v-if="config.control && item.is_virtual == 0">
<!-- 购物车图标 -->
<view v-if="config.style == 'icon-cart'" :style="{
color: config.theme == 'diy' ? config.textColor : '',
borderColor: config.theme == 'diy' ? config.textColor : ''
}" class="cart shopping-cart-btn iconfont icon-gouwuche click-wrap" :id="'goods-' + item.id"
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
<view class="click-event"></view>
</view>
<!--加号图标 -->
<view v-else-if="config.style == 'icon-add'" :style="{
color: config.theme == 'diy' ? config.textColor : '',
borderColor: config.theme == 'diy' ? config.textColor : ''
}" class="cart plus-sign-btn iconfont icon-add1 click-wrap" :id="'goods-' + item.id"
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
<view class="click-event"></view>
</view>
<!-- 按钮 -->
<view v-else-if="config.style == 'button'" :style="{
backgroundColor: config.theme == 'diy' ? config.bgColor : '',
color: config.theme == 'diy' ? config.textColor : '',
fontWeight: config.theme == 'diy' ? (config.fontWeight ? 'bold' : 'normal') : '',
padding: config.theme == 'diy' ? '12rpx ' + config.padding * 2 + 'rpx' : ''
}" class="cart buy-btn click-wrap" :id="'goods-' + item.id"
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
{{ config.text }}
<view class="click-event"></view>
</view>
<!--自定义图标 -->
<view v-else-if="config.style == 'icon-diy'" :style="{
color: config.theme == 'diy' ? config.textColor : ''
}" class="icon-diy click-wrap" :id="'goods-' + item.id"
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
<view class="click-event"></view>
<diy-icon :icon="config.iconDiy.icon" :value="config.iconDiy.style ? config.iconDiy.style : null"></diy-icon>
</view>
</view>
</view>
</view>
</view>
</view>
<view v-if="goodsList.length == 0 && emptyShow"><ns-empty text="暂无商品"></ns-empty></view>
</block>
</mescroll-uni>
<ns-goods-sku-index ref="goodsSkuIndex" @addCart="addCart"></ns-goods-sku-index>
<!-- 筛选弹出框 -->
<uni-drawer :visible="showScreen" mode="right" @close="showScreen = false" class="screen-wrap">
<view class="title color-tip">筛选</view>
<scroll-view scroll-y>
<!-- 包邮 -->
<!-- <view class="item-wrap">
<view class="label"><text>是否包邮</text></view>
<view class="list">
<uni-tag :inverted="true" text="包邮" :type="isFreeShipping ? 'primary' : 'default'" @click="isFreeShipping = !isFreeShipping" />
</view>
</view> -->
<!-- 价格筛选项 -->
<!-- <view class="item-wrap">
<view class="label"><text>价格区间()</text></view>
<view class="price-wrap">
<input class="uni-input" type="digit" v-model="minPrice" placeholder="最低价" />
<view class="h-line"></view>
<input class="uni-input" type="digit" v-model="maxPrice" placeholder="最高价" />
</view>
</view> -->
<!-- 品牌筛选项 -->
<!-- <view class="item-wrap" v-if="brandList.length > 0">
<view class="label"><text>品牌</text></view>
<view class="list">
<view v-for="(item, index) in brandList" :key="index">
<uni-tag :inverted="true" :text="item.brand_name" :type="item.brand_id == brandId ? 'primary' : 'default'" @click="brandId == item.brand_id ? (brandId = 0) : (brandId = item.brand_id)" />
</view>
</view>
</view> -->
<!-- 分类筛选项 -->
<view class="category-list-wrap">
<text class="first">全部分类</text>
<view class="class-box">
<view @click="selectedCategory('')" class="list-wrap">
<text :class="{ selected: !categoryId, 'color-base-text': !categoryId }">全部</text>
</view>
<view @click="selectedCategory(item.category_id)" v-for="(item, index) in categoryList" :key="index" class="list-wrap">
<text :class="{ selected: item.category_id == categoryId, 'color-base-text': item.category_id == categoryId }">{{ item.category_name }}</text>
</view>
</view>
</view>
</scroll-view>
<view class="footer" :class="{ 'safe-area': isIphoneX }">
<button type="default" class="footer-box" @click="resetData">重置</button>
<button type="primary" class="footer-box1" @click="screenData">确定</button>
</view>
</uni-drawer>
<loading-cover ref="loadingCover"></loading-cover>
<!-- #ifdef MP-WEIXIN -->
<!-- 小程序隐私协议 -->
<privacy-popup ref="privacyPopup"></privacy-popup>
<!-- #endif -->
</view>
</template>
<script>
import uniDrawer from '@/components/uni-drawer/uni-drawer.vue';
import uniTag from '@/components/uni-tag/uni-tag.vue';
import nsGoodsSkuIndex from '@/components/ns-goods-sku/ns-goods-sku-index.vue';
import list from './public/js/list.js';
export default {
components: {
uniDrawer,
uniTag,
nsGoodsSkuIndex
},
data() {
return {};
},
mixins: [list]
};
</script>
<style lang="scss">
@import './public/css/list.scss';
</style>
<style scoped>
>>>.uni-tag--primary.uni-tag--inverted {
background-color: #f5f5f5 !important;
}
/deep/ .sku-layer .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
max-height: unset !important;
}
</style>

View File

@@ -0,0 +1,266 @@
<template>
<page-meta :page-style="themeColor"></page-meta>
<view>
<view class="category-page-wrap category-template-1" style="height: calc(-56px + 100vh);">
<!-- <view class="search-box" @click="$util.redirectTo('/pages_tool/goods/search')">
<view class="search-content">
<input type="text" class="uni-input" maxlength="50" placeholder="商品搜索" confirm-type="search" disabled="true" />
<text class="iconfont icon-sousuo3"></text>
</view>
</view> -->
<view class="content-box" v-if="categoryTree">
<block v-if="categoryTree.length">
<scroll-view scroll-y="true" class="tree-wrap">
<view class="category-item-wrap">
<view class="category-item" v-for="(item, index) in categoryTree" :key="index" :class="[
{ select: select == index },
]" @click="switchOneCategory(index)">
<view class="">{{ item.category_name }}</view>
</view>
</view>
</scroll-view>
<view class="right-flex-wrap">
<scroll-view scroll-y="true" class="content-wrap" ref="contentWrap" :scroll-into-view="categoryId" :scroll-with-animation="true"
@scroll="listenScroll" @touchstart="touchStart" :refresher-enabled="true"
refresher-default-style="none" :refresher-triggered="triggered" @refresherrefresh="onRefresh"
@refresherrestore="onRestore">
<view class="child-category" v-for="(item, index) in categoryTree" :id="'category-' + index" v-if="item.child_list.length > 0">
<!---->
<view class="item-wrap category">
<view class="category-title">{{ item.category_name }}</view>
<view class="category-list">
<view class="category-item" v-for="(one, oneIndex) in item.child_list" :key="oneIndex" @click="$util.redirectTo('/pages_promotion/merch/detail', { merch_id: one.merch_id })">
<view class="img-box">
<image :src="$util.img(one.merch_image)" mode="widthFix"/>
</view>
<view class="name">{{ one.merch_name }}</view>
</view>
</view>
</view>
<!-- <view class="category-empty" v-else>
<image src="/static/common-empty.png" mode="widthFix"/>
</view> -->
</view>
</scroll-view>
</view>
</block>
<!-- <view class="category-empty">
<image :src="$util.img('public/uniapp/category/empty.png')" mode="widthFix"></image>
<view class="tips">暂时没有分类哦</view>
</view> -->
</view>
</view>
<ns-login ref="login"></ns-login>
<!-- <loading-cover ref="loadingCover"></loading-cover> -->
</view>
</template>
<script>
export default {
components: {},
data() {
return {
scrollTop: 0,
select: 0,
categoryId: 'category-0',
scrollLock: false,
triggered: true,
heightArea: [],
loadType: '',
categoryTree:[
/*{
category_id:6277,
category_name:"物业",
child_list:[
{
category_id:6572,
category_name:"鞋里革",
image:"attachment\/images\/979\/2024\/04\/y46Gg41i552o9iq9249295oz991444.jpg",
}
]
},*/
],
user_type:uni.getStorageSync('user_type')
};
},
onLoad() {
uni.hideTabBar()
this.getCategory()
// this.getgoodslist()
},
onShow() {
if (this.$refs.category) this.$refs.category[0].pageShow();
},
onUnload() {
if (!this.storeToken && this.$refs.login) this.$refs.login.cancelCompleteInfo();
},
methods: {
switchOnetype(e){
this.goods_type = e
this.select = -1;
this.categoryId = ''
this.getgoodslist()
},
/**
* 切换一级分类
* @param {Object} index
*/
switchOneCategory(index) {
if (index >= this.categoryTree.length) return;
this.select = index;
this.categoryId = 'category-' + index;
// 阻止切换分类之后滚动事件也立即执行
this.scrollLock = true;
console.log(index)
// this.goodsList = []
// this.getgoodslist()
},
touchStart() {
this.scrollLock = false;
},
/**
* 监听滚动
* @param {Object} event
*/
listenScroll(event) {
if (this.scrollLock) return;
let scrollTop = event.detail.scrollTop;
if (this.heightArea.length) {
for (let i = 0; i < this.heightArea.length; i++) {
if (scrollTop >= this.heightArea[i][0] && scrollTop <= this.heightArea[i][1]) {
this.select = i;
break;
}
}
if (this.value.template != 1 && this.value.loadType == 'all' && this.heightArea[this.select][1] -
scrollTop - contentWrapHeight < 300) {
this.$refs.categoryItem[this.select].getGoodsList();
}
}
},
sethead(item,type){
var is_select = item.is_select
this.$api.sendRequest({
url: 'app.ajax_batchheads',
data: {
goods_id:item.actId,
is_select:is_select
},
success: res => {
this.$util.showToast({
title: res.result.message
});
this.getgoodslist()
},
fail: () => {
this.$util.showToast({
title: 'request:fail'
});
}
});
},
//获取分类列表
getCategory(){
this.$api.sendRequest({
url: '/merch/api/merch/getcategory',
data: {
is_type_show:1,
},
success: res => {
console.log( res.data)
this.categoryTree = res.data
},
fail: () => {
this.$util.showToast({
title: 'request:fail'
});
}
});
},
onRefresh() {
this.triggered = false;
},
onRestore() {
this.triggered = 'restore'; // 需要重置
},
/**
* 触摸开始
* @param {Object} e
*/
// touchstart(e) {
// this.touchstartPosition = e.changedTouches[0].clientY;
// },
/**
* 触摸结束
* @param {Object} e
*/
touchend(e) {
let end = e.changedTouches[0].clientY;
if ((this.scrollType == 'top' || this.scrollType == 'none') && end - this.touchstartPosition > 100) {
// this.switchCategory('prev');
} else if ((this.scrollType == 'bottom' || this.scrollType == 'none') && this.touchstartPosition - end >
100) {
// this.switchCategory('next');
}
},
getDiyInfo() {
},
toLogin() {
this.$refs.login.open('/pages/goods/category')
}
},
// onPullDownRefresh() {
// uni.hideTabBar();
// this.getDiyInfo();
// }
};
</script>
<style lang="scss">
@import './public/category.scss';
/deep/ .uni-popup__wrapper.uni-center {
background: rgba(0, 0, 0, 0.6);
}
/deep/ .uni-popup__wrapper-box {
border-radius: 0 !important;
}
/deep/ .uni-popup__wrapper.uni-custom.center .uni-popup__wrapper-box {
overflow-y: visible;
}
/deep/ .loading-layer {
background: #fff !important;
}
// 分类四一级展开
/deep/ .category-template-4 .template-four .uni-popup__wrapper-box {
border-radius: 0px 0px 14px 14px !important;
overflow: hidden;
}
/deep/ .category-template-4 .content-wrap .categoty-goods-wrap .goods-list {
margin-top: 30rpx;
}
/deep/ .category-template-4 .content-wrap .goods-list .goods-item .footer-wrap .right-wrap .num-action {
width: 46rpx;
height: 46rpx;
}
/deep/ .uni-page-refresh-inner .uni-page-refresh__path {
stroke: rgb(1, 1, 1) !important;
}
</style>

View File

@@ -0,0 +1,929 @@
.category-page-wrap {
width: 100vw;
// height: calc(100vh - var(--tab-bar-height, 0));
display: flex;
flex-direction: column;
background-color: #fff;
}
.content-box {
flex: 1;
height: 0;
display: flex;
.tree-wrap {
width: 170rpx;
height: 100%;
background-color: #f5f5f5;
}
.right-flex-wrap {
flex: 1;
width: 0;
height: 100%;
background: #f4f6fa;
display: flex;
flex-direction: column;
transform: translateX(0px);
.content-wrap {
display: flex;
flex: 1;
height: 0;
width: 100%;
}
.child-category-wrap {
width: 100%;
height: 100%;
}
}
}
.tree-wrap .category-item-wrap {
height: auto;
background-color: #fff;
}
.tree-wrap .category-item {
line-height: 1.5;
padding: 26rpx 28rpx;
box-sizing: border-box;
position: relative;
background-color: #f5f5f5;
view {
color: #222222;
width: 100%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-align: center;
}
&.border-top {
border-bottom-right-radius: 12rpx;
}
&.border-bottom {
border-top-right-radius: 12rpx;
}
&.select {
background: #fff;
view {
color: $base-color;
font-weight: bold;
}
&::before {
content: ' ';
width: 8rpx;
height: 34rpx;
background: var(--base-color);
display: block;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
}
}
.search-box {
position: relative;
padding: 20rpx 30rpx;
display: flex;
align-items: center;
background: #fff;
.search-content {
position: relative;
/* #ifndef MP-WEIXIN */
height: 64rpx;
/* #endif */
/* #ifdef MP-WEIXIN */
height: 100%;
/* #endif */
border-radius: 40rpx;
flex: 1;
background-color: #f5f5f5;
input {
box-sizing: border-box;
display: block;
height: 100%;
width: 100%;
padding: 0 20rpx 0 40rpx;
background: #f5f5f5;
color: #333;
border-radius: 40rpx;
}
.iconfont {
position: absolute;
top: 50%;
right: 10rpx;
transform: translateY(-50%);
font-size: $font-size-toolbar;
z-index: 10;
color: #89899a;
width: 80rpx;
text-align: center;
}
}
}
.cart-box {
height: 100rpx;
width: 100%;
background: #fff;
border-top: 1px solid #f5f5f5;
box-sizing: border-box;
padding: 0 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
.left-wrap {
display: flex;
align-items: center;
}
.cart-icon {
width: 70rpx;
height: 70rpx;
position: relative;
.iconfont {
color: var(--btn-text-color);
width: inherit;
height: inherit;
background-color: $base-color;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.num {
position: absolute;
top: 0;
right: 0;
transform: translate(60%, 0);
display: inline-block;
box-sizing: border-box;
color: #fff;
line-height: 1.2;
text-align: center;
font-size: 24rpx;
padding: 0 6rpx;
min-width: 30rpx;
border-radius: 16rpx;
background-color: var(--price-color);
border: 2rpx solid #fff;
}
}
.price {
margin-left: 30rpx;
.title {
color: #333;
}
.money,
.unit {
font-weight: bold;
color: var(--price-color);
}
}
.settlement-btn {
margin: 0 0 0 20rpx;
width: 200rpx;
font-weight: bold;
border-radius: 50rpx;
height: 70rpx;
line-height: 70rpx;
}
}
.cart-point {
width: 26rpx;
height: 26rpx;
position: fixed;
z-index: 1000;
background: #f00;
border-radius: 50%;
transition: all 0.05s;
}
.category-empty {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
image {
width: 380rpx;
}
.tips {
font-size: 26rpx;
font-weight: 500;
color: #999;
margin-top: 50rpx;
}
}
.end-tips {
text-align: center;
color: #999;
font-size: 24rpx;
padding: 20rpx 0;
opacity: 0;
}
// 风格四
.category-template-4 {
.search-box {
.search-content input {
background-color: #f1f1f1;
}
}
.cart-box {
position: relative;
z-index: 2;
}
/deep/ .template-four {
position: relative;
z-index: 1;
.template-four-wrap {
position: relative;
z-index: 1;
padding-left: 20rpx;
padding-right: 80rpx;
padding-bottom: 10rpx;
display: flex;
height: 172rpx;
align-items: baseline;
box-sizing: border-box;
box-shadow: 0 4rpx 4rpx rgba(123, 123, 123, 0.1);
}
.template-four-popup {
display: flex;
flex-direction: column;
overflow: hidden;
.title {
line-height: 1;
margin-bottom: 20rpx;
font-weight: bold;
}
.template-four-scroll {
display: flex;
flex-wrap: wrap;
align-items: baseline;
align-content: baseline;
padding: 20rpx;
white-space: nowrap;
height: 380rpx;
box-sizing: border-box;
.uni-scroll-view-content {
flex-wrap: wrap;
align-items: baseline;
align-content: baseline;
}
.item {
display: flex;
flex-direction: column;
align-items: center;
padding: 4rpx 0;
color: #666;
margin-right: 16rpx;
border-radius: 40rpx;
margin-bottom: 10rpx;
width: calc((100% - 64rpx) / 5);
&:nth-child(5n + 5) {
margin-right: 0;
}
.image-warp {
margin-bottom: 6rpx;
padding: 4rpx;
display: flex;
align-items: center;
justify-content: center;
border-radius: 42rpx;
border: 4rpx solid transparent;
}
image {
width: 84rpx;
height: 84rpx;
border-radius: 32rpx;
}
.text {
padding: 2rpx 16rpx;
border-radius: 40rpx;
font-size: $font-size-tag;
}
&.selected {
.text {
background-color: $base-color;
color: var(--btn-text-color);
}
}
}
}
.pack-up {
font-size: $font-size-tag;
color: #888888;
height: 74rpx;
display: flex;
align-items: center;
justify-content: center;
border-top: 2rpx solid #f2f2f2;
.iconfont {
font-size: 40rpx;
margin-left: -4rpx;
}
}
}
.category-item-all {
position: absolute;
bottom: 0;
z-index: 1;
right: 0;
top: 0;
width: 72rpx;
line-height: 1;
background-color: #fff;
.category-item-all-wrap {
position: absolute;
bottom: 0;
right: 0;
top: 0;
left: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 2;
}
.text {
writing-mode: tb-rl;
margin-bottom: 6rpx;
letter-spacing: 4rpx;
font-size: $font-size-tag;
font-weight: bold;
}
.img {
width: 20rpx;
height: 20rpx;
}
&::after {
content: '';
// box-shadow: -4rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
position: absolute;
left: 0;
width: 10rpx;
// height: 100rpx;
top: 20%;
bottom: 20%;
// transform: translateY(-50%);
// background-color: #F0F5FF;
}
}
.uni-scroll-view-content {
display: flex;
}
.category-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-width: 130rpx;
flex-shrink: 0;
margin-right: 20rpx;
padding: 4rpx 0;
&:last-of-type {
margin-right: 0;
}
.image-warp {
margin-bottom: 6rpx;
padding: 4rpx;
display: flex;
align-items: center;
justify-content: center;
border-radius: 42rpx;
border: 4rpx solid transparent;
}
image {
width: 84rpx;
height: 84rpx;
border-radius: 32rpx;
}
.text {
font-size: $font-size-tag;
}
}
.select {
.text {
padding: 8rpx 16rpx;
border-radius: 40rpx;
color: #fff;
font-size: $font-size-tag;
line-height: 1;
}
}
}
.content-wrap .categoty-goods-wrap .goods-list {
margin-top: 30rpx;
}
.tree-wrap .category-item.select::before {
border-top-right-radius: 8rpx;
border-bottom-right-radius: 8rpx;
}
}
/*商品部分*/
.item-wrap {
width: 100%;
box-sizing: border-box;
// padding: 0 24rpx;
// padding-bottom: 80rpx;
&.goods {
height: 100%;
}
}
.category-title {
padding: 20rpx 0;
font-size: 26rpx;
// font-weight: bold;
color: #222;
position: relative;
text-align: left;
padding-left: 30rpx;
// &::after,
// &::before {
// content: ' ';
// width: 46rpx;
// border-top: 2rpx solid #dfdfdf;
// position: absolute;
// top: 50%;
// }
&::after {
margin-left: 40rpx;
}
&::before {
margin-left: -80rpx;
}
}
.category-adv {
width: 100%;
overflow: hidden;
line-height: 1;
padding: 20rpx 0;
image {
width: 100%;
border-radius: 8rpx;
}
}
.category-list {
display: flex;
flex-wrap: wrap;
background: #fff;
margin: 0 20rpx;
border-radius: 10rpx;
padding: 10rpx 0;
.category-item {
width: 33.33%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 16rpx;
box-sizing: border-box;
.img-box {
width: 80%;
padding-top: 80%;
margin: 0 auto;
overflow: hidden;
margin-bottom: 20rpx;
position: relative;
image {
position: absolute;
width: 100%;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
}
.name {
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-align: center;
line-height: 1;
font-size: 24rpx;
}
}
}
.goods-list {
.goods-item {
padding: 0 0 26rpx 0;
background: #fff;
display: flex;
position: relative;
.goods-img {
width: 180rpx;
height: 180rpx;
overflow: hidden;
border-radius: $border-radius;
margin-right: 14rpx;
image {
width: 100%;
height: 100%;
}
}
.goods-tag {
color: #fff;
line-height: 1;
padding: 8rpx 12rpx;
position: absolute;
border-top-left-radius: $border-radius;
border-bottom-right-radius: $border-radius;
top: 0;
left: 0;
font-size: $font-size-goods-tag;
}
.goods-tag-img {
position: absolute;
border-top-left-radius: $border-radius;
width: 80rpx;
height: 80rpx;
top: 26rpx;
left: 26rpx;
z-index: 5;
overflow: hidden;
image {
width: 100%;
height: 100%;
}
}
.info-wrap {
flex: 1;
display: flex;
flex-direction: column;
width: 0;
}
.name-wrap {
flex: 1;
}
.goods-name {
font-size: $font-size-base;
line-height: 1.3;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.introduction {
line-height: 1;
margin-top: 10rpx;
}
.discount-price {
display: inline-block;
font-weight: bold;
line-height: 1;
margin-top: 16rpx;
color: var(--price-color);
.unit {
margin-right: 6rpx;
}
}
.pro-info {
display: flex;
margin-top: 16rpx;
.delete-price {
text-decoration: line-through;
flex: 1;
.unit {
margin-right: 0rpx;
}
}
&>view {
line-height: 1;
&:nth-child(2) {
text-align: right;
}
}
}
.member-price-tag {
display: inline-block;
width: 60rpx;
line-height: 1;
margin-left: 6rpx;
height: 28rpx;
image {
width: 100%;
height: 100%;
}
}
.footer-wrap {
display: flex;
justify-content: space-between;
.right-wrap {
display: flex;
align-items: center;
justify-content: end;
.num {
width: auto;
padding: 0 20rpx;
line-height: 1;
}
.num-action {
display: flex;
align-items: center;
justify-content: center;
width: 40rpx;
height: 40rpx;
background: $base-color;
border-radius: 50%;
position: relative;
.click-event {
position: absolute;
width: 2rpx;
height: 2rpx;
left: 0;
top: 0;
transform: translate(-50%, -50%);
z-index: 5;
}
&.reduce {
width: 38rpx;
height: 38rpx;
background-color: transparent;
border: 2rpx solid $base-color;
box-sizing: border-box;
.icon-jian {
color: $base-color;
}
}
}
.icon-jian,
.icon-jia {
color: var(--btn-text-color);
font-weight: bold;
font-size: 26rpx;
line-height: 1;
}
.select-sku {
font-weight: bold;
color: var(--btn-text-color);
font-size: 24rpx;
padding: 16rpx 24rpx;
position: relative;
// height: 40rpx;
line-height: 1;
text-align: center;
border-radius: 50rpx;
.num-tag {
position: absolute;
top: 0;
right: 0;
transform: translateY(-50%);
display: inline-block;
box-sizing: border-box;
color: #fff;
line-height: 1.2;
text-align: center;
font-size: 24rpx;
padding: 0 6rpx;
min-width: 32rpx;
border-radius: 16rpx;
background-color: $base-color;
border: 2rpx solid #fff;
}
}
}
}
}
&[data-template='3'] .goods-item {
flex-direction: column;
.info-wrap {
width: 100%;
margin-top: 12rpx;
}
.goods-img {
width: 100%;
height: auto;
margin-right: 0;
line-height: 1;
image {
border-radius: 8rpx;
}
}
.select-sku {
font-weight: bold;
width: 128rpx;
height: 52rpx !important;
line-height: 52rpx !important;
}
}
}
.categoty-goods-wrap {
display: flex;
flex-direction: column;
height: 100%;
.scroll-goods-view {
flex: 1;
height: 0;
transform: translateX(0px);
}
}
.screen-category-wrap {
display: flex;
.icon-unfold {
font-size: 24rpx;
color: #999;
padding: 0 0 0 20rpx;
}
}
.screen-category {
flex: 1;
width: 0;
padding: 0 0 20rpx 0;
white-space: nowrap;
height: 60rpx;
.item {
display: inline-block;
padding: 4rpx 24rpx;
background: #f5f5f5;
color: #666;
margin-right: 20rpx;
border-radius: 40rpx;
&.selected {
background-color: $base-color;
color: var(--btn-text-color);
}
}
}
/deep/ .uni-popup__wrapper-box {
border-radius: 0;
}
.screen-category-popup {
display: flex;
.screen-category {
white-space: break-spaces;
padding: 20rpx;
height: auto;
}
.title {
line-height: 1;
margin-bottom: 20rpx;
font-weight: bold;
}
.item {
margin-bottom: 20rpx;
}
}
.end-tips {
text-align: center;
color: #999;
font-size: 24rpx;
padding: 30rpx 0 30rpx 0;
display: flex;
align-items: center;
justify-content: center;
}
/deep/ .loading-layer {
background: #fff !important;
}
.category-empty {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
padding-top: 100rpx;
image {
width: 280rpx;
height: 252rpx;
}
.tips {
font-size: 26rpx;
font-weight: 500;
color: #999;
margin-top: 50rpx;
}
}
.screen-category-4 .item {
background-color: #f2f2f2 !important;
padding: 10rpx 24rpx;
line-height: 1;
font-size: $font-size-tag;
&.selected {
background-color: var(--main-color-shallow) !important;
color: var(--main-color);
}
}

View File

@@ -0,0 +1,647 @@
.head-wrap {
background: #fff;
position: fixed;
width: 100%;
left: 0;
z-index: 1;
.search-wrap {
flex: 0.5;
padding: 30rpx 30rpx 0;
font-size: $font-size-tag;
display: flex;
align-items: center;
.iconfont {
margin-left: 16rpx;
font-size: 36rpx;
}
.input-wrap {
flex: 1;
display: flex;
justify-content: space-between;
align-items: center;
background: $color-bg;
height: 64rpx;
padding-left: 10rpx;
border-radius: 70rpx;
input {
width: 90%;
background: $color-bg;
font-size: $font-size-tag;
height: 100%;
padding: 0 25rpx 0 40rpx;
line-height: 50rpx;
border-radius: 40rpx;
}
text {
font-size: $font-size-toolbar;
color: $color-tip;
width: 80rpx;
text-align: center;
margin-right: 20rpx;
}
}
.category-wrap,
.list-style {
display: flex;
justify-content: center;
align-items: center;
.iconfont {
font-size: 50rpx;
color: $color-tip;
}
text {
display: block;
margin-top: 60rpx;
}
}
}
.sort-wrap {
display: flex;
padding: 10rpx 20rpx 10rpx 0;
> view {
flex: 1;
text-align: center;
font-size: $font-size-base;
height: 60rpx;
line-height: 60rpx;
font-weight: bold;
}
.comprehensive-wrap {
display: flex;
justify-content: center;
align-items: center;
.iconfont-wrap {
display: inline-block;
margin-left: 10rpx;
width: 40rpx;
.iconfont {
font-size: $font-size-toolbar;
line-height: 1;
margin-bottom: 5rpx;
}
}
}
.price-wrap {
display: flex;
justify-content: center;
align-items: center;
.iconfont-wrap {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 40rpx;
.iconfont {
position: relative;
float: left;
font-size: 32rpx;
line-height: 1;
height: 20rpx;
color: #909399;
&.asc {
top: -2rpx;
}
&.desc {
top: -6rpx;
}
}
}
}
.screen-wrap {
display: flex;
justify-content: center;
align-items: center;
.iconfont-wrap {
display: inline-block;
margin-left: 10rpx;
width: 40rpx;
.iconfont {
font-size: $font-size-toolbar;
line-height: 1;
}
}
}
}
}
.category-list-wrap {
height: 100%;
.class-box {
display: flex;
flex-wrap: wrap;
padding: 0 $padding;
view {
width: calc((100% - 60rpx) / 3);
font-size: $font-size-goods-tag;
margin-right: 20rpx;
height: 60rpx;
line-height: 60rpx;
text-align: center;
margin-bottom: 12rpx;
flex-shrink: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
background: rgba(245, 245, 245, 1);
border-radius: 5rpx;
&:nth-of-type(3n) {
margin-right: 0;
}
}
}
.first {
font-size: $font-size-tag;
display: block;
// background: $page-color-base;
padding: 20rpx;
}
.second {
border-bottom: 2rpx solid $color-line;
padding: 20rpx;
display: block;
font-size: $font-size-tag;
}
.third {
padding: 0 20rpx 20rpx;
overflow: hidden;
font-size: $font-size-tag;
> view {
display: inline-block;
margin-right: 20rpx;
margin-top: 20rpx;
}
.uni-tag {
padding: 0 20rpx;
}
}
}
.screen-wrap {
.title {
font-size: $font-size-tag;
padding: $padding;
background: #f6f4f5;
}
scroll-view {
height: 85%;
.item-wrap {
border-bottom: 1px solid #f0f0f0;
.label {
font-size: $font-size-tag;
padding: $padding;
view {
display: inline-block;
font-size: 60rpx;
height: 40rpx;
vertical-align: middle;
line-height: 40rpx;
}
}
.list {
margin: $margin-updown $margin-both;
overflow: hidden;
> view {
display: inline-block;
margin-right: 25rpx;
margin-bottom: 25rpx;
}
.uni-tag {
padding: 0 $padding;
font-size: $font-size-goods-tag;
background: #f5f5f5;
height: 52rpx;
line-height: 52rpx;
border: 0;
}
}
.price-wrap {
display: flex;
justify-content: center;
align-items: center;
padding: $padding;
input {
flex: 1;
background: #f5f5f5;
height: 52rpx;
width: 182rpx;
line-height: 50rpx;
font-size: $font-size-goods-tag;
border-radius: 50rpx;
text-align: center;
&:first-child {
margin-right: 10rpx;
}
&:last-child {
margin-left: 10rpx;
}
}
}
}
}
.footer {
height: 90rpx;
display: flex;
justify-content: center;
align-items: flex-start;
display: flex;
//position: absolute;
bottom: 0;
width: 100%;
.footer-box {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
margin: 0;
width: 40%;
}
.footer-box1 {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
margin: 0;
width: 40%;
}
}
}
.safe-area {
bottom: 68rpx !important;
}
.empty {
margin-top: 100rpx;
}
.buy-num {
font-size: $font-size-activity-tag;
}
.icon {
width: 34rpx;
height: 30rpx;
}
.list-style-new {
display: flex;
align-items: center;
.line {
width: 4rpx;
height: 28rpx;
background-color: rgba(227, 227, 227, 1);
margin-right: 60rpx;
}
}
.h-line {
width: 37rpx;
height: 2rpx;
background-color: $color-tip;
}
.lineheight-clear {
}
// 商品列表单列样式
.goods-list.single-column {
display: none;
&.show {
display: block;
}
.goods-item {
padding: 26rpx;
background: #fff;
margin: $margin-updown $margin-both;
border-radius: $border-radius;
display: flex;
position: relative;
.goods-img {
position: relative;
width: 200rpx;
height: 200rpx;
// overflow: hidden;
border-radius: $border-radius;
margin-right: 20rpx;
overflow: hidden;
image {
width: 200rpx;
height: 200rpx;
}
}
.goods-tag {
color: #fff;
line-height: 1;
padding: 8rpx 12rpx;
position: absolute;
border-top-left-radius: $border-radius;
border-bottom-right-radius: $border-radius;
top: 0;
left: 0;
font-size: $font-size-goods-tag;
}
.goods-tag-img {
position: absolute;
border-top-left-radius: $border-radius;
width: 80rpx;
height: 80rpx;
top: 26rpx;
left: 26rpx;
z-index: 5;
overflow: hidden;
image {
width: 100%;
height: 100%;
}
}
.info-wrap {
flex: 1;
display: flex;
flex-direction: column;
}
.name-wrap {
flex: 1;
}
.goods-name {
font-size: $font-size-base;
line-height: 1.3;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.introduction {
line-height: 1;
margin-top: 10rpx;
}
.discount-price {
display: inline-block;
font-weight: bold;
line-height: 1;
margin-top: 16rpx;
.unit {
margin-right: 6rpx;
color: var(--price-color);
}
.price {
color: var(--price-color);
}
}
.pro-info {
display: flex;
margin-top: auto;
align-items: center;
position: relative;
.delete-price {
text-decoration: line-through;
font-size: $font-size-tag !important;
flex: 1;
.unit {
margin-right: 0;
}
}
.block-wrap {
flex: 1;
line-height: 1;
margin-right: 20rpx;
.sale {
font-size: $font-size-tag !important;
}
}
}
.member-price-tag {
display: inline-block;
width: 60rpx;
line-height: 1;
margin-left: 6rpx;
image {
width: 100%;
display: flex;
max-height: 30rpx;
}
}
.sell-out{
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
top: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.5);
text{
color: #fff;
font-size: 150rpx;
}
}
}
}
// 商品列表双列样式
.goods-list.double-column {
display: none;
margin: 0 24rpx;
padding-top: $margin-updown;
position: relative;
flex-wrap: wrap;
justify-content: space-between;
&.show {
display: flex;
}
.goods-item {
display: flex;
flex-direction: column;
width: calc(50% - 10rpx);
border-radius: $border-radius;
overflow: hidden;
background-color: #fff;
&:nth-child(2n + 2) {
margin-right: 0;
}
.goods-img {
position: relative;
overflow: hidden;
padding-top: 100%;
border-top-left-radius: $border-radius;
border-top-right-radius: $border-radius;
image {
width: 100%;
position: absolute !important;
top: 50%;
left: 0;
transform: translateY(-50%);
}
}
.goods-tag {
color: #fff;
line-height: 1;
padding: 8rpx 16rpx;
position: absolute;
border-bottom-right-radius: $border-radius;
top: 0;
left: 0;
font-size: $font-size-goods-tag;
}
.goods-tag-img {
position: absolute;
border-top-left-radius: $border-radius;
width: 80rpx;
height: 80rpx;
top: 0;
left: 0;
z-index: 5;
overflow: hidden;
image {
width: 100%;
height: 100%;
}
}
.info-wrap {
padding: 20rpx;
display: flex;
flex-direction: column;
flex: 1;
}
.goods-name {
font-size: $font-size-base;
line-height: 1.3;
margin-top: 20rpx;
}
.lineheight-clear {
margin-top: 16rpx;
}
.discount-price {
display: inline-block;
font-weight: bold;
line-height: 1;
.unit {
margin-right: 6rpx;
color: var(--price-color);
}
.price {
color: var(--price-color);
}
}
.pro-info {
display: flex;
margin-top: auto;
align-items: center;
.block-wrap {
flex: 1;
line-height: 1;
margin-right: 20rpx;
.sale {
font-size: $font-size-tag !important;
}
}
}
.delete-price {
// display: inline-block;
// margin-left: 6rpx;
// float: right;
.unit {
margin-right: 6rpx;
}
text {
line-height: 1;
font-size: $font-size-tag !important;
}
}
.member-price-tag {
display: inline-block;
width: 60rpx;
line-height: 1;
margin-left: 6rpx;
image {
width: 100%;
}
}
.sell-out{
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
top: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.5);
text{
color: #fff;
font-size: 250rpx;
}
}
}
}
.cart-action-wrap {
position: relative;
.shopping-cart-btn {
font-size: 36rpx;
border: 2rpx solid $base-color;
border-radius: 50%;
padding: 10rpx;
color: $base-color;
width: 36rpx;
height: 36rpx;
text-align: center;
line-height: 36rpx;
}
.plus-sign-btn {
font-size: 36rpx;
border: 2rpx solid $base-color;
border-radius: 50%;
padding: 10rpx;
color: $base-color;
width: 36rpx;
height: 36rpx;
text-align: center;
line-height: 36rpx;
}
.buy-btn {
background-color: $base-color;
color: var(--btn-text-color);
border-radius: 50rpx;
font-size: $font-size-tag;
padding: 12rpx 30rpx;
line-height: 1;
}
.icon-diy {
font-size: 80rpx;
}
}

View File

@@ -0,0 +1,952 @@
// import {getGoodsInfoById,getCategoryTree,addGoods,editGoods,addVirtualGoods,editVirtualGoods,addVirtualCardGoods,editVirtualCardGoods} from '@/api/goods'
// import {getOrderFormList} from '@/api/form'
// import {getSupplyList} from '@/api/supply'
export default {
data() {
return {
repeatFlag: false,
isIphoneX: false,
goodsImgHeight: 165, // 商品图片高度
isAWait: false,
albumPage: 'goodsEdit',
//店内分类
shopCategoryNumber: 1,
shopCategoryData: {
store_0: {}
},
shopCategoryIndex: '',
categoryList: [],
secondCategory: [],
thirdCategory: [],
categoryId: [0, 0, 0],
categoryName: ['', '', ''],
currentLevel: 1,
lastLevel: 1,
showFisrt: true,
showSecond: false,
showThird: false,
goodsData: {
id: 0,//商品id
goodsname:'',//商品名称
subtitle:'',//商品简介
is_show_arrive:1,//默认商品预达简介0关闭1开启
diy_arrive_switch:0,//商品自定义预达简介0关闭1开启
goods_start_count:1,//起售数量
grounding:1,//0下架1上架
is_index_show:1,//0首页不推荐1推荐
price:0,//售价
productprice:0,//原价
costprice:0,//成本价
total:0,//库存
pick_up_type:0,//提货时,0当日达1次日达2隔日达3自定义
dispatchtype:1,//1统一运费
dispatchprice:0,//统一运费金额
begin_time:'',//团购开始时间
end_time:'',//团购结束时间
oneday_limit_count:0,//每天限购
one_limit_count:0,//单次限购
total_limit_count:0,//历史限购
is_all_sale:0,//所有团长1部分团长0
goods_image:[],
begin_time:'',//团购开始时间
end_time:''//团购结束时间
},
groundingArray: ['下架', '上架'],
pickuptypeArray: ['当日达', '次日达', '隔日达'],//, '自定义'
currCategory: 0, // 当前所设置的商品分类
virtualDeliverArray: [{
name: '自动发货',
value: 'auto_deliver',
},
{
name: '手动发货',
value: 'artificial_deliver',
},
{
name: '到店核销',
value: 'verify',
}
],
virtualDeliverValue: {
'auto_deliver': '自动发货',
'artificial_deliver': '手动发货',
'verify': '到店核销'
},
virtualReceiveArray: [{
name: '自动收货',
value: 'auto_receive',
},
{
name: '买家确认收货',
value: 'artificial_receive',
},
],
virtualReceiveValue: {
'auto_receive': '自动收货',
'artificial_receive': '买家确认收货',
},
validityTypeArray: ['永久', '购买后几日有效', '指定过期日期'],
virtualIndate: 0,
minDate: '',
carmiLength: '添加卡密',
limitLength: [ //限购
{
name: '单次限购',
value: '1'
},
{
name: '长期限购',
value: '2'
}
],
current: 0,
goodsFormArray: [],
goodsForm: [],
supplyFormArray: [],
supplyForm: []
};
},
async onLoad(option) {
this.goodsData.id = option.id || 0;
// if (!this.$util.checkToken('/pages/goods/edit/index?id=' + this.goodsData.id)) return;
// this.clearStoreage();
// this.getCategoryTreeFn();
if (this.goodsData.id) {
this.isAWait = true;
uni.setNavigationBarTitle({
title: '编辑商品'
});
await this.editGetGoodsInfo();
} else {
this.isAWait = false;
uni.setNavigationBarTitle({
title: '添加商品'
});
}
let date = new Date();
this.minDate = date.getFullYear() + '-' + date.getMonth() + '-' + date.getUTCDate();
// if (this.addonIsExit.form) this.getGoodsForm();
// if (this.addonIsExit.supply) this.getSupplyList();
},
onShow() {
this.isIphoneX = this.$util.uniappIsIPhoneX();
//this.refreshData();
},
methods: {
groundingChange(e) {
this.goodsData.grounding = e.detail.value;
},
pickuptypeChange(e) {
this.goodsData.pick_up_type = e.detail.value;
},
// 获取编辑商品数据
async editGetGoodsInfo() {
this.$api.sendRequest({
url: 'app.getgoodsinfo',
data:{
id:this.goodsData.id
},
success: res => {
console.log(res)
if(res.result.detail){
this.goodsData = res.result.detail
console.log(this.goodsData.goods_image)
}else{
this.$util.showToast({
title: '商品不存在',
});
setTimeout(() => {
this.$util.redirectTo('/pages/goods/list', {}, 'redirectTo');
}, 1000);
}
// if (res.status == 0) {
// setTimeout(() => {
// this.$util.redirectTo('/pages/goods/list', {}, 'redirectTo');
// }, 1000);
// }
}
})
/*var res = await getGoodsInfoById(this.goodsData.goods_id);
if (res.code == 0 && res.data) {
var data = res.data;
data.goods_category.forEach((item, index) => {
this.shopCategoryData['store_' + index] = {
category_id: item.id,
category_name: item.category_name
}
})
this.shopCategoryNumber = data.goods_category.length;
// 商品分类
data.category_id = data.goods_category[0].id;
data.category_name = data.goods_category[0].category_name.replace(/\//g, " / ");
if (typeof data.category_id == 'string') {
this.categoryId = data.category_id.split(",");
this.categoryName = data.category_name.split(" / ");
} else {
this.categoryId = data.category_id;
this.categoryName = data.category_name;
}
delete data.category_json;
delete data.goods_category;
data.goods_image = data.goods_image.split(",");
data.goods_sku_data.forEach((item) => {
if (item.sku_spec_format) item.sku_spec_format = JSON.parse(item.sku_spec_format);
});
if (data.goods_spec_format) {
uni.setStorageSync("editGoodsSpecFormat", data.goods_spec_format);
uni.setStorageSync("editGoodsSkuData", JSON.stringify(data.goods_sku_data));
data.goods_spec_format = JSON.parse(data.goods_spec_format);
} else {
data.sku_id = data.goods_sku_data[0].sku_id;
data.price = data.goods_sku_data[0].price;
data.market_price = data.goods_sku_data[0].market_price;
data.cost_price = data.goods_sku_data[0].cost_price;
data.weight = data.goods_sku_data[0].weight;
data.volume = data.goods_sku_data[0].volume;
data.sku_no = data.goods_sku_data[0].sku_no;
}
if (data.goods_class == 1) {
// 实物商品
delete data.virtual_indate;
uni.setStorageSync("editGoodsShippingTemplateId", data.shipping_template);
uni.setStorageSync("editGoodsShippingTemplateName", data.template_name ? data.template_name : '');
} else {
// 虚拟商品
delete data.shipping_template;
delete data.is_free_shipping;
}
// 商品参数
if (data.goods_attr_format) {
uni.setStorageSync("editGoodsAttrClass", data.goods_attr_class);
uni.setStorageSync("editGoodsAttrName", data.goods_attr_name);
uni.setStorageSync("editGoodsAttrFormat", data.goods_attr_format);
data.goods_attr_format = JSON.parse(data.goods_attr_format);
}
uni.setStorageSync("editGoodsState", data.goods_state);
uni.setStorageSync("editGoodsContent", data.goods_content);
if (data.verify_validity_type == 1) {
this.virtualIndate = data.virtual_indate;
} else if (data.verify_validity_type == 2) {
this.virtualTime = this.$util.timeStampTurnTime(data.virtual_indate, 'Y-m-d');
}
data.verify_num = data.goods_sku_data[0].verify_num
this.goodsData = data;
this.goodsData.goods_form_index = 0;
this.goodsData.supply_index = 0;
this.$forceUpdate();
} else {
this.$util.showToast({
title: '商品不存在',
});
setTimeout(() => {
this.$util.redirectTo('/pages/goods/list', {}, 'redirectTo');
}, 1000);
}*/
},
// 选择商品分类
openGoodsCategoryPop(index) {
this.currCategory = index;
if (this.shopCategoryData['store_' + index].category_id) {
this.categoryId = this.shopCategoryData['store_' + index].category_id.split(',');
this.categoryName = this.shopCategoryData['store_' + index].category_name.split(' / ');
this.categoryList.forEach((item, index) => {
item.selected = this.categoryId.indexOf(item.category_id.toString()) != -1;
if (item.selected) {
this.secondCategory = item.child_list;
}
if (item.child_list) {
if (item.selected) this.lastLevel = 2;
item.child_list.forEach(secondItem => {
secondItem.selected = this.categoryId.indexOf(secondItem.category_id.toString()) != -1;
if (secondItem.selected) {
this.thirdCategory = secondItem.child_list;
}
});
}
});
this.changeShow(this.categoryId.length);
} else {
this.categoryId = [0];
this.categoryName = [''];
this.changeShow(1);
}
this.$refs.categoryPopup.open();
},
closeGoodsCategoryPop() {
this.$refs.categoryPopup.close();
},
// 编辑规格类型
openGoodsSpec() {
this.$util.redirectTo('/pages/goods/edit/spec');
},
// 编辑多规格
openGoodsSpecEdit() {
this.$util.redirectTo('/pages/goods/edit/spec_edit', {
goods_class: this.goodsData.goods_class,
virtual_deliver_type: this.goodsData.virtual_deliver_type
});
},
//编辑卡密
openCarmichaelEdit() {
this.$util.redirectTo('/pages/goods/edit/carmichael_edit', {
goods_class: this.goodsData.goods_class
});
},
// 编辑商品状态
openGoodsState() {
this.$util.redirectTo('/pages/goods/edit/state', {
goods_state: this.goodsData.goods_state
});
},
// 编辑快递运费
openExpressFreight() {
this.$util.redirectTo('/pages/goods/edit/express_freight', {
template_id: this.goodsData.shipping_template
});
},
// 编辑商品详情
openGoodsContent() {
this.$util.redirectTo('/pages/goods/edit/content');
},
// 编辑商品参数
openAttr() {
this.$util.redirectTo('/pages/goods/edit/attr');
},
/**
* 刷新商品图片高度
* @param {Object} data
*/
refreshGoodsImgHeight(data) {
if (data.height == '') return;
var height = parseFloat(data.height.replace('px', ''));
this.goodsImgHeight = height + 80;
this.$forceUpdate();
if (data.isLoad && this.$refs.loadingCover) {
// 数据渲染留点时间
setTimeout(() => {
this.$refs.loadingCover.hide();
}, 100);
}
uni.removeStorageSync("selectedAlbumImg");
},
// 获取商品分类树状结构
getCategoryTreeFn() {
getCategoryTree().then(res=>{
if (res.data) {
this.categoryList = res.data;
this.categoryList.forEach((item, index) => {
item.selected = this.categoryId.indexOf(item.category_id.toString()) != -1;
if (item.selected) {
this.secondCategory = item.child_list;
this.currentLevel = 1;
}
if (item.child_list) {
if (item.selected) this.lastLevel = 2;
item.child_list.forEach(secondItem => {
secondItem.selected = this.categoryId.indexOf(secondItem.category_id.toString()) != -1;
if (secondItem.selected) {
this.thirdCategory = secondItem.child_list;
this.currentLevel = 2;
}
if (secondItem.child_list) {
if (secondItem.selected) this.lastLevel = 3;
secondItem.child_list.forEach(thirdItem => {
thirdItem.selected = this.categoryId.indexOf(thirdItem.category_id.toString()) != -1;
if (thirdItem.selected) this.currentLevel = 3;
});
}
});
}
});
this.changeShow(this.lastLevel);
if (this.goodsData.goods_id == 0 && this.$refs.loadingCover) {
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
}
}
});
},
changeShow(index) {
if (index == 1) {
this.showFisrt = true;
this.showSecond = false;
this.showThird = false;
} else if (index == 2) {
this.showFisrt = false;
this.showSecond = true;
this.showThird = false;
} else if (index == 3) {
this.showFisrt = false;
this.showSecond = false;
this.showThird = true;
}
this.currentLevel = index;
this.$forceUpdate();
},
selectCategory(category) {
this.currentLevel = category.level;
// 如果当前选中跟上次不一样,则 要清空下级数据
if (category.level == 1 && this.categoryId[0] > 0 && this.categoryId[0] != category.captcha_id) {
this.categoryId[1] = 0;
this.categoryName[1] = '';
this.categoryId[2] = 0;
this.categoryName[2] = '';
} else if (category.level == 2 && this.categoryId[1] > 0 && this.categoryId[1] != category.captcha_id) {
this.categoryId[2] = 0;
this.categoryName[2] = '';
}
this.categoryId[category.level - 1] = category.category_id;
this.categoryName[category.level - 1] = category.category_name;
if (category.level == 1) {
if (category.child_list) {
this.secondCategory = category.child_list;
} else {
this.categoryId[1] = 0;
this.categoryName[1] = '';
this.categoryId[2] = 0;
this.categoryName[2] = '';
}
} else if (category.level == 2) {
if (category.child_list) {
this.thirdCategory = category.child_list;
} else {
this.categoryId[2] = 0;
this.categoryName[2] = '';
}
}
this.lastLevel = 1;
this.categoryList.forEach((item, index) => {
item.selected = this.categoryId[0] == item.category_id;
if (item.child_list) {
if (item.selected) this.lastLevel = 2;
item.child_list.forEach((secondItem, secondIndex) => {
secondItem.selected = this.categoryId[1] == secondItem.category_id;
if (secondItem.child_list) {
if (secondItem.selected) this.lastLevel = 3;
}
});
}
});
this.changeShow(this.lastLevel);
this.goodsData.category_id = [];
this.goodsData.category_name = [];
for (var i = 0; i < this.categoryId.length; i++) {
if (this.categoryId[i]) this.goodsData.category_id.push(this.categoryId[i]);
}
for (var i = 0; i < this.categoryName.length; i++) {
if (this.categoryName[i]) this.goodsData.category_name.push(this.categoryName[i]);
}
this.goodsData.category_id = this.goodsData.category_id.toString();
this.goodsData.category_name = this.goodsData.category_name.join(" / ");
if (
(this.lastLevel == 3 && this.categoryId[2]) ||
(this.lastLevel == 2 && this.categoryId[1]) ||
(this.lastLevel == 1 && this.categoryId[0])
) {
this.shopCategoryData['store_' + this.currCategory] = {
category_id: this.goodsData.category_id,
category_name: this.goodsData.category_name
};
this.closeGoodsCategoryPop();
}
this.$forceUpdate();
},
addShopCategory() {
if (this.shopCategoryNumber == 10) {
this.$util.showToast({
title: '商品可以属于多个分类最多10个'
});
return;
}
this.shopCategoryData['store_' + this.shopCategoryNumber] = {};
++this.shopCategoryNumber;
},
deleteShopCategory(index) {
delete this.shopCategoryData['store_' + index];
--this.shopCategoryNumber;
//重置数据
let i = 0;
let obj = {};
for (let key in this.shopCategoryData) {
obj['store_' + i] = this.shopCategoryData[key];
i++;
}
this.shopCategoryData = {};
this.shopCategoryData = Object.assign(this.shopCategoryData, obj);
},
// 刷新数据
refreshData() {
var selectedAlbumImg = uni.getStorageSync('selectedAlbumImg');
if (selectedAlbumImg) {
uni.setStorageSync('selectedAlbumImgTemp', selectedAlbumImg);
selectedAlbumImg = JSON.parse(selectedAlbumImg);
this.goodsData.goods_image = selectedAlbumImg.list.split(",");
this.$refs.goodsShmilyDragImg.refresh();
}
// 规格项
this.goodsData.goods_spec_format = uni.getStorageSync('editGoodsSpecFormat') ? JSON.parse(uni.getStorageSync('editGoodsSpecFormat')) : [];
if (this.goodsData.goods_spec_format.length <= 0) {
this.goodsData.carmichael = uni.getStorageSync('editGoodsCarmichael') ? JSON.parse(uni.getStorageSync('editGoodsCarmichael')) : [];
if (this.goodsData.carmichael.length > 0) {
this.carmiLength = '添加卡密【' + this.goodsData.carmichael.length + '】'
}
}
// 多规格数据
this.goodsData.goods_sku_data = uni.getStorageSync('editGoodsSkuData') ? JSON.parse(uni.getStorageSync('editGoodsSkuData')) : [];
if (this.goodsData.goods_sku_data.length > 0) {
this.goodsData.goods_stock = 0;
this.goodsData.goods_stock_alarm = 0;
this.goodsData.goods_sku_data.forEach((item) => {
if (item.stock) this.goodsData.goods_stock += parseInt(item.stock);
if (item.stock_alarm) this.goodsData.goods_stock_alarm += parseInt(item.stock_alarm);
});
}
// 快递运费
this.goodsData.shipping_template = uni.getStorageSync('editGoodsShippingTemplateId') || 0;
this.goodsData.is_free_shipping = this.goodsData.shipping_template > 0 ? 0 : 1;
this.goodsData.template_name = uni.getStorageSync('editGoodsShippingTemplateName') || '';
if (uni.getStorageSync('editGoodsState') !== undefined && uni.getStorageSync('editGoodsState') !== '') {
this.goodsData.goods_state = uni.getStorageSync('editGoodsState');
}
if (uni.getStorageSync('editGoodsContent') != undefined && uni.getStorageSync('editGoodsContent') != '') {
this.goodsData.goods_content = uni.getStorageSync('editGoodsContent');
}
// 商品参数
this.goodsData.goods_attr_class = uni.getStorageSync('editGoodsAttrClass') || 0;
this.goodsData.goods_attr_name = uni.getStorageSync('editGoodsAttrName') || '';
this.goodsData.goods_attr_format = uni.getStorageSync('editGoodsAttrFormat') ? JSON.parse(uni.getStorageSync('editGoodsAttrFormat')) : [];
this.$forceUpdate();
},
// 验证
verify() {
if (this.goodsData.goodsname.length == 0) {
this.$util.showToast({
title: '请输入商品名称'
});
return false;
}
if (this.goodsData.subtitle.length > 100) {
this.$util.showToast({
title: '商品简介不能超过100个字符'
});
return false;
}
if (this.goodsData.goods_image.length == 0) {
this.$util.showToast({
title: '请上传商品图片'
});
return false;
}
// if (!this.shopCategoryData.store_0.category_id) {
// this.$util.showToast({
// title: `请选择商品分类`
// });
// return false;
// }
// if (this.goodsData.goods_class == 2 && this.goodsData.virtual_deliver_type == 'verify') {
// if (this.goodsData.verify_validity_type == 1) {
// if (this.virtualIndate.length == 0) {
// this.$util.showToast({
// title: '请输入有效期'
// });
// return false;
// }
// if (isNaN(this.virtualIndate) || !this.$util.data().regExp.number.test(this.virtualIndate)) {
// this.$util.showToast({
// title: '[有效期]格式输入错误'
// });
// return false;
// }
// if (this.virtualIndate < 1) {
// this.$util.showToast({
// title: '有效期不能小于1天'
// });
// return false;
// }
// }
// if (this.goodsData.verify_validity_type == 2) {
// if (this.virtualTime.length == 0) {
// this.$util.showToast({
// title: '请设置有效期'
// });
// return false;
// }
// }
// }
// 单规格
if (this.goodsData.price == 0) {
this.$util.showToast({
title: '请输入销售价'
});
return false;
}
if (isNaN(this.goodsData.price) || !this.$util.data().regExp.digit.test(this.goodsData.price)) {
this.$util.showToast({
title: '[销售价]格式输入错误'
});
return false;
}
if (this.goodsData.productprice.length > 0 && (isNaN(this.goodsData.productprice) || !this.$util.data().regExp.digit.test(this.goodsData.productprice))) {
this.$util.showToast({
title: '[原价价]格式输入错误'
});
return false;
}
// 总库存
if (this.goodsData.total == 0) {
this.$util.showToast({
title: '请输入库存'
});
return false;
}
if (isNaN(this.goodsData.total) || !this.$util.data().regExp.number.test(this.goodsData.total)) {
this.$util.showToast({
title: '[库存]格式输入错误'
});
return false;
}
if (isNaN(this.goodsData.goods_start_count) || !this.$util.data().regExp.number.test(this.goodsData.goods_start_count)) {
this.$util.showToast({
title: '[起售]格式输入错误'
});
return false;
}
if (this.goodsData.goods_start_count < 0) {
this.$util.showToast({
title: '起售数量不能小于0'
});
return false;
}
return true;
},
// 删除本地缓存
clearStoreage() {
// 临时选择的商品图片
uni.removeStorageSync("selectedAlbumImg");
uni.removeStorageSync("selectedAlbumImgTemp");
// 商品规格
uni.removeStorageSync("editGoodsSpecFormat");
uni.removeStorageSync("editGoodsSkuData");
//电子卡密
uni.removeStorageSync("editGoodsCarmichael");
uni.removeStorageSync("specName");
// 物流公司
uni.removeStorageSync("editGoodsShippingTemplateId");
uni.removeStorageSync("editGoodsShippingTemplateName");
// 商品状态
uni.removeStorageSync("editGoodsState");
// 商品详情
uni.removeStorageSync("editGoodsContent");
// 商品参数
uni.removeStorageSync("editGoodsAttrClass");
uni.removeStorageSync("editGoodsAttrName");
uni.removeStorageSync("editGoodsAttrFormat");
},
save() {
if (!this.verify()) return;
if (this.repeatFlag) return;
this.repeatFlag = true;
this.$api.sendRequest({
url: 'app.addgoods',
data:this.goodsData,
success: res => {
this.$util.showToast({
title: res.result.message
});
if (res.status == 1) {
setTimeout(() => {
this.$util.redirectTo('/pages/goods/list', {}, 'redirectTo');
}, 1000);
} else {
this.repeatFlag = false;
}
}
})
// 清空规格的图片
console.log(this.goodsData)
return false
for (var i = 0; i < this.goodsData.goods_sku_data.length; i++) {
if (this.goodsData.goods_sku_data[i].sku_images.length == 0) this.goodsData.goods_sku_data[i].sku_image = '';
}
var data = JSON.parse(JSON.stringify(this.goodsData));
delete data.category_name;
data.category_json = [];
data.category_id = '';
for (var key in this.shopCategoryData) {
if (this.shopCategoryData[key].category_id) {
data.category_id += ',' + this.shopCategoryData[key].category_id;
data.category_json.push(this.shopCategoryData[key].category_id);
}
}
data.category_id += ',';
data.category_json = JSON.stringify(data.category_json);
if (data.goods_spec_format.length == 0) {
// 单规格数据
var singData = {
sku_id: (data.goods_id ? data.sku_id : 0),
sku_name: data.goods_name,
spec_name: '',
sku_no: data.sku_no,
sku_spec_format: '',
price: data.price,
market_price: data.market_price,
cost_price: data.cost_price,
stock: data.goods_stock,
stock_alarm: data.goods_stock_alarm,
weight: data.weight,
volume: this.goodsData.volume,
sku_image: data.goods_image[0],
sku_images: data.goods_image.toString(),
// verify_num: data.goods_sku_data.length > 0 ? data.goods_sku_data[0].verify_num : this.goodsData.verify_num
verify_num: data.verify_num
}
var singleSkuData = JSON.stringify([singData]);
}
data.goods_image = data.goods_image.toString();
// 商品规格json格式
data.goods_spec_format = data.goods_spec_format.length > 0 ? JSON.stringify(data.goods_spec_format) : '';
// SKU商品数据
data.goods_sku_data = data.goods_spec_format.length > 0 ? JSON.stringify(data.goods_sku_data) :
singleSkuData;
// 商品参数json格式
data.goods_attr_format = data.goods_attr_format.length > 0 ? JSON.stringify(data.goods_attr_format) : '';
data.spec_type_status = data.goods_spec_format.length > 0 ? 1 : 0;
if (this.goodsData.verify_validity_type == 1) {
data.virtual_indate = this.virtualIndate;
} else if (this.goodsData.verify_validity_type == 2) {
data.virtual_indate = this.virtualTime;
}
// console.log(this.goodsData.goods_spec_format,'format')
// if(this.goodsData.goods_spec_format == '[]'){
// data.carmichael= data.carmichael
// }
var save = null;
if (data.goods_class == 3) {
save = addVirtualCardGoods;
if (data.goods_id) save = editVirtualCardGoods;
}else if (data.goods_class == 2){
save = addVirtualGoods;
if (data.goods_id) save = editVirtualGoods;
}else {
save = addGoods;
if (data.goods_id) save = editGoods;
}
data.goods_form = this.goodsData.goods_form_index ? this.goodsForm[this.goodsData.goods_form_index - 1].id : 0;
data.supplier_id = this.goodsData.supply_index ? this.supplyForm[this.goodsData.supply_index - 1].supplier_id : 0;
if (this.repeatFlag) return;
this.repeatFlag = true;
save(data).then(res=>{
this.$util.showToast({
title: res.message
});
if (res.code == 0) {
this.clearStoreage();
setTimeout(() => {
this.$util.redirectTo('/pages/goods/list', {}, 'tabbar');
}, 1000);
} else {
this.repeatFlag = false;
}
});
},
//是否开启限购
onLimit() {
this.goodsData.is_limit = this.goodsData.is_limit == 1 ? 0 : 1
},
//限购类型
limitChange(e) {
this.goodsData.limit_type = e
},
/**
* 是否参与会员折扣
*/
joinMemberDiscount() {
this.goodsData.is_consume_discount = this.goodsData.is_consume_discount == 1 ? 0 : 1;
},
switchBtn(type) {
this.goodsData[type] = this.goodsData[type] == 1 ? 0 : 1;
},
/**
* 推荐方式选择
* @param {Object} e
*/
recommendWayChange(e) {
this.goodsData.recommend_way = e.detail.value;
},
/**
* 发货选择
* @param {Object} e
*/
virtualDeliverTypeChange(e) {
this.goodsData.virtual_deliver_type = this.virtualDeliverArray[e.detail.value]['value'];
},
/**
* 收货选择
* @param {Object} e
*/
virtualReceiveTypeChange(e) {
this.goodsData.virtual_receive_type = this.virtualReceiveArray[e.detail.value]['value'];
},
/**
* 核销有效期类型
* @param {Object} e
*/
validityTypeChange(e) {
this.goodsData.verify_validity_type = e.detail.value;
},
/**
* 核销有效期选择
* @param {Object} e
*/
virtualTimeChange(e) {
this.virtualTime = e.detail.value;
},
/**
* 团购开始时间选择
* @param {Object} e
*/
beginChange(e) {
this.goodsData.begin_time = e.detail.value;
},
/**
* 团购结束时间选择
* @param {Object} e
*/
endChange(e) {
this.goodsData.end_time = e.detail.value;
},
/**
* 是否需要核销
*/
isNeedVerify() {
this.goodsData.is_need_verify = this.goodsData.is_need_verify == 1 ? 0 : 1;
},
/**
* 获取商品表单
*/
getGoodsForm() {
getOrderFormList().then(res=>{
if (res.data) {
let goodsForm = ['请选择商品表单'];
res.data.forEach((item, index) => {
goodsForm.push(item.form_name);
if (this.goodsData.form_id && this.goodsData.form_id == item.id) this.goodsData.goods_form_index = index + 1;
})
this.goodsForm = res.data;
this.goodsFormArray = goodsForm;
this.$forceUpdate();
}
})
},
goodsFormChange(e) {
this.goodsData.goods_form_index = e.detail.value;
this.$forceUpdate();
},
/**
* 获取供应商
*/
getSupplyList() {
getSupplyList().then(res=>{
if (res.data) {
let supplyForm = ['请选择供应商'];
res.data.forEach((item, index) => {
supplyForm.push(item.title);
if (this.goodsData.supplier_id && this.goodsData.supplier_id == item.supplier_id) this.goodsData.supply_index = index + 1;
})
this.supplyForm = res.data;
this.supplyFormArray = supplyForm;
this.$forceUpdate();
}
})
},
supplyChange(e) {
this.goodsData.supply_index = e.detail.value;
this.$forceUpdate();
}
}
};

View File

@@ -0,0 +1,275 @@
.container{
padding-bottom: 40rpx;
}
.safe-area{
padding-bottom: calc(constant(safe-area-inset-bottom) + 100rpx);
padding-bottom: calc(env(safe-area-inset-bottom) + 100rpx);
}
.goods-edit-wrap {
margin-bottom: 160rpx;
}
.form-title {
display: flex;
justify-content: space-between;
margin: $margin-updown $margin-both;
// padding: 0 $padding;
color: $color-tip;
}
.item-wrap uni-radio .uni-radio-input {
width: 30rpx !important;
height: 30rpx !important;
}
.item-wrap {
background: #fff;
// padding: $padding;
margin-top: $margin-updown;
.goods-type {
display: flex;
margin: 0 40rpx $margin-updown 40rpx;
flex-wrap: wrap;
view {
flex: 1;
text-align: center;
border: 1px solid $color-disabled;
color: $color-tip;
margin-right: 40rpx;
margin-top: 30rpx;
position: relative;
height: 80rpx;
line-height: 80rpx;
white-space: nowrap;
min-width: calc((100% - 100rpx) / 3);
max-width: calc((100% - 100rpx) / 3);
&:nth-child(3n+3) {
margin-right: 0;
}
.iconfont {
display: none;
}
&.selected {
.iconfont {
display: block;
position: absolute;
bottom: -22rpx;
right: -22rpx;
font-size: 80rpx;
}
}
}
}
.form-wrap {
display: flex;
align-items: center;
margin: 0 $margin-both;
border-bottom: 1px solid $color-line;
height: 100rpx;
line-height: 100rpx;
&:last-child {
border-bottom: none;
}
.required {
font-weight: bold;
}
.label {
vertical-align: middle;
margin-right: $margin-both;
}
input {
vertical-align: middle;
display: inline-block;
flex: 1;
text-align: right;
}
&.more-wrap {
.selected {
vertical-align: middle;
display: inline-block;
flex: 1;
text-align: right;
color: $color-tip;
overflow: hidden;
white-space: pre;
text-overflow: ellipsis;
&.have {
color: $color-title;
}
}
.iconfont {
color: $color-tip;
margin-left: 20rpx;
}
.action {
background-color: $color-disabled;
border-radius: 50%;
color: #fff;
width: 36rpx;
height: 36rpx;
line-height: 36rpx;
display: inline-block;
text-align: center;
font-weight: bold;
margin-right: 20rpx;
}
}
&.goods-img {
height: 200rpx;
line-height: 200rpx;
display: block;
position: relative;
.label{
display: inline-block;
}
.img-list {
position: absolute;
width: 80%;
top: 0;
left: 100rpx;
margin-top: 40rpx;
margin-left: 40rpx;
}
.tips {
color: $color-tip;
font-size: $font-size-activity-tag;
margin-top: 20rpx;
}
}
.unit {
margin-left: 20rpx;
width: 40rpx;
}
&.join-member-discount {
.label{
flex: 1;
}
}
&.validity-type {
border-bottom: 1px solid $color-line!important;
}
}
}
.footer-wrap {
position: fixed;
width: 100%;
bottom: 0;
padding: 40rpx 0;
z-index: 10;
background-color: #fff;
}
.popup {
width: 100vw;
background: #fff;
border-top-left-radius: 24rpx;
border-top-right-radius: 24rpx;
.popup-header {
display: flex;
border-bottom: 2rpx solid $color-line;
position: relative;
padding: 40rpx;
.tit {
flex: 1;
font-size: $font-size-toolbar;
line-height: 1;
text-align: center;
}
.iconfont {
line-height: 1;
position: absolute;
right: 30rpx;
top: 50%;
transform: translate(0, -50%);
color: $color-tip;
font-size: $font-size-toolbar;
}
}
.popup-body {
height: calc(100% - 250rpx);
&.safe-area {
height: calc(100% - 270rpx);
}
}
&.category {
height: 50vh;
.popup-header {
border-bottom: none;
}
.popup-body {
padding: 0 30rpx;
.nav {
border-bottom: 2rpx solid $color-line;
font-weight: bold;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text {
padding: 0 0 20rpx 0;
margin-right: 20rpx;
display: inline-block;
&:last-child {
padding-right: 0;
}
&.selected {
border-bottom: 2px solid;
}
}
}
.category {
height: 100%;
.item {
display: block;
margin: 20rpx 0 0;
text {
&:first-child {
overflow: hidden;
text-overflow: ellipsis;
white-space: pre;
width: 90%;
display: inline-block;
vertical-align: middle;
}
}
.iconfont {
float: right;
}
}
.child-item{
display: flex;
justify-content: space-between;
margin-left: 40rpx;
}
}
}
}
&.choose-picture {
background-color: $color-bg;
.popup-header {
border-bottom: none;
background-color: #fff;
}
.popup-body {
background-color: $color-bg;
height: initial;
.select-wrap{
background-color: #fff;
padding: 0 30rpx;
}
.item {
text-align: center;
padding: 20rpx;
background-color: #fff;
border-bottom: 1px solid $color-line;
&:last-child {
border-bottom: none;
}
&.cancle {
margin-top: 20rpx;
}
}
}
}
}

View File

@@ -0,0 +1,475 @@
export default {
data() {
return {
listStyle: '',
loadingType: 'loading', //加载更多状态
orderType: '',
priceOrder: 'desc', //1 价格从低到高 2价格从高到低
categoryList: [], //排序类型
goodsList: [],
order: '',
sort: 'desc',
showScreen: false,
keyword: '',
categoryId: 0,
minPrice: '',
maxPrice: '',
isFreeShipping: false, //是否免邮
isIphoneX: false,
coupon: 0,
emptyShow: false,
isList: true, //列表样式
//分享所需标题
share_title: '',
//搜索到多少件商品
count: 0,
//当前分类名称
category_title: '',
//优惠券数据
coupon_name: '',
//列表瀑布流数据
listHeight: [],
listPosition: [],
debounce: null,
brandId: 0,
merch_id:0,
merch:{},
brandList: [], //品牌筛选项
config: {
fontWeight: false,
padding: 0,
cartEvent: "detail",
text: "购买",
textColor: "#FFFFFF",
theme: "default",
aroundRadius: 25,
control: true,
bgColor: "#FF6A00",
style: "button",
iconDiy: {
iconType: "icon",
icon: "",
style: {
fontSize: "60",
iconBgColor: [],
iconBgColorDeg: 0,
iconBgImg: "",
bgRadius: 0,
iconColor: [
"#000000"
],
iconColorDeg: 0
}
}
},
}
},
onLoad(options) {
this.categoryId = options.category_id || 0;
this.keyword = options.keyword || '';
this.coupon = options.coupon || 0;
this.goods_id_arr = options.goods_id_arr || 0;
this.brandId = options.brand_id || 0;
this.merch_id = options.merch_id || 0;
if(this.merch_id > 0){
this.getMerch()
}else{
uni.showModal({
title:'提示',
content:'商家不存在',
showCancel:false,
success(e){
uni.navigateBack({})
}
})
}
this.loadCategoryList(this.categoryId);
this.getBrandList();
this.isIphoneX = this.$util.uniappIsIPhoneX();
//小程序分享接收source_member
if (options.source_member) {
uni.setStorageSync('source_member', options.source_member);
}
// 小程序扫码进入接收source_member
if (options.scene) {
var sceneParams = decodeURIComponent(options.scene);
sceneParams = sceneParams.split('&');
if (sceneParams.length) {
sceneParams.forEach(item => {
if (item.indexOf('sku_id') != -1) this.skuId = item.split('-')[1];
if (item.indexOf('m') != -1) uni.setStorageSync('source_member', item.split('-')[1]);
if (item.indexOf('is_test') != -1) uni.setStorageSync('is_test', 1);
});
}
}
uni.onWindowResize(res => {
if (this.debounce) clearTimeout(this.debounce);
this.waterfallflow(0);
})
},
onShow() {
//记录分享关系
if (this.storeToken && uni.getStorageSync('source_member')) {
this.$util.onSourceMember(uni.getStorageSync('source_member'));
}
},
/**
* 转发分享
*/
onShareAppMessage(res) {
var title = '搜索到' + this.count + '件“' + this.keyword + this.category_title + this.coupon_name + '”相关的优质商品';
let route = this.$util.getCurrentShareRoute(this.memberInfo ? this.memberInfo.member_id : 0);
var path = route.path;
return {
title: title,
path: path,
success: res => {
},
fail: res => {
}
};
},
// 分享到微信朋友圈
onShareTimeline() {
var title = '搜索到' + this.count + '件“' + this.keyword + this.category_title + this.coupon_name + '”相关的优质商品';
let route = this.$util.getCurrentShareRoute(this.memberInfo ? this.memberInfo.member_id : 0);
var query = route.query;
return {
title: title,
query: query,
imageUrl: ''
};
},
methods: {
getMerch(){
this.$api.sendRequest({
url: '/merch/api/merch/merchinfo',
data: {
merch_id:this.merch_id
},
success: res => {
console.log(res)
this.merch = res.data
}
});
},
/**
* 获取优惠券数据
*/
couponInfo(id) {
return new Promise(resolve => {
this.$api.sendRequest({
url: '/coupon/api/coupon/typeinfo',
data: {
coupon_type_id: id
},
success: res => {
if (res.code >= 0) {
resolve(res.data.coupon_name);
}
}
});
})
},
/**
* 获取分类名称
*/
share_select(data, id) {
return new Promise((resolve) => {
data.forEach((item) => {
if (item.category_id == id) {
resolve(item.category_name)
}
if (item.child_list && item.child_list.length > 0) {
item.child_list.forEach((v) => {
if (v.category_id == id) {
resolve(v.category_name)
}
if (v.child_list && v.child_list.length > 0) {
v.forEach((m) => {
if (m.category_id == id) {
resolve(m.category_name)
}
})
}
})
}
})
})
},
//加载分类
loadCategoryList(fid, sid) {
this.$api.sendRequest({
url: '/api/goodscategory/tree',
data: {},
success: res => {
if (res.data != null) {
this.categoryList = res.data
}
}
});
},
getGoodsList(mescroll) {
this.$api.sendRequest({
url: '/api/goodssku/page',
data: {
page: mescroll.num,
page_size: mescroll.size,
keyword: this.keyword,
category_id: this.categoryId,
brand_id: this.brandId,
min_price: this.minPrice,
max_price: this.maxPrice,
is_free_shipping: (this.isFreeShipping ? 1 : 0),
order: this.order,
sort: this.sort,
coupon: this.coupon,
goods_id_arr: this.goods_id_arr,
merch_id:this.merch_id
},
success: res => {
let newArr = []
let msg = res.message;
if (res.code == 0 && res.data) {
this.count = res.data.count;
if (res.data.page_count == 0) {
this.emptyShow = true
}
newArr = res.data.list;
newArr = newArr.map(item => {
item.id = this.genNonDuplicate();
return item;
});
} else {
this.$util.showToast({
title: msg
})
}
this.category_title = '';
this.coupon_name = '';
if (res.data.config) this.config = res.data.config;
if (this.categoryId) {
this.share_select(this.categoryList, this.categoryId).then(resolve => {
this.category_title = resolve
});
}
if (this.coupon) {
this.couponInfo(this.coupon).then(resolve => {
this.coupon_name = resolve
});
}
mescroll.endSuccess(newArr.length);
//设置列表数据
if (mescroll.num == 1) this.goodsList = []; //如果是第一页需手动制空列表
this.goodsList = this.goodsList.concat(newArr); //追加新数据
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
this.waterfallflow((mescroll.num - 1) * 10);
},
fail: res => {
//联网失败的回调
mescroll.endErr();
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
}
});
},
changeListStyle() {
this.isList = !this.isList;
this.waterfallflow(0);
},
//筛选点击
sortTabClick(tag) {
if (tag == 'sale_num') {
this.order = 'sale_num';
this.sort = 'desc';
} else if (tag == 'discount_price') {
this.order = 'discount_price';
this.sort = 'desc';
} else if (tag == 'screen') {
//筛选
this.showScreen = true;
return;
} else {
this.order = '';
this.sort = '';
}
if (this.orderType === tag && tag !== 'discount_price') return;
this.orderType = tag;
if (tag === 'discount_price') {
this.priceOrder = this.priceOrder === 'asc' ? 'desc' : 'asc';
this.sort = this.priceOrder;
} else {
this.priceOrder = '';
}
this.emptyShow = false;
this.goodsList = [];
this.$refs.mescroll.refresh();
},
//商品详情
toDetail(item) {
this.$util.redirectTo('/pages/goods/detail', {
goods_id: item.goods_id
});
},
search() {
this.emptyShow = false;
this.goodsList = [];
this.$refs.mescroll.refresh();
},
selectedCategory(categoryId) {
this.categoryId = categoryId;
},
screenData() {
if (this.minPrice != '' || this.maxPrice != '') {
// if (!Number(this.minPrice) && this.minPrice) {
// this.$util.showToast({
// title: '请输入最低价'
// });
// return;
// }
if (!Number(this.maxPrice) && this.maxPrice) {
this.$util.showToast({
title: '请输入最高价'
});
return;
}
if (Number(this.minPrice) < 0 || Number(this.maxPrice) < 0) {
this.$util.showToast({
title: '筛选价格不能小于0'
});
return;
}
if (this.minPrice != '' && Number(this.minPrice) > Number(this.maxPrice) && this.maxPrice) {
this.$util.showToast({
title: '最低价不能大于最高价'
});
return;
}
if (this.maxPrice != '' && Number(this.maxPrice) < Number(this.minPrice)) {
this.$util.showToast({
title: '最高价不能小于最低价'
});
return;
}
}
this.emptyShow = false;
this.goodsList = [];
this.$refs.mescroll.refresh();
this.showScreen = false;
},
//重置数据
resetData() {
this.categoryId = 0
this.minPrice = ''
this.maxPrice = ''
this.isFreeShipping = false
},
goodsImg(imgStr) {
let imgs = imgStr.split(',');
return imgs[0] ? this.$util.img(imgs[0], {
size: 'mid'
}) : this.$util.getDefaultImage().goods;
},
imgError(index) {
this.goodsList[index].goods_image = this.$util.getDefaultImage().goods;
},
showPrice(data) {
let price = data.discount_price;
if (data.member_price && parseFloat(data.member_price) < parseFloat(price)) price = data.member_price;
return price;
},
showMarketPrice(item) {
if (item.market_price_show) {
let price = this.showPrice(item);
if (item.market_price > 0) {
return item.market_price;
} else if (parseFloat(item.price) > parseFloat(price)) {
return item.price;
}
}
return '';
},
goodsTag(data) {
return data.label_name || '';
},
/**
* 瀑布流
*/
waterfallflow(start = 0) {
if (!this.isList) {
//页面渲染完成后的事件
this.$nextTick(() => {
setTimeout(() => {
let listHeight = [];
let listPosition = [];
if (start != 0) {
listHeight = this.listHeight;
listPosition = this.listPosition;
}
let column = 2;
const query = uni.createSelectorQuery().in(this);
query.selectAll('.double-column .goods-item').boundingClientRect(data => {
for (let i = start; i < data.length; i++) {
if (i < column) {
let position = {};
position.top = uni.upx2px(20) + 'px';
if (i % column == 0) {
position.left = data[i].width * i + "px";
} else {
position.left = data[i].width * i + (i % column * uni
.upx2px(30)) + "px";
}
listPosition[i] = position;
listHeight[i] = data[i].height + uni.upx2px(20);
} else {
let minHeight = Math.min(...listHeight); // 找到第一列的最小高度
let minIndex = listHeight.findIndex(item => item === minHeight) // 找到最小高度的索引
//设置当前子元素项的位置
let position = {};
position.top = minHeight + uni.upx2px(20) + "px";
position.left = listPosition[minIndex].left;
listPosition[i] = position;
//重新定义数组最小项的高度 进行累加
listHeight[minIndex] += data[i].height + uni.upx2px(20);
}
}
this.listHeight = listHeight;
this.listPosition = listPosition;
}).exec();
}, 50)
})
}
},
getBrandList() {
var data = {
page: 1,
page_size: 0
};
this.$api.sendRequest({
url: '/api/goodsbrand/page',
data: data,
success: res => {
if (res.code == 0 && res.data) {
let data = res.data;
this.brandList = data.list;
}
}
});
},
/**
* 添加购物车回调
*/
addCart(id) {
},
genNonDuplicate(len = 6) {
return Number(Math.random().toString().substr(3, len) + Date.now()).toString(36);
}
}
}

View File

@@ -0,0 +1,308 @@
page {
overflow: hidden;
}
.alarm-red{
color: red;
}
.search-wrap {
display: flex;
justify-content: space-between;
padding: 30rpx 30rpx 0;
background-color: #fff;
.search-input-inner {
display: flex;
align-items: center;
width: 460rpx;
height: 70rpx;
padding: 0 30rpx;
background-color: $color-bg;
border-radius: 100rpx;
box-sizing: border-box;
.search-input-icon {
margin-right: 10rpx;
color: $color-tip;
}
}
.search-btn {
display: flex;
justify-content: center;
align-items: center;
width: 200rpx;
height: 70rpx;
color: #fff;
border-radius: 100rpx;
margin-left: 30rpx;
text {
margin-right: 10rpx;
}
}
}
.tab-block {
// position: relative;
display: flex;
flex-direction: row;
justify-content: space-between;
background: #fff;
// margin: 0 30rpx;
.choose {
// position: absolute;
// right: 0;
min-width: 50px;
background-color: #fff;
padding: 20rpx 0rpx 0 20rpx;
height: 66rpx;
}
.tab-wrap {
// width: calc(100% - 120rpx);
width: 100%;
// position: relative;
// overflow-x: scroll;
padding: 24rpx 0rpx 0 20rpx;
height: 66rpx;
background-color: #fff;
// white-space: nowrap;
// overflow: hidden;
// text-overflow: ellipsis;
display: flex;
flex-direction: row;
justify-content: space-around;
}
.tab-item {
// display: inline-block;
}
.active {
position: relative;
// margin-right: 32rpx;
font-weight: 600;
&::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
height:6rpx;
width: 100%;
}
}
}
.item-inner {
position: relative;
margin: 0 30rpx 20rpx;
background-color: #fff;
border-radius: $border-radius;
.item-wrap {
display: flex;
padding: 30rpx;
.item-img {
margin-right: 20rpx;
width: 160rpx;
height: 160rpx;
border-radius: $border-radius;
}
.item-desc {
flex: 1;
.item-name {
width: 450rpx;
line-height: 1.6;
color: $color-title;
display: flex;
// white-space: nowrap;
align-items: center;
font-weight: 600;
.name {
flex: 1;
width: 0;
line-height: 1.4;
}
.goods-class {
font-size: 24rpx;
}
}
.item-num-wrap {
margin-top: 3px;
font-size: $font-size-tag;
color: $color-tip;
text:first-of-type {
margin-right: 30rpx;
}
view{
font-size: 26rpx;
line-height: 1.4;
color:#999
}
}
.item-operation {
display: flex;
align-items: center;
justify-content: space-between;
line-height: 1;
padding-top: 10rpx;
.item-price {
font-weight: bold;
}
.iconshenglve {
font-size: 48rpx;
color: $color-tip;
}
}
.promotion-ident {
line-height: 1;
padding: 6rpx 0;
text{
font-size: $font-size-activity-tag;
padding: 2rpx 12rpx;
border-radius: 4rpx;
color: #fff;
margin-right:10rpx;
border-radius: 50rpx;
}
}
}
}
.operation {
overflow: hidden;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.6);
display: flex;
justify-content: space-around;
align-items: center;
border-radius: 10rpx;
.operation-item {
display: flex;
flex-direction: column;
align-items: center;
image {
width: 64rpx;
height: 64rpx;
}
text {
margin-top: 10rpx;
line-height: 1;
color: #fff;
}
}
}
}
.screen-wrap {
.title {
font-size: $font-size-tag;
padding: $padding;
background: $color-bg;
}
scroll-view {
height: 85%;
.item-wrap {
border-bottom: 1px solid $color-line;
&:last-child {
border-bottom: none;
}
.label {
font-size: $font-size-tag;
padding: $padding 30rpx 0 $padding;
display: flex;
justify-content: space-between;
align-items: center;
.more {
font-size: $font-size-tag;
picker {
display: inline-block;
vertical-align: middle;
view {
font-size: $font-size-tag;
}
}
.iconfont {
display: inline-block;
vertical-align: middle;
color: $color-tip;
font-size: $font-size-base;
}
}
.uni-tag {
padding: 0 $padding;
font-size: $font-size-goods-tag;
background: $color-bg;
height: 40rpx;
line-height: 40rpx;
border: 0;
margin-left: $margin-updown;
}
}
.list {
margin: $margin-updown $margin-both;
overflow: hidden;
.uni-tag {
padding: 0 $padding;
font-size: $font-size-goods-tag;
background: $color-bg;
height: 52rpx;
line-height: 52rpx;
border: 0;
margin-right: 20rpx;
margin-bottom: 20rpx;
&:nth-child(3n) {
margin-right: 0;
}
}
}
.value-wrap {
display: flex;
justify-content: center;
align-items: center;
padding: $padding;
.h-line {
width: 40rpx;
height: 2rpx;
background-color: $color-tip;
}
input {
flex: 1;
background: $color-line;
height: 60rpx;
line-height: 60rpx;
font-size: $font-size-goods-tag;
border-radius: 50rpx;
text-align: center;
&:first-child {
margin-right: 10rpx;
}
&:last-child {
margin-left: 10rpx;
}
}
picker {
display: inline-block;
vertical-align: middle;
view {
font-size: $font-size-tag;
}
}
}
}
}
.footer {
height: 90rpx;
display: flex;
justify-content: center;
align-items: flex-start;
//position: absolute;
bottom: 0;
width: 100%;
button {
margin: 0;
width: 40%;
&:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
&:last-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
}
}
}