fix: 多彩晶闪页面文章修改

src/assets/colorful/articles.json

+[
+  {
+    "link": "https://mp.weixin.qq.com/s/HhvTfCiX-SJtjZProY1bXA",
+    "categories": ["big-event"],
+    "img": "articles-img/a-01.jpg",
+    "title": "2023届外语外贸类毕业生联盟网络招聘会圆满结束",
+    "brief": "少年负壮气，奋烈自有时，我们彼此相遇在网络招聘会",
+    "createdAt": "2023-01-04 11:39:00"
+  },
+  {
+    "link": "https://mp.weixin.qq.com/s/Vsr92c1kal8GisyEkUWKhQ",
+    "categories": ["employee-activity"],
+    "img": "articles-img/a-02.jpg",
+    "title": "Merry Christmas圣诞节快乐！",
+    "brief": "2022年，是坎坷的一年，也是新的开始。总有些事无法忘掉，总有些人在身边萦绕，相逢多么奇妙，生活甚是美好，工作固然重要，心情也得调好。让我们一起赶走疫情带来的不快，迎接疫情开放的时代~",
+    "createdAt": "2022-12-24 15:43:00"
+  },
+  {
+    "link": "https://mp.weixin.qq.com/s/6PACPm1-3EkwaGLwOjc-Fg",
+    "categories": ["big-event"],
+    "img": "articles-img/a-03.jpg",
+    "title": "西安晶闪科技2021年春季校园招聘开始啦！就差你了~",
+    "brief": "如果你是这样的：有着强烈的目标和成就感，肯为了成功付出努力，充满活力和自信，积极肯干，敢于尝试，勇于挑战，善于总结，那么就来我们这里，我们期待你的加入~",
+    "createdAt": "2021-04-02 18:30"
+  },
+  {
+    "link": "https://mp.weixin.qq.com/s/11pIJbGU2o8Dbvuk--oyqA",
+    "categories": ["big-event", "employee-activity"],
+    "img": "articles-img/a-04.jpg",
+    "title": "晶闪科技给您拜年啦！",
+    "brief": "我怕大年三十晚上的祝福太多，你会看不到我的问候，我怕大年初一的菜肴太香，你会看不到我的消息。于是，晶闪科技决定带着晶闪全体同仁，提前给你拜年啦！！！",
+    "createdAt": "2021-02-10 15:54:00"
+  }
+]

src/views/Home/ColorfulPage.vue

@@ -29,11 +29,15 @@
           <h4 class="article-title">{{ a.title }}</h4>
           <div class="article-brief">
             {{ a.brief }}
-            <!-- <router-link
+            <router-link
+              v-if="a.id"
               class="article-link"
               :to="`/article/${a.id}?from=ColorfulPage`"
               >查看全文 +</router-link
-            > -->
+            >
+            <a v-if="a.link" :href="a.link" class="article-link" target="_blank"
+              >查看全文 +</a
+            >
           </div>
           <div class="article-meta">
             <span class="article-time">{{ a.createdAt }}</span>
@@ -51,13 +55,7 @@
   </div>
 </template>
 <script>
-import ImgArticle1 from '@/assets/colorful/a-1.png'
-import ImgArticle2 from '@/assets/colorful/a-2.jpg'
-import ImgArticle3 from '@/assets/colorful/a-3.png'
-import ImgArticle4 from '@/assets/colorful/a-4.jpg'
-import ImgArticle5 from '@/assets/colorful/a-5.jpg'
-import ImgArticle6 from '@/assets/colorful/a-6.png'
-import ImgArticle7 from '@/assets/colorful/a-7.png'
+import Articles from '@/assets/colorful/articles.json'
 
 export default {
   name: 'ColorfulPage',
@@ -68,80 +66,13 @@ export default {
         { type: 'employee-activity', title: '员工活动', layout: 'grid' },
       ],
 
-      articles: [
-        {
-          id: 1,
-          categories: ['big-event'],
-          img: ImgArticle1,
-          title: '2023晶闪科技春季校园招聘正式启动',
-          brief: '2023晶闪科技春季校园招聘正式启动！',
-          createdAt: '2023-01-01 12:34:56',
-          likeCount: Math.round(Math.random() * 1000),
-          liked: Math.random() > 0.5,
-        },
-        {
-          id: 2,
-          categories: ['big-event'],
-          img: ImgArticle2,
-          title: '携手并进·筑梦未来丨2023年晶闪科技供应商大会',
-          brief:
-            '2022年，我们回归初心；2023年，我们展望未来。让我们在这新的一年里，携手共进，筑梦未来！',
-          createdAt: '2023-01-02 13:24:57',
-          likeCount: Math.round(Math.random() * 1000),
-          liked: Math.random() > 0.5,
-        },
-        {
-          id: 3,
-          categories: ['big-event', 'employee-activity'],
-          img: ImgArticle3,
-          title: '万圣节 | 冲刺月前夕的动员狂欢',
-          brief:
-            '对于跨境电商领域的我们来说，万圣节之后即将开启的十一月，是一个非常特殊的月份。春种长期战，秋收亿亿万，想要年底不吃土，就要全力拼黑五！要想钱包不空虚，就要闷头冲网一！',
-          createdAt: '2022-10-30 13:24:57',
-          likeCount: Math.round(Math.random() * 1000),
-          liked: Math.random() > 0.5,
-        },
-        {
-          id: 4,
-          categories: ['big-event'],
-          img: ImgArticle4,
-          title: '速报 | NC荣获2020年BrandZ中国最具潜力全球化品牌15强',
-          brief: 'NC荣获2020年BrandZ中国最具潜力全球化品牌15强',
-          createdAt: '2023-01-02 13:24:57',
-          likeCount: Math.round(Math.random() * 1000),
-          liked: Math.random() > 0.5,
-        },
-        {
-          id: 5,
-          categories: ['employee-activity'],
-          img: ImgArticle5,
-          title: 'CEO私房话 | 第二期-产研小哥的爱恨情仇',
-          brief: '嘘！这些悄悄话只说给宁缺听！',
-          createdAt: '2023-01-02 13:24:57',
-          likeCount: Math.round(Math.random() * 1000),
-          liked: Math.random() > 0.5,
-        },
-        {
-          id: 6,
-          categories: ['employee-activity'],
-          img: ImgArticle6,
-          title: '感恩节 | “感谢大声说出口”留言征集活动',
-          brief: '感谢打开这篇文章的你~',
-          createdAt: '2023-01-02 13:24:57',
-          likeCount: Math.round(Math.random() * 1000),
-          liked: Math.random() > 0.5,
-        },
-        {
-          id: 7,
-          categories: ['employee-activity'],
-          img: ImgArticle7,
-          title: '生日会 | 7月生辰 快哉乐哉',
-          brief: '真的不和我说生日快乐吗？不然下次要再365天了噢～',
-          createdAt: '2022-07-01 00:00:01',
-          likeCount: Math.round(Math.random() * 1000),
-          liked: Math.random() > 0.5,
-        },
-      ],
+      articles: Articles.map((e) => ({
+        ...e,
+        img:
+          process.env.BASE_URL +
+          (process.env.BASE_URL.endsWith('/') ? '' : '/') +
+          e.img,
+      })),
 
       articlesList: [],
     }