feat(WIP): processing 숙련전환, 불가침제의

hwe/ts/processing/General/che_숙련전환.vue

@@ -0,0 +1,220 @@
+<template>
+  <TopBackBar :title="commandName" type="chief" />
+  <div class="bg0">
+    <div>
+      본인의 특정 병종 숙련을 40% 줄이고, 줄어든 숙련 중 9/10(90%p)를 다른 병종
+      숙련으로 전환합니다.
+    </div>
+    <div class="row">
+      <div class="col-4 col-md-2">
+        감소 대상 숙련 :
+        <b-form-select v-model="srcArmTypeID">
+          <b-form-select-option
+            v-for="[armType, dexInfo] in dexFullInfo"
+            :key="armType"
+            :value="armType"
+            >{{ dexInfo.name }} (<span
+              :style="{ color: dexInfo.currentInfo.color }"
+              >{{ dexInfo.currentInfo.name }}</span>)</b-form-select-option
+          >
+        </b-form-select>
+      </div>
+      <div class="col-4 col-md-2">
+        전환 대상 숙련 :
+        <b-form-select v-model="destArmTypeID">
+          <b-form-select-option
+            v-for="[armType, dexInfo] in dexFullInfo"
+            :key="armType"
+            :value="armType"
+            >{{ dexInfo.name }} (<span
+              :style="{ color: dexInfo.currentInfo.color }"
+              >{{ dexInfo.currentInfo.name }}</span>)</b-form-select-option
+          >
+        </b-form-select>
+      </div>
+      <div class="col-4 col-md-2 d-grid">
+        <b-button @click="submit">{{ commandName }}</b-button>
+      </div>
+      <div :style="{
+        display:'grid',
+        gridTemplateColumns: '3ch 1ch 2ch 10ch 1ch 3ch 1ch 2ch 10ch 1ch'
+      }">
+        <div>{{dexFullInfo.get(srcArmTypeID).name}}</div>
+        <div class="text-end">[</div>
+        <div :style="`color:${dexFullInfo.get(srcArmTypeID).currentInfo.color}`">{{dexFullInfo.get(srcArmTypeID).currentInfo.name}}</div>
+        <div class="f_tnum text-end">{{convNumberFormat(dexFullInfo.get(srcArmTypeID).currentInfo.amount)}}</div>
+        <div>]</div>
+        <div class="text-center">→</div>
+        <div class="text-end">[</div>
+        <div :style="`color:${dexFullInfo.get(srcArmTypeID).decreasedInfo.color}`">{{dexFullInfo.get(srcArmTypeID).decreasedInfo.name}}</div>
+        <div class="f_tnum text-end">{{convNumberFormat(dexFullInfo.get(srcArmTypeID).decreasedInfo.amount)}}</div>
+        <div>]</div>
+      </div>
+      <div :style="{
+        display:'grid',
+        gridTemplateColumns: '3ch 1ch 2ch 10ch 1ch 3ch 1ch 2ch 10ch 1ch'
+      }">
+      <div>{{dexFullInfo.get(destArmTypeID).name}}</div>
+        <div class="text-end">[</div>
+        <template v-if="srcArmTypeID == destArmTypeID">
+          <div :style="`color:${dexFullInfo.get(destArmTypeID).decreasedInfo.color}`">{{dexFullInfo.get(destArmTypeID).decreasedInfo.name}}</div>
+          <div class="f_tnum text-end">{{convNumberFormat(dexFullInfo.get(destArmTypeID).decreasedInfo.amount)}}</div>
+        </template>
+        <template v-else>
+          <div :style="`color:${dexFullInfo.get(destArmTypeID).currentInfo.color}`">{{dexFullInfo.get(destArmTypeID).currentInfo.name}}</div>
+          <div class="f_tnum text-end">{{convNumberFormat(dexFullInfo.get(destArmTypeID).currentInfo.amount)}}</div>
+        </template>
+        <div>]</div>
+        <div class="text-center">→</div>
+        <div class="text-end">[</div>
+        <div :style="`color:${dexFullInfo.get(destArmTypeID).afterInfo.get(srcArmTypeID).color}`">{{dexFullInfo.get(destArmTypeID).afterInfo.get(srcArmTypeID).name}}</div>
+        <div class="f_tnum text-end">{{convNumberFormat(dexFullInfo.get(destArmTypeID).afterInfo.get(srcArmTypeID).amount)}}</div>
+        <div>]</div>
+      </div>
+
+
+    </div>
+  </div>
+  <BottomBar :title="commandName" />
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from "vue";
+import { unwrap } from "@/util/unwrap";
+import { Args } from "@/processing/args";
+import TopBackBar from "@/components/TopBackBar.vue";
+import BottomBar from "@/components/BottomBar.vue";
+
+declare const commandName: string;
+
+type dexInfo = {
+  amount: number;
+  color: string;
+  name: string;
+};
+
+declare const procRes: {
+  ownDexList: {
+    armType: number;
+    name: string;
+    amount: number;
+  }[];
+  dexLevelList: dexInfo[];
+  decreaseCoeff: number;
+  convertCoeff: number;
+};
+
+export default defineComponent({
+  components: {
+    TopBackBar,
+    BottomBar,
+  },
+  setup() {
+    const srcArmTypeID = ref(procRes.ownDexList[0].armType);
+    const destArmTypeID = ref(procRes.ownDexList[0].armType);
+
+    async function submit(e: Event) {
+      const event = new CustomEvent<Args>("customSubmit", {
+        detail: {
+          srcArmType: srcArmTypeID.value,
+          destArmType: destArmTypeID.value,
+        },
+      });
+      unwrap(e.target).dispatchEvent(event);
+    }
+
+    function getDexCall(dex: number): { color: string; name: string } {
+      if (dex < 0) {
+        throw `올바르지 않은 수치: ${dex}`;
+      }
+
+      let color = "";
+      let name = "";
+      for (const nextDexLevel of procRes.dexLevelList) {
+        if (dex < nextDexLevel.amount) {
+          break;
+        }
+        color = nextDexLevel.color;
+        name = nextDexLevel.name;
+      }
+
+      return {
+        color,
+        name,
+      };
+    }
+
+    const dexFullInfo = new Map<
+      number,
+      {
+        armType: number;
+        name: string;
+        amount: number;
+        decresedAmount: number;
+        currentInfo: dexInfo;
+        decreasedInfo: dexInfo;
+        afterInfo: Map<number, dexInfo>;
+      }
+    >();
+
+    for (const dexItem of procRes.ownDexList) {
+      const amount = dexItem.amount;
+      const currentInfo = { ...getDexCall(amount), amount };
+
+      const decresedAmount = amount * procRes.decreaseCoeff;
+      const decresedAfterAmount = amount - decresedAmount;
+      const decreasedInfo = {
+        ...getDexCall(decresedAfterAmount),
+        amount: decresedAfterAmount,
+      };
+
+      dexFullInfo.set(dexItem.armType, {
+        ...dexItem,
+        decresedAmount,
+        currentInfo,
+        decreasedInfo,
+        afterInfo: new Map(),
+      });
+    }
+
+    for (const [armType, dexItem] of dexFullInfo.entries()) {
+      for (const [fromArmType, fromDexItem] of dexFullInfo.entries()) {
+        let afterAmount = fromDexItem.decresedAmount * procRes.convertCoeff;
+        if (armType != fromArmType) {
+          afterAmount += dexItem.amount;
+        } else {
+          afterAmount += dexItem.decresedAmount;
+        }
+
+        dexItem.afterInfo.set(fromArmType, {
+          amount: afterAmount,
+          ...getDexCall(afterAmount),
+        });
+      }
+    }
+
+    function convDexFormat(value: dexInfo): string {
+      const amount = convNumberFormat(value.amount);
+      return `<span class="f_tnum" style="color:${value.color}">${value.name}</span>,${"\xa0".repeat(Math.max(0, 3 - value.name.length))} ${amount}`;
+    }
+
+    function convNumberFormat(value: number): string {
+      return Math.floor(value).toLocaleString();
+    }
+
+    console.log(dexFullInfo);
+
+    return {
+      ...procRes,
+      srcArmTypeID,
+      destArmTypeID,
+      dexFullInfo,
+      getDexCall,
+      commandName,
+      submit,
+      convDexFormat,
+      convNumberFormat,
+    };
+  },
+});
+</script>

