dev

2025-04-03 17:57:45 +08:00
parent d56afd0695
commit e2099aa047
15 changed files with 744 additions and 42 deletions
@@ -0,0 +1,73 @@
+<template>
+  <div class="pos-relative w-300px h-full">
+    <template v-for="part in infoStore.avatarParts" :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) }}
+      </div>
+    </template>
+  </div>
+</template>
+
+<script lang="ts" setup name="EquList">
+import { getImageURL } from '@/utils/images'
+import { useVModel } from '@vueuse/core'
+import { useInfoStore, useConfigStore } from '@/stores'
+
+const props = defineProps({
+  part: {
+    type: String,
+    default: '',
+  },
+})
+const partModelValue = useVModel(props, 'part')
+const infoStore = useInfoStore()
+
+const infoStyle = (part: string) => {
+  let x = 15
+  let y = 5
+  let index = infoStore.avatarParts.findIndex((p) => p == part)
+  if (index > 7) {
+    index += 1
+  }
+  // if (index == 13) {
+  //   index -= 7
+  // } else if (index >= 5 && index <= 12) {
+  //   x += 179
+  //   index -= 5
+  // }
+  if(part == '宠物'){
+    x+= 5*39
+    y+= 1*40
+  }
+  else if (part.includes('宠物装备')) {
+    x += 6 * 39
+    y += (index - infoStore.avatarParts.findIndex((p) => p == '宠物装备-红') - 1) * 40
+  } else {
+    x += (index % 4) * 39
+    y += Math.floor(index / 4) * 40
+  }
+
+  const style = {
+    left: `${x}px`,
+    top: `${y}px`,
+    zIndex: 6,
+    // fontWeight: 900,
+  }
+  return style
+}
+
+const choosePart = (part: string) => {
+  partModelValue.value = part
+}
+
+const partName = (part: string) => {
+  if (part == '武器装扮') return '武器'
+  return part.replace('宠物装备-', '')
+}
+</script>
+
+<style lang="scss" scoped></style>