Merge branch 'main' of https://git.zdool.com/xs/yxdt/h5 into main

src/components/list-no-img.vue

@@ -1,14 +1,9 @@
 <template>
   <div class="list-1">
     <div class="top">
-      <strong :class="[newData.title.length < 40 ? 'yesDevelop' : 'noDevelop']"
+      <strong class="yesDevelop"
         >{{ newData.title
-        }}<a
-          href="javascript:;"
-          v-if="newData.title.length > 40"
-          @click="quanwen"
-          >全文</a
-        ></strong
+        }}</strong
       >
     </div>
     <div class="bottom-1">
@@ -39,7 +34,8 @@ const quanwen = () => {
 
     .noDevelop {
       display: inline-block;
-      width: 343px;
+      // width: 343px;
+      width: 90vw;
       height: 44px;
       overflow: hidden;
       text-overflow: ellipsis;
@@ -74,7 +70,8 @@ const quanwen = () => {
 
     .yesDevelop {
       display: inline-block;
-      width: 343px;
+      // width: 343px;
+      width: 90vw;
       overflow: hidden;
       text-overflow: ellipsis;
       display: -webkit-box;

src/components/list-right-img.vue

@@ -1,15 +1,9 @@
 <template>
   <div class="list-1">
     <div class="left">
-      <strong :class="[newData.title.length < 26 ? 'yesDevelop' : 'noDevelop']"
+      <strong class="yesDevelop"
         >{{ newData.title
-        }}<a
-          href="javascript:;"
-          v-if="newData.title.length > 26"
-          @click="quanwen"
-        >
-          全文</a
-        ></strong
+        }}</strong
       >
       <div class="bottom-1">
         <div class="left">{{ newData.createdAt }}</div>
@@ -19,7 +13,7 @@
       </div>
     </div>
     <div class="right">
-      <img src="@/assets/cc3.png" alt="" />
+      <img :src="newData.imgUrl" alt="" />
     </div>
   </div>
 </template>
@@ -36,9 +30,9 @@ const quanwen = () => {
 .list-1 {
   display: flex;
   min-height: 70px;
-  justify-content: space-around;
-  padding-left: 12px;
-  padding-right: 12px;
+  justify-content:space-between;
+  padding-left: 16px;
+  padding-right: 16px;
 
   .left {
     width: 230px;
@@ -83,7 +77,8 @@ const quanwen = () => {
 
     .yesDevelop {
       display: inline-block;
-      width: 231px;
+      // width: 231px;
+      width: 61vw;
       overflow: hidden;
       text-overflow: ellipsis;
       display: -webkit-box;

src/views/znyt.vue

@@ -81,27 +81,15 @@ const mainList = reactive([
   },
   {
     id: 2,
-    title: "老有康养",
+    title: "幼有善育",
   },
   {
     id: 3,
-    title: "老有康养",
+    title: "学有优教",
   },
   {
     id: 4,
-    title: "老有康养",
-  },
-  {
-    id: 5,
-    title: "老有康养",
-  },
-  {
-    id: 6,
-    title: "老有康养",
-  },
-  {
-    id: 7,
-    title: "老有康养",
+    title: "劳有所得",
   },
 ]);
 const chooseId = ref("1");
@@ -113,46 +101,42 @@ const records = reactive({
   list: [
     {
       id: 1,
+      display: 1,
+      title: "“三问”个人养老金：是什么、怎么缴、如何领？",
+      createdAt: "11月27日",
+      imgUrl: "/src/assets/cc4.png",
+      eye: "8888",
+    },
+    {
+      id: 2,
+      display: 1,
+      title: "100场社区活动——教你轻松玩转智能手机",
+      createdAt: "11月27日",
+      imgUrl: "/src/assets/cc3.png",
+      eye: "8888",
+    },
+    {
+      id: 3,
       display: 0,
       title: "2023年养老金政策震撼发布！你的养老金将发生这样的变化！",
       createdAt: "11月27日",
       eye: "8888",
     },
     {
-      id: 1,
+      id: 4,
       display: 1,
-      title: "“三问”个人养老金：是什么、怎么缴、如何领？",
+      title: "100场社区活动——教你轻松玩转智能手机",
       createdAt: "11月27日",
+      imgUrl: "/src/assets/cc3.png",
       eye: "8888",
     },
     {
-      id: 1,
+      id: 5,
       display: 0,
       title: "2023年养老金政策震撼发布！你的养老金将发生这样的变化！",
       createdAt: "11月27日",
       eye: "8888",
     },
-    {
-      id: 1,
-      display: 1,
-      title: "“三问”个人养老金：是什么、怎么缴、如何领？",
-      createdAt: "11月27日",
-      eye: "8888",
-    },
-        {
-      id: 1,
-      display: 0,
-      title: "2023年养老金政策震撼发布！你的养老金将发生这样的变化！",
-      createdAt: "11月27日",
-      eye: "8888",
-    },
-    {
-      id: 1,
-      display: 1,
-      title: "“三问”个人养老金：是什么、怎么缴、如何领？",
-      createdAt: "11月27日",
-      eye: "8888",
-    },
   ],
 });
 </script>
@@ -297,12 +281,13 @@ const records = reactive({
   display: none;
 }
 .line {
-  width: 100%;
+  width: 100vw;
   height: 0px;
   border-radius: 0px 0px 0px 0px;
   opacity: 1;
   border: 1px solid #f1f1f1;
   margin-top: 16px;
   margin-bottom: 16px;
+  text-align: center;
 }
 </style>