-
Notifications
You must be signed in to change notification settings - Fork 43
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1073 from w3bdesign/1001-refactor-code
1001 refactor code
- Loading branch information
Showing
11 changed files
with
616 additions
and
497 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,6 +1,7 @@ | ||
| PUBLIC_GRAPHQL_URL = "change me" | ||
| PUBLIC_PLACEHOLDER_SMALL_IMAGE_URL = "https://via.placeholder.com/500" | ||
| PUBLIC_CURRENCY_SYMBOL = "kr" | ||
| PUBLIC_CURRENCY = "NOK" | ||
| PUBLIC_CURRENCY_LOCALE = "nb-NO" | ||
| ALGOLIA_APPLICATION_ID = "change me" | ||
| ALGOLIA_API_KEY = "change me" | ||
| ALGOLIA_INDEX_NAME = "change me" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| <template> | ||
| <img | ||
| id="product-image" | ||
| class="h-auto p-8 transition duration-500 ease-in-out transform md:p-0 hover:shadow-lg hover:scale-95" | ||
| :alt="alt" | ||
| :src="displayedImage" | ||
| :width="width" | ||
| :height="height" | ||
| /> | ||
| </template> | ||
|
|
||
| <script setup> | ||
| import { computed } from "vue"; | ||
| const props = defineProps({ | ||
| alt: { type: String, required: true }, | ||
| src: { type: String, required: true }, | ||
| width: { type: String, required: false }, | ||
| height: { type: String, required: false }, | ||
| }); | ||
| const config = useRuntimeConfig(); | ||
| const displayedImage = computed(() => { | ||
| return props.src || config.public.placeholderImage; | ||
| }); | ||
| </script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,89 @@ | ||
| <template> | ||
| <div> | ||
| <div | ||
| v-if="onSale" | ||
| class="flex" | ||
| :class="shouldCenterPrice ? 'justify-center' : ''" | ||
| > | ||
| <p class="pt-1 mt-4 text-gray-900" :class="getFontSizeClass"> | ||
| {{ formatPrice(displayPrice) }} | ||
| </p> | ||
| <p | ||
| class="pt-1 pl-4 mt-4 text-gray-900 line-through" | ||
| :class="getSaleFontSizeClass" | ||
| > | ||
| {{ formatPrice(basePrice) }} | ||
| </p> | ||
| </div> | ||
| <p | ||
| v-else | ||
| class="flex pt-1 mt-4 text-2xl text-gray-900" | ||
| :class="shouldCenterPrice ? 'justify-center' : ''" | ||
| > | ||
| {{ formatPrice(displayPrice) }} | ||
| </p> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script setup> | ||
| import { computed } from "vue"; | ||
| import { | ||
| formatPrice, | ||
| filteredVariantPrice, | ||
| hasVariations, | ||
| } from "@/utils/functions"; | ||
| const props = defineProps({ | ||
| product: Object, | ||
| priceFontSize: String, | ||
| shouldCenterPrice: Boolean, | ||
| }); | ||
| const onSale = computed(() => props.product.onSale); | ||
| const productHasVariations = computed(() => hasVariations(props.product)); | ||
| const basePrice = computed(() => { | ||
| if (productHasVariations.value) { | ||
| return filteredVariantPrice(props.product.price); | ||
| } else { | ||
| return props.product.regularPrice; | ||
| } | ||
| }); | ||
| const displayPrice = computed(() => { | ||
| if (onSale.value) { | ||
| return productHasVariations.value | ||
| ? filteredVariantPrice(props.product.price) | ||
| : props.product.salePrice; | ||
| } else { | ||
| return props.product.price; | ||
| } | ||
| }); | ||
| const getFontSizeClass = computed(() => { | ||
| switch (props.priceFontSize) { | ||
| case "small": | ||
| return "text-lg"; | ||
| case "normal": | ||
| return "text-2xl"; | ||
| case "big": | ||
| return "text-2xl"; | ||
| default: | ||
| return "text-xl"; | ||
| } | ||
| }); | ||
| const getSaleFontSizeClass = computed(() => { | ||
| switch (props.priceFontSize) { | ||
| case "small": | ||
| return "text-lg"; | ||
| case "normal": | ||
| return "text-xl"; | ||
| case "big": | ||
| return "text-xl"; | ||
| default: | ||
| return "text-xl"; | ||
| } | ||
| }); | ||
| </script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
e667f5aThere was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Successfully deployed to the following URLs:
nuxtjs-woocommerce – ./
nuxtjs-woocommerce-git-master-w3bdesign.vercel.app
nuxtjs-woocommerce-w3bdesign.vercel.app
nuxtjs-woocommerce.vercel.app
nuxt.dfweb.no