ts-glitter 22.0.3 → 22.0.5

package/lowcode/cms-plugin/shopping-collections.ts

@@ -4,10 +4,11 @@ import { BgProduct, OptionsItem } from '../backend-manager/bg-product.js';
 import { ApiShop } from '../glitter-base/route/shopping.js';
 import { EditorElem } from '../glitterBundle/plugins/editor-elem.js';
 import { ShareDialog } from '../glitterBundle/dialog/ShareDialog.js';
-import { FilterOptions } from './filter-options.js';
 import { CheckInput } from '../modules/checkInput.js';
 import { Language, LanguageLocation } from '../glitter-base/global/language.js';
 
+const html = String.raw;
+
 type ViewModel = {
   id: string;
   filterID: string;
@@ -64,7 +65,7 @@ function getEmptyLanguageData() {
 }
 
 export class ShoppingCollections {
-  public static main(gvc: GVC) {
+  static main(gvc: GVC) {
     const glitter = gvc.glitter;
     const vm: ViewModel = {
       id: glitter.getUUID(),
@@ -92,7 +93,6 @@ export class ShoppingCollections {
       query: '',
       allParents: [],
     };
-    const html = String.raw;
     const dialog = new ShareDialog(gvc.glitter);
 
     const updateCollections = (data: { products: Product[]; collections: Collection[] }): Collection[] => {
@@ -198,51 +198,7 @@ export class ShoppingCollections {
                               bind: id,
                               view: () => {
                                 if (loading) {
-                                  gvc.addStyle(`
-                                    .parent-container,
-                                    .child-container {
-                                      flex: 1;
-                                      margin-right: 20px;
-                                    }
-
-                                    .parent-container:last-child,
-                                    .child-container:last-child {
-                                      margin-right: 0;
-                                    }
-
-                                    .ul-style {
-                                      list-style-type: none;
-                                      padding: 0;
-                                      margin: 0;
-                                      min-height: 200px;
-                                      border: 1px solid #ccc;
-                                    }
-
-                                    .li-style {
-                                      padding: 6px 10px;
-                                      margin-bottom: 5px;
-                                      background-color: #eee;
-                                      cursor: move;
-                                      border: 1px solid #ccc;
-                                      display: flex;
-                                      align-items: center;
-                                    }
-
-                                    .drag-icon {
-                                      margin-right: 10px;
-                                      cursor: move;
-                                    }
-
-                                    .drag-icon::before {
-                                      content: '↕';
-                                      font-size: 18px;
-                                      margin-right: 10px;
-                                    }
-
-                                    .selectCol {
-                                      background-color: #dcdcdc;
-                                    }
-                                  `);
+                                  this.addStyle(gvc);
                                   return '';
                                 } else {
                                   return html` <div class="d-flex">
@@ -429,7 +385,7 @@ export class ShoppingCollections {
                                       ApiShop.putCollections({
                                         data: { replace: dd, original },
                                         token: (window.parent as any).config.token,
-                                      }).then(r => {
+                                      }).then(() => {
                                         dialog.dataLoading({ visible: false });
                                         gvc.notifyDataChange(vm.id);
                                       });
@@ -502,7 +458,7 @@ export class ShoppingCollections {
                           }
                         });
                       },
-                      rowClick: (data, index) => {
+                      rowClick: (_, index) => {
                         vm.data = vm.dataList[index];
                         vm.type = 'replace';
                       },
@@ -559,9 +515,57 @@ export class ShoppingCollections {
     });
   }
 
-  public static editorDetail(obj: { vm: ViewModel; gvc: GVC; type?: 'add' | 'replace' }) {
-    const html = String.raw;
+  static addStyle(gvc: GVC) {
+    gvc.addStyle(`
+      .parent-container,
+      .child-container {
+        flex: 1;
+        margin-right: 20px;
+      }
+
+      .parent-container:last-child,
+      .child-container:last-child {
+        margin-right: 0;
+      }
+
+      .ul-style {
+        list-style-type: none;
+        padding: 0;
+        margin: 0;
+        min-height: 200px;
+        border: 1px solid #ccc;
+      }
+
+      .li-style {
+        padding: 6px 10px;
+        margin-bottom: 5px;
+        background-color: #eee;
+        cursor: move;
+        border: 1px solid #ccc;
+        display: flex;
+        align-items: center;
+      }
+
+      .drag-icon {
+        margin-right: 10px;
+        cursor: move;
+      }
+
+      .drag-icon::before {
+        content: '↕';
+        font-size: 18px;
+        margin-right: 10px;
+      }
+
+      .selectCol {
+        background-color: #dcdcdc;
+      }
+    `);
+  }
+
+  static editorDetail(obj: { vm: ViewModel; gvc: GVC; type?: 'add' | 'replace' }) {
     const gvc = obj.gvc;
+    const glitter = gvc.glitter;
     const vm = obj.vm;
     const original = JSON.parse(JSON.stringify(vm.data));
     const dialog = new ShareDialog(gvc.glitter);
@@ -589,13 +593,13 @@ export class ShoppingCollections {
 
       for (const data of lagDomain) {
         if (data.domains.includes(vm.data.language_data[data.lang].seo.domain)) {
-          const langTExt = Language.getLanguageText({
+          const text = Language.getLanguageText({
             local: true,
             compare: data.lang,
           });
           return {
             result: false,
-            text: `語系「${langTExt}」的連結網址「${vm.data.language_data[data.lang].seo.domain}」<br/>已存在於其他類別，請更換連結網址`,
+            text: `語系「${text}」的連結網址「${vm.data.language_data[data.lang].seo.domain}」<br />已存在於其他類別，請更換連結網址`,
           };
         }
       }
@@ -657,8 +661,6 @@ export class ShoppingCollections {
                           return gvc.bindView(
                             (() => {
                               const id = gvc.glitter.getUUID();
-                              const glitter = gvc.glitter;
-                              const html = String.raw;
                               return {
                                 bind: id,
                                 view: () => {
@@ -667,7 +669,6 @@ export class ShoppingCollections {
                                   >
                                     ${BgWidget.grayNote('前往商店設定->商店訊息中，設定支援的語言。')}
                                     ${gvc.bindView(() => {
-                                      const html = String.raw;
                                       return {
                                         bind: glitter.getUUID(),
                                         view: () => {
@@ -738,7 +739,7 @@ export class ShoppingCollections {
                         },
                         title: '切換語系',
                         footer_html: gvc => {
-                          return ``;
+                          return '';
                         },
                         width: 300,
                       });
@@ -752,7 +753,7 @@ export class ShoppingCollections {
                   // 左容器
                   html: [
                     BgWidget.mainCard(
-                      html` <div class="tx_700" style="margin-bottom: 18px">分類標籤 ${BgWidget.requiredStar()}</div>
+                      html` <div class="tx_700" style="margin-bottom: 12px">分類標籤 ${BgWidget.requiredStar()}</div>
                         ${EditorElem.editeInput({
                           gvc: gvc,
                           title: '',
@@ -772,7 +773,7 @@ export class ShoppingCollections {
                           gvc: gvc,
                           title: '',
                           default: language_data.title,
-                          placeHolder: vm.data.title || '',
+                          placeHolder: vm.data.title || '預設為「分類標籤」輸入值',
                           callback: text => {
                             language_data.title = text;
                             if (language_data.seo.domain === '') {
@@ -789,7 +790,7 @@ export class ShoppingCollections {
                         view: () => {
                           return BgWidget.mainCard(
                             [
-                              html` <div class="tx_normal fw-normal mb-2">
+                              html` <div class="tx_700 mb-2">
                                 連結網址 ${BgWidget.requiredStar()} ${BgWidget.languageInsignia(select_lan)}
                               </div>`,
                               gvc.bindView({
@@ -797,8 +798,8 @@ export class ShoppingCollections {
                                 view: () => {
                                   return html`<div
                                       class="${document.body.clientWidth < 800
-                                        ? `w-100`
-                                        : ``} justify-content-start justify-content-lg-center"
+                                        ? 'w-100'
+                                        : ''} justify-content-start justify-content-lg-center"
                                       style="padding: 9px 18px;background: #EAEAEA; justify-content: center; align-items: center; gap: 5px; display: flex"
                                     >
                                       <div
@@ -818,7 +819,6 @@ export class ShoppingCollections {
                                       onchange="${gvc.event(e => {
                                         let text = e.value;
                                         if (text.length > 0 && !CheckInput.isChineseEnglishNumberHyphen(text)) {
-                                          const dialog = new ShareDialog(gvc.glitter);
                                           dialog.infoMessage({ text: '連結僅限使用中英文數字與連接號' });
                                         } else {
                                           language_data.seo.domain = text;
@@ -829,9 +829,7 @@ export class ShoppingCollections {
                                 },
                                 divCreate: {
                                   style: `width: 100%; 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; '
-                                      : 'flex-direction: column; gap: 0px; '
+                                    document.body.clientWidth > 768 ? 'gap: 18px;' : 'flex-direction: column; gap: 0px;'
                                   }`,
                                 },
                               }),
@@ -848,115 +846,98 @@ export class ShoppingCollections {
                           );
                         },
                         divCreate: {
-                          class: `${gvc.glitter.ut.frSize(
-                            {
-                              sm: ``,
-                            },
-                            `p-0`
-                          )}`,
+                          class: `${gvc.glitter.ut.frSize({ sm: '' }, 'p-0')}`,
                         },
                       };
                     }),
                     BgWidget.mainCard(
-                      html` <div class="tx_700" style="margin-bottom: 18px">商品</div>
-                        ${(() => {
-                          const pvm = {
-                            id: gvc.glitter.getUUID(),
-                            loading: true,
-                            dataList: vm.data.product_id,
-                            productList: [],
-                          };
-                          return html`
-                            <div class="d-flex flex-column p-2" style="gap: 18px;">
-                              <div
-                                class="d-flex align-items-center gray-bottom-line-18"
-                                style="justify-content: space-between;"
-                              >
-                                <div class="form-check-label c_updown_label">
-                                  <div class="tx_normal">商品名稱</div>
-                                </div>
-                                ${BgWidget.grayButton(
-                                  '選擇商品',
-                                  gvc.event(() => {
-                                    BgProduct.productsDialog({
-                                      gvc: gvc,
-                                      default: vm.data.product_id,
-                                      callback: value => {
-                                        pvm.dataList = value;
-                                        vm.data.product_id = value;
-                                        pvm.loading = true;
-                                        gvc.notifyDataChange(pvm.id);
-                                      },
-                                    });
+                      (() => {
+                        const pvm = {
+                          id: gvc.glitter.getUUID(),
+                          loading: true,
+                          dataList: vm.data.product_id,
+                          productList: [],
+                        };
+                        return html`
+                          <div class="d-flex flex-column">
+                            <div class="d-flex align-items-center" style="justify-content: space-between;">
+                              <div class="tx_700" style="margin-bottom: 12px">商品</div>
+                              ${BgWidget.grayButton(
+                                '選擇商品',
+                                gvc.event(() => {
+                                  BgProduct.productsDialog({
+                                    gvc: gvc,
+                                    default: vm.data.product_id,
+                                    callback: value => {
+                                      pvm.dataList = value;
+                                      vm.data.product_id = value;
+                                      pvm.loading = true;
+                                      gvc.notifyDataChange(pvm.id);
+                                    },
+                                  });
+                                })
+                              )}
+                            </div>
+                            ${gvc.bindView({
+                              bind: pvm.id,
+                              view: () => {
+                                if (pvm.loading) {
+                                  return '資料載入中';
+                                }
+                                if (pvm.productList.length === 0) {
+                                  return '目前無選取任何商品';
+                                }
+                                return gvc.map(
+                                  pvm.productList.map((opt: OptionsItem, index: number) => {
+                                    return html` <div
+                                      class="form-check-label c_updown_label"
+                                      style="display: flex; align-items: center; min-height: 60px; gap: 8px;"
+                                    >
+                                      <span class="tx_normal" style="min-width: 30px;">${index + 1}.</span>
+                                      ${BgWidget.validImageBox({ gvc, image: opt.image, width: 40 })}
+                                      <span class="tx_normal">${opt.value}</span>
+                                      ${opt.note ? html` <span class="tx_gray_12 ms-2">${opt.note}</span> ` : ''}
+                                    </div>`;
                                   })
-                                )}
-                              </div>
-                              ${gvc.bindView({
-                                bind: pvm.id,
-                                view: () => {
-                                  if (pvm.loading) {
-                                    return '資料載入中';
-                                  }
-                                  if (pvm.productList.length === 0) {
-                                    return '目前無選取任何商品';
-                                  }
-                                  return gvc.map(
-                                    pvm.productList.map((opt: OptionsItem, index: number) => {
-                                      return html` <div
-                                        class="form-check-label c_updown_label"
-                                        style="display: flex; align-items: center; min-height: 56px; gap: 8px;"
-                                      >
-                                        <span class="tx_normal">${index + 1} .</span>
-                                        <div style="line-height: 40px;">
-                                          <img
-                                            class="rounded border me-1"
-                                            src="${opt.image ?? BgWidget.noImageURL}"
-                                            style="width:40px; height:40px;"
-                                          />
-                                        </div>
-                                        <span class="tx_normal">${opt.value}</span>
-                                        ${opt.note ? html` <span class="tx_gray_12 ms-2">${opt.note}</span> ` : ''}
-                                      </div>`;
-                                    })
-                                  );
-                                },
-                                onCreate: () => {
-                                  if (pvm.loading) {
-                                    if (pvm.dataList.length === 0) {
-                                      pvm.productList = [];
+                                );
+                              },
+                              onCreate: () => {
+                                if (pvm.loading) {
+                                  if (pvm.dataList.length === 0) {
+                                    pvm.productList = [];
+                                    pvm.loading = false;
+                                    setTimeout(() => gvc.notifyDataChange(pvm.id), 100);
+                                  } else {
+                                    ApiShop.getProduct({
+                                      page: 0,
+                                      limit: 99999,
+                                      id_list: pvm.dataList.join(','),
+                                    }).then(data => {
+                                      pvm.productList = data.response.data.map(
+                                        (product: {
+                                          content: {
+                                            id: number;
+                                            title: string;
+                                            preview_image: string[];
+                                          };
+                                        }) => {
+                                          return {
+                                            key: product.content.id,
+                                            value: product.content.title,
+                                            image: product.content.preview_image[0] ?? BgWidget.noImageURL,
+                                          };
+                                        }
+                                      );
                                       pvm.loading = false;
-                                      setTimeout(() => gvc.notifyDataChange(pvm.id), 100);
-                                    } else {
-                                      ApiShop.getProduct({
-                                        page: 0,
-                                        limit: 99999,
-                                        id_list: pvm.dataList.join(','),
-                                      }).then(data => {
-                                        pvm.productList = data.response.data.map(
-                                          (product: {
-                                            content: {
-                                              id: number;
-                                              title: string;
-                                              preview_image: string[];
-                                            };
-                                          }) => {
-                                            return {
-                                              key: product.content.id,
-                                              value: product.content.title,
-                                              image: product.content.preview_image[0] ?? BgWidget.noImageURL,
-                                            };
-                                          }
-                                        );
-                                        pvm.loading = false;
-                                        gvc.notifyDataChange(pvm.id);
-                                      });
-                                    }
+                                      gvc.notifyDataChange(pvm.id);
+                                    });
                                   }
-                                },
-                              })}
-                            </div>
-                          `;
-                        })()}`
+                                }
+                              },
+                            })}
+                          </div>
+                        `;
+                      })()
                     ),
                     BgWidget.mainCard(
                       [
@@ -1012,7 +993,7 @@ export class ShoppingCollections {
                             vm.data.parentTitles.length > 0) ||
                           vm.type === 'add'
                         ) {
-                          return html` <div class="tx_700" style="margin-bottom: 18px">父層</div>
+                          return html` <div class="tx_700" style="margin-bottom: 12px">父層</div>
                             ${BgWidget.select({
                               gvc: gvc,
                               callback: text => {
@@ -1027,7 +1008,7 @@ export class ShoppingCollections {
                         }
                         const id = gvc.glitter.getUUID();
                         return html`
-                          <div class="tx_700" style="margin-bottom: 18px">子分類</div>
+                          <div class="tx_700" style="margin-bottom: 12px">子分類</div>
                           ${gvc.bindView({
                             bind: id,
                             view: () => {
@@ -1100,7 +1081,6 @@ export class ShoppingCollections {
                       return;
                     }
 
-                    // const regexTitle = /[\s,\/\\]+/g;
                     const forbiddenRegex = /[,/\\]/;
                     if (forbiddenRegex.test(vm.data.title)) {
                       dialog.infoMessage({ text: '標題不可包含空白格與以下符號：<br />「 , 」「 / 」「 \\ 」' });

package/lowcode/cms-plugin/shopping-finance-setting.js

@@ -899,7 +899,7 @@ export class ShoppingFinanceSetting {
                     BgWidget.tab(viewList, gvc, vm.key, res => {
                         vm.key = res;
                         gvc.notifyDataChange(vm.id);
-                    }, 'margin-bottom: 0px; margin-top: -10px;'),
+                    }, 'margin: 10px 0 !important'),
                     page,
                 ].join(BgWidget.mbContainer(12));
             },
@@ -1117,9 +1117,8 @@ export class ShoppingFinanceSetting {
                     }, { single: false }),
                     BgWidget.editeInput({
                         gvc: gvc,
-                        title: html `<div class="d-flex align-items-center mt-2 gap-2">
-              最低消費金額（輸入0則沒有限制） ${questionDialog(`顧客的購物車必須要消費到這個金額，才能啟用此${t}流`)}
-            </div>`,
+                        title: html `<div class="d-flex align-items-center mt-3 gap-2">最低消費金額（輸入 0 則沒有限制）</div>
+              ${BgWidget.grayNote(`購物車需達到此金額，才可使用此${t}流`)}`,
                         default: `${data.cartSetting.minimumTotal}`,
                         type: 'number',
                         callback: text => {
@@ -1129,9 +1128,8 @@ export class ShoppingFinanceSetting {
                     }),
                     BgWidget.editeInput({
                         gvc: gvc,
-                        title: html `<div class="d-flex align-items-center mt-2 gap-2">
-              最高消費金額（輸入0則沒有限制） ${questionDialog(`顧客的購物車不可超出這個金額，才能啟用此${t}流`)}
-            </div>`,
+                        title: html `<div class="d-flex align-items-center mt-3 gap-2">最高消費金額（輸入 0 則沒有限制）</div>
+              ${BgWidget.grayNote(`購物車需低於此金額，才可使用此${t}流`)}`,
                         default: `${data.cartSetting.maximumTotal}`,
                         type: 'number',
                         callback: text => {
@@ -1139,13 +1137,11 @@ export class ShoppingFinanceSetting {
                         },
                         placeHolder: '請輸入金額',
                     }),
-                    BgWidget.horizontalLine(),
+                    BgWidget.horizontalLine({ margin: 1.5 }),
                     BgWidget.editeInput({
                         gvc: gvc,
-                        title: html `<div class="d-flex align-items-center mt-2 gap-2">
-              <div style="white-space: break-spaces;">達指定消費金額，訂單免運費（輸入0則不設定此功能）</div>
-              ${questionDialog(html `訂單中「所有商品小計(A)」若達到輸入的指定值，使用此物流則免運`)}
-            </div>`,
+                        title: html `<div class="mt-3" style="white-space: break-spaces;">滿額免運（輸入 0 則不啟用）</div>
+              ${BgWidget.grayNote('購物車達到此金額即享有免運優惠')}`,
                         default: `${data.cartSetting.freeShipmnetTarget}`,
                         type: 'number',
                         callback: text => {

package/lowcode/cms-plugin/shopping-finance-setting.ts

@@ -993,7 +993,7 @@ export class ShoppingFinanceSetting {
               vm.key = res;
               gvc.notifyDataChange(vm.id);
             },
-            'margin-bottom: 0px; margin-top: -10px;'
+            'margin: 10px 0 !important'
           ),
           page,
         ].join(BgWidget.mbContainer(12));
@@ -1238,9 +1238,8 @@ export class ShoppingFinanceSetting {
           ),
           BgWidget.editeInput({
             gvc: gvc,
-            title: html`<div class="d-flex align-items-center mt-2 gap-2">
-              最低消費金額（輸入0則沒有限制） ${questionDialog(`顧客的購物車必須要消費到這個金額，才能啟用此${t}流`)}
-            </div>`,
+            title: html`<div class="d-flex align-items-center mt-3 gap-2">最低消費金額（輸入 0 則沒有限制）</div>
+              ${BgWidget.grayNote(`購物車需達到此金額，才可使用此${t}流`)}`,
             default: `${data.cartSetting.minimumTotal}`,
             type: 'number',
             callback: text => {
@@ -1250,9 +1249,8 @@ export class ShoppingFinanceSetting {
           }),
           BgWidget.editeInput({
             gvc: gvc,
-            title: html`<div class="d-flex align-items-center mt-2 gap-2">
-              最高消費金額（輸入0則沒有限制） ${questionDialog(`顧客的購物車不可超出這個金額，才能啟用此${t}流`)}
-            </div>`,
+            title: html`<div class="d-flex align-items-center mt-3 gap-2">最高消費金額（輸入 0 則沒有限制）</div>
+              ${BgWidget.grayNote(`購物車需低於此金額，才可使用此${t}流`)}`,
             default: `${data.cartSetting.maximumTotal}`,
             type: 'number',
             callback: text => {
@@ -1260,13 +1258,11 @@ export class ShoppingFinanceSetting {
             },
             placeHolder: '請輸入金額',
           }),
-          BgWidget.horizontalLine(),
+          BgWidget.horizontalLine({ margin: 1.5 }),
           BgWidget.editeInput({
             gvc: gvc,
-            title: html`<div class="d-flex align-items-center mt-2 gap-2">
-              <div style="white-space: break-spaces;">達指定消費金額，訂單免運費（輸入0則不設定此功能）</div>
-              ${questionDialog(html`訂單中「所有商品小計(A)」若達到輸入的指定值，使用此物流則免運`)}
-            </div>`,
+            title: html`<div class="mt-3" style="white-space: break-spaces;">滿額免運（輸入 0 則不啟用）</div>
+              ${BgWidget.grayNote('購物車達到此金額即享有免運優惠')}`,
             default: `${data.cartSetting.freeShipmnetTarget}`,
             type: 'number',
             callback: text => {

package/lowcode/css/editor.css

@@ -29,7 +29,7 @@
   --main-orange-2: #ffb400;
   --main-orange-3: #ff6c02;
   --main-green: #10931d;
-  --main-yellow: #FFB21C;
+  --main-yellow: #ffb21c;
 
   --item-primary: #4d86db;
   --item-success: #d8ecda;
@@ -1130,7 +1130,7 @@ h6 {
 .insignia-sm {
   border-radius: 0.25rem;
   min-height: 20px;
-  padding: 3px 4px;
+  padding: 3px 6px;
   font-size: 12px;
 }
 

package/lowcode/glitter-base/route/shopping.js

@@ -790,7 +790,7 @@ export class ApiShop {
         });
     }
     static getCollection() {
-        return new Promise((resolve, reject) => {
+        return new Promise(resolve => {
             var _a;
             window.glitter.share._public_config = (_a = window.glitter.share._public_config) !== null && _a !== void 0 ? _a : {};
             const config = window.glitter.share._public_config;

package/lowcode/glitter-base/route/shopping.ts

@@ -654,8 +654,8 @@ export class ApiShop {
     valid?: boolean;
     is_shipment?: boolean;
     is_reconciliation?: boolean;
-    buyer_name?:string,
-    buyer_phone?:string
+    buyer_name?: string;
+    buyer_phone?: string;
   }) {
     const filterString = this.orderListFilterString(json.filter);
     return BaseApi.create({
@@ -936,7 +936,7 @@ export class ApiShop {
   }
 
   static getCollection() {
-    return new Promise<{ result: boolean; response: any }>((resolve, reject) => {
+    return new Promise<{ result: boolean; response: any }>(resolve => {
       (window as any).glitter.share._public_config = (window as any).glitter.share._public_config ?? {};
       const config = (window as any).glitter.share._public_config;
       if (config[`collection-manager`] && (window as any).glitter.getUrlParameter('cms') !== 'true') {

package/lowcode/public-components/product/pd-class.js

@@ -1459,8 +1459,11 @@ export class PdClass {
         let minVariant = null;
         let maxVariant = null;
         for (const variant of variants) {
-            const { sale_price, origin_price } = variant;
+            const { sale_price, origin_price, invisible } = variant;
             specPriceMap.set(sale_price, { sale_price, origin_price });
+            if (invisible) {
+                continue;
+            }
             if (!minVariant || sale_price < minVariant.sale_price) {
                 minVariant = { sale_price, origin_price };
             }