ts-glitter 21.5.3 → 21.5.4

package/lowcode/public-components/product/pd-card-02.js

@@ -205,7 +205,7 @@ export class ProductCard02 {
         })}"
         />
       </div>
-      
+
       <div class="card-collapse-parent">
         <div class="d-flex card-title-container justify-content-between align-items-center">
           <div class="row gx-0 mb-1" style="max-width:calc(100% - 50px);">
@@ -229,21 +229,28 @@ export class ProductCard02 {
             </div>
           </div>
           <div class="add-cart-child">
-            <div
-              class="w-100 h-100 p-3 add-cart-text"
-              style="border-radius: 50%; color: ${borderButtonText}; border: 1px solid ${borderButtonBgr};"
-              onclick="${gvc.event((e, event) => {
-            event.stopPropagation();
-            PdClass.addCartAction({
-                gvc: gvc,
-                titleFontColor: titleFontColor,
-                prod: prod,
-                vm: vm,
-            });
-        })}"
-            >
-              <i class="fa-solid fa-cart-plus"></i>
-            </div>
+            ${(() => {
+            const isAllUnderstocking = prod.variants.every((item) => item.show_understocking === 'true');
+            const stockTotal = prod.variants.reduce((sum, item) => sum + item.stock, 0);
+            const isSoldOut = isAllUnderstocking && stockTotal === 0;
+            return html `<div
+                class="w-100 h-100 p-3 add-cart-text"
+                style="border-radius: 50%; color: ${borderButtonText}; border: 1px solid ${borderButtonBgr};"
+                onclick="${gvc.event((_, event) => {
+                event.stopPropagation();
+                if (!isSoldOut) {
+                    PdClass.addCartAction({
+                        gvc: gvc,
+                        titleFontColor: titleFontColor,
+                        prod: prod,
+                        vm: vm,
+                    });
+                }
+            })}"
+              >
+                ${isSoldOut ? html `<i class="fa-solid fa-ban"></i>` : html `<i class="fa-solid fa-cart-plus"></i>`}
+              </div>`;
+        })()}
           </div>
         </div>
       </div>

package/lowcode/public-components/product/pd-card-02.ts

@@ -223,7 +223,7 @@ export class ProductCard02 {
           })}"
         />
       </div>
-      
+
       <div class="card-collapse-parent">
         <div class="d-flex card-title-container justify-content-between align-items-center">
           <div class="row gx-0 mb-1" style="max-width:calc(100% - 50px);">
@@ -249,21 +249,30 @@ export class ProductCard02 {
             </div>
           </div>
           <div class="add-cart-child">
-            <div
-              class="w-100 h-100 p-3 add-cart-text"
-              style="border-radius: 50%; color: ${borderButtonText}; border: 1px solid ${borderButtonBgr};"
-              onclick="${gvc.event((e, event) => {
-                event.stopPropagation();
-                PdClass.addCartAction({
-                  gvc: gvc,
-                  titleFontColor: titleFontColor,
-                  prod: prod,
-                  vm: vm,
-                });
-              })}"
-            >
-              <i class="fa-solid fa-cart-plus"></i>
-            </div>
+            ${(() => {
+              const isAllUnderstocking = prod.variants.every((item: any) => item.show_understocking === 'true');
+              const stockTotal = prod.variants.reduce((sum: number, item: any) => sum + item.stock, 0);
+              const isSoldOut = isAllUnderstocking && stockTotal === 0;
+
+              return html`<div
+                class="w-100 h-100 p-3 add-cart-text"
+                style="border-radius: 50%; color: ${borderButtonText}; border: 1px solid ${borderButtonBgr};"
+                onclick="${gvc.event((_, event) => {
+                  event.stopPropagation();
+
+                  if (!isSoldOut) {
+                    PdClass.addCartAction({
+                      gvc: gvc,
+                      titleFontColor: titleFontColor,
+                      prod: prod,
+                      vm: vm,
+                    });
+                  }
+                })}"
+              >
+                ${isSoldOut ? html`<i class="fa-solid fa-ban"></i>` : html`<i class="fa-solid fa-cart-plus"></i>`}
+              </div>`;
+            })()}
           </div>
         </div>
       </div>

package/lowcode/public-components/product/pd-card-03.js

@@ -211,7 +211,7 @@ export class ProductCard03 {
         })}"
         />
       </div>
-      
+
       <div class="card-collapse-parent">
         <div class="card-title-container" style="min-height:auto;">
           <div class="row gx-0 mb-2">
@@ -235,21 +235,30 @@ export class ProductCard03 {
             </div>
           </div>
           <div class="add-cart-child">
-            <div
-              class="w-100 h-100 p-3 add-cart-text"
-              style="color: ${borderButtonText}; border: 1px solid ${borderButtonBgr};"
-              onclick="${gvc.event((_, event) => {
-            event.stopPropagation();
-            PdClass.addCartAction({
-                gvc: gvc,
-                titleFontColor: titleFontColor,
-                prod: prod,
-                vm: vm,
-            });
-        })}"
-            >
-              <i class="fa-solid fa-cart-plus me-2"></i>${Language.text('add_to_cart')}
-            </div>
+            ${(() => {
+            const isAllUnderstocking = prod.variants.every((item) => item.show_understocking === 'true');
+            const stockTotal = prod.variants.reduce((sum, item) => sum + item.stock, 0);
+            const isSoldOut = isAllUnderstocking && stockTotal === 0;
+            return html `<div
+                class="w-100 h-100 p-3 add-cart-text"
+                style="color: ${borderButtonText}; border: 1px solid ${borderButtonBgr};"
+                onclick="${gvc.event((_, event) => {
+                event.stopPropagation();
+                if (!isSoldOut) {
+                    PdClass.addCartAction({
+                        gvc: gvc,
+                        titleFontColor: titleFontColor,
+                        prod: prod,
+                        vm: vm,
+                    });
+                }
+            })}"
+              >
+                ${isSoldOut
+                ? html `<i class="fa-solid fa-ban me-2"></i>${Language.text('sold_out')}`
+                : html `<i class="fa-solid fa-cart-plus me-2"></i>${Language.text('add_to_cart')}`}
+              </div>`;
+        })()}
           </div>
         </div>
       </div>