hwe/ts/processing/General/index.ts

@@ -2,6 +2,7 @@ import { default as che_건국 } from "./che_건국.vue";
 import { default as che_군량매매 } from "./che_군량매매.vue";
 import { default as che_등용 } from "./che_등용.vue";
 import { default as che_선양 } from "./che_선양.vue";
+import { default as che_숙련전환 } from "./che_숙련전환.vue";
 import { default as che_임관 } from "./che_임관.vue";
 import { default as che_장수대상임관 } from "./che_장수대상임관.vue";
 import { default as che_징병 } from "./che_징병.vue";
@@ -21,6 +22,7 @@ export const commandMap: Record<string, typeof ProcessCity> = {
     che_모병: che_징병,
     che_선동: ProcessCity,
     che_선양,
+    che_숙련전환,
     che_이동: ProcessCity,
     che_임관,
     che_장수대상임관,
@@ -36,5 +38,5 @@ export const commandMap: Record<string, typeof ProcessCity> = {
 
 /*
 - 항목들
-고유 양식 - 숙련전환, 장비매매
+고유 양식 - 장비매매
 */

hwe/ts/processing/Nation/che_불가침제의.vue

@@ -0,0 +1,132 @@
+<template>
+  <TopBackBar :title="commandName" type="chief" />
+  <div class="bg0">
+    <MapLegacyTemplate
+      :isDetailMap="false"
+      :clickableAll="true"
+      :neutralView="true"
+      :useCachedMap="true"
+      :mapTheme="mapTheme"
+      v-model="selectedCityObj"
+    />
+
+    <div>
+      타국에게 불가침을 제의합니다.<br />
+      제의할 국가를 목록에서 선택하세요.<br />
+      불가침 기한 다음 달부터 선포 가능합니다.<br />
+      현재 제의가 불가능한 국가는
+      <span style="color: red">붉은색</span>으로 표시됩니다.<br />
+    </div>
+    <div class="row">
+      <div class="col-6 col-md-3">
+        국가 :
+        <SelectNation :nations="nationList" v-model="selectedNationID" />
+      </div>
+      <div class="col-6 col-md-3">
+        기간 :
+        <div class="input-group"></div>
+        <div class="input-group">
+          <b-form-select v-model="selectedYear"
+            ><b-form-select-option
+              v-for="yearP in maxYear - minYear + 1"
+              :key="yearP"
+              :value="yearP + minYear - 1"
+              >{{ yearP + minYear - 1 }}</b-form-select-option
+            >
+          </b-form-select>
+          <span class="input-group-text">년</span>
+          <b-form-select v-model="selectedMonth"
+            ><b-form-select-option v-for="month in 12" :key="month" :value="month">{{
+              month
+            }}</b-form-select-option>
+          </b-form-select>
+          <span class="input-group-text">월</span>
+        </div>
+      </div>
+      <div class="col-4 col-md-2 d-grid">
+        <b-button @click="submit">{{ commandName }}</b-button>
+      </div>
+    </div>
+  </div>
+  <BottomBar :title="commandName" />
+</template>
+
+<script lang="ts">
+import MapLegacyTemplate, {
+  MapCityParsed,
+} from "@/components/MapLegacyTemplate.vue";
+import SelectNation from "@/processing/SelectNation.vue";
+import { defineComponent, ref } from "vue";
+import { unwrap } from "@/util/unwrap";
+import { Args } from "@/processing/args";
+import TopBackBar from "@/components/TopBackBar.vue";
+import BottomBar from "@/components/BottomBar.vue";
+import { procNationItem, procNationList } from "../processingRes";
+declare const mapTheme: string;
+declare const commandName: string;
+
+declare const procRes: {
+  nationList: procNationList;
+  startYear: number;
+  minYear: number;
+  maxYear: number;
+  month: number;
+};
+
+export default defineComponent({
+  components: {
+    MapLegacyTemplate,
+    SelectNation,
+    TopBackBar,
+    BottomBar,
+  },
+  watch: {
+    selectedCityObj(city: MapCityParsed) {
+      if (!city.nationID) {
+        return;
+      }
+      this.selectedNationID = city.nationID;
+    },
+  },
+  setup() {
+    const nationList = new Map<number, procNationItem>();
+    for (const nationItem of procRes.nationList) {
+      nationList.set(nationItem.id, nationItem);
+    }
+
+    const selectedNationID = ref(procRes.nationList[0].id);
+    const selectedCityObj = ref(); //mapping용
+
+    const selectedYear = ref(procRes.minYear);
+    const selectedMonth = ref(procRes.month);
+
+    function selectedNation(nationID: number) {
+      selectedNationID.value = nationID;
+    }
+
+    async function submit(e: Event) {
+      const event = new CustomEvent<Args>("customSubmit", {
+        detail: {
+          destNationID: selectedNationID.value,
+          year: selectedYear.value,
+          month: selectedMonth.value,
+        },
+      });
+      unwrap(e.target).dispatchEvent(event);
+    }
+
+    return {
+      ...procRes,
+      selectedYear,
+      selectedMonth,
+      mapTheme: ref(mapTheme),
+      nationList: ref(nationList),
+      selectedCityObj,
+      selectedNationID,
+      commandName,
+      selectedNation,
+      submit,
+    };
+  },
+});
+</script>

hwe/ts/processing/Nation/index.ts

@@ -1,6 +1,7 @@
 import { default as che_국기변경 } from "./che_국기변경.vue";
 import { default as che_국호변경 } from "./che_국호변경.vue";
 import { default as che_물자원조 } from "./che_물자원조.vue";
+import { default as che_불가침제의 } from "./che_불가침제의.vue";
 import { default as che_피장파장 } from "./che_피장파장.vue";
 
 import { default as ProcessNation } from "../ProcessNation.vue";
@@ -16,6 +17,7 @@ export const commandMap: Record<string, typeof ProcessNation> = {
     che_물자원조,
     che_발령: ProcessGeneralCity,
     che_백성동원: ProcessCity,
+    che_불가침제의,
     che_불가침파기제의: ProcessNation,
     che_선전포고: ProcessNation,
     che_수몰: ProcessCity,