Merge pull request #295 from ozgurg/dev

release: v7.2.0

.eslintrc.js

@@ -105,6 +105,7 @@ module.exports = {
             }
         }],
         "vue/multi-word-component-names": "off",
+        "require-jsdoc": "off",
         "valid-jsdoc": 0
     }
 };

components/App/AppBar.vue → components/app/bar.vue

@@ -5,7 +5,7 @@
             @click="openDrawer()" />
 
         <div class="d-flex align-center justify-center flex-1">
-            <AppLogo />
+            <app-logo />
         </div>
     </v-app-bar>
 </template>

components/App/AppBreadcrumbs.vue → components/app/breadcrumbs.vue

@@ -64,15 +64,9 @@ export default {
     computed: {
         positionAddedItems() {
             const vm = this;
-            return [
-                {
-                    title: "Ana Sayfa",
-                    url: "/"
-                },
-                ...vm.items
-            ].map((item, index) => ({
-                ...item,
-                position: ++index
+            return vm.items.map((_item, _index) => ({
+                ..._item,
+                position: ++_index
             }));
         }
     },
@@ -95,10 +89,10 @@ export default {
 $vh-breadcrumbs-item-padding-y: .5rem;
 $vh-breadcrumbs-item-padding-x: .375rem;
 
-// "AppBreadcrumbs" will always be in "main-container" and "main-container" has different padding-x for different resolutions.
-// I want "AppBreadcrumbs" to be full width, and I do this using negative margin-x.
+// "app-breadcrumbs" will always be in "main-container" and "main-container" has different padding-x for different resolutions.
+// I want "app-breadcrumbs" to be full width, and I do this using negative margin-x.
 // I update the negative margin-x to be the same as the padding-x of the "main-container".
-// And I also include the padding-x of ".v-breadcrumbs__item" in this calculation as I want the content of "AppBreadcrumbs" to align with "main-container".
+// And I also include the padding-x of ".v-breadcrumbs__item" in this calculation as I want the content of "app-breadcrumbs" to align with "main-container".
 .vh-breadcrumbs {
     --vh-breadcrumbs-negative-margin-y: 0px; // Removing "px" causes "calc(0 * -1)" calculation error
     --vh-breadcrumbs-negative-margin-x: #{$spacer * 5};

components/App/AppDrawer.vue → components/app/drawer.vue

@@ -4,7 +4,7 @@
             app=""
             touchless="">
             <div class="pa-4">
-                <AppLogo />
+                <app-logo />
             </div>
             <v-divider class="mx-4 mb-4" />
 

components/Calculation/CalculationPresetBrandCardItem.vue → components/calculation/preset-brand-card-item.vue

@@ -1,7 +1,7 @@
 <template>
     <v-card
         outlined=""
-        class="vh-calculation-preset-brand-item px-2 py-6 px-lg-4 py-lg-8 h-100">
+        class="px-2 py-6 px-lg-4 py-lg-8 h-100">
         <v-avatar
             size="32"
             color="white">
@@ -50,7 +50,7 @@ export default {
 <style lang="scss" scoped="">
 @import "~vuetify/src/styles/settings/_variables.scss";
 
-.vh-calculation-preset-brand-item {
+.v-card {
     flex-grow: 0;
     flex-shrink: 0;
     display: flex;

components/Calculation/CalculationPresetCardItem.vue → components/calculation/preset-card-item.vue

@@ -2,21 +2,20 @@
     <v-card
         :to="preset.page.url"
         outlined=""
-        active-class="vh-calculation-preset-item--active"
-        class="vh-calculation-preset-item px-4 py-6 px-lg-6 py-lg-8">
+        class="px-4 py-6 px-lg-6 py-lg-8">
         <v-card-title class="pa-0 mb-4">
             {{ preset.title }}
         </v-card-title>
 
-        <v-card-subtitle class="vh-calculation-preset-item__desc pa-0 mb-8">
+        <v-card-subtitle class="pa-0 mb-8">
             {{ brand.title }} • {{ preset.releaseDate.getFullYear() }}
         </v-card-subtitle>
 
         <div>
             <img
                 :src="require(`@/domain/${preset.thumbnail}`)"
                 :alt="preset.title"
-                class="vh-calculation-preset-item__thumb d-inline-block valign-middle rounded pa-2 white"
+                class="d-inline-block valign-middle rounded pa-2 white"
                 width="auto"
                 height="96"
                 loading="lazy"
@@ -44,7 +43,7 @@ export default {
 <style lang="scss" scoped="">
 @import "~vuetify/src/styles/settings/_variables.scss";
 
-.vh-calculation-preset-item {
+.v-card {
     $item: &;
     flex-grow: 0;
     flex-shrink: 0;
@@ -57,20 +56,21 @@ export default {
         min-width: 236px;
         flex-basis: 236px
     }
-    &__thumb {
+    img {
         height: 96px;
         width: auto;
         min-width: 72px;
         max-width: 96px;
         object-fit: contain
     }
-    &--active {
+    &[aria-current="page"] {
         border-color: $vh-color-primary;
         color: $vh-color-primary;
+
         &::before {
             opacity: $vh-card-hover-opacity
         }
-        #{$item}__desc {
+        .v-card__subtitle {
             color: rgba($vh-color-primary, .8)
         }
     }

components/Calculation/CalculationPresets.vue → components/calculation/presets.vue

@@ -1,16 +1,13 @@
 <template>
     <div class="vh-calculation-presets">
         <div>
-            <CalculationPresetBrandCardItem :brand="brand" />
+            <calculation-preset-brand-card-item :brand="brand" />
         </div>
-
-        <template v-for="_preset in presets">
-            <div :key="_preset.id">
-                <CalculationPresetCardItem
-                    :preset="_preset"
-                    :brand="brand" />
-            </div>
-        </template>
+        <calculation-preset-card-item
+            v-for="_preset in presets"
+            :key="_preset.id"
+            :preset="_preset"
+            :brand="brand" />
     </div>
 </template>
 
@@ -40,17 +37,15 @@ export default {
     -webkit-overflow-scrolling: touch;
     white-space: nowrap;
     overflow-x: auto;
-    scroll-snap-type: x mandatory;
     scroll-padding-inline: var(--vh-calculation-presets-negative-margin-x);
     margin: 0 calc(var(--vh-calculation-presets-negative-margin-x) * -1);
     padding-block-end: .5rem;
     gap: .5rem;
     @media #{map-get($display-breakpoints, "md-and-up")} {
-        gap: 1rem;
-        --vh-calculation-presets-negative-margin-x: 0
+        --vh-calculation-presets-negative-margin-x: 0;
+        gap: 1rem
     }
     > div {
-        scroll-snap-align: start;
         &:first-child {
             padding-inline-start: var(--vh-calculation-presets-negative-margin-x)
         }

domain/ana-sayfa/index.page-def.js

@@ -4,12 +4,12 @@ import { buildHeadTags } from "@/utils/build-head-tags.js";
 const AnaSayfaPageDef = () => {
     const title = "Vergi Hesaplayıcı";
     const url = "/";
-    /* const breadcrumbs = [
+    const breadcrumbs = [
         {
-            title,
+            title: "Ana Sayfa",
             url
         }
-    ]; */
+    ];
     const head = {
         titleTemplate: null,
         ...buildHeadTags({
@@ -22,7 +22,7 @@ const AnaSayfaPageDef = () => {
     return {
         title,
         url,
-        breadcrumbs: [], // We make it empty until complete the migration
+        breadcrumbs,
         head
     };
 };

domain/konsol-vergisi-hesaplayici/calculator.js

@@ -58,15 +58,13 @@ class Calculator {
     }
 
     /**
-     * @private
      * @param {number} price
      */
     #doCalculation(price) {
         this.#calculateFromTaxAddedPrice ? this.#price -= price : this.#price += price;
     }
 
     /**
-     * @private
      * @param {{[key: string]: number|null}} taxFees
      * @returns {number}
      */
@@ -83,32 +81,22 @@ class Calculator {
         return this.#calculateFromTaxAddedPrice ? calculateTaxFromTaxAddedPrice(price, rate) : calculateTaxFromTaxFreePrice(price, rate);
     }
 
-    /**
-     * @private
-     */
     #_customTax() {
         this.#taxFees.customTax = this.#calculateTax(this.#price, this.#taxRates.customTax);
         this.#doCalculation(this.#taxFees.customTax);
     }
 
-    /**
-     * @private
-     */
     #_specialConsumptionTax() {
         this.#taxFees.specialConsumptionTax = this.#calculateTax(this.#price, this.#taxRates.specialConsumptionTax);
         this.#doCalculation(this.#taxFees.specialConsumptionTax);
     }
 
-    /**
-     * @private
-     */
     #_valueAddedTax() {
         this.#taxFees.valueAddedTax = this.#calculateTax(this.#price, this.#taxRates.valueAddedTax);
         this.#doCalculation(this.#taxFees.valueAddedTax);
     }
 
     /**
-     * @public
      * @returns {{[key: string]: {[key: string]: number|null}}}
      */
     calculate() {

domain/telefon-vergisi-hesaplayici/calculator.js

@@ -94,15 +94,13 @@ class Calculator {
     }
 
     /**
-     * @private
      * @param {number} price
      */
     #doCalculation(price) {
         this.#calculateFromTaxAddedPrice ? this.#price -= price : this.#price += price;
     }
 
     /**
-     * @private
      * @param {{[key: string]: number|null}} taxFees
      * @returns {number}
      */
@@ -124,56 +122,37 @@ class Calculator {
         return this.#calculateFromTaxAddedPrice ? calculateTaxFromTaxAddedPrice(price, rate) : calculateTaxFromTaxFreePrice(price, rate);
     }
 
-    /**
-     * @private
-     */
     #_ministryOfCulture() {
         this.#taxFees.ministryOfCulture = this.#calculateTax(this.#price, this.#taxRates.ministryOfCulture);
         this.#doCalculation(this.#taxFees.ministryOfCulture);
     }
 
-    /**
-     * @private
-     */
     #_trtImport() {
         this.#taxFees.trtImport = this.#calculateTax(this.#price, this.#taxRates.trtImport);
         this.#doCalculation(this.#taxFees.trtImport);
     }
 
-    /**
-     * @private
-     */
     #_specialConsumptionTax() {
         this.#taxRates.specialConsumptionTax = getSpecialConsumptionTaxRateByPrice(this.#price);
         this.#taxFees.specialConsumptionTax = this.#calculateTax(this.#price, this.#taxRates.specialConsumptionTax);
         this.#doCalculation(this.#taxFees.specialConsumptionTax);
     }
 
-    /**
-     * @private
-     */
     #_valueAddedTax() {
         this.#taxFees.valueAddedTax = this.#calculateTax(this.#price, this.#taxRates.valueAddedTax);
         this.#doCalculation(this.#taxFees.valueAddedTax);
     }
 
-    /**
-     * @private
-     */
     #_trtPassport() {
         this.#taxFees.trtPassport = this.#taxRates.trtPassport * this.#eurToTryCurrency;
         this.#doCalculation(this.#taxFees.trtPassport);
     }
 
-    /**
-     * @private
-     */
     #_registration() {
         this.#doCalculation(this.#taxFees.registration);
     }
 
     /**
-     * @public
      * @returns {{[key: string]: {[key: string]: number|null}}}
      */
     calculate() {

layouts/default.vue

@@ -1,9 +1,9 @@
 <template>
     <v-app>
-        <AppDrawer />
+        <app-drawer />
 
         <template v-if="$vuetify.breakpoint.smAndDown">
-            <AppBar />
+            <app-bar />
         </template>
 
         <main-container>