From 6805f39ec5087d3d73027ca2cdc45936d418144a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=86=8A=E4=B8=BD=E5=90=9B?= <664953382@qq.com>
Date: Tue, 10 Aug 2021 09:04:25 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A7=91=E6=8A=80=E6=88=90=E6=9E=9C=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E5=88=9D=E5=A7=8B=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                     |   7 ++
 src/views/home/achievements.vue | 124 ++++++++++++++++++++++----------
 2 files changed, 94 insertions(+), 37 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 5c29926..35b7d18 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -22,6 +22,13 @@ export default {
   white-space: nowrap;
   text-overflow: ellipsis;
 }
+.text_hidden_two {
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  word-break: break-all;
+}
 .text_hidden_four {
   overflow: hidden;
   display: -webkit-box;
diff --git a/src/views/home/achievements.vue b/src/views/home/achievements.vue
index e3b0937..951facf 100644
--- a/src/views/home/achievements.vue
+++ b/src/views/home/achievements.vue
@@ -46,8 +46,23 @@
         </div>
         <!-- 检索列表 -->
         <div class="screen_l_b">
-          <div class="screen_item" v-for="item in 6" :key="item">
-            <div class="title text_hidden_one">
+          <div class="screen_item" v-for="item in 5" :key="item">
+            <div class="screen_item_l" style="background-color: red">
+              123
+              <!-- <img src="" alt=""> -->
+            </div>
+            <div class="screen_item_r">
+              <div class="title">金属抛光粉尘管理与净化系统</div>
+              <div class="text_hidden_two text">
+                寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法
+              </div>
+              <div class="tags">
+                <el-tag type="warning" effect="dark">装备制造</el-tag>
+                <el-tag type="warning" effect="dark">技术需求</el-tag>
+              </div>
+              <div class="time">2021-07-23发布</div>
+            </div>
+            <!-- <div class="title text_hidden_one">
               <span class="txt">【￥100万】</span
               ><span>寻求电梯导轨更高效的方法寻求电梯导轨更高效的方法</span>
             </div>
@@ -58,7 +73,7 @@
             <p class="text_hidden_four">
               企业主要做电梯配件中的电梯导轨，2020年产值2亿元左右，属于重金属加工企业主要做电梯配件中的电梯导轨，2020年产值2亿元左右，属于重金属加工企业主要做电梯配件中的电梯导轨，2020年产值2亿元左右，属于重金属加工企业主要做电梯配件中的电梯导轨，2020年产值2亿元左右，属于重金属加工
             </p>
-            <div class="time">2021-07-23发布</div>
+            <div class="time">2021-07-23发布</div> -->
           </div>
         </div>
         <!-- 分页 -->
@@ -236,44 +251,79 @@ export default {
         justify-content: flex-start;
         .screen_item {
           display: flex;
-          flex-direction: column;
-          justify-content: space-between;
-          width: calc((100% - 24px) / 3);
-          height: 292px;
-          margin-right: 12px;
-          box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.08);
-          margin-bottom: 14px;
-          cursor: pointer;
-          border-radius: 6px;
-          overflow: hidden;
-          padding: 30px 20px;
-          .title {
-            font-size: 18px;
-            color: #333;
-            .txt {
+          border: 1px solid #ffa32c;
+          padding: 15px;
+          margin-top: 30px;
+          .screen_item_l {
+            width: 225px;
+          }
+          .screen_item_r {
+            width: calc(100% - 225px);
+            margin-left: 15px;
+            .title {
+              font-size: 18px;
+              font-weight: bold;
               color: #ffa32c;
+              padding: 10px 0;
+            }
+            .text {
+              font-size: 14px;
+              line-height: 20px;
+              color: #999;
+            }
+            .tags {
+              margin-top: 15px;
+              .el-tag {
+                margin-right: 15px;
+              }
+            }
+            .time {
+              font-size: 14px;
+              color: #999;
+              text-align: right;
             }
           }
-          .tags {
-            margin-top: 22px;
-            .el-tag {
-              margin-right: 10px;
-            }
-          }
-          p {
-            font-size: 16px;
-            color: #666;
-            line-height: 27px;
-          }
-          .time {
-            text-align: right;
-            font-size: 16px;
-            color: #999;
-          }
-        }
-        .screen_item:nth-of-type(3n + 0) {
-          margin-right: 0;
         }
+        //   .screen_item {
+        //     display: flex;
+        //     flex-direction: column;
+        //     justify-content: space-between;
+        //     width: calc((100% - 24px) / 3);
+        //     height: 292px;
+        //     margin-right: 12px;
+        //     box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.08);
+        //     margin-bottom: 14px;
+        //     cursor: pointer;
+        //     border-radius: 6px;
+        //     overflow: hidden;
+        //     padding: 30px 20px;
+        //     .title {
+        //       font-size: 18px;
+        //       color: #333;
+        //       .txt {
+        //         color: #ffa32c;
+        //       }
+        //     }
+        //     .tags {
+        //       margin-top: 22px;
+        //       .el-tag {
+        //         margin-right: 10px;
+        //       }
+        //     }
+        //     p {
+        //       font-size: 16px;
+        //       color: #666;
+        //       line-height: 27px;
+        //     }
+        //     .time {
+        //       text-align: right;
+        //       font-size: 16px;
+        //       color: #999;
+        //     }
+        //   }
+        //   .screen_item:nth-of-type(3n + 0) {
+        //     margin-right: 0;
+        //   }
       }
       .el-pagination {
         text-align: right;