ts-glitter 21.1.6 → 21.1.8

package/lowcode/public-components/checkout/index.ts

@@ -40,7 +40,7 @@ export class CheckoutIndex {
       return '';
     }
     let onlineData: any = {};
-    function getCartData(){
+    function getCartData() {
       if (gvc.glitter.getUrlParameter('page') !== 'checkout') {
         ApiCart.checkoutCart = ApiCart.globalCart;
         return new ApiCart(ApiCart.globalCart);
@@ -49,7 +49,7 @@ export class CheckoutIndex {
       }
     }
     //取得要顯示的購物車
-    let apiCart = getCartData()
+    let apiCart = getCartData();
 
     const check_out_sub = JSON.parse(localStorage.getItem('checkout_sub_' + ApiCart.checkoutCart) ?? '{}');
 
@@ -112,7 +112,7 @@ export class CheckoutIndex {
           role="status"
         ></div>
         <span class="mt-3 ${textAttr.visible ? '' : 'd-none'}" style="font-size: ${textAttr.fontSize}px;"
-        >${textAttr.value}</span
+          >${textAttr.value}</span
         >
       </div>`;
     }
@@ -144,7 +144,7 @@ export class CheckoutIndex {
 
     function refreshCartData() {
       //重取購物車資料
-      apiCart=getCartData()
+      apiCart = getCartData();
       const dialog = new ShareDialog(gvc.glitter);
       dialog.dataLoading({ visible: true });
       const beta = false;
@@ -505,28 +505,28 @@ export class CheckoutIndex {
                                             })(),
                                             item.usePass
                                               ? html` <button
-                                                class="${gClass('button-bgr')} my-2"
-                                                style="max-width: 150px;"
-                                                onclick="${gvc.event(() => {
-                                                  apiCart.setCart(cartItem => {
-                                                    cartItem.code = item.code;
-                                                    refreshCartData();
-                                                    gvc.closeDialog();
-                                                  });
-                                                })}"
-                                              >
+                                                  class="${gClass('button-bgr')} my-2"
+                                                  style="max-width: 150px;"
+                                                  onclick="${gvc.event(() => {
+                                                    apiCart.setCart(cartItem => {
+                                                      cartItem.code = item.code;
+                                                      refreshCartData();
+                                                      gvc.closeDialog();
+                                                    });
+                                                  })}"
+                                                >
                                                   <span class="${gClass('button-text')}"
-                                                  >${Language.text('select_to_use')}</span
+                                                    >${Language.text('select_to_use')}</span
                                                   >
-                                              </button>`
+                                                </button>`
                                               : html` <button
-                                                class="${gClass('button-bgr-disable')} my-2"
-                                                style="max-width: 150px; cursor: not-allowed"
-                                              >
+                                                  class="${gClass('button-bgr-disable')} my-2"
+                                                  style="max-width: 150px; cursor: not-allowed"
+                                                >
                                                   <span class="${gClass('button-text')}"
-                                                  >${Language.text('not_meet_usage_criteria')}</span
+                                                    >${Language.text('not_meet_usage_criteria')}</span
                                                   >
-                                              </button>`,
+                                                </button>`,
                                           ];
                                         }
 
@@ -565,7 +565,7 @@ export class CheckoutIndex {
                                             <div>
                                               <div class="d-flex align-items-center mb-2">
                                                 <label class="${gClass('label')} mb-0 me-2" style="min-width: 80px;"
-                                                >${Language.text('enter_code')}</label
+                                                  >${Language.text('enter_code')}</label
                                                 >
                                                 <input
                                                   class="${gClass('input')}"
@@ -576,38 +576,49 @@ export class CheckoutIndex {
                                                 />
                                               </div>
                                             </div>
-                                            <div class="w-100 d-sm-flex py-4 um-th-bar">
-                                              ${header
-                                                .map((item, index) => {
-                                                  return html` <div class="um-th" style="flex: ${flexList[index]};">
-                                                    ${item.title}
-                                                  </div>`;
-                                                })
-                                                .join('')}
-                                            </div>
-                                            ${vmi.dataList
-                                              .map((item, t1) => {
-                                                const fText = formatText(item.content);
-                                                return html` <div class="w-100 d-sm-flex py-1 align-items-center">
-                                                  ${fText
-                                                    .map((dd, t2) => {
-                                                      return html` <div
-                                                        class="um-td ${t2 === fText.length - 1 ? 'text-center' : ''}"
-                                                        style="flex: ${flexList[t2]}"
-                                                      >
-                                                        ${dd}
+                                            ${vmi.dataList.length > 0
+                                              ? html`<div class="w-100 d-sm-flex py-4 um-th-bar">
+                                                    ${header
+                                                      .map((item, index) => {
+                                                        return html` <div
+                                                          class="um-th"
+                                                          style="flex: ${flexList[index]};"
+                                                        >
+                                                          ${item.title}
+                                                        </div>`;
+                                                      })
+                                                      .join('')}
+                                                  </div>
+                                                  ${vmi.dataList
+                                                    .map(item => {
+                                                      const fText = formatText(item.content);
+                                                      return html` <div class="w-100 d-sm-flex py-1 align-items-center">
+                                                        ${fText
+                                                          .map((dd, t2) => {
+                                                            return html` <div
+                                                              class="um-td ${t2 === fText.length - 1
+                                                                ? 'text-center'
+                                                                : ''}"
+                                                              style="flex: ${flexList[t2]}"
+                                                            >
+                                                              ${dd}
+                                                            </div>`;
+                                                          })
+                                                          .join('')}
                                                       </div>`;
                                                     })
-                                                    .join('')}
-                                                </div>`;
-                                              })
-                                              .join('')}
+                                                    .join('')}`
+                                              : html`<div
+                                                  class="d-flex justify-content-center align-items-center"
+                                                  style="height: 250px;"
+                                                >
+                                                  尚無可使用的優惠券
+                                                </div>`}
                                           `;
                                         }
 
-                                        return html` <div>
-                                          <div class="d-flex flex-column flex-sm-row align-items-center ">
-                                            <div class="d-flex align-items-center">
+                                        return html`<div class="d-flex flex-column flex-sm-row align-items-center">
+                                            <div class="d-flex align-items-center w-100">
                                               <input
                                                 class="${gClass('input')}"
                                                 type="text"
@@ -622,30 +633,36 @@ export class CheckoutIndex {
                                                 })}"
                                               >
                                                 <span class="${gClass('button-text')}"
-                                                >${Language.text('confirm')}</span
+                                                  >${Language.text('confirm')}</span
                                                 >
                                               </button>
                                             </div>
                                           </div>
                                           <div class="w-100 d-sm-none mb-3 s162413">
-                                            ${vmi.dataList
-                                              .map(item => {
-                                                return html` <div class="um-mobile-area">
-                                                  ${formatText(item.content)
-                                                    .map((dd, index) => {
-                                                      if (header[index].title === '') {
-                                                        return dd;
-                                                      }
-                                                      return html` <div class="um-mobile-text">
-                                                        ${header[index].title} : ${dd}
-                                                      </div>`;
-                                                    })
-                                                    .join('')}
-                                                </div>`;
-                                              })
-                                              .join('')}
-                                          </div>
-                                        </div>`;
+                                            ${vmi.dataList.length > 0
+                                              ? vmi.dataList
+                                                  .map(item => {
+                                                    return html` <div class="um-mobile-area">
+                                                      ${formatText(item.content)
+                                                        .map((dd, index) => {
+                                                          if (header[index].title === '') {
+                                                            return dd;
+                                                          }
+                                                          return html` <div class="um-mobile-text">
+                                                            ${header[index].title} : ${dd}
+                                                          </div>`;
+                                                        })
+                                                        .join('')}
+                                                    </div>`;
+                                                  })
+                                                  .join('')
+                                              : html`<div
+                                                  class="d-flex justify-content-center align-items-center"
+                                                  style="height: 200px;"
+                                                >
+                                                  尚無可使用的優惠券
+                                                </div>`}
+                                          </div>`;
                                       }
                                     } catch (e) {
                                       return '';
@@ -653,18 +670,6 @@ export class CheckoutIndex {
                                   },
                                   onCreate: () => {
                                     if (loading) {
-                                      function isNowBetweenDates(startIso: string, endIso: string): boolean {
-                                        const now = new Date();
-                                        const startDate = new Date(startIso);
-                                        const endDate = new Date(endIso);
-
-                                        if (isNaN(startDate.getTime()) || isNaN(endDate.getTime())) {
-                                          return true;
-                                        }
-
-                                        return now >= startDate && now <= endDate;
-                                      }
-
                                       gvc.addMtScript(
                                         [
                                           {
@@ -680,8 +685,9 @@ export class CheckoutIndex {
                                             if (res.result && res.response.data) {
                                               vmi.dataList = res.response.data.filter((item: Voucher) => {
                                                 return (
+                                                  item.content.status === 1 &&
                                                   item.content.trigger === 'code' &&
-                                                  isNowBetweenDates(
+                                                  Tool.isNowBetweenDates(
                                                     item.content.start_ISO_Date,
                                                     item.content.end_ISO_Date
                                                   )
@@ -750,16 +756,16 @@ export class CheckoutIndex {
                     >
                       ${vm.cartData.code
                         ? html`${vm.cartData.code}<i
-                          class="fa-solid fa-xmark-large ms-2"
-                          style="cursor: pointer;"
-                          onclick="${gvc.event((e, event) => {
-                            event.stopPropagation();
-                            apiCart.setCart(cartItem => {
-                              cartItem.code = '';
-                              refreshCartData();
-                            });
-                          })}"
-                        ></i>`
+                              class="fa-solid fa-xmark-large ms-2"
+                              style="cursor: pointer;"
+                              onclick="${gvc.event((e, event) => {
+                                event.stopPropagation();
+                                apiCart.setCart(cartItem => {
+                                  cartItem.code = '';
+                                  refreshCartData();
+                                });
+                              })}"
+                            ></i>`
                         : Language.text('add')}
                     </div>
                   </div>
