From 86037de8d472b4675021949a4a92f31fd54d0612 Mon Sep 17 00:00:00 2001
From: ailoooong <ilong8@qq.com>
Date: Sat, 25 May 2024 18:57:24 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20loading=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components.d.ts                              |  3 +++
 src/assets/style/base.scss                   | 11 -----------
 src/assets/style/category/content/index.scss |  2 +-
 src/assets/style/global.scss                 |  4 ++++
 src/views/apppkg/APkgContent.vue             |  7 +++++--
 src/views/epkg/EpkgContent.vue               |  9 ++++++---
 src/views/image/ImageContent.vue             |  9 ++++++---
 src/views/package/RpmContent.vue             |  9 ++++++---
 src/views/upstream/UpstreamContent.vue       |  7 ++++---
 9 files changed, 35 insertions(+), 26 deletions(-)

diff --git a/components.d.ts b/components.d.ts
index c6281e2..47dd4c8 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -32,4 +32,7 @@ declare module 'vue' {
     SearchRecommend: typeof import('./src/components/search/SearchRecommend.vue')['default']
     SearchTab: typeof import('./src/components/search/SearchTab.vue')['default']
   }
+  export interface ComponentCustomProperties {
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
+  }
 }
diff --git a/src/assets/style/base.scss b/src/assets/style/base.scss
index 0ba1c7f..fe8eb17 100644
--- a/src/assets/style/base.scss
+++ b/src/assets/style/base.scss
@@ -76,17 +76,6 @@ ul {
   list-style: none outside none;
 }
 
-.o-icon {
-  svg {
-    width: 1em;
-    height: 1em;
-  }
-}
-.o-svg-icon,
-.o-select-clear {
-  transform: none !important;
-}
-
 button,
 input,
 optgroup,
diff --git a/src/assets/style/category/content/index.scss b/src/assets/style/category/content/index.scss
index f3d74a3..fdb7ace 100644
--- a/src/assets/style/category/content/index.scss
+++ b/src/assets/style/category/content/index.scss
@@ -1,10 +1,10 @@
 .pkg-wrap {
   display: flex;
   justify-content: space-between;
+  position: relative;
 
   .pkg-content {
     flex: 1;
-    position: relative;
     min-height: 680px;
     display: flex;
     flex-direction: column;
diff --git a/src/assets/style/global.scss b/src/assets/style/global.scss
index 9966e5d..6c447b6 100644
--- a/src/assets/style/global.scss
+++ b/src/assets/style/global.scss
@@ -74,3 +74,7 @@ html {
     }
   }
 }
