百色农校完成

components/Index/BNNews.vue

@@ -1,19 +1,15 @@
 <template>
   <div class="xl:w-screen-xl m-auto py-4 px-4 lg:px-0">
-    <div class="text-center flex flex-col items-center z-0 relative">
-      <h2 class="text-4xl font-bold tracking-tight text-gray-800 dark:text-white">
-        {{ '百农新闻' }}
-      </h2>
-      <div class="sub-title">
-        <p class="text-gray-400 text-sm dark:text-gray-400 py-3">
-          {{ 'BaiSe NongXiao News' }}
-        </p>
-      </div>
+    <div class="text-center flex justify-between items-center z-0 relative my-5">
+      <el-space class="text-3xl font-bold text-green-600 flex items-center"><el-icon><Tickets /></el-icon>百农新闻</el-space>
+      <nuxt-link to="/article/4151.html">
+        <span class="text-lg font-bold tracking-tight text-gray-800 hover:text-red-500 dark:text-white">{{ '进入新闻中心' }}</span>
+      </nuxt-link>
     </div>
     <el-card shadow="hover">
       <el-row :gutter="24">
         <el-col :lg="10" :xs="24">
-          <HotNewsCarousel />
+          <HotNewsCarousel v-if="imgList.length > 0" :data="imgList" />
         </el-col>
         <el-col :lg="14" :xs="24" class="w-full h-auto">
           <template v-for="(item, index) in list" :key="index">
@@ -21,7 +17,7 @@
               <div class="text-lg my-3 flex justify-between">
                 <span class="title text-gray-800 hover:text-green-700 text-sm lg:text-lg">{{ item.title }}</span>
                 <span class="text-gray-400 text-sm text-right w-[100px]">{{
-                  dayjs(item.createTime).format('MM-DD')
+                  dayjs(item.createTime).format('YYYY.MM.DD')
                 }}</span>
               </div>
             </nuxt-link>
@@ -35,12 +31,17 @@
 
 <script lang="ts" setup>
   import { navigateTo } from '#imports';
+  import {
+    ArrowRight,
+    Tickets
+  } from '@element-plus/icons-vue'
   import dayjs from 'dayjs';
   import type { CmsArticle } from '~/api/cms/cmsArticle/model';
   import { pageCmsArticle } from '~/api/cms/cmsArticle';
-  import HotNewsCarousel from '~/components/Index/HotNewsCarousel.vue';
+  import HotNewsCarousel from "~/components/Index/HotNewsCarousel.vue";
 
   const list = ref<CmsArticle[]>([]);
+  const imgList = ref<CmsArticle[]>([]);
 
   // 请求数据
   const reload = async () => {
@@ -51,6 +52,14 @@
     }).then(res => {
       list.value = res?.list || [];
     });
+
+    pageCmsArticle({
+      recommend: 1,
+      limit: 5,
+      lang: getLang()
+    }).then(res => {
+      imgList.value = res?.list || [];
+    })
   };
   onMounted(() => {
     reload();

components/Index/Carousel.vue

@@ -1,12 +1,11 @@
 <template>
     <div style="margin-top: 210px;" class="w-full bg-white mb-3 hidden-sm-and-down" v-if="ad">
-      <el-carousel :height="`${ad?.height || '500'}px`">
+      <el-carousel id="flash1" :height="`${ad?.height || '500'}px`">
         <el-carousel-item v-for="(item,index) in ad?.imageList" :key="index">
           <div class="item relative  flex justify-center items-center">
             <el-image :src="item.url" fit="fill" class="w-full" :style="`height: ${ad?.height}px;`" />
 <!--            fit: '' | 'fill' | 'contain' | 'cover' | 'none' | 'scale-down'-->
           </div>
-          {{ad.height}}==
         </el-carousel-item>
       </el-carousel>
     </div>

components/Index/Carousel2.vue

@@ -0,0 +1,85 @@
+<template>
+    <div v-if="list" style="margin-top: 210px;" class="w-full bg-white mb-3 hidden-sm-and-down">
+      <el-carousel id="flash1" :height="flashHeight + 'px'" :interval="2000">
+        <el-carousel-item v-for="(item,index) in list" :key="index">
+          <div class="item relative  flex justify-center items-center">
+            <el-image :src="`${FILE_SERVER}${item.image}`" fit="fill" class="w-full" :style="`height: 300px;`" />
+<!--            fit: '' | 'fill' | 'contain' | 'cover' | 'none' | 'scale-down'-->
+          </div>
+        </el-carousel-item>
+      </el-carousel>
+    </div>
+
+    <!-- 移动端 -->
+<!--    <div class="sm:hidden w-full bg-white mt-[38px] mb-3 hidden-sm-and-up" v-if="ad">-->
+<!--      <el-carousel indicator-position="none" height="200">-->
+<!--        <el-carousel-item v-for="(item,index) in ad?.imageList" :key="index">-->
+<!--          <el-image :src="item.url" />-->
+<!--        </el-carousel-item>-->
+<!--      </el-carousel>-->
+<!--    </div>-->
+</template>
+
+<script setup lang="ts">
+import type {CompanyParam} from "~/api/system/company/model";
+import type {CmsAd} from "~/api/cms/cmsAd/model";
+import {getCmsAd, pageCmsAd} from "~/api/cms/cmsAd";
+import {pageCmsArticle} from "~/api/cms/cmsArticle";
+import type {CmsArticle} from "~/api/cms/cmsArticle/model";
+import {FILE_SERVER} from "~/config";
+
+const props = withDefaults(
+    defineProps<{
+      config?: any;
+      list?: any[];
+      disabled?: boolean;
+      title?: string;
+      comments?: string;
+    }>(),
+    {
+      title: '卡片标题',
+      comments: '卡片描述'
+    }
+);
+
+const emit = defineEmits<{
+  (e: 'done'): void;
+}>();
+
+const isMobile = useIsMobile();
+const list = ref<CmsArticle[]>([]);
+const flashHeight = ref<number>(372)
+
+// 搜索表单
+const where = reactive<CompanyParam>({
+  keywords: ''
+});
+
+// 请求数据
+const reload = async () => {
+  pageCmsArticle({
+    recommend: 1,
+    limit: 5,
+    lang: getLang()
+  }).then(res => {
+    list.value = res?.list || [];
+  })
+  if(isMobile.value){
+    flashHeight.value = 260;
+  }
+}
+
+watch(
+    () => props.config,
+    () => {
+      reload();
+    },
+    {immediate: true}
+);
+</script>
+
+<style>
+.hidden-sm-and-up .el-carousel{
+  height: 160px;
+}
+</style>

components/Index/CaseList.vue

@@ -33,7 +33,7 @@
               </el-space>
               <div class="text-gray-400">
                 <el-avatar v-if="item.avatar" :src="`${item.avatar}`" size="small" />
-                {{ dayjs(item.createTime).format('YYYY-MM-DD') }}
+                {{ dayjs(item.createTime).format('YYYY.MM.DD') }}
               </div>
             </div>
           </div>

components/Index/HotNews.vue

@@ -1,16 +1,20 @@
 <template>
   <div class="xl:w-screen-xl m-auto py-4 px-4 sm:px-0">
-    <div class="text-center flex flex-col items-center z-0 relative">
-      <h2 class="text-4xl font-bold tracking-tight text-gray-800 dark:text-white">
-        {{ title || '热点新闻' }}
-      </h2>
-      <div class="sub-title">
-        <p class="text-gray-400 text-sm dark:text-gray-400 py-3">
-          {{ comments || 'Unlimited Scenery' }}
-        </p>
-      </div>
+    <div class="text-center flex justify-between items-center z-0 relative my-5">
+      <el-space class="text-3xl font-bold text-green-600 flex items-center"><el-icon><CameraFilled /></el-icon>校园风光</el-space>
+      <nuxt-link :to="`/article/4145.html`" class="font-normal text-sm text-gray-400 flex items-center cursor-pointer">查看更多<el-icon><ArrowRight /></el-icon></nuxt-link>
     </div>
-    <el-row :gutter="24" id="container" class="clearfix">
+<!--    <div class="text-center flex flex-col items-center z-0 relative">-->
+<!--      <nuxt-link to="/article/4145.html">-->
+<!--        <span class="text-4xl font-bold tracking-tight text-gray-800 dark:text-white">{{ title }}</span>-->
+<!--      </nuxt-link>-->
+<!--      <div class="sub-title">-->
+<!--        <p class="text-gray-400 text-sm dark:text-gray-400 py-3">-->
+<!--          {{ comments || 'Unlimited Scenery' }}-->
+<!--        </p>-->
+<!--      </div>-->
+<!--    </div>-->
+    <el-row :gutter="24" class="clearfix">
       <el-col v-for="(item,index) in list" :key="index" :xs="12" :span="6" class="left mb-6">
         <el-card shadow="hover" :body-style="{ padding: '0px' }" class=" hover:bg-gray-50 cursor-pointer" @click="navigateTo(`/detail/${item.articleId}.html`)">
           <el-image
@@ -31,7 +35,7 @@
                 <div class="text-gray-400 gap-1 flex items-center"><el-icon><View /></el-icon><span>{{ getViews(item) }}</span></div>
               </el-space>
               <div class="text-gray-400">
-                {{ dayjs(item.createTime).format('YYYY-MM-DD') }}
+                {{ dayjs(item.createTime).format('YYYY.MM.DD') }}
               </div>
             </div>
           </div>
@@ -52,6 +56,11 @@ import type {CmsArticle} from "~/api/cms/cmsArticle/model";
 import {listCmsArticle, pageCmsArticle} from "~/api/cms/cmsArticle";
 import type {CmsArticleParam} from "~/api/cms/cmsArticle/model";
 import {getImage} from "~/utils/common";
+import {
+  ArrowRight,
+  Tickets,
+  CameraFilled
+} from '@element-plus/icons-vue'
 
 const props = withDefaults(
     defineProps<{

components/Index/HotNewsCarousel.vue

@@ -1,10 +1,12 @@
 <template>
   <div class="lg:my-3 my-0 relative">
-    <el-carousel :height="flashHeight + 'px'" indicator-position="none">
-      <el-carousel-item v-for="(item,index) in list" :key="index">
+    <el-carousel :height="flashHeight + 'px'" :interval="2000"  motion-blur indicator-position="none">
+      <el-carousel-item v-for="(item,index) in data" :key="index">
         <nuxt-link :to="`/detail/${item.articleId}.html`" class="item flex justify-center items-center">
-          <img :src="`${FILE_SERVER}${item.image}`" class="w-[500px] h-[380px]" />
-          <div class="absolute bottom-3 z-100 text-white font-bold px-4 line-clamp-1 text-sm lg:text-lg">{{ item.title }}</div>
+          <el-image :src="`${FILE_SERVER}${item.image}`" class="w-[500px] h-[380px]" />
+          <div class="absolute bottom-0 z-100 w-[468px] bg-black opacity-80 font-bold px-4 line-clamp-1 text-sm lg:text-lg">
+            <span class="text-white">{{ item.title }}</span>
+          </div>
         </nuxt-link>
       </el-carousel-item>
     </el-carousel>
@@ -13,7 +15,6 @@
 
 <script setup lang="ts">
 import type {CompanyParam} from "~/api/system/company/model";
-import {pageCmsArticle} from "~/api/cms/cmsArticle";
 import type {CmsArticle} from "~/api/cms/cmsArticle/model";
 import {FILE_SERVER} from "~/config";
 
@@ -21,8 +22,7 @@ const isMobile = useIsMobile();
 
 const props = withDefaults(
     defineProps<{
-      config?: any;
-      list?: any[];
+      data?: CmsArticle[];
       disabled?: boolean;
       title?: string;
       comments?: string;
@@ -36,7 +36,7 @@ const props = withDefaults(
 const emit = defineEmits<{
   (e: 'done'): void;
 }>();
-
+const loading = ref(false);
 const list = ref<CmsArticle[]>([]);
 const flashHeight = ref<number>(372)
 
@@ -47,20 +47,18 @@ const where = reactive<CompanyParam>({
 
 // 请求数据
 const reload = async () => {
-  pageCmsArticle({
-    recommend: 1,
-    limit: 5,
-    lang: getLang()
-  }).then(res => {
-    list.value = res?.list || [];
-  })
+  loading.value = true;
   if(isMobile.value){
     flashHeight.value = 260;
   }
+  setTimeout(() => {
+    list.value = props.data || [];
+    loading.value = false;
+  },500)
 }
 
 watch(
-    () => props.config,
+    () => props.data,
     () => {
       reload();
     },

components/Index/Partners.vue

@@ -1,14 +1,17 @@
 <template>
   <div class="xl:w-screen-xl m-auto py-4 px-4 sm:px-0">
-    <div class="text-center flex flex-col items-center z-0 relative">
-      <h2 class="text-4xl font-bold tracking-tight text-gray-800 dark:text-white">
-        {{ title || '友情链接' }}
-      </h2>
-      <div class="sub-title">
-        <p class="text-gray-400 text-sm dark:text-gray-400 py-3">
-          {{ comments || 'Link' }}
-        </p>
-      </div>
+<!--    <div class="text-center flex flex-col items-center z-0 relative">-->
+<!--      <h2 class="text-4xl font-bold tracking-tight text-gray-800 dark:text-white">-->
+<!--        {{ title || '友情链接' }}-->
+<!--      </h2>-->
+<!--      <div class="sub-title">-->
+<!--        <p class="text-gray-400 text-sm dark:text-gray-400 py-3">-->
+<!--          {{ comments || 'Link' }}-->
+<!--        </p>-->
+<!--      </div>-->
+<!--    </div>-->
+    <div class="text-center flex justify-between items-center z-0 relative my-5">
+      <el-space class="text-3xl font-bold text-green-600 flex items-center"><el-icon><Link /></el-icon>友情链接</el-space>
     </div>
     <el-row id="container" :gutter="24" class="clearfix">
       <el-col v-for="(item,index) in list" :key="index" :sm="6" :xs="12" class="left mb-8 hidden-sm-and-down">
@@ -47,7 +50,11 @@
 <script lang="ts" setup>
 import {navigateTo} from "#imports";
 import type {CmsWebsite, CmsWebsiteParam} from "~/api/cms/cmsWebsite/model";
-import {pageCmsWebsiteAll} from "~/api/cms/cmsWebsite";
+import {
+  ArrowRight,
+  Tickets,
+  Link
+} from '@element-plus/icons-vue'
 import {pageCmsLink} from "~/api/cms/cmsLink";
 import type {CmsLink} from "~/api/cms/cmsLink/model";
 

components/Index/ZSNews.vue

@@ -4,8 +4,9 @@
       <el-col :span="8" :xs="24">
         <el-card shadow="hover" :body-style="{ padding: '0px' }" class=" hover:bg-gray-50 cursor-pointer mb-5" >
           <template #header>
-            <div class="text-lg font-medium">
-              招生就业
+            <div class="text-lg font-medium flex items-center justify-between cursor-text">
+              <el-space class="text-xl text-green-600 font-bold"><el-icon><Avatar /></el-icon>招生就业</el-space>
+              <nuxt-link :to="`/article/4155.html`" class="font-normal text-sm text-gray-400 flex items-center cursor-pointer">查看更多<el-icon><ArrowRight /></el-icon></nuxt-link>
             </div>
           </template>
           <div class="px-5">
@@ -13,7 +14,7 @@
               <nuxt-link :to="`/detail/${item.articleId}.html`" class="item">
                 <div class="text-lg my-3 flex justify-between">
                   <span class="title text-gray-800 hover:text-green-700 line-clamp-2 text-sm lg:text-lg">{{ item.title }}</span>
-                  <span class="text-gray-400 text-sm text-right w-[100px]">{{  dayjs(item.createTime).format('MM-DD') }}</span>
+                  <span class="text-gray-400 text-sm text-right w-[100px]">{{  dayjs(item.createTime).format('YYYY.MM.DD') }}</span>
                 </div>
               </nuxt-link>
             </template>
@@ -23,8 +24,9 @@
       <el-col :span="8" :xs="24">
         <el-card shadow="hover" :body-style="{ padding: '0px' }" class=" hover:bg-gray-50 cursor-pointer mb-5" >
           <template #header>
-            <div class="text-lg font-medium">
-              通知公告
+            <div class="text-lg font-medium flex items-center justify-between cursor-text">
+              <el-space class="text-xl text-green-600 font-bold"><el-icon><BellFilled /></el-icon>通知公告</el-space>
+              <nuxt-link :to="`/article/4152.html`" class="font-normal text-sm text-gray-400 flex items-center cursor-pointer">查看更多<el-icon><ArrowRight /></el-icon></nuxt-link>
             </div>
           </template>
           <div class="px-5">
@@ -32,7 +34,7 @@
               <nuxt-link :to="`/detail/${item.articleId}.html`" class="item">
                 <div class="text-lg my-3 flex justify-between">
                   <span class="title text-gray-800 hover:text-green-700 line-clamp-2  text-sm lg:text-lg">{{ item.title }}</span>
-                  <span class="text-gray-400 text-sm text-right w-[100px]">{{  dayjs(item.createTime).format('MM-DD') }}</span>
+                  <span class="text-gray-400 text-sm text-right w-[100px]">{{  dayjs(item.createTime).format('YYYY.MM.DD') }}</span>
                 </div>
               </nuxt-link>
             </template>
@@ -42,8 +44,9 @@
       <el-col :span="8" :xs="24">
         <el-card shadow="hover" :body-style="{ padding: '0px' }" class=" hover:bg-gray-50 cursor-pointer mb-5" >
           <template #header>
-            <div class="text-lg font-medium">
-              教学教研
+            <div class="text-lg font-medium flex items-center justify-between cursor-text">
+              <el-space class="text-xl text-green-600 font-bold"><el-icon><Finished /></el-icon>教学教研</el-space>
+              <nuxt-link :to="`/article/4159.html`" class="font-normal text-sm text-gray-400 flex items-center cursor-pointer">查看更多<el-icon><ArrowRight /></el-icon></nuxt-link>
             </div>
           </template>
           <div class="px-5">
@@ -51,7 +54,7 @@
               <nuxt-link :to="`/detail/${item.articleId}.html`" class="item">
                 <div class="text-lg my-3 flex justify-between">
                   <span class="title text-gray-800 hover:text-green-700 line-clamp-2  text-sm lg:text-lg">{{ item.title }}</span>
-                  <span class="text-gray-400 text-sm text-right w-[100px]">{{  dayjs(item.createTime).format('MM-DD') }}</span>
+                  <span class="text-gray-400 text-sm text-right w-[100px]">{{  dayjs(item.createTime).format('YYYY.MM.DD') }}</span>
                 </div>
               </nuxt-link>
             </template>
@@ -67,6 +70,14 @@
 
 <script lang="ts" setup>
 import {navigateTo} from "#imports";
+import {
+  ArrowRight,
+  Tickets,
+  Avatar,
+  BellFilled,
+  Finished
+
+} from '@element-plus/icons-vue'
 import dayjs from "dayjs";
 import type {CmsArticle} from "~/api/cms/cmsArticle/model";
 import {listCmsArticle, pageCmsArticle} from "~/api/cms/cmsArticle";