添加列表及一键导入

frontend/src/pages/Character/Config/importDnfhelper.vue

@@ -0,0 +1,80 @@
+<script lang="tsx">
+import { useAsyncState } from '@vueuse/core'
+import { defineComponent, ref } from 'vue'
+import api from '@/api'
+import { useDialog } from '@/components/hooks/dialog'
+import { isShow, onShow } from '@/components/hooks/show'
+import { useConfigStore } from '@/stores'
+import { type IHelperRoleInfo } from '@/api/info/type'
+
+export default defineComponent({
+  props: {
+    alter: {
+      type: Object as () => IHelperRoleInfo,
+    },
+    uid: {
+      type: String,
+    },
+  },
+  setup(props) {
+    const configStore = useConfigStore()
+    const { state, execute, isLoading } = useAsyncState(
+      async () => {
+        const res = await api.getConfigFromHelperAlter(props.uid || '', props.alter?.roleId || '')
+        configStore.config.equips = res.equips
+        configStore.config.avatar = res.avatars
+        configStore.config.avatarLink = res.avatarLink
+        configStore.config.emblems = res.emblems
+        configStore.config.sundry.fog = res.fogOathLv
+        configStore.config.oaths = res.oaths
+        const { alert } = useDialog()
+        visible.value = false
+        await alert({
+          content: '导入成功',
+        })
+        return res
+      },
+      undefined,
+      {
+        resetOnExecute: false,
+        immediate: false,
+        onError: Promise.reject,
+      },
+    )
+
+    onShow(
+      () => {
+        state.value = undefined
+      },
+      { immediate: true },
+    )
+
+    const visible = isShow()
+
+    return () => {
+      return (
+        <>
+          <div class="h-45 w-80 py-2 px-4 text-#e9c556">
+            <div class="flex justify-around items-center flex-col gap-1">
+              <div>检测到以下信息，是否导入助手数据？</div>
+              <div class="text-#DED29A">{props.alter?.roleName}</div>
+              <div class="text-#908150">{props.alter?.roleJob}</div>
+              <div class="text-#3ea74e">名望：{props.alter?.fame}</div>
+            </div>
+            <div>
+              <p class="text-#e9c556/80">* 点击导入后会从助手通过文字识别获取打造</p>
+              <p class="text-#e9c556/80">* 部分打造无法获取，此处仅做快捷导入</p>
+            </div>
+            <div class="flex justify-around items-center">
+              <calc-button onClick={execute} disabled={isLoading.value}>
+                导入
+              </calc-button>
+              <calc-button onClick={() => (visible.value = false)}>取消</calc-button>
+            </div>
+          </div>
+        </>
+      )
+    }
+  },
+})
+</script>

frontend/src/pages/Character/Index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="w-100% h-100% main flex" :class="infoStore.infos?.alter">
     <div class="header">
-      <calc-tabs route>
+      <calc-tabs route :query="route.query">
         <calc-tab :value="`/character/equipment/${props.alter}`">装备设置</calc-tab>
         <calc-tab :value="`/character/skill/${props.alter}`">技能设置</calc-tab>
         <calc-tab :value="`/character/forge/${props.alter}`">打造设置</calc-tab>
@@ -38,6 +38,10 @@
   <calc-dialog lazy header="技能导入" v-model:visible="importSkillVisible">
     <ImportSkillVue></ImportSkillVue>
   </calc-dialog>
+
+  <calc-dialog lazy header="助手打造导入" v-model:visible="helperImport">
+    <ImportDnfhelper :alter="toImport" :uid="helperStore.helperInfo?.id"></ImportDnfhelper>
+  </calc-dialog>
 </template>
 
 <script lang="ts" setup name="Index">
@@ -45,16 +49,22 @@ import { useInfoStore } from '@/stores/info'
 import { useConfigStore } from '@/stores'
 import ImportVue from './Config/import.vue'
 import ImportSkillVue from './Config/importSkill.vue'
+import ImportDnfhelper from './Config/importDnfhelper.vue'
 import Result from './Result/Index.vue'
+import { useDnfHelperStore } from '@/stores/dnfhelper.ts'
+import { type IHelperRoleInfo } from '@/api/info/type'
 const props = defineProps<{
   alter: string
 }>()
 const infoStore = useInfoStore()
 const configStore = useConfigStore()
+const helperImport = ref(false)
 const importVisible = ref(false)
 const importSkillVisible = ref(false)
+const helperStore = useDnfHelperStore()
+const toImport = ref<IHelperRoleInfo>()
 
-const shouldWatch = ref(true)
+// const shouldWatch = ref(true)
 
 const isExecuting = ref(false)
 
@@ -81,11 +91,22 @@ const showImport = () => {
 const showImportSkill = () => {
   importSkillVisible.value = true
 }
+
+const route = useRoute()
+
 onMounted(async () => {
   await infoStore.createCharacter(props.alter, '0')
   window.addEventListener('beforeunload', () => {
     configStore.saveConfig()
   })
+  // 检测router的传参
+  const { roleId } = route.query
+  if (roleId) {
+    toImport.value = helperStore.helperInfo?.roleList.find((a) => a.roleId === roleId)
+    if (toImport.value) {
+      helperImport.value = true
+    }
+  }
 })
 
 onUnmounted(() => {