feat: 添加通知列表功能和样式优化

api/home/index.ts

@@ -104,3 +104,10 @@ export const getTDK = () => {
 export const getTDKList = () => {
   return useFetchRequest.get<IResponse<TdkSettingsDO[]>>('/prod-api/app-api/business/tdk-settings/list-menu', {})
 }
+
+/**
+ * 通知列表
+ */
+export const getNoticeList = () => {
+  return useDollarFetchRequest.get<IResponse<any>>('/prod-api/app-api/system/index-setting/notice-list', {})
+}

pages/home/components/MainContent.vue

@@ -2,27 +2,19 @@
 <template>
   <div class="main-content">
     <div class="flex">
-      <div class="h-424px w-957px">
+      <div class="h-[424px] w-[957px]">
         <el-carousel height="424px" indicator-position="none">
           <el-carousel-item v-for="(item, index) in bannerList" :key="index">
-            <el-image
-              :src="item.content"
-              class="w-100%"
-              :class="{ 'cursor-pointer': item.url }"
-              fit="cover"
-              @click="handleClick(item.url)"
-            />
+            <el-image :src="item.content" class="w-[100%]" :class="{ 'cursor-pointer': item.url }" fit="cover" @click="handleClick(item.url)" />
           </el-carousel-item>
         </el-carousel>
       </div>
       <LoginForm />
     </div>
-    <div
-      class="box-border h-56px w-1219px flex items-center border border-[#EEEEEE] border-solid border-t-none bg-[#FFFFFF] pl-10px line-height-46px"
-    >
-      <img src="~/assets/images/voice.png" alt="" srcset="" class="mr-10px h-15px w-16px" />
+    <div class="box-border h-[56px] w-[1219px] flex items-center border border-[#EEEEEE] border-solid border-t-none bg-[#FFFFFF] pl-[10px] line-height-[46px]">
+      <img src="~/assets/images/voice.png" alt="" srcset="" class="mr-[10px] h-[15px] w-[16px]" />
       <Vue3Marquee :duration="10" direction="normal" pause-on-hover>
-        · 经典来袭，SolidWorks装配经典案例之气动发动机
+        <template v-for="(item, index) in noticeList" :key="index"> {{ item }} </template>
       </Vue3Marquee>
     </div>
   </div>
@@ -33,7 +25,7 @@
   import LoginForm from './LoginForm.vue'
   import { Vue3Marquee } from 'vue3-marquee'
 
-  import { getSettingPage } from '~/api/home/index'
+  import { getSettingPage, getNoticeList } from '~/api/home/index'
 
   const pageReq = reactive({
     type: 1,
@@ -50,6 +42,9 @@
       navigateTo(url)
     }
   }
+
+  const { data: noticeList } = await getNoticeList()
+  console.log(noticeList)
 </script>
 
 <style scoped lang="scss">