@ticatec/uniface-element 0.1.17 → 0.1.19

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.
@@ -20,6 +20,6 @@ export default interface ButtonAction {
20
20
  /**
21
21
  * click处理函数
22
22
  */
23
- handler: MouseClickHandler;
23
+ handler?: MouseClickHandler;
24
24
  }
25
25
  export type ButtonActions = Array<ButtonAction | null>;
@@ -0,0 +1,34 @@
1
+ <script lang="ts">
2
+
3
+ import Dialog from "./Dialog.svelte";
4
+ import type {ButtonAction, ButtonActions} from "../action-bar";
5
+ import type {DialogCloseConfirm, MouseClickHandler} from "..";
6
+ import i18n from "@ticatec/i18n";
7
+
8
+ export let title: string;
9
+ export let closeConfirm: DialogCloseConfirm | null = null;
10
+ export let content$style: string = '';
11
+ export let closeHandler: () => void;
12
+ export let enableConfirm: boolean = true;
13
+ export let confirmHandler: MouseClickHandler;
14
+ export let confirmText: string | null = null;
15
+
16
+ let confirmAction: ButtonAction = {
17
+ label: confirmText??i18n.getText('uniface.btnConfirm', 'OK'),
18
+ type: "primary",
19
+ disabled: enableConfirm,
20
+ handler: confirmHandler
21
+ }
22
+
23
+ let actions: ButtonActions = [confirmAction];
24
+
25
+ $: {
26
+ confirmAction.disabled = !enableConfirm;
27
+ actions = [...actions];
28
+ }
29
+
30
+ </script>
31
+
32
+ <Dialog {title} {content$style} {closeHandler} {actions} {closeConfirm}>
33
+ <slot></slot>
34
+ </Dialog>
@@ -0,0 +1,36 @@
1
+ import type { DialogCloseConfirm, MouseClickHandler } from "..";
2
+ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
3
+ new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
4
+ $$bindings?: Bindings;
5
+ } & Exports;
6
+ (internal: unknown, props: Props & {
7
+ $$events?: Events;
8
+ $$slots?: Slots;
9
+ }): Exports & {
10
+ $set?: any;
11
+ $on?: any;
12
+ };
13
+ z_$$bindings?: Bindings;
14
+ }
15
+ type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
16
+ default: any;
17
+ } ? Props extends Record<string, never> ? any : {
18
+ children?: any;
19
+ } : {});
20
+ declare const CommonDialog: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
21
+ title: string;
22
+ closeConfirm?: DialogCloseConfirm | null;
23
+ content$style?: string;
24
+ closeHandler: () => void;
25
+ enableConfirm?: boolean;
26
+ confirmHandler: MouseClickHandler;
27
+ confirmText?: string | null;
28
+ }, {
29
+ default: {};
30
+ }>, {
31
+ [evt: string]: CustomEvent<any>;
32
+ }, {
33
+ default: {};
34
+ }, {}, string>;
35
+ type CommonDialog = InstanceType<typeof CommonDialog>;
36
+ export default CommonDialog;
@@ -2,18 +2,16 @@
2
2
 
3
3
  import {fade} from "svelte/transition";
4
4
  import type {DialogCloseConfirm} from "./DialogCloseConfirm";
5
- import ActionBar, {type ButtonActions} from "../action-bar";
5
+ import ActionBar, {type ButtonAction, type ButtonActions} from "../action-bar";
6
6
  import i18n from "@ticatec/i18n";
7
7
  import {onMount} from "svelte";
8
8
 
9
- export let title: string = null as unknown as string;
10
- export let actions: ButtonActions;
11
- export let closeConfirm: DialogCloseConfirm;
9
+ export let title: string;
10
+ export let actions: ButtonActions | null = null;
11
+ export let closeConfirm: DialogCloseConfirm | null = null;
12
12
  export let content$style: string = '';
13
13
  export let closeHandler: () => void;
14
-
15
-
16
- export let closeAction: any;
14
+ export let closeAction: ButtonAction | null = null;
17
15
 
