@subiz/widget-v4 4.1.185 → 4.1.187

package/assets/less/chatbox.less

@@ -19,6 +19,7 @@
 @desktop-chat-button-margin-x: '@desktop_button.margin_x'; //20px;
 @desktop-chat-button-margin-y: '@desktop_button.margin_y'; // 20px;
 @desktop-widget-max-height: '@desktop_widget_max_height'; // calc(100% - desktop_buttom.margin_y)
+@preview-max-width: '@preview_max_width';
 
 @form-page-background-color: '@form_background_color';
 @form-page-header-font-size: '@form_header_font_size';

package/assets/less/message.less

@@ -963,3 +963,23 @@ a.product_attachment__title {
 .text-message-li {
 	display: list-item;
 }
+
+.agent-message .text-message-link {
+	.color(@link);
+	font-weight: 400;
+
+	&:hover {
+		.color(@link-hover);
+	}
+}
+
+.user-message .text-message-link {
+	text-decoration: underline;
+	text-decoration-color: rgba(255, 255, 255, 0.6);
+	text-underline-offset: 4px;
+
+	&:hover {
+		text-decoration-color: #fff;
+		background-color: rgba(255, 255, 255, 0.08);
+	}
+}

package/assets/less/widget.less

@@ -645,6 +645,34 @@
 	&.right {
 		align-items: flex-end;
 	}
+
+	&.horizontal {
+		flex-direction: row;
+		flex-wrap: wrap;
+		align-items: center;
+		gap: 10px;
+
+		&.right {
+			justify-content: flex-end;
+		}
+
+		&.left {
+			justify-content: flex-start;
+		}
+	}
+}
+
+.widget-preview-quick-reply-wrapper.horizontal .widget-preview-quick-reply-item {
+	margin: 0;
+	max-width: 200px;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	padding: 6px 15px;
+
+	&:last-child {
+		margin-bottom: 0;
+	}
 }
 
 .widget-preview-quick-reply-item {
@@ -719,7 +747,7 @@
 }
 
 .widget-preview-new-wrapper {
-	max-width: 340px;
+	max-width: @preview-max-width;
 	position: relative;
 	opacity: 1;
 	transition:
@@ -740,18 +768,6 @@
 			display: flex;
 		}
 	}
-
-	.widget-preview--btn-close {
-		width: 32px;
-		height: 32px;
-		background-color: #00000040;
-		background-size: 16px 16px;
-		background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMi4yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXIteCI+PGxpbmUgeDE9IjE4IiB5MT0iNiIgeDI9IjYiIHkyPSIxOCI+PC9saW5lPjxsaW5lIHgxPSI2IiB5MT0iNiIgeDI9IjE4IiB5Mj0iMTgiPjwvbGluZT48L3N2Zz4K');
-
-		&:hover {
-			background-color: #00000066;
-		}
-	}
 }
 
 .widget-preview-x-wrapper {
@@ -763,9 +779,30 @@
 	left: -20px;
 	bottom: 100%;
 
+	&.mobile {
+		display: flex;
+	}
+
 	&.right {
 		justify-content: flex-end;
 		left: unset;
 		right: -20px;
 	}
+
+	.widget-preview--btn-close {
+		opacity: 1;
+		width: 32px;
+		height: 32px;
+		border: 1px solid #ececec;
+    box-shadow: 0px 5px 30px rgba(0, 0, 0, 0.15);
+		background-color: #00000040;
+		background-size: 16px 16px;
+		background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNlY2VjZWMiIHN0cm9rZS13aWR0aD0iMi4yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXIteCI+PGxpbmUgeDE9IjE4IiB5MT0iNiIgeDI9IjYiIHkyPSIxOCI+PC9saW5lPjxsaW5lIHgxPSI2IiB5MT0iNiIgeDI9IjE4IiB5Mj0iMTgiPjwvbGluZT48L3N2Zz4K');
+
+		&:hover {
+			border-color: #fff;
+			background-color: #00000066;
+			background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMi4yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXIteCI+PGxpbmUgeDE9IjE4IiB5MT0iNiIgeDI9IjYiIHkyPSIxOCI+PC9saW5lPjxsaW5lIHgxPSI2IiB5MT0iNiIgeDI9IjE4IiB5Mj0iMTgiPjwvbGluZT48L3N2Zz4K');
+		}
+	}
 }

package/compiled_src/bot.js

@@ -21,7 +21,7 @@ function _default(store) {
         if (!bot.welcome_message) return;
         let {
           error
-        } = await store.startLightConvo(bot.id, bot.welcome_message, common.getLocale(bot, _index.default.detectLang()), true);
+        } = await store.startLightConvo(bot.id, bot.welcome_message, common.getLocale(bot, _index.default.detectLang()), false);
         if (error) return console.error(error);
         store.logBotRun(bot.id);
         return;

