@subiz/widget-v4 4.0.50 → 4.0.55

package/assets/less/message.less

@@ -148,13 +148,13 @@
 }
 
 a.message_error {
-	color: @red;
+	.color(@red);
 	display: block;
 	text-align: end;
 	font-size: 13px;
 	margin-bottom: 10px;
 	&:hover {
-		color: @red;
+		.color(@red);
 	}
 }
 
@@ -404,7 +404,7 @@ a.message_error {
 	border: 1px solid @primary-color;
 	margin-right: 10px;
 	margin-top: 10px;
-	color: @primary-color;
+	.color(@primary-color);
 	border-radius: 5px;
 	user-select: none;
 	overflow: hidden;
@@ -508,14 +508,14 @@ a.message_error {
 	display: flex;
 	align-items: center;
 	justify-content: center;
-	color: rgba(255, 255, 255, 0.85);
+	.color(rgba(255, 255, 255, 0.85));
 	text-shadow: 0 10px 25px rgba(0, 0, 0, 0.75);
 	z-index: 999;
 	user-select: none;
 
 	&:hover {
 		text-shadow: 0 10px 20px rgba(0, 0, 0, 0.75);
-		color: rgba(255, 255, 255, 1);
+		.color(rgba(255, 255, 255, 1));
 	}
 
 	&.generic-attachment-navigator--disabled {
@@ -535,6 +535,98 @@ a.message_error {
 	font-size: 80px;
 }
 
+.order_attachment__product_img {
+	width: 40px;
+	height: 40px;
+	margin-right: 10px;
+	border-radius: 5px;
+	flex-shrink: 0;
+	display: block;
+	object-fit: contain;
+	background: whitesmoke;
+}
+
+.order_attachment__product_name {
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+	.color(black);
+}
+
+.order_attachment__header {
+	padding-bottom: 5px;
+	border-bottom: 1px solid #ccc;
+	margin-bottom: 5px;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+}
+
+.order_attachment__product_desc {
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+	.color(#999);
+	font-size: 13px;
+}
+
+.order_attachment__product {
+	display: flex;
+	align-items: center;
+	margin-top: 5px;
+	margin-bottom: 5;
+}
+
+.order_attachment__text_sm {
+	font-size: 13px;
+}
+
+.order_attachment__text_muted {
+	.color(@text-muted);
+}
+
+.order_attachment__text_truncate {
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+}
+
+.order_attachment {
+	margin-top: 10px;
+	.color(black);
+	border: 1px solid #aaa;
+	background: white;
+	border-radius: 8px;
+	width: 220px;
+	overflow-y: auto;
+	overflow-x: hidden;
+	padding: 10px;
+}
+.order_attachment__footer {
+	margin-top: 10px;
+	padding-top: 10px;
+	display: flex;
+	justify-content: space-between;
+	border-top: 1px solid #ccc;
+	line-height: 1;
+}
+
+.order_attachment__label {
+	font-size: 13px;
+	.color(#777);
+	margin-top: 10px;
+}
+
+.order_attachment.order_attachment__user {
+	margin-right: 50px;
+
+	align-self: flex-end;
+
+	margin-right: 0;
+	margin-left: 50px;
+	align-self: flex-start;
+}
+
 .product_attachment {
 	margin-top: 10px;
 
@@ -567,7 +659,6 @@ a.message_error {
 }
 
 .product_attachment__price {
-	color: #aaa;
 	padding-left: 10px;
 }
 
@@ -579,7 +670,7 @@ a.message_error {
 	display: flex;
 	padding: 8px 10px;
 	align-items: center;
-	color: @black;
+	.color(@black);
 	justify-content: center;
 	cursor: pointer;
 	text-transform: capitalize;
@@ -587,7 +678,7 @@ a.message_error {
 		margin-right: 0;
 	}
 	&:hover {
-		color: @primary-color;
+		.color(@primary-color);
 	}
 }
 
@@ -595,14 +686,14 @@ a.product_attachment__title {
 	display: block;
 	padding: 8px 10px 0 10px;
 	font-weight: 500;
-	color: @black;
+	.color(@black);
 
 	word-break: break-all;
 }
 
 .product_attachment__subtitle {
 	padding: 5px 10px;
-	color: #ddd;
+	.color(#aaa);
 	padding-top: 0;
 }
 

package/compiled_src/chatbox/Event.js

@@ -23,6 +23,8 @@ var _GenericTemplateAttachments = _interopRequireDefault(require("./GenericTempl
 
 var _ProductAttachments = _interopRequireDefault(require("./ProductAttachments.js"));
 
+var _OrderAttachments = _interopRequireDefault(require("./OrderAttachments.js"));
+
 var _VideoAttachments = _interopRequireDefault(require("./VideoAttachments.js"));
 
 var _TextMessage = _interopRequireDefault(require("./TextMessage.js"));
@@ -199,6 +201,10 @@ class Event extends _common.Com {
         t: this.props.t,
         store: this.props.store,
         ev: ev
+      }), (0, _preact.h)(_OrderAttachments.default, {
+        t: this.props.t,
+        store: this.props.store,
+        ev: ev
       }), (0, _preact.h)(_QuickReplies.default, {
         store: this.props.store,
         ev: ev,

package/compiled_src/chatbox/OrderAttachments.js

@@ -0,0 +1,109 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _index = _interopRequireDefault(require("../util/index.js"));
+
+var _common = require("../common.js");
+
+var _preact = require("preact");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+class ProductAttachments extends _common.Com {
+  render() {
+    let byType = _index.default.get(this.props.ev, 'by.type');
+
+    if (byType === 'user') return null;
+    let acc = this.props.store.matchAccount();
+
+    var attachments = _index.default.get(this.props.ev, 'data.message.attachments', []);
+
+    let orders = _index.default.filter(attachments, att => att.type === 'order' && att.order).map(att => att.order);
+
+    if (orders.length === 0) return null;
+
+    let $orders = _index.default.map(orders, (order, index) => {
+      let $note = null;
+
+      if (order.note) {
+        $note = (0, _preact.h)("div", null, (0, _preact.h)("div", {
+          class: "order_attachment__label"
+        }, this.props.t('note')), (0, _preact.h)("div", {
+          class: "order_attachment__text_truncate"
+        }, order.note));
+      }
+
+      let $products = null;
+
+      if (_index.default.size(order.items) > 0) {
+        $products = (0, _preact.h)("div", null, (0, _preact.h)("div", {
+          class: "order_attachment__label"
+        }, this.props.t('product')), _index.default.map(order.items, item => {
+          let product = item.product || {};
+          return (0, _preact.h)("div", {
+            class: "order_attachment__product"
+          }, (0, _preact.h)("img", {
+            class: "order_attachment__product_img",
+            src: (_index.default.get(product, 'images.0'), require('../../assets/img/default.jpg'))
+          }), (0, _preact.h)("div", {
+            style: "overflow: hidden !important;"
+          }, (0, _preact.h)("div", {
+            class: "order_attachment__product_name"
+          }, product.name), (0, _preact.h)("div", {
+            class: "order_attachment__product_desc"
+          }, product.description || product.long_description), (0, _preact.h)("div", {
+            class: "order_attachment__product_desc"
+          }, this.props.t('qty'), " ", item.quantity, "\xA0\xB7\xA0", _index.default.formatCurrency(product.price))));
+        }));
+      }
+
+      let $total = (0, _preact.h)("div", {
+        class: "order_attachment__footer"
+      }, (0, _preact.h)("div", null, this.props.t('total')), ' ', (0, _preact.h)("div", null, (0, _preact.h)("b", null, _index.default.formatCurrency(order.total))));
+
+      let addr = _index.default.get(order, 'shipping.address', {});
+
+      let fulladdr = [addr.street, addr.ward, addr.district, addr.region, addr.country].filter(a => a).join(', ');
+      let address = fulladdr;
+      let phoneattr = _index.default.find(_index.default.get(order, 'user.attributes', []), attr => attr.key === 'phones') || {
+        key: 'phones',
+        text: ''
+      };
+
+      let phone = _index.default.get(order, 'shipping.address.phone', '').trim();
+
+      phone = phone || _index.default.trim(phoneattr.text);
+      if (phone) phone = this.props.t('phn') + ': ' + phone;
+      let $shipto = null;
+
+      if (address || phone) {
+        $shipto = (0, _preact.h)("div", null, (0, _preact.h)("div", {
+          class: "order_attachment__label"
+        }, this.props.t('ship_to')), (0, _preact.h)("div", {
+          class: "order_attachment__text_truncate"
+        }, address), (0, _preact.h)("div", {
+          class: "order_attachment__text_truncate"
+        }, phone));
+      }
+
+      return (0, _preact.h)("div", {
+        class: `order_attachment order_attachment__${byType}`
+      }, (0, _preact.h)("div", {
+        class: "order_attachment__header"
+      }, this.props.t('order'), (0, _preact.h)("span", {
+        class: "order_attachment__text_muted order_attachment__text_sm"
+      }, "#", order.id)), $products, $shipto, (0, _preact.h)("div", null, (0, _preact.h)("div", {
+        class: "order_attachment__label"
+      }, this.props.t('payment')), (0, _preact.h)("div", null, "COD")), $note, $total);
+    });
+
+    return $orders;
+  }
+
+}
+
+exports.default = ProductAttachments;

package/compiled_src/chatbox/ProductAttachments.js

@@ -25,6 +25,7 @@ class ProductAttachments extends _common.Com {
 
     products = products.filter(product => product.product && product.product.name);
     if (products.length === 0) return null;
+    let acc = this.props.store.matchAccount();
 
     let $products = _index.default.map(products, (att, index) => {
       let product = att.product;
@@ -43,27 +44,28 @@ class ProductAttachments extends _common.Com {
         href: url,
         class: "product_attachment__title",
         target: "_blank"
-      }, this.props.t.i18n(product.name));
+      }, product.name);
       let $subtitle = null;
-      if (product.short_description) $subtitle = (0, _preact.h)("div", {
+      let desc = product.description || product.long_description;
+      if (desc) $subtitle = (0, _preact.h)("div", {
         class: "product_attachment__subtitle"
-      }, product.short_description);
+      }, desc);
       let $price = null;
 
-      if (product.sale_price) {
+      if (product.price) {
         $price = (0, _preact.h)("div", {
           class: "product_attachment__price"
-        }, product.sale_price, " VND");
+        }, product.currency || _index.default.get(acc, 'currency', ''), " ", _index.default.formatCurrency(product.price));
       }
 
       return (0, _preact.h)("div", {
         class: 'product_attachment product_attachment__' + byType
       }, (0, _preact.h)("div", null, (0, _preact.h)("a", {
-        href: this.props.store.replaceFileUrl(product.images[0]),
+        href: this.props.store.replaceFileUrl(product.image),
         target: "_blank"
       }, (0, _preact.h)("img", {
         class: "product_attachment__img",
-        src: this.props.store.replaceFileUrl(product.images[0])
+        src: this.props.store.replaceFileUrl(product.image)
       }))), $title, $subtitle, $price, (0, _preact.h)("div", {
         class: "product_attachment__btns"
       }, $detailbtn));

package/compiled_src/notif/notif.js

@@ -154,6 +154,10 @@ class Notif extends _common.Com {
 
       let i18n_message = i18n_messages[Math.floor(Math.random() * _index.default.size(i18n_messages))];
 
+      let fallbackmsgs = _index.default.get(this.props, 'plugin.notification.message_quill_deltas', []);
+
+      let fallbackmessage = fallbackmsgs[Math.floor(Math.random() * _index.default.size(fallbackmsgs))];
+
       let i18n_title = _index.default.get(this.props, 'plugin.notification.i18n_title_quill_delta');
 
       return this.setState({
@@ -161,8 +165,8 @@ class Notif extends _common.Com {
         last_show: _index.default.Date.now(),
         timestamp: timestamp,
         user: user,
-        title: this.props.t.i18n(i18n_title),
-        message: this.props.t.i18n(i18n_message)
+        title: this.props.t.i18n(i18n_title) || _index.default.get(this.props, 'plugin.notification.title_quill_delta'),
+        message: this.props.t.i18n(i18n_message) || fallbackmessage
       });
     }
 

package/compiled_src/plugin.js

@@ -411,7 +411,7 @@ const getLocale = (plugin, loc) => {
 
   let found = _index.default.find(plugin.locales, l => l.toLowerCase().trim() === loc.toLowerCase().trim());
 
-  if (found) return loc;
+  if (found) return found;
   found = _index.default.find(plugin.locales, l => {
     l = l.replace('-', '_').split('_')[0].trim().toLowerCase();
     let compareloc = loc.replace('-', '_').split('_')[0].trim().toLowerCase();

package/compiled_src/store/api.js

@@ -157,6 +157,7 @@ class _default {
       data: {
         product: {
           url: pageUrl,
+          name: pageTitle,
           title: pageTitle
         }
       }

package/compiled_src/util/campaign.js

@@ -41,7 +41,12 @@ function trackAreaClicked(selector, cb) {
   common.map(selector.split('\n'), selector => {
     selector = common.trim(selector);
     if (!selector) return;
-    let doms = document.querySelectorAll(selector);
+    let doms = [];
+
+    try {
+      doms = document.querySelectorAll(selector);
+    } catch (e) {}
+
     common.map(doms, dom => {
       if (!dom) return;
       dom.addEventListener('click', cb, false);

package/compiled_src/util/common.js

@@ -15,6 +15,7 @@ exports.diffYear = diffYear;
 exports.each = each;
 exports.filter = filter;
 exports.find = find;
+exports.formatCurrency = formatCurrency;
 exports.getAgentDisplayName = getAgentDisplayName;
 exports.getDayName = getDayName;
 exports.getIntegrationId = getIntegrationId;
@@ -1129,6 +1130,12 @@ var sleep = ms => new Promise(res => setTimeout(res, ms));
 
 exports.sleep = sleep;
 
+function formatCurrency(val) {
+  if (!val) return 0;
+  val = Math.round(val);
+  return val.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,');
+}
+
 function replaceFileUrl(src) {
   let fileurl = 'https://vcdn.subiz-cdn.com/file/';
   if (!src) return '';