package/lowcode/public-components/product/pd-card-03.ts

@@ -229,7 +229,7 @@ export class ProductCard03 {
           })}"
         />
       </div>
-      
+
       <div class="card-collapse-parent">
         <div class="card-title-container" style="min-height:auto;">
           <div class="row gx-0 mb-2">
@@ -255,21 +255,32 @@ export class ProductCard03 {
             </div>
           </div>
           <div class="add-cart-child">
-            <div
-              class="w-100 h-100 p-3 add-cart-text"
-              style="color: ${borderButtonText}; border: 1px solid ${borderButtonBgr};"
-              onclick="${gvc.event((_, event) => {
-                event.stopPropagation();
-                PdClass.addCartAction({
-                  gvc: gvc,
-                  titleFontColor: titleFontColor,
-                  prod: prod,
-                  vm: vm,
-                });
-              })}"
-            >
-              <i class="fa-solid fa-cart-plus me-2"></i>${Language.text('add_to_cart')}
-            </div>
+            ${(() => {
+              const isAllUnderstocking = prod.variants.every((item: any) => item.show_understocking === 'true');
+              const stockTotal = prod.variants.reduce((sum: number, item: any) => sum + item.stock, 0);
+              const isSoldOut = isAllUnderstocking && stockTotal === 0;
+
+              return html`<div
+                class="w-100 h-100 p-3 add-cart-text"
+                style="color: ${borderButtonText}; border: 1px solid ${borderButtonBgr};"
+                onclick="${gvc.event((_, event) => {
+                  event.stopPropagation();
+
+                  if (!isSoldOut) {
+                    PdClass.addCartAction({
+                      gvc: gvc,
+                      titleFontColor: titleFontColor,
+                      prod: prod,
+                      vm: vm,
+                    });
+                  }
+                })}"
+              >
+                ${isSoldOut
+                  ? html`<i class="fa-solid fa-ban me-2"></i>${Language.text('sold_out')}`
+                  : html`<i class="fa-solid fa-cart-plus me-2"></i>${Language.text('add_to_cart')}`}
+              </div>`;
+            })()}
           </div>
         </div>
       </div>

package/lowcode/public-components/terms-related/index.js

@@ -63,7 +63,10 @@ export class TermsRelated {
                         'shipment_list_archive',
                         'reconciliation_area',
                         'app-design',
-                        'auto_fcm_push', 'auto_fcm_advertise', 'auto_fcm_history', 'pos_setting'
+                        'auto_fcm_push',
+                        'auto_fcm_advertise',
+                        'auto_fcm_history',
+                        'pos_setting',
                     ].includes(glitter.getUrlParameter('page'))) {
                         return yield new Promise((resolve, reject) => {
                             glitter.getModule(new URL('./cms-plugin/cms-router.js', gvc.glitter.root_path).href, res => {
@@ -85,7 +88,15 @@ export class TermsRelated {
                             });
                         });
                     }
-                    else if (['account_userinfo', 'voucher-list', 'rebate', 'order_list', 'wishlist', 'account_edit'].includes(page)) {
+                    else if ([
+                        'account_userinfo',
+                        'voucher-list',
+                        'rebate',
+                        'order_list',
+                        'wishlist',
+                        'recipient_info',
+                        'account_edit',
+                    ].includes(page)) {
                         return yield new Promise((resolve, reject) => {
                             glitter.getModule(new URL('./cms-plugin/account-info.js', gvc.glitter.root_path).href, res => {
                                 document.querySelector(`.${id}`).outerHTML = res.main(gvc);

package/lowcode/public-components/terms-related/index.ts

@@ -66,7 +66,10 @@ export class TermsRelated {
               'shipment_list_archive',
               'reconciliation_area',
               'app-design',
-              'auto_fcm_push','auto_fcm_advertise','auto_fcm_history','pos_setting'
+              'auto_fcm_push',
+              'auto_fcm_advertise',
+              'auto_fcm_history',
+              'pos_setting',
             ].includes(glitter.getUrlParameter('page'))
           ) {
             return await new Promise((resolve, reject) => {
@@ -86,7 +89,17 @@ export class TermsRelated {
                 (document.querySelector(`.${id}`) as any).outerHTML = res.inputVerificationCode(gvc);
               });
             });
-          } else if (['account_userinfo', 'voucher-list', 'rebate', 'order_list', 'wishlist','account_edit'].includes(page)) {
+          } else if (
+            [
+              'account_userinfo',
+              'voucher-list',
+              'rebate',
+              'order_list',
+              'wishlist',
+              'recipient_info',
+              'account_edit',
+            ].includes(page)
+          ) {
             //個人檔案相關頁面
             return await new Promise((resolve, reject) => {
               glitter.getModule(new URL('./cms-plugin/account-info.js', gvc.glitter.root_path).href, res => {