{"version":3,"sources":["webpack:///./src/components/general/CompletionProgress.vue?eaff","webpack:///src/components/general/CompletionProgress.vue","webpack:///./src/components/general/CompletionProgress.vue?e44e","webpack:///./src/components/general/CompletionProgress.vue","webpack:///./src/components/videoAds/Audience.vue?dea4","webpack:///./node_modules/core-js/modules/es.array.join.js","webpack:///./src/components/general/CompletionProgress.vue?5776","webpack:///./src/components/videoAds/Audience.vue?c3e9","webpack:///src/components/videoAds/Audience.vue","webpack:///./src/components/videoAds/Audience.vue?91a1","webpack:///./src/components/videoAds/Audience.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","hideProgress","on","$event","_v","_s","completedLength","checkList","length","style","width","progress","_l","item","key","quizName","class","completed","_e","staticRenderFns","name","props","type","Array","default","data","computed","Math","round","filter","created","window","innerWidth","component","$","IndexedObject","toIndexedObject","arrayMethodIsStrict","nativeJoin","join","ES3_STRINGS","Object","STRICT_METHOD","target","proto","forced","separator","call","undefined","stepIndex","surveyID","$route","client","ClientName","meta","surveyTitle","_m","domProps","langObj","quiz","slot","tip","model","value","callback","$$v","sampleType","_n","expression","audienceName","directives","rawName","usageFrame","genders","ages","region","sampleSize","customSample","nextStep","prevStep","quizs","components","ProgressBar","StepNaviBar","CompletionProgress","IconBase","IconAudience","mixins","radioStyle","display","height","lineHeight","breadcrumbTitle","editableSurvey","user","watch","updateQuiz","newVal","Audience","categoryUser","genPop","jsUtils","getSurveyTotalPrice","methods","$router","push","audiencePrevRoute","params","gender","age","SurveyId","audients","userId","EncrypteduserID","audienceDetails","audience","wsUtils","audiencePromise","then","activated","sessionStorage","getItem","id"],"mappings":"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","file":"js/audience.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('div',{staticClass:\"completion\"},[_c('font-awesome-icon',{staticClass:\"completion__close\",attrs:{\"icon\":_vm.hideProgress ? 'chevron-down' : 'chevron-up'},on:{\"click\":function($event){_vm.hideProgress = !_vm.hideProgress}}}),_c('h2',[_vm._v(\"Completion progress\")]),_c('p',[_vm._v(\"Please complete all required steps before proceeding.\")]),_c('div',{staticClass:\"completion__progress\"},[_c('span',[_vm._v(_vm._s(_vm.completedLength)+\" / \"+_vm._s(_vm.checkList.length)+\" steps\")]),_c('div',{staticClass:\"completion__progress-inner\"},[_c('i',{style:({ width: _vm.progress + '%' })})])]),(_vm.hideProgress)?_c('ol',_vm._l((_vm.checkList),function(item){return _c('li',{key:item.quizName,class:{ completed: item.completed }},[_c('font-awesome-icon',{attrs:{\"icon\":\"check-circle\"}}),_vm._v(_vm._s(item.quizName)+\" \")],1)}),0):_vm._e()],1)])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <div class=\"completion\">\n      <font-awesome-icon\n        :icon=\"hideProgress ? 'chevron-down' : 'chevron-up'\"\n        class=\"completion__close\"\n        @click=\"hideProgress = !hideProgress\"\n      />\n      <h2>Completion progress</h2>\n      <p>Please complete all required steps before proceeding.</p>\n      <div class=\"completion__progress\">\n        <span>{{ completedLength }} / {{ checkList.length }} steps</span>\n        <div class=\"completion__progress-inner\">\n          <i :style=\"{ width: progress + '%' }\"></i>\n        </div>\n      </div>\n      <ol v-if=\"hideProgress\">\n        <li\n          v-for=\"item in checkList\"\n          :key=\"item.quizName\"\n          :class=\"{ completed: item.completed }\"\n        >\n          <font-awesome-icon icon=\"check-circle\" />{{ item.quizName }}\n        </li>\n      </ol>\n    </div>\n  </div>\n</template>\n\n<script>\nexport default {\n  name: \"CompletionProgress\",\n  props: {\n    checkList: {\n      type: Array,\n      default() {\n        return [];\n      },\n    },\n  },\n  data() {\n    return {\n      hideProgress: false,\n    };\n  },\n  computed: {\n    progress() {\n      if (this.checkList.length > 0) {\n        let completedNum = this.checkList.filter(\n          (quiz) => quiz.completed\n        ).length;\n        return Math.round((completedNum / this.checkList.length) * 100);\n      } else {\n        return 0;\n      }\n    },\n    completedLength() {\n      return this.checkList.filter((quiz) => quiz.completed).length;\n    },\n  },\n  created() {\n    if (window.innerWidth > 1180) {\n      this.hideProgress = false;\n    } else {\n      this.hideProgress = true;\n    }\n  },\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.completion {\n  background: #fff;\n  border-radius: 4px;\n  position: fixed;\n  left: 435px;\n  bottom: 40px;\n  padding: 15px 17px 0;\n  width: 320px;\n  z-index: 998;\n  display: block;\n  border-radius: 4px;\n  border: 1px solid rgba(0, 0, 0, 0.1);\n  box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.17);\n  @media screen and (max-width: 1180px) {\n    display: none;\n  }\n  .progress-nav-closed & {\n    left: 283px;\n  }\n  &.is-active {\n    display: block;\n  }\n  &.is-hide {\n    display: none;\n  }\n  &__robot {\n    height: 65px;\n    margin: 0 auto;\n    display: block;\n    margin-bottom: 9px;\n  }\n  h2 {\n    text-align: center;\n    font-size: 16px;\n    margin-bottom: 8px;\n    font-weight: 600;\n    line-height: 24px;\n    letter-spacing: -0.32px;\n  }\n  p {\n    text-align: center;\n    color: #968e8e;\n    margin-bottom: 20px;\n    color: rgba(28, 28, 28, 0.4);\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 24px;\n    letter-spacing: -0.28px;\n  }\n  &__progress {\n    align-items: flex-start;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    > span {\n      font-size: 14px;\n      padding: 6px 6px 5px;\n      text-align: center;\n      white-space: nowrap;\n      background: #fefefe;\n      transition: all 0.3s ease;\n      font-weight: 500;\n      color: var(--red);\n      border-radius: 10px;\n      box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.1);\n      margin-bottom: 8px;\n      display: inline-flex;\n    }\n  }\n  &__progress-inner {\n    height: 12px;\n    position: relative;\n    background: #f6f6f6;\n    border-radius: 12px;\n    overflow: hidden;\n    margin-bottom: 18px;\n    width: 100%;\n    i {\n      position: absolute;\n      left: 0;\n      height: 100%;\n      background: var(--red);\n      content: \"\";\n      display: block;\n      transition: width 0.3s ease;\n    }\n  }\n  &__close {\n    position: absolute;\n    right: 10px;\n    top: 10px;\n    color: var(--red);\n    cursor: pointer;\n  }\n  ol {\n    padding: 0;\n    margin: 0 0 20px;\n    text-align: left;\n    counter-reset: item;\n    list-style-type: none;\n    li {\n      border: 1px solid #e9e9e9;\n      border-radius: 4px;\n      margin-bottom: 5px;\n      color: #bcbcbc;\n      counter-increment: item;\n      position: relative;\n      padding: 7px 10px 7px 57px;\n      font-size: 14px;\n      font-weight: 500;\n      line-height: 24px;\n      letter-spacing: -0.28px;\n      &.completed {\n        color: #404040;\n        svg {\n          color: var(--red);\n        }\n      }\n      &:last-child {\n        margin-bottom: 0;\n      }\n      &:before {\n        position: absolute;\n        left: 43px;\n        top: 7px;\n        content: counter(item) \".\";\n      }\n      svg {\n        position: absolute;\n        left: 9px;\n        top: 10px;\n        font-size: 17px;\n      }\n    }\n  }\n}\n\n.completion-cta {\n  background: #fff;\n  border-radius: 4px;\n  box-shadow: 0px 0px 14px 1px rgba(0, 0, 0, 0.1);\n  position: fixed;\n  right: 20px;\n  bottom: 80px;\n  padding: 8px 14px;\n  border: 1px solid #e8e8e8;\n  cursor: pointer;\n  z-index: 999;\n  img {\n    width: 18px;\n    margin-right: 7px;\n  }\n  span {\n    font-size: 14px;\n    font-weight: 500;\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!./CompletionProgress.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!./CompletionProgress.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./CompletionProgress.vue?vue&type=template&id=39aadbcf&scoped=true&\"\nimport script from \"./CompletionProgress.vue?vue&type=script&lang=js&\"\nexport * from \"./CompletionProgress.vue?vue&type=script&lang=js&\"\nimport style0 from \"./CompletionProgress.vue?vue&type=style&index=0&id=39aadbcf&lang=scss&scoped=true&\"\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  \"39aadbcf\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.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!./Audience.vue?vue&type=style&index=0&id=1ceb9119&lang=scss&scoped=true&\"","'use strict';\nvar $ = require('../internals/export');\nvar IndexedObject = require('../internals/indexed-object');\nvar toIndexedObject = require('../internals/to-indexed-object');\nvar arrayMethodIsStrict = require('../internals/array-method-is-strict');\n\nvar nativeJoin = [].join;\n\nvar ES3_STRINGS = IndexedObject != Object;\nvar STRICT_METHOD = arrayMethodIsStrict('join', ',');\n\n// `Array.prototype.join` method\n// https://tc39.es/ecma262/#sec-array.prototype.join\n$({ target: 'Array', proto: true, forced: ES3_STRINGS || !STRICT_METHOD }, {\n  join: function join(separator) {\n    return nativeJoin.call(toIndexedObject(this), separator === undefined ? ',' : separator);\n  }\n});\n","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.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!./CompletionProgress.vue?vue&type=style&index=0&id=39aadbcf&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"authoring-wrapper\"},[_c('div',{staticClass:\"flex h-full\"},[_c('ProgressBar',{attrs:{\"stepIndex\":_vm.stepIndex,\"surveyID\":_vm.surveyID,\"stepsType\":_vm.$route.name !== 'pack-test-audience' ? 'video' : 'pack'}}),_c('section',{staticClass:\"wrapper\"},[_c('a-breadcrumb',{staticClass:\"breadcrum breadcrum breadcrum--authoring\"},[_c('a-breadcrumb-item',[_c('a',{attrs:{\"href\":\"/\"}},[_vm._v(_vm._s(_vm.client.ClientName))])]),_c('a-breadcrumb-item',[_c('a',{attrs:{\"href\":\"/products\"}},[_vm._v(\"Products\")])]),_c('a-breadcrumb-item',[_vm._v(_vm._s(_vm.$route.meta.surveyTitle))])],1),_c('div',{staticClass:\"wrapper__inner\"},[_c('div',{staticClass:\"page-title\"},[_c('icon-base',{attrs:{\"width\":32,\"height\":33,\"viewBox1\":23,\"viewBox2\":24,\"iconName\":\"audience\",\"iconColor\":\"#4318FF\"}},[_c('icon-audience')],1),_vm._m(0)],1),_c('div',{staticClass:\"box-wrapper\"},[_c('div',{staticClass:\"input-group mb-25\"},[_c('label',{staticClass:\"justify-start\"},[_c('span',{domProps:{\"innerHTML\":_vm._s(_vm.langObj['s5-audience'].quiz)}}),_c('a-tooltip',{attrs:{\"placement\":\"topRight\"}},[_c('template',{slot:\"title\"},[_c('span',{domProps:{\"innerHTML\":_vm._s(_vm.langObj['s5-audience'].tip)}})]),_c('a-icon',{attrs:{\"type\":\"info-circle\"}})],2)],1),_c('a-radio-group',{staticClass:\"flex\",model:{value:(_vm.sampleType),callback:function ($$v) {_vm.sampleType=_vm._n($$v)},expression:\"sampleType\"}},[_c('a-radio',{style:(_vm.radioStyle),attrs:{\"value\":1}},[_vm._v(\" General population \")]),_c('a-radio',{style:(_vm.radioStyle),attrs:{\"value\":2}},[_vm._v(\" \"+_vm._s(_vm.audienceName)+\" \")]),_c('a-radio',{style:(_vm.radioStyle),attrs:{\"value\":3}},[_vm._v(\" Custom \")])],1)],1),_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.sampleType === 2),expression:\"sampleType === 2\"}],staticClass:\"input-group refine\"},[_c('h4',[_vm._v(\"Category usage\")]),_c('a-radio-group',{staticClass:\"flex\",model:{value:(_vm.usageFrame),callback:function ($$v) {_vm.usageFrame=_vm._n($$v)},expression:\"usageFrame\"}},[_c('a-radio',{style:(_vm.radioStyle),attrs:{\"value\":3}},[_vm._v(\" Within last 3 months \")]),_c('a-radio',{style:(_vm.radioStyle),attrs:{\"value\":6}},[_vm._v(\" Within last 6 months \")]),_c('a-radio',{style:(_vm.radioStyle),attrs:{\"value\":12}},[_vm._v(\" Within last 12 months \")])],1)],1),_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.sampleType !== 2),expression:\"sampleType !== 2\"}],staticClass:\"input-group refine\"},[_c('h4',[_vm._v(\"Gender\")]),_c('a-checkbox-group',{model:{value:(_vm.genders),callback:function ($$v) {_vm.genders=$$v},expression:\"genders\"}},[_c('a-checkbox',{attrs:{\"value\":\"male\",\"disabled\":_vm.sampleType === 1}},[_vm._v(\"Male\")]),_c('a-checkbox',{attrs:{\"value\":\"female\",\"disabled\":_vm.sampleType === 1}},[_vm._v(\"Female\")])],1),_c('h4',[_vm._v(\"Age\")]),_c('a-checkbox-group',{model:{value:(_vm.ages),callback:function ($$v) {_vm.ages=$$v},expression:\"ages\"}},[_c('a-checkbox',{attrs:{\"disabled\":_vm.sampleType === 1,\"value\":\"18-24\"}},[_vm._v(\"18 to 24\")]),_c('a-checkbox',{attrs:{\"disabled\":_vm.sampleType === 1,\"value\":\"25-34\"}},[_vm._v(\"25 to 34\")]),_c('a-checkbox',{attrs:{\"disabled\":_vm.sampleType === 1,\"value\":\"35-49\"}},[_vm._v(\"35 to 49\")]),_c('a-checkbox',{attrs:{\"disabled\":_vm.sampleType === 1,\"value\":\"50-59\"}},[_vm._v(\"50 to 59\")]),_c('a-checkbox',{attrs:{\"disabled\":_vm.sampleType === 1,\"value\":\"60+\"}},[_vm._v(\"60+\")])],1),_c('h4',[_vm._v(\"Regions\")]),_c('p',{staticClass:\"font-size-14 mb-0\",domProps:{\"innerHTML\":_vm._s(_vm.langObj['s5-audience'].region)}})],1),_c('div',{staticClass:\"input-group\"},[_c('label',{staticClass:\"justify-start\"},[_c('span',{domProps:{\"innerHTML\":_vm._s(_vm.langObj['s5-sample'].quiz)}}),_c('a-tooltip',{attrs:{\"placement\":\"topRight\"}},[_c('template',{slot:\"title\"},[_c('span',{domProps:{\"innerHTML\":_vm._s(_vm.langObj['s5-sample'].tip)}})]),_c('a-icon',{attrs:{\"type\":\"info-circle\"}})],2)],1),_c('div',{staticClass:\"quizContent\"},[_c('p',{staticClass:\"brief break\"},[_c('span',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.sampleSize === 200),expression:\"sampleSize === 200\"}]},[_vm._v(\"200 (recommended)\")]),_c('span',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.sampleSize !== 200),expression:\"sampleSize !== 200\"}]},[_vm._v(_vm._s(_vm.sampleSize)+\" (custom)\")]),_c('a-button',{attrs:{\"size\":\"small\"},on:{\"click\":function($event){_vm.customSample = true}}},[_vm._v(\"Change\")])],1),_c('a-radio-group',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.customSample),expression:\"customSample\"}],model:{value:(_vm.sampleSize),callback:function ($$v) {_vm.sampleSize=_vm._n($$v)},expression:\"sampleSize\"}},[_c('a-radio',{attrs:{\"value\":150}},[_vm._v(\" 150 \")]),_c('a-radio',{attrs:{\"value\":200}},[_vm._v(\" 200 (recommended)\")]),_c('a-radio',{attrs:{\"value\":250}},[_vm._v(\" 250 \")]),_c('a-radio',{attrs:{\"value\":300}},[_vm._v(\" 300 \")])],1)],1)])]),_c('StepNaviBar',{attrs:{\"stepIndex\":_vm.stepIndex,\"nextDisable\":false,\"prevDisable\":false,\"prevBtnTooltip\":_vm.$route.name === 'vid-ua-audience'\n              ? 'Back to Customize'\n              : 'Back to Key Metrics',\"conciergeAssistance\":_vm.$route.name === 'pack-test-audience' ? true : false,\"nextBtnTooltip\":\"Go to Launch\",\"stepsType\":_vm.$route.name === 'pack-test-audience' ? 'pack' : 'video'},on:{\"nextHandler\":_vm.nextStep,\"prevHandler\":_vm.prevStep}})],1)],1)],1),_c('CompletionProgress',{attrs:{\"checkList\":_vm.quizs}})],1)}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"page-title__text\"},[_c('h1',[_vm._v(\"Audience\")]),_c('span',[_vm._v(\"Customize Your Audience\")])])}]\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"authoring-wrapper\">\n    <div class=\"flex h-full\">\n      <ProgressBar\n        :stepIndex=\"stepIndex\"\n        :surveyID=\"surveyID\"\n        :stepsType=\"$route.name !== 'pack-test-audience' ? 'video' : 'pack'\"\n      />\n      <section class=\"wrapper\">\n        <a-breadcrumb class=\"breadcrum breadcrum breadcrum--authoring\">\n          <a-breadcrumb-item\n            ><a href=\"/\">{{ client.ClientName }}</a></a-breadcrumb-item\n          >\n          <a-breadcrumb-item\n            ><a href=\"/products\">Products</a></a-breadcrumb-item\n          >\n          <a-breadcrumb-item>{{ $route.meta.surveyTitle }}</a-breadcrumb-item>\n        </a-breadcrumb>\n        <div class=\"wrapper__inner\">\n          <div class=\"page-title\">\n            <icon-base\n              :width=\"32\"\n              :height=\"33\"\n              :viewBox1=\"23\"\n              :viewBox2=\"24\"\n              iconName=\"audience\"\n              iconColor=\"#4318FF\"\n              ><icon-audience\n            /></icon-base>\n            <div class=\"page-title__text\">\n              <h1>Audience</h1>\n              <span>Customize Your Audience</span>\n            </div>\n          </div>\n          <div class=\"box-wrapper\">\n            <!-- sample type -->\n            <div class=\"input-group mb-25\">\n              <label class=\"justify-start\">\n                <span v-html=\"langObj['s5-audience'].quiz\"></span>\n                <a-tooltip placement=\"topRight\">\n                  <template slot=\"title\">\n                    <span v-html=\"langObj['s5-audience'].tip\"></span>\n                  </template>\n                  <a-icon type=\"info-circle\" />\n                </a-tooltip>\n              </label>\n\n              <a-radio-group v-model.number=\"sampleType\" class=\"flex\">\n                <a-radio :style=\"radioStyle\" :value=\"1\">\n                  General population\n                </a-radio>\n                <a-radio :style=\"radioStyle\" :value=\"2\">\n                  {{ audienceName }}\n                </a-radio>\n                <a-radio :style=\"radioStyle\" :value=\"3\"> Custom </a-radio>\n              </a-radio-group>\n            </div>\n            <!-- category redefin -->\n            <div class=\"input-group refine\" v-show=\"sampleType === 2\">\n              <h4>Category usage</h4>\n              <a-radio-group v-model.number=\"usageFrame\" class=\"flex\">\n                <a-radio :style=\"radioStyle\" :value=\"3\">\n                  Within last 3 months\n                </a-radio>\n                <a-radio :style=\"radioStyle\" :value=\"6\">\n                  Within last 6 months\n                </a-radio>\n                <a-radio :style=\"radioStyle\" :value=\"12\">\n                  Within last 12 months\n                </a-radio>\n              </a-radio-group>\n              <!--  -->\n            </div>\n            <!-- custom refine -->\n            <div class=\"input-group refine\" v-show=\"sampleType !== 2\">\n              <h4>Gender</h4>\n              <a-checkbox-group v-model=\"genders\">\n                <a-checkbox value=\"male\" :disabled=\"sampleType === 1\"\n                  >Male</a-checkbox\n                >\n                <a-checkbox value=\"female\" :disabled=\"sampleType === 1\"\n                  >Female</a-checkbox\n                >\n              </a-checkbox-group>\n              <!--  -->\n              <h4>Age</h4>\n              <a-checkbox-group v-model=\"ages\">\n                <a-checkbox :disabled=\"sampleType === 1\" value=\"18-24\"\n                  >18 to 24</a-checkbox\n                >\n                <a-checkbox :disabled=\"sampleType === 1\" value=\"25-34\"\n                  >25 to 34</a-checkbox\n                >\n                <a-checkbox :disabled=\"sampleType === 1\" value=\"35-49\"\n                  >35 to 49</a-checkbox\n                >\n                <a-checkbox :disabled=\"sampleType === 1\" value=\"50-59\"\n                  >50 to 59</a-checkbox\n                >\n                <a-checkbox :disabled=\"sampleType === 1\" value=\"60+\"\n                  >60+</a-checkbox\n                >\n              </a-checkbox-group>\n              <!--  -->\n              <h4>Regions</h4>\n              <p\n                class=\"font-size-14 mb-0\"\n                v-html=\"langObj['s5-audience'].region\"\n              ></p>\n            </div>\n\n            <!-- sample size -->\n            <div class=\"input-group\">\n              <label class=\"justify-start\">\n                <span v-html=\"langObj['s5-sample'].quiz\"></span>\n                <a-tooltip placement=\"topRight\">\n                  <template slot=\"title\">\n                    <span v-html=\"langObj['s5-sample'].tip\"></span>\n                  </template>\n                  <a-icon type=\"info-circle\" />\n                </a-tooltip>\n              </label>\n              <div class=\"quizContent\">\n                <p class=\"brief break\">\n                  <span v-show=\"sampleSize === 200\">200 (recommended)</span>\n                  <span v-show=\"sampleSize !== 200\"\n                    >{{ sampleSize }} (custom)</span\n                  >\n                  <a-button @click=\"customSample = true\" size=\"small\"\n                    >Change</a-button\n                  >\n                </p>\n\n                <a-radio-group\n                  v-model.number=\"sampleSize\"\n                  v-show=\"customSample\"\n                >\n                  <a-radio :value=\"150\"> 150 </a-radio>\n                  <a-radio :value=\"200\"> 200 (recommended)</a-radio>\n                  <a-radio :value=\"250\"> 250 </a-radio>\n                  <a-radio :value=\"300\"> 300 </a-radio>\n                </a-radio-group>\n              </div>\n            </div>\n          </div>\n          <StepNaviBar\n            :stepIndex=\"stepIndex\"\n            :nextDisable=\"false\"\n            @nextHandler=\"nextStep\"\n            :prevDisable=\"false\"\n            @prevHandler=\"prevStep\"\n            :prevBtnTooltip=\"\n              $route.name === 'vid-ua-audience'\n                ? 'Back to Customize'\n                : 'Back to Key Metrics'\n            \"\n            :conciergeAssistance=\"\n              $route.name === 'pack-test-audience' ? true : false\n            \"\n            nextBtnTooltip=\"Go to Launch\"\n            :stepsType=\"$route.name === 'pack-test-audience' ? 'pack' : 'video'\"\n          />\n        </div>\n      </section>\n    </div>\n    <CompletionProgress :checkList=\"quizs\"></CompletionProgress>\n  </div>\n</template>\n\n<script>\nimport * as wsUtils from \"@/utils/wsUtils.js\";\nimport * as jsUtils from \"@/utils/jsUtils.js\";\n\nimport ProgressBar from \"@/components/videoAds/ProgressBar.vue\";\nimport StepNaviBar from \"@/components/videoAds/StepNaviBar1.vue\";\nimport { mutations } from \"@/utils/store.js\";\nimport CompletionProgress from \"@/components/general/CompletionProgress.vue\";\nimport surveyPriceMixin from \"@/mixins/surveyPriceCalculation.js\";\nimport IconBase from \"@/components/general/IconBase.vue\";\nimport IconAudience from \"@/components/icons/IconAudience.vue\";\n\nexport default {\n  name: \"Audience\",\n  components: {\n    ProgressBar,\n    StepNaviBar,\n    CompletionProgress,\n    IconBase,\n    IconAudience,\n  },\n  mixins: [surveyPriceMixin],\n  data() {\n    return {\n      radioStyle: {\n        display: \"block\",\n        height: \"30px\",\n        lineHeight: \"30px\",\n      },\n      sampleType: 1,\n      sampleSize: 200,\n      genders: [\"male\", \"female\"],\n      ages: [\"18-24\", \"25-34\", \"35-49\", \"50-59\", \"60+\"],\n      customSample: false,\n      usageFrame: 3,\n      stepIndex: 5,\n      surveyID: 0,\n      langObj: {},\n      client: {},\n      quizs: [],\n      audienceName: \"\",\n      breadcrumbTitle: \"\",\n      editableSurvey: null,\n      user: null,\n    };\n  },\n  watch: {\n    sampleType(newVal) {\n      this.updateQuiz();\n\n      let currentSurveyPriceData = jsUtils.getSurveyPrice();\n\n      if (newVal === 2) {\n        let surveyPriceSetData = {\n          Audience: {\n            categoryUser: this.usageFrame,\n            genPop: this.sampleType === 1 ? 1 : 0,\n            sampleSize: this.sampleSize,\n          },\n        };\n        jsUtils.setSurveyPrice({\n          ...currentSurveyPriceData,\n          ...surveyPriceSetData,\n        });\n        mutations.setSurveyPriceCategoryGenPop(this.sampleType === 1 ? 1 : 0);\n        mutations.setSurveyPriceCategoryUser(this.usageFrame);\n      } else {\n        mutations.setSurveyPriceCategoryUser(0);\n        let surveyPriceSetData = {\n          Audience: {\n            ...currentSurveyPriceData.Audience,\n            categoryUser: 0,\n            genPop: this.sampleType === 1 ? 1 : 0,\n          },\n        };\n        jsUtils.setSurveyPrice({\n          ...currentSurveyPriceData,\n          ...surveyPriceSetData,\n        });\n      }\n      this.getSurveyTotalPrice();\n    },\n    usageFrame(newVal) {\n      mutations.setSurveyPriceCategoryGenPop(this.sampleType === 1 ? 1 : 0);\n      mutations.setSurveyPriceCategoryUser(newVal);\n      let currentSurveyPriceData = jsUtils.getSurveyPrice();\n      let surveyPriceSetData = {\n        Audience: {\n          categoryUser: newVal,\n          genPop: this.sampleType === 1 ? 1 : 0,\n          sampleSize: this.sampleSize,\n        },\n      };\n      jsUtils.setSurveyPrice({\n        ...currentSurveyPriceData,\n        ...surveyPriceSetData,\n      });\n      this.getSurveyTotalPrice();\n    },\n    sampleSize(newVal) {\n      mutations.setSurveyPriceCategorySampleSize(newVal);\n      let currentSurveyPriceData = jsUtils.getSurveyPrice();\n      let surveyPriceSetData = {\n        Audience: {\n          ...currentSurveyPriceData.Audience,\n          sampleSize: newVal,\n          genPop: this.sampleType === 1 ? 1 : 0,\n        },\n      };\n      jsUtils.setSurveyPrice({\n        ...currentSurveyPriceData,\n        ...surveyPriceSetData,\n      });\n      this.getSurveyTotalPrice();\n    },\n  },\n  methods: {\n    prevStep() {\n      this.$router.push({\n        name: this.$route.meta.audiencePrevRoute || \"vid-key-metrics\",\n        params: { id: this.surveyID },\n      });\n    },\n    nextStep() {\n      let audients = {\n        gender: this.sampleType === 1 ? [\"male\", \"female\"] : this.genders,\n        age:\n          this.sampleType === 1\n            ? [\"18-24\", \"25-34\", \"35-49\", \"50-59\", \"60+\"]\n            : this.ages,\n        sampleSize: this.sampleSize,\n        genPop: this.sampleType === 1 ? 1 : 0,\n        categoryUser: this.sampleType === 2 ? this.usageFrame : 0,\n      };\n\n      let audientObj = {\n        SurveyId: this.surveyID,\n        model: audients,\n        userId: this.user.EncrypteduserID,\n      };\n\n      let audienceDetails;\n\n      if (this.sampleType === 1) {\n        audienceDetails = \"General population\";\n      } else if (this.sampleType === 2) {\n        audienceDetails = `Category Users / Category usage: within last ${this.usageFrame} months`;\n      } else {\n        audienceDetails = `Custom / Gender: ${this.genders.join(\n          \", \"\n        )} / Age: ${this.ages.join(\", \")}`;\n      }\n\n      let surveySummary = {\n        sampleSize: this.sampleSize,\n        audience: audienceDetails,\n      };\n\n      let currentSummaryData = jsUtils.getSurveySummaryData();\n      jsUtils.setSurveySummaryData({ ...currentSummaryData, ...surveySummary });\n\n      const audiencePromise = new Promise((resolve) => {\n        wsUtils.InsertAudienceDetails(audientObj, resolve);\n      });\n\n      audiencePromise.then(() => {\n        jsUtils.setSurveysApiTrigger(true);\n\n        this.$router.push({\n          name: this.$route.meta.audienceNextRoute || \"vid-launch\",\n          params: { id: this.surveyID },\n        });\n      });\n    },\n    updateQuiz() {\n      this.quizs = [\n        {\n          quizName: this.langObj[\"s5-audience\"].robot,\n          completed: this.sampleType !== 0,\n        },\n        {\n          quizName: this.langObj[\"s5-sample\"].robot,\n          completed: this.sampleSize >= 75,\n        },\n      ];\n    },\n  },\n  activated() {\n    this.sampleSize = 200;\n    this.customSample = false;\n    this.client = jsUtils.getCurClient();\n\n    this.audienceName = sessionStorage.getItem(\"audienceName\");\n\n    this.surveyID = this.$route.params.id;\n\n    this.updateQuiz();\n\n    this.user = jsUtils.getUserInfo();\n\n    this.editableSurvey = jsUtils.getEditableSurvey();\n    if (\n      this.editableSurvey.audience.age !== null &&\n      this.editableSurvey.audience.gender !== null\n    ) {\n      if (this.editableSurvey.audience.categoryUser !== 0) {\n        this.usageFrame = this.editableSurvey.audience.categoryUser;\n        this.sampleType = 2;\n      } else if (\n        this.editableSurvey.audience.age.length === this.ages.length &&\n        this.editableSurvey.audience.gender.length === this.genders.length\n      ) {\n        this.sampleType = 1;\n      } else {\n        this.sampleType = 3;\n      }\n\n      this.sampleSize = this.editableSurvey.audience.sampleSize;\n      this.ages = this.editableSurvey.audience.age || [\n        \"18-24\",\n        \"25-34\",\n        \"35-49\",\n        \"50-59\",\n        \"60+\",\n      ];\n      this.genders = this.editableSurvey.audience.gender || [\"male\", \"female\"];\n    }\n    this.getSurveyTotalPrice();\n  },\n  created() {\n    this.langObj = jsUtils.getLangObj(\n      \"videoAuthorLang\",\n      \"/tooltip/videoAuthor.json\"\n    );\n    this.breadcrumbTitle =\n      this.$route.name !== \"pack-test-audience\" ? \"Video Ad\" : \"Pack\";\n  },\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.page-title {\n  svg {\n    stroke-width: 0;\n  }\n}\n.questions {\n  padding: 2em;\n  border: solid 1px var(--lineGrey);\n  border-radius: 8px 8px 0 0;\n  width: 50vw;\n  display: grid;\n  align-self: center;\n}\n\n.quizContent .ant-radio-group {\n  display: flex;\n  // place-content: space-between;\n}\n\n.quizTitle {\n  margin-bottom: 2em;\n}\n\n.break {\n  display: flex;\n  // place-content: space-between;\n  align-items: center;\n  // margin-top: 2em;\n  column-gap: 10px;\n\n  .ant-btn-sm {\n    font-size: 13px;\n    padding: 2px 10px;\n  }\n}\n\n.quiz {\n  margin-top: 2em;\n}\n\n.refine {\n  border-radius: 12px;\n  padding: 22px;\n  border: 1px solid #e9e9e9;\n  background-color: rgba(255, 255, 255, 0.85);\n  margin-bottom: 25px;\n\n  .ant-checkbox-group {\n    margin-bottom: 2em;\n    white-space: nowrap;\n  }\n\n  .ant-divider-inner-text {\n    font-weight: normal;\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!./Audience.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!./Audience.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Audience.vue?vue&type=template&id=1ceb9119&scoped=true&\"\nimport script from \"./Audience.vue?vue&type=script&lang=js&\"\nexport * from \"./Audience.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Audience.vue?vue&type=style&index=0&id=1ceb9119&lang=scss&scoped=true&\"\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  \"1ceb9119\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}