修改

src/views/home/components/count.vue

@@ -7,13 +7,23 @@
       <div class="text-center">
         <div class="text-2xl font-medium">门店总数</div>
         <div class="my-5">
-          <CountTo class="text-2xl" :endVal="deta?.stores_count || 0" />
+          <!-- <CountTo class="text-2xl" :endVal="deta?.stores_count || 0" /> -->
+          <div class="flex justify-center space-x-1">
+            <div class="w-8 h-15 text-4xl font-600 bg-[#0E7CE2] text-white flex justify-center items-center" v-for="(item, i) in arrNum(deta?.stores_count)" :key="i">
+              {{ item }}
+            </div>
+          </div>
         </div>
       </div>
       <div class="text-center">
         <div class="text-2xl font-medium">员工总数</div>
         <div class="my-5">
-          <CountTo class="text-2xl" :endVal="deta?.employees_count || 0" />
+          <!-- <CountTo class="text-2xl" :endVal="deta?.employees_count || 0" /> -->
+          <div class="flex justify-center space-x-1">
+            <div class="w-8 h-15 text-4xl font-600 bg-[#0E7CE2] text-white flex justify-center items-center" v-for="(item, i) in arrNum(deta?.employees_count)" :key="i">
+              {{ item }}
+            </div>
+          </div>
         </div>
       </div>
     </div>
@@ -22,13 +32,18 @@
 <script setup>
 import CountTo from '@/components/CountTo/index.vue'
 import http from '@/utils/request'
-import { onMounted, ref } from 'vue'
+import { onMounted, ref, computed } from 'vue'
+
 const deta = ref({})
 
 onMounted(() => {
   getData()
 })
 
+const arrNum = (e) => {
+  return e?.toString()?.split('') ?? []
+}
+
 const getData = async () => {
   const resData = await http.get('/admin-api/api/cockpit/basic')
   deta.value = resData

src/views/home/components/lottery-trends.vue

@@ -35,7 +35,7 @@ const dayList = [
   },
   {
     value: '180days',
-    label: '进半年',
+    label: '近半年',
   },
   {
     value: '365days',

src/views/home/components/map.vue

@@ -29,7 +29,8 @@ const getData = async () => {
 const convertData = (data) => {
   var geoCoordMap = []
   chinaMap.features.forEach((item) => {
-    geoCoordMap[item.properties.name] = item.properties.center
+    geoCoordMap[item.properties.name] = item.properties.centroid ?? item.properties.center
+    if(item.properties.name=='河北省' ) console.log(item.properties.centroid)
   })
   var res = []
   for (var i = 0; i < data.length; i++) {
@@ -72,6 +73,20 @@ const chatInit = () => {
           show: true,
           color: 'rgb(249, 249, 249)', //省份标签字体颜色
         },
+        regions: [
+          {
+            name: "南海诸岛",
+            itemStyle: {
+              // 隐藏地图
+              normal: {
+                opacity: 0, // 为 0 时不绘制该图形
+              }
+            },
+            label: {
+              show: false // 隐藏文字
+            }
+          }
+        ],
         itemStyle: {
           areaColor: '#24CFF4',
           borderColor: '#53D9FF',

src/views/home/components/rank.vue

@@ -39,7 +39,7 @@ const dayList = [
   },
   {
     value: '180days',
-    label: '进半年',
+    label: '近半年',
   },
   {
     value: '365days',
@@ -68,7 +68,7 @@ const getData = async () => {
   const arr = resData.map((e, i) => {
     return [i + 1, e.store.title, e.sales]
   })
-  dataList.value = arr.filter((e) => e[2] > 0)
+  dataList.value = arr.splice(0, 15)
   chatInit()
 }
 
@@ -76,13 +76,10 @@ const chatInit = () => {
   __SetOption(dataList.value)
 }
 
-let barWidth = 15
+let barWidth = 20
 let nameFontColor = '#000'
 let nameFontSize = 12
 let namePosition = [0, -15]
-let valueFontColor = '#FFFFFF'
-let valueFontSize = 12
-let indexNum = 0
 
 function __getColorValue(name, val, index) {
   return {
@@ -109,9 +106,9 @@ function __SetOption(data) {
 
   let option = {
     grid: {
-      top: 0,
+      top: '10px',
       left: '20px',
-      right: '3%',
+      right: '30px',
       bottom: 0,
     },
     yAxis: [
@@ -169,6 +166,16 @@ function __SetOption(data) {
           },
         },
       },
+      {
+        name: '排行数字',
+        type: 'bar',
+        barWidth: barWidth,
+        data: values,
+        barGap: '-100%',
+        animationDuration: 1500,
+        zlevel: 2,
+        label:{normal:{show:true, position:"right"}},
+      },
     ],
   }
 

src/views/home/components/sales-trend.vue

@@ -40,7 +40,7 @@ const dayList = [
   },
   {
     value: '180days',
-    label: '进半年',
+    label: '近半年',
   },
   {
     value: '365days',
@@ -97,6 +97,7 @@ const chatInit = () => {
         color: '#F1F1F3',
       },
       left: '6%',
+      right: '20px',
     },
     tooltip: {
       trigger: 'axis',
@@ -128,7 +129,18 @@ const chatInit = () => {
       {
         type: 'category',
         boundaryGap: false,
+        axisLabel:{
+          // interval: 3,
+          // formatter: function (value,i) {
+          //   const xAxisDataLeg= xAxisData.length
+          //   //只显示3个点的值，最后一个不显示，显示倒数第2个
+          //   if(i===xAxisDataLeg-2){
+          //     return value
+          //   }
+          // }
+        },
         axisLine: {
+          
           lineStyle: {
             color: '#999',
           },

src/views/home/index.vue

@@ -6,7 +6,7 @@
         <div class="h-150 box-shadow">
           <Map />
         </div>
-        <div class="h-75 box-shadow">
+        <div class="h-82 box-shadow">
           <LotteryTrends />
         </div>
       </div>

vite.config.js

@@ -3,8 +3,10 @@ import vue from '@vitejs/plugin-vue'
 import UnoCSS from 'unocss/vite'
 import { fileURLToPath, URL } from 'node:url'
 // https://vitejs.dev/config/
-export default defineConfig({
-  base: '/cockpit/',
+export default defineConfig(({ mode }) => {
+  const base = mode === 'production' ? '/cockpit/' : '/'
+  return {
+    base: base,
     plugins: [vue(), UnoCSS()],
     server: {
       host: '0.0.0.0',
@@ -22,4 +24,5 @@ export default defineConfig({
         '@': fileURLToPath(new URL('./src', import.meta.url))
       },
     },
+  }
 })