EmptyCom.vue

<template>
  <div class="empty-box">
    <svg t="1748418826050" class="icon" viewBox="0 0 1522 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
         p-id="17657" width="64" height="64">
      <path
          d="M1298.904615 300.845949c12.393026 0 22.422974 10.003692 22.422975 22.370461v515.098257a67.190154 67.190154 0 0 1-67.216411 67.190154H268.760615a67.190154 67.190154 0 0 1-67.190153-67.190154V323.21641c0-12.340513 10.029949-22.370462 22.396717-22.370461h261.041231a52.512821 52.512821 0 0 1 52.512821 52.51282v59.444513a67.190154 67.190154 0 0 0 63.225436 67.085128l3.938461 0.105026h313.554051a67.190154 67.190154 0 0 0 67.058872-63.225436l0.105026-3.938462v-59.470769a52.512821 52.512821 0 0 1 52.51282-52.51282h261.041231z"
          fill="#F7F7F7" p-id="17658"></path>
      <path
          d="M1040.384 26.25641a26.25641 26.25641 0 0 1 20.059897 9.294769l241.532718 285.40718c1.916718 2.258051 3.413333 4.778667 4.411077 7.404308a22.370462 22.370462 0 0 0-7.45682-1.260308h-261.041231a52.512821 52.512821 0 0 0-52.51282 52.51282v59.444513l-0.105026 3.938462a67.190154 67.190154 0 0 1-67.058872 63.277949H604.658872l-3.938462-0.131282a67.190154 67.190154 0 0 1-63.225436-67.085129v-59.444513a52.512821 52.512821 0 0 0-52.51282-52.51282H223.940923a22.370462 22.370462 0 0 0-7.378051 1.234051 26.781538 26.781538 0 0 1 4.46359-7.561846l241.401435-285.223385A26.25641 26.25641 0 0 1 482.487795 26.25641h557.896205z"
          fill="#FFFFFF" p-id="17659"></path>
      <path
          d="M1040.384 13.128205a39.384615 39.384615 0 0 1 30.06359 13.942154l241.558974 285.407179c7.798154 9.189744 10.60759 21.005128 8.743385 32.032821a22.370462 22.370462 0 0 0-21.819077-17.408l-8.979693-0.026256-239.53723-283.044103a13.128205 13.128205 0 0 0-7.719385-4.46359l-2.310564-0.183795H482.487795a13.128205 13.128205 0 0 0-10.029949 4.647385l-239.589743 283.044103h-8.92718a22.396718 22.396718 0 0 0-21.687795 16.882871l-0.393846-2.835692a39.200821 39.200821 0 0 1 9.189744-28.829538L452.397949 27.070359A39.384615 39.384615 0 0 1 482.487795 13.128205z"
          fill="#D9D9D9" p-id="17660"></path>
      <path
          d="M774.144 671.901538C1188.811487 673.476923 1522.871795 753.611487 1522.871795 852.283077c0 46.395077-73.833026 88.694154-195.163898 120.648205a12925.846974 12925.846974 0 0 1-1132.544 0.052513C73.833026 940.950974 0 898.678154 0 852.283077c0-99.669333 340.913231-180.460308 761.435897-180.460308zM484.982154 300.819692a52.512821 52.512821 0 0 1 52.51282 52.512821v59.444513a67.190154 67.190154 0 0 0 63.225436 67.085128l3.938462 0.105025h313.554051a67.190154 67.190154 0 0 0 67.058872-63.225435l0.105026-3.938462v-59.470769a52.512821 52.512821 0 0 1 52.51282-52.512821h261.041231c12.340513 0 22.396718 10.003692 22.396718 22.370462v515.098256a67.190154 67.190154 0 0 1-67.216411 67.190154H268.760615a67.190154 67.190154 0 0 1-67.190153-67.190154V323.21641c0-12.340513 10.029949-22.370462 22.396717-22.370461h261.041231z m-257.181539 537.468718c0 21.346462 16.357744 38.859487 37.205334 40.776205l3.72841 0.157539h985.403077c21.346462 0 38.859487-16.357744 40.749949-37.205333l0.183794-3.728411-0.026256-511.212307h-257.155282a26.25641 26.25641 0 0 0-26.072615 23.18441l-0.183795 3.072v60.205949l-0.157539 4.726153a93.472821 93.472821 0 0 1-88.169025 87.827693l-5.093744 0.131282H603.897436l-4.726154-0.157539a93.472821 93.472821 0 0 1-87.827692-88.195282l-0.131282-5.093743v-59.444513a26.25641 26.25641 0 0 0-23.210667-26.098872l-3.045744-0.157538H227.800615v511.212307z"
          fill="#F7F7F7" p-id="17661"></path>
      <path
          d="M484.955897 300.845949a52.512821 52.512821 0 0 1 52.512821 52.51282v59.444513a67.190154 67.190154 0 0 0 63.277949 67.085128l3.938461 0.105026h313.501539a67.190154 67.190154 0 0 0 67.085128-63.225436l0.105026-3.938462v-59.470769a52.512821 52.512821 0 0 1 52.51282-52.51282h261.041231c12.340513 0 22.396718 10.003692 22.396718 22.370461v515.098257a67.190154 67.190154 0 0 1-67.216411 67.190154H268.760615a67.190154 67.190154 0 0 1-67.190153-67.190154V323.21641c0-12.340513 10.029949-22.370462 22.396717-22.370461h261.041231z m-257.155282 537.468718c0 21.346462 16.357744 38.859487 37.205334 40.776205l3.72841 0.157538h985.403077c21.346462 0 38.859487-16.357744 40.749949-37.205333l0.183794-3.72841V327.076103h-257.181538a26.25641 26.25641 0 0 0-26.072615 23.210666l-0.183795 3.072v60.205949l-0.157539 4.726154a93.472821 93.472821 0 0 1-88.169025 87.827692l-5.093744 0.131282H603.897436l-4.726154-0.157538a93.472821 93.472821 0 0 1-87.827692-88.195282l-0.131282-5.093744v-59.444513a26.25641 26.25641 0 0 0-23.210667-26.098872l-3.045744-0.157538-257.155282-0.026256v511.238564z"
          fill="#D9D9D9" p-id="17662"></path>
    </svg>
    <span class="empty-text">暂无数据</span>
  </div>
</template>
<script>
import {defineComponent} from 'vue'

export default defineComponent({
  setup() {
    return {}
  }
})
</script>
<style lang="scss" scoped>
.empty-box {
  height: 100%;
  width: 100%;
  display: flex;
  gap: 4px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.empty-text {
  font-size: 12px;
  color: grey;
  margin-bottom: 4px;
}
</style>