18
16
  export const close = async () => {
19
17
  let confirm = closeConfirm ? await closeConfirm() : true;
@@ -50,10 +48,8 @@
50
48
  type: 'secondary'
51
49
  };
52
50
  closeAction.handler = close;
53
- dialogActions = actions ? [...actions, closeAction] : [closeAction];
54
51
  })
55
52
 
56
- $:console.log(closeAction)
57
53
  $: dialogActions = actions ? [...actions, closeAction] : [closeAction];
58
54
 
59
55
  </script>
@@ -1,5 +1,5 @@
1
1
  import type { DialogCloseConfirm } from "./DialogCloseConfirm";
2
- import { type ButtonActions } from "../action-bar";
2
+ import { type ButtonAction, type ButtonActions } from "../action-bar";
3
3
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
4
4
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
5
5
  $$bindings?: Bindings;
@@ -19,12 +19,12 @@ type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
19
19
  children?: any;
20
20
  } : {});
21
21
  declare const Dialog: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
22
- title?: string;
23
- actions: ButtonActions;
24
- closeConfirm: DialogCloseConfirm;
22
+ title: string;
23
+ actions?: ButtonActions | null;
24
+ closeConfirm?: DialogCloseConfirm | null;
25
25
  content$style?: string;
26
26
  closeHandler: () => void;
27
- closeAction: any;
27
+ closeAction?: ButtonAction | null;
28
28
  close?: () => Promise<void>;
