diff --git a/src/views/dataManagement/components/data/device.vue b/src/views/dataManagement/components/data/device.vue
index 9897df1..23efd69 100644
--- a/src/views/dataManagement/components/data/device.vue
+++ b/src/views/dataManagement/components/data/device.vue
@@ -5,15 +5,7 @@
 import { colors } from '../environment/colors'
 import { device } from './img'
 import { getRangeAllTime } from '@/utils/date'
-import {
-  getBaseInfo,
-  getDeptExpire,
-  getDeviceMaintain,
-  getDeviceStatus,
-  getDeviceType,
-  getStandardDeviceType,
-  getTraceAnalyse,
-} from '@/api/dataManagement/data/device'
+import { getBaseInfo, getDeptExpire, getDeviceMaintain, getDeviceStatus, getDeviceType, getStandardDeviceType, getTraceAnalyse, } from '@/api/dataManagement/data/device'
 const props = defineProps({
   lab: {
     type: String,
@@ -30,15 +22,12 @@
 const year = ref('') // 年度
 const yearList = ref<string[]>([])
 
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -86,6 +75,8 @@
     data: [],
     smooth: false,
     gradient: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备类型分析',
@@ -95,6 +86,8 @@
     labelPosition: 'outside',
     radius: '70%',
     data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '标准设备种类分析',
@@ -113,11 +106,15 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备状态分析',
     type: 'bar-vertical',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备维护保养情况',
@@ -159,39 +156,43 @@
         width: '95',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备溯源分析',
     type: 'bar-horizontal',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then((res) => {
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 近一年部门设备到期趋势
+  const current1 = showChart.value.filter(item => item.name === '近一年部门设备到期趋势')[0]
+  current1.loading = true
   getDeptExpire(searchQueryResult.value).then((res) => {
-    console.log(res.data, '近一年部门设备到期趋势')
-    const current = showChart.value.filter(
-      item => item.name === '近一年部门设备到期趋势',
-    )[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+    // console.log(res.data, '近一年部门设备到期趋势')
+    current1.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '电学电源组',
@@ -210,15 +211,20 @@
         value: 'glAmount',
       },
     ]
-    current.data = data.map((item: any) => ({
+    current1.data = data.map((item: any) => ({
       name: item.name,
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[item.value])),
     }))
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 设备类型分析
+  const current2 = showChart.value.filter(item => item.name === '设备类型分析')[0]
+  current2.loading = true
   getDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备类型分析')
+    // console.log(res.data, '设备类型分析')
     const data = [
       {
         name: '标准设备',
@@ -236,20 +242,26 @@
         data: '',
       },
     ]
-    const current = showChart.value.filter(
-      item => item.name === '设备类型分析',
-    )[0]
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.loading = false
+    // 判断是否为空
+    if(current2.data.every((item: any) => item.value === '0')) {
+      current2.isEmpty = true
+    }
+    else {
+      current2.isEmpty = false
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 设备状态分析
+  const current3 = showChart.value.filter(item => item.name === '设备状态分析')[0]
+  current3.loading = true
   getDeviceStatus(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备状态分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备状态分析',
-    )[0]
+    // console.log(res.data, '设备状态分析')
     const data = [
       {
         name: '在用',
@@ -280,20 +292,22 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current3.xAxisData = data.map((item: any) => item.name)
+    current3.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 设备溯源分析
+  const current4 = showChart.value.filter(item => item.name === '设备溯源分析')[0]
+  current4.loading = true
   getTraceAnalyse(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备溯源分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备溯源分析',
-    )[0]
+    // console.log(res.data, '设备溯源分析')
     const data = [
       {
         name: '合格',
@@ -314,34 +328,48 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current4.xAxisData = data.map((item: any) => item.name)
+    current4.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current4.loading = false
+    // 判断是否为空
+    if(data.every((item: any) => String(item.data) === '0')) {
+      current4.isEmpty = true
+    }
+    else {
+      current4.isEmpty = false
+    }
+  }).catch(() => {
+    current4.loading = false
   })
   // 标准设备种类分析
+  const current5 = showChart.value.filter(item => item.name === '标准设备种类分析')[0]
+  current5.loading = true
   getStandardDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '标准设备种类分析')
-    const current = showChart.value.filter(
-      item => item.name === '标准设备种类分析',
-    )[0]
-    current.data = []
+    // console.log(res.data, '标准设备种类分析')
+    current5.data = []
     for (const i in res.data) {
-      current.data.push({ name: i, count: res.data[i] })
+      current5.data.push({ name: i, count: res.data[i] })
     }
-    current.data.reverse()
+    current5.data.reverse()
+    current5.loading = false
+  }).catch(() => {
+    current5.loading = false
   })
   // 设备维护保养情况
+  const current6 = showChart.value.filter(item => item.name === '设备维护保养情况')[0]
+  current6.loading = true
   getDeviceMaintain({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then((res) => {
-    console.log(res.data, '设备维护保养情况')
-    const current = showChart.value.filter(
-      item => item.name === '设备维护保养情况',
-    )[0]
-    current.data = []
-    current.data = res.data.rows
+    // console.log(res.data, '设备维护保养情况')
+    current6.data = []
+    current6.data = res.data.rows
+    current6.loading = false
+  }).catch(() => {
+    current6.loading = false
   })
   // loading.value = true
   // // 近一年部门设备到期趋势
@@ -398,19 +426,16 @@
   yearList.value.push(String(currentYear - i))
 }
 
-watch(
-  () => year.value,
-  (newVal) => {
-    if (newVal) {
-      console.log(newVal, '当前年度')
-      searchQueryResult.value.timeStart = `${newVal}-01-01`
-      searchQueryResult.value.timeEnd = `${newVal}-12-31`
-      setTimeout(() => {
-        fetchData()
-      })
-    }
-  },
-)
+watch(() => year.value, (newVal) => {
+  if (newVal) {
+    console.log(newVal, '当前年度')
+    searchQueryResult.value.timeStart = `${newVal}-01-01`
+    searchQueryResult.value.timeEnd = `${newVal}-12-31`
+    setTimeout(() => {
+      fetchData()
+    })
+  }
+})
 onMounted(() => {
   year.value = String(currentYear)
   if (props.lab) {
@@ -427,24 +452,14 @@
     <div class="btns">
       <div />
       <!-- 部门 -->
-      <el-select
-        v-model="year"
-        style="width: 130px;"
-        class="short-input"
-        placeholder="年度"
-      >
-        <el-option
-          v-for="item in yearList"
-          :key="item"
-          :label="item"
-          :value="item"
-        />
+      <el-select v-model="year" style="width: 130px;" class="short-input" placeholder="年度">
+        <el-option v-for="item in yearList" :key="item" :label="item" :value="item" />
       </el-select>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <img :src="item.icon">
@@ -461,156 +476,40 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${'31.5%'}`, }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%;">
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%; display: flex;"
-                >
+                <div class="chart-name" style="width: 100%; height: 10%; display: flex;">
                   {{ element.name }}
-                  <div
-                    v-if="element.name === '人员持证到期趋势'"
-                    style="width: 350px; margin-left: 40px;"
-                  >
-                    <el-date-picker
-                      v-model="datetimerange"
-                      type="daterange"
-                      value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD"
-                      range-separator="至"
-                      start-placeholder="开始时间"
-                      end-placeholder="结束时间"
-                    />
-                  </div>
                 </div>
                 <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-if="element.type === 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <line-chart
-                    v-if="element.type === 'line'"
-                    :colors="colors"
-                    :gradient="element.gradient"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
+                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth"
+                    :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5', }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
+                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :data="element.data"
-                    :smooth="element.smooth"
-                    :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5',
-                    }"
-                  />
-                  <bar-chart-double
-                    v-if="element.type === 'bar-double'"
-                    :legend-data="element.legendData"
-                    :data1="element.data1"
-                    :data2="element.data2"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-vertical
-                    v-if="element.type === 'bar-vertical'"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-horizontal
-                    v-if="element.type === 'bar-horizontal'"
-                    bar-width="10"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-if="element.type === 'rank-table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>

diff --git a/src/views/dataManagement/components/data/device.vue b/src/views/dataManagement/components/data/device.vue
index 9897df1..23efd69 100644
--- a/src/views/dataManagement/components/data/device.vue
+++ b/src/views/dataManagement/components/data/device.vue
@@ -5,15 +5,7 @@
 import { colors } from '../environment/colors'
 import { device } from './img'
 import { getRangeAllTime } from '@/utils/date'
-import {
-  getBaseInfo,
-  getDeptExpire,
-  getDeviceMaintain,
-  getDeviceStatus,
-  getDeviceType,
-  getStandardDeviceType,
-  getTraceAnalyse,
-} from '@/api/dataManagement/data/device'
+import { getBaseInfo, getDeptExpire, getDeviceMaintain, getDeviceStatus, getDeviceType, getStandardDeviceType, getTraceAnalyse, } from '@/api/dataManagement/data/device'
 const props = defineProps({
   lab: {
     type: String,
@@ -30,15 +22,12 @@
 const year = ref('') // 年度
 const yearList = ref<string[]>([])
 
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -86,6 +75,8 @@
     data: [],
     smooth: false,
     gradient: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备类型分析',
@@ -95,6 +86,8 @@
     labelPosition: 'outside',
     radius: '70%',
     data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '标准设备种类分析',
@@ -113,11 +106,15 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备状态分析',
     type: 'bar-vertical',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备维护保养情况',
@@ -159,39 +156,43 @@
         width: '95',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备溯源分析',
     type: 'bar-horizontal',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then((res) => {
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 近一年部门设备到期趋势
+  const current1 = showChart.value.filter(item => item.name === '近一年部门设备到期趋势')[0]
+  current1.loading = true
   getDeptExpire(searchQueryResult.value).then((res) => {
-    console.log(res.data, '近一年部门设备到期趋势')
-    const current = showChart.value.filter(
-      item => item.name === '近一年部门设备到期趋势',
-    )[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+    // console.log(res.data, '近一年部门设备到期趋势')
+    current1.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '电学电源组',
@@ -210,15 +211,20 @@
         value: 'glAmount',
       },
     ]
-    current.data = data.map((item: any) => ({
+    current1.data = data.map((item: any) => ({
       name: item.name,
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[item.value])),
     }))
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 设备类型分析
+  const current2 = showChart.value.filter(item => item.name === '设备类型分析')[0]
+  current2.loading = true
   getDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备类型分析')
+    // console.log(res.data, '设备类型分析')
     const data = [
       {
         name: '标准设备',
@@ -236,20 +242,26 @@
         data: '',
       },
     ]
-    const current = showChart.value.filter(
-      item => item.name === '设备类型分析',
-    )[0]
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.loading = false
+    // 判断是否为空
+    if(current2.data.every((item: any) => item.value === '0')) {
+      current2.isEmpty = true
+    }
+    else {
+      current2.isEmpty = false
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 设备状态分析
+  const current3 = showChart.value.filter(item => item.name === '设备状态分析')[0]
+  current3.loading = true
   getDeviceStatus(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备状态分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备状态分析',
-    )[0]
+    // console.log(res.data, '设备状态分析')
     const data = [
       {
         name: '在用',
@@ -280,20 +292,22 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current3.xAxisData = data.map((item: any) => item.name)
+    current3.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 设备溯源分析
+  const current4 = showChart.value.filter(item => item.name === '设备溯源分析')[0]
+  current4.loading = true
   getTraceAnalyse(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备溯源分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备溯源分析',
-    )[0]
+    // console.log(res.data, '设备溯源分析')
     const data = [
       {
         name: '合格',
@@ -314,34 +328,48 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current4.xAxisData = data.map((item: any) => item.name)
+    current4.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current4.loading = false
+    // 判断是否为空
+    if(data.every((item: any) => String(item.data) === '0')) {
+      current4.isEmpty = true
+    }
+    else {
+      current4.isEmpty = false
+    }
+  }).catch(() => {
+    current4.loading = false
   })
   // 标准设备种类分析
+  const current5 = showChart.value.filter(item => item.name === '标准设备种类分析')[0]
+  current5.loading = true
   getStandardDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '标准设备种类分析')
-    const current = showChart.value.filter(
-      item => item.name === '标准设备种类分析',
-    )[0]
-    current.data = []
+    // console.log(res.data, '标准设备种类分析')
+    current5.data = []
     for (const i in res.data) {
-      current.data.push({ name: i, count: res.data[i] })
+      current5.data.push({ name: i, count: res.data[i] })
     }
-    current.data.reverse()
+    current5.data.reverse()
+    current5.loading = false
+  }).catch(() => {
+    current5.loading = false
   })
   // 设备维护保养情况
+  const current6 = showChart.value.filter(item => item.name === '设备维护保养情况')[0]
+  current6.loading = true
   getDeviceMaintain({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then((res) => {
-    console.log(res.data, '设备维护保养情况')
-    const current = showChart.value.filter(
-      item => item.name === '设备维护保养情况',
-    )[0]
-    current.data = []
-    current.data = res.data.rows
+    // console.log(res.data, '设备维护保养情况')
+    current6.data = []
+    current6.data = res.data.rows
+    current6.loading = false
+  }).catch(() => {
+    current6.loading = false
   })
   // loading.value = true
   // // 近一年部门设备到期趋势
@@ -398,19 +426,16 @@
   yearList.value.push(String(currentYear - i))
 }
 
-watch(
-  () => year.value,
-  (newVal) => {
-    if (newVal) {
-      console.log(newVal, '当前年度')
-      searchQueryResult.value.timeStart = `${newVal}-01-01`
-      searchQueryResult.value.timeEnd = `${newVal}-12-31`
-      setTimeout(() => {
-        fetchData()
-      })
-    }
-  },
-)
+watch(() => year.value, (newVal) => {
+  if (newVal) {
+    console.log(newVal, '当前年度')
+    searchQueryResult.value.timeStart = `${newVal}-01-01`
+    searchQueryResult.value.timeEnd = `${newVal}-12-31`
+    setTimeout(() => {
+      fetchData()
+    })
+  }
+})
 onMounted(() => {
   year.value = String(currentYear)
   if (props.lab) {
@@ -427,24 +452,14 @@
     <div class="btns">
       <div />
       <!-- 部门 -->
-      <el-select
-        v-model="year"
-        style="width: 130px;"
-        class="short-input"
-        placeholder="年度"
-      >
-        <el-option
-          v-for="item in yearList"
-          :key="item"
-          :label="item"
-          :value="item"
-        />
+      <el-select v-model="year" style="width: 130px;" class="short-input" placeholder="年度">
+        <el-option v-for="item in yearList" :key="item" :label="item" :value="item" />
       </el-select>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <img :src="item.icon">
@@ -461,156 +476,40 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${'31.5%'}`, }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%;">
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%; display: flex;"
-                >
+                <div class="chart-name" style="width: 100%; height: 10%; display: flex;">
                   {{ element.name }}
-                  <div
-                    v-if="element.name === '人员持证到期趋势'"
-                    style="width: 350px; margin-left: 40px;"
-                  >
-                    <el-date-picker
-                      v-model="datetimerange"
-                      type="daterange"
-                      value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD"
-                      range-separator="至"
-                      start-placeholder="开始时间"
-                      end-placeholder="结束时间"
-                    />
-                  </div>
                 </div>
                 <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-if="element.type === 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <line-chart
-                    v-if="element.type === 'line'"
-                    :colors="colors"
-                    :gradient="element.gradient"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
+                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth"
+                    :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5', }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
+                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :data="element.data"
-                    :smooth="element.smooth"
-                    :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5',
-                    }"
-                  />
-                  <bar-chart-double
-                    v-if="element.type === 'bar-double'"
-                    :legend-data="element.legendData"
-                    :data1="element.data1"
-                    :data2="element.data2"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-vertical
-                    v-if="element.type === 'bar-vertical'"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-horizontal
-                    v-if="element.type === 'bar-horizontal'"
-                    bar-width="10"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-if="element.type === 'rank-table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/eqptDevice.vue b/src/views/dataManagement/components/data/eqptDevice.vue
index 1f1d01c..83a7083 100644
--- a/src/views/dataManagement/components/data/eqptDevice.vue
+++ b/src/views/dataManagement/components/data/eqptDevice.vue
@@ -9,18 +9,7 @@
 import { getDictByCode } from '@/api/system/dict'
 import { exportFile } from '@/utils/exportUtils'
 import { getCustomerInfoList } from '@/api/resource/customer'
-import {
-  getBaseInfo,
-  getNoVerificationAmount,
-  getDeviceSource,
-  getDeviceType,
-  getAlreadyMeasured,
-  getShouldMeasured,
-  getDevicePerformance,
-  exportDeviceType,
-  getDeviceSourceDept,
-  getDeviceTypeList
-} from '@/api/dataManagement/data/eqptDevice'
+import { getBaseInfo, getNoVerificationAmount, getDeviceSource, getDeviceType, getAlreadyMeasured, getShouldMeasured, getDevicePerformance, exportDeviceType, getDeviceSourceDept, getDeviceTypeList } from '@/api/dataManagement/data/eqptDevice'
 import { eqptDevice } from './img'
 const props = defineProps({
   lab: {
@@ -88,40 +77,34 @@
   }
 }
 const timeDate = ref<string[]>([])
-watch(
-  () => current.value,
-  newVal => {
-    if (newVal) {
-      if (newVal === '当日') {
-        timeDate.value = [dayjs().format('YYYY-MM-DD')]
-      } else if (newVal === '近7日') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      } else if (newVal === '近14天') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      }
-      if (!newVal.includes('自定义')) {
-        fetchData()
-        selectCurrentTime.value = []
-      }
+watch(() => current.value, newVal => {
+  if (newVal) {
+    if (newVal === '当日') {
+      timeDate.value = [dayjs().format('YYYY-MM-DD')]
+    } else if (newVal === '近7日') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
+    } else if (newVal === '近14天') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
     }
-  }
-)
-watch(
-  () => selectCurrentTime.value,
-  newVal => {
-    if (newVal.length === 2) {
-      console.log('确定时间')
-      timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    if (!newVal.includes('自定义')) {
       fetchData()
+      selectCurrentTime.value = []
     }
   }
-)
+})
+watch(() => selectCurrentTime.value, newVal => {
+  if (newVal.length === 2) {
+    console.log('确定时间')
+    timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    fetchData()
+  }
+})
 // 公共查询条件
 const searchQueryResult = ref({
   groupCode: '',
@@ -137,13 +120,9 @@
 })
 // 获取受检设备各种类数量分析数据
 const fetchQueryForTypeSoure = () => {
-  getDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
-    const current = showChart.value.filter(
-      item => item.name === '受检设备各种类数量分析'
-    )[0]
+  const current = showChart.value.filter(item => item.name === '受检设备各种类数量分析')[0]
+  current.loading = true
+  getDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     current.data = []
     const data = []
     for (const i in res.data) {
@@ -153,7 +132,16 @@
       })
     }
     current.data = data
-    // console.log(data, 'data 1')
+    current.loading = false
+    // 判断数据是否为空
+    if (current.data.length) {
+      current.isEmpty = false
+    }
+    else {
+      current.isEmpty = true
+    }
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备各种类数量分析 查询条件
@@ -182,16 +170,15 @@
 })
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备已检数量趋势')[0]
+  current.loading = true
   getAlreadyMeasured({
     ...searchQueryResult.value,
     ...searchQueryForMeasured.value,
     timeStart: searchQueryForMeasured.value.timeStart ? searchQueryForMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForMeasured.value.timeEnd ? searchQueryForMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备已检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备已检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备已检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -215,6 +202,9 @@
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备已检数量趋势 查询条件
@@ -242,7 +232,7 @@
   fetchQueryForShouldMeasured()
 })
 const contextmenu = (name: string) => {
-  console.log(name)
+  // console.log(name)
   if (name === '受检设备已检数量趋势') {
     selectForMeasured.value = []
     // fetchQueryForMeasured()
@@ -253,16 +243,15 @@
 }
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForShouldMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备应检数量趋势')[0]
+  current.loading = true
   getShouldMeasured({
     ...searchQueryResult.value,
     ...searchQueryForShouldMeasured.value,
     timeStart: searchQueryForShouldMeasured.value.timeStart ? searchQueryForShouldMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForShouldMeasured.value.timeEnd ? searchQueryForShouldMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备应检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备应检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备应检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -286,21 +275,21 @@
       symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备应检数量趋势 查询条件
 const changeSearchQueryForShouldMeasured = () => {
   fetchQueryForShouldMeasured()
 }
-watch(
-  () => props.lab,
-  newVal => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
+watch(() => props.lab, newVal => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
   }
-)
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -356,7 +345,9 @@
         value: 'count',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备来源分析',
@@ -365,7 +356,9 @@
     center: ['50%', '60%'],
     labelPosition: 'outside',
     radius: '70%',
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备各种类数量分析',
@@ -374,7 +367,9 @@
     // labelPosition: 'outside',
     // radius: '70%',
     center: ['50%', '60%'],
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备已检数量趋势',
@@ -383,7 +378,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备应检数量趋势',
@@ -392,7 +389,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备性能趋势',
@@ -400,12 +399,6 @@
     source: 'system',
     data: [],
     columns: [
-      // {
-      //   text: '序号',
-      //   value: 'index',
-      //   align: 'center',
-      //   width: '70'
-      // },
       {
         text: '设备名称',
         value: 'sampleName',
@@ -441,24 +434,21 @@
         value: 'totalAmount',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   }
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  }
-)
-// 模拟数据
-const loading = ref(false)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+// 获取数据
+const loadingBase = ref(false)
 function fetchData() {
-  console.log(current.value, '当前日期类型---要查询了')
   if (current.value !== '自定义时间') {
-    console.log(timeDate.value, 'timeDate')
     if (current.value === '当日') {
       searchQueryResult.value.timeStart = `${timeDate.value[0]} 00:00:00`
       searchQueryResult.value.timeEnd = `${timeDate.value[0]} 23:59:59`
@@ -469,43 +459,39 @@
   } else {
     searchQueryResult.value.timeStart = `${selectCurrentTime.value[0]} 00:00:00`
     searchQueryResult.value.timeEnd = `${selectCurrentTime.value[1]} 23:59:59`
-    console.log(selectCurrentTime.value, 'selectCurrentTime.value')
   }
-  // searchQueryResult.value.timeStart = `2024-01-01 00:00:00`
-  // searchQueryResult.value.timeEnd = `2024-12-31 23:59:59`
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then(res => {
     baseInfo.value.forEach(item => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 未检定数量分析
+  const current1 = showChart.value.filter(item => item.name === '未检定设备数量分析')[0]
+  current1.loading = true
   getNoVerificationAmount(searchQueryResult.value).then(res => {
-    // console.log(res.data, '未检定数量分析')
-    const current = showChart.value.filter(
-      item => item.name === '未检定设备数量分析'
-    )[0]
-    current.data = []
+    current1.data = []
     for (const i in res.data) {
-      current.data.push({
+      current1.data.push({
         dept: i,
         count: res.data[i]
       })
     }
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 受检设备来源分析
+  const current2 = showChart.value.filter(item => item.name === '受检设备来源分析')[0]
+  current2.loading = true
   getDeviceSource(searchQueryResult.value).then(res => {
-    console.log(res.data, '受检设备来源分析')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备来源分析'
-    )[0]
     const data = []
     for (const i in res.data) {
-      const obj = {
-        name: '',
-        id: '',
-        value: ''
-      }
+      const obj = { name: '', id: '', value: '' }
       obj.name = i
       for (const j in res.data[i]) {
         obj.id = j
@@ -513,8 +499,17 @@
       }
       data.push(obj)
     }
-    current.data = data
-    console.log(data, '受检设备来源分析')
+    current2.data = data
+    current2.loading = false
+    // 判断是否有数据
+    if (current2.data.length) {
+      current2.isEmpty = false
+    }
+    else {
+      current2.isEmpty = true
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 受检设备各种类数量分析
   fetchQueryForTypeSoure()
@@ -523,17 +518,14 @@
   // 受检设备应检数量趋势
   fetchQueryForShouldMeasured()
   // 受检设备性能趋势
-  getDevicePerformance({
-    ...searchQueryResult.value,
-    offset: 1,
-    limit: 9999
-  }).then(res => {
-    console.log(res.data, '受检设备性能趋势')
-    const current = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
-    current.data = res.data.rows.map((item: any, index: number) => ({
-      ...item,
-      index: index + 1
-    }))
+  const current3 = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
+  current3.loading = true
+  getDevicePerformance({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then(res => {
+    // console.log(res.data, '受检设备性能趋势')
+    current3.data = res.data.rows.map((item: any, index: number) => ({ ...item, index: index + 1 }))
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   //
   // loading.value = true
@@ -572,9 +564,7 @@
   //   loading.value = false
   // }, 3000)
 }
-defineExpose({
-  showChart
-})
+defineExpose({ showChart })
 
 // 拖拽结束
 const onEnd = () => {
@@ -614,12 +604,7 @@
     checkDestinationList.value = res.data
   })
   // 获取委托方列表
-  getCustomerInfoList({
-    limit: 9999,
-    offset: 1,
-    approvalStatus: '0',
-    formId: 'zyglwtfml'
-  }).then(res => {
+  getCustomerInfoList({ limit: 9999, offset: 1, approvalStatus: '0', formId: 'zyglwtfml' }).then(res => {
     customerList.value = res.data.rows.map((item: any) => ({
       name: item.customerName,
       id: item.id,
@@ -635,10 +620,7 @@
     text: '下载中请稍后',
     background: 'rgba(255, 255, 255, 0.8)',
   })
-  exportDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
+  exportDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     const blob = new Blob([res.data])
     exportFile(blob, '受检设备种类数量分析.xlsx')
     loading.close()
@@ -652,25 +634,28 @@
 const deviceTypeData = ref({})
 // 点击饼图
 const clickPie = (params: any, ele: any) => {
-  console.log(params, ele, '点击饼图')
+  // console.log(params, ele, '点击饼图')
   const current = showChart.value.filter((item: any) => item.name === ele.name)[0]
+  current.loading = true
   if (ele.name === '受检设备来源分析') {
     deviceSourceData.value = JSON.parse(JSON.stringify(current))
     current.data = []
     getDeviceSourceDept({ ...searchQueryResult.value, customerId: params.data.id }).then(res => {
-      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name}))
+      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name }))
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   else if (ele.name === '受检设备各种类数量分析') {
     deviceTypeData.value = JSON.parse(JSON.stringify(current))
     current.data = []
-    getDeviceTypeList({
-      ...searchQueryResult.value,
-      ...searchQueryForTypeSoure.value,
-      sampleName: params.data.name
-    }).then(res => {
+    getDeviceTypeList({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value, sampleName: params.data.name }).then(res => {
       // console.log(res.data, '123')
       current.data = res.data.rows
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   current.type = 'rank-table'
@@ -729,14 +714,14 @@
         <div style="width: 101px; position: absolute; top: 0; right: 0; opacity: 0">
           <el-date-picker style="width: 101px" ref="dateRef" v-model="selectCurrentTime" type="daterange"
             range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" class="time-daterange"
-            format="YYYY-MM-DD" value-format="YYYY-MM-DD"  @focus="handlerFocus" @blur="handlerBlur" />
+            format="YYYY-MM-DD" value-format="YYYY-MM-DD" @focus="handlerFocus" @blur="handlerBlur" />
         </div>
       </div>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div class="count-item" v-for="item in baseInfo" :key="item.value">
           <div class="header-icon" style="width: 55px">
             <img :src="item.icon" width="55px" height="50px" />
@@ -756,20 +741,15 @@
       <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
         ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div :style="{
-            width: `${'31.5%'}`
-          }" class="chart-item">
+          <div :style="{ width: `${'31.5%'}` }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%">
                 <div class="chart-name"
-                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''" style="
-                    width: 100%;
-                    height: 10%;
-                    display: flex;
-                    margin-top: 25px;" @click="changeTable(element.name)">
+                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''"
+                  style="width: 100%;height: 10%;display: flex;margin-top: 25px;" @click="changeTable(element.name)">
                   {{ element.name }}
                   <div v-if="element.name === '受检设备各种类数量分析'" style="margin-left: 40px">
                     <!-- 部门 -->
@@ -829,73 +809,29 @@
                   </div>
                 </div>
                 <div style="width: 100%; height: 80%">
-                  <pie-chart v-if="element.type === 'pie'" :title="element.title" :show-total="element.showTotal"
-                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition" :radius="element.radius" :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" @clickPie="(params: any) => {
-                      clickPie(params, element)
-                    }" />
-                  <line-chart v-if="element.type === 'line'" :colors="colors" :gradient="element.gradient"
-                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth" :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5'
-                    }" />
-                  <bar-chart-double v-if="element.type === 'bar-double'" :legend-data="element.legendData"
-                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-vertical v-if="element.type === 'bar-vertical'" :bar-coner="0" :data="element.data"
-                    :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal'" bar-width="10" :bar-coner="0"
-                    :data="element.data" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%" :height="300"
-                    :data="element.data" :columns="element.columns" />
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title"
+                    :show-total="element.showTotal" :data="element.data" :colors="colors" :center="element.center"
+                    label-formatter="{style1|{c}}" :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }"
+                    @clickPie="(params: any) => { clickPie(params, element) }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors"
+                    :gradient="element.gradient" :x-axis-data="element.xAxisData" :data="element.data"
+                    :smooth="element.smooth" :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5' }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty"
+                    :legend-data="element.legendData" :data1="element.data1" :data2="element.data2"
+                    :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10"
+                    :bar-coner="0" :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <scroll-table v-if="element.type === 'rank-table' && !element.isEmpty" style="width: 100%"
+                    :height="300" :data="element.data" :columns="element.columns" />
+                  <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>

diff --git a/src/views/dataManagement/components/data/device.vue b/src/views/dataManagement/components/data/device.vue
index 9897df1..23efd69 100644
--- a/src/views/dataManagement/components/data/device.vue
+++ b/src/views/dataManagement/components/data/device.vue
@@ -5,15 +5,7 @@
 import { colors } from '../environment/colors'
 import { device } from './img'
 import { getRangeAllTime } from '@/utils/date'
-import {
-  getBaseInfo,
-  getDeptExpire,
-  getDeviceMaintain,
-  getDeviceStatus,
-  getDeviceType,
-  getStandardDeviceType,
-  getTraceAnalyse,
-} from '@/api/dataManagement/data/device'
+import { getBaseInfo, getDeptExpire, getDeviceMaintain, getDeviceStatus, getDeviceType, getStandardDeviceType, getTraceAnalyse, } from '@/api/dataManagement/data/device'
 const props = defineProps({
   lab: {
     type: String,
@@ -30,15 +22,12 @@
 const year = ref('') // 年度
 const yearList = ref<string[]>([])
 
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -86,6 +75,8 @@
     data: [],
     smooth: false,
     gradient: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备类型分析',
@@ -95,6 +86,8 @@
     labelPosition: 'outside',
     radius: '70%',
     data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '标准设备种类分析',
@@ -113,11 +106,15 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备状态分析',
     type: 'bar-vertical',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备维护保养情况',
@@ -159,39 +156,43 @@
         width: '95',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备溯源分析',
     type: 'bar-horizontal',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then((res) => {
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 近一年部门设备到期趋势
+  const current1 = showChart.value.filter(item => item.name === '近一年部门设备到期趋势')[0]
+  current1.loading = true
   getDeptExpire(searchQueryResult.value).then((res) => {
-    console.log(res.data, '近一年部门设备到期趋势')
-    const current = showChart.value.filter(
-      item => item.name === '近一年部门设备到期趋势',
-    )[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+    // console.log(res.data, '近一年部门设备到期趋势')
+    current1.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '电学电源组',
@@ -210,15 +211,20 @@
         value: 'glAmount',
       },
     ]
-    current.data = data.map((item: any) => ({
+    current1.data = data.map((item: any) => ({
       name: item.name,
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[item.value])),
     }))
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 设备类型分析
+  const current2 = showChart.value.filter(item => item.name === '设备类型分析')[0]
+  current2.loading = true
   getDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备类型分析')
+    // console.log(res.data, '设备类型分析')
     const data = [
       {
         name: '标准设备',
@@ -236,20 +242,26 @@
         data: '',
       },
     ]
-    const current = showChart.value.filter(
-      item => item.name === '设备类型分析',
-    )[0]
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.loading = false
+    // 判断是否为空
+    if(current2.data.every((item: any) => item.value === '0')) {
+      current2.isEmpty = true
+    }
+    else {
+      current2.isEmpty = false
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 设备状态分析
+  const current3 = showChart.value.filter(item => item.name === '设备状态分析')[0]
+  current3.loading = true
   getDeviceStatus(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备状态分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备状态分析',
-    )[0]
+    // console.log(res.data, '设备状态分析')
     const data = [
       {
         name: '在用',
@@ -280,20 +292,22 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current3.xAxisData = data.map((item: any) => item.name)
+    current3.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 设备溯源分析
+  const current4 = showChart.value.filter(item => item.name === '设备溯源分析')[0]
+  current4.loading = true
   getTraceAnalyse(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备溯源分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备溯源分析',
-    )[0]
+    // console.log(res.data, '设备溯源分析')
     const data = [
       {
         name: '合格',
@@ -314,34 +328,48 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current4.xAxisData = data.map((item: any) => item.name)
+    current4.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current4.loading = false
+    // 判断是否为空
+    if(data.every((item: any) => String(item.data) === '0')) {
+      current4.isEmpty = true
+    }
+    else {
+      current4.isEmpty = false
+    }
+  }).catch(() => {
+    current4.loading = false
   })
   // 标准设备种类分析
+  const current5 = showChart.value.filter(item => item.name === '标准设备种类分析')[0]
+  current5.loading = true
   getStandardDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '标准设备种类分析')
-    const current = showChart.value.filter(
-      item => item.name === '标准设备种类分析',
-    )[0]
-    current.data = []
+    // console.log(res.data, '标准设备种类分析')
+    current5.data = []
     for (const i in res.data) {
-      current.data.push({ name: i, count: res.data[i] })
+      current5.data.push({ name: i, count: res.data[i] })
     }
-    current.data.reverse()
+    current5.data.reverse()
+    current5.loading = false
+  }).catch(() => {
+    current5.loading = false
   })
   // 设备维护保养情况
+  const current6 = showChart.value.filter(item => item.name === '设备维护保养情况')[0]
+  current6.loading = true
   getDeviceMaintain({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then((res) => {
-    console.log(res.data, '设备维护保养情况')
-    const current = showChart.value.filter(
-      item => item.name === '设备维护保养情况',
-    )[0]
-    current.data = []
-    current.data = res.data.rows
+    // console.log(res.data, '设备维护保养情况')
+    current6.data = []
+    current6.data = res.data.rows
+    current6.loading = false
+  }).catch(() => {
+    current6.loading = false
   })
   // loading.value = true
   // // 近一年部门设备到期趋势
@@ -398,19 +426,16 @@
   yearList.value.push(String(currentYear - i))
 }
 
-watch(
-  () => year.value,
-  (newVal) => {
-    if (newVal) {
-      console.log(newVal, '当前年度')
-      searchQueryResult.value.timeStart = `${newVal}-01-01`
-      searchQueryResult.value.timeEnd = `${newVal}-12-31`
-      setTimeout(() => {
-        fetchData()
-      })
-    }
-  },
-)
+watch(() => year.value, (newVal) => {
+  if (newVal) {
+    console.log(newVal, '当前年度')
+    searchQueryResult.value.timeStart = `${newVal}-01-01`
+    searchQueryResult.value.timeEnd = `${newVal}-12-31`
+    setTimeout(() => {
+      fetchData()
+    })
+  }
+})
 onMounted(() => {
   year.value = String(currentYear)
   if (props.lab) {
@@ -427,24 +452,14 @@
     <div class="btns">
       <div />
       <!-- 部门 -->
-      <el-select
-        v-model="year"
-        style="width: 130px;"
-        class="short-input"
-        placeholder="年度"
-      >
-        <el-option
-          v-for="item in yearList"
-          :key="item"
-          :label="item"
-          :value="item"
-        />
+      <el-select v-model="year" style="width: 130px;" class="short-input" placeholder="年度">
+        <el-option v-for="item in yearList" :key="item" :label="item" :value="item" />
       </el-select>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <img :src="item.icon">
@@ -461,156 +476,40 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${'31.5%'}`, }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%;">
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%; display: flex;"
-                >
+                <div class="chart-name" style="width: 100%; height: 10%; display: flex;">
                   {{ element.name }}
-                  <div
-                    v-if="element.name === '人员持证到期趋势'"
-                    style="width: 350px; margin-left: 40px;"
-                  >
-                    <el-date-picker
-                      v-model="datetimerange"
-                      type="daterange"
-                      value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD"
-                      range-separator="至"
-                      start-placeholder="开始时间"
-                      end-placeholder="结束时间"
-                    />
-                  </div>
                 </div>
                 <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-if="element.type === 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <line-chart
-                    v-if="element.type === 'line'"
-                    :colors="colors"
-                    :gradient="element.gradient"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
+                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth"
+                    :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5', }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
+                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :data="element.data"
-                    :smooth="element.smooth"
-                    :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5',
-                    }"
-                  />
-                  <bar-chart-double
-                    v-if="element.type === 'bar-double'"
-                    :legend-data="element.legendData"
-                    :data1="element.data1"
-                    :data2="element.data2"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-vertical
-                    v-if="element.type === 'bar-vertical'"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-horizontal
-                    v-if="element.type === 'bar-horizontal'"
-                    bar-width="10"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-if="element.type === 'rank-table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/eqptDevice.vue b/src/views/dataManagement/components/data/eqptDevice.vue
index 1f1d01c..83a7083 100644
--- a/src/views/dataManagement/components/data/eqptDevice.vue
+++ b/src/views/dataManagement/components/data/eqptDevice.vue
@@ -9,18 +9,7 @@
 import { getDictByCode } from '@/api/system/dict'
 import { exportFile } from '@/utils/exportUtils'
 import { getCustomerInfoList } from '@/api/resource/customer'
-import {
-  getBaseInfo,
-  getNoVerificationAmount,
-  getDeviceSource,
-  getDeviceType,
-  getAlreadyMeasured,
-  getShouldMeasured,
-  getDevicePerformance,
-  exportDeviceType,
-  getDeviceSourceDept,
-  getDeviceTypeList
-} from '@/api/dataManagement/data/eqptDevice'
+import { getBaseInfo, getNoVerificationAmount, getDeviceSource, getDeviceType, getAlreadyMeasured, getShouldMeasured, getDevicePerformance, exportDeviceType, getDeviceSourceDept, getDeviceTypeList } from '@/api/dataManagement/data/eqptDevice'
 import { eqptDevice } from './img'
 const props = defineProps({
   lab: {
@@ -88,40 +77,34 @@
   }
 }
 const timeDate = ref<string[]>([])
-watch(
-  () => current.value,
-  newVal => {
-    if (newVal) {
-      if (newVal === '当日') {
-        timeDate.value = [dayjs().format('YYYY-MM-DD')]
-      } else if (newVal === '近7日') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      } else if (newVal === '近14天') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      }
-      if (!newVal.includes('自定义')) {
-        fetchData()
-        selectCurrentTime.value = []
-      }
+watch(() => current.value, newVal => {
+  if (newVal) {
+    if (newVal === '当日') {
+      timeDate.value = [dayjs().format('YYYY-MM-DD')]
+    } else if (newVal === '近7日') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
+    } else if (newVal === '近14天') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
     }
-  }
-)
-watch(
-  () => selectCurrentTime.value,
-  newVal => {
-    if (newVal.length === 2) {
-      console.log('确定时间')
-      timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    if (!newVal.includes('自定义')) {
       fetchData()
+      selectCurrentTime.value = []
     }
   }
-)
+})
+watch(() => selectCurrentTime.value, newVal => {
+  if (newVal.length === 2) {
+    console.log('确定时间')
+    timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    fetchData()
+  }
+})
 // 公共查询条件
 const searchQueryResult = ref({
   groupCode: '',
@@ -137,13 +120,9 @@
 })
 // 获取受检设备各种类数量分析数据
 const fetchQueryForTypeSoure = () => {
-  getDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
-    const current = showChart.value.filter(
-      item => item.name === '受检设备各种类数量分析'
-    )[0]
+  const current = showChart.value.filter(item => item.name === '受检设备各种类数量分析')[0]
+  current.loading = true
+  getDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     current.data = []
     const data = []
     for (const i in res.data) {
@@ -153,7 +132,16 @@
       })
     }
     current.data = data
-    // console.log(data, 'data 1')
+    current.loading = false
+    // 判断数据是否为空
+    if (current.data.length) {
+      current.isEmpty = false
+    }
+    else {
+      current.isEmpty = true
+    }
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备各种类数量分析 查询条件
@@ -182,16 +170,15 @@
 })
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备已检数量趋势')[0]
+  current.loading = true
   getAlreadyMeasured({
     ...searchQueryResult.value,
     ...searchQueryForMeasured.value,
     timeStart: searchQueryForMeasured.value.timeStart ? searchQueryForMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForMeasured.value.timeEnd ? searchQueryForMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备已检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备已检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备已检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -215,6 +202,9 @@
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备已检数量趋势 查询条件
@@ -242,7 +232,7 @@
   fetchQueryForShouldMeasured()
 })
 const contextmenu = (name: string) => {
-  console.log(name)
+  // console.log(name)
   if (name === '受检设备已检数量趋势') {
     selectForMeasured.value = []
     // fetchQueryForMeasured()
@@ -253,16 +243,15 @@
 }
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForShouldMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备应检数量趋势')[0]
+  current.loading = true
   getShouldMeasured({
     ...searchQueryResult.value,
     ...searchQueryForShouldMeasured.value,
     timeStart: searchQueryForShouldMeasured.value.timeStart ? searchQueryForShouldMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForShouldMeasured.value.timeEnd ? searchQueryForShouldMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备应检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备应检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备应检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -286,21 +275,21 @@
       symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备应检数量趋势 查询条件
 const changeSearchQueryForShouldMeasured = () => {
   fetchQueryForShouldMeasured()
 }
-watch(
-  () => props.lab,
-  newVal => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
+watch(() => props.lab, newVal => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
   }
-)
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -356,7 +345,9 @@
         value: 'count',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备来源分析',
@@ -365,7 +356,9 @@
     center: ['50%', '60%'],
     labelPosition: 'outside',
     radius: '70%',
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备各种类数量分析',
@@ -374,7 +367,9 @@
     // labelPosition: 'outside',
     // radius: '70%',
     center: ['50%', '60%'],
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备已检数量趋势',
@@ -383,7 +378,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备应检数量趋势',
@@ -392,7 +389,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备性能趋势',
@@ -400,12 +399,6 @@
     source: 'system',
     data: [],
     columns: [
-      // {
-      //   text: '序号',
-      //   value: 'index',
-      //   align: 'center',
-      //   width: '70'
-      // },
       {
         text: '设备名称',
         value: 'sampleName',
@@ -441,24 +434,21 @@
         value: 'totalAmount',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   }
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  }
-)
-// 模拟数据
-const loading = ref(false)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+// 获取数据
+const loadingBase = ref(false)
 function fetchData() {
-  console.log(current.value, '当前日期类型---要查询了')
   if (current.value !== '自定义时间') {
-    console.log(timeDate.value, 'timeDate')
     if (current.value === '当日') {
       searchQueryResult.value.timeStart = `${timeDate.value[0]} 00:00:00`
       searchQueryResult.value.timeEnd = `${timeDate.value[0]} 23:59:59`
@@ -469,43 +459,39 @@
   } else {
     searchQueryResult.value.timeStart = `${selectCurrentTime.value[0]} 00:00:00`
     searchQueryResult.value.timeEnd = `${selectCurrentTime.value[1]} 23:59:59`
-    console.log(selectCurrentTime.value, 'selectCurrentTime.value')
   }
-  // searchQueryResult.value.timeStart = `2024-01-01 00:00:00`
-  // searchQueryResult.value.timeEnd = `2024-12-31 23:59:59`
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then(res => {
     baseInfo.value.forEach(item => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 未检定数量分析
+  const current1 = showChart.value.filter(item => item.name === '未检定设备数量分析')[0]
+  current1.loading = true
   getNoVerificationAmount(searchQueryResult.value).then(res => {
-    // console.log(res.data, '未检定数量分析')
-    const current = showChart.value.filter(
-      item => item.name === '未检定设备数量分析'
-    )[0]
-    current.data = []
+    current1.data = []
     for (const i in res.data) {
-      current.data.push({
+      current1.data.push({
         dept: i,
         count: res.data[i]
       })
     }
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 受检设备来源分析
+  const current2 = showChart.value.filter(item => item.name === '受检设备来源分析')[0]
+  current2.loading = true
   getDeviceSource(searchQueryResult.value).then(res => {
-    console.log(res.data, '受检设备来源分析')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备来源分析'
-    )[0]
     const data = []
     for (const i in res.data) {
-      const obj = {
-        name: '',
-        id: '',
-        value: ''
-      }
+      const obj = { name: '', id: '', value: '' }
       obj.name = i
       for (const j in res.data[i]) {
         obj.id = j
@@ -513,8 +499,17 @@
       }
       data.push(obj)
     }
-    current.data = data
-    console.log(data, '受检设备来源分析')
+    current2.data = data
+    current2.loading = false
+    // 判断是否有数据
+    if (current2.data.length) {
+      current2.isEmpty = false
+    }
+    else {
+      current2.isEmpty = true
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 受检设备各种类数量分析
   fetchQueryForTypeSoure()
@@ -523,17 +518,14 @@
   // 受检设备应检数量趋势
   fetchQueryForShouldMeasured()
   // 受检设备性能趋势
-  getDevicePerformance({
-    ...searchQueryResult.value,
-    offset: 1,
-    limit: 9999
-  }).then(res => {
-    console.log(res.data, '受检设备性能趋势')
-    const current = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
-    current.data = res.data.rows.map((item: any, index: number) => ({
-      ...item,
-      index: index + 1
-    }))
+  const current3 = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
+  current3.loading = true
+  getDevicePerformance({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then(res => {
+    // console.log(res.data, '受检设备性能趋势')
+    current3.data = res.data.rows.map((item: any, index: number) => ({ ...item, index: index + 1 }))
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   //
   // loading.value = true
@@ -572,9 +564,7 @@
   //   loading.value = false
   // }, 3000)
 }
-defineExpose({
-  showChart
-})
+defineExpose({ showChart })
 
 // 拖拽结束
 const onEnd = () => {
@@ -614,12 +604,7 @@
     checkDestinationList.value = res.data
   })
   // 获取委托方列表
-  getCustomerInfoList({
-    limit: 9999,
-    offset: 1,
-    approvalStatus: '0',
-    formId: 'zyglwtfml'
-  }).then(res => {
+  getCustomerInfoList({ limit: 9999, offset: 1, approvalStatus: '0', formId: 'zyglwtfml' }).then(res => {
     customerList.value = res.data.rows.map((item: any) => ({
       name: item.customerName,
       id: item.id,
@@ -635,10 +620,7 @@
     text: '下载中请稍后',
     background: 'rgba(255, 255, 255, 0.8)',
   })
-  exportDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
+  exportDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     const blob = new Blob([res.data])
     exportFile(blob, '受检设备种类数量分析.xlsx')
     loading.close()
@@ -652,25 +634,28 @@
 const deviceTypeData = ref({})
 // 点击饼图
 const clickPie = (params: any, ele: any) => {
-  console.log(params, ele, '点击饼图')
+  // console.log(params, ele, '点击饼图')
   const current = showChart.value.filter((item: any) => item.name === ele.name)[0]
+  current.loading = true
   if (ele.name === '受检设备来源分析') {
     deviceSourceData.value = JSON.parse(JSON.stringify(current))
     current.data = []
     getDeviceSourceDept({ ...searchQueryResult.value, customerId: params.data.id }).then(res => {
-      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name}))
+      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name }))
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   else if (ele.name === '受检设备各种类数量分析') {
     deviceTypeData.value = JSON.parse(JSON.stringify(current))
     current.data = []
-    getDeviceTypeList({
-      ...searchQueryResult.value,
-      ...searchQueryForTypeSoure.value,
-      sampleName: params.data.name
-    }).then(res => {
+    getDeviceTypeList({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value, sampleName: params.data.name }).then(res => {
       // console.log(res.data, '123')
       current.data = res.data.rows
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   current.type = 'rank-table'
@@ -729,14 +714,14 @@
         <div style="width: 101px; position: absolute; top: 0; right: 0; opacity: 0">
           <el-date-picker style="width: 101px" ref="dateRef" v-model="selectCurrentTime" type="daterange"
             range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" class="time-daterange"
-            format="YYYY-MM-DD" value-format="YYYY-MM-DD"  @focus="handlerFocus" @blur="handlerBlur" />
+            format="YYYY-MM-DD" value-format="YYYY-MM-DD" @focus="handlerFocus" @blur="handlerBlur" />
         </div>
       </div>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div class="count-item" v-for="item in baseInfo" :key="item.value">
           <div class="header-icon" style="width: 55px">
             <img :src="item.icon" width="55px" height="50px" />
@@ -756,20 +741,15 @@
       <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
         ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div :style="{
-            width: `${'31.5%'}`
-          }" class="chart-item">
+          <div :style="{ width: `${'31.5%'}` }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%">
                 <div class="chart-name"
-                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''" style="
-                    width: 100%;
-                    height: 10%;
-                    display: flex;
-                    margin-top: 25px;" @click="changeTable(element.name)">
+                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''"
+                  style="width: 100%;height: 10%;display: flex;margin-top: 25px;" @click="changeTable(element.name)">
                   {{ element.name }}
                   <div v-if="element.name === '受检设备各种类数量分析'" style="margin-left: 40px">
                     <!-- 部门 -->
@@ -829,73 +809,29 @@
                   </div>
                 </div>
                 <div style="width: 100%; height: 80%">
-                  <pie-chart v-if="element.type === 'pie'" :title="element.title" :show-total="element.showTotal"
-                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition" :radius="element.radius" :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" @clickPie="(params: any) => {
-                      clickPie(params, element)
-                    }" />
-                  <line-chart v-if="element.type === 'line'" :colors="colors" :gradient="element.gradient"
-                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth" :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5'
-                    }" />
-                  <bar-chart-double v-if="element.type === 'bar-double'" :legend-data="element.legendData"
-                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-vertical v-if="element.type === 'bar-vertical'" :bar-coner="0" :data="element.data"
-                    :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal'" bar-width="10" :bar-coner="0"
-                    :data="element.data" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%" :height="300"
-                    :data="element.data" :columns="element.columns" />
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title"
+                    :show-total="element.showTotal" :data="element.data" :colors="colors" :center="element.center"
+                    label-formatter="{style1|{c}}" :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }"
+                    @clickPie="(params: any) => { clickPie(params, element) }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors"
+                    :gradient="element.gradient" :x-axis-data="element.xAxisData" :data="element.data"
+                    :smooth="element.smooth" :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5' }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty"
+                    :legend-data="element.legendData" :data1="element.data1" :data2="element.data2"
+                    :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10"
+                    :bar-coner="0" :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <scroll-table v-if="element.type === 'rank-table' && !element.isEmpty" style="width: 100%"
+                    :height="300" :data="element.data" :columns="element.columns" />
+                  <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/meteringVerification.vue b/src/views/dataManagement/components/data/meteringVerification.vue
index b45246e..7952cd2 100644
--- a/src/views/dataManagement/components/data/meteringVerification.vue
+++ b/src/views/dataManagement/components/data/meteringVerification.vue
@@ -9,13 +9,7 @@
 import { getDictByCode } from '@/api/system/dict'
 import ScrollTable from '@/components/ScrollTable/index.vue'
 // import { getEquipmentList } from '@/api/equipment/info/book'
-import {
-  getAlreadyDeviceRank,
-  getBaseInfo,
-  getDeviceAnalysis,
-  getTimelyAnalysis,
-  getVerificationResult,
-} from '@/api/dataManagement/data/verificationAnalysis'
+import { getAlreadyDeviceRank, getBaseInfo, getDeviceAnalysis, getTimelyAnalysis, getVerificationResult, } from '@/api/dataManagement/data/verificationAnalysis'
 // import { getCompanyList } from '@/api/system/dept'
 import { getCustomerInfoList } from '@/api/resource/customer'
 import { getEquipmentList } from '@/api/business/manager/order'
@@ -26,15 +20,12 @@
     default: '',
   },
 })
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 检定结果分析查询条件
 const searchQueryResult = ref({
   customerId: '',
@@ -47,19 +38,16 @@
   timeStart: '',
 })
 const datetimerange = ref()
-watch(
-  () => datetimerange.value,
-  (newVal) => {
-    searchQueryResult.value.timeStart = ''
-    searchQueryResult.value.timeEnd = ''
-    if (Array.isArray(newVal)) {
-      if (newVal.length) {
-        searchQueryResult.value.timeStart = `${newVal[0]}`
-        searchQueryResult.value.timeEnd = `${newVal[1]}`
-      }
+watch(() => datetimerange.value, (newVal) => {
+  searchQueryResult.value.timeStart = ''
+  searchQueryResult.value.timeEnd = ''
+  if (Array.isArray(newVal)) {
+    if (newVal.length) {
+      searchQueryResult.value.timeStart = `${newVal[0]}`
+      searchQueryResult.value.timeEnd = `${newVal[1]}`
     }
-  },
-)
+  }
+})
 // 实验室
 const labCodeList = ref<dictType[]>([])
 // 部门
@@ -77,6 +65,8 @@
 // 查询检定结果分析
 const searchList = () => {
   // 检定结果分析
+  const current = showChart.value.filter(item => item.name === '检定结果分析')[0]
+  current.loading = true
   getVerificationResult(searchQueryResult.value).then((res) => {
     const data = [
       {
@@ -99,9 +89,6 @@
       item.data = res.data[item.value]
       // item.data = String(Math.floor(Math.random() * 100) + 1)
     })
-    const current = showChart.value.filter(
-      item => item.name === '检定结果分析',
-    )[0]
     current.data = [
       {
         name: '数量',
@@ -116,6 +103,9 @@
     else {
       current.isEmpty = false
     }
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 重置查询
@@ -224,6 +214,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '当年已检设备排行TOP10',
@@ -242,6 +234,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '检定及时分析',
@@ -264,6 +258,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '检定结果分析',
@@ -273,28 +269,33 @@
     data: [],
     smooth: false,
     gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 ])
 
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
-const loading = ref(false)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo({ labCode: props.lab }).then((res) => {
     console.log(res.data, '获取基础数据')
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 在检设备分析
+  const current1 = showChart.value.filter(item => item.name === '在检设备分析')[0]
+  current1.loading = true
   getDeviceAnalysis({ labCode: props.lab }).then((res) => {
     const data = [
       {
@@ -326,25 +327,36 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    const current = showChart.value.filter(
-      item => item.name === '在检设备分析',
-    )[0]
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    current1.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current1.loading = false
+    // 判断是否为空
+    if(current1.data.every((item: any)=> item.value === '0')) {
+      current1.isEmpty = true
+    }
+    else {
+      current1.isEmpty = false
+    }
+  }).catch(() => {
+    current1.loading = false
   })
   // 当年已检设备排行
+  const current2 = showChart.value.filter(item => item.name === '当年已检设备排行TOP10')[0]
+  current2.loading = true
   getAlreadyDeviceRank({ labCode: props.lab }).then((res) => {
-    const current = showChart.value.filter(
-      item => item.name === '当年已检设备排行TOP10',
-    )[0]
-    current.data = []
+    current2.data = []
     for (const i in res.data) {
-      current.data.push({
+      current2.data.push({
         name: i,
         count: res.data[i],
       })
     }
+    current2.loading = false
+  }).catch(() => {
+    current2.loading = false
   })
   // 检定及时分析
+  const current3 = showChart.value.filter(item => item.name === '检定及时分析')[0]
+  current3.loading = true
   getTimelyAnalysis({ labCode: props.lab }).then((res) => {
     const data = [
       {
@@ -363,13 +375,18 @@
         data: '',
       },
     ]
-    data.forEach((item) => {
-      item.data = res.data[item.value]
-    })
-    const current = showChart.value.filter(
-      item => item.name === '检定及时分析',
-    )[0]
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    data.forEach((item) => { item.data = res.data[item.value] })
+    current3.data = data.map(item => ({ name: item.name, value: String(item.data )}))
+    // 判断是否为空
+    if(current3.data.every((item: any)=> item.value === '0')) {
+      current3.isEmpty = true
+    }
+    else {
+      current3.isEmpty = false
+    }
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 检定结果分析
   searchList()
@@ -379,12 +396,7 @@
 })
 // 获取委托方列表
 const fetchCompanyList = () => {
-  getCustomerInfoList({
-    limit: 9999,
-    offset: 1,
-    approvalStatus: '0',
-    formId: 'zyglwtfml',
-  }).then((res) => {
+  getCustomerInfoList({ limit: 9999, offset: 1, approvalStatus: '0', formId: 'zyglwtfml' }).then((res) => {
     customerList.value = res.data.rows.map((item: any) => ({
       name: item.customerName,
       id: item.id,
@@ -395,22 +407,10 @@
 fetchCompanyList()
 // 获取受检设备
 const fetchDevice = () => {
-  getEquipmentList({
-    customerId: searchQueryResult.value.customerId,
-    equipmentType: '1',
-    offset: 1,
-    limit: 9999,
-  }).then((res) => {
-    console.log(res.data, '受检设备')
+  getEquipmentList({ customerId: searchQueryResult.value.customerId, equipmentType: '1', offset: 1, limit: 9999 }).then((res) => {
+    // console.log(res.data, '受检设备')
     allDeviceList.value = res.data.rows
-    sampleNameList.value = uniqueMultiArray(
-      res.data.rows.map((item: any) => ({
-        sampleName: item.equipmentName,
-        model: item.model,
-        helpInstruction: item.helpInstruction,
-      })),
-      'sampleName',
-    )
+    sampleNameList.value = uniqueMultiArray(res.data.rows.map((item: any) => ({ sampleName: item.equipmentName, model: item.model, helpInstruction: item.helpInstruction, })), 'sampleName',)
   })
 }
 fetchDevice()
@@ -430,32 +430,21 @@
 }
 // 改变设备名称查询条件
 const changeSampleName = (value: string) => {
-  console.log(value, '设备名称')
+  // console.log(value, '设备名称')
   modelList.value = []
   helpInstructionList.value = []
   searchQueryResult.value.model = ''
   searchQueryResult.value.helpInstruction = ''
-  modelList.value = uniqueMultiArray(
-    allDeviceList.value
-      .filter((item: any) => item.equipmentName === value)
-      .map((item: any) => ({
-        sampleName: item.equipmentName,
-        model: item.model,
-        helpInstruction: item.helpInstruction,
-      })),
-    'model',
-  )
+  modelList.value = uniqueMultiArray(allDeviceList.value.filter((item: any) => item.equipmentName === value).map((item: any) => ({ sampleName: item.equipmentName, model: item.model, helpInstruction: item.helpInstruction, })), 'model',)
   helpInstructionList.value = modelList.value
-  console.log(modelList.value, 'modelList.value')
+  // console.log(modelList.value, 'modelList.value')
 }
 // 改变规格型号查询条件
 const changeHelpInstruction = (value: string) => {
-  console.log(value, '规格型号')
+  // console.log(value, '规格型号')
   helpInstructionList.value = []
   searchQueryResult.value.helpInstruction = ''
-  helpInstructionList.value = modelList.value.filter(
-    item => item.model === value,
-  )
+  helpInstructionList.value = modelList.value.filter(item => item.model === value)
 }
 // 拖拽结束
 const onEnd = () => {
@@ -474,7 +463,7 @@
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <!-- <svg-icon name="icon-env-device-online" class="icon-button-icon" /> -->
@@ -492,265 +481,104 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                showChart.length === 4
-                  ? '48%'
-                  : index === 0 || index === 1
-                    ? '48%'
-                    : '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${showChart.length === 4 ? '48%' : index === 0 || index === 1 ? '48%' : '31.5%'}` }"
+            class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
-              <div
-                v-if="element.type === 'pie'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+            <div v-loading="element.loading" class="chart-page">
+              <div v-if="element.type === 'pie'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
-                <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-show="element.showType == 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-show="element.showType == 'table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" />
+                <div v-show="!element.isEmpty" style="width: 100%; height: 90%;">
+                  <pie-chart v-show="element.showType == 'pie'" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-show="element.showType == 'table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
                 </div>
               </div>
-              <div
-                v-if="element.type === 'rank-table'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+              <div v-if="element.type === 'rank-table'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
+                <!-- <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" /> -->
                 <div style="width: 100%; height: 90%;">
-                  <scroll-table
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                  <scroll-table style="width: 100%;" :height="300" :data="element.data" :columns="element.columns" />
                 </div>
               </div>
-              <div
-                v-if="element.type === 'bar-horizontal'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+              <div v-if="element.type === 'bar-horizontal'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
                 <!-- 查询条件 -->
-                <search-area
-                  :need-clear="true"
-                  @search="searchList"
-                  @clear="clearList"
-                >
+                <search-area :need-clear="true" @search="searchList" @clear="clearList">
                   <!-- 实验室 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.labCode"
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="实验室"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in labCodeList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.labCode" style="width: 130px;" class="short-input"
+                      placeholder="实验室" clearable>
+                      <el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 部门 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.groupCode"
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="部门"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in groupCodeList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.groupCode" style="width: 130px;" class="short-input"
+                      placeholder="部门" clearable>
+                      <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 委托方 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.customerId"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="委托方"
-                      clearable
-                      @change="changeCustomer"
-                    >
-                      <el-option
-                        v-for="item in customerList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.customerId" filterable style="width: 130px;"
+                      class="short-input" placeholder="委托方" clearable @change="changeCustomer">
+                      <el-option v-for="item in customerList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 受检设备名称 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.sampleName"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="受检设备名称"
-                      clearable
-                      @change="changeSampleName"
-                    >
-                      <el-option
-                        v-for="item in sampleNameList"
-                        :key="item.sampleName"
-                        :label="item.sampleName"
-                        :value="item.sampleName"
-                      />
+                    <el-select v-model="searchQueryResult.sampleName" filterable style="width: 130px;"
+                      class="short-input" placeholder="受检设备名称" clearable @change="changeSampleName">
+                      <el-option v-for="item in sampleNameList" :key="item.sampleName" :label="item.sampleName"
+                        :value="item.sampleName" />
                     </el-select>
                   </search-item>
                   <!-- 规格型号 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.model"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="规格型号"
-                      clearable
-                      @change="changeHelpInstruction"
-                    >
-                      <el-option
-                        v-for="item in modelList"
-                        :key="item.model"
-                        :label="item.model"
-                        :value="item.model"
-                      />
+                    <el-select v-model="searchQueryResult.model" filterable style="width: 130px;" class="short-input"
+                      placeholder="规格型号" clearable @change="changeHelpInstruction">
+                      <el-option v-for="item in modelList" :key="item.model" :label="item.model" :value="item.model" />
                     </el-select>
                   </search-item>
                   <!-- 辅助字段 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.helpInstruction"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="辅助字段"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in helpInstructionList"
-                        :key="item.helpInstruction"
-                        :label="item.helpInstruction"
-                        :value="item.helpInstruction"
-                      />
+                    <el-select v-model="searchQueryResult.helpInstruction" filterable style="width: 130px;"
+                      class="short-input" placeholder="辅助字段" clearable>
+                      <el-option v-for="item in helpInstructionList" :key="item.helpInstruction"
+                        :label="item.helpInstruction" :value="item.helpInstruction" />
                     </el-select>
                   </search-item>
                   <!-- 时间 -->
                   <search-item>
                     <div style="width: 350px !important;">
-                      <el-date-picker
-                        v-model="datetimerange"
-                        type="daterange"
-                        value-format="YYYY-MM-DD"
-                        format="YYYY-MM-DD"
-                        range-separator="至"
-                        start-placeholder="检定开始时间"
-                        end-placeholder="检定结束时间"
-                        clearable
-                      />
+                      <el-date-picker v-model="datetimerange" type="daterange" value-format="YYYY-MM-DD"
+                        format="YYYY-MM-DD" range-separator="至" start-placeholder="检定开始时间" end-placeholder="检定结束时间"
+                        clearable />
                     </div>
                   </search-item>
                 </search-area>
                 <div style="width: 100%; height: 70%;">
-                  <el-empty
-                    v-show="element.isEmpty"
-                    :image-size="100"
-                    description="暂无数据"
-                  />
-                  <bar-chart-horizontal
-                    v-show="!element.isEmpty"
-                    bar-width="30"
-                    :bar-coner="0"
-                    :data="element.data"
+                  <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" />
+                  <bar-chart-horizontal v-show="!element.isEmpty" bar-width="25" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }"
+                    :grid="{ top: 20, left: 20, right: 60, bottom: 30, containLabel: true, }"/>
                 </div>
               </div>
               <!--  -->

diff --git a/src/views/dataManagement/components/data/device.vue b/src/views/dataManagement/components/data/device.vue
index 9897df1..23efd69 100644
--- a/src/views/dataManagement/components/data/device.vue
+++ b/src/views/dataManagement/components/data/device.vue
@@ -5,15 +5,7 @@
 import { colors } from '../environment/colors'
 import { device } from './img'
 import { getRangeAllTime } from '@/utils/date'
-import {
-  getBaseInfo,
-  getDeptExpire,
-  getDeviceMaintain,
-  getDeviceStatus,
-  getDeviceType,
-  getStandardDeviceType,
-  getTraceAnalyse,
-} from '@/api/dataManagement/data/device'
+import { getBaseInfo, getDeptExpire, getDeviceMaintain, getDeviceStatus, getDeviceType, getStandardDeviceType, getTraceAnalyse, } from '@/api/dataManagement/data/device'
 const props = defineProps({
   lab: {
     type: String,
@@ -30,15 +22,12 @@
 const year = ref('') // 年度
 const yearList = ref<string[]>([])
 
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -86,6 +75,8 @@
     data: [],
     smooth: false,
     gradient: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备类型分析',
@@ -95,6 +86,8 @@
     labelPosition: 'outside',
     radius: '70%',
     data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '标准设备种类分析',
@@ -113,11 +106,15 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备状态分析',
     type: 'bar-vertical',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备维护保养情况',
@@ -159,39 +156,43 @@
         width: '95',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备溯源分析',
     type: 'bar-horizontal',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then((res) => {
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 近一年部门设备到期趋势
+  const current1 = showChart.value.filter(item => item.name === '近一年部门设备到期趋势')[0]
+  current1.loading = true
   getDeptExpire(searchQueryResult.value).then((res) => {
-    console.log(res.data, '近一年部门设备到期趋势')
-    const current = showChart.value.filter(
-      item => item.name === '近一年部门设备到期趋势',
-    )[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+    // console.log(res.data, '近一年部门设备到期趋势')
+    current1.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '电学电源组',
@@ -210,15 +211,20 @@
         value: 'glAmount',
       },
     ]
-    current.data = data.map((item: any) => ({
+    current1.data = data.map((item: any) => ({
       name: item.name,
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[item.value])),
     }))
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 设备类型分析
+  const current2 = showChart.value.filter(item => item.name === '设备类型分析')[0]
+  current2.loading = true
   getDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备类型分析')
+    // console.log(res.data, '设备类型分析')
     const data = [
       {
         name: '标准设备',
@@ -236,20 +242,26 @@
         data: '',
       },
     ]
-    const current = showChart.value.filter(
-      item => item.name === '设备类型分析',
-    )[0]
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.loading = false
+    // 判断是否为空
+    if(current2.data.every((item: any) => item.value === '0')) {
+      current2.isEmpty = true
+    }
+    else {
+      current2.isEmpty = false
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 设备状态分析
+  const current3 = showChart.value.filter(item => item.name === '设备状态分析')[0]
+  current3.loading = true
   getDeviceStatus(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备状态分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备状态分析',
-    )[0]
+    // console.log(res.data, '设备状态分析')
     const data = [
       {
         name: '在用',
@@ -280,20 +292,22 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current3.xAxisData = data.map((item: any) => item.name)
+    current3.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 设备溯源分析
+  const current4 = showChart.value.filter(item => item.name === '设备溯源分析')[0]
+  current4.loading = true
   getTraceAnalyse(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备溯源分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备溯源分析',
-    )[0]
+    // console.log(res.data, '设备溯源分析')
     const data = [
       {
         name: '合格',
@@ -314,34 +328,48 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current4.xAxisData = data.map((item: any) => item.name)
+    current4.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current4.loading = false
+    // 判断是否为空
+    if(data.every((item: any) => String(item.data) === '0')) {
+      current4.isEmpty = true
+    }
+    else {
+      current4.isEmpty = false
+    }
+  }).catch(() => {
+    current4.loading = false
   })
   // 标准设备种类分析
+  const current5 = showChart.value.filter(item => item.name === '标准设备种类分析')[0]
+  current5.loading = true
   getStandardDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '标准设备种类分析')
-    const current = showChart.value.filter(
-      item => item.name === '标准设备种类分析',
-    )[0]
-    current.data = []
+    // console.log(res.data, '标准设备种类分析')
+    current5.data = []
     for (const i in res.data) {
-      current.data.push({ name: i, count: res.data[i] })
+      current5.data.push({ name: i, count: res.data[i] })
     }
-    current.data.reverse()
+    current5.data.reverse()
+    current5.loading = false
+  }).catch(() => {
+    current5.loading = false
   })
   // 设备维护保养情况
+  const current6 = showChart.value.filter(item => item.name === '设备维护保养情况')[0]
+  current6.loading = true
   getDeviceMaintain({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then((res) => {
-    console.log(res.data, '设备维护保养情况')
-    const current = showChart.value.filter(
-      item => item.name === '设备维护保养情况',
-    )[0]
-    current.data = []
-    current.data = res.data.rows
+    // console.log(res.data, '设备维护保养情况')
+    current6.data = []
+    current6.data = res.data.rows
+    current6.loading = false
+  }).catch(() => {
+    current6.loading = false
   })
   // loading.value = true
   // // 近一年部门设备到期趋势
@@ -398,19 +426,16 @@
   yearList.value.push(String(currentYear - i))
 }
 
-watch(
-  () => year.value,
-  (newVal) => {
-    if (newVal) {
-      console.log(newVal, '当前年度')
-      searchQueryResult.value.timeStart = `${newVal}-01-01`
-      searchQueryResult.value.timeEnd = `${newVal}-12-31`
-      setTimeout(() => {
-        fetchData()
-      })
-    }
-  },
-)
+watch(() => year.value, (newVal) => {
+  if (newVal) {
+    console.log(newVal, '当前年度')
+    searchQueryResult.value.timeStart = `${newVal}-01-01`
+    searchQueryResult.value.timeEnd = `${newVal}-12-31`
+    setTimeout(() => {
+      fetchData()
+    })
+  }
+})
 onMounted(() => {
   year.value = String(currentYear)
   if (props.lab) {
@@ -427,24 +452,14 @@
     <div class="btns">
       <div />
       <!-- 部门 -->
-      <el-select
-        v-model="year"
-        style="width: 130px;"
-        class="short-input"
-        placeholder="年度"
-      >
-        <el-option
-          v-for="item in yearList"
-          :key="item"
-          :label="item"
-          :value="item"
-        />
+      <el-select v-model="year" style="width: 130px;" class="short-input" placeholder="年度">
+        <el-option v-for="item in yearList" :key="item" :label="item" :value="item" />
       </el-select>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <img :src="item.icon">
@@ -461,156 +476,40 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${'31.5%'}`, }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%;">
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%; display: flex;"
-                >
+                <div class="chart-name" style="width: 100%; height: 10%; display: flex;">
                   {{ element.name }}
-                  <div
-                    v-if="element.name === '人员持证到期趋势'"
-                    style="width: 350px; margin-left: 40px;"
-                  >
-                    <el-date-picker
-                      v-model="datetimerange"
-                      type="daterange"
-                      value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD"
-                      range-separator="至"
-                      start-placeholder="开始时间"
-                      end-placeholder="结束时间"
-                    />
-                  </div>
                 </div>
                 <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-if="element.type === 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <line-chart
-                    v-if="element.type === 'line'"
-                    :colors="colors"
-                    :gradient="element.gradient"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
+                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth"
+                    :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5', }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
+                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :data="element.data"
-                    :smooth="element.smooth"
-                    :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5',
-                    }"
-                  />
-                  <bar-chart-double
-                    v-if="element.type === 'bar-double'"
-                    :legend-data="element.legendData"
-                    :data1="element.data1"
-                    :data2="element.data2"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-vertical
-                    v-if="element.type === 'bar-vertical'"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-horizontal
-                    v-if="element.type === 'bar-horizontal'"
-                    bar-width="10"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-if="element.type === 'rank-table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/eqptDevice.vue b/src/views/dataManagement/components/data/eqptDevice.vue
index 1f1d01c..83a7083 100644
--- a/src/views/dataManagement/components/data/eqptDevice.vue
+++ b/src/views/dataManagement/components/data/eqptDevice.vue
@@ -9,18 +9,7 @@
 import { getDictByCode } from '@/api/system/dict'
 import { exportFile } from '@/utils/exportUtils'
 import { getCustomerInfoList } from '@/api/resource/customer'
-import {
-  getBaseInfo,
-  getNoVerificationAmount,
-  getDeviceSource,
-  getDeviceType,
-  getAlreadyMeasured,
-  getShouldMeasured,
-  getDevicePerformance,
-  exportDeviceType,
-  getDeviceSourceDept,
-  getDeviceTypeList
-} from '@/api/dataManagement/data/eqptDevice'
+import { getBaseInfo, getNoVerificationAmount, getDeviceSource, getDeviceType, getAlreadyMeasured, getShouldMeasured, getDevicePerformance, exportDeviceType, getDeviceSourceDept, getDeviceTypeList } from '@/api/dataManagement/data/eqptDevice'
 import { eqptDevice } from './img'
 const props = defineProps({
   lab: {
@@ -88,40 +77,34 @@
   }
 }
 const timeDate = ref<string[]>([])
-watch(
-  () => current.value,
-  newVal => {
-    if (newVal) {
-      if (newVal === '当日') {
-        timeDate.value = [dayjs().format('YYYY-MM-DD')]
-      } else if (newVal === '近7日') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      } else if (newVal === '近14天') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      }
-      if (!newVal.includes('自定义')) {
-        fetchData()
-        selectCurrentTime.value = []
-      }
+watch(() => current.value, newVal => {
+  if (newVal) {
+    if (newVal === '当日') {
+      timeDate.value = [dayjs().format('YYYY-MM-DD')]
+    } else if (newVal === '近7日') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
+    } else if (newVal === '近14天') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
     }
-  }
-)
-watch(
-  () => selectCurrentTime.value,
-  newVal => {
-    if (newVal.length === 2) {
-      console.log('确定时间')
-      timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    if (!newVal.includes('自定义')) {
       fetchData()
+      selectCurrentTime.value = []
     }
   }
-)
+})
+watch(() => selectCurrentTime.value, newVal => {
+  if (newVal.length === 2) {
+    console.log('确定时间')
+    timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    fetchData()
+  }
+})
 // 公共查询条件
 const searchQueryResult = ref({
   groupCode: '',
@@ -137,13 +120,9 @@
 })
 // 获取受检设备各种类数量分析数据
 const fetchQueryForTypeSoure = () => {
-  getDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
-    const current = showChart.value.filter(
-      item => item.name === '受检设备各种类数量分析'
-    )[0]
+  const current = showChart.value.filter(item => item.name === '受检设备各种类数量分析')[0]
+  current.loading = true
+  getDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     current.data = []
     const data = []
     for (const i in res.data) {
@@ -153,7 +132,16 @@
       })
     }
     current.data = data
-    // console.log(data, 'data 1')
+    current.loading = false
+    // 判断数据是否为空
+    if (current.data.length) {
+      current.isEmpty = false
+    }
+    else {
+      current.isEmpty = true
+    }
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备各种类数量分析 查询条件
@@ -182,16 +170,15 @@
 })
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备已检数量趋势')[0]
+  current.loading = true
   getAlreadyMeasured({
     ...searchQueryResult.value,
     ...searchQueryForMeasured.value,
     timeStart: searchQueryForMeasured.value.timeStart ? searchQueryForMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForMeasured.value.timeEnd ? searchQueryForMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备已检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备已检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备已检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -215,6 +202,9 @@
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备已检数量趋势 查询条件
@@ -242,7 +232,7 @@
   fetchQueryForShouldMeasured()
 })
 const contextmenu = (name: string) => {
-  console.log(name)
+  // console.log(name)
   if (name === '受检设备已检数量趋势') {
     selectForMeasured.value = []
     // fetchQueryForMeasured()
@@ -253,16 +243,15 @@
 }
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForShouldMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备应检数量趋势')[0]
+  current.loading = true
   getShouldMeasured({
     ...searchQueryResult.value,
     ...searchQueryForShouldMeasured.value,
     timeStart: searchQueryForShouldMeasured.value.timeStart ? searchQueryForShouldMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForShouldMeasured.value.timeEnd ? searchQueryForShouldMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备应检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备应检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备应检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -286,21 +275,21 @@
       symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备应检数量趋势 查询条件
 const changeSearchQueryForShouldMeasured = () => {
   fetchQueryForShouldMeasured()
 }
-watch(
-  () => props.lab,
-  newVal => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
+watch(() => props.lab, newVal => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
   }
-)
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -356,7 +345,9 @@
         value: 'count',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备来源分析',
@@ -365,7 +356,9 @@
     center: ['50%', '60%'],
     labelPosition: 'outside',
     radius: '70%',
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备各种类数量分析',
@@ -374,7 +367,9 @@
     // labelPosition: 'outside',
     // radius: '70%',
     center: ['50%', '60%'],
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备已检数量趋势',
@@ -383,7 +378,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备应检数量趋势',
@@ -392,7 +389,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备性能趋势',
@@ -400,12 +399,6 @@
     source: 'system',
     data: [],
     columns: [
-      // {
-      //   text: '序号',
-      //   value: 'index',
-      //   align: 'center',
-      //   width: '70'
-      // },
       {
         text: '设备名称',
         value: 'sampleName',
@@ -441,24 +434,21 @@
         value: 'totalAmount',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   }
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  }
-)
-// 模拟数据
-const loading = ref(false)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+// 获取数据
+const loadingBase = ref(false)
 function fetchData() {
-  console.log(current.value, '当前日期类型---要查询了')
   if (current.value !== '自定义时间') {
-    console.log(timeDate.value, 'timeDate')
     if (current.value === '当日') {
       searchQueryResult.value.timeStart = `${timeDate.value[0]} 00:00:00`
       searchQueryResult.value.timeEnd = `${timeDate.value[0]} 23:59:59`
@@ -469,43 +459,39 @@
   } else {
     searchQueryResult.value.timeStart = `${selectCurrentTime.value[0]} 00:00:00`
     searchQueryResult.value.timeEnd = `${selectCurrentTime.value[1]} 23:59:59`
-    console.log(selectCurrentTime.value, 'selectCurrentTime.value')
   }
-  // searchQueryResult.value.timeStart = `2024-01-01 00:00:00`
-  // searchQueryResult.value.timeEnd = `2024-12-31 23:59:59`
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then(res => {
     baseInfo.value.forEach(item => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 未检定数量分析
+  const current1 = showChart.value.filter(item => item.name === '未检定设备数量分析')[0]
+  current1.loading = true
   getNoVerificationAmount(searchQueryResult.value).then(res => {
-    // console.log(res.data, '未检定数量分析')
-    const current = showChart.value.filter(
-      item => item.name === '未检定设备数量分析'
-    )[0]
-    current.data = []
+    current1.data = []
     for (const i in res.data) {
-      current.data.push({
+      current1.data.push({
         dept: i,
         count: res.data[i]
       })
     }
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 受检设备来源分析
+  const current2 = showChart.value.filter(item => item.name === '受检设备来源分析')[0]
+  current2.loading = true
   getDeviceSource(searchQueryResult.value).then(res => {
-    console.log(res.data, '受检设备来源分析')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备来源分析'
-    )[0]
     const data = []
     for (const i in res.data) {
-      const obj = {
-        name: '',
-        id: '',
-        value: ''
-      }
+      const obj = { name: '', id: '', value: '' }
       obj.name = i
       for (const j in res.data[i]) {
         obj.id = j
@@ -513,8 +499,17 @@
       }
       data.push(obj)
     }
-    current.data = data
-    console.log(data, '受检设备来源分析')
+    current2.data = data
+    current2.loading = false
+    // 判断是否有数据
+    if (current2.data.length) {
+      current2.isEmpty = false
+    }
+    else {
+      current2.isEmpty = true
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 受检设备各种类数量分析
   fetchQueryForTypeSoure()
@@ -523,17 +518,14 @@
   // 受检设备应检数量趋势
   fetchQueryForShouldMeasured()
   // 受检设备性能趋势
-  getDevicePerformance({
-    ...searchQueryResult.value,
-    offset: 1,
-    limit: 9999
-  }).then(res => {
-    console.log(res.data, '受检设备性能趋势')
-    const current = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
-    current.data = res.data.rows.map((item: any, index: number) => ({
-      ...item,
-      index: index + 1
-    }))
+  const current3 = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
+  current3.loading = true
+  getDevicePerformance({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then(res => {
+    // console.log(res.data, '受检设备性能趋势')
+    current3.data = res.data.rows.map((item: any, index: number) => ({ ...item, index: index + 1 }))
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   //
   // loading.value = true
@@ -572,9 +564,7 @@
   //   loading.value = false
   // }, 3000)
 }
-defineExpose({
-  showChart
-})
+defineExpose({ showChart })
 
 // 拖拽结束
 const onEnd = () => {
@@ -614,12 +604,7 @@
     checkDestinationList.value = res.data
   })
   // 获取委托方列表
-  getCustomerInfoList({
-    limit: 9999,
-    offset: 1,
-    approvalStatus: '0',
-    formId: 'zyglwtfml'
-  }).then(res => {
+  getCustomerInfoList({ limit: 9999, offset: 1, approvalStatus: '0', formId: 'zyglwtfml' }).then(res => {
     customerList.value = res.data.rows.map((item: any) => ({
       name: item.customerName,
       id: item.id,
@@ -635,10 +620,7 @@
     text: '下载中请稍后',
     background: 'rgba(255, 255, 255, 0.8)',
   })
-  exportDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
+  exportDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     const blob = new Blob([res.data])
     exportFile(blob, '受检设备种类数量分析.xlsx')
     loading.close()
@@ -652,25 +634,28 @@
 const deviceTypeData = ref({})
 // 点击饼图
 const clickPie = (params: any, ele: any) => {
-  console.log(params, ele, '点击饼图')
+  // console.log(params, ele, '点击饼图')
   const current = showChart.value.filter((item: any) => item.name === ele.name)[0]
+  current.loading = true
   if (ele.name === '受检设备来源分析') {
     deviceSourceData.value = JSON.parse(JSON.stringify(current))
     current.data = []
     getDeviceSourceDept({ ...searchQueryResult.value, customerId: params.data.id }).then(res => {
-      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name}))
+      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name }))
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   else if (ele.name === '受检设备各种类数量分析') {
     deviceTypeData.value = JSON.parse(JSON.stringify(current))
     current.data = []
-    getDeviceTypeList({
-      ...searchQueryResult.value,
-      ...searchQueryForTypeSoure.value,
-      sampleName: params.data.name
-    }).then(res => {
+    getDeviceTypeList({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value, sampleName: params.data.name }).then(res => {
       // console.log(res.data, '123')
       current.data = res.data.rows
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   current.type = 'rank-table'
@@ -729,14 +714,14 @@
         <div style="width: 101px; position: absolute; top: 0; right: 0; opacity: 0">
           <el-date-picker style="width: 101px" ref="dateRef" v-model="selectCurrentTime" type="daterange"
             range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" class="time-daterange"
-            format="YYYY-MM-DD" value-format="YYYY-MM-DD"  @focus="handlerFocus" @blur="handlerBlur" />
+            format="YYYY-MM-DD" value-format="YYYY-MM-DD" @focus="handlerFocus" @blur="handlerBlur" />
         </div>
       </div>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div class="count-item" v-for="item in baseInfo" :key="item.value">
           <div class="header-icon" style="width: 55px">
             <img :src="item.icon" width="55px" height="50px" />
@@ -756,20 +741,15 @@
       <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
         ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div :style="{
-            width: `${'31.5%'}`
-          }" class="chart-item">
+          <div :style="{ width: `${'31.5%'}` }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%">
                 <div class="chart-name"
-                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''" style="
-                    width: 100%;
-                    height: 10%;
-                    display: flex;
-                    margin-top: 25px;" @click="changeTable(element.name)">
+                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''"
+                  style="width: 100%;height: 10%;display: flex;margin-top: 25px;" @click="changeTable(element.name)">
                   {{ element.name }}
                   <div v-if="element.name === '受检设备各种类数量分析'" style="margin-left: 40px">
                     <!-- 部门 -->
@@ -829,73 +809,29 @@
                   </div>
                 </div>
                 <div style="width: 100%; height: 80%">
-                  <pie-chart v-if="element.type === 'pie'" :title="element.title" :show-total="element.showTotal"
-                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition" :radius="element.radius" :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" @clickPie="(params: any) => {
-                      clickPie(params, element)
-                    }" />
-                  <line-chart v-if="element.type === 'line'" :colors="colors" :gradient="element.gradient"
-                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth" :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5'
-                    }" />
-                  <bar-chart-double v-if="element.type === 'bar-double'" :legend-data="element.legendData"
-                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-vertical v-if="element.type === 'bar-vertical'" :bar-coner="0" :data="element.data"
-                    :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal'" bar-width="10" :bar-coner="0"
-                    :data="element.data" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%" :height="300"
-                    :data="element.data" :columns="element.columns" />
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title"
+                    :show-total="element.showTotal" :data="element.data" :colors="colors" :center="element.center"
+                    label-formatter="{style1|{c}}" :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }"
+                    @clickPie="(params: any) => { clickPie(params, element) }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors"
+                    :gradient="element.gradient" :x-axis-data="element.xAxisData" :data="element.data"
+                    :smooth="element.smooth" :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5' }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty"
+                    :legend-data="element.legendData" :data1="element.data1" :data2="element.data2"
+                    :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10"
+                    :bar-coner="0" :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <scroll-table v-if="element.type === 'rank-table' && !element.isEmpty" style="width: 100%"
+                    :height="300" :data="element.data" :columns="element.columns" />
+                  <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/meteringVerification.vue b/src/views/dataManagement/components/data/meteringVerification.vue
index b45246e..7952cd2 100644
--- a/src/views/dataManagement/components/data/meteringVerification.vue
+++ b/src/views/dataManagement/components/data/meteringVerification.vue
@@ -9,13 +9,7 @@
 import { getDictByCode } from '@/api/system/dict'
 import ScrollTable from '@/components/ScrollTable/index.vue'
 // import { getEquipmentList } from '@/api/equipment/info/book'
-import {
-  getAlreadyDeviceRank,
-  getBaseInfo,
-  getDeviceAnalysis,
-  getTimelyAnalysis,
-  getVerificationResult,
-} from '@/api/dataManagement/data/verificationAnalysis'
+import { getAlreadyDeviceRank, getBaseInfo, getDeviceAnalysis, getTimelyAnalysis, getVerificationResult, } from '@/api/dataManagement/data/verificationAnalysis'
 // import { getCompanyList } from '@/api/system/dept'
 import { getCustomerInfoList } from '@/api/resource/customer'
 import { getEquipmentList } from '@/api/business/manager/order'
@@ -26,15 +20,12 @@
     default: '',
   },
 })
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 检定结果分析查询条件
 const searchQueryResult = ref({
   customerId: '',
@@ -47,19 +38,16 @@
   timeStart: '',
 })
 const datetimerange = ref()
-watch(
-  () => datetimerange.value,
-  (newVal) => {
-    searchQueryResult.value.timeStart = ''
-    searchQueryResult.value.timeEnd = ''
-    if (Array.isArray(newVal)) {
-      if (newVal.length) {
-        searchQueryResult.value.timeStart = `${newVal[0]}`
-        searchQueryResult.value.timeEnd = `${newVal[1]}`
-      }
+watch(() => datetimerange.value, (newVal) => {
+  searchQueryResult.value.timeStart = ''
+  searchQueryResult.value.timeEnd = ''
+  if (Array.isArray(newVal)) {
+    if (newVal.length) {
+      searchQueryResult.value.timeStart = `${newVal[0]}`
+      searchQueryResult.value.timeEnd = `${newVal[1]}`
     }
-  },
-)
+  }
+})
 // 实验室
 const labCodeList = ref<dictType[]>([])
 // 部门
@@ -77,6 +65,8 @@
 // 查询检定结果分析
 const searchList = () => {
   // 检定结果分析
+  const current = showChart.value.filter(item => item.name === '检定结果分析')[0]
+  current.loading = true
   getVerificationResult(searchQueryResult.value).then((res) => {
     const data = [
       {
@@ -99,9 +89,6 @@
       item.data = res.data[item.value]
       // item.data = String(Math.floor(Math.random() * 100) + 1)
     })
-    const current = showChart.value.filter(
-      item => item.name === '检定结果分析',
-    )[0]
     current.data = [
       {
         name: '数量',
@@ -116,6 +103,9 @@
     else {
       current.isEmpty = false
     }
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 重置查询
@@ -224,6 +214,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '当年已检设备排行TOP10',
@@ -242,6 +234,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '检定及时分析',
@@ -264,6 +258,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '检定结果分析',
@@ -273,28 +269,33 @@
     data: [],
     smooth: false,
     gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 ])
 
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
-const loading = ref(false)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo({ labCode: props.lab }).then((res) => {
     console.log(res.data, '获取基础数据')
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 在检设备分析
+  const current1 = showChart.value.filter(item => item.name === '在检设备分析')[0]
+  current1.loading = true
   getDeviceAnalysis({ labCode: props.lab }).then((res) => {
     const data = [
       {
@@ -326,25 +327,36 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    const current = showChart.value.filter(
-      item => item.name === '在检设备分析',
-    )[0]
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    current1.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current1.loading = false
+    // 判断是否为空
+    if(current1.data.every((item: any)=> item.value === '0')) {
+      current1.isEmpty = true
+    }
+    else {
+      current1.isEmpty = false
+    }
+  }).catch(() => {
+    current1.loading = false
   })
   // 当年已检设备排行
+  const current2 = showChart.value.filter(item => item.name === '当年已检设备排行TOP10')[0]
+  current2.loading = true
   getAlreadyDeviceRank({ labCode: props.lab }).then((res) => {
-    const current = showChart.value.filter(
-      item => item.name === '当年已检设备排行TOP10',
-    )[0]
-    current.data = []
+    current2.data = []
     for (const i in res.data) {
-      current.data.push({
+      current2.data.push({
         name: i,
         count: res.data[i],
       })
     }
+    current2.loading = false
+  }).catch(() => {
+    current2.loading = false
   })
   // 检定及时分析
+  const current3 = showChart.value.filter(item => item.name === '检定及时分析')[0]
+  current3.loading = true
   getTimelyAnalysis({ labCode: props.lab }).then((res) => {
     const data = [
       {
@@ -363,13 +375,18 @@
         data: '',
       },
     ]
-    data.forEach((item) => {
-      item.data = res.data[item.value]
-    })
-    const current = showChart.value.filter(
-      item => item.name === '检定及时分析',
-    )[0]
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    data.forEach((item) => { item.data = res.data[item.value] })
+    current3.data = data.map(item => ({ name: item.name, value: String(item.data )}))
+    // 判断是否为空
+    if(current3.data.every((item: any)=> item.value === '0')) {
+      current3.isEmpty = true
+    }
+    else {
+      current3.isEmpty = false
+    }
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 检定结果分析
   searchList()
@@ -379,12 +396,7 @@
 })
 // 获取委托方列表
 const fetchCompanyList = () => {
-  getCustomerInfoList({
-    limit: 9999,
-    offset: 1,
-    approvalStatus: '0',
-    formId: 'zyglwtfml',
-  }).then((res) => {
+  getCustomerInfoList({ limit: 9999, offset: 1, approvalStatus: '0', formId: 'zyglwtfml' }).then((res) => {
     customerList.value = res.data.rows.map((item: any) => ({
       name: item.customerName,
       id: item.id,
@@ -395,22 +407,10 @@
 fetchCompanyList()
 // 获取受检设备
 const fetchDevice = () => {
-  getEquipmentList({
-    customerId: searchQueryResult.value.customerId,
-    equipmentType: '1',
-    offset: 1,
-    limit: 9999,
-  }).then((res) => {
-    console.log(res.data, '受检设备')
+  getEquipmentList({ customerId: searchQueryResult.value.customerId, equipmentType: '1', offset: 1, limit: 9999 }).then((res) => {
+    // console.log(res.data, '受检设备')
     allDeviceList.value = res.data.rows
-    sampleNameList.value = uniqueMultiArray(
-      res.data.rows.map((item: any) => ({
-        sampleName: item.equipmentName,
-        model: item.model,
-        helpInstruction: item.helpInstruction,
-      })),
-      'sampleName',
-    )
+    sampleNameList.value = uniqueMultiArray(res.data.rows.map((item: any) => ({ sampleName: item.equipmentName, model: item.model, helpInstruction: item.helpInstruction, })), 'sampleName',)
   })
 }
 fetchDevice()
@@ -430,32 +430,21 @@
 }
 // 改变设备名称查询条件
 const changeSampleName = (value: string) => {
-  console.log(value, '设备名称')
+  // console.log(value, '设备名称')
   modelList.value = []
   helpInstructionList.value = []
   searchQueryResult.value.model = ''
   searchQueryResult.value.helpInstruction = ''
-  modelList.value = uniqueMultiArray(
-    allDeviceList.value
-      .filter((item: any) => item.equipmentName === value)
-      .map((item: any) => ({
-        sampleName: item.equipmentName,
-        model: item.model,
-        helpInstruction: item.helpInstruction,
-      })),
-    'model',
-  )
+  modelList.value = uniqueMultiArray(allDeviceList.value.filter((item: any) => item.equipmentName === value).map((item: any) => ({ sampleName: item.equipmentName, model: item.model, helpInstruction: item.helpInstruction, })), 'model',)
   helpInstructionList.value = modelList.value
-  console.log(modelList.value, 'modelList.value')
+  // console.log(modelList.value, 'modelList.value')
 }
 // 改变规格型号查询条件
 const changeHelpInstruction = (value: string) => {
-  console.log(value, '规格型号')
+  // console.log(value, '规格型号')
   helpInstructionList.value = []
   searchQueryResult.value.helpInstruction = ''
-  helpInstructionList.value = modelList.value.filter(
-    item => item.model === value,
-  )
+  helpInstructionList.value = modelList.value.filter(item => item.model === value)
 }
 // 拖拽结束
 const onEnd = () => {
@@ -474,7 +463,7 @@
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <!-- <svg-icon name="icon-env-device-online" class="icon-button-icon" /> -->
@@ -492,265 +481,104 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                showChart.length === 4
-                  ? '48%'
-                  : index === 0 || index === 1
-                    ? '48%'
-                    : '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${showChart.length === 4 ? '48%' : index === 0 || index === 1 ? '48%' : '31.5%'}` }"
+            class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
-              <div
-                v-if="element.type === 'pie'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+            <div v-loading="element.loading" class="chart-page">
+              <div v-if="element.type === 'pie'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
-                <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-show="element.showType == 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-show="element.showType == 'table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" />
+                <div v-show="!element.isEmpty" style="width: 100%; height: 90%;">
+                  <pie-chart v-show="element.showType == 'pie'" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-show="element.showType == 'table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
                 </div>
               </div>
-              <div
-                v-if="element.type === 'rank-table'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+              <div v-if="element.type === 'rank-table'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
+                <!-- <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" /> -->
                 <div style="width: 100%; height: 90%;">
-                  <scroll-table
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                  <scroll-table style="width: 100%;" :height="300" :data="element.data" :columns="element.columns" />
                 </div>
               </div>
-              <div
-                v-if="element.type === 'bar-horizontal'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+              <div v-if="element.type === 'bar-horizontal'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
                 <!-- 查询条件 -->
-                <search-area
-                  :need-clear="true"
-                  @search="searchList"
-                  @clear="clearList"
-                >
+                <search-area :need-clear="true" @search="searchList" @clear="clearList">
                   <!-- 实验室 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.labCode"
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="实验室"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in labCodeList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.labCode" style="width: 130px;" class="short-input"
+                      placeholder="实验室" clearable>
+                      <el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 部门 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.groupCode"
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="部门"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in groupCodeList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.groupCode" style="width: 130px;" class="short-input"
+                      placeholder="部门" clearable>
+                      <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 委托方 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.customerId"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="委托方"
-                      clearable
-                      @change="changeCustomer"
-                    >
-                      <el-option
-                        v-for="item in customerList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.customerId" filterable style="width: 130px;"
+                      class="short-input" placeholder="委托方" clearable @change="changeCustomer">
+                      <el-option v-for="item in customerList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 受检设备名称 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.sampleName"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="受检设备名称"
-                      clearable
-                      @change="changeSampleName"
-                    >
-                      <el-option
-                        v-for="item in sampleNameList"
-                        :key="item.sampleName"
-                        :label="item.sampleName"
-                        :value="item.sampleName"
-                      />
+                    <el-select v-model="searchQueryResult.sampleName" filterable style="width: 130px;"
+                      class="short-input" placeholder="受检设备名称" clearable @change="changeSampleName">
+                      <el-option v-for="item in sampleNameList" :key="item.sampleName" :label="item.sampleName"
+                        :value="item.sampleName" />
                     </el-select>
                   </search-item>
                   <!-- 规格型号 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.model"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="规格型号"
-                      clearable
-                      @change="changeHelpInstruction"
-                    >
-                      <el-option
-                        v-for="item in modelList"
-                        :key="item.model"
-                        :label="item.model"
-                        :value="item.model"
-                      />
+                    <el-select v-model="searchQueryResult.model" filterable style="width: 130px;" class="short-input"
+                      placeholder="规格型号" clearable @change="changeHelpInstruction">
+                      <el-option v-for="item in modelList" :key="item.model" :label="item.model" :value="item.model" />
                     </el-select>
                   </search-item>
                   <!-- 辅助字段 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.helpInstruction"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="辅助字段"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in helpInstructionList"
-                        :key="item.helpInstruction"
-                        :label="item.helpInstruction"
-                        :value="item.helpInstruction"
-                      />
+                    <el-select v-model="searchQueryResult.helpInstruction" filterable style="width: 130px;"
+                      class="short-input" placeholder="辅助字段" clearable>
+                      <el-option v-for="item in helpInstructionList" :key="item.helpInstruction"
+                        :label="item.helpInstruction" :value="item.helpInstruction" />
                     </el-select>
                   </search-item>
                   <!-- 时间 -->
                   <search-item>
                     <div style="width: 350px !important;">
-                      <el-date-picker
-                        v-model="datetimerange"
-                        type="daterange"
-                        value-format="YYYY-MM-DD"
-                        format="YYYY-MM-DD"
-                        range-separator="至"
-                        start-placeholder="检定开始时间"
-                        end-placeholder="检定结束时间"
-                        clearable
-                      />
+                      <el-date-picker v-model="datetimerange" type="daterange" value-format="YYYY-MM-DD"
+                        format="YYYY-MM-DD" range-separator="至" start-placeholder="检定开始时间" end-placeholder="检定结束时间"
+                        clearable />
                     </div>
                   </search-item>
                 </search-area>
                 <div style="width: 100%; height: 70%;">
-                  <el-empty
-                    v-show="element.isEmpty"
-                    :image-size="100"
-                    description="暂无数据"
-                  />
-                  <bar-chart-horizontal
-                    v-show="!element.isEmpty"
-                    bar-width="30"
-                    :bar-coner="0"
-                    :data="element.data"
+                  <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" />
+                  <bar-chart-horizontal v-show="!element.isEmpty" bar-width="25" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }"
+                    :grid="{ top: 20, left: 20, right: 60, bottom: 30, containLabel: true, }"/>
                 </div>
               </div>
               <!--  -->
diff --git a/src/views/dataManagement/components/data/resourceManage.vue b/src/views/dataManagement/components/data/resourceManage.vue
index a1f2fb0..907ce29 100644
--- a/src/views/dataManagement/components/data/resourceManage.vue
+++ b/src/views/dataManagement/components/data/resourceManage.vue
@@ -6,13 +6,7 @@
 import { resourceManage } from './img'
 import type { deptType, dictType } from '@/global'
 import { getRangeAllTime } from '@/utils/date'
-import {
-  getBaseInfo,
-  getCertDistribute,
-  getCertExpire,
-  getFileCategory,
-  getFileNovelty,
-} from '@/api/dataManagement/data/resourceManagement'
+import { getBaseInfo, getCertDistribute, getCertExpire, getFileCategory, getFileNovelty, } from '@/api/dataManagement/data/resourceManagement'
 import { getDictByCode } from '@/api/system/dict'
 
 const props = defineProps({
@@ -35,19 +29,17 @@
   timeStart: '',
   timeEnd: '',
 })
-watch(
-  () => datetimerange.value,
-  (newVal) => {
-    certDistribute.value.timeStart = ''
-    certDistribute.value.timeEnd = ''
-    if (Array.isArray(newVal)) {
-      if (newVal.length) {
-        certDistribute.value.timeStart = `${newVal[0]}`
-        certDistribute.value.timeEnd = `${newVal[1]}`
-      }
+watch(() => datetimerange.value, (newVal) => {
+  certDistribute.value.timeStart = ''
+  certDistribute.value.timeEnd = ''
+  if (Array.isArray(newVal)) {
+    if (newVal.length) {
+      certDistribute.value.timeStart = `${newVal[0]}`
+      certDistribute.value.timeEnd = `${newVal[1]}`
+      fetchPerson()
     }
-  },
-)
+  }
+})
 // 部门
 const groupCodeList = ref<dictType[]>([])
 // 基础信息展示数据
@@ -57,53 +49,50 @@
     value: 'staffAmount',
     data: '',
     icon: resourceManage['人员总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '体系文件总数',
     value: 'systemFileAmount',
     data: '',
     icon: resourceManage['体系文件总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '测试校准检定方法总数',
     value: 'techniqueFileAmount',
     data: '',
     icon: resourceManage['测试校准检定方法总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '在用软件总数',
     value: 'softwareAmount',
     data: '',
     icon: resourceManage['在用软件总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '合格供方总数',
     value: 'supplierAmount',
     data: '',
     icon: resourceManage['合格供方总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '委托方总数',
     value: 'customerAmount',
     data: '',
     icon: resourceManage['委托方总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
 ])
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 const showChart = ref<any[]>([
   {
     name: '人员持证到期趋势',
@@ -113,6 +102,8 @@
     data: [],
     smooth: false,
     gradient: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '人员证书分布',
@@ -122,6 +113,8 @@
     xAxisData: [],
     data1: [],
     data2: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '体系文件分类',
@@ -132,63 +125,91 @@
     radius: ['60%', '45%'],
     title: ' ',
     showTotal: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '测试校准检定方法查新分析',
     type: 'bar-vertical',
     source: 'bar',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+// 人员持证到期趋势
+const fetchPerson = () => {
+  // 人员持证到期趋势
+  const current1 = showChart.value.filter(item => item.name === '人员持证到期趋势')[0]
+  current1.loading = true
+  getCertExpire({ ...searchQueryResult.value, ...certDistribute.value }).then((res) => {
+    // console.log(res.data, '人员持证到期趋势')
+    current1.data = [
+      {
+        name: '人员证书到期数量',
+        symbol: 'emptyCircle',
+        data: res.data.map((item: any) => String(item.certExpireAmount)),
+      },
+    ]
+    current1.xAxisData = res.data.map((item: any) => `${item.year}第${item.quarter}季度`)
+    current1.loading = false
+    // 判断是否为空
+    if(!res.data || !res.data.length) {
+      current1.isEmpty = true
+    }
+    else {
+      current1.isEmpty = false
+    }
+  }).catch(() => {
+    current1.loading = false
+  })
+}
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础信息
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then((res) => {
-    console.log(res.data, '基础信息')
+    // console.log(res.data, '基础信息')
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 人员持证到期趋势
-  getCertExpire({ ...searchQueryResult.value, ...certDistribute.value }).then(
-    (res) => {
-      console.log(res.data, '人员持证到期趋势')
-      const current = showChart.value.filter(
-        item => item.name === '人员持证到期趋势',
-      )[0]
-      current.data = [
-        {
-          name: '人员证书到期数量',
-          symbol: 'emptyCircle',
-          data: res.data.map((item: any) => String(item.certExpireAmount)),
-        },
-      ]
-      current.xAxisData = res.data.map((item: any) => `${item.year}第${item.quarter}季度`)
-    },
-  )
+  fetchPerson()
   // 人员证书分布
+  const current2 = showChart.value.filter(item => item.name === '人员证书分布')[0]
+  current2.loading = true
   getCertDistribute(searchQueryResult.value).then((res) => {
-    console.log(res.data, '人员证书分布')
-    const current = showChart.value.filter(
-      item => item.name === '人员证书分布',
-    )[0]
-    current.legendData = ['证书总数', '有效证书总数']
-    current.xAxisData = res.data.map((item: any) => item.certTypeName)
-    current.data1 = res.data.map((item: any) => String(item.totalAmount))
-    current.data2 = res.data.map((item: any) => String(item.validAmount))
+    // console.log(res.data, '人员证书分布')
+    current2.legendData = ['证书总数', '有效证书总数']
+    current2.xAxisData = res.data.map((item: any) => item.certTypeName)
+    current2.data1 = res.data.map((item: any) => String(item.totalAmount))
+    current2.data2 = res.data.map((item: any) => String(item.validAmount))
+    current2.loading = false
+    // 判断是否为空
+    if(current2.data1.every((item: any) => item === '0') && current2.data2.every((item: any) => item === '0')) {
+      current2.isEmpty = true
+    }
+    else {
+      current2.isEmpty = false
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 体系文件分类
+  const current3 = showChart.value.filter(item => item.name === '体系文件分类')[0]
+  current3.loading = true
   getFileCategory(searchQueryResult.value).then((res) => {
-    console.log(res.data, '体系文件分类')
+    // console.log(res.data, '体系文件分类')
     const data = [
       {
         name: '质量手册',
@@ -211,22 +232,28 @@
         data: '',
       },
     ]
-    const current = showChart.value.filter(
-      item => item.name === '体系文件分类',
-    )[0]
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    current3.data = data.map(item => ({ name: item.name, value: item.data }))
+    current3.loading = false
+    // 判断是否为空
+    if(current3.data.every((item: any) => String(item.value) === '0')) {
+      current3.isEmpty = true
+    }
+    else {
+      current3.isEmpty = false
+    }
+  }).catch(() => {
+    current3.loading = false
   })
   // 测试校准检定方法查新分析
+  const current4 = showChart.value.filter(item => item.name === '测试校准检定方法查新分析')[0]
+  current4.loading = true
   getFileNovelty(searchQueryResult.value).then((res) => {
-    console.log(res.data, '测试校准检定方法查新分析')
-    const current = showChart.value.filter(
-      item => item.name === '测试校准检定方法查新分析',
-    )[0]
-    current.xAxisData = res.data.map((item: any) => item.groupCodeName)
-    current.data = [
+    // console.log(res.data, '测试校准检定方法查新分析')
+    current4.xAxisData = res.data.map((item: any) => item.groupCodeName)
+    current4.data = [
       {
         name: '有查新',
         data: res.data.map((item: any) => String(item.haveNovelty)),
@@ -236,6 +263,16 @@
         data: res.data.map((item: any) => String(item.noNovelty)),
       },
     ]
+    current4.loading = false
+    // 判断是否为空
+    if(res.data.map((item: any) => String(item.haveNovelty)).every((item: any) => item ==='0') && res.data.map((item: any) => String(item.noNovelty)).every((item: any) => item ==='0')) {
+      current4.isEmpty = true
+    }
+    else {
+      current4.isEmpty = false
+    }
+  }).catch(() => {
+    current4.loading = false
   })
   // loading.value = true
   // // 人员持证到期趋势
@@ -291,11 +328,7 @@
 }
 onMounted(() => {
   if (props.lab) {
-    datetimerange.value = [
-      // dayjs().subtract(6, 'month').format('YYYY-MM-DD'),
-      `${new Date().getFullYear()}-01-01`,
-      dayjs().format('YYYY-MM-DD'),
-    ]
+    datetimerange.value = [`${new Date().getFullYear()}-01-01`, dayjs().format('YYYY-MM-DD')]
     searchQueryResult.value.labCode = props.lab
     // 部门
     getDictByCode('bizGroupCode').then((response) => {
@@ -325,25 +358,15 @@
     <div class="btns">
       <div />
       <!-- 部门 -->
-      <el-select
-        v-model="searchQueryResult.groupCode"
-        style="width: 130px;"
-        class="short-input"
-        placeholder="部门"
-        clearable
-      >
-        <el-option
-          v-for="item in groupCodeList"
-          :key="item.id"
-          :label="item.name"
-          :value="item.value"
-        />
+      <el-select v-model="searchQueryResult.groupCode" style="width: 130px;" class="short-input" placeholder="部门"
+        clearable>
+        <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
       </el-select>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <img :src="item.icon">
@@ -360,160 +383,45 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                showChart.length === 4
-                  ? '48%'
-                  : index === 0 || index === 1
-                    ? '48%'
-                    : '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${showChart.length === 4 ? '48%' : index === 0 || index === 1 ? '48%' : '31.5%'}`, }"
+            class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%;">
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%; display: flex;"
-                >
+                <div class="chart-name" style="width: 100%; height: 10%; display: flex;">
                   {{ element.name }}
-                  <div
-                    v-if="element.name === '人员持证到期趋势'"
-                    style="width: 350px; margin-left: 40px;"
-                  >
-                    <el-date-picker
-                      v-model="datetimerange"
-                      type="daterange"
-                      value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD"
-                      range-separator="至"
-                      start-placeholder="开始时间"
-                      end-placeholder="结束时间"
-                    />
+                  <div v-if="element.name === '人员持证到期趋势'" style="width: 350px; margin-left: 40px;">
+                    <el-date-picker v-model="datetimerange" type="daterange" value-format="YYYY-MM-DD"
+                      format="YYYY-MM-DD" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" />
                   </div>
                 </div>
                 <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-if="element.type === 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <line-chart
-                    v-if="element.type === 'line'"
-                    :colors="colors"
-                    :gradient="element.gradient"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
+                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth"
+                    :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5', }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
+                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :data="element.data"
-                    :smooth="element.smooth"
-                    :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5',
-                    }"
-                  />
-                  <bar-chart-double
-                    v-if="element.type === 'bar-double'"
-                    :legend-data="element.legendData"
-                    :data1="element.data1"
-                    :data2="element.data2"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-vertical
-                    v-if="element.type === 'bar-vertical'"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-horizontal
-                    v-if="element.type === 'bar-horizontal'"
-                    bar-width="10"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-if="element.type === 'rank-table'"
-                    style="width: 100%;"
-                    :height="330"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%;" :height="330"
+                    :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>

diff --git a/src/views/dataManagement/components/data/device.vue b/src/views/dataManagement/components/data/device.vue
index 9897df1..23efd69 100644
--- a/src/views/dataManagement/components/data/device.vue
+++ b/src/views/dataManagement/components/data/device.vue
@@ -5,15 +5,7 @@
 import { colors } from '../environment/colors'
 import { device } from './img'
 import { getRangeAllTime } from '@/utils/date'
-import {
-  getBaseInfo,
-  getDeptExpire,
-  getDeviceMaintain,
-  getDeviceStatus,
-  getDeviceType,
-  getStandardDeviceType,
-  getTraceAnalyse,
-} from '@/api/dataManagement/data/device'
+import { getBaseInfo, getDeptExpire, getDeviceMaintain, getDeviceStatus, getDeviceType, getStandardDeviceType, getTraceAnalyse, } from '@/api/dataManagement/data/device'
 const props = defineProps({
   lab: {
     type: String,
@@ -30,15 +22,12 @@
 const year = ref('') // 年度
 const yearList = ref<string[]>([])
 
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -86,6 +75,8 @@
     data: [],
     smooth: false,
     gradient: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备类型分析',
@@ -95,6 +86,8 @@
     labelPosition: 'outside',
     radius: '70%',
     data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '标准设备种类分析',
@@ -113,11 +106,15 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备状态分析',
     type: 'bar-vertical',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备维护保养情况',
@@ -159,39 +156,43 @@
         width: '95',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备溯源分析',
     type: 'bar-horizontal',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then((res) => {
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 近一年部门设备到期趋势
+  const current1 = showChart.value.filter(item => item.name === '近一年部门设备到期趋势')[0]
+  current1.loading = true
   getDeptExpire(searchQueryResult.value).then((res) => {
-    console.log(res.data, '近一年部门设备到期趋势')
-    const current = showChart.value.filter(
-      item => item.name === '近一年部门设备到期趋势',
-    )[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+    // console.log(res.data, '近一年部门设备到期趋势')
+    current1.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '电学电源组',
@@ -210,15 +211,20 @@
         value: 'glAmount',
       },
     ]
-    current.data = data.map((item: any) => ({
+    current1.data = data.map((item: any) => ({
       name: item.name,
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[item.value])),
     }))
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 设备类型分析
+  const current2 = showChart.value.filter(item => item.name === '设备类型分析')[0]
+  current2.loading = true
   getDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备类型分析')
+    // console.log(res.data, '设备类型分析')
     const data = [
       {
         name: '标准设备',
@@ -236,20 +242,26 @@
         data: '',
       },
     ]
-    const current = showChart.value.filter(
-      item => item.name === '设备类型分析',
-    )[0]
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.loading = false
+    // 判断是否为空
+    if(current2.data.every((item: any) => item.value === '0')) {
+      current2.isEmpty = true
+    }
+    else {
+      current2.isEmpty = false
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 设备状态分析
+  const current3 = showChart.value.filter(item => item.name === '设备状态分析')[0]
+  current3.loading = true
   getDeviceStatus(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备状态分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备状态分析',
-    )[0]
+    // console.log(res.data, '设备状态分析')
     const data = [
       {
         name: '在用',
@@ -280,20 +292,22 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current3.xAxisData = data.map((item: any) => item.name)
+    current3.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 设备溯源分析
+  const current4 = showChart.value.filter(item => item.name === '设备溯源分析')[0]
+  current4.loading = true
   getTraceAnalyse(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备溯源分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备溯源分析',
-    )[0]
+    // console.log(res.data, '设备溯源分析')
     const data = [
       {
         name: '合格',
@@ -314,34 +328,48 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current4.xAxisData = data.map((item: any) => item.name)
+    current4.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current4.loading = false
+    // 判断是否为空
+    if(data.every((item: any) => String(item.data) === '0')) {
+      current4.isEmpty = true
+    }
+    else {
+      current4.isEmpty = false
+    }
+  }).catch(() => {
+    current4.loading = false
   })
   // 标准设备种类分析
+  const current5 = showChart.value.filter(item => item.name === '标准设备种类分析')[0]
+  current5.loading = true
   getStandardDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '标准设备种类分析')
-    const current = showChart.value.filter(
-      item => item.name === '标准设备种类分析',
-    )[0]
-    current.data = []
+    // console.log(res.data, '标准设备种类分析')
+    current5.data = []
     for (const i in res.data) {
-      current.data.push({ name: i, count: res.data[i] })
+      current5.data.push({ name: i, count: res.data[i] })
     }
-    current.data.reverse()
+    current5.data.reverse()
+    current5.loading = false
+  }).catch(() => {
+    current5.loading = false
   })
   // 设备维护保养情况
+  const current6 = showChart.value.filter(item => item.name === '设备维护保养情况')[0]
+  current6.loading = true
   getDeviceMaintain({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then((res) => {
-    console.log(res.data, '设备维护保养情况')
-    const current = showChart.value.filter(
-      item => item.name === '设备维护保养情况',
-    )[0]
-    current.data = []
-    current.data = res.data.rows
+    // console.log(res.data, '设备维护保养情况')
+    current6.data = []
+    current6.data = res.data.rows
+    current6.loading = false
+  }).catch(() => {
+    current6.loading = false
   })
   // loading.value = true
   // // 近一年部门设备到期趋势
@@ -398,19 +426,16 @@
   yearList.value.push(String(currentYear - i))
 }
 
-watch(
-  () => year.value,
-  (newVal) => {
-    if (newVal) {
-      console.log(newVal, '当前年度')
-      searchQueryResult.value.timeStart = `${newVal}-01-01`
-      searchQueryResult.value.timeEnd = `${newVal}-12-31`
-      setTimeout(() => {
-        fetchData()
-      })
-    }
-  },
-)
+watch(() => year.value, (newVal) => {
+  if (newVal) {
+    console.log(newVal, '当前年度')
+    searchQueryResult.value.timeStart = `${newVal}-01-01`
+    searchQueryResult.value.timeEnd = `${newVal}-12-31`
+    setTimeout(() => {
+      fetchData()
+    })
+  }
+})
 onMounted(() => {
   year.value = String(currentYear)
   if (props.lab) {
@@ -427,24 +452,14 @@
     <div class="btns">
       <div />
       <!-- 部门 -->
-      <el-select
-        v-model="year"
-        style="width: 130px;"
-        class="short-input"
-        placeholder="年度"
-      >
-        <el-option
-          v-for="item in yearList"
-          :key="item"
-          :label="item"
-          :value="item"
-        />
+      <el-select v-model="year" style="width: 130px;" class="short-input" placeholder="年度">
+        <el-option v-for="item in yearList" :key="item" :label="item" :value="item" />
       </el-select>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <img :src="item.icon">
@@ -461,156 +476,40 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${'31.5%'}`, }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%;">
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%; display: flex;"
-                >
+                <div class="chart-name" style="width: 100%; height: 10%; display: flex;">
                   {{ element.name }}
-                  <div
-                    v-if="element.name === '人员持证到期趋势'"
-                    style="width: 350px; margin-left: 40px;"
-                  >
-                    <el-date-picker
-                      v-model="datetimerange"
-                      type="daterange"
-                      value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD"
-                      range-separator="至"
-                      start-placeholder="开始时间"
-                      end-placeholder="结束时间"
-                    />
-                  </div>
                 </div>
                 <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-if="element.type === 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <line-chart
-                    v-if="element.type === 'line'"
-                    :colors="colors"
-                    :gradient="element.gradient"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
+                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth"
+                    :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5', }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
+                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :data="element.data"
-                    :smooth="element.smooth"
-                    :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5',
-                    }"
-                  />
-                  <bar-chart-double
-                    v-if="element.type === 'bar-double'"
-                    :legend-data="element.legendData"
-                    :data1="element.data1"
-                    :data2="element.data2"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-vertical
-                    v-if="element.type === 'bar-vertical'"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-horizontal
-                    v-if="element.type === 'bar-horizontal'"
-                    bar-width="10"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-if="element.type === 'rank-table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/eqptDevice.vue b/src/views/dataManagement/components/data/eqptDevice.vue
index 1f1d01c..83a7083 100644
--- a/src/views/dataManagement/components/data/eqptDevice.vue
+++ b/src/views/dataManagement/components/data/eqptDevice.vue
@@ -9,18 +9,7 @@
 import { getDictByCode } from '@/api/system/dict'
 import { exportFile } from '@/utils/exportUtils'
 import { getCustomerInfoList } from '@/api/resource/customer'
-import {
-  getBaseInfo,
-  getNoVerificationAmount,
-  getDeviceSource,
-  getDeviceType,
-  getAlreadyMeasured,
-  getShouldMeasured,
-  getDevicePerformance,
-  exportDeviceType,
-  getDeviceSourceDept,
-  getDeviceTypeList
-} from '@/api/dataManagement/data/eqptDevice'
+import { getBaseInfo, getNoVerificationAmount, getDeviceSource, getDeviceType, getAlreadyMeasured, getShouldMeasured, getDevicePerformance, exportDeviceType, getDeviceSourceDept, getDeviceTypeList } from '@/api/dataManagement/data/eqptDevice'
 import { eqptDevice } from './img'
 const props = defineProps({
   lab: {
@@ -88,40 +77,34 @@
   }
 }
 const timeDate = ref<string[]>([])
-watch(
-  () => current.value,
-  newVal => {
-    if (newVal) {
-      if (newVal === '当日') {
-        timeDate.value = [dayjs().format('YYYY-MM-DD')]
-      } else if (newVal === '近7日') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      } else if (newVal === '近14天') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      }
-      if (!newVal.includes('自定义')) {
-        fetchData()
-        selectCurrentTime.value = []
-      }
+watch(() => current.value, newVal => {
+  if (newVal) {
+    if (newVal === '当日') {
+      timeDate.value = [dayjs().format('YYYY-MM-DD')]
+    } else if (newVal === '近7日') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
+    } else if (newVal === '近14天') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
     }
-  }
-)
-watch(
-  () => selectCurrentTime.value,
-  newVal => {
-    if (newVal.length === 2) {
-      console.log('确定时间')
-      timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    if (!newVal.includes('自定义')) {
       fetchData()
+      selectCurrentTime.value = []
     }
   }
-)
+})
+watch(() => selectCurrentTime.value, newVal => {
+  if (newVal.length === 2) {
+    console.log('确定时间')
+    timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    fetchData()
+  }
+})
 // 公共查询条件
 const searchQueryResult = ref({
   groupCode: '',
@@ -137,13 +120,9 @@
 })
 // 获取受检设备各种类数量分析数据
 const fetchQueryForTypeSoure = () => {
-  getDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
-    const current = showChart.value.filter(
-      item => item.name === '受检设备各种类数量分析'
-    )[0]
+  const current = showChart.value.filter(item => item.name === '受检设备各种类数量分析')[0]
+  current.loading = true
+  getDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     current.data = []
     const data = []
     for (const i in res.data) {
@@ -153,7 +132,16 @@
       })
     }
     current.data = data
-    // console.log(data, 'data 1')
+    current.loading = false
+    // 判断数据是否为空
+    if (current.data.length) {
+      current.isEmpty = false
+    }
+    else {
+      current.isEmpty = true
+    }
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备各种类数量分析 查询条件
@@ -182,16 +170,15 @@
 })
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备已检数量趋势')[0]
+  current.loading = true
   getAlreadyMeasured({
     ...searchQueryResult.value,
     ...searchQueryForMeasured.value,
     timeStart: searchQueryForMeasured.value.timeStart ? searchQueryForMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForMeasured.value.timeEnd ? searchQueryForMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备已检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备已检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备已检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -215,6 +202,9 @@
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备已检数量趋势 查询条件
@@ -242,7 +232,7 @@
   fetchQueryForShouldMeasured()
 })
 const contextmenu = (name: string) => {
-  console.log(name)
+  // console.log(name)
   if (name === '受检设备已检数量趋势') {
     selectForMeasured.value = []
     // fetchQueryForMeasured()
@@ -253,16 +243,15 @@
 }
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForShouldMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备应检数量趋势')[0]
+  current.loading = true
   getShouldMeasured({
     ...searchQueryResult.value,
     ...searchQueryForShouldMeasured.value,
     timeStart: searchQueryForShouldMeasured.value.timeStart ? searchQueryForShouldMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForShouldMeasured.value.timeEnd ? searchQueryForShouldMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备应检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备应检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备应检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -286,21 +275,21 @@
       symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备应检数量趋势 查询条件
 const changeSearchQueryForShouldMeasured = () => {
   fetchQueryForShouldMeasured()
 }
-watch(
-  () => props.lab,
-  newVal => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
+watch(() => props.lab, newVal => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
   }
-)
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -356,7 +345,9 @@
         value: 'count',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备来源分析',
@@ -365,7 +356,9 @@
     center: ['50%', '60%'],
     labelPosition: 'outside',
     radius: '70%',
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备各种类数量分析',
@@ -374,7 +367,9 @@
     // labelPosition: 'outside',
     // radius: '70%',
     center: ['50%', '60%'],
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备已检数量趋势',
@@ -383,7 +378,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备应检数量趋势',
@@ -392,7 +389,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备性能趋势',
@@ -400,12 +399,6 @@
     source: 'system',
     data: [],
     columns: [
-      // {
-      //   text: '序号',
-      //   value: 'index',
-      //   align: 'center',
-      //   width: '70'
-      // },
       {
         text: '设备名称',
         value: 'sampleName',
@@ -441,24 +434,21 @@
         value: 'totalAmount',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   }
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  }
-)
-// 模拟数据
-const loading = ref(false)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+// 获取数据
+const loadingBase = ref(false)
 function fetchData() {
-  console.log(current.value, '当前日期类型---要查询了')
   if (current.value !== '自定义时间') {
-    console.log(timeDate.value, 'timeDate')
     if (current.value === '当日') {
       searchQueryResult.value.timeStart = `${timeDate.value[0]} 00:00:00`
       searchQueryResult.value.timeEnd = `${timeDate.value[0]} 23:59:59`
@@ -469,43 +459,39 @@
   } else {
     searchQueryResult.value.timeStart = `${selectCurrentTime.value[0]} 00:00:00`
     searchQueryResult.value.timeEnd = `${selectCurrentTime.value[1]} 23:59:59`
-    console.log(selectCurrentTime.value, 'selectCurrentTime.value')
   }
-  // searchQueryResult.value.timeStart = `2024-01-01 00:00:00`
-  // searchQueryResult.value.timeEnd = `2024-12-31 23:59:59`
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then(res => {
     baseInfo.value.forEach(item => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 未检定数量分析
+  const current1 = showChart.value.filter(item => item.name === '未检定设备数量分析')[0]
+  current1.loading = true
   getNoVerificationAmount(searchQueryResult.value).then(res => {
-    // console.log(res.data, '未检定数量分析')
-    const current = showChart.value.filter(
-      item => item.name === '未检定设备数量分析'
-    )[0]
-    current.data = []
+    current1.data = []
     for (const i in res.data) {
-      current.data.push({
+      current1.data.push({
         dept: i,
         count: res.data[i]
       })
     }
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 受检设备来源分析
+  const current2 = showChart.value.filter(item => item.name === '受检设备来源分析')[0]
+  current2.loading = true
   getDeviceSource(searchQueryResult.value).then(res => {
-    console.log(res.data, '受检设备来源分析')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备来源分析'
-    )[0]
     const data = []
     for (const i in res.data) {
-      const obj = {
-        name: '',
-        id: '',
-        value: ''
-      }
+      const obj = { name: '', id: '', value: '' }
       obj.name = i
       for (const j in res.data[i]) {
         obj.id = j
@@ -513,8 +499,17 @@
       }
       data.push(obj)
     }
-    current.data = data
-    console.log(data, '受检设备来源分析')
+    current2.data = data
+    current2.loading = false
+    // 判断是否有数据
+    if (current2.data.length) {
+      current2.isEmpty = false
+    }
+    else {
+      current2.isEmpty = true
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 受检设备各种类数量分析
   fetchQueryForTypeSoure()
@@ -523,17 +518,14 @@
   // 受检设备应检数量趋势
   fetchQueryForShouldMeasured()
   // 受检设备性能趋势
-  getDevicePerformance({
-    ...searchQueryResult.value,
-    offset: 1,
-    limit: 9999
-  }).then(res => {
-    console.log(res.data, '受检设备性能趋势')
-    const current = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
-    current.data = res.data.rows.map((item: any, index: number) => ({
-      ...item,
-      index: index + 1
-    }))
+  const current3 = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
+  current3.loading = true
+  getDevicePerformance({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then(res => {
+    // console.log(res.data, '受检设备性能趋势')
+    current3.data = res.data.rows.map((item: any, index: number) => ({ ...item, index: index + 1 }))
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   //
   // loading.value = true
@@ -572,9 +564,7 @@
   //   loading.value = false
   // }, 3000)
 }
-defineExpose({
-  showChart
-})
+defineExpose({ showChart })
 
 // 拖拽结束
 const onEnd = () => {
@@ -614,12 +604,7 @@
     checkDestinationList.value = res.data
   })
   // 获取委托方列表
-  getCustomerInfoList({
-    limit: 9999,
-    offset: 1,
-    approvalStatus: '0',
-    formId: 'zyglwtfml'
-  }).then(res => {
+  getCustomerInfoList({ limit: 9999, offset: 1, approvalStatus: '0', formId: 'zyglwtfml' }).then(res => {
     customerList.value = res.data.rows.map((item: any) => ({
       name: item.customerName,
       id: item.id,
@@ -635,10 +620,7 @@
     text: '下载中请稍后',
     background: 'rgba(255, 255, 255, 0.8)',
   })
-  exportDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
+  exportDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     const blob = new Blob([res.data])
     exportFile(blob, '受检设备种类数量分析.xlsx')
     loading.close()
@@ -652,25 +634,28 @@
 const deviceTypeData = ref({})
 // 点击饼图
 const clickPie = (params: any, ele: any) => {
-  console.log(params, ele, '点击饼图')
+  // console.log(params, ele, '点击饼图')
   const current = showChart.value.filter((item: any) => item.name === ele.name)[0]
+  current.loading = true
   if (ele.name === '受检设备来源分析') {
     deviceSourceData.value = JSON.parse(JSON.stringify(current))
     current.data = []
     getDeviceSourceDept({ ...searchQueryResult.value, customerId: params.data.id }).then(res => {
-      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name}))
+      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name }))
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   else if (ele.name === '受检设备各种类数量分析') {
     deviceTypeData.value = JSON.parse(JSON.stringify(current))
     current.data = []
-    getDeviceTypeList({
-      ...searchQueryResult.value,
-      ...searchQueryForTypeSoure.value,
-      sampleName: params.data.name
-    }).then(res => {
+    getDeviceTypeList({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value, sampleName: params.data.name }).then(res => {
       // console.log(res.data, '123')
       current.data = res.data.rows
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   current.type = 'rank-table'
@@ -729,14 +714,14 @@
         <div style="width: 101px; position: absolute; top: 0; right: 0; opacity: 0">
           <el-date-picker style="width: 101px" ref="dateRef" v-model="selectCurrentTime" type="daterange"
             range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" class="time-daterange"
-            format="YYYY-MM-DD" value-format="YYYY-MM-DD"  @focus="handlerFocus" @blur="handlerBlur" />
+            format="YYYY-MM-DD" value-format="YYYY-MM-DD" @focus="handlerFocus" @blur="handlerBlur" />
         </div>
       </div>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div class="count-item" v-for="item in baseInfo" :key="item.value">
           <div class="header-icon" style="width: 55px">
             <img :src="item.icon" width="55px" height="50px" />
@@ -756,20 +741,15 @@
       <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
         ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div :style="{
-            width: `${'31.5%'}`
-          }" class="chart-item">
+          <div :style="{ width: `${'31.5%'}` }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%">
                 <div class="chart-name"
-                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''" style="
-                    width: 100%;
-                    height: 10%;
-                    display: flex;
-                    margin-top: 25px;" @click="changeTable(element.name)">
+                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''"
+                  style="width: 100%;height: 10%;display: flex;margin-top: 25px;" @click="changeTable(element.name)">
                   {{ element.name }}
                   <div v-if="element.name === '受检设备各种类数量分析'" style="margin-left: 40px">
                     <!-- 部门 -->
@@ -829,73 +809,29 @@
                   </div>
                 </div>
                 <div style="width: 100%; height: 80%">
-                  <pie-chart v-if="element.type === 'pie'" :title="element.title" :show-total="element.showTotal"
-                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition" :radius="element.radius" :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" @clickPie="(params: any) => {
-                      clickPie(params, element)
-                    }" />
-                  <line-chart v-if="element.type === 'line'" :colors="colors" :gradient="element.gradient"
-                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth" :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5'
-                    }" />
-                  <bar-chart-double v-if="element.type === 'bar-double'" :legend-data="element.legendData"
-                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-vertical v-if="element.type === 'bar-vertical'" :bar-coner="0" :data="element.data"
-                    :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal'" bar-width="10" :bar-coner="0"
-                    :data="element.data" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%" :height="300"
-                    :data="element.data" :columns="element.columns" />
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title"
+                    :show-total="element.showTotal" :data="element.data" :colors="colors" :center="element.center"
+                    label-formatter="{style1|{c}}" :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }"
+                    @clickPie="(params: any) => { clickPie(params, element) }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors"
+                    :gradient="element.gradient" :x-axis-data="element.xAxisData" :data="element.data"
+                    :smooth="element.smooth" :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5' }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty"
+                    :legend-data="element.legendData" :data1="element.data1" :data2="element.data2"
+                    :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10"
+                    :bar-coner="0" :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <scroll-table v-if="element.type === 'rank-table' && !element.isEmpty" style="width: 100%"
+                    :height="300" :data="element.data" :columns="element.columns" />
+                  <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/meteringVerification.vue b/src/views/dataManagement/components/data/meteringVerification.vue
index b45246e..7952cd2 100644
--- a/src/views/dataManagement/components/data/meteringVerification.vue
+++ b/src/views/dataManagement/components/data/meteringVerification.vue
@@ -9,13 +9,7 @@
 import { getDictByCode } from '@/api/system/dict'
 import ScrollTable from '@/components/ScrollTable/index.vue'
 // import { getEquipmentList } from '@/api/equipment/info/book'
-import {
-  getAlreadyDeviceRank,
-  getBaseInfo,
-  getDeviceAnalysis,
-  getTimelyAnalysis,
-  getVerificationResult,
-} from '@/api/dataManagement/data/verificationAnalysis'
+import { getAlreadyDeviceRank, getBaseInfo, getDeviceAnalysis, getTimelyAnalysis, getVerificationResult, } from '@/api/dataManagement/data/verificationAnalysis'
 // import { getCompanyList } from '@/api/system/dept'
 import { getCustomerInfoList } from '@/api/resource/customer'
 import { getEquipmentList } from '@/api/business/manager/order'
@@ -26,15 +20,12 @@
     default: '',
   },
 })
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 检定结果分析查询条件
 const searchQueryResult = ref({
   customerId: '',
@@ -47,19 +38,16 @@
   timeStart: '',
 })
 const datetimerange = ref()
-watch(
-  () => datetimerange.value,
-  (newVal) => {
-    searchQueryResult.value.timeStart = ''
-    searchQueryResult.value.timeEnd = ''
-    if (Array.isArray(newVal)) {
-      if (newVal.length) {
-        searchQueryResult.value.timeStart = `${newVal[0]}`
-        searchQueryResult.value.timeEnd = `${newVal[1]}`
-      }
+watch(() => datetimerange.value, (newVal) => {
+  searchQueryResult.value.timeStart = ''
+  searchQueryResult.value.timeEnd = ''
+  if (Array.isArray(newVal)) {
+    if (newVal.length) {
+      searchQueryResult.value.timeStart = `${newVal[0]}`
+      searchQueryResult.value.timeEnd = `${newVal[1]}`
     }
-  },
-)
+  }
+})
 // 实验室
 const labCodeList = ref<dictType[]>([])
 // 部门
@@ -77,6 +65,8 @@
 // 查询检定结果分析
 const searchList = () => {
   // 检定结果分析
+  const current = showChart.value.filter(item => item.name === '检定结果分析')[0]
+  current.loading = true
   getVerificationResult(searchQueryResult.value).then((res) => {
     const data = [
       {
@@ -99,9 +89,6 @@
       item.data = res.data[item.value]
       // item.data = String(Math.floor(Math.random() * 100) + 1)
     })
-    const current = showChart.value.filter(
-      item => item.name === '检定结果分析',
-    )[0]
     current.data = [
       {
         name: '数量',
@@ -116,6 +103,9 @@
     else {
       current.isEmpty = false
     }
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 重置查询
@@ -224,6 +214,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '当年已检设备排行TOP10',
@@ -242,6 +234,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '检定及时分析',
@@ -264,6 +258,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '检定结果分析',
@@ -273,28 +269,33 @@
     data: [],
     smooth: false,
     gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 ])
 
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
-const loading = ref(false)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo({ labCode: props.lab }).then((res) => {
     console.log(res.data, '获取基础数据')
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 在检设备分析
+  const current1 = showChart.value.filter(item => item.name === '在检设备分析')[0]
+  current1.loading = true
   getDeviceAnalysis({ labCode: props.lab }).then((res) => {
     const data = [
       {
@@ -326,25 +327,36 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    const current = showChart.value.filter(
-      item => item.name === '在检设备分析',
-    )[0]
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    current1.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current1.loading = false
+    // 判断是否为空
+    if(current1.data.every((item: any)=> item.value === '0')) {
+      current1.isEmpty = true
+    }
+    else {
+      current1.isEmpty = false
+    }
+  }).catch(() => {
+    current1.loading = false
   })
   // 当年已检设备排行
+  const current2 = showChart.value.filter(item => item.name === '当年已检设备排行TOP10')[0]
+  current2.loading = true
   getAlreadyDeviceRank({ labCode: props.lab }).then((res) => {
-    const current = showChart.value.filter(
-      item => item.name === '当年已检设备排行TOP10',
-    )[0]
-    current.data = []
+    current2.data = []
     for (const i in res.data) {
-      current.data.push({
+      current2.data.push({
         name: i,
         count: res.data[i],
       })
     }
+    current2.loading = false
+  }).catch(() => {
+    current2.loading = false
   })
   // 检定及时分析
+  const current3 = showChart.value.filter(item => item.name === '检定及时分析')[0]
+  current3.loading = true
   getTimelyAnalysis({ labCode: props.lab }).then((res) => {
     const data = [
       {
@@ -363,13 +375,18 @@
         data: '',
       },
     ]
-    data.forEach((item) => {
-      item.data = res.data[item.value]
-    })
-    const current = showChart.value.filter(
-      item => item.name === '检定及时分析',
-    )[0]
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    data.forEach((item) => { item.data = res.data[item.value] })
+    current3.data = data.map(item => ({ name: item.name, value: String(item.data )}))
+    // 判断是否为空
+    if(current3.data.every((item: any)=> item.value === '0')) {
+      current3.isEmpty = true
+    }
+    else {
+      current3.isEmpty = false
+    }
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 检定结果分析
   searchList()
@@ -379,12 +396,7 @@
 })
 // 获取委托方列表
 const fetchCompanyList = () => {
-  getCustomerInfoList({
-    limit: 9999,
-    offset: 1,
-    approvalStatus: '0',
-    formId: 'zyglwtfml',
-  }).then((res) => {
+  getCustomerInfoList({ limit: 9999, offset: 1, approvalStatus: '0', formId: 'zyglwtfml' }).then((res) => {
     customerList.value = res.data.rows.map((item: any) => ({
       name: item.customerName,
       id: item.id,
@@ -395,22 +407,10 @@
 fetchCompanyList()
 // 获取受检设备
 const fetchDevice = () => {
-  getEquipmentList({
-    customerId: searchQueryResult.value.customerId,
-    equipmentType: '1',
-    offset: 1,
-    limit: 9999,
-  }).then((res) => {
-    console.log(res.data, '受检设备')
+  getEquipmentList({ customerId: searchQueryResult.value.customerId, equipmentType: '1', offset: 1, limit: 9999 }).then((res) => {
+    // console.log(res.data, '受检设备')
     allDeviceList.value = res.data.rows
-    sampleNameList.value = uniqueMultiArray(
-      res.data.rows.map((item: any) => ({
-        sampleName: item.equipmentName,
-        model: item.model,
-        helpInstruction: item.helpInstruction,
-      })),
-      'sampleName',
-    )
+    sampleNameList.value = uniqueMultiArray(res.data.rows.map((item: any) => ({ sampleName: item.equipmentName, model: item.model, helpInstruction: item.helpInstruction, })), 'sampleName',)
   })
 }
 fetchDevice()
@@ -430,32 +430,21 @@
 }
 // 改变设备名称查询条件
 const changeSampleName = (value: string) => {
-  console.log(value, '设备名称')
+  // console.log(value, '设备名称')
   modelList.value = []
   helpInstructionList.value = []
   searchQueryResult.value.model = ''
   searchQueryResult.value.helpInstruction = ''
-  modelList.value = uniqueMultiArray(
-    allDeviceList.value
-      .filter((item: any) => item.equipmentName === value)
-      .map((item: any) => ({
-        sampleName: item.equipmentName,
-        model: item.model,
-        helpInstruction: item.helpInstruction,
-      })),
-    'model',
-  )
+  modelList.value = uniqueMultiArray(allDeviceList.value.filter((item: any) => item.equipmentName === value).map((item: any) => ({ sampleName: item.equipmentName, model: item.model, helpInstruction: item.helpInstruction, })), 'model',)
   helpInstructionList.value = modelList.value
-  console.log(modelList.value, 'modelList.value')
+  // console.log(modelList.value, 'modelList.value')
 }
 // 改变规格型号查询条件
 const changeHelpInstruction = (value: string) => {
-  console.log(value, '规格型号')
+  // console.log(value, '规格型号')
   helpInstructionList.value = []
   searchQueryResult.value.helpInstruction = ''
-  helpInstructionList.value = modelList.value.filter(
-    item => item.model === value,
-  )
+  helpInstructionList.value = modelList.value.filter(item => item.model === value)
 }
 // 拖拽结束
 const onEnd = () => {
@@ -474,7 +463,7 @@
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <!-- <svg-icon name="icon-env-device-online" class="icon-button-icon" /> -->
@@ -492,265 +481,104 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                showChart.length === 4
-                  ? '48%'
-                  : index === 0 || index === 1
-                    ? '48%'
-                    : '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${showChart.length === 4 ? '48%' : index === 0 || index === 1 ? '48%' : '31.5%'}` }"
+            class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
-              <div
-                v-if="element.type === 'pie'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+            <div v-loading="element.loading" class="chart-page">
+              <div v-if="element.type === 'pie'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
-                <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-show="element.showType == 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-show="element.showType == 'table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" />
+                <div v-show="!element.isEmpty" style="width: 100%; height: 90%;">
+                  <pie-chart v-show="element.showType == 'pie'" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-show="element.showType == 'table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
                 </div>
               </div>
-              <div
-                v-if="element.type === 'rank-table'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+              <div v-if="element.type === 'rank-table'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
+                <!-- <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" /> -->
                 <div style="width: 100%; height: 90%;">
-                  <scroll-table
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                  <scroll-table style="width: 100%;" :height="300" :data="element.data" :columns="element.columns" />
                 </div>
               </div>
-              <div
-                v-if="element.type === 'bar-horizontal'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+              <div v-if="element.type === 'bar-horizontal'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
                 <!-- 查询条件 -->
-                <search-area
-                  :need-clear="true"
-                  @search="searchList"
-                  @clear="clearList"
-                >
+                <search-area :need-clear="true" @search="searchList" @clear="clearList">
                   <!-- 实验室 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.labCode"
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="实验室"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in labCodeList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.labCode" style="width: 130px;" class="short-input"
+                      placeholder="实验室" clearable>
+                      <el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 部门 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.groupCode"
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="部门"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in groupCodeList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.groupCode" style="width: 130px;" class="short-input"
+                      placeholder="部门" clearable>
+                      <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 委托方 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.customerId"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="委托方"
-                      clearable
-                      @change="changeCustomer"
-                    >
-                      <el-option
-                        v-for="item in customerList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.customerId" filterable style="width: 130px;"
+                      class="short-input" placeholder="委托方" clearable @change="changeCustomer">
+                      <el-option v-for="item in customerList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 受检设备名称 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.sampleName"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="受检设备名称"
-                      clearable
-                      @change="changeSampleName"
-                    >
-                      <el-option
-                        v-for="item in sampleNameList"
-                        :key="item.sampleName"
-                        :label="item.sampleName"
-                        :value="item.sampleName"
-                      />
+                    <el-select v-model="searchQueryResult.sampleName" filterable style="width: 130px;"
+                      class="short-input" placeholder="受检设备名称" clearable @change="changeSampleName">
+                      <el-option v-for="item in sampleNameList" :key="item.sampleName" :label="item.sampleName"
+                        :value="item.sampleName" />
                     </el-select>
                   </search-item>
                   <!-- 规格型号 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.model"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="规格型号"
-                      clearable
-                      @change="changeHelpInstruction"
-                    >
-                      <el-option
-                        v-for="item in modelList"
-                        :key="item.model"
-                        :label="item.model"
-                        :value="item.model"
-                      />
+                    <el-select v-model="searchQueryResult.model" filterable style="width: 130px;" class="short-input"
+                      placeholder="规格型号" clearable @change="changeHelpInstruction">
+                      <el-option v-for="item in modelList" :key="item.model" :label="item.model" :value="item.model" />
                     </el-select>
                   </search-item>
                   <!-- 辅助字段 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.helpInstruction"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="辅助字段"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in helpInstructionList"
-                        :key="item.helpInstruction"
-                        :label="item.helpInstruction"
-                        :value="item.helpInstruction"
-                      />
+                    <el-select v-model="searchQueryResult.helpInstruction" filterable style="width: 130px;"
+                      class="short-input" placeholder="辅助字段" clearable>
+                      <el-option v-for="item in helpInstructionList" :key="item.helpInstruction"
+                        :label="item.helpInstruction" :value="item.helpInstruction" />
                     </el-select>
                   </search-item>
                   <!-- 时间 -->
                   <search-item>
                     <div style="width: 350px !important;">
-                      <el-date-picker
-                        v-model="datetimerange"
-                        type="daterange"
-                        value-format="YYYY-MM-DD"
-                        format="YYYY-MM-DD"
-                        range-separator="至"
-                        start-placeholder="检定开始时间"
-                        end-placeholder="检定结束时间"
-                        clearable
-                      />
+                      <el-date-picker v-model="datetimerange" type="daterange" value-format="YYYY-MM-DD"
+                        format="YYYY-MM-DD" range-separator="至" start-placeholder="检定开始时间" end-placeholder="检定结束时间"
+                        clearable />
                     </div>
                   </search-item>
                 </search-area>
                 <div style="width: 100%; height: 70%;">
-                  <el-empty
-                    v-show="element.isEmpty"
-                    :image-size="100"
-                    description="暂无数据"
-                  />
-                  <bar-chart-horizontal
-                    v-show="!element.isEmpty"
-                    bar-width="30"
-                    :bar-coner="0"
-                    :data="element.data"
+                  <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" />
+                  <bar-chart-horizontal v-show="!element.isEmpty" bar-width="25" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }"
+                    :grid="{ top: 20, left: 20, right: 60, bottom: 30, containLabel: true, }"/>
                 </div>
               </div>
               <!--  -->
diff --git a/src/views/dataManagement/components/data/resourceManage.vue b/src/views/dataManagement/components/data/resourceManage.vue
index a1f2fb0..907ce29 100644
--- a/src/views/dataManagement/components/data/resourceManage.vue
+++ b/src/views/dataManagement/components/data/resourceManage.vue
@@ -6,13 +6,7 @@
 import { resourceManage } from './img'
 import type { deptType, dictType } from '@/global'
 import { getRangeAllTime } from '@/utils/date'
-import {
-  getBaseInfo,
-  getCertDistribute,
-  getCertExpire,
-  getFileCategory,
-  getFileNovelty,
-} from '@/api/dataManagement/data/resourceManagement'
+import { getBaseInfo, getCertDistribute, getCertExpire, getFileCategory, getFileNovelty, } from '@/api/dataManagement/data/resourceManagement'
 import { getDictByCode } from '@/api/system/dict'
 
 const props = defineProps({
@@ -35,19 +29,17 @@
   timeStart: '',
   timeEnd: '',
 })
-watch(
-  () => datetimerange.value,
-  (newVal) => {
-    certDistribute.value.timeStart = ''
-    certDistribute.value.timeEnd = ''
-    if (Array.isArray(newVal)) {
-      if (newVal.length) {
-        certDistribute.value.timeStart = `${newVal[0]}`
-        certDistribute.value.timeEnd = `${newVal[1]}`
-      }
+watch(() => datetimerange.value, (newVal) => {
+  certDistribute.value.timeStart = ''
+  certDistribute.value.timeEnd = ''
+  if (Array.isArray(newVal)) {
+    if (newVal.length) {
+      certDistribute.value.timeStart = `${newVal[0]}`
+      certDistribute.value.timeEnd = `${newVal[1]}`
+      fetchPerson()
     }
-  },
-)
+  }
+})
 // 部门
 const groupCodeList = ref<dictType[]>([])
 // 基础信息展示数据
@@ -57,53 +49,50 @@
     value: 'staffAmount',
     data: '',
     icon: resourceManage['人员总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '体系文件总数',
     value: 'systemFileAmount',
     data: '',
     icon: resourceManage['体系文件总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '测试校准检定方法总数',
     value: 'techniqueFileAmount',
     data: '',
     icon: resourceManage['测试校准检定方法总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '在用软件总数',
     value: 'softwareAmount',
     data: '',
     icon: resourceManage['在用软件总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '合格供方总数',
     value: 'supplierAmount',
     data: '',
     icon: resourceManage['合格供方总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '委托方总数',
     value: 'customerAmount',
     data: '',
     icon: resourceManage['委托方总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
 ])
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 const showChart = ref<any[]>([
   {
     name: '人员持证到期趋势',
@@ -113,6 +102,8 @@
     data: [],
     smooth: false,
     gradient: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '人员证书分布',
@@ -122,6 +113,8 @@
     xAxisData: [],
     data1: [],
     data2: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '体系文件分类',
@@ -132,63 +125,91 @@
     radius: ['60%', '45%'],
     title: ' ',
     showTotal: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '测试校准检定方法查新分析',
     type: 'bar-vertical',
     source: 'bar',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+// 人员持证到期趋势
+const fetchPerson = () => {
+  // 人员持证到期趋势
+  const current1 = showChart.value.filter(item => item.name === '人员持证到期趋势')[0]
+  current1.loading = true
+  getCertExpire({ ...searchQueryResult.value, ...certDistribute.value }).then((res) => {
+    // console.log(res.data, '人员持证到期趋势')
+    current1.data = [
+      {
+        name: '人员证书到期数量',
+        symbol: 'emptyCircle',
+        data: res.data.map((item: any) => String(item.certExpireAmount)),
+      },
+    ]
+    current1.xAxisData = res.data.map((item: any) => `${item.year}第${item.quarter}季度`)
+    current1.loading = false
+    // 判断是否为空
+    if(!res.data || !res.data.length) {
+      current1.isEmpty = true
+    }
+    else {
+      current1.isEmpty = false
+    }
+  }).catch(() => {
+    current1.loading = false
+  })
+}
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础信息
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then((res) => {
-    console.log(res.data, '基础信息')
+    // console.log(res.data, '基础信息')
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 人员持证到期趋势
-  getCertExpire({ ...searchQueryResult.value, ...certDistribute.value }).then(
-    (res) => {
-      console.log(res.data, '人员持证到期趋势')
-      const current = showChart.value.filter(
-        item => item.name === '人员持证到期趋势',
-      )[0]
-      current.data = [
-        {
-          name: '人员证书到期数量',
-          symbol: 'emptyCircle',
-          data: res.data.map((item: any) => String(item.certExpireAmount)),
-        },
-      ]
-      current.xAxisData = res.data.map((item: any) => `${item.year}第${item.quarter}季度`)
-    },
-  )
+  fetchPerson()
   // 人员证书分布
+  const current2 = showChart.value.filter(item => item.name === '人员证书分布')[0]
+  current2.loading = true
   getCertDistribute(searchQueryResult.value).then((res) => {
-    console.log(res.data, '人员证书分布')
-    const current = showChart.value.filter(
-      item => item.name === '人员证书分布',
-    )[0]
-    current.legendData = ['证书总数', '有效证书总数']
-    current.xAxisData = res.data.map((item: any) => item.certTypeName)
-    current.data1 = res.data.map((item: any) => String(item.totalAmount))
-    current.data2 = res.data.map((item: any) => String(item.validAmount))
+    // console.log(res.data, '人员证书分布')
+    current2.legendData = ['证书总数', '有效证书总数']
+    current2.xAxisData = res.data.map((item: any) => item.certTypeName)
+    current2.data1 = res.data.map((item: any) => String(item.totalAmount))
+    current2.data2 = res.data.map((item: any) => String(item.validAmount))
+    current2.loading = false
+    // 判断是否为空
+    if(current2.data1.every((item: any) => item === '0') && current2.data2.every((item: any) => item === '0')) {
+      current2.isEmpty = true
+    }
+    else {
+      current2.isEmpty = false
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 体系文件分类
+  const current3 = showChart.value.filter(item => item.name === '体系文件分类')[0]
+  current3.loading = true
   getFileCategory(searchQueryResult.value).then((res) => {
-    console.log(res.data, '体系文件分类')
+    // console.log(res.data, '体系文件分类')
     const data = [
       {
         name: '质量手册',
@@ -211,22 +232,28 @@
         data: '',
       },
     ]
-    const current = showChart.value.filter(
-      item => item.name === '体系文件分类',
-    )[0]
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    current3.data = data.map(item => ({ name: item.name, value: item.data }))
+    current3.loading = false
+    // 判断是否为空
+    if(current3.data.every((item: any) => String(item.value) === '0')) {
+      current3.isEmpty = true
+    }
+    else {
+      current3.isEmpty = false
+    }
+  }).catch(() => {
+    current3.loading = false
   })
   // 测试校准检定方法查新分析
+  const current4 = showChart.value.filter(item => item.name === '测试校准检定方法查新分析')[0]
+  current4.loading = true
   getFileNovelty(searchQueryResult.value).then((res) => {
-    console.log(res.data, '测试校准检定方法查新分析')
-    const current = showChart.value.filter(
-      item => item.name === '测试校准检定方法查新分析',
-    )[0]
-    current.xAxisData = res.data.map((item: any) => item.groupCodeName)
-    current.data = [
+    // console.log(res.data, '测试校准检定方法查新分析')
+    current4.xAxisData = res.data.map((item: any) => item.groupCodeName)
+    current4.data = [
       {
         name: '有查新',
         data: res.data.map((item: any) => String(item.haveNovelty)),
@@ -236,6 +263,16 @@
         data: res.data.map((item: any) => String(item.noNovelty)),
       },
     ]
+    current4.loading = false
+    // 判断是否为空
+    if(res.data.map((item: any) => String(item.haveNovelty)).every((item: any) => item ==='0') && res.data.map((item: any) => String(item.noNovelty)).every((item: any) => item ==='0')) {
+      current4.isEmpty = true
+    }
+    else {
+      current4.isEmpty = false
+    }
+  }).catch(() => {
+    current4.loading = false
   })
   // loading.value = true
   // // 人员持证到期趋势
@@ -291,11 +328,7 @@
 }
 onMounted(() => {
   if (props.lab) {
-    datetimerange.value = [
-      // dayjs().subtract(6, 'month').format('YYYY-MM-DD'),
-      `${new Date().getFullYear()}-01-01`,
-      dayjs().format('YYYY-MM-DD'),
-    ]
+    datetimerange.value = [`${new Date().getFullYear()}-01-01`, dayjs().format('YYYY-MM-DD')]
     searchQueryResult.value.labCode = props.lab
     // 部门
     getDictByCode('bizGroupCode').then((response) => {
@@ -325,25 +358,15 @@
     <div class="btns">
       <div />
       <!-- 部门 -->
-      <el-select
-        v-model="searchQueryResult.groupCode"
-        style="width: 130px;"
-        class="short-input"
-        placeholder="部门"
-        clearable
-      >
-        <el-option
-          v-for="item in groupCodeList"
-          :key="item.id"
-          :label="item.name"
-          :value="item.value"
-        />
+      <el-select v-model="searchQueryResult.groupCode" style="width: 130px;" class="short-input" placeholder="部门"
+        clearable>
+        <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
       </el-select>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <img :src="item.icon">
@@ -360,160 +383,45 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                showChart.length === 4
-                  ? '48%'
-                  : index === 0 || index === 1
-                    ? '48%'
-                    : '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${showChart.length === 4 ? '48%' : index === 0 || index === 1 ? '48%' : '31.5%'}`, }"
+            class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%;">
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%; display: flex;"
-                >
+                <div class="chart-name" style="width: 100%; height: 10%; display: flex;">
                   {{ element.name }}
-                  <div
-                    v-if="element.name === '人员持证到期趋势'"
-                    style="width: 350px; margin-left: 40px;"
-                  >
-                    <el-date-picker
-                      v-model="datetimerange"
-                      type="daterange"
-                      value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD"
-                      range-separator="至"
-                      start-placeholder="开始时间"
-                      end-placeholder="结束时间"
-                    />
+                  <div v-if="element.name === '人员持证到期趋势'" style="width: 350px; margin-left: 40px;">
+                    <el-date-picker v-model="datetimerange" type="daterange" value-format="YYYY-MM-DD"
+                      format="YYYY-MM-DD" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" />
                   </div>
                 </div>
                 <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-if="element.type === 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <line-chart
-                    v-if="element.type === 'line'"
-                    :colors="colors"
-                    :gradient="element.gradient"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
+                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth"
+                    :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5', }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
+                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :data="element.data"
-                    :smooth="element.smooth"
-                    :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5',
-                    }"
-                  />
-                  <bar-chart-double
-                    v-if="element.type === 'bar-double'"
-                    :legend-data="element.legendData"
-                    :data1="element.data1"
-                    :data2="element.data2"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-vertical
-                    v-if="element.type === 'bar-vertical'"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-horizontal
-                    v-if="element.type === 'bar-horizontal'"
-                    bar-width="10"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-if="element.type === 'rank-table'"
-                    style="width: 100%;"
-                    :height="330"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%;" :height="330"
+                    :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/standardDevice.vue b/src/views/dataManagement/components/data/standardDevice.vue
index 62b94ed..3859363 100644
--- a/src/views/dataManagement/components/data/standardDevice.vue
+++ b/src/views/dataManagement/components/data/standardDevice.vue
@@ -69,11 +69,15 @@
     type: 'line',
     source: 'system',
     smooth: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '标准装置状态分析',
     type: 'bar-horizontal',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '近一年部门核查分析',
@@ -90,7 +94,9 @@
       ['#2352d6', '#fff'],
       ['#fed700', '#fff'],
       ['#feb501', '#fff'],
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '当年标准装置核查排行榜',
@@ -115,6 +121,8 @@
 
     ],
     data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 ])
 watch(() => showChart.value.length, () => {
@@ -124,23 +132,24 @@
   })
 })
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then(res => {
     baseInfo.value.forEach(item => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 近五年标准装置复查趋势
-  getNearYearTrend({
-    ...searchQueryResult.value,
-    timeStart: dayjs().subtract(5, 'year').format('YYYY-MM-DD'),
-    timeEnd: dayjs().format('YYYY-MM-DD')
-  }).then(res => {
-    console.log(res.data, '近五年标准装置复查趋势')
-    const current = showChart.value.filter((item: any) => item.name === '近五年标准装置复查趋势')[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+  const current1 = showChart.value.filter((item: any) => item.name === '近五年标准装置复查趋势')[0]
+  current1.loading = true
+  getNearYearTrend({...searchQueryResult.value,timeStart: dayjs().subtract(5, 'year').format('YYYY-MM-DD'), timeEnd: dayjs().format('YYYY-MM-DD')}).then(res => {
+    // console.log(res.data, '近五年标准装置复查趋势')
+    current1.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '无线电脉冲组',
@@ -158,21 +167,21 @@
         data: ''
       },
     ]
-    current.data = data.map((item: any) => ({
+    current1.data = data.map((item: any) => ({
       name: item.name,
       symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   //  标准装置状态分析
-  getStandardStatusAnalysis({
-    ...searchQueryResult.value,
-    timeStart: `${new Date().getFullYear()}-01-01`,
-    timeEnd: dayjs().format('YYYY-MM-DD')
-  }).then(res => {
-    console.log(res.data, '标准装置状态分析')
-    const current = showChart.value.filter((item: any) => item.name === '标准装置状态分析')[0]
-    current.xAxisData = res.data.map((item: any) => item.approvalTypeName)
+  const current2 = showChart.value.filter((item: any) => item.name === '标准装置状态分析')[0]
+  current2.loading = true
+  getStandardStatusAnalysis({...searchQueryResult.value,timeStart: `${new Date().getFullYear()}-01-01`,timeEnd: dayjs().format('YYYY-MM-DD')}).then(res => {
+    // console.log(res.data, '标准装置状态分析')
+    current2.xAxisData = res.data.map((item: any) => item.approvalTypeName)
     const data = [
       {
         name: '无线电脉冲组',
@@ -190,21 +199,21 @@
         data: ''
       },
     ]
-    current.data = data.map((item: any) => ({
+    current2.data = data.map((item: any) => ({
       name: item.name,
       // symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current2.loading = false
+  }).catch(() => {
+    current2.loading = false
   })
   // 近一年部门核查分析
-  getOneYearAnalysis({
-    ...searchQueryResult.value,
-    timeStart: `${new Date().getFullYear()}-01-01`,
-    timeEnd: dayjs().format('YYYY-MM-DD')
-  }).then(res => {
-    console.log(res.data, '近一年部门核查分析')
-    const current = showChart.value.filter((item: any) => item.name === '近一年部门核查分析')[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+  const current3 = showChart.value.filter((item: any) => item.name === '近一年部门核查分析')[0]
+  current3.loading = true
+  getOneYearAnalysis({...searchQueryResult.value, timeStart: `${new Date().getFullYear()}-01-01`,timeEnd: dayjs().format('YYYY-MM-DD')}).then(res => {
+    // console.log(res.data, '近一年部门核查分析')
+    current3.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '无线电脉冲组',
@@ -222,21 +231,24 @@
         data: ''
       },
     ]
-    current.data = data.map((item: any) => ({
+    current3.data = data.map((item: any) => ({
       name: item.name,
       // symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 当年标准装置核查排行榜
-  getCurrentYearRank({
-    ...searchQueryResult.value,
-    timeStart: `${new Date().getFullYear()}-01-01`,
-    timeEnd: dayjs().format('YYYY-MM-DD')
-  }).then(res => {
-    console.log(res.data, '当年标准装置核查排行榜')
-    const current = showChart.value.filter((item: any) => item.name === '当年标准装置核查排行榜')[0]
-    current.data = res.data.rows
+  const current4 = showChart.value.filter((item: any) => item.name === '当年标准装置核查排行榜')[0]
+  current4.loading = true
+  getCurrentYearRank({...searchQueryResult.value,timeStart: `${new Date().getFullYear()}-01-01`,timeEnd: dayjs().format('YYYY-MM-DD')}).then(res => {
+    // console.log(res.data, '当年标准装置核查排行榜')
+    current4.data = res.data.rows
+    current4.loading = false
+  }).catch(() => {
+    current4.loading = false
   })
   // loading.value = true
   // // 近五年标准装置复查趋势
@@ -303,7 +315,7 @@
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div class="count-item" v-for="item in baseInfo" :key="item.value">
           <div class="header-icon">
             <img :src="item.icon" />
@@ -328,17 +340,13 @@
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%">
                 <div class="chart-name" style="width: 100%; height: 10%; display: flex">
                   {{ element.name }}
-                  <div v-if="element.name === '人员持证到期趋势'" style="width: 350px; margin-left: 40px">
-                    <el-date-picker v-model="datetimerange" type="daterange" value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" />
-                  </div>
                 </div>
                 <div style="width: 100%; height: 90%">
-                  <pie-chart v-if="element.type === 'pie'" :title="element.title" :show-total="element.showTotal"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
                     :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
                     :label-position="element.labelPosition" :radius="element.radius" :grid="{
                       top: 50,
@@ -355,7 +363,7 @@
                       left: '0',
                       top: '10'
                     }" />
-                  <line-chart v-if="element.type === 'line'" :colors="colors" :gradient="element.gradient"
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
                     :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth" :grid="{
                       top: 47,
                       left: 5,
@@ -371,7 +379,7 @@
                       left: '0',
                       top: '5'
                     }" />
-                  <bar-chart-double v-if="element.type === 'bar-double'" :legend-data="element.legendData"
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
                     :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData" :legend="{
                       itemWidth: 8,
                       itemHeight: 8,
@@ -381,7 +389,7 @@
                       left: '0',
                       top: '10'
                     }" />
-                  <bar-chart-vertical v-if="element.type === 'bar-vertical'" :bar-coner="0" :data="element.data"
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData" :legend="{
                       itemWidth: 8,
                       itemHeight: 8,
@@ -394,7 +402,7 @@
                     :colors="element.colors"
                     :gradient="false"
                     />
-                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal'" bar-width="10" :bar-coner="0"
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
                     :data="element.data" :x-axis-data="element.xAxisData" :legend="{
                       itemWidth: 8,
                       itemHeight: 8,
@@ -406,6 +414,7 @@
                     }" />
                   <scroll-table v-if="element.type === 'rank-table'" style="width: 100%" :height="310"
                     :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>

diff --git a/src/views/dataManagement/components/data/device.vue b/src/views/dataManagement/components/data/device.vue
index 9897df1..23efd69 100644
--- a/src/views/dataManagement/components/data/device.vue
+++ b/src/views/dataManagement/components/data/device.vue
@@ -5,15 +5,7 @@
 import { colors } from '../environment/colors'
 import { device } from './img'
 import { getRangeAllTime } from '@/utils/date'
-import {
-  getBaseInfo,
-  getDeptExpire,
-  getDeviceMaintain,
-  getDeviceStatus,
-  getDeviceType,
-  getStandardDeviceType,
-  getTraceAnalyse,
-} from '@/api/dataManagement/data/device'
+import { getBaseInfo, getDeptExpire, getDeviceMaintain, getDeviceStatus, getDeviceType, getStandardDeviceType, getTraceAnalyse, } from '@/api/dataManagement/data/device'
 const props = defineProps({
   lab: {
     type: String,
@@ -30,15 +22,12 @@
 const year = ref('') // 年度
 const yearList = ref<string[]>([])
 
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -86,6 +75,8 @@
     data: [],
     smooth: false,
     gradient: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备类型分析',
@@ -95,6 +86,8 @@
     labelPosition: 'outside',
     radius: '70%',
     data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '标准设备种类分析',
@@ -113,11 +106,15 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备状态分析',
     type: 'bar-vertical',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备维护保养情况',
@@ -159,39 +156,43 @@
         width: '95',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '设备溯源分析',
     type: 'bar-horizontal',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then((res) => {
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 近一年部门设备到期趋势
+  const current1 = showChart.value.filter(item => item.name === '近一年部门设备到期趋势')[0]
+  current1.loading = true
   getDeptExpire(searchQueryResult.value).then((res) => {
-    console.log(res.data, '近一年部门设备到期趋势')
-    const current = showChart.value.filter(
-      item => item.name === '近一年部门设备到期趋势',
-    )[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+    // console.log(res.data, '近一年部门设备到期趋势')
+    current1.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '电学电源组',
@@ -210,15 +211,20 @@
         value: 'glAmount',
       },
     ]
-    current.data = data.map((item: any) => ({
+    current1.data = data.map((item: any) => ({
       name: item.name,
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[item.value])),
     }))
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 设备类型分析
+  const current2 = showChart.value.filter(item => item.name === '设备类型分析')[0]
+  current2.loading = true
   getDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备类型分析')
+    // console.log(res.data, '设备类型分析')
     const data = [
       {
         name: '标准设备',
@@ -236,20 +242,26 @@
         data: '',
       },
     ]
-    const current = showChart.value.filter(
-      item => item.name === '设备类型分析',
-    )[0]
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current2.loading = false
+    // 判断是否为空
+    if(current2.data.every((item: any) => item.value === '0')) {
+      current2.isEmpty = true
+    }
+    else {
+      current2.isEmpty = false
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 设备状态分析
+  const current3 = showChart.value.filter(item => item.name === '设备状态分析')[0]
+  current3.loading = true
   getDeviceStatus(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备状态分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备状态分析',
-    )[0]
+    // console.log(res.data, '设备状态分析')
     const data = [
       {
         name: '在用',
@@ -280,20 +292,22 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current3.xAxisData = data.map((item: any) => item.name)
+    current3.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 设备溯源分析
+  const current4 = showChart.value.filter(item => item.name === '设备溯源分析')[0]
+  current4.loading = true
   getTraceAnalyse(searchQueryResult.value).then((res) => {
-    console.log(res.data, '设备溯源分析')
-    const current = showChart.value.filter(
-      item => item.name === '设备溯源分析',
-    )[0]
+    // console.log(res.data, '设备溯源分析')
     const data = [
       {
         name: '合格',
@@ -314,34 +328,48 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.xAxisData = data.map((item: any) => item.name)
-    current.data = [
+    current4.xAxisData = data.map((item: any) => item.name)
+    current4.data = [
       {
         name: '数量',
         data: data.map((item: any) => String(item.data)),
       },
     ]
+    current4.loading = false
+    // 判断是否为空
+    if(data.every((item: any) => String(item.data) === '0')) {
+      current4.isEmpty = true
+    }
+    else {
+      current4.isEmpty = false
+    }
+  }).catch(() => {
+    current4.loading = false
   })
   // 标准设备种类分析
+  const current5 = showChart.value.filter(item => item.name === '标准设备种类分析')[0]
+  current5.loading = true
   getStandardDeviceType(searchQueryResult.value).then((res) => {
-    console.log(res.data, '标准设备种类分析')
-    const current = showChart.value.filter(
-      item => item.name === '标准设备种类分析',
-    )[0]
-    current.data = []
+    // console.log(res.data, '标准设备种类分析')
+    current5.data = []
     for (const i in res.data) {
-      current.data.push({ name: i, count: res.data[i] })
+      current5.data.push({ name: i, count: res.data[i] })
     }
-    current.data.reverse()
+    current5.data.reverse()
+    current5.loading = false
+  }).catch(() => {
+    current5.loading = false
   })
   // 设备维护保养情况
+  const current6 = showChart.value.filter(item => item.name === '设备维护保养情况')[0]
+  current6.loading = true
   getDeviceMaintain({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then((res) => {
-    console.log(res.data, '设备维护保养情况')
-    const current = showChart.value.filter(
-      item => item.name === '设备维护保养情况',
-    )[0]
-    current.data = []
-    current.data = res.data.rows
+    // console.log(res.data, '设备维护保养情况')
+    current6.data = []
+    current6.data = res.data.rows
+    current6.loading = false
+  }).catch(() => {
+    current6.loading = false
   })
   // loading.value = true
   // // 近一年部门设备到期趋势
@@ -398,19 +426,16 @@
   yearList.value.push(String(currentYear - i))
 }
 
-watch(
-  () => year.value,
-  (newVal) => {
-    if (newVal) {
-      console.log(newVal, '当前年度')
-      searchQueryResult.value.timeStart = `${newVal}-01-01`
-      searchQueryResult.value.timeEnd = `${newVal}-12-31`
-      setTimeout(() => {
-        fetchData()
-      })
-    }
-  },
-)
+watch(() => year.value, (newVal) => {
+  if (newVal) {
+    console.log(newVal, '当前年度')
+    searchQueryResult.value.timeStart = `${newVal}-01-01`
+    searchQueryResult.value.timeEnd = `${newVal}-12-31`
+    setTimeout(() => {
+      fetchData()
+    })
+  }
+})
 onMounted(() => {
   year.value = String(currentYear)
   if (props.lab) {
@@ -427,24 +452,14 @@
     <div class="btns">
       <div />
       <!-- 部门 -->
-      <el-select
-        v-model="year"
-        style="width: 130px;"
-        class="short-input"
-        placeholder="年度"
-      >
-        <el-option
-          v-for="item in yearList"
-          :key="item"
-          :label="item"
-          :value="item"
-        />
+      <el-select v-model="year" style="width: 130px;" class="short-input" placeholder="年度">
+        <el-option v-for="item in yearList" :key="item" :label="item" :value="item" />
       </el-select>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <img :src="item.icon">
@@ -461,156 +476,40 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${'31.5%'}`, }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%;">
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%; display: flex;"
-                >
+                <div class="chart-name" style="width: 100%; height: 10%; display: flex;">
                   {{ element.name }}
-                  <div
-                    v-if="element.name === '人员持证到期趋势'"
-                    style="width: 350px; margin-left: 40px;"
-                  >
-                    <el-date-picker
-                      v-model="datetimerange"
-                      type="daterange"
-                      value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD"
-                      range-separator="至"
-                      start-placeholder="开始时间"
-                      end-placeholder="结束时间"
-                    />
-                  </div>
                 </div>
                 <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-if="element.type === 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <line-chart
-                    v-if="element.type === 'line'"
-                    :colors="colors"
-                    :gradient="element.gradient"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
+                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth"
+                    :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5', }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
+                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :data="element.data"
-                    :smooth="element.smooth"
-                    :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5',
-                    }"
-                  />
-                  <bar-chart-double
-                    v-if="element.type === 'bar-double'"
-                    :legend-data="element.legendData"
-                    :data1="element.data1"
-                    :data2="element.data2"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-vertical
-                    v-if="element.type === 'bar-vertical'"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-horizontal
-                    v-if="element.type === 'bar-horizontal'"
-                    bar-width="10"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-if="element.type === 'rank-table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/eqptDevice.vue b/src/views/dataManagement/components/data/eqptDevice.vue
index 1f1d01c..83a7083 100644
--- a/src/views/dataManagement/components/data/eqptDevice.vue
+++ b/src/views/dataManagement/components/data/eqptDevice.vue
@@ -9,18 +9,7 @@
 import { getDictByCode } from '@/api/system/dict'
 import { exportFile } from '@/utils/exportUtils'
 import { getCustomerInfoList } from '@/api/resource/customer'
-import {
-  getBaseInfo,
-  getNoVerificationAmount,
-  getDeviceSource,
-  getDeviceType,
-  getAlreadyMeasured,
-  getShouldMeasured,
-  getDevicePerformance,
-  exportDeviceType,
-  getDeviceSourceDept,
-  getDeviceTypeList
-} from '@/api/dataManagement/data/eqptDevice'
+import { getBaseInfo, getNoVerificationAmount, getDeviceSource, getDeviceType, getAlreadyMeasured, getShouldMeasured, getDevicePerformance, exportDeviceType, getDeviceSourceDept, getDeviceTypeList } from '@/api/dataManagement/data/eqptDevice'
 import { eqptDevice } from './img'
 const props = defineProps({
   lab: {
@@ -88,40 +77,34 @@
   }
 }
 const timeDate = ref<string[]>([])
-watch(
-  () => current.value,
-  newVal => {
-    if (newVal) {
-      if (newVal === '当日') {
-        timeDate.value = [dayjs().format('YYYY-MM-DD')]
-      } else if (newVal === '近7日') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      } else if (newVal === '近14天') {
-        timeDate.value = getRangeAllTime(
-          dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
-          dayjs().format('YYYY-MM-DD')
-        )
-      }
-      if (!newVal.includes('自定义')) {
-        fetchData()
-        selectCurrentTime.value = []
-      }
+watch(() => current.value, newVal => {
+  if (newVal) {
+    if (newVal === '当日') {
+      timeDate.value = [dayjs().format('YYYY-MM-DD')]
+    } else if (newVal === '近7日') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
+    } else if (newVal === '近14天') {
+      timeDate.value = getRangeAllTime(
+        dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD')
+      )
     }
-  }
-)
-watch(
-  () => selectCurrentTime.value,
-  newVal => {
-    if (newVal.length === 2) {
-      console.log('确定时间')
-      timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    if (!newVal.includes('自定义')) {
       fetchData()
+      selectCurrentTime.value = []
     }
   }
-)
+})
+watch(() => selectCurrentTime.value, newVal => {
+  if (newVal.length === 2) {
+    console.log('确定时间')
+    timeDate.value = getRangeAllTime(newVal[0], newVal[1])
+    fetchData()
+  }
+})
 // 公共查询条件
 const searchQueryResult = ref({
   groupCode: '',
@@ -137,13 +120,9 @@
 })
 // 获取受检设备各种类数量分析数据
 const fetchQueryForTypeSoure = () => {
-  getDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
-    const current = showChart.value.filter(
-      item => item.name === '受检设备各种类数量分析'
-    )[0]
+  const current = showChart.value.filter(item => item.name === '受检设备各种类数量分析')[0]
+  current.loading = true
+  getDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     current.data = []
     const data = []
     for (const i in res.data) {
@@ -153,7 +132,16 @@
       })
     }
     current.data = data
-    // console.log(data, 'data 1')
+    current.loading = false
+    // 判断数据是否为空
+    if (current.data.length) {
+      current.isEmpty = false
+    }
+    else {
+      current.isEmpty = true
+    }
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备各种类数量分析 查询条件
@@ -182,16 +170,15 @@
 })
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备已检数量趋势')[0]
+  current.loading = true
   getAlreadyMeasured({
     ...searchQueryResult.value,
     ...searchQueryForMeasured.value,
     timeStart: searchQueryForMeasured.value.timeStart ? searchQueryForMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForMeasured.value.timeEnd ? searchQueryForMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备已检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备已检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备已检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -215,6 +202,9 @@
       symbol: 'emptyCircle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备已检数量趋势 查询条件
@@ -242,7 +232,7 @@
   fetchQueryForShouldMeasured()
 })
 const contextmenu = (name: string) => {
-  console.log(name)
+  // console.log(name)
   if (name === '受检设备已检数量趋势') {
     selectForMeasured.value = []
     // fetchQueryForMeasured()
@@ -253,16 +243,15 @@
 }
 //  获取受检设备已检数量趋势 数据
 const fetchQueryForShouldMeasured = () => {
+  const current = showChart.value.filter(item => item.name === '受检设备应检数量趋势')[0]
+  current.loading = true
   getShouldMeasured({
     ...searchQueryResult.value,
     ...searchQueryForShouldMeasured.value,
     timeStart: searchQueryForShouldMeasured.value.timeStart ? searchQueryForShouldMeasured.value.timeStart : searchQueryResult.value.timeStart,
     timeEnd: searchQueryForShouldMeasured.value.timeEnd ? searchQueryForShouldMeasured.value.timeEnd : searchQueryResult.value.timeEnd,
   }).then(res => {
-    console.log(res.data, '受检设备应检数量趋势')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备应检数量趋势'
-    )[0]
+    // console.log(res.data, '受检设备应检数量趋势')
     const data = [
       {
         name: '海口实验室',
@@ -286,21 +275,21 @@
       symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 改变受检设备应检数量趋势 查询条件
 const changeSearchQueryForShouldMeasured = () => {
   fetchQueryForShouldMeasured()
 }
-watch(
-  () => props.lab,
-  newVal => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
+watch(() => props.lab, newVal => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
   }
-)
+})
 // 基础信息展示数据
 const baseInfo = ref([
   {
@@ -356,7 +345,9 @@
         value: 'count',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备来源分析',
@@ -365,7 +356,9 @@
     center: ['50%', '60%'],
     labelPosition: 'outside',
     radius: '70%',
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备各种类数量分析',
@@ -374,7 +367,9 @@
     // labelPosition: 'outside',
     // radius: '70%',
     center: ['50%', '60%'],
-    data: []
+    data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备已检数量趋势',
@@ -383,7 +378,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备应检数量趋势',
@@ -392,7 +389,9 @@
     xAxisData: [],
     data: [],
     smooth: false,
-    gradient: false
+    gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '受检设备性能趋势',
@@ -400,12 +399,6 @@
     source: 'system',
     data: [],
     columns: [
-      // {
-      //   text: '序号',
-      //   value: 'index',
-      //   align: 'center',
-      //   width: '70'
-      // },
       {
         text: '设备名称',
         value: 'sampleName',
@@ -441,24 +434,21 @@
         value: 'totalAmount',
         align: 'center'
       }
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   }
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  }
-)
-// 模拟数据
-const loading = ref(false)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+// 获取数据
+const loadingBase = ref(false)
 function fetchData() {
-  console.log(current.value, '当前日期类型---要查询了')
   if (current.value !== '自定义时间') {
-    console.log(timeDate.value, 'timeDate')
     if (current.value === '当日') {
       searchQueryResult.value.timeStart = `${timeDate.value[0]} 00:00:00`
       searchQueryResult.value.timeEnd = `${timeDate.value[0]} 23:59:59`
@@ -469,43 +459,39 @@
   } else {
     searchQueryResult.value.timeStart = `${selectCurrentTime.value[0]} 00:00:00`
     searchQueryResult.value.timeEnd = `${selectCurrentTime.value[1]} 23:59:59`
-    console.log(selectCurrentTime.value, 'selectCurrentTime.value')
   }
-  // searchQueryResult.value.timeStart = `2024-01-01 00:00:00`
-  // searchQueryResult.value.timeEnd = `2024-12-31 23:59:59`
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then(res => {
     baseInfo.value.forEach(item => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 未检定数量分析
+  const current1 = showChart.value.filter(item => item.name === '未检定设备数量分析')[0]
+  current1.loading = true
   getNoVerificationAmount(searchQueryResult.value).then(res => {
-    // console.log(res.data, '未检定数量分析')
-    const current = showChart.value.filter(
-      item => item.name === '未检定设备数量分析'
-    )[0]
-    current.data = []
+    current1.data = []
     for (const i in res.data) {
-      current.data.push({
+      current1.data.push({
         dept: i,
         count: res.data[i]
       })
     }
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   // 受检设备来源分析
+  const current2 = showChart.value.filter(item => item.name === '受检设备来源分析')[0]
+  current2.loading = true
   getDeviceSource(searchQueryResult.value).then(res => {
-    console.log(res.data, '受检设备来源分析')
-    const current = showChart.value.filter(
-      item => item.name === '受检设备来源分析'
-    )[0]
     const data = []
     for (const i in res.data) {
-      const obj = {
-        name: '',
-        id: '',
-        value: ''
-      }
+      const obj = { name: '', id: '', value: '' }
       obj.name = i
       for (const j in res.data[i]) {
         obj.id = j
@@ -513,8 +499,17 @@
       }
       data.push(obj)
     }
-    current.data = data
-    console.log(data, '受检设备来源分析')
+    current2.data = data
+    current2.loading = false
+    // 判断是否有数据
+    if (current2.data.length) {
+      current2.isEmpty = false
+    }
+    else {
+      current2.isEmpty = true
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 受检设备各种类数量分析
   fetchQueryForTypeSoure()
@@ -523,17 +518,14 @@
   // 受检设备应检数量趋势
   fetchQueryForShouldMeasured()
   // 受检设备性能趋势
-  getDevicePerformance({
-    ...searchQueryResult.value,
-    offset: 1,
-    limit: 9999
-  }).then(res => {
-    console.log(res.data, '受检设备性能趋势')
-    const current = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
-    current.data = res.data.rows.map((item: any, index: number) => ({
-      ...item,
-      index: index + 1
-    }))
+  const current3 = showChart.value.filter(item => item.name === '受检设备性能趋势')[0]
+  current3.loading = true
+  getDevicePerformance({ ...searchQueryResult.value, offset: 1, limit: 9999 }).then(res => {
+    // console.log(res.data, '受检设备性能趋势')
+    current3.data = res.data.rows.map((item: any, index: number) => ({ ...item, index: index + 1 }))
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   //
   // loading.value = true
@@ -572,9 +564,7 @@
   //   loading.value = false
   // }, 3000)
 }
-defineExpose({
-  showChart
-})
+defineExpose({ showChart })
 
 // 拖拽结束
 const onEnd = () => {
@@ -614,12 +604,7 @@
     checkDestinationList.value = res.data
   })
   // 获取委托方列表
-  getCustomerInfoList({
-    limit: 9999,
-    offset: 1,
-    approvalStatus: '0',
-    formId: 'zyglwtfml'
-  }).then(res => {
+  getCustomerInfoList({ limit: 9999, offset: 1, approvalStatus: '0', formId: 'zyglwtfml' }).then(res => {
     customerList.value = res.data.rows.map((item: any) => ({
       name: item.customerName,
       id: item.id,
@@ -635,10 +620,7 @@
     text: '下载中请稍后',
     background: 'rgba(255, 255, 255, 0.8)',
   })
-  exportDeviceType({
-    ...searchQueryResult.value,
-    ...searchQueryForTypeSoure.value
-  }).then(res => {
+  exportDeviceType({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value }).then(res => {
     const blob = new Blob([res.data])
     exportFile(blob, '受检设备种类数量分析.xlsx')
     loading.close()
@@ -652,25 +634,28 @@
 const deviceTypeData = ref({})
 // 点击饼图
 const clickPie = (params: any, ele: any) => {
-  console.log(params, ele, '点击饼图')
+  // console.log(params, ele, '点击饼图')
   const current = showChart.value.filter((item: any) => item.name === ele.name)[0]
+  current.loading = true
   if (ele.name === '受检设备来源分析') {
     deviceSourceData.value = JSON.parse(JSON.stringify(current))
     current.data = []
     getDeviceSourceDept({ ...searchQueryResult.value, customerId: params.data.id }).then(res => {
-      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name}))
+      current.data = res.data.rows.map((item: any) => ({ ...item, companyName: params.data.name }))
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   else if (ele.name === '受检设备各种类数量分析') {
     deviceTypeData.value = JSON.parse(JSON.stringify(current))
     current.data = []
-    getDeviceTypeList({
-      ...searchQueryResult.value,
-      ...searchQueryForTypeSoure.value,
-      sampleName: params.data.name
-    }).then(res => {
+    getDeviceTypeList({ ...searchQueryResult.value, ...searchQueryForTypeSoure.value, sampleName: params.data.name }).then(res => {
       // console.log(res.data, '123')
       current.data = res.data.rows
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   current.type = 'rank-table'
@@ -729,14 +714,14 @@
         <div style="width: 101px; position: absolute; top: 0; right: 0; opacity: 0">
           <el-date-picker style="width: 101px" ref="dateRef" v-model="selectCurrentTime" type="daterange"
             range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" class="time-daterange"
-            format="YYYY-MM-DD" value-format="YYYY-MM-DD"  @focus="handlerFocus" @blur="handlerBlur" />
+            format="YYYY-MM-DD" value-format="YYYY-MM-DD" @focus="handlerFocus" @blur="handlerBlur" />
         </div>
       </div>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div class="count-item" v-for="item in baseInfo" :key="item.value">
           <div class="header-icon" style="width: 55px">
             <img :src="item.icon" width="55px" height="50px" />
@@ -756,20 +741,15 @@
       <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
         ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div :style="{
-            width: `${'31.5%'}`
-          }" class="chart-item">
+          <div :style="{ width: `${'31.5%'}` }" class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%">
                 <div class="chart-name"
-                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''" style="
-                    width: 100%;
-                    height: 10%;
-                    display: flex;
-                    margin-top: 25px;" @click="changeTable(element.name)">
+                  :class="element.name === '受检设备各种类数量分析' || element.name === '受检设备来源分析' ? 'point' : ''"
+                  style="width: 100%;height: 10%;display: flex;margin-top: 25px;" @click="changeTable(element.name)">
                   {{ element.name }}
                   <div v-if="element.name === '受检设备各种类数量分析'" style="margin-left: 40px">
                     <!-- 部门 -->
@@ -829,73 +809,29 @@
                   </div>
                 </div>
                 <div style="width: 100%; height: 80%">
-                  <pie-chart v-if="element.type === 'pie'" :title="element.title" :show-total="element.showTotal"
-                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition" :radius="element.radius" :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" @clickPie="(params: any) => {
-                      clickPie(params, element)
-                    }" />
-                  <line-chart v-if="element.type === 'line'" :colors="colors" :gradient="element.gradient"
-                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth" :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true
-                    }" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5'
-                    }" />
-                  <bar-chart-double v-if="element.type === 'bar-double'" :legend-data="element.legendData"
-                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-vertical v-if="element.type === 'bar-vertical'" :bar-coner="0" :data="element.data"
-                    :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal'" bar-width="10" :bar-coner="0"
-                    :data="element.data" :x-axis-data="element.xAxisData" :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10'
-                    }" />
-                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%" :height="300"
-                    :data="element.data" :columns="element.columns" />
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title"
+                    :show-total="element.showTotal" :data="element.data" :colors="colors" :center="element.center"
+                    label-formatter="{style1|{c}}" :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }"
+                    @clickPie="(params: any) => { clickPie(params, element) }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors"
+                    :gradient="element.gradient" :x-axis-data="element.xAxisData" :data="element.data"
+                    :smooth="element.smooth" :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5' }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty"
+                    :legend-data="element.legendData" :data1="element.data1" :data2="element.data2"
+                    :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10"
+                    :bar-coner="0" :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10' }" />
+                  <scroll-table v-if="element.type === 'rank-table' && !element.isEmpty" style="width: 100%"
+                    :height="300" :data="element.data" :columns="element.columns" />
+                  <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/meteringVerification.vue b/src/views/dataManagement/components/data/meteringVerification.vue
index b45246e..7952cd2 100644
--- a/src/views/dataManagement/components/data/meteringVerification.vue
+++ b/src/views/dataManagement/components/data/meteringVerification.vue
@@ -9,13 +9,7 @@
 import { getDictByCode } from '@/api/system/dict'
 import ScrollTable from '@/components/ScrollTable/index.vue'
 // import { getEquipmentList } from '@/api/equipment/info/book'
-import {
-  getAlreadyDeviceRank,
-  getBaseInfo,
-  getDeviceAnalysis,
-  getTimelyAnalysis,
-  getVerificationResult,
-} from '@/api/dataManagement/data/verificationAnalysis'
+import { getAlreadyDeviceRank, getBaseInfo, getDeviceAnalysis, getTimelyAnalysis, getVerificationResult, } from '@/api/dataManagement/data/verificationAnalysis'
 // import { getCompanyList } from '@/api/system/dept'
 import { getCustomerInfoList } from '@/api/resource/customer'
 import { getEquipmentList } from '@/api/business/manager/order'
@@ -26,15 +20,12 @@
     default: '',
   },
 })
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 // 检定结果分析查询条件
 const searchQueryResult = ref({
   customerId: '',
@@ -47,19 +38,16 @@
   timeStart: '',
 })
 const datetimerange = ref()
-watch(
-  () => datetimerange.value,
-  (newVal) => {
-    searchQueryResult.value.timeStart = ''
-    searchQueryResult.value.timeEnd = ''
-    if (Array.isArray(newVal)) {
-      if (newVal.length) {
-        searchQueryResult.value.timeStart = `${newVal[0]}`
-        searchQueryResult.value.timeEnd = `${newVal[1]}`
-      }
+watch(() => datetimerange.value, (newVal) => {
+  searchQueryResult.value.timeStart = ''
+  searchQueryResult.value.timeEnd = ''
+  if (Array.isArray(newVal)) {
+    if (newVal.length) {
+      searchQueryResult.value.timeStart = `${newVal[0]}`
+      searchQueryResult.value.timeEnd = `${newVal[1]}`
     }
-  },
-)
+  }
+})
 // 实验室
 const labCodeList = ref<dictType[]>([])
 // 部门
@@ -77,6 +65,8 @@
 // 查询检定结果分析
 const searchList = () => {
   // 检定结果分析
+  const current = showChart.value.filter(item => item.name === '检定结果分析')[0]
+  current.loading = true
   getVerificationResult(searchQueryResult.value).then((res) => {
     const data = [
       {
@@ -99,9 +89,6 @@
       item.data = res.data[item.value]
       // item.data = String(Math.floor(Math.random() * 100) + 1)
     })
-    const current = showChart.value.filter(
-      item => item.name === '检定结果分析',
-    )[0]
     current.data = [
       {
         name: '数量',
@@ -116,6 +103,9 @@
     else {
       current.isEmpty = false
     }
+    current.loading = false
+  }).catch(() => {
+    current.loading = false
   })
 }
 // 重置查询
@@ -224,6 +214,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '当年已检设备排行TOP10',
@@ -242,6 +234,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '检定及时分析',
@@ -264,6 +258,8 @@
         align: 'center',
       },
     ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '检定结果分析',
@@ -273,28 +269,33 @@
     data: [],
     smooth: false,
     gradient: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 ])
 
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
-const loading = ref(false)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo({ labCode: props.lab }).then((res) => {
     console.log(res.data, '获取基础数据')
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 在检设备分析
+  const current1 = showChart.value.filter(item => item.name === '在检设备分析')[0]
+  current1.loading = true
   getDeviceAnalysis({ labCode: props.lab }).then((res) => {
     const data = [
       {
@@ -326,25 +327,36 @@
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    const current = showChart.value.filter(
-      item => item.name === '在检设备分析',
-    )[0]
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    current1.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+    current1.loading = false
+    // 判断是否为空
+    if(current1.data.every((item: any)=> item.value === '0')) {
+      current1.isEmpty = true
+    }
+    else {
+      current1.isEmpty = false
+    }
+  }).catch(() => {
+    current1.loading = false
   })
   // 当年已检设备排行
+  const current2 = showChart.value.filter(item => item.name === '当年已检设备排行TOP10')[0]
+  current2.loading = true
   getAlreadyDeviceRank({ labCode: props.lab }).then((res) => {
-    const current = showChart.value.filter(
-      item => item.name === '当年已检设备排行TOP10',
-    )[0]
-    current.data = []
+    current2.data = []
     for (const i in res.data) {
-      current.data.push({
+      current2.data.push({
         name: i,
         count: res.data[i],
       })
     }
+    current2.loading = false
+  }).catch(() => {
+    current2.loading = false
   })
   // 检定及时分析
+  const current3 = showChart.value.filter(item => item.name === '检定及时分析')[0]
+  current3.loading = true
   getTimelyAnalysis({ labCode: props.lab }).then((res) => {
     const data = [
       {
@@ -363,13 +375,18 @@
         data: '',
       },
     ]
-    data.forEach((item) => {
-      item.data = res.data[item.value]
-    })
-    const current = showChart.value.filter(
-      item => item.name === '检定及时分析',
-    )[0]
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    data.forEach((item) => { item.data = res.data[item.value] })
+    current3.data = data.map(item => ({ name: item.name, value: String(item.data )}))
+    // 判断是否为空
+    if(current3.data.every((item: any)=> item.value === '0')) {
+      current3.isEmpty = true
+    }
+    else {
+      current3.isEmpty = false
+    }
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 检定结果分析
   searchList()
@@ -379,12 +396,7 @@
 })
 // 获取委托方列表
 const fetchCompanyList = () => {
-  getCustomerInfoList({
-    limit: 9999,
-    offset: 1,
-    approvalStatus: '0',
-    formId: 'zyglwtfml',
-  }).then((res) => {
+  getCustomerInfoList({ limit: 9999, offset: 1, approvalStatus: '0', formId: 'zyglwtfml' }).then((res) => {
     customerList.value = res.data.rows.map((item: any) => ({
       name: item.customerName,
       id: item.id,
@@ -395,22 +407,10 @@
 fetchCompanyList()
 // 获取受检设备
 const fetchDevice = () => {
-  getEquipmentList({
-    customerId: searchQueryResult.value.customerId,
-    equipmentType: '1',
-    offset: 1,
-    limit: 9999,
-  }).then((res) => {
-    console.log(res.data, '受检设备')
+  getEquipmentList({ customerId: searchQueryResult.value.customerId, equipmentType: '1', offset: 1, limit: 9999 }).then((res) => {
+    // console.log(res.data, '受检设备')
     allDeviceList.value = res.data.rows
-    sampleNameList.value = uniqueMultiArray(
-      res.data.rows.map((item: any) => ({
-        sampleName: item.equipmentName,
-        model: item.model,
-        helpInstruction: item.helpInstruction,
-      })),
-      'sampleName',
-    )
+    sampleNameList.value = uniqueMultiArray(res.data.rows.map((item: any) => ({ sampleName: item.equipmentName, model: item.model, helpInstruction: item.helpInstruction, })), 'sampleName',)
   })
 }
 fetchDevice()
@@ -430,32 +430,21 @@
 }
 // 改变设备名称查询条件
 const changeSampleName = (value: string) => {
-  console.log(value, '设备名称')
+  // console.log(value, '设备名称')
   modelList.value = []
   helpInstructionList.value = []
   searchQueryResult.value.model = ''
   searchQueryResult.value.helpInstruction = ''
-  modelList.value = uniqueMultiArray(
-    allDeviceList.value
-      .filter((item: any) => item.equipmentName === value)
-      .map((item: any) => ({
-        sampleName: item.equipmentName,
-        model: item.model,
-        helpInstruction: item.helpInstruction,
-      })),
-    'model',
-  )
+  modelList.value = uniqueMultiArray(allDeviceList.value.filter((item: any) => item.equipmentName === value).map((item: any) => ({ sampleName: item.equipmentName, model: item.model, helpInstruction: item.helpInstruction, })), 'model',)
   helpInstructionList.value = modelList.value
-  console.log(modelList.value, 'modelList.value')
+  // console.log(modelList.value, 'modelList.value')
 }
 // 改变规格型号查询条件
 const changeHelpInstruction = (value: string) => {
-  console.log(value, '规格型号')
+  // console.log(value, '规格型号')
   helpInstructionList.value = []
   searchQueryResult.value.helpInstruction = ''
-  helpInstructionList.value = modelList.value.filter(
-    item => item.model === value,
-  )
+  helpInstructionList.value = modelList.value.filter(item => item.model === value)
 }
 // 拖拽结束
 const onEnd = () => {
@@ -474,7 +463,7 @@
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <!-- <svg-icon name="icon-env-device-online" class="icon-button-icon" /> -->
@@ -492,265 +481,104 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                showChart.length === 4
-                  ? '48%'
-                  : index === 0 || index === 1
-                    ? '48%'
-                    : '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${showChart.length === 4 ? '48%' : index === 0 || index === 1 ? '48%' : '31.5%'}` }"
+            class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
-              <div
-                v-if="element.type === 'pie'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+            <div v-loading="element.loading" class="chart-page">
+              <div v-if="element.type === 'pie'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
-                <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-show="element.showType == 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-show="element.showType == 'table'"
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" />
+                <div v-show="!element.isEmpty" style="width: 100%; height: 90%;">
+                  <pie-chart v-show="element.showType == 'pie'" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-show="element.showType == 'table'" style="width: 100%;" :height="300"
+                    :data="element.data" :columns="element.columns" />
                 </div>
               </div>
-              <div
-                v-if="element.type === 'rank-table'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+              <div v-if="element.type === 'rank-table'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
+                <!-- <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" /> -->
                 <div style="width: 100%; height: 90%;">
-                  <scroll-table
-                    style="width: 100%;"
-                    :height="300"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                  <scroll-table style="width: 100%;" :height="300" :data="element.data" :columns="element.columns" />
                 </div>
               </div>
-              <div
-                v-if="element.type === 'bar-horizontal'"
-                style="width: 100%; height: 100%;"
-              >
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%;"
-                  @click="changeShowType(element)"
-                >
+              <div v-if="element.type === 'bar-horizontal'" style="width: 100%; height: 100%;">
+                <div class="chart-name" style="width: 100%; height: 10%;" @click="changeShowType(element)">
                   {{ element.name }}
                 </div>
                 <!-- 查询条件 -->
-                <search-area
-                  :need-clear="true"
-                  @search="searchList"
-                  @clear="clearList"
-                >
+                <search-area :need-clear="true" @search="searchList" @clear="clearList">
                   <!-- 实验室 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.labCode"
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="实验室"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in labCodeList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.labCode" style="width: 130px;" class="short-input"
+                      placeholder="实验室" clearable>
+                      <el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 部门 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.groupCode"
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="部门"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in groupCodeList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.groupCode" style="width: 130px;" class="short-input"
+                      placeholder="部门" clearable>
+                      <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 委托方 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.customerId"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="委托方"
-                      clearable
-                      @change="changeCustomer"
-                    >
-                      <el-option
-                        v-for="item in customerList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.value"
-                      />
+                    <el-select v-model="searchQueryResult.customerId" filterable style="width: 130px;"
+                      class="short-input" placeholder="委托方" clearable @change="changeCustomer">
+                      <el-option v-for="item in customerList" :key="item.id" :label="item.name" :value="item.value" />
                     </el-select>
                   </search-item>
                   <!-- 受检设备名称 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.sampleName"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="受检设备名称"
-                      clearable
-                      @change="changeSampleName"
-                    >
-                      <el-option
-                        v-for="item in sampleNameList"
-                        :key="item.sampleName"
-                        :label="item.sampleName"
-                        :value="item.sampleName"
-                      />
+                    <el-select v-model="searchQueryResult.sampleName" filterable style="width: 130px;"
+                      class="short-input" placeholder="受检设备名称" clearable @change="changeSampleName">
+                      <el-option v-for="item in sampleNameList" :key="item.sampleName" :label="item.sampleName"
+                        :value="item.sampleName" />
                     </el-select>
                   </search-item>
                   <!-- 规格型号 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.model"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="规格型号"
-                      clearable
-                      @change="changeHelpInstruction"
-                    >
-                      <el-option
-                        v-for="item in modelList"
-                        :key="item.model"
-                        :label="item.model"
-                        :value="item.model"
-                      />
+                    <el-select v-model="searchQueryResult.model" filterable style="width: 130px;" class="short-input"
+                      placeholder="规格型号" clearable @change="changeHelpInstruction">
+                      <el-option v-for="item in modelList" :key="item.model" :label="item.model" :value="item.model" />
                     </el-select>
                   </search-item>
                   <!-- 辅助字段 -->
                   <search-item>
-                    <el-select
-                      v-model="searchQueryResult.helpInstruction"
-                      filterable
-                      style="width: 130px;"
-                      class="short-input"
-                      placeholder="辅助字段"
-                      clearable
-                    >
-                      <el-option
-                        v-for="item in helpInstructionList"
-                        :key="item.helpInstruction"
-                        :label="item.helpInstruction"
-                        :value="item.helpInstruction"
-                      />
+                    <el-select v-model="searchQueryResult.helpInstruction" filterable style="width: 130px;"
+                      class="short-input" placeholder="辅助字段" clearable>
+                      <el-option v-for="item in helpInstructionList" :key="item.helpInstruction"
+                        :label="item.helpInstruction" :value="item.helpInstruction" />
                     </el-select>
                   </search-item>
                   <!-- 时间 -->
                   <search-item>
                     <div style="width: 350px !important;">
-                      <el-date-picker
-                        v-model="datetimerange"
-                        type="daterange"
-                        value-format="YYYY-MM-DD"
-                        format="YYYY-MM-DD"
-                        range-separator="至"
-                        start-placeholder="检定开始时间"
-                        end-placeholder="检定结束时间"
-                        clearable
-                      />
+                      <el-date-picker v-model="datetimerange" type="daterange" value-format="YYYY-MM-DD"
+                        format="YYYY-MM-DD" range-separator="至" start-placeholder="检定开始时间" end-placeholder="检定结束时间"
+                        clearable />
                     </div>
                   </search-item>
                 </search-area>
                 <div style="width: 100%; height: 70%;">
-                  <el-empty
-                    v-show="element.isEmpty"
-                    :image-size="100"
-                    description="暂无数据"
-                  />
-                  <bar-chart-horizontal
-                    v-show="!element.isEmpty"
-                    bar-width="30"
-                    :bar-coner="0"
-                    :data="element.data"
+                  <el-empty v-show="element.isEmpty" :image-size="100" description="暂无数据" />
+                  <bar-chart-horizontal v-show="!element.isEmpty" bar-width="25" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }"
+                    :grid="{ top: 20, left: 20, right: 60, bottom: 30, containLabel: true, }"/>
                 </div>
               </div>
               <!--  -->
diff --git a/src/views/dataManagement/components/data/resourceManage.vue b/src/views/dataManagement/components/data/resourceManage.vue
index a1f2fb0..907ce29 100644
--- a/src/views/dataManagement/components/data/resourceManage.vue
+++ b/src/views/dataManagement/components/data/resourceManage.vue
@@ -6,13 +6,7 @@
 import { resourceManage } from './img'
 import type { deptType, dictType } from '@/global'
 import { getRangeAllTime } from '@/utils/date'
-import {
-  getBaseInfo,
-  getCertDistribute,
-  getCertExpire,
-  getFileCategory,
-  getFileNovelty,
-} from '@/api/dataManagement/data/resourceManagement'
+import { getBaseInfo, getCertDistribute, getCertExpire, getFileCategory, getFileNovelty, } from '@/api/dataManagement/data/resourceManagement'
 import { getDictByCode } from '@/api/system/dict'
 
 const props = defineProps({
@@ -35,19 +29,17 @@
   timeStart: '',
   timeEnd: '',
 })
-watch(
-  () => datetimerange.value,
-  (newVal) => {
-    certDistribute.value.timeStart = ''
-    certDistribute.value.timeEnd = ''
-    if (Array.isArray(newVal)) {
-      if (newVal.length) {
-        certDistribute.value.timeStart = `${newVal[0]}`
-        certDistribute.value.timeEnd = `${newVal[1]}`
-      }
+watch(() => datetimerange.value, (newVal) => {
+  certDistribute.value.timeStart = ''
+  certDistribute.value.timeEnd = ''
+  if (Array.isArray(newVal)) {
+    if (newVal.length) {
+      certDistribute.value.timeStart = `${newVal[0]}`
+      certDistribute.value.timeEnd = `${newVal[1]}`
+      fetchPerson()
     }
-  },
-)
+  }
+})
 // 部门
 const groupCodeList = ref<dictType[]>([])
 // 基础信息展示数据
@@ -57,53 +49,50 @@
     value: 'staffAmount',
     data: '',
     icon: resourceManage['人员总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '体系文件总数',
     value: 'systemFileAmount',
     data: '',
     icon: resourceManage['体系文件总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '测试校准检定方法总数',
     value: 'techniqueFileAmount',
     data: '',
     icon: resourceManage['测试校准检定方法总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '在用软件总数',
     value: 'softwareAmount',
     data: '',
     icon: resourceManage['在用软件总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '合格供方总数',
     value: 'supplierAmount',
     data: '',
     icon: resourceManage['合格供方总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
   {
     name: '委托方总数',
     value: 'customerAmount',
     data: '',
     icon: resourceManage['委托方总数'],
-    color: '#0000FF',
+    color: '#60ACFC',
   },
 ])
-watch(
-  () => props.lab,
-  (newVal) => {
-    if (newVal) {
-      searchQueryResult.value.labCode = props.lab
-      fetchData()
-    }
-  },
-)
+watch(() => props.lab, (newVal) => {
+  if (newVal) {
+    searchQueryResult.value.labCode = props.lab
+    fetchData()
+  }
+})
 const showChart = ref<any[]>([
   {
     name: '人员持证到期趋势',
@@ -113,6 +102,8 @@
     data: [],
     smooth: false,
     gradient: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '人员证书分布',
@@ -122,6 +113,8 @@
     xAxisData: [],
     data1: [],
     data2: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '体系文件分类',
@@ -132,63 +125,91 @@
     radius: ['60%', '45%'],
     title: ' ',
     showTotal: true,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '测试校准检定方法查新分析',
     type: 'bar-vertical',
     source: 'bar',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 ])
-watch(
-  () => showChart.value.length,
-  () => {
-    setTimeout(() => {
-      const resize = new Event('resize')
-      window.dispatchEvent(resize)
-    })
-  },
-)
+watch(() => showChart.value.length, () => {
+  setTimeout(() => {
+    const resize = new Event('resize')
+    window.dispatchEvent(resize)
+  })
+})
+// 人员持证到期趋势
+const fetchPerson = () => {
+  // 人员持证到期趋势
+  const current1 = showChart.value.filter(item => item.name === '人员持证到期趋势')[0]
+  current1.loading = true
+  getCertExpire({ ...searchQueryResult.value, ...certDistribute.value }).then((res) => {
+    // console.log(res.data, '人员持证到期趋势')
+    current1.data = [
+      {
+        name: '人员证书到期数量',
+        symbol: 'emptyCircle',
+        data: res.data.map((item: any) => String(item.certExpireAmount)),
+      },
+    ]
+    current1.xAxisData = res.data.map((item: any) => `${item.year}第${item.quarter}季度`)
+    current1.loading = false
+    // 判断是否为空
+    if(!res.data || !res.data.length) {
+      current1.isEmpty = true
+    }
+    else {
+      current1.isEmpty = false
+    }
+  }).catch(() => {
+    current1.loading = false
+  })
+}
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础信息
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then((res) => {
-    console.log(res.data, '基础信息')
+    // console.log(res.data, '基础信息')
     baseInfo.value.forEach((item) => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 人员持证到期趋势
-  getCertExpire({ ...searchQueryResult.value, ...certDistribute.value }).then(
-    (res) => {
-      console.log(res.data, '人员持证到期趋势')
-      const current = showChart.value.filter(
-        item => item.name === '人员持证到期趋势',
-      )[0]
-      current.data = [
-        {
-          name: '人员证书到期数量',
-          symbol: 'emptyCircle',
-          data: res.data.map((item: any) => String(item.certExpireAmount)),
-        },
-      ]
-      current.xAxisData = res.data.map((item: any) => `${item.year}第${item.quarter}季度`)
-    },
-  )
+  fetchPerson()
   // 人员证书分布
+  const current2 = showChart.value.filter(item => item.name === '人员证书分布')[0]
+  current2.loading = true
   getCertDistribute(searchQueryResult.value).then((res) => {
-    console.log(res.data, '人员证书分布')
-    const current = showChart.value.filter(
-      item => item.name === '人员证书分布',
-    )[0]
-    current.legendData = ['证书总数', '有效证书总数']
-    current.xAxisData = res.data.map((item: any) => item.certTypeName)
-    current.data1 = res.data.map((item: any) => String(item.totalAmount))
-    current.data2 = res.data.map((item: any) => String(item.validAmount))
+    // console.log(res.data, '人员证书分布')
+    current2.legendData = ['证书总数', '有效证书总数']
+    current2.xAxisData = res.data.map((item: any) => item.certTypeName)
+    current2.data1 = res.data.map((item: any) => String(item.totalAmount))
+    current2.data2 = res.data.map((item: any) => String(item.validAmount))
+    current2.loading = false
+    // 判断是否为空
+    if(current2.data1.every((item: any) => item === '0') && current2.data2.every((item: any) => item === '0')) {
+      current2.isEmpty = true
+    }
+    else {
+      current2.isEmpty = false
+    }
+  }).catch(() => {
+    current2.loading = false
   })
   // 体系文件分类
+  const current3 = showChart.value.filter(item => item.name === '体系文件分类')[0]
+  current3.loading = true
   getFileCategory(searchQueryResult.value).then((res) => {
-    console.log(res.data, '体系文件分类')
+    // console.log(res.data, '体系文件分类')
     const data = [
       {
         name: '质量手册',
@@ -211,22 +232,28 @@
         data: '',
       },
     ]
-    const current = showChart.value.filter(
-      item => item.name === '体系文件分类',
-    )[0]
     data.forEach((item) => {
       item.data = res.data[item.value]
     })
-    current.data = data.map(item => ({ name: item.name, value: item.data }))
+    current3.data = data.map(item => ({ name: item.name, value: item.data }))
+    current3.loading = false
+    // 判断是否为空
+    if(current3.data.every((item: any) => String(item.value) === '0')) {
+      current3.isEmpty = true
+    }
+    else {
+      current3.isEmpty = false
+    }
+  }).catch(() => {
+    current3.loading = false
   })
   // 测试校准检定方法查新分析
+  const current4 = showChart.value.filter(item => item.name === '测试校准检定方法查新分析')[0]
+  current4.loading = true
   getFileNovelty(searchQueryResult.value).then((res) => {
-    console.log(res.data, '测试校准检定方法查新分析')
-    const current = showChart.value.filter(
-      item => item.name === '测试校准检定方法查新分析',
-    )[0]
-    current.xAxisData = res.data.map((item: any) => item.groupCodeName)
-    current.data = [
+    // console.log(res.data, '测试校准检定方法查新分析')
+    current4.xAxisData = res.data.map((item: any) => item.groupCodeName)
+    current4.data = [
       {
         name: '有查新',
         data: res.data.map((item: any) => String(item.haveNovelty)),
@@ -236,6 +263,16 @@
         data: res.data.map((item: any) => String(item.noNovelty)),
       },
     ]
+    current4.loading = false
+    // 判断是否为空
+    if(res.data.map((item: any) => String(item.haveNovelty)).every((item: any) => item ==='0') && res.data.map((item: any) => String(item.noNovelty)).every((item: any) => item ==='0')) {
+      current4.isEmpty = true
+    }
+    else {
+      current4.isEmpty = false
+    }
+  }).catch(() => {
+    current4.loading = false
   })
   // loading.value = true
   // // 人员持证到期趋势
@@ -291,11 +328,7 @@
 }
 onMounted(() => {
   if (props.lab) {
-    datetimerange.value = [
-      // dayjs().subtract(6, 'month').format('YYYY-MM-DD'),
-      `${new Date().getFullYear()}-01-01`,
-      dayjs().format('YYYY-MM-DD'),
-    ]
+    datetimerange.value = [`${new Date().getFullYear()}-01-01`, dayjs().format('YYYY-MM-DD')]
     searchQueryResult.value.labCode = props.lab
     // 部门
     getDictByCode('bizGroupCode').then((response) => {
@@ -325,25 +358,15 @@
     <div class="btns">
       <div />
       <!-- 部门 -->
-      <el-select
-        v-model="searchQueryResult.groupCode"
-        style="width: 130px;"
-        class="short-input"
-        placeholder="部门"
-        clearable
-      >
-        <el-option
-          v-for="item in groupCodeList"
-          :key="item.id"
-          :label="item.name"
-          :value="item.value"
-        />
+      <el-select v-model="searchQueryResult.groupCode" style="width: 130px;" class="short-input" placeholder="部门"
+        clearable>
+        <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
       </el-select>
     </div>
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div v-for="item in baseInfo" :key="item.value" class="count-item">
           <div class="header-icon">
             <img :src="item.icon">
@@ -360,160 +383,45 @@
       </div>
       <!-- 图表区域 -->
       <!-- <div class="chart"> -->
-      <draggable
-        v-model="showChart"
-        item-key="name"
-        class="chart"
-        animation="300"
-        drag-class="dragClass"
-        ghost-class="ghostClass"
-        chosen-class="chosenClass"
-        @end="onEnd"
-      >
+      <draggable v-model="showChart" item-key="name" class="chart" animation="300" drag-class="dragClass"
+        ghost-class="ghostClass" chosen-class="chosenClass" @end="onEnd">
         <template #item="{ element, index }">
-          <div
-            :style="{
-              width: `${
-                showChart.length === 4
-                  ? '48%'
-                  : index === 0 || index === 1
-                    ? '48%'
-                    : '31.5%'
-              }`,
-            }"
-            class="chart-item"
-          >
+          <div :style="{ width: `${showChart.length === 4 ? '48%' : index === 0 || index === 1 ? '48%' : '31.5%'}`, }"
+            class="chart-item">
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%;">
-                <div
-                  class="chart-name"
-                  style="width: 100%; height: 10%; display: flex;"
-                >
+                <div class="chart-name" style="width: 100%; height: 10%; display: flex;">
                   {{ element.name }}
-                  <div
-                    v-if="element.name === '人员持证到期趋势'"
-                    style="width: 350px; margin-left: 40px;"
-                  >
-                    <el-date-picker
-                      v-model="datetimerange"
-                      type="daterange"
-                      value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD"
-                      range-separator="至"
-                      start-placeholder="开始时间"
-                      end-placeholder="结束时间"
-                    />
+                  <div v-if="element.name === '人员持证到期趋势'" style="width: 350px; margin-left: 40px;">
+                    <el-date-picker v-model="datetimerange" type="daterange" value-format="YYYY-MM-DD"
+                      format="YYYY-MM-DD" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" />
                   </div>
                 </div>
                 <div style="width: 100%; height: 90%;">
-                  <pie-chart
-                    v-if="element.type === 'pie'"
-                    :title="element.title"
-                    :show-total="element.showTotal"
-                    :data="element.data"
-                    :colors="colors"
-                    :center="element.center"
-                    label-formatter="{style1|{c}}"
-                    :label-position="element.labelPosition"
-                    :radius="element.radius"
-                    :grid="{
-                      top: 50,
-                      left: 15,
-                      right: 15,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <line-chart
-                    v-if="element.type === 'line'"
-                    :colors="colors"
-                    :gradient="element.gradient"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
+                    :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
+                    :label-position="element.labelPosition" :radius="element.radius"
+                    :grid="{ top: 50, left: 15, right: 15, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
+                    :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth"
+                    :grid="{ top: 47, left: 5, right: 5, bottom: 10, containLabel: true, }"
+                    :legend="{ itemWidth: 8, itemHeight: 2, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '5', }" />
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
+                    :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData"
-                    :data="element.data"
-                    :smooth="element.smooth"
-                    :grid="{
-                      top: 47,
-                      left: 5,
-                      right: 5,
-                      bottom: 10,
-                      containLabel: true,
-                    }"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 2,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '5',
-                    }"
-                  />
-                  <bar-chart-double
-                    v-if="element.type === 'bar-double'"
-                    :legend-data="element.legendData"
-                    :data1="element.data1"
-                    :data2="element.data2"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-vertical
-                    v-if="element.type === 'bar-vertical'"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <bar-chart-horizontal
-                    v-if="element.type === 'bar-horizontal'"
-                    bar-width="10"
-                    :bar-coner="0"
-                    :data="element.data"
-                    :x-axis-data="element.xAxisData"
-                    :legend="{
-                      itemWidth: 8,
-                      itemHeight: 8,
-                      type: 'scroll',
-                      orient: 'horizontal',
-                      icon: 'roundRect',
-                      left: '0',
-                      top: '10',
-                    }"
-                  />
-                  <scroll-table
-                    v-if="element.type === 'rank-table'"
-                    style="width: 100%;"
-                    :height="330"
-                    :data="element.data"
-                    :columns="element.columns"
-                  />
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
+                    :data="element.data" :x-axis-data="element.xAxisData"
+                    :legend="{ itemWidth: 8, itemHeight: 8, type: 'scroll', orient: 'horizontal', icon: 'roundRect', left: '0', top: '10', }" />
+                  <scroll-table v-if="element.type === 'rank-table'" style="width: 100%;" :height="330"
+                    :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/standardDevice.vue b/src/views/dataManagement/components/data/standardDevice.vue
index 62b94ed..3859363 100644
--- a/src/views/dataManagement/components/data/standardDevice.vue
+++ b/src/views/dataManagement/components/data/standardDevice.vue
@@ -69,11 +69,15 @@
     type: 'line',
     source: 'system',
     smooth: false,
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '标准装置状态分析',
     type: 'bar-horizontal',
     source: 'system',
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '近一年部门核查分析',
@@ -90,7 +94,9 @@
       ['#2352d6', '#fff'],
       ['#fed700', '#fff'],
       ['#feb501', '#fff'],
-    ]
+    ],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
   {
     name: '当年标准装置核查排行榜',
@@ -115,6 +121,8 @@
 
     ],
     data: [],
+    loading: false, // 加载中
+    isEmpty: false, // 是否为空
   },
 ])
 watch(() => showChart.value.length, () => {
@@ -124,23 +132,24 @@
   })
 })
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   // 获取基础数据
+  loadingBase.value = true
   getBaseInfo(searchQueryResult.value).then(res => {
     baseInfo.value.forEach(item => {
       item.data = res.data[item.value]
     })
+    loadingBase.value = false
+  }).catch(() => {
+    loadingBase.value = false
   })
   // 近五年标准装置复查趋势
-  getNearYearTrend({
-    ...searchQueryResult.value,
-    timeStart: dayjs().subtract(5, 'year').format('YYYY-MM-DD'),
-    timeEnd: dayjs().format('YYYY-MM-DD')
-  }).then(res => {
-    console.log(res.data, '近五年标准装置复查趋势')
-    const current = showChart.value.filter((item: any) => item.name === '近五年标准装置复查趋势')[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+  const current1 = showChart.value.filter((item: any) => item.name === '近五年标准装置复查趋势')[0]
+  current1.loading = true
+  getNearYearTrend({...searchQueryResult.value,timeStart: dayjs().subtract(5, 'year').format('YYYY-MM-DD'), timeEnd: dayjs().format('YYYY-MM-DD')}).then(res => {
+    // console.log(res.data, '近五年标准装置复查趋势')
+    current1.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '无线电脉冲组',
@@ -158,21 +167,21 @@
         data: ''
       },
     ]
-    current.data = data.map((item: any) => ({
+    current1.data = data.map((item: any) => ({
       name: item.name,
       symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current1.loading = false
+  }).catch(() => {
+    current1.loading = false
   })
   //  标准装置状态分析
-  getStandardStatusAnalysis({
-    ...searchQueryResult.value,
-    timeStart: `${new Date().getFullYear()}-01-01`,
-    timeEnd: dayjs().format('YYYY-MM-DD')
-  }).then(res => {
-    console.log(res.data, '标准装置状态分析')
-    const current = showChart.value.filter((item: any) => item.name === '标准装置状态分析')[0]
-    current.xAxisData = res.data.map((item: any) => item.approvalTypeName)
+  const current2 = showChart.value.filter((item: any) => item.name === '标准装置状态分析')[0]
+  current2.loading = true
+  getStandardStatusAnalysis({...searchQueryResult.value,timeStart: `${new Date().getFullYear()}-01-01`,timeEnd: dayjs().format('YYYY-MM-DD')}).then(res => {
+    // console.log(res.data, '标准装置状态分析')
+    current2.xAxisData = res.data.map((item: any) => item.approvalTypeName)
     const data = [
       {
         name: '无线电脉冲组',
@@ -190,21 +199,21 @@
         data: ''
       },
     ]
-    current.data = data.map((item: any) => ({
+    current2.data = data.map((item: any) => ({
       name: item.name,
       // symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current2.loading = false
+  }).catch(() => {
+    current2.loading = false
   })
   // 近一年部门核查分析
-  getOneYearAnalysis({
-    ...searchQueryResult.value,
-    timeStart: `${new Date().getFullYear()}-01-01`,
-    timeEnd: dayjs().format('YYYY-MM-DD')
-  }).then(res => {
-    console.log(res.data, '近一年部门核查分析')
-    const current = showChart.value.filter((item: any) => item.name === '近一年部门核查分析')[0]
-    current.xAxisData = res.data.map((item: any) => item.dimension)
+  const current3 = showChart.value.filter((item: any) => item.name === '近一年部门核查分析')[0]
+  current3.loading = true
+  getOneYearAnalysis({...searchQueryResult.value, timeStart: `${new Date().getFullYear()}-01-01`,timeEnd: dayjs().format('YYYY-MM-DD')}).then(res => {
+    // console.log(res.data, '近一年部门核查分析')
+    current3.xAxisData = res.data.map((item: any) => item.dimension)
     const data = [
       {
         name: '无线电脉冲组',
@@ -222,21 +231,24 @@
         data: ''
       },
     ]
-    current.data = data.map((item: any) => ({
+    current3.data = data.map((item: any) => ({
       name: item.name,
       // symbol: 'circle',
       data: res.data.map((citem: any) => String(citem[data.filter((ccitem: any) => ccitem.name === item.name)[0].value]))
     }))
+    current3.loading = false
+  }).catch(() => {
+    current3.loading = false
   })
   // 当年标准装置核查排行榜
-  getCurrentYearRank({
-    ...searchQueryResult.value,
-    timeStart: `${new Date().getFullYear()}-01-01`,
-    timeEnd: dayjs().format('YYYY-MM-DD')
-  }).then(res => {
-    console.log(res.data, '当年标准装置核查排行榜')
-    const current = showChart.value.filter((item: any) => item.name === '当年标准装置核查排行榜')[0]
-    current.data = res.data.rows
+  const current4 = showChart.value.filter((item: any) => item.name === '当年标准装置核查排行榜')[0]
+  current4.loading = true
+  getCurrentYearRank({...searchQueryResult.value,timeStart: `${new Date().getFullYear()}-01-01`,timeEnd: dayjs().format('YYYY-MM-DD')}).then(res => {
+    // console.log(res.data, '当年标准装置核查排行榜')
+    current4.data = res.data.rows
+    current4.loading = false
+  }).catch(() => {
+    current4.loading = false
   })
   // loading.value = true
   // // 近五年标准装置复查趋势
@@ -303,7 +315,7 @@
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div class="count">
+      <div v-loading="loadingBase" class="count">
         <div class="count-item" v-for="item in baseInfo" :key="item.value">
           <div class="header-icon">
             <img :src="item.icon" />
@@ -328,17 +340,13 @@
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%">
                 <div class="chart-name" style="width: 100%; height: 10%; display: flex">
                   {{ element.name }}
-                  <div v-if="element.name === '人员持证到期趋势'" style="width: 350px; margin-left: 40px">
-                    <el-date-picker v-model="datetimerange" type="daterange" value-format="YYYY-MM-DD"
-                      format="YYYY-MM-DD" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" />
-                  </div>
                 </div>
                 <div style="width: 100%; height: 90%">
-                  <pie-chart v-if="element.type === 'pie'" :title="element.title" :show-total="element.showTotal"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
                     :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
                     :label-position="element.labelPosition" :radius="element.radius" :grid="{
                       top: 50,
@@ -355,7 +363,7 @@
                       left: '0',
                       top: '10'
                     }" />
-                  <line-chart v-if="element.type === 'line'" :colors="colors" :gradient="element.gradient"
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
                     :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth" :grid="{
                       top: 47,
                       left: 5,
@@ -371,7 +379,7 @@
                       left: '0',
                       top: '5'
                     }" />
-                  <bar-chart-double v-if="element.type === 'bar-double'" :legend-data="element.legendData"
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
                     :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData" :legend="{
                       itemWidth: 8,
                       itemHeight: 8,
@@ -381,7 +389,7 @@
                       left: '0',
                       top: '10'
                     }" />
-                  <bar-chart-vertical v-if="element.type === 'bar-vertical'" :bar-coner="0" :data="element.data"
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData" :legend="{
                       itemWidth: 8,
                       itemHeight: 8,
@@ -394,7 +402,7 @@
                     :colors="element.colors"
                     :gradient="false"
                     />
-                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal'" bar-width="10" :bar-coner="0"
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
                     :data="element.data" :x-axis-data="element.xAxisData" :legend="{
                       itemWidth: 8,
                       itemHeight: 8,
@@ -406,6 +414,7 @@
                     }" />
                   <scroll-table v-if="element.type === 'rank-table'" style="width: 100%" :height="310"
                     :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>
diff --git a/src/views/dataManagement/components/data/verificationCertificate.vue b/src/views/dataManagement/components/data/verificationCertificate.vue
index b7f4b70..3aef633 100644
--- a/src/views/dataManagement/components/data/verificationCertificate.vue
+++ b/src/views/dataManagement/components/data/verificationCertificate.vue
@@ -262,7 +262,7 @@
   })
 })
 // 模拟数据
-const loading = ref(false)
+const loadingBase = ref(false)
 function fetchData() {
   if (current.value !== '自定义时间') {
     // console.log(timeDate.value, 'timeDate')
@@ -276,45 +276,63 @@
   } else {
     searchQueryResult.value.timeStart = `${selectCurrentTime.value[0]} 00:00:00`
     searchQueryResult.value.timeEnd = `${selectCurrentTime.value[1]} 23:59:59`
-    // console.log(selectCurrentTime.value, 'selectCurrentTime.value')
   }
-  // searchQueryResult.value.timeStart = `2024-01-01 00:00:00`
-  // searchQueryResult.value.timeEnd = `2024-12-31 23:59:59`
   if (searchQueryResult.value.contentType !== '3') {
     // 获取基础信息
+    loadingBase.value = true
     getBaseInfo(searchQueryResult.value).then(res => {
       baseInfo.value.forEach(item => {
         item.data = res.data[item.value]
       })
+      loadingBase.value = false
+    }).catch(() => {
+      loadingBase.value = false
     })
     // 检定人员排行榜
+    const current1 = showChartBase.value.filter(item => item.name === '检定人员排行榜')[0]
+    current1.loading = true
     getStaffRank(searchQueryResult.value).then(res => {
-      const current = showChart.value.filter(item => item.name === '检定人员排行榜')[0]
-      console.log(res.data, '检定人员排行榜')
-      current.data = res.data.rows
+      // console.log(res.data, '检定人员排行榜')
+      current1.data = res.data.rows
+      current1.loading = false
+    }).catch(() => {
+      current1.loading = false
     })
     // 检校类别分析
+    const current2 = showChartBase.value.filter(item => item.name === '检校类别分析')[0]
+    current2.loading = true
     getCategoryAnalysis(searchQueryResult.value).then(res => {
-      const current = showChart.value.filter(item => item.name === '检校类别分析')[0]
-      console.log(res.data, '检校类别分析')
-      current.xAxisData = res.data.map((item: any) => item.measureCategoryName)
+      // console.log(res.data, '检校类别分析')
+      current2.xAxisData = res.data.map((item: any) => item.measureCategoryName)
       const data = [
         { name: '合格', value: 'qualifiedAmount' },
         { name: '不合格', value: 'unqualifiedAmount' },
         { name: '除*外合格', value: 'otherAmount' },
       ]
-      current.data = data.map((item: any, index: number) => ({
+      current2.data = data.map((item: any, index: number) => ({
         name: item.name,
         stack: 'Ad',
         color: colors[index],
         data: res.data.map((citem: any) => String(citem[data[index].value]))
         // data: data.map(item => Math.floor(Math.random() * 100) + 1),
       }))
+      console.log(current2.data, 'current2.data')
+      // 判断是否为空
+      if(current2.data.every((item: any) => item.data.every((item: string) => item === '0'))) {
+        current2.isEmpty = true
+      }
+      else {
+        current2.isEmpty = false
+      }
+      current2.loading = false
+    }).catch(() => {
+      current2.loading = false
     })
     // 部门检校证书比例
+    const current3 = showChartBase.value.filter(item => item.name === '部门检校证书比例' || item.name === '部门原始记录比例')[0]
+    current3.loading = true
     getDeptRate(searchQueryResult.value).then(res => {
-      console.log(res.data, '部门检校证书比例')
-      const current = showChart.value.filter(item => item.name === '部门检校证书比例' || item.name === '部门原始记录比例')[0]
+      // console.log(res.data, '部门检校证书比例')
       const data = [
         {
           name: '电学电源组',
@@ -333,11 +351,22 @@
         }
       ]
       data.forEach(item => { item.data = res.data[item.value] })
-      current.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+      current3.data = data.map(item => ({ name: item.name, value: String(item.data) }))
+      // 判断是否为空
+      if(current3.data.every((item: any) => item.value === '0')) {
+        current3.isEmpty = true
+      }
+      else {
+        current3.isEmpty = false
+      }
+      current3.loading = false
+    }).catch(() => {
+      current3.loading = false
     })
     // 部门检校证书分析
+    const current4 = showChartBase.value.filter(item => item.name === '部门检校证书分析' || item.name === '部门原始记录分析')[0]
+    current4.loading = true
     getDeptAnalysis(searchQueryResult.value).then(res => {
-      const current = showChart.value.filter(item => item.name === '部门检校证书分析' || item.name === '部门原始记录分析')[0]
       console.log(res.data, '部门检校证书分析')
       const data = [
         {
@@ -361,20 +390,25 @@
           data: ''
         },
       ]
-      current.xAxisData = res.data.map((item: any) => item.groupCodeName)
-      current.data = data.map((item: any, index: number) => ({
+      current4.xAxisData = res.data.map((item: any) => item.groupCodeName)
+      current4.data = data.map((item: any, index: number) => ({
         name: item.name,
         data: res.data.map((citem: any) => String(citem[item.value])),
         color: JSON.parse(JSON.stringify(colors)).reverse()[index]
       }))
+      current4.loading = false
+    }).catch(() => {
+      current4.loading = false
     })
   }
   else {
+    const current = showChartBase.value.filter(item => item.name === '设备列表')[0]
+    current.loading = true
     getOnlyRecord(searchQueryResult.value).then(res => {
-      console.log(res.data, '设备列表')
-      const current = showChart.value.filter(item => item.name === '设备列表')[0]
-      console.log(res.data, '设备列表')
       current.data = res.data.rows
+      current.loading = false
+    }).catch(() => {
+      current.loading = false
     })
   }
   // loading.value = true
@@ -452,7 +486,7 @@
     <!-- 展示内容 -->
     <div class="content-count">
       <!-- 统计数据 -->
-      <div v-show="searchQueryResult.contentType !== '3'" class="count">
+      <div v-loading="loadingBase" v-show="searchQueryResult.contentType !== '3'" class="count">
         <div class="count-item" v-for="item in baseInfo" :key="item.value">
           <div class="header-icon" style="width: 55px">
             <img :src="item.icon" width="55px" height="50px" />
@@ -476,13 +510,13 @@
             <div class="chart-name">
               <!-- {{ element.name }} -->
             </div>
-            <div v-loading="loading" class="chart-page">
+            <div v-loading="element.loading" class="chart-page">
               <div style="width: 100%; height: 100%">
                 <div class="chart-name" style="width: 100%; height: 10%; display: flex">
                   {{ element.name }}
                 </div>
                 <div style="width: 100%; height: 90%">
-                  <pie-chart v-if="element.type === 'pie'" :title="element.title" :show-total="element.showTotal"
+                  <pie-chart v-if="element.type === 'pie' && !element.isEmpty" :title="element.title" :show-total="element.showTotal"
                     :data="element.data" :colors="colors" :center="element.center" label-formatter="{style1|{c}}"
                     :label-position="element.labelPosition" :radius="element.radius" :grid="{
                       top: 50,
@@ -499,7 +533,7 @@
                       left: '0',
                       top: '10'
                     }" />
-                  <line-chart v-if="element.type === 'line'" :colors="colors" :gradient="element.gradient"
+                  <line-chart v-if="element.type === 'line' && !element.isEmpty" :colors="colors" :gradient="element.gradient"
                     :x-axis-data="element.xAxisData" :data="element.data" :smooth="element.smooth" :grid="{
                       top: 47,
                       left: 5,
@@ -515,7 +549,7 @@
                       left: '0',
                       top: '5'
                     }" />
-                  <bar-chart-double v-if="element.type === 'bar-double'" :legend-data="element.legendData"
+                  <bar-chart-double v-if="element.type === 'bar-double' && !element.isEmpty" :legend-data="element.legendData"
                     :data1="element.data1" :data2="element.data2" :x-axis-data="element.xAxisData" :legend="{
                       itemWidth: 8,
                       itemHeight: 8,
@@ -525,7 +559,7 @@
                       left: '0',
                       top: '10'
                     }" />
-                  <bar-chart-vertical v-if="element.type === 'bar-vertical'" :bar-coner="0" :data="element.data"
+                  <bar-chart-vertical v-if="element.type === 'bar-vertical' && !element.isEmpty" :bar-coner="0" :data="element.data"
                     :x-axis-data="element.xAxisData" :gradient="element.gradient" :show-label="false" :legend="{
                       itemWidth: 8,
                       itemHeight: 8,
@@ -535,7 +569,7 @@
                       left: '0',
                       top: '10'
                     }" />
-                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal'" bar-width="10" :bar-coner="0"
+                  <bar-chart-horizontal v-if="element.type === 'bar-horizontal' && !element.isEmpty" bar-width="10" :bar-coner="0"
                     :data="element.data" :x-axis-data="element.xAxisData" :gradient="element.gradient" :legend="{
                       itemWidth: 8,
                       itemHeight: 8,
@@ -547,6 +581,7 @@
                     }" />
                   <scroll-table v-if="element.type === 'rank-table'" style="width: 100%" :height="300"
                     :data="element.data" :columns="element.columns" />
+                    <el-empty v-if="element.isEmpty" description="暂无数据" />
                 </div>
               </div>
             </div>