@subiz/widget-v4 4.1.191 → 4.1.195

package/dist/185.js

@@ -0,0 +1,1827 @@
+(self["webpackChunk_subiz_widget_v4"] = self["webpackChunk_subiz_widget_v4"] || []).push([[185],{
+
+/***/ 185
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/loader.37000a7.svg";
+
+/***/ },
+
+/***/ 1113
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/ghn.070f8e3.svg";
+
+/***/ },
+
+/***/ 2523
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/shop_faded.df7845a.svg";
+
+/***/ },
+
+/***/ 3080
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/x.26fdfa3.svg";
+
+/***/ },
+
+/***/ 3142
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/not_found_search.2ddb8d1.png";
+
+/***/ },
+
+/***/ 4185
+(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  "default": () => (/* binding */ Order)
+});
+
+// EXTERNAL MODULE: ./src/util/index.js + 1 modules
+var util = __webpack_require__(8150);
+// EXTERNAL MODULE: ./src/chatbox/releaseAnimation.js
+var releaseAnimation = __webpack_require__(2988);
+// EXTERNAL MODULE: ./src/chatbox/time.js
+var time = __webpack_require__(1620);
+// EXTERNAL MODULE: ./src/common.js
+var common = __webpack_require__(2840);
+// EXTERNAL MODULE: ./node_modules/preact/dist/preact.module.js
+var preact_module = __webpack_require__(172);
+// EXTERNAL MODULE: ./src/chatbox/spinner.js
+var spinner = __webpack_require__(4188);
+;// ./src/chatbox/DropdownSelect.js
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+
+
+
+
+class DropdownSelect extends common/* Com */.Mw {
+  constructor(props) {
+    super(props);
+    _defineProperty(this, "state", {
+      show: false,
+      searchValue: ''
+    });
+    _defineProperty(this, "filterRef", (0,preact_module/* createRef */._3)());
+    _defineProperty(this, "overlayRef", (0,preact_module/* createRef */._3)());
+    _defineProperty(this, "onTouchMove", e => {
+      if (e.target === this.overlayRef.current) {
+        e.preventDefault();
+        e.stopPropagation();
+      }
+    });
+    _defineProperty(this, "hideDropdown", () => {
+      this.setState({
+        show: false,
+        searchValue: ''
+      });
+    });
+    _defineProperty(this, "onKeydown", e => {
+      if (e.key === 'Escape') {
+        if (!this.state.show) return;
+        if (this.state.searchValue) this.setState({
+          searchValue: ''
+        });else this.hideDropdown();
+        e.preventDefault();
+        e.stopPropagation();
+      }
+    });
+    _defineProperty(this, "hasSearch", () => {
+      if (this.props.has_search) return true;
+      return util/* default */.A.size(this.props.items) >= 10;
+    });
+    _defineProperty(this, "getFilteredOptions", () => {
+      let items = this.props.items;
+      if (this.state.searchValue && this.hasSearch()) {
+        items = util/* default */.A.filter(items, item => {
+          let optionName = util/* default */.A.unicodeToAscii(item.name).toLowerCase().replace(/ /g, '');
+          let optionDesc = util/* default */.A.unicodeToAscii(item.desc).toLowerCase().replace(/ /g, '');
+          let searchValue = util/* default */.A.unicodeToAscii(this.state.searchValue).toLowerCase().replace(/ /g, '');
+          return optionName.indexOf(searchValue) != -1 || optionDesc.indexOf(searchValue) != -1;
+        });
+      }
+      return items;
+    });
+    _defineProperty(this, "onChangeSearchValue", e => {
+      this.setState({
+        searchValue: e.target.value
+      });
+    });
+    _defineProperty(this, "toogleDropdown", async () => {
+      await this.setState({
+        show: true,
+        searchValue: ''
+      });
+      this.focusFilter();
+    });
+    _defineProperty(this, "onSelect", item => {
+      this.props.onSelect(item);
+      this.hideDropdown();
+    });
+    _defineProperty(this, "onBackgroundScroll", e => {
+      console.log('EEEEEEE', e);
+      alert('y');
+    });
+    document.addEventListener('touchmove', function (e) {});
+  }
+  componentDidMount() {
+    window.addEventListener('keydown', this.onKeydown);
+  }
+  componentWillUnmount() {
+    window.removeEventListener('keydown', this.onKeydown);
+  }
+  renderEmpty() {
+    return (0,preact_module.h)("div", {
+      class: "dropdown_select_filter__empty"
+    }, (0,preact_module.h)("img", {
+      class: "dropdown_select_filter__empty_img",
+      src: __webpack_require__(3142)
+    }), (0,preact_module.h)("div", {
+      class: "muted",
+      style: "text-align: center !important;"
+    }, "Kh\xF4ng c\xF3 k\u1EBFt qu\u1EA3"));
+  }
+  renderLoading() {
+    return (0,preact_module.h)("div", {
+      class: "dropdown_select_filter__empty pt-3"
+    }, (0,preact_module.h)(spinner/* default */.A, {
+      size: "40",
+      static: true
+    }), (0,preact_module.h)("div", {
+      class: "muted mt-2",
+      style: "text-align: center !important;"
+    }, "\u0110ang t\u1EA3i d\u1EEF li\u1EC7u"));
+  }
+  focusFilter() {
+    if (!this.filterRef.current) return;
+    this.filterRef.current.focus();
+    util/* default */.A.setTimeout(() => {
+      if (!this.filterRef.current) return;
+      this.filterRef.current.focus();
+    }, 100);
+  }
+  renderDropdown() {
+    if (!this.state.show) return null;
+    let items = this.getFilteredOptions();
+    let $items = util/* default */.A.map(items, item => {
+      return (0,preact_module.h)("div", {
+        class: "dropdown_select__item",
+        onClick: _ => this.onSelect(item)
+      }, item.name);
+    });
+    let $filter = null;
+    if (this.hasSearch()) {
+      let $img = (0,preact_module.h)("img", {
+        class: "dropdown_select_filter__icon",
+        src: __webpack_require__(5452)
+      });
+      if (this.props.loading) {
+        $img = (0,preact_module.h)("img", {
+          class: "dropdown_select_filter__icon",
+          src: __webpack_require__(185)
+        });
+      }
+      $filter = (0,preact_module.h)("div", {
+        class: "dropdown_select_filter"
+      }, $img, (0,preact_module.h)("input", {
+        ref: this.filterRef,
+        value: this.state.searchValue,
+        onInput: this.onChangeSearchValue,
+        type: "text",
+        class: "dropdown_select_filter_input "
+      }));
+    }
+    if ($items.length == 0) $items = this.renderEmpty();
+    if (this.props.loading) $items = this.renderLoading();
+    let style = `width: ${this.props.width || '150px'} !important;`;
+    if (this.props.full) {
+      style = ` top: 20px !important; left: 20px !important; right: 20px !important; width: unset !important; `;
+      return (0,preact_module.h)("div", {
+        class: "dropdown_select__overlay",
+        ref: this.overlayRef,
+        onClick: this.hideDropdown,
+        onTouchMove: this.onTouchMove
+      }, (0,preact_module.h)("div", {
+        class: "dropdown_select",
+        style: style,
+        onClick: e => {
+          e.preventDefault();
+          e.stopPropagation();
+        }
+      }, $filter, (0,preact_module.h)("div", {
+        class: "dropdown_select__items"
+      }, $items)));
+    }
+    return (0,preact_module.h)("div", {
+      class: "dropdown_select",
+      style: style
+    }, $filter, (0,preact_module.h)("div", {
+      class: "dropdown_select__items"
+    }, $items));
+  }
+  render() {
+    let $name = (0,preact_module.h)("div", {
+      class: "muted text-truncate",
+      style: "flex: 1 !important;"
+    }, "Ch\u1ECDn m\u1ED9t ph\u1EA7n t\u1EED");
+    if (util/* default */.A.get(this.props, 'selected.name')) $name = (0,preact_module.h)("div", {
+      class: "text-truncate",
+      style: "flex: 1 !important;"
+    }, util/* default */.A.get(this.props, 'selected.name'));
+    let style = 'position: relative !important;';
+    if (this.props.full) {
+      style = '';
+    }
+    return (0,preact_module.h)("div", {
+      style: style
+    }, (0,preact_module.h)(common/* Clickaway */.tW, {
+      onClickaway: this.hideDropdown
+    }, (0,preact_module.h)("div", {
+      type: "text",
+      class: 'dropdown_select_input ' + this.props.extra_cls,
+      onClick: this.toogleDropdown
+    }, $name, "\xA0", (0,preact_module.h)("img", {
+      class: "dropdown_select__caret",
+      src: __webpack_require__(7741)
+    })), this.renderDropdown()));
+  }
+}
+;// ./src/order/address_picker.js
+function address_picker_defineProperty(e, r, t) { return (r = address_picker_toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function address_picker_toPropertyKey(t) { var i = address_picker_toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function address_picker_toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+
+
+
+
+class AddressPicker extends common/* Com */.Mw {
+  constructor(props) {
+    super(props);
+    address_picker_defineProperty(this, "state", {
+      show: false,
+      searchValue: '',
+      addresses: []
+    });
+    address_picker_defineProperty(this, "filterRef", (0,preact_module/* createRef */._3)());
+    address_picker_defineProperty(this, "overlayRef", (0,preact_module/* createRef */._3)());
+    address_picker_defineProperty(this, "onTouchMove", e => {
+      if (e.target === this.overlayRef.current) {
+        e.preventDefault();
+        e.stopPropagation();
+      }
+    });
+    address_picker_defineProperty(this, "hideDropdown", () => {
+      this.setState({
+        show: false,
+        searchValue: ''
+      });
+    });
+    address_picker_defineProperty(this, "onKeydown", e => {
+      if (e.key === 'Escape') {
+        if (!this.state.show) return;
+        if (this.state.searchValue) this.setState({
+          searchValue: ''
+        });else this.hideDropdown();
+        e.preventDefault();
+        e.stopPropagation();
+      }
+      if (e.key == 'Enter') {}
+    });
+    address_picker_defineProperty(this, "doSearch", util/* default */.A.throttle(async () => {
+      let requestId = Date.now();
+      this.requestId = requestId;
+      let res = await this.props.store.suggest_addresses(this.state.searchValue);
+      if (this.requestId !== requestId) return;
+      this.setState({
+        addresses: util/* default */.A.get(res, 'body.addresses', [])
+      });
+    }, 100));
+    address_picker_defineProperty(this, "onChangeSearchValue", e => {
+      this.setState({
+        searchValue: e.target.value
+      });
+      this.props.onChangeAddress(e.target.value);
+      this.doSearch();
+    });
+    address_picker_defineProperty(this, "toogleDropdown", async () => {
+      await this.setState({
+        show: true,
+        searchValue: this.props.initAddress || ''
+      });
+      this.focusFilter();
+    });
+    address_picker_defineProperty(this, "onSelect", item => {
+      this.props.onSelect(item);
+      this.hideDropdown();
+    });
+    address_picker_defineProperty(this, "onBackgroundScroll", e => {
+      console.log('EEEEEEE', e);
+    });
+    document.addEventListener('touchmove', function (e) {});
+  }
+  componentDidMount() {
+    window.addEventListener('keydown', this.onKeydown);
+  }
+  componentWillUnmount() {
+    window.removeEventListener('keydown', this.onKeydown);
+  }
+  renderEmpty() {
+    return (0,preact_module.h)("div", {
+      class: "dropdown_select_filter__empty"
+    }, (0,preact_module.h)("img", {
+      class: "dropdown_select_filter__empty_img",
+      src: __webpack_require__(3142)
+    }), (0,preact_module.h)("div", {
+      class: "muted",
+      style: "text-align: center !important;"
+    }, "Kh\xF4ng c\xF3 k\u1EBFt qu\u1EA3"));
+  }
+  renderLoading() {
+    return (0,preact_module.h)("div", {
+      class: "dropdown_select_filter__empty pt-3"
+    }, (0,preact_module.h)(spinner/* default */.A, {
+      size: "40",
+      static: true
+    }), (0,preact_module.h)("div", {
+      class: "muted mt-2",
+      style: "text-align: center !important;"
+    }, "\u0110ang t\u1EA3i d\u1EEF li\u1EC7u"));
+  }
+  focusFilter() {
+    if (!this.filterRef.current) return;
+    this.filterRef.current.focus();
+    util/* default */.A.setTimeout(() => {
+      if (!this.filterRef.current) return;
+      this.filterRef.current.focus();
+    }, 100);
+  }
+  renderDropdown() {
+    if (!this.state.show) return null;
+    let $items = util/* default */.A.map(this.state.addresses, (addr, i) => {
+      let label = [((addr.address || '') + ' ' + normalize(addr.street)).trim()].join(', ');
+      let desc = [normalize(addr.ward), normalize(addr.district), normalize(addr.province)].join(', ');
+      return (0,preact_module.h)("div", {
+        class: "dropdown_select__item",
+        onClick: _ => this.onSelect(addr),
+        key: i
+      }, (0,preact_module.h)("div", null, (0,preact_module.h)("b", null, label)), (0,preact_module.h)("div", {
+        style: "opacity: 0.7 !important;"
+      }, desc));
+    });
+    let $filter = null;
+    let $img = (0,preact_module.h)("img", {
+      class: "dropdown_select_filter__icon",
+      src: __webpack_require__(5452)
+    });
+    if (this.props.loading) {
+      $img = (0,preact_module.h)("img", {
+        class: "dropdown_select_filter__icon",
+        src: __webpack_require__(185)
+      });
+    }
+    $filter = (0,preact_module.h)("div", {
+      class: "dropdown_select_filter"
+    }, $img, (0,preact_module.h)("input", {
+      ref: this.filterRef,
+      value: this.state.searchValue,
+      onInput: this.onChangeSearchValue,
+      type: "text",
+      class: "dropdown_select_filter_input "
+    }));
+    if ($items.length == 0) $items = this.renderEmpty();
+    if (this.props.loading) $items = this.renderLoading();
+    let style = `width: ${this.props.width || '150px'} !important;`;
+    if (this.props.full) {
+      style = ` top: 20px !important; left: 20px !important; right: 20px !important; width: unset !important; `;
+      return (0,preact_module.h)("div", {
+        class: "dropdown_select__overlay",
+        ref: this.overlayRef,
+        onClick: this.hideDropdown,
+        onTouchMove: this.onTouchMove
+      }, (0,preact_module.h)("div", {
+        class: "dropdown_select",
+        style: style,
+        onClick: e => {
+          e.preventDefault();
+          e.stopPropagation();
+        }
+      }, $filter, (0,preact_module.h)("div", {
+        class: "dropdown_select__items"
+      }, $items)));
+    }
+    return (0,preact_module.h)("div", {
+      class: "dropdown_select",
+      style: style
+    }, $filter, (0,preact_module.h)("div", {
+      class: "dropdown_select__items"
+    }, $items));
+  }
+  render() {
+    let $name = (0,preact_module.h)("div", {
+      class: "text-truncate",
+      style: "flex: 1 !important;"
+    }, this.props.initAddress);
+    let style = 'position: relative !important;';
+    if (this.props.full) {
+      style = '';
+    }
+    return (0,preact_module.h)("div", {
+      style: style
+    }, (0,preact_module.h)(common/* Clickaway */.tW, {
+      onClickaway: this.hideDropdown
+    }, (0,preact_module.h)("div", {
+      type: "text",
+      class: 'dropdown_select_input ' + this.props.extra_cls,
+      onClick: this.toogleDropdown
+    }, $name), this.renderDropdown()));
+  }
+}
+function normalize(s) {
+  let ls = (s + '').toLowerCase();
+  if (ls.startsWith('tp ')) return s.substr(3);
+  if (ls.startsWith('thanh pho ')) return s.substr('thanh pho '.length);
+  if (ls.startsWith('thành phố ')) return s.substr('thành phố '.length);
+  if (ls.startsWith('tỉnh ')) return s.substr('tỉnh '.length);
+  if (ls.startsWith('huyện ')) return s.substr('huyện '.length);
+  if (ls.startsWith('tỉnh ')) return s.substr('tỉnh '.length);
+  if (ls.startsWith('xã ')) return s.substr('xã '.length);
+  if (ls.startsWith('thị trấn ')) return s.substr('thị trấn '.length);
+  if (ls.startsWith('thị xã ')) return s.substr('thị xã '.length);
+  if (ls.startsWith('đường ') && (s[7] < '0' || s[7] > '9')) return s.substr('đường '.length);
+  if (ls.startsWith('phường ') && (s[7] < '0' || s[7] > '9')) return s.substr('phường '.length);
+  if (ls.startsWith('quận ') && (s[7] < '0' || s[7] > '9')) return s.substr('quận '.length);
+  return s;
+}
+;// ./src/order/icon.js
+
+let promiseMainCSS = (() => Promise.resolve(/* import() */).then(__webpack_require__.bind(__webpack_require__, 9278)))();
+var $link = document.createElement('link');
+$link.href = 'https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap';
+$link.rel = 'stylesheet';
+document.head.append($link);
+util/* default */.A.preloadWebfonts(['Inter'], [400, 500]);
+
+let defaultAvatar = __webpack_require__(2538);
+
+
+
+class Icon extends common/* Com */.Mw {
+  render() {
+    if (this.props.name == 'package') {
+      if (this.props.active) return (0,preact_module.h)("img", {
+        style: "width: 18px !important;",
+        src: __webpack_require__(8512)
+      });
+      return (0,preact_module.h)("img", {
+        style: "width: 18px !important;",
+        src: __webpack_require__(6857)
+      });
+    }
+    if (this.props.name === 'shop') {
+      if (this.props.active) return (0,preact_module.h)("img", {
+        style: "width: 18px !important;",
+        src: __webpack_require__(5244)
+      });
+      return (0,preact_module.h)("img", {
+        style: "width: 18px !important;",
+        src: __webpack_require__(2523)
+      });
+    }
+  }
+}
+;// ./src/order/order.js
+function order_defineProperty(e, r, t) { return (r = order_toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function order_toPropertyKey(t) { var i = order_toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function order_toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+
+
+
+
+
+
+
+
+var checkedimg = __webpack_require__(5860);
+var ximg = __webpack_require__(3080);
+class order_Order extends common/* Com */.Mw {
+  constructor(props) {
+    super(props);
+    order_defineProperty(this, "state", {
+      loadProvince: true,
+      g_err: '',
+      fullname: '',
+      email: '',
+      phone: '',
+      loading: true,
+      order: {},
+      err: {},
+      shipping_address: 'new',
+      selectedProvince: null,
+      selectedDistrict: null,
+      selectedWard: null,
+      street: '',
+      address: '',
+      sending: false,
+      step: ''
+    });
+    order_defineProperty(this, "renderMobileSuccess", order => {
+      return (0,preact_module.h)("div", {
+        class: "order",
+        style: "height: 100% !important"
+      }, (0,preact_module.h)("div", {
+        style: "display: flex !important; align-items: center !important; padding-top: 40px !important; padding-bottom: 20px !important; flex-direction: column !important; height: 100% !important"
+      }, (0,preact_module.h)("img", {
+        style: "width: 60px !important; height: 60px !important;",
+        width: "60",
+        height: "60",
+        src: checkedimg
+      }), (0,preact_module.h)("div", {
+        style: "margin-top: 20px !important; margin-bottom: 10px !important"
+      }, (0,preact_module.h)("b", {
+        style: "font-size: 18px !important;"
+      }, "\u0110\u01A1n h\xE0ng c\u1EE7a b\u1EA1n \u0111\xE3 \u0111\u01B0\u1EE3c ghi nh\u1EADn")), (0,preact_module.h)("div", {
+        class: "muted"
+      }, "T\xF4i s\u1EBD li\xEAn h\u1EC7 l\u1EA1i v\u1EDBi b\u1EA1n khi \u0111\u01A1n h\xE0ng \u0111\u01B0\u1EE3c x\u1EED l\xFD"), (0,preact_module.h)("div", {
+        style: "flex:1 !important"
+      }), (0,preact_module.h)("div", {
+        style: "margin-top: 20px !important; padding: 0px 20px 0 20px !important; width: 100% !important"
+      }, (0,preact_module.h)("div", {
+        class: "order_btn order__btn__light",
+        onClick: this.close
+      }, this.props.t('close')))));
+    });
+    order_defineProperty(this, "onSelectProvince", async item => {
+      this.setState({
+        selectedProvince: item,
+        err: {},
+        g_err: ''
+      });
+      this.setState({
+        loadDistrict: true
+      });
+      let out = await this.props.store.list_districts({
+        id: item.id
+      });
+      this.setState({
+        loadDistrict: false
+      });
+      if (!out.error) this.setState({
+        districts: util/* default */.A.get(out, 'body.addresses')
+      });
+    });
+    order_defineProperty(this, "onSelectDistrict", async item => {
+      this.setState({
+        selectedDistrict: item,
+        err: {},
+        g_err: ''
+      });
+      this.setState({
+        loadWard: true
+      });
+      let out = await this.props.store.list_wards({
+        id: item.id
+      });
+      this.setState({
+        loadWard: false
+      });
+      if (!out.error) this.setState({
+        wards: util/* default */.A.get(out, 'body.addresses')
+      });
+    });
+    order_defineProperty(this, "onSelectWard", item => this.setState({
+      selectedWard: item,
+      err: {},
+      g_err: ''
+    }));
+    order_defineProperty(this, "onChangeFullname", e => this.setState({
+      fullname: e.target.value,
+      err: {},
+      g_err: ''
+    }));
+    order_defineProperty(this, "onChangeAddress", e => this.setState({
+      address: e,
+      err: {},
+      g_err: ''
+    }));
+    order_defineProperty(this, "onSelectAddress", addr => {
+      if (!addr) return;
+      this.setState({
+        address: [util/* default */.A.trim(addr.address), util/* default */.A.trim(addr.street)].join(' ').trim(),
+        street: addr.street,
+        err: {},
+        g_err: ''
+      });
+      this.onSelectWard({
+        id: addr.ward_id,
+        name: addr.ward
+      });
+      this.onSelectDistrict({
+        id: addr.district_id,
+        name: addr.district
+      });
+      this.onSelectProvince({
+        id: addr.province_id,
+        name: addr.province
+      });
+    });
+    order_defineProperty(this, "onChangeEmail", e => this.setState({
+      email: e.target.value,
+      err: {},
+      g_err: ''
+    }));
+    order_defineProperty(this, "onChangePhone", e => this.setState({
+      phone: e.target.value,
+      err: {},
+      g_err: ''
+    }));
+    order_defineProperty(this, "onChangePaymentMethod", id => this.setState({
+      pm: id
+    }));
+    order_defineProperty(this, "onChangeQuantity", (item, text) => {
+      let qty = parseInt(text) || 1;
+      item.quantity = qty;
+      this.forceUpdate();
+    });
+    order_defineProperty(this, "confirm", async () => {
+      this.setState({
+        g_err: ''
+      });
+      let err = {};
+      if (!this.state.shipping) {
+        this.setState({
+          g_err: 'Mời bạn chọn địa chỉ giao hàng trước khi xác nhận'
+        });
+      }
+      if (this.state.shipping === 'shop') {
+        if (!util/* default */.A.isPhone(this.state.phone)) {
+          err.phone = true;
+        }
+        if (!util/* default */.A.trim(this.state.fullname)) {
+          err.name = true;
+        }
+        if (!util/* default */.A.trim(this.state.email)) {
+          err.email = true;
+        }
+      } else if (this.state.shipping_address == 'new') {
+        if (!util/* default */.A.isPhone(this.state.phone)) {
+          err.phone = true;
+        }
+        if (!util/* default */.A.trim(this.state.fullname)) {
+          err.name = true;
+        }
+        if (!util/* default */.A.trim(this.state.address)) {
+          err.address = true;
+        }
+        if (util/* default */.A.size(this.state.selectedWard) == 0) {
+          err.ward = true;
+        }
+        if (util/* default */.A.size(this.state.selectedDistrict) == 0) {
+          err.district = true;
+        }
+        if (util/* default */.A.size(this.state.selectedProvince) == 0) {
+          err.province = true;
+        }
+      }
+      if (util/* default */.A.size(err) > 0) {
+        this.setState({
+          err,
+          g_err: this.props.t('input_shipping_info_err')
+        });
+        return;
+      }
+      let user = this.props.store.matchUser();
+      let ufullname = util/* default */.A.getUserAttr(user, 'fullname', 'text');
+      let uemail = util/* default */.A.getUserAttr(user, 'emails', 'text');
+      let uphone = util/* default */.A.getUserAttr(user, 'phones', 'text');
+      let order = util/* default */.A.cloneDeep(this.state.order);
+      if (this.state.shipping === 'shop') {
+        util/* default */.A.set(order, 'shipping.pickup_at_shop', true);
+        util/* default */.A.set(order, 'shipping.address.phone', this.state.phone);
+        util/* default */.A.set(order, 'shipping.address.fullname', this.state.fullname);
+        util/* default */.A.set(order, 'shipping.address.email', this.state.email);
+      } else {
+        if (this.state.shipping_address == 'new') {
+          let out = await this.props.store.createShippingAddress({
+            address: this.state.address,
+            country: 'Việt Nam',
+            fullname: this.state.fullname,
+            email: this.state.email,
+            phone: this.state.phone,
+            district: this.state.selectedDistrict.name,
+            district_id: this.state.selectedDistrict.id,
+            province: this.state.selectedProvince.name,
+            province_id: this.state.selectedProvince.id,
+            ward: this.state.selectedWard.name,
+            street: this.state.street,
+            ward_id: this.state.selectedWard.id
+          });
+          if (out.error) return this.setState({
+            g_err: this.props.t('update_failed')
+          });
+          util/* default */.A.set(order, 'shipping.address', out.body);
+        } else {
+          let addresses = this.props.store.matchShippingAddresses();
+          let sa = util/* default */.A.find(addresses, addr => addr.id === this.state.shipping_address);
+          if (!sa) {
+            return this.setState({
+              err,
+              g_err: this.props.t('input_shipping_info_err')
+            });
+          }
+          util/* default */.A.set(order, 'shipping.address', sa);
+        }
+      }
+      let changeduser = false;
+      if (!ufullname && this.state.fullname) {
+        changeduser = true;
+        util/* default */.A.setUserAttr(user, {
+          key: 'fullname',
+          text: this.state.fullname
+        });
+      }
+      if (!uemail && this.state.email) {
+        changeduser = true;
+        util/* default */.A.setUserAttr(user, {
+          key: 'emails',
+          text: this.state.email
+        });
+      }
+      if (!uphone && this.state.phone) {
+        changeduser = true;
+        util/* default */.A.setUserAttr(user, {
+          key: 'phones',
+          text: this.state.phone
+        });
+      }
+      if (changeduser) this.props.store.setUser(user);
+      this.setState({
+        sending: true
+      });
+      order.user_confirmation = 'confirmed';
+      let out = await this.props.store.updateOrder(order);
+      this.setState({
+        sending: false
+      });
+      if (out.error) {
+        return this.setState({
+          g_err: this.props.t('update_failed')
+        });
+      }
+      this.setState({
+        step: 'success'
+      });
+      if (this.props.onResponse) this.props.onResponse('confirmed');
+    });
+    order_defineProperty(this, "onCancel", () => {
+      if (this.props.onResponse) this.props.onResponse('rejected');
+      if (this.props.cid && !this.state.order.user_confirmation) {
+        let order = util/* default */.A.cloneDeep(this.state.order);
+        order.user_confirmation = 'rejected';
+        this.props.store.updateOrder(order);
+      }
+      this.close();
+    });
+    order_defineProperty(this, "close", () => {
+      if (this.props.onClose) this.props.onClose();
+    });
+    this.load();
+  }
+  async load() {
+    if (!this.props.order_id) return;
+    let orderout = await this.props.store.fetchOrder(this.props.order_id);
+    this.setState({
+      loading: false
+    });
+    if (!orderout.error) {
+      this.setState({
+        order: orderout.body
+      });
+    } else {
+      this.setState({
+        error: orderout.error
+      });
+    }
+    let user = this.props.store.matchUser();
+    let attributes = util/* default */.A.get(this.props.store.matchUser(), 'attributes', []);
+    let fullname = util/* default */.A.get(util/* default */.A.find(attributes, att => att.key === 'fullname'), 'text');
+    let email = util/* default */.A.get(util/* default */.A.find(attributes, att => att.key === 'emails'), 'text');
+    let phone = util/* default */.A.get(util/* default */.A.find(attributes, att => att.key === 'phones'), 'text');
+    this.setState({
+      fullname,
+      email,
+      phone
+    });
+    await this.props.store.fetchShippingAddresses();
+    let out = await this.props.store.list_provinces();
+    this.setState({
+      loadProvince: false
+    });
+    if (!out.error) this.setState({
+      provinces: util/* default */.A.get(out, 'body.addresses')
+    });
+  }
+  isMobile() {
+    if (this.props.cid) return true;
+    if (this.props.isMobile) return true;
+    return this.props.store.isMobile();
+  }
+  onChangeShippingAddress(id) {
+    this.setState({
+      shipping_address: id,
+      err: {},
+      g_err: ''
+    });
+  }
+  onChangeShipping(id) {
+    this.setState({
+      shipping: id,
+      err: {},
+      g_err: ''
+    });
+  }
+  renderDesktopPaymentMethod(order) {
+    return null;
+    // removed by dead control flow
+
+    // removed by dead control flow
+
+    // removed by dead control flow
+
+    // removed by dead control flow
+
+    // removed by dead control flow
+
+    // removed by dead control flow
+
+    // removed by dead control flow
+
+    // removed by dead control flow
+
+    // removed by dead control flow
+
+    // removed by dead control flow
+
+  }
+  renderDesktopShipping(order) {
+    let editmode = false;
+    if (!order.status || order.status == 'open') {
+      editmode = !order.user_confirmation;
+    }
+    let user = this.props.store.matchUser();
+    if (editmode) {
+      let addresses = this.props.store.matchShippingAddresses();
+      let provinces = util/* default */.A.map(this.state.provinces, province => ({
+        id: province.id,
+        name: province.province
+      }));
+      let districts = util/* default */.A.map(this.state.districts, district => ({
+        id: district.id,
+        name: district.district
+      }));
+      let wards = util/* default */.A.map(this.state.wards, ward => ({
+        id: ward.id,
+        name: ward.ward
+      }));
+      let cls = 'ship_card';
+      let $body = null;
+      let ship_icon_active = false;
+      if (this.state.shipping === 'ship') {
+        ship_icon_active = true;
+        let $preaddrs = util/* default */.A.map(addresses, addr => {
+          let fulladdr = [addr.street, addr.ward, addr.district, addr.region, addr.country].filter(a => a).join(', ');
+          let $phone = null;
+          if (addr.phone) {
+            $phone = (0,preact_module.h)(preact_module/* Fragment */.FK, null, "\xA0\xB7\xA0", this.props.t('phn'), " ", addr.phone);
+          }
+          return (0,preact_module.h)("div", {
+            style: "margin-bottom: 15px !important"
+          }, (0,preact_module.h)("div", {
+            class: "radio d-flex "
+          }, (0,preact_module.h)("input", {
+            type: "radio",
+            id: 'shipping_addr.' + addr.id,
+            onInput: e => this.onChangeShippingAddress(addr.id),
+            name: "shipping_address",
+            checked: this.state.shipping_address === addr.id
+          }), (0,preact_module.h)("label", {
+            class: "radio--label",
+            for: 'shipping_addr.' + addr.id,
+            style: `font-weight: ${this.state.shipping_address === addr.id ? 500 : 400} !important`
+          }, addr.fullname, $phone, (0,preact_module.h)("div", {
+            class: "mt-1 muted"
+          }, "DC ", fulladdr)), (0,preact_module.h)("div", {
+            class: "radio--check"
+          }, (0,preact_module.h)("div", {
+            class: "inside"
+          }))));
+        });
+        $preaddrs.push((0,preact_module.h)("div", {
+          style: ""
+        }, (0,preact_module.h)("div", {
+          class: "radio d-flex "
+        }, (0,preact_module.h)("input", {
+          type: "radio",
+          id: 'shipping_addr.new',
+          onInput: e => this.onChangeShippingAddress('new'),
+          name: "shipping_address",
+          checked: this.state.shipping_address === 'new'
+        }), (0,preact_module.h)("label", {
+          class: "radio--label",
+          for: 'shipping_addr.new'
+        }, this.state.shipping_address === 'new' ? (0,preact_module.h)("b", null, "T\u1EDBi \u0111\u1ECBa ch\u1EC9 kh\xE1c") : 'Tới địa chỉ khác'), (0,preact_module.h)("div", {
+          class: "radio--check"
+        }, (0,preact_module.h)("div", {
+          class: "inside"
+        })))));
+        let $new = (0,preact_module.h)("div", {
+          style: "padding-left: 22px !important;"
+        }, (0,preact_module.h)("div", {
+          class: "d-flex"
+        }, (0,preact_module.h)("div", {
+          class: "mr-2",
+          style: "flex: 1 !important;"
+        }, (0,preact_module.h)("div", {
+          class: "order_form_label"
+        }, this.props.t('fullname')), (0,preact_module.h)("input", {
+          type: "text",
+          class: 'form-control ' + (this.state.err.name && 'err'),
+          onInput: this.onChangeFullname,
+          value: this.state.fullname
+        })), (0,preact_module.h)("div", {
+          class: "ml-2",
+          style: "flex: 1 !important;"
+        }, (0,preact_module.h)("div", {
+          class: "order_form_label"
+        }, this.props.t('phones')), (0,preact_module.h)("input", {
+          type: "text",
+          class: 'form-control ' + (this.state.err.phone && 'err'),
+          onInput: this.onChangePhone,
+          value: this.state.phone
+        }))), (0,preact_module.h)("div", {
+          class: "",
+          style: "width: 100% !important"
+        }, (0,preact_module.h)("div", {
+          class: "order_form_label"
+        }, this.props.t('address')), (0,preact_module.h)(AddressPicker, {
+          initAddress: this.state.address,
+          store: this.props.store,
+          width: "100%",
+          onChangeAddress: this.onChangeAddress,
+          full: this.isMobile(),
+          onSelect: this.onSelectAddress,
+          extra_cls: this.state.err.address && 'err'
+        })), (0,preact_module.h)("div", {
+          class: "d-flex",
+          style: "justify-content: space-between !important;"
+        }, (0,preact_module.h)("div", {
+          style: "flex: 1 !important; overflow:hidden !important; margin-right: 7px !important;"
+        }, (0,preact_module.h)("div", {
+          class: "order_form_label"
+        }, this.props.t('province')), (0,preact_module.h)(DropdownSelect, {
+          width: "194",
+          full: this.isMobile(),
+          has_search: true,
+          loading: this.state.loadProvince,
+          items: provinces,
+          selected: this.state.selectedProvince,
+          onSelect: this.onSelectProvince,
+          extra_cls: this.state.err.province && 'err'
+        })), (0,preact_module.h)("div", {
+          style: "flex: 1 !important; overflow:hidden !important; margin-left: 7px !important;"
+        }, (0,preact_module.h)("div", {
+          class: "order_form_label"
+        }, this.props.t('district')), (0,preact_module.h)(DropdownSelect, {
+          width: "194",
+          full: this.isMobile(),
+          selected: this.state.selectedDistrict,
+          has_search: true,
+          onSelect: this.onSelectDistrict,
+          loading: this.state.loadDistrict,
+          extra_cls: this.state.err.district && 'err',
+          items: districts
+        }))), (0,preact_module.h)("div", {
+          class: "d-flex",
+          style: "justify-content: space-between !important;"
+        }, (0,preact_module.h)("div", {
+          style: "flex: 1 !important; overflow:hidden !important; margin-right: 7px !important;"
+        }, (0,preact_module.h)("div", {
+          class: "order_form_label"
+        }, this.props.t('ward')), (0,preact_module.h)(DropdownSelect, {
+          width: "194",
+          selected: this.state.selectedWard,
+          full: this.isMobile(),
+          has_search: true,
+          onSelect: this.onSelectWard,
+          extra_cls: this.state.err.ward && 'err',
+          loading: this.state.loadWard,
+          items: wards
+        })), (0,preact_module.h)("div", {
+          style: "flex: 1 !important; margin-left: 7px !important;"
+        })));
+        cls += ' ship_card__active';
+        if (util/* default */.A.size(addresses) == 0) {
+          $body = (0,preact_module.h)("div", null, (0,preact_module.h)("div", {
+            class: 'mt-3 mb-2 '
+          }, this.props.t('input_shipping_info')), $new);
+        } else {
+          if (this.state.shipping_address !== 'new') $new = null;
+          $body = (0,preact_module.h)("div", null, (0,preact_module.h)("div", {
+            class: "mt-3 mb-2",
+            style: "margin-bottom: 10px !important;"
+          }, "Vui l\xF2ng ch\u1ECDn \u0111\u1ECBa ch\u1EC9 giao h\xE0ng"), (0,preact_module.h)("div", {
+            class: "form"
+          }, $preaddrs), $new);
+        }
+      }
+      let shopcls = 'ship_card';
+      let shop_icon_active = false;
+      if (this.state.shipping === 'shop') {
+        shop_icon_active = true;
+        shopcls += ' ship_card__active';
+        $body = (0,preact_module.h)("div", null, (0,preact_module.h)("div", {
+          class: "d-flex"
+        }, (0,preact_module.h)("div", {
+          class: "mr-2",
+          style: "flex: 3 !important;"
+        }, (0,preact_module.h)("div", {
+          class: "order_form_label"
+        }, this.props.t('fullname')), (0,preact_module.h)("input", {
+          type: "text",
+          class: 'form-control ' + (this.state.err.name && 'err'),
+          onInput: this.onChangeFullname,
+          value: this.state.fullname
+        })), (0,preact_module.h)("div", {
+          class: "ml-2",
+          style: "flex: 2 !important;"
+        }, (0,preact_module.h)("div", {
+          class: "order_form_label"
+        }, this.props.t('phones')), (0,preact_module.h)("input", {
+          type: "text",
+          class: 'form-control ' + (this.state.err.phone && 'err'),
+          onInput: this.onChangePhone,
+          value: this.state.phone
+        }))), (0,preact_module.h)("div", null, (0,preact_module.h)("div", {
+          class: "order_form_label"
+        }, this.props.t('email')), (0,preact_module.h)("input", {
+          type: "text",
+          class: 'form-control ' + (this.state.err.email && 'err'),
+          onInput: this.onChangeEmail,
+          value: this.state.email
+        })));
+      }
+      let seccls = 'card_section';
+      if (this.isMobile()) seccls = 'order_section';
+      return (0,preact_module.h)(preact_module/* Fragment */.FK, null, (0,preact_module.h)("div", {
+        class: "order_section__line"
+      }), (0,preact_module.h)("div", {
+        class: seccls
+      }, (0,preact_module.h)("div", {
+        class: "order_label"
+      }, this.props.t('ship_to')), (0,preact_module.h)("div", {
+        class: "d-flex"
+      }, (0,preact_module.h)("div", {
+        class: shopcls + ' mr-3',
+        onClick: e => this.onChangeShipping('shop')
+      }, (0,preact_module.h)(Icon, {
+        name: "shop",
+        active: shop_icon_active
+      }), " ", (0,preact_module.h)("b", {
+        class: "ml-2"
+      }, "Nh\u1EADn h\xE0ng t\u1EA1i shop")), (0,preact_module.h)("div", {
+        class: cls,
+        onClick: e => this.onChangeShipping('ship')
+      }, (0,preact_module.h)(Icon, {
+        name: "package",
+        active: ship_icon_active
+      }), " ", (0,preact_module.h)("b", {
+        class: "ml-2"
+      }, "Giao h\xE0ng cho t\xF4i"))), $body));
+    }
+    let addr = util/* default */.A.get(order, 'shipping.address') || {};
+    let fulladdr = [addr.address, addr.ward, addr.district, addr.region, addr.country].filter(a => a).join(', ');
+    let $phone = null;
+    if (addr.phone) $phone = (0,preact_module.h)("div", {
+      class: "mt-1 muted"
+    }, this.props.t('phn'), ":\xA0", addr.phone);
+    if (util/* default */.A.get(order, 'shipping.pickup_at_shop')) {
+      fulladdr = 'Nhận hàng tại cửa hàng';
+    }
+    let $addr = fulladdr ? (0,preact_module.h)("div", null, fulladdr) : (0,preact_module.h)("i", {
+      class: "i muted"
+    }, "Ch\u01B0a c\xF3 \u0111\u1ECBa ch\u1EC9 giao h\xE0ng");
+    let seccls = 'card_section';
+    if (this.isMobile()) seccls = 'order_section';
+    return (0,preact_module.h)("div", {
+      class: seccls
+    }, (0,preact_module.h)("div", {
+      class: "order_label "
+    }, this.props.t('ship_to')), $addr, $phone);
+  }
+  renderDesktopSummary(order) {
+    let $deposit = null;
+    if (order.deposit > 0) {
+      $deposit = (0,preact_module.h)("span", {
+        class: "muted"
+      }, "(c\u1ECDc ", util/* default */.A.formatCurrency(order.deposit), ")");
+    }
+    let $discount = null;
+    if (order.total_discount > 0) {
+      $discount = (0,preact_module.h)("div", {
+        class: "order_summary_line"
+      }, (0,preact_module.h)("div", null, "Gi\u1EA3m gi\xE1"), (0,preact_module.h)("div", null, util/* default */.A.formatCurrency(order.total_discount)));
+    }
+    let $pay = null;
+    if ($deposit || order.payment_made) {
+      $pay = (0,preact_module.h)(preact_module/* Fragment */.FK, null, (0,preact_module.h)("div", {
+        class: "order_summary_line"
+      }, (0,preact_module.h)("div", null, "B\u1EA1n \u0111\xE3 tr\u1EA3"), (0,preact_module.h)("div", null, $deposit, " ", util/* default */.A.formatCurrency(order.payment_made))), (0,preact_module.h)("div", {
+        class: "order_summary_line"
+      }, (0,preact_module.h)("div", null, "B\u1EA1n ch\u01B0a tr\u1EA3"), (0,preact_module.h)("div", null, util/* default */.A.formatCurrency((order.total || 0) - (order.payment_made || 0)))));
+    }
+    let $tax = (0,preact_module.h)("div", {
+      class: "order_summary_line"
+    }, (0,preact_module.h)("div", null, "Ti\u1EC1n thu\u1EBF"), (0,preact_module.h)("div", null, util/* default */.A.formatCurrency(order.total_tax)));
+    let $ship = (0,preact_module.h)("div", {
+      class: "order_summary_line"
+    }, (0,preact_module.h)("div", null, "Ph\xED v\u1EADn chuy\u1EC3n"), (0,preact_module.h)("div", null, util/* default */.A.get(order, 'shipping.fee', 0), " d"));
+    let editmode = false;
+    if (!order.status || order.status == 'open') {
+      editmode = !order.user_confirmation;
+    }
+    let $note = null;
+    if (editmode) {
+      $ship = null;
+      $tax = null;
+      $note = (0,preact_module.h)("div", {
+        class: "muted"
+      }, (0,preact_module.h)("img", {
+        class: "order_ship_icon",
+        src: __webpack_require__(7324)
+      }), "\xA0 Ch\u01B0a bao g\u1ED3m thu\u1EBF v\xE0 ph\xED v\u1EADn chuy\u1EC3n");
+    }
+    let seccls = '';
+    if (this.isMobile()) seccls = 'order_section';
+    return (0,preact_module.h)(preact_module/* Fragment */.FK, null, (0,preact_module.h)("div", {
+      class: "order_section__line"
+    }), (0,preact_module.h)("div", {
+      class: seccls
+    }, (0,preact_module.h)("div", {
+      class: "order_label"
+    }, "T\xF3m t\u1EAFt"), (0,preact_module.h)("div", {
+      class: "order_summary_line"
+    }, (0,preact_module.h)("div", null, "T\u1ED5ng ti\u1EC1n h\xE0ng"), (0,preact_module.h)("div", null, util/* default */.A.formatCurrency(order.subtotal))), $tax, $discount, $ship, $note, (0,preact_module.h)("div", {
+      class: "order_summary_line",
+      style: "margin-top: 10px !important; padding-top: 15px !important; border-top: 1px solid #eee !important"
+    }, (0,preact_module.h)("div", null, "B\u1EA1n ph\u1EA3i tr\u1EA3"), (0,preact_module.h)("div", {
+      class: "order__total"
+    }, util/* default */.A.formatCurrency(order.total))), $pay));
+  }
+  renderStatusBadge(order) {
+    let status = order.status || 'open';
+    return (0,preact_module.h)("div", {
+      style: "float: right !important;",
+      class: 'order_status order_status__' + status
+    }, status);
+  }
+  renderShippingInfo(order) {
+    if (order.status != 'open' || order.user_confirmation) {}
+    let shipping_provider = util/* default */.A.get(order, 'shipping.shipping_provider');
+    if (!shipping_provider) return null;
+    let shipping_code = util/* default */.A.get(order, 'shipping.shipping_code');
+    let $tracking_code = null;
+    if (shipping_code) $tracking_code = (0,preact_module.h)("div", {
+      class: "muted",
+      style: "margin-top: 3px !important"
+    }, "V\u1EADn \u0111\u01A1n\xA0", (0,preact_module.h)("a", {
+      class: "order_tracking_link",
+      target: "_blank",
+      href: 'https://giaohangtietkiem.vn/tra-cuu-van-don/' + shipping_code
+    }, shipping_code, "\xA0", (0,preact_module.h)("img", {
+      class: "order_tracking_link_icon",
+      src: __webpack_require__(3266)
+    })));
+    if (shipping_provider == 'ghtk') {
+      return (0,preact_module.h)("div", {
+        class: "order_section"
+      }, (0,preact_module.h)("div", {
+        class: "order_section_label"
+      }, "\u0110\u01A1n v\u1ECB v\u1EADn chuy\u1EC3n"), (0,preact_module.h)("div", {
+        class: "d-flex align-items-center"
+      }, (0,preact_module.h)("img", {
+        class: "order_shipping_provider_logo",
+        src: ShippingProvider.ghtk.logo
+      }), (0,preact_module.h)("div", null, ShippingProvider.ghtk.name, $tracking_code)));
+    }
+    return null;
+  }
+  renderDesktopShippingInfo(order) {
+    let shipping_provider = util/* default */.A.get(order, 'shipping.shipping_provider');
+    if (!shipping_provider) return null;
+    let shipping_code = util/* default */.A.get(order, 'shipping.shipping_code');
+    let $tracking_code = null;
+    if (shipping_code) $tracking_code = (0,preact_module.h)("div", {
+      class: "muted",
+      style: "margin-top: 3px !important"
+    }, "V\u1EADn \u0111\u01A1n\xA0", (0,preact_module.h)("a", {
+      class: "order_tracking_link",
+      target: "_blank",
+      href: 'https://giaohangtietkiem.vn/tra-cuu-van-don/' + shipping_code
+    }, shipping_code, "\xA0", (0,preact_module.h)("img", {
+      class: "order_tracking_link_icon",
+      src: __webpack_require__(3266)
+    })));
+    if (shipping_provider == 'ghtk') {
+      return (0,preact_module.h)(preact_module/* Fragment */.FK, null, (0,preact_module.h)("div", {
+        class: "order_label"
+      }, "\u0110\u01A1n v\u1ECB v\u1EADn chuy\u1EC3n"), (0,preact_module.h)("div", {
+        class: "d-flex align-items-center"
+      }, (0,preact_module.h)("img", {
+        class: "order_shipping_provider_logo",
+        src: ShippingProvider.ghtk.logo
+      }), (0,preact_module.h)("div", null, ShippingProvider.ghtk.name, $tracking_code)));
+    }
+    return null;
+  }
+  renderProducts(order) {
+    let $products = null;
+    $products = util/* default */.A.map(order.items, item => {
+      if (!item || !item.product) return null;
+      let product = item.product;
+      return (0,preact_module.h)("div", {
+        class: "order_attachment__product"
+      }, (0,preact_module.h)("img", {
+        class: "order_attachment__product_img",
+        alt: '' + product.id,
+        src: util/* default */.A.get(product, 'images.0') || __webpack_require__(2876)
+      }), (0,preact_module.h)("div", {
+        style: "overflow: hidden !important;"
+      }, (0,preact_module.h)("div", {
+        class: "order_attachment__product_name"
+      }, product.name), (0,preact_module.h)("div", {
+        class: "order_attachment__product_desc"
+      }, product.description || product.long_description), (0,preact_module.h)("div", {
+        class: "order_attachment__product_desc"
+      }, this.props.t('qty'), " ", item.quantity, "\xA0\xB7\xA0", util/* default */.A.formatCurrency(product.price))));
+    });
+    if (!this.isMobile()) return (0,preact_module.h)("div", null, (0,preact_module.h)("div", {
+      class: "order_label"
+    }, this.props.t('product')), $products);
+    return (0,preact_module.h)("div", {
+      class: "order_section"
+    }, (0,preact_module.h)("div", {
+      class: "order_section_label"
+    }, this.props.t('product')), $products);
+  }
+  renderDesktopProducts(order) {
+    let $products = null;
+    let editmode = false;
+    if (!order.status || order.status == 'open') {
+      editmode = !order.user_confirmation;
+    }
+    if (editmode) {
+      $products = util/* default */.A.map(order.items, item => {
+        if (!item || !item.product) return null;
+        let product = item.product;
+        return (0,preact_module.h)("div", {
+          class: "order_attachment__product"
+        }, (0,preact_module.h)("img", {
+          class: "order_attachment__product_img",
+          alt: '' + product.id,
+          src: util/* default */.A.get(product, 'images.0') || __webpack_require__(2876)
+        }), (0,preact_module.h)("div", {
+          style: "overflow: hidden !important; flex: 1 !important"
+        }, (0,preact_module.h)("div", {
+          class: "order_attachment__product_name"
+        }, product.name), (0,preact_module.h)("div", {
+          class: "order_attachment__product_desc"
+        }, product.description || product.long_description), (0,preact_module.h)("div", {
+          class: "order_attachment__product_desc"
+        }, util/* default */.A.formatCurrency(product.price))), (0,preact_module.h)("input", {
+          class: "form-control",
+          style: "text-align: center !important; font-weight: 400 !important; width: 50px !important",
+          value: item.quantity,
+          onInput: e => this.onChangeQuantity(item, e.target.value),
+          type: "text"
+        }), (0,preact_module.h)("div", {
+          style: "width: 80px !important; text-align: right !important; "
+        }, (0,preact_module.h)("b", null, util/* default */.A.formatCurrency(item.quantity * product.price))));
+      });
+    } else {
+      $products = util/* default */.A.map(order.items, item => {
+        if (!item || !item.product) return null;
+        let product = item.product;
+        return (0,preact_module.h)("div", {
+          class: "order_attachment__product"
+        }, (0,preact_module.h)("img", {
+          class: "order_attachment__product_img",
+          alt: '' + product.id,
+          src: util/* default */.A.get(product, 'images.0') || __webpack_require__(2876)
+        }), (0,preact_module.h)("div", {
+          style: "overflow: hidden !important; flex: 1 !important"
+        }, (0,preact_module.h)("div", {
+          class: "order_attachment__product_name"
+        }, product.name), (0,preact_module.h)("div", {
+          class: "order_attachment__product_desc"
+        }, product.description || product.long_description), (0,preact_module.h)("div", {
+          class: "order_attachment__product_desc"
+        }, util/* default */.A.formatCurrency(product.price))), (0,preact_module.h)("div", {
+          style: "text-align: center !important; font-weight: 400 !important; width: 50px !important"
+        }, item.quantity), (0,preact_module.h)("div", {
+          style: "width: 80px !important; text-align: right !important; "
+        }, (0,preact_module.h)("b", null, util/* default */.A.formatCurrency(item.total))));
+      });
+    }
+    return (0,preact_module.h)("div", {
+      class: "card_section"
+    }, (0,preact_module.h)("div", {
+      class: "desktop_order__heading"
+    }, this.renderStatusBadge(order), (0,preact_module.h)("b", {
+      style: "font-size: 18px !important;"
+    }, this.props.t('order'), " #", order.order_number || order.id), (0,preact_module.h)("div", {
+      class: "muted"
+    }, (0,preact_module.h)(time/* default */.A, {
+      style: "font-size: 13px !important;",
+      time: order.issue_date || order.created
+    }))), (0,preact_module.h)("div", {
+      class: "order_label d-flex",
+      style: "margin-top: 20px !important;justify-content: space-between !important; align-items: flex-end !important;"
+    }, (0,preact_module.h)("div", {
+      style: "flex: 1 !important;"
+    }, this.props.t('product')), (0,preact_module.h)("div", {
+      style: "font-weight: 400 !important; text-align:center !important; width: 50px !important"
+    }, this.props.t('qty')), (0,preact_module.h)("div", {
+      style: "font-weight: 400 !important; text-align: right !important; width: 80px !important;"
+    }, this.props.t('total'))), $products);
+  }
+  renderMobile(order) {
+    if (this.state.step === 'success') return this.renderMobileSuccess(order);
+    let $error = null;
+    if (this.state.g_err) {
+      $error = (0,preact_module.h)("div", {
+        class: "mb-2 text__danger"
+      }, (0,preact_module.h)("img", {
+        style: "margin-top: -4px !important; height: 15px !important;",
+        src: ximg
+      }), "\xA0", (0,preact_module.h)("b", null, this.state.g_err));
+    }
+    let $status = (0,preact_module.h)("div", null, $error, (0,preact_module.h)("div", {
+      class: "btn-confirm-order",
+      style: "margin-top: 0 !important;",
+      onClick: this.confirm
+    }, this.props.t('confirm_order')));
+    let $close = (0,preact_module.h)("div", {
+      class: "order_btn order__btn__light mt-3",
+      onClick: this.onCancel
+    }, this.props.t('cancel_order'));
+    if (order.user_confirmation || order.status != 'open') {
+      $status = null;
+      if (this.props.cid) $close = (0,preact_module.h)("div", {
+        class: "order_btn order__btn__light mt-3",
+        onClick: this.close
+      }, this.props.t('close'));
+    }
+    return (0,preact_module.h)("div", {
+      class: "order",
+      style: "height: 100% !important"
+    }, (0,preact_module.h)("div", {
+      class: "order--content"
+    }, (0,preact_module.h)("div", {
+      class: "order--heading"
+    }, this.renderStatusBadge(order), (0,preact_module.h)("b", {
+      style: "font-size: 16px !important;"
+    }, this.props.t('order'), " #", order.order_number || order.id), (0,preact_module.h)("div", {
+      class: "muted"
+    }, (0,preact_module.h)(time/* default */.A, {
+      style: "font-size: 13px !important;",
+      time: order.issue_date || order.created
+    }))), this.renderProducts(order), this.renderDesktopShipping(order), this.renderShippingInfo(order), this.renderDesktopPaymentMethod(order), this.renderDesktopSummary(order), (0,preact_module.h)("div", {
+      class: "order_section pb-3",
+      style: "padding-top: 0 !important;"
+    }, $status, $close)));
+  }
+  renderActions(order) {
+    let $actions = null;
+    let editmode = false;
+    if (!order.status || order.status == 'open') {
+      editmode = !order.user_confirmation;
+    }
+    if (this.state.step === 'success') return (0,preact_module.h)("div", {
+      class: "d-flex",
+      style: "align-items: center !important; justify-content: flex-end !important"
+    }, (0,preact_module.h)("div", null, "Ghi nh\u1EADn th\xE0nh c\xF4ng"), "\xA0", (0,preact_module.h)("img", {
+      style: "width: 16px !important; height: 16px !important;",
+      width: "16",
+      height: "16",
+      src: checkedimg
+    }));
+    if (editmode) {
+      let $error = null;
+      if (this.state.g_err) {
+        $error = (0,preact_module.h)("div", {
+          class: "mb-2 text__danger"
+        }, (0,preact_module.h)("img", {
+          style: "margin-top: -4px !important; height: 15px !important;",
+          src: ximg
+        }), "\xA0", (0,preact_module.h)("b", null, this.state.g_err));
+      }
+      $actions = (0,preact_module.h)("div", null, $error, (0,preact_module.h)("div", {
+        class: "btn-confirm-order",
+        onClick: this.confirm
+      }, this.props.t('confirm_order')), (0,preact_module.h)("div", {
+        class: "btn-cancel-order",
+        onClick: this.onCancel
+      }, this.props.t('cancel_order')));
+    }
+    return $actions;
+  }
+  renderDesktop(order) {
+    let acc = this.props.store.matchAccount();
+    var uri = acc.logo_url || __webpack_require__(3582);
+    return (0,preact_module.h)("div", {
+      class: "desktop order"
+    }, (0,preact_module.h)("div", {
+      class: "order_acc_header"
+    }, (0,preact_module.h)("img", {
+      class: "order_acc_logo",
+      src: uri
+    }), (0,preact_module.h)("div", {
+      class: "order_acc_name"
+    }, acc.name)), (0,preact_module.h)("div", {
+      class: "desktop_order__content"
+    }, (0,preact_module.h)("div", {
+      style: "flex: 1 !important; padding-right: 20px !important;"
+    }, this.renderDesktopProducts(order), this.renderDesktopShipping(order), this.renderDesktopShippingInfo(order), this.renderDesktopPaymentMethod(order), (0,preact_module.h)("div", {
+      class: "order__footer"
+    }, (0,preact_module.h)("a", {
+      target: "_blank",
+      href: "https://subiz.com.vn",
+      class: "order__footer_link"
+    }, "Cung c\u1EA5p b\u1EDFi ", (0,preact_module.h)("b", null, "Subiz")), (0,preact_module.h)("div", {
+      class: "order__footer_delimiter"
+    }), (0,preact_module.h)("a", {
+      target: "_blank",
+      href: "https://subiz.com.vn/vi/terms-of-service.html",
+      class: "order__footer_link"
+    }, "\u0110i\u1EC1u kho\u1EA3n"), (0,preact_module.h)("a", {
+      target: "_blank",
+      href: "https://subiz.com.vn/vi/privacy-policy.html",
+      class: "order__footer_link"
+    }, "Quy\u1EC1n ri\xEAng t\u01B0"))), (0,preact_module.h)("div", null, (0,preact_module.h)("div", {
+      class: "order_recap"
+    }, this.renderDesktopSummary(order), this.renderActions(order)))));
+  }
+  render() {
+    if (this.state.loading) return (0,preact_module.h)("div", {
+      class: "order_error"
+    }, (0,preact_module.h)(spinner/* default */.A, {
+      class: "mt-4",
+      size: "60",
+      static: true
+    }));
+    if (this.state.error) return (0,preact_module.h)("div", {
+      class: "order_error"
+    }, (0,preact_module.h)("img", {
+      class: "mt-3",
+      src: __webpack_require__(6907)
+    }), (0,preact_module.h)("div", {
+      class: "mt-3"
+    }, this.props.t('order_load_error')));
+    let order = this.state.order;
+    if (this.isMobile()) return this.renderMobile(order);
+    return this.renderDesktop(order);
+  }
+}
+let ShippingProvider = {
+  ghtk: {
+    name: 'Giao hàng tiết kiệm',
+    logo: __webpack_require__(7362)
+  },
+  ghn: {
+    name: 'Giao hàng nhanh',
+    logo: __webpack_require__(1113)
+  }
+};
+;// ./src/chatbox/Order.js
+function Order_defineProperty(e, r, t) { return (r = Order_toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function Order_toPropertyKey(t) { var i = Order_toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function Order_toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+
+
+
+const POPUP_MAX_HEIGHT = 400;
+const POPUP_HARD_MAX_HEIGHT = 500;
+const POPUP_MIN_HEIGHT = 0;
+let Order_defaultAvatar = __webpack_require__(2538);
+
+
+
+class Order extends common/* Com */.Mw {
+  constructor(props) {
+    super(props);
+    Order_defineProperty(this, "state", {
+      hide: true,
+      ratingHeight: 0,
+      overlayOpacity: 0.3
+    });
+    Order_defineProperty(this, "onResponse", response => {
+      this.setState({
+        response
+      });
+    });
+    Order_defineProperty(this, "confirm", () => {
+      this.props.store.sendConvoEvent(this.props.cid, 'message_sent', {
+        message: {
+          format: 'plaintext',
+          text: 'confirm',
+          attachments: [{
+            type: 'postback',
+            postback: {
+              payload: JSON.stringify({
+                type: 'order_confirmation',
+                status: 'confirmed'
+              })
+            }
+          }]
+        }
+      });
+    });
+    Order_defineProperty(this, "close", async () => {
+      await util/* default */.A.sleep(100);
+      if (this.state.response === 'confirmed') {
+        this.props.store.sendConvoEvent(this.props.cid, 'message_sent', {
+          message: {
+            format: 'plaintext',
+            text: this.props.t('confirm_order'),
+            attachments: [{
+              type: 'postback',
+              postback: {
+                payload: JSON.stringify({
+                  type: 'order_confirmation',
+                  status: 'confirmed'
+                })
+              }
+            }]
+          }
+        });
+      } else if (this.state.response === 'rejected') {
+        this.props.store.sendConvoEvent(this.props.cid, 'message_sent', {
+          message: {
+            format: 'plaintext',
+            text: this.props.t('cancel_order'),
+            attachments: [{
+              type: 'postback',
+              postback: {
+                payload: JSON.stringify({
+                  type: 'order_confirmation',
+                  status: 'cancelled'
+                })
+              }
+            }]
+          }
+        });
+      } else {}
+      this.setState({
+        response: ''
+      });
+      if (this.state.hide) return;
+      if (!this.refRating.current) return;
+      var popupStyle = this.refRating.current.currentStyle || window.getComputedStyle(this.refRating.current);
+      var h0 = parseFloat(popupStyle.height);
+      this.animation.play(20, h0, h => {
+        this.setState({
+          ratingHeight: h,
+          overlayOpacity: Math.min(1, (h - POPUP_MIN_HEIGHT) / (POPUP_HARD_MAX_HEIGHT - POPUP_MIN_HEIGHT))
+        });
+        if (h < POPUP_MIN_HEIGHT + 10) {
+          if (!this.state.hide) {
+            this.setState({
+              hide: true
+            });
+          }
+        }
+      });
+      this.props.onClose();
+    });
+    this.refRating = (0,preact_module/* createRef */._3)();
+    this.refHandle = (0,preact_module/* createRef */._3)();
+  }
+  componentDidMount() {
+    this.mouseUp = e => this.onMouseUp(e);
+    this.mouseMove = e => this.onMouseMove(e);
+    this.mouseDown = e => this.onMouseDown(e);
+    var $ratingHandle = this.refHandle.current;
+    $ratingHandle.addEventListener('mousedown', this.mouseDown, {
+      passive: true
+    });
+    $ratingHandle.addEventListener('touchstart', this.mouseDown, {
+      passive: true
+    });
+    window.addEventListener('mouseup', this.mouseUp, {
+      passive: true
+    });
+    window.addEventListener('touchend', this.mouseUp, {
+      passive: true
+    });
+    window.addEventListener('mousemove', this.mouseMove, {
+      passive: true
+    });
+    window.addEventListener('touchmove', this.mouseMove, {
+      passive: true
+    });
+    this.animation = new releaseAnimation/* default */.A({
+      maxY: POPUP_MAX_HEIGHT,
+      minY: POPUP_MIN_HEIGHT,
+      duration: 150
+    });
+    this.close();
+  }
+  componentWillUnmount() {
+    var $ratingHandle = this.refHandle.current;
+    $ratingHandle.removeEventListener('mousedown', this.mouseDown, 0);
+    $ratingHandle.removeEventListener('touchstart', this.mouseDown, 0);
+    window.removeEventListener('mouseup', this.mouseUp, 0);
+    window.removeEventListener('touchend', this.mouseUp, 0);
+    window.removeEventListener('mousemove', this.mouseMove, 0);
+    window.removeEventListener('touchmove', this.mouseMove, 0);
+  }
+  render() {
+    if (this._show != this.props.show) {
+      this._show = this.props.show;
+      util/* default */.A.setTimeout(() => {
+        if (!this._show) this.close();else this.open();
+      });
+    }
+    let cls = this.state.hide ? 'd-none' : '';
+    return (0,preact_module.h)("div", {
+      class: cls
+    }, (0,preact_module.h)("div", {
+      class: "extension--overlay",
+      style: `opacity: ${this.state.overlayOpacity * 0.5} !important;`
+    }), (0,preact_module.h)("div", {
+      class: "extension",
+      ref: this.refRating,
+      style: `height: ${this.state.ratingHeight}px !important;`
+    }, (0,preact_module.h)("div", {
+      class: "extension--close-btn",
+      onClick: this.close
+    }, this.props.t('close')), (0,preact_module.h)("div", {
+      class: "extension--handle",
+      ref: this.refHandle
+    }, (0,preact_module.h)("div", {
+      class: "extension--thumb"
+    })), (0,preact_module.h)("div", {
+      style: "overflow-x: hidden !important; overflow-y: scroll !important; height: 100% !important;"
+    }, (0,preact_module.h)(order_Order, {
+      key: this.props.order_id,
+      store: this.props.store,
+      onResponse: this.onResponse,
+      onClose: this.close,
+      t: this.props.t,
+      order_id: this.props.order_id,
+      cid: this.props.cid
+    }))));
+  }
+  open() {
+    if (!this.state.hide) return;
+    if (!this.props.order_id) return;
+    this.setState({
+      hide: false
+    });
+    if (!this.refRating.current) return;
+    var popupStyle = this.refRating.current.currentStyle || window.getComputedStyle(this.refRating.current);
+    var h0 = parseFloat(popupStyle.height);
+    this.animation.play(-20, h0, h => {
+      this.setState({
+        ratingHeight: h,
+        overlayOpacity: Math.min(1, (h - POPUP_MIN_HEIGHT) / (POPUP_HARD_MAX_HEIGHT - POPUP_MIN_HEIGHT))
+      });
+    });
+  }
+  onMouseDown(e) {
+    this.mousePushed = true;
+    this.animation.stop();
+    e.preventDefault();
+    if (e.touches && e.touches[0]) e = e.touches[0];
+    this.mousePushedDy = e.pageY - window.pageYOffset - this.refRating.current.getBoundingClientRect().y;
+  }
+  onMouseUp(e) {
+    if (!this.mousePushed) return;
+    if (e.touches && e.touches[0]) e = e.touches[0];
+    this.mousePushed = false;
+    var popupStyle = this.refRating.current.currentStyle || window.getComputedStyle(this.refRating.current);
+    var h0 = parseFloat(popupStyle.height);
+    this.animation.play(this.mouseVelocity, h0, h => {
+      this.setState({
+        ratingHeight: h,
+        overlayOpacity: Math.min(1, (h - POPUP_MIN_HEIGHT) / (POPUP_HARD_MAX_HEIGHT - POPUP_MIN_HEIGHT))
+      });
+      if (h < POPUP_MIN_HEIGHT + 10) {
+        if (!this.state.hide) {
+          this.setState({
+            hide: true
+          });
+          this.props.onRate && this.props.onRate({
+            no_rating: true
+          });
+        }
+      }
+    });
+  }
+  onMouseMove(e) {
+    if (!this.mousePushed) return;
+    if (e.touches && e.touches[0]) e = e.touches[0];
+    var my = e.pageY;
+    this.mouseVelocity = my - this.lastMouseY;
+    this.lastMouseY = my;
+    my = my - this.mousePushedDy;
+    var K = 10000;
+    var height = this.refRating.current.getBoundingClientRect().bottom - my;
+    if (height > POPUP_MAX_HEIGHT) {
+      var beta = K / (POPUP_HARD_MAX_HEIGHT - POPUP_MAX_HEIGHT) - POPUP_MAX_HEIGHT;
+      height = POPUP_HARD_MAX_HEIGHT - K / (height + beta);
+    }
+    this.setState({
+      ratingHeight: height,
+      overlayOpacity: Math.min(1, (height - POPUP_MIN_HEIGHT) / (POPUP_HARD_MAX_HEIGHT - POPUP_MIN_HEIGHT))
+    });
+  }
+}
+
+/***/ },
+
+/***/ 5244
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/shop.f7dc7d8.svg";
+
+/***/ },
+
+/***/ 5452
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/search.f9705ff.svg";
+
+/***/ },
+
+/***/ 5860
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/done_green.b817fd4.svg";
+
+/***/ },
+
+/***/ 6857
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/package_fade.763c001.svg";
+
+/***/ },
+
+/***/ 6907
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/empty_1.0b98af0.svg";
+
+/***/ },
+
+/***/ 7324
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/info.ebce7ea.svg";
+
+/***/ },
+
+/***/ 7362
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/ghtk.326eac1.svg";
+
+/***/ },
+
+/***/ 7741
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/caret.998eb8f.svg";
+
+/***/ },
+
+/***/ 8512
+(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = __webpack_require__.p + "assets/img/package.8d37d0f.svg";
+
+/***/ }
+
+}]);