From e3dcaeb0180a4e37347ac9ceb44c8a59ae7af37f Mon Sep 17 00:00:00 2001
From: liuyg <liuyg@qq.com>
Date: Mon, 21 Feb 2022 19:40:20 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/qfqk-android
---
pages/article/article.vue | 335 ++++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 241 insertions(+), 94 deletions(-)
diff --git a/pages/article/article.vue b/pages/article/article.vue
index f287511..1368359 100644
--- a/pages/article/article.vue
+++ b/pages/article/article.vue
@@ -1,27 +1,38 @@
<template>
- <view class="advisory-big ">
+ <view class="advisory-big">
<!-- 自定义顶部导航栏 -->
<!-- <view class="uni-nav-bar-info" :style="{marginTop:navbarTopHeight}">
<view class="title" @click="goTabDetail(index)" v-for="(item,index) in titleList"
:style="titleNum==index? 'color:#000000':'color:#808080'">{{item}}</view>
</view> -->
-
- <view class="article-tab">
- <view :class="{'article-tab-title':true,'cccc':index == articleTabNum}" @click="goArticleTab(index)" v-for="(item,index) in articleTabArr"
- :style="articleTabNum==index?'color:#000000':'color:#808080'">{{item}}</view>
- <image src="../../static/images/article/menu.png"></image>
+ <view>
+ <u-dropdown style="height:0rpx">
+ <u-dropdown-item v-model="value1" title="看新闻" @change="change" :options="options1"></u-dropdown-item>
+ <u-dropdown-item v-model="value1" title="看视频" @change="change" :options="options2"></u-dropdown-item>
+ <u-dropdown-item v-model="value1" title="行业圈" @change="change" :options="options3"></u-dropdown-item>
+ <u-dropdown-item v-model="value1" title="看现场" @change="change" :options="options4"></u-dropdown-item>
+ </u-dropdown>
</view>
- <view class="search-block">
- <view class="search-ico-wapper">
- <image src="../../static/images/search/search.png" class="search-ico" mode=""></image>
- </view>
- <input type="text" value="" placeholder="搜索" class="search-text" maxlength="10" focus/>
- <view class="search-ico-wapper1">
- <image src="../../static/images/article/microphone.png" class="search-ico-1" mode=""></image>
+ <view>
+ <view class="search-block" style="height: 35px">
+ <view class="search-ico-wapper">
+ <image src="../../static/images/search/search.png" class="search-ico" mode=""></image>
+ </view>
+ <input type="text" v-on:input="getKeyword" v-model="keyword" placeholder="搜索" class="search-text"
+ maxlength="10" focus />
+ <!-- <view class="search-ico-wapper1">
+ <image src="../../static/images/article/microphone.png" class="search-ico-1" mode=""></image>
+ </view> -->
</view>
- </view>
- <view class="article-content">
+ </view>
+
+
+
+
+ <scroll-view id="articleBox" :style="{ height: swiperHeight + 'px' }" class="article-content" scroll-y
+ style="width: 100%; margin-top: 100rpx;" :refresher-enabled="refresherFlag" :refresher-threshold="threshold"
+ :refresher-triggered="triggered" @refresherrefresh="refreshing" @refresherrestore="refresherrestore">
<view v-for="i in data" class="advisory-model" @click="goDetail(i)">
<view class="advisory-left">
<view class="advisory-title-top">
@@ -29,7 +40,7 @@
</view>
<view class="advisory-title-down">
<view class="advisory-title-name">{{i.sourceName}}</view>
- <view class="advisory-title-time">{{i.createTime}}</view>
+ <view class="advisory-title-time">{{i.createTime.substring(0,11)}}</view>
</view>
</view>
<view class="advisory-right">
@@ -37,10 +48,14 @@
</view>
</view>
<u-loadmore :status="status" />
- </view>
-
+ </scroll-view>
+
+ <!-- <view class="article-content">
+
+ </view> -->
+
<!-- 底部导航条 -->
- <u-tabbar :list="tabbar" :mid-button="false"></u-tabbar>
+ <u-tabbar :list="tabbar" :mid-button="true"></u-tabbar>
</view>
</template>
@@ -53,42 +68,129 @@
data() {
return {
// pathUrl:"http://localhost:89/",
- pathUrl: "http://s16s652780.51mypc.cn/api",
+ pathUrl: this.$store.state.piAPI + "",
page: 1,
- pagesize: 10,
+ pagesize: 99999,
status: 'loadmore',
// loadStatus:'loading', //加载样式：more-加载前样式，loading-加载中样式，nomore-没有数据样式
isLoadMore: false, //是否加载中
isFlash: false, //是否刷新
data: [],
- titleList: ['推荐', '要闻', '新思想'],
titleNum: 0,
- articleTabArr: ['全部', '视频', '社会', '经济', '热点'],
+ articleTabArr: [],
articleTabNum: 0,
navbarTopHeight: "10px",
- tabbar:this.$store.state.tabbar
+ tabbar: this.$store.state.tabbar,
+ tabInfo: "0",
+ keyword: '',
+ value1: "",
+ rolename: "",
+ threshold: 50,
+ triggered: false,
+ isRefreshing: false, // 是否在刷新中
+ refresherFlag: true,
+ options1: [{
+ label: '全部',
+ value: 'kxw',
+ }, {
+ label: '热议',
+ value: 'kxw001',
+ },
+ {
+ label: '通知',
+ value: 'kxw002',
+ },
+ {
+ label: '警闻',
+ value: 'kxw003',
+ },
+ {
+ label: '民生',
+ value: 'kxw004',
+ }
+ ],
+ options2: [{
+ label: '全部',
+ value: 'ksp',
+ }, {
+ label: '通告',
+ value: 'ksp001',
+ },
+ {
+ label: '微视',
+ value: 'ksp002',
+ },
+ {
+ label: '动态',
+ value: 'ksp003',
+ }
+ ],
+ options3: [{
+ label: '全部',
+ value: 'hyq',
+ }, {
+ label: '消息发布',
+ value: 'hyq001',
+ },
+ {
+ label: '知识竞答',
+ value: 'hyq002',
+ },
+ {
+ label: '知识讨论',
+ value: 'hyq003',
+ }
+ ],
+ options4: [{
+ label: '全部',
+ value: 'kxc',
+ }],
+ swiperHeight: 0
}
},
mounted() {
// this.getArtcilePageList();
},
onLoad() {
- this.getArtcilePageList();
- uni.stopPullDownRefresh();
+ //获取新闻数据
+ this.rolename = this.$store.state.UserData.role_name;
+ this.getArtcilePageList("0");
+ uni.startPullDownRefresh();
+
},
+
+ onReady() {
+ let that = this;
+ uni.getSystemInfo({
+ success(e) {
+ console.log(e);
+ let {
+ windowWidth,
+ windowHeight,
+ safeArea
+ } = e;
+ const query = uni.createSelectorQuery().in(that);
+ query
+ .select('#articleBox')
+ .boundingClientRect(data => {
+ that.swiperHeight = (safeArea.bottom - data.top - 50);
+
+ })
+ .exec();
+ }
+ });
+ },
+
//上拉加载更多
onReachBottom() {
- //
- if (this.status=='nomore') return;
+ console.log(2323232)
+ if (this.status == 'nomore') return;
this.page = ++this.page;
setTimeout(() => {
- this.getArtcilePageList();
- }, 2000);
+ this.getArtcilePageList(this.tabInfo);
+ }, 100);
},
methods: {
- goArticleTab(index) {
- this.articleTabNum = index;
- },
goTabDetail(index) {
this.titleNum = index;
},
@@ -97,56 +199,101 @@
let detail = {
id: e.id
};
- //去跳转
- uni.navigateTo({
- url: './article_detail?detailData=' + JSON.stringify(detail)
- });
+ if(e.articleType.indexOf("ksp") != -1){
+ //去跳转
+ uni.navigateTo({
+ url: './article_video?detailData=' + (JSON.stringify(e))
+ });
+ }else{
+ //去跳转
+ uni.navigateTo({
+ url: './article_detail?detailData=' + JSON.stringify(detail)
+ });
+ }
+
},
-
+ //on input 通过 keyword 关键字查询
+ getKeyword() {
+ this.getArtcilePageList(this.tabInfo);
+ },
//获取资讯信息
getArtcilePageList(tab) {
var that = this;
- uni.request({
- url: this.$store.state.piAPI + '/article/article/page',
- method: 'GET',
- data: {
+ var paramData = null;
+ if (Number(tab) == "") {
+ paramData = {
+ rolename: this.rolename, //帐号角色
current: this.page,
- size: this.pagesize
- },
+ size: this.pagesize,
+ keyword: this.keyword
+ }
+ } else {
+ paramData = {
+ rolename: this.rolename, //帐号角色
+ current: this.page,
+ size: this.pagesize,
+ keyword: this.keyword,
+ articleType: tab
+ }
+ }
+ uni.request({
+ url: that.$store.state.piAPI + '/article/article/pageDate',
+ method: 'GET',
+ data: paramData,
success: (res) => {
if (res.data.code == 200) {
if (res.data.data.records) {
//如果总数小于pageSize,不做其他操作
- if (res.data.data.total < this.pagesize) {
+ if (res.data.data.total < that.pagesize) {
that.data = res.data.data.records;
+ that.status = 'nomore';
} else {
- if (res.data.data.records.length < this.pagesize) {
+ if (res.data.data.records.length < that.pagesize) {
//如果数量小于分页数量，则为最后一页
- this.status = 'nomore'
- } else {
+ that.status = 'nomore'
+ } else {
//否则继续加载更多数据
- this.status = 'loading';
+ that.status = 'loading';
}
res.data.data.records.forEach((item) => {
that.data.push(item);
})
}
}
- uni.stopPullDownRefresh();
+ setTimeout(() => {
+ that.triggered = false; //触发onRestore，并关闭刷新图标 正常应该放在请求成功得接口里
+ that.isRefreshing = false;
+ }, 1000)
}
}
});
- }
+ },
+ change(e) {
+ this.page = 1;
+ this.getArtcilePageList(e);
+ },
+ refreshing() {
+ if (this.isRefreshing) {
+ return;
+ }
+ this.isRefreshing = true;
+ //界面下拉触发，triggered可能不是true，要设为true
+ if (!this.triggered) {
+ this.triggered = true;
+ }
+
+ this.getArtcilePageList();
+ },
+
+ refresherrestore() {
+
+ },
}
}
</script>
<style>
- page{
- width: 100%;
- height: 100%;
- background-color: #f7f7f7;
- }
+
</style>
<style lang="scss" scoped>
@@ -191,12 +338,12 @@
height: 1.5rem;
}
}
-
- .article-content{
- margin-top: 3.5rem;
+
+ .article-content {
+ // margin-top: 3.5rem;
width: 100%;
// background-color: #00FF00;
-
+
.advisory-model {
width: 94%;
margin: 0 auto;
@@ -204,8 +351,8 @@
background-color: #FFF;
border-radius: 8px;
margin-top: 0.5rem;
-
-
+
+
.advisory-left {
width: 64%;
height: 80%;
@@ -215,13 +362,13 @@
position: relative;
left: 3%;
top: 10%;
-
-
+
+
.advisory-title-top {
// background-color: #2692FD;
width: 100%;
height: 75%;
-
+
.advisory-title {
width: 92%;
font-size: 15px;
@@ -232,10 +379,10 @@
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
-
-
+
+
}
-
+
.advisory-title-down {
// background-color: #0078A8;
width: 100%;
@@ -243,9 +390,9 @@
font-size: 12px;
font-weight: 550;
color: #808080;
-
+
.advisory-title-name {
- width: 130rpx;
+ width: 250rpx;
float: left;
letter-spacing: 1px;
overflow: hidden;
@@ -255,15 +402,15 @@
-webkit-box-orient: vertical;
// background-color:#0078A8;
}
-
+
.advisory-title-time {
position: relative;
left: 15rpx;
}
}
-
+
}
-
+
.advisory-right {
// background-color: #222222;
width: 33%;
@@ -271,7 +418,7 @@
left: 65%;
position: relative;
top: 10%;
-
+
image {
position: relative;
left: 0px;
@@ -284,11 +431,12 @@
}
}
}
-
- .cccc{
+
+ .cccc {
position: relative;
top: -5px;
}
+
.cccc::before {
position: relative;
top: 25px;
@@ -298,16 +446,17 @@
height: 3.5px;
background-color: #0BB9C8;
}
-
-
+
+
/* 搜索框 */
- .search-ico, .search-ico-1{
+ .search-ico,
+ .search-ico-1 {
width: 40upx;
height: 40upx;
}
-
- .search-block{
+
+ .search-block {
width: 94%;
margin: 0 auto;
// background-color: #007AFF;
@@ -315,36 +464,34 @@
flex-direction: row;
position: relative;
top: 2.85rem;
-
- .search-ico-wapper{
+
+ .search-ico-wapper {
background-color: #F1F1F1;
display: flex;
- flex-direction:column;
+ flex-direction: column;
justify-content: center;
padding: 0upx 0upx 0upx 15upx;
- border-bottom-left-radius:7px;
+ border-bottom-left-radius: 7px;
border-top-left-radius: 7px;
}
-
- .search-text{
+
+ .search-text {
font-size: 14px;
background-color: #F1F1F1;
height: 70upx;
width: 100%;
padding-left: 0.5rem;
}
-
-
- .search-ico-wapper1{
+
+
+ .search-ico-wapper1 {
background-color: #F1F1F1;
display: flex;
- flex-direction:column;
+ flex-direction: column;
justify-content: center;
padding: 0upx 15upx 0upx 0upx;
- border-bottom-right-radius:7px;
+ border-bottom-right-radius: 7px;
border-top-right-radius: 7px;
}
}
-
-
</style>
--
Gitblit v1.9.3