@movvjs/svelte-schedule-view 0.4.1-beta-2 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/.svelte-kit/__package__/i18n/index.js +2 -2
  2. package/.svelte-kit/__package__/schedule-view/Layout.svelte +60 -0
  3. package/.svelte-kit/__package__/schedule-view/Layout.svelte.d.ts +17 -0
  4. package/.svelte-kit/__package__/schedule-view/Schedule.svelte +75 -122
  5. package/.svelte-kit/__package__/schedule-view/Schedule.svelte.d.ts +0 -1
  6. package/dist/i18n/index.js +2 -2
  7. package/dist/schedule-view/Layout.svelte +60 -0
  8. package/dist/schedule-view/Layout.svelte.d.ts +17 -0
  9. package/dist/schedule-view/Schedule.svelte +75 -122
  10. package/dist/schedule-view/Schedule.svelte.d.ts +0 -1
  11. package/package.json +1 -1
  12. package/src/lib/i18n/index.ts +2 -2
  13. package/src/lib/schedule-view/Layout.svelte +54 -0
  14. package/src/lib/schedule-view/Schedule.svelte +79 -114
package/.svelte-kit/__package__/i18n/index.js CHANGED
@@ -1,8 +1,8 @@
1
- import { _, register, init, isLoading } from 'svelte-i18n';
1
+ import { _, register } from 'svelte-i18n';
2
2
  register('en', () => import('./locales/en.json'));
3
3
  register('ko', () => import('./locales/ko.json'));
4
4
  register('zh-cn', () => import('./locales/zh-cn.json'));
5
5
  register('zh-tw', () => import('./locales/zh-tw.json'));
6
6
  register('vi', () => import('./locales/vi.json'));
7
7
  const t = _;
8
- export { t, init, isLoading };
8
+ export { t };
package/.svelte-kit/__package__/schedule-view/Layout.svelte ADDED
@@ -0,0 +1,60 @@
1
+ <script>import "./assets/scss/indie_booking.scss";
2
+ import { dayjs } from "../dayjs";
3
+ import { isLoading, init, locale } from "svelte-i18n";
4
+ import Portal from "svelte-portal";
5
+ import { env } from "../store/env";
6
+ import { Alert, Confirm } from "./components/notifications";
7
+ import Loader from "./components/loader/Loader.svelte";
8
+ import { onMount } from "svelte";
9
+ init({
10
+ fallbackLocale: "en",
11
+ initialLocale: "en"
12
+ });
13
+ env.subscribe(($env) => {
14
+ locale.set($env.locale);
15
+ dayjs.locale($env.locale);
16
+ });
17
+ onMount(() => {
18
+ googleMaps();
19
+ function googleMaps() {
20
+ ;
21
+ ((g) => {
22
+ var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window;
23
+ b = b[c] || (b[c] = {});
24
+ var d = b.maps || (b.maps = {}), r = /* @__PURE__ */ new Set(), e = new URLSearchParams(), u = () => h || (h = new Promise(async (f, n) => {
25
+ await (a = m.createElement("script"));
26
+ e.set("libraries", [...r] + "");
27
+ for (k in g)
28
+ e.set(k.replace(/[A-Z]/g, (t) => "_" + t[0].toLowerCase()), g[k]);
29
+ e.set("callback", c + ".maps." + q);
30
+ a.src = `https://maps.${c}apis.com/maps/api/js?` + e;
31
+ d[q] = f;
32
+ a.onerror = () => h = n(Error(p + " could not load."));
33
+ a.nonce = m.querySelector("script[nonce]")?.nonce || "";
34
+ m.head.append(a);
35
+ }));
36
+ d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n));
37
+ })({
38
+ key: "AIzaSyDe1e91bi67YTTnPGQlKTHXeNqMPOYkjW0",
39
+ v: "weekly",
40
+ region: "kr",
41
+ language: navigator?.language || "en"
42
+ // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
43
+ // Add other bootstrap parameters as needed, using camel case.
44
+ });
45
+ }
46
+ });
47
+ </script>
48
+
49
+ <Portal target="body">
50
+ {#if !$isLoading}
51
+ <div id="indie_booking_wrapper">
52
+ <Loader />
53
+ <Alert />
54
+ <Confirm />
55
+ <slot><!-- optional fallback --></slot>
56
+ </div>
57
+ {:else}
58
+ <!-- i18n loading. . . . -->
59
+ {/if}
60
+ </Portal>
package/.svelte-kit/__package__/schedule-view/Layout.svelte.d.ts ADDED
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import './assets/scss/indie_booking.scss';
3
+ declare const __propDef: {
4
+ props: Record<string, never>;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {
9
+ default: {};
10
+ };
11
+ };
12
+ export type LayoutProps = typeof __propDef.props;
13
+ export type LayoutEvents = typeof __propDef.events;
14
+ export type LayoutSlots = typeof __propDef.slots;
15
+ export default class Layout extends SvelteComponent<LayoutProps, LayoutEvents, LayoutSlots> {
16
+ }
17
+ export {};
package/.svelte-kit/__package__/schedule-view/Schedule.svelte CHANGED
@@ -1,59 +1,26 @@
1
1
  <script context="module">export const isEdit = writable(false);
2
2
  </script>
3
3
 
4
- <script>import "./assets/scss/indie_booking.scss";
5
- import { Toaster } from "svelte-french-toast";
6
- import { onMount } from "svelte";
4
+ <script>import { Toaster } from "svelte-french-toast";
7
5
  import { writable } from "svelte/store";
8
6
  import { cloneDeep } from "lodash-es";
9
7
  import consola from "consola";
10
- import QS from "qs";
11
- import Axios from "axios";
12
8
  import { dayjs } from "../dayjs";
13
- import { t, init as i18nInit, isLoading } from "../i18n";
9
+ import { t } from "../i18n";
14
10
  import { env } from "../store/env";
15
- import { API_URL } from "../axios/constant";
16
11
  import { BookingAPI } from "./api";
17
12
  import { copiedBooking, originalBooking } from "./stores/booking";
18
13
  import { comma } from "./utils";
19
14
  import { loader } from "./components/loader";
20
- import { alert, Alert, Confirm } from "./components/notifications";
21
- import Loader from "./components/loader/Loader.svelte";
15
+ import { alert } from "./components/notifications";
16
+ import Layout from "./Layout.svelte";
22
17
  import Map from "./Map.svelte";
23
18
  import ServiceZone from "./ServiceZone.svelte";
24
19
  import Plan from "./Plan.svelte";
25
20
  import BookingInfo from "./BookingInfo.svelte";
26
- import Portal from "svelte-portal";
27
- onMount(() => {
28
- googleMaps();
29
- function googleMaps() {
30
- ;
31
- ((g) => {
32
- var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window;
33
- b = b[c] || (b[c] = {});
34
- var d = b.maps || (b.maps = {}), r = /* @__PURE__ */ new Set(), e = new URLSearchParams(), u = () => h || (h = new Promise(async (f, n) => {
35
- await (a = m.createElement("script"));
36
- e.set("libraries", [...r] + "");
37
- for (k in g)
38
- e.set(k.replace(/[A-Z]/g, (t2) => "_" + t2[0].toLowerCase()), g[k]);
39
- e.set("callback", c + ".maps." + q);
40
- a.src = `https://maps.${c}apis.com/maps/api/js?` + e;
41
- d[q] = f;
42
- a.onerror = () => h = n(Error(p + " could not load."));
43
- a.nonce = m.querySelector("script[nonce]")?.nonce || "";
44
- m.head.append(a);
45
- }));
46
- d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n));
47
- })({
48
- key: "AIzaSyDe1e91bi67YTTnPGQlKTHXeNqMPOYkjW0",
49
- v: "weekly",
50
- region: "kr",
51
- language: navigator?.language || "en"
52
- // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
53
- // Add other bootstrap parameters as needed, using camel case.
54
- });
55
- }
56
- });
21
+ import { API_URL } from "../axios/constant";
22
+ import QS from "qs";
23
+ import Axios from "axios";
57
24
  const { stdt, price, priceDifference, isModifiable } = originalBooking;
