Merge pull request #22 from zprobot/main

loading

src/components/AeShow/index.vue

@@ -37,9 +37,10 @@ import { getProteins,getCellLineProteins } from '@/api/search'
 import { inflate } from 'pako'
 import * as echarts from 'echarts'
 import {useRouter, onBeforeRouteUpdate} from "vue-router";
-import { ref, onMounted,nextTick } from 'vue'
+import { ref, onMounted, nextTick } from 'vue'
 const router = useRouter();
 const drawer = ref(false)
+const emit = defineEmits(['changeLoading'])
 // image height
 let imgH = 500
 // database
@@ -89,10 +90,12 @@ protein.value = Array.isArray(router.currentRoute.value.query.protein) ? router.
 routerName.value = router.currentRoute.value.name
 // get proteins
 const getProteinTable = async () => {
+  emit('changeLoading')
   const res = routerName.value ==='tissues' ? await getProteins() : await getCellLineProteins()
   const byteArray = new Uint8Array(res.data)
   const data = inflate(byteArray, { to: 'string' })
   proteinTable = JSON.parse(data)
+  emit('changeLoading')
   queryProtein(protein)
 }
 // delete tag

src/views/overview/index.vue

@@ -104,8 +104,10 @@
         min-height: 10rem;
         padding: 1rem;
       "
+      v-loading="loading"
+      element-loading-text="loading"
     >
-      <router-view :key="key"></router-view>
+      <router-view :key="key" @changeLoading="changeLoading" ></router-view>
     </div>
   </div>
 </div>
@@ -116,6 +118,7 @@ import { ref,computed, onMounted } from "vue";
 import { useRouter } from "vue-router";
 import { Search } from "@element-plus/icons-vue";
 const router = useRouter();
+const loading = ref(false)
 // sapiens
 const sapiens = ref("");
 // select_menus
@@ -186,6 +189,9 @@ const onSearch = (val) => {
   }
   
 };
+const changeLoading = () => {
+  loading.value = !loading.value;
+}
 </script>
 <style lang="scss" scoped>
 ::v-deep {