From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/views/mp/components/wx-news/main.vue | 119 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 119 insertions(+), 0 deletions(-)
diff --git a/src/views/mp/components/wx-news/main.vue b/src/views/mp/components/wx-news/main.vue
new file mode 100644
index 0000000..033adca
--- /dev/null
+++ b/src/views/mp/components/wx-news/main.vue
@@ -0,0 +1,119 @@
+<!--
+ - Copyright (C) 2018-2019
+ - All rights reserved, Designed By www.joolun.com
+ 銆愬井淇℃秷鎭� - 鍥炬枃銆�
+ 鑺嬮亾婧愮爜锛�
+ 鈶� 浠ｇ爜浼樺寲锛岃ˉ鍏呮敞閲婏紝鎻愬崌闃呰鎬�
+-->
+<template>
+ <div class="news-home">
+ <div v-for="(article, index) in articles" :key="index" class="news-div">
+ <!-- 澶存潯 -->
+ <a v-if="index === 0" :href="article.url" target="_blank">
+ <div class="news-main">
+ <div class="news-content">
+ <el-image
+ :src="article.picUrl || article.thumbUrl"
+ class="material-img"
+ style="width: 100%; height: 120px"
+ />
+ <div class="news-content-title">
+ <span>{{ article.title }}</span>
+ </div>
+ </div>
+ </div>
+ </a>
+ <!-- 浜屾潯/涓夋潯绛夌瓑 -->
+ <a v-else :href="article.url" target="_blank">
+ <div class="news-main-item">
+ <div class="news-content-item">
+ <div class="news-content-item-title">{{ article.title }}</div>
+ <div class="news-content-item-img">
+ <img :src="article.picUrl || article.thumbUrl" class="material-img" height="100%" />
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+</template>
+
+<script lang="ts" setup>
+defineOptions({ name: 'WxNews' })
+
+const props = withDefaults(
+ defineProps<{
+ articles: any[] | null
+ }>(),
+ {
+ articles: null
+ }
+)
+
+defineExpose({
+ articles: props.articles
+})
+</script>
+
+<style lang="scss" scoped>
+.news-home {
+ width: 100%;
+ margin: auto;
+ background-color: #fff;
+}
+
+.news-main {
+ width: 100%;
+ margin: auto;
+}
+
+.news-content {
+ position: relative;
+ width: 100%;
+ background-color: #acadae;
+}
+
+.news-content-title {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ display: inline-block;
+ width: 98%;
+ padding: 1%;
+ font-size: 12px;
+ color: #fff;
+ white-space: normal;
+ background-color: black;
+ opacity: 0.65;
+ box-sizing: unset !important;
+}
+
+.news-main-item {
+ padding: 5px 0;
+ background-color: #fff;
+ border-top: 1px solid #eaeaea;
+}
+
+.news-content-item {
+ position: relative;
+}
+
+.news-content-item-title {
+ display: inline-block;
+ width: 70%;
+ margin-left: 1%;
+ font-size: 10px;
+ white-space: normal;
+}
+
+.news-content-item-img {
+ display: inline-block;
+ width: 25%;
+ margin-right: 1%;
+ background-color: #acadae;
+}
+
+.material-img {
+ width: 100%;
+}
+</style>
--
Gitblit v1.8.0