修改问题

bak/home.vue

@@ -0,0 +1,346 @@
+<template>
+  <div class="dashboard">
+    <el-container>
+      <el-main>
+        <el-row :gutter="20">
+          <el-col :span="8">
+            <el-card class="box-card">
+              <template #header>
+                <div class="card-header">
+                  <span>{{lastYear+'年'}}贷款总额</span>
+                </div>
+              </template>
+              <div class="card-content">
+                <h2>¥ {{ formatNumber(loanAmount) }}万元</h2>
+              </div>
+            </el-card>
+          </el-col>
+          <el-col :span="8">
+            <el-card class="box-card">
+              <template #header>
+                <div class="card-header">
+                  <span>{{lastYear+'年'}}税收总额</span>
+                </div>
+              </template>
+              <div class="card-content">
+                <h2>¥ {{ formatNumber(taxAmount) }}</h2>
+              </div>
+            </el-card>
+          </el-col>
+          <el-col :span="8">
+            <el-card class="box-card">
+              <template #header>
+                <div class="card-header">
+                  <span>企业总数</span>
+                </div>
+              </template>
+              <div class="card-content">
+                <h2>{{ formatNumber(totalCompanies)+"家" }}</h2>
+              </div>
+            </el-card>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="20" class="mt-4">
+          <el-col :span="12">
+            <el-card class="box-card">
+              <template #header>
+                <div class="card-header">
+                  <span>企业评级分布</span>
+                </div>
+              </template>
+              <div class="chart-container" ref="pieChartContainer"></div>
+            </el-card>
+          </el-col>
+          <el-col :span="12">
+            <el-card class="box-card">
+              <template #header>
+                <div class="card-header">
+                  <span>企业评级数量</span>
+                </div>
+              </template>
+              <el-descriptions :column="1" border>
+                <el-descriptions-item label="AAA">
+                  {{ companyRatings.AAA || 0 }}
+                </el-descriptions-item>
+                <el-descriptions-item label="AA">
+                  {{ companyRatings.AA || 0 }}
+                </el-descriptions-item>
+                <el-descriptions-item label="A">
+                  {{ companyRatings.A || 0 }}
+                </el-descriptions-item>
+                <el-descriptions-item label="B">
+                  {{ companyRatings.B || 0 }}
+                </el-descriptions-item>
+                <el-descriptions-item label="C">
+                  {{ companyRatings.C || 0 }}
+                </el-descriptions-item>
+                <el-descriptions-item label="D">
+                  {{ companyRatings.D || 0 }}
+                </el-descriptions-item>
+              </el-descriptions>
+            </el-card>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="20" class="mt-4">
+          <el-col :span="24">
+            <el-card class="box-card">
+              <template #header>
+                <div class="card-header">
+                  <span>快速链接</span>
+                </div>
+              </template>
+              <div class="quick-links">
+                <el-link @click="()=>{router.push('/qyxypj/xypjdj')}">
+                  <el-image src="/信用报告.png" fit="cover" class="link-image">
+                    <template #error>
+                      <div class="image-slot">
+                        企业信用评价等级图片
+                      </div>
+                    </template>
+                  </el-image>
+                  <span>企业信用评价等级</span>
+                </el-link>
+                <el-link @click="()=>{router.push('/qyxypj/qypjdf')}">
+                  <el-image src="/得分记录.png" fit="cover" class="link-image">
+                    <template #error>
+                      <div class="image-slot">
+                        企业评价得分图片
+                      </div>
+                    </template>
+                  </el-image>
+                  <span>企业评价得分</span>
+                </el-link>
+                <el-link @click="()=>{router.push('/qyjydtfx/dkfx')}">
+                  <el-image src="/委托贷款放款.png" fit="cover" class="link-image">
+                    <template #error>
+                      <div class="image-slot">
+                        贷款分析图片
+                      </div>
+                    </template>
+                  </el-image>
+                  <span>贷款分析</span>
+                </el-link>
+                <el-link @click="()=>{router.push('/qyjydtfx/ssfx')}">
+                  <el-image src="/总税收.png" fit="cover" class="link-image">
+                    <template #error>
+                      <div class="image-slot">
+                        税收分析图片
+                      </div>
+                    </template>
+                  </el-image>
+                  <span>税收分析</span>
+                </el-link>
+              </div>
+            </el-card>
+          </el-col>
+        </el-row>
+      </el-main>
+    </el-container>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import * as echarts from 'echarts'
+import request from "@/utils/request.js";
+import {useRouter} from "vue-router";
+
+const lastYear = new Date().getFullYear() - 1;
+const currentYear = new Date().getFullYear()
+
+const router = useRouter();
+// 静态数据
+const loanAmount = ref(0)
+const taxAmount = ref(0)
+const companyRatings = ref({
+  AAA: 0,
+  AA: 0,
+  A: 0,
+  B: 0,
+  C: 0,
+  D: 0
+})
+
+const totalCompanies = ref(0)
+
+// 格式化数字
+const formatNumber = (num) => {
+  return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")
+}
+
+// 初始化图表
+let pieChart
+
+onMounted(() => {
+
+})
+
+const initPieChart = () => {
+  const chartDom = document.querySelector('.chart-container')
+  pieChart = echarts.init(chartDom)
+  const option = {
+    tooltip: {
+      trigger: 'item'
+    },
+    legend: {
+      orient: 'horizontal',
+      left: 'center',
+      top: 'bottom'
+    },
+    series: [
+      {
+        name: '企业评级',
+        type: 'pie',
+        radius: '50%',
+        data: Object.entries(companyRatings.value).map(([key, value]) => ({ name: key, value })),
+        emphasis: {
+          itemStyle: {
+            shadowBlur: 10,
+            shadowOffsetX: 0,
+            shadowColor: 'rgba(0, 0, 0, 0.5)'
+          }
+        }
+      }
+    ]
+  }
+  pieChart.setOption(option)
+}
+
+const getDkze =async ()=>{
+  const res = await request.get('/basicData/xcrSummaryLoanDetails/annual-statistics',{
+    params:{
+      year:lastYear
+    }
+  });
+  loanAmount.value = res.data.totalLoanAmount;
+}
+
+const getSsze =async ()=>{
+  const res = await request.get('/basicData/xcrPayTaxes/of-year-list');
+  taxAmount.value = res.data.ofYearDetail.reduce((acc, cur) => acc + cur.lastYearTaxesTotal, 0).toFixed(2);
+}
+
+const getQypf = async ()=>{
+  const res = await request.get('/basicData/xcrEBaseinfo/getCreditScoreList',{
+    params:{
+      pageNum: 1,
+      pageSize: 9999,
+      condition: ['AAA', 'AA', 'A', 'B', 'C', 'D'].join(',')
+    }
+  });
+  totalCompanies.value = res.data.totalSize;
+  // res.data.result是数组将其中的grade属性=AAA AA A B C D 的企业拿出来赋值出去
+  companyRatings.value = res.data.result.reduce((acc, cur) => {
+    acc[cur.grade] = (acc[cur.grade] || 0) + 1;
+    return acc;
+  }, {});
+  initPieChart()
+}
+
+const getData = ()=>{
+  getDkze()
+  getSsze()
+  getQypf()
+}
+onMounted(()=>{
+  getData();
+})
+</script>
+
+<style scoped>
+.dashboard {
+  font-family: 'Arial', sans-serif;
+  background-color: #f0f2f5;
+  min-height: 100vh;
+}
+
+.el-header {
+  background-color: #1890ff;
+  color: white;
+  line-height: 60px;
+  text-align: center;
+}
+
+.el-main {
+  padding: 20px;
+}
+
+.box-card {
+  margin-bottom: 20px;
+  transition: all 0.3s;
+  height: 100%;
+}
+
+.box-card:hover {
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  transform: translateY(-5px);
+}
+
+.card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.card-content {
+  text-align: center;
+  font-size: 24px;
+  color: #1890ff;
+}
+
+.chart-container {
+  height: 400px;
+}
+
+h1 {
+  margin: 0;
+  font-size: 24px;
+}
+
+h2 {
+  margin: 0;
+  font-size: 36px;
+  color: #1890ff;
+}
+
+.quick-links {
+  display: flex;
+  justify-content: space-around;
+  flex-wrap: wrap;
+  gap: 20px;
+}
+
+.el-link {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-decoration: none;
+  color: #1890ff;
+  transition: all 0.3s;
+}
+
+.el-link:hover {
+  transform: translateY(-5px);
+}
+
+.link-image {
+  width: 100px;
+  height: 100px;
+  border-radius: 10px;
+  margin-bottom: 10px;
+  overflow: hidden;
+}
+
+.image-slot {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  background: #f5f7fa;
+  color: #909399;
+  font-size: 14px;
+}
+</style>