package/compiled_src/chatbox/ChatButton.js

@@ -48,11 +48,15 @@ class ChatButton extends _common.Com {
       if (screen === 'widget') return;
       if (minimized && Date.now() - minimized < Ms30Mins) return;
       if (this.props.store.isMobile()) {
-        this.props.store.updateLastview({
-          previewEvent: ev
-        });
-        this.forceUpdate();
-        return;
+        let mobileDisabled = _index.default.get(this.props.plugin, 'chatbox.greeting.mobile_disabled');
+        if (mobileDisabled) {
+          this.props.store.updateLastview({
+            screen: 'button',
+            previewEvent: ev
+          });
+          this.forceUpdate();
+          return;
+        }
       }
       this.props.store.updateLastview({
         screen: 'preview',
@@ -210,7 +214,8 @@ class ChatButton extends _common.Com {
     let greeting = _index.default.get(accountSetting, 'greeting', {});
     let text = this.props.t.i18n(_index.default.get(greeting, 'greeting', {})) || greeting.message;
     let enabled = greeting.enabled;
-    if (!text || !enabled) {
+    let mobileDisabled = this.props.store.isMobile() && greeting.mobile_disabled;
+    if (!text || !enabled || mobileDisabled) {
       return;
     }
     this.ShowGreeting();
@@ -269,7 +274,6 @@ class ChatButton extends _common.Com {
     return agent;
   }
   renderPreview() {
-    if (this.props.store.isMobile()) return;
     if (!this.state.hasPreviewDom) return;
     let previewEvent = this.state.previewEvent;
     let agent = this.getAgentOfPreviewEvent(previewEvent);
@@ -283,6 +287,7 @@ class ChatButton extends _common.Com {
     let attachments = _index.default.get(previewEvent, 'data.message.attachments') || [];
     let quickReplies = _index.default.find(attachments, att => att.type === 'quick_replies');
     quickReplies = _index.default.get(quickReplies, 'quick_replies') || [];
+    quickReplies = _index.default.take(quickReplies, 10);
     let imgAtt = _index.default.find(attachments, att => _index.default.includes(att.mimetype, 'image') && att.url);
     let uri = _index.default.get(imgAtt, 'url') || '';
     if (uri && !uri.startsWith('https://') && !uri.startsWith('http://') && !uri.startsWith('content://') && !uri.startsWith('data:')) {
@@ -291,7 +296,7 @@ class ChatButton extends _common.Com {
     return (0, _preact.h)("div", {
       class: `widget-preview-new-wrapper ${this.state.previewExtraCls}`
     }, (0, _preact.h)("div", {
-      class: `widget-preview-x-wrapper ${position}`
+      class: `widget-preview-x-wrapper ${position} ${this.props.store.isMobile() ? 'mobile' : ''}`
     }, (0, _preact.h)("div", {
       class: "widget-preview--btn-close",
       onClick: e => this.closePreview(e)
@@ -322,10 +327,11 @@ class ChatButton extends _common.Com {
     }, (0, _preact.h)("img", {
       src: uri
     }))), _index.default.size(quickReplies) > 0 && (0, _preact.h)("div", {
-      class: `widget-preview-quick-reply-wrapper ${position}`
+      class: `widget-preview-quick-reply-wrapper ${position} ${_index.default.size(quickReplies) > 4 ? 'horizontal' : ''}`
     }, _index.default.map(quickReplies, reply => {
       if (!(reply.title || '').trim()) return;
       return (0, _preact.h)("div", {
+        title: reply.title,
         class: "widget-preview-quick-reply-item",
         onClick: () => {
           this.props.onSelectQuickReply({

package/compiled_src/chatbox/TextMessage.js

@@ -45,15 +45,18 @@ class TextMessage extends _common.Com {
           url = '//' + url;
         }
         return (0, _preact.h)("a", {
+          class: "text-message-link",
           href: url,
           target: "_blank",
           onClick: e => this.props.onLink(e, url)
         }, tag.text);
       }
       if (tag.type === 'phone') return (0, _preact.h)("a", {
+        class: "text-message-link",
         href: 'tel:' + tag.text
       }, tag.text);
       if (tag.type === 'email') return (0, _preact.h)("a", {
+        class: "text-message-link",
         href: 'mailto:' + tag.text
       }, tag.text);
       return tag.text;

package/compiled_src/chatbox/block.js

@@ -179,6 +179,7 @@ class Block extends _common.Com {
         return (0, _preact.h)("hr", null);
       case 'a':
         return (0, _preact.h)("a", {
+          class: this.props.textMessage ? 'message-text-link' : '',
           href: ele.attrs['href'],
           target: this.props.textMessage ? '_blank' : ele.attrs['target'],
           title: ele.attrs['title']

package/compiled_src/chatbox/main.js

@@ -25,6 +25,8 @@ class Main extends _common.Com {
     let chatbox = found.chatbox;
     let margin_y = _index.default.get(chatbox, 'desktop_button.margin_y');
     chatbox.desktop_widget_max_height = margin_y ? `calc(100% - ${margin_y + 10}px)` : 'calc(100% - 40px)';
+    const PREVIEW_MAX_WIDTH = 340;
+    chatbox.preview_max_width = Math.min(PREVIEW_MAX_WIDTH, chatbox.width) + 'px';
     var outcss = _index.default.replaceCssVariable(css, chatbox);
     _index.default.setCss(this.props.plugin.id, this.$cssStyleDiv, outcss);
   }

package/compiled_src/store/store.js

@@ -521,7 +521,14 @@ class Store {
         lastView.screen = 'widget';
       }
     }
-    if (this.isMobile()) lastView.screen = 'button';
+    if (this.isMobile()) {
+      lastView.screen = 'preview';
+      let plugins = this.matchPlugin() || {};
+      let chatbox = _index.default.find(plugins, plugin => plugin.type === 'chatbox') || {};
+      if (_index.default.get(chatbox, 'chatbox.greeting.mobile_disabled')) {
+        lastView.screen = 'button';
+      }
+    }
     this.kv.put('lastview', lastView);
   }
   async _initResource(accid, auth, realtimep) {

package/compiled_src/util/common.js

@@ -628,6 +628,7 @@ function replaceCssVariable(css, setting) {
   tokens = tokenize(tokens, "'@desktop_button.margin_x'");
   tokens = tokenize(tokens, "'@desktop_button.margin_y'");
   tokens = tokenize(tokens, "'@desktop_widget_max_height'");
+  tokens = tokenize(tokens, "'@preview_max_width'");
   tokens = tokenize(tokens, "'@mobile_button.width'");
   tokens = tokenize(tokens, "'@mobile_button.height'");
   tokens = tokenize(tokens, "'@mobile_button.background'");

package/compiled_src/util/index.js

@@ -14,6 +14,7 @@ sb.Mutex = require('./mutex.js').default;
 var op = require('./op.js');
 sb.get = op.get;
 sb.set = op.set;
+sb.take = op.take;
 sb.Pubsub = require('./pubsub.js').default;
 sb = Object.assign(sb, campaign);
 var _default = exports.default = sb;

package/compiled_src/util/op.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.get = get;
 exports.set = set;
+exports.take = take;
 var toStr = Object.prototype.toString;
 var isArray = Array.isArray || function (obj) {
   return toStr.call(obj) === '[object Array]';
@@ -52,4 +53,12 @@ function set(obj, path, value) {
     obj[currentPath] = typeof path[1] === 'number' ? [] : {};
   }
   return set(obj[currentPath], path.slice(1), value);
+}
+function take(arr, n = 1) {
+  if (!Array.isArray(arr)) return [];
+  let len = arr.length;
+  if (typeof len !== 'number' || len <= 0) return [];
+  if (n <= 0) return [];
+  let end = Math.min(n, len);
+  return arr.slice(0, end);
 }

package/dist/127.js

@@ -0,0 +1,273 @@
+"use strict";
+(self["webpackChunk_subiz_widget_v4"] = self["webpackChunk_subiz_widget_v4"] || []).push([[127],{
+
+/***/ 6127:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ ProductAttachments)
+/* harmony export */ });
+/* harmony import */ var _util_index_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(8150);
+/* harmony import */ var _common_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(2840);
+/* harmony import */ var preact__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(172);
+
+
+
+class ProductAttachments extends _common_js__WEBPACK_IMPORTED_MODULE_1__/* .Com */ .Mw {
+  render() {
+    let byType = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.get(this.props.ev, 'by.type');
+    if (byType === 'user') return null;
+    let acc = this.props.store.matchAccount();
+    var attachments = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.get(this.props.ev, 'data.message.attachments', []);
+    let orders = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.filter(attachments, att => att.type === 'order' && att.order).map(att => att.order);
+    if (orders.length === 0) return null;
+    let $orders = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.map(orders, (order, index) => {
+      calcOrderTotal(order);
+      let $note = null;
+      if (order.note) {
+        $note = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", null, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label"
+        }, this.props.t('note')), (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__note",
+          title: order.note
+        }, order.note));
+      }
+      let $products = null;
+      if (_util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.size(order.items) > 0) {
+        $products = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", null, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label"
+        }, this.props.t('product')), _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.map(order.items, item => {
+          let product = item.product || {};
+          return (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+            class: "order_attachment__product"
+          }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("img", {
+            class: "order_attachment__product_img",
+            alt: '' + _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.get(product, 'id'),
+            src: _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.get(product, 'image', __webpack_require__(2876))
+          }), (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+            style: "overflow: hidden !important;"
+          }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+            class: "order_attachment__product_name",
+            title: this.props.t.i18n(product.i18n_name) || product.name
+          }, this.props.t.i18n(product.i18n_name) || product.name), (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+            class: "order_attachment__product_desc"
+          }, getProductPropName(product, ' / ')), (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+            class: "order_attachment__product_desc"
+          }, this.props.t('qty'), " ", item.quantity, "\xA0\xB7\xA0", _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(product.price))));
+        }));
+      }
+      let $total = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+        class: "order_attachment__footer"
+      }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+        class: "d-flex align-items-center justify-content-between"
+      }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", null, this.props.t('total')), ' ', (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", null, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("b", {
+        class: "order_attachment__total"
+      }, _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(order.total)))));
+      let phoneattr = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.find(_util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.get(order, 'user.attributes', []), attr => attr.key === 'phones') || {
+        key: 'phones',
+        text: ''
+      };
+      let phone = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.get(order, 'shipping.address.phone', '').trim();
+      phone = phone || _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.trim(phoneattr.text);
+      if (phone) phone = this.props.t('phn') + ': ' + phone;
+      let $shipto = null;
+      if (displayOrderShippingAddress(order) || phone) {
+        $shipto = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", null, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label"
+        }, this.props.t('ship_to')), (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", null, displayOrderShippingAddress(order)), (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__text_truncate"
+        }, phone));
+      }
+      let $beforeTax = null;
+      if (order._discount_before_tax) {
+        $beforeTax = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__footer"
+        }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "d-flex align-items-center justify-content-between"
+        }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label no_margin"
+        }, this.props.t('subtotal_before_tax')), ' ', (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", null, _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(order._order_value))), (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "d-flex align-items-center justify-content-between"
+        }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label no_margin"
+        }, this.props.t('discount_before_tax')), ' ', (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", null, "-", _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(order._discount_before_tax))));
+      }
+      let $subtotal = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+        class: "d-flex align-items-center justify-content-between"
+      }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+        class: "order_attachment__label no_margin"
+      }, this.props.t('subtotal')), ' ', (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+        style: ""
+      }, _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(order.subtotal)));
+      let $tax = null;
+      if (order.total_tax) {
+        let taxname = '';
+        if (_util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.size(order._taxM) === 1) {
+          let tax = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.get(order._taxM, '0.tax', {});
+          if (tax.name && tax.percentage) taxname = `(${tax.name} ${Math.round(tax.percentage || 0) / 100}%)`;
+        }
+        $tax = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "d-flex align-items-center justify-content-between"
+        }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label no_margin"
+        }, this.props.t('tax'), " ", taxname), (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          style: ""
+        }, _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(order.total_tax)));
+      }
+      let $discount = null;
+      if (order.discount_type === 'percentage' && order.discount_percentage) {
+        $discount = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "d-flex align-items-center justify-content-between"
+        }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label no_margin"
+        }, this.props.t('discount_after_tax'), " (", Math.round(order.discount_percentage / 100), "%)"), ' ', (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          style: ""
+        }, "-", _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(order._computed_discount)));
+      }
+      if (order.discount_type === 'amount' && order.discount_amount) {
+        $discount = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "d-flex align-items-center justify-content-between"
+        }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label no_margin"
+        }, this.props.t('discount_after_tax')), ' ', (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "no-shrink"
+        }, "-", _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(order._computed_discount)));
+      }
+      let $shipping = null;
+      if (_util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.get(order, 'shipping.nominal_fee')) {
+        $shipping = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "d-flex align-items-center justify-content-between"
+        }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label no_margin"
+        }, this.props.t('shipping_fee')), ' ', (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          style: ""
+        }, _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(_util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.get(order, 'shipping.nominal_fee', 0))));
+      }
+      let $adjustment = null;
+      if (order.adjustment) {
+        $adjustment = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "d-flex align-items-center justify-content-between"
+        }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "order_attachment__label no_margin"
+        }, order.adjustment_description), ' ', (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+          class: "no-shrink"
+        }, _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"] */ .A.formatCurrency(order.adjustment)));
+      }
+      $subtotal = (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+        class: "order_attachment__footer"
+      }, $subtotal, $tax, $shipping, $discount, $adjustment);
+      if (!$shipping && !$adjustment && !$discount && !$tax) {
+        $subtotal = null;
+      }
+      return (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+        class: `order_attachment order_attachment__${byType}`
+      }, (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("div", {
+        class: "order_attachment__header"
+      }, this.props.t('order'), (0,preact__WEBPACK_IMPORTED_MODULE_2__.h)("span", {
+        class: "order_attachment__text_muted order_attachment__text_sm"
+      }, getOrderDisplayName(order))), $products, $shipto, $note, $beforeTax, $subtotal, $total);
+    });
+    return $orders;
+  }
+}
+function getProductPropName(product, seperator = ' - ') {
+  let options = op.get(product, 'options', []);
+  let props = op.get(product, 'props', []);
+  let multiPropsOptions = op.filter(options, option => op.size(option.values) > 1);
+  let names = [];
+  op.each(multiPropsOptions, option => {
+    let prop = op.find(props, prop => prop.key === option.key) || {};
+    if (prop.value) names.push(prop.value);
+  });
+  return names.join(seperator);
+}
+function getOrderDisplayName(order = {}) {
+  return order.number || order.id || '';
+}
+function displayOrderShippingAddress(order, isShorten) {
+  let addr = op.get(order, 'shipping.address', {});
+  let fulladdr = [addr.address, addr.ward, addr.district, addr.province].filter(a => a).join(', ').trim();
+  if (isShorten) fulladdr = shortenAddr(fulladdr);
+  return fulladdr;
+}
+function shortenAddr(str) {
+  str = str || '';
+  str = str.replace(/Hà Nội/gi, 'HN');
+  str = str.replace(/Hồ Chí Minh/gi, 'HCM');
+  str = str.replace(/Thành Phố/gi, 'TP');
+  return str;
+}
+function calcOrderTotal(order) {
+  let subtotal = 0;
+  let beforeTaxDiscount = 0;
+  let ordervalue = 0;
+  op.map(order.items, item => {
+    if (!item.product) return 0;
+    let price = op.get(item, 'product.price', 0) * (item.quantity || 0);
+    ordervalue += price;
+    if (item.discount_type == 'percentage') {
+      if (item.discount_percentage > 0) {
+        beforeTaxDiscount += price * item.discount_percentage / 10000;
+        price = price * (1 - (item.discount_percentage || 0) / 10000);
+      }
+    } else if (item.discount_type == 'amount') {
+      if (item.discount_amount > 0) {
+        beforeTaxDiscount += item.discount_amount;
+        price = price - (item.discount_amount || 0);
+        if (price <= 0) price = 0;
+      }
+    }
+    item.total = price;
+    subtotal += price;
+  });
+  let taxM = {};
+  op.map(order.items, (item, i) => {
+    if (!item.product) return;
+    let tax = item.product.tax;
+    if (!tax) return;
+    if (!tax.id) return;
+    let taxprice = item.total * tax.percentage / 10000;
+    item.total_tax = taxprice;
+    taxM[i] = {
+      tax: tax,
+      taxprice: taxprice
+    };
+  });
+  let totaltax = 0;
+  op.map(taxM, t => totaltax += t.taxprice);
+  let computed_discount = 0;
+  if (order.discount_type == 'percentage' && order.discount_percentage > 0) {
+    computed_discount = (subtotal + totaltax) * order.discount_percentage / 10000;
+  } else if (order.discount_type == 'amount') {
+    computed_discount = order.discount_amount || 0;
+  }
+  let shippingfee = op.get(order, 'shipping.nominal_fee', 0);
+  if (shippingfee > 0) {
+    if (op.get(order, 'shipping.tax.id')) {
+      let tax = order.shipping.tax;
+      let taxprice = shippingfee * (tax.percentage / 10000);
+      taxM['ship'] = {
+        tax: tax,
+        taxprice: taxprice
+      };
+      order.shipping.total_tax = taxprice;
+    }
+  }
+  totaltax = 0;
+  op.map(taxM, t => totaltax += t.taxprice);
+  let total = subtotal + totaltax - computed_discount + shippingfee;
+  total += order.adjustment || 0;
+  if (total < 0) total = 0;
+  order.subtotal = subtotal;
+  order._computed_discount = computed_discount;
+  order._taxM = taxM;
+  order.total = total;
+  order.total_tax = totaltax;
+  order._discount_before_tax = beforeTaxDiscount;
+  order._order_value = ordervalue;
+}
+
+/***/ })
+
+}]);