mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git
synced 2026-08-06 19:07:23 +08:00
feat: 更新项目配置与组件使用
- 在入口文件中引入uview-plus的配置,优化字体加载逻辑 - 移除manifest.json中不必要的权限描述 - 更新package.json和package-lock.json,添加开发依赖 - 调整多个组件的样式和结构,提升用户体验 - 修复部分组件的逻辑和样式问题,确保兼容性
This commit is contained in:
@@ -111,13 +111,41 @@ page {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
.scoll-page {
|
||||
.scoll-page,
|
||||
.goods-scroll {
|
||||
flex: 1;
|
||||
height: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.search-navbar-wrap {
|
||||
box-sizing: border-box;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.search-navbar {
|
||||
width: 100%;
|
||||
|
||||
:deep(.u-navbar__content__left) {
|
||||
width: auto !important;
|
||||
padding: 0 0 0 16rpx !important;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-content {
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: $bg-color;
|
||||
}
|
||||
|
||||
.content {
|
||||
background-color: $bg-color;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.index-nav-arrow:last-child {
|
||||
@@ -266,6 +294,8 @@ view {
|
||||
|
||||
.search-keyword {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
background-color: #ededed;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,18 +1,31 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<u-navbar :bg-color="navObj.background" :auto-back="false">
|
||||
<mSearch
|
||||
ref="mSearch"
|
||||
class="mSearch-input-box"
|
||||
@clickLeft="back"
|
||||
:mode="2"
|
||||
:placeholder="defaultKeyword"
|
||||
@search="doSearch(false)"
|
||||
@confirm="doSearch(false)"
|
||||
@SwitchType="doSearchSwitch()"
|
||||
v-model="keyword"
|
||||
:isFocusVal="!isShowSeachGoods"
|
||||
></mSearch>
|
||||
<u-navbar
|
||||
:bg-color="navObj.background"
|
||||
:auto-back="false"
|
||||
:fixed="true"
|
||||
:placeholder="true"
|
||||
:border="false"
|
||||
left-icon=""
|
||||
title=""
|
||||
class="search-navbar"
|
||||
>
|
||||
<template #left>
|
||||
<view class="search-navbar-wrap" :style="searchNavbarStyle">
|
||||
<mSearch
|
||||
ref="mSearch"
|
||||
class="mSearch-input-box"
|
||||
@clickLeft="back"
|
||||
:mode="2"
|
||||
:placeholder="defaultKeyword"
|
||||
@search="doSearch(false)"
|
||||
@confirm="doSearch(false)"
|
||||
@SwitchType="doSearchSwitch()"
|
||||
v-model="keyword"
|
||||
:isFocusVal="!isShowSeachGoods"
|
||||
></mSearch>
|
||||
</view>
|
||||
</template>
|
||||
</u-navbar>
|
||||
|
||||
<view class="search-keyword" v-if="!isShowSeachGoods">
|
||||
@@ -33,9 +46,11 @@
|
||||
<view class="keyword-block" v-if="oldKeywordList.length > 0">
|
||||
<view class="keyword-list-header"><view class="u-tips">搜索历史</view></view>
|
||||
<div class="oldKeyList">
|
||||
<div class="oldKeyItem" v-if="keyword" v-for="(keyword, index) in oldKeywordList" :key="index" @click="doSearch(keyword)">
|
||||
<template v-for="(keyword, index) in oldKeywordList" :key="index">
|
||||
<div class="oldKeyItem" v-if="keyword" @click="doSearch(keyword)">
|
||||
<span>{{ keyword }}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div @click="showMore" v-if="oldKeywordIndex > loadIndex" class="oldKeyItem">展示更多</div>
|
||||
</div>
|
||||
@@ -77,36 +92,32 @@
|
||||
<view class="nav-item" @click="sortGoods">筛选</view>
|
||||
</view>
|
||||
<!-- 一行一个商品展示 -->
|
||||
<div v-if="isSWitch">
|
||||
<scroll-view
|
||||
:style="{ height: goodsHeight }"
|
||||
enableBackToTop="true"
|
||||
lower-threshold="250"
|
||||
@scrolltolower="loadmore()"
|
||||
scroll-with-animation
|
||||
scroll-y
|
||||
class="scoll-page"
|
||||
>
|
||||
<goodsList :res="goodsList" type="oneColumns" :keyword="keyword" />
|
||||
<uni-load-more :status="loadingType" @loadmore="loadmore()"></uni-load-more>
|
||||
</scroll-view>
|
||||
</div>
|
||||
<scroll-view
|
||||
v-if="isSWitch"
|
||||
class="goods-scroll"
|
||||
enableBackToTop="true"
|
||||
lower-threshold="250"
|
||||
@scrolltolower="loadmore()"
|
||||
scroll-with-animation
|
||||
scroll-y
|
||||
>
|
||||
<goodsList :res="goodsList" type="oneColumns" :keyword="keyword" />
|
||||
<uni-load-more :status="loadingType" @loadmore="loadmore()"></uni-load-more>
|
||||
</scroll-view>
|
||||
<!-- 一行两个商品展示 -->
|
||||
<div v-if="!isSWitch && !(goodsList == [] || goodsList == '' || goodsList == null)">
|
||||
<scroll-view
|
||||
:style="{ height: goodsHeight }"
|
||||
scroll-anchoring
|
||||
enableBackToTop="true"
|
||||
@scrolltolower="loadmore()"
|
||||
scroll-with-animation
|
||||
scroll-y
|
||||
lower-threshold="250"
|
||||
class="scoll-page"
|
||||
>
|
||||
<goodsList :res="goodsList" :keyword="keyword" />
|
||||
<uni-load-more :status="loadingType"></uni-load-more>
|
||||
</scroll-view>
|
||||
</div>
|
||||
<scroll-view
|
||||
v-if="!isSWitch && !(goodsList == [] || goodsList == '' || goodsList == null)"
|
||||
class="goods-scroll"
|
||||
scroll-anchoring
|
||||
enableBackToTop="true"
|
||||
@scrolltolower="loadmore()"
|
||||
scroll-with-animation
|
||||
scroll-y
|
||||
lower-threshold="250"
|
||||
>
|
||||
<goodsList :res="goodsList" :keyword="keyword" />
|
||||
<uni-load-more :status="loadingType"></uni-load-more>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<u-popup border-radius="20" mode="right" width="90%" v-model:show="sortPopup">
|
||||
@@ -229,7 +240,6 @@ export default {
|
||||
type: '',
|
||||
index: ''
|
||||
},
|
||||
goodsHeight: '',
|
||||
defaultKeyword: '',
|
||||
keyword: '',
|
||||
oldKeywordList: [],
|
||||
@@ -267,10 +277,25 @@ export default {
|
||||
categoryId: ''
|
||||
},
|
||||
|
||||
routerVal: ''
|
||||
routerVal: '',
|
||||
capsuleInsetRight: 0,
|
||||
searchNavbarWidth: 0,
|
||||
};
|
||||
},
|
||||
|
||||
computed: {
|
||||
searchNavbarStyle() {
|
||||
if (this.searchNavbarWidth) {
|
||||
return {
|
||||
width: `${this.searchNavbarWidth}px`,
|
||||
};
|
||||
}
|
||||
return {
|
||||
width: '100%',
|
||||
};
|
||||
},
|
||||
},
|
||||
|
||||
onPageScroll(e) {
|
||||
console.log(e);
|
||||
this.scrollTop = e.scrollTop;
|
||||
@@ -309,6 +334,9 @@ export default {
|
||||
}
|
||||
this.loadData();
|
||||
},
|
||||
onReady() {
|
||||
this.setSearchNavbarWidth();
|
||||
},
|
||||
components: {
|
||||
mSearch,
|
||||
goodsList
|
||||
@@ -338,40 +366,22 @@ export default {
|
||||
this.loadData();
|
||||
},
|
||||
|
||||
mounted() {
|
||||
const { windowWidth, windowHeight } = uni.getSystemInfoSync();
|
||||
|
||||
let topHeight = 0;
|
||||
let navHeight = 0;
|
||||
|
||||
uni.getSystemInfo({
|
||||
success: function(res) {
|
||||
// res - 各种参数
|
||||
|
||||
let top = uni.createSelectorQuery().select('.u-navbar');
|
||||
top.boundingClientRect(function(data) {
|
||||
if (data && data.height) {
|
||||
//data - 各种参数
|
||||
topHeight = data.height; // 获取元素宽度
|
||||
}
|
||||
}).exec();
|
||||
let nav = uni.createSelectorQuery().select('.navbar');
|
||||
nav.boundingClientRect(function(data) {
|
||||
if (data && data.height) {
|
||||
//data - 各种参数
|
||||
navHeight = data.height; // 获取元素宽度
|
||||
}
|
||||
}).exec();
|
||||
}
|
||||
});
|
||||
this.goodsHeight = windowHeight - navHeight - topHeight;
|
||||
// #ifdef APP-PLUS
|
||||
this.goodsHeight = this.goodsHeight - 100;
|
||||
// #endif
|
||||
this.goodsHeight += 'px';
|
||||
},
|
||||
|
||||
methods: {
|
||||
setSearchNavbarWidth() {
|
||||
// #ifdef MP-WEIXIN
|
||||
try {
|
||||
const menuButton = uni.getMenuButtonBoundingClientRect();
|
||||
const { windowWidth } = uni.getWindowInfo();
|
||||
this.capsuleInsetRight = windowWidth - menuButton.left;
|
||||
const leftPadding = uni.upx2px(16);
|
||||
const gap = uni.upx2px(8);
|
||||
this.searchNavbarWidth =
|
||||
windowWidth - this.capsuleInsetRight - leftPadding - gap;
|
||||
} catch (e) {
|
||||
this.searchNavbarWidth = 280;
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
// 数据去重一下 只显示一次 减免 劵 什么的
|
||||
getPromotion(item) {
|
||||
if (item.promotionMap) {
|
||||
|
||||
Reference in New Issue
Block a user