src/router/index.js

@@ -64,7 +64,7 @@ export const constantRoutes = [
     children: [
       {
         path: '/index',
-        component: () => import('@/views/index'),
+        component: () => import('@/views/index.vue'),
         name: 'Index',
         meta: { title: '首页', icon: 'dashboard', affix: true }
       }

src/views/index.vue

@@ -1,346 +1,255 @@
 <template>
-  <div class="dashboard">
-    <el-container>
-      <el-main>
-        <el-row :gutter="20">
-          <el-col :span="8">
-            <el-card class="box-card">
-              <template #header>
-                <div class="card-header">
-                  <span>{{lastYear+'年'}}贷款总额</span>
-                </div>
-              </template>
-              <div class="card-content">
-                <h2>¥ {{ formatNumber(loanAmount) }}万元</h2>
+  <div class="homeContainer">
+    <div class="title">守信企业</div>
+    <div class="carouselContainer">
+      <div>
+        <el-carousel :interval="5000" arrow="always" :height="'500px'">
+          <el-carousel-item>
+            <img alt='图片' src="@/assets/images/2222.jpg" style="width: 50vw;"/>
+          </el-carousel-item>
+          <el-carousel-item>
+            <img alt='图片' src="@/assets/images/1111.jpg" style="width: 50vw;"/>
+          </el-carousel-item>
+          <el-carousel-item>
+            <img alt='图片' src="@/assets/images/3333.jpg" style="width: 50vw;"/>
+          </el-carousel-item>
+        </el-carousel>
+      </div>
+    </div>
+    <div class="listContainer" ref="listContainer" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave"
+         @wheel.prevent="handleWheel">
+      <div class="listContent" ref="listContent" :style="{ transform: 'translateY(' + moveValue + 'px)' }">
+        <div class="lsitItem" v-for="(item, index) in homeList" :key="index" style="position: relative"
+             @click="toDetail(item)">
+          <span style="position: absolute;left: 10px;">{{ index + 1 }}<span
+              style="font-weight: bold">.</span></span>{{ item.enterpriseName }}
+        </div>
+      </div>
+    </div>
+    <div class="footerContianer">
+      <div class="block text-center" m="t-4">
+        <el-carousel trigger="click" height="230px">
+          <el-carousel-item>
+            <div style="display: flex;justify-content: space-around">
+              <div class="imgContainer" @click="toLink(1)">
+                <img alt='图片' src="@/assets/images/666.jpg"/>
+                <div class="textContainer">企业评价等级</div>
               </div>
-            </el-card>
-          </el-col>
-          <el-col :span="8">
-            <el-card class="box-card">
-              <template #header>
-                <div class="card-header">
-                  <span>{{lastYear+'年'}}税收总额</span>
-                </div>
-              </template>
-              <div class="card-content">
-                <h2>¥ {{ formatNumber(taxAmount) }}</h2>
+              <div class="imgContainer" @click="toLink(2)">
+                <img alt='图片' src="@/assets/images/888.jpg"/>
+                <div class="textContainer">企业税收分析</div>
               </div>
-            </el-card>
-          </el-col>
-          <el-col :span="8">
-            <el-card class="box-card">
-              <template #header>
-                <div class="card-header">
-                  <span>企业总数</span>
-                </div>
-              </template>
-              <div class="card-content">
-                <h2>{{ formatNumber(totalCompanies)+"家" }}</h2>
+              <div class="imgContainer" @click="toLink(3)">
+                <img alt='图片' src="@/assets/images/999.jpg"/>
+                <div class="textContainer">企业贷款分析</div>
               </div>
-            </el-card>
-          </el-col>
-        </el-row>
+              <div class="imgContainer" @click="toLink(4)">
+                <img alt='图片' src="@/assets/images/777.jpg"/>
+                <div class="textContainer">信用修复服务</div>
+              </div>
+              <div class="imgContainer" @click="toLink(5)">
+                <img alt='图片' src="@/assets/images/000.jpg"/>
+                <div class="textContainer">可视化入口</div>
+              </div>
+            </div>
+          </el-carousel-item>
+        </el-carousel>
+      </div>
+    </div>
 
-        <el-row :gutter="20" class="mt-4">
-          <el-col :span="12">
-            <el-card class="box-card">
-              <template #header>
-                <div class="card-header">
-                  <span>企业评级分布</span>
-                </div>
-              </template>
-              <div class="chart-container" ref="pieChartContainer"></div>
-            </el-card>
-          </el-col>
-          <el-col :span="12">
-            <el-card class="box-card">
-              <template #header>
-                <div class="card-header">
-                  <span>企业评级数量</span>
-                </div>
-              </template>
-              <el-descriptions :column="1" border>
-                <el-descriptions-item label="AAA">
-                  {{ companyRatings.AAA || 0 }}
-                </el-descriptions-item>
-                <el-descriptions-item label="AA">
-                  {{ companyRatings.AA || 0 }}
-                </el-descriptions-item>
-                <el-descriptions-item label="A">
-                  {{ companyRatings.A || 0 }}
-                </el-descriptions-item>
-                <el-descriptions-item label="B">
-                  {{ companyRatings.B || 0 }}
-                </el-descriptions-item>
-                <el-descriptions-item label="C">
-                  {{ companyRatings.C || 0 }}
-                </el-descriptions-item>
-                <el-descriptions-item label="D">
-                  {{ companyRatings.D || 0 }}
-                </el-descriptions-item>
-              </el-descriptions>
-            </el-card>
-          </el-col>
-        </el-row>
 
-        <el-row :gutter="20" class="mt-4">
-          <el-col :span="24">
-            <el-card class="box-card">
-              <template #header>
-                <div class="card-header">
-                  <span>快速链接</span>
-                </div>
-              </template>
-              <div class="quick-links">
-                <el-link @click="()=>{router.push('/qyxypj/xypjdj')}">
-                  <el-image src="/信用报告.png" fit="cover" class="link-image">
-                    <template #error>
-                      <div class="image-slot">
-                        企业信用评价等级图片
-                      </div>
-                    </template>
-                  </el-image>
-                  <span>企业信用评价等级</span>
-                </el-link>
-                <el-link @click="()=>{router.push('/qyxypj/qypjdf')}">
-                  <el-image src="/得分记录.png" fit="cover" class="link-image">
-                    <template #error>
-                      <div class="image-slot">
-                        企业评价得分图片
-                      </div>
-                    </template>
-                  </el-image>
-                  <span>企业评价得分</span>
-                </el-link>
-                <el-link @click="()=>{router.push('/qyjydtfx/dkfx')}">
-                  <el-image src="/委托贷款放款.png" fit="cover" class="link-image">
-                    <template #error>
-                      <div class="image-slot">
-                        贷款分析图片
-                      </div>
-                    </template>
-                  </el-image>
-                  <span>贷款分析</span>
-                </el-link>
-                <el-link @click="()=>{router.push('/qyjydtfx/ssfx')}">
-                  <el-image src="/总税收.png" fit="cover" class="link-image">
-                    <template #error>
-                      <div class="image-slot">
-                        税收分析图片
-                      </div>
-                    </template>
-                  </el-image>
-                  <span>税收分析</span>
-                </el-link>
-              </div>
-            </el-card>
-          </el-col>
-        </el-row>
-      </el-main>
-    </el-container>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
-import * as echarts from 'echarts'
-import request from "@/utils/request.js";
-import {useRouter} from "vue-router";
-
-const lastYear = new Date().getFullYear() - 1;
-const currentYear = new Date().getFullYear()
+// import Cookies from 'js-cookie'
 
-const router = useRouter();
-// 静态数据
-const loanAmount = ref(0)
-const taxAmount = ref(0)
-const companyRatings = ref({
-  AAA: 0,
-  AA: 0,
-  A: 0,
-  B: 0,
-  C: 0,
-  D: 0
-})
-
-const totalCompanies = ref(0)
-
-// 格式化数字
-const formatNumber = (num) => {
-  return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")
-}
+// const imgUrl = new URL('../../assets/logo/logo.png', import.meta.url).href
 
-// 初始化图表
-let pieChart
-
-onMounted(() => {
-
-})
+import {nextTick, onMounted, onUnmounted, watch} from "vue";
+import request from "@/utils/request.js";
 
-const initPieChart = () => {
-  const chartDom = document.querySelector('.chart-container')
-  pieChart = echarts.init(chartDom)
-  const option = {
-    tooltip: {
-      trigger: 'item'
-    },
-    legend: {
-      orient: 'horizontal',
-      left: 'center',
-      top: 'bottom'
-    },
-    series: [
-      {
-        name: '企业评级',
-        type: 'pie',
-        radius: '50%',
-        data: Object.entries(companyRatings.value).map(([key, value]) => ({ name: key, value })),
-        emphasis: {
-          itemStyle: {
-            shadowBlur: 10,
-            shadowOffsetX: 0,
-            shadowColor: 'rgba(0, 0, 0, 0.5)'
-          }
-        }
-      }
-    ]
+const router = useRouter()
+const username = localStorage.getItem('username')
+
+const toDetail = (item) => {
+  console.log(item);
+  const {uniCode, enterpriseName} = item
+  router.push({
+    path: '/qyxypj/qyxxlb',
+    query: {
+      uniCode,
+      companyName:enterpriseName
+    }
+  })
+}
+const handleWheel = (e) => {
+  if (e.deltaY > 0) {
+    if (moveValue.value <= -limitRange.value) return;
+    moveValue.value -= 20;
+  } else {
+    if (moveValue.value >= 0) return;
+    moveValue.value += 20;
   }
-  pieChart.setOption(option)
 }
-
-const getDkze =async ()=>{
-  const res = await request.get('/basicData/xcrSummaryLoanDetails/annual-statistics',{
-    params:{
-      year:lastYear
-    }
-  });
-  loanAmount.value = res.data.totalLoanAmount;
+const handleMouseEnter = () => {
+  clearInterval(interval)
+  interval = null;
+}
+const handleMouseLeave = () => {
+  interval = setInterval(moveList, 16.6);
+}
+const toLink = (index) => {
+  switch (index) {
+    case 1:
+      router.push('/qyxypj/xypjdj')
+      break;
+    case 2:
+      router.push('/qyjydtfx/ssfx')
+      break;
+    case 3:
+      router.push('/qyjydtfx/dkfx')
+      break;
+    case 4:
+      window.open('https://www.creditchina.gov.cn/xyxf/lczy/')
+      break;
+    case 5:
+      const c = router.resolve({
+        path: "/visualization",
+      });
+      window.open(c.href, "_blank");
+  }
 }
-
-const getSsze =async ()=>{
-  const res = await request.get('/basicData/xcrPayTaxes/of-year-list');
-  taxAmount.value = res.data.ofYearDetail.reduce((acc, cur) => acc + cur.lastYearTaxesTotal, 0).toFixed(2);
+const moveList = () => {
+  // console.log(listContent.value.offsetHeight);
+  // console.log(listContainer.value.offsetHeight);
+  // console.log(limitRange.value);
+  if (moveValue.value <= -limitRange.value) {
+    moveValue.value = 0;
+  }
+  moveValue.value = moveValue.value - 0.5;
 }
+const listContent = ref(null);
+const listContainer = ref(null);
+const limitRange = ref(0);
+const moveValue = ref(0);
+const homeList = ref([]);
 
-const getQypf = async ()=>{
-  const res = await request.get('/basicData/xcrEBaseinfo/getCreditScoreList',{
+onMounted(async () => {
+  const res = await request.get("/basicData/xcrEBaseinfo/getCreditScoreList",{
     params:{
-      pageNum: 1,
-      pageSize: 9999,
-      condition: ['AAA', 'AA', 'A', 'B', 'C', 'D'].join(',')
+      pageNum:1,
+      pageSize: 200,
+      condition:"AAA,AA,A"
     }
   });
-  totalCompanies.value = res.data.totalSize;
- // res.data.result是数组将其中的grade属性=AAA AA A B C D 的企业拿出来赋值出去
-  companyRatings.value = res.data.result.reduce((acc, cur) => {
-    acc[cur.grade] = (acc[cur.grade] || 0) + 1;
-    return acc;
-  }, {});
-  initPieChart()
-}
-
-const getData = ()=>{
-  getDkze()
-  getSsze()
-  getQypf()
-}
-onMounted(()=>{
-  getData();
+  // console.log(res);
+  if (res.code === 200) {
+    homeList.value = res.data.result;
+    nextTick(() => {
+      limitRange.value = listContent.value.offsetHeight - listContainer.value.offsetHeight;
+    })
+  }
+})
+let interval = setInterval(moveList, 16.6);
+onUnmounted(() => {
+  clearInterval(interval);
 })
-</script>
-
-<style scoped>
-.dashboard {
-  font-family: 'Arial', sans-serif;
-  background-color: #f0f2f5;
-  min-height: 100vh;
-}
-
-.el-header {
-  background-color: #1890ff;
-  color: white;
-  line-height: 60px;
-  text-align: center;
-}
-
-.el-main {
-  padding: 20px;
-}
-
-.box-card {
-  margin-bottom: 20px;
-  transition: all 0.3s;
-  height: 100%;
-}
 
-.box-card:hover {
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-  transform: translateY(-5px);
-}
+</script>
 
-.card-header {
+<style scoped lang="scss">
+.user__info {
   display: flex;
-  justify-content: space-between;
   align-items: center;
-}
-
-.card-content {
-  text-align: center;
-  font-size: 24px;
-  color: #1890ff;
-}
+  padding: 20px;
 
-.chart-container {
-  height: 400px;
-}
+  .user__info--right {
+    margin-left: 20px;
 
-h1 {
-  margin: 0;
-  font-size: 24px;
-}
+    span {
+      font-size: 26px;
+    }
 
-h2 {
-  margin: 0;
-  font-size: 36px;
-  color: #1890ff;
+    div {
+      font-size: 14px;
+    }
+  }
 }
 
-.quick-links {
+.homeContainer {
+  margin-top: 30px;
   display: flex;
-  justify-content: space-around;
   flex-wrap: wrap;
-  gap: 20px;
-}
+  position: relative;
+
+  .title {
+    position: absolute;
+    z-index: 1;
+    left: 51.5vw;
+    top: 0;
+    background-color: #EEF2FBFF;
+    width: 28vw;
+    height: 4vh;
+    line-height: 4vh;
+    font-size: 26px;
+    border-radius: 10px;
+    text-align: center;
+    box-shadow: #EEF2FBFF 0 0 5px;
+  }
 
-.el-link {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  text-decoration: none;
-  color: #1890ff;
-  transition: all 0.3s;
-}
+  //background-color: #EEF2FBFF;
+  .carouselContainer {
+    width: 50vw;
+  }
 
-.el-link:hover {
-  transform: translateY(-5px);
-}
+  .listContainer {
+    margin-top: 50px;
+    height: 450px;
+    width: 30vw;
+    overflow: hidden;
+
+    .listContent {
+
+      //height: 100px;
+      .lsitItem {
+        width: 95%;
+        height: 40px;
+        margin-bottom: 10px;
+        margin-left: 30px;
+        line-height: 40px;
+        text-align: center;
+        //border: 1px solid #8492a6;
+        box-shadow: #EEF2FBFF 0 0 5px;
+        border-radius: 10px;
+        background-color: #EEF2FBFF;
+        cursor: pointer;
+      }
+    }
+  }
 
-.link-image {
-  width: 100px;
-  height: 100px;
-  border-radius: 10px;
-  margin-bottom: 10px;
-  overflow: hidden;
+  .footerContianer {
+    margin-top: 70px;
+    width: 80vw;
+  }
 }
 
-.image-slot {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  background: #f5f7fa;
-  color: #909399;
-  font-size: 14px;
-}
-</style>
+.imgContainer {
+  position: relative;
+  cursor: pointer;
+  width: 23%;
+
+  img {
+    width: 100%;
+  }
+
+  .textContainer {
+    position: absolute;
+    bottom: 10px;
+    width: 100%;
+    height: 30px;
+    line-height: 30px;
+    background-color: white;
+    opacity: 0.55;
+  }
+}</style>

src/views/qyjydtfx/dkfx/index.vue

@@ -1,6 +1,20 @@
 <template>
   <div class="container mx-auto p-4">
-    <h1 class="text-2xl font-bold mb-4 text-center text-gray-800">贷款数据可视化</h1>
+    <el-row>
+      <el-col :span="4" :offset="10">
+        <h1 class="text-2xl font-bold mb-4 text-center text-gray-800">贷款数据可视化</h1>
+      </el-col>
+      <el-col :span="8" :offset="2">
+        <el-card class="box-card w-500px">
+          <template #header>
+            <div class="card-header">
+              <span>贷款总额 (万元)</span>
+            </div>
+          </template>
+          <div class="text-2xl font-bold">{{ totalLoanAmount }}</div>
+        </el-card>
+      </el-col>
+    </el-row>
 
     <el-form :inline="true" @submit.prevent="fetchData" class="mb-4">
       <el-form-item label="年份" required>
@@ -25,24 +39,19 @@
         </template>
         <div class="text-2xl font-bold">{{ companyNum }}</div>
       </el-card>
-      <el-card class="box-card">
-        <template #header>
-          <div class="card-header">
-            <span>贷款总额 (万元)</span>
-          </div>
-        </template>
-        <div class="text-2xl font-bold">{{ totalLoanAmount }}</div>
-      </el-card>
+
     </div>
 
     <!-- Loan Amount and Repaid Principal Chart -->
     <div ref="chartRef" style="width: 100%; height: 400px;" class="mb-4"></div>
 
-    <!-- Total Loan Amount Distribution Chart -->
-    <div ref="pieChartRef" style="width: 100%; height: 400px;" class="mb-4"></div>
+    <div class="flex">
+      <!-- Total Loan Amount Distribution Chart -->
+      <div ref="pieChartRef" style="width: 100%; height: 400px;" class="mb-4"></div>
 
-    <!-- Bank Loan Percentage Chart -->
-    <div ref="bankLoanChartRef" style="width: 100%; height: 400px;" class="mb-4"></div>
+      <!-- Bank Loan Percentage Chart -->
+      <div ref="bankLoanChartRef" style="width: 100%; height: 400px;" class="mb-4"></div>
+    </div>
 
     <el-table :data="loanData" style="width: 100%" stripe border class="mb-4">
       <el-table-column prop="disbursementDate" label="放款日期" width="120"></el-table-column>
@@ -126,7 +135,7 @@ const updateChart = () => {
       type: 'category',
       data: loanData.value.map(item => item.enterpriseName),
       axisLabel: {
-        rotate: 45,
+        rotate: 20,
         interval: 0
       }
     },
@@ -175,7 +184,7 @@ const updatePieChart = () => {
       {
         name: '贷款总额',
         type: 'pie',
-        radius: ['50%', '70%'],
+        radius: '70%',
         avoidLabelOverlap: false,
         label: {
           show: false,
@@ -220,7 +229,7 @@ const updateBankLoanChart = () => {
       {
         name: '银行贷款百分比',
         type: 'pie',
-        radius: '50%',
+        radius: '70%',
         data: bankLoanPercentageData.value.map(item => ({
           value: item.percentage,
           name: item.bankName

src/views/qyjydtfx/ssfx/index.vue

@@ -115,9 +115,6 @@ const handleTabChange = (tab) => {
 <template>
   <div>
     <el-tabs @tab-change="handleTabChange">
-      <el-tab-pane label="年度税收对比">
-        <div id="yearChart" style="width: 90vw; height: 90vh;"></div>
-      </el-tab-pane>
       <el-tab-pane label="季度税收对比">
         <el-select v-model="selectedQuarter" placeholder="请选择季度">
           <el-option label="第一季度" value="1"></el-option>
@@ -127,6 +124,9 @@ const handleTabChange = (tab) => {
         </el-select>
         <div id="quarterChart" style="width: 90vw; height: 90vh;"></div>
       </el-tab-pane>
+      <el-tab-pane label="年度税收对比">
+        <div id="yearChart" style="width: 90vw; height: 90vh;"></div>
+      </el-tab-pane>
     </el-tabs>
   </div>
 </template>

src/views/qyxypj/qypjdf/index.vue

@@ -2,20 +2,24 @@
 import { ref, onMounted } from 'vue';
 import request from "@/utils/request.js";
 import { ElMessage, ElTable, ElTableColumn, ElPagination } from "element-plus";
-import {useRouter} from "vue-router";
+import { useRouter } from "vue-router";
 
 const tableData = ref([]);
 const total = ref(0);
 const currentPage = ref(1);
 const pageSize = ref(10);
+const uniCode = ref('');
+const enterpriseName = ref('');
 const router = useRouter();
 
-const getList = async (page = 1, size = 10) => {
+const getList = async () => {
   try {
     const res = await request('basicData/xcrEBaseinfo/getCreditScoreListDetails', {
       params: {
-        pageNum: page,
-        pageSize: size,
+        pageNum: currentPage.value,
+        pageSize: pageSize.value,
+        uniCode: uniCode.value,
+        enterpriseName: enterpriseName.value
       }
     });
 
@@ -34,22 +38,29 @@ const getList = async (page = 1, size = 10) => {
 
 const handleSizeChange = (val) => {
   pageSize.value = val;
-  getList(currentPage.value, val);
+  getList();
 };
 
 const handleCurrentChange = (val) => {
   currentPage.value = val;
-  getList(val, pageSize.value);
+  getList();
 };
 
-const checkDetail = (row)=>{
+const checkDetail = (row) => {
   router.push({
-    path:'/qyxypj/zxxddf',
-    query:{
-      row:JSON.stringify(row)
+    path: '/qyxypj/zxxddf',
+    query: {
+      row: JSON.stringify(row)
     }
-  })
-}
+  });
+};
+
+const resetForm = () => {
+  uniCode.value = '';
+  enterpriseName.value = '';
+  currentPage.value = 1;
+  getList();
+};
 
 onMounted(() => {
   getList();
@@ -58,6 +69,29 @@ onMounted(() => {
 
 <template>
   <div class="p-4">
+    <el-form :inline="true" @submit.prevent="getList" class="mb-4">
+      <el-row gutter="20">
+        <el-col :span="6">
+          <el-form-item label="统一社会信用代码" class="w-full">
+            <el-input v-model="uniCode" placeholder="统一社会信用代码" clearable></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="企业名称" class="w-full">
+            <el-input v-model="enterpriseName" placeholder="企业名称" clearable></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item>
+            <el-button type="primary" @click="getList">搜索</el-button>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="default" @click="resetForm">重置</el-button>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+
     <el-table :data="tableData" border stripe hover class="w-full">
       <el-table-column prop="enterpriseName" label="企业名称">
         <template #default="scope">
@@ -71,9 +105,21 @@ onMounted(() => {
           {{ scope.row.total.toFixed(2) }}
         </template>
       </el-table-column>
-      <el-table-column prop="administrativePenaltyScore" label="行政处罚分数" width="150" />
-      <el-table-column prop="enterpriseCompetitivenessScore" label="企业竞争力分数" />
-      <el-table-column prop="referenceCreditRatingScore" label="参考信用评级分数" />
+      <el-table-column prop="administrativePenaltyScore" label="行政处罚分数" width="150">
+        <template #default="scope">
+          {{ scope.row.administrativePenaltyScore.toFixed(1) }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="enterpriseCompetitivenessScore" label="企业竞争力分数" >
+        <template #default="scope">
+          {{ scope.row.enterpriseCompetitivenessScore.toFixed(1) }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="referenceCreditRatingScore" label="参考信用评级分数">
+        <template #default="scope">
+          {{ scope.row.referenceCreditRatingScore.toFixed(1) }}
+        </template>
+      </el-table-column>
     </el-table>
 
     <div class="flex justify-center mt-4">

src/views/xyjsxx/zwxxfb/index.vue

@@ -364,7 +364,7 @@ onMounted(() => {
         :before-close="() => previewDialogVisible = false"
         destroy-on-close
     >
-      <pre v-html="previewContent"></pre>
+      <div v-html="previewContent"></div>
     </el-dialog>
   </div>
 </template>