优化

src/views/bulletin/index.vue

@@ -15,24 +15,34 @@
     <div v-if="list.length > 0" class="notice_box">
       <div class="notice" v-for="(item, index) in list" :key="index" @click="navigatorTo('bulletinDetail', item.id)">
         <!-- <img class="notice_img" :src="item.img_url" alt="" v-if="item.img_url" /> -->
-        <svg t="1748345661681" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8571" width="11" height="11" v-if="item.is_top == 1">
-          <path
-            d="M938.8032 640.256l-378.9312-503.2448c-17.408-25.8048-55.2448-26.4192-73.8816-1.1776l-398.7456 503.2448c-21.6064 30.0032-0.6144 72.0896 36.608 72.0896h187.392v233.6256c0 35.4304 28.8256 64.8704 64.8704 64.8704h270.848c35.4304 0 64.8704-28.8256 64.8704-64.8704V711.168h189.184c36.608-0.0512 58.2144-40.9088 37.7856-70.912z m0 0"
-            p-id="8572"
-            fill="#29b286"
-          ></path>
-          <path
-            d="M126.8736 115.4048h768.6656c28.2112 0 51.0464-22.8352 51.0464-51.0464 0-28.2112-22.8352-51.0464-51.0464-51.0464H126.8736c-28.2112 0-51.0464 22.8352-51.0464 51.0464 0.0512 28.2112 22.8352 51.0464 51.0464 51.0464z m0 0"
-            p-id="8573"
-            fill="#29b286"
-          ></path>
-        </svg>
         <span class="title">{{ item.title }}</span>
         <div class="right">
           <div class="tag_box">
-            <span class="tag" v-for="(it, idx) in item.sub_type_name" :key="idx" :style="{ color: it.color, backgroundColor: hexToRgbObject(it.color) }">{{ it.title }}</span>
+            <span class="tag" v-if="childActive == 0" :style="{ color: item.sub_type_name[0]?.color, backgroundColor: hexToRgbObject(item.sub_type_name[0]?.color) }">{{
+              item.sub_type_name[0]?.title
+            }}</span>
+            <span v-else>
+              <span v-for="(it, idx) in item.sub_type_name" :key="idx">
+                <span class="tag" v-if="it.id == childActive" :style="{ color: it.color, backgroundColor: hexToRgbObject(it.color) }">{{ it.title }}</span>
+              </span>
+            </span>
           </div>
-          <span class="time_text"><span class="new" v-if="isToday(new Date(item.createtime * 1000))">New</span>{{ dateFormatFn(item.createtime) }}</span>
+          <span class="time_text">
+            <svg t="1748345661681" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8571" width="10" height="10" v-if="item.is_top == 1">
+              <path
+                d="M938.8032 640.256l-378.9312-503.2448c-17.408-25.8048-55.2448-26.4192-73.8816-1.1776l-398.7456 503.2448c-21.6064 30.0032-0.6144 72.0896 36.608 72.0896h187.392v233.6256c0 35.4304 28.8256 64.8704 64.8704 64.8704h270.848c35.4304 0 64.8704-28.8256 64.8704-64.8704V711.168h189.184c36.608-0.0512 58.2144-40.9088 37.7856-70.912z m0 0"
+                p-id="8572"
+                fill="#29b286"
+              ></path>
+              <path
+                d="M126.8736 115.4048h768.6656c28.2112 0 51.0464-22.8352 51.0464-51.0464 0-28.2112-22.8352-51.0464-51.0464-51.0464H126.8736c-28.2112 0-51.0464 22.8352-51.0464 51.0464 0.0512 28.2112 22.8352 51.0464 51.0464 51.0464z m0 0"
+                p-id="8573"
+                fill="#29b286"
+              ></path>
+            </svg>
+            <span class="new" v-if="isToday(new Date(item.createtime * 1000))">New</span>
+            {{ dateFormatFn(item.createtime) }}
+          </span>
         </div>
       </div>
     </div>
@@ -76,11 +86,12 @@ export default {
     },
     hexToRgbObject(hex) {
       console.log(hex);
-
-      hex = hex.replace('#', '');
-      return `rgba(${parseInt(hex.slice(0, 2), 16)},
+      if (hex) {
+        hex = hex.replace('#', '');
+        return `rgba(${parseInt(hex.slice(0, 2), 16)},
         ${parseInt(hex.slice(2, 4), 16)},
         ${parseInt(hex.slice(4, 6), 16)},0.2)`;
+      }
     },
     //返回上一页
     back() {
@@ -297,7 +308,7 @@ export default {
         display: flex;
         align-items: center;
         flex-wrap: wrap;
-        width: 56%;
+        // width: 56%;
       }
 
       .tag {
@@ -322,14 +333,14 @@ export default {
         letter-spacing: 0;
         font-weight: 600;
         font-size: 10px;
-        padding-right: 6px;
+        padding: 0 4px;
       }
     }
-    svg {
-      position: absolute;
-      left: -13px;
-      top: 3px;
-    }
+    //svg {
+    //  position: absolute;
+    //  left: -13px;
+    //  top: 3px;
+    //}
   }
 
   .bare {