高亮搜索热词,修改分销部分字段
parent
ea8e783909
commit
1aeec348eb
|
@ -7,4 +7,5 @@
|
|||
| `res` | 显示数据 | Array | 是 |
|
||||
| `type` | 商品展示类型 oneColumns twoColumns ,默认展示一行两列商品 | String | 否 |
|
||||
| `storeName` | 是否展示店铺名称,默认展示 | Boolean | 否 |
|
||||
| `keywords` | 高亮展示搜索内容 | String | 否 |
|
||||
|
||||
|
|
|
@ -4,12 +4,15 @@
|
|||
<view class="goods-list" v-if="type == 'twoColumns'">
|
||||
<view v-for="(item, index) in res" :key="index" class="goods-item">
|
||||
<view class="image-wrapper" @click="navigateToDetailPage(item)">
|
||||
<u-image :src="item.content.thumbnail" width="100%" height='330rpx' mode="aspectFill">
|
||||
<u-loading slot="loading"></u-loading>
|
||||
<u-image :src="item.content.thumbnail" width="100%" height='330rpx' mode="aspectFill">
|
||||
<u-loading slot="loading"></u-loading>
|
||||
</u-image>
|
||||
</view>
|
||||
<view class="goods-detail">
|
||||
<div class="title clamp" @click="navigateToDetailPage(item)">{{ item.content.goodsName }}</div>
|
||||
<div class="title clamp" v-html="lightSearchStr(keyword,item.content.goodsName)"
|
||||
@click="navigateToDetailPage(item)">
|
||||
|
||||
</div>
|
||||
<view class="price-box" @click="navigateToDetailPage(item)">
|
||||
<div class="price" v-if="item.content.price!=undefined">
|
||||
¥<span>{{ formatPrice(item.content.price )[0] }} </span>.{{
|
||||
|
@ -32,10 +35,10 @@
|
|||
<span>{{ item.content.commentNum || "0" }}条评论</span>
|
||||
</div>
|
||||
<div class="store-seller-name" v-if="storeName" @click="navigateToStoreDetailPage(item)">
|
||||
<div class="text-hidden" >
|
||||
<div class="text-hidden">
|
||||
<u-tag style="margin-right: 10rpx" size="mini" mode="dark" v-if="item.selfOperated"
|
||||
text="自营" type="error" />
|
||||
<span >{{ item.content.storeName || "暂无" }}</span>
|
||||
<span>{{ item.content.storeName || "暂无" }}</span>
|
||||
</div>
|
||||
<span>
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
|
@ -62,9 +65,9 @@
|
|||
}}
|
||||
</div>
|
||||
</view>
|
||||
<div class="promotion" @click="navigateToDetailPage(item)">
|
||||
<div v-if="item.content.salesModel == 'WHOLESALE'">
|
||||
<span>批</span>
|
||||
<div class="promotion" @click="navigateToDetailPage(item)">
|
||||
<div v-if="item.content.salesModel == 'WHOLESALE'">
|
||||
<span>批</span>
|
||||
</div>
|
||||
<div v-for="(promotionItem,promotionIndex) in getPromotion(item)" :key="promotionIndex">
|
||||
<span v-if="promotionItem.indexOf('COUPON') != -1">劵</span>
|
||||
|
@ -100,7 +103,9 @@
|
|||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
return {
|
||||
lightColor: this.$mainColor
|
||||
}
|
||||
},
|
||||
props: {
|
||||
// 遍历的数据
|
||||
|
@ -121,10 +126,56 @@
|
|||
storeName: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
keyword: {
|
||||
type: null,
|
||||
default: ''
|
||||
}
|
||||
|
||||
},
|
||||
watch: {
|
||||
keyword(val) {
|
||||
if (val) {
|
||||
this.lightSearchStr(val)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
// 高亮显示搜索内容
|
||||
lightSearchStr(keyword, str) {
|
||||
if (!keyword) {
|
||||
return str
|
||||
} else {
|
||||
let unicodes = '';
|
||||
for (let i of Array.from(keyword)) {
|
||||
unicodes += this.unicode(i) + "|"
|
||||
}
|
||||
const rule = '(' + unicodes + ')'
|
||||
const reg = new RegExp(rule, 'gi');
|
||||
return str ? str.replace(reg, matchValue =>
|
||||
`<span style="color:${this.lightColor}">${matchValue}</span>`
|
||||
) : ''
|
||||
}
|
||||
},
|
||||
// 转换为unicode
|
||||
unicode(str) {
|
||||
var value = '';
|
||||
for (var i = 0; i < str.length; i++) {
|
||||
value += '\\u' + this.left_zero_4(parseInt(str.charCodeAt(i)).toString(16));
|
||||
}
|
||||
return value;
|
||||
},
|
||||
left_zero_4(str) {
|
||||
if (str != null && str != '' && str != 'undefined') {
|
||||
if (str.length == 2) {
|
||||
return '00' + str;
|
||||
}
|
||||
}
|
||||
return str;
|
||||
},
|
||||
|
||||
|
||||
// 格式化金钱 1999 --> [1999,00]
|
||||
formatPrice(val) {
|
||||
if (typeof val == "undefined") {
|
||||
|
|
|
@ -42,7 +42,6 @@
|
|||
</view>
|
||||
<view class="log-item-footer">
|
||||
<view>会员名称:{{ item.memberName }}</view>
|
||||
<view>订单金额:{{ item.flowPrice | unitPrice }}</view>
|
||||
</view>
|
||||
<view class="log-item-footers">
|
||||
<view>订单号:{{ item.orderSn }}</view>
|
||||
|
|
|
@ -82,7 +82,7 @@
|
|||
<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' />
|
||||
<goodsList :res='goodsList' type='oneColumns' :keyword='keyword' />
|
||||
<uni-load-more :status="loadingType" @loadmore="loadmore()"></uni-load-more>
|
||||
</scroll-view>
|
||||
</div>
|
||||
|
@ -93,7 +93,7 @@
|
|||
">
|
||||
<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' />
|
||||
<goodsList :res='goodsList' :keyword='keyword' />
|
||||
<uni-load-more :status="loadingType"></uni-load-more>
|
||||
</scroll-view>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue