gerson
2025-02-18 9831a1c47f949eb46f40fa468a3b476bb2bc8c72
src/views/Home.vue
@@ -5,19 +5,19 @@
         <el-carousel height="500px" :interval="5000" arrow="always">
            <el-carousel-item>
               <div class="carousel-item">
                  <img src="@/assets/carousel/test/10.png" class="carousel-image" />
                  <img src="@/assets/carousel/test/15.jpg" class="carousel-image" />
                  <!-- <img src="https://www.app-i.cn/api/file?file_name=2d82602e-8797-46d7-9b5c-59d9f88bc6d9.png;软件一体化测试平台_副本.png" class="carousel-image" /> -->
               </div>
            </el-carousel-item>
            <el-carousel-item>
               <div class="carousel-item">
                  <img src="@/assets/carousel/test/11.png" class="carousel-image" />
                  <img src="@/assets/carousel/final/2.jpg" class="carousel-image" />
                  <!-- <img src="https://www.app-i.cn/static/epidemicBanner.e4d9a821.jpg" alt=""> -->
               </div>
            </el-carousel-item>
            <el-carousel-item>
               <div class="carousel-item">
                  <img src="@/assets/carousel/test/14.png" class="carousel-image" />
                  <img src="@/assets/carousel/final/5.png" class="carousel-image" />
                  <!-- <img src="https://www.app-i.cn/api/file?file_name=072c9dda-3ffb-410d-be93-a88ec6c7e765.jpg;40周年1.jpg" alt=""> -->
               </div>
            </el-carousel-item>
@@ -84,14 +84,15 @@
                     </div>
                  </router-link>
                  <router-link to="/" class="block" style="border-right: 1px solid #e3e3e3">
                     <div class="flex items-center gap-1 justify-center" @click="linkClick(' http://www.xpump.net/web/#/CN/Index')">
                     <div class="flex items-center gap-1 justify-center" @click="linkClick(' https://www.xpump.net/')">
                        <div class="w-16 h-16">
                           <svg viewBox="0 0 24 24" class="w-full h-full">
                           <!-- <svg viewBox="0 0 24 24" class="w-full h-full">
                              <path
                                 fill="currentColor"
                                 d="M12,3L2,12H5V20H19V12H22L12,3M12,8.75A2.25,2.25 0 0,1 14.25,11A2.25,2.25 0 0,1 12,13.25A2.25,2.25 0 0,1 9.75,11A2.25,2.25 0 0,1 12,8.75M12,15C13.5,15 16.5,15.75 16.5,17.25V18H7.5V17.25C7.5,15.75 10.5,15 12,15Z"
                              />
                           </svg>
                           </svg> -->
                           <img :src="YWLogo" class="h-full" />
                        </div>
                        <div>
                           <div class="text-lg font-medium">查泵网</div>
@@ -150,37 +151,36 @@
               <div class="flex justify-between items-center mb-4" style="border-bottom: 1.5px solid var(--alloy-color-primary)">
                  <div class="flex items-center space-x-2 ml-2 font-bold">
                     <el-icon class="text-blue-500"><Document /></el-icon>
                     <span class="text-medium font-bold"> <span class="text-primary">通知</span>公告</span>
                     <span class="text-medium font-bold"> <span class="text-primary">新闻</span>政策</span>
                  </div>
                  <el-button text>更多</el-button>
                  <el-button text >更多</el-button>
               </div>
               <div class="flex">
                  <img
                     class="w-[30%] flex-0"
                     src="https://www.app-i.cn/api/file?file_name=f9afde4d-6993-43e6-9ea5-fa2359161b4d.png;2(1).png"
                     alt="通知公告"
                  />
                  <div class="bg-page p-4 flex-auto">
                     <div class="font-bold text-medium over-ellipsis mb-2">
                        武汉市人民政府关于印发武汉市关于进一步促进软件和信息技术服务业高质量
                  <img class="w-[30%] flex-0 cursor-pointer" src="@/assets/home/notice.png" @click="routeClick('/news-detail/8')" alt="新闻政策" />
                  <div class="bg-page p-4 flex-auto  ">
                     <div class="font-bold text-large over-ellipsis mb-2 hover:text-primary cursor-pointer" @click="routeClick('/news-detail/8')">
                        上海市经济信息化委关于开展2025年度上海市工业通信业用能设备更新专项扶持资金项目申报工作的通知
                     </div>
                     <div class="text-small text-regular">
                        各区人民政府,市人民政府各部门:
                        经研究,现将《武汉市关于进一步促进软件和信息技术服务业高质量发展的若干政策措施》印发给你们,请认真组织实施。
                        有关单位:
                        为贯彻落实《上海市节能减排(应对气候变化)专项资金管理办法(沪发改规范〔2021〕5号)》和《上海市工业通信业用能设备更新专项扶持实施细则》(沪经信规范〔2025〕1号),进一步推进本市工业通信业用能设备更新工作,现组织开展2025年度上海市工业通信业用能设备更新专项扶持资金项目申报工作。
                     </div>
                     <div
                        v-for="(item, index) in newsList"
                        :key="index"
                        class="flex text-regular justify-between items-center py-2"
                        style="border-bottom: 1px solid #e3e3e3"
                     >
                        <div class="flex items-center hover:text-primary w-full" @click="handleNewsClick(item)">
                           <!-- <div class="w-1.5 h-1.5 rounded-full bg-gray-400 mr-2"></div> -->
                           <div class="w-full text-gray-700 hover:text-blue-500 cursor-pointer text-ellipsis overflow-hidden whitespace-nowrap">
                              {{ item.title }}
                     <div class="mt-4">
                        <div
                           v-for="(item, index) in newsList"
                           :key="index"
                           class="flex text-regular justify-between items-center py-2 news-item"
                        >
                           <div class="flex items-center hover:text-primary w-full" @click="handleNewsClick(item)">
                              <!-- <div class="w-1.5 h-1.5 rounded-full bg-gray-400 mr-2"></div> -->
                              <div
                                 class="w-full text-gray-700 hover:text-blue-500 cursor-pointer text-ellipsis overflow-hidden whitespace-nowrap"
                              >
                                 {{ item.title }}
                              </div>
                           </div>
                           <!-- <div class="text-gray-400 text-sm">{{ item.date }}</div> -->
                        </div>
                        <!-- <div class="text-gray-400 text-sm">{{ item.date }}</div> -->
                     </div>
                  </div>
               </div>
@@ -191,17 +191,17 @@
               <div class="flex justify-between items-center mb-4" style="border-bottom: 1.5px solid var(--alloy-color-primary)">
                  <div class="flex items-center space-x-2 ml-2 font-bold">
                     <el-icon class="text-blue-500"><Operation /></el-icon>
                     <span class="text-medium font-bold"> <span class="text-primary">认证</span>厂家</span>
                     <span class="text-medium font-bold"> <span class="text-primary">认证</span>产品</span>
                  </div>
                  <el-button text>更多</el-button>
                  <el-button text @click="routeClick('/certified-products')">更多</el-button>
               </div>
               <div class="flex bg-[#f9f9f9]">
                  <div class="flex-auto">
                     <img src="@/assets/images/china-map.png" alt="活动合作" class="w-full h-full" />
                     <img src="@/assets/images/china-map.png" alt="认证产品" class="w-full h-full" />
                  </div>
                  <div class="bg-[#393939] h-fit my-auto w-[200px] px-4 py-2 mx-10">
                     <div class="flex flex-col justify-between items-center mb-4 gap-2">
                        <div class="text-lg font-bold text-[#26c4f6]">全国能效软件|能效APP总量</div>
                        <div class="text-lg font-bold text-[#26c4f6]">全国能效产品总量</div>
                        <div class="px-10 bg-[#d7ecf1] py-1.5 rounded-lg text-large font-bold text-warning">
                           4083<span class="text-base text-info-light-3 ml-1">个</span>
                        </div>
@@ -227,7 +227,7 @@
                     <span class="text-medium font-medium">工业软件|工业APP<span class="text-primary">产品分类</span></span>
                  </div>
               </div> -->
               <div class="text-large flex items-center w-fit mx-auto mt-4 font-bold">能效软件 | 能效APP产品分类</div>
               <div class="text-large flex items-center w-fit mx-auto mt-4 font-bold">能效产品分类</div>
               <div class="flex">
                  <div class="w-[45%] h-[400px]" ref="pieChartRef"></div>
                  <div class="w-[55%] h-[400px]" ref="barChartRef"></div>
@@ -243,10 +243,16 @@
import * as echarts from 'echarts';
import { onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';
import YWLogo from "@/assets/logo/yw_logo.png"
const router = useRouter();
const newsList = ref([
   {
      id:'7',
      title:'上海市人民政府关于印发《上海市推动大规模设备更新和消费品以旧换新行动计划(2024-2027年)》的通知',
      date:'2024-04-23',
      link:'test'
   },
   {
      id: '1',
      title: '上海市经济信息化委关于征集用能设备更新供应链平台的通知',
@@ -271,6 +277,18 @@
      date: '2024-10-22',
      link: 'https://gxj.quanzhou.gov.cn/zwgk/zfxxgk/fdzdgknr/gzdt/202410/t20241022_3093021.htm',
   },
   {
      id: '5',
      title: '关于《上海市工业通信业用能设备更新专项政策实施细则(征求意见稿)》公开征求意见的公告',
      date: '2024-12-18',
      link: 'https://sheitc.sh.gov.cn/gg/20241218/517c960cef5d40f0bb04b1099c64d9eb.html',
   },
   // {
   //    id: '6',
   //    title: '解读产业能效指南,推动设备对标及更新',
   //    date: '2024-08-05',
   //    link: 'https://sheitc.sh.gov.cn/djjcdt/20240805/e8b8b4db2fb445f88b22b72f45132d68.html',
   // },
   // {
   //    title: '印发推动工业领域设备更新工作实施方案的通知',
   //    date: '2024-10-22',
@@ -296,6 +314,10 @@
const linkClick = (url) => {
   window.open(url, '_blank');
};
const routeClick = (url) => {
   router.push(url);
};
const cooperationData = ref([
   { region: '上海省', count: 389 },
   { region: '江苏省', count: 281 },
@@ -303,6 +325,8 @@
   { region: '湖南省', count: 125 },
   { region: '湖北省', count: 89 },
]);
const handleNewsClick = (item: any) => {
   // if (item.link) {
@@ -402,7 +426,7 @@
      const barChart = echarts.init(barChartRef.value);
      barChart.setOption({
         title: {
            text: '研发设计类产品数量统计',
            text: '能效产品分类数量统计',
            left: 'center',
            top: 10,
         },
@@ -420,7 +444,7 @@
         },
         xAxis: {
            type: 'category',
            data: ['江苏省', '北京市', '上海市', '浙江省', '广东省', '山东省'],
            data: chartData.map((item) => item.name),
            axisLabel: {
               interval: 0,
               rotate: 30,
@@ -432,7 +456,7 @@
         },
         series: [
            {
               data: [260, 240, 35, 25, 20, 8],
               data: chartData.map((item) => item.value),
               type: 'bar',
               barWidth: '40%',
               itemStyle: {
@@ -640,4 +664,17 @@
      color: #fff;
   }
}
.news-item {
   cursor: pointer;
   border-bottom: 1px solid #e3e3e3;
   &:first-child {
      border-top: 1px solid #e3e3e3;
   }
   &:last-child {
      border-bottom: none;
   }
}
</style>