@movvjs/svelte-schedule-view 0.2.4 → 0.2.6-beta-1

package/src/lib/schedule-view/BookingInfo.svelte

@@ -7,7 +7,7 @@
 	import { t } from '$lib/i18n'
 	import { env } from '$lib/store/env'
 
-	import { BookingServiceType, FileType } from '$scheduleView/types'
+	import { BookingServiceType, FileType, type Flight } from '$scheduleView/types'
 	import { isEdit } from '$scheduleView/Schedule.svelte'
 	import { getCarName } from '$scheduleView/utils'
 	import { PhoneNumberBiz } from '$scheduleView/biz'
@@ -21,7 +21,7 @@
 	import FileUploader from '$scheduleView/FileUploader.svelte'
 	import CarSearch from '$scheduleView/CarSearch.svelte'
 
-	const { stdt, fullName, pax, extraServices, files, plans } = originalBooking
+	const { stdt, fullName, pax, extraServices, files, plans, isFlightService } = originalBooking
 	const {
 		withPreserveAndPreview,
 		hour,
@@ -52,9 +52,11 @@
 		texts.push(`${$t('booking.startTime')} : ${dayjs($stdt).format('HH:mm')}`)
 		texts.push(`${$t('booking.carInfo')} : ${getCarName($originalBooking.carInfo, { seat: true, seatPostfix: $t('booking.seater') })}`)
 		texts.push(`${$t('booking.pax')} : ${$pax}`)
-		texts.push(
-			`${$t('booking.flight')} : ${$originalBooking.flight?.name || '- -'} ${$originalBooking.flight?.selectType === 'AUTO' && $originalBooking.flight?.arrivalTerminal ? `/ ${$t('flight.terminal', { values: { number: $originalBooking.flight.arrivalTerminal } })}` : ''}`
-		)
+		if ($isFlightService) {
+			texts.push(
+				`${$t('booking.flight')} : ${$originalBooking.flight ? [$originalBooking.flight?.name, getTerminalName($originalBooking.flight)].filter(Boolean).join(' / ') || '- -' : '- -'}`
+			)
+		}
 		texts.push(`${$t('booking.guestName')} : ${$fullName}`)
 		// texts.push(`Email : ${$originalBooking.email || '- -'}`) // 제외
 		texts.push(`${$t('booking.telNo')} : ${PhoneNumberBiz.format($originalBooking.countryCode, $originalBooking.tel) || '- -'}`)
@@ -123,7 +125,22 @@
 		flightSearch$
 			.open({
 				dateTime: $copiedBooking.ymd,
-				iata: $copiedBooking.origin?.iata
+				airport: (() => {
+					if ($copiedBooking.serviceType === BookingServiceType.pickup) {
+						return {
+							iata: $copiedBooking.origin?.iata || null,
+							code: $copiedBooking.origin?.code || null
+						}
+					} else if ($copiedBooking.serviceType === BookingServiceType.sending) {
+						return {
+							iata: $copiedBooking.dest?.iata || null,
+							code: $copiedBooking.dest?.code || null
+						}
+					} else {
+						return null
+					}
+				})(),
+				terminalOnly: $copiedBooking.serviceType === BookingServiceType.sending
 			})
 			.then(flight => {
 				$copiedBooking.flight = flight
@@ -132,6 +149,25 @@
 				alert.open({ title: $t('alert.error'), text: e.message })
 			})
 	}
+
+	function getTerminalName(flight: Flight) {
+		if (!flight?.arrivalTerminal) return null
+
+		if (flight.selectType === 'AUTO') {
+			switch (flight.arrivalTerminal) {
+				case 'I':
+					return 'International'
+				case 'D':
+					return 'Domestic'
+				default:
+					return `Terminal ${flight.arrivalTerminal}`
+			}
+		} else if (flight.selectType === 'MANUAL') {
+			return flight.arrivalTerminal
+		} else {
+			return null
+		}
+	}
 </script>
 
 <Translation bind:this={translation$} />
@@ -189,17 +225,17 @@
 					</td>
 				</tr>
 
