From 8ed072fa28e899616e880a759e66d2f1ef16ae27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A5=9E=E4=BB=A3=E7=B6=BA=E5=87=9B?= <i@loli.best>
Date: Fri, 5 Jul 2024 18:10:37 +0800
Subject: [PATCH] feat: support display character cultivate data from skland

---
 src/App.vue                                   | 12 ++-
 .../material/PresetSettingDialog.vue          | 52 +++++++++---
 src/data/changelog.json                       |  4 +
 src/main.js                                   |  3 +
 src/store/materialValue.js                    |  6 +-
 src/store/skland.js                           | 81 ++++++++++++++++++-
 src/views/Material/index.js                   | 24 ++++--
 src/views/Material/index.scss                 |  3 +
 src/views/Material/index.vue                  | 20 +++--
 9 files changed, 179 insertions(+), 26 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 4470a846..8e043488 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -443,6 +443,9 @@ a {
   filter: none !important;
 }
 
+.of-hidden {
+  overflow: hidden;
+}
 .no-wrap {
   white-space: nowrap;
 }
@@ -551,13 +554,14 @@ a {
   flex-wrap: nowrap;
   vertical-align: middle;
   margin: 2px 4px 2px 0;
-  &-left {
+  & > .mdui-btn {
     margin: 0 !important;
+  }
+  &-left {
     border-top-right-radius: 0;
     border-bottom-right-radius: 0;
   }
   &-right {
-    margin: 0 !important;
     border-top-left-radius: 0;
     border-bottom-left-radius: 0;
     border-left: rgba(0, 0, 0, 0.13) 1px solid;
@@ -607,6 +611,10 @@ a {
   border: none !important;
 }
 
+.mdui-m-l-auto {
+  margin-left: auto !important;
+}
+
 .mdui-m-l-05 {
   margin-left: 4px !important;
 }
diff --git a/src/components/material/PresetSettingDialog.vue b/src/components/material/PresetSettingDialog.vue
index 40d32c1b..72568929 100644
--- a/src/components/material/PresetSettingDialog.vue
+++ b/src/components/material/PresetSettingDialog.vue
@@ -10,7 +10,12 @@
     <template v-if="sp">
       <div class="mdui-card-header mdui-p-b-0">
         <Avatar class="mdui-card-header-avatar mdui-color-grey-400" :name="selectedPresetName" />
-        <div class="mdui-card-header-title">{{ $t(`character.${selectedPresetName}`) }}</div>
+        <div class="mdui-card-header-title flex-nowrap">
+          <span class="mdui-text-truncate">{{ $t(`character.${selectedPresetName}`) }}</span>
+          <small v-if="curSklandCultivate" class="mdui-text-color-theme-secondary mdui-m-l-1">{{
+            getCultivateCharLevelText(selectedPresetName)
+          }}</small>
+        </div>
       </div>
       <div class="mdui-card-content preset-list mdui-p-x-3">
         <!-- 精英化选框 -->
@@ -24,9 +29,14 @@
         </div>
         <!-- 普通技能选框 -->
         <div class="skill-normal cb-with-num-select" v-if="sp.skills.normal.length >= 2">
-          <mdui-checkbox v-model="pSetting.skills.normal[0]" class="mdui-p-r-2">{{
-            $t('common.skill')
-          }}</mdui-checkbox>
+          <mdui-checkbox v-model="pSetting.skills.normal[0]" class="mdui-p-r-2">
+            <span>{{ $t('common.skill') }}</span>
+            <span
+              v-if="curSklandCultivate.mainSkillLevel"
+              class="mdui-text-color-theme-secondary mdui-m-l-1"
+              >({{ curSklandCultivate.mainSkillLevel }})</span
+            >
+          </mdui-checkbox>
           <div class="num-select inline-block">
             <mdui-select-num
               v-model="pSetting.skills.normal[1]"
@@ -57,10 +67,16 @@
                 v-model="pSetting.skills.elite[i][0]"
                 class="skill-elite-cb mdui-p-r-2"
                 :custom-slot="true"
-                ><div class="mdui-text-truncate">{{
-                  $t(`skill.${skill.name}`)
-                }}</div></mdui-checkbox
               >
+                <div class="mdui-valign flex-nowrap no-wrap of-hidden">
+                  <span class="mdui-text-truncate">{{ $t(`skill.${skill.name}`) }}</span>
+                  <span
+                    v-if="curSklandCultivate.skills"
+                    class="mdui-text-color-theme-secondary mdui-m-l-1"
+                    >({{ curSklandCultivate.skills[skill.name] }})</span
+                  >
+                </div>
+              </mdui-checkbox>
               <DataImg
                 class="skill-icon mdui-shadow-4"
                 type="skill"
@@ -110,8 +126,16 @@
                   val =>
                     !$root.isReleasedUniequip(id) && !val && $nextTick($refs.dialog.handleUpdate)
                 "
-                >{{ $t(`uniequip.${id}`) }}</mdui-checkbox
               >
+                <div class="mdui-valign flex-nowrap no-wrap of-hidden">
+                  <span class="mdui-text-truncate">{{ $t(`uniequip.${id}`) }}</span>
+                  <span
+                    v-if="curSklandCultivate.equips"
+                    class="mdui-text-color-theme-secondary mdui-m-l-1"
+                    >({{ curSklandCultivate.equips[id] }})</span
+                  >
+                </div>
+              </mdui-checkbox>
               <div class="uniequip-icon no-pe mdui-shadow-4">
                 <DataImg
                   class="uniequip-icon-img"
@@ -188,9 +212,10 @@
 
 <script>
 import { defineComponent, markRaw } from 'vue';
-import { mapState } from 'pinia';
+import { mapState, mapActions } from 'pinia';
 import { debounce } from 'lodash';
 import { useDataStore } from '@/store/data';
+import { useSklandStore } from '@/store/skland';
 import DataImg from '@/components/DataImg.vue';
 
 const offsetUniequipIcons = new Set([
@@ -233,6 +258,10 @@ export default defineComponent({
   }),
   computed: {
     ...mapState(useDataStore, ['characterTable', 'uniequip']),
+    ...mapState(useSklandStore, {
+      sklandCredValid: 'credValid',
+      sklandCultivateCharacters: 'cultivateCharacters',
+    }),
     selectedPresetName() {
       return this.parent().selectedPresetName;
     },
@@ -245,6 +274,9 @@ export default defineComponent({
     presetUniequip() {
       return this.parent().presetUniequip;
     },
+    curSklandCultivate() {
+      return this.sklandCultivateCharacters[this.selectedPresetName] || {};
+    },
   },
   created() {
     this.updateOverflowDebounce = markRaw(debounce(this.updateOverflow, 300));
@@ -253,9 +285,11 @@ export default defineComponent({
     this.unbindEvents();
   },
   methods: {
+    ...mapActions(useSklandStore, ['updateSklandCultivateIfExpired', 'getCultivateCharLevelText']),
     open() {
       this.overflow = 'hidden';
       this.$refs.dialog.open();
+      if (this.$root.supportSkland) this.updateSklandCultivateIfExpired();
     },
     updateOverflow() {
       const dialogRect = this.$refs.dialog.$el.getBoundingClientRect();
diff --git a/src/data/changelog.json b/src/data/changelog.json
index 72a413ca..8a25fc4b 100644
--- a/src/data/changelog.json
+++ b/src/data/changelog.json
@@ -1,4 +1,8 @@
 [
+  {
+    "time": "2024-07-05",
+    "changes": ["【精英材料计算】预设支持显示当前干员练度（森空岛）"]
+  },
   {
     "time": "2024-06-28",
     "changes": [
diff --git a/src/main.js b/src/main.js
index 877ca488..262edb1c 100644
--- a/src/main.js
+++ b/src/main.js
@@ -192,6 +192,9 @@ new Vue({
       // 分级模组和黑键同期实装
       return this.isReleasedChar('4046_ebnhlz');
     },
+    supportSkland() {
+      return this.serverCN;
+    },
   },
   methods: {
     ...mapActions(useHotUpdateStore, ['initData']),
diff --git a/src/store/materialValue.js b/src/store/materialValue.js
index 1ffcc1d9..9486658d 100644
--- a/src/store/materialValue.js
+++ b/src/store/materialValue.js
@@ -17,9 +17,10 @@ export const useMaterialValueStore = defineStore('materialValue', () => {
 
   let fetchFailed = 0;
 
+  // TODO 等一图流恢复
   const loadData = async (force = false) => {
     if (force) {
-      fetchData();
+      // fetchData();
       return;
     }
 
@@ -32,10 +33,11 @@ export const useMaterialValueStore = defineStore('materialValue', () => {
     }
 
     if (!dataReady.value || dataExpired.value) {
-      fetchData();
+      // fetchData();
     }
   };
 
+  // eslint-disable-next-line no-unused-vars
   const fetchData = async () => {
     if (fetchFailed >= MAX_FETCH_TRY) return;
     try {
diff --git a/src/store/skland.js b/src/store/skland.js
index 20527b3f..5847481d 100644
--- a/src/store/skland.js
+++ b/src/store/skland.js
@@ -1,7 +1,42 @@
+import _ from 'lodash';
 import { useNamespacedLocalStorage } from '@/utils/NamespacedLocalStorage';
 import { fetchSkland } from '@/utils/skland';
 import { defineStore } from 'pinia';
-import { computed, watch } from 'vue';
+import { computed, watch, shallowRef } from 'vue';
+
+const cnNumTextMap = ['零', '一', '二'];
+
+const idStandardization = id => id.replace(/\[([0-9]+?)\]/g, '_$1');
+
+const handleCharactersCultivateData = list => {
+  let amiya;
+  const otherAmiya = [];
+  const mapHandleKeys = ['skills', 'equips'];
+  const newList = list.filter(char => {
+    char.id = char.id.replace(/^char_/, '');
+    mapHandleKeys.forEach(key => {
+      if (!char[key]) {
+        char[key] = {};
+        return;
+      }
+      char[key] = _.fromPairs(char[key].map(({ id, level }) => [idStandardization(id), level]));
+    });
+    if (char.id === '002_amiya') amiya = char;
+    else if (/_amiya\d+$/.test(char.id)) {
+      otherAmiya.push(char);
+      return false;
+    }
+    return true;
+  });
+  if (amiya && otherAmiya.length) {
+    otherAmiya.forEach(char => {
+      mapHandleKeys.forEach(key => {
+        Object.assign(amiya[key], char[key]);
+      });
+    });
+  }
+  return _.keyBy(newList, 'id');
+};
 
 export const useSklandStore = defineStore('skland', () => {
   const storage = useNamespacedLocalStorage('skland', {
@@ -12,12 +47,16 @@ export const useSklandStore = defineStore('skland', () => {
   });
   const { cred, token, uid } = storage;
 
+  let cultivateLastFetch = 0;
+  const cultivateCharacters = shallowRef({});
+
   const credValid = computed(() => cred.value.length === 32);
 
   watch(cred, () => {
     if (!credValid.value) return;
     token.value = '';
     uid.value = '';
+    cultivateCharacters.value = {};
   });
 
   const refreshToken = async () => {
@@ -34,6 +73,7 @@ export const useSklandStore = defineStore('skland', () => {
 
   const fetchSklandCultivate = async () => {
     if (!credValid.value) return;
+    cultivateLastFetch = Date.now();
     await refreshToken();
     await fetchSklandBinding();
     const data = await fetchSkland(
@@ -41,6 +81,7 @@ export const useSklandStore = defineStore('skland', () => {
       cred.value,
       token.value,
     );
+    cultivateCharacters.value = handleCharactersCultivateData(data.characters);
     return data.items;
   };
 
@@ -54,5 +95,41 @@ export const useSklandStore = defineStore('skland', () => {
     uid.value = newUid;
   };
 
-  return { cred, credValid, fetchSklandCultivate };
+  const updateSklandCultivateIfExpired = async () => {
+    if (Date.now() - cultivateLastFetch < 1800e3 && cultivateCharacters.value) return;
+    await fetchSklandCultivate();
+  };
+
+  const getCultivateCharLevelText = id => {
+    const char = cultivateCharacters.value[id];
+    if (!char) return '';
+    return char.evolvePhase
+      ? `精${cnNumTextMap[char.evolvePhase]}${char.level}级`
+      : `${char.level}级`;
+  };
+
+  const getPresetItemCultivateText = id => {
+    const char = cultivateCharacters.value[id];
+    if (!char) return '';
+    const skillValues = Object.values(char.skills);
+    const equipValues = Object.values(char.equips);
+    const parts = [
+      getCultivateCharLevelText(id),
+      `技${char.mainSkillLevel}`,
+      _.sum(skillValues) ? `专${skillValues.join('')}` : null,
+      _.sum(equipValues) ? `模${equipValues.join('')}` : null,
+      `潜${char.potentialRank + 1}`,
+    ];
+    return parts.filter(_.identity).join('/');
+  };
+
+  return {
+    cred,
+    credValid,
+    cultivateCharacters,
+    fetchSklandCultivate,
+    updateSklandCultivateIfExpired,
+    getCultivateCharLevelText,
+    getPresetItemCultivateText,
+  };
 });
diff --git a/src/views/Material/index.js b/src/views/Material/index.js
index 34e6ed86..f713c595 100644
--- a/src/views/Material/index.js
+++ b/src/views/Material/index.js
@@ -278,7 +278,10 @@ export default defineComponent({
       },
     }),
     ...mapState(usePenguinDataStore, ['penguinData', 'curPenguinDataServer']),
-    ...mapState(useSklandStore, { sklandCredValid: 'credValid' }),
+    ...mapState(useSklandStore, {
+      sklandCredValid: 'credValid',
+      sklandCultivateCharacters: 'cultivateCharacters',
+    }),
     syncCode: {
       get() {
         return this.setting[`syncCodeV${SYNC_CODE_VER}`];
@@ -624,10 +627,11 @@ export default defineComponent({
         }
         return 0;
       });
-      return _.map(result, o => ({ name: o.name, text: this.$t(`character.${o.name}`) })).slice(
-        0,
-        10,
-      );
+      return _.map(result.slice(0, 10), o => ({
+        name: o.name,
+        text: this.$t(`character.${o.name}`),
+        cultivateText: this.$root.supportSkland ? this.getPresetItemCultivateText(o.name) : null,
+      }));
     },
     presetUniequip() {
       return this.sp?.uniequip.filter(
@@ -956,7 +960,11 @@ export default defineComponent({
     ...mapActions(useDataStore, ['getStageTable']),
     ...mapActions(usePenguinDataStore, ['loadPenguinData', 'fetchPenguinData']),
     ...mapActions(useMaterialValueStore, ['loadMaterialValueData', 'calcStageEfficiency']),
-    ...mapActions(useSklandStore, ['fetchSklandCultivate']),
+    ...mapActions(useSklandStore, [
+      'fetchSklandCultivate',
+      'updateSklandCultivateIfExpired',
+      'getPresetItemCultivateText',
+    ]),
     isPlannerUnavailableItem(id) {
       return (
         this.materialTable[id]?.type === MaterialTypeEnum.MOD_TOKEN ||
@@ -1787,6 +1795,10 @@ export default defineComponent({
         this.$snackbar(this.$t('common.copied'));
       }
     },
+    async updateSklandCultivateIfSupport() {
+      if (!this.$root.supportSkland) return;
+      await this.updateSklandCultivateIfExpired();
+    },
   },
   created() {
     this.throttleAutoSyncUpload = _.throttle(() => this.cloudSaveData(true), 5000, {
diff --git a/src/views/Material/index.scss b/src/views/Material/index.scss
index 8347eb87..ed902a1a 100644
--- a/src/views/Material/index.scss
+++ b/src/views/Material/index.scss
@@ -88,6 +88,9 @@ $highlight-colors-dark: #eee, #e6ee9c, #90caf9, #b39ddb, #fff59d;
   .preset-list > div:not(:first-child) {
     margin-top: 8px;
   }
+  .preset-cultivate-text {
+    opacity: 0.65;
+  }
   .elite-cb-list {
     display: flex;
     .mdui-checkbox {
diff --git a/src/views/Material/index.vue b/src/views/Material/index.vue
index 5c69ad77..67c480ed 100644
--- a/src/views/Material/index.vue
+++ b/src/views/Material/index.vue
@@ -86,6 +86,7 @@
                   :class="{ empty: preset.length === 0 }"
                   @tags-changed="usePreset"
                   @before-adding-tag="showPresetBeforeAddTag"
+                  @focus="updateSklandCultivateIfSupport"
                 >
                   <div
                     slot="autocomplete-item"
@@ -99,9 +100,16 @@
                         :key="`head-${props.item.text}`"
                         :name="props.item.name"
                     /></div>
-                    <div class="mdui-list-item-content mdui-p-y-0 mdui-m-l-1">{{
-                      props.item.text
-                    }}</div>
+                    <div
+                      class="mdui-list-item-content mdui-p-y-0 mdui-m-l-1 mdui-valign flex-nowrap no-wrap of-hidden"
+                    >
+                      <span class="mdui-text-truncate">{{ props.item.text }}</span>
+                      <small
+                        v-if="props.item.cultivateText"
+                        class="preset-cultivate-text mdui-text-truncate mdui-m-l-auto mdui-p-l-1"
+                        >{{ props.item.cultivateText }}</small
+                      >
+                    </div>
                   </div>
                   <span
                     class="no-sl"
@@ -222,13 +230,15 @@
                 >
                 <div class="btn-group">
                   <button
-                    class="mdui-btn mdui-ripple mdui-btn-dense tag-btn btn-group-left"
+                    class="mdui-btn mdui-ripple mdui-btn-dense tag-btn"
+                    :class="{ 'btn-group-left': $root.supportSkland }"
                     v-theme-class="$root.color.blueBtn"
                     mdui-menu="{ target: '#material-import-menu', covered: false }"
                     ><i class="mdui-icon material-icons mdui-icon-left">archive</i
                     >{{ $t('common.import') }}</button
                   >
                   <button
+                    v-if="$root.supportSkland"
                     class="mdui-btn mdui-ripple mdui-btn-dense tag-btn btn-group-right no-grow"
                     v-theme-class="$root.color.blueBtn"
                     @click="$refs.sklandSettingDialog.open()"
@@ -245,7 +255,7 @@
                         $t('cultivate.panel.button.importFromJSON')
                       }}</a>
                     </li>
-                    <li v-if="$root.serverCN" class="mdui-menu-item mdui-ripple">
+                    <li v-if="$root.supportSkland" class="mdui-menu-item mdui-ripple">
                       <a class="mdui-ripple pointer" @click="importFromSkland">{{
                         $t('cultivate.panel.button.importFromSkland')
                       }}</a>