feat: colorize function
This commit is contained in:
@@ -2,9 +2,7 @@
|
|||||||
import { Dialog } from "primevue";
|
import { Dialog } from "primevue";
|
||||||
import { useErrorStore } from "./stores/error.store";
|
import { useErrorStore } from "./stores/error.store";
|
||||||
import CommentScheme from "./comment/CommentScheme.vue";
|
import CommentScheme from "./comment/CommentScheme.vue";
|
||||||
import PostScheme from "./post/PostScheme.vue";
|
|
||||||
import PosttypeScheme from "./posttype/PosttypeScheme.vue";
|
import PosttypeScheme from "./posttype/PosttypeScheme.vue";
|
||||||
import AuthorScheme from "./author/AuthorScheme.vue";
|
|
||||||
|
|
||||||
const errorStore = useErrorStore();
|
const errorStore = useErrorStore();
|
||||||
</script>
|
</script>
|
||||||
@@ -19,9 +17,6 @@ const errorStore = useErrorStore();
|
|||||||
<h1 class="text-red-500 text-2xl">{{ errorStore.message }}</h1>
|
<h1 class="text-red-500 text-2xl">{{ errorStore.message }}</h1>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
<main class="w-screen h-screen">
|
<main class="w-screen h-screen">
|
||||||
<CommentScheme></CommentScheme>
|
|
||||||
<PostScheme></PostScheme>
|
|
||||||
<PosttypeScheme></PosttypeScheme>
|
<PosttypeScheme></PosttypeScheme>
|
||||||
<AuthorScheme></AuthorScheme>
|
|
||||||
</main>
|
</main>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -7,7 +7,6 @@ import type { Scheme } from "../types/scheme.type";
|
|||||||
import { PostType } from "../../bindings/app/internal/services";
|
import { PostType } from "../../bindings/app/internal/services";
|
||||||
import { ref } from "vue";
|
import { ref } from "vue";
|
||||||
import type { Validate } from "../types/validate.type";
|
import type { Validate } from "../types/validate.type";
|
||||||
import { ImportFromExcel } from "../../bindings/app/internal/services/posttypeservice.ts";
|
|
||||||
|
|
||||||
const service = new Service();
|
const service = new Service();
|
||||||
|
|
||||||
@@ -20,7 +19,6 @@ const load = async () => {
|
|||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await load();
|
await load();
|
||||||
await ImportFromExcel();
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const scheme: Scheme<PostType> = reactive({
|
const scheme: Scheme<PostType> = reactive({
|
||||||
@@ -48,10 +46,17 @@ const validate: Validate<PostType> = (entity) => {
|
|||||||
status: "success",
|
status: "success",
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const colorize = (data: PostType): string => {
|
||||||
|
if (data.Name === "test") {
|
||||||
|
return "red";
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<main class="w-screen h-screen">
|
<main class="w-screen h-screen">
|
||||||
<Table :scheme :service :get-defaults :load :items :validate></Table>
|
<Table :scheme :service :get-defaults :load :items :validate :colorize></Table>
|
||||||
</main>
|
</main>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -64,6 +64,18 @@ const slots = defineSlots();
|
|||||||
|
|
||||||
const createSlotName = (key: any) => key + "Create";
|
const createSlotName = (key: any) => key + "Create";
|
||||||
const updateSlotName = (key: any) => key + "Update";
|
const updateSlotName = (key: any) => key + "Update";
|
||||||
|
|
||||||
|
watch(() => props.items, () => {
|
||||||
|
if (props.colorize) {
|
||||||
|
const trs = document.querySelectorAll("tr");
|
||||||
|
props.items.forEach(item => {
|
||||||
|
const tr = trs[item.Id];
|
||||||
|
if (tr) {
|
||||||
|
tr.style.backgroundColor = props.colorize(item);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -117,7 +129,7 @@ const updateSlotName = (key: any) => key + "Update";
|
|||||||
v-if="!props.scheme[key].hidden"
|
v-if="!props.scheme[key].hidden"
|
||||||
>
|
>
|
||||||
<template #body="{ data }">
|
<template #body="{ data }">
|
||||||
<p>
|
<p class="">
|
||||||
{{
|
{{
|
||||||
viewDate(manyStructsView(
|
viewDate(manyStructsView(
|
||||||
data[key],
|
data[key],
|
||||||
|
|||||||
@@ -11,4 +11,5 @@ export interface TableProps<T extends IEntity> {
|
|||||||
validate: Validate<T>
|
validate: Validate<T>
|
||||||
load(): Promise<T[]>
|
load(): Promise<T[]>
|
||||||
items: T[]
|
items: T[]
|
||||||
|
colorize?: (data: T) => string
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user