88 lines
3.7 KiB
Vue
88 lines
3.7 KiB
Vue
<script setup lang="ts">
|
|
import MainLayout from "@/Layouts/MainLayout.vue";
|
|
import {Achievement, Flight, Region, User} from "@/Types/types";
|
|
import Panel from "@/Components/FlightsGoneBy/Panels/Panel.vue";
|
|
import PanelHeader from "@/Components/FlightsGoneBy/Panels/PanelHeader.vue";
|
|
import {computed} from "vue";
|
|
import PanelSubHeader from "@/Components/FlightsGoneBy/Panels/PanelSubHeader.vue";
|
|
|
|
import FlightRegionTable from "@/Components/FlightsGoneBy/FlightRegionTable.vue";
|
|
import {useRegionFlights} from "@/Composables/useRegionFlights";
|
|
import China from "@/Components/Maps/China.vue";
|
|
import RegionLegend from "@/Components/FlightsGoneBy/Panels/RegionLegend.vue";
|
|
|
|
|
|
defineOptions({ inheritAttrs: false })
|
|
const props = defineProps<{
|
|
achievement: Achievement
|
|
user: User
|
|
isFollowing: boolean
|
|
flights: Flight[]
|
|
regions: Region[]
|
|
}>()
|
|
|
|
|
|
const countryCode = 'CN'
|
|
const stateLocalCodes = ['11','12', '13', '14', '15', '21', '22', '23', '31', '32', '33', '34', '35', '36', '37', '41', '42', '43', '44', '45', '46', '50', '51', '52', '53', '54', '61', '62', '63', '64', '65',]
|
|
|
|
const { flightsByRegion, visitedRegions, regionNames } = useRegionFlights(
|
|
computed(() => props.flights),
|
|
stateLocalCodes,
|
|
countryCode,
|
|
computed(() => props.regions)
|
|
)
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<Panel>
|
|
<PanelHeader centered>The Challenge</PanelHeader>
|
|
<p>
|
|
Either take off or land from an airport in each Chinese Province, Autonomous Region or direct-administered municipality.
|
|
</p>
|
|
</Panel>
|
|
<Panel style="display:flex; flex-direction: column; align-items: center; justify-content: center;">
|
|
<PanelHeader centered>Progress</PanelHeader>
|
|
<China :visitedRegions="visitedRegions" style="width: 100%;"/>
|
|
<RegionLegend :regionNames="regionNames" :visitedRegions="visitedRegions" :stateLocalCodes="stateLocalCodes"/>
|
|
<br/>
|
|
<PanelHeader center>Flights By Region</PanelHeader>
|
|
<FlightRegionTable
|
|
:regionCodes="stateLocalCodes"
|
|
:regionNames="regionNames"
|
|
:flightsByRegion="flightsByRegion"
|
|
/>
|
|
</Panel>
|
|
<Panel>
|
|
<PanelHeader centered>Requirements</PanelHeader>
|
|
<p>
|
|
China has 3 different types of administrative regions that are counted in this challenge.
|
|
</p>
|
|
<dl>
|
|
<dt>Province</dt>
|
|
<dd>There are 22 provinces in China.</dd>
|
|
<dt>Autonomous Regions</dt>
|
|
<dd>Not quite provinces as they have a bit more freedom. There are 5 autonomous regions to travel to for this travel.</dd>
|
|
<dt>Direct-Administered Municipality</dt>
|
|
<dd>There are 4 cities big enough to be their own subdivision - Beijing, Chongqing, Shanghai and Tianjin</dd>
|
|
</dl>
|
|
<p>
|
|
For this challenge, the regions are defined as by what would count as a domestic flight in China. Flights to Taiwan and the Special Administrative Regions of Hong Kong and Macau
|
|
do not count towards this challenge as China treats them as international flights. Disputed regions are also not counted.
|
|
</p>
|
|
</Panel>
|
|
<Panel>
|
|
<PanelHeader centered>Difficulty</PanelHeader>
|
|
<p>
|
|
China is very well connected by air, so for the most part getting to a new region is as simple as booking a flight. Basically all regions have multiple airports
|
|
that are well connected to many other regions.
|
|
</p>
|
|
<p>
|
|
The difficulty lies in the number of regions to get to, as well as the extremely good high speed rail in China - it often makes more sense to take the train then to fly.
|
|
</p>
|
|
</Panel>
|
|
</template>
|
|
|
|
<style scoped>
|
|
</style>
|