dev

backend/core/basic/character.py

@@ -636,7 +636,7 @@ class Character:
             # 贴膜
             if fusion is None:
                 continue
-            fun = effects.equ_func_list.get(str(fusion.id), None)
+            fun = effects.stone_func_list.get(str(fusion.id), None)
             # 获取装备基础属性 并给角色设置（大写开头属性为角色属性）
             filtered_dict = {k: v for k, v in fusion.__dict__.items() if k[0].isupper()}
             self.SetStatus(**filtered_dict)
@@ -719,7 +719,7 @@ class Character:
                 pass
         pass
 
-    def calc_jade(self):
+    def calc_jade(self,jade):
         """计算辟邪玉效果"""
         pass
 

backend/core/basic/formula.py

@@ -8,8 +8,8 @@ def 强化技攻(强化等级:int, 强化类型:int, 部位:str):
         if 部位 not in ['武器', '耳环']:
             return 0
         else:
-            return 强化技攻[强化等级]
-    return 增幅技攻[强化等级]
+            return 强化技攻[强化等级] / 100
+    return 增幅技攻[强化等级] / 100
 
 
 # endregion

backend/core/basic/property.py

@@ -24,19 +24,19 @@ class CharacterInfo(enum.Enum):
     INT = '智力', '/ui/UI_ProfileIcon_003.png', lambda x: round(x, 0)
     """智力"""
 
-    AtkP = '物理攻击力', '/ui/UI_ProfileIcon_006.png', lambda x: round(x, 0)
+    AtkP = '物理攻击', '/ui/UI_ProfileIcon_006.png', lambda x: round(x, 0)
     """物理攻击力"""
 
-    AtkM = '魔法攻击力', '/ui/UI_ProfileIcon_007.png', lambda x: round(x, 0)
+    AtkM = '魔法攻击', '/ui/UI_ProfileIcon_007.png', lambda x: round(x, 0)
     """魔法攻击力"""
 
-    AtkI = '独立攻击力', '/ui/UI_ProfileIcon_008.png', lambda x: round(x, 0)
+    AtkI = '独立攻击', '/ui/UI_ProfileIcon_008.png', lambda x: round(x, 0)
     """独立攻击力"""
 
-    ElementDB = '攻击属性', '/ui/UI_ProfileIcon_009.png', lambda x: f'火({int(x['火'])})/光({int(x['光'])})/冰({int(x['冰'])})/暗({int(x['暗'])})'
+    ElementDB = '攻击属性', '/ui/UI_ProfileIcon_009.png', lambda x: f'火({int(x['火'])})/冰({int(x['冰'])})/光({int(x['光'])})/暗({int(x['暗'])})'
     """攻击属性"""
 
-    SkillAttack = '技能攻击力增加', '/ui/UI_ProfileIcon_047.png', lambda x: f'{format(x * 100 - 100, ".2f")}%'
+    SkillAttack = '技能伤害', '/ui/UI_ProfileIcon_047.png', lambda x: f'{format(x * 100 - 100, ".1f")}%'
     """技能攻击力"""
 
     SpeedA = '攻击速度', '/ui/UI_ProfileIcon_012.png', lambda x: f'{format(x * 100, ".2f")}%'
@@ -48,7 +48,7 @@ class CharacterInfo(enum.Enum):
     SpeedR = '施放速度', '/ui/UI_ProfileIcon_013.png', lambda x: f'{format(x * 100, ".2f")}%'
     """施放速度"""
 
-    Attack = '攻击强化', '/ui/UI_ProfileIcon_015.png', lambda x: f'{format(x * 100, ".2f")}%'
+    Attack = '攻击强化', '/ui/UI_ProfileIcon_015.png', lambda x: f'{format(x, ".1f")}%'
     """攻击强化"""
 
     AttackP = '攻击强化%', '/ui/UI_ProfileIcon_015.png', lambda x: f'{format(x * 100 - 100, ".2f")}%'

backend/core/character/GF/gunner_female/spitfire_female.py

@@ -102,10 +102,12 @@ class Skill5(PassiveSkill):
     rangeLv = 3
 
     data0 = [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140, 150, 160, 170, 180, 190, 200]  # noqa: E501
