<template>
|
<view class="container">
|
<header>
|
<u-input class="search" placeholder="搜索" type="text" v-model="search" /> <u-button type="primary"
|
style="width: 100upx;margin-top: 20upx;" size="normal" text="搜索" @click="onPageChange(1)"></u-button>
|
</header>
|
<view
|
style="padding: 40upx;background-color: #fff;margin-top: 20upx;display: flex;justify-content: space-between;">
|
<u-tabs :list="tabsList" @click="chooseArticleType" style="padding-left: 4px;" lineWidth="30"
|
lineColor="#f56c6c" :activeStyle="{
|
color: '#303133',
|
fontWeight: 'bold',
|
transform: 'scale(1.05)'
|
}" :inactiveStyle="{
|
color: '#606266',
|
transform: 'scale(1)'
|
}" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;">
|
</u-tabs>
|
|
</view>
|
<view v-if="!loading && goodsList.length > 0"
|
style="padding: 40upx;background-color: #fff;margin-top: 20upx;padding-bottom:200upx;color: #969799;font-size: 28upx;">
|
<view class="goods-item" v-for="(item, index) in goodsList" :key="index" @click="godetail(item)">
|
<view style="background-color: #f7f7f7;padding: 10upx;margin-bottom: 10upx;">
|
<view style="display: flex;justify-content: space-between;">
|
<view style="font-weight: 800px;color: #000;">{{ item.ArticleTitle }}</view>
|
<u-tag :text="getType(item)" plain size="mini" type="warning"></u-tag>
|
</view>
|
<view style="display: flex;justify-content: space-between;">
|
<view style="font-size: 22upx;line-height: 44upx;">{{ item.Platform }}</view>
|
<u-tag :text="item.Deadline.split(' ')[0]" plain size="mini" type="warning"></u-tag>
|
<!-- PubTime -->
|
</view>
|
</view>
|
</view>
|
</view>
|
<view v-if="loading" style="margin-top: 100upx;">
|
<u-loading-icon></u-loading-icon>
|
</view>
|
<u-empty v-if="!loading && goodsList.length == 0" mode="data" icon="http://cdn.uviewui.com/uview/empty/car.png">
|
</u-empty>
|
<view style="position: fixed;bottom: 0;background-color: #fff;width: 100%;">
|
<Pagination :totalItems="total" :itemsPerPage="pageSize" :currentPage="pageIndex"
|
@page-change="onPageChange" />
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import Pagination from '../../components/Pagination';
|
export default {
|
components: {
|
Pagination
|
},
|
|
data() {
|
return {
|
loading: false,
|
search: '',
|
titleNViewBackground: '',
|
swiperCurrent: 0,
|
swiperLength: 0,
|
carouselList: [],
|
goodsList: [],
|
tabsList: [
|
{
|
name: '综合',
|
ArticleType: 0,
|
},
|
{
|
name: '最近7天内截止',
|
ArticleType: 7
|
|
},
|
{
|
name: '最近30天内截止',
|
ArticleType: 30
|
},
|
|
],
|
ArticleType: 0,
|
pageIndex: 1,
|
pageSize: 8,
|
total: 0,
|
};
|
},
|
onLoad() {
|
this.getArticleDataList()
|
|
},
|
methods: {
|
|
chooseArticleType(e) {
|
console.log('item', e);
|
this.ArticleType = e.ArticleType
|
this.onPageChange(1)
|
|
},
|
getArticleDataList() {
|
this.loading = true
|
let data = {
|
Keyword: this.search,
|
PageNumber: this.pageIndex,
|
PageSize: this.pageSize,
|
Time: this.ArticleType
|
}
|
this.$http.post('/ArticleData/GetDeclarationtimeList', data).then(res => {
|
if (res.Check) {
|
this.goodsList = res.Data.Data
|
this.total = res.Data.TotalCount
|
this.loading = false
|
} else {
|
this.$msg(res.Msg)
|
this.goodsList = []
|
this.loading = false
|
}
|
|
})
|
},
|
gooriginalText() {
|
uni.navigateTo({
|
url: '/pages/public/originalText'
|
})
|
},
|
godetail(item) {
|
// 手机浏览器跳转
|
window.open(item.ArticleUrl, "_blank");
|
},
|
getType(row) {
|
let now = new Date()
|
let Declarationtime = new Date(row.Declarationtime)
|
let Deadline = new Date(row.Deadline)
|
if (now < Declarationtime) {
|
return '申报未开始'
|
} else if (now >= Declarationtime && now <= Deadline) {
|
return '申报中'
|
} else {
|
return '申报截止'
|
}
|
},
|
onPageChange(e) {
|
this.pageIndex = e
|
this.getArticleDataList()
|
},
|
|
}
|
|
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
page {
|
background-color: #F7F7F7;
|
}
|
|
header {
|
padding: 0 30upx;
|
height: 120upx;
|
background-color: #236AF0;
|
display: flex;
|
color: #fff;
|
font-size: 14px;
|
|
.left {
|
width: 150upx;
|
height: 100upx;
|
line-height: 100upx;
|
text-align: left;
|
display: flex;
|
|
i {
|
font-size: 36upx;
|
}
|
}
|
|
.search {
|
flex: 1;
|
height: 80upx;
|
line-height: 80upx;
|
border-radius: 40upx;
|
background-color: #fff;
|
padding: 0 20upx;
|
margin: 20upx 0;
|
color: #236AF0;
|
|
i {
|
font-size: 26upx;
|
color: #ccc;
|
}
|
}
|
|
}
|
|
/* 分类 */
|
.cate-section {
|
display: flex;
|
justify-content: space-around;
|
align-items: center;
|
flex-wrap: wrap;
|
padding: 30upx 22upx;
|
background: #fff;
|
|
.cate-item {
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
font-size: $font-sm + 2upx;
|
color: $font-color-dark;
|
}
|
|
/* 原图标颜色太深,不想改图了,所以加了透明度 */
|
image {
|
width: 88upx;
|
height: 88upx;
|
margin-bottom: 14upx;
|
border-radius: 50%;
|
opacity: .7;
|
box-shadow: 4upx 4upx 20upx rgba(250, 67, 106, 0.3);
|
}
|
}
|
|
.u-page__tag-item {
|
height: 40upx;
|
line-height: 40upx;
|
min-width: 50upx;
|
text-align: center;
|
margin: 10upx;
|
}
|
</style>
|