29
29
  }, {
30
30
  default: {};
@@ -3,16 +3,18 @@
3
3
 
4
4
  import {onDestroy, onMount} from "svelte";
5
5
  import {initialize} from "./IDialog";
6
- import DialogBox from "./DialogBox.svelte";
6
+
7
+ import {dialogs} from "./Dialogs";
7
8
 
8
9
  export const open = (component: any, params: any) => {
9
- let dialog = {component, params}
10
- params.closeHandler = remove(dialog);
11
- dialogs = [...dialogs, dialog];
10
+ let dialog = {id: (new Date().getTime()).toString(36) ,component, params};
11
+ params.closeHandler = () => {
12
+ dialogs.removeDialog(dialog.id);
13
+ }
14
+ dialogs.showDialog(dialog);
12
15
  }
13
16
 
14
- let dialogs:Array<any> = [];
15
- let board:any;
17
+ let board: any;
16
18
 
17
19
  onMount(() => {
18
20
  document.body.appendChild(board);
@@ -26,20 +28,11 @@
26
28
  board && board.remove();
27
29
  });
28
30
 
29
- const remove = (dialog:any) => () => {
30
- let pos = dialogs.indexOf(dialog);
31
- if (pos > -1) {
32
- dialogs.splice(pos, 1);
33
- dialogs = [...dialogs];
34
- }
35
- }
36
-
37
31
 
38
32
  </script>
39
33
 
40
- <div bind:this={board} class="uniface-dialog-board" style="display: {dialogs.length > 0 ? 'block' : 'none'}">
41
- {#each dialogs as dialog}
42
- <DialogBox closeHandler={remove(dialog)} dialog={dialog.component} params={dialog.params} >
43
- </DialogBox>
34
+ <div bind:this={board} class="uniface-dialog-board" style="display: {$dialogs.length > 0 ? 'block' : 'none'}">
35
+ {#each $dialogs as dialog}
36
+ <svelte:component this={dialog.component} {...dialog.params}></svelte:component>
44
37
  {/each}
45
38
  </div>
@@ -0,0 +1,6 @@
1
+ export declare const dialogs: {
2
+ subscribe: (this: void, run: import("svelte/store").Subscriber<any[]>, invalidate?: () => void) => import("svelte/store").Unsubscriber;
3
+ showDialog(dialog: any): void;
4
+ removeDialog(id: string): void;
5
+ clear(): void;
6
+ };
@@ -0,0 +1,21 @@
1
+ import { writable } from "svelte/store";
2
+ const initialDialogs = [];
3
+ function createDialogStore() {
4
+ const { subscribe, set, update } = writable(initialDialogs);
5
+ return {
6
+ subscribe,
7
+ showDialog(dialog) {
8
+ update(dialogs => {
9
+ const newDialog = { ...dialog };
10
+ return [...dialogs, newDialog];
11
+ });
12
+ },
13
+ removeDialog(id) {
14
+ update(dialogs => dialogs.filter(dialog => dialog.id !== id));
15
+ },
16
+ clear() {
17
+ set([]);
18
+ },
19
+ };
20
+ }
21
+ export const dialogs = createDialogStore();
@@ -2,6 +2,7 @@ import Dialog from "./Dialog.svelte";
2
2
  import DialogBoard from "./DialogBoard.svelte";
3
3
  import type IDialog from "./IDialog";
4
4
  import type { DialogCloseConfirm } from "./DialogCloseConfirm";
5
+ import CommonDialog from "./CommonDialog.svelte";
5
6
  declare global {
6
7
  interface Window {
7
8
  Dialog: IDialog;
@@ -11,3 +12,4 @@ export { type IDialog };
11
12
  export { type DialogCloseConfirm };
12
13
  export { DialogBoard };
13
14
  export default Dialog;
15
+ export { CommonDialog };
@@ -1,6 +1,8 @@
1
1
  import Dialog from "./Dialog.svelte";
2
2
  import DialogBoard from "./DialogBoard.svelte";
3
+ import CommonDialog from "./CommonDialog.svelte";
3
4
  export {};
4
5
  export {};
5
6
  export { DialogBoard };
6
7
  export default Dialog;
8
+ export { CommonDialog };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ticatec/uniface-element",
3
- "version": "0.1.17",
3
+ "version": "0.1.19",
4
4
  "description": "uniface web elements",
5
5
  "scripts": {
6
6
  "dev": "vite dev",
@@ -132,6 +132,10 @@
132
132
  "types": "./dist/dialog/index.d.ts",
133
133
  "import": "./dist/dialog/index.js"
134
134
  },
135
+ "./CommonDialog": {
136
+ "types": "./dist/dialog/CommonDialog.svelte.d.ts",
137
+ "import": "./dist/dialog/CommonDialog.svelte"
138
+ },
135
139
  "./DialogBoard": {
136
140
  "types": "./dist/dialog/DialogBoard.svelte.d.ts",
137
141
  "import": "./dist/dialog/DialogBoard.svelte"
@@ -1,25 +0,0 @@
1
- <script lang="ts">
2
-
3
- import Dialog from "./Dialog.svelte";
4
- import type {ButtonActions} from "../action-bar";
5
- import type {DialogCloseConfirm} from "..";
6
-
7
- export let dialog: any;
8
- export let params: any;
9
- export let closeHandler: () => void;
10
- let actions: ButtonActions = null as unknown as ButtonActions;
11
-
12
- let title: string;
13
-
14
- let instance: any;
15
-
16
- let closeConfirm: DialogCloseConfirm;
17
- let closeAction: any;
18
-
19
-
20
- </script>
21
-
22
- <Dialog bind:this={instance} {title} {closeHandler} {closeConfirm} {actions} {closeAction}>
23
- <svelte:component this={dialog} dialog={instance} bind:title bind:actions bind:closeConfirm bind:closeAction
24
- {...params}></svelte:component>
25
- </Dialog>
@@ -1,22 +0,0 @@
1
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
2
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
3
- $$bindings?: Bindings;
4
- } & Exports;
5
- (internal: unknown, props: Props & {
6
- $$events?: Events;
7
- $$slots?: Slots;
8
- }): Exports & {
9
- $set?: any;
10
- $on?: any;
11
- };
12
- z_$$bindings?: Bindings;
13
- }
14
- declare const DialogBox: $$__sveltets_2_IsomorphicComponent<{
15
- dialog: any;
16
- params: any;
17
- closeHandler: () => void;
18
- }, {
19
- [evt: string]: CustomEvent<any>;
20
- }, {}, {}, string>;
21
- type DialogBox = InstanceType<typeof DialogBox>;
22
- export default DialogBox;