dev

2025-03-12 09:36:26 +08:00
parent b98464d8b5
commit 6053fba1da
22 changed files with 286 additions and 228 deletions
@@ -0,0 +1,115 @@
+<script lang="tsx">
+import { Fragment, computed, defineComponent, onMounted, ref, renderList } from 'vue'
+import api from '@/api'
+import type { IAlterInfo } from '@/api/info/type'
+import { getImageURL } from '@/utils/images'
+
+function job_icon(child: IAlterInfo) {
+  return {
+    filter: !(child.open || import.meta.env.DEV) ? 'grayscale(100%)' : '',
+    backgroundImage: `url('${getImageURL(`adventure/jobs/${child.name}.png`)}')`,
+  }
+}
+
+export default defineComponent(async () => {
+  const ignores = ['empty']
+  const zoom = computed(() =>
+    /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(
+      navigator.userAgent || navigator.vendor || (window as any).opera,
+    )
+      ? 1
+      : Math.max(Math.min((window.innerHeight * 0.8) / 750, (window.innerWidth * 0.85) / 1100), 1),
+  )
+
+  // 获取角色相关信息，判定是否开放
+  function choose_job(child: IAlterInfo) {
+    return async () => {
+      if (child.comment == '首页') {
+        return window.open("https://dnftools.com","_blank")
+      }
+      if (child.name == 'sponsor') {
+        return window.open((child.url ?? ''),"_blank")
+      }
+      if (child.open) {
+        const options = child.options ?? []
+        if (options.length > 0) {
+          return
+        }
+        else{
+          return window.open("/character/" + (child.class || child.name),"_self")
+        }
+    }
+  }
+    // router.push("/character/" + alter)
+  }
+
+  // const canClick = ref(true)
+
+  // let checkTimer: NodeJS.Timeout
+
+  const adventure = await api.adventures()
+
+  return () => (
+    <Fragment>
+      <div class="bg-no-repeat h-auto min-h-full pt-8 pb-12 pl-4" style={`zoom:${zoom.value};background-image: url('${getImageURL('home.jpg')}');background-size: 100% 100%;`}>
+        {renderList(adventure, (job) => (
+          <div class="flex flex-row">
+            <div
+              class="bg-no-repeat bg-center flex flex-wrap h-25 w-30 job-icon-box justify-center items-center relative character-icon-flash"
+              style={`background-image:url('${getImageURL('adventure/sub/flash.png')}')`}
+            >
+              <div
+                class="bg-center bg-no-repeat h-22.5 w-30"
+                style={`background-image:url('${getImageURL(`adventure/sub/${job.name}.png`)}')`}
+              ></div>
+            </div>
+            {renderList(job.children, (child) => (
+              <div
+                onClick={choose_job(child)}
+                class="cursor-pointer h-22.5 m-1 w-30 duration-300 job-box box-border relative"
+              >
+                {child.open && child.name != 'sponsor' && (
+                  <div
+                    class="bg-no-repeat h-full w-full z-2 duration-200 job-border absolute hover:bg-hex-ffd7002e"
+                    style={`background-image:url('${getImageURL('adventure/jobs/border.png')}')`}
+                  ></div>
+                )}
+                <div
+                  class="text-xs text-center text-white w-full bottom-9.6 justify-center absolute"
+                  style="letter-spacing:10px;text-indent:10px;z-index:999"
+                >
+                  {child.comment}
+                </div>
+                <div class="text-xs text-center w-full bottom-1 text-hex-bea347 absolute">
+                  {child.title}
+                </div>
+                <div
+                  class="bg-no-repeat bg-auto bg-clip-content h-full w-full z-1 overflow-hidden"
+                  style={job_icon(child)}
+                ></div>
+              </div>
+            ))}
+          </div>
+        ))}
+        <div class="flex pt-4 justify-center">
+          <a class="text-hex-bea347" href="https://beian.miit.gov.cn/" target="_blank">
+            赣ICP备2023003492号
+          </a>
+        </div>
+      </div>
+
+      <div
+        class="flex flex-col"
+        style={`position: absolute;top: ${30 + 82 * 0}px;left: 775px;width: 160px;height: 150px;zoom:${zoom.value}`}
+      >
+        <div
+          class="w-70px h-50px bg-no-repeat"
+          style={`z-index:5;background-position:2% 50%;background-size:100% auto;background-image: url('${import.meta.env.BASE_URL}images/tooltips/login.gif')`}
+        ></div>
+      </div>
+    </Fragment>
+  )
+})
+</script>
+
+<style lang="scss"></style>