{"version":3,"sources":["webpack:///./src/modules/question/preview-question-excercise-thieu/answers/fill-blank-select/fillBlankOrSelect.vue?a29b","webpack:///src/modules/question/preview-question-excercise-thieu/answers/fill-blank-select/fillBlankOrSelect.vue","webpack:///./src/modules/question/preview-question-excercise-thieu/answers/fill-blank-select/fillBlankOrSelect.vue?040f","webpack:///./src/modules/question/preview-question-excercise-thieu/answers/fill-blank-select/fillBlankOrSelect.vue","webpack:///./node_modules/v-runtime-template/dist/v-runtime-template.es.js","webpack:///./src/modules/question/preview-question-excercise-thieu/answers/fill-blank-select/fillBlankOrSelect.vue?fac0"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","class","parent","dataSource","code","answers","length","_v","_s","_e","attrs","contentStringFillType","staticRenderFns","name","mixins","props","nameField","location","isDontShowResultSaved","disabled","type","default","components","VRuntimeTemplate","DropdownCustom","data","types","contentFillType","fillSelectSplit","validate","optionSelect","answersParent","listArrayWidth","computed","mapState","mapGetters","validate_question","question","watch","mounted","beforeDestroy","resetContentQuestionFillSelect","methods","mapActions","displayHtmlCorrect","val","convertData","action","self","placeholderInput","typeQuestion","dataContent","BLANK_FILL_SELECT","BLANK_FILL_TXT","lengthSelectOptions","position_del","lengthFillSplit","setContentQuestionFillSelect","numSelectOrder","numFillNull","pos","txt","indexOptionCurr","indexAnswerChoosed","formData","answerIdChoosed","index","resizeData","e","replaceContent","content","BLANK_FILL_SELECT_SHORT","textNeedReplace","setOptionSelectByContentFill","isDataNull","converDataSelect","countChildAnswer","indexP","positionChar","arrChar","result","changeValSelect","ans","select_index","position_display","handleFocus","console","getElementById","info","getBoundingClientRect","top","left","offsetTopElm","ref","isOverHaflScreen","handleMouseSelection","evt","component","t","o","hasOwnProperty","r","Object","getOwnPropertyDescriptor","defineProperty","template","String","templateProps","$parent","$data","n","$props","a","$options","p","c","i","s","d","v","f","m","u","h","keys","forEach","O","$","b","j","y","concat","k","E","P","l","getOwnPropertyNames","provide","_provided"],"mappings":"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","file":"js/chunk-9b92eaf0.b797ff84.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"answer-val answer-fill-sentence position-rel\",class:(\"answer-\" + (_vm.parent.type))},[_c('label',{staticClass:\"display-flex\"},[(\n        _vm.dataSource.code && _vm.dataSource.code !== '' && _vm.parent.answers.length > 1\n      )?_c('b',[_vm._v(_vm._s(_vm.dataSource.code)+\"\\n    \")]):_vm._e(),_c('div',{staticClass:\"sentence-content\"},[_c('v-runtime-template',{attrs:{\"template\":_vm.contentStringFillType}})],1)])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <div\r\n    class=\"answer-val answer-fill-sentence position-rel\"\r\n    :class=\"`answer-${parent.type}`\"\r\n  >\r\n    <label class=\"display-flex\">\r\n      <b\r\n        v-if=\"\r\n          dataSource.code && dataSource.code !== '' && parent.answers.length > 1\r\n        \"\r\n        >{{ dataSource.code }}\r\n      </b>\r\n      <div class=\"sentence-content\">\r\n        <v-runtime-template\r\n          :template=\"contentStringFillType\"\r\n        ></v-runtime-template>\r\n      </div>\r\n    </label>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport mixinsQuestionPreview from \"./../../_store/mixinsQuestionPreview\";\r\nimport * as types from \"./../../_store/constants\";\r\nimport {\r\n  setContentQuestionFillSelect,\r\n  resetContentQuestionFillSelect,\r\n} from \"./../../_store/helpers\";\r\nimport {\r\n  BLANK_FILL_TXT,\r\n  BLANK_FILL_SELECT,\r\n  BLANK_FILL_SELECT_SHORT,\r\n} from \"@/store/common/constants\";\r\nimport { mapState, mapGetters, mapActions } from \"vuex\";\r\nimport VRuntimeTemplate from \"v-runtime-template\";\r\nimport { stripHtml } from \"@/helpers/functions\";\r\n\r\nexport default {\r\n  name: \"fillBlankOrSelect\",\r\n  mixins: [mixinsQuestionPreview],\r\n  props: {\r\n    dataSource: Object,\r\n    nameField: String,\r\n    location: Number,\r\n    parent: Object,\r\n    isDontShowResultSaved: Boolean,\r\n    disabled: {\r\n      type: Boolean,\r\n      default: false\r\n    }\r\n  },\r\n  components: {\r\n    VRuntimeTemplate,\r\n    // eslint-disable-next-line vue/no-unused-components\r\n    DropdownCustom: () => import(\"@/components/DropdownCustom.vue\"),\r\n  },\r\n  data() {\r\n    return {\r\n      types,\r\n      contentFillType: [],\r\n      contentStringFillType: \"\",\r\n      fillSelectSplit: [],\r\n      validate: [],\r\n      optionSelect: [],\r\n      answersParent: [],\r\n      listArrayWidth:[]\r\n    };\r\n  },\r\n  computed: {\r\n    ...mapState(types.STORE_KEY, [\"valVituralKeyboard\"]),\r\n    ...mapGetters({\r\n      validate_question: `${types.STORE_KEY}/validate_question`,\r\n      question: `${types.STORE_KEY}/question`,\r\n    }),\r\n  },\r\n  watch: {\r\n    validate_question() {\r\n      this.convertData(\"validate\");\r\n    },\r\n    question() {\r\n      this.convertData(\"edit_question\");\r\n    },\r\n    // '$route': 'resetContentFillBlank'\r\n  },\r\n  mounted() {\r\n    this.convertData();\r\n    for (let i = 0; i < this.optionSelect.length; i++) {\r\n      this.listArrayWidth.push('')\r\n      \r\n    }\r\n  },\r\n  beforeDestroy() {\r\n    // console.log('Befor destroy');\r\n    resetContentQuestionFillSelect();\r\n  },\r\n  methods: {\r\n    ...mapActions(types.STORE_KEY, [\r\n      \"setVituralKeyVal\",\r\n      \"acSetTxtInputSelected\",\r\n    ]),\r\n\r\n    displayHtmlCorrect(val) {\r\n      // return val ? val.replace('<p>', '').replace('</p>', '') : '';\r\n      return val ? stripHtml(val) : \"\";\r\n    },\r\n\r\n    // resetContentFillBlank() {\r\n    // \tconsole.log('Func reset');\r\n    // \tresetContentQuestionFillSelect();\r\n    // },\r\n\r\n    async convertData(action = null) {\r\n      let self = this;\r\n      // let placeholderInput = [2,3.4].includes(self.parent.layoutId) ? '?' : 'Điền đáp án';\r\n      let placeholderInput = \"?\";\r\n      // let questionIsDel = false;\r\n\r\n      self.contentStringFillType = \"\";\r\n      self.contentFillType = [];\r\n      self.optionSelect = [];\r\n\r\n      let typeQuestion = self.parent.type;\r\n      // Set data options select form\r\n      await self.converDataSelect();\r\n      if (action !== null && self.dataSource.validate) {\r\n        self.validate = self.dataSource.validate;\r\n      }\r\n\r\n      let dataContent = self.replaceContent(self.dataSource.content);\r\n\r\n      self.contentFillType =\r\n        (await typeQuestion) === types.TYPE_SELECT\r\n          ? dataContent.split(\"</p>\")\r\n          : [self.dataSource.content];\r\n\r\n      self.contentFillType.map((fill, index) => {\r\n        self.fillSelectSplit[index] = fill.split(\r\n          typeQuestion === types.TYPE_SELECT\r\n            ? BLANK_FILL_SELECT\r\n            : BLANK_FILL_TXT\r\n        );\r\n      });\r\n\r\n      let lengthSelectOptions = self.optionSelect.length;\r\n\r\n      // console.log('Before set content: ', self.fillSelectSplit, self.optionSelect);\r\n      // console.log('Before set content: ', lengthSelectOptions, self.optionSelect);\r\n\r\n      for (let i = 0; i < lengthSelectOptions; i++) {\r\n        if (!self.optionSelect[i]) {\r\n          // self.fillSelectSplit.splice(i, 0, [\"null\"]);\r\n          self.optionSelect[i] = [{ position_del: true }];\r\n          // questionIsDel = true;\r\n          if (typeQuestion === types.TYPE_SELECT) {\r\n            self.fillSelectSplit.splice(i, 0, [\"null\"]);\r\n          } else {\r\n            self.fillSelectSplit[0].splice(i, 0, \"null\");\r\n          }\r\n        }\r\n      }\r\n\r\n      // self.answersParent.length > 1 && self.setOptionSelectByContentFill()\r\n\r\n      // console.log('Done split: ', self.fillSelectSplit, self.optionSelect);\r\n      // console.log('Done split: ', self.fillSelectSplit);\r\n      let lengthFillSplit = self.fillSelectSplit.length;\r\n\r\n      // Save fillSelect tpl\r\n      // Add data null in fill seect\r\n      setContentQuestionFillSelect(self.fillSelectSplit);\r\n\r\n      // console.log('Fill select: ', self.fillSelectSplit)\r\n\r\n      let numFillNull = 0;\r\n      let numSelectOrder = 0;\r\n\r\n      self.fillSelectSplit.map((fill, index) => {\r\n        // console.log('AHA: ', numSelectOrder)\r\n        let fillLength = fill.length;\r\n\r\n        // console.log('Fill arr length: ', fillLength, fill, index)\r\n        if (index === 0) {\r\n          self.contentStringFillType += \"<div>\";\r\n        }\r\n\r\n        if (fill && fillLength > 0) {\r\n          // let lengthFillTxt = fill.length;\r\n          for (let indexFill in fill) {\r\n            let txt = fill[indexFill];\r\n            let pos = parseInt(indexFill);\r\n            // console.log('For of: ', pos, index + pos, index)\r\n            // console.log('AAAAAAAAAAAAAAA', indexFill, questionIsDel, self.optionSelect[index + pos])\r\n            // console.log('set txt pos: ', txt)\r\n            if (txt && txt !== \"null\") {\r\n              // console.log('Select post: ', index, pos)\r\n              if (\r\n                self.optionSelect[index + pos] &&\r\n                self.optionSelect[index + pos][0].isDataNull\r\n              ) {\r\n                numFillNull += 1;\r\n                // console.log('Plus num fill null', numFillNull)\r\n              }\r\n\r\n              if (\r\n                pos === 0 &&\r\n                txt.substring(0, 2) != \"<p\" &&\r\n                !dataContent.includes(\"<table\")\r\n              ) {\r\n                self.contentStringFillType += `<p`;\r\n              }\r\n              if (pos < fillLength - 1) {\r\n                let formData = ``;\r\n                // console.log('Select: ', index, pos)\r\n                // let indexForSetData = questionIsDel ? index + pos : pos;\r\n                if (typeQuestion === types.TYPE_SELECT) {\r\n                  // if (self.optionSelect[index + pos] && self.optionSelect[index + pos][0].isDataNull) {\r\n                  // \tconsole.log('Plus num fill null', numFillNull)\r\n                  // \tnumFillNull += 1\r\n                  // }\r\n                  // let indexAnswerChoosed = self.optionSelect[index + pos] ? self.optionSelect[index + pos].findIndex(op => op.nameChoose && op.valChoose) : -1;\r\n                  // const answerIdChoosed = Number(self.parent.answers[0].validateVal[index + pos])\r\n                  // const positionForm = index > 0 ? pos + 1 + index : pos\r\n                  // let positionForm = index > 0 ? pos + index : pos\r\n                  // if (index > 1 && numFillNull > 0) {\r\n                  // \tpositionForm += index\r\n                  // }\r\n                  const answerIdChoosed = Number(\r\n                    self.answersParent[self.location].validateVal[\r\n                      numSelectOrder\r\n                    ]\r\n                  );\r\n\r\n                  let indexOptionCurr = 0;\r\n                  let indexAnswerChoosed = -1;\r\n\r\n                  // self.optionSelect = self.optionSelect.filter(op => op[0] && !op[0].isDataNull)\r\n\r\n                  self.optionSelect.map((op, indexAns) => {\r\n                    // const positionAns = `${self.location}_${positionForm - numFillNull}`\r\n                    const positionAns = `${self.location}_${numSelectOrder}`;\r\n                    // console.log('Posi: ', positionAns, index, self.location, pos, positionForm, numFillNull)\r\n                    if (op[0].position && op[0].position === positionAns) {\r\n                      indexOptionCurr = indexAns;\r\n                      indexAnswerChoosed = op.findIndex(\r\n                        (opFind) => opFind.answerId === answerIdChoosed\r\n                      );\r\n                    }\r\n                  });\r\n                  // if (indexOptionCurr === 0) {\r\n                  // \tindexOptionCurr = positionForm - numFillNull\r\n                  // }\r\n                  // console.log('Options & index: ', self.optionSelect, self.location, positionForm, numFillNull, pos, index)\r\n\r\n                  // let indexAnswerChoosed = answerIdChoosed ? self.optionSelect[index + pos + numFillNull].findIndex(op => op.answerId === answerIdChoosed) : -1;\r\n                  // let indexAnswerChoosed = answerIdChoosed ? self.optionSelect[self.indexOptionCurr].findIndex(op => op.answerId === answerIdChoosed) : -1;\r\n\r\n                  // console.log('Index answer Choose: ', indexFill, index, self.location, index + pos, index + pos + numFillNull, numFillNull, self.optionSelect[index + pos])\r\n                  // console.log('aaaaaa: ', indexOptionCurr, indexAnswerChoosed)\r\n                  // console.log('AAAAAA: ', indexAnswerChoosed, self.parent.answers[0].validateVal, answerIdChoosed, self.optionSelect[index + pos + numFillNull]);\r\n                  // let nameChoosed = indexAnswerChoosed > -1 ? self.optionSelect[pos][indexAnswerChoosed]['nameChoose'] : '?';\r\n                  // let valChoosed = indexAnswerChoosed > -1 ? self.optionSelect[pos][indexAnswerChoosed]['valChoose'] : null;\r\n                  // console.log('Name choose: ', nameChoosed, self.optionSelect, index, pos)\r\n                  // const indexOption = self.optionSelect[index + pos][0].isDataNull ? (index + pos) + 1 : index + pos\r\n                  // Comment set old value 18-8-2021\r\n                  // :valoptionActive=\"${indexAnswerChoosed} > -1 ? optionSelect[${index + pos + numFillNull}][${indexAnswerChoosed}]['valChoose'] : null\"\r\n                  // :options=\"optionSelect[${index + pos + numFillNull}]\"\r\n                  // :position=\"${index + pos}\"\r\n                  formData = `\r\n\t\t\t\t\t\t\t\t\t\t\t<DropdownCustom \r\n\t\t\t\t\t\t\t\t\t\t\t\t:nameOptionDefault=\"${indexAnswerChoosed} > -1 ? optionSelect[${indexOptionCurr}][${indexAnswerChoosed}]['content'] : '?'\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t:valoptionActive=\"${indexAnswerChoosed} > -1 ? ${answerIdChoosed} : null\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t:options=\"optionSelect[${indexOptionCurr}]\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t:optionValueKey=\"'answerId'\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t:optionNameKey=\"'content'\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t:location=\"location\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t:type=\"parent.type\"\r\n                        :disabled=\"disabled\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t:position=\"${indexOptionCurr}\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t:class=\"{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t'error': !isDontShowResultSaved && dataSource.validate && dataSource.validate.length > 0 && (!dataSource.validate[${numSelectOrder}] || dataSource.validate[${numSelectOrder}] === 'false'),\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t'success': !isDontShowResultSaved && dataSource.validate && dataSource.validate.length > 0 && dataSource.validate[${numSelectOrder}] && dataSource.validate[${numSelectOrder}] !== 'false'\r\n\t\t\t\t\t\t\t\t\t\t\t\t}\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t@changeSelect=\"changeValSelect\"\r\n\t\t\t\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t\t\t\t`;\r\n                  if (fillLength > 1 && pos < fillLength - 1) {\r\n                    numSelectOrder += 1;\r\n                  }\r\n                } else {\r\n                  \r\n                  // Tự điều chỉnh độ rộng của input\r\n                  // ModifiedBy: anhdd (11/1/2023)\r\n                  formData = `<label class=\"form-control label-answer\" \r\n                  :class=\"{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'error': !isDontShowResultSaved && dataSource.validate && dataSource.validate.length > 0 && (!dataSource.validate[${\r\n                                index + pos\r\n                              }] || dataSource.validate[${\r\n                    index + pos\r\n                  }] === 'false'), \r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'success': !isDontShowResultSaved && dataSource.validate && dataSource.validate.length > 0 && dataSource.validate[${\r\n                                index + pos\r\n                              }] && dataSource.validate[${\r\n                    index + pos\r\n                  }] !== 'false',\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\"\r\n                             v-if=\"parent.isWorked !== null\">\r\n        {{ dataSource.validateVal && dataSource.validateVal.length > 0 && dataSource.validateVal[${\r\n          index + pos\r\n        }] ? displayHtmlCorrect(dataSource.validateVal[${index + pos}]) : '' }}\r\n      </label>\r\n\r\n                  <input v-else \r\n                        :style=\"{ 'width': listArrayWidth[${pos}] }\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"display-inline text-center input-hide-place hahahaokok\" \r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t:id=\"'fill_blank_' + location + ${index + pos} + dataSource.answerId\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t:value=\"dataSource.validateVal && dataSource.validateVal.length > 0 && dataSource.validateVal[${\r\n                              index + pos\r\n                            }] ? displayHtmlCorrect(dataSource.validateVal[${\r\n                    index + pos\r\n                  }]) : ''\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t@keyup=\"handleFocus($event, {answerId: dataSource.answerId, location, type: parent.type, questionId: dataSource.questionId, fill_index: ${\r\n                              index + pos\r\n                            }})\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t@focus=\"handleFocus($event, {answerId: dataSource.answerId, location, type: parent.type, questionId: dataSource.questionId, fill_index: ${\r\n                              index + pos\r\n                            }})\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t@change=\"changeAnswer($event, {answerId: dataSource.answerId, location, type: parent.type, questionId: dataSource.questionId, fill_index: ${\r\n                              index + pos\r\n                            }})\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t@blur=\"changeAnswer($event, {answerId: dataSource.answerId, location, type: parent.type, questionId: dataSource.questionId, fill_index: ${\r\n                              index + pos\r\n                            }})\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t@mouseup=\"handleMouseSelection($event)\"\r\n                            placeholder=\"${placeholderInput}\" \r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t:disabled=\"parent.isWorked !== null || disabled\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t:class=\"{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'error': !isDontShowResultSaved && dataSource.validate && dataSource.validate.length > 0 && (!dataSource.validate[${\r\n                                index + pos\r\n                              }] || dataSource.validate[${\r\n                    index + pos\r\n                  }] === 'false'), \r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'success': !isDontShowResultSaved && dataSource.validate && dataSource.validate.length > 0 && dataSource.validate[${\r\n                                index + pos\r\n                              }] && dataSource.validate[${\r\n                    index + pos\r\n                  }] !== 'false',\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\"\r\n                            autocomplete=\"off\"\r\n                            @input=\"resizeData($event,${\r\n                              pos\r\n                  })\"\r\n        size=\"1\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\r\n                          `;\r\n                }\r\n                // :disabled=\"parent.isTrue !== null\"\r\n\r\n                self.contentStringFillType += `${txt}${formData}`;\r\n              }\r\n              if (pos === fillLength - 1) {\r\n                self.contentStringFillType += `${txt}</p>`;\r\n              }\r\n            }\r\n          }\r\n        }\r\n        // console.log('Index fill: ', index)\r\n        if (index === lengthFillSplit - 1) {\r\n          // console.log('End tag', index, lengthFillSplit)\r\n          self.contentStringFillType += \"</div>\";\r\n        }\r\n      });\r\n    },\r\n    resizeData(e,pos){\r\n      \r\n      if(e.target.value.length<6){\r\n        e.target.style.width = \"75px\";\r\n        this.listArrayWidth[pos] = e.target.style.width\r\n        return\r\n      }\r\n      e.target.style.width = e.target.value.length+3 + \"ch\";\r\n      this.listArrayWidth[pos] = e.target.style.width\r\n      \r\n    },\r\n    replaceContent(content) {\r\n      let textNeedReplace = new RegExp(\r\n        this.parent.type === types.TYPE_SELECT\r\n          ? BLANK_FILL_SELECT_SHORT\r\n          : BLANK_FILL_TXT,\r\n        \"gi\"\r\n      );\r\n      return content.replace(\r\n        textNeedReplace,\r\n        `${\r\n          this.parent.type === types.TYPE_SELECT\r\n            ? BLANK_FILL_SELECT_SHORT\r\n            : BLANK_FILL_TXT\r\n        }&nbsp;`\r\n      );\r\n    },\r\n\r\n    setOptionSelectByContentFill() {\r\n      let self = this;\r\n      let lengthFill = self.fillSelectSplit.length;\r\n      self.fillSelectSplit.map((fill, index) => {\r\n        // if((!fill || ( fill.length === 1 && !fill[0])) && index < lengthFill - 1 && self.question.type !== types.TYPE_SELECT) {\r\n        // \tself.optionSelect.splice(index, 0, [{isDataNull: true}]);\r\n        // } else\r\n        if ((!fill || fill.length === 1) && index < lengthFill - 1) {\r\n          self.optionSelect.splice(index, 0, [{ isDataNull: true }]);\r\n        }\r\n      });\r\n    },\r\n\r\n    converDataSelect() {\r\n      let self = this;\r\n      self.parent.answers.map((ans) => {\r\n        if (ans.position) {\r\n          let positionItem = ans.position.split(\"_\");\r\n          if (parseInt(positionItem[0]) === parseInt(self.location)) {\r\n            if (self.optionSelect[positionItem[1]]) {\r\n              self.optionSelect[positionItem[1]].push(ans);\r\n            } else {\r\n              self.optionSelect[positionItem[1]] = [ans];\r\n            }\r\n          }\r\n        } else {\r\n          self.answersParent.push(ans);\r\n        }\r\n      });\r\n    },\r\n\r\n    countChildAnswer(indexP, positionChar, arrChar) {\r\n      let result = 0;\r\n      arrChar.map((da, index) => {\r\n        if (index < indexP) {\r\n          result += arrChar[index].length - 1 + positionChar;\r\n        }\r\n      });\r\n      return result;\r\n    },\r\n\r\n    changeValSelect(val) {\r\n      // console.log('Set val select: ', val)\r\n      this.parent.answers.map((ans) => {\r\n        if (ans.position && ans.position === `${val.location}_${val.index}`) {\r\n          if (ans.answerId === val.evt.target.value) {\r\n            ans[\"nameChoose\"] = val.nameChoose;\r\n            ans[\"valChoose\"] = val.valChoose;\r\n          } else {\r\n            ans.nameChoose && delete ans.nameChoose;\r\n            ans.valChoose && delete ans.valChoose;\r\n          }\r\n        }\r\n      });\r\n      this.changeAnswer(\r\n        { ...val.evt },\r\n        {\r\n          location: val.location,\r\n          type: val.type,\r\n          select_index: val.index,\r\n          position_display: val.position_display,\r\n        }\r\n      );\r\n    },\r\n\r\n    handleFocus(val, info = {}) {\r\n      console.log(val);\r\n      this.handleMouseSelection(val);\r\n      let halfWindowHeight = window.innerHeight / 2;\r\n      let offsetTopElm = document\r\n        .getElementById(\r\n          `fill_blank_${info.location}${info.fill_index}${info.answerId}`\r\n        )\r\n        .getBoundingClientRect().top;\r\n      let offsetLeftElm = document\r\n        .getElementById(\r\n          `fill_blank_${info.location}${info.fill_index}${info.answerId}`\r\n        )\r\n        .getBoundingClientRect().left;\r\n      // input position > 80% screen\r\n      let spaceHeightInput =\r\n        (offsetTopElm / window.innerHeight) * 100 > 80 ? 20 : 50; // 50 or 20 is height input\r\n      // Obj have ref key support render value onpress vitural keyboard\r\n      this.setVituralKeyVal({\r\n        ...info,\r\n        val: val.target.value,\r\n        ref: `fill_blank_${info.location}${info.fill_index}${info.answerId}`,\r\n        isOverHaflScreen: offsetTopElm > halfWindowHeight ? true : false,\r\n        top: offsetTopElm + spaceHeightInput,\r\n        left: offsetLeftElm / 2, // /2 is box center\r\n      });\r\n    },\r\n\r\n    handleMouseSelection(evt) {\r\n      let value = evt.target.value;\r\n      this.txtSelection = evt.target.value.slice(\r\n        evt.target.selectionStart,\r\n        evt.target.selectionEnd\r\n      );\r\n      if (this.txtSelection) {\r\n        let lengthTxt = value.length;\r\n        let firstTxt = value.slice(0, evt.target.selectionStart);\r\n        let lastTxt = value.slice(evt.target.selectionEnd, lengthTxt);\r\n        this.acSetTxtInputSelected([firstTxt, lastTxt]);\r\n      } else {\r\n        this.acSetTxtInputSelected([]);\r\n      }\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\">\r\n// @media (max-width: 1024px){\r\n// \t.answer-val{\r\n// \t\t.sentence-content{\r\n// \t\t}\r\n// \t}\r\n// }\r\n\r\n// Tự điều chỉnh độ rộng của combobox\r\n// ModifiedBy: anhdd (11/1/2023)\r\n.sentence-content p{\r\n  line-height: 40px;\r\n}\r\n.question--select .answer .dropdown-custom {\r\n  margin: 2px 5px !important;\r\n}\r\n.dropdown-custom__display {\r\n  height: auto !important;\r\n  padding: 0 27px 0 5px !important;\r\n  overflow: inherit !important;\r\n}\r\n.dropdown-custom__display i {\r\n  bottom: 0;\r\n}\r\n.dropdown-custom__options {\r\n  min-width: max-content !important;\r\n}\r\n\r\n// Tự điều chỉnh độ rộng của input\r\n// ModifiedBy: anhdd (11/1/2023)\r\n.input-sizer {\r\n  display: inline-grid !important;\r\n  vertical-align: top !important;\r\n  align-items: center !important;\r\n  background-color: #fff;\r\n  margin: 0 8px 3px;\r\n  &.stacked {\r\n    align-items: stretch !important;\r\n\r\n    &::after,\r\n    input,\r\n    textarea {\r\n      grid-area: 2 / 1;\r\n    }\r\n  }\r\n\r\n  &::after,\r\n  input,\r\n  textarea {\r\n    width: auto !important;\r\n    grid-area: 1 / 2;\r\n    resize: none !important;\r\n    background: none !important;\r\n    appearance: none !important;\r\n  }\r\n\r\n  &::after {\r\n    content: attr(data-value) \" \";\r\n    visibility: hidden !important;\r\n    white-space: pre-wrap !important;\r\n  }\r\n\r\n  &:focus-within {\r\n    textarea:focus,\r\n    input:focus {\r\n      outline: none !important;\r\n    }\r\n  }\r\n}\r\n\r\n.input-sizer input {\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n  min-width: 70px;\r\n}\r\n\r\n.label-answer {\r\n  background: #f3f6fb;\r\n  font-weight: 700;\r\n  color: #0f3dba;\r\n  display: inline;\r\n  margin: 0 4px;\r\n}\r\n.label-answer.error {\r\n  border: 1px solid #f46055 !important;\r\n}\r\n.label-answer.success {\r\n  border: 1px solid #5fcea1 !important;\r\n}\r\n</style>","import mod from \"-!../../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../../node_modules/babel-loader/lib/index.js!../../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./fillBlankOrSelect.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../../node_modules/babel-loader/lib/index.js!../../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./fillBlankOrSelect.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./fillBlankOrSelect.vue?vue&type=template&id=01f32649&\"\nimport script from \"./fillBlankOrSelect.vue?vue&type=script&lang=js&\"\nexport * from \"./fillBlankOrSelect.vue?vue&type=script&lang=js&\"\nimport style0 from \"./fillBlankOrSelect.vue?vue&type=style&index=0&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var t=function(t,o,e){if(!o.hasOwnProperty(e)){var r=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(o,e,r)}};export default{props:{template:String,parent:Object,templateProps:{type:Object,default:function(){return{}}}},render:function(o){if(this.template){var e=this.parent||this.$parent,r=e.$data;void 0===r&&(r={});var n=e.$props;void 0===n&&(n={});var a=e.$options;void 0===a&&(a={});var p=a.components;void 0===p&&(p={});var c=a.computed;void 0===c&&(c={});var i=a.methods;void 0===i&&(i={});var s=this.$data;void 0===s&&(s={});var d=this.$props;void 0===d&&(d={});var v=this.$options;void 0===v&&(v={});var f=v.methods;void 0===f&&(f={});var m=v.computed;void 0===m&&(m={});var u=v.components;void 0===u&&(u={});var h={$data:{},$props:{},$options:{},components:{},computed:{},methods:{}};Object.keys(r).forEach(function(t){void 0===s[t]&&(h.$data[t]=r[t])}),Object.keys(n).forEach(function(t){void 0===d[t]&&(h.$props[t]=n[t])}),Object.keys(i).forEach(function(t){void 0===f[t]&&(h.methods[t]=i[t])}),Object.keys(c).forEach(function(t){void 0===m[t]&&(h.computed[t]=c[t])}),Object.keys(p).forEach(function(t){void 0===u[t]&&(h.components[t]=p[t])});var O=Object.keys(h.methods||{}),$=Object.keys(h.$data||{}),b=Object.keys(h.$props||{}),j=Object.keys(this.templateProps),y=$.concat(b).concat(O).concat(j),k=(E=e,P={},O.forEach(function(o){return t(E,P,o)}),P),l=function(o){var e={};return o.forEach(function(o){o&&Object.getOwnPropertyNames(o).forEach(function(r){return t(o,e,r)})}),e}([h.$data,h.$props,k,this.templateProps]);return o({template:this.template||\"<div></div>\",props:y,computed:h.computed,components:h.components,provide:this.$parent._provided},{props:l})}var E,P}};\n//# sourceMappingURL=v-runtime-template.es.js.map\n","export * from \"-!../../../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./fillBlankOrSelect.vue?vue&type=style&index=0&lang=scss&\""],"sourceRoot":""}