@ticatec/uniface-element 0.1.9

package/dist/attachment-files/FileUploadPanel.svelte

@@ -0,0 +1,130 @@
+<script lang="ts">
+
+    import Button from "../button";
+    import FileUploadBar from "./FileUploadBar.svelte";
+    import UploadFile from "./UploadFile";
+    import {ProgressStatus} from "../progress-bar/ProgressStatus";
+    import {onDestroy, onMount} from "svelte";
+    import type {FileUpload} from "./FileUpload";
+    import utils from "../common/utils";
+    import ModalPopover from "../common/ModalPopover.svelte";
+    import i18n from "../i18nContext";
+
+    export let accept: string = "*/*";
+    export let maxSize: number = 1024 * 1024 * 10;
+    export let maxFiles: number = 1;
+    export let onFileUploaded: (file: UploadFile) => void;
+    export let uploadFile: FileUpload;
+
+    export let canClose: boolean = false;
+    export let visible: boolean = false;
+
+    let btnPickup: string = i18n.getText('uniface.upload.btnPickup', "Pickup files");
+
+    let files: Array<UploadFile> = [];
+    let dropZone: any;
+    let fileInput: any;
+    let interval: any;
+    let busy: boolean = false;
+
+    onMount(async () => {
+        let checkAutoClose:any = null;
+        interval = setInterval(() => {
+            canClose = files.every(item => item.status != ProgressStatus.progressing);
+            if (canClose) {
+                if (files.length == maxFiles) {
+                    visible = !canClose;
+                } else if (files.length > 0 && checkAutoClose == null) {
+                    checkAutoClose = setTimeout(()=> {
+                        visible = !canClose || busy;
+                        files = [];
+                        checkAutoClose = null;
+                    }, 1000);
+                }
+            }
+        }, 100);
+    })
+
+    onDestroy(async () => {
+        clearInterval(interval);
+    })
+
+    const handleDragOver = (e: DragEvent) => {
+        e.preventDefault();
+        busy = true;
+        dropZone.classList.add("highlight");
+    }
+
+    const handleDragLeave = (e: DragEvent) => {
+        e.preventDefault();
+        busy = false;
+        dropZone.classList.remove("highlight");
+    }
+
+    const handleDrop = (e: DragEvent) => {
+        e.preventDefault();
+        dropZone.classList.remove("highlight");
+
+        handleFiles(e.dataTransfer?.files);
+    }
+
+    const handleFiles = (uploadFiles: FileList | undefined) => {
+        if (uploadFiles && uploadFiles.length > 0) {
+            let list = utils.filterFiles(Array.from(uploadFiles), accept);
+            list.forEach(file => {
+                if (file.size <= maxSize && files.length < maxFiles) {
+                    let uf = new UploadFile(file, uploadFile, ()=> {
+                        onFileUploaded?.(uf);
+                    });
+                    files = [...files, uf];
+                }
+            });
+        }
+        busy = false;
+    }
+
+    const showFileDialog = () => {
+        busy = true;
+        fileInput.click();
+    }
+
+    const handleMouseClick = (e: MouseEvent) => {
+        e.stopPropagation();
+    }
+
+    const handleFilePickup = (event: any) => {
+        handleFiles(event.target.files);
+    }
+
+    const removeFile = (file: any) => {
+        let pos = files.findIndex(item => item == file);
+        if (pos > -1) {
+            files.splice(pos, 1);
+            files = [...files];
+        }
+    }
+
+
+    $: canClose = files.length == 0;
+
+
+</script>
+<ModalPopover {canClose} bind:visible>
+    <div class="uniface-file-upload-panel" bind:this={dropZone} on:dragover={handleDragOver} on:dragleave={handleDragLeave}
+         on:drop={handleDrop} on:click={handleMouseClick} aria-hidden="true">
+        <div class="file-upload-contents">
+            <div style="position: absolute; top: 0; width: 0; overflow: hidden">
+                <input bind:this={fileInput} type="file" {accept} multiple={maxFiles > 1} on:change={handleFilePickup}/>
+            </div>
+            <div style="margin-bottom: 8px; flex: 0 0 auto; text-align: center">
+                <Button type="primary" disabled={files.length >= maxFiles} icon="uniface-icon-upload" label={btnPickup}
+                        onClick={showFileDialog}></Button>
+            </div>
+            <div style="flex: 1 1 auto; overflow: auto; padding: 0 24px">
+                {#each files as file}
+                    <FileUploadBar {file} removeFile={removeFile}/>
+                {/each}
+            </div>
+        </div>
+    </div>
+</ModalPopover>

package/dist/attachment-files/FileUploadPanel.svelte.d.ts

@@ -0,0 +1,28 @@
+import UploadFile from "./UploadFile";
+import type { FileUpload } from "./FileUpload";
+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> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const FileUploadPanel: $$__sveltets_2_IsomorphicComponent<{
+    accept?: string;
+    maxSize?: number;
+    maxFiles?: number;
+    onFileUploaded: (file: UploadFile) => void;
+    uploadFile: FileUpload;
+    canClose?: boolean;
+    visible?: boolean;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type FileUploadPanel = InstanceType<typeof FileUploadPanel>;
+export default FileUploadPanel;

package/dist/attachment-files/UploadFile.d.ts

@@ -0,0 +1,43 @@
+import { ProgressStatus } from "../progress-bar/ProgressStatus";
+import type { FileUpload } from "./FileUpload";
+export type OnCompleted = (file: File, url: string, thumbnail?: string) => void;
+export type UpdateStatus = () => void;
+export default class UploadFile {
+    /**
+     * 待上传的文件
+     */
+    readonly file: File;
+    /**
+     * 上传后的文件地址
+     */
+    private _url;
+    /**
+     * 上传的缩率图
+     * @private
+     */
+    private _thumbnail;
+    /**
+     * 状态
+     */
+    private _status;
+    /**
+     * 已经上传的字节数
+     */
+    private _uploadedBytes;
+    /**
+     * 上传的实例
+     */
+    private loader?;
+    private readonly onCompleted;
+    private readonly uploadFile;
+    private updateStatus;
+    constructor(file: File, uploadFile: FileUpload, onCompleted: OnCompleted);
+    private startUploading;
+    restart(): void;
+    get url(): string | null;
+    get thumbnail(): string | undefined | null;
+    get status(): ProgressStatus;
+    get progress(): number;
+    cancel(): Promise<boolean>;
+    setUpdateStatus(value: UpdateStatus): void;
+}

package/dist/attachment-files/UploadFile.js

@@ -0,0 +1,80 @@
+import { ProgressStatus } from "../progress-bar/ProgressStatus";
+export default class UploadFile {
+    /**
+     * 待上传的文件
+     */
+    file;
+    /**
+     * 上传后的文件地址
+     */
+    _url = null;
+    /**
+     * 上传的缩率图
+     * @private
+     */
+    _thumbnail = null;
+    /**
+     * 状态
+     */
+    _status = ProgressStatus.progressing;
+    /**
+     * 已经上传的字节数
+     */
+    _uploadedBytes = 0;
+    /**
+     * 上传的实例
+     */
+    loader;
+    onCompleted;
+    uploadFile;
+    updateStatus = null;
+    constructor(file, uploadFile, onCompleted) {
+        this.file = file;
+        this.uploadFile = uploadFile;
+        this.onCompleted = onCompleted;
+        this.loader = this.startUploading();
+    }
+    startUploading() {
+        return this.uploadFile(this.file, (bytes) => {
+            this._uploadedBytes = bytes;
+            this.updateStatus?.();
+        }, (url, thumbnail) => {
+            this._url = url;
+            this._thumbnail = thumbnail;
+            this._status = ProgressStatus.successful;
+            this.onCompleted(this.file, url);
+            this.updateStatus?.();
+        }, (e) => {
+            this._status = ProgressStatus.failure;
+            this.updateStatus?.();
+        });
+    }
+    restart() {
+        this._status = ProgressStatus.progressing;
+        this.loader = this.startUploading();
+        this.updateStatus?.();
+    }
+    get url() {
+        return this._url;
+    }
+    get thumbnail() {
+        return this._thumbnail;
+    }
+    get status() {
+        return this._status;
+    }
+    get progress() {
+        return Math.round(this._uploadedBytes * 100 / this.file.size);
+    }
+    async cancel() {
+        let result = this.loader != null ? await this.loader.cancel() : true;
+        if (result) {
+            this._status = ProgressStatus.canceled;
+            this.updateStatus?.();
+        }
+        return result;
+    }
+    setUpdateStatus(value) {
+        this.updateStatus = value;
+    }
+}

package/dist/attachment-files/excel.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><svg height="24" version="1.1" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><g transform="translate(0 -1028.4)"><path d="m5 1030.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#95a5a6"/><path d="m5 1029.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#bdc3c7"/><rect fill="#1abc9c" height="14" transform="translate(0 1028.4)" width="2" x="7" y="5"/><path d="m7 4c-0.5523 0-1 0.4477-1 1v2 1 2 1 2 1 2 1 2c0 0.552 0.4477 1 1 1h2 1 3 1 3c0.552 0 1-0.448 1-1v-2-1-2-3-3-1-2c0-0.5523-0.448-1-1-1h-3-1-4-2zm0 1h2v2h-2v-2zm3 0h3v2h-3v-2zm4 0h3v2h-3v-2zm-7 3h2v2h-2v-2zm3 0h3v2h-3v-2zm4 0h3v2h-3v-2zm-7 3h2v2h-2v-2zm3 0h3v2h-3v-2zm4 0h3v2h-3v-2zm-7 3h2v2h-2v-2zm3 0h3v2h-3v-2zm4 0h3v2h-3v-2zm-7 3h2v2h-2v-2zm3 0h3v2h-3v-2zm4 0h3v2h-3v-2z" fill="#16a085" transform="translate(0 1028.4)"/><path d="m21 1035.4-6-6v4c0 1.1 0.895 2 2 2h4z" fill="#95a5a6"/></g></svg>

package/dist/attachment-files/file.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><svg height="24" version="1.1" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><g transform="translate(0 -1028.4)"><path d="m5 1030.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#95a5a6"/><path d="m5 1029.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#bdc3c7"/><path d="m21 1035.4-6-6v4c0 1.1 0.895 2 2 2h4z" fill="#95a5a6"/></g></svg>

package/dist/attachment-files/image.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><svg height="24" version="1.1" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><g transform="translate(0 -1028.4)"><path d="m5 1030.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4-4c0-1.1-0.895-2-2-2h-4-10z" fill="#95a5a6"/><path d="m5 1c-1.1046 0-2 0.8954-2 2v8 4 6c0 1.105 0.8954 2 2 2h14c1.105 0 2-0.895 2-2v-6-4-4-4c0-1.1046-0.895-2-2-2h-4-10z" fill="#bdc3c7" transform="translate(0 1028.4)"/><rect fill="#f39c12" height="14" transform="translate(0 1028.4)" width="14" x="5" y="3"/><path d="m16 11a4 4 0 1 1 -8 0 4 4 0 1 1 8 0z" fill="#f1c40f" transform="translate(0 1030.4)"/><rect fill="#3498db" height="3" width="14" x="5" y="1042.4"/></g></svg>

package/dist/attachment-files/index.d.ts

@@ -0,0 +1,10 @@
+import AttachmentFilesField from "./AttachmentFilesField.svelte";
+import type AttachmentFile from "./AttachmentFile";
+import type { ErrorHandler, ProgressUpdate, UploadProgress, OnUploaded, FileUpload } from "./FileUpload";
+export default AttachmentFilesField;
+export { type AttachmentFile };
+export { type ErrorHandler };
+export { type ProgressUpdate };
+export { type UploadProgress };
+export { type OnUploaded };
+export { type FileUpload };

package/dist/attachment-files/index.js

@@ -0,0 +1,8 @@
+import AttachmentFilesField from "./AttachmentFilesField.svelte";
+export default AttachmentFilesField;
+export {};
+export {};
+export {};
+export {};
+export {};
+export {};

package/dist/attachment-files/pdf.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><svg height="24" version="1.1" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><g transform="translate(0 -1028.4)"><g><path d="m5 1030.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#c0392b"/><path d="m5 1029.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#e74c3c"/><path d="m21 1035.4-6-6v4c0 1.1 0.895 2 2 2h4z" fill="#c0392b"/></g><path d="m19.112 1039.4h-0.29c-0.09 0.1-0.601 0.8-0.822 1-0.06 0.1-0.15 0.2-0.201 0.2-0.743 0.9-2.323 2.4-3.271 3.2-0.124 0.1-0.244 0.2-0.266 0.2-0.066 0.1-0.698 0.5-0.982 0.7-0.905 0.6-1.967 1.1-2.792 1.3-1.6281 0.4-2.8984 0.3-4.5476-0.5-0.4984-0.2-1.2085-0.6-1.5978-0.9-0.382-0.3-0.3417-0.3-0.3411 0.2v0.5l0.2578 0.1c0.3307 0.2 1.0445 0.6 1.5099 0.8 0.3546 0.2 0.4651 0.3 0.2667 0.3-0.1828-0.1-1.2202-0.1-1.6188 0h-0.4c-0.0092 0-0.0167 0.2-0.0167 0.4v0.4h0.1333c0.5736-0.2 1.8047-0.2 2.3778-0.1 0.6748 0.1 1.1496 0.2 1.7199 0.5 1.0881 0.5 1.9906 1.5 2.3836 2.5l0.08 0.2h0.44 0.44l-0.024-0.1c-0.141-0.6-0.537-1.3-1.027-1.8-0.322-0.4-0.8907-0.8-1.1148-1h-0.0756c-0.0364-0.1-0.4165-0.3-0.5789-0.3-0.0924-0.1-0.1677-0.1-0.1677-0.1 0-0.1 0.07-0.1 0.1555 0 0.2135 0 1.0733-0.1 1.4625-0.2 1.078-0.2 2.098-0.6 3.129-1.2 0.37-0.2 1.21-0.9 1.546-1.1 0.25-0.3 0.33-0.3 0.228-0.2-0.036 0.1-0.105 0.2-0.155 0.3-0.049 0.1-0.135 0.2-0.19 0.3-0.778 1.2-1.277 2.7-1.412 4.4-0.019 0.3-0.035 0.6-0.035 0.7v0.3h2.332 2.332l-0.076-0.1c-0.42-0.6-0.941-1.9-1.116-2.8-0.144-0.7-0.187-1.8-0.097-2.4 0.262-1.6 1.155-3 2.689-3.9 0.158-0.1 0.362-0.2 0.453-0.3l0.167-0.1v-0.3c0-0.2-0.012-0.4-0.027-0.4-0.364 0.2-1.174 0.7-1.546 0.9-0.199 0.2-0.211 0.2-0.024 0 0.268-0.3 0.73-0.8 1.221-1.4l0.229-0.2h-0.501-0.24z" fill="#ecf0f1"/></g></svg>

package/dist/attachment-files/ppt.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><svg height="24" version="1.1" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><g transform="translate(0 -1028.4)"><path d="m5 1030.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#95a5a6"/><path d="m5 1029.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#bdc3c7"/><path d="m15 1039.4v4h4c0-2.2-1.791-4-4-4z" fill="#e67e22"/><path d="m14 1040.4c-2.209 0-4 1.8-4 4s1.791 4 4 4 4-1.8 4-4h-4v-4z" fill="#d35400"/><g fill="#95a5a6"><rect height="1" width="12" x="6" y="1034.4"/><rect height="2" width="3" x="6" y="1040.4"/><rect height="2" width="3" x="6" y="1043.4"/><rect height="2" width="3" x="6" y="1046.4"/><rect height="1" width="12" x="6" y="1036.4"/><path d="m21 1035.4-6-6v4c0 1.1 0.895 2 2 2h4z"/></g></g></svg>

package/dist/attachment-files/sound.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><svg height="24" version="1.1" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><g transform="translate(0 -1028.4)"><path d="m5 1030.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#95a5a6"/><path d="m5 1029.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#bdc3c7"/><g fill="#3498db"><path d="m16.996 1035.1v8.8c0 0.2-0.088 0.5-0.266 0.7-0.177 0.2-0.401 0.3-0.671 0.4-0.271 0.1-0.542 0.2-0.813 0.3-0.266 0-0.516 0.1-0.75 0.1s-0.487-0.1-0.758-0.1c-0.265-0.1-0.534-0.2-0.804-0.3-0.271-0.1-0.495-0.2-0.672-0.4s-0.266-0.5-0.266-0.7c0-0.3 0.089-0.5 0.266-0.7s0.401-0.4 0.672-0.5c0.27-0.1 0.539-0.2 0.804-0.3h0.758c0.547 0 1.047 0.1 1.5 0.3v-4.2l-5.9999 1.8v5.6c0 0.2-0.0886 0.5-0.2656 0.7-0.1771 0.2-0.4011 0.3-0.6719 0.4s-0.5417 0.2-0.8125 0.3c-0.2656 0-0.5156 0.1-0.75 0.1s-0.487-0.1-0.7578-0.1c-0.2656-0.1-0.5339-0.2-0.8047-0.3s-0.4948-0.2-0.6719-0.4-0.2656-0.5-0.2656-0.7c0-0.3 0.0885-0.5 0.2656-0.7s0.4011-0.4 0.6719-0.5 0.5391-0.2 0.8047-0.3h0.7578c0.5469 0 1.0469 0.1 1.5 0.3v-7.6c0-0.1 0.0495-0.3 0.1484-0.4 0.099-0.2 0.2266-0.3 0.3828-0.3l6.4997-2h0.219c0.208 0 0.385 0 0.531 0.2 0.146 0.1 0.219 0.3 0.219 0.5" fill="#3498db"/></g><path d="m21 1035.4-6-6v4c0 1.1 0.895 2 2 2h4z" fill="#95a5a6"/></g></svg>

package/dist/attachment-files/video.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><svg height="24" version="1.1" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><g transform="translate(0 -1028.4)"><path d="m2 20v1c0 1.105 0.8954 2 2 2h2 12 2c1.105 0 2-0.895 2-2v-1h-20z" fill="#c0392b" transform="translate(0 1028.4)"/><g fill="#e74c3c"><rect height="6" width="12" x="6" y="1044.4"/><rect height="7" width="12" x="6" y="1029.4"/><rect height="10" width="12" x="6" y="1035.4"/><rect height="21" transform="translate(0 1028.4)" width="12" x="6" y="1"/></g><path d="m5 22 0.3397-20.196 17.32 10.392z" fill="#ecf0f1" transform="matrix(.28312 0 0 .29709 8.5844 1036.8)"/><path d="m4 1029.4c-1.1046 0-2 0.9-2 2v3 11 3c0 1.1 0.8954 2 2 2h2v-3-15-3h-2zm-0.5 2h1c0.2761 0 0.5 0.2 0.5 0.5v1c0 0.2-0.2239 0.5-0.5 0.5h-1c-0.2761 0-0.5-0.3-0.5-0.5v-1c0-0.3 0.2239-0.5 0.5-0.5zm0 3h1c0.2761 0 0.5 0.2 0.5 0.5v1c0 0.2-0.2239 0.5-0.5 0.5h-1c-0.2761 0-0.5-0.3-0.5-0.5v-1c0-0.3 0.2239-0.5 0.5-0.5zm0 3h1c0.2761 0 0.5 0.2 0.5 0.5v1c0 0.2-0.2239 0.5-0.5 0.5h-1c-0.2761 0-0.5-0.3-0.5-0.5v-1c0-0.3 0.2239-0.5 0.5-0.5zm0 3h1c0.2761 0 0.5 0.2 0.5 0.5v1c0 0.2-0.2239 0.5-0.5 0.5h-1c-0.2761 0-0.5-0.3-0.5-0.5v-1c0-0.3 0.2239-0.5 0.5-0.5zm0 3h1c0.2761 0 0.5 0.2 0.5 0.5v1c0 0.2-0.2239 0.5-0.5 0.5h-1c-0.2761 0-0.5-0.3-0.5-0.5v-1c0-0.3 0.2239-0.5 0.5-0.5zm0 3h1c0.2761 0 0.5 0.2 0.5 0.5v1c0 0.2-0.2239 0.5-0.5 0.5h-1c-0.2761 0-0.5-0.3-0.5-0.5v-1c0-0.3 0.2239-0.5 0.5-0.5z" fill="#c0392b"/><path d="m20 1029.4c1.105 0 2 0.9 2 2v3 11 3c0 1.1-0.895 2-2 2h-2v-3-15-3h2zm0.5 2h-1c-0.276 0-0.5 0.2-0.5 0.5v1c0 0.2 0.224 0.5 0.5 0.5h1c0.276 0 0.5-0.3 0.5-0.5v-1c0-0.3-0.224-0.5-0.5-0.5zm0 3h-1c-0.276 0-0.5 0.2-0.5 0.5v1c0 0.2 0.224 0.5 0.5 0.5h1c0.276 0 0.5-0.3 0.5-0.5v-1c0-0.3-0.224-0.5-0.5-0.5zm0 3h-1c-0.276 0-0.5 0.2-0.5 0.5v1c0 0.2 0.224 0.5 0.5 0.5h1c0.276 0 0.5-0.3 0.5-0.5v-1c0-0.3-0.224-0.5-0.5-0.5zm0 3h-1c-0.276 0-0.5 0.2-0.5 0.5v1c0 0.2 0.224 0.5 0.5 0.5h1c0.276 0 0.5-0.3 0.5-0.5v-1c0-0.3-0.224-0.5-0.5-0.5zm0 3h-1c-0.276 0-0.5 0.2-0.5 0.5v1c0 0.2 0.224 0.5 0.5 0.5h1c0.276 0 0.5-0.3 0.5-0.5v-1c0-0.3-0.224-0.5-0.5-0.5zm0 3h-1c-0.276 0-0.5 0.2-0.5 0.5v1c0 0.2 0.224 0.5 0.5 0.5h1c0.276 0 0.5-0.3 0.5-0.5v-1c0-0.3-0.224-0.5-0.5-0.5z" fill="#c0392b"/></g></svg>

package/dist/attachment-files/word.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><svg height="24" version="1.1" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><g transform="translate(0 -1028.4)"><path d="m5 1030.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#95a5a6"/><path d="m5 1029.4c-1.1046 0-2 0.9-2 2v8 4 6c0 1.1 0.8954 2 2 2h14c1.105 0 2-0.9 2-2v-6-4-4l-6-6h-10z" fill="#bdc3c7"/><path d="m21 1035.4-6-6v4c0 1.1 0.895 2 2 2h4z" fill="#95a5a6"/><rect fill="#3498db" height="1" width="6" x="12" y="1038.4"/><path d="m5 1034.4 1.4688 5h1.0312l1.0312-3.5 1.0313 3.5h1.0315l1.468-5h-1l-0.968 3.2-0.969-3.2h-1.1562l-0.9688 3.2-0.9688-3.2h-1.0312z" fill="#2980b9"/><g fill="#3498db"><rect height="1" width="12" x="6" y="1041.4"/><rect height="1" width="12" x="6" y="1044.4"/><rect height="1" width="12" x="6" y="1047.4"/></g></g></svg>

package/dist/base-calendar/CalendarBase.svelte

@@ -0,0 +1,116 @@
+<script lang="ts">
+    import MonthlyCalendar from "./MonthlyCalendar.svelte";
+    import dateUtils, {type UniDate} from "./dateUtils";
+    import DateContext from "./DateContext";
+    import dayjs from "dayjs";
+    import {onMount} from "svelte";
+    import MonthPickupPanel from "./MonthPickupPanel.svelte";
+    import YearPickupPanel from "./YearPickupPanel.svelte";
+    import type {OnSelectHandler} from "../common/OnSelectHandler";
+
+    const dateCtx: DateContext = DateContext.getInstance();
+    export let value: UniDate;
+    export let min: UniDate = null;
+    export let max: UniDate = null;
+    export let weekTitle: Array<string> | null = null;
+    export let monthTitle: Array<string> | null = null;
+    export let weekBegin: number | null = null;
+    export let style: string = '';
+    export let cellWidth: number = 32;
+    export let cellHeight: number = 32;
+    export let border: boolean = false;
+    export let dailyContent: any = null;
+    export let onSelect:OnSelectHandler<dayjs.Dayjs> = null as unknown as OnSelectHandler<dayjs.Dayjs>;
+
+    let dv: dayjs.Dayjs | null;
+    let year: number;
+    let month: number;
+    let date: number;
+    let minDate: any;
+    let maxDate: any;
+    let showMonths: boolean = false;
+    let showYears: boolean = false;
+    let oldValue: any;
+
+    const onSelectDate = (date: dayjs.Dayjs) => {
+        value = date;
+        onSelect(value);
+    }
+
+    const pickupMonth = () => {
+        showMonths = true;
+        showYears = false;
+    }
+
+    const adjustMonth = (n: number) => (e: Event) => {
+        month = month + n;
+        if (month > 11) {
+            year = year + 1;
+            month = 0;
+        } else if (month < 0) {
+            year = year - 1;
+            month = 11;
+        }
+    }
+
+    const pickupYear = () => {
+        showMonths = false;
+        showYears = true;
+    }
+
+    const extractYMD = (v: dayjs.Dayjs | null) => {
+        if (v != null) {
+            year = v.year();
+            month = v.month();
+            date = v.date();
+        }
+    }
+
+    onMount(() => {
+        if (value == null) {
+            extractYMD(dayjs())
+        }
+    })
+
+    $: dv = dateUtils.toDayjs(value);
+
+    $: if (oldValue != dv) {
+        oldValue = dv;
+        extractYMD(dv)
+    }
+
+    $: {
+        minDate = dateUtils.toDayjs(min);
+        maxDate = dateUtils.toDayjs(max);
+    }
+
+</script>
+<div class="uniface-calendar" class:border style="{style}; width: {cellWidth*7}px">
+    <div>
+        <div class="uniface-title-bar">
+            <div class="action-icon" on:click={adjustMonth(-1)} aria-hidden="true">
+                <i class="uniface-icon-chevron-left"></i>
+            </div>
+            <div style="flex: 1 1 auto; text-align: center">
+                <span class="title-text" on:click={pickupYear} aria-hidden="true">{year}</span>
+                <span class="title-text" on:click={pickupMonth} aria-hidden="true">{month + 1}</span>
+            </div>
+            <div class="action-icon" on:click={adjustMonth(1)} aria-hidden="true">
+                <i class="uniface-icon-chevron-right"></i>
+            </div>
+        </div>
+        <div style="flex: 1 1 auto; overflow: hidden">
+            <MonthlyCalendar weekBegin={weekBegin??dateCtx.weekBegin} weekTitle={weekTitle??dateCtx.weekTitleAbbr}
+                             {cellWidth} {cellHeight} {dailyContent} min={minDate} max={maxDate}
+                             value={dv} {year} {month} {date} onSelect={onSelectDate}/>
+            {#if showMonths}
+                <MonthPickupPanel bind:value={month} months={monthTitle??dateCtx.monthsAbbr??dateCtx.months}
+                                  onClick={()=>{showMonths=false}}/>
+            {:else if showYears}
+                <YearPickupPanel bind:year maxYear={maxDate==null ? null : maxDate.year()}
+                                 minYear={minDate==null ? null : minDate.year()}
+                                 onClick={()=>{showYears=false}}/>
+            {/if}
+        </div>
+    </div>
+</div>

package/dist/base-calendar/CalendarBase.svelte.d.ts

@@ -0,0 +1,34 @@
+import { type UniDate } from "./dateUtils";
+import dayjs from "dayjs";
+import type { OnSelectHandler } from "../common/OnSelectHandler";
+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> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const CalendarBase: $$__sveltets_2_IsomorphicComponent<{
+    value: UniDate;
+    min?: UniDate;
+    max?: UniDate;
+    weekTitle?: Array<string> | null;
+    monthTitle?: Array<string> | null;
+    weekBegin?: number | null;
+    style?: string;
+    cellWidth?: number;
+    cellHeight?: number;
+    border?: boolean;
+    dailyContent?: any;
+    onSelect?: OnSelectHandler<dayjs.Dayjs>;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type CalendarBase = InstanceType<typeof CalendarBase>;
+export default CalendarBase;

package/dist/base-calendar/CalendarDay.d.ts

@@ -0,0 +1,7 @@
+export interface CalendarDay {
+    y: number;
+    m: number;
+    d: number;
+    isToday: boolean;
+    disabled: boolean;
+}

package/dist/base-calendar/CalendarDay.js

@@ -0,0 +1 @@
+export {};

package/dist/base-calendar/DateContext.d.ts

@@ -0,0 +1,27 @@
+declare const i18nDateString: any;
+export { i18nDateString };
+export default class DateContext {
+    private _months;
+    private _monthsAbbr;
+    private _weekTitle;
+    private _weekTitleAbbr;
+    private _weekBegin;
+    private _dateFmt;
+    private _timeFmt;
+    private _confirmText;
+    private static instance;
+    private constructor();
+    static getInstance(): DateContext;
+    static initialize(res: any): DateContext;
+    get months(): Array<string>;
+    get monthsAbbr(): Array<string>;
+    get weekTitle(): Array<string>;
+    get weekTitleAbbr(): Array<string>;
+    set weekBegin(value: number);
+    get weekBegin(): number;
+    set dateFormat(value: string);
+    get dateFormat(): string;
+    set timeFormat(value: string);
+    get timeFormat(): string;
+    get confirmText(): string;
+}

package/dist/base-calendar/DateContext.js

@@ -0,0 +1,109 @@
+const i18nDateString = {
+    zh: {
+        months: [
+            '一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'
+        ],
+        monthsAbbr: [
+            '一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'
+        ],
+        weekTitle: [
+            "日", "一", "二", "三", "四", "五", "六"
+        ],
+        confirmText: "确认"
+    },
+    en: {
+        months: [
+            'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'
+        ],
+        monthsAbbr: [
+            'Jan', 'Feb', 'Mar', 'Api', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'
+        ],
+        weekTitle: [
+            "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"
+        ],
+        weekTitleAbbr: [
+            "Sun", "Mon", "Tue", "Wed", "Thr", "Fri", "Sat"
+        ],
+        confirmText: "OK"
+    },
+    fr: {
+        months: [
+            'Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre'
+        ],
+        monthsAbbr: [
+            'Jan', 'Fév', 'Mar', 'Avr', 'Mai', 'Juin', 'Juil', 'Août', 'Sept', 'Oct', 'Nov', 'Déc'
+        ],
+        weekTitle: [
+            "Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"
+        ],
+        weekTitleAbbr: [
+            "Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam"
+        ],
+        confirmText: "OK"
+    }
+};
+export { i18nDateString };
+export default class DateContext {
+    _months;
+    _monthsAbbr;
+    _weekTitle;
+    _weekTitleAbbr;
+    _weekBegin = 1;
+    _dateFmt = "YYYY-MM-DD";
+    _timeFmt = "HH:mm:ss";
+    _confirmText = 'OK';
+    static instance;
+    constructor(res) {
+        this._months = res.months;
+        this._monthsAbbr = res.monthsAbbr ?? res.months;
+        this._weekTitle = res.weekTitle;
+        this._weekTitleAbbr = res.weekTitleAbbr ?? res.weekTitle;
+        this._confirmText = res.confirmText ?? 'OK';
+    }
+    static getInstance() {
+        if (DateContext.instance == null) {
+            DateContext.instance = new DateContext(i18nDateString.en);
+        }
+        return DateContext.instance;
+    }
+    static initialize(res) {
+        DateContext.instance = new DateContext(res || i18nDateString.en);
+        return DateContext.instance;
+    }
+    get months() {
+        return [...this._months];
+    }
+    get monthsAbbr() {
+        return [...this._monthsAbbr];
+    }
+    get weekTitle() {
+        return [...this._weekTitle];
+    }
+    get weekTitleAbbr() {
+        return [...this._weekTitleAbbr];
+    }
+    set weekBegin(value) {
+        if (value < 0 || value > 6) {
+            throw new Error('Invalid value');
+        }
+        this._weekBegin = value;
+    }
+    get weekBegin() {
+        return this._weekBegin;
+    }
+    set dateFormat(value) {
+        this._dateFmt = value;
+    }
+    get dateFormat() {
+        return this._dateFmt;
+    }
+    set timeFormat(value) {
+        this._timeFmt = value;
+    }
+    get timeFormat() {
+        return this._timeFmt;
+    }
+    get confirmText() {
+        return this._confirmText;
+    }
+}