1

frontendNew/src/pages/Dcalc/Character/Result/Index.vue

@@ -1,21 +1,13 @@
 <script setup lang="ts">
 import { computed, ref } from "vue";
-import type { IResultSkill } from "@/api/calc/type";
-import { useConfigStore, useInfoStore } from "@/stores";
-import { Button } from "@/components/ui/button";
 import { Card, CardContent } from "@/components/ui/card";
-import {
-  Accordion,
-  AccordionContent,
-  AccordionItem,
-  AccordionTrigger,
-} from "@/components/ui/accordion";
 import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 import Tabs from "@/components/ui/tabs/Tabs.vue";
 import TabsList from "@/components/ui/tabs/TabsList.vue";
 import TabsTrigger from "@/components/ui/tabs/TabsTrigger.vue";
 import EquList from "@/components/dnf/Equipment/List/index.vue";
 import OathList from "@/components/dnf/Equipment/Oath/index.vue";
+import { useConfigStore, useInfoStore } from "@/stores";
 
 const configStore = useConfigStore();
 const infoStore = useInfoStore();
@@ -26,8 +18,6 @@ const equippedOathPart = ref("0");
 
 const resultState = computed(() => configStore.result.state);
 const isLoading = computed(() => configStore.result.isLoading);
-const isBufferClass = computed(() => !!resultState.value?.buffer);
-const standard = computed(() => infoStore.standard);
 
 const resultError = computed(() => {
   const error = configStore.result.error;
@@ -35,57 +25,26 @@ const resultError = computed(() => {
   return error instanceof Error ? error.message : String(error);
 });
 
-const retryCalc = async () => {
-  await configStore.result.execute();
-};
-
-const setStandard = () => {
-  if (!resultState.value?.uuid) return;
-  infoStore.setStandard(resultState.value, configStore.skillCountConfig);
-};
-
-const clearStandard = () => {
-  infoStore.setStandard(undefined);
-};
-
-const getSkillCountEntry = (skill: IResultSkill) => {
-  const name = skill.name;
-  const mode = skill.mode;
-  const existed = configStore.skillCountConfig.find(
-    (item) => item.name === name && item.mode === mode,
-  );
-  if (existed) return existed;
-  const created = { name, mode, count: 1 };
-  configStore.skillCountConfig.push(created);
-  return created;
-};
-
-const getSkillCount = (skill: IResultSkill) =>
-  Math.max(0, Number(getSkillCountEntry(skill).count) || 0);
-
-const getStandardSkill = (skill: IResultSkill) =>
-  standard.value?.skills.find((item) => item.name === skill.name && item.mode === skill.mode);
-
-const getStandardSkillCount = (skill: IResultSkill) => {
-  const count = standard.value?.skillCount.find(
-    (item) => item.name === skill.name && item.mode === skill.mode,
-  )?.count;
-  return Number(count ?? 0);
-};
-
 const skills = computed(() => resultState.value?.skills ?? []);
 
 const totalWeightedDamage = computed(() =>
-  skills.value.reduce((sum, item) => sum + item.damage * getSkillCount(item), 0),
+  skills.value.reduce((sum, item) => {
+    const count = configStore.skillCountConfig.find(
+      (config) => config.name === item.name && config.mode === item.mode,
+    )?.count;
+    return sum + item.damage * Math.max(0, Number(count ?? 1) || 0);
+  }, 0),
 );
 
-const totalStandardDamage = computed(() => {
-  if (!standard.value) return 0;
-  return skills.value.reduce((sum, item) => {
-    const base = getStandardSkill(item);
-    if (!base) return sum;
-    return sum + base.damage * getStandardSkillCount(item);
-  }, 0);
+const hasVisibleResult = computed(
+  () => (resultState.value?.skills?.length ?? 0) > 0 || (resultState.value?.info?.length ?? 0) > 0,
+);
+
+const statusText = computed(() => {
+  if (isLoading.value) return "计算中...";
+  if (resultError.value) return resultError.value;
+  if (!hasVisibleResult.value) return "暂无结果";
+  return "";
 });
 
 const formatNumber = (value: number) => {
@@ -93,152 +52,54 @@ const formatNumber = (value: number) => {
   if (Math.abs(value) >= 100000000) return `${(value / 100000000).toFixed(2)}e`;
   return value.toLocaleString("zh-CN", { maximumFractionDigits: 2 });
 };
-
-const totalDiffLabel = computed(() => {
-  if (!totalStandardDamage.value) return formatNumber(totalWeightedDamage.value);
-  const diff =
-    ((totalWeightedDamage.value - totalStandardDamage.value) / totalStandardDamage.value) * 100;
-  return `${diff >= 0 ? "+" : ""}${diff.toFixed(2)}%`;
-});
-
-const totalDiffClass = computed(() => {
-  if (!totalStandardDamage.value) return "text-foreground";
-  return totalWeightedDamage.value >= totalStandardDamage.value
-    ? "text-emerald-600"
-    : "text-red-600";
-});
-
-const hasVisibleResult = computed(
-  () => (resultState.value?.skills?.length ?? 0) > 0 || (resultState.value?.info?.length ?? 0) > 0,
-);
-
-const changeSources = computed(() => configStore.changeSourceLogs.slice(0, 8));
-
-const clearChangeSources = () => {
-  configStore.clearChangeSource();
-};
-
-const defaultOpenSections = ["overview", "equipped"];
-
-const statusText = computed(() => {
-  if (isLoading.value) return "计算中...";
-  if (resultError.value) return resultError.value;
-  if (!hasVisibleResult.value) return "暂无结果，请先编辑配置。";
-  if (isBufferClass.value) return "请前往计算详情查看。";
-  return "";
-});
 </script>
 
 <template>
   <div class="flex h-full min-h-0 flex-col gap-3">
-    <Card>
-      <CardContent class="py-2">
-        <Accordion type="multiple" :default-value="defaultOpenSections" class="w-full">
-          <AccordionItem value="overview">
-            <AccordionTrigger>结果概览</AccordionTrigger>
-            <AccordionContent>
-              <div class="space-y-3 px-1">
-                <div class="flex flex-wrap gap-2">
-                  <Button size="sm" variant="outline" class="h-8 px-2.5" @click="setStandard"
-                    >设为基准</Button
-                  >
-                  <Button size="sm" variant="outline" class="h-8 px-2.5" @click="clearStandard"
-                    >清空基准</Button
-                  >
-                </div>
+    <Card class="shrink-0">
+      <CardContent class="p-3">
+        <div class="rounded-md border border-border/60 px-3 py-2">
+          <div class="text-xs text-muted-foreground">总伤害</div>
+          <div
+            v-if="statusText"
+            class="mt-1 text-sm"
+            :class="resultError ? 'text-destructive' : 'text-muted-foreground'"
+          >
+            {{ statusText }}
+          </div>
+          <div v-else class="mt-1 truncate text-xl font-semibold tabular-nums">
+            {{ formatNumber(totalWeightedDamage) }}
+          </div>
+        </div>
+      </CardContent>
+    </Card>
 
-                <div
-                  v-if="isLoading || resultError || !hasVisibleResult || isBufferClass"
-                  class="rounded-md border border-border/60 px-3 py-2 text-center text-sm"
-                  :class="resultError ? 'text-destructive' : 'text-muted-foreground'"
-                >
-                  {{ statusText }}
-                </div>
+    <Card class="min-h-0 flex-1">
+      <CardContent class="flex h-full min-h-0 flex-col gap-2 p-3 text-xs">
+        <Tabs :model-value="displayTab" class="shrink-0">
+          <TabsList class="grid w-full grid-cols-2">
+            <TabsTrigger value="equ" @click="displayTab = 'equ'">装备</TabsTrigger>
+            <TabsTrigger value="oath" @click="displayTab = 'oath'">誓约</TabsTrigger>
+          </TabsList>
+        </Tabs>
 
-                <div
-                  v-else
-                  class="flex items-center justify-between rounded-md border border-border/60 px-3 py-2"
-                >
-                  <span class="text-sm text-muted-foreground">合计伤害</span>
-                  <span class="text-sm font-semibold" :class="totalDiffClass">{{
-                    totalDiffLabel
-                  }}</span>
-                </div>
+        <ScrollArea class="min-h-0 flex-1 rounded-md border p-2">
+          <div v-if="displayTab === 'equ'">
+            <EquList
+              v-model:part="equippedPart"
+              :detail="configStore.config.equips"
+              :with-sub-weapon="infoStore.infos?.alter?.includes('vegabond') ?? false"
+              :with-pet="true"
+            />
+          </div>
+          <div v-else>
+            <OathList v-model:part="equippedOathPart" :detail="configStore.config.oaths" />
+          </div>
 
-                <div v-if="resultError" class="flex justify-center">
-                  <Button size="sm" variant="outline" @click="retryCalc">重试计算</Button>
-                </div>
-              </div>
-            </AccordionContent>
-          </AccordionItem>
-
-          <AccordionItem value="equipped">
-            <AccordionTrigger>穿戴信息</AccordionTrigger>
-            <AccordionContent>
-              <div class="space-y-2 px-1 text-xs">
-                <Tabs :model-value="displayTab">
-                  <TabsList class="grid w-full grid-cols-2">
-                    <TabsTrigger value="equ" @click="displayTab = 'equ'">装备</TabsTrigger>
-                    <TabsTrigger value="oath" @click="displayTab = 'oath'">誓约</TabsTrigger>
-                  </TabsList>
-                </Tabs>
-                <ScrollArea class="max-h-56 rounded-md border p-2">
-                  <div v-if="displayTab === 'equ'">
-                    <EquList
-                      v-model:part="equippedPart"
-                      :detail="configStore.config.equips"
-                      :with-sub-weapon="infoStore.infos?.alter?.includes('vegabond') ?? false"
-                      :with-pet="true"
-                    />
-                  </div>
-                  <div v-else>
-                    <OathList v-model:part="equippedOathPart" :detail="configStore.config.oaths" />
-                  </div>
-                  <template #scrollbar>
-                    <ScrollBar orientation="vertical" />
-                  </template>
-                </ScrollArea>
-              </div>
-            </AccordionContent>
-          </AccordionItem>
-
-          <AccordionItem value="changes">
-            <AccordionTrigger>配置变更来源</AccordionTrigger>
-            <AccordionContent>
-              <div class="space-y-2 px-1">
-                <div class="flex items-center justify-between text-xs text-muted-foreground">
-                  <span>最近触发计算的操作记录</span>
-                  <Button size="sm" variant="ghost" class="h-7 px-2" @click="clearChangeSources"
-                    >清空</Button
-                  >
-                </div>
-
-                <div v-if="changeSources.length === 0" class="text-xs text-muted-foreground">
-                  暂无变更来源记录。
-                </div>
-
-                <ScrollArea v-else class="max-h-40 rounded-md border border-border/60 p-2">
-                  <div class="space-y-1">
-                    <div
-                      v-for="item in changeSources"
-                      :key="item.id"
-                      class="rounded-md border border-border/60 bg-muted/20 px-2 py-1 text-xs"
-                    >
-                      <div class="flex items-center justify-between gap-2">
-                        <span class="font-medium">{{ item.source }}</span>
-                        <span class="text-muted-foreground">{{ item.time }}</span>
-                      </div>
-                      <div class="text-muted-foreground">{{ item.detail }}</div>
-                    </div>
-                  </div>
-                  <template #scrollbar>
-                    <ScrollBar orientation="vertical" />
-                  </template>
-                </ScrollArea>
-              </div>
-            </AccordionContent>
-          </AccordionItem>
-        </Accordion>
+          <template #scrollbar>
+            <ScrollBar orientation="vertical" />
+          </template>
+        </ScrollArea>
       </CardContent>
     </Card>
   </div>