feat: preloading, error handing

This commit is contained in:
opbnq-q
2025-03-09 04:25:25 -07:00
parent 9e49d16a43
commit f648b4b171
10 changed files with 112 additions and 76 deletions

View File

@@ -20,7 +20,7 @@ export function Count(): Promise<number> & { cancel(): void } {
export function Create(item: $models.Author): Promise<$models.Author> & { cancel(): void } {
let $resultPromise = $Call.ByID(3684602449, item) as any;
let $typingPromise = $resultPromise.then(($result) => {
let $typingPromise = $resultPromise.then(($result: any) => {
return $$createType0($result);
}) as any;
$typingPromise.cancel = $resultPromise.cancel.bind($resultPromise);
@@ -34,7 +34,7 @@ export function Delete(id: number): Promise<void> & { cancel(): void } {
export function GetAll(): Promise<($models.Author | null)[]> & { cancel(): void } {
let $resultPromise = $Call.ByID(3248293926) as any;
let $typingPromise = $resultPromise.then(($result) => {
let $typingPromise = $resultPromise.then(($result: any) => {
return $$createType2($result);
}) as any;
$typingPromise.cancel = $resultPromise.cancel.bind($resultPromise);
@@ -43,7 +43,7 @@ export function GetAll(): Promise<($models.Author | null)[]> & { cancel(): void
export function GetById(id: number): Promise<$models.Author | null> & { cancel(): void } {
let $resultPromise = $Call.ByID(1703016211, id) as any;
let $typingPromise = $resultPromise.then(($result) => {
let $typingPromise = $resultPromise.then(($result: any) => {
return $$createType1($result);
}) as any;
$typingPromise.cancel = $resultPromise.cancel.bind($resultPromise);
@@ -52,7 +52,7 @@ export function GetById(id: number): Promise<$models.Author | null> & { cancel()
export function Update(item: $models.Author): Promise<$models.Author> & { cancel(): void } {
let $resultPromise = $Call.ByID(2240704960, item) as any;
let $typingPromise = $resultPromise.then(($result) => {
let $typingPromise = $resultPromise.then(($result: any) => {
return $$createType0($result);
}) as any;
$typingPromise.cancel = $resultPromise.cancel.bind($resultPromise);

View File

@@ -20,7 +20,7 @@ export function Count(): Promise<number> & { cancel(): void } {
export function Create(item: $models.Post): Promise<$models.Post> & { cancel(): void } {
let $resultPromise = $Call.ByID(1443399856, item) as any;
let $typingPromise = $resultPromise.then(($result) => {
let $typingPromise = $resultPromise.then(($result: any) => {
return $$createType0($result);
}) as any;
$typingPromise.cancel = $resultPromise.cancel.bind($resultPromise);
@@ -39,7 +39,7 @@ export function ExportToExcel(): Promise<void> & { cancel(): void } {
export function GetAll(): Promise<($models.Post | null)[]> & { cancel(): void } {
let $resultPromise = $Call.ByID(65691059) as any;
let $typingPromise = $resultPromise.then(($result) => {
let $typingPromise = $resultPromise.then(($result: any) => {
return $$createType2($result);
}) as any;
$typingPromise.cancel = $resultPromise.cancel.bind($resultPromise);
@@ -48,7 +48,7 @@ export function GetAll(): Promise<($models.Post | null)[]> & { cancel(): void }
export function GetById(id: number): Promise<$models.Post | null> & { cancel(): void } {
let $resultPromise = $Call.ByID(4074736792, id) as any;
let $typingPromise = $resultPromise.then(($result) => {
let $typingPromise = $resultPromise.then(($result: any) => {
return $$createType1($result);
}) as any;
$typingPromise.cancel = $resultPromise.cancel.bind($resultPromise);
@@ -57,7 +57,7 @@ export function GetById(id: number): Promise<$models.Post | null> & { cancel():
export function Update(item: $models.Post): Promise<$models.Post> & { cancel(): void } {
let $resultPromise = $Call.ByID(137798821, item) as any;
let $typingPromise = $resultPromise.then(($result) => {
let $typingPromise = $resultPromise.then(($result: any) => {
return $$createType0($result);
}) as any;
$typingPromise.cancel = $resultPromise.cancel.bind($resultPromise);

View File

@@ -1,18 +1,27 @@
<script setup lang="ts">
import Table from "../table/Table.vue";
import { onMounted, reactive } from "vue";
import { onMounted, reactive, ref } from "vue";
import { getDefaultValues } from "../utils/structs/defaults.util";
import Service from "./author.service.ts";
import type { Scheme } from "../types/scheme.type";
import { Author } from "../../bindings/app/internal/services";
import PostService from "../post/post.service.ts";
import type { Validate } from "../types/validate.type.ts";
const postService = new PostService();
const service = new Service();
onMounted(async () => {
const items = ref<Author[]>([])
async function load() {
(scheme as any).Posts.type!.nested!.values = await postService.readAll();
items.value = await service.readAll();
return items.value;
}
onMounted(async () => {
load()
});
const scheme: Scheme<Author> = reactive({
@@ -44,10 +53,16 @@ const scheme: Scheme<Author> = reactive({
});
const getDefaults = () => getDefaultValues(scheme);
const validate: Validate<Author> = (data, mode): ReturnType<Validate<Author>> => {
return {
status: 'success',
}
}
</script>
<template>
<main class="w-screen h-screen">
<Table :scheme :service :getDefaults></Table>
<Table :scheme :service :get-defaults :validate :items :load></Table>
</main>
</template>

View File

@@ -2,7 +2,6 @@
import { structView } from '../../utils/structs/structs-view.util';
import type { IEntity } from '../../types/entity.type';
import Checkbox from '../checkboxes/Checkbox.vue';
import { onMounted, watch } from 'vue';
const { entityId } = defineProps<{
options: T[]
@@ -33,8 +32,7 @@ const setNullIds = () => {
<template>
<div class="relative">
<p class="flex items-center h-8 p-3">{{ structView(selected, path) }}</p>
<ul class="absolute max-h-20 overflow-y-auto bg-white rounded-md p-3 w-full border">
<ul class="absolute max-h-48 h-auto overflow-y-auto bg-white rounded-md p-3 w-full border">
<li v-for="option in options" :key="option.Id" class="flex items-center gap-2">
<Checkbox :checked="selected.some(item => item.Id == option.Id)" @click="pushOrRemove(option)" />
<label :for="option.Id.toString()">{{ structView(option, path) }}</label>

View File

@@ -70,6 +70,6 @@ const getDefaults = () => getDefaultValues(scheme);
<template>
<main class="w-screen h-screen">
<Table :scheme :service :getDefaults></Table>
<Table :scheme :service :get-defaults></Table>
</main>
</template>

View File

@@ -7,16 +7,20 @@ import { manyStructsView } from '../utils/structs/structs-view.util';
import { type UnwrapRef } from 'vue';
import { toDate, toTimestamp } from '../utils/date/converters.util';
import MultiSelect from '../components/selects/MultiSelect.vue';
import { alertWindow } from '../utils/js/alert.utils';
import type { Validate } from '../types/validate.type';
const showCreate = defineModel<boolean>('show')
const createItem = defineModel<T>('item')
const items = defineModel<UnwrapRef<T[]>>('items')
const props = defineProps<{
scheme: Scheme<T>,
getDefaults: () => Partial<T>,
service: IService<T>,
updateMode?: boolean
validate: Validate<T>
items: T[]
load(): Promise<T[]>
}>()
type Key = keyof T
@@ -27,15 +31,40 @@ const emits = defineEmits<{
(e: 'onSaveUpdate', data: T): void
(e: 'onSaveCreate', data: T): void
}>()
async function handleSave() {
const mode = props.updateMode ? 'update' : 'create';
const result = props.validate(createItem.value as T, mode);
if (result.status === 'error') {
alertWindow(result.message);
return;
}
try {
if (props.updateMode) {
await props.service.update.call(props.service, createItem.value as T);
await emits('onSaveUpdate', createItem.value as T);
await emits('onSave', createItem.value as T);
} else {
await props.service.create.call(props.service, createItem.value as T);
await emits('onSaveCreate', createItem.value as T);
await emits('onSave', createItem.value as T);
}
} catch (e) {
alertWindow(e.message);
return
}
props.load()
showCreate.value = false;
}
</script>
<template>
<Dialog v-model:visible="showCreate">
<div class="flex flex-col justify-center gap-5">
<div class="flex flex-col justify-start gap-5 min-h-[40vh]">
<div v-for="key in keys" v-show="!props.scheme[key].hidden && !props.scheme[key].readonly"
class="flex items-center gap-5">
<h1 class="w-[200px]">{{ props.scheme[key].russian }}</h1>
<div>
<div v-if="props.scheme[key]?.customWindow?.[props.updateMode ? 'update' : 'create']">
<slot :name="<string>key + (props.updateMode ? 'Update' : 'Create')"></slot>
</div>
@@ -48,8 +77,7 @@ const emits = defineEmits<{
v-else-if="props.scheme[key].type?.primitive === 'string'" />
<DatePicker class="w-[300px]" :default-value="toDate(createItem![key] as number)" @value-change="v => {
createItem![key] = toTimestamp(v as Date) as any
}" show-time
v-else-if="props.scheme[key].type?.primitive === 'date'" />
}" show-time v-else-if="props.scheme[key].type?.primitive === 'date'" />
<Textarea class="w-[300px]" v-model="<string>createItem![key]"
v-else-if="props.scheme[key].type?.primitive === 'multiple'" />
<ToggleSwitch class="w-[300px]" v-model:model-value="<boolean>createItem![key]"
@@ -64,26 +92,13 @@ const emits = defineEmits<{
{{ manyStructsView(value, props.scheme[key].type.nested.field) }}
</template>
</Select>
<MultiSelect v-else-if="props.scheme[key].type?.nested?.values && props.scheme[key]?.many" class="w-[300px]"
v-model="<T[]>createItem![key]" :options="props.scheme[key].type.nested.values"
<MultiSelect v-else-if="props.scheme[key].type?.nested?.values && props.scheme[key]?.many"
class="w-[300px]" v-model="<T[]>createItem![key]" :options="props.scheme[key].type.nested.values"
:path="props.scheme[key].type.nested.field" :entity-id="props.scheme.entityId" />
</div>
</div>
</div>
<template #footer>
<Button severity="success" @click="async () => {
if (props.updateMode) {
await props.service.update(createItem as T)
await emits('onSaveUpdate', createItem as T)
await emits('onSave', createItem as T)
} else {
await props.service.create(createItem as T)
await emits('onSaveCreate', createItem as T)
await emits('onSave', createItem as T)
}
items = await props.service.readAll() as UnwrapRef<T[]>
showCreate = false
}">Сохранить</Button>
<Button severity="success" class="mt-5" @click="handleSave">Сохранить</Button>
</template>
</Dialog>
</template>

View File

@@ -7,15 +7,12 @@ import type { TableEmits } from "../types/table-emits.type";
import FloatingButton from "../components/buttons/FloatingButton.vue";
import type { IEntity } from "../types/entity.type";
import DialogWindow from "./DialogWindow.vue";
import { timestampToDate } from "../utils/date/converters.util";
import { viewDate } from "../utils/date/view.util";
const props = defineProps<TableProps<T>>();
const items = ref<T[]>([]);
onMounted(async () => {
items.value = await props.service.readAll();
props.load()
});
type Key = keyof T;
@@ -71,12 +68,14 @@ const updateSlotName = (key: any) => key + "Update";
<template>
<DialogWindow
:scheme="props.scheme"
:service="props.service"
:get-defaults="props.getDefaults"
:load
:items
:validate
:scheme
:service
:get-defaults
v-model:item="<T>createItem"
v-model:show="showCreate"
v-model:items="items"
@on-save="data => emits('onSave', data)"
@on-save-create="data => emits('onSaveCreate', data)"
>
@@ -88,13 +87,15 @@ const updateSlotName = (key: any) => key + "Update";
</template>
</DialogWindow>
<DialogWindow
:scheme="props.scheme"
:load
:items
:validate
:scheme
update-mode
:service="props.service"
:get-defaults="props.getDefaults"
:service
:get-defaults
v-model:item="<T>updateItem"
v-model:show="showUpdate"
v-model:items="items"
@on-save="data => emits('onSave', data)"
@on-save-update="data => emits('onSaveUpdate', data)"
>
@@ -145,7 +146,7 @@ const updateSlotName = (key: any) => key + "Update";
@click="async () => {
await emits('onDelete', data)
await props.service.delete(data.Id)
items = await props.service.readAll() as UnwrapRef<T[]>
await load()
}"
></Button>
</div>

View File

@@ -1,11 +1,14 @@
import type { IEntity } from "./entity.type";
import type { Scheme } from "./scheme.type";
import type { IService } from "./service.type";
import type { Validate } from "./validate.type";
export interface TableProps<T extends IEntity> {
service: IService<T>
scheme: Scheme<T>
name?: string
getDefaults: () => Partial<T>
validate?: (data: T) => never | void
validate: Validate<T>
load(): Promise<T[]>
items: T[]
}

View File

@@ -0,0 +1,3 @@
import type { IEntity } from "./entity.type";
export type Validate<T extends IEntity> = (data: T, mode: "update" | "create") => { status: "error" | "success", message?: string }

View File

@@ -0,0 +1 @@
export const alertWindow = alert