+
+.o-layer {
+  --layer-mask: none;
+}
diff --git a/src/views/apppkg/APkgContent.vue b/src/views/apppkg/APkgContent.vue
index 8278056..f13297f 100644
--- a/src/views/apppkg/APkgContent.vue
+++ b/src/views/apppkg/APkgContent.vue
@@ -192,6 +192,9 @@ const isPageSearch = ref(false);
 
 onMounted(() => {
   isPageSearch.value = route.name === 'search';
+  if (isPageSearch.value) {
+    pageSearch();
+  }
 
   //判断主页领域应用跳转
   const homeType = route.query.type as string;
@@ -255,7 +258,7 @@ watch(
 </script>
 
 <template>
-  <div class="pkg-wrap" :class="tabName">
+  <div v-loading.nomask="isLoading" class="pkg-wrap" :class="tabName">
     <div class="filter-sidebar">
       <FilterRadio v-if="filterOsList.length" v-model="searchOs" :options="filterOsList">
         <template #header>
@@ -298,7 +301,7 @@ watch(
       </div>
       <ResultNotApp v-if="pkgData.length === 0 && isSearchError" />
       <template v-else>
-        <div v-loading.nomask="isLoading" class="pkg-panel">
+        <div class="pkg-panel">
           <ORow gap="32px" flex-wrap="wrap">
             <OCol v-for="(subItem, index) in pkgData" :key="index" flex="0 1 33.33%" :laptop="{ flex: '0 1 33.33%' }">
               <OCardItem :data="subItem" />
diff --git a/src/views/epkg/EpkgContent.vue b/src/views/epkg/EpkgContent.vue
index 3502b9c..fcf0345 100644
--- a/src/views/epkg/EpkgContent.vue
+++ b/src/views/epkg/EpkgContent.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref, watch, computed, onMounted } from 'vue';
-import { OTag, OLink, OIcon, isUndefined, isString } from '@opensig/opendesign';
+import { OTag, OLink, OIcon, isUndefined, vLoading } from '@opensig/opendesign';
 
 import { getSearchData } from '@/api/api-search';
 import { getSearchAllColumn, getSearchAllFiled } from '@/api/api-domain';
@@ -215,6 +215,9 @@ const isPageSearch = ref(false);
 
 onMounted(() => {
   isPageSearch.value = route.name === 'search';
+  if (isPageSearch.value) {
+    pageSearch();
+  }
 
   queryFilter();
   handleQueryData();
@@ -271,7 +274,7 @@ watch(
 </script>
 
 <template>
-  <div class="pkg-wrap" :class="tabName">
+  <div v-loading.nomask="isLoading" class="pkg-wrap" :class="tabName">
     <div class="filter-sidebar" flex="0 0 25%">
       <FilterCheckbox v-if="filterOsList.length" v-model="searchOs" :options="filterOsList">
         <template #header>
@@ -316,7 +319,7 @@ watch(
       </div>
       <ResultNotApp v-if="pkgData.length === 0 && isSearchError" />
       <div class="pkg-panel" v-else>
-        <OTableItemNew :data="pkgData" :columns="columns" :type="tabName" :loading="isLoading" />
+        <OTableItemNew :data="pkgData" :columns="columns" :type="tabName" />
         <div class="pagination-box">
           <el-config-provider :locale="isZh ? zhCn : English">
             <el-pagination
diff --git a/src/views/image/ImageContent.vue b/src/views/image/ImageContent.vue
index a551de9..8394272 100644
--- a/src/views/image/ImageContent.vue
+++ b/src/views/image/ImageContent.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { ref, watch, computed, onMounted } from 'vue';
-import { OTag, OLink, OIcon, isUndefined, isString } from '@opensig/opendesign';
+import { OTag, OLink, OIcon, isUndefined, vLoading } from '@opensig/opendesign';
 import { getSearchData } from '@/api/api-search';
 import { useRoute } from 'vue-router';
 import { getSearchAllFiled, getSearchAllColumn } from '@/api/api-domain';
@@ -206,6 +206,9 @@ const isPageSearch = ref(false);
 
 onMounted(() => {
   isPageSearch.value = route.name === 'search';
+  if (isPageSearch.value) {
+    pageSearch();
+  }
   queryFilter();
   handleQueryData();
 });
@@ -261,7 +264,7 @@ watch(
 </script>
 
 <template>
-  <div class="pkg-wrap" :class="tabName">
+  <div v-loading.nomask="isLoading" class="pkg-wrap" :class="tabName">
     <div class="filter-sidebar">
       <FilterCheckbox v-if="filterOsList.length" v-model="searchOs" :options="filterOsList">
         <template #header>
@@ -304,7 +307,7 @@ watch(
       </div>
       <ResultNotApp v-if="pkgData.length === 0 && isSearchError" />
       <div class="pkg-panel" v-else>
-        <OTableItemNew :data="pkgData" :columns="columns" :type="tabName" :loading="isLoading" />
+        <OTableItemNew :data="pkgData" :columns="columns" :type="tabName" />
         <div class="pagination-box">
           <el-config-provider :locale="isZh ? zhCn : English">
             <el-pagination
diff --git a/src/views/package/RpmContent.vue b/src/views/package/RpmContent.vue
index 2223ffd..d3c5ab3 100644
--- a/src/views/package/RpmContent.vue
+++ b/src/views/package/RpmContent.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { ref, watch, computed, onMounted } from 'vue';
-import { OTag, vLoading, OLink, OIcon, isUndefined, isString } from '@opensig/opendesign';
+import { OTag, vLoading, OLink, OIcon, isUndefined } from '@opensig/opendesign';
 import { useI18n } from 'vue-i18n';
 import { getSearchData } from '@/api/api-search';
 import { useRoute } from 'vue-router';
@@ -224,6 +224,9 @@ const isPageSearch = ref(false);
 
 onMounted(() => {
   isPageSearch.value = route.name === 'search';
+  if (isPageSearch.value) {
+    pageSearch();
+  }
 
   queryFilter();
   handleQueryData();
@@ -280,7 +283,7 @@ watch(
 </script>
 
 <template>
-  <div class="pkg-wrap" :class="tabName">
+  <div v-loading.nomask="isLoading" class="pkg-wrap" :class="tabName">
     <div class="filter-sidebar">
       <div v-loading.nomask="isFilterLoading">
         <FilterCheckbox v-if="filterOsList.length" v-model="searchOs" :options="filterOsList">
@@ -331,7 +334,7 @@ watch(
       </div>
       <ResultNotApp v-if="pkgData.length === 0 && isSearchError" />
       <div class="pkg-panel" v-else>
-        <OTableItemNew :data="pkgData" :columns="columns" :type="tabName" :loading="isLoading" />
+        <OTableItemNew :data="pkgData" :columns="columns" :type="tabName" />
 
         <div class="pagination-box">
           <el-config-provider :locale="isZh ? zhCn : English">
diff --git a/src/views/upstream/UpstreamContent.vue b/src/views/upstream/UpstreamContent.vue
index 6d9e8ab..bd2e58c 100644
--- a/src/views/upstream/UpstreamContent.vue
+++ b/src/views/upstream/UpstreamContent.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { ref, watch, onMounted, computed } from 'vue';
-import { OTag, OLink, OIcon, OTable } from '@opensig/opendesign';
+import { OTag, OLink, OIcon, OTable, vLoading } from '@opensig/opendesign';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 import { getParamsRules } from '@/utils/common';
@@ -39,6 +39,7 @@ const searchKey = ref((route.query.name as string) || '');
 const searchOs = ref('');
 
 const queryAppVersion = () => {
+  isLoading.value = true;
   const params = {
     eulerOsVersion: searchOs.value,
     pageNum: currentPage.value,
@@ -197,7 +198,7 @@ watch(
 </script>
 
 <template>
-  <div class="pkg-wrap" :class="tabName">
+  <div v-loading.nomask="isLoading" class="pkg-wrap" :class="tabName">
     <div class="filter-sidebar">
       <FilterRadio v-if="filterOsList.length" v-model="searchOs" :options="filterOsList">
         <template #header>
@@ -221,7 +222,7 @@ watch(
       </div>
       <ResultNotApp v-if="appData.length === 0 && isSearchError" />
       <div class="pkg-panel" v-else>
-        <OTable :columns="columns" :data="appData" :loading="isLoading" border="all">
+        <OTable :columns="columns" :data="appData" border="all">
           <template #td_name="{ row }">
             <span v-dompurify-html="row.name"></span>
           </template>
-- 
Gitee