This commit is contained in:
2026-04-20 00:00:48 +08:00
parent dbf33477d9
commit cda93965e3
33 changed files with 677 additions and 317 deletions
@@ -1,60 +0,0 @@
`<!-- 每排总计6+4+4,共计14个排列 -->
<template>
<div class="flex flex-wrap gap-4px content-start" :style="{ width: `${rowCount * 32}px` }">
<template v-for="(equip, _) in equs" :key="_">
<EquipmentIcon
:inactive="configStore.config.equips[equip?.itemDetailType ?? '']?.fusion != equip?.id"
:equipment="equip"
@click="configStore.chooseEqu(equip, true)"
/>
</template>
</div>
</template>
<script lang="ts" setup StoneUniversal>
import type { IEquipment } from '@/api/info/type'
import { useConfigStore, useInfoStore } from '@/stores'
import { getImageURL } from '@/utils/images'
import EquipmentIcon from '@/components/dnf/Equipment/Icon/index.vue'
const props = defineProps<{
rowCount?: number
}>()
const rowCount = Math.max(props.rowCount ?? 0, 14)
const infoStore = useInfoStore()
const configStore = useConfigStore()
const equs = computed(() => {
const items = infoStore.stones.filter((equip) => equip.categorize.includes('神界'))
const res: (IEquipment | undefined)[] = []
res.push(
...items.filter((a) => a.rarity === '太初'),
...Array(Math.max(0, rowCount - items.filter((a) => a.rarity === '太初').length)).fill(
undefined,
),
)
;['手镯', '项链', '戒指', '', '辅助装备', '魔法石', '耳环', ''].forEach((cat) => {
const equ: (IEquipment | undefined)[] = items.filter(
(a) => a.rarity === '史诗' && a.itemDetailType == cat,
)
res.push(...equ, ...Array(Math.max(0, 7 - equ.length)).fill(undefined))
})
// const categorize = Array.from(new Set(items.map((item) => item.categorize)))
// raritiyList.forEach((rarity) => {
// categorize.forEach((cat) => {
// const equ : (IEquipment | undefined)[] = items.filter((a) => a.rarity === rarity && a.categorize === cat)
// equ.splice(5,0,undefined)
// res.push(
// ...equ,
// ...Array(Math.max(0,rowCount - equ.length)).fill(undefined),
// )
// })
// })
return res
})
</script>
`
@@ -15,7 +15,6 @@
<script lang="ts" setup>
import type { IEquipment } from '@/api/info/type'
import { useConfigStore, useInfoStore } from '@/stores'
import { getImageURL } from '@/utils/images'
import EquipmentIcon from '@/components/dnf/Equipment/Icon/index.vue'
const props = defineProps<{
@@ -126,7 +126,7 @@ import PartSelect from '@/components/dnf/Equipment/PartSelect/index.vue'
import EquipmentRaritySelect from '@/components/dnf/Equipment/RaritySelect/index.vue'
import { getImageURL } from '@/utils/images'
import { rarityClass } from '@/utils'
import type { IEquipment, IOathInfo } from '@/api/info/type'
import type { IEquipment } from '@/api/info/type'
import EquipmentIcon from '@/components/dnf/Equipment/Icon/index.vue'
import Info from '@/components/dnf/Equipment/Info/index.vue'
import SuitInfo from '@/components/dnf/Equipment/SuitInfo/index.vue'
@@ -259,7 +259,7 @@ const equs = computed(() => {
)
} else {
return formatOath(
total as unknown as IOathInfo[],
total as unknown as IEquipment[],
suitList.value.find((a) => a.value == curSuit.value),
)
}
@@ -275,7 +275,7 @@ const isActive = computed(() => {
return configStore.config.equips[item.itemDetailType].id == item.id
}
} else {
// return configStore.config.equips[item.itemDetailType].fusion == item.id
return configStore.config.oaths[item.oathPos].id == item.id
}
}
})
@@ -288,8 +288,8 @@ const chooseEqu = (item?: IEquipment) => {
? configStore.config.equips[
item.itemType.includes('武器') ? item.itemType : item.itemDetailType
]
: configStore.config.equips[item.itemDetailType]
target[type.value === 'equ' ? 'id' : 'fusion'] = isActive.value(item) ? '' : item.id
: configStore.config.oaths[item.oathPos]
target['id'] = isActive.value(item) ? '' : item.id
}
</script>
@@ -1,4 +1,4 @@
import type { IEquipment, IOathInfo } from '@/api/info/type'
import type { IEquipment } from '@/api/info/type'
export const rowCount = 10
@@ -293,7 +293,7 @@ export const formatStone = (total: IEquipment[], curSuit?: string) => {
}
export const formatOath = (
total: IOathInfo[],
total: IEquipment[],
curSuit?: { name: string; value: number; imageUrl: string },
) => {
// oath
@@ -303,7 +303,7 @@ export const formatOath = (
const primer = []
const primerItem = total.filter((equip) => equip.itemDetailType == '星蕴石')
for (let i = 0; i < 11; i++) {
const temp = primerItem.filter((a) => a.position.includes(i.toString()))
const temp = primerItem.filter((a) => a.oathPos == i.toString())
primer.push(
...temp,
...Array(temp.length == 0 ? rowCount : rowCount - (temp.length % rowCount)).fill(undefined),
@@ -5,14 +5,12 @@ import { useInfoStore, useConfigStore } from '@/stores'
import ClothList from '@/components/dnf/Avatar/List/index.vue'
export default defineComponent({
name: 'Clothes',
setup(props) {
setup() {
const configStore = useConfigStore()
const part = ref('武器装扮')
// const globalStore = useGlobalStore()
/** 是否有徽章 */
const has_socket = computed(() => ['武器装扮', '光环', '皮肤'].includes(part.value as string))
const basicInfoStore = useInfoStore()
const has_enchant = computed(() => {
return !['头部', '帽子', '脸部', '胸部', '上衣', '腰带', '下装', '鞋'].includes(
@@ -26,9 +24,9 @@ export default defineComponent({
.sort((a, b) => (b.fame ?? 0) - (a.fame ?? 0))
})
const emblem_list = computed<IEnchantingInfo[] | undefined>(() => {
return basicInfoStore.emblems.filter((item) => item.position.includes(part.value))
})
// const emblem_list = computed<IEnchantingInfo[] | undefined>(() => {
// return basicInfoStore.emblems.filter((item) => item.position.includes(part.value))
// })
const currentInfo = function <T>(name: string, defaultValue?: T) {
return computed<string | number>({
@@ -36,7 +34,7 @@ export default defineComponent({
let key: 'avatar' | 'equips' = 'avatar'
if (part.value == '宠物') key = 'equips'
return (
(configStore.config[key]?.[part.value] as Record<string, any>)?.[name] ??
(configStore.config[key]?.[part.value] as Record<string, string | number>)?.[name] ??
defaultValue ??
0
)
@@ -48,10 +46,13 @@ export default defineComponent({
let key: 'avatar' | 'equips' = 'avatar'
if (part.value == '宠物') key = 'equips'
if (!configStore.config[key][part.value]) {
configStore.config[key][part.value] = key === 'avatar' ? { ...configStore.defaultAvatarConfig } : { ...configStore.defaultEqusConfig }
configStore.config[key][part.value] =
key === 'avatar'
? { ...configStore.defaultAvatarConfig }
: { ...configStore.defaultEqusConfig }
}
if (configStore.config[key][part.value]) {
;(configStore.config[key][part.value] as Record<string, any>)[name] = val
;(configStore.config[key][part.value] as Record<string, string | number>)[name] = val
}
},
})
@@ -60,11 +61,11 @@ export default defineComponent({
// 附魔
const enchant = currentInfo<string | number>('enchant')
// 镶嵌栏1
const emblem_0 = currentInfo<string | number>('emblem_0', 0)
// // 镶嵌栏1
// const emblem_0 = currentInfo<string | number>('emblem_0', 0)
// 镶嵌栏2
const emblem_1 = currentInfo<string | number>('emblem_1')
// // 镶嵌栏2
// const emblem_1 = currentInfo<string | number>('emblem_1')
// 品级
const id = currentInfo<string | number>('id')
@@ -76,9 +77,9 @@ export default defineComponent({
* 同步徽章1到徽章2
* @param val
*/
function changeSocket(val: number) {
emblem_1.value = val
}
// function changeSocket(val: number) {
// emblem_1.value = val
// }
return () => {
return (
@@ -127,33 +128,6 @@ export default defineComponent({
</div>
</>
)}
{has_socket.value ? (
<div class="equ-profile-item">
<div class="row-name">徽章</div>
<calc-select
onChange={changeSocket}
v-model={emblem_0.value}
class="flex-1 !h-20px"
>
<calc-option value={0}>无</calc-option>
{renderList(emblem_list.value ?? [], (item) => (
<calc-option
value={item.id}
>{`${item.rarity}${item.categorize}徽章[${item.detail}]`}</calc-option>
))}
</calc-select>
<calc-select v-model={emblem_1.value} class="flex-1 !h-20px">
<calc-option value={0}>无</calc-option>
{renderList(emblem_list.value ?? [], (item) => (
<calc-option
value={item.id}
>{`${item.rarity}${item.categorize}徽章[${item.detail}]`}</calc-option>
))}
</calc-select>
</div>
) : (
<div></div>
)}
</div>
</>
)
@@ -0,0 +1,5 @@
<template>
<div></div>
</template>
<script lang="ts" setup name="Emblems"></script>
@@ -6,7 +6,7 @@ import EquList from '@/components/dnf/Equipment/List/index.vue'
import { getImageURL } from '@/utils/images'
export default defineComponent({
name: 'Equip',
setup(props) {
setup() {
const configStore = useConfigStore()
const part = ref('头肩')
const can_upgrade = computed(() => {
@@ -15,14 +15,6 @@ export default defineComponent({
// const globalStore = useGlobalStore()
/** 是否有徽章 */
const has_socket = computed(
() => !['称号', '宠物', '耳环', '武器'].includes(part.value as string),
)
/** 是否有右侧徽章 */
const has_emblem_1 = computed(
() => has_socket.value && !['辅助装备', '魔法石'].includes(part.value as string),
)
/** 是否可以设置秘宝精度 */
const can_set_secret = computed(() => {
return ['武器', '辅助装备', '魔法石', '耳环'].includes(part.value as string)
@@ -40,9 +32,9 @@ export default defineComponent({
.sort((a, b) => (b.fame ?? 0) - (a.fame ?? 0))
})
const emblem_list = computed<IEnchantingInfo[] | undefined>(() => {
return basicInfoStore.emblems.filter((item) => item.position.includes(part.value))
})
// const emblem_list = computed<IEnchantingInfo[] | undefined>(() => {
// return basicInfoStore.emblems.filter((item) => item.position.includes(part.value))
// })
const global_change = ref(false)
@@ -50,6 +42,7 @@ export default defineComponent({
return computed<string | number>({
get() {
return (
// eslint-disable-next-line @typescript-eslint/no-explicit-any
(configStore.config.equips?.[part.value] as Record<string, any>)?.[name] ??
defaultValue ??
0
@@ -59,10 +52,10 @@ export default defineComponent({
if (val == undefined && name !== 'weaponFusion') {
return
}
if (name == 'emblem_1' && !has_emblem_1.value) {
// configStore.setForge(part.value, name, 0)
return
}
// if (name == 'emblem_1' && !has_emblem_1.value) {
// // configStore.setForge(part.value, name, 0)
// return
// }
let parts: string[] = []
@@ -75,16 +68,16 @@ export default defineComponent({
parts = enchant.position
}
}
if (['emblem_0', 'emblem_1'].includes(name)) {
const emblem = basicInfoStore?.emblems?.find(
(item) => item.id.toString() == val.toString(),
) as IEnchantingInfo | undefined
if (emblem?.position) {
parts = emblem.position.filter(
(item) => !['皮肤', '武器装扮', '光环'].includes(item),
)
}
}
// if (['emblem_0', 'emblem_1'].includes(name)) {
// const emblem = basicInfoStore?.emblems?.find(
// (item) => item.id.toString() == val.toString(),
// ) as IEnchantingInfo | undefined
// if (emblem?.position) {
// parts = emblem.position.filter(
// (item) => !['皮肤', '武器装扮', '光环'].includes(item),
// )
// }
// }
if (['reinforceType', 'reinforce', 'adaptation'].includes(name)) {
parts = basicInfoStore.parts.filter((e) => !['称号', '宠物'].includes(e))
}
@@ -96,6 +89,7 @@ export default defineComponent({
configStore.config.equips[part] = { ...configStore.defaultEqusConfig }
}
if (configStore.config.equips[part]) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
;(configStore.config.equips[part] as Record<string, any>)[name] = val
}
}
@@ -106,11 +100,11 @@ export default defineComponent({
// 附魔
const enchant = currentInfo<string | number>('enchant')
// 镶嵌栏1
const emblem_0 = currentInfo<string | number>('emblem_0', 0)
// // 镶嵌栏1
// const emblem_0 = currentInfo<string | number>('emblem_0', 0)
// 镶嵌栏2
const emblem_1 = currentInfo<string | number>('emblem_1')
// // 镶嵌栏2
// const emblem_1 = currentInfo<string | number>('emblem_1')
// 增幅
const reinforce_type = currentInfo<string | number>('reinforceType', 1)
@@ -133,11 +127,11 @@ export default defineComponent({
* 同步徽章1到徽章2
* @param val
*/
function changeSocket(val: number) {
if (has_emblem_1.value) {
emblem_1.value = val
}
}
// function changeSocket(val: number) {
// if (has_emblem_1.value) {
// emblem_1.value = val
// }
// }
const setWeaponFusion = (val: number) => {
if (val == weaponFusion.value) {
@@ -240,37 +234,6 @@ export default defineComponent({
))}
</calc-select>
</div>
{has_socket.value ? (
<div class="equ-profile-item">
<div class="row-name">徽章</div>
<calc-select
onChange={changeSocket}
v-model={emblem_0.value}
class="flex-1 !h-20px"
>
<calc-option value={''}>无</calc-option>
{renderList(emblem_list.value ?? [], (item) => (
<calc-option
value={item.id}
key={item.id}
>{`${item.rarity}${item.categorize}徽章[${item.detail}]`}</calc-option>
))}
</calc-select>
{has_emblem_1.value && (
<calc-select v-model={emblem_1.value} class="flex-1 !h-20px">
<calc-option value={''}>无</calc-option>
{renderList(emblem_list.value ?? [], (item) => (
<calc-option
value={item.id}
key={item.id}
>{`${item.rarity}${item.categorize}徽章[${item.detail}]`}</calc-option>
))}
</calc-select>
)}
</div>
) : (
<div></div>
)}
{can_upgrade.value ? (
<div class="equ-profile-item">
@@ -4,7 +4,7 @@
<div class="flex gap-2 mt-5px">
<calc-select class="flex-1 !h-20px" v-model="configStore.config.jades[key].id">
<calc-option :value="0">无</calc-option>
<calc-option v-for="(item, index) in infoStore.jades" :key="item.id" :value="item.id">
<calc-option v-for="item in infoStore.jades" :key="item.id" :value="item.id">
{{ item.name }}
</calc-option>
</calc-select>
@@ -17,7 +17,7 @@
></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)"
v-for="item in valueList(configStore.config.jades[key].id)"
:key="item.id"
:value="item.id"
>
@@ -38,26 +38,25 @@ 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 currentJade = computed(() => {
// return function (id: number = -1) {
// if (id == -1) {
// return undefined
// } else {
// 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 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) {
@@ -0,0 +1,77 @@
<template>
<div class="h-150px flex justify-center items-center">
<Oath v-model:part="part" :withBg="false" />
</div>
<div class="flex flex-wrap equ-profile">
<div class="equ-profile-item">
<div class="mr-10px row-name">当前部位</div>
<span>{{ part == '11' ? '誓约' : `星蕴石-${parseInt(part) + 1}` }}</span>
<calc-checkbox
style="margin-left: auto"
v-model="global_change"
label="全局修改"
></calc-checkbox>
</div>
<div class="equ-profile-item">
<div class="row-name">调适</div>
<calc-select v-model="adaptation" class="flex-1 !h-20px">
<template v-for="i in Array.from({ length: 4 }, (_, i) => i)" :key="i">
<calc-option :value="i">{{ i }}</calc-option>
</template>
</calc-select>
</div>
</div>
</template>
<script lang="ts" setup name="Oaths">
import Oath from '@/components/dnf/Equipment/Oath/index.vue'
import { useConfigStore, useInfoStore } from '@/stores'
const part = ref('0')
const global_change = ref(false)
const configStore = useConfigStore()
const infoStore = useInfoStore()
const currentInfo = function <T>(name: string, defaultValue?: T) {
return computed<string | number>({
get() {
return (
// eslint-disable-next-line @typescript-eslint/no-explicit-any
(configStore.config.oaths?.[part.value] as Record<string, any>)?.[name] ?? defaultValue ?? 0
)
},
set(val) {
if (val == undefined) {
return
}
// if (name == 'emblem_1' && !has_emblem_1.value) {
// // configStore.setForge(part.value, name, 0)
// return
// }
let parts: string[] = []
if (global_change.value) {
parts = infoStore.oathParts
} else {
parts = [part.value]
}
for (const part of parts) {
if (!configStore.config.oaths[part]) {
configStore.config.oaths[part] = { ...configStore.defaultOathConfig }
}
if (configStore.config.oaths[part]) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
;(configStore.config.oaths[part] as Record<string, any>)[name] = val
}
}
},
})
}
// 调适
const adaptation = currentInfo<string | number>('adaptation')
</script>
@@ -12,7 +12,7 @@
class="flex-1 !h-20px"
/>
</div>
<div class="equ-profile-item">
<!-- <div class="equ-profile-item">
<div class="row-name">勋章</div>
<calc-select
v-for="(key, index) in ['medal_rarity', 'medal_reinforce']"
@@ -37,7 +37,7 @@
{{ item.name }}
</calc-option>
</calc-select>
</div>
</div> -->
<div class="equ-profile-item">
<div class="row-name">冒险团</div>
<calc-slider
+8 -2
View File
@@ -2,11 +2,15 @@
<div class="w-420px overflow-auto">
<calc-collapse class="w-100%" title="装备/时装打造(点击部位切换)">
<calc-tabs v-model="partTab" class="!mb-2">
<calc-tab :value="0">装备栏</calc-tab>
<calc-tab :value="1">时装栏</calc-tab>
<calc-tab :value="0">装备</calc-tab>
<calc-tab :value="2">誓约</calc-tab>
<calc-tab :value="1">时装</calc-tab>
<calc-tab :value="3">徽章</calc-tab>
</calc-tabs>
<equipment v-if="partTab === 0"></equipment>
<clothes v-if="partTab === 1"></clothes>
<oaths v-if="partTab === 2"></oaths>
<emblems v-if="partTab === 3"></emblems>
</calc-collapse>
<calc-collapse class="w-100%" title="辟邪玉">
<jade></jade>
@@ -19,6 +23,8 @@
<script setup lang="ts">
import equipment from './components/Equipments.vue'
import clothes from './components/Avatars.vue'
import emblems from './components/Emblems.vue'
import oaths from './components/Oaths.vue'
import jade from './components/Jades.vue'
import sundry from './components/Sundry.vue'
const partTab = ref(0)
+60 -2
View File
@@ -5,11 +5,30 @@
<calc-button class="flex-1" @click="setStandard">设为基准</calc-button>
<calc-button class="flex-1" @click="clearStandard">清空基准</calc-button>
</div>
<div class="flex bg-#101012 h-40px text-#6C5E4A font-bold z-10">
<div
class="flex-1 text-15px flex items-center justify-center"
@click="chooseCategory('equ')"
:class="{ active: type === 'equ' }"
>
装备
</div>
<div class="w-auto text-18px flex items-center justify-center !font-normal">|</div>
<div
class="flex-1 text-15px flex items-center justify-center"
@click="chooseCategory('oath')"
:class="{ active: type === 'oath' }"
>
誓约
</div>
</div>
<Info
:suits="configStore.result.state.suits"
:info="configStore.result.state.info"
:equs="configStore.config.equips"
:avatar="configStore.config.avatarLink"
:oaths="configStore.config.oaths"
:display="type"
></Info>
</div>
<Skill
@@ -31,10 +50,10 @@ import { useConfigStore, useInfoStore } from '@/stores'
import Info from './components/Info.vue'
import Skill from './components/Skill.vue'
import BufferSkill from './components/BufferSkill.vue'
import type { IResultSkill } from '@/api/calc/type'
const configStore = useConfigStore()
const infoStore = useInfoStore()
const type = ref<'equ' | 'oath'>('equ')
const setStandard = () => {
if (!configStore?.result?.state?.uuid) return
@@ -44,6 +63,45 @@ const setStandard = () => {
const clearStandard = () => {
infoStore.setStandard(undefined)
}
const chooseCategory = (cat: 'equ' | 'oath') => {
type.value = cat
console.log(type.value)
}
</script>
<style scoped lang="scss"></style>
<style lang="scss" scoped>
.active {
color: #ccc088;
position: relative;
&::before {
content: '';
position: absolute;
width: 60px;
height: 15px;
opacity: 0.35;
background: #bf8d20;
filter: blur(7px);
z-index: 2;
}
&::after {
content: '';
position: absolute;
background: url('@/assets/img/active.png') no-repeat;
width: 148px;
height: 16px;
bottom: 2px;
transform: translate(0, 50%);
z-index: 4;
}
}
.item-head {
background: linear-gradient(#2b2817, #171407);
border-top: 1px solid #423d2c;
border-bottom: 1px solid #211d15;
text-align: center;
}
</style>
@@ -5,7 +5,9 @@
:detail="props.equs"
:with-sub-weapon="(infoStore.infos?.subweapons?.length ?? 0) > 0"
:avatar="props.avatar"
v-show="display == 'equ'"
></EquList>
<Oath :detail="props.oaths" v-show="display == 'oath'"></Oath>
</div>
<div class="flex flex-wrap border-y-1px my-1px border-y-solid border-#FFFF/10 gap-1% px-1%">
<template v-for="info in props.info" :key="info.id">
@@ -37,37 +39,71 @@
<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">
穿戴装备信息
穿戴{{ display == 'equ' ? '装备' : '誓约' }}信息
</div>
</div>
<template v-for="part in partOrder" :key="part">
<div class="flex p-2px partItem gap-5px">
<img
:src="getImageURL(`/equipment/part/${part}.png`)"
alt=""
class="w-20px h-20px object-contain"
/>
<div class="flex items-center justify-center" v-if="adaptation(part) > 0">
<template v-if="display == 'equ'">
<template v-for="part in partOrder" :key="part">
<div class="flex p-2px partItem gap-5px">
<img
:src="getImageURL(`/equipment/adaptation/${adaptation(part)}.png`)"
:src="getImageURL(`/equipment/part/${part}.png`)"
alt=""
class="w-11px h-10px object-contain"
class="w-20px h-20px object-contain"
/>
<div class="flex items-center justify-center" v-if="adaptation(part) > 0">
<img
:src="getImageURL(`/equipment/adaptation/${adaptation(part)}.png`)"
alt=""
class="w-11px h-10px object-contain"
/>
</div>
<div
class="flex items-center"
v-if="props.equs[part]?.reinforce > 0"
: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>
<div
class="flex items-center"
v-if="props.equs[part]?.reinforce > 0"
:class="props.equs[part]?.reinforceType == 1 ? 'artifact' : 'advanced'"
>
+{{ props.equs[part]?.reinforce }}
</template>
</template>
<template v-else>
<template v-for="part in oathOrder" :key="part">
<div class="flex p-2px partItem gap-5px">
<img
:src="getImageURL(`/equipment/part/${part == '11' ? '誓约' : '星蕴石'}.png`)"
alt=""
class="w-20px h-20px object-contain"
/>
<div class="flex items-center justify-center" v-if="adaptation(part) > 0">
<img
:src="getImageURL(`/equipment/adaptation/${adaptation(part)}.png`)"
alt=""
class="w-11px h-10px object-contain"
/>
</div>
<!-- <div
class="flex items-center"
v-if="props.equs[part]?.reinforce > 0"
: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> -->
{{ equ(props.equs?.[part]?.id) }}
<div :class="rarityClass(equ(props.oaths?.[part]?.id)?.rarity ?? '')">
{{ equ(props.oaths?.[part]?.id)?.name }}
</div>
</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>
</template>
</div>
<div class="h-40px w-full"></div>
@@ -79,14 +115,17 @@ 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 Oath from '@/components/dnf/Equipment/Oath/index.vue'
import type { IConfigEquip, IConfigOath } from '@/stores/config'
import { useInfoStore } from '@/stores'
const props = defineProps<{
info: IResultUserInfo[]
suits: IResultSuit[]
equs: Record<string, IConfigEquip>
oaths: Record<string, IConfigOath>
avatar: string
display: 'oath' | 'equ'
}>()
const partOrder = [
@@ -103,9 +142,15 @@ const partOrder = [
'魔法石',
'耳环',
]
const oathOrder = Array.from({ length: 12 }, (_, i) => (11 - i).toString())
const infoStore = useInfoStore()
const equ = (id: string) => {
if (props.display == 'oath') {
console.log(props.oaths, id)
return infoStore.oaths.find((e) => e.id == id)
}
return infoStore.equips.find((e) => e.id == id)
}