资讯页面优化

Administrator

2021-06-10 556fa30bf01c3c79b7af7ac15667e58aae283c26

 pages/article/article.vue

@@ -1,36 +1,91 @@
<template>
   <view class="advisory-big">
      
      <view  v-for="i in data" class="advisory-model" @click="goDetail(i)">
         <view class="advisory-left">
            <view class="advisory-title-top">
               <view class="advisory-title">{{i.title}}</view>
       <!-- <view
         ref="k-scroll-view"
         :refreshType="refreshType"
         :refreshTip="refreshTip"
         :loadTip="loadTip"
         :loadingTip="loadingTip"
         :emptyTip="emptyTip"
         :touchHeight="touchHeight"
         :height="height"
         :bottom="bottom"
         :autoPullUp="autoPullUp"
         @onPullDown="handlePullDown"
         @onPullUp="handleLoadMore"> -->
         <view  v-for="i in data" class="advisory-model" @click="goDetail(i)">
            <view class="advisory-left">
               <view class="advisory-title-top">
                  <view class="advisory-title">{{i.title}}</view>
               </view>
               <view class="advisory-title-down">
                  <view class="advisory-title-name">{{i.sourceName}}</view>
                  <view class="advisory-title-time">{{i.createTime}}</view>
               </view>
            </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-right">
               <image :src="i.url"></image>
            </view>
				
         </view>
         <view class="advisory-right">
            <image :src="i.url"></image>
         </view>
      </view>
      <!-- </view> -->
      <!-- <uni-load-more :status="status" :content-text="contentText"/> -->
		
      
   </view>
</template>

<script>
   // import kScrollView from '@/components/k-scroll-view/k-scroll-view.vue';
   export default{
      // components: {
      //     kScrollView
      // },
      data(){
         return {
            // pathUrl:"http://localhost:89/",
            pathUrl:"http://s16s652780.51mypc.cn/api/blade-jfpts",
            // refreshType: 'custom',
            // refreshTip: '正在下拉',
            // loadTip: '获取更多数据',
            // loadingTip: '正在加载中...',
            // emptyTip: '--我是有底线的--',
            // touchHeight: 50,
            // height: 0,
            // bottom: 50,
            // autoPullUp: true,
            // stopPullDown:true, // 如果为 false 则不使用下拉刷新，只进行上拉加载
            // status: 'more',
            // statusTypes: [{
            //    value: 'more',
            //    text: '加载前',
            //    checked: true
            // }, {
            //    value: 'loading',
            //    text: '加载中',
            //    checked: false
            // }, {
            //    value: 'noMore',
            //    text: '没有更多',
            //    checked: false
            // }],
            // contentText: {
            //    contentdown: '下拉查看更多',
            //    contentrefresh: '加载中',
            //    contentnomore: '没有更多'
            // },
            data:[]
         }
      },
      mounted(){
         this.getArtcilePageList();
      },
      onPullDownRefresh () {         // 下拉刷新事件
          console.log('触发下拉刷新了')
          // 一些列操作
          uni.stopPullDownRefresh()      // 结束当前刷新事件
        },
      methods:{
         //去跳转详情页面
         goDetail(e){
@@ -66,6 +121,31 @@
               }
            });
         },
         //下拉获取更多
         // handlePullDown(stopLoad) {
         //    this.data = [];
         //    for (var i = 0; i < 10; i++) {
         //       this.data.push(i);
         //    }
         //    stopLoad ? stopLoad() : '';
         // },
         // //上拉加载
         // handleLoadMore(stopLoad) {
         //    const size = this.data.length;
         //    if (size < 100) {
         //       const data = [];
         //       for (var i = 0; i < 10; i++) {
         //          data.push(size + i);
         //       }
         //       this.data = this.data.concat(data);
         //       stopLoad ? stopLoad() : '';
         //    } else {
         //       stopLoad ? stopLoad({ isEnd: true }) : '';
         //    }
         // },
         // handleGoTop() {
         //    this.$refs['k-scroll-view'].goTop();
         // }
      }
   }
</script>
@@ -104,6 +184,11 @@
                  width: 92%;
                  font-size: 15px;
                  font-weight: 550;
                  overflow: hidden;
                  text-overflow: ellipsis;
                  display: -webkit-box; 
                  -webkit-line-clamp: 2; 
                  -webkit-box-orient: vertical;
               }
               
               
@@ -118,13 +203,20 @@
               color: #808080;
               
               .advisory-title-name{
                  width: 130rpx;
                  float: left;
                  letter-spacing: 1px;
                  overflow: hidden;
                  text-overflow: ellipsis;
                  display: -webkit-box; 
                  -webkit-line-clamp: 1; 
                  -webkit-box-orient: vertical;
                  // background-color:#0078A8;
               }
               
               .advisory-title-time{
                  position: relative;
                  left: 6%;
                  left: 15rpx;
               }
            }