@subiz/widget-v4 4.1.142 → 4.1.143

package/dist/HASH

@@ -1 +1 @@
-1967c022bc1
+19680dc0775

package/dist/screenshoot.js

@@ -3793,8 +3793,8 @@ function jsonifyTextPlain(param, done) {
     _defineProperty(this, "list_provinces", () => this.apireq.get(`/accounts/${this.accid}/provinces`));
     _defineProperty(this, "list_districts", p => this.apireq.setQuery(p).get(`/accounts/${this.accid}/districts`));
     _defineProperty(this, "list_wards", p => this.apireq.setQuery(p).get(`/accounts/${this.accid}/wards`));
-    _defineProperty(this, "checkFormToken", token => this.api41.get(`/submissions/${token}`));
-    _defineProperty(this, "submitForm2", (token, data) => this.api41.post(`/submissions/${token}`, data));
+    _defineProperty(this, "checkFormToken", (accid, token) => this.api41.addQuery('account-id', accid).get(`/submissions/${token}`));
+    _defineProperty(this, "submitForm2", (accid, token, data) => this.api41.addQuery('account-id', accid).post(`/submissions/${token}`, data));
     _defineProperty(this, "suggest_address", keyword => this.apireq.setQuery({
       keyword: keyword
     }).get(`/accounts/${this.accid}/addresses`));
@@ -4849,8 +4849,8 @@ class Store {
     store_defineProperty(this, "matchIsOpen", () => !!this.kv.match('isopen'));
     store_defineProperty(this, "matchHasManuallyClosed", () => !!this.kv.match('hasManuallyClosed'));
     store_defineProperty(this, "matchClosePreviewAt", () => this.kv.match('close_preview_at') || 0);
-    store_defineProperty(this, "checkFormToken", token => this.api.checkFormToken(token));
-    store_defineProperty(this, "submitForm2", (token, data) => this.api.submitForm2(token, data));
+    store_defineProperty(this, "checkFormToken", (accid, token) => this.api.checkFormToken(accid, token));
+    store_defineProperty(this, "submitForm2", (accid, token, data) => this.api.submitForm2(accid, token, data));
     store_defineProperty(this, "sendPresence", util/* default */.A.throttle(async () => {
       if (this._die) return dieErr;
       await this.readyGate.entry();
@@ -7412,7 +7412,7 @@ class Form2 extends common/* Com */.Mw {
     });
     Form_defineProperty(this, "renderFormComponent", (com, idx) => {
       if (com.type === 'input') return this.renderField(com, idx);
-      if (com.type === 'submit_button') return this.renderSubmitButton(com, idx);
+      if (com.type === 'button') return this.renderSubmitButton(com, idx);
       if (this.props.isSubmited) return;
       return (0,preact_module.h)("div", {
         class: "form-component form-component-block"
@@ -7424,8 +7424,8 @@ class Form2 extends common/* Com */.Mw {
       if (this.props.isSubmited) return;
       return (0,preact_module.h)("div", {
         class: "form-component form-component-submit-button"
-      }, (0,preact_module.h)("div", {
-        class: "form-control--valid-input--error"
+      }, this.props.errorMessage && (0,preact_module.h)("div", {
+        class: "form-control--valid-input--error mb-1"
       }, this.props.errorMessage), (0,preact_module.h)("div", null, (0,preact_module.h)("button", {
         class: "btn--start-convo",
         disabled: this.props.submiting
@@ -7434,7 +7434,7 @@ class Form2 extends common/* Com */.Mw {
     Form_defineProperty(this, "renderField", (com, idx) => {
       let errorMsg = this.state.errorFields[com.key];
       if (this.props.isSubmited) {
-        let val = util/* default */.A.find(this.props.formValues, f => f.key === com.key) || {};
+        let val = util/* default */.A.find(this.props.submission.values, f => f.key === com.key) || {};
         val = val.value || '""';
         val = util/* default */.A.parseJSON(val);
         if (Array.isArray(val)) val = val.join(', ');
@@ -7461,7 +7461,7 @@ class Form2 extends common/* Com */.Mw {
     Form_defineProperty(this, "renderFieldTextInput", (com, idx) => {
       let cls = 'form-control';
       if (this.state.errorFields[com.key]) cls = 'form-control input--error';
-      let val = util/* default */.A.find(this.props.formValues, f => f.key === com.key) || {};
+      let val = util/* default */.A.find(this.props.submission.values, f => f.key === com.key) || {};
       val = val.value || '""';
       val = util/* default */.A.parseJSON(val);
       return (0,preact_module.h)("input", {
@@ -7477,12 +7477,14 @@ class Form2 extends common/* Com */.Mw {
       });
     });
     Form_defineProperty(this, "renderFieldDateInput", (com, idx) => {
-      let val = util/* default */.A.find(this.props.formValues, f => f.key === com.key) || {};
+      let val = util/* default */.A.find(this.props.submission.values, f => f.key === com.key) || {};
       val = val.value || '""';
       val = util/* default */.A.parseJSON(val);
+      let cls = 'form-control';
+      if (this.state.errorFields[com.key]) cls = 'form-control input--error';
       return (0,preact_module.h)("input", {
         ref: this[`${com.key}_input`],
-        class: "form-control",
+        class: cls,
         type: "date",
         value: val,
         onInput: e => {
@@ -7492,7 +7494,7 @@ class Form2 extends common/* Com */.Mw {
       });
     });
     Form_defineProperty(this, "renderFieldRadioInput", (com, idx) => {
-      let val = util/* default */.A.find(this.props.formValues, f => f.key === com.key) || {};
+      let val = util/* default */.A.find(this.props.submission.values, f => f.key === com.key) || {};
       val = val.value || '""';
       val = util/* default */.A.parseJSON(val);
       return util/* default */.A.map(com.input_options, (option, oidx) => {
@@ -7514,7 +7516,7 @@ class Form2 extends common/* Com */.Mw {
       });
     });
     Form_defineProperty(this, "renderFieldCheckboxInput", (com, idx) => {
-      let val = util/* default */.A.find(this.props.formValues, f => f.key === com.key) || {};
+      let val = util/* default */.A.find(this.props.submission.values, f => f.key === com.key) || {};
       val = val.value || '[]';
       val = util/* default */.A.parseJSON(val);
       return util/* default */.A.map(com.input_options, (option, oidx) => {
@@ -7536,7 +7538,7 @@ class Form2 extends common/* Com */.Mw {
       });
     });
     Form_defineProperty(this, "renderFieldDropdownInput", (com, idx) => {
-      let val = util/* default */.A.find(this.props.formValues, f => f.key === com.key) || {};
+      let val = util/* default */.A.find(this.props.submission.values, f => f.key === com.key) || {};
       val = val.value || '""';
       val = util/* default */.A.parseJSON(val);
       return (0,preact_module.h)("select", {
@@ -7553,7 +7555,7 @@ class Form2 extends common/* Com */.Mw {
       }));
     });
     Form_defineProperty(this, "renderFieldTextareaInput", (com, idx) => {
-      let val = util/* default */.A.find(this.props.formValues, f => f.key === com.key) || {};
+      let val = util/* default */.A.find(this.props.submission.values, f => f.key === com.key) || {};
       val = val.value || '""';
       val = util/* default */.A.parseJSON(val);
       return (0,preact_module.h)("textarea", {
@@ -7580,7 +7582,7 @@ class Form2 extends common/* Com */.Mw {
       util/* default */.A.each(components, com => {
         if (com.type === 'input') {
           if (com.is_required) {
-            let val = util/* default */.A.find(this.props.formValues, f => f.key === com.key) || {};
+            let val = util/* default */.A.find(this.props.submission.values, f => f.key === com.key) || {};
             val = val.value || '""';
             val = util/* default */.A.parseJSON(val);
             if (typeof val === 'string' && !val.trim()) {
@@ -7604,7 +7606,7 @@ class Form2 extends common/* Com */.Mw {
       return result;
     });
     Form_defineProperty(this, "onChangeValue", (key, v) => {
-      let formValues = this.props.formValues;
+      let formValues = util/* default */.A.get(this.props.submission, 'values') || [];
       let f = util/* default */.A.find(formValues, field => field.key === key);
       if (!f) {
         formValues.push({
@@ -7635,7 +7637,7 @@ class Form2 extends common/* Com */.Mw {
     this.onChangeValue(key, v);
   }
   toggleCheckboxField(key, v) {
-    let currentValues = util/* default */.A.find(this.props.formValues, f => f.key === key) || {};
+    let currentValues = util/* default */.A.find(this.props.submission.values, f => f.key === key) || {};
     currentValues = currentValues.value || '[]';
     currentValues = util/* default */.A.parseJSON(currentValues);
     if (currentValues.includes(v)) {
@@ -7648,6 +7650,7 @@ class Form2 extends common/* Com */.Mw {
   }
   render() {
     let components = util/* default */.A.get(this.props.formSetting, 'components') || [];
+    let title = util/* default */.A.get(this.props.formSetting, 'title') || '';
     let cls = 'form-wrapper form';
     if (this.props.mode === 'attachment') cls += ' form-wrapper-attachment';
     return (0,preact_module.h)("div", {
@@ -7656,7 +7659,9 @@ class Form2 extends common/* Com */.Mw {
       class: "form-component"
     }, this.props.t('you_have_submitted_info_successfully')), (0,preact_module.h)("form", {
       onSubmit: this.onSubmit
-    }, util/* default */.A.map(components, this.renderFormComponent)));
+    }, (0,preact_module.h)("div", {
+      class: "form-component form-component-block"
+    }, title), util/* default */.A.map(components, this.renderFormComponent)));
   }
 }
 ;// ./src/chatbox/FormAttachment2.js
@@ -7670,20 +7675,29 @@ function FormAttachment2_toPrimitive(t, r) { if ("object" != typeof t || !t) ret
 class FormAttachment extends common/* Com */.Mw {
   constructor(props) {
     super(props);
-    FormAttachment2_defineProperty(this, "state", {
-      formValues: [],
-      submiting: false,
-      isSubmited: false,
-      errorMessage: '',
-      step: 1
+    FormAttachment2_defineProperty(this, "fetchFormSetting", () => {
+      let attachments = util/* default */.A.get(this.props.ev, 'data.message.attachments') || [];
+      let formAttachment = util/* default */.A.find(attachments, att => att.type === 'form');
+      if (!formAttachment) return;
+      let url = formAttachment.url;
+      this.token = getUrlParameter(url, 'token');
+      let formSetting = formAttachment.form || {};
+      let submission = formAttachment.form_submission || {};
+      let isSubmited = util/* default */.A.size(submission) > 0;
+      this.setState({
+        formSetting,
+        submission,
+        isSubmited
+      });
     });
     FormAttachment2_defineProperty(this, "onChangeFormValues", values => {
       this.setState({
-        formValues: values
+        submission: {
+          values
+        }
       });
     });
     FormAttachment2_defineProperty(this, "onSubmit", async () => {
-      console.log('submittttttt', this.state.formValues);
       this.setState({
         errorMessage: ''
       });
@@ -7691,72 +7705,41 @@ class FormAttachment extends common/* Com */.Mw {
       this.setState({
         submiting: true
       });
-      await util/* default */.A.sleep(1_500);
+      let res = await this.props.store.submitForm2(this.props.store.matchAccount().id, this.token, this.state.submission);
+      if (res.error) {
+        this.setState({
+          submiting: false,
+          errorMessage: util/* default */.A.get(res, 'error.code')
+        });
+        return;
+      }
       this.setState({
         submiting: false,
         isSubmited: true
       });
     });
+    this.state = {
+      submission: {},
+      formSetting: {},
+      submiting: false,
+      errorMessage: '',
+      isSubmited: false
+    };
+  }
+  componentDidMount() {
+    this.fetchFormSetting();
   }
   render() {
-    if (this.props.ev.id !== 'evshpgaeetsplfqprzmynrvrl') return;
-    const formSetting = {
-      components: [{
-        type: 'text',
-        text: 'Đặt lịch khám'
-      }, {
-        type: 'input',
-        key: 'fullname',
-        default_value: '234',
-        link_attribute: 'email',
-        placeholder: 'Nguyen Van A',
-        label: 'Họ và tên',
-        input_type: 'text',
-        is_required: true
-      }, {
-        type: 'input',
-        key: 'phone',
-        validation: 'phone',
-        label: 'SĐT',
-        input_type: 'text',
-        is_required: true
-      }, {
-        type: 'input',
-        label: 'Chọn ca',
-        is_required: true,
-        input_type: 'radio',
-        key: 'shift',
-        input_options: [{
-          value: 'Buổi sáng',
-          label: 'Buổi sáng'
-        }, {
-          value: 'Buổi chiều',
-          label: 'Buổi chiều'
-        }]
-      }, {
-        type: 'input',
-        label: 'Chọn ca 2',
-        is_required: true,
-        input_type: 'checkbox',
-        key: 'shift_2',
-        input_options: [{
-          value: 'Buổi sáng',
-          label: 'Buổi sáng'
-        }, {
-          value: 'Buổi chiều',
-          label: 'Buổi chiều'
-        }]
-      }, {
-        type: 'input',
-        key: 'schedule',
-        label: 'Chọn ngày',
-        is_required: true,
-        input_type: 'date'
-      }, {
-        type: 'submit_button',
-        label: 'Submit'
-      }]
-    };
+    let attachments = util/* default */.A.get(this.props.ev, 'data.message.attachments') || [];
+    let formAttachment = util/* default */.A.find(attachments, att => att.type === 'form');
+    if (!formAttachment) return;
+    const {
+      submission,
+      formSetting,
+      errorMessage,
+      isSubmited,
+      submiting
+    } = this.state;
     return (0,preact_module.h)("div", {
       onClick: e => e.stopPropagation()
     }, (0,preact_module.h)(Form2, {
@@ -7764,15 +7747,21 @@ class FormAttachment extends common/* Com */.Mw {
       formSetting: formSetting,
       mode: "attachment",
       t: this.props.t,
-      formValues: this.state.formValues,
-      errorMessage: this.state.errorMessage,
-      isSubmited: this.state.isSubmited,
-      submiting: this.state.submiting,
+      submission: submission,
+      errorMessage: errorMessage,
+      isSubmited: isSubmited,
+      submiting: submiting,
       onChangeFormValues: this.onChangeFormValues,
       onSubmit: this.onSubmit
     }));
   }
 }
+function getUrlParameter(url, name) {
+  name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
+  var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
+  var results = regex.exec(url);
+  return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
+}
 ;// ./src/chatbox/FormSubmitAttachments.js
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@subiz/widget-v4",
-	"version": "4.1.142",
+	"version": "4.1.143",
 	"main": "./compiled_src/lib.js",
 	"scripts": {
 		"dev": "npx webpack serve --config webpack.dev.js",

package/src/chatbox/Widget.js

@@ -501,9 +501,9 @@ export default class Widget extends Com {
 					)
 				} else if (sb.get(field, 'def.select') === 'checkbox') {
 					$field = this.renderCheckboxField(field)
-				} else if (sb.get(field, 'def.select') === 'radio') {
+				} else if (sb.get(field, 'def.select') === 'radio' && sb.size(sb.get(field, 'def.items', [])) < 5) {
 					$field = this.renderRadioField(field)
-				} else if (sb.get(field, 'def.select') === 'dropdown') {
+				} else if (sb.get(field, 'def.select') === 'dropdown' || sb.size(sb.get(field, 'def.items', [])) >= 5) {
 					$field = this.renderDropdownField(field)
 				} else {
 					$field = (