+    data1 = [0] + [(1+1+1.2)/3] * 20
 
     associate = [
-        {'type': '*skillRation', 'data': data0, 'skills': ['G-14手雷','G-35L感电手雷','G-18C冰冻手雷']}
-        ]
+        {'type': '*skillRation', 'data': data0, 'skills': ['G-14手雷','G-35L感电手雷','G-18C冰冻手雷']},
+        {'type': '*skillRation', 'data': data1, 'skills': ['G-14手雷','G-35L感电手雷','G-18C冰冻手雷']},
+    ]
 
 # M18阔剑地雷 M18 클레이모어
 # https://api.neople.co.kr/df/skills/944b9aab492c15a8474f96947ceeb9e4/2ff50c35efcf0f287c4c418c8454da48?apikey=fdvit1Kj64EAJm0qfB3JEAD8FLExLDD0

backend/core/equipment/version_0/__init__.py

@@ -4,6 +4,7 @@ from .equ import equ_func_list
 from .avatar import get_dress_list,calc_dress_effect
 from .enchant import enchant_func_list
 from .emblem import emblem_func_list
+from .stone import stone_func_list
 
 options = [
     {'id': 1, 'name': '龙战八荒,', 'options': ['BUFF OFF', 'BUFF ON', '期望']},

backend/core/equipment/version_0/jade.py

@@ -14,7 +14,7 @@ def jade_0(char: Character = {}, value=0):
     pass
 
 def jade_1(char: Character = {}, value=0):
-    char.SetStatus(SkillDamage=value/100)
+    char.SetStatus(SkillAttack=value/100)
 
 def jade_2(char: Character = {}, value=0):
     char.SetStatus(AttackP=value/100)

backend/core/equipment/version_0/stone.py

@@ -1,7 +1,6 @@
 from core.basic.character import Character
-from core.basic.equipment import EquEffect
 
-suit_func_list = {}
+stone_func_list = {}
 
 # region 潜影暗袭 套装
 
@@ -240,7 +239,7 @@ def stone_23(char: Character):
 
     技能伤害+6%
     """
-    char.SetStatus(SkillAttack=0.06)  
+    char.SetStatus(SkillAttack=0.06)
     pass
 
 
@@ -2554,7 +2553,7 @@ def stone_1049(char: Character):
 
 for i in range(0, 1000):
     try:
-        if str(i) not in suit_func_list.keys():
-            suit_func_list[str(i)] = eval(f'stone_{i}')
+        if str(i) not in stone_func_list.keys():
+            stone_func_list[str(i)] = eval(f'stone_{i}')
     except Exception:
         pass

backend/core/equipment/version_0/suit.py

@@ -746,7 +746,7 @@ def suit_48(char: Character):
     reinforce = reinforce_0 + reinforce_1 + reinforce_2 + reinforce_3
     char.SetStatus(SkillRange=0.02 * min(reinforce // 11, 7))
     # char.SetStatus(DamageReduce=0.01 * min(reinforce_0 // 5, 7))
-    char.SetStatus(SkillDamage=0.01 * min(reinforce_1 // 3, 7))
+    char.SetStatus(SkillAttack=0.01 * min(reinforce_1 // 3, 7))
     char.SetStatus(SpeedA=0.02 * min(reinforce_2 // 3, 7))
     char.SetStatus(SpeedM=0.02 * min(reinforce_2 // 3, 7))
     char.SetStatus(SpeedR=0.02 * min(reinforce_2 // 3, 7))
@@ -843,7 +843,7 @@ def suit_53(char: Character):
     reinforce = reinforce_0 + reinforce_1 + reinforce_2 + reinforce_3
     char.SetStatus(SkillRange=0.02 * min(reinforce // 11, 12))
     # char.SetStatus(DamageReduce=0.01 * min(reinforce_0 // 5, 7))
-    char.SetStatus(SkillDamage=0.01 * min(reinforce_1 // 3, 12))
+    char.SetStatus(SkillAttack=0.01 * min(reinforce_1 // 3, 12))
     char.SetStatus(SpeedA=0.02 * min(reinforce_2 // 3, 12))
     char.SetStatus(SpeedM=0.02 * min(reinforce_2 // 3, 12))
     char.SetStatus(SpeedR=0.02 * min(reinforce_2 // 3, 12))
@@ -982,7 +982,7 @@ def suit_58(char: Character):
     reinforce = reinforce_0 + reinforce_1 + reinforce_2 + reinforce_3
     char.SetStatus(SkillRange=0.02 * min(reinforce // 11, 12))
     # char.SetStatus(DamageReduce=0.01 * min(reinforce_0 // 5, 7))
-    char.SetStatus(SkillDamage=0.01 * min(reinforce_1 // 3, 12))
+    char.SetStatus(SkillAttack=0.01 * min(reinforce_1 // 3, 12))
     char.SetStatus(SpeedA=0.02 * min(reinforce_2 // 3, 12))
     char.SetStatus(SpeedM=0.02 * min(reinforce_2 // 3, 12))
     char.SetStatus(SpeedR=0.02 * min(reinforce_2 // 3, 12))
@@ -991,7 +991,7 @@ def suit_58(char: Character):
         char.SetSkillCD(cd=0.02 * min(reinforce // 1, 12))
 
     if reinforce >= 110:
-        char.SetStatus(SkillDamage=0.02 * min((reinforce - 110) // 11, 2))
+        char.SetStatus(SkillAttack=0.02 * min((reinforce - 110) // 11, 2))
 
         if char.buffer:
             char.SetSkillCD(Buffer=750 * min((reinforce - 110) // 11, 2))
@@ -1171,7 +1171,7 @@ def suit_63(char: Character):
     reinforce = reinforce_0 + reinforce_1 + reinforce_2 + reinforce_3
     char.SetStatus(SkillRange=0.02 * min(reinforce // 11, 12))
     # char.SetStatus(DamageReduce=0.01 * min(reinforce_0 // 5, 7))
-    char.SetStatus(SkillDamage=0.01 * min(reinforce_1 // 3, 12))
+    char.SetStatus(SkillAttack=0.01 * min(reinforce_1 // 3, 12))
     char.SetStatus(SpeedA=0.02 * min(reinforce_2 // 3, 12))
     char.SetStatus(SpeedM=0.02 * min(reinforce_2 // 3, 12))
     char.SetStatus(SpeedR=0.02 * min(reinforce_2 // 3, 12))
@@ -1180,7 +1180,7 @@ def suit_63(char: Character):
         char.SetSkillCD(cd=0.02 * min(reinforce // 1, 12))
 
     if reinforce >= 110:
-        char.SetStatus(SkillDamage=0.02 * min((reinforce - 110) // 11, 2))
+        char.SetStatus(SkillAttack=0.02 * min((reinforce - 110) // 11, 2))
 
         if char.buffer:
             char.SetSkillCD(Buffer=1500 * min((reinforce - 110) // 11, 2))
@@ -1382,11 +1382,11 @@ def suit_79(char: Character):
         char.equ_effect.append(EquEffect(name='烛龙腾霄', icon='/equipment/suit/1.png', cd=10, data=14400))
     elif char.equ_options.get('1', 0) == 1:
         char.SetStatus(SpeedA=0.3, SpeedM=0.3, SpeedR=0.3)
-        char.SetStatus(SkillDamage=0.03)
+        char.SetStatus(SkillAttack=0.03)
         char.equ_effect.append(EquEffect(name='白龙强袭', icon='/equipment/suit/1.png', cd=3, data=6000))
     elif char.equ_options.get('1', 0) == 2:
         char.SetStatus(SpeedA=0.2, SpeedM=0.2, SpeedR=0.2)
-        char.SetStatus(SkillDamage=0.015)
+        char.SetStatus(SkillAttack=0.015)
         char.equ_effect.append(EquEffect(name='白龙强袭', icon='/equipment/suit/1.png', cd=3, data=6000))
         char.equ_effect.append(EquEffect(name='烛龙腾霄', icon='/equipment/suit/1.png', cd=10, data=14400))
     pass
@@ -1517,7 +1517,7 @@ def suit_84(char: Character):
         char.equ_effect.append(EquEffect(name='烛龙腾霄', icon='/equipment/suit/1.png', cd=10, data=14400))
     elif char.equ_options.get('1', 0) == 1:
         char.SetStatus(SpeedA=0.3, SpeedM=0.3, SpeedR=0.3)
-        char.SetStatus(SkillDamage=0.03)
+        char.SetStatus(SkillAttack=0.03)
         char.equ_effect.append(EquEffect(name='白龙强袭', icon='/equipment/suit/1.png', cd=3, data=6000))
         char.equ_effect.append(EquEffect(name='应龙之怒', icon='/equipment/suit/1.png', cd=4, data=7200))
     pass
@@ -1636,7 +1636,7 @@ def suit_95(char: Character):
     - 进入霸体状态
     """
     if char.equ_options.get('2', 0) == 0:
-        char.SetStatus(SkillDamage=0.175)
+        char.SetStatus(SkillAttack=0.175)
         char.SetSkillCD(cd=0.3)
     else:
         char.SetSkillCD(cd=0.55)
@@ -1887,7 +1887,7 @@ def suit_111(char: Character):
     攻击时， 有3%的几率发动[神的祝福]。 (发动冷却1秒)
     剩余冷却时间33秒以下的技能中， 初始化剩余时间最长的1个技能 (觉醒技能除外)
     """
-    char.SetStatus(SkillDamage=0.03)
+    char.SetStatus(SkillAttack=0.03)
     pass
 
 
@@ -1964,7 +1964,7 @@ def suit_116(char: Character):
     - 剩余冷却时间33秒以下的技能中，初始化剩余时间最短的1个技能（觉醒技能除外）
     - 立即发动[第二次幸运]
     """
-    char.SetStatus(SkillDamage=0.03)
+    char.SetStatus(SkillAttack=0.03)
     char.AddElementDB('火',33,1)
     char.AddElementDB('冰',33,1)
     char.AddElementDB('光',33,1)

frontend/src/api/calc/type.ts

@@ -1,5 +1,7 @@
 export interface IResult {
   skills: IResultSkill[]
+  info:IResultUserInfo[]
+  suits:IResultSuit[]
 }
 
 export interface IResultSkill {
@@ -11,3 +13,19 @@ export interface IResultSkill {
   cd: number
   damage: number
 }
+
+export interface IResultUserInfo {
+  name:string
+  value:string|number
+}
+
+export interface IResultSuit{
+  id:number
+  count:number
+  imageUrl:string
+  level:number
+  name:string
+  point:number
+  rarity:string
+  value:string
+}

frontend/src/components/calc/slider/index.vue

@@ -28,7 +28,12 @@ export default defineComponent({
     showPercent: {
       type: Boolean,
       default: true
+    },
+    formatValue: {
+      type: Function,
+      default: undefined
     }
+
   },
   emits: ['update:modelValue', 'change'],
   setup(props, { emit }) {
@@ -76,35 +81,33 @@ export default defineComponent({
         ]}
       >
         <div
-          class="flex-1 h-1 bg-[#122438] rounded relative"
+          class="flex-1 h-1 bg-[#4D524D] relative"
           ref={runwayRef}
         >
           <div
-            class="h-1 bg-[#c6b083] rounded absolute left-0 top-0"
+            class="h-1 bg-[#8E6D28] absolute left-0 top-0"
             style={{ width: `${percentage.value}%` }}
           ></div>
           <div
             class="h-6 w-6 absolute top-1/2 -translate-y-1/2 bg-transparent text-center select-none"
-            style={{ left: `${percentage.value}%` }}
+            style={{ left: `calc(${percentage.value}% - 0.75rem)` }}
             ref={buttonRef}
           >
             <div class={[
               'w-4 h-4 absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2',
               'bg-gradient-to-b from-[#223768] to-[#122438]',
-              'border border-[#755f44] rounded-full transition-all duration-200',
+              'border border-solid border-[#937639] rounded-full transition-all duration-200',
               'shadow-[0_2px_4px_rgba(0,0,0,0.2)]',
-              'hover:(bg-gradient-to-b from-[#2d4e9f] to-[#153051] border-[#e3c18a] scale-110)',
-              'active:(bg-gradient-to-b from-[#2d4e9f] to-[#122438] border-[#e3c18a])',
               { 'bg-gradient-to-b from-[#353535] to-[#1c1c1c] border-[#414141]': props.disabled }
             ]}></div>
           </div>
         </div>
         {props.showPercent && (
           <div class={[
-            'min-w-[45px] text-right text-sm font-medium',
+            'w-auto min-w-5 text-center text-sm font-medium',
             props.disabled ? 'text-[#696969]' : 'text-[#e9c556]'
           ]}>
-            {percentage.value.toFixed(0)}%
+            {props.formatValue ? props.formatValue(modelValue.value) : `${percentage.value.toFixed(0)}%`}
           </div>
         )}
       </div>

frontend/src/components/dnf/Equipment/List/index.vue

@@ -1,12 +1,23 @@
 <template>
-  <div class="pos-relative w-300px h-full">
-    <template v-for="part in infoStore.parts" :key="part">
+  <div
+    class="pos-relative w-264px h-full"
+    :style="{ backgroundImage: withBg ? `url(${getImageURL('/common/head.png')})` : 'none' }"
+  >
+    <template v-for="part in parts" :key="part">
       <div
         class="pos-absolute text-white/50 w-26px h-26px border-1px border-solid border-#7a7a7a/50 flex items-center justify-center"
         :style="infoStyle(part)"
         @click="choosePart(part)"
       >
-        {{ partName(part) }}
+        <template v-if="detail?.[part]?.id">
+          <EquipmentIcon :equipment="equ(detail[part].id)" />
+        </template>
+        <template v-else>
+          {{ partName(part) }}
+        </template>
+      </div>
+      <div v-if="detail?.[part]?.fusion" class="pos-absolute" :style="fusionStyle(part)">
+        <EquipmentIcon :equipment="stones(detail[part].fusion)" />
       </div>
     </template>
   </div>
@@ -15,19 +26,51 @@
 <script lang="ts" setup name="EquList">
 import { getImageURL } from '@/utils/images'
 import { useVModel } from '@vueuse/core'
-import { useInfoStore, useConfigStore } from '@/stores'
+import EquipmentIcon from '@/components/dnf/Equipment/Icon/index.vue'
+import { useInfoStore, useConfigStore, type IConfigEquip } from '@/stores'
 
 const props = defineProps({
   part: {
     type: String,
     default: '',
-  }
+  },
+  withBg: {
+    type: Boolean,
+    default: true,
+  },
+  withPet: {
+    type: Boolean,
+    default: true,
+  },
+  detail: {
+    type: Object as PropType<Record<string, IConfigEquip>>,
+  },
 })
 const partModelValue = useVModel(props, 'part')
 const infoStore = useInfoStore()
 
+const parts = computed(() => {
+  const configStore = useConfigStore()
+  const parts = infoStore.parts.filter((part) => {
+    if (part == '宠物' && !props.withPet) return false
+    if (configStore.config.equips[part]) {
+      return true
+    }
+    return false
+  })
+  return parts
+})
+
+const equ = (id: string) => {
+  return infoStore.equips.find((e) => e.id == id)
+}
+
+const stones = (id: string) => {
+  return infoStore.stones.find((e) => e.id == id)
+}
+
 const infoStyle = (part: string) => {
-  let x = 28
+  let x = 10
   let y = 5
   let index = infoStore.parts.findIndex((p) => p == part)
   if (index == 13) {
@@ -49,6 +92,30 @@ const infoStyle = (part: string) => {
   return style
 }
 
+const fusionStyle = (part: string) => {
+  let x = 0
+  let y = 15
+  let index = infoStore.parts.findIndex((p) => p == part)
+
+  if (index >= 5 && index <= 12) {
+    x += 179
+    index -= 5
+  }
+
+  if (index == 13) {
+    index = 5
+  }
+
+  x += (index % 2) * 39
+  y += Math.floor(index / 2) * 34
+
+  return {
+    left: `${x}px`,
+    top: `${y}px`,
+    zIndex: 7,
+    transform: 'scale(0.6)',
+  }
+}
 const choosePart = (part: string) => {
   partModelValue.value = part
 }

frontend/src/pages/Character/Forge/components/Avatars.vue

@@ -143,7 +143,6 @@ export default defineComponent({
                     >{`${item.rarity}${item.categorize}徽章[${item.detail}]`}</calc-option>
                   ))}
                 </calc-select>
-                )
               </div>
             ) : (
               <div></div>

frontend/src/pages/Character/Forge/components/Equipments.vue

@@ -130,7 +130,7 @@ export default defineComponent({
       return (
         <>
         <div class="h-150px flex justify-center items-center">
-          <EquList v-model:part={part.value}/></div>
+          <EquList v-model:part={part.value} withBg={false} /></div>
 
         <div class="flex flex-wrap equ-profile">
           <div class="equ-profile-item">
@@ -211,12 +211,20 @@ export default defineComponent({
           {can_upgrade.value ? (
             <div class="equ-profile-item">
               <div class="row-name">调适</div>
+              {/* <calc-slider
+                showValue={true}
+                showPercent={false}
+                v-model={adaptation.value}
+                min={0}
+                max={3}
+                step={1}
+                class="flex-1 !h-20px"
+              /> */}
               <calc-select v-model={adaptation.value} class="flex-1 !h-20px">
                 {renderList(4, (i) => (
                   <calc-option value={i - 1}>{i - 1}</calc-option>
                 ))}
               </calc-select>
-
             </div>
           ) : (
             <div></div>

frontend/src/pages/Character/Forge/components/Jades.vue

@@ -7,6 +7,13 @@
           {{item.name}}
         </calc-option>
       </calc-select>
+      <!-- <calc-slider
+        v-model="configStore.config.jades[key].value"
+        :formatValue="formatValue(configStore.config.jades[key].id)"
+        :min="Number(currentJade(configStore.config.jades[key].id)?.min)"
+        :max="Number(currentJade(configStore.config.jades[key].id)?.max)"
+        :step="Number(currentJade(configStore.config.jades[key].id)?.pre)"
+        ></calc-slider> -->
       <calc-select class="flex-1 !h-20px" v-model="configStore.config.jades[key].value">
         <calc-option v-for="(item, index) in valueList(configStore.config.jades[key].id)" :key="item.id" :value="item.id">
           {{item.value}}
@@ -26,6 +33,27 @@ import { getFloat } from '@/utils'
 const configStore = useConfigStore()
 const infoStore = useInfoStore()
 
+const currentJade = computed(() => {
+  return function (id: number = -1) {
+    if (id == -1) {
+      return undefined
+    } else {
+      const res = []
+      const cur = infoStore.jades?.find(e => e.id == id) as IJade
+      return cur
+    }
+  }
+})
+
+const formatValue = (id: number) => {
+    return (value:number) =>{
+      if(currentJade.value(id)?.unit.includes('等级')){
+        return `$等级 +${value}`
+      }
+      return `${getFloat(value, 1)}${currentJade.value(id)?.unit}`
+    }
+  }
+
 const valueList = computed(() => {
   return function (id: number = -1) {
         if (id == -1) {
@@ -36,7 +64,7 @@ const valueList = computed(() => {
           if (cur) {
             const { max, min, unit, pre } = cur
             //
-            if (pre == 0) {
+            if (unit.includes('等级')) {
               res.push({
                 id: 1,
                 value: unit

frontend/src/pages/Character/Forge/index.vue

@@ -14,9 +14,9 @@
     </div>
 </template>
 <script setup lang="ts">
-import equipment from './components/equipment.vue'
-import clothes from './components/avatar.vue';
-import jade from './components/jade.vue';
+import equipment from './components/Equipments.vue'
+import clothes from './components/Avatars.vue';
+import jade from './components/Jades.vue';
 const partTab = ref(0)
 </script>
 

frontend/src/pages/Character/Index.vue

@@ -8,11 +8,10 @@
       </calc-tabs>
     </div>
     <div class="content flex">
-      <div class="flex flex-1" v-if="!!infoStore.infos?.alter">
+      <div class="flex flex-1 m-1" v-if="!!infoStore.infos?.alter">
         <RouterView></RouterView>
       </div>
-
-      <div class="w-40%">
+      <div class="flex-1 m-1">
         <Result></Result>
       </div>
     </div>

frontend/src/pages/Character/Result/Index.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="flex" v-if="configStore.result.state">
-    <Info></Info>
+  <div class="flex gap-2" v-if="configStore.result.state">
+    <Info :suits="configStore.result.state.suits" :info="configStore.result.state.info" :equs="configStore.config.equips"></Info>
     <Skill :data="configStore.result.state.skills"></Skill>
   </div>
 </template>

frontend/src/pages/Character/Result/components/Info.vue

@@ -1,8 +1,126 @@
-<template></template>
+<template>
+  <div class="bg-#000000bf w-264px">
+    <div class="h-177px">
+      <EquList :detail="props.equs"></EquList>
+    </div>
+    <div class="flex flex-wrap border-y-1px my-1px border-y-solid border-#FFFF/10">
+      <template v-for="info in props.info" :key="info.id">
+        <div
+          class="flex px-5px box-border mt-2px"
+          :style="{ width: info.value.toString().includes('/') ? '100%' : '50%' }"
+        >
+          <div class="w-60px text-hex-836832">{{ info.name }}</div>
+          <div class="ml-auto text-hex-3ea74e">{{ info.value }}</div>
+        </div>
+      </template>
+    </div>
+    <div class="border-y-1px border-y-solid my-1px border-#FFFF/10 bg-black">
+      <template v-for="suit in props.suits" :key="suit.id">
+        <div class="flex items-center px-5px">
+          <img
+            :src="getImageURL(`/equipment${suit.imageUrl}`)"
+            alt=""
+            class="w-20px h-20px object-contain"
+          />
+          <div class="flex px-5px flex-1 justify-between" :class="rarityClass(suit.rarity)">
+            <span>{{ suit.name }} 套装</span>
+            <span>{{ suit.rarity }} {{ lvFormat(suit.level, suit.rarity) }}</span>
+            <span>{{ suit.point }}点</span>
+          </div>
+        </div>
+      </template>
+    </div>
+    <div class="border-y-1px border-y-solid my-1px border-#FFFF/10">
+      <div class="flex">
+        <div class="flex-1 flex items-center justify-center bg-#221A08 text-#9A7E4A">
+          穿戴装备信息
+        </div>
+      </div>
+      <template v-for="part in partOrder" :key="part">
+        <div class="flex p-2px partItem gap-5px">
+          <img
+            :src="getImageURL(`/equipment/icon/${part}.png`)"
+            alt=""
+            class="w-20px h-20px object-contain"
+          />
+          <div
+            class="flex items-center"
+            :class="props.equs[part]?.reinforceType == 1 ? 'artifact' : 'advanced'"
+          >
+            +{{ props.equs[part]?.reinforce }}
+          </div>
+          <div class="rare" v-if="props.equs[part]?.refine > 0">({{ props.equs[part]?.refine }})</div>
+          <div :class="rarityClass(equ(props.equs?.[part]?.id)?.rarity ?? '')">{{equ(props.equs?.[part]?.id)?.name}}</div>
+        </div>
+      </template>
+    </div>
+  </div>
+</template>
 
 <script setup lang="ts" name="Info">
+import { getImageURL } from '@/utils/images'
+import { rarityClass } from '@/utils'
+import type { IResultUserInfo, IResultSuit } from '@/api/calc/type'
+import EquList from '@/components/dnf/Equipment/List/index.vue'
+import type { IConfigEquip } from '@/stores/config'
+import { useInfoStore } from '@/stores'
 
+const props = defineProps<{
+  info: IResultUserInfo[]
+  suits: IResultSuit[]
+  equs: Record<string, IConfigEquip>
+}>()
+
+const partOrder = [
+  '武器',
+  '上衣',
+  '下装',
+  '头肩',
+  '腰带',
+  '鞋',
+  '项链',
+  '手镯',
+  '戒指',
+  '辅助装备',
+  '魔法石',
+  '耳环',
+]
+const infoStore = useInfoStore()
+
+const equ = (id: string) => {
+  return infoStore.equips.find((e) => e.id == id)
+}
+
+const lvFormat = (lv: number, rarity: string) => {
+  if (rarity == '太初') return ''
+  switch (lv) {
+    case 1:
+      return 'I'
+    case 2:
+      return 'II'
+    case 3:
+      return 'III'
+    case 4:
+      return 'IV'
+    case 5:
+      return 'V'
+    default:
+      return ''
+  }
+}
 </script>
 
 <style scoped lang="scss">
+.partItem {
+  display: flex;
+  align-items: center;
+}
+
+.partItem:nth-child(2n + 1) {
+  background-color: #0b090b;
+}
+
+.partItem:nth-child(2n) {
+  background-color: #000100;
+}
 </style>

frontend/src/pages/Character/Result/components/Skill.vue

@@ -1,12 +1,30 @@
 <template>
-  <div class="flex flex-col gap-1" v-if="data && data.length > 0">
-    <div class="flex gap-2 text-white items-center jus" v-for="skill in data" :key="skill.name">
-      <div class="flex-1 flex items-center">
-        <img :src="getImageURL(skill.icon)" alt="" class="w-8 h-8" />
+  <div class="bg-hex-000000/60 p-4 border-solid border-#FFFF/15" v-if="data && data.length > 0">
+    <div class="bg-hex-000000/40 text-white border-solid border-#FFFF/15 border-t-0">
+      <div class="flex px-1px gap-1px">
+        <div class="item-head w-150px">技能</div>
+        <div class="item-head w-80px">CD</div>
+        <div class="item-head w-150px">伤害</div>
+        <div class="item-head w-150px">秒伤</div>
+      </div>
+      <div class="overflow-y-auto max-h-580px">
+        <div class="flex px-1px gap-1px h-8.5" v-for="skill in data" :key="skill.name">
+          <div class="flex w-150px items-center gap-10px">
+            <div class="w-28px h-28px relative">
+              <img :src="getImageURL(skill.icon)" alt="" class="w-28px h-28px" />
+              <div v-if="skill.lv" class="skill-lv-min" :data-text="`Lv ${ skill.lv }`">Lv {{ skill.lv }}</div>
+            </div>
+            <div>{{ skill.name }}</div>
+          </div>
+          <div class="w-80px flex items-center justify-center">{{ skill.cd.toFixed(1) }}s</div>
+          <div class="w-150px flex items-center justify-center">
+            {{ Math.round(skill.damage).toLocaleString() }}
+          </div>
+          <div class="w-150px flex items-center justify-center">
+            {{ Math.round(skill.damage / skill.cd).toLocaleString() }}
+          </div>
+        </div>
       </div>
-      <div class="w-150px">{{ skill.name }}</div>
-      <div class="flex-1">{{ skill.cd.toFixed(2) }}s</div>
-      <div class="flex-1">{{ skill.damage.toFixed(0) }}</div>
     </div>
   </div>
 </template>
@@ -19,8 +37,40 @@ const props = defineProps<{
 }>()
 
 const data = computed(() => {
-  return props.data.sort((a,b)=>b.damage - a.damage)
+  return props.data.sort((a, b) => b.damage - a.damage)
 })
 </script>
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+.item-head {
+  background: linear-gradient(#2b2817, #171407);
+  border-top: 1px solid #423d2c;
+  border-bottom: 1px solid #211d15;
+  text-align: center;
+}
+
+.skill-lv-min {
+    position: absolute;
+    z-index: 0;
+    top: -3px;
+    right: -4px;
+    font-size: 12px;
+    transform: scale(0.7);
+    color: black;
+    text-shadow: none;
+    font-weight: bolder;
+    font-family: Arial;
+  }
+
+  .skill-lv-min::before {
+    // text-shadow: #37fa38 2px 0 0, #37fa38 0 2px 0, #37fa38 -2px 0 0, #37fa38 0 -2px 0;
+    // -webkit-text-stroke-width: 1px;
+    // -webkit-text-stroke-color: #37fa38;
+    content: attr(data-text);
+    position: absolute;
+    -webkit-text-stroke: 2.5px #37fa38;
+    font-family: Arial;
+    text-shadow: none;
+    z-index: -1;
+  }
+</style>

frontend/src/stores/config.ts

@@ -14,22 +14,25 @@ import type { IEquipment } from '@/api/info/type'
 // | '辅助装备'
 // | '魔法石'
 // | '武器',
+
+export interface IConfigEquip {
+  id: string
+  reinforce: number
+  reinforceType: number
+  enchant: string
+  emblem_0: string
+  emblem_1: string
+  upgrade: number
+  refine: number
+  adaptation: number
+  fusion: string
+}
+
 export interface IConfig {
   skills: Record<string, { lv: number }>
   equips: Record<
     string,
-    {
-      id: string
-      reinforce: number
-      reinforceType: number
-      enchant: string
-      emblem_0: string
-      emblem_1: string
-      upgrade: number
-      refine: number
-      adaptation: number
-      fusion: string
-    }
+    IConfigEquip
   >
   jades: Record<string, {
     id:number
@@ -163,6 +166,8 @@ export const useConfigStore = defineStore('configStore', () => {
     },
     {
       skills: [],
+      info: [],
+      suits: [],
     },
     { resetOnExecute: false },
   )

frontend/src/stores/info.ts

@@ -36,7 +36,8 @@ export const useInfoStore = defineStore('infoStore', () => {
     '辅助装备',
     '戒指',
     '耳环',
-    '魔法石'
+    '魔法石',
+    '宠物'
   ]
 
   const avatarParts = [

frontend/src/style/app.scss

@@ -39,7 +39,7 @@ body,
 
 * {
   // font-family: "ArkPixel", "Consola", sans-serif;
-  // font-family: "dcalc", "SimHei";
+  font-family: "dcalc", "SimHei";
   // font-family: "STSong";
   font-size: 12px;
   text-shadow: 0 0 1px #000, 0 0 1px #000, 0 0 1px #000, 0 0 1px #000,

frontend/uno.config.ts

@@ -4,6 +4,14 @@ import { blackA, green } from '@radix-ui/colors'
 
 export default defineConfig({
   // presets: [presetAttributify()],
+  rules:[
+    [
+      "cursor-pointer",
+      {
+        cursor: "var(--cursor-pointer)",
+      },
+    ]
+  ],
   theme: {
     colors: {},
   },