Files
core/hwe/ts/PageHistory.vue
T
2022-04-20 20:59:10 +09:00

131 lines
3.4 KiB
Vue

<template>
<div>연감</div>
<div v-if="history">
있음
<div v-for="date of generateYearMonthList()" :key="date.yearMonth" @click="queryYearMonth = date.yearMonth">
{{ date.year }} {{ date.month }} {{ date.queried ? `선택` : "" }} {{ date.current ? "현재" : "" }}
</div>
<div>
<template v-for="(item, idx) in history.global_action" :key="idx">
<!-- eslint-disable-next-line vue/no-v-html -->
<span v-html="formatLog(item)"></span>
<br />
</template>
</div>
<div>
<template v-for="(item, idx) in history.global_history" :key="idx">
<!-- eslint-disable-next-line vue/no-v-html -->
<span v-html="formatLog(item)"></span>
<br />
</template>
</div>
</div>
</template>
<script lang="ts">
declare const staticValues: {
fisrtYearMonth: number;
lastYearMonth: number;
currentYearMonth: number;
serverNick: string;
serverID: string;
};
declare const query: {
yearMonth: number | null;
serverID: string;
};
</script>
<script lang="ts" setup>
import { onMounted, ref, watch } from "vue";
import type { HistoryObj } from "./defs/API/Global";
import { SammoAPI } from "./SammoAPI";
import { joinYearMonth } from "./util/joinYearMonth";
import { parseYearMonth } from "./util/parseYearMonth";
import { formatLog } from "./utilGame/formatLog";
const queryYearMonth = ref<number>();
const queryServerID = query.serverID;
const lastYearMonth = ref(staticValues.lastYearMonth);
const firstYearMonth = ref(staticValues.fisrtYearMonth);
const currentYearMonth = ref(staticValues.currentYearMonth);
const history = ref<HistoryObj>();
function* generateYearMonthList(): Generator<{
year: number;
month: number;
yearMonth: number;
current?: true;
queried: boolean;
}> {
let yearMonth = firstYearMonth.value;
while (yearMonth <= lastYearMonth.value) {
const [year, month] = parseYearMonth(yearMonth);
yield {
year,
month,
yearMonth,
queried: queryYearMonth.value === yearMonth,
};
yearMonth++;
}
const [year, month] = parseYearMonth(yearMonth);
yield {
year,
month,
yearMonth,
current: true,
queried: queryYearMonth.value === yearMonth,
};
}
watch(queryYearMonth, async (yearMonth) => {
if (yearMonth === undefined) {
return;
}
if (yearMonth > lastYearMonth.value) {
try {
const result = await SammoAPI.Global.GetCurrentHistory();
history.value = result.data;
console.log(result);
const newLastYearMonth = joinYearMonth(result.data.year, result.data.month) - 1;
if (newLastYearMonth > lastYearMonth.value) {
lastYearMonth.value = newLastYearMonth;
currentYearMonth.value = newLastYearMonth + 1;
}
} catch (e) {
console.error(e);
return;
}
return;
}
const [year, month] = parseYearMonth(yearMonth);
try {
const result = await SammoAPI.Global.GetHistory[queryServerID][year][month]();
history.value = result.data;
console.log(result);
} catch (e) {
console.error(e);
return;
}
});
onMounted(() => {
queryYearMonth.value = (() => {
if (query.yearMonth === null) {
return staticValues.currentYearMonth;
}
if (query.yearMonth > staticValues.lastYearMonth + 1) {
return staticValues.currentYearMonth;
}
if (query.yearMonth < staticValues.fisrtYearMonth) {
return staticValues.currentYearMonth;
}
return query.yearMonth;
})();
});
</script>