{"version":3,"sources":["webpack:///./src/views/Visitor.vue?1854","webpack:///./src/views/Visitor.vue?c4f0","webpack:///src/views/Visitor.vue","webpack:///./src/views/Visitor.vue?7523","webpack:///./src/views/Visitor.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","_v","_m","_l","visitor","i","key","_id","_s","currentPage","perPage","personal_info","fullname","email","phone_number","agency","purpose","_f","visiting_time","start_date","end_date","status","attrs","on","$event","openmodal","ref","detailVisitor","transaction_id","identity","identity_no","address","description","openViewImg","file","selfie","imgPreview","titlePreview","_e","directives","name","rawName","value","lengthData","expression","handlePageChange","model","callback","$$v","staticRenderFns","staticStyle","components","data","dataTransaction","pageOfItems","trade_id","offset","visitorDatas","loadingImgPreview","form","startDate","endDate","mounted","getData","methods","window","scrollTo","filterDate","Download","divToPrint","document","getElementById","htmlToPrint","outerHTML","newWin","open","write","print","close","computed","rows","component"],"mappings":"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","file":"js/chunk-3a2ee9c0.8e06af5b.js","sourcesContent":["export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Visitor.vue?vue&type=style&index=0&id=7f8fd7fa&scoped=true&lang=css&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"wrap-dashboard\"},[_c('div',{staticClass:\"main-content\"},[_c('div',{staticClass:\"wrap-content\"},[_c('div',{staticClass:\"title-page\"},[_vm._v(\"Visitor\")]),_c('div',{staticClass:\"content\"},[_c('table',[_vm._m(0),_c('tbody',_vm._l((_vm.visitorDatas),function(visitor,i){return _c('tr',{key:visitor._id},[_c('td',[_vm._v(_vm._s((_vm.currentPage - 1) * _vm.perPage + (i + 1)))]),_c('td',[_vm._v(_vm._s(visitor.personal_info.fullname))]),_c('td',[_vm._v(_vm._s(visitor.personal_info.email))]),_c('td',[_vm._v(_vm._s(visitor.personal_info.phone_number))]),_c('td',[_vm._v(_vm._s(visitor.agency))]),_c('td',[_vm._v(_vm._s(visitor.purpose))]),_c('td',[_vm._v(_vm._s(_vm._f(\"formatTime\")(visitor.visiting_time.start_date))+\" - \"+_vm._s(_vm._f(\"formatTime\")(visitor.visiting_time.end_date)))]),_c('td',[_vm._v(_vm._s(visitor.status))]),_c('td',[_c('button',{staticClass:\"btn btn-outline-info btn-sm\",attrs:{\"type\":\"button\"},on:{\"click\":function($event){return _vm.openmodal(visitor._id)}}},[_vm._v(\"Detail\")])])])}),0)]),_c('b-modal',{ref:\"detail-visitor\",attrs:{\"title\":\"Detail Visitor\",\"hide-footer\":\"\",\"size\":\"xl\"}},[(_vm.detailVisitor)?_c('div',{staticClass:\"wrap-detail\"},[_c('div',{staticClass:\"content-left\"},[_c('h4',[_vm._v(\"Transaction ID : \"+_vm._s(_vm.detailVisitor.transaction_id))]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Nama\")]),_c('span',[_vm._v(\":\")]),_c('span',[_vm._v(_vm._s(_vm.detailVisitor.personal_info.fullname))])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Phone Number\")]),_c('span',[_vm._v(\":\")]),_c('span',[_vm._v(_vm._s(_vm.detailVisitor.personal_info.phone_number))])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Email\")]),_c('span',[_vm._v(\":\")]),_c('span',[_vm._v(_vm._s(_vm.detailVisitor.personal_info.email))])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Identity\")]),_c('span',[_vm._v(\":\")]),_c('span',[_vm._v(_vm._s(_vm.detailVisitor.personal_info.identity + \" - \" + _vm.detailVisitor.personal_info.identity_no))])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Address\")]),_c('span',[_vm._v(\":\")]),_c('span',[_vm._v(_vm._s(_vm.detailVisitor.personal_info.address))])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Agency\")]),_c('span',[_vm._v(\":\")]),_c('span',[_vm._v(_vm._s(_vm.detailVisitor.agency))])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Purpose\")]),_c('span',[_vm._v(\":\")]),_c('span',[_vm._v(_vm._s(_vm.detailVisitor.purpose))])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Description\")]),_c('span',[_vm._v(\":\")]),_c('span',[_vm._v(_vm._s(_vm.detailVisitor.description))])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Visiting Time\")]),_c('span',[_vm._v(\":\")]),_c('span',[_vm._v(_vm._s(_vm._f(\"formatTime\")(_vm.detailVisitor.visiting_time.start_date))+\" - \"+_vm._s(_vm._f(\"formatTime\")(_vm.detailVisitor.visiting_time.end_date))+\" \")])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Selfie Photo\")]),_c('span',[_vm._v(\":\")]),_c('span',{staticClass:\"btn-preview\",on:{\"click\":function($event){return _vm.openViewImg(_vm.detailVisitor.file.selfie, 'Selfie Photo')}}},[_vm._v(\" View \")])]),_c('div',{staticClass:\"detail-visitorS\"},[_c('label',{attrs:{\"for\":\"\"}},[_vm._v(\"Identity Picture\")]),_c('span',[_vm._v(\":\")]),_c('span',{staticClass:\"btn-preview\",on:{\"click\":function($event){return _vm.openViewImg(_vm.detailVisitor.file.identity, 'Identity Picture')}}},[_vm._v(\"View\")])])]),_c('div',{staticClass:\"content-right text-center\"},[(_vm.loadingImgPreview)?_c('div',[_c('b-spinner')],1):(_vm.imgPreview != '')?_c('div',[_c('h5',[_vm._v(_vm._s(_vm.titlePreview))]),_c('img',{attrs:{\"src\":_vm.imgPreview,\"alt\":\"\"}})]):_vm._e()])]):_vm._e()]),_c('b-pagination',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.lengthData > 10),expression:\"lengthData > 10\"}],attrs:{\"total-rows\":_vm.lengthData,\"per-page\":_vm.perPage,\"aria-controls\":\"new-table\",\"first-number\":\"\",\"last-number\":\"\"},on:{\"change\":_vm.handlePageChange},model:{value:(_vm.currentPage),callback:function ($$v) {_vm.currentPage=$$v},expression:\"currentPage\"}})],1)])])])}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('thead',[_c('tr',{attrs:{\"id\":\"top\"}},[_c('th',{staticStyle:{\"width\":\"70px\"},attrs:{\"scope\":\"col\"}},[_vm._v(\"No\")]),_c('th',{attrs:{\"scope\":\"col\"}},[_vm._v(\"Name\")]),_c('th',{attrs:{\"scope\":\"col\"}},[_vm._v(\"Email\")]),_c('th',{attrs:{\"scope\":\"col\"}},[_vm._v(\"Phone Number\")]),_c('th',{attrs:{\"scope\":\"col\"}},[_vm._v(\"Agency\")]),_c('th',{attrs:{\"scope\":\"col\"}},[_vm._v(\"Purpose\")]),_c('th',{attrs:{\"scope\":\"col\"}},[_vm._v(\"Visiting Time\")]),_c('th',{attrs:{\"scope\":\"col\"}},[_vm._v(\"Status\")]),_c('th',{attrs:{\"scope\":\"col\"}},[_vm._v(\"Detail\")])])])}]\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"wrap-dashboard\">\n    <div class=\"main-content\">\n      <div class=\"wrap-content\">\n        <div class=\"title-page\">Visitor</div>\n        <!-- <div class=\"filter\">\n          <div>\n            <div class=\"wrap-input\">\n              <label class=\"label-input\">Depositor</label>\n              <input type=\"text\" name=\"example\" list=\"exampleList\" class=\"input-datalist\" />\n              <datalist id=\"exampleList\">\n                <option value=\"ALL\"></option>\n                <option value=\"LP1\"></option>\n                <option value=\"LP2\"></option>\n                <option value=\"LP3\"></option>\n                <option value=\"IB1 ABI KB\"></option>\n              </datalist>\n            </div>\n            <div class=\"wrap-input\">\n              <label class=\"label-input\">Total Weight</label>\n              <span>40.000 gr</span>\n            </div>\n          </div>\n          <div>\n            <div class=\"wrap-input\">\n              <label class=\"label-input\">Periode</label>\n              <select>\n                <option selected value=\"all\">Year</option>\n                <option value=\"lp1\">Monthly</option>\n                <option value=\"lp2\">Weekly</option>\n                <option value=\"lp3\">Daily</option>\n              </select>\n            </div>\n            <div class=\"wrap-input\">\n              <label class=\"label-input\">Metal Type</label>\n              <span>Gold</span>\n            </div>\n          </div>\n          <div>\n            <div class=\"wrap-input\">\n              <label class=\"label-input\">Trading Contract</label>\n              <select>\n                <option value=\"ALL\" selected>ALL</option>\n                <option value=\"0.01gr\">KAU 0.01gr</option>\n                <option value=\"1gr\">1gr</option>\n              </select>\n            </div>\n            <div class=\"wrap-input\">\n              <label class=\"label-input\">Total Storage Fee </label>\n              <span>66.609.731,51</span>\n            </div>\n          </div>\n          <div>\n            <div class=\"wrap-input\">\n              <label class=\"label-input\">Allocated</label>\n              <select>\n                <option selected value=\"all\">ALL</option>\n                <option value=\"lp1\">Pool</option>\n                <option value=\"lp2\">Non Pool</option>\n              </select>\n            </div>\n            <div class=\"wrap-input\">\n              <label class=\"label-input\">Hub</label>\n              <span>Jakarta</span>\n            </div>\n          </div>\n        </div> -->\n        <div class=\"content\">\n          <table>\n            <thead>\n              <tr id=\"top\">\n                <th scope=\"col\" style=\"width: 70px\">No</th>\n                <th scope=\"col\">Name</th>\n                <th scope=\"col\">Email</th>\n                <th scope=\"col\">Phone Number</th>\n                <th scope=\"col\">Agency</th>\n                <th scope=\"col\">Purpose</th>\n                <th scope=\"col\">Visiting Time</th>\n                <th scope=\"col\">Status</th>\n                <th scope=\"col\">Detail</th>\n              </tr>\n            </thead>\n            <tbody>\n              <tr v-for=\"(visitor, i) in visitorDatas\" :key=\"visitor._id\">\n                <td>{{ (currentPage - 1) * perPage + (i + 1) }}</td>\n                <td>{{ visitor.personal_info.fullname }}</td>\n                <td>{{ visitor.personal_info.email }}</td>\n                <td>{{ visitor.personal_info.phone_number }}</td>\n                <td>{{ visitor.agency }}</td>\n                <td>{{ visitor.purpose }}</td>\n                <td>{{ visitor.visiting_time.start_date | formatTime }} - {{ visitor.visiting_time.end_date | formatTime }}</td>\n                <td>{{ visitor.status }}</td>\n                <td>\n                  <button type=\"button\" class=\"btn btn-outline-info btn-sm\" @click=\"openmodal(visitor._id)\">Detail</button>\n                </td>\n              </tr>\n            </tbody>\n          </table>\n          <b-modal ref=\"detail-visitor\" title=\"Detail Visitor\" hide-footer size=\"xl\">\n            <div class=\"wrap-detail\" v-if=\"detailVisitor\">\n              <div class=\"content-left\">\n                <h4>Transaction ID : {{ detailVisitor.transaction_id }}</h4>\n\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Nama</label>\n                  <span>:</span>\n                  <span>{{ detailVisitor.personal_info.fullname }}</span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Phone Number</label>\n                  <span>:</span>\n                  <span>{{ detailVisitor.personal_info.phone_number }}</span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Email</label>\n                  <span>:</span>\n                  <span>{{ detailVisitor.personal_info.email }}</span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Identity</label>\n                  <span>:</span>\n                  <span>{{ detailVisitor.personal_info.identity + \" - \" + detailVisitor.personal_info.identity_no }}</span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Address</label>\n                  <span>:</span>\n                  <span>{{ detailVisitor.personal_info.address }}</span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Agency</label>\n                  <span>:</span>\n                  <span>{{ detailVisitor.agency }}</span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Purpose</label>\n                  <span>:</span>\n                  <span>{{ detailVisitor.purpose }}</span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Description</label>\n                  <span>:</span>\n                  <span>{{ detailVisitor.description }}</span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Visiting Time</label>\n                  <span>:</span>\n                  <span>{{ detailVisitor.visiting_time.start_date | formatTime }} - {{ detailVisitor.visiting_time.end_date | formatTime }} </span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Selfie Photo</label>\n                  <span>:</span>\n                  <span @click=\"openViewImg(detailVisitor.file.selfie, 'Selfie Photo')\" class=\"btn-preview\"> View </span>\n                </div>\n                <div class=\"detail-visitorS\">\n                  <label for=\"\">Identity Picture</label>\n                  <span>:</span>\n                  <span @click=\"openViewImg(detailVisitor.file.identity, 'Identity Picture')\" class=\"btn-preview\">View</span>\n                </div>\n              </div>\n              <div class=\"content-right text-center\">\n                <div v-if=\"loadingImgPreview\">\n                  <b-spinner></b-spinner>\n                </div>\n                <div v-else-if=\"imgPreview != ''\">\n                  <h5>{{ titlePreview }}</h5>\n                  <img :src=\"imgPreview\" alt=\"\" />\n                </div>\n              </div>\n            </div>\n          </b-modal>\n          <b-pagination\n            v-model=\"currentPage\"\n            :total-rows=\"lengthData\"\n            :per-page=\"perPage\"\n            @change=\"handlePageChange\"\n            aria-controls=\"new-table\"\n            first-number\n            last-number\n            v-show=\"lengthData > 10\"\n          ></b-pagination>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport axios from \"axios\";\nexport default {\n  components: {},\n  data() {\n    return {\n      dataTransaction: [],\n      pageOfItems: [],\n      currentPage: 1,\n      perPage: 10,\n      lengthData: 1,\n      trade_id: [],\n      offset: 0,\n      visitorDatas: [],\n      detailVisitor: null,\n      titlePreview: \"\",\n      imgPreview: \"\",\n      loadingImgPreview: false,\n      form: {\n        startDate: \"\",\n        endDate: \"\",\n      },\n    };\n  },\n  mounted() {\n    this.getData(this.currentPage);\n  },\n  methods: {\n    async openViewImg(urlImg, title) {\n      this.loadingImgPreview = true;\n      let image = await axios.get(\"/v2\" + urlImg, { responseType: \"blob\" });\n      this.titlePreview = title;\n      this.imgPreview = URL.createObjectURL(new Blob([image.data], { type: image.data.type }));\n      this.loadingImgPreview = false;\n    },\n    openmodal(id) {\n      this.detailVisitor = null;\n      axios.get(\"/v2/clearing/admin/abx/visitor/detail/\" + id).then((res) => {\n        this.detailVisitor = res.data.data;\n        this.$refs[\"detail-visitor\"].show();\n      });\n    },\n    handlePageChange(value) {\n      this.getData(value);\n      window.scrollTo({ top: 0, behavior: \"smooth\" });\n    },\n    filterDate() {\n      axios\n        .get(\n          \"https://api2-dev.abicommodity.co.id/v1/counter/get/customer/transaction?offset=&limit=&startDate=\" + this.form.startDate + \"&endDate=\" + this.form.endDate\n        )\n        .then((res) => {\n          this.data = res.data.data.data;\n          this.lengthData = res.data.data.count;\n          for (let i = 0; i < this.data.length; i++) {\n            let trade;\n            let tradeSell;\n            trade = this.data[i].direction[0].trade_id;\n            tradeSell = this.data[i].direction[1].trade_id;\n            if (trade && tradeSell) {\n              this.data[i].direction[0].tradebuy = trade.split(\";\");\n              this.data[i].direction[1].tradeSell = tradeSell.split(\";\");\n            } else {\n              this.data[i].direction[0].tradebuy = \"\";\n              this.data[i].direction[1].tradeSell = \"\";\n            }\n          }\n        });\n    },\n    getData(value) {\n      let offset = (value - 1) * this.perPage;\n      axios.get(\"/v2/clearing/admin/abx/visitor/list?status[]=new&status[]=approve&offset=\" + offset).then((res) => {\n        this.visitorDatas = res.data.data.body;\n        this.lengthData = res.data.data.count;\n      });\n    },\n\n    Download() {\n      // var mywindow = window.open(\"\", \"PRINT\", \"height=400,width=600\");\n\n      // mywindow.document.write(\"<html><head><title>\" + document.title + \"</title>\");\n      // mywindow.document.write(\"</head><body >\");\n      // mywindow.document.write(\"<h1>\" + document.title + \"</h1>\");\n      // mywindow.document.write(document.getElementById(\"tableDetail\").innerHTML);\n      // mywindow.document.write(\"</body></html>\");\n\n      // mywindow.document.close(); // necessary for IE >= 10\n      // mywindow.focus(); // necessary for IE >= 10*/\n\n      // mywindow.print();\n      // mywindow.close();\n\n      var divToPrint = document.getElementById(\"tableDetail\");\n      var htmlToPrint = \"\" + '<style type=\"text/css\">' + \"table th, table td {\" + \"border:1px solid #000;\" + \"padding:0.5em;\" + \"}\" + \"</style>\";\n      htmlToPrint += divToPrint.outerHTML;\n      var newWin = window.open(\"\");\n      newWin.document.write(htmlToPrint);\n      newWin.print();\n      newWin.close();\n    },\n  },\n  computed: {\n    rows() {\n      return (this.currentPage - 1) * this.perPage;\n    },\n  },\n};\n</script>\n\n<style scoped>\n/*.wrap-dashboard {\n  min-height: 100vh;\n  margin: 0;\n  display: grid;\n  grid-template-rows: auto 1fr auto;\n}*/\n\n.title-page {\n  font-size: 25px;\n  font-weight: bold;\n  margin-bottom: 40px;\n}\n\n.wrap-content {\n  width: 98%;\n  height: 100%;\n  margin: 0 auto;\n  padding: 20px 25px;\n}\n\n.content {\n  display: flex;\n  gap: 1rem;\n  flex-wrap: wrap;\n  justify-content: center;\n}\n\n.detail-visitorS {\n  display: flex;\n  gap: 0.5rem;\n}\n\n.wrap-detail {\n  display: flex;\n  justify-content: space-between;\n  padding: 0 3rem;\n}\n\n.content-left,\n.content-right {\n  width: 100%;\n}\n\n.detail-visitorS label {\n  width: 7rem;\n}\n\n.detail-visitorS span:last-child {\n  font-weight: 600;\n}\n\n.btn-preview {\n  color: var(--scondary-color);\n  cursor: pointer;\n}\n\n.icon-trade {\n  width: 25px;\n}\n\n.footer {\n  background: var(--primary-color);\n  color: white;\n  padding: 20px 47px;\n  display: flex;\n  justify-content: space-between;\n  margin-top: auto;\n  height: 62px;\n}\n\n.filter {\n  display: flex;\n  gap: 1rem;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 20px;\n  font-size: 12px;\n  flex-wrap: wrap;\n}\n\n.wrap-input {\n  margin-bottom: 10px;\n}\n.label-input {\n  width: 108px;\n}\nselect {\n  width: 130px;\n  border-radius: 3px;\n  border-color: #a5a5a5a5;\n  padding: 3px;\n}\n\n.input-datalist {\n  border-radius: 3px;\n  border: 1px solid #a5a5a5a5;\n  padding: 1.5px 5px;\n}\n\n.card {\n  width: 314px;\n  font-size: 14px;\n  border-radius: 10px;\n}\n\n.card-header {\n  padding: 1rem;\n}\n\n.buyer,\n.seller,\n.card-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.title {\n  font-size: 12px;\n  position: relative;\n  left: 20px;\n}\n\n.title::before {\n  content: \"\";\n  position: absolute;\n  width: 11px;\n  height: 11px;\n  border-radius: 50%;\n  background: var(--scondary-color);\n  left: -17px;\n  top: 3px;\n}\n\n.buyer {\n  margin-bottom: 20px;\n}\n\n.content-right {\n  text-align: right;\n}\n\n.amount {\n  font-weight: bold;\n}\n\n.btn-primer {\n  background: var(--scondary-color);\n  border: none;\n  color: #ffffff;\n  padding: 5px 25px;\n  border-radius: 5px;\n}\n\n.btn-primer:hover {\n  background-color: var(--scondary-color-hover);\n}\n\n@media print {\n  * {\n    display: none;\n  }\n  table {\n    display: block;\n  }\n}\n</style>\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Visitor.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Visitor.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Visitor.vue?vue&type=template&id=7f8fd7fa&scoped=true&\"\nimport script from \"./Visitor.vue?vue&type=script&lang=js&\"\nexport * from \"./Visitor.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Visitor.vue?vue&type=style&index=0&id=7f8fd7fa&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  \"7f8fd7fa\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}