bt-core-app 1.4.1 → 1.4.3

package/src/components/Dialog-Select-Date.vue

@@ -1,89 +0,0 @@
-<template>
-    <v-dialog v-model="show">
-        <div>
-            <v-card
-                :max-width="maxWidth ?? '400'"
-                :min-width="minWidth"
-                class="mx-auto"
-                :title="title">
-                <v-card-text class="pa-0">
-                    <VueDatePicker
-                        auto-apply
-                        dark
-                        :enable-time-picker="useTime"
-                        inline
-                        :is-24="false"
-                        :model-auto="range"
-                        :range="range"
-                        :time-picker-inline="!range && useTime"
-                        :timezone="timeZone"
-                        utc
-                        v-bind="$attrs"
-                        v-model="date" />
-                </v-card-text>
-                <v-card-actions>
-                    <v-row no-gutters>
-                        <v-col cols="6">
-                            <v-btn v-if="required !== true" block @click="cancel">{{ cancelText ?? 'Cancel' }}</v-btn>
-                        </v-col>
-                        <v-col cols="6">
-                            <v-btn block @click="accept" :disabled="!canAccept">{{ confirmText ?? 'OK' }}</v-btn>
-                        </v-col>
-                    </v-row>
-                </v-card-actions>
-            </v-card>
-        </div>
-    </v-dialog>
-</template>
-  
-<script setup lang="ts">
-    import { computed, onMounted, ref } from 'vue'
-    import VueDatePicker from '@vuepic/vue-datepicker'
-    import '@vuepic/vue-datepicker/dist/main.css'
-    import { useAuth } from '../composables/auth'
-    import { type SelectDateProps } from '../composables/dialogs'
-
-    const props = withDefaults(defineProps<SelectDateProps>(), {
-        cancelValue: false,
-        height: '400'
-    })
-
-    const emit = defineEmits(['confirm', 'cancel'])
-    const date = ref()
-    const { timeZone } = useAuth()
-
-    const canAccept = computed(() => {
-        return !props.required || date.value
-    })
-
-    let show = false
-
-    function accept() {
-        if (props.required && !date.value) {
-            //required
-            return
-        }
-
-        show = false
-        emit('confirm', date.value)
-    }
-
-    // function maybeAccept(items: any) {
-    //     if (!props.multiple) {
-    //         if (isArrayOfLength(items, 1) || (props.canUnselect && !isLengthyArray(items))) {
-    //             show = false
-    //             emit('confirm', getSelectedValues(items))
-    //         }
-    //     }
-    // }
-
-    function cancel() {
-        show = false
-        emit('cancel', undefined)
-    }
-
-    onMounted(() => {
-        show = true
-    })
-
-</script>

package/src/components/Dialog-Select.vue

