{"version":3,"sources":["webpack:///./src/components/component/CardProductServicePc.vue?f806","webpack:///./src/components/component/CardProductServicePc.vue?d199","webpack:///src/components/component/CardProductServicePc.vue","webpack:///./src/components/component/CardProductServicePc.vue?5420","webpack:///./src/components/component/CardProductServicePc.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","on","$event","clickDetail","card","style","staticStyle","_v","_s","name","simple_desc","price","price_type","price_text","discountedPrice","isDiscount","_f","_e","discount_type","discountText","category2","undefined","status","class","attrs","statusText","staticRenderFns","component"],"mappings":"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","file":"js/chunk-934cece2.15c7e308.js","sourcesContent":["export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--11-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--11-oneOf-1-2!../../../node_modules/stylus-loader/index.js??ref--11-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./CardProductServicePc.vue?vue&type=style&index=0&id=63321e16&lang=stylus&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"card-container unselect\",on:{\"click\":function($event){return _vm.clickDetail(_vm.card)}}},[_c('div',{staticClass:\"card-content\"},[_c('div',{staticClass:\"flex-align\"},[_c('div',{staticClass:\"card-img\",style:(_vm.imgStyle)}),_c('div',{staticStyle:{\"flex\":\"1\",\"padding-left\":\"12px\"}},[_c('div',{staticClass:\"subtitle6 main margin-top-12\"},[_vm._v(_vm._s(_vm.card.name))]),_c('div',{staticClass:\"body5 sub3 ellipsis-2\"},[_vm._v(_vm._s(_vm.card.simple_desc))])])]),_c('div',{staticClass:\"divider\"}),_c('div',{staticClass:\"flex-between\"},[_c('div',[(_vm.card.price.price_type === 1)?_c('div',{staticClass:\"margin-top-8\"},[_vm._v(_vm._s(_vm.card.price.price_text))]):(_vm.discountedPrice(_vm.card)>0)?_c('div',{staticClass:\"margin-top-8\"},[(_vm.isDiscount(_vm.card))?_c('div',{staticClass:\"body6 sub4 text-line-through\"},[_vm._v(_vm._s(_vm._f(\"currency\")(_vm.card.price.price)))]):_vm._e(),_c('div',{staticClass:\"flex-align\"},[(_vm.card.price.discount_type===0)?_c('div',{staticClass:\"margin-right-4 primary body4-bold\"},[_vm._v(_vm._s(_vm.discountText(_vm.card)))]):_vm._e(),_c('div',{staticClass:\"body4-bold\"},[_c('span',{staticClass:\"sub\"},[_vm._v(_vm._s(_vm._f(\"currencyNum\")(_vm.discountedPrice(_vm.card))))]),_c('span',{staticClass:\"body4 sub2\"},[_vm._v(\"원\")]),(_vm.card.price.is_subscription)?_c('span',{staticClass:\"body4 sub3\"},[_vm._v(\"/월\")]):_vm._e(),(_vm.card.category2!==42)?_c('span',{staticClass:\"body4 sub2 margin-left-4\"},[_vm._v(\"~\")]):_vm._e()])])]):_vm._e()]),(_vm.card.status!==undefined)?_c('div',{class:(\"card-status-\" + (_vm.card.status))},[(_vm.card.status===2)?_c('svg',{attrs:{\"width\":\"24\",\"height\":\"24\",\"viewBox\":\"0 0 24 24\",\"fill\":\"none\"}},[_c('path',{attrs:{\"d\":\"M20 6L9 17L4 12\",\"stroke\":\"#ffffff\",\"stroke-width\":\"4\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}})]):_vm._e(),_vm._v(_vm._s(_vm.statusText(_vm.card.status))+\" \")]):_vm._e()])])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <div class=\"card-container unselect\" @click=\"clickDetail(card)\">\r\n    <div class=\"card-content\">\r\n      <div class=\"flex-align\">\r\n        <div class=\"card-img\" :style=\"imgStyle\"></div>\r\n        <div style=\"flex:1;padding-left:12px\">\r\n          <div class=\"subtitle6 main margin-top-12\">{{ card.name }}</div>\r\n          <div class=\"body5 sub3 ellipsis-2\">{{ card.simple_desc }}</div>\r\n        </div>\r\n      </div>\r\n      <div class=\"divider\"></div>\r\n      <div class=\"flex-between\">\r\n        <!-- 가격 정보 -->\r\n        <div>\r\n          <div class=\"margin-top-8\" v-if=\"card.price.price_type === 1\">{{ card.price.price_text }}</div>\r\n          <div v-else-if=\"discountedPrice(card)>0\" class=\"margin-top-8\">\r\n            <div class=\"body6 sub4 text-line-through\" v-if=\"isDiscount(card)\">{{ card.price.price | currency }}</div>\r\n            <div class=\"flex-align\">\r\n              <div class=\"margin-right-4 primary body4-bold\" v-if=\"card.price.discount_type===0\">{{ discountText(card) }}</div>\r\n              <div class=\"body4-bold\">\r\n                <span class=\"sub\">{{ discountedPrice(card) | currencyNum }}</span>\r\n                <span class=\"body4 sub2\">원</span>\r\n                <span class=\"body4 sub3\" v-if=\"card.price.is_subscription\">/월</span>\r\n                <span class=\"body4 sub2 margin-left-4\" v-if=\"card.category2!==42\">~</span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div :class=\"`card-status-${card.status}`\" v-if=\"card.status!==undefined\">\r\n          <svg v-if=\"card.status===2\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <path d=\"M20 6L9 17L4 12\" stroke=\"#ffffff\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n          </svg>{{ statusText(card.status) }}\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n  export default {\r\n    name: \"CardProductServicePc\",\r\n    props: {\r\n      card: {\r\n        type: Object\r\n      }\r\n    },\r\n    created() {\r\n      this.setTagLength();\r\n    },\r\n    data() {\r\n      return {\r\n        tagLen: 0\r\n      }\r\n    },\r\n    watch: {\r\n      'card.tags'() {\r\n        this.setTagLength();\r\n      }\r\n    },\r\n    computed: {\r\n      imgStyle() {\r\n        return `backgroundImage: url(${this.card.img})`;\r\n      }\r\n    },\r\n    methods: {\r\n      setTagLength() {\r\n        this.tagLen = 0;\r\n        if(this.card.tags.length>0) {\r\n          let len = 0;\r\n          let limit = 20;\r\n          this.card.tags.forEach(tag => {\r\n            len += tag.length;\r\n            if(len < limit) {\r\n              this.tagLen++;\r\n              limit = this.tagLen === 1 ? 19 : 16;\r\n            }\r\n          });\r\n        }\r\n        if(this.tagLen===0) {\r\n          this.tagLen = 1;\r\n        }\r\n      },\r\n      statusText(status) {\r\n        const arr = {\r\n          0: '추가',\r\n          1: '신청 중',\r\n          2: '이용 중'\r\n        };\r\n\r\n        return arr[status];\r\n      },\r\n      discountText(product) {\r\n        let text = '';\r\n        if (this.isDiscount(product)) {\r\n          if (product.price.discount_rate !== 0 && product.price.discount_type === 0) {\r\n            text = product.price.discount_rate + '%'\r\n          } else if (product.price.discount_price !== 0 && product.price.discount_type === 1) {\r\n            text = product.price.discount_price + '원';\r\n          }\r\n        }\r\n        return text;\r\n      },\r\n      // 할인 여부\r\n      isDiscount(product) {\r\n        if (product.price.is_discount && product.price.discount_start !== null && product.price.discount_end !== null) {\r\n          let currentDate = this.dayjs().format('YYYY-MM-DD HH:mm');\r\n          return !(currentDate < product.price.discount_start || currentDate > product.price.discount_end);\r\n        } else if (product.price.discount_start !== null && product.price.discount_end === null) {\r\n          let currentDate = this.dayjs().format('YYYY-MM-DD HH:mm');\r\n          return currentDate >= product.price.discount_start;\r\n        } else if (product.price.discount_start === null && product.price.discount_end !== null) {\r\n          let currentDate = this.dayjs().format('YYYY-MM-DD HH:mm');\r\n          return currentDate <= product.price.discount_end;\r\n        } else {\r\n          return false;\r\n        }\r\n      },\r\n      // 상품 가격\r\n      discountedPrice(product) {\r\n        let total = 0;\r\n        if (this.isDiscount(product)) {\r\n          if (product.price.discount_rate !== 0 && product.price.discount_type === 0) {\r\n            total = product.price.price * (1 - (product.price.discount_rate / 100))\r\n          } else if (product.price.discount_price !== 0 && product.price.discount_type === 1) {\r\n            total = product.price.price - product.price.discount_price;\r\n          }\r\n        } else total = product.price.price;\r\n        return total;\r\n      },\r\n      imgField(img) {\r\n        let style = {\r\n          backgroundImage: `url(${this.image(img)})`,\r\n          backgroundSize: 'cover',\r\n          backgroundPosition: 'top'\r\n        };\r\n        return style;\r\n      },\r\n      clickDetail(card) {\r\n        this.routeGa('',`추가서비스 카드(${card.name})`, card.name);\r\n        if (this.$route.path.search('detail') > -1) {\r\n          this.$router.push(`/market/detail?id=${card.id}`)\r\n        }\r\n        else if(this.$route.path.search('app_market') > -1) {\r\n          this.$router.push(`/app_market/detail?id=${card.id}`)\r\n        }\r\n        else {\r\n          this.$router.push(`/market/detail?id=${card.id}`)\r\n        }\r\n      },\r\n    }\r\n  }\r\n</script>\r\n\r\n<style lang=\"stylus\" scoped>\r\n  @import '~assets/css/lp_main'\r\n\r\n  .card-container\r\n    background-color white\r\n    border-radius 8px\r\n    border 1px solid $gray2\r\n\r\n  .card-img\r\n    width 60px\r\n    height 60px\r\n    border-radius 10px\r\n    background-color $gray3\r\n    display flex\r\n    align-items center\r\n    justify-content center\r\n    background-repeat no-repeat\r\n    background-size cover\r\n    background-position center\r\n\r\n  .card-content\r\n    padding 20px\r\n\r\n  .tag\r\n    border 1px solid $gray1\r\n    border-radius 50px\r\n    padding 2px 8px\r\n    margin-right 4px\r\n\r\n  .card-status-0\r\n  .card-status-1\r\n  .card-status-2\r\n    border-radius 50px\r\n    padding 0 20px\r\n    line-height 32px\r\n    height 32px\r\n    margin-top 12px\r\n\r\n  .card-status-0\r\n    background-color $primary\r\n    color white\r\n  .card-status-1\r\n    background-color $primary-light2\r\n    color $primary\r\n  .card-status-2\r\n    background-color $main\r\n    color white\r\n    svg\r\n      margin-right 4px\r\n      width 12px\r\n      height 12px\r\n\r\n  .divider\r\n    width 100%\r\n    height 1px\r\n    background-color $gray2\r\n    margin 12px 0\r\n\r\n</style>\r\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!./CardProductServicePc.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!./CardProductServicePc.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./CardProductServicePc.vue?vue&type=template&id=63321e16&scoped=true&\"\nimport script from \"./CardProductServicePc.vue?vue&type=script&lang=js&\"\nexport * from \"./CardProductServicePc.vue?vue&type=script&lang=js&\"\nimport style0 from \"./CardProductServicePc.vue?vue&type=style&index=0&id=63321e16&lang=stylus&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  \"63321e16\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}