{"version":3,"sources":["webpack:///./src/components/contextMenu/widgets/buttonActionDropdown.vue","webpack:///src/components/contextMenu/widgets/buttonActionDropdown.vue","webpack:///./src/components/contextMenu/widgets/buttonActionDropdown.vue?e7b0","webpack:///./src/components/contextMenu/widgets/buttonActionDropdown.vue?1715","webpack:///./src/components/contextMenu/widgets/imageWidgetPanel.vue?33b5","webpack:///./src/assets/img/select_arrow.svg","webpack:///./src/components/contextMenu/widgets/imageWidgetPanel.vue","webpack:///src/components/contextMenu/widgets/imageWidgetPanel.vue","webpack:///./src/components/contextMenu/widgets/imageWidgetPanel.vue?fc15","webpack:///./src/components/contextMenu/widgets/imageWidgetPanel.vue?0513","webpack:///./src/assets/img/file.svg","webpack:///./src/components/contextMenu/widgets/buttonActionDropdown.vue?934c"],"names":["render","_vm","this","_c","_self","staticClass","attrs","_v","_s","actionType","require","slot","_l","actionTypesList","t","idx","key","nativeOn","$event","onChangeBtnAction","directives","name","rawName","value","expression","url","domProps","on","target","composing","linkTarget","linkTargetsList","staticStyle","pageTarget","pagesLength","p","$store","dispatch","type","data","callback","updateAttachmentById","attachment","content","onError","_e","stopPropagation","allowedFileTypeMod","selectAllFileTypes","fileTypes","s","allowedFileType","Array","isArray","_i","$$a","$$el","$$c","checked","$$v","$$i","concat","slice","class","active","includes","sizeLimit","modifiers","_n","$forceUpdate","staticRenderFns","computed","mapGetters","myAttachments","survey","activeWidget","activeMyInteraction","configs","_this$activeMyInterac","_this$activeMyInterac2","img","length","get","set","setSurveyStepParam","fire","_this$allowedFileType","join","actionWidgetTypesList","created","attachmentId","methods","first","myAttachment","find","a","id","pageIdx","e","src","watch","component","module","exports","onChangeImage","previewImage","isSvg","onInputBorderDash","onChangeBorderDash","model","itemBorderDash","itemBorderWidth","onInputBorderWidth","onChangeBorderWidth","style","backgroundColor","borderColor","hex8","border","getColorBorder","onUpdateColor","components","buttonActionDropdown","ChromePicker","device","imageSrc","timeoutId","mounted","strokeWidth","strokeDashArray","stroke","hex","addWidget","top","left","angle","remove","setCoords","renderAll","width","strokeUniform","dash","color","clearTimeout","setTimeout"],"mappings":"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","file":"js/imageWidgetPanel.fa22c6e8.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"button-action-container\"},[_c('el-dropdown',{attrs:{\"placement\":\"bottom\",\"trigger\":\"click\"}},[_c('div',{staticClass:\"button-action-pickker\"},[_c('div',[_vm._v(_vm._s(_vm.actionType))]),_c('img',{attrs:{\"alt\":\"img\",\"src\":require(\"@/assets/img/select_arrow.svg\")}})]),_c('div',{staticClass:\"field-name\"},[_vm._v(\"action\")]),_c('el-dropdown-menu',{staticClass:\"dropdown-menu\",attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},_vm._l((_vm.actionTypesList),function(t,idx){return _c('el-dropdown-item',{key:idx,staticClass:\"dropdown-item\",nativeOn:{\"click\":function($event){return _vm.onChangeBtnAction(t)}}},[_vm._v(\" \"+_vm._s(t)+\" \")])}),1)],1),_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.actionType === 'external link'),expression:\"actionType === 'external link'\"}],staticClass:\"url-container\"},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.url),expression:\"url\"}],staticClass:\"url-field\",attrs:{\"placeholder\":\"http://\",\"type\":\"text\"},domProps:{\"value\":(_vm.url)},on:{\"input\":function($event){if($event.target.composing)return;_vm.url=$event.target.value}}}),_c('div',{staticClass:\"field-name\"},[_vm._v(\"link\")])]),_c('el-dropdown',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.actionType === 'external link'),expression:\"actionType === 'external link'\"}],attrs:{\"placement\":\"bottom\",\"trigger\":\"click\"}},[_c('div',{staticClass:\"button-action-pickker open-link\"},[_c('div',[_vm._v(_vm._s(_vm.linkTarget))]),_c('img',{attrs:{\"alt\":\"img\",\"src\":require(\"@/assets/img/select_arrow.svg\")}})]),_c('el-dropdown-menu',{staticClass:\"dropdown-menu\",attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},_vm._l((_vm.linkTargetsList),function(t,idx){return _c('el-dropdown-item',{key:idx,staticClass:\"dropdown-item\",nativeOn:{\"click\":function($event){_vm.linkTarget = t}}},[_vm._v(\" \"+_vm._s(t)+\" \")])}),1)],1),_c('el-dropdown',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.actionType === 'internal link'),expression:\"actionType === 'internal link'\"}],attrs:{\"placement\":\"bottom\",\"trigger\":\"click\"}},[_c('div',{staticClass:\"pages-container\"},[_c('div',{staticClass:\"button-action-pickker\",staticStyle:{\"margin-top\":\"0px\",\"width\":\"50px\"}},[_c('div',[_vm._v(_vm._s(_vm.pageTarget))]),_c('img',{attrs:{\"alt\":\"img\",\"src\":require(\"@/assets/img/select_arrow.svg\")}})]),_c('div',{staticClass:\"field-name\"},[_vm._v(\"page to navigate\")])]),_c('el-dropdown-menu',{staticClass:\"dropdown-menu\",attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},_vm._l((_vm.pagesLength),function(p){return _c('el-dropdown-item',{key:p,staticClass:\"dropdown-item\",nativeOn:{\"click\":function($event){_vm.pageTarget = p}}},[_vm._v(\" \"+_vm._s(p)+\" \")])}),1)],1),_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.actionType === 'download file'),expression:\"actionType === 'download file'\"}],staticClass:\"attachment-container\"},[_c('div',{staticClass:\"file-preview\",on:{\"click\":function($event){return _vm.$store.dispatch('workSpace/showPopup', {\n          type: 'changeAttachment',\n          data: { callback: _vm.updateAttachmentById }\n        })}}},[(_vm.attachment && _vm.attachment.content)?_c('img',{attrs:{\"alt\":\"img\",\"g\":\"\",\"src\":_vm.attachment.content},on:{\"error\":_vm.onError}}):_vm._e()]),(!_vm.attachment)?_c('div',{staticClass:\"field-name\"},[_vm._v(\"choose file\")]):_c('div',{staticClass:\"field-name\"},[_vm._v(\" \"+_vm._s(_vm.attachment.name)+\" \"),_c('div',{staticClass:\"remove-attachment\",on:{\"click\":function($event){$event.stopPropagation();return _vm.updateAttachmentById(null)}}},[_vm._v(\" × \")])])]),_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.actionType === 'upload file'),expression:\"actionType === 'upload file'\"}],staticClass:\"attachment-container\"},[_c('el-dropdown',{attrs:{\"placement\":\"bottom\",\"trigger\":\"click\"}},[_c('div',{staticClass:\"button-action-pickker\"},[_c('div',[_vm._v(_vm._s(_vm.allowedFileTypeMod))]),_c('img',{attrs:{\"alt\":\"img\",\"src\":require(\"@/assets/img/select_arrow.svg\")}})]),_c('div',{staticClass:\"field-name\"},[_vm._v(\"file type allow\")]),_c('el-dropdown-menu',{staticClass:\"dropdown-menu\",attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},[_c('div',{staticClass:\"dropdown-item select-all\",on:{\"click\":_vm.selectAllFileTypes}},[_vm._v(\" all file types \")]),_vm._l((_vm.fileTypes),function(s,idx){return _c('div',{key:idx,staticClass:\"dropdown-item format\"},[_c('label',{staticClass:\"checkbox-container\"},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.allowedFileType),expression:\"allowedFileType\"}],attrs:{\"type\":\"checkbox\",\"hidden\":\"\"},domProps:{\"value\":s,\"checked\":Array.isArray(_vm.allowedFileType)?_vm._i(_vm.allowedFileType,s)>-1:(_vm.allowedFileType)},on:{\"change\":function($event){var $$a=_vm.allowedFileType,$$el=$event.target,$$c=$$el.checked?(true):(false);if(Array.isArray($$a)){var $$v=s,$$i=_vm._i($$a,$$v);if($$el.checked){$$i<0&&(_vm.allowedFileType=$$a.concat([$$v]))}else{$$i>-1&&(_vm.allowedFileType=$$a.slice(0,$$i).concat($$a.slice($$i+1)))}}else{_vm.allowedFileType=$$c}}}}),_c('div',{staticClass:\"checkbox\",class:{ active: _vm.allowedFileType.includes(s) }}),_c('div',{staticClass:\"format\"},[_vm._v(_vm._s(s))])])])})],2)],1),_c('input',{directives:[{name:\"model\",rawName:\"v-model.number\",value:(_vm.sizeLimit),expression:\"sizeLimit\",modifiers:{\"number\":true}}],staticClass:\"size-field\",attrs:{\"placeholder\":\"1\",\"type\":\"number\"},domProps:{\"value\":(_vm.sizeLimit)},on:{\"input\":function($event){if($event.target.composing)return;_vm.sizeLimit=_vm._n($event.target.value)},\"blur\":function($event){return _vm.$forceUpdate()}}}),_c('div',{staticClass:\"field-name\"},[_vm._v(\"file max size(mb)\")])],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"button-action-container\">\n    <!-- action type -->\n    <el-dropdown placement=\"bottom\" trigger=\"click\">\n      <div class=\"button-action-pickker\">\n        <div>{{ actionType }}</div>\n        <img alt=\"img\" src=\"@/assets/img/select_arrow.svg\" />\n      </div>\n      <div class=\"field-name\">action</div>\n      <el-dropdown-menu slot=\"dropdown\" class=\"dropdown-menu\">\n        <el-dropdown-item\n          @click.native=\"onChangeBtnAction(t)\"\n          class=\"dropdown-item\"\n          v-for=\"(t, idx) of actionTypesList\"\n          :key=\"idx\"\n        >\n          {{ t }}\n        </el-dropdown-item>\n      </el-dropdown-menu>\n    </el-dropdown>\n    <!-- external -->\n    <div class=\"url-container\" v-show=\"actionType === 'external link'\">\n      <input\n        placeholder=\"http://\"\n        type=\"text\"\n        class=\"url-field\"\n        v-model=\"url\"\n      />\n      <div class=\"field-name\">link</div>\n    </div>\n    <el-dropdown\n      v-show=\"actionType === 'external link'\"\n      placement=\"bottom\"\n      trigger=\"click\"\n    >\n      <div class=\"button-action-pickker open-link\">\n        <div>{{ linkTarget }}</div>\n        <img alt=\"img\" src=\"@/assets/img/select_arrow.svg\" />\n      </div>\n      <el-dropdown-menu slot=\"dropdown\" class=\"dropdown-menu\">\n        <el-dropdown-item\n          @click.native=\"linkTarget = t\"\n          class=\"dropdown-item\"\n          v-for=\"(t, idx) of linkTargetsList\"\n          :key=\"idx\"\n        >\n          {{ t }}\n        </el-dropdown-item>\n      </el-dropdown-menu>\n    </el-dropdown>\n    <!-- internal -->\n    <el-dropdown\n      v-show=\"actionType === 'internal link'\"\n      placement=\"bottom\"\n      trigger=\"click\"\n    >\n      <div class=\"pages-container\">\n        <div\n          class=\"button-action-pickker\"\n          style=\"margin-top: 0px; width: 50px;\"\n        >\n          <div>{{ pageTarget }}</div>\n          <img alt=\"img\" src=\"@/assets/img/select_arrow.svg\" />\n        </div>\n        <div class=\"field-name\">page to navigate</div>\n      </div>\n      <el-dropdown-menu slot=\"dropdown\" class=\"dropdown-menu\">\n        <el-dropdown-item\n          @click.native=\"pageTarget = p\"\n          class=\"dropdown-item\"\n          v-for=\"p in pagesLength\"\n          :key=\"p\"\n        >\n          {{ p }}\n        </el-dropdown-item>\n      </el-dropdown-menu>\n    </el-dropdown>\n    <!-- download -->\n    <div class=\"attachment-container\" v-show=\"actionType === 'download file'\">\n      <div\n        class=\"file-preview\"\n        @click=\"\n          $store.dispatch('workSpace/showPopup', {\n            type: 'changeAttachment',\n            data: { callback: updateAttachmentById }\n          })\n        \"\n      >\n        <img\n          alt=\"img\"\n          g\n          v-if=\"attachment && attachment.content\"\n          :src=\"attachment.content\"\n          @error=\"onError\"\n        />\n      </div>\n      <div v-if=\"!attachment\" class=\"field-name\">choose file</div>\n      <div v-else class=\"field-name\">\n        {{ attachment.name }}\n        <div class=\"remove-attachment\" @click.stop=\"updateAttachmentById(null)\">\n          &times;\n        </div>\n      </div>\n    </div>\n    <!-- upload -->\n    <div class=\"attachment-container\" v-show=\"actionType === 'upload file'\">\n      <el-dropdown placement=\"bottom\" trigger=\"click\">\n        <div class=\"button-action-pickker\">\n          <div>{{ allowedFileTypeMod }}</div>\n          <img alt=\"img\" src=\"@/assets/img/select_arrow.svg\" />\n        </div>\n        <div class=\"field-name\">file type allow</div>\n        <el-dropdown-menu slot=\"dropdown\" class=\"dropdown-menu\">\n          <!-- @click=\"uploadAllowdFormatsList(s)\" -->\n          <div class=\"dropdown-item select-all\" @click=\"selectAllFileTypes\">\n            all file types\n          </div>\n          <div\n            class=\"dropdown-item format\"\n            v-for=\"(s, idx) of fileTypes\"\n            :key=\"idx\"\n          >\n            <label class=\"checkbox-container\">\n              <input\n                type=\"checkbox\"\n                :value=\"s\"\n                v-model=\"allowedFileType\"\n                hidden\n              />\n              <div\n                class=\"checkbox\"\n                :class=\"{ active: allowedFileType.includes(s) }\"\n              ></div>\n              <div class=\"format\">{{ s }}</div>\n            </label>\n          </div>\n        </el-dropdown-menu>\n      </el-dropdown>\n      <input\n        placeholder=\"1\"\n        type=\"number\"\n        class=\"size-field\"\n        v-model.number=\"sizeLimit\"\n      />\n      <div class=\"field-name\">file max size(mb)</div>\n    </div>\n    <!-- social sharing -->\n    <!-- <el-dropdown\n      v-show=\"actionType === 'social sharing'\"\n      placement=\"bottom\"\n      trigger=\"click\"\n    >\n      <div class=\"button-action-pickker\">\n        <div>{{ socialNetwork }}</div>\n        <img alt=\"img\" src=\"@/assets/img/select_arrow.svg\" />\n      </div>\n      <div class=\"field-name\">type</div>\n      <el-dropdown-menu slot=\"dropdown\" class=\"dropdown-menu\">\n        <el-dropdown-item\n          @click.native=\"socialNetwork = s\"\n          class=\"dropdown-item\"\n          v-for=\"(s, idx) of socialNetworksList\"\n          :key=\"idx\"\n        >\n          {{ s }}\n        </el-dropdown-item>\n      </el-dropdown-menu>\n    </el-dropdown> -->\n  </div>\n</template>\n\n<script>\nimport { setSurveyStepParam } from \"@/util/survey/markSurveyObject\";\nimport { mapGetters } from \"vuex\";\nimport fileTypes from \"@/store/mocks/uploadAllowedFormats\";\n\nexport default {\n  name: \"PILButtonActionDropdown\",\n  computed: {\n    ...mapGetters({\n      myAttachments: \"customContent/myAttachments\",\n      survey: \"workSpace/survey\",\n      activeWidget: \"workSpace/activeWidget\",\n      activeMyInteraction: \"workSpace/activeMyInteraction\"\n    }),\n    configs() {\n      return this.activeWidget.configs;\n    },\n    pagesLength() {\n      return this.activeMyInteraction?.img?.length ?? 1;\n    },\n    actionType() {\n      return this.activeWidget.configs.actionType;\n    },\n    linkTarget: {\n      get() {\n        return this.configs.linkTarget;\n      },\n      set(linkTarget) {\n        this.configs.linkTarget = linkTarget;\n        setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n        this.survey.fire(\"canvas:changes\");\n      }\n    },\n    pageTarget: {\n      get() {\n        return this.configs.pageTarget;\n      },\n      set(pageTarget) {\n        this.configs.pageTarget = pageTarget;\n        setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n        this.survey.fire(\"canvas:changes\");\n      }\n    },\n    url: {\n      get() {\n        return this.configs.url || \"\";\n      },\n      set(url) {\n        this.configs.url = url;\n        setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n        this.survey.fire(\"canvas:changes\");\n      }\n    },\n    // socialNetwork: {\n    //   get() {\n    //     return this.configs.socialNetwork || \"\";\n    //   },\n    //   set(socialNetwork) {\n    //     this.configs.socialNetwork = socialNetwork;\n    //     setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n    //   },\n    // },\n    allowedFileType: {\n      get() {\n        return this.configs.allowedFileType || [];\n      },\n      set(allowedFileType) {\n        if (!allowedFileType.length) {\n          return;\n        }\n        this.survey.fire(\"canvas:changes\");\n        this.configs.allowedFileType = allowedFileType;\n        setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n      }\n    },\n    allowedFileTypeMod() {\n      if (!this.allowedFileType?.length) return \"...\";\n      else if (this.allowedFileType.length < fileTypes.length) {\n        return this.allowedFileType.join(\", \");\n      } else return \"all file types\";\n    },\n    sizeLimit: {\n      get() {\n        return this.configs.sizeLimit || \"\";\n      },\n      set(sizeLimit) {\n        this.configs.sizeLimit = sizeLimit;\n        setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n        this.survey.fire(\"canvas:changes\");\n      }\n    }\n  },\n  data() {\n    return {\n      actionTypesList: [\n        \"no action\",\n        \"internal link\",\n        \"external link\",\n        \"download file\",\n        \"upload file\"\n        // \"social sharing\",\n        // \"submit\",\n      ],\n      attachment: null,\n      linkTargetsList: [\"open in existing tab\", \"open in a new tab\"],\n      actionWidgetTypesList: [\"button\", \"icon\"],\n      fileTypes\n      // socialNetworksList: [\n      //   \"none\",\n      //   \"Facebook\",\n      //   \"Email\",\n      //   \"LinkedIn\",\n      //   \"Messenger\",\n      //   \"WhatsApp\",\n      //   \"Pinterest\",\n      //   \"Skype\",\n      //   \"SMS\",\n      //   \"Telegram\",\n      //   \"Twitter\",\n      //   \"Viber\",\n      //   \"VK\",\n      //   \"Reddit\",\n      //   \"Odnoklassniki\",\n      //   \"InstaPaper\",\n      //   \"FlipBoard\",\n      // ],\n    };\n  },\n  created() {\n    this.updateAttachmentById(this.configs.attachmentId, true);\n  },\n  methods: {\n    selectAllFileTypes() {\n      this.allowedFileType = [...fileTypes];\n    },\n    async updateAttachmentById(attachmentId, first = false) {\n      if (attachmentId) {\n        const myAttachment = this.myAttachments.find(\n          a => a.id === attachmentId\n        );\n        if (!myAttachment) this.configs.attachmentId = this.attachment = null;\n        else {\n          this.configs.attachmentId = attachmentId;\n          this.attachment = myAttachment;\n        }\n      } else this.configs.attachmentId = this.attachment = null;\n      setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n      if (!first) this.survey.fire(\"canvas:changes\");\n    },\n    onChangeBtnAction(type) {\n      if (this.configs.actionType === type) return;\n      this.configs.actionType = type;\n      if (type !== \"external link\") {\n        this.url = this.linkTarget = this.configs.url = \"\";\n      } else {\n        this.linkTarget = \"open in existing tab\";\n      }\n      if (type !== \"internal link\") {\n        this.pageIdx = 1;\n      }\n      if (type !== \"download file\") {\n        this.updateAttachmentById(false);\n      }\n      if (type !== \"upload file\") {\n        this.allowedFileType = [...fileTypes];\n        this.sizeLimit = 1;\n      }\n      // if (type !== \"social sharing\") {\n      //   this.socialNetwork = \"none\";\n      // }\n      setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n      this.survey.fire(\"canvas:changes\");\n    },\n    onError(e) {\n      e.target.src = require(\"@/assets/img/file.svg\");\n    }\n  },\n  watch: {\n    activeWidget() {\n      this.updateAttachmentById(this.configs.attachmentId, true);\n    }\n  }\n};\n</script>\n\n<style scoped>\n.button-action-container {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex-direction: column;\n}\n\n.checkbox {\n  width: 18px;\n  height: 18px;\n  background: #f8f8f5;\n  border-radius: 4px;\n  margin-right: 5px;\n}\n.checkbox.active {\n  background: #ffe000;\n}\n.url-container input {\n  background: #f8f8f5;\n  border: none;\n  line-height: 25px;\n  height: 25px;\n  width: 200px;\n  text-align: center;\n}\n.url-container input {\n  text-align: center;\n}\n.button-action-pickker {\n  background: #f8f8f5;\n  border: none;\n  font-size: 12px;\n  line-height: 25px;\n  height: 25px;\n  width: 200px;\n  padding: 0 5px;\n  box-sizing: border-box;\n  justify-content: space-between;\n  display: flex;\n  align-items: center;\n  border-radius: 5px;\n  text-align: center;\n}\n.checkbox-container {\n  padding: 7px 0px;\n  display: flex;\n  justify-content: start;\n  align-items: center;\n}\n.el-dropdown-menu {\n  margin: 0;\n}\n.file-preview {\n  box-sizing: border-box;\n  padding: 8px;\n  background: #f8f8f5;\n  width: 100px;\n  height: 100px;\n  border-radius: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n.file-preview img {\n  max-width: 100%;\n  object-fit: contain;\n  max-height: 100%;\n}\n.dropdown-item.select-all {\n  cursor: pointer;\n  padding: 5px;\n  text-align: center;\n}\n.button-action-pickker div {\n  width: 100%;\n  max-width: calc(100% - 10px);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.button-action-pickker img {\n  height: 5px;\n}\n.dropdown-menu {\n  padding: 5px 0;\n  border-radius: 9px;\n  box-shadow: 0 3px 6px rgb(0 0 0 / 16%);\n  max-height: 100vh;\n  overflow: auto;\n}\n.open-link {\n  margin-bottom: 28px;\n}\n.dropdown-item {\n  padding: 0 15px;\n  box-sizing: border-box;\n  font-size: 12px;\n  color: #000;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  width: 280px;\n  white-space: nowrap;\n}\n.dropdown-item:hover {\n  background: #f8f8f5;\n  color: #000;\n}\n.pages-container {\n  display: grid;\n  justify-items: center;\n  width: 70px;\n}\n.attachment-container {\n  display: grid;\n  justify-items: center;\n}\n.page-label {\n  font-size: 12px;\n  margin-left: 5px;\n}\n.attachment-icon {\n  max-height: 12px;\n  margin-left: 10px;\n  cursor: pointer;\n  font-weight: 600;\n}\n.size-field {\n  background: #f8f8f5;\n  border: none;\n  line-height: 25px;\n  height: 25px;\n  width: 70px;\n  text-align: center;\n}\n.attachmentname {\n  margin-left: 10px;\n  max-width: 150px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-size: 12px;\n  font-weight: 600;\n}\n.close {\n  margin-left: 10px;\n  font-weight: 600;\n  font-size: 20px;\n  line-height: 0;\n}\n.field-name .remove-attachment {\n  margin-left: 10px;\n  font-size: 16px;\n  font-weight: 600;\n  cursor: pointer;\n}\n@media screen and (max-width: 990px) {\n  .btn-type-checker {\n    margin-top: 0;\n  }\n  /* .button-action-container {\n    justify-content: start;\n  }\n  .button-action-pickker {\n    width: 150px;\n    margin: 0 20px;\n  }\n  .btn-type-checker {\n    margin-bottom: 20px;\n  }\n  .pages-container {\n    width: 150px;\n    margin: 20px 20px 0;\n  }\n  .page-label {\n    font-size: 8px;\n  }\n  .pages-container .button-action-pickker {\n    margin: 0;\n  }\n  .attachment-container {\n    margin: 20px 20px 0;\n    width: 150px;\n  } */\n}\n</style>\n","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!./buttonActionDropdown.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!./buttonActionDropdown.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./buttonActionDropdown.vue?vue&type=template&id=ca5d773c&scoped=true&\"\nimport script from \"./buttonActionDropdown.vue?vue&type=script&lang=js&\"\nexport * from \"./buttonActionDropdown.vue?vue&type=script&lang=js&\"\nimport style0 from \"./buttonActionDropdown.vue?vue&type=style&index=0&id=ca5d773c&prod&scoped=true&lang=css&\"\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  \"ca5d773c\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./imageWidgetPanel.vue?vue&type=style&index=0&id=119748c5&prod&scoped=true&lang=css&\"","module.exports = __webpack_public_path__ + \"img/select_arrow.c1529dcc.svg\";","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"context-panel-container\"},[_c('div',{staticClass:\"context-panel-scroll\"},[_c('button-action-dropdown',{staticClass:\"link-dropdown\"}),_c('div',{staticClass:\"mob-separator\"}),_c('div',{staticClass:\"context-panel-group change-logo-container\"},[_c('div',{staticClass:\"change-logo\",on:{\"click\":function($event){return _vm.$store.dispatch('workSpace/showPopup', {\n            type: 'changeImage',\n            data: {\n              callback: _vm.onChangeImage\n            }\n          })}}},[_c('img',{attrs:{\"alt\":\"img\",\"src\":_vm.previewImage}})]),_c('div',{staticClass:\"field-name\"},[_vm._v(\" change image \")]),(!_vm.isSvg)?_c('div',{staticClass:\"context-panel-group\"},[_c('div',{staticClass:\"border-params\"},[_c('label',{staticClass:\"border-dash\"},[_c('el-dropdown',{attrs:{\"placement\":\"bottom\",\"trigger\":\"click\"}},[_c('span',{staticClass:\"el-dropdown-link\",staticStyle:{\"height\":\"24px\"}},[_c('div',{staticClass:\"dash\"})]),_c('el-dropdown-menu',{staticClass:\"frame-sliders dropdown-menu\",attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},[_c('el-slider',{staticClass:\"slider\",attrs:{\"show-tooltip\":false,\"min\":0,\"max\":100},on:{\"input\":function($event){return _vm.onInputBorderDash($event)},\"change\":function($event){return _vm.onChangeBorderDash($event)}},model:{value:(_vm.itemBorderDash),callback:function ($$v) {_vm.itemBorderDash=$$v},expression:\"itemBorderDash\"}})],1)],1)],1),_c('div',{staticClass:\"border-width\"},[_c('el-dropdown',{attrs:{\"placement\":\"bottom\",\"trigger\":\"click\"}},[_c('span',{staticClass:\"el-dropdown-link border-width-title\"},[_vm._v(\" \"+_vm._s(_vm.itemBorderWidth)+\"px \")]),_c('el-dropdown-menu',{staticClass:\"frame-sliders dropdown-menu\",attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},[_c('el-slider',{staticClass:\"slider\",attrs:{\"show-tooltip\":false,\"min\":0,\"max\":20},on:{\"input\":function($event){return _vm.onInputBorderWidth($event)},\"change\":function($event){return _vm.onChangeBorderWidth($event)}},model:{value:(_vm.itemBorderWidth),callback:function ($$v) {_vm.itemBorderWidth=$$v},expression:\"itemBorderWidth\"}})],1)],1)],1),_c('div',{staticClass:\"border-color\"},[_c('el-dropdown',{attrs:{\"placement\":\"bottom\",\"trigger\":\"click\"}},[_c('span',{staticClass:\"picker-button\"},[_c('div',{staticClass:\"color-picker-wraper\",style:({\n                    backgroundColor: _vm.borderColor.hex8,\n                    border: _vm.getColorBorder(_vm.borderColor)\n                  })})]),_c('el-dropdown-menu',{attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},[_c('chrome-picker',{staticClass:\"picker-element\",on:{\"input\":function($event){return _vm.onUpdateColor($event)}},model:{value:(_vm.borderColor),callback:function ($$v) {_vm.borderColor=$$v},expression:\"borderColor\"}})],1)],1)],1)]),_c('div',{staticClass:\"field-name\"},[_vm._v(\"image border\")])]):_vm._e()])],1)])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"context-panel-container\">\n    <div class=\"context-panel-scroll\">\n      <button-action-dropdown class=\"link-dropdown\" />\n      <div class=\"mob-separator\"></div>\n      <div class=\"context-panel-group change-logo-container\">\n        <div\n          class=\"change-logo\"\n          @click=\"\n            $store.dispatch('workSpace/showPopup', {\n              type: 'changeImage',\n              data: {\n                callback: onChangeImage\n              }\n            })\n          \"\n        >\n          <img alt=\"img\" :src=\"previewImage\" />\n        </div>\n        <div class=\"field-name\">\n          change image\n        </div>\n        <div class=\"context-panel-group\" v-if=\"!isSvg\">\n          <div class=\"border-params\">\n            <label class=\"border-dash\">\n              <el-dropdown placement=\"bottom\" trigger=\"click\">\n                <span class=\"el-dropdown-link\" style=\"height: 24px;\">\n                  <div class=\"dash\"></div>\n                </span>\n\n                <el-dropdown-menu\n                  class=\"frame-sliders dropdown-menu\"\n                  slot=\"dropdown\"\n                >\n                  <el-slider\n                    class=\"slider\"\n                    :show-tooltip=\"false\"\n                    :min=\"0\"\n                    :max=\"100\"\n                    v-model=\"itemBorderDash\"\n                    @input=\"onInputBorderDash($event)\"\n                    @change=\"onChangeBorderDash($event)\"\n                  />\n                </el-dropdown-menu>\n              </el-dropdown>\n            </label>\n            <div class=\"border-width\">\n              <el-dropdown placement=\"bottom\" trigger=\"click\">\n                <span class=\"el-dropdown-link border-width-title\">\n                  {{ itemBorderWidth }}px\n                </span>\n\n                <el-dropdown-menu\n                  class=\"frame-sliders dropdown-menu\"\n                  slot=\"dropdown\"\n                >\n                  <el-slider\n                    class=\"slider\"\n                    :show-tooltip=\"false\"\n                    :min=\"0\"\n                    :max=\"20\"\n                    v-model=\"itemBorderWidth\"\n                    @input=\"onInputBorderWidth($event)\"\n                    @change=\"onChangeBorderWidth($event)\"\n                  />\n                </el-dropdown-menu>\n              </el-dropdown>\n            </div>\n            <div class=\"border-color\">\n              <el-dropdown placement=\"bottom\" trigger=\"click\">\n                <span class=\"picker-button\">\n                  <div\n                    :style=\"{\n                      backgroundColor: borderColor.hex8,\n                      border: getColorBorder(borderColor)\n                    }\"\n                    class=\"color-picker-wraper\"\n                  ></div>\n                </span>\n                <el-dropdown-menu slot=\"dropdown\">\n                  <chrome-picker\n                    class=\"picker-element\"\n                    @input=\"onUpdateColor($event)\"\n                    v-model=\"borderColor\"\n                  />\n                </el-dropdown-menu>\n              </el-dropdown>\n            </div>\n          </div>\n          <div class=\"field-name\">image border</div>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { mapGetters } from \"vuex\";\nimport { getColorBorder } from \"@/helpers/hex\";\nimport ChromePicker from \"vue-color/src/components/Chrome\";\nimport buttonActionDropdown from \"@/components/contextMenu/widgets/buttonActionDropdown\";\nimport { addWidget } from \"@/util/survey/widgets\";\nimport \"@/assets/css/contextMenu.css\";\n\nexport default {\n  name: \"PILImageWidgetPanel\",\n  components: {\n    buttonActionDropdown,\n    ChromePicker\n  },\n  computed: {\n    ...mapGetters({\n      device: \"workSpace/device\",\n      survey: \"workSpace/survey\",\n      activeWidget: \"workSpace/activeWidget\"\n    }),\n    previewImage() {\n      return this.configs.imageSrc;\n    },\n    configs() {\n      return this.activeWidget.configs;\n    },\n    isSvg() {\n      return this.configs.isSvg;\n    }\n  },\n  data() {\n    return {\n      getColorBorder,\n      itemBorderDash: 0,\n      itemBorderWidth: 0,\n      borderColor: {},\n      timeoutId: null\n    };\n  },\n  mounted() {\n    if (this.isSvg) return;\n    this.itemBorderWidth = this.activeWidget.strokeWidth;\n    this.itemBorderDash = this.activeWidget.strokeDashArray\n      ? this.activeWidget.strokeDashArray[0]\n      : 0;\n    if (!this.activeWidget.stroke) this.activeWidget.set(\"stroke\", \"#000000\");\n    this.borderColor = {\n      hex8: this.activeWidget.stroke,\n      hex: this.activeWidget.stroke.slice(0, 7)\n    };\n  },\n  methods: {\n    async onChangeImage(idx, url) {\n      const active = this.activeWidget;\n      this.configs.imageSrc = url;\n      await addWidget(\"image\", this.survey, { configs: this.configs });\n      this.activeWidget.set({\n        top: active.top < 0 ? 0 : active.top,\n        left: active.left < 0 ? 0 : active.left,\n        angle: active.angle\n      });\n      this.survey.remove(active);\n      this.activeWidget.setCoords();\n      this.survey.renderAll();\n      this.survey.fire(\"canvas:changes\");\n    },\n    onChangeBorderDash() {\n      this.survey.fire(\"canvas:changes\");\n    },\n    onChangeBorderWidth() {\n      this.survey.fire(\"canvas:changes\");\n    },\n    onInputBorderWidth(width) {\n      this.activeWidget.set({ strokeWidth: width, strokeUniform: true });\n      this.survey.renderAll();\n    },\n    onInputBorderDash(dash) {\n      this.activeWidget.set({ strokeDashArray: [dash] });\n      this.survey.renderAll();\n    },\n    onUpdateColor(color) {\n      this.activeWidget.set({ stroke: color.hex8 });\n      this.survey.renderAll();\n      if (this.timeoutId) clearTimeout(this.timeoutId);\n      this.timeoutId = setTimeout(() => {\n        this.survey.fire(\"canvas:changes\");\n      }, 500);\n    }\n  }\n};\n</script>\n\n<style scoped>\n.top-logo-panel-wraper {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n\n.panel-title {\n  color: #1d2d36;\n  font-size: 12px;\n  font-weight: 600;\n  text-align: center;\n  margin-top: 10px;\n}\n.change-logo {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  max-width: 207px;\n  min-width: 207px;\n  height: 207px;\n  max-height: 207px;\n  border-radius: 7px;\n  background: #f8f8f5;\n  cursor: pointer;\n}\n.change-logo img {\n  padding: 7px;\n  box-sizing: border-box;\n  max-height: 100%;\n  max-width: 100%;\n  object-fit: contain;\n}\n.change-logo-title {\n  font-size: 12px;\n  text-align: center;\n}\n.border-params {\n  display: flex;\n  align-items: center;\n  height: 30px;\n  margin: 0;\n  width: 165px;\n  justify-content: space-around;\n  background: #f8f8f5;\n  border-radius: 7px;\n}\n.border-dash,\n.border-color,\n.border-width {\n  display: flex;\n  cursor: pointer;\n  align-items: center;\n  min-height: 24px;\n  position: relative;\n}\n.border-width-title {\n  height: 24px;\n  font-size: 12px;\n  display: flex;\n  align-items: center;\n}\n.dash {\n  background: #000;\n  margin: auto;\n  width: 20px;\n  height: 1px;\n}\n\n.picker-label {\n  width: 24px;\n  height: 24px;\n  border: 1px solid black;\n}\n.slider {\n  width: 200px;\n}\n.crop-icon-container {\n  display: flex;\n  margin-bottom: 20px;\n  cursor: pointer;\n}\n@media screen and (max-width: 990px) {\n  /* .border-params {\n    margin: auto;\n  }\n  .crop-icon-container {\n    display: flex;\n    align-items: center;\n    margin-top: 17px;\n  }\n  .border-params {\n    margin: 0;\n  } */\n  .link-dropdown {\n    justify-content: flex-start;\n  }\n  .link-dropdown >>> .button-action-pickker {\n    margin-top: 0;\n  }\n  .change-logo-container {\n    margin: 0;\n  }\n}\n</style>\n","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!./imageWidgetPanel.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!./imageWidgetPanel.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./imageWidgetPanel.vue?vue&type=template&id=119748c5&scoped=true&\"\nimport script from \"./imageWidgetPanel.vue?vue&type=script&lang=js&\"\nexport * from \"./imageWidgetPanel.vue?vue&type=script&lang=js&\"\nimport style0 from \"./imageWidgetPanel.vue?vue&type=style&index=0&id=119748c5&prod&scoped=true&lang=css&\"\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  \"119748c5\",\n  null\n  \n)\n\nexport default component.exports","module.exports = __webpack_public_path__ + \"img/file.3db5fd48.svg\";","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./buttonActionDropdown.vue?vue&type=style&index=0&id=ca5d773c&prod&scoped=true&lang=css&\""],"sourceRoot":""}