{"version":3,"sources":["webpack:///./src/views/Support/Support.vue?45ef","webpack:///src/views/Support/Support.vue","webpack:///./src/views/Support/Support.vue?fd7d","webpack:///./src/views/Support/Support.vue?57e7","webpack:///./src/views/Support/Support.vue?8749"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticStyle","staticClass","attrs","_v","on","$event","openTawkTo","padding","conversationItemSelected","backToConversationList","_e","toggleFilterByDate","_s","_f","createdAt","refreshConversation","model","value","callback","$$v","dateFilterVal","expression","refreshChatHistory","messageItems","length","scrollToEnd","directives","name","rawName","style","suppressScrollX","conversationItems","_l","conversationItem","key","id","changeConversation","lastMessage","messageItem","class","isContactMsg","content","staticRenderFns","component"],"mappings":"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","file":"js/chunk-71a599e2.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('VuePerfectScrollbar',{staticStyle:{\"height\":\"calc(100vh - 4rem)\",\"background-color\":\"#f5f5f5\"}},[_c('div',{staticClass:\"d-flex flex-column align-items-center\",staticStyle:{\"margin-top\":\"2.6rem\"}},[_c('img',{staticStyle:{\"height\":\"2rem\"},attrs:{\"src\":\"/logo/iRender-fulltext.svg\",\"alt\":\"\"}}),_c('div',{staticStyle:{\"color\":\"#1967d2\",\"font-size\":\"1.5rem\",\"margin-top\":\"0.5rem\",\"text-shadow\":\"2px 2px #ffffff\"}},[_vm._v(\"\\n            iRender Support Center\\n        \")])]),_c('div',{staticClass:\"d-flex flex-column flex-lg-row m-auto justify-content-center\",staticStyle:{\"width\":\"auto\"}},[_c('div',{staticClass:\"d-flex flex-column align-items-center mt-5 mb-5 row-eq-height\"},[_c('div',[_c('el-card',{staticClass:\"box-card mb-5\"},[_c('div',{staticClass:\"d-flex flex-row justify-content-center align-items-center\"},[_c('div',{staticClass:\"d-flex justify-content-center align-items-center\"},[_c('img',{staticStyle:{\"height\":\"17.5rem\"},attrs:{\"src\":\"/background/support/support-background-1.svg\",\"alt\":\"\"}})]),_c('div',{staticClass:\"d-flex flex-column flex-fill align-items-center\",staticStyle:{\"margin-left\":\"1rem\"}},[_c('div',{staticClass:\"d-flex justify-content-center\",staticStyle:{\"font-size\":\"1.2rem\",\"color\":\"#42a5f5\"}},[_vm._v(\"\\n                                Live support 24/7\\n                            \")]),_c('div',{staticClass:\" d-flex flex-row justify-content-center align-items-center flex-fill mt-5 \"},[_c('div',{staticClass:\" d-flex flex-column justify-content-center align-items-end mr-2 \",staticStyle:{\"color\":\"#9e9e9e\",\"font-size\":\"0.85rem\"}},[_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_vm._v(\"\\n                                        Skype support\\n                                    \")]),_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_vm._v(\"\\n                                        Quick chat\\n                                    \")])]),_c('div',{staticClass:\"d-flex flex-column justify-content-center ml-2\",staticStyle:{\"font-size\":\"0.85rem\"}},[_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_c('el-link',{attrs:{\"href\":\"https://join.skype.com/invite/qo5nEkWfKgyF\",\"target\":\"_blank\",\"underline\":false}},[_vm._v(\"iRender Support\")])],1),_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_c('el-button',{attrs:{\"type\":\"text\"},on:{\"click\":function($event){return _vm.openTawkTo()}}},[_vm._v(\"Chat now\")])],1)])])])])]),_c('el-card',{staticClass:\"box-card\"},[_c('div',{staticClass:\"d-flex flex-row justify-content-center align-items-center\"},[_c('div',{staticClass:\"d-flex flex-column flex-fill align-items-center\",staticStyle:{\"margin-left\":\"1rem\"}},[_c('div',{staticClass:\"d-flex justify-content-center\",staticStyle:{\"font-size\":\"1.2rem\",\"color\":\"#42a5f5\"}},[_vm._v(\"\\n                                Receive complaints and questions\\n                            \")]),_c('div',{staticClass:\" d-flex flex-row justify-content-center align-items-center flex-fill mt-5 \"},[_c('div',{staticClass:\" d-flex flex-column justify-content-center align-items-end mr-2 \",staticStyle:{\"color\":\"#9e9e9e\",\"font-size\":\"0.85rem\"}},[_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_vm._v(\"\\n                                        Email\\n                                    \")]),_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_vm._v(\"\\n                                        Whatsapp\\n                                    \")]),_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_vm._v(\"\\n                                        Skype\\n                                    \")]),_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_vm._v(\"\\n                                        Zalo\\n                                    \")])]),_c('div',{staticClass:\"d-flex flex-column justify-content-center ml-2\",staticStyle:{\"font-size\":\"0.85rem\"}},[_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_c('el-link',{attrs:{\"href\":\"mailto:support@irender.net\",\"target\":\"_blank\",\"underline\":false}},[_vm._v(\"support@irender.net\")])],1),_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_c('el-link',{attrs:{\"href\":\"whatsapp://send?phone=+84912785500&text=Hello%2C%20World!\",\"target\":\"_blank\",\"underline\":false}},[_vm._v(\"+(84) 912-785-500\")])],1),_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_c('el-link',{attrs:{\"href\":\"https://join.skype.com/invite/qo5nEkWfKgyF\",\"target\":\"_blank\",\"underline\":false}},[_vm._v(\"iRender Support\")])],1),_c('div',{staticClass:\"d-flex align-items-center\",staticStyle:{\"height\":\"1.75rem\"}},[_c('el-link',{attrs:{\"href\":\"http://zalo.me/+84962868890\",\"target\":\"_blank\",\"underline\":false}},[_vm._v(\"+(84)\\n                                            962-868-890\")])],1)])])]),_c('div',{staticClass:\"d-flex justify-content-center align-items-center\"},[_c('img',{staticStyle:{\"height\":\"17.5rem\"},attrs:{\"src\":\"/background/support/support-background-2.svg\",\"alt\":\"\"}})])])])],1)]),_c('div',{staticClass:\"ml-0 ml-lg-4 mt-0 mt-lg-5 d-flex flex-row flex-lg-column justify-content-center align-items-center mb-5 chat-history-block\"},[_c('el-card',{staticClass:\"box-card m-auto d-block d-lg-flex flex-column chat-history-box flex-fill w-100\",attrs:{\"body-style\":{ padding: '0.5rem 0' }}},[_c('div',{staticClass:\"d-flex align-items-center w-100\"},[_c('div',{staticClass:\"flex-fill d-flex align-items-center pl-2\",staticStyle:{\"font-size\":\"1.2rem\",\"color\":\"#42a5f5\"}},[(_vm.conversationItemSelected !== null)?_c('div',[_c('el-tooltip',{attrs:{\"content\":\"Go back list conversations\",\"placement\":\"top\"}},[_c('el-button',{staticClass:\"mr-1 p-0 m-0\",attrs:{\"type\":\"text\"},on:{\"click\":_vm.backToConversationList}},[_c('i',{staticClass:\"el-icon-arrow-left\",staticStyle:{\"font-size\":\"1.5rem\"}})])],1)],1):_vm._e(),_c('transition',{attrs:{\"name\":\"fade\"}},[(_vm.conversationItemSelected === null && !_vm.toggleFilterByDate)?_c('div',{staticClass:\"text-nowrap\"},[_c('i',{staticClass:\"el-icon-chat-line-round\"}),_vm._v(\" Conversations\\n                            \")]):_vm._e()]),_c('transition',{attrs:{\"name\":\"fade\"}},[(_vm.conversationItemSelected !== null)?_c('div',[_c('i',{staticClass:\"el-icon-chat-line-round\"}),_vm._v(\" Conversation \"+_vm._s(_vm._f(\"pretyDateUtcToLocal\")(_vm.conversationItemSelected.createdAt))+\"\\n                            \")]):_vm._e()])],1),_c('div',{staticClass:\"d-flex align-items-center\"},[_c('transition',{attrs:{\"name\":\"slide\"}},[(_vm.conversationItemSelected === null && _vm.toggleFilterByDate)?_c('div',{staticClass:\"mr-2\"},[_c('el-date-picker',{attrs:{\"range-separator\":\"To\",\"size\":\"mini\",\"type\":\"date\",\"format\":\"yyyy-MM-dd\",\"value-format\":\"yyyy-MM-dd\",\"placeholder\":\"Pick a date\"},on:{\"change\":_vm.refreshConversation},model:{value:(_vm.dateFilterVal),callback:function ($$v) {_vm.dateFilterVal=$$v},expression:\"dateFilterVal\"}})],1):_vm._e()]),_c('div',{staticClass:\"pr-1\",staticStyle:{\"background-color\":\"#fff\"}},[(_vm.conversationItemSelected === null && !_vm.toggleFilterByDate)?_c('el-tooltip',{attrs:{\"content\":\"Filter by date\",\"placement\":\"top\"}},[_c('el-button',{staticClass:\"mr-2 p-0 m-0\",attrs:{\"type\":\"text\"},on:{\"click\":function($event){_vm.toggleFilterByDate = true}}},[_c('i',{staticClass:\"el-icon-date\",staticStyle:{\"font-size\":\"1.5rem\"}})])],1):_vm._e(),(_vm.conversationItemSelected === null && _vm.toggleFilterByDate)?_c('el-tooltip',{attrs:{\"content\":\"Close filter\",\"placement\":\"top\"}},[_c('el-button',{staticClass:\"mr-2 p-0 m-0\",attrs:{\"type\":\"text\"},on:{\"click\":function($event){_vm.dateFilterVal = null; _vm.toggleFilterByDate = false; _vm.refreshConversation();}}},[_c('i',{staticClass:\"el-icon-close text-danger\",staticStyle:{\"font-size\":\"1.5rem\"}})])],1):_vm._e(),(_vm.conversationItemSelected === null)?_c('el-tooltip',{attrs:{\"content\":\"Refresh\",\"placement\":\"top\"}},[_c('el-button',{staticClass:\"mr-2 p-0 m-0\",attrs:{\"type\":\"text\"},on:{\"click\":_vm.refreshConversation}},[_c('i',{staticClass:\"el-icon-refresh\",staticStyle:{\"font-size\":\"1.5rem\"}})])],1):_vm._e(),(_vm.conversationItemSelected !== null)?_c('el-tooltip',{attrs:{\"content\":\"Refresh\",\"placement\":\"top\"}},[_c('el-button',{staticClass:\"mr-2 p-0 m-0\",attrs:{\"type\":\"text\"},on:{\"click\":_vm.refreshChatHistory}},[_c('i',{staticClass:\"el-icon-refresh\",staticStyle:{\"font-size\":\"1.5rem\"}})])],1):_vm._e(),(_vm.conversationItemSelected !== null && _vm.messageItems.length > 0)?_c('el-tooltip',{staticClass:\"ml-2\",attrs:{\"content\":\"Go to last message\",\"placement\":\"top\"}},[_c('el-button',{staticClass:\"mr-2 p-0 m-0\",attrs:{\"type\":\"text\"},on:{\"click\":_vm.scrollToEnd}},[_c('i',{staticClass:\"el-icon-bottom\",staticStyle:{\"font-size\":\"1.5rem\"}})])],1):_vm._e()],1)],1)]),_c('div',{staticClass:\"chat-box-content flex-fill position-relative ml-2 mr-2\"},[_c('div',{directives:[{name:\"loading\",rawName:\"v-loading\",value:(_vm.isLoadingConversation),expression:\"isLoadingConversation\"}],staticClass:\"position-absolute d-flex flex-column w-100 h-100 animatied-left-position\",style:((\"left: \" + (_vm.conversationItemSelected === null ? 0 : -100) + \"%; z-index: \" + (_vm.conversationItemSelected === null ? 'auto' : -1) + \";\"))},[_c('VuePerfectScrollbar',{staticClass:\"flex-fill w-100 pr-3 mt-2 pr-2 list-group-wrapper\",staticStyle:{\"height\":\"100px\"},attrs:{\"id\":\"chatScrollerConversation\",\"settings\":{ suppressScrollX: true }}},[(_vm.conversationItems.length > 0)?_c('div',{staticClass:\"mt-2 ml-2 w-100\"},[_c('ul',{staticClass:\"list-group\"},_vm._l((_vm.conversationItems),function(conversationItem){return _c('li',{key:conversationItem.id,staticClass:\"list-group-item pl-2 w-100 \",attrs:{\"id\":(\"conversationItemId_\" + (conversationItem.id))}},[_c('a',{staticClass:\"d-block\",attrs:{\"href\":\"javascript:void();\"},on:{\"click\":function($event){return _vm.changeConversation(conversationItem)}}},[_c('div',{staticClass:\"w-100 d-flex align-items-center\"},[_c('div',{staticClass:\"mr-1\",staticStyle:{\"color\":\"rgb(66, 165, 245)\"}},[_c('i',{staticClass:\"el-icon-chat-dot-square fa-3x\"})]),_c('div',[_c('div',[_c('strong',{staticClass:\"text-nowrap\",staticStyle:{\"color\":\"rgb(66, 165, 245)\"}},[_vm._v(\"\\n                                                            Conversation \"+_vm._s(_vm._f(\"pretyDateUtcToLocal\")(conversationItem.createdAt))+\"\\n                                                        \")])]),_c('div',{staticClass:\"text-muted\",staticStyle:{\"font-size\":\"85%\"}},[_c('v-clamp',{attrs:{\"autoresize\":\"\",\"max-lines\":1}},[_vm._v(_vm._s(conversationItem.lastMessage))])],1)])])])])}),0)]):_c('div',{staticClass:\"d-flex align-items-center justify-content-center flex-fill w-100 mt-5\",staticStyle:{\"position\":\"absolute\",\"top\":\"0\",\"left\":\"0\",\"height\":\"calc(100% - 10rem)\",\"width\":\"100%\"}},[_c('div',{staticClass:\"d-block text-center\"},[_c('svg',{staticStyle:{\"width\":\"40%\"},attrs:{\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\"}},[_c('path',{attrs:{\"d\":\"M22 10V13C22 17 20 19 16 19H15.5C15.19 19 14.89 19.15 14.7 19.4L13.2 21.4C12.54 22.28 11.46 22.28 10.8 21.4L9.3 19.4C9.14 19.18 8.77 19 8.5 19H8C4 19 2 18 2 13V8C2 4 4 2 8 2H14\",\"stroke\":\"#777\",\"stroke-width\":\"1.5\",\"stroke-miterlimit\":\"10\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}}),_c('path',{attrs:{\"opacity\":\"0.4\",\"d\":\"M19.5 7C20.8807 7 22 5.88071 22 4.5C22 3.11929 20.8807 2 19.5 2C18.1193 2 17 3.11929 17 4.5C17 5.88071 18.1193 7 19.5 7Z\",\"stroke\":\"#292D32\",\"stroke-width\":\"1.5\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}}),_c('path',{attrs:{\"opacity\":\"0.4\",\"d\":\"M15.9965 11H16.0054\",\"stroke\":\"#292D32\",\"stroke-width\":\"2\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}}),_c('path',{attrs:{\"opacity\":\"0.4\",\"d\":\"M11.9945 11H12.0035\",\"stroke\":\"#292D32\",\"stroke-width\":\"2\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}}),_c('path',{attrs:{\"opacity\":\"0.4\",\"d\":\"M7.99451 11H8.00349\",\"stroke\":\"#292D32\",\"stroke-width\":\"2\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}})]),_c('div',{staticClass:\"text-center text-muted\"},[_c('div',[_c('strong',[_vm._v(\"There is no conversation\")])]),_c('p',{staticClass:\"text-muted\"},[_vm._v(\"Conversation will show when you make conversation !\")])])])])])],1),_c('div',{directives:[{name:\"loading\",rawName:\"v-loading\",value:(_vm.isLoading),expression:\"isLoading\"}],staticClass:\"position-absolute d-flex flex-column w-100 h-100 animatied-left-position\",style:((\"left: \" + (_vm.conversationItemSelected !== null ? 0 : 100) + \"%;\"))},[_c('VuePerfectScrollbar',{staticClass:\"flex-fill w-100 pr-3 mt-2\",staticStyle:{\"height\":\"100px\"},attrs:{\"id\":\"chatScroller\",\"settings\":{ suppressScrollX: true }}},[(_vm.messageItems.length > 0)?_c('div',{staticClass:\"mt-2 ml-2 d-flex flex-column w-100\"},_vm._l((_vm.messageItems),function(messageItem){return _c('div',{key:messageItem.id,staticClass:\"d-flex\",class:{ 'justify-content-end' : _vm.isContactMsg(messageItem), 'justify-content-start' : !_vm.isContactMsg(messageItem) },attrs:{\"id\":(\"messageItemId_\" + (messageItem.id))}},[_c('div',{staticClass:\"bubble\",class:{ 'bubble-right' : _vm.isContactMsg(messageItem), 'bubble-left' : !_vm.isContactMsg(messageItem) }},[(messageItem.content)?_c('div',[_vm._v(_vm._s(messageItem.content))]):_c('div',[_c('div',{staticClass:\"text-left\"},[_c('i',{staticClass:\"el-icon-paperclip\"}),_c('i',[_vm._v(\"Sent an attachment\")])])]),_c('div',{staticClass:\"mt-1\",staticStyle:{\"font-size\":\"80%\",\"opacity\":\"0.6\",\"font-style\":\"italic\"}},[_c('i',{staticClass:\"el-icon-time\"}),_vm._v(\" \"+_vm._s(_vm._f(\"pretyDateUtcToLocal\")(messageItem.createdAt))+\"\\n                                        \")])])])}),0):_c('div',{staticClass:\"d-flex align-items-center justify-content-center flex-fill w-100 mt-5\",staticStyle:{\"position\":\"absolute\",\"top\":\"0\",\"left\":\"0\",\"height\":\"calc(100% - 10rem)\",\"width\":\"100%\"}},[_c('div',{staticClass:\"d-block text-center\"},[_c('svg',{staticStyle:{\"width\":\"40%\"},attrs:{\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\"}},[_c('path',{attrs:{\"d\":\"M22 10V13C22 17 20 19 16 19H15.5C15.19 19 14.89 19.15 14.7 19.4L13.2 21.4C12.54 22.28 11.46 22.28 10.8 21.4L9.3 19.4C9.14 19.18 8.77 19 8.5 19H8C4 19 2 18 2 13V8C2 4 4 2 8 2H14\",\"stroke\":\"#777\",\"stroke-width\":\"1.5\",\"stroke-miterlimit\":\"10\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}}),_c('path',{attrs:{\"opacity\":\"0.4\",\"d\":\"M19.5 7C20.8807 7 22 5.88071 22 4.5C22 3.11929 20.8807 2 19.5 2C18.1193 2 17 3.11929 17 4.5C17 5.88071 18.1193 7 19.5 7Z\",\"stroke\":\"#292D32\",\"stroke-width\":\"1.5\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}}),_c('path',{attrs:{\"opacity\":\"0.4\",\"d\":\"M15.9965 11H16.0054\",\"stroke\":\"#292D32\",\"stroke-width\":\"2\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}}),_c('path',{attrs:{\"opacity\":\"0.4\",\"d\":\"M11.9945 11H12.0035\",\"stroke\":\"#292D32\",\"stroke-width\":\"2\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}}),_c('path',{attrs:{\"opacity\":\"0.4\",\"d\":\"M7.99451 11H8.00349\",\"stroke\":\"#292D32\",\"stroke-width\":\"2\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\"}})]),_c('div',{staticClass:\"text-center text-muted\"},[_c('div',[_c('strong',[_vm._v(\"There is no message\")])]),_c('p',{staticClass:\"text-muted\"},[_vm._v(\"It seems that the you has never chat with via us !\")])])])])])],1)])])],1)])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n    <VuePerfectScrollbar style=\"height: calc(100vh - 4rem); background-color: #f5f5f5\">\r\n        <div class=\"d-flex flex-column align-items-center\" style=\"margin-top: 2.6rem\">\r\n            <img src=\"/logo/iRender-fulltext.svg\" style=\"height: 2rem\" alt=\"\" />\r\n            <div style=\" color: #1967d2; font-size: 1.5rem; margin-top: 0.5rem; text-shadow: 2px 2px #ffffff; \">\r\n                iRender Support Center\r\n            </div>\r\n        </div>\r\n        <div class=\"d-flex flex-column flex-lg-row m-auto justify-content-center\" style=\"width: auto\">\r\n            <div class=\"d-flex flex-column align-items-center mt-5 mb-5 row-eq-height\">\r\n                <div>\r\n                    <el-card class=\"box-card mb-5\">\r\n                        <div class=\"d-flex flex-row justify-content-center align-items-center\">\r\n                            <div class=\"d-flex justify-content-center align-items-center\">\r\n                                <img src=\"/background/support/support-background-1.svg\" style=\"height: 17.5rem\" alt=\"\" />\r\n                            </div>\r\n                            <div class=\"d-flex flex-column flex-fill align-items-center\" style=\"margin-left: 1rem\">\r\n                                <div class=\"d-flex justify-content-center\" style=\"font-size: 1.2rem; color: #42a5f5\">\r\n                                    Live support 24/7\r\n                                </div>\r\n                                <div class=\" d-flex flex-row justify-content-center align-items-center flex-fill mt-5 \">\r\n                                    <div class=\" d-flex flex-column justify-content-center align-items-end mr-2 \"\r\n                                        style=\"color: #9e9e9e; font-size: 0.85rem\">\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            Skype support\r\n                                        </div>\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            Quick chat\r\n                                        </div>\r\n                                    </div>\r\n                                    <div class=\"d-flex flex-column justify-content-center ml-2\" style=\"font-size: 0.85rem\">\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            <el-link href=\"https://join.skype.com/invite/qo5nEkWfKgyF\" target=\"_blank\"\r\n                                                :underline=\"false\">iRender Support</el-link>\r\n                                        </div>\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            <el-button @click=\"openTawkTo()\" type=\"text\">Chat now</el-button>\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </el-card>\r\n                    <el-card class=\"box-card\">\r\n                        <div class=\"d-flex flex-row justify-content-center align-items-center\">\r\n                            <div class=\"d-flex flex-column flex-fill align-items-center\" style=\"margin-left: 1rem\">\r\n                                <div class=\"d-flex justify-content-center\" style=\"font-size: 1.2rem; color: #42a5f5\">\r\n                                    Receive complaints and questions\r\n                                </div>\r\n                                <div class=\" d-flex flex-row justify-content-center align-items-center flex-fill mt-5 \">\r\n                                    <div class=\" d-flex flex-column justify-content-center align-items-end mr-2 \"\r\n                                        style=\"color: #9e9e9e; font-size: 0.85rem\">\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            Email\r\n                                        </div>\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            Whatsapp\r\n                                        </div>\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            Skype\r\n                                        </div>\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            Zalo\r\n                                        </div>\r\n                                    </div>\r\n                                    <div class=\"d-flex flex-column justify-content-center ml-2\" style=\"font-size: 0.85rem\">\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            <el-link href=\"mailto:support@irender.net\" target=\"_blank\"\r\n                                                :underline=\"false\">support@irender.net</el-link>\r\n                                        </div>\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            <el-link :href=\"`whatsapp://send?phone=+84912785500&text=Hello%2C%20World!`\"\r\n                                                target=\"_blank\" :underline=\"false\">+(84) 912-785-500</el-link>\r\n                                        </div>\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            <el-link href=\"https://join.skype.com/invite/qo5nEkWfKgyF\" target=\"_blank\"\r\n                                                :underline=\"false\">iRender Support</el-link>\r\n                                        </div>\r\n                                        <div class=\"d-flex align-items-center\" style=\"height: 1.75rem\">\r\n                                            <el-link href=\"http://zalo.me/+84962868890\" target=\"_blank\"\r\n                                                :underline=\"false\">+(84)\r\n                                                962-868-890</el-link>\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                            <div class=\"d-flex justify-content-center align-items-center\">\r\n                                <img src=\"/background/support/support-background-2.svg\" style=\"height: 17.5rem\" alt=\"\" />\r\n                            </div>\r\n                        </div>\r\n                    </el-card>\r\n                </div>\r\n            </div>\r\n            <div class=\"ml-0 ml-lg-4 mt-0 mt-lg-5 d-flex flex-row flex-lg-column justify-content-center align-items-center mb-5 chat-history-block\">\r\n                <el-card class=\"box-card m-auto d-block d-lg-flex flex-column chat-history-box flex-fill w-100\" \r\n                    :body-style=\"{ padding: '0.5rem 0' }\">\r\n                    <div class=\"d-flex align-items-center w-100\">\r\n                        <div class=\"flex-fill d-flex align-items-center pl-2\" \r\n                            style=\"font-size: 1.2rem; color: #42a5f5\">\r\n                            <div v-if=\"conversationItemSelected !== null\">\r\n                                <el-tooltip content=\"Go back list conversations\" placement=\"top\">\r\n                                    <el-button type=\"text\" class=\"mr-1 p-0 m-0\"\r\n                                        @click=\"backToConversationList\">\r\n                                        <i class=\"el-icon-arrow-left\" style=\"font-size: 1.5rem;\"></i>\r\n                                    </el-button>\r\n                                </el-tooltip>\r\n                            </div>\r\n                            <transition name=\"fade\">\r\n                                <div v-if=\"conversationItemSelected === null && !toggleFilterByDate\"\r\n                                    class=\"text-nowrap\">\r\n                                    <i class=\"el-icon-chat-line-round\"></i> Conversations\r\n                                </div>\r\n                            </transition>\r\n                            <transition name=\"fade\">\r\n                                <div v-if=\"conversationItemSelected !== null\">\r\n                                    <i class=\"el-icon-chat-line-round\"></i> Conversation {{conversationItemSelected.createdAt | pretyDateUtcToLocal}}\r\n                                </div>\r\n                            </transition>\r\n                        </div>\r\n                        <div class=\"d-flex align-items-center\">\r\n                            <transition name=\"slide\">\r\n                                <div class=\"mr-2\" \r\n                                    v-if=\"conversationItemSelected === null && toggleFilterByDate\">\r\n                                    <el-date-picker\r\n                                        v-model=\"dateFilterVal\"\r\n                                        range-separator=\"To\"\r\n                                        size=\"mini\"\r\n                                        type=\"date\"\r\n                                        format=\"yyyy-MM-dd\"\r\n                                        value-format=\"yyyy-MM-dd\"\r\n                                        placeholder=\"Pick a date\"\r\n                                        @change=\"refreshConversation\">\r\n                                    </el-date-picker>\r\n                                </div>\r\n                            </transition>\r\n\r\n                            <div class=\"pr-1\" style=\"background-color: #fff;\">\r\n                                <el-tooltip content=\"Filter by date\" placement=\"top\"\r\n                                    v-if=\"conversationItemSelected === null && !toggleFilterByDate\">\r\n                                    <el-button type=\"text\" class=\"mr-2 p-0 m-0\"\r\n                                        @click=\"toggleFilterByDate = true\">\r\n                                        <i class=\"el-icon-date\" style=\"font-size: 1.5rem;\"></i>\r\n                                    </el-button>\r\n                                </el-tooltip>\r\n\r\n                                <el-tooltip content=\"Close filter\" placement=\"top\"\r\n                                    v-if=\"conversationItemSelected === null && toggleFilterByDate\">\r\n                                    <el-button type=\"text\" class=\"mr-2 p-0 m-0\"\r\n                                        @click=\"dateFilterVal = null; toggleFilterByDate = false; refreshConversation();\">\r\n                                        <i class=\"el-icon-close text-danger\" style=\"font-size: 1.5rem;\"></i>\r\n                                    </el-button>\r\n                                </el-tooltip>\r\n\r\n                                <el-tooltip content=\"Refresh\" placement=\"top\"\r\n                                    v-if=\"conversationItemSelected === null\">\r\n                                    <el-button type=\"text\" class=\"mr-2 p-0 m-0\"\r\n                                        @click=\"refreshConversation\">\r\n                                        <i class=\"el-icon-refresh\" style=\"font-size: 1.5rem;\"></i>\r\n                                    </el-button>\r\n                                </el-tooltip>\r\n\r\n                                <el-tooltip content=\"Refresh\" placement=\"top\"\r\n                                    v-if=\"conversationItemSelected !== null\">\r\n                                    <el-button type=\"text\" class=\"mr-2 p-0 m-0\"\r\n                                        @click=\"refreshChatHistory\">\r\n                                        <i class=\"el-icon-refresh\" style=\"font-size: 1.5rem;\"></i>\r\n                                    </el-button>\r\n                                </el-tooltip>\r\n\r\n                                \r\n                                <el-tooltip content=\"Go to last message\" placement=\"top\" class=\"ml-2\"\r\n                                    v-if=\"conversationItemSelected !== null && messageItems.length > 0\">\r\n                                    <el-button type=\"text\" class=\"mr-2 p-0 m-0\"\r\n                                        @click=\"scrollToEnd\">\r\n                                        <i class=\"el-icon-bottom\" style=\"font-size: 1.5rem;\"></i>\r\n                                    </el-button>\r\n                                </el-tooltip>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                    <div class=\"chat-box-content flex-fill position-relative ml-2 mr-2\">\r\n                        <div class=\"position-absolute d-flex flex-column w-100 h-100 animatied-left-position\"\r\n                            :style=\"`left: ${conversationItemSelected === null ? 0 : -100}%; z-index: ${conversationItemSelected === null ? 'auto' : -1};`\"\r\n                            v-loading=\"isLoadingConversation\">\r\n                            <VuePerfectScrollbar class=\"flex-fill w-100 pr-3 mt-2 pr-2 list-group-wrapper\"\r\n                                id=\"chatScrollerConversation\"\r\n                                :settings=\"{ suppressScrollX: true }\"\r\n                                style=\"height: 100px;\">\r\n                                <div class=\"mt-2 ml-2 w-100\"\r\n                                    v-if=\"conversationItems.length > 0\">\r\n                                    <ul class=\"list-group\">\r\n                                        <li class=\"list-group-item pl-2 w-100 \"\r\n                                            v-for=\"conversationItem in conversationItems\"\r\n                                            :key=\"conversationItem.id\" \r\n                                            :id=\"`conversationItemId_${conversationItem.id}`\">                                    \r\n                                            <a href=\"javascript:void();\" class=\"d-block\"\r\n                                                @click=\"changeConversation(conversationItem)\">\r\n                                                <div class=\"w-100 d-flex align-items-center\">\r\n                                                    <div class=\"mr-1\" style=\"color: rgb(66, 165, 245);\">\r\n                                                        <i class=\"el-icon-chat-dot-square fa-3x\"></i>\r\n                                                    </div>\r\n                                                    <div>\r\n                                                        <div>\r\n                                                            <strong class=\"text-nowrap\" style=\"color: rgb(66, 165, 245);\">\r\n                                                                Conversation {{conversationItem.createdAt | pretyDateUtcToLocal}}\r\n                                                            </strong>\r\n                                                        </div>\r\n                                                        <div style=\"font-size: 85%;\" class=\"text-muted\">\r\n                                                            <v-clamp autoresize :max-lines=\"1\">{{conversationItem.lastMessage}}</v-clamp>\r\n                                                        </div>   \r\n                                                    </div>  \r\n                                                </div>\r\n                                            </a>\r\n                                        </li>\r\n                                    </ul>\r\n                                </div>\r\n                                <div v-else class=\"d-flex align-items-center justify-content-center flex-fill w-100 mt-5\"\r\n                                    style=\"position: absolute; top: 0; left: 0; height: calc(100% - 10rem); width: 100%;\">\r\n                                    <div class=\"d-block text-center\">\r\n                                        <svg style=\"width: 40%\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                                            <path d=\"M22 10V13C22 17 20 19 16 19H15.5C15.19 19 14.89 19.15 14.7 19.4L13.2 21.4C12.54 22.28 11.46 22.28 10.8 21.4L9.3 19.4C9.14 19.18 8.77 19 8.5 19H8C4 19 2 18 2 13V8C2 4 4 2 8 2H14\" stroke=\"#777\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                            <path opacity=\"0.4\" d=\"M19.5 7C20.8807 7 22 5.88071 22 4.5C22 3.11929 20.8807 2 19.5 2C18.1193 2 17 3.11929 17 4.5C17 5.88071 18.1193 7 19.5 7Z\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                            <path opacity=\"0.4\" d=\"M15.9965 11H16.0054\" stroke=\"#292D32\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                            <path opacity=\"0.4\" d=\"M11.9945 11H12.0035\" stroke=\"#292D32\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                            <path opacity=\"0.4\" d=\"M7.99451 11H8.00349\" stroke=\"#292D32\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                        </svg>\r\n                                        <div class=\"text-center text-muted\">\r\n                                            <div>\r\n                                                <strong>There is no conversation</strong>\r\n                                            </div>\r\n                                            <p class=\"text-muted\">Conversation will show when you make conversation !</p>\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                            </VuePerfectScrollbar>\r\n                        </div>\r\n                        <div class=\"position-absolute d-flex flex-column w-100 h-100 animatied-left-position\"\r\n                            :style=\"`left: ${conversationItemSelected !== null ? 0 : 100}%;`\"\r\n                            v-loading=\"isLoading\">\r\n                            <VuePerfectScrollbar class=\"flex-fill w-100 pr-3 mt-2\"\r\n                                id=\"chatScroller\"\r\n                                :settings=\"{ suppressScrollX: true }\"\r\n                                style=\"height: 100px;\">\r\n                                <!-- .filter(xItem => xItem.content && xItem.content !== null && xItem.content !== '') -->\r\n                                <div class=\"mt-2 ml-2 d-flex flex-column w-100\"\r\n                                    v-if=\"messageItems.length > 0\">\r\n                                    <div class=\"d-flex\"\r\n                                        v-bind:class=\"{ 'justify-content-end' : isContactMsg(messageItem), 'justify-content-start' : !isContactMsg(messageItem) }\"\r\n                                        v-for=\"messageItem in messageItems\"\r\n                                        :key=\"messageItem.id\" \r\n                                        :id=\"`messageItemId_${messageItem.id}`\">\r\n                                        <div class=\"bubble\"\r\n                                            v-bind:class=\"{ 'bubble-right' : isContactMsg(messageItem), 'bubble-left' : !isContactMsg(messageItem) }\">\r\n                                            <div v-if=\"messageItem.content\">{{messageItem.content}}</div>\r\n                                            <div v-else>\r\n                                                <div class=\"text-left\"><i class=\"el-icon-paperclip\"></i> <i>Sent an attachment</i></div>\r\n                                            </div>\r\n                                            <div class=\"mt-1\" style=\"font-size: 80%; opacity: 0.6; font-style:italic;\">\r\n                                                <i class=\"el-icon-time\"></i> {{messageItem.createdAt | pretyDateUtcToLocal}}\r\n                                            </div>\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                                <div v-else class=\"d-flex align-items-center justify-content-center flex-fill w-100 mt-5\"\r\n                                    style=\"position: absolute; top: 0; left: 0; height: calc(100% - 10rem); width: 100%;\">\r\n                                    <div class=\"d-block text-center\">\r\n                                        <svg style=\"width: 40%\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                                            <path d=\"M22 10V13C22 17 20 19 16 19H15.5C15.19 19 14.89 19.15 14.7 19.4L13.2 21.4C12.54 22.28 11.46 22.28 10.8 21.4L9.3 19.4C9.14 19.18 8.77 19 8.5 19H8C4 19 2 18 2 13V8C2 4 4 2 8 2H14\" stroke=\"#777\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                            <path opacity=\"0.4\" d=\"M19.5 7C20.8807 7 22 5.88071 22 4.5C22 3.11929 20.8807 2 19.5 2C18.1193 2 17 3.11929 17 4.5C17 5.88071 18.1193 7 19.5 7Z\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                            <path opacity=\"0.4\" d=\"M15.9965 11H16.0054\" stroke=\"#292D32\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                            <path opacity=\"0.4\" d=\"M11.9945 11H12.0035\" stroke=\"#292D32\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                            <path opacity=\"0.4\" d=\"M7.99451 11H8.00349\" stroke=\"#292D32\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                        </svg>\r\n                                        <div class=\"text-center text-muted\">\r\n                                            <div>\r\n                                                <strong>There is no message</strong>\r\n                                            </div>\r\n                                            <p class=\"text-muted\">It seems that the you has never chat with via us !</p>\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                            </VuePerfectScrollbar>\r\n                        </div>\r\n                    </div>\r\n                </el-card>\r\n            </div>\r\n        </div>\r\n    </VuePerfectScrollbar>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from \"vuex\";\r\nimport VClamp from 'vue-clamp';\r\nimport api from '@/api/baseApi';\r\nimport { SETTINGS_CHAT_HISTORY_API } from \"@/constant/apiSettings\";\r\nconst queryString = require('query-string');\r\nexport default {\r\n    components: {\r\n        VClamp\r\n    },\r\n    data() {\r\n        return {\r\n            quality: 1,\r\n\r\n            toggleFilterByDate: false,\r\n            isLoadingConversation: true,\r\n            isInitedConversation: false,\r\n            currentPageConversation: 1,\r\n            dateFilterVal: null,\r\n            conversationItems: [],\r\n            conversationItemSelected: null,\r\n\r\n            isLoading: true,\r\n            isInited: false,\r\n            currentPage: 1,\r\n            messageItems: [],\r\n        };\r\n    },\r\n\r\n    computed: {\r\n        ...mapState({\r\n            user: (state) => state.auth.user,\r\n        }),\r\n    },\r\n    mounted() {\r\n        this.getChatConversation(\"LOAD_MORE\");\r\n        //this.getChatHistory(\"REFRESH\");\r\n    },\r\n    beforeDestroy() {\r\n        $(\"#chatScroller\").off(\"scroll\");\r\n        $(\"#chatScrollerConversation\").off(\"scroll\");\r\n    },\r\n    methods: {\r\n        openTawkTo() {\r\n            if(window.chatTool ===\"tawk.to\") window.Tawk_API.maximize();\r\n            if(window.chatTool ===\"chatwood\") window.$chatwoot.toggle(\"open\");\r\n        },\r\n        isContactMsg(messageItem) {\r\n            return messageItem.senderType !== null && messageItem.senderType === 'Contact';\r\n        },\r\n        refreshChatHistory(){\r\n            this.currentPage = 1;\r\n            this.getChatHistory(\"REFRESH\")\r\n        },\r\n        getChatHistory(targetAction = \"LOAD_MORE\") {\r\n            this.isLoading = true;\r\n            const requestSettings = SETTINGS_CHAT_HISTORY_API.GET_CHAT_HISTORY_BY_CONVERSATION;\r\n            const conversationId = this.conversationItemSelected.id;\r\n            let requestParams = {\r\n                conversationId: conversationId, \r\n                page: this.currentPage, \r\n                pageSize: 50 \r\n            };\r\n            api.baseRequest(requestSettings, null, `?${queryString.stringify(requestParams)}`)\r\n                .then((res) => {\r\n                    if (res.data) {\r\n                        if (res.data.length > 0) {\r\n                            let firstId = null;\r\n                            if (this.messageItems.length > 0) firstId = this.messageItems[0].id;\r\n                            switch (targetAction) {\r\n                                case \"LOAD_MORE\":\r\n                                    this.$set(this, \"messageItems\", (res.data.reverse()).concat(this.messageItems));\r\n                                    if (firstId !== null) {\r\n                                        this.$nextTick(() => {\r\n                                            $(\"#chatScroller\").scrollTop($(`#messageItemId_${firstId}`).offset().top);\r\n                                        });\r\n                                    }\r\n                                    break;\r\n                                case \"REFRESH\":\r\n                                this.$set(this, \"messageItems\", (res.data.reverse()));\r\n                                    this.$nextTick(() => {\r\n                                        $(\"#chatScroller\").animate({\r\n                                            scrollTop: $(\"#chatScroller\").prop(\"scrollHeight\")\r\n                                        }, 100);\r\n                                        if (!this.isInited) {\r\n                                            this.isInited = true;\r\n                                            $(\"#chatScroller\").on(\"scroll\", () => {\r\n                                                if ($(\"#chatScroller\").scrollTop() === 0) {\r\n                                                    this.loadOlder();\r\n                                                }\r\n                                            });\r\n                                        }\r\n                                    });\r\n                                    break;\r\n                            }\r\n                        }\r\n                        else {\r\n                            if (this.currentPage > 1) this.currentPage = this.currentPage - 1;\r\n                        }\r\n                        this.isLoading = false;\r\n                    }\r\n                    this.isLoading = false;\r\n                })\r\n                .catch(error => {\r\n                    console.error(error);\r\n                    this.isLoading = false;\r\n                });\r\n        },\r\n        loadOlder() {\r\n            this.currentPage = this.currentPage + 1;\r\n            this.getChatHistory(\"LOAD_MORE\");\r\n        },\r\n        scrollToEnd() {\r\n            const chatScroller = $(\"#chatScroller\");\r\n            chatScroller.animate({\r\n                scrollTop: chatScroller.prop(\"scrollHeight\")\r\n            }, 100);\r\n        },\r\n        scrollReachStart(evt) {\r\n            // if (!this.isInited) return;\r\n            // console.log(evt);\r\n            // this.loadOlder();\r\n        },\r\n        refreshConversation(){\r\n            this.$set(this, 'conversationItems', []);\r\n            this.$set(this, 'messageItems', []);\r\n            this.currentPageConversation = 1;\r\n            this.getChatConversation(\"REFRESH\")\r\n        },\r\n        getChatConversation(targetAction = \"LOAD_MORE\") {\r\n            this.isLoadingConversation = true;\r\n            const requestSettings = SETTINGS_CHAT_HISTORY_API.GET_CHAT_CONVERSATION;\r\n            let requestParams = { page: this.currentPageConversation, pageSize: 50 };\r\n            if(this.dateFilterVal && this.dateFilterVal !== '') {\r\n                requestParams.filterDate = this.dateFilterVal;\r\n            }\r\n            api.baseRequest(requestSettings, null, `?${queryString.stringify(requestParams)}`)\r\n                .then((res) => {\r\n                    if (res.data) {\r\n                        if (res.data.length > 0) {\r\n                            switch (targetAction) {\r\n                                case \"LOAD_MORE\":\r\n                                    this.$set(this, 'conversationItems', (res.data).concat(this.conversationItems).map(xItem => {\r\n                                        return {\r\n                                            ...xItem,\r\n                                            additionalAttributesData: xItem.additionalAttributes ? JSON.parse(xItem.additionalAttributes) : {}\r\n                                        }\r\n                                    }));\r\n                                    break;\r\n                                case \"REFRESH\":\r\n                                this.$set(this, 'conversationItems', (res.data.map(xItem => {\r\n                                        return {\r\n                                            ...xItem,\r\n                                            additionalAttributesData: xItem.additionalAttributes ? JSON.parse(xItem.additionalAttributes) : {}\r\n                                        }\r\n                                    })));\r\n                                    this.$nextTick(() => {\r\n                                        if (!this.isInitedConversation) {\r\n                                            this.isInitedConversation = true;\r\n                                            $(\"#chatScrollerConversation\").on(\"scroll\", () => {\r\n                                                let scrollHeight = $(\"#chatScrollerConversation\").prop(\"scrollHeight\");\r\n                                                if ($(\"#chatScrollerConversation\").scrollTop() === scrollHeight) {\r\n                                                    this.loadOlderConversation();\r\n                                                }\r\n                                            });\r\n                                        }\r\n                                    });\r\n                                    break;\r\n                            }\r\n                        }\r\n                        else {\r\n                            if (this.currentPageConversation > 1) this.currentPageConversation = this.currentPageConversation - 1;\r\n                            this.isLoading = false;\r\n                        }\r\n                        this.isLoadingConversation = false;\r\n                    }\r\n                    this.isLoadingConversation = false;\r\n                })\r\n                .catch(error => {\r\n                    console.error(error);\r\n                    this.isLoadingConversation = false;\r\n                });\r\n        },\r\n        loadOlderConversation(){\r\n            this.currentPageConversation = this.currentPageConversation + 1;\r\n            this.getChatConversation(\"LOAD_MORE\");\r\n        },         \r\n        backToConversationList() {  \r\n            this.$set(this, 'messageItems', []); \r\n            this.conversationItemSelected = null;\r\n            this.currentPage = 1;           \r\n            this.refreshConversation();\r\n        },         \r\n        changeConversation(conversationItem) {  \r\n            $(\"#chatScroller\").off(\"scroll\");\r\n            this.isInited = false;   \r\n            this.$set(this, 'messageItems', []); \r\n            this.conversationItemSelected = conversationItem;\r\n            this.currentPage = 1;           \r\n            this.getChatHistory(\"REFRESH\");\r\n        },\r\n    },\r\n};\r\n</script>\r\n\r\n<style lang=\"css\" scoped>\r\n.chat-history-box::v-deep > .el-card__body{\r\n    display: flex !important;\r\n    flex-direction: column !important;\r\n    flex: 1 1 auto !important;\r\n}\r\n\r\n.slide-leave-active,\r\n.slide-enter-active {\r\n  transition: 0.3s;\r\n}\r\n.slide-enter {\r\n  transform: translate(100%, 0);\r\n  opacity: 1;\r\n}\r\n.slide-leave-to {\r\n  transform: translate(100%, 0);\r\n  opacity: 0;\r\n  width: 0;\r\n}\r\n.fade-enter-active, .fade-leave-active {\r\n  transition: opacity .1s;\r\n}\r\n.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {\r\n  opacity: 0;\r\n  width: 0;\r\n  z-index: -1;\r\n}\r\n\r\n.chat-history-box::v-deep .bubble {\r\n  --r: 20px; /* the radius */\r\n  --t: 20px; /* the size of the tail */\r\n  margin-bottom: 0.8rem;\r\n  max-width: 80%;\r\n  padding: calc(2*var(--r)/3);\r\n  -webkit-mask: \r\n    radial-gradient(var(--t) at var(--_d) 0,#0000 98%,#000 102%) \r\n      var(--_d) 100%/calc(100% - var(--r)) var(--t) no-repeat,\r\n    conic-gradient(at var(--r) var(--r),#000 75%,#0000 0) \r\n      calc(var(--r)/-2) calc(var(--r)/-2) padding-box, \r\n    radial-gradient(closest-side at 50% 50%,#000 98%,#0000 101%) \r\n      0 0/var(--r) var(--r) space padding-box;\r\n}\r\n.chat-history-box::v-deep  .bubble-left {\r\n  --_d: 0%;\r\n  border-left: var(--t) solid #0000;\r\n  margin-right: var(--t);\r\n  place-self: start;\r\n  color: #fff;\r\n  background: linear-gradient(135deg,#42a5f5,#1384C5) border-box;\r\n}\r\n.chat-history-box::v-deep  .bubble-right {\r\n  --_d: 100%;\r\n  border-right: var(--t) solid #0000;\r\n  margin-left: var(--t);\r\n  place-self: end;\r\n  color: #000;\r\n  background: linear-gradient(135deg,#bbbbbb,#cecece) border-box;\r\n}\r\n.list-group-wrapper{\r\n    border: 1px solid rgba(0, 0, 0, 0.125);\r\n}\r\n.list-group-wrapper .list-group-item{\r\n    border-left: none;\r\n    border-right: none;\r\n}\r\n.list-group-wrapper .list-group-item:first-child{\r\n    border-top: none;\r\n}\r\n.list-group-wrapper .list-group-item:last-child{\r\n    border-bottom: none;\r\n}\r\n.list-group-wrapper .list-group-item:hover{\r\n    background-color: #e5f0ff;\r\n}\r\n.list-group-wrapper  .list-group-item a{\r\n    color: inherit;\r\n    text-decoration: none;\r\n}\r\n\r\n.animatied-left-position{\r\n    transition: left 0.3s;\r\n    -webkit-transition: left 0.3s;\r\n    -moz-transition: left 0.3s;\r\n}\r\n\r\n.chat-history-block{\r\n    width: 100%;\r\n    max-width: 100%;\r\n}\r\n\r\n\r\n.chat-history-block .el-card{\r\n    max-width: 50rem !important;\r\n}\r\n\r\n.chat-history-block .chat-box-content{\r\n    height: 30rem !important;\r\n}\r\n\r\n@media screen and (min-width: 1264px){\r\n    .chat-history-block{\r\n        width: 30rem;\r\n    }\r\n\r\n    .chat-history-block .chat-box-content{\r\n        height: auto !important;\r\n    }\r\n}\r\n</style>","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!./Support.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!./Support.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Support.vue?vue&type=template&id=115396ee&scoped=true&\"\nimport script from \"./Support.vue?vue&type=script&lang=js&\"\nexport * from \"./Support.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Support.vue?vue&type=style&index=0&id=115396ee&lang=css&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  \"115396ee\",\n  null\n  \n)\n\nexport default component.exports","import mod from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../node_modules/css-loader/index.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!./Support.vue?vue&type=style&index=0&id=115396ee&lang=css&scoped=true&\"; export default mod; export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../node_modules/css-loader/index.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!./Support.vue?vue&type=style&index=0&id=115396ee&lang=css&scoped=true&\""],"sourceRoot":""}