You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
486 lines
12 KiB
486 lines
12 KiB
<template>
|
|
<view class="news-list">
|
|
<view class="mainnav flex">
|
|
<view class="mainnav--item" :class="{'active': current === 1}" @click="changeNav(1)">
|
|
<text>资料库</text>
|
|
</view>
|
|
|
|
<view class="mainnav--item" :class="{'active': current === 3}" @click="changeNav(3)">
|
|
<text>机构</text>
|
|
</view>
|
|
|
|
<view class="mainnav--item" :class="{'active': current === 4}" @click="changeNav(4)">
|
|
<text>专家</text>
|
|
</view>
|
|
|
|
</view>
|
|
<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback"
|
|
:up="upOption">
|
|
<!-- 检测机构 -->
|
|
<organ :active="currentNav" v-show="currentNav===3"></organ>
|
|
<!-- 专家服务 -->
|
|
<team :active="currentNav" v-show="currentNav===4"></team>
|
|
|
|
<view class="contain" :active="currentNav" v-show="currentNav===1">
|
|
<view >
|
|
<router-link
|
|
:to="{path: '/bundle_b/pages/resource_search/resource_search'}">
|
|
<u-search disabled
|
|
placeholder="请输入搜索内容" height="64" focus
|
|
></u-search>
|
|
</router-link>
|
|
</view>
|
|
<view >
|
|
<!-- 城市 -->
|
|
<router-link class="m-l-16 flex row-center city" to="/bundle_b/pages/city/city">
|
|
<text class="m-r-6">{{ cityInfo.name || '选择' }}</text>
|
|
<u-icon name="arrow-down" size="24" color="#FFFFFF"></u-icon>
|
|
<!-- <image class="icon-md m-l-30" src="/static/images/icon_news.png">
|
|
</image> -->
|
|
</router-link>
|
|
</view>
|
|
<view class="banner">
|
|
<ad-swipers :pid="30" height="340rpx">
|
|
</ad-swipers>
|
|
</view>
|
|
<tabs :current="active" @change="changeActive" :bar-width="60">
|
|
<!-- <tab name="全部"></tab> -->
|
|
<tab v-for="(item, index) in categoryList" :key="index" :name="item.name"></tab>
|
|
</tabs>
|
|
|
|
<tabs v-if="categoryList2.length" :current="active2" @change="changeActive2" :bar-width="60">
|
|
<!-- <tab name="全部"></tab> -->
|
|
<tab v-for="(item, index) in categoryList2" :key="index" :name="item.name"></tab>
|
|
</tabs>
|
|
|
|
<view class="main">
|
|
<view class="article-list">
|
|
<view class="article-item bg-white" v-for="(item, index) in newsList" :key="index" >
|
|
<router-link :to="{path: '/bundle/pages/resource_details/resource_details', query: {id: item.id, type}}">
|
|
<view class="flex col-top">
|
|
<view class="info flex-1">
|
|
<view class="title lg line-2 m-b-20" style="-webkit-line-clamp:1">{{ item.title }}</view>
|
|
<view class="lighter line-2">
|
|
<view>{{ item.intro }}</view>
|
|
</view>
|
|
<view class="flex row-between price">
|
|
<view class="xs muted">价格: <text style="color: red;">{{item.price_str}}</text></view>
|
|
</view>
|
|
</view>
|
|
<u-image width="240rpx" height="180rpx" class="img m-l-20" :src="item.image" />
|
|
</view>
|
|
|
|
<view class="flex row-between m-t-20">
|
|
<view class="xs muted">发布时间: {{item.create_time}}</view>
|
|
<view class="flex">
|
|
<image class="icon-sm" src="/static/images/icon_see.png"></image>
|
|
<view class="m-l-10 xs muted">{{ item.visit }}人浏览</view>
|
|
</view>
|
|
</view>
|
|
</router-link>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</mescroll-body>
|
|
<tabbar></tabbar>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
// import Organ from "../../components/components/organ.vue"
|
|
// import Team from "../../components/components/team.vue"
|
|
|
|
import {
|
|
mapGetters,
|
|
mapActions
|
|
} from 'vuex'
|
|
import {
|
|
getResourceCategoryList,
|
|
getResourceList
|
|
} from '@/api/store';
|
|
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins";
|
|
export default {
|
|
// components: {
|
|
// Organ,
|
|
// Team
|
|
// },
|
|
mixins: [MescrollMixin],
|
|
data() {
|
|
return {
|
|
current:1,
|
|
currentNav:1,
|
|
active: 0,
|
|
active2: 0,
|
|
upOption: {
|
|
auto: false,
|
|
empty: {
|
|
icon: '/static/images/news_null.png',
|
|
tip: "暂无数据",
|
|
}
|
|
},
|
|
cid:0,
|
|
cid2:0,
|
|
categoryList: [],
|
|
categoryList2: [],
|
|
newsList: [],
|
|
type: -1,
|
|
cate_type:0,
|
|
};
|
|
},
|
|
|
|
async onShow() {
|
|
console.log(111)
|
|
// this.categoryList = [],
|
|
// this.type = 0;
|
|
// this.cate_type = 0;
|
|
uni.setNavigationBarTitle({
|
|
title: '资料库'
|
|
});
|
|
// this.cid = 0
|
|
// this.current = 1
|
|
// this.currentNav = 1
|
|
|
|
let queryString = uni.getStorageSync("params")
|
|
uni.removeStorageSync("params")
|
|
console.log("获取的参数:",queryString)
|
|
if(queryString){
|
|
// 使用URLSearchParams类解析查询参数
|
|
const regex =/([^=&]+)=([^&]*)/g;
|
|
let match, params = {};
|
|
|
|
while (match = regex.exec(queryString)) {
|
|
params[match[1]] = match[2];
|
|
}
|
|
|
|
// 使用get方法获取index和cate的值
|
|
let p_index = params['index'];
|
|
let p_cate = params['cate'];
|
|
let cate_type = params['cate_type'];
|
|
|
|
if(p_index !=undefined && p_index!=""){
|
|
this.current = parseInt(p_index)
|
|
this.currentNav = parseInt(p_index)
|
|
}else{
|
|
this.current = 1
|
|
this.currentNav = 1
|
|
}
|
|
|
|
if(p_cate !=undefined && p_cate!=""){
|
|
this.cid = parseInt(p_cate)
|
|
}else{
|
|
this.cid = 0
|
|
}
|
|
|
|
if(cate_type !=undefined && cate_type!=""){
|
|
this.cate_type = parseInt(cate_type)
|
|
this.active = 0
|
|
this.active2 = 0
|
|
if(this.cate_type == 1){
|
|
uni.setNavigationBarTitle({
|
|
title: '全国案例'
|
|
});
|
|
}
|
|
}
|
|
|
|
}else if(queryString == ""){
|
|
this.cid = 0
|
|
this.current = 1
|
|
this.currentNav = 1
|
|
this.categoryList = [],
|
|
this.type = 0;
|
|
this.cate_type = 0;
|
|
}
|
|
|
|
|
|
console.log("this.cate_type :",this.cate_type,this.cate_type )
|
|
console.log("this.active :",this.current,this.currentNav )
|
|
// 选择城市后是否刷新
|
|
await this.downCallback();
|
|
},
|
|
|
|
async onLoad() {
|
|
|
|
this.type = 0;
|
|
uni.setNavigationBarTitle({
|
|
title: '资料库'
|
|
});
|
|
console.log(11111)
|
|
// 选择城市后是否刷新
|
|
// await this.downCallback();
|
|
|
|
},
|
|
|
|
methods: {
|
|
changeNav(index){
|
|
if(index == 1){
|
|
this.current = index
|
|
this.currentNav = index
|
|
console.log("此时数据：",this.currentNav)
|
|
this.mescroll.resetUpScroll();
|
|
}else if(index == 3){
|
|
|
|
uni.navigateTo({
|
|
url: "/bundle_b/pages/resource_list/ogran_list"
|
|
});
|
|
}
|
|
else if(index == 4){
|
|
uni.navigateTo({
|
|
url: "/bundle_b/pages/resource_list/team_list"
|
|
});
|
|
}
|
|
},
|
|
changeActive(e) {
|
|
this.active2 = 0 ;
|
|
this.active = e;
|
|
this.newsList = [] // 先置空列表,显示加载进度
|
|
this.mescroll.resetUpScroll() // 再刷新列表数据
|
|
},
|
|
changeActive2(e) {
|
|
this.active2 = e;
|
|
this.newsList = [] // 先置空列表,显示加载进度
|
|
this.mescroll.resetUpScroll() // 再刷新列表数据
|
|
},
|
|
async downCallback() {
|
|
await this.getCategoryListFun();
|
|
this.mescroll.resetUpScroll();
|
|
},
|
|
upCallback(page) {
|
|
const { cityInfo,type, active, categoryList } = this
|
|
console.log("active:",categoryList[this.active])
|
|
let city_id=0
|
|
if(cityInfo.id !=null && cityInfo.id!=undefined && cityInfo.id>0){
|
|
city_id = cityInfo.id
|
|
}
|
|
getResourceList({
|
|
type: this.type,
|
|
cid: this.active ? categoryList[this.active].id : '',
|
|
cid2: this.active2 ? this.categoryList2[this.active2].id : '',
|
|
city_id:city_id,
|
|
page_size:page.size,
|
|
page_no:page.num,
|
|
cate_type: this.cate_type,
|
|
}).then(({
|
|
data
|
|
}) => {
|
|
if (page.num == 1) this.newsList = [];
|
|
let curPageData = data.list;
|
|
let curPageLen = curPageData.length;
|
|
let hasNext = !!data.more;
|
|
this.newsList = this.newsList.concat(curPageData);
|
|
this.mescroll.endSuccess(curPageLen, hasNext);
|
|
}).catch(() => {
|
|
this.mescroll.endErr()
|
|
})
|
|
this.getCategoryListFun2();
|
|
},
|
|
|
|
async getCategoryListFun2() {
|
|
console.log("获取子分类开始",this.active)
|
|
this.categoryList2 = [];
|
|
console.log("当前分类",this.categoryList[this.active].id)
|
|
|
|
const {
|
|
code,
|
|
data
|
|
} = await getResourceCategoryList({
|
|
pid: this.active ? this.categoryList[this.active].id : 999,
|
|
})
|
|
|
|
if (code == 1 && data.length>0) {
|
|
this.categoryList2 = [{
|
|
name: '全部',
|
|
id: ''
|
|
}, ...data]
|
|
}
|
|
let item = {}
|
|
|
|
this.$nextTick(() => {
|
|
// 在DOM更新之后使用Vue.set来更新数组
|
|
this.categoryList2.forEach((item, index) => {
|
|
this.$set(this.categoryList2, index, item);
|
|
});
|
|
});
|
|
|
|
this.categoryList2.forEach((item, index) => {
|
|
if(this.cid2>0 && item.id == this.cid2){
|
|
this.active2 = index+1
|
|
}
|
|
})
|
|
},
|
|
|
|
|
|
async getCategoryListFun() {
|
|
this.categoryList = [];
|
|
console.log("当前分类",this.categoryList)
|
|
let {
|
|
cityInfo,
|
|
isLogin
|
|
} = this;
|
|
const {
|
|
code,
|
|
data
|
|
} = await getResourceCategoryList({
|
|
cate_type: this.cate_type,
|
|
})
|
|
|
|
if (code == 1) {
|
|
this.categoryList = [{
|
|
name: '全部',
|
|
id: ''
|
|
}, ...data]
|
|
}
|
|
let item = {}
|
|
|
|
if(this.cate_type == 0){
|
|
let item = {id:0,name:"全国"}
|
|
if(cityInfo.id !=null && cityInfo.id!=undefined && cityInfo.id>0){
|
|
item = {id:"city_"+cityInfo.id,name:"本地"}
|
|
}
|
|
this.categoryList.push(item)
|
|
}
|
|
|
|
if(isLogin){
|
|
item = {id:"my_buy",name:"我的购买"}
|
|
this.categoryList.push(item)
|
|
|
|
item = {id:"my_download",name:"我的下载"}
|
|
this.categoryList.push(item)
|
|
}
|
|
this.$nextTick(() => {
|
|
// 在DOM更新之后使用Vue.set来更新数组
|
|
this.categoryList.forEach((item, index) => {
|
|
this.$set(this.categoryList, index, item);
|
|
});
|
|
});
|
|
|
|
this.categoryList.forEach((item, index) => {
|
|
if(this.cid>0 && item.id == this.cid){
|
|
console.log("当前值：{}",this.cate_type)
|
|
if(this.cate_type == 0){
|
|
this.active = index+1
|
|
}else{
|
|
this.active = index
|
|
}
|
|
console.log("当前值：{}",this.active)
|
|
|
|
}
|
|
})
|
|
|
|
},
|
|
},
|
|
computed: {
|
|
...mapGetters(['cityInfo'])
|
|
}
|
|
|
|
};
|
|
</script>
|
|
<style lang="scss">
|
|
|
|
.news-list {
|
|
.mainnav {
|
|
padding: 16rpx 150rpx;
|
|
background-color: $-color-white;
|
|
&--item {
|
|
width: 150rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 500;
|
|
text-align: center;
|
|
color: #BBBBBB;
|
|
transition: all .2s linear;
|
|
|
|
.new {
|
|
width: 10rpx;
|
|
height: 10rpx;
|
|
border-radius: 50%;
|
|
display: inline-block;
|
|
margin-bottom: 24rpx;
|
|
background-color: $-color-primary;
|
|
}
|
|
}
|
|
|
|
.active {
|
|
color: #000000;
|
|
}
|
|
}
|
|
|
|
.main {
|
|
.article-list {
|
|
padding-top: 20rpx;
|
|
|
|
.article-item {
|
|
padding: 20rpx;
|
|
align-items: flex-start;
|
|
&:not(:last-of-type){
|
|
border-bottom: $-solid-border;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
page {
|
|
padding: 0;
|
|
}
|
|
.index-bg {
|
|
background-image: url('https://cdn.ahbcqz.com/uploads/images/202307051615359ddc37211.png');
|
|
background-size: 100% auto;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
.index {
|
|
min-height: calc(100vh - var(--window-bottom));
|
|
|
|
.u-navbar {
|
|
::v-deep .u-search {
|
|
padding: 0 30rpx;
|
|
}
|
|
}
|
|
|
|
// 胶囊提示
|
|
.capsule-tips {
|
|
width: 584rpx;
|
|
color: #FFFFFF;
|
|
padding: 12rpx 18rpx;
|
|
border-radius: 14rpx;
|
|
background: rgba(0, 0, 0, 0.7);
|
|
position: relative;
|
|
position: absolute;
|
|
z-index: 9999;
|
|
bottom: -80rpx;
|
|
right: -150rpx;
|
|
}
|
|
.capsule-tips::after {
|
|
content: '';
|
|
border-bottom: 14rpx solid rgba(0, 0, 0, 0.7);
|
|
border-right: 14rpx solid transparent;
|
|
border-left: 14rpx solid transparent;
|
|
position: absolute;
|
|
top: -14rpx;
|
|
right: 88rpx;
|
|
}
|
|
|
|
.cate-btn {
|
|
padding: 12rpx 16rpx 12rpx 20rpx;
|
|
border-radius: 60rpx 0 0 60rpx;
|
|
background-color: rgba(256, 256, 256, .4);
|
|
}
|
|
}
|
|
.col-top {
|
|
position: relative;
|
|
.price {
|
|
position: absolute;
|
|
bottom:10rpx;
|
|
}
|
|
}
|
|
|
|
.city {
|
|
position: absolute;
|
|
top: 100rpx;
|
|
z-index: 999;
|
|
color: #fff;
|
|
padding: 10rpx 15rpx;
|
|
background: rgba(0,0,0,.3);
|
|
border-radius: 10rpx;
|
|
}
|
|
</style>
|
|
|