@@ -1,140 +0,0 @@
-<template>
-    <v-dialog v-model="show">
-        <div>
-            <v-card
-                :max-width="maxWidth ?? '400'"
-                :min-width="minWidth"
-                class="mx-auto"
-                :title="title">
-                <!-- <v-card-title v-if="title != null">{{ title }}</v-card-title> -->
-                <v-card-text class="pa-0">
-                    <v-text-field
-                        v-if="ui.showSearch.value"
-                        append-inner-icon="mdi-magnify"
-                        density="compact"
-                        hide-details
-                        placeholder="Search"
-                        v-model="ui.searchString.value" />
-                    <!-- <div v-if="multiple" @click="selectAll" class="text-center my-1">
-                        <v-btn>Select All</v-btn>
-                    </div> -->
-                    <v-list v-if="isLengthyArray(ui.filteredItems.value)"
-                        class="overflow-y-auto"
-                        v-model:selected="selection"
-                        :height="height"
-                        :select-strategy="multiple ? 'independent' : 'single-independent'"
-                        @update:selected="maybeAccept">
-                        <template v-for="(fItem) in ui.filteredItems.value" :key="index">
-                            <v-list-item :value="fItem">
-                                <slot v-bind:item="fItem">
-                                    <v-list-item-title v-if="itemText != null || textFilter != null || textFunction != null">
-                                        {{ displayTitle(fItem) }}
-                                    </v-list-item-title>
-                                    <v-list-item-subtitle v-if="itemSubtext != null || subtextFilter != null || subtextFunction != null">
-                                        {{ displaySubtitle(fItem) }}
-                                    </v-list-item-subtitle>
-                                </slot>
-                            </v-list-item>
-                            </template>
-                    </v-list>
-                </v-card-text>
-                <v-card-actions>
-                    <v-row no-gutters>
-                        <v-col :cols="multiple ? 6 : 12">
-                            <v-btn v-if="required !== true" block @click="cancel">{{ cancelText ?? 'Cancel' }}</v-btn>
-                        </v-col>
-                        <v-col v-if="multiple == true" cols="6">
-                            <v-btn block @click="accept" :disabled="!canAccept">{{ confirmText ?? 'OK' }}</v-btn>
-                        </v-col>
-                        
-                    </v-row>
-                </v-card-actions>
-                <v-overlay 
-                    v-model="ui.isLoading.value"
-                    class="align-center justify-center text-center"
-                    contained
-                    persistent>
-                    <v-progress-circular indeterminate />
-                    <p>{{ ui.loadingMsg }}</p>
-                </v-overlay>
-            </v-card>
-        </div>
-    </v-dialog>
-</template>
-  
-<script setup lang="ts">
-    import { computed, onMounted, ref } from 'vue';
-    import { isLengthyArray, isArrayOfLength, nestedValue } from '../composables/helpers'
-    import { useFilters } from '../composables/filters'
-    import { useList } from '../composables/list';
-    import { type SelectDialogProps } from '../composables/dialogs'
-    
-    const props = withDefaults(defineProps<SelectDialogProps>(), {
-        cancelValue: false,
-        height: '400',
-        showSearch: true
-    })
-
-    const emit = defineEmits(['confirm', 'cancel'])
-
-    const ui = useList(props)
-    const filters = useFilters()
-    const selection = ref([])
-
-    const displaySubtitle = computed(() => (item: any) => {
-        let v = props.subtextFunction != null ? props.subtextFunction(item) : item
-        v = props.itemSubtext != null ? nestedValue(v, props.itemSubtext) : v
-        return props.subtextFilter != null ? filters.findFilter(props.subtextFilter)(v) : v
-    })
-
-    const displayTitle = computed(() => (item: any) => {
-        let v = props.textFunction != null ? props.textFunction(item) : item
-        v = props.itemText != null ? nestedValue(v, props.itemText) : v
-        return props.textFilter != null ? filters.findFilter(props.textFilter)(v) : v
-    })
-
-    const canAccept = computed(() => {
-        return !props.required || isLengthyArray(selection.value)
-    })
-
-    let show = false
-
-    function getSelectedValues(items: any) {
-        const res = props.itemValue != null ? items.map((x: any) => nestedValue(x, props.itemValue)) : items
-        if (props.multiple) {
-            return res
-        }
-        else {
-            return res.length > 0 ? res[0] : null
-        }
-    }
-    
-    function accept() {
-        if (props.required && !isLengthyArray(selection.value)) {
-            //required
-            return
-        }
-
-        show = false
-        emit('confirm', getSelectedValues(selection.value))
-    }
-
-    function maybeAccept(items: any) {
-        if (!props.multiple) {
-            if (isArrayOfLength(items, 1) || (props.canUnselect && !isLengthyArray(items))) {
-                show = false
-                emit('confirm', getSelectedValues(items))
-            }
-        }
-    }
-
-    function cancel() {
-        show = false
-        emit('cancel', undefined)
-    }
-
-    onMounted(() => {
-        show = true
-    })
-
-</script>

package/src/components/Dialog-Text.vue

