tmp: 部分代码与UnishopV5结合，但是代码有严重缺陷
This commit is contained in:
@@ -1,58 +1,58 @@
|
||||
<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 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" :key="item.category_id || index">
|
||||
<!---->
|
||||
<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> -->
|
||||
@@ -64,34 +64,34 @@
|
||||
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",
|
||||
}
|
||||
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()
|
||||
uni.hideTabBar()
|
||||
this.getCategory()
|
||||
// this.getgoodslist()
|
||||
},
|
||||
@@ -101,118 +101,118 @@
|
||||
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()
|
||||
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');
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 切换一级分类
|
||||
* @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() {
|
||||
getDiyInfo() {
|
||||
|
||||
},
|
||||
toLogin() {
|
||||
@@ -226,8 +226,8 @@
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import './public/category.scss';
|
||||
<style lang="scss">
|
||||
@import './public/category.scss';
|
||||
|
||||
/deep/ .uni-popup__wrapper.uni-center {
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
|
||||
Reference in New Issue
Block a user