-				{#if $originalBooking.serviceType === BookingServiceType.pickup}
+				{#if $isFlightService}
 					<tr>
 						<th>{$t('booking.flight')}</th>
 						<td>
 							{#if !$isEdit}
 								{#if $originalBooking.flight}
 									<p class="indie_value-text flight">
-										<b>{$originalBooking.flight.name}</b>
-										{#if $originalBooking.flight.selectType === 'AUTO' && $originalBooking.flight.arrivalTerminal}
-											/ {$t('flight.terminal', { values: { number: $originalBooking.flight.arrivalTerminal } })}
-										{/if}
+										{@html [$originalBooking.flight.name, getTerminalName($originalBooking.flight)]
+											.map((value, i) => (value ? (i === 0 ? `<b>${value}</b>` : value) : null))
+											.filter(Boolean)
+											.join(' / ')}
 									</p>
 									{#if $originalBooking.flight.selectType === 'MANUAL'}
 										<div class="indie_exclamation_mark_box sm black">
@@ -213,10 +249,10 @@
 								<!--  -->
 								{#if $copiedBooking.flight}
 									<p class="indie_value-text flight">
-										<b>{$copiedBooking.flight.name}</b>
-										{#if $copiedBooking.flight.selectType === 'AUTO' && $copiedBooking.flight.arrivalTerminal}
-											/ {$t('flight.terminal', { values: { number: $copiedBooking.flight.arrivalTerminal } })}
-										{/if}
+										{@html [$copiedBooking.flight.name, getTerminalName($copiedBooking.flight)]
+											.map((value, i) => (value ? (i === 0 ? `<b>${value}</b>` : value) : null))
+											.filter(Boolean)
+											.join(' / ')}
 									</p>
 									<button type="button" class="indie_btn_squre only refresh_black mgl10" on:click={() => openFlightSearch()}>다시선택</button>
 									{#if $copiedBooking.flight.selectType !== 'AUTO'}

package/src/lib/schedule-view/PlaceSearch.svelte

@@ -1,13 +1,36 @@
 <script lang="ts">
+	import center from '@turf/center'
+	import { points } from '@turf/helpers'
+
 	import { CommonAPI } from '$scheduleView/api'
 	import { loader } from '$scheduleView/components/loader'
 
 	import BaseSearchInput, { type SearchListItem } from '$scheduleView/BaseSearchInput.svelte'
+	import { copiedBooking } from './stores/booking'
 
 	export let placeholder = 'Title / Detailed address'
 	export let inputId: string
 	export let title: string // 적용된 대상의 제목
 
+	/**
+	 * 장소 검색시 중심좌표 = 모든 일정의 중심좌표
+	 */
+	const { coordinates } = copiedBooking
+	$: centerCoordinate = (() => {
+		if ($coordinates.length === 0) {
+			return null
+		} else {
+			try {
+				const features = points($coordinates.map(({ lng, lat }) => [lng, lat]))
+				const centerFeature = center(features)
+				const [lng, lat] = centerFeature?.geometry?.coordinates
+				return { lng, lat }
+			} catch (e) {
+				return null
+			}
+		}
+	})()
+
 	let list: SearchListItem[] = []
 
 	async function search(keyword: string) {
@@ -15,7 +38,7 @@
 
 		try {
 			loader.show()
-			const data = await CommonAPI.searchPlace(keyword)
+			const data = await CommonAPI.searchPlace(keyword, centerCoordinate)
 			list = data.map(item => ({
 				title: item.title,
 				subTitle: item.address,

package/src/lib/schedule-view/api/common/index.ts

@@ -3,6 +3,7 @@ import type { BookingLocation, TranslateLanguage } from '$scheduleView/types'
 import { get } from 'svelte/store'
 import type { PickupPointDTO } from './dto'
 import { env } from '$lib/store/env'
+import QS from 'qs'
 
 export class CommonAPI {
 	static async getPickupPoint(ppno: number): Promise<PickupPointDTO> {
@@ -89,17 +90,24 @@ export class CommonAPI {
 		}
 	}
 
-	static async searchPlace(keyword: string): Promise<BookingLocation[]> {
+	static async searchPlace(keyword: string, center: { lat: number; lng: number }): Promise<BookingLocation[]> {
 		const { target } = get(env)
+		const queryString = QS.stringify(
+			{
+				title: keyword,
+				...(center ? { lat: center.lat, lng: center.lng } : {})
+			},
+			{ skipNulls: true }
+		)
 		if (target === 'B2B') {
-			const { data } = await axios.get(`/booking/scheduleView/place?title=${keyword}`)
+			const { data } = await axios.get(`/booking/scheduleView/place?${queryString}`)
 			if (data.mode === false) {
 				throw new Error(data.msg || data.message || JSON.stringify(data))
 			} else {
 				return data.result
 			}
 		} else if (target === 'FMS' || target === 'MOVV') {
-			const { data } = await axios.get(`/common/v2/place?title=${keyword}`)
+			const { data } = await axios.get(`/common/v2/place?${queryString}`)
 			if (data.mode === false) {
 				throw new Error(data.msg || data.message || JSON.stringify(data))
 			} else {
@@ -109,4 +117,14 @@ export class CommonAPI {
 			throw Error('Invalid target')
 		}
 	}
+
+	static async getPoiTerminals(code: string): Promise<string[]> {
+		const { data } = await axios.get(`/common/poiTerminal/list/${code}`)
+
+		if (data.mode === false) {
+			throw new Error(data.msg)
+		} else {
+			return data.list
+		}
+	}
 }

package/src/lib/schedule-view/assets/scss/indie_booking.scss

@@ -3038,8 +3038,9 @@
 
         .map_box{
             flex-grow: 1;
-            background-color: Azure;
+            background-color: royalblue;
             position: relative;
+            overflow: hidden;
 
             .indie_ic_map_loca{
                 position: relative;
@@ -4611,5 +4612,61 @@
         }
     }
 
+
+
+    
+    //마진 값
+    .mg{
+        @for $i from 0 through 40{
+            @if(($i % 5) == 0){
+                &t#{$i}{margin-top: #{$i}px;}
+                &l#{$i}{margin-left: #{$i}px;}
+                &r#{$i}{margin-right: #{$i}px;}
+                &b#{$i}{margin-bottom: #{$i}px;}
+            }
+        }
+
+        &TMinus{
+            margin-top: -1px;
+        }
+
+        &-l-auto{
+            margin-left: auto;
+        }
+        &-r-auto{
+            margin-right: auto;
+        }
+    }
+
+    //패딩 값
+    .pd{
+        @for $i from 0 through 40{
+            @if(($i % 5) == 0){
+                &t#{$i}{padding-top: #{$i}px;}
+                &l#{$i}{padding-left: #{$i}px;}
+                &r#{$i}{padding-right: #{$i}px;}
+                &b#{$i}{padding-bottom: #{$i}px;}
+            }
+        }
+    }
+
+    // 넓이 값 - 퍼센트
+    .w{
+        @for $i from 0 through 100{
+            @if(($i % 5) == 0){
+                &#{$i}{width: #{$i + '%'};}
+            }
+        }
+    }
+
+    // 넓이 값 - 픽셀
+    .w{
+        @for $i from 0 through 500{
+            @if(($i % 10) == 0){
+                &#{$i}px{width: #{$i + 'px'};}
+            }
+        }
+    }
+
 }