perf: 给作战和招募卡片添加未展开状态下的进度面板

MaaAssistantArknights · Oct 30, 2023 · 4cf392b · 4cf392b
1 parent 7e17a97
commit 4cf392b
Show file tree

Hide file tree

Showing 2 changed files with 80 additions and 54 deletions.
diff --git a/packages/renderer/src/components/Task/results/Fighting.vue b/packages/renderer/src/components/Task/results/Fighting.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import _ from 'lodash'
-import { NSpace } from 'naive-ui'
+import { NSpace, NText } from 'naive-ui'
 import { computed } from 'vue'
 
 import ItemCircle from '../ItemCircle.vue'
@@ -32,34 +32,48 @@ const totalDrops = computed(() => _.last(props.results.fightInfo)?.stats)
 </script>
 
 <template>
-  <NSpace vertical class="progress-form">
-    <NSpace
-      v-for="(result, rindex) of props.results.fightInfo"
-      :key="rindex"
-      align="center"
-      justify="center"
-    >
-      <span>{{ `作战 #${rindex + 1}` }}</span>
-      <span>{{ result.stage.stageCode }}</span>
-      <ItemCircle
-        v-for="(item, iindex) of result.drops"
-        :key="iindex"
-        :name="item.itemName"
-        :count="item.quantity"
-        :height="50"
-        :width="50"
-      />
+  <div v-if="totalDrops">
+    <NSpace vertical class="progress-form">
+      <NSpace
+        v-for="(result, rindex) of props.results.fightInfo"
+        :key="rindex"
+        align="center"
+        justify="center"
+      >
+        <span>{{ `作战 #${rindex + 1}` }}</span>
+        <span>{{ result.stage.stageCode }}</span>
+        <ItemCircle
+          v-for="(item, iindex) of result.drops"
+          :key="iindex"
+          :name="item.itemName"
+          :count="item.quantity"
+          :height="50"
+          :width="50"
+        />
+      </NSpace>
+      <NSpace v-if="totalDrops" align="center" justify="center">
+        <span>总计掉落</span>
+        <ItemCircle
+          v-for="(item, iindex) of totalDrops"
+          :key="iindex"
+          :name="item.itemName"
+          :count="item.quantity"
+          :height="50"
+          :width="50"
+        />
+      </NSpace>
     </NSpace>
-    <NSpace v-if="totalDrops" align="center" justify="center">
-      <span>总计掉落</span>
-      <ItemCircle
-        v-for="(item, iindex) of totalDrops"
-        :key="iindex"
-        :name="item.itemName"
-        :count="item.quantity"
-        :height="50"
-        :width="50"
-      />
-    </NSpace>
-  </NSpace>
+  </div>
+  <div v-else class="progress-form no-progress">
+    <NText> 暂时没有任务掉落数据 Σ(っ °Д °;)っ </NText>
+  </div>
 </template>
+
+<style lang="less" scoped>
+.no-progress {
+  display: flex;
+  height: 100px;
+  align-items: center;
+  justify-content: center;
+}
+</style>
diff --git a/packages/renderer/src/components/Task/results/Recruit.vue b/packages/renderer/src/components/Task/results/Recruit.vue
@@ -13,31 +13,43 @@ const props = defineProps<{
     recruits: RecruitResult[]
   }
 }>()
-
-console.log(props)
 </script>
 
 <template>
-  <NSpace vertical>
-    <NList :style="{ background: 'transparent' }">
-      <NListItem v-for="(recruit, index) of props.results.recruits" :key="index">
-        <NSpace align="center" justify="space-around">
-          <NText :type="recruit.refreshed ? 'info' : 'default'">
-            {{ recruit.refreshed ? '已刷新' : `${recruit.level}星干员` }}
-          </NText>
-          <NGrid x-gap="6" y-gap="8" :cols="3">
-            <NGridItem v-for="tag of recruit.tags" :key="tag">
-              <NButton
-                size="tiny"
-                secondary
-                :type="recruit.selectedTags.includes(tag) ? 'info' : 'default'"
-              >
-                {{ tag }}
-              </NButton>
-            </NGridItem>
-          </NGrid>
-        </NSpace>
-      </NListItem>
-    </NList>
-  </NSpace>
+  <div v-if="props.results.recruits">
+    <NSpace vertical>
+      <NList :style="{ background: 'transparent' }">
+        <NListItem v-for="(recruit, index) of props.results.recruits" :key="index">
+          <NSpace align="center" justify="space-around">
+            <NText :type="recruit.refreshed ? 'info' : 'default'">
+              {{ recruit.refreshed ? '已刷新' : `${recruit.level}星干员` }}
+            </NText>
+            <NGrid x-gap="6" y-gap="8" :cols="3">
+              <NGridItem v-for="tag of recruit.tags" :key="tag">
+                <NButton
+                  size="tiny"
+                  secondary
+                  :type="recruit.selectedTags.includes(tag) ? 'info' : 'default'"
+                >
+                  {{ tag }}
+                </NButton>
+              </NGridItem>
+            </NGrid>
+          </NSpace>
+        </NListItem>
+      </NList>
+    </NSpace>
+  </div>
+  <div v-else class="progress-form no-progress">
+    <NText> 暂时没有公开招募数据 Σ(っ °Д °;)っ </NText>
+  </div>
 </template>
+
+<style lang="less" scoped>
+.no-progress {
+  display: flex;
+  height: 100px;
+  align-items: center;
+  justify-content: center;
+}
+</style>