| | |
| | | </view> |
| | | <view class="search"> |
| | | <u-search placeholder="请输入关键词" height="36" searchIconColor="#999999" borderColor="#eeeeee" |
| | | bgColor="rgba(255,255,255,0.9)" :showAction="false" v-model="keyword" /> |
| | | bgColor="rgba(255,255,255,0.9)" :showAction="false" v-model="info" @search="search" @clear="search" /> |
| | | <view class="search-shai" @click="show = true"> |
| | | <text>筛选</text> |
| | | <image src="/static/icon/ic_shaixuan@2x.png" mode="widthFix"></image> |
| | |
| | | </view> |
| | | </view> |
| | | <view class="list"> |
| | | <view class="list-item" v-for="(item, index) in 10" :key="index"> |
| | | <view class="list-item" v-for="(item, index) in list" :key="index" @click="jump(item.id)"> |
| | | <view class="info"> |
| | | <view class="info-title">挖掘机在冬季起动为什么困难?</view> |
| | | <view class="info-desc">挖掘机在冬季起动为什么困难?不仅决定于本身的技术状况,还受外界气温的影响</view> |
| | | <view class="info-title">{{item.name}}</view> |
| | | <view class="info-desc" v-if="item.contentInfo">{{item.contentInfo}}</view> |
| | | <view class="info-data"> |
| | | <view class="tips">维修</view> |
| | | <text>100 阅读|2025-10-10 21:00</text> |
| | | <view class="tips">{{item.lablesName}}</view> |
| | | <text>{{item.looknum || 0}} 阅读|{{item.createDate}}</text> |
| | | </view> |
| | | </view> |
| | | <view class="image"> |
| | | <image src="/static/logo.png" mode="widthFix"></image> |
| | | <view class="image" v-if="item.imgurlfull"> |
| | | <image :src="item.imgurlfull" mode="widthFix"></image> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | <view class="sear-item"> |
| | | <view class="sear-item-label">分类</view> |
| | | <view class="sear-item-list"> |
| | | <view class="sear-item-list-item active">维修</view> |
| | | <view class="sear-item-list-item">保养</view> |
| | | <view :class="item.active ? 'sear-item-list-item active' : 'sear-item-list-item'" v-for="(item, index) in fenlei" :key="item.id" @click="sele(index, 1)">{{item.name}}</view> |
| | | <view style="width: 216rpx; height: 0;"></view> |
| | | </view> |
| | | </view> |
| | | <view class="sear-item"> |
| | | <view class="sear-item-label">所属品牌</view> |
| | | <view class="sear-item-list"> |
| | | <view class="sear-item-list-item active">品牌名称</view> |
| | | <view class="sear-item-list-item">品牌名称</view> |
| | | <view :class="item.active ? 'sear-item-list-item active' : 'sear-item-list-item'" v-for="(item, index) in pinpai" :key="item.id" @click="sele(index, 2)">{{item.name}}</view> |
| | | <view style="width: 216rpx; height: 0;"></view> |
| | | </view> |
| | | </view> |
| | | <view class="sear-footer"> |
| | | <view class="sear-footer-btn1">重置</view> |
| | | <view class="sear-footer-btn2">确认</view> |
| | | <view class="sear-footer-btn1" @click="reset">重置</view> |
| | | <view class="sear-footer-btn2" @click="search">确认</view> |
| | | </view> |
| | | </view> |
| | | </u-popup> |
| | |
| | | data() { |
| | | return { |
| | | show: false, |
| | | keyword: '' |
| | | info: '', |
| | | page: 1, |
| | | next: true, |
| | | list: [], |
| | | fenlei: [], |
| | | pinpai: [] |
| | | }; |
| | | }, |
| | | onLoad() { |
| | | this.getList() |
| | | this.getCategary() |
| | | }, |
| | | onReachBottom() { |
| | | this.getList() |
| | | }, |
| | | methods: { |
| | | reset() { |
| | | this.page = 1 |
| | | this.next = true |
| | | this.list = [] |
| | | this.fenlei.forEach(item => { item.active = false }) |
| | | this.pinpai.forEach(item => { item.active = false }) |
| | | this.show = false |
| | | this.getList() |
| | | }, |
| | | search() { |
| | | this.page = 1 |
| | | this.next = true |
| | | this.list = [] |
| | | this.show = false |
| | | this.getList() |
| | | }, |
| | | sele(index, type) { |
| | | if (type === 1) { |
| | | this.fenlei.forEach((item, i) => { |
| | | item.active = index === i |
| | | }) |
| | | } else { |
| | | this.pinpai.forEach((item, i) => { |
| | | item.active = index === i |
| | | }) |
| | | } |
| | | }, |
| | | getCategary() { |
| | | this.$u.api.getGoodsLabelsByType({ |
| | | type: 0 |
| | | }).then(res => { |
| | | if (res.code === 200) { |
| | | res.data.forEach(item => { |
| | | item.active = false |
| | | }) |
| | | this.fenlei = res.data |
| | | } |
| | | }) |
| | | this.$u.api.getGoodsLabelsByType({ |
| | | type: 1 |
| | | }).then(res => { |
| | | if (res.code === 200) { |
| | | res.data.forEach(item => { |
| | | item.active = false |
| | | }) |
| | | this.pinpai = res.data |
| | | } |
| | | }) |
| | | }, |
| | | jump(id) { |
| | | uni.navigateTo({ |
| | | url: '/pages/article-details/article-details?id=' + id |
| | | }) |
| | | }, |
| | | getList() { |
| | | if (!this.next) return; |
| | | this.$u.api.getArticlePage({ |
| | | capacity: 10, |
| | | page: this.page, |
| | | model: { |
| | | info: this.info, |
| | | brandId: this.pinpai.filter(item => item.active).length > 0 ? this.pinpai.filter(item => item.active)[0].id : null, |
| | | labelId: this.fenlei.filter(item => item.active).length > 0 ? this.fenlei.filter(item => item.active)[0].id : null |
| | | } |
| | | }).then(res => { |
| | | if (res.code === 200) { |
| | | this.list.push(...res.data.records) |
| | | this.page++ |
| | | if (this.list.length === res.data.total) { |
| | | this.next = false |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | } |
| | | } |
| | | </script> |