From cdab5c90ea2add93c8b2593f3e34ebb282e7d738 Mon Sep 17 00:00:00 2001 From: nurRiyad Date: Tue, 10 Jan 2023 00:13:46 +0600 Subject: [PATCH] add empty card when data not available Signed-off-by: nurRiyad --- Cautious dog-bro.svg | 1 + components/blog/empty.vue | 21 +++ components/category/topic.vue | 13 +- components/logo/confused.vue | 234 ++++++++++++++++++++++++++++++ content/blogs/1. hello-world.md | 2 +- content/blogs/2. hello-man.md | 1 + content/blogs/3. intro-to-nuxt.md | 1 + content/blogs/4. intro-to-vue.md | 1 + content/blogs/5. intro-to-ts.md | 1 + pages/categories/[category].vue | 21 ++- pages/categories/index.vue | 28 ++-- pages/index.vue | 3 + utils/helper.ts | 6 + 13 files changed, 313 insertions(+), 20 deletions(-) create mode 100644 Cautious dog-bro.svg create mode 100644 components/blog/empty.vue create mode 100644 components/logo/confused.vue create mode 100644 utils/helper.ts diff --git a/Cautious dog-bro.svg b/Cautious dog-bro.svg new file mode 100644 index 0000000..c6f6cb3 --- /dev/null +++ b/Cautious dog-bro.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/components/blog/empty.vue b/components/blog/empty.vue new file mode 100644 index 0000000..97e9154 --- /dev/null +++ b/components/blog/empty.vue @@ -0,0 +1,21 @@ + diff --git a/components/category/topic.vue b/components/category/topic.vue index 2afc498..8d60afe 100644 --- a/components/category/topic.vue +++ b/components/category/topic.vue @@ -1,13 +1,16 @@ diff --git a/components/logo/confused.vue b/components/logo/confused.vue new file mode 100644 index 0000000..387fa61 --- /dev/null +++ b/components/logo/confused.vue @@ -0,0 +1,234 @@ + diff --git a/content/blogs/1. hello-world.md b/content/blogs/1. hello-world.md index 9d0f02d..ab7e4ad 100644 --- a/content/blogs/1. hello-world.md +++ b/content/blogs/1. hello-world.md @@ -2,7 +2,7 @@ title: 'Title of the page' description: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloremque minima eum, odit earum porro beatae explicabo quisquam asperiores aliquam similique ipsam non deleniti qui sint ad maxime culpa accusantium. Deleniti.' time: 10Jan2022 -tags: ['sdf', 'sdf', 'sdf'] +tags: ['sdf', 'sdf', 'nuxt'] --- ::CustomTitle diff --git a/content/blogs/2. hello-man.md b/content/blogs/2. hello-man.md index f469ffe..c27b22c 100644 --- a/content/blogs/2. hello-man.md +++ b/content/blogs/2. hello-man.md @@ -2,6 +2,7 @@ title: 'Title of the page' description: 'meta description of the page' time: 2Jan2022 +tags: ['vue'] --- # BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB diff --git a/content/blogs/3. intro-to-nuxt.md b/content/blogs/3. intro-to-nuxt.md index 4fc5107..97e019e 100644 --- a/content/blogs/3. intro-to-nuxt.md +++ b/content/blogs/3. intro-to-nuxt.md @@ -2,6 +2,7 @@ title: 'Title of the page' description: 'meta description of the page' time: 4Nov2022 +tags: ['cypress'] --- # CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCc diff --git a/content/blogs/4. intro-to-vue.md b/content/blogs/4. intro-to-vue.md index 5e506e6..180d8af 100644 --- a/content/blogs/4. intro-to-vue.md +++ b/content/blogs/4. intro-to-vue.md @@ -2,6 +2,7 @@ title: 'Title of the page' description: 'meta description of the page' time: 1Oct2022 +tags: ['kubernetes'] --- # DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD diff --git a/content/blogs/5. intro-to-ts.md b/content/blogs/5. intro-to-ts.md index 29dc957..679dfdf 100644 --- a/content/blogs/5. intro-to-ts.md +++ b/content/blogs/5. intro-to-ts.md @@ -2,6 +2,7 @@ title: 'Title of the page' description: 'meta description of the page' time: 1Jan2023 +tags: ['firebase'] --- # Hello man diff --git a/pages/categories/[category].vue b/pages/categories/[category].vue index 4970f09..07c60f4 100644 --- a/pages/categories/[category].vue +++ b/pages/categories/[category].vue @@ -10,7 +10,23 @@ useHead({ titleTemplate: "Elon's Blog - %s", }) -const { data } = await useAsyncData('home', () => queryContent('/blogs').where({}).find()) +const route = useRoute() + +// take category from route params & make first char upper +const category = computed(() => { + let name = route.params.category || '' + let strName = '' + + if (name instanceof Array) strName = name.at(0) || '' + else strName = name + return strName +}) + +const { data } = await useAsyncData('home', () => + queryContent('/blogs') + .where({ tags: { $contains: category.value } }) + .find() +) diff --git a/pages/categories/index.vue b/pages/categories/index.vue index 0512ed9..c561677 100644 --- a/pages/categories/index.vue +++ b/pages/categories/index.vue @@ -1,4 +1,6 @@ + diff --git a/utils/helper.ts b/utils/helper.ts new file mode 100644 index 0000000..2f411f4 --- /dev/null +++ b/utils/helper.ts @@ -0,0 +1,6 @@ +export const makeFirstCharUpper = (val: string) => { + if (val === '') return val + const firstChar = val.at(0)?.toLocaleUpperCase() || '' + const otherChar = val.slice(1) + return firstChar + otherChar +}