@@ -1,59 +0,0 @@
-<template>
-    <v-dialog v-model="show">
-        <div>
-            <v-card :max-width="maxWidth ?? '400'" :min-width="minWidth" :title="title" class="mx-auto">
-                <v-card-text>
-                    <v-text-field
-                        :label="label"
-                        v-model="mVal" />
-                    <div class="text-h6">{{ msg }}</div>
-                </v-card-text>
-                <v-card-actions>
-                    <v-btn @click="cancel">{{ cancelText ?? 'Cancel' }}</v-btn>
-                    <v-btn @click="confirm" :disabled="!canAccept">{{ confirmText ?? 'Done' }}</v-btn>
-                </v-card-actions>
-            </v-card>
-        </div>
-    </v-dialog>
-</template>
-  
-<script setup lang="ts">
-    import { computed, onMounted, ref } from 'vue';
-    import { type TextDialogProps } from '../composables/dialogs'
-    
-
-    const props = withDefaults(defineProps<TextDialogProps>(), {
-        height: '400'
-    })
-
-    const emit = defineEmits(['confirm', 'cancel'])
-    
-    const canAccept = computed(() => {
-        return !props.required || mVal.value != null
-    })
-
-    let show = false
-
-    const mVal = ref(props.value)
-
-    function confirm() {
-        if (props.required && mVal.value == null) {
-            //required
-            return
-        }
-
-        show = false
-        
-        emit('confirm', mVal.value)
-    }
-
-    function cancel() {
-        show = false
-        emit('cancel', undefined)
-    }
-
-    onMounted(() => {
-        show = true
-    })
-
-</script>

package/src/composables/actions-tracker.ts

@@ -1,99 +0,0 @@
-import { computed, ref, shallowRef } from 'vue'
-import type { ShallowRef, Ref } from 'vue'
-import { useConfirmAsync } from '../composables/dialogs'
-import { watchArray } from '@vueuse/core'
-import { useId } from '../composables/id'
-
-interface LoadingMsg {
-    id: string,
-    msg: string
-}
-
-export interface DoActionOptions {
-    completionMsg?: string
-    confirmationMsg?: string
-    errorMsg?: string
-    loadingMsg?: string
-    requireConfirmation?: boolean,
-    throwError?: boolean
-}
-
-export function useActionsTracker(useOptions?: DoActionOptions) {
-    const loadingMsgs: Ref<LoadingMsg[]> = ref([])
-    const mLoadingMsg: ShallowRef<string | undefined> = shallowRef()
-    const mErrorMsg: ShallowRef<string | undefined> = shallowRef()
-    const mCompletionMsg: ShallowRef<string | undefined> = shallowRef()
-    const isLoading = computed(() => mLoadingMsg.value != null)
-
-    function endLoading(id: string) {
-        loadingMsgs.value = loadingMsgs.value.filter(x => x.id != id)
-    }
-
-    function startLoading(msg?: string): string {
-        const e = {
-            id: useId(),
-            msg: msg ?? 'Loading'
-        }
-        loadingMsgs.value.push(e)
-        return e.id
-    }
-
-    function logError(err?: string | Error) {
-        if (err != null)
-            mErrorMsg.value = err.toString()
-    }
-
-    function clearErrors() {
-        mErrorMsg.value = undefined
-    }
-
-    async function doAction(action: any, options?: DoActionOptions) {
-        const opt = { ...options }
-        opt.completionMsg ??= useOptions?.completionMsg
-        opt.confirmationMsg ??= useOptions?.confirmationMsg
-        opt.errorMsg ??= useOptions?.errorMsg
-        opt.loadingMsg ??= useOptions?.loadingMsg ?? 'Loading'
-        opt.requireConfirmation ??= useOptions?.requireConfirmation
-        
-        const id = startLoading(opt.loadingMsg)
-        let res: any = null
-
-        try {
-            if (opt.requireConfirmation || opt.confirmationMsg) {
-                if (!await useConfirmAsync(opt.confirmationMsg ?? 'Are you sure?'))
-                    return
-            }
-
-            res = await action()
-            
-            if (opt.completionMsg != null) {
-                mCompletionMsg.value = opt.completionMsg
-            }
-
-            return res
-        }
-        catch (err) {
-            if (opt.throwError == true)
-                return res
-            else
-                logError(opt.errorMsg ?? (err as string) ?? 'error')
-        }
-        finally {
-            endLoading(id)
-        }
-    }
-
-    watchArray(loadingMsgs, (newList: LoadingMsg[]) => {
-        mLoadingMsg.value = newList.length > 0 ? newList[0].msg : undefined
-    }, { deep: true })
-
-    return {
-        actionErrorMsg: mErrorMsg,
-        actionLoadingMsg: mLoadingMsg,
-        actionCompleteMsg: mCompletionMsg,
-        clearErrors,
-        doAction,
-        isLoading,
-        logError
-    }
-}