{"version":3,"sources":["webpack:///./src/developing/components/communication/subcomponents/Webboard/TopicCard.vue?8599","webpack:///src/developing/components/communication/subcomponents/Webboard/TopicCard.vue","webpack:///./src/developing/components/communication/subcomponents/Webboard/TopicCard.vue?7c18","webpack:///./src/developing/components/communication/subcomponents/Webboard/TopicCard.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","attrs","data","staticClass","_l","createReplyList","offset","limit","reply","key","id","_v","_s","content","role","$t","_e","user_name","_i18n","locale","date","staticRenderFns","components","MessageHeader","props","type","Object","required","methods","Array","isArray","webBoardReplies","length","_reply","original","user","user_id","local","user_name_local","th","en","user_name_eng","replyMessage","updatedAt","replyList","push","component"],"mappings":"uHAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACA,EAAG,gBAAgB,CAACE,MAAM,CAAC,KAAON,EAAIO,KAAK,gBAAe,KAASH,EAAG,UAAU,CAACI,YAAY,WAAW,CAACJ,EAAG,MAAM,CAACI,YAAY,yBAAyB,CAACR,EAAIS,GAAIT,EAAIU,gBAAgB,CAAEC,OAAQX,EAAIW,OAAQC,MAAOZ,EAAIY,SAAU,SAASC,GAAO,MAAO,CAACT,EAAG,MAAM,CAACU,IAAID,EAAME,IAAI,CAACX,EAAG,MAAM,CAACI,YAAY,iBAAiB,CAACR,EAAIgB,GAAG,IAAIhB,EAAIiB,GAAGJ,EAAMK,SAAS,OAAOd,EAAG,MAAM,CAACI,YAAY,YAAY,CAAiB,YAAfK,EAAMM,KAAoBf,EAAG,OAAO,CAACJ,EAAIgB,GAAG,IAAIhB,EAAIiB,GAAGjB,EAAIoB,GAAG,oBAAoB,OAAOpB,EAAIqB,KAAKrB,EAAIgB,GAAG,IAAIhB,EAAIiB,GAAGJ,EAAMS,UAAUtB,EAAIuB,MAAMC,SAAS,OAAOpB,EAAG,MAAM,CAACI,YAAY,cAAc,CAACR,EAAIgB,GAAG,IAAIhB,EAAIiB,GAAGJ,EAAMY,MAAM,OAAOrB,EAAG,aAAY,MAAM,IACxuBsB,EAAkB,GC+CtB,G,8BAAA,CAQEC,WAAY,CACVC,cAAe,WAAnB,yDAEEC,MAAO,CACLtB,KAAM,CACJuB,KAAMC,OACNC,UAAU,IAGdzB,KAjBF,WAkBI,MAAO,CACLI,OAAQ,EACRC,MAAO,KAGXqB,QAAS,CACPvB,gBADJ,WAIA,IAHA,EAGA,uDAHA,CACA,SACA,UAEA,KACA,qBAEM,GAAIwB,MAAMC,QAAQlC,KAAKM,KAAK6B,kBAAoBnC,KAAKM,KAAK6B,gBAAgBC,OAAS,EAGjF,IAFA,IAAR,sDAEA,cACU,IAAV,kCAEA,gCACA,4CACA,0CACA,cACA,8CACA,0CAEA,GACYtB,GAAIuB,EAAOvB,GACXwB,SAAUD,EACVE,KAAZ,EACYC,QAAZ,EACYnB,UAAW,CACToB,MAAOC,EACPC,GAAID,EACJE,GAAIC,GAEN5B,QAASoB,EAAOS,aAChB5B,KAAZ,EAAY,KAAZ,EACYM,KAAMa,EAAOU,WAGfC,EAAUC,KAAKrC,GAInB,OAAOoC,MC/GkY,I,YCO3YE,EAAY,eACd,EACApD,EACA2B,GACA,EACA,KACA,WACA,MAIa,aAAAyB,E","file":"js/chunk-2d21ee69.e2778f98.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('MessageHeader',{attrs:{\"data\":_vm.data,\"show-content\":false}}),_c('vx-card',{staticClass:\"mt-base\"},[_c('div',{staticClass:\"webboard-reply-bubble\"},[_vm._l((_vm.createReplyList({ offset: _vm.offset, limit: _vm.limit })),function(reply){return [_c('div',{key:reply.id},[_c('div',{staticClass:\"reply-message\"},[_vm._v(\" \"+_vm._s(reply.content)+\" \")]),_c('div',{staticClass:\"reply-by\"},[(reply.role === 'teacher')?_c('span',[_vm._v(\" \"+_vm._s(_vm.$t('general.teacher'))+\" \")]):_vm._e(),_vm._v(\" \"+_vm._s(reply.user_name[_vm._i18n.locale])+\" \")]),_c('div',{staticClass:\"reply-date\"},[_vm._v(\" \"+_vm._s(reply.date)+\" \")]),_c('hr')])]})],2)])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<!--\n=========================================================================================\n    Message Card\n==========================================================================================\n-->\n\n<!-- \n  - Show Webboard UI with Fast Reply\n    [ ] Show Thread Title\n    [ ] Show Thread Author      \n    [ ] Show Thread Last 10 Replies\n    [ ] Show Thream Created Time\n    [ ] Show Reply Box          \n      [ ] Show Reply Text Area  \n      [ ] Show Reply Send Button\n-->                             \n                                \n<template>                      \n  <div>                         \n    <MessageHeader :data=\"data\" :show-content=\"false\" />\n    <vx-card class=\"mt-base\">   \n                                     \n      <div class=\"webboard-reply-bubble\">\n        <template v-for=\"reply in createReplyList({ offset, limit })\">\n          <div :key=\"reply.id\" >     \n            <!-- {{ reply }} -->     \n            <div class=\"reply-message\">\n              {{ reply.content }}    \n            </div>                   \n            <div class=\"reply-by\">   \n              <span v-if=\"reply.role === 'teacher'\">\n                {{ $t('general.teacher')}}\n              </span>                \n              {{ reply.user_name[_i18n.locale] }}\n            </div>                   \n            <div class=\"reply-date\"> \n              {{ reply.date }}       \n            </div>                   \n            <hr />                   \n          </div>                     \n        </template>                  \n      </div>                         \n                                     \n    </vx-card>                       \n  </div>                             \n</template>                          \n                                     \n<script>                             \nexport default {                     \n  // inject: {                       \n  //   components: {                 \n  //     default: {                  \n  //       WeboardUI: () => import(\"@/developing/components/chat\")\n  //     }                           \n  //   }                             \n  // },                              \n  components: {                      \n    MessageHeader: () => import(\"./MessageHeader\")\n  },                                 \n  props: {                           \n    data: {                          \n      type: Object,                  \n      required: true                 \n    }                                \n  },                                 \n  data() {                           \n    return {                         \n      offset: 0,                     \n      limit: 10,                     \n    }                                                                \n  },                                                                 \n  methods: {                                                         \n    createReplyList(options = {                                      \n      offset: 0,                                                     \n      limit: 10                                                      \n    }) {                                                             \n      const replyList = [];                                          \n      const { offset, limit } = options;                             \n                                                                     \n      if (Array.isArray(this.data.webBoardReplies) && this.data.webBoardReplies.length > 0) {\n        const max = Math.min(this.message.webBoardReplies.length - 1, offset + limit);\n                                                                     \n        for (let i = offset; i <= max; i++) {                        \n          const _reply = this.message.webBoardReplies[i];            \n                                                                     \n          const role = _reply.teacher ? \"teacher\" : \"student\";       \n          const code = role === \"teacher\" ? _reply.teacherCode : _reply.studentCode;\n          const user = role === \"teacher\" ? _reply.teacher : _reply.student || null;\n          const user_id = user ? user.id : null;                     \n          const user_name_local = user ? user.firstNameLocal + \" \" + user.lastNameLocal : null;\n          const user_name_eng = user ? user.firstNameEng + \" \" + user.lastNameEng : null;\n                                                                     \n          const reply = {                                            \n            id: _reply.id,                                           \n            original: _reply,                                        \n            user,                                                    \n            user_id,                                                 \n            user_name: {                                             \n              local: user_name_local,                                \n              th: user_name_local,                                   \n              en: user_name_eng                                      \n            },                                                       \n            content: _reply.replyMessage,                            \n            role, code,                                              \n            date: _reply.updatedAt,                                  \n          };                                                         \n                                                                     \n          replyList.push(reply);                                     \n        }                                                            \n      }                                                              \n                                                                     \n      return replyList;                                              \n    }                                                                \n  }                                                                  \n}                                                                    \n</script>                                                            \n                                                                     \n<style lang=\"scss\" scoped>                                           \n.webboard-reply-bubble {                                             \n\tposition: relative;                                                 \n\tmax-width: 30em;                                                    \n\tbackground-color: #fff;                                             \n\tpadding: 1.125em 1.5em;                                             \n  font-size: 1.25em;                                                 \n  border-radius: 12px;                                               \n  box-shadow: 0 0.125rem 0.1rem rgba(0, 0, 0, 0.2), 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.2);\n                                                                     \n  &._topic {                                                         \n    box-shadow: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.2), 0 0.125rem 0.1rem rgba(0, 0, 0, 0.2);\n    background: #fafafa;                                             \n    max-width: 100% !important;                                      \n                                                                     \n    ::before {                                                       \n      // layout                                                      \n      content: '';                                                   \n      position: absolute;                                            \n      width: 0;                                                      \n      height: 0;                                                     \n      bottom: 96%;                                                   \n      left: 1.2em; // offset should move with padding of parent      \n      border: .75rem solid transparent;                              \n      border-top: none;                                              \n                                                                     \n      // looks                                                       \n      // background: #fafafa;                                        \n      border-bottom-color: #f7f7f7;                                  \n      filter: drop-shadow(0 -1px 1px rgba(0, 0, 0, 0.05));           \n    }                                                                \n  }                                                                  \n                                                                     \n  &._reply {                                                         \n                                                                     \n    margin-left: auto;                                               \n    text-align: right;                                               \n                                                                     \n    &::before {                                                      \n      // layout                                                      \n      content: '';                                                   \n      position: absolute;                                            \n      width: 0;                                                      \n      height: 0;                                                     \n      bottom: 20%;                                                   \n      right: -1.1rem; // offset should move with padding of parent   \n      border: .75rem solid transparent;                              \n      border-top: none;                                              \n                                                                     \n      // looks                                                       \n      border-bottom-color: #fff;                                     \n      filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, .2)); \n      transform: rotate(90deg);                                      \n    }                                                                \n  }                                                                  \n                                                                     \n  &._response {                                                      \n                                                                     \n    &::before {                                                      \n      // layout                                                      \n      content: '';                                                   \n      position: absolute;                                            \n      width: 0;                                                      \n      height: 0;                                                     \n      bottom: 60%;                                                   \n      left: -1rem; // offset should move with padding of parent      \n      border: .75rem solid transparent;                              \n      border-top: none;                                              \n                                                                     \n      // looks                                                       \n      border-bottom-color: #fff;                                     \n      filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, 0.2));\n      transform: rotate(-90deg);                                     \n    }                                                                \n  }                                                                  \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!./TopicCard.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!./TopicCard.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./TopicCard.vue?vue&type=template&id=494a8888&scoped=true&\"\nimport script from \"./TopicCard.vue?vue&type=script&lang=js&\"\nexport * from \"./TopicCard.vue?vue&type=script&lang=js&\"\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  \"494a8888\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}