ui fixes on order detail dialog and product form

paytaca · Apr 29, 2024 · 6c0620f · 6c0620f
1 parent 12c1897
commit 6c0620f
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 20 deletions.
diff --git a/src/components/marketplace/storefront/OrderDetailDialog.vue b/src/components/marketplace/storefront/OrderDetailDialog.vue
@@ -37,8 +37,8 @@
           <thead>
             <tr>
               <th colspan="2">Item</th>
-              <th>Qty</th>
               <th>Price</th>
+              <th>Qty</th>
               <th>Subtotal</th>
             </tr>
           </thead>
@@ -57,8 +57,8 @@
                     <div>{{ orderItem?.variant?.itemName }}</div>
                   </div>
                 </td>
-                <td class="text-center" style="white-space:nowrap;">{{ orderItem?.quantity }}</td>
                 <td class="text-center" style="white-space:nowrap;">{{ orderItem?.price }} {{ orderCurrency }}</td>
+                <td class="text-center" style="white-space:nowrap;">{{ orderItem?.quantity }}</td>
                 <td class="text-center" style="white-space:nowrap;">{{ orderItem?.price * orderItem?.quantity }} {{ orderCurrency }}</td>
               </tr>
               <tr v-for="(addon, index) in orderItem.addons" :key="`${orderItem?.id}-${index}`">

diff --git a/src/pages/marketplace/products/AddProduct.vue b/src/pages/marketplace/products/AddProduct.vue
@@ -127,18 +127,18 @@
           <div class="row items-center">
             <div class="text-subtitle1">Addon Options</div>
           </div>
-          <q-btn
-            v-if="!formData.addons?.length"
-            flat
-            no-caps label="Set Addons"
-            icon="edit"
-            class="full-width"
-            @click="() => openAddonsFormDialog()"
-          />
           <AddonsInfoPanel
-            v-else
+            v-if="formData.addons?.length"
             :addons="formData.addons"
             :currency="marketplaceStore.currency"
+          />
+          <q-btn
+            :flat="!formData.addons?.length"
+            :outline="Boolean(formData.addons?.length)"
+            :color="(formData.addons?.length && !$q.dark.isActive) ? 'brandblue' : ''"
+            no-caps :label="formData.addons?.length ? 'Edit' : 'Set Addons'"
+            icon="edit"
+            class="full-width"
             @click="() => openAddonsFormDialog()"
           />
         </q-card-section>

diff --git a/src/pages/marketplace/products/UpdateProduct.vue b/src/pages/marketplace/products/UpdateProduct.vue
@@ -140,18 +140,18 @@
           <div class="row items-center">
             <div class="text-subtitle1">Addon Options</div>
           </div>
-          <q-btn
-            v-if="!formData.addons?.length"
-            flat
-            no-caps label="Set Addons"
-            icon="edit"
-            class="full-width"
-            @click="() => openAddonsFormDialog()"
-          />
           <AddonsInfoPanel
-            v-else
+            v-if="formData.addons?.length"
             :addons="formData.addons"
             :currency="marketplaceStore.currency"
+          />
+          <q-btn
+            :flat="!formData.addons?.length"
+            :outline="Boolean(formData.addons?.length)"
+            :color="(formData.addons?.length && !$q.dark.isActive) ? 'brandblue' : ''"
+            no-caps :label="formData.addons?.length ? 'Edit' : 'Set Addons'"
+            icon="edit"
+            class="full-width"
             @click="() => openAddonsFormDialog()"
           />
         </q-card-section>