58
25
  const {
59
26
  price: editPrice,
@@ -79,10 +46,6 @@ export function init(options) {
79
46
  throw new Error("token\uC744 \uB123\uC5B4\uC8FC\uC138\uC694.");
80
47
  if (!locale)
81
48
  throw new Error("locale\uC744 \uB123\uC5B4\uC8FC\uC138\uC694.");
82
- if (locale) {
83
- i18nInit({ fallbackLocale: "en", initialLocale: locale });
84
- dayjs.locale(locale);
85
- }
86
49
  env.set({
87
50
  target,
88
51
  accessToken: token.accessToken,
@@ -197,90 +160,80 @@ async function save() {
197
160
  </script>
198
161
 
199
162
  <Toaster />
163
+ <Layout>
164
+ <section class="indie_pop_wrap scroll" class:on>
165
+ {#if on}
166
+ <div class="pop_base full_2 indie_passengers_info_pop">
167
+ <button type="button" class="btn_close" on:click={() => close()}>닫기</button>
200
168
 
201
- <Portal target="body">
202
- {#if !$isLoading}
203
- <div id="indie_booking_wrapper">
204
- <Loader />
205
- <Alert />
206
- <Confirm />
207
- <section class="indie_pop_wrap scroll" class:on>
208
- {#if on}
209
- <div class="pop_base full_2 indie_passengers_info_pop">
210
- <button type="button" class="btn_close" on:click={() => close()}>닫기</button>
211
-
212
- <!-- 예약관리 > 예약_view > Schedule -->
213
- <section class="indie_dispatch_passenger_sche_w booking_schedule">
214
- <!-- 지도 부분 -->
215
- <Map />
216
- <!-- 예약 > 스케쥴 -->
217
- <div class="indie_booking_schedule_modify_box">
218
- <div class="header_b">
219
- <div class="tags">
220
- <span>{$originalBooking.code}</span>
221
- <strong>{$t(`serviceType.${$originalBooking.serviceType}`)}</strong>
222
- </div>
223
- <p class="date_text">{dayjs($stdt).format('ll (dd)')}</p>
224
- <!-- <select class="indie_select_nor">
225
- <option value="">2023-10-16 (Mon)</option>
226
- <option value="">2023-10-16 (Mon)</option>
227
- </select> -->
228
-
229
- <!-- <button type="button" class="btn_close">닫기</button> -->
230
- </div>
169
+ <!-- 예약관리 > 예약_view > Schedule -->
170
+ <section class="indie_dispatch_passenger_sche_w booking_schedule">
171
+ <!-- 지도 부분 -->
172
+ <Map />
173
+ <!-- 예약 > 스케쥴 -->
174
+ <div class="indie_booking_schedule_modify_box">
175
+ <div class="header_b">
176
+ <div class="tags">
177
+ <span>{$originalBooking.code}</span>
178
+ <strong>{$t(`serviceType.${$originalBooking.serviceType}`)}</strong>
179
+ </div>
180
+ <p class="date_text">{dayjs($stdt).format('ll (dd)')}</p>
181
+ <!-- <select class="indie_select_nor">
182
+ <option value="">2023-10-16 (Mon)</option>
183
+ <option value="">2023-10-16 (Mon)</option>
184
+ </select> -->
231
185
 
232
- <div class="contents_b">
233
- <ServiceZone />
234
- <Plan />
235
- <BookingInfo />
236
- </div>
186
+ <!-- <button type="button" class="btn_close">닫기</button> -->
187
+ </div>
237
188
 
238
- <div class="footer_b">
239
- <div class="left">
240
- <dl class="priceAll">
241
- <dt>{$t('booking.totalPrice')}</dt>
242
- <dd>
243
- <!-- * 차액 발생시 -->
244
- {#if difference > 0 || difference < 0}
245
- <!-- 검정 표현 -->
246
- <strong>{comma(targetPrice.before.amount)} {forex}</strong>
189
+ <div class="contents_b">
190
+ <ServiceZone />
191
+ <Plan />
192
+ <BookingInfo />
193
+ </div>
247
194
 
248
- <!-- 빨간색 표현 -->
249
- <span>
250
- {difference > 0 ? ' + ' : ' - '}
251
- {comma(Math.abs(difference))}
252
- {forex}
253
- = {comma(targetPrice.new.amount)}
254
- {forex}
255
- </span>
256
- {:else}
257
- <!-- * 차액 미 발생시 검정색 표현-->
258
- <strong>{comma(targetPrice.new.amount)} {forex}</strong>
259
- {/if}
260
- </dd>
261
- </dl>
262
- </div>
195
+ <div class="footer_b">
196
+ <div class="left">
197
+ <dl class="priceAll">
198
+ <dt>{$t('booking.totalPrice')}</dt>
199
+ <dd>
200
+ <!-- * 차액 발생시 -->
201
+ {#if difference > 0 || difference < 0}
202
+ <!-- 검정 표현 -->
203
+ <strong>{comma(targetPrice.before.amount)} {forex}</strong>
263
204
 
264
- <div class="right">
265
- <button type="button" class="indie_btn_nor md line2" on:click={() => close()}>{$t('booking.cancel')}</button>
266
- {#if !$isEdit}
267
- {#if $isModifiable}
268
- <button type="button" class="indie_btn_nor md line2 modify" on:click={() => edit()}>{$t('booking.modify')}</button>
269
- {/if}
205
+ <!-- 빨간색 표현 -->
206
+ <span>
207
+ {difference > 0 ? ' + ' : ' - '}
208
+ {comma(Math.abs(difference))}
209
+ {forex}
210
+ = {comma(targetPrice.new.amount)}
211
+ {forex}
212
+ </span>
270
213
  {:else}
271
- <button type="button" class="indie_btn_nor md line2" on:click={() => reset()}>{$t('booking.reset')}</button>
272
- <button type="button" class="indie_btn_nor md blue" on:click={() => save()}>{$t('booking.save')}</button>
214
+ <!-- * 차액 미 발생시 검정색 표현-->
215
+ <strong>{comma(targetPrice.new.amount)} {forex}</strong>
273
216
  {/if}
274
- </div>
275
- </div>
217
+ </dd>
218
+ </dl>
219
+ </div>
220
+
221
+ <div class="right">
222
+ <button type="button" class="indie_btn_nor md line2" on:click={() => close()}>{$t('booking.cancel')}</button>
223
+ {#if !$isEdit}
224
+ {#if $isModifiable}
225
+ <button type="button" class="indie_btn_nor md line2 modify" on:click={() => edit()}>{$t('booking.modify')}</button>
226
+ {/if}
227
+ {:else}
228
+ <button type="button" class="indie_btn_nor md line2" on:click={() => reset()}>{$t('booking.reset')}</button>
229
+ <button type="button" class="indie_btn_nor md blue" on:click={() => save()}>{$t('booking.save')}</button>
230
+ {/if}
276
231
  </div>
277
- </section>
278
- <!-- // 배차 - 탑승자 정보 및 스케줄 -->
232
+ </div>
279
233
  </div>
280
- {/if}
281
- </section>
282
- </div>
283
- {:else}
284
- <!-- i18n loading. . . . -->
285
- {/if}
286
- </Portal>
234
+ </section>
235
+ <!-- // 배차 - 탑승자 정보 및 스케줄 -->
236
+ </div>
237
+ {/if}
238
+ </section>
239
+ </Layout>
package/.svelte-kit/__package__/schedule-view/Schedule.svelte.d.ts CHANGED
@@ -10,7 +10,6 @@ export interface InitOption {
10
10
  };
11
11
  viewOnly?: boolean;
12
12
  }
13
- import './assets/scss/indie_booking.scss';
14
13
  import type { Locale, Target } from './types';
15
14
  declare const __propDef: {
16
15
  props: {
package/dist/i18n/index.js CHANGED
@@ -1,8 +1,8 @@
1
- import { _, register, init, isLoading } from 'svelte-i18n';
1
+ import { _, register } from 'svelte-i18n';
2
2
  register('en', () => import('./locales/en.json'));
3
3
  register('ko', () => import('./locales/ko.json'));
4
4
  register('zh-cn', () => import('./locales/zh-cn.json'));
5
5
  register('zh-tw', () => import('./locales/zh-tw.json'));
6
6
  register('vi', () => import('./locales/vi.json'));
7
7
  const t = _;
8
- export { t, init, isLoading };
8
+ export { t };
package/dist/schedule-view/Layout.svelte ADDED
@@ -0,0 +1,60 @@
1
+ <script>import "./assets/scss/indie_booking.scss";
2
+ import { dayjs } from "../dayjs";
3
+ import { isLoading, init, locale } from "svelte-i18n";
4
+ import Portal from "svelte-portal";
5
+ import { env } from "../store/env";
6
+ import { Alert, Confirm } from "./components/notifications";
7
+ import Loader from "./components/loader/Loader.svelte";
8
+ import { onMount } from "svelte";
9
+ init({
10
+ fallbackLocale: "en",
11
+ initialLocale: "en"
12
+ });
13
+ env.subscribe(($env) => {
14
+ locale.set($env.locale);
15
+ dayjs.locale($env.locale);
16
+ });
17
+ onMount(() => {
18
+ googleMaps();
19
+ function googleMaps() {
20
+ ;
21
+ ((g) => {
22
+ var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window;
23
+ b = b[c] || (b[c] = {});
24
+ var d = b.maps || (b.maps = {}), r = /* @__PURE__ */ new Set(), e = new URLSearchParams(), u = () => h || (h = new Promise(async (f, n) => {
25
+ await (a = m.createElement("script"));
26
+ e.set("libraries", [...r] + "");
27
+ for (k in g)
28
+ e.set(k.replace(/[A-Z]/g, (t) => "_" + t[0].toLowerCase()), g[k]);
29
+ e.set("callback", c + ".maps." + q);
30
+ a.src = `https://maps.${c}apis.com/maps/api/js?` + e;
31
+ d[q] = f;
32
+ a.onerror = () => h = n(Error(p + " could not load."));
33
+ a.nonce = m.querySelector("script[nonce]")?.nonce || "";
34
+ m.head.append(a);
35
+ }));
36
+ d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n));
37
+ })({
38
+ key: "AIzaSyDe1e91bi67YTTnPGQlKTHXeNqMPOYkjW0",
39
+ v: "weekly",
40
+ region: "kr",
41
+ language: navigator?.language || "en"
42
+ // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
43
+ // Add other bootstrap parameters as needed, using camel case.
44
+ });
45
+ }
46
+ });
47
+ </script>
48
+
49
+ <Portal target="body">
50
+ {#if !$isLoading}
51
+ <div id="indie_booking_wrapper">
52
+ <Loader />
53
+ <Alert />
54
+ <Confirm />
55
+ <slot><!-- optional fallback --></slot>
56
+ </div>
57
+ {:else}
58
+ <!-- i18n loading. . . . -->
59
+ {/if}
60
+ </Portal>
package/dist/schedule-view/Layout.svelte.d.ts ADDED
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import './assets/scss/indie_booking.scss';
3
+ declare const __propDef: {
4
+ props: Record<string, never>;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {
9
+ default: {};
10
+ };
11
+ };
12
+ export type LayoutProps = typeof __propDef.props;
13
+ export type LayoutEvents = typeof __propDef.events;
14
+ export type LayoutSlots = typeof __propDef.slots;
15
+ export default class Layout extends SvelteComponent<LayoutProps, LayoutEvents, LayoutSlots> {
16
+ }
17
+ export {};
package/dist/schedule-view/Schedule.svelte CHANGED
@@ -1,59 +1,26 @@
1
1
  <script context="module">export const isEdit = writable(false);
2
2
  </script>
3
3
 
4
- <script>import "./assets/scss/indie_booking.scss";
5
- import { Toaster } from "svelte-french-toast";
6
- import { onMount } from "svelte";
4
+ <script>import { Toaster } from "svelte-french-toast";
7
5
  import { writable } from "svelte/store";
8
6
  import { cloneDeep } from "lodash-es";
9
7
  import consola from "consola";
10
- import QS from "qs";
11
- import Axios from "axios";
12
8
  import { dayjs } from "../dayjs";
13
- import { t, init as i18nInit, isLoading } from "../i18n";
9
+ import { t } from "../i18n";
14
10
  import { env } from "../store/env";
15
- import { API_URL } from "../axios/constant";
16
11
  import { BookingAPI } from "./api";
17
12
  import { copiedBooking, originalBooking } from "./stores/booking";
18
13
  import { comma } from "./utils";
19
14
  import { loader } from "./components/loader";
20
- import { alert, Alert, Confirm } from "./components/notifications";
21
- import Loader from "./components/loader/Loader.svelte";
15
+ import { alert } from "./components/notifications";
16
+ import Layout from "./Layout.svelte";
22
17
  import Map from "./Map.svelte";
23
18
  import ServiceZone from "./ServiceZone.svelte";
24
19
  import Plan from "./Plan.svelte";
25
20
  import BookingInfo from "./BookingInfo.svelte";
26
- import Portal from "svelte-portal";
27
- onMount(() => {
28
- googleMaps();
29
- function googleMaps() {
30
- ;
31
- ((g) => {
32
- var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window;
33
- b = b[c] || (b[c] = {});
34
- var d = b.maps || (b.maps = {}), r = /* @__PURE__ */ new Set(), e = new URLSearchParams(), u = () => h || (h = new Promise(async (f, n) => {
35
- await (a = m.createElement("script"));
36
- e.set("libraries", [...r] + "");
37
- for (k in g)
38
- e.set(k.replace(/[A-Z]/g, (t2) => "_" + t2[0].toLowerCase()), g[k]);
39
- e.set("callback", c + ".maps." + q);
40
- a.src = `https://maps.${c}apis.com/maps/api/js?` + e;
41
- d[q] = f;
42
- a.onerror = () => h = n(Error(p + " could not load."));
43
- a.nonce = m.querySelector("script[nonce]")?.nonce || "";
44
- m.head.append(a);
45
- }));
46
- d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n));
47
- })({
48
- key: "AIzaSyDe1e91bi67YTTnPGQlKTHXeNqMPOYkjW0",
49
- v: "weekly",
50
- region: "kr",
51
- language: navigator?.language || "en"
52
- // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
53
- // Add other bootstrap parameters as needed, using camel case.
54
- });
55
- }
56
- });
21
+ import { API_URL } from "../axios/constant";
22
+ import QS from "qs";
23
+ import Axios from "axios";
57
24
  const { stdt, price, priceDifference, isModifiable } = originalBooking;
58
25
  const {
59
26
  price: editPrice,
@@ -79,10 +46,6 @@ export function init(options) {
79
46
  throw new Error("token\uC744 \uB123\uC5B4\uC8FC\uC138\uC694.");
80
47
  if (!locale)
81
48
  throw new Error("locale\uC744 \uB123\uC5B4\uC8FC\uC138\uC694.");
82
- if (locale) {
83
- i18nInit({ fallbackLocale: "en", initialLocale: locale });
84
- dayjs.locale(locale);
85
- }
86
49
  env.set({
87
50
  target,
88
51
  accessToken: token.accessToken,
@@ -197,90 +160,80 @@ async function save() {
197
160
  </script>
198
161
 
199
162
  <Toaster />
163
+ <Layout>
164
+ <section class="indie_pop_wrap scroll" class:on>
165
+ {#if on}
166
+ <div class="pop_base full_2 indie_passengers_info_pop">
167
+ <button type="button" class="btn_close" on:click={() => close()}>닫기</button>
200
168
 
201
- <Portal target="body">
202
- {#if !$isLoading}
203
- <div id="indie_booking_wrapper">
204
- <Loader />
205
- <Alert />
206
- <Confirm />
207
- <section class="indie_pop_wrap scroll" class:on>
208
- {#if on}
209
- <div class="pop_base full_2 indie_passengers_info_pop">
210
- <button type="button" class="btn_close" on:click={() => close()}>닫기</button>
211
-
212
- <!-- 예약관리 > 예약_view > Schedule -->
213
- <section class="indie_dispatch_passenger_sche_w booking_schedule">
214
- <!-- 지도 부분 -->
215
- <Map />
216
- <!-- 예약 > 스케쥴 -->
217
- <div class="indie_booking_schedule_modify_box">
218
- <div class="header_b">
219
- <div class="tags">
220
- <span>{$originalBooking.code}</span>
221
- <strong>{$t(`serviceType.${$originalBooking.serviceType}`)}</strong>
222
- </div>
223
- <p class="date_text">{dayjs($stdt).format('ll (dd)')}</p>
224
- <!-- <select class="indie_select_nor">
225
- <option value="">2023-10-16 (Mon)</option>
226
- <option value="">2023-10-16 (Mon)</option>
227
- </select> -->
228
-
229
- <!-- <button type="button" class="btn_close">닫기</button> -->
230
- </div>
169
+ <!-- 예약관리 > 예약_view > Schedule -->
170
+ <section class="indie_dispatch_passenger_sche_w booking_schedule">
171
+ <!-- 지도 부분 -->
172
+ <Map />
173
+ <!-- 예약 > 스케쥴 -->
174
+ <div class="indie_booking_schedule_modify_box">
175
+ <div class="header_b">
176
+ <div class="tags">
177
+ <span>{$originalBooking.code}</span>
178
+ <strong>{$t(`serviceType.${$originalBooking.serviceType}`)}</strong>
179
+ </div>
180
+ <p class="date_text">{dayjs($stdt).format('ll (dd)')}</p>
181
+ <!-- <select class="indie_select_nor">
182
+ <option value="">2023-10-16 (Mon)</option>
183
+ <option value="">2023-10-16 (Mon)</option>
184
+ </select> -->
231
185
 
232
- <div class="contents_b">
233
- <ServiceZone />
234
- <Plan />
235
- <BookingInfo />
236
- </div>
186
+ <!-- <button type="button" class="btn_close">닫기</button> -->
187
+ </div>
237
188
 
238
- <div class="footer_b">
239
- <div class="left">
240
- <dl class="priceAll">
241
- <dt>{$t('booking.totalPrice')}</dt>
242
- <dd>
243
- <!-- * 차액 발생시 -->
244
- {#if difference > 0 || difference < 0}
245
- <!-- 검정 표현 -->
246
- <strong>{comma(targetPrice.before.amount)} {forex}</strong>
189
+ <div class="contents_b">
190
+ <ServiceZone />
191
+ <Plan />
192
+ <BookingInfo />
193
+ </div>
247
194
 
248
- <!-- 빨간색 표현 -->
249
- <span>
250
- {difference > 0 ? ' + ' : ' - '}
251
- {comma(Math.abs(difference))}
252
- {forex}
253
- = {comma(targetPrice.new.amount)}
254
- {forex}
255
- </span>
256
- {:else}
257
- <!-- * 차액 미 발생시 검정색 표현-->
258
- <strong>{comma(targetPrice.new.amount)} {forex}</strong>
259
- {/if}
260
- </dd>
261
- </dl>
262
- </div>
195
+ <div class="footer_b">
196
+ <div class="left">
197
+ <dl class="priceAll">
198
+ <dt>{$t('booking.totalPrice')}</dt>
199
+ <dd>
200
+ <!-- * 차액 발생시 -->
201
+ {#if difference > 0 || difference < 0}
202
+ <!-- 검정 표현 -->
203
+ <strong>{comma(targetPrice.before.amount)} {forex}</strong>
263
204
 
264
- <div class="right">
265
- <button type="button" class="indie_btn_nor md line2" on:click={() => close()}>{$t('booking.cancel')}</button>
266
- {#if !$isEdit}
267
- {#if $isModifiable}
268
- <button type="button" class="indie_btn_nor md line2 modify" on:click={() => edit()}>{$t('booking.modify')}</button>
269
- {/if}
205
+ <!-- 빨간색 표현 -->
206
+ <span>
207
+ {difference > 0 ? ' + ' : ' - '}
208
+ {comma(Math.abs(difference))}
209
+ {forex}
210
+ = {comma(targetPrice.new.amount)}
211
+ {forex}
212
+ </span>
270
213
  {:else}
271
- <button type="button" class="indie_btn_nor md line2" on:click={() => reset()}>{$t('booking.reset')}</button>
272
- <button type="button" class="indie_btn_nor md blue" on:click={() => save()}>{$t('booking.save')}</button>
214
+ <!-- * 차액 미 발생시 검정색 표현-->
215
+ <strong>{comma(targetPrice.new.amount)} {forex}</strong>
273
216
  {/if}
274
- </div>
275
- </div>
217
+ </dd>
218
+ </dl>
219
+ </div>
220
+
221
+ <div class="right">
222
+ <button type="button" class="indie_btn_nor md line2" on:click={() => close()}>{$t('booking.cancel')}</button>
223
+ {#if !$isEdit}
224
+ {#if $isModifiable}
225
+ <button type="button" class="indie_btn_nor md line2 modify" on:click={() => edit()}>{$t('booking.modify')}</button>
226
+ {/if}
227
+ {:else}
228
+ <button type="button" class="indie_btn_nor md line2" on:click={() => reset()}>{$t('booking.reset')}</button>
229
+ <button type="button" class="indie_btn_nor md blue" on:click={() => save()}>{$t('booking.save')}</button>
230
+ {/if}
276
231
  </div>
277
- </section>
278
- <!-- // 배차 - 탑승자 정보 및 스케줄 -->
232
+ </div>
279
233
  </div>
280
- {/if}
281
- </section>
282
- </div>
283
- {:else}
284
- <!-- i18n loading. . . . -->
285
- {/if}
286
- </Portal>
234
+ </section>
235
+ <!-- // 배차 - 탑승자 정보 및 스케줄 -->
236
+ </div>
237
+ {/if}
238
+ </section>
239
+ </Layout>
package/dist/schedule-view/Schedule.svelte.d.ts CHANGED
@@ -10,7 +10,6 @@ export interface InitOption {
10
10
  };
11
11
  viewOnly?: boolean;
12
12
  }
13
- import './assets/scss/indie_booking.scss';
14
13
  import type { Locale, Target } from './types';
15
14
  declare const __propDef: {
16
15
  props: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@movvjs/svelte-schedule-view",
3
- "version": "0.4.1-beta-2",
3
+ "version": "0.4.1",
4
4
  "type": "module",
5
5
  "license": "ISC",
6
6
  "author": {
package/src/lib/i18n/index.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { _, register, init, isLoading } from 'svelte-i18n'
1
+ import { _, register } from 'svelte-i18n'
2
2
 
3
3
  register('en', () => import('./locales/en.json'))
4
4
  register('ko', () => import('./locales/ko.json'))
@@ -8,4 +8,4 @@ register('vi', () => import('./locales/vi.json'))
8
8
 
9
9
  const t = _
10
10
 
11
- export { t, init, isLoading }
11
+ export { t }
package/src/lib/schedule-view/Layout.svelte ADDED
@@ -0,0 +1,54 @@
1
+ <script lang="ts">
2
+ import './assets/scss/indie_booking.scss'
3
+
4
+ import { dayjs } from '$lib/dayjs'
5
+ import { isLoading, init, locale } from 'svelte-i18n'
6
+ import Portal from 'svelte-portal'
7
+
8
+ import { env } from '$lib/store/env'
9
+
10
+ import { Alert, Confirm } from './components/notifications'
11
+
12
+ import Loader from './components/loader/Loader.svelte'
13
+ import { onMount } from 'svelte'
14
+
15
+ init({
16
+ fallbackLocale: 'en',
17
+ initialLocale: 'en'
18
+ })
19
+
20
+ env.subscribe($env => {
21
+ locale.set($env.locale)
22
+ dayjs.locale($env.locale)
23
+ })
24
+
25
+ onMount(() => {
26
+ googleMaps()
27
+
28
+ function googleMaps() {
29
+ // https://developers.google.com/maps/documentation/javascript/load-maps-js-api?hl=ko#dynamic-library-import
30
+ // prettier-ignore
31
+ ;(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({
32
+ key: "AIzaSyDe1e91bi67YTTnPGQlKTHXeNqMPOYkjW0",
33
+ v: "weekly",
34
+ region: "kr",
35
+ language: navigator?.language || "en",
36
+ // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
37
+ // Add other bootstrap parameters as needed, using camel case.
38
+ });
39
+ }
40
+ })
41
+ </script>
42
+
43
+ <Portal target="body">
44
+ {#if !$isLoading}
45
+ <div id="indie_booking_wrapper">
46
+ <Loader />
47
+ <Alert />
48
+ <Confirm />
49
+ <slot><!-- optional fallback --></slot>
50
+ </div>
51
+ {:else}
52
+ <!-- i18n loading. . . . -->
53
+ {/if}
54
+ </Portal>
package/src/lib/schedule-view/Schedule.svelte CHANGED
@@ -13,19 +13,14 @@
13
13
  </script>
14
14
 
15
15
  <script lang="ts">
16
- import './assets/scss/indie_booking.scss'
17
16
  import { Toaster } from 'svelte-french-toast'
18
- import { onMount } from 'svelte'
19
17
  import { writable } from 'svelte/store'
20
18
  import { cloneDeep } from 'lodash-es'
21
19
  import consola from 'consola'
22
- import QS from 'qs'
23
- import Axios from 'axios'
24
20
 
25
21
  import { dayjs } from '$lib/dayjs'
26
- import { t, init as i18nInit, isLoading } from '$lib/i18n'
22
+ import { t } from '$lib/i18n'
27
23
  import { env } from '$lib/store/env'
28
- import { API_URL } from '$lib/axios/constant'
29
24
 
30
25
  import type { Locale, Target } from '$scheduleView/types'
31
26
  import { BookingAPI } from '$scheduleView/api'
@@ -33,31 +28,16 @@
33
28
  import { comma } from '$scheduleView/utils'
34
29
 
35
30
  import { loader } from '$scheduleView/components/loader'
36
- import { alert, Alert, Confirm } from '$scheduleView/components/notifications'
37
- import Loader from './components/loader/Loader.svelte'
31
+ import { alert } from '$scheduleView/components/notifications'
38
32
 
33
+ import Layout from '$scheduleView/Layout.svelte'
39
34
  import Map from '$scheduleView/Map.svelte'
40
35
  import ServiceZone from '$scheduleView/ServiceZone.svelte'
41
36
  import Plan from '$scheduleView/Plan.svelte'
42
37
  import BookingInfo from '$scheduleView/BookingInfo.svelte'
43
- import Portal from 'svelte-portal'
44
-
45
- onMount(() => {
46
- googleMaps()
47
-
48
- function googleMaps() {
49
- // https://developers.google.com/maps/documentation/javascript/load-maps-js-api?hl=ko#dynamic-library-import
50
- // prettier-ignore
51
- ;(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({
52
- key: "AIzaSyDe1e91bi67YTTnPGQlKTHXeNqMPOYkjW0",
53
- v: "weekly",
54
- region: "kr",
55
- language: navigator?.language || "en",
56
- // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
57
- // Add other bootstrap parameters as needed, using camel case.
58
- });
59
- }
60
- })
38
+ import { API_URL } from '$lib/axios/constant'
39
+ import QS from 'qs'
40
+ import Axios from 'axios'
61
41
 
62
42
  const { stdt, price, priceDifference, isModifiable } = originalBooking
63
43
  const {
@@ -90,11 +70,6 @@
90
70
  if (!token) throw new Error('token을 넣어주세요.')
91
71
  if (!locale) throw new Error('locale을 넣어주세요.')
92
72
 
93
- if (locale) {
94
- i18nInit({ fallbackLocale: 'en', initialLocale: locale })
95
- dayjs.locale(locale)
96
- }
97
-
98
73
  env.set({
99
74
  target,
100
75
  accessToken: token.accessToken,
@@ -239,90 +214,80 @@
239
214
  </script>
240
215
 
241
216
  <Toaster />
242
-
243
- <Portal target="body">
244
- {#if !$isLoading}
245
- <div id="indie_booking_wrapper">
246
- <Loader />
247
- <Alert />
248
- <Confirm />
249
- <section class="indie_pop_wrap scroll" class:on>
250
- {#if on}
251
- <div class="pop_base full_2 indie_passengers_info_pop">
252
- <button type="button" class="btn_close" on:click={() => close()}>닫기</button>
253
-
254
- <!-- 예약관리 > 예약_view > Schedule -->
255
- <section class="indie_dispatch_passenger_sche_w booking_schedule">
256
- <!-- 지도 부분 -->
257
- <Map />
258
- <!-- 예약 > 스케쥴 -->
259
- <div class="indie_booking_schedule_modify_box">
260
- <div class="header_b">
261
- <div class="tags">
262
- <span>{$originalBooking.code}</span>
263
- <strong>{$t(`serviceType.${$originalBooking.serviceType}`)}</strong>
264
- </div>
265
- <p class="date_text">{dayjs($stdt).format('ll (dd)')}</p>
266
- <!-- <select class="indie_select_nor">
267
- <option value="">2023-10-16 (Mon)</option>
268
- <option value="">2023-10-16 (Mon)</option>
269
- </select> -->
270
-
271
- <!-- <button type="button" class="btn_close">닫기</button> -->
272
- </div>
273
-
274
- <div class="contents_b">
275
- <ServiceZone />
276
- <Plan />
277
- <BookingInfo />
278
- </div>
279
-
280
- <div class="footer_b">
281
- <div class="left">
282
- <dl class="priceAll">
283
- <dt>{$t('booking.totalPrice')}</dt>
284
- <dd>
285
- <!-- * 차액 발생시 -->
286
- {#if difference > 0 || difference < 0}
287
- <!-- 검정 표현 -->
288
- <strong>{comma(targetPrice.before.amount)} {forex}</strong>
289
-
290
- <!-- 빨간색 표현 -->
291
- <span>
292
- {difference > 0 ? ' + ' : ' - '}
293
- {comma(Math.abs(difference))}
294
- {forex}
295
- = {comma(targetPrice.new.amount)}
296
- {forex}
297
- </span>
298
- {:else}
299
- <!-- * 차액 미 발생시 검정색 표현-->
300
- <strong>{comma(targetPrice.new.amount)} {forex}</strong>
301
- {/if}
302
- </dd>
303
- </dl>
304
- </div>
305
-
306
- <div class="right">
307
- <button type="button" class="indie_btn_nor md line2" on:click={() => close()}>{$t('booking.cancel')}</button>
308
- {#if !$isEdit}
309
- {#if $isModifiable}
310
- <button type="button" class="indie_btn_nor md line2 modify" on:click={() => edit()}>{$t('booking.modify')}</button>
311
- {/if}
217
+ <Layout>
218
+ <section class="indie_pop_wrap scroll" class:on>
219
+ {#if on}
220
+ <div class="pop_base full_2 indie_passengers_info_pop">
221
+ <button type="button" class="btn_close" on:click={() => close()}>닫기</button>
222
+
223
+ <!-- 예약관리 > 예약_view > Schedule -->
224
+ <section class="indie_dispatch_passenger_sche_w booking_schedule">
225
+ <!-- 지도 부분 -->
226
+ <Map />
227
+ <!-- 예약 > 스케쥴 -->
228
+ <div class="indie_booking_schedule_modify_box">
229
+ <div class="header_b">
230
+ <div class="tags">
231
+ <span>{$originalBooking.code}</span>
232
+ <strong>{$t(`serviceType.${$originalBooking.serviceType}`)}</strong>
233
+ </div>
234
+ <p class="date_text">{dayjs($stdt).format('ll (dd)')}</p>
235
+ <!-- <select class="indie_select_nor">
236
+ <option value="">2023-10-16 (Mon)</option>
237
+ <option value="">2023-10-16 (Mon)</option>
238
+ </select> -->
239
+
240
+ <!-- <button type="button" class="btn_close">닫기</button> -->
241
+ </div>
242
+
243
+ <div class="contents_b">
244
+ <ServiceZone />
245
+ <Plan />
246
+ <BookingInfo />
247
+ </div>
248
+
249
+ <div class="footer_b">
250
+ <div class="left">
251
+ <dl class="priceAll">
252
+ <dt>{$t('booking.totalPrice')}</dt>
253
+ <dd>
254
+ <!-- * 차액 발생시 -->
255
+ {#if difference > 0 || difference < 0}
256
+ <!-- 검정 표현 -->
257
+ <strong>{comma(targetPrice.before.amount)} {forex}</strong>
258
+
259
+ <!-- 빨간색 표현 -->
260
+ <span>
261
+ {difference > 0 ? ' + ' : ' - '}
262
+ {comma(Math.abs(difference))}
263
+ {forex}
264
+ = {comma(targetPrice.new.amount)}
265
+ {forex}
266
+ </span>
312
267
  {:else}
313
- <button type="button" class="indie_btn_nor md line2" on:click={() => reset()}>{$t('booking.reset')}</button>
314
- <button type="button" class="indie_btn_nor md blue" on:click={() => save()}>{$t('booking.save')}</button>
268
+ <!-- * 차액 미 발생시 검정색 표현-->
269
+ <strong>{comma(targetPrice.new.amount)} {forex}</strong>
315
270
  {/if}
316
- </div>
317
- </div>
271
+ </dd>
272
+ </dl>
273
+ </div>
274
+
275
+ <div class="right">
276
+ <button type="button" class="indie_btn_nor md line2" on:click={() => close()}>{$t('booking.cancel')}</button>
277
+ {#if !$isEdit}
278
+ {#if $isModifiable}
279
+ <button type="button" class="indie_btn_nor md line2 modify" on:click={() => edit()}>{$t('booking.modify')}</button>
280
+ {/if}
281
+ {:else}
282
+ <button type="button" class="indie_btn_nor md line2" on:click={() => reset()}>{$t('booking.reset')}</button>
283
+ <button type="button" class="indie_btn_nor md blue" on:click={() => save()}>{$t('booking.save')}</button>
284
+ {/if}
318
285
  </div>
319
- </section>
320
- <!-- // 배차 - 탑승자 정보 및 스케줄 -->
286
+ </div>
321
287
  </div>
322
- {/if}
323
- </section>
324
- </div>
325
- {:else}
326
- <!-- i18n loading. . . . -->
327
- {/if}
328
- </Portal>
288
+ </section>
289
+ <!-- // 배차 - 탑승자 정보 및 스케줄 -->
290
+ </div>
291
+ {/if}
292
+ </section>
293
+ </Layout>