forked from devsam/core
- eslint에 prettier 조합 - prettierrc에 width 120, tabWidth 2 - gameStor->map_theme 제거 - map_theme, mapTheme를 GameConst::$mapName으로 대체 - eslint에서 vue/vue3-essential 대신 vue3-recommended 적용 - vue/max-attributes-per-line 완화 - vue/v-on-event-hyphenation 해제 - vue/attribute-hyphenation 해제 - 일부 tsc import type warning 해결 - 일부 vue template type warning 해결 - 일부 vue SFC를 script setup으로 변경 - TipTap - TopBackBar - BottomBackBar - BoardArticle - ProcessCity
40 lines
987 B
Vue
40 lines
987 B
Vue
<template>
|
|
<div v-for="(cityList, distance) in distanceList" :key="distance">
|
|
{{ distance }}칸 떨어진 도시:
|
|
<template v-for="(cityID, key) in cityList" :key="key">
|
|
<template v-if="key !== 0"> , </template>
|
|
<a
|
|
:style="{ color: colorMap[distance as keyof typeof colorMap] ?? undefined, textDecoration:'underline' }"
|
|
@click="$emit('selected', cityID)"
|
|
>{{ citiesMap.get(cityID)?.name }}</a
|
|
>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
<script lang="ts">
|
|
import { defineComponent, type PropType } from "vue";
|
|
|
|
export default defineComponent({
|
|
props: {
|
|
distanceList: {
|
|
type: Object as PropType<Record<number, number[]>>,
|
|
required: true,
|
|
},
|
|
citiesMap: {
|
|
type: Object as PropType<Map<number, { name: string }>>,
|
|
required: true,
|
|
},
|
|
},
|
|
emits: ["selected"],
|
|
data() {
|
|
return {
|
|
colorMap: {
|
|
1: "magenta",
|
|
2: "orange",
|
|
3: "yellow",
|
|
},
|
|
};
|
|
},
|
|
});
|
|
</script>
|