|
@@ -1,14 +1,55 @@
|
|
|
<template>
|
|
|
<view class="">
|
|
|
<navbar :config="config" backColor="#999999"></navbar>
|
|
|
- <view class="tabs-box" :style="{'top':navHeight + 'px' , 'height':tabsHeight+'rpx','paddingBottom':'30rpx'}">
|
|
|
- <!-- <view class="tab-item" v-for="item in tabs" @click.stop="onChange(item)">
|
|
|
+ <view class="itemBox">
|
|
|
+ <view class="itemBox_title">
|
|
|
+ <image src="/static/czd/discovery_tag.png" mode=""></image>
|
|
|
+ 身边人
|
|
|
+ </view>
|
|
|
+ <image class="itemBox_banner" :src="banner.moduleImage" mode="" @click="$openPage(banner)"></image>
|
|
|
+ </view>
|
|
|
+ <view class="itemBox" v-if="liveList.length>0">
|
|
|
+ <view class="itemBox_title">
|
|
|
+ <image src="/static/czd/discovery_tag.png" mode=""></image>
|
|
|
+ 身边景
|
|
|
+ </view>
|
|
|
+ <view class="itemBox_videos">
|
|
|
+ <view v-for="(v,i) in liveList" :key="i" @click="goLive(v)">
|
|
|
+ <image class="itemBox_videos_img" :src="v.livePicture" mode=""></image>
|
|
|
+ <image class="itemBox_videos_switch" src="/static/czd/discovery_switch.png" mode=""></image>
|
|
|
+ <view class="itemBox_videos_title">{{v.liveTitle}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="itemBox">
|
|
|
+ <view class="itemBox_title">
|
|
|
+ <image src="/static/czd/discovery_tag.png" mode=""></image>
|
|
|
+ 身边剧
|
|
|
+ </view>
|
|
|
+ <view class="itemBox_videos">
|
|
|
+ <view v-for="(v,i) in 6" :key="i">
|
|
|
+ <image class="itemBox_videos_img" src="/static/czd/banner_tc.png" mode=""></image>
|
|
|
+ <view class="itemBox_videos_type">独播</view>
|
|
|
+ <view class="itemBox_videos_title1">大唐狄公案大唐狄公案大唐狄公案</view>
|
|
|
+ <view class="itemBox_videos_tig">周一围寻真相破...</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- :style="{'top':navHeight + 'px' , 'height':tabsHeight+'rpx','paddingBottom':'30rpx'}" -->
|
|
|
+ <u-sticky :offset-top="navHeight">
|
|
|
+ <view class="tabs-box">
|
|
|
+ <!-- <view class="tab-item" v-for="item in tabs" @click.stop="onChange(item)">
|
|
|
{{ item}}
|
|
|
</view> -->
|
|
|
- <u-tabs style="width: 100%;" :list="tabs" active-color="#3CBACF" bg-color="transparent" height="80"
|
|
|
- is-scroll :current="tabIndex" @change="onChange"></u-tabs>
|
|
|
- </view>
|
|
|
- <view class="" :style="{'width':'100%', 'height': tabsHeight + 'rpx' }" />
|
|
|
+ <view class="tabs-box_title">
|
|
|
+ <image src="/static/czd/discovery_tag.png" mode=""></image>
|
|
|
+ <text>身边事</text>
|
|
|
+ </view>
|
|
|
+ <u-tabs class="utabs" :list="tabs" active-color="#3CBACF" bar-width="60" bg-color="transparent"
|
|
|
+ height="80" is-scroll :current="tabIndex" @change="onChange"></u-tabs>
|
|
|
+ </view>
|
|
|
+ </u-sticky>
|
|
|
+ <!-- <view class="" :style="{'width':'100%', 'height': tabsHeight + 'rpx' }" /> -->
|
|
|
|
|
|
<view class="fx-kong-kim" v-if="tabIndex === 0 && KongKim && KongKim.length > 0">
|
|
|
<block v-for="(item , index) in KongKim">
|
|
@@ -54,8 +95,13 @@
|
|
|
getAPPList,
|
|
|
getDiscover,
|
|
|
newsClassify,
|
|
|
- getInformationFindPage
|
|
|
+ getInformationFindPage,
|
|
|
+ getThemeModule
|
|
|
} from "@/api/government.js";
|
|
|
+ import {
|
|
|
+ getYiChangNews,
|
|
|
+ openYiChangNews
|
|
|
+ } from "../government/conmon.js"
|
|
|
let app = getApp();
|
|
|
export default {
|
|
|
data() {
|
|
@@ -64,9 +110,10 @@
|
|
|
config: {
|
|
|
back: false,
|
|
|
title: '发现',
|
|
|
- color: 'black',
|
|
|
- backgroundColor: [1, '#fff'],
|
|
|
- statusBarFontColor: 'black'
|
|
|
+ color: '#fff',
|
|
|
+ // backgroundColor: [1, '#fff'],
|
|
|
+ backgroundColor: 'transparent',
|
|
|
+ statusBarFontColor: '#fff'
|
|
|
},
|
|
|
tabs: [{
|
|
|
list: []
|
|
@@ -76,7 +123,10 @@
|
|
|
tabIndex: 0,
|
|
|
dataList: [],
|
|
|
pageSize: 10,
|
|
|
- waterfallKey: 1
|
|
|
+ waterfallKey: 1,
|
|
|
+ banner:{},
|
|
|
+ liveList:[],
|
|
|
+ navHeight:0
|
|
|
}
|
|
|
},
|
|
|
onLoad() {
|
|
@@ -84,12 +134,15 @@
|
|
|
statusBarHeight,
|
|
|
navHeight
|
|
|
} = app.globalData;
|
|
|
- this.navHeight = statusBarHeight + navHeight + 'px';
|
|
|
+ // #ifdef APP
|
|
|
+ this.navHeight = 2*(statusBarHeight + navHeight-10);
|
|
|
+ // #endif
|
|
|
// let data = uni.getStorageSync('discoveryPage');
|
|
|
// if (data) {
|
|
|
// this.tabs[0].list = data.rows
|
|
|
// }
|
|
|
- this.init()
|
|
|
+ this.init();
|
|
|
+ this.getTheme();
|
|
|
},
|
|
|
onShow() {
|
|
|
|
|
@@ -117,7 +170,18 @@
|
|
|
}];
|
|
|
this.tabIndex = 0;
|
|
|
this.getKongKim();
|
|
|
- this.getLabel(tag)
|
|
|
+ this.getLabel(tag);
|
|
|
+ this.getLiveList();
|
|
|
+ },
|
|
|
+ getLiveList(){
|
|
|
+ this.$yghttp.get('/live/liveInfo/list').then(res => {
|
|
|
+ this.liveList = res.data;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ goLive(item){
|
|
|
+ uni.navigateTo({
|
|
|
+ url:"/pages/government/live?liveId="+item.liveId
|
|
|
+ })
|
|
|
},
|
|
|
getKongKim() {
|
|
|
getAPPList(this.$keys.FX_KONGKIM).then(res => {
|
|
@@ -139,11 +203,23 @@
|
|
|
return el;
|
|
|
});
|
|
|
this.tabs = this.tabs.concat(tabs);
|
|
|
+ let obj = {
|
|
|
+ name: '宜昌发布',
|
|
|
+ list: [],
|
|
|
+ pageNum: 0,
|
|
|
+ loadingStatus: ""
|
|
|
+ }
|
|
|
+ this.tabs.splice(1, 0, obj);
|
|
|
this.tabs.forEach((el, index) => {
|
|
|
this.getPage(index)
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
+ getTheme() {
|
|
|
+ getThemeModule('discovery_Page').then(res => {
|
|
|
+ this.banner = res.data.themeModuleVoList&&res.data.themeModuleVoList.length>0?res.data.themeModuleVoList[0]:{};
|
|
|
+ });
|
|
|
+ },
|
|
|
getPage(tabIndex) {
|
|
|
if (this.tabs[tabIndex].pageNum <= 0) {
|
|
|
this.tabs[tabIndex].pageNum = 0;
|
|
@@ -165,28 +241,55 @@
|
|
|
parms.informationTypeId = this.tabs[tabIndex].informationTypeId
|
|
|
}
|
|
|
setTimeout(() => {
|
|
|
- getInformationFindPage(parms).then(res => {
|
|
|
- try {
|
|
|
- if (res.code === 200) {
|
|
|
+ // let apiFun=tabIndex==1?getYiChangNews:getInformationFindPage
|
|
|
+ if (tabIndex != 1) {
|
|
|
+ getInformationFindPage(parms).then(res => {
|
|
|
+ try {
|
|
|
+ if (res.code === 200) {
|
|
|
+ if (this.tabs[tabIndex].pageNum <= 0) {
|
|
|
+ this.tabs[tabIndex].list = [];
|
|
|
+ }
|
|
|
+ const arr = this.tabs[tabIndex].list.concat(res.rows ||
|
|
|
+ []);
|
|
|
+ this.$set(this.tabs[tabIndex], 'list', arr)
|
|
|
+ };
|
|
|
+ } catch (e) {}
|
|
|
+
|
|
|
+ this.$forceUpdate()
|
|
|
+ this.tabs[tabIndex].loadingStatus = this.$mUtil.pagination(res
|
|
|
+ .total,
|
|
|
+ this.tabs[tabIndex].pageNum, this.pageSize)
|
|
|
+ }).catch(err => {
|
|
|
+ this.tabs[tabIndex].pageNum--;
|
|
|
+ this.tabs[tabIndex].loadingStatus = 'noMore';
|
|
|
+ }).finally(() => {
|
|
|
+ // this.status = 'noMore'
|
|
|
+ this.allLoading = false;
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ getYiChangNews(this.pageSize, this.tabs[1].pageNum, true).then(res => {
|
|
|
+ try {
|
|
|
if (this.tabs[tabIndex].pageNum <= 0) {
|
|
|
this.tabs[tabIndex].list = [];
|
|
|
}
|
|
|
- const arr = this.tabs[tabIndex].list.concat(res.rows || []);
|
|
|
+ const arr = this.tabs[tabIndex].list.concat(res.data || []);
|
|
|
this.$set(this.tabs[tabIndex], 'list', arr)
|
|
|
- };
|
|
|
- } catch (e) {}
|
|
|
-
|
|
|
- this.$forceUpdate()
|
|
|
- this.tabs[tabIndex].loadingStatus = this.$mUtil.pagination(res.total,
|
|
|
- this.tabs[tabIndex].pageNum, this.pageSize)
|
|
|
- }).catch(err => {
|
|
|
- this.tabs[tabIndex].pageNum--;
|
|
|
- this.tabs[tabIndex].loadingStatus = 'noMore';
|
|
|
- }).finally(() => {
|
|
|
- // this.status = 'noMore'
|
|
|
- this.allLoading = false;
|
|
|
- uni.stopPullDownRefresh();
|
|
|
- })
|
|
|
+ } catch (e) {}
|
|
|
+
|
|
|
+ this.$forceUpdate()
|
|
|
+ this.tabs[tabIndex].loadingStatus = this.$mUtil.pagination(res
|
|
|
+ .total,
|
|
|
+ this.tabs[tabIndex].pageNum, this.pageSize)
|
|
|
+ }).catch(err => {
|
|
|
+ this.tabs[tabIndex].pageNum--;
|
|
|
+ this.tabs[tabIndex].loadingStatus = 'noMore';
|
|
|
+ }).finally(() => {
|
|
|
+ // this.status = 'noMore'
|
|
|
+ this.allLoading = false;
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ })
|
|
|
+ }
|
|
|
}, 500)
|
|
|
})
|
|
|
},
|
|
@@ -200,21 +303,152 @@
|
|
|
</script>
|
|
|
<style>
|
|
|
page {
|
|
|
- background-color: #F9F9F9;
|
|
|
+ /* background-color: #F9F9F9; */
|
|
|
+ background: #fff;
|
|
|
padding-bottom: 30rpx;
|
|
|
}
|
|
|
</style>
|
|
|
<style lang="scss" scoped>
|
|
|
+ /deep/.hx-navbar__fixed {
|
|
|
+ background: linear-gradient(180deg, #68d1be, #41b8cd);
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBox {
|
|
|
+ padding: 40rpx 30rpx 0rpx;
|
|
|
+
|
|
|
+ .itemBox_title {
|
|
|
+ display: flex;
|
|
|
+ font-size: 34rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #1A1A1A;
|
|
|
+
|
|
|
+ >image {
|
|
|
+ width: 16rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBox_banner {
|
|
|
+ width: 690rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBox_videos {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ >view {
|
|
|
+ position: relative;
|
|
|
+ margin-right: 20rpx;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+
|
|
|
+ &:nth-child(3n) {
|
|
|
+ margin-right: 0 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBox_videos_img {
|
|
|
+ width: 217rpx;
|
|
|
+ height: 316rpx;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBox_videos_switch {
|
|
|
+ width: 98rpx;
|
|
|
+ height: 98rpx;
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ margin-left: -22.5%;
|
|
|
+ margin-top: -22.5%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBox_videos_title {
|
|
|
+ width: 100%;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FFFFFF;
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 30rpx;
|
|
|
+ left: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBox_videos_type {
|
|
|
+ width: 82rpx;
|
|
|
+ height: 41rpx;
|
|
|
+ opacity: 0.9;
|
|
|
+ background: #20c24a;
|
|
|
+ border-radius: 0rpx 16rpx 0rpx 16rpx;
|
|
|
+ font-size: 22rpx;
|
|
|
+ color: #FFFFFF;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 41rpx;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBox_videos_title1 {
|
|
|
+ width: 217rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #141414;
|
|
|
+ font-weight: 500;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBox_videos_tig {
|
|
|
+ width: 217rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #808080;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
.tabs-box {
|
|
|
width: 100%;
|
|
|
- position: fixed;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- z-index: 1;
|
|
|
+ // position: fixed;
|
|
|
+ // left: 0;
|
|
|
+ // right: 0;
|
|
|
+ // z-index: 1;
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
// padding: 0 30rpx;
|
|
|
- background-color: #F9F9F9;
|
|
|
+ background-color: #fff;
|
|
|
+ border-bottom: 1px solid #e6e6e6;
|
|
|
+ font-size: 0;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 30rpx;
|
|
|
+ .tabs-box_title{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding-right: 20rpx;
|
|
|
+ >image {
|
|
|
+ width: 16rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ >text {
|
|
|
+ font-size: 17px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #52C3C6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .utabs {
|
|
|
+ width: calc(100% - 170rpx);
|
|
|
+ }
|
|
|
|
|
|
.tab-item {
|
|
|
// width: 104rpx;
|
|
@@ -254,7 +488,8 @@
|
|
|
|
|
|
.card-box {
|
|
|
padding: 0 20rpx;
|
|
|
-
|
|
|
+ background: linear-gradient(180deg,#ffffff, #f5f5f5);
|
|
|
+ margin-top: 10rpx;
|
|
|
/deep/ .u-column {
|
|
|
width: 50%;
|
|
|
}
|
|
@@ -299,4 +534,11 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ /deep/ .u-tab-bar {
|
|
|
+ bottom: -6rpx;
|
|
|
+ }
|
|
|
+ /deep/ .u-tab-item{
|
|
|
+ margin-top: 10rpx;
|
|
|
+ }
|
|
|
</style>
|