@@ -768,46 +774,88 @@ export class CheckoutIndex {
                       return '';
                     } else {
                       return html` ${(() => {
-                        let tempRebate: number = 0;
-                        const dialog = new ShareDialog(gvc.glitter);
-                        return html` <div class="${gClass(['price-row', 'text-2'])}">
-                          <div>${vm.rebateConfig.title}${Language.text('discount')}</div>
-                          <div>- ${Currency.convertCurrencyText(vm.cartData.use_rebate)}</div>
-                        </div>
-                        <div class="${gClass(['price-row', 'text-2'])}">
-                          <div>${vm.rebateConfig.title}${Language.text('reback_text')}</div>
-                          <div>+ ${vm.cartData.rebate.toLocaleString()}</div>
-                        </div>
+                          let tempRebate: number = 0;
+                          const dialog = new ShareDialog(gvc.glitter);
+                          return html` <div class="${gClass(['price-row', 'text-2'])}">
+                              <div>${vm.rebateConfig.title}${Language.text('discount')}</div>
+                              <div>- ${Currency.convertCurrencyText(vm.cartData.use_rebate)}</div>
+                            </div>
+                            <div class="${gClass(['price-row', 'text-2'])}">
+                              <div>${vm.rebateConfig.title}${Language.text('reback_text')}</div>
+                              <div>+ ${vm.cartData.rebate.toLocaleString()}</div>
+                            </div>
 
-                        <div class="${gClass(['price-row', 'text-2'])}">
-                          <div
-                            style="  justify-content: flex-start; align-items: center; display: inline-flex;border:1px solid #EAEAEA;border-radius: 10px;overflow: hidden; ${document
-                              .body.clientWidth > 768
-                              ? 'gap: 18px;'
-                              : 'gap: 0px;'}"
-                            class="w-100"
-                          >
-                            <input
-                              class="flex-fill ${gClass('group-input')}"
-                              placeholder="${Language.text('please_enter')}${vm.rebateConfig.title}"
-                              style="${document.body.clientWidth < 800
-                                ? `width:calc(100% - 150px) !important;`
-                                : ''}"
-                              value="${vm.cartData.use_rebate || ''}"
-                              onchange="${gvc.event((e, event) => {
-                                if (CheckInput.isNumberString(e.value)) {
-                                  tempRebate = parseInt(e.value, 10);
-                                } else {
-                                  dialog.errorMessage({ text: Language.text('enter_value') });
-                                  gvc.notifyDataChange(ids.page);
-                                }
-                              })}"
-                            />
-                            <div class="${gClass('group-button')}">
+                            <div class="${gClass(['price-row', 'text-2'])}">
                               <div
-                                class="${gClass('button-text')}"
-                                onclick="${gvc.event(async () => {
-                                  const sum: number = await new Promise((resolve, reject) => {
+                                style="  justify-content: flex-start; align-items: center; display: inline-flex;border:1px solid #EAEAEA;border-radius: 10px;overflow: hidden; ${document
+                                  .body.clientWidth > 768
+                                  ? 'gap: 18px;'
+                                  : 'gap: 0px;'}"
+                                class="w-100"
+                              >
+                                <input
+                                  class="flex-fill ${gClass('group-input')}"
+                                  placeholder="${Language.text('please_enter')}${vm.rebateConfig.title}"
+                                  style="${document.body.clientWidth < 800
+                                    ? `width:calc(100% - 150px) !important;`
+                                    : ''}"
+                                  value="${vm.cartData.use_rebate || ''}"
+                                  onchange="${gvc.event((e, event) => {
+                                    if (CheckInput.isNumberString(e.value)) {
+                                      tempRebate = parseInt(e.value, 10);
+                                    } else {
+                                      dialog.errorMessage({ text: Language.text('enter_value') });
+                                      gvc.notifyDataChange(ids.page);
+                                    }
+                                  })}"
+                                />
+                                <div class="${gClass('group-button')}">
+                                  <div
+                                    class="${gClass('button-text')}"
+                                    onclick="${gvc.event(async () => {
+                                      const sum: number = await new Promise((resolve, reject) => {
+                                        ApiShop.getRebate({}).then(async res => {
+                                          if (res.result && res.response.sum) {
+                                            resolve(res.response.sum);
+                                          } else {
+                                            resolve(0);
+                                          }
+                                        });
+                                      });
+                                      const limit =
+                                        vm.cartData.total - vm.cartData.shipment_fee + vm.cartData.use_rebate;
+                                      if (sum === 0) {
+                                        dialog.errorMessage({
+                                          text: `您的 ${vm.rebateConfig.title} 為 0 點，無法折抵`,
+                                        });
+                                        return;
+                                      }
+                                      if (tempRebate > Math.min(sum, limit)) {
+                                        dialog.errorMessage({
+                                          text: `${Language.text('please_enter')} 0 到 ${Math.min(sum, limit)} 的數值`,
+                                        });
+                                        return;
+                                      }
+
+                                      apiCart.setCart(cartItem => {
+                                        cartItem.use_rebate = tempRebate;
+                                        refreshCartData();
+                                      });
+                                    })}"
+                                  >
+                                    ${Language.text('apply')}
+                                  </div>
+                                </div>
+                              </div>
+                            </div>`;
+                        })()}
+                        <div class="${gClass(['price-row', 'text-2'])}">
+                          ${(() => {
+                            return gvc.bindView(() => {
+                              return {
+                                bind: gvc.glitter.getUUID(),
+                                view: async () => {
+                                  const sum = await new Promise((resolve, reject) => {
                                     ApiShop.getRebate({}).then(async res => {
                                       if (res.result && res.response.sum) {
                                         resolve(res.response.sum);
@@ -816,74 +864,32 @@ export class CheckoutIndex {
                                       }
                                     });
                                   });
-                                  const limit =
-                                    vm.cartData.total - vm.cartData.shipment_fee + vm.cartData.use_rebate;
-                                  if (sum === 0) {
-                                    dialog.errorMessage({
-                                      text: `您的 ${vm.rebateConfig.title} 為 0 點，無法折抵`,
-                                    });
-                                    return;
-                                  }
-                                  if (tempRebate > Math.min(sum, limit)) {
-                                    dialog.errorMessage({
-                                      text: `${Language.text('please_enter')} 0 到 ${Math.min(sum, limit)} 的數值`,
-                                    });
-                                    return;
+                                  if (!vm.cartData.useRebateInfo) {
+                                    return '';
                                   }
 
-                                  apiCart.setCart(cartItem => {
-                                    cartItem.use_rebate = tempRebate;
-                                    refreshCartData();
-                                  });
-                                })}"
-                              >
-                                ${Language.text('apply')}
-                              </div>
-                            </div>
-                          </div>
+                                  const info = vm.cartData.useRebateInfo;
+                                  if (info.condition) {
+                                    return html`${Language.text('distance_from_target_amount')}$
+                                    ${info.condition.toLocaleString()} ${Language.text('can_use_now')}
+                                    ${vm.rebateConfig.title} ${Language.text('discount')}`;
+                                  }
+                                  if (info.limit) {
+                                    return html`${Language.text('remaining_balance')} ${sum || 0}
+                                      ${Language.text('point')} ${vm.rebateConfig.title} <br />${Language.text(
+                                        'max_discount_order'
+                                      )}
+                                      ${info.limit.toLocaleString()} ${Language.text('point')} ${vm.rebateConfig.title}`;
+                                  } else {
+                                    return `${Language.text('remaining_balance')} ${sum || 0} ${Language.text('point')} ${
+                                      vm.rebateConfig.title
+                                    }`;
+                                  }
+                                },
+                              };
+                            });
+                          })()}
                         </div>`;
-                      })()}
-                      <div class="${gClass(['price-row', 'text-2'])}">
-                        ${(() => {
-                          return gvc.bindView(() => {
-                            return {
-                              bind: gvc.glitter.getUUID(),
-                              view: async () => {
-                                const sum = await new Promise((resolve, reject) => {
-                                  ApiShop.getRebate({}).then(async res => {
-                                    if (res.result && res.response.sum) {
-                                      resolve(res.response.sum);
-                                    } else {
-                                      resolve(0);
-                                    }
-                                  });
-                                });
-                                if (!vm.cartData.useRebateInfo) {
-                                  return '';
-                                }
-
-                                const info = vm.cartData.useRebateInfo;
-                                if (info.condition) {
-                                  return html`${Language.text('distance_from_target_amount')}$
-                                  ${info.condition.toLocaleString()} ${Language.text('can_use_now')}
-                                  ${vm.rebateConfig.title} ${Language.text('discount')}`;
-                                }
-                                if (info.limit) {
-                                  return html`${Language.text('remaining_balance')} ${sum || 0}
-                                  ${Language.text('point')} ${vm.rebateConfig.title} <br />${Language.text(
-                                    'max_discount_order'
-                                  )}
-                                  ${info.limit.toLocaleString()} ${Language.text('point')} ${vm.rebateConfig.title}`;
-                                } else {
-                                  return `${Language.text('remaining_balance')} ${sum || 0} ${Language.text('point')} ${
-                                    vm.rebateConfig.title
-                                  }`;
-                                }
-                              },
-                            };
-                          });
-                        })()}
-                      </div>`;
                     }
                   })()}
                   <div class="${gClass(['price-row', 'text-2', 'bold'])}">
@@ -1000,20 +1006,20 @@ export class CheckoutIndex {
                                     style="height: 68px; overflow: auto hidden;"
                                   >
                                     ${ProductModule.tab(
-                                    filterLogiGroup.map(item => {
-                                      return {
-                                        title: item.name,
-                                        key: item.key,
-                                      };
-                                    }),
-                                    gvc,
-                                    localStorage.getItem('logistics-group') ?? filterLogiGroup[0].key,
-                                    text => {
-                                      localStorage.setItem('logistics-group', text);
-                                      refreshCartData();
-                                    },
-                                    'justify-content: flex-start;'
-                                  )}
+                                      filterLogiGroup.map(item => {
+                                        return {
+                                          title: item.name,
+                                          key: item.key,
+                                        };
+                                      }),
+                                      gvc,
+                                      localStorage.getItem('logistics-group') ?? filterLogiGroup[0].key,
+                                      text => {
+                                        localStorage.setItem('logistics-group', text);
+                                        refreshCartData();
+                                      },
+                                      'justify-content: flex-start;'
+                                    )}
                                   </div>`;
                                 })()}
                                 <div class="rounded-3 bg-white w-100 mt-3">
@@ -1076,8 +1082,8 @@ export class CheckoutIndex {
                                                     <span
                                                       class="fw-bold pe-4"
                                                       style="gap:5px;font-size:${document.body.clientWidth > 800
-                                              ? `16`
-                                              : `14`}px;max-width:calc(100% - 10px); display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; "
+                                                        ? `16`
+                                                        : `14`}px;max-width:calc(100% - 10px); display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; "
                                                       >${title}</span
                                                     >
                                                     <div class="${gClass(['66text'])} fs-sm">
@@ -1087,24 +1093,24 @@ export class CheckoutIndex {
                                                     <div class="d-flex flex-column align-items-start " style="gap:2px;">
                                                       <div class="fw-bold fs-6 ${gClass('price-text')}">
                                                         ${(() => {
-                                              if (item.is_gift) {
-                                                return Currency.convertCurrencyText(0);
-                                              }
-                                              return Currency.convertCurrencyText(
-                                                parseFloat(item.sale_price)
-                                              );
-                                            })()}
+                                                          if (item.is_gift) {
+                                                            return Currency.convertCurrencyText(0);
+                                                          }
+                                                          return Currency.convertCurrencyText(
+                                                            parseFloat(item.sale_price)
+                                                          );
+                                                        })()}
                                                       </div>
                                                       ${(() => {
-                                              if (item.is_gift || item.sale_price >= item.origin_price) {
-                                                return '';
-                                              }
-                                              return html` <div
+                                                        if (item.is_gift || item.sale_price >= item.origin_price) {
+                                                          return '';
+                                                        }
+                                                        return html` <div
                                                           style="text-decoration: line-through; font-size: 12px;"
                                                         >
                                                           ${Currency.convertCurrencyText(parseFloat(item.origin_price))}
                                                         </div>`;
-                                            })()}
+                                                      })()}
                                                     </div>
                                                     <div class="w-100 d-flex">
                                                       <div class="flex-fill"></div>
@@ -1114,23 +1120,23 @@ export class CheckoutIndex {
                                                       >
                                                         <div
                                                           class="${item.is_gift
-                                              ? `d-none`
-                                              : `d-flex`} align-items-center justify-content-center"
+                                                            ? `d-none`
+                                                            : `d-flex`} align-items-center justify-content-center"
                                                           style="width:38px;height: 38px;cursor: pointer;"
                                                           onclick="${gvc.event(() => {
-                                              apiCart.setCart(cartItem => {
-                                                const find = cartItem.line_items.find(dd => {
-                                                  return (
-                                                    dd.id === item.id &&
-                                                    item.spec.join('') === dd.spec.join('')
-                                                  );
-                                                })!;
-                                                if (find.count - 1 > 0) {
-                                                  find.count = find.count - 1;
-                                                  refreshCartData();
-                                                }
-                                              });
-                                            })}"
+                                                            apiCart.setCart(cartItem => {
+                                                              const find = cartItem.line_items.find(dd => {
+                                                                return (
+                                                                  dd.id === item.id &&
+                                                                  item.spec.join('') === dd.spec.join('')
+                                                                );
+                                                              })!;
+                                                              if (find.count - 1 > 0) {
+                                                                find.count = find.count - 1;
+                                                                refreshCartData();
+                                                              }
+                                                            });
+                                                          })}"
                                                         >
                                                           <i class="fa-solid fa-minus" style="color:black;"></i>
                                                         </div>
@@ -1139,69 +1145,69 @@ export class CheckoutIndex {
                                                           style="
                                                             
                                                             ${item.is_gift
-                                              ? `border:none;`
-                                              : `border-top:none;border-bottom: none;`}
+                                                            ? `border:none;`
+                                                            : `border-top:none;border-bottom: none;`}
                                                             border-radius: 0px; color: #575757; width: 50px;height:38px;background-image:none;${parseInt(
-                                              vm.quantity,
-                                              10
-                                            ) < 10
-                                              ? `text-indent: 43%;`
-                                              : `text-indent: 40%;`}"
+                                                            vm.quantity,
+                                                            10
+                                                          ) < 10
+                                                            ? `text-indent: 43%;`
+                                                            : `text-indent: 40%;`}"
                                                           onchange="${gvc.event(e => {
-                                              apiCart.setCart(cartItem => {
-                                                cartItem.line_items.find(dd => {
-                                                  return (
-                                                    dd.id === item.id &&
-                                                    item.spec.join('') === dd.spec.join('')
-                                                  );
-                                                })!.count = parseInt(e.value, 10);
-                                                refreshCartData();
-                                              });
-                                            })}"
+                                                            apiCart.setCart(cartItem => {
+                                                              cartItem.line_items.find(dd => {
+                                                                return (
+                                                                  dd.id === item.id &&
+                                                                  item.spec.join('') === dd.spec.join('')
+                                                                );
+                                                              })!.count = parseInt(e.value, 10);
+                                                              refreshCartData();
+                                                            });
+                                                          })}"
                                                           ${item.is_gift ? `disabled` : ''}
                                                         >
                                                           ${[
-                                              ...new Array(
-                                                (() => {
-                                                  if (item.show_understocking === 'false') {
-                                                    return 50;
-                                                  }
-                                                  return item.stock < 50 ? item.stock : 50;
-                                                })()
-                                              ),
-                                            ]
-                                              .map((_, index) => {
-                                                return html` <option
+                                                            ...new Array(
+                                                              (() => {
+                                                                if (item.show_understocking === 'false') {
+                                                                  return 50;
+                                                                }
+                                                                return item.stock < 50 ? item.stock : 50;
+                                                              })()
+                                                            ),
+                                                          ]
+                                                            .map((_, index) => {
+                                                              return html` <option
                                                                 value="${index + 1}"
                                                                 ${index + 1 === item.count ? `selected` : ''}
                                                               >
                                                                 ${index + 1}
                                                               </option>`;
-                                              })
-                                              .join('')}
+                                                            })
+                                                            .join('')}
                                                         </select>
                                                         <div
                                                           class=" align-items-center justify-content-center ${item.is_gift
-                                              ? `d-none`
-                                              : `d-flex`}"
+                                                            ? `d-none`
+                                                            : `d-flex`}"
                                                           style="width:38px;height: 38px;cursor: pointer;"
                                                           onclick="${gvc.event(() => {
-                                              apiCart.setCart(cartItem => {
-                                                const find = cartItem.line_items.find(dd => {
-                                                  return (
-                                                    dd.id === item.id &&
-                                                    item.spec.join('') === dd.spec.join('')
-                                                  );
-                                                })!;
-                                                if (
-                                                  item.show_understocking === 'false' ||
-                                                  find.count + 1 < item.stock
-                                                ) {
-                                                  find.count = find.count + 1;
-                                                  refreshCartData();
-                                                }
-                                              });
-                                            })}"
+                                                            apiCart.setCart(cartItem => {
+                                                              const find = cartItem.line_items.find(dd => {
+                                                                return (
+                                                                  dd.id === item.id &&
+                                                                  item.spec.join('') === dd.spec.join('')
+                                                                );
+                                                              })!;
+                                                              if (
+                                                                item.show_understocking === 'false' ||
+                                                                find.count + 1 < item.stock
+                                                              ) {
+                                                                find.count = find.count + 1;
+                                                                refreshCartData();
+                                                              }
+                                                            });
+                                                          })}"
                                                         >
                                                           <i class="fa-solid fa-plus" style="color:black;"></i>
                                                         </div>
@@ -1215,74 +1221,74 @@ export class CheckoutIndex {
                                                         class="fa-solid fa-xmark-large"
                                                         style="cursor: pointer;color:gray;"
                                                         onclick="${gvc.event(() => {
-                                              apiCart.setCart(cartItem => {
-                                                cartItem.line_items = cartItem.line_items.filter(dd => {
-                                                  return !(
-                                                    dd.id === item.id &&
-                                                    item.spec.join('') === dd.spec.join('')
-                                                  );
-                                                });
-                                                refreshCartData();
-                                              });
-                                            })}"
+                                                          apiCart.setCart(cartItem => {
+                                                            cartItem.line_items = cartItem.line_items.filter(dd => {
+                                                              return !(
+                                                                dd.id === item.id &&
+                                                                item.spec.join('') === dd.spec.join('')
+                                                              );
+                                                            });
+                                                            refreshCartData();
+                                                          });
+                                                        })}"
                                                       ></i>
                                                     </div>
                                                   </div>
                                                 </div>
                                                 <div>
                                                   ${vm.cartData.voucherList
-                                              .filter((dd: any) => {
-                                                return (
-                                                  dd.bind.find((d2: any) => {
-                                                    return d2.id === item.id;
-                                                  }) &&
-                                                  dd.reBackType !== 'giveaway' &&
-                                                  dd.reBackType !== 'add_on_items'
-                                                );
-                                              })
-                                              .map((dd: any) => {
-                                                return html`<div
+                                                    .filter((dd: any) => {
+                                                      return (
+                                                        dd.bind.find((d2: any) => {
+                                                          return d2.id === item.id;
+                                                        }) &&
+                                                        dd.reBackType !== 'giveaway' &&
+                                                        dd.reBackType !== 'add_on_items'
+                                                      );
+                                                    })
+                                                    .map((dd: any) => {
+                                                      return html`<div
                                                         class="w-100"
                                                         style="${document.body.clientWidth < 800
-                                                  ? `font-size:12px;`
-                                                  : `font-size:14px;`}"
+                                                          ? `font-size:12px;`
+                                                          : `font-size:14px;`}"
                                                       >
                                                         <i class="fa-solid fa-tickets-perforated  me-2"></i>${dd.title}
                                                       </div>`;
-                                              })
-                                              .join('<div class="my-1"></div>')}
+                                                    })
+                                                    .join('<div class="my-1"></div>')}
                                                   ${(() => {
-                                              let min = (item.min_qty && parseInt(item.min_qty, 10)) || 1;
-                                              let count = 0;
-                                              for (const b of vm.cartData.lineItems) {
-                                                if (b.id === item.id) {
-                                                  count += b.count;
-                                                }
-                                              }
-                                              if (count < min) {
-                                                return `<div class="text-danger">${Language.text('min_p_count').replace('_c_', min)}</div>`;
-                                              } else {
-                                                return '';
-                                              }
-                                            })()}
+                                                    let min = (item.min_qty && parseInt(item.min_qty, 10)) || 1;
+                                                    let count = 0;
+                                                    for (const b of vm.cartData.lineItems) {
+                                                      if (b.id === item.id) {
+                                                        count += b.count;
+                                                      }
+                                                    }
+                                                    if (count < min) {
+                                                      return `<div class="text-danger">${Language.text('min_p_count').replace('_c_', min)}</div>`;
+                                                    } else {
+                                                      return '';
+                                                    }
+                                                  })()}
                                                   ${(() => {
-                                              let max_qty =
-                                                (item.max_qty && parseInt(item.max_qty, 10)) || Infinity;
-                                              let count = 0;
-                                              for (const b of vm.cartData.lineItems) {
-                                                if (b.id === item.id) {
-                                                  count += b.count;
-                                                }
-                                              }
+                                                    let max_qty =
+                                                      (item.max_qty && parseInt(item.max_qty, 10)) || Infinity;
+                                                    let count = 0;
+                                                    for (const b of vm.cartData.lineItems) {
+                                                      if (b.id === item.id) {
+                                                        count += b.count;
+                                                      }
+                                                    }
 
-                                              if (count > max_qty) {
-                                                return html`<div class="text-danger">
+                                                    if (count > max_qty) {
+                                                      return html`<div class="text-danger">
                                                         ${Language.text('max_p_count').replace('_c_', max_qty)}
                                                       </div>`;
-                                              } else {
-                                                return '';
-                                              }
-                                            })()}
+                                                    } else {
+                                                      return '';
+                                                    }
+                                                  })()}
                                                 </div>
                                               </div>
                                             `;
@@ -1406,7 +1412,7 @@ export class CheckoutIndex {
                                                                     titleFontColor:
                                                                       glitter.share.globalValue[
                                                                         'theme_color.0.title'
-                                                                        ] ?? '#333333',
+                                                                      ] ?? '#333333',
                                                                     prod: pd,
                                                                     vm: {
                                                                       specs: pd.specs.map(
@@ -1436,7 +1442,7 @@ export class CheckoutIndex {
                                                                           });
                                                                         }
                                                                       );
-                                                                      
+
                                                                       if (find) {
                                                                         apiCart.setCart(cartItem => {
                                                                           cartItem.line_items.map(dd => {
@@ -1473,11 +1479,11 @@ export class CheckoutIndex {
                                                       })}"
                                                     >
                                                       <span class="${gClass('button-text')}"
-                                                      >${isSelected
-                                                        ? isSelected.id === pd.id
-                                                          ? Language.text('selected')
-                                                          : Language.text('change_gift')
-                                                        : Language.text('select_gift')}</span
+                                                        >${isSelected
+                                                          ? isSelected.id === pd.id
+                                                            ? Language.text('selected')
+                                                            : Language.text('change_gift')
+                                                          : Language.text('select_gift')}</span
                                                       >
                                                     </button>
                                                   </div>
@@ -1526,8 +1532,8 @@ export class CheckoutIndex {
                                                 style="overflow-x:auto;gap:10px;"
                                               >
                                                 ${add_products.response.data
-                                            .map((dd: any) => {
-                                              return html` <div
+                                                  .map((dd: any) => {
+                                                    return html` <div
                                                       class="d-flex py-3 align-items-center"
                                                       style="gap:10px;"
                                                     >
@@ -1545,29 +1551,29 @@ export class CheckoutIndex {
                                                         <button
                                                           class="${gClass('button-bgr')} mb-0 mt-2"
                                                           onclick="${gvc.event(() => {
-                                                const titleFontColor =
-                                                  glitter.share.globalValue['theme_color.0.title'] ??
-                                                  '#333333';
-                                                gvc.glitter.innerDialog(
-                                                  (gvc: GVC) => {
-                                                    return html` <div
+                                                            const titleFontColor =
+                                                              glitter.share.globalValue['theme_color.0.title'] ??
+                                                              '#333333';
+                                                            gvc.glitter.innerDialog(
+                                                              (gvc: GVC) => {
+                                                                return html` <div
                                                                   class=" bg-white shadow  ${document.body.clientWidth >
-                                                    768
-                                                      ? `rounded-3`
-                                                      : ` position-absolute bottom-0`}"
+                                                                  768
+                                                                    ? `rounded-3`
+                                                                    : ` position-absolute bottom-0`}"
                                                                   style=" ${document.body.clientWidth > 768
-                                                      ? `min-width: 400px; width: 1000px;max-height:calc(100% - 150px);overflow-y: auto;`
-                                                      : 'width:calc(100vw);height:100%;'}"
+                                                                    ? `min-width: 400px; width: 1000px;max-height:calc(100% - 150px);overflow-y: auto;`
+                                                                    : 'width:calc(100vw);height:100%;'}"
                                                                 >
                                                                   <div
                                                                     class="bg-white shadow  ${document.body
-                                                      .clientWidth > 768
-                                                      ? `rounded-3`
-                                                      : `h-100`}"
+                                                                      .clientWidth > 768
+                                                                      ? `rounded-3`
+                                                                      : `h-100`}"
                                                                     style="width: 100%;  position: relative;${document
-                                                      .body.clientWidth > 768
-                                                      ? ''
-                                                      : `overflow-y: auto;`}"
+                                                                      .body.clientWidth > 768
+                                                                      ? ''
+                                                                      : `overflow-y: auto;`}"
                                                                   >
                                                                     <div
                                                                       class="w-100 d-flex align-items-center p-3 border-bottom"
@@ -1584,75 +1590,75 @@ export class CheckoutIndex {
                                                                         class="fa-regular fa-circle-xmark fs-5 text-dark"
                                                                         style="cursor: pointer"
                                                                         onclick="${gvc.event(() => {
-                                                      gvc.closeDialog();
-                                                    })}"
+                                                                          gvc.closeDialog();
+                                                                        })}"
                                                                       ></i>
                                                                     </div>
                                                                     <div
                                                                       class="c_dialog_main"
                                                                       style="gap: 24px;  max-height: calc(100% - 100px); ${document
-                                                      .body.clientWidth < 800
-                                                      ? `padding: 12px 20px;`
-                                                      : `padding: 30px;`}"
+                                                                        .body.clientWidth < 800
+                                                                        ? `padding: 12px 20px;`
+                                                                        : `padding: 30px;`}"
                                                                     >
                                                                       ${PdClass.selectSpec({
-                                                      gvc,
-                                                      titleFontColor:
-                                                        glitter.share.globalValue[
-                                                          'theme_color.0.title'
-                                                          ] ?? '#333333',
-                                                      prod: dd.content,
-                                                      vm: {
-                                                        specs: dd.content.specs.map(
-                                                          (spec: {
-                                                            option: {
-                                                              title: string;
-                                                            }[];
-                                                          }) => {
-                                                            return spec.option[0].title;
-                                                          }
-                                                        ),
-                                                        quantity: '1',
-                                                        wishStatus: (
-                                                          glitter.share.wishList ?? []
-                                                        ).some((item: { id: number }) => {
-                                                          return item.id === dd.id;
-                                                        }),
-                                                      },
-                                                      preview: true,
-                                                      with_qty: false,
-                                                      is_gift: true,
-                                                      callback: () => {
-                                                        gvc.closeDialog();
-                                                        let find = vm.cartData.lineItems.find(
-                                                          (d1: any) => {
-                                                            return dd.add_on_products.find(
-                                                              (d2: any) => {
-                                                                return d2.id === d1.id;
-                                                              }
-                                                            );
-                                                          }
-                                                        );
-                                                        if (find) {
-                                                          apiCart.setCart(cartItem => {
-                                                            cartItem.line_items.map(dd => {
-                                                              if (dd.id === find.id) {
-                                                                dd.count--;
-                                                              }
-                                                            });
-                                                            cartItem.line_items =
-                                                              cartItem.line_items.filter(dd => {
-                                                                return dd.count > 0;
-                                                              });
-                                                            refreshCartData();
-                                                            gvc.closeDialog();
-                                                          });
-                                                        } else {
-                                                          refreshCartData();
-                                                          gvc.closeDialog();
-                                                        }
-                                                      },
-                                                    })}
+                                                                        gvc,
+                                                                        titleFontColor:
+                                                                          glitter.share.globalValue[
+                                                                            'theme_color.0.title'
+                                                                          ] ?? '#333333',
+                                                                        prod: dd.content,
+                                                                        vm: {
+                                                                          specs: dd.content.specs.map(
+                                                                            (spec: {
+                                                                              option: {
+                                                                                title: string;
+                                                                              }[];
+                                                                            }) => {
+                                                                              return spec.option[0].title;
+                                                                            }
+                                                                          ),
+                                                                          quantity: '1',
+                                                                          wishStatus: (
+                                                                            glitter.share.wishList ?? []
+                                                                          ).some((item: { id: number }) => {
+                                                                            return item.id === dd.id;
+                                                                          }),
+                                                                        },
+                                                                        preview: true,
+                                                                        with_qty: false,
+                                                                        is_gift: true,
+                                                                        callback: () => {
+                                                                          gvc.closeDialog();
+                                                                          let find = vm.cartData.lineItems.find(
+                                                                            (d1: any) => {
+                                                                              return dd.add_on_products.find(
+                                                                                (d2: any) => {
+                                                                                  return d2.id === d1.id;
+                                                                                }
+                                                                              );
+                                                                            }
+                                                                          );
+                                                                          if (find) {
+                                                                            apiCart.setCart(cartItem => {
+                                                                              cartItem.line_items.map(dd => {
+                                                                                if (dd.id === find.id) {
+                                                                                  dd.count--;
+                                                                                }
+                                                                              });
+                                                                              cartItem.line_items =
+                                                                                cartItem.line_items.filter(dd => {
+                                                                                  return dd.count > 0;
+                                                                                });
+                                                                              refreshCartData();
+                                                                              gvc.closeDialog();
+                                                                            });
+                                                                          } else {
+                                                                            refreshCartData();
+                                                                            gvc.closeDialog();
+                                                                          }
+                                                                        },
+                                                                      })}
                                                                       <div
                                                                         class="d-sm-none"
                                                                         style="height:100px;"
@@ -1660,16 +1666,16 @@ export class CheckoutIndex {
                                                                     </div>
                                                                   </div>
                                                                 </div>`;
-                                                  },
-                                                  Tool.randomString(7),
-                                                  {
-                                                    animation:
-                                                      document.body.clientWidth < 768
-                                                        ? Animation.popup
-                                                        : Animation.fade,
-                                                  }
-                                                );
-                                              })}"
+                                                              },
+                                                              Tool.randomString(7),
+                                                              {
+                                                                animation:
+                                                                  document.body.clientWidth < 768
+                                                                    ? Animation.popup
+                                                                    : Animation.fade,
+                                                              }
+                                                            );
+                                                          })}"
                                                         >
                                                           <span class="${gClass('button-text')}"
                                                             >${Language.text('add_to_cart')}</span
@@ -1677,8 +1683,8 @@ export class CheckoutIndex {
                                                         </button>
                                                       </div>
                                                     </div>`;
-                                            })
-                                            .join('')}
+                                                  })
+                                                  .join('')}
                                               </div>
                                             </div>
                                           `;
@@ -1759,18 +1765,18 @@ export class CheckoutIndex {
                                               >
                                                 ${shipmentList.length > 0
                                                   ? shipmentList
-                                                    .map((dd: { name: string; value: string }) => {
-                                                      return html` <option
-                                                        value="${dd.value}"
-                                                        ${vm.cartData.user_info.shipment === dd.value
-                                                          ? `selected`
-                                                          : ''}
-                                                      >
-                                                        ${Language.text(`ship_${dd.value}`) ||
-                                                        Language.getLanguageCustomText(dd.name)}
-                                                      </option>`;
-                                                    })
-                                                    .join('')
+                                                      .map((dd: { name: string; value: string }) => {
+                                                        return html` <option
+                                                          value="${dd.value}"
+                                                          ${vm.cartData.user_info.shipment === dd.value
+                                                            ? `selected`
+                                                            : ''}
+                                                        >
+                                                          ${Language.text(`ship_${dd.value}`) ||
+                                                          Language.getLanguageCustomText(dd.name)}
+                                                        </option>`;
+                                                      })
+                                                      .join('')
                                                   : html` <option selected>(${Language.text('disable_ship')})</option>`}
                                               </select>
                                             </div>`;
@@ -1790,9 +1796,9 @@ export class CheckoutIndex {
                                               ).response.value;
                                               if (log_config.content) {
                                                 return html` <label class="${gClass('label')}"
-                                                >${Language.text('shipping_instructions')}</label
-                                                >
-                                                <div class="border rounded-3 p-2">${log_config.content}</div>`;
+                                                    >${Language.text('shipping_instructions')}</label
+                                                  >
+                                                  <div class="border rounded-3 p-2">${log_config.content}</div>`;
                                               }
                                               return '';
                                             },
@@ -1815,8 +1821,8 @@ export class CheckoutIndex {
                                         );
                                       })()
                                         ? gvc.bindView(() => {
-                                          const id = gvc.glitter.getUUID();
-                                          gvc.addStyle(`
+                                            const id = gvc.glitter.getUUID();
+                                            gvc.addStyle(`
                                               .city-selector select {
                                                 -webkit-appearance: none;
                                                 -moz-appearance: none;
@@ -1829,157 +1835,157 @@ export class CheckoutIndex {
                                                 flex: 1;
                                               }
                                             `);
-                                          let select_id = '';
-                                          return {
-                                            bind: id,
-                                            view: () => {
-                                              select_id = gvc.glitter.getUUID();
-                                              return html`<label
-                                                class="${gClass('label')} w-100 d-flex align-items-center"
-                                              >${Language.text('shipping_address')}
-                                                <div class="flex-fill"></div>
-                                                <div
-                                                  class="fs-sm fw-500 ${!GlobalUser.token ? `d-none` : ''}"
-                                                  style="cursor: pointer; color: #3366bb;"
-                                                  onclick="${gvc.event(() => {
-                                                    ApiUser.getUserData(GlobalUser.token, 'me').then(res => {
-                                                      vm.cartData.user_info.address =
-                                                        res.response.userData.consignee_address;
-                                                      this.storeLocalData(vm.cartData);
-                                                      gvc.notifyDataChange(id);
+                                            let select_id = '';
+                                            return {
+                                              bind: id,
+                                              view: () => {
+                                                select_id = gvc.glitter.getUUID();
+                                                return html`<label
+                                                    class="${gClass('label')} w-100 d-flex align-items-center"
+                                                    >${Language.text('shipping_address')}
+                                                    <div class="flex-fill"></div>
+                                                    <div
+                                                      class="fs-sm fw-500 ${!GlobalUser.token ? `d-none` : ''}"
+                                                      style="cursor: pointer; color: #3366bb;"
+                                                      onclick="${gvc.event(() => {
+                                                        ApiUser.getUserData(GlobalUser.token, 'me').then(res => {
+                                                          vm.cartData.user_info.address =
+                                                            res.response.userData.consignee_address;
+                                                          this.storeLocalData(vm.cartData);
+                                                          gvc.notifyDataChange(id);
+                                                        });
+                                                      })}"
+                                                    >
+                                                      ${Language.text('quick_input')}
+                                                    </div>
+                                                  </label>
+                                                  <div class="row">
+                                                    <div class="col-12 mb-3">
+                                                      <div
+                                                        role="tw-city-selector"
+                                                        id="select_id_${id}"
+                                                        class="w-100 city-selector d-flex d_${select_id}"
+                                                        style="gap:15px;"
+                                                      ></div>
+                                                    </div>
+                                                    <div class="col-12">
+                                                      <input
+                                                        class="${gClass('input')}"
+                                                        type="address"
+                                                        placeholder="${Language.text('please_enter_street_location')}"
+                                                        value="${vm.cartData.user_info.address || ''}"
+                                                        onchange="${gvc.event(e => {
+                                                          vm.cartData.user_info.address = e.value;
+                                                          this.storeLocalData(vm.cartData);
+                                                        })}"
+                                                      />
+                                                    </div>
+                                                  </div> `;
+                                              },
+                                              divCreate: {
+                                                class: `col-12  mb-2`,
+                                              },
+                                              onCreate: () => {
+                                                gvc.glitter.addMtScript(
+                                                  [
+                                                    {
+                                                      src: 'https://cdn.jsdelivr.net/npm/tw-city-selector@2.1.1/dist/tw-city-selector.min.js',
+                                                    },
+                                                  ],
+                                                  () => {
+                                                    //@ts-ignore
+                                                    const tw_selector = new TwCitySelector({
+                                                      el: `.d_${select_id}`,
                                                     });
-                                                  })}"
-                                                >
-                                                  ${Language.text('quick_input')}
-                                                </div>
-                                              </label>
-                                              <div class="row">
-                                                <div class="col-12 mb-3">
-                                                  <div
-                                                    role="tw-city-selector"
-                                                    id="select_id_${id}"
-                                                    class="w-100 city-selector d-flex d_${select_id}"
-                                                    style="gap:15px;"
-                                                  ></div>
-                                                </div>
-                                                <div class="col-12">
-                                                  <input
-                                                    class="${gClass('input')}"
-                                                    type="address"
-                                                    placeholder="${Language.text('please_enter_street_location')}"
-                                                    value="${vm.cartData.user_info.address || ''}"
-                                                    onchange="${gvc.event(e => {
-                                                      vm.cartData.user_info.address = e.value;
-                                                      this.storeLocalData(vm.cartData);
-                                                    })}"
-                                                  />
-                                                </div>
-                                              </div> `;
-                                            },
-                                            divCreate: {
-                                              class: `col-12  mb-2`,
-                                            },
-                                            onCreate: () => {
-                                              gvc.glitter.addMtScript(
-                                                [
-                                                  {
-                                                    src: 'https://cdn.jsdelivr.net/npm/tw-city-selector@2.1.1/dist/tw-city-selector.min.js',
-                                                  },
-                                                ],
-                                                () => {
-                                                  //@ts-ignore
-                                                  const tw_selector = new TwCitySelector({
-                                                    el: `.d_${select_id}`,
-                                                  });
-                                                  const interVal = setInterval(() => {
-                                                    if (document.querySelector(`#select_id_${id} .county`) as any) {
-                                                      clearInterval(interVal);
-                                                      (
-                                                        document.querySelector(`#select_id_${id} .county`) as any
-                                                      ).addEventListener('change', (event: any) => {
-                                                        // 獲取當前選中的值
-                                                        const selectedValue = event.target.value;
-
-                                                        // 根據選中的值執行其他操作
-                                                        vm.cartData.user_info.city = selectedValue;
-                                                        vm.cartData.user_info.area = undefined;
-                                                        this.storeLocalData(vm.cartData);
-                                                      });
-                                                      (
-                                                        document.querySelector(`#select_id_${id} .district`) as any
-                                                      ).addEventListener('change', (event: any) => {
-                                                        // 獲取當前選中的值
-                                                        const selectedValue = event.target.value;
-
-                                                        // 根據選中的值執行其他操作
-                                                        vm.cartData.user_info.area = selectedValue;
-                                                        this.storeLocalData(vm.cartData);
-                                                      });
+                                                    const interVal = setInterval(() => {
+                                                      if (document.querySelector(`#select_id_${id} .county`) as any) {
+                                                        clearInterval(interVal);
+                                                        (
+                                                          document.querySelector(`#select_id_${id} .county`) as any
+                                                        ).addEventListener('change', (event: any) => {
+                                                          // 獲取當前選中的值
+                                                          const selectedValue = event.target.value;
+
+                                                          // 根據選中的值執行其他操作
+                                                          vm.cartData.user_info.city = selectedValue;
+                                                          vm.cartData.user_info.area = undefined;
+                                                          this.storeLocalData(vm.cartData);
+                                                        });
+                                                        (
+                                                          document.querySelector(`#select_id_${id} .district`) as any
+                                                        ).addEventListener('change', (event: any) => {
+                                                          // 獲取當前選中的值
+                                                          const selectedValue = event.target.value;
+
+                                                          // 根據選中的值執行其他操作
+                                                          vm.cartData.user_info.area = selectedValue;
+                                                          this.storeLocalData(vm.cartData);
+                                                        });
 
-                                                      if (vm.cartData.user_info.city && vm.cartData.user_info.area) {
-                                                        tw_selector.setValue(
-                                                          vm.cartData.user_info.city,
-                                                          vm.cartData.user_info.area
-                                                        );
-                                                      } else if (vm.cartData.user_info.city) {
-                                                        tw_selector.setValue(vm.cartData.user_info.city);
+                                                        if (vm.cartData.user_info.city && vm.cartData.user_info.area) {
+                                                          tw_selector.setValue(
+                                                            vm.cartData.user_info.city,
+                                                            vm.cartData.user_info.area
+                                                          );
+                                                        } else if (vm.cartData.user_info.city) {
+                                                          tw_selector.setValue(vm.cartData.user_info.city);
+                                                        }
                                                       }
-                                                    }
-                                                    glitter.share.tw_selector = tw_selector;
-                                                  }, 100);
-                                                },
-                                                () => {}
-                                              );
-                                            },
-                                          };
-                                        })
+                                                      glitter.share.tw_selector = tw_selector;
+                                                    }, 100);
+                                                  },
+                                                  () => {}
+                                                );
+                                              },
+                                            };
+                                          })
                                         : ''}
                                       <!-- 選取超商 -->
                                       ${ShipmentConfig.supermarketList.includes(vm.cartData.user_info.shipment)
                                         ? html` <div class="col-12">
-                                          <button
-                                            class="${gClass('button-bgr')}"
-                                            onclick="${gvc.event(() => {
-                                              ApiDelivery.storeMaps({
-                                                returnURL: (() => {
+                                            <button
+                                              class="${gClass('button-bgr')}"
+                                              onclick="${gvc.event(() => {
+                                                ApiDelivery.storeMaps({
+                                                  returnURL: (() => {
+                                                    if (ApplicationConfig.device_type === 'ios') {
+                                                      const url = new URL(location.href);
+                                                      url.searchParams.set('select_map_finish', 'true');
+                                                      return url.href;
+                                                    } else {
+                                                      return location.href;
+                                                    }
+                                                  })(),
+                                                  logistics: vm.cartData.user_info.shipment,
+                                                }).then(async res => {
                                                   if (ApplicationConfig.device_type === 'ios') {
-                                                    const url = new URL(location.href);
-                                                    url.searchParams.set('select_map_finish', 'true');
-                                                    return url.href;
+                                                    glitter.runJsInterFace(
+                                                      'post_form',
+                                                      {
+                                                        form: res.response.form,
+                                                      },
+                                                      () => {}
+                                                    );
                                                   } else {
-                                                    return location.href;
+                                                    const form_id = gvc.glitter.getUUID();
+                                                    $('body').append(`<div id="${form_id}">${res.response.form}</div>`);
+                                                    (document.querySelector(`#${form_id} #submit`) as any).click();
                                                   }
-                                                })(),
-                                                logistics: vm.cartData.user_info.shipment,
-                                              }).then(async res => {
-                                                if (ApplicationConfig.device_type === 'ios') {
-                                                  glitter.runJsInterFace(
-                                                    'post_form',
-                                                    {
-                                                      form: res.response.form,
-                                                    },
-                                                    () => {}
-                                                  );
-                                                } else {
-                                                  const form_id = gvc.glitter.getUUID();
-                                                  $('body').append(`<div id="${form_id}">${res.response.form}</div>`);
-                                                  (document.querySelector(`#${form_id} #submit`) as any).click();
-                                                }
-                                              });
-                                            })}"
-                                          >
+                                                });
+                                              })}"
+                                            >
                                               <span class="${gClass('button-text')}"
-                                              >${(() => {
-                                                let cvs = glitter.getUrlParameter('CVSStoreName') || '';
-                                                if (decodeURIComponent(cvs)) {
-                                                  return `${decodeURIComponent(cvs)} 『 ${Language.text('click_to_reselct_store')} 』`;
-                                                } else {
-                                                  return Language.text('select_pickup_store');
-                                                }
-                                              })()}</span
+                                                >${(() => {
+                                                  let cvs = glitter.getUrlParameter('CVSStoreName') || '';
+                                                  if (decodeURIComponent(cvs)) {
+                                                    return `${decodeURIComponent(cvs)} 『 ${Language.text('click_to_reselct_store')} 』`;
+                                                  } else {
+                                                    return Language.text('select_pickup_store');
+                                                  }
+                                                })()}</span
                                               >
-                                          </button>
-                                        </div>`
+                                            </button>
+                                          </div>`
                                         : ''}
                                       ${(() => {
                                         if (vm.cartData.user_info.shipment === 'none') {
@@ -1987,138 +1993,138 @@ export class CheckoutIndex {
                                         }
                                         const ship_method = this.getShipmentMethod(vm.cartData).find((dd: any) => {
                                           return vm.cartData.user_info.shipment === dd.value;
-                                        });
-                                        if (ship_method && ship_method.system_form) {
-                                          return (ship_method.system_form ?? []).includes('global-address-selector');
-                                        }
-                                        return ['global_express'].includes(vm.cartData.user_info.shipment);
-                                      })()
-                                        ? [
-                                          html`<label class="${gClass('label')}">${Language.text('country')}</label>
-                                          ${gvc.bindView(() => {
-                                            const id = gvc.glitter.getUUID();
-                                            return {
-                                              bind: id,
-                                              view: async () => {
-                                                let country_select: any = [];
-                                                const support_country = (
-                                                  await ApiUser.getPublicConfig('global_express_country', 'manager')
-                                                ).response.value.country;
-                                                await new Promise((resolve, reject) => {
-                                                  glitter.getModule(
-                                                    (() => {
-                                                      switch (Language.getLanguage()) {
-                                                        case 'en-US':
-                                                          return `${gvc.glitter.root_path}/modules/country-language/country-en.js`;
-                                                        case 'zh-CN':
-                                                          return `${gvc.glitter.root_path}/modules/country-language/country-zh.js`;
-                                                        default:
-                                                          return `${gvc.glitter.root_path}/modules/country-language/country-tw.js`;
-                                                      }
-                                                    })(),
-                                                    response => {
-                                                      country_select = response.filter((dd: any) => {
-                                                        return support_country.includes(dd.countryCode);
-                                                      });
-                                                      resolve(true);
-                                                    }
-                                                  );
-                                                });
-                                                return html`<select
-                                                  class="w-100 ${gClass('select')}"
-                                                  onchange="${gvc.event((e, event) => {
-                                                    vm.cartData.user_info.country = e.value;
-                                                    this.storeLocalData(vm.cartData);
-                                                    refreshCartData();
-                                                  })}"
-                                                >
-                                                  ${(() => {
-                                                    let map = country_select.map(
-                                                      (dd: { countryCode: string; countryName: string }) => {
-                                                        return html`
-                                                          <option
-                                                            value="${dd.countryCode}"
-                                                            ${vm.cartData.user_info.country === dd.countryCode
-                                                              ? `selected`
-                                                              : ''}
-                                                          >
-                                                            ${dd.countryName}
-                                                          </option>
-                                                        `;
-                                                      }
-                                                    );
-                                                    if (
-                                                      !country_select.find((dd: any) => {
-                                                        return dd.countryCode === vm.cartData.user_info.country;
-                                                      })
-                                                    ) {
-                                                      delete vm.cartData.user_info.country;
-                                                      map.push(
-                                                        html` <option class="d-none" selected>
-                                                          ${Language.text('select_country')}
-                                                        </option>`
-                                                      );
-                                                    }
-                                                    return map.join('');
-                                                  })()}
-                                                </select>`;
-                                              },
-                                            };
-                                          })}`,
-                                          html` <label class="${gClass('label')}"
-                                          >${Language.text('shipping_address')}</label
-                                          >
-                                          <input
-                                            class="${gClass('input')}"
-                                            type="address"
-                                            placeholder="${Language.text('please_enter_delivery_address')}"
-                                            value="${vm.cartData.user_info.address || ''}"
-                                            onchange="${gvc.event(e => {
-                                              vm.cartData.user_info.address = e.value;
-                                              this.storeLocalData(vm.cartData);
-                                            })}"
-                                          />`,
-                                          html` <label class="${gClass('label')}">${Language.text('city')}</label>
-                                          <input
-                                            class="${gClass('input')}"
-                                            type="city"
-                                            placeholder="${Language.text('city')}"
-                                            value="${vm.cartData.user_info.city || ''}"
-                                            onchange="${gvc.event(e => {
-                                              vm.cartData.user_info.city = e.value;
-                                              this.storeLocalData(vm.cartData);
-                                            })}"
-                                          />`,
-                                          html` <label class="${gClass('label')}">${Language.text('state')}</label>
-                                          <input
-                                            class="${gClass('input')}"
-                                            class="${gClass('input')}"
-                                            type="state"
-                                            placeholder="${Language.text('state')}"
-                                            value="${vm.cartData.user_info.state || ''}"
-                                            onchange="${gvc.event(e => {
-                                              vm.cartData.user_info.state = e.value;
-                                              this.storeLocalData(vm.cartData);
-                                            })}"
-                                          />`,
-                                          html` <label class="${gClass('label')}"
-                                          >${Language.text('postal_code')}</label
-                                          >
-                                          <input
-                                            class="${gClass('input')}"
-                                            type=""
-                                            placeholder="${Language.text('postal_code')}"
-                                            value="${vm.cartData.user_info.postal_code || ''}"
-                                            onchange="${gvc.event(e => {
-                                              vm.cartData.user_info.postal_code = e.value;
-                                              this.storeLocalData(vm.cartData);
-                                            })}"
-                                          />`,
-                                        ]
-                                          .map(dd => {
-                                            return html` <div class="col-12 col-md-6 mb-2">${dd}</div>`;
-                                          })
-                                          .join('')
+                                        });
+                                        if (ship_method && ship_method.system_form) {
+                                          return (ship_method.system_form ?? []).includes('global-address-selector');
+                                        }
+                                        return ['global_express'].includes(vm.cartData.user_info.shipment);
+                                      })()
+                                        ? [
+                                            html`<label class="${gClass('label')}">${Language.text('country')}</label>
+                                              ${gvc.bindView(() => {
+                                                const id = gvc.glitter.getUUID();
+                                                return {
+                                                  bind: id,
+                                                  view: async () => {
+                                                    let country_select: any = [];
+                                                    const support_country = (
+                                                      await ApiUser.getPublicConfig('global_express_country', 'manager')
+                                                    ).response.value.country;
+                                                    await new Promise((resolve, reject) => {
+                                                      glitter.getModule(
+                                                        (() => {
+                                                          switch (Language.getLanguage()) {
+                                                            case 'en-US':
+                                                              return `${gvc.glitter.root_path}/modules/country-language/country-en.js`;
+                                                            case 'zh-CN':
+                                                              return `${gvc.glitter.root_path}/modules/country-language/country-zh.js`;
+                                                            default:
+                                                              return `${gvc.glitter.root_path}/modules/country-language/country-tw.js`;
+                                                          }
+                                                        })(),
+                                                        response => {
+                                                          country_select = response.filter((dd: any) => {
+                                                            return support_country.includes(dd.countryCode);
+                                                          });
+                                                          resolve(true);
+                                                        }
+                                                      );
+                                                    });
+                                                    return html`<select
+                                                      class="w-100 ${gClass('select')}"
+                                                      onchange="${gvc.event((e, event) => {
+                                                        vm.cartData.user_info.country = e.value;
+                                                        this.storeLocalData(vm.cartData);
+                                                        refreshCartData();
+                                                      })}"
+                                                    >
+                                                      ${(() => {
+                                                        let map = country_select.map(
+                                                          (dd: { countryCode: string; countryName: string }) => {
+                                                            return html`
+                                                              <option
+                                                                value="${dd.countryCode}"
+                                                                ${vm.cartData.user_info.country === dd.countryCode
+                                                                  ? `selected`
+                                                                  : ''}
+                                                              >
+                                                                ${dd.countryName}
+                                                              </option>
+                                                            `;
+                                                          }
+                                                        );
+                                                        if (
+                                                          !country_select.find((dd: any) => {
+                                                            return dd.countryCode === vm.cartData.user_info.country;
+                                                          })
+                                                        ) {
+                                                          delete vm.cartData.user_info.country;
+                                                          map.push(
+                                                            html` <option class="d-none" selected>
+                                                              ${Language.text('select_country')}
+                                                            </option>`
+                                                          );
+                                                        }
+                                                        return map.join('');
+                                                      })()}
+                                                    </select>`;
+                                                  },
+                                                };
+                                              })}`,
+                                            html` <label class="${gClass('label')}"
+                                                >${Language.text('shipping_address')}</label
+                                              >
+                                              <input
+                                                class="${gClass('input')}"
+                                                type="address"
+                                                placeholder="${Language.text('please_enter_delivery_address')}"
+                                                value="${vm.cartData.user_info.address || ''}"
+                                                onchange="${gvc.event(e => {
+                                                  vm.cartData.user_info.address = e.value;
+                                                  this.storeLocalData(vm.cartData);
+                                                })}"
+                                              />`,
+                                            html` <label class="${gClass('label')}">${Language.text('city')}</label>
+                                              <input
+                                                class="${gClass('input')}"
+                                                type="city"
+                                                placeholder="${Language.text('city')}"
+                                                value="${vm.cartData.user_info.city || ''}"
+                                                onchange="${gvc.event(e => {
+                                                  vm.cartData.user_info.city = e.value;
+                                                  this.storeLocalData(vm.cartData);
+                                                })}"
+                                              />`,
+                                            html` <label class="${gClass('label')}">${Language.text('state')}</label>
+                                              <input
+                                                class="${gClass('input')}"
+                                                class="${gClass('input')}"
+                                                type="state"
+                                                placeholder="${Language.text('state')}"
+                                                value="${vm.cartData.user_info.state || ''}"
+                                                onchange="${gvc.event(e => {
+                                                  vm.cartData.user_info.state = e.value;
+                                                  this.storeLocalData(vm.cartData);
+                                                })}"
+                                              />`,
+                                            html` <label class="${gClass('label')}"
+                                                >${Language.text('postal_code')}</label
+                                              >
+                                              <input
+                                                class="${gClass('input')}"
+                                                type=""
+                                                placeholder="${Language.text('postal_code')}"
+                                                value="${vm.cartData.user_info.postal_code || ''}"
+                                                onchange="${gvc.event(e => {
+                                                  vm.cartData.user_info.postal_code = e.value;
+                                                  this.storeLocalData(vm.cartData);
+                                                })}"
+                                              />`,
+                                          ]
+                                            .map(dd => {
+                                              return html` <div class="col-12 col-md-6 mb-2">${dd}</div>`;
+                                            })
+                                            .join('')
                                         : ''}
                                       ${(() => {
                                         try {
@@ -2441,293 +2447,293 @@ export class CheckoutIndex {
                                             ...(method === 'nouse'
                                               ? []
                                               : [
-                                                {
-                                                  col: '6',
-                                                  key: 'invoice_type',
-                                                  page: 'form-select',
-                                                  type: 'form_plugin_v2',
-                                                  group: '',
-                                                  title: Language.text('invoice_recipient'),
-                                                  col_sm: '12',
-                                                  appName: 'cms_system',
-                                                  require: 'true',
-                                                  readonly: 'write',
-                                                  formFormat: '{}',
-                                                  moduleName: '下拉選單',
-                                                  style_data: {
-                                                    input: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
-                                                    },
-                                                    label: {
-                                                      list: [],
-                                                      class: 'form-label fs-base ',
-                                                      style: '',
-                                                      version: 'v2',
+                                                  {
+                                                    col: '6',
+                                                    key: 'invoice_type',
+                                                    page: 'form-select',
+                                                    type: 'form_plugin_v2',
+                                                    group: '',
+                                                    title: Language.text('invoice_recipient'),
+                                                    col_sm: '12',
+                                                    appName: 'cms_system',
+                                                    require: 'true',
+                                                    readonly: 'write',
+                                                    formFormat: '{}',
+                                                    moduleName: '下拉選單',
+                                                    style_data: {
+                                                      input: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
+                                                      label: {
+                                                        list: [],
+                                                        class: 'form-label fs-base ',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
+                                                      container: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
                                                     },
-                                                    container: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
+                                                    form_config: {
+                                                      type: 'name',
+                                                      title: '',
+                                                      option: [
+                                                        {
+                                                          name: Language.text('personal'),
+                                                          index: 0,
+                                                          value: 'me',
+                                                        },
+                                                        {
+                                                          name: Language.text('company'),
+                                                          index: 1,
+                                                          value: 'company',
+                                                        },
+                                                        {
+                                                          name: Language.text('donate_invoice'),
+                                                          index: 2,
+                                                          value: 'donate',
+                                                        },
+                                                      ],
+                                                      input_style: { list: [], version: 'v2' },
+                                                      title_style: { list: [], version: 'v2' },
+                                                      place_holder: '',
                                                     },
+                                                    hidden_code: "return (form_data['invoice_method']==='nouse')",
                                                   },
-                                                  form_config: {
-                                                    type: 'name',
-                                                    title: '',
-                                                    option: [
-                                                      {
-                                                        name: Language.text('personal'),
-                                                        index: 0,
-                                                        value: 'me',
+                                                  {
+                                                    col: '6',
+                                                    key: 'send_type',
+                                                    page: 'form-select',
+                                                    type: 'form_plugin_v2',
+                                                    group: '',
+                                                    title: Language.text('invoice_method'),
+                                                    col_sm: '12',
+                                                    appName: 'cms_system',
+                                                    require: 'true',
+                                                    readonly: 'write',
+                                                    formFormat: '{}',
+                                                    moduleName: '下拉選單',
+                                                    style_data: {
+                                                      input: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
                                                       },
-                                                      {
-                                                        name: Language.text('company'),
-                                                        index: 1,
-                                                        value: 'company',
+                                                      label: {
+                                                        list: [],
+                                                        class: 'form-label fs-base ',
+                                                        style: '',
+                                                        version: 'v2',
                                                       },
-                                                      {
-                                                        name: Language.text('donate_invoice'),
-                                                        index: 2,
-                                                        value: 'donate',
+                                                      container: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
                                                       },
-                                                    ],
-                                                    input_style: { list: [], version: 'v2' },
-                                                    title_style: { list: [], version: 'v2' },
-                                                    place_holder: '',
-                                                  },
-                                                  hidden_code: "return (form_data['invoice_method']==='nouse')",
-                                                },
-                                                {
-                                                  col: '6',
-                                                  key: 'send_type',
-                                                  page: 'form-select',
-                                                  type: 'form_plugin_v2',
-                                                  group: '',
-                                                  title: Language.text('invoice_method'),
-                                                  col_sm: '12',
-                                                  appName: 'cms_system',
-                                                  require: 'true',
-                                                  readonly: 'write',
-                                                  formFormat: '{}',
-                                                  moduleName: '下拉選單',
-                                                  style_data: {
-                                                    input: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
-                                                    },
-                                                    label: {
-                                                      list: [],
-                                                      class: 'form-label fs-base ',
-                                                      style: '',
-                                                      version: 'v2',
                                                     },
-                                                    container: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
+                                                    form_config: {
+                                                      type: 'name',
+                                                      title: '',
+                                                      option: [
+                                                        {
+                                                          name: Language.text('send_to_user_email'),
+                                                          index: 0,
+                                                          value: 'email',
+                                                        },
+                                                        {
+                                                          name: Language.text('mobile_barcode_device'),
+                                                          index: 1,
+                                                          value: 'carrier',
+                                                        },
+                                                      ],
+                                                      input_style: { list: [], version: 'v2' },
+                                                      title_style: { list: [], version: 'v2' },
+                                                      place_holder: '',
                                                     },
+                                                    hidden_code:
+                                                      "    if(form_data['invoice_type']!=='me' || (form_data['invoice_method']==='nouse') || (form_data['invoice_method']==='off_line')){\n         form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
                                                   },
-                                                  form_config: {
-                                                    type: 'name',
-                                                    title: '',
-                                                    option: [
-                                                      {
-                                                        name: Language.text('send_to_user_email'),
-                                                        index: 0,
-                                                        value: 'email',
+                                                  {
+                                                    key: 'carrier_num',
+                                                    page: 'input',
+                                                    type: 'form_plugin_v2',
+                                                    group: '',
+                                                    title: Language.text('carrier_number'),
+                                                    appName: 'cms_system',
+                                                    require: 'false',
+                                                    readonly: 'write',
+                                                    formFormat: '{}',
+                                                    moduleName: '輸入框',
+                                                    col: '3',
+                                                    col_sm: '12',
+                                                    style_data: {
+                                                      input: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
                                                       },
-                                                      {
-                                                        name: Language.text('mobile_barcode_device'),
-                                                        index: 1,
-                                                        value: 'carrier',
+                                                      label: {
+                                                        list: [],
+                                                        class: 'form-label fs-base ',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
+                                                      container: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
                                                       },
-                                                    ],
-                                                    input_style: { list: [], version: 'v2' },
-                                                    title_style: { list: [], version: 'v2' },
-                                                    place_holder: '',
-                                                  },
-                                                  hidden_code:
-                                                    "    if(form_data['invoice_type']!=='me' || (form_data['invoice_method']==='nouse') || (form_data['invoice_method']==='off_line')){\n         form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
-                                                },
-                                                {
-                                                  key: 'carrier_num',
-                                                  page: 'input',
-                                                  type: 'form_plugin_v2',
-                                                  group: '',
-                                                  title: Language.text('carrier_number'),
-                                                  appName: 'cms_system',
-                                                  require: 'false',
-                                                  readonly: 'write',
-                                                  formFormat: '{}',
-                                                  moduleName: '輸入框',
-                                                  col: '3',
-                                                  col_sm: '12',
-                                                  style_data: {
-                                                    input: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
-                                                    },
-                                                    label: {
-                                                      list: [],
-                                                      class: 'form-label fs-base ',
-                                                      style: '',
-                                                      version: 'v2',
                                                     },
-                                                    container: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
+                                                    form_config: {
+                                                      type: 'name',
+                                                      title: '',
+                                                      input_style: { list: [], version: 'v2' },
+                                                      title_style: { list: [], version: 'v2' },
+                                                      place_holder: Language.text('please_enter_carrier_number'),
                                                     },
+                                                    hidden_code:
+                                                      "    \n    if(form_data['invoice_type']!=='me' || form_data['send_type']!=='carrier'){\n       form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
                                                   },
-                                                  form_config: {
-                                                    type: 'name',
-                                                    title: '',
-                                                    input_style: { list: [], version: 'v2' },
-                                                    title_style: { list: [], version: 'v2' },
-                                                    place_holder: Language.text('please_enter_carrier_number'),
-                                                  },
-                                                  hidden_code:
-                                                    "    \n    if(form_data['invoice_type']!=='me' || form_data['send_type']!=='carrier'){\n       form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
-                                                },
-                                                {
-                                                  key: 'company',
-                                                  page: 'input',
-                                                  type: 'form_plugin_v2',
-                                                  group: '',
-                                                  title: Language.text('company_name'),
-                                                  appName: 'cms_system',
-                                                  require: 'false',
-                                                  readonly: 'write',
-                                                  formFormat: '{}',
-                                                  moduleName: '輸入框',
-                                                  col: '3',
-                                                  col_sm: '12',
-                                                  style_data: {
-                                                    input: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
-                                                    },
-                                                    label: {
-                                                      list: [],
-                                                      class: 'form-label fs-base ',
-                                                      style: '',
-                                                      version: 'v2',
+                                                  {
+                                                    key: 'company',
+                                                    page: 'input',
+                                                    type: 'form_plugin_v2',
+                                                    group: '',
+                                                    title: Language.text('company_name'),
+                                                    appName: 'cms_system',
+                                                    require: 'false',
+                                                    readonly: 'write',
+                                                    formFormat: '{}',
+                                                    moduleName: '輸入框',
+                                                    col: '3',
+                                                    col_sm: '12',
+                                                    style_data: {
+                                                      input: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
+                                                      label: {
+                                                        list: [],
+                                                        class: 'form-label fs-base ',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
+                                                      container: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
                                                     },
-                                                    container: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
+                                                    form_config: {
+                                                      type: 'name',
+                                                      title: '',
+                                                      input_style: { list: [], version: 'v2' },
+                                                      title_style: { list: [], version: 'v2' },
+                                                      place_holder: Language.text('please_enter_company_name'),
                                                     },
+                                                    hidden_code:
+                                                      "    if(form_data['invoice_type']!=='company' || (form_data['invoice_method']==='nouse')){\n         form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
                                                   },
-                                                  form_config: {
-                                                    type: 'name',
-                                                    title: '',
-                                                    input_style: { list: [], version: 'v2' },
-                                                    title_style: { list: [], version: 'v2' },
-                                                    place_holder: Language.text('please_enter_company_name'),
-                                                  },
-                                                  hidden_code:
-                                                    "    if(form_data['invoice_type']!=='company' || (form_data['invoice_method']==='nouse')){\n         form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
-                                                },
-                                                {
-                                                  key: 'gui_number',
-                                                  page: 'input',
-                                                  type: 'form_plugin_v2',
-                                                  group: '',
-                                                  title: Language.text('company_tax_id'),
-                                                  col: '3',
-                                                  col_sm: '12',
-                                                  appName: 'cms_system',
-                                                  require: 'false',
-                                                  readonly: 'write',
-                                                  formFormat: '{}',
-                                                  moduleName: '輸入框',
-                                                  style_data: {
-                                                    input: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
-                                                    },
-                                                    label: {
-                                                      list: [],
-                                                      class: 'form-label fs-base ',
-                                                      style: '',
-                                                      version: 'v2',
+                                                  {
+                                                    key: 'gui_number',
+                                                    page: 'input',
+                                                    type: 'form_plugin_v2',
+                                                    group: '',
+                                                    title: Language.text('company_tax_id'),
+                                                    col: '3',
+                                                    col_sm: '12',
+                                                    appName: 'cms_system',
+                                                    require: 'false',
+                                                    readonly: 'write',
+                                                    formFormat: '{}',
+                                                    moduleName: '輸入框',
+                                                    style_data: {
+                                                      input: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
+                                                      label: {
+                                                        list: [],
+                                                        class: 'form-label fs-base ',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
+                                                      container: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
                                                     },
-                                                    container: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
+                                                    form_config: {
+                                                      type: 'name',
+                                                      title: '',
+                                                      input_style: { list: [], version: 'v2' },
+                                                      title_style: { list: [], version: 'v2' },
+                                                      place_holder: Language.text('please_enter_company_tax_id'),
                                                     },
+                                                    hidden_code:
+                                                      "    if(form_data['invoice_type']!=='company'){\n       form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
                                                   },
-                                                  form_config: {
-                                                    type: 'name',
-                                                    title: '',
-                                                    input_style: { list: [], version: 'v2' },
-                                                    title_style: { list: [], version: 'v2' },
-                                                    place_holder: Language.text('please_enter_company_tax_id'),
-                                                  },
-                                                  hidden_code:
-                                                    "    if(form_data['invoice_type']!=='company'){\n       form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
-                                                },
-                                                {
-                                                  col: '6',
-                                                  key: 'love_code',
-                                                  page: 'input',
-                                                  type: 'form_plugin_v2',
-                                                  group: '',
-                                                  title: Language.text('donation_code'),
-                                                  col_sm: '12',
-                                                  appName: 'cms_system',
-                                                  require: 'false',
-                                                  readonly: 'write',
-                                                  formFormat: '{}',
-                                                  moduleName: '輸入框',
-                                                  style_data: {
-                                                    input: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
-                                                    },
-                                                    label: {
-                                                      list: [],
-                                                      class: 'form-label fs-base ',
-                                                      style: '',
-                                                      version: 'v2',
+                                                  {
+                                                    col: '6',
+                                                    key: 'love_code',
+                                                    page: 'input',
+                                                    type: 'form_plugin_v2',
+                                                    group: '',
+                                                    title: Language.text('donation_code'),
+                                                    col_sm: '12',
+                                                    appName: 'cms_system',
+                                                    require: 'false',
+                                                    readonly: 'write',
+                                                    formFormat: '{}',
+                                                    moduleName: '輸入框',
+                                                    style_data: {
+                                                      input: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
+                                                      label: {
+                                                        list: [],
+                                                        class: 'form-label fs-base ',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
+                                                      container: {
+                                                        list: [],
+                                                        class: '',
+                                                        style: '',
+                                                        version: 'v2',
+                                                      },
                                                     },
-                                                    container: {
-                                                      list: [],
-                                                      class: '',
-                                                      style: '',
-                                                      version: 'v2',
+                                                    form_config: {
+                                                      type: 'name',
+                                                      title: '',
+                                                      input_style: { list: [], version: 'v2' },
+                                                      title_style: { list: [], version: 'v2' },
+                                                      place_holder: Language.text('please_enter_donation_code'),
                                                     },
+                                                    hidden_code:
+                                                      "    if(form_data['invoice_type']!=='donate' || (form_data['invoice_method']==='nouse')){\n       form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
                                                   },
-                                                  form_config: {
-                                                    type: 'name',
-                                                    title: '',
-                                                    input_style: { list: [], version: 'v2' },
-                                                    title_style: { list: [], version: 'v2' },
-                                                    place_holder: Language.text('please_enter_donation_code'),
-                                                  },
-                                                  hidden_code:
-                                                    "    if(form_data['invoice_type']!=='donate' || (form_data['invoice_method']==='nouse')){\n       form_data[form_key]=undefined\nreturn true\n    }else{\n return false\n    }",
-                                                },
-                                              ]),
+                                                ]),
                                             {
                                               col: '12',
                                               key: 'note',
@@ -2918,10 +2924,10 @@ export class CheckoutIndex {
                                               class="d-flex align-items-center justify-content-end"
                                               style="width:1180px;max-width: 100%;gap:24px;"
                                             >
-                                              <div class="d-flex align-items-end fs-base" style="gap:5px;">
-                                                <span style="white-space:nowrap;" class="fw-bold fs-sm">
-                                                  ${Language.text('total_amount')}</span
-                                                >
+                                              <div class="d-flex align-items-center fs-base" style="gap:5px;">
+                                                <div style="white-space:nowrap;" class="fw-bold fs-sm">
+                                                  ${Language.text('total_amount')}
+                                                </div>
                                                 <div class="${gClass(['price-row', 'text-1', 'bold'])}">
                                                   <div class="fs-5 fw-bold ${gClass('price-text')}">
                                                     ${Currency.convertCurrencyText(vm.cartData.total)}
@@ -2932,181 +2938,181 @@ export class CheckoutIndex {
                                               <div>
                                                 <button
                                                   class="${gClass(
-                                              verify.length > 0 ? 'button-bgr-disable' : 'button-bgr'
-                                            )}"
+                                                    verify.length > 0 ? 'button-bgr-disable' : 'button-bgr'
+                                                  )}"
                                                   style="${document.body.clientWidth < 800
-                                              ? `min-width:100px;`
-                                              : `min-width:380px;`}"
+                                                    ? `min-width:100px;`
+                                                    : `min-width:380px;`}"
                                                   onclick="${gvc.event(() => {
-                                              const that = this;
-                                              if (onlineData?.interaction?.status == 3) {
-                                                const dialog = new ShareDialog(gvc.glitter);
-                                                dialog.infoMessage({
-                                                  text: `很抱歉，團購的結帳時間已截止，無法再進行訂單結算。感謝您的支持，期待下次再為您服務！`,
-                                                });
-                                                return;
-                                              }
-
-                                              if (
-                                                (window as any).login_config.login_in_to_order &&
-                                                !GlobalUser.token
-                                              ) {
-                                                GlobalUser.loginRedirect = location.href;
-                                                gvc.glitter.href = '/login';
-                                                return;
-                                              }
-
-                                              function next() {
-                                                if (vm.cartData.user_info_same) {
-                                                  vm.cartData.user_info.name = vm.cartData.customer_info.name;
-                                                  vm.cartData.user_info.phone = vm.cartData.customer_info.phone;
-                                                  vm.cartData.user_info.email = vm.cartData.customer_info.email;
-                                                }
-                                                if (verify.length > 0) {
-                                                  return;
-                                                }
-
-                                                if (shipmentList.length === 0) {
-                                                  vm.cartData.user_info.shipment = 'none';
-                                                }
-
-                                                const dialog = new ShareDialog(gvc.glitter);
-                                                if (!that.checkFormData(gvc, vm.cartData, widget)) {
-                                                  return;
-                                                }
-                                                for (const item of vm.cartData.lineItems) {
-                                                  const title =
-                                                    (item.language_data &&
-                                                      item.language_data[Language.getLanguage()].title) ||
-                                                    item.title;
-                                                  let min = (item.min_qty && parseInt(item.min_qty, 10)) || 1;
-                                                  let max_qty =
-                                                    (item.max_qty && parseInt(item.max_qty, 10)) || Infinity;
-                                                  let count = 0;
-                                                  for (const b of vm.cartData.lineItems) {
-                                                    if (b.id === item.id) {
-                                                      count += b.count;
+                                                    const that = this;
+                                                    if (onlineData?.interaction?.status == 3) {
+                                                      const dialog = new ShareDialog(gvc.glitter);
+                                                      dialog.infoMessage({
+                                                        text: `很抱歉，團購的結帳時間已截止，無法再進行訂單結算。感謝您的支持，期待下次再為您服務！`,
+                                                      });
+                                                      return;
                                                     }
-                                                  }
-                                                  if (count < min) {
-                                                    dialog.errorMessage({
-                                                      text: Language.text('min_p_count_d')
-                                                        .replace('_c_', min)
-                                                        .replace('_p_', `『${title}』`),
-                                                    });
-                                                    return;
-                                                  }
-                                                  if (count > max_qty) {
-                                                    dialog.errorMessage({
-                                                      text: Language.text('max_p_count_d')
-                                                        .replace('_c_', max_qty)
-                                                        .replace('_p_', `『${title}』`),
-                                                    });
-                                                    return;
-                                                  }
-                                                  if (max_qty > 0 && count + item.buy_history_count > max_qty) {
-                                                    dialog.errorMessage({
-                                                      text: Language.text('trigger_maximum_item').replace(
-                                                        '_p_',
-                                                        `『${title}』`
-                                                      ),
-                                                    });
-                                                    return;
-                                                  }
-                                                }
-                                                [
-                                                  'MerchantTradeNo',
-                                                  'LogisticsSubType',
-                                                  'CVSStoreID',
-                                                  'CVSStoreName',
-                                                  'CVSTelephone',
-                                                  'CVSOutSide',
-                                                  'ExtraData',
-                                                  'CVSAddress',
-                                                ].map(dd => {
-                                                  if (gvc.glitter.getUrlParameter(dd)) {
-                                                    vm.cartData.user_info[dd] = decodeURI(
-                                                      glitter.getUrlParameter(dd)
-                                                    );
-                                                  }
-                                                });
-                                                dialog.dataLoading({ visible: true });
-                                                vm.cartData.user_info.note =
-                                                  (vm.cartData.user_info.note ?? '') + (check_out_sub.note ?? '');
-                                                ApiShop.toCheckout({
-                                                  line_items: vm.cartData.lineItems.map((dd: any) => {
-                                                    return {
-                                                      id: dd.id,
-                                                      spec: dd.spec,
-                                                      count: dd.count,
-                                                    };
-                                                  }),
-                                                  customer_info: vm.cartData.customer_info,
-                                                  return_url: (() => {
-                                                    const originalUrl =
-                                                      glitter.root_path + 'order_detail' + location.search;
-                                                    const urlObject = new URL(originalUrl);
-                                                    urlObject.searchParams.set('EndCheckout', '1');
-                                                    const newUrl = urlObject.toString();
+
                                                     if (
-                                                      ApplicationConfig.device_type !== 'web' &&
-                                                      ['jkopay', 'line_pay'].includes(
-                                                        vm.cartData.customer_info.payment_select
-                                                      )
+                                                      (window as any).login_config.login_in_to_order &&
+                                                      !GlobalUser.token
                                                     ) {
-                                                      return `${ApplicationConfig.bundle_id}://?path=${encodeURIComponent(newUrl)}`;
-                                                    } else {
-                                                      return newUrl;
-                                                    }
-                                                  })(),
-                                                  user_info: vm.cartData.user_info,
-                                                  code: apiCart.cart.code,
-                                                  use_rebate: apiCart.cart.use_rebate,
-                                                  custom_form_format: vm.cartData.custom_form_format,
-                                                  custom_form_data: vm.cartData.custom_form_data,
-                                                  custom_receipt_form: vm.cartData.receipt_form,
-                                                  distribution_code:
-                                                    localStorage.getItem('distributionCode') ?? '',
-                                                  give_away: apiCart.cart.give_away,
-                                                }).then(res => {
-                                                  dialog.dataLoading({ visible: false });
-                                                  if (!res.result){
-                                                    dialog.infoMessage({
-                                                      text: '系統處理您的付款時遇到一些問題，導致交易未能完成。請聯繫我們的客服團隊以取得進一步的協助'
-                                                    })
-                                                    return
-                                                  }
-                                                  if (vm.cartData.customer_info.payment_select == 'paynow') {
-                                                    if (!res.response?.data?.result?.secret) {
-                                                      return 'paynow API失敗';
+                                                      GlobalUser.loginRedirect = location.href;
+                                                      gvc.glitter.href = '/login';
+                                                      return;
                                                     }
-                                                    glitter.innerDialog(
-                                                      (gvc: GVC) => {
-                                                        document.body.style.setProperty(
-                                                          'overflow-y',
-                                                          'hidden',
-                                                          'important'
-                                                        );
-                                                        return gvc.bindView({
-                                                          bind: `paynow`,
-                                                          view: () => {
-                                                            return html` <div
+
+                                                    function next() {
+                                                      if (vm.cartData.user_info_same) {
+                                                        vm.cartData.user_info.name = vm.cartData.customer_info.name;
+                                                        vm.cartData.user_info.phone = vm.cartData.customer_info.phone;
+                                                        vm.cartData.user_info.email = vm.cartData.customer_info.email;
+                                                      }
+                                                      if (verify.length > 0) {
+                                                        return;
+                                                      }
+
+                                                      if (shipmentList.length === 0) {
+                                                        vm.cartData.user_info.shipment = 'none';
+                                                      }
+
+                                                      const dialog = new ShareDialog(gvc.glitter);
+                                                      if (!that.checkFormData(gvc, vm.cartData, widget)) {
+                                                        return;
+                                                      }
+                                                      for (const item of vm.cartData.lineItems) {
+                                                        const title =
+                                                          (item.language_data &&
+                                                            item.language_data[Language.getLanguage()].title) ||
+                                                          item.title;
+                                                        let min = (item.min_qty && parseInt(item.min_qty, 10)) || 1;
+                                                        let max_qty =
+                                                          (item.max_qty && parseInt(item.max_qty, 10)) || Infinity;
+                                                        let count = 0;
+                                                        for (const b of vm.cartData.lineItems) {
+                                                          if (b.id === item.id) {
+                                                            count += b.count;
+                                                          }
+                                                        }
+                                                        if (count < min) {
+                                                          dialog.errorMessage({
+                                                            text: Language.text('min_p_count_d')
+                                                              .replace('_c_', min)
+                                                              .replace('_p_', `『${title}』`),
+                                                          });
+                                                          return;
+                                                        }
+                                                        if (count > max_qty) {
+                                                          dialog.errorMessage({
+                                                            text: Language.text('max_p_count_d')
+                                                              .replace('_c_', max_qty)
+                                                              .replace('_p_', `『${title}』`),
+                                                          });
+                                                          return;
+                                                        }
+                                                        if (max_qty > 0 && count + item.buy_history_count > max_qty) {
+                                                          dialog.errorMessage({
+                                                            text: Language.text('trigger_maximum_item').replace(
+                                                              '_p_',
+                                                              `『${title}』`
+                                                            ),
+                                                          });
+                                                          return;
+                                                        }
+                                                      }
+                                                      [
+                                                        'MerchantTradeNo',
+                                                        'LogisticsSubType',
+                                                        'CVSStoreID',
+                                                        'CVSStoreName',
+                                                        'CVSTelephone',
+                                                        'CVSOutSide',
+                                                        'ExtraData',
+                                                        'CVSAddress',
+                                                      ].map(dd => {
+                                                        if (gvc.glitter.getUrlParameter(dd)) {
+                                                          vm.cartData.user_info[dd] = decodeURI(
+                                                            glitter.getUrlParameter(dd)
+                                                          );
+                                                        }
+                                                      });
+                                                      dialog.dataLoading({ visible: true });
+                                                      vm.cartData.user_info.note =
+                                                        (vm.cartData.user_info.note ?? '') + (check_out_sub.note ?? '');
+                                                      ApiShop.toCheckout({
+                                                        line_items: vm.cartData.lineItems.map((dd: any) => {
+                                                          return {
+                                                            id: dd.id,
+                                                            spec: dd.spec,
+                                                            count: dd.count,
+                                                          };
+                                                        }),
+                                                        customer_info: vm.cartData.customer_info,
+                                                        return_url: (() => {
+                                                          const originalUrl =
+                                                            glitter.root_path + 'order_detail' + location.search;
+                                                          const urlObject = new URL(originalUrl);
+                                                          urlObject.searchParams.set('EndCheckout', '1');
+                                                          const newUrl = urlObject.toString();
+                                                          if (
+                                                            ApplicationConfig.device_type !== 'web' &&
+                                                            ['jkopay', 'line_pay'].includes(
+                                                              vm.cartData.customer_info.payment_select
+                                                            )
+                                                          ) {
+                                                            return `${ApplicationConfig.bundle_id}://?path=${encodeURIComponent(newUrl)}`;
+                                                          } else {
+                                                            return newUrl;
+                                                          }
+                                                        })(),
+                                                        user_info: vm.cartData.user_info,
+                                                        code: apiCart.cart.code,
+                                                        use_rebate: apiCart.cart.use_rebate,
+                                                        custom_form_format: vm.cartData.custom_form_format,
+                                                        custom_form_data: vm.cartData.custom_form_data,
+                                                        custom_receipt_form: vm.cartData.receipt_form,
+                                                        distribution_code:
+                                                          localStorage.getItem('distributionCode') ?? '',
+                                                        give_away: apiCart.cart.give_away,
+                                                      }).then(res => {
+                                                        dialog.dataLoading({ visible: false });
+                                                        if (!res.result) {
+                                                          dialog.infoMessage({
+                                                            text: '系統處理您的付款時遇到一些問題，導致交易未能完成。請聯繫我們的客服團隊以取得進一步的協助',
+                                                          });
+                                                          return;
+                                                        }
+                                                        if (vm.cartData.customer_info.payment_select == 'paynow') {
+                                                          if (!res.response?.data?.result?.secret) {
+                                                            return 'paynow API失敗';
+                                                          }
+                                                          glitter.innerDialog(
+                                                            (gvc: GVC) => {
+                                                              document.body.style.setProperty(
+                                                                'overflow-y',
+                                                                'hidden',
+                                                                'important'
+                                                              );
+                                                              return gvc.bindView({
+                                                                bind: `paynow`,
+                                                                view: () => {
+                                                                  return html` <div
                                                                     class="w-100 h-100 d-flex align-items-center justify-content-center"
                                                                   >
                                                                     ${document.body.clientWidth < 800
-                                                              ? `
+                                                                      ? `
                                                                             <div class="bg-white position-relative vw-100" style="height: ${window.innerHeight}px;overflow-y: auto;
                                                                             padding-top:${50 + glitter.share.top_inset}px;
                                                                             ">
                                                                             `
-                                                              : `<div class="p-3  bg-white position-relative" style="max-height: calc(100vh - 90px);overflow-y:auto;">`}
+                                                                      : `<div class="p-3  bg-white position-relative" style="max-height: calc(100vh - 90px);overflow-y:auto;">`}
                                                                     <div
                                                                       style="position: absolute; right: 15px;top:${15 +
-                                                            glitter.share.top_inset}px;z-index:1;"
+                                                                      glitter.share.top_inset}px;z-index:1;"
                                                                       onclick="${gvc.event(() => {
                                                                         location.href = res.response.returnUrl;
-                                                              gvc.closeDialog();
-                                                            })}"
+                                                                        gvc.closeDialog();
+                                                                      })}"
                                                                     >
                                                                       <i
                                                                         class="fa-regular fa-circle-xmark fs-5 text-dark cursor_pointer"
@@ -3120,24 +3126,24 @@ export class CheckoutIndex {
                                                                     <div class="px-3 px-sm-0 w-100">
                                                                       <button
                                                                         class="${gClass(
-                                                              verify.length > 0
-                                                                ? 'button-bgr-disable'
-                                                                : 'button-bgr'
-                                                            )} "
+                                                                          verify.length > 0
+                                                                            ? 'button-bgr-disable'
+                                                                            : 'button-bgr'
+                                                                        )} "
                                                                         id="checkoutButton"
                                                                         onclick="${gvc.event(() => {
-                                                              const PayNow = (window as any).PayNow;
-                                                              const dialog = new ShareDialog(gvc.glitter);
-                                                              dialog.dataLoading({ visible: true });
-                                                              PayNow.checkout().then((response: any) => {
-                                                                dialog.dataLoading({ visible: false });
-                                                                if (response.error) {
-                                                                  dialog.errorMessage({
-                                                                    text: response.error.message,
-                                                                  });
-                                                                }
-                                                              });
-                                                            })}"
+                                                                          const PayNow = (window as any).PayNow;
+                                                                          const dialog = new ShareDialog(gvc.glitter);
+                                                                          dialog.dataLoading({ visible: true });
+                                                                          PayNow.checkout().then((response: any) => {
+                                                                            dialog.dataLoading({ visible: false });
+                                                                            if (response.error) {
+                                                                              dialog.errorMessage({
+                                                                                text: response.error.message,
+                                                                              });
+                                                                            }
+                                                                          });
+                                                                        })}"
                                                                       >
                                                                         <span class="${gClass('button-text')}"
                                                                           >確認結帳</span
@@ -3145,148 +3151,148 @@ export class CheckoutIndex {
                                                                       </button>
                                                                     </div>
                                                                   </div>`;
-                                                          },
-                                                          divCreate: {
-                                                            class: ` h-100 d-flex align-items-center justify-content-center`,
-                                                            style: `max-width:100vw;${document.body.clientWidth < 800 ? 'width:100%;' : 'width:400px;'};`,
-                                                          },
-                                                          onCreate: () => {
-                                                            const publicKey = res.response.publicKey;
-                                                            const secret = res.response.data.result.secret;
-                                                            const env =
-                                                              res.response.BETA == 'true'
-                                                                ? 'sandbox'
-                                                                : 'production';
-                                                            const PayNow = (window as any).PayNow;
-                                                            PayNow.createPayment({
-                                                              publicKey: publicKey,
-                                                              secret: secret,
-                                                              env: env,
-                                                            });
-                                                            PayNow.mount('#paynow-container', {
-                                                              locale: 'zh_tw',
-                                                              appearance: {
-                                                                variables: {
-                                                                  fontFamily: 'monospace',
-                                                                  colorPrimary: '#0078ab',
-                                                                  colorDefault: '#0a0a0a',
-                                                                  colorBorder: '#cccccc',
-                                                                  colorPlaceholder: '#eeeeee',
-                                                                  borderRadius: '.3rem',
-                                                                  colorDanger: '#ff3d3d',
                                                                 },
+                                                                divCreate: {
+                                                                  class: ` h-100 d-flex align-items-center justify-content-center`,
+                                                                  style: `max-width:100vw;${document.body.clientWidth < 800 ? 'width:100%;' : 'width:400px;'};`,
+                                                                },
+                                                                onCreate: () => {
+                                                                  const publicKey = res.response.publicKey;
+                                                                  const secret = res.response.data.result.secret;
+                                                                  const env =
+                                                                    res.response.BETA == 'true'
+                                                                      ? 'sandbox'
+                                                                      : 'production';
+                                                                  const PayNow = (window as any).PayNow;
+                                                                  PayNow.createPayment({
+                                                                    publicKey: publicKey,
+                                                                    secret: secret,
+                                                                    env: env,
+                                                                  });
+                                                                  PayNow.mount('#paynow-container', {
+                                                                    locale: 'zh_tw',
+                                                                    appearance: {
+                                                                      variables: {
+                                                                        fontFamily: 'monospace',
+                                                                        colorPrimary: '#0078ab',
+                                                                        colorDefault: '#0a0a0a',
+                                                                        colorBorder: '#cccccc',
+                                                                        colorPlaceholder: '#eeeeee',
+                                                                        borderRadius: '.3rem',
+                                                                        colorDanger: '#ff3d3d',
+                                                                      },
+                                                                    },
+                                                                  });
+                                                                },
+                                                              });
+                                                            },
+                                                            `paynow`,
+                                                            {
+                                                              animation:
+                                                                document.body.clientWidth > 800
+                                                                  ? Animation.fade
+                                                                  : Animation.popup,
+                                                              dismiss: () => {
+                                                                document.body.style.setProperty('overflow-y', 'auto');
                                                               },
-                                                            });
-                                                          },
-                                                        });
-                                                      },
-                                                      `paynow`,
-                                                      {
-                                                        animation:
-                                                          document.body.clientWidth > 800
-                                                            ? Animation.fade
-                                                            : Animation.popup,
-                                                        dismiss: () => {
-                                                          document.body.style.setProperty('overflow-y', 'auto');
-                                                        },
-                                                      }
-                                                    );
-                                                  }
-
-                                                  localStorage.setItem(
-                                                    'clear_cart_items',
-                                                    JSON.stringify(
-                                                      vm.cartData.lineItems.map((item: any) => item.id)
-                                                    )
-                                                  );
+                                                            }
+                                                          );
+                                                        }
 
-                                                  if (res.response.off_line || res.response.is_free) {
-                                                    location.href = res.response.return_url;
-                                                  } else {
-                                                    if (
-                                                      res.response.returnCode == '0000' &&
-                                                      vm.cartData.customer_info.payment_select == 'line_pay'
-                                                    ) {
-                                                      if (glitter.share.is_application) {
-                                                        gvc.glitter.runJsInterFace(
-                                                          'intent_url',
-                                                          {
-                                                            url: res.response.info.paymentUrl.app,
-                                                          },
-                                                          () => {}
-                                                        );
-                                                        // location.href = res.response.info.paymentUrl.app;
-                                                      } else {
-                                                        location.href = res.response.info.paymentUrl.web;
-                                                      }
-                                                      // todo 手機跳轉用這個
-                                                      // location.href = res.response.form.info.paymentUrl.app;
-                                                    } else if (res.response.approveLink) {
-                                                      location.href = res.response.approveLink;
-                                                    } else if (
-                                                      vm.cartData.customer_info.payment_select == 'jkopay'
-                                                    ) {
-                                                      if (glitter.share.is_application) {
-                                                        gvc.glitter.runJsInterFace(
-                                                          'intent_url',
-                                                          {
-                                                            url: res.response.result_object.payment_url,
-                                                          },
-                                                          () => {}
+                                                        localStorage.setItem(
+                                                          'clear_cart_items',
+                                                          JSON.stringify(
+                                                            vm.cartData.lineItems.map((item: any) => item.id)
+                                                          )
                                                         );
-                                                      } else {
-                                                        location.href = res.response.result_object.payment_url;
-                                                      }
-                                                    } else {
-                                                      const id = gvc.glitter.getUUID();
-                                                      $('body').append(
-                                                        html` <div id="${id}" style="display: none;">
+
+                                                        if (res.response.off_line || res.response.is_free) {
+                                                          location.href = res.response.return_url;
+                                                        } else {
+                                                          if (
+                                                            res.response.returnCode == '0000' &&
+                                                            vm.cartData.customer_info.payment_select == 'line_pay'
+                                                          ) {
+                                                            if (glitter.share.is_application) {
+                                                              gvc.glitter.runJsInterFace(
+                                                                'intent_url',
+                                                                {
+                                                                  url: res.response.info.paymentUrl.app,
+                                                                },
+                                                                () => {}
+                                                              );
+                                                              // location.href = res.response.info.paymentUrl.app;
+                                                            } else {
+                                                              location.href = res.response.info.paymentUrl.web;
+                                                            }
+                                                            // todo 手機跳轉用這個
+                                                            // location.href = res.response.form.info.paymentUrl.app;
+                                                          } else if (res.response.approveLink) {
+                                                            location.href = res.response.approveLink;
+                                                          } else if (
+                                                            vm.cartData.customer_info.payment_select == 'jkopay'
+                                                          ) {
+                                                            if (glitter.share.is_application) {
+                                                              gvc.glitter.runJsInterFace(
+                                                                'intent_url',
+                                                                {
+                                                                  url: res.response.result_object.payment_url,
+                                                                },
+                                                                () => {}
+                                                              );
+                                                            } else {
+                                                              location.href = res.response.result_object.payment_url;
+                                                            }
+                                                          } else {
+                                                            const id = gvc.glitter.getUUID();
+                                                            $('body').append(
+                                                              html` <div id="${id}" style="display: none;">
                                                                 ${res.response.form}
                                                               </div>`
-                                                      );
-                                                      (document.querySelector(`#${id} #submit`) as any).click();
+                                                            );
+                                                            (document.querySelector(`#${id} #submit`) as any).click();
+                                                          }
+                                                        }
+                                                      });
                                                     }
-                                                  }
-                                                });
-                                              }
 
-                                              if (
-                                                (window as any).login_config.login_in_to_order &&
-                                                !GlobalUser.token
-                                              ) {
-                                                GlobalUser.loginRedirect = location.href;
-                                                gvc.glitter.href = '/login';
-                                                return;
-                                              } else {
-                                                ApiUser.getUserData(GlobalUser.token, 'me').then(res => {
-                                                  if (
-                                                    res.response.userData &&
-                                                    !res.response.userData.phone &&
-                                                    (window as any).login_config.phone_verify &&
-                                                    glitter.getUrlParameter('page') !== 'account_edit'
-                                                  ) {
-                                                    const dialog = new ShareDialog(glitter);
-                                                    dialog.infoMessage({
-                                                      text: Language.text('phone_verify_check'),
-                                                    });
-                                                    glitter.href = '/account_edit';
-                                                  } else {
-                                                    next();
-                                                  }
-                                                });
-                                              }
-                                            })}"
+                                                    if (
+                                                      (window as any).login_config.login_in_to_order &&
+                                                      !GlobalUser.token
+                                                    ) {
+                                                      GlobalUser.loginRedirect = location.href;
+                                                      gvc.glitter.href = '/login';
+                                                      return;
+                                                    } else {
+                                                      ApiUser.getUserData(GlobalUser.token, 'me').then(res => {
+                                                        if (
+                                                          res.response.userData &&
+                                                          !res.response.userData.phone &&
+                                                          (window as any).login_config.phone_verify &&
+                                                          glitter.getUrlParameter('page') !== 'account_edit'
+                                                        ) {
+                                                          const dialog = new ShareDialog(glitter);
+                                                          dialog.infoMessage({
+                                                            text: Language.text('phone_verify_check'),
+                                                          });
+                                                          glitter.href = '/account_edit';
+                                                        } else {
+                                                          next();
+                                                        }
+                                                      });
+                                                    }
+                                                  })}"
                                                 >
                                                   <span
                                                     class="${gClass('button-text')} "
                                                     style="${verify.length > 0 ? `font-size:13px;` : ''}"
                                                   >
                                                     ${verify.length > 0
-                                              ? verify.join('<br/>')
-                                              : (window as any).login_config.login_in_to_order &&
-                                              !GlobalUser.token
-                                                ? Language.text('login_in_to_checkout')
-                                                : Language.text('next')}
+                                                      ? verify.join('<br/>')
+                                                      : (window as any).login_config.login_in_to_order &&
+                                                          !GlobalUser.token
+                                                        ? Language.text('login_in_to_checkout')
+                                                        : Language.text('next')}
                                                   </span>
                                                 </button>
                                               </div>
@@ -3602,7 +3608,7 @@ export class CheckoutIndex {
           </div>
           <div class="c_dialog">
             <div class="c_dialog_body">
-              <div class="c_dialog_main" style="gap: 24px; height: auto; max-height: 500px; padding: 12px 20px;">
+              <div class="c_dialog_main" style="gap: 24px; height: auto; max-height: 500px; padding: 12px;">
                 ${obj.innerHTML(gvc)}
               </div>
             </div>
@@ -3659,20 +3665,20 @@ export class CheckoutIndex {
 
     cartData.off_line_support = cartData.off_line_support ?? {};
     cartData.off_line_support.atm &&
-    array.push({
-      name: '銀行轉帳',
-      value: 'atm',
-    });
+      array.push({
+        name: '銀行轉帳',
+        value: 'atm',
+      });
     cartData.off_line_support.line &&
-    array.push({
-      name: 'Line轉帳',
-      value: 'line',
-    });
+      array.push({
+        name: 'Line轉帳',
+        value: 'line',
+      });
     cartData.off_line_support.cash_on_delivery &&
-    array.push({
-      name: '貨到付款',
-      value: 'cash_on_delivery',
-    });
+      array.push({
+        name: '貨到付款',
+        value: 'cash_on_delivery',
+      });
     if (cartData.payment_info_custom && cartData.payment_info_custom.length > 0) {
       cartData.payment_info_custom.map((item: any) => {
         if (cartData.off_line_support[item.id]) {
@@ -3768,4 +3774,4 @@ export class CheckoutIndex {
   }
 }
 
-(window as any).glitter.setModule(import.meta.url, CheckoutIndex);
+(window as any).glitter.setModule(import.meta.url, CheckoutIndex);