1

pages/news/index.js

@@ -3,9 +3,6 @@ import { news_type } from '../../utils/dict';
 Page({
     data: {
         frameStyle: { useTop: true, name: '资讯', leftArrow: false, useBar: true },
-        //查询条件
-        searchInfo: {},
-        typeList: news_type,
         tabs: {
             active: '0',
             list: [
@@ -14,14 +11,49 @@ Page({
             ],
         },
         list: [
-            { title: '辽源市第一届青少年羽毛球公开赛暨“小虎杯”羽毛球争霸赛', type: 1, brief: '辽源市第一届青少年羽毛球公开赛暨“小虎杯”羽毛球争霸赛辽源市第一届青少年羽毛球公开赛暨“小虎杯”羽毛球争霸赛', origin: '网络', src: '/image/lingdang.png' },
-        ]
+            {
+                _id:'1',
+                name: '1212',
+                home_url: [{ url: '/image/lingdang.png' }]
+            },
+            {
+                name: '1212',
+                home_url: [{ url: '/image/lingdang.png' }]
+            },
+            {
+                name: '1212',
+                home_url: [{ url: '/image/lingdang.png' }]
+            },
+            {
+                name: '1212',
+                home_url: [{ url: '/image/lingdang.png' }]
+            },
+            {
+                name: '1212',
+                home_url: [{ url: '/image/lingdang.png' }]
+            },
+            {
+                name: '1212',
+                home_url: [{ url: '/image/lingdang.png' }]
+            },
+        ],
+        typeList: news_type,
     },
     // 跳转菜单
     tabPath(e) {
         let { route } = e.detail.detail;
         if (route) wx.redirectTo({ url: `/${route}` })
     },
+    // 选项卡
+    tabsChange: function (e) {
+        const that = this;
+        that.setData({ 'tabs.active': e.detail.name });
+    },
+    // 详情
+    toView: function (e) {
+        const { item } = e.currentTarget.dataset;
+        wx.navigateTo({ url: `/pages/news/info?id=${item._id}` })
+    },
     /**
      * 生命周期函数--监听页面加载
      */
@@ -35,7 +67,7 @@ Page({
                 // if (res.data) wx.redirectTo({ url: '/pages/home/index' })
             },
             fail: async res => {
-                // wx.redirectTo({ url: '/pages/home/index' })
+                // wx.redirectTo({ url: '/pages/index/index' })
             }
         })
     },

pages/news/index.less

@@ -1,71 +1,49 @@
 .main {
-    height: 83vh;
+    height: var(--thrHeight);
     background-color: var(--bgColor);
 
-    .zero {
-        width: 96vw;
+    .one {
         margin: 0 0 2vw 0;
     }
 
-    .zero:last-child {
-        margin: 0;
-    }
-
     .two {
         .a {
             display: flex;
             flex-direction: column;
-            height: 74vh;
-            padding: 0 2vw;
+            height: 76vh;
 
-            .one {
-                display: flex;
-                flex-direction: row;
-                width: 92vw;
+            .a_1 {
                 padding: 2vw;
+                background-color: var(--f9Color);
+                margin: 0 0 2vw 0;
 
-                .one_1 {
-                    flex-grow: 1;
-
-                    input {
-                        padding: 1vw 2vw 1.6vw 2vw;
-                        border-radius: 2px;
-                        font-size: var(--txtSize);
-                        background-color: var(--f1Color);
-                    }
+                input {
+                    padding: 1vw 2vw 2vw 2vw;
+                    border-radius: 2px;
+                    font-size: var(--txtSize);
+                    background-color: var(--bgColor);
                 }
             }
 
-            .two_2 {
-                width: 96vw;
+            .a_2 {
                 flex-grow: 1;
                 position: relative;
 
                 .list {
-                    background-color: var(--bgColor);
-                    margin: 0 0 2vw 0;
+                    background-color: var(--f9Color);
+                    margin: 0 2vw 2vw 2vw;
+                    padding: 2vw;
                     display: flex;
                     flex-direction: row;
-                    justify-content: space-between;
-                    width: 91vw;
-                    padding: 2vw;
-                    border: 1px solid #cccccc;
-                    border-radius: 10px;
-
 
                     .list_1 {
-                        width: 70vw;
+                        flex-grow: 1;
+                        width: 65vw;
 
                         .name {
                             font-size: var(--titleSize);
                             font-weight: bold;
                             margin: 0 0 1vw 0;
-                            overflow: hidden;
-                            text-overflow: ellipsis;
-                            -webkit-line-clamp: 2;
-                            word-break: break-all;
-                            display: -webkit-box;
-                            -webkit-box-orient: vertical;
                         }
 
                         .brief {
@@ -82,23 +60,20 @@
 
                         .other {
                             font-size: var(--txtSize);
-                            color: var(--labelColor);
 
                             text {
-                                padding: 0 1vw 0 0;
+                                padding: 0 2vw 0 0;
                             }
                         }
                     }
 
                     .list_2 {
-                        text-align: right;
-                        padding: 4vw 0 0 0;
+                        width: 25vw;
 
                         .image {
-                            width: 100px;
-                            height: 100px;
-                            overflow: hidden;
-                            border-radius: 10px;
+                            width: 100%;
+                            height: 12vh;
+                            border: 1px solid var(--f1Color);
                         }
                     }
                 }

pages/news/index.wxml

@@ -1,30 +1,27 @@
 <mobile-main frameStyle="{{frameStyle}}" bind:tabPath="tabPath">
     <view slot="info" class="container main">
-        <view class="zero top">
+        <view class="one">
             <e-tabs tabs="{{tabs}}" bind:tabsChange="tabsChange"></e-tabs>
         </view>
-        <view class="zero two">
+        <view class="two">
             <view class="a" wx:if="{{tabs.active=='0'}}">
-                <view class="one">
-                    <view class="one_1">
-                        <input type="text" placeholder="请输入关键词" />
-                    </view>
+                <view class="a_1">
+                    <input type="text" placeholder="请输入关键词" />
                 </view>
-                <view class="two_2">
+                <view class="a_2">
                     <scroll-view scroll-y="true" class="scroll-view">
                         <view class="list-scroll-view">
-                            <view class="list" wx:for="{{list}}" wx:key="item" bindtap="toView" data-id="{{item._id}}">
+                            <view class="list" wx:for="{{list}}" wx:key="item" bindtap="toView" data-item="{{item._id}}">
                                 <view class="list_1">
-                                    <view class="name">{{item.title}}</view>
-                                    <view class="brief">{{item.brief}}</view>
+                                    <view class="name textOver">{{item.title||'暂无'}}</view>
+                                    <view class="brief">{{item.brief||'暂无'}}</view>
                                     <view class="other">
                                         <text>{{typeList[item.type].label||'未知'}}</text>
-                                        <text>来源：{{item.origin}}</text>
+                                        <text>来源：{{item.origin||'暂无'}}</text>
                                     </view>
                                 </view>
                                 <view class="list_2">
-                                    <!-- <image class="image" src="{{item.home_url&&item.home_url.length>0?item.home_url[0].url:''}}"></image> -->
-                                    <image class="image" src="/image/lingdang.png"></image>
+                                    <image class="image" src="{{item.home_url&&item.home_url.length>0?item.home_url[0].url:''}}"></image>
                                 </view>
                             </view>
                         </view>
@@ -32,24 +29,23 @@
                 </view>
             </view>
             <view class="a" wx:elif="{{tabs.active=='1'}}">
-                <view class="two_1">
-                    <input type="text" value="{{searchInfo.name}}" bindconfirm="onSearch" placeholder="请输入关键词" />
+                <view class="a_1">
+                    <input type="text" placeholder="请输入关键词" />
                 </view>
-                <view class="two_2">
+                <view class="a_2">
                     <scroll-view scroll-y="true" class="scroll-view">
                         <view class="list-scroll-view">
-                            <view class="list" wx:for="{{list}}" wx:key="item" bindtap="toView" data-id="{{item._id}}">
+                            <view class="list" wx:for="{{list}}" wx:key="item" bindtap="toView" data-item="{{item._id}}">
                                 <view class="list_1">
-                                    <view class="name">{{item.title}}</view>
-                                    <view class="brief">{{item.brief}}</view>
+                                    <view class="name textOver">{{item.title||'暂无'}}</view>
+                                    <view class="brief">{{item.brief||'暂无'}}</view>
                                     <view class="other">
-                                        <text>{{typeList[item.type].label||'暂无'}}</text>
-                                        <text>来源：{{item.origin}}</text>
+                                        <text>{{typeList[item.type].label||'未知'}}</text>
+                                        <text>来源：{{item.origin||'暂无'}}</text>
                                     </view>
                                 </view>
                                 <view class="list_2">
-                                    <!-- <image class="image" src="{{item.home_url&&item.home_url.length>0?item.home_url[0].url:''}}"></image> -->
-                                    <image class="image" src="/image/lingdang.png"></image>
+                                    <image class="image" src="{{item.home_url&&item.home_url.length>0?item.home_url[0].url:''}}"></image>
                                 </view>
                             </view>
                         </view>

pages/news/index.wxss

@@ -1,66 +1,47 @@
 .main {
-  height: 83vh;
+  height: var(--thrHeight);
   background-color: var(--bgColor);
 }
-.main .zero {
-  width: 96vw;
+.main .one {
   margin: 0 0 2vw 0;
 }
-.main .zero:last-child {
-  margin: 0;
-}
 .main .two .a {
   display: flex;
   flex-direction: column;
-  height: 74vh;
-  padding: 0 2vw;
+  height: 76vh;
 }
-.main .two .a .one {
-  display: flex;
-  flex-direction: row;
-  width: 92vw;
+.main .two .a .a_1 {
   padding: 2vw;
+  background-color: var(--f9Color);
+  margin: 0 0 2vw 0;
 }
-.main .two .a .one .one_1 {
-  flex-grow: 1;
-}
-.main .two .a .one .one_1 input {
-  padding: 1vw 2vw 1.6vw 2vw;
+.main .two .a .a_1 input {
+  padding: 1vw 2vw 2vw 2vw;
   border-radius: 2px;
   font-size: var(--txtSize);
-  background-color: var(--f1Color);
+  background-color: var(--bgColor);
 }
-.main .two .a .two_2 {
-  width: 96vw;
+.main .two .a .a_2 {
   flex-grow: 1;
   position: relative;
 }
-.main .two .a .two_2 .list {
-  background-color: var(--bgColor);
-  margin: 0 0 2vw 0;
+.main .two .a .a_2 .list {
+  background-color: var(--f9Color);
+  margin: 0 2vw 2vw 2vw;
+  padding: 2vw;
   display: flex;
   flex-direction: row;
-  justify-content: space-between;
-  width: 91vw;
-  padding: 2vw;
-  border: 1px solid #cccccc;
-  border-radius: 10px;
 }
-.main .two .a .two_2 .list .list_1 {
-  width: 70vw;
+.main .two .a .a_2 .list .list_1 {
+  flex-grow: 1;
+  width: 65vw;
 }
-.main .two .a .two_2 .list .list_1 .name {
+.main .two .a .a_2 .list .list_1 .name {
   font-size: var(--titleSize);
   font-weight: bold;
   margin: 0 0 1vw 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  -webkit-line-clamp: 2;
-  word-break: break-all;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
 }
-.main .two .a .two_2 .list .list_1 .brief {
+.main .two .a .a_2 .list .list_1 .brief {
   margin: 0 0 1vw 0;
   font-size: var(--txtSize);
   color: var(--labelColor);
@@ -71,22 +52,19 @@
   display: -webkit-box;
   -webkit-box-orient: vertical;
 }
-.main .two .a .two_2 .list .list_1 .other {
+.main .two .a .a_2 .list .list_1 .other {
   font-size: var(--txtSize);
-  color: var(--labelColor);
 }
-.main .two .a .two_2 .list .list_1 .other text {
-  padding: 0 1vw 0 0;
+.main .two .a .a_2 .list .list_1 .other text {
+  padding: 0 2vw 0 0;
 }
-.main .two .a .two_2 .list .list_2 {
-  text-align: right;
-  padding: 4vw 0 0 0;
+.main .two .a .a_2 .list .list_2 {
+  width: 25vw;
 }
-.main .two .a .two_2 .list .list_2 .image {
-  width: 100px;
-  height: 100px;
-  overflow: hidden;
-  border-radius: 10px;
+.main .two .a .a_2 .list .list_2 .image {
+  width: 100%;
+  height: 12vh;
+  border: 1px solid var(--f1Color);
 }
 .scroll-view {
   position: absolute;