diff --git a/ui/public/embeb.js b/ui/public/embeb.js index a91afd5c8..0ba3cc26d 100644 --- a/ui/public/embeb.js +++ b/ui/public/embeb.js @@ -1,15 +1,15 @@ -function auth(token,protocol,host){ - const XML=new XMLHttpRequest() - XML.open("POST",`${protocol}//${host}/api/application/authentication`,false) - XML.setRequestHeader('Content-Type', 'application/json'); - res=XML.send(JSON.stringify({"access_token":token})) - return XML.status==200 +function auth(token, protocol, host) { + const XML = new XMLHttpRequest() + XML.open('POST', `${protocol}//${host}/api/application/authentication`, false) + XML.setRequestHeader('Content-Type', 'application/json') + res = XML.send(JSON.stringify({ access_token: token })) + return XML.status == 200 } function embedChatbot() { const t = window.maxkbChatConfig - check=auth(t.token,t.protocol, t.host) - if (t && t.token && t.protocol && t.host&& check) { + check = auth(t.token, t.protocol, t.host) + if (t && t.token && t.protocol && t.host && check) { icon = ` @@ -37,12 +37,25 @@ function embedChatbot() { chat_button = document.createElement('div') chat_button.style = 'position: fixed;bottom: 30px;right: 0;cursor: pointer;' chat_button.innerHTML = icon + style=document.createElement('style') + style.type='text/css' + style.innerText= `#chat_container { + width: 420px; + height: 600px; + } + @media only screen and (max-width: 768px) { + #chat_container { + width: 100%; + height: 70%; + right: 0 !important; + } + }` + document.head.appendChild(style) chat_container = document.createElement('div') chat_container.id = 'chat_container' chat_container.style.cssText = `z-index:10000;position: relative; - width: 420px; - height: 600px; + border-radius: 8px; border: 1px solid var(--N300, #DEE0E3); background: linear-gradient(188deg, rgba(235, 241, 255, 0.20) 39.6%, rgba(231, 249, 255, 0.20) 94.3%), #EFF0F1; @@ -73,8 +86,10 @@ function embedChatbot() { chat_container.append(close_button) document.body.append(chat_container) + chat_button.onclick = ($event) => { chat_container.style['display']=chat_container.style['display']=='block'?'none':'block' + } sty = document.createElement('style') sty.innerText = ` #chat_container { diff --git a/ui/src/styles/app.scss b/ui/src/styles/app.scss index b47dd0ff8..460aed555 100644 --- a/ui/src/styles/app.scss +++ b/ui/src/styles/app.scss @@ -518,3 +518,15 @@ h4 { } } } + +#chat_container { + width: 420px; + height: 600px; +} +@media only screen and (max-width: 768px) { + #chat_container { + width: 100%; + height: 70%; + right: 0 !important; + } +} diff --git a/ui/src/views/applicaiton-overview/index.vue b/ui/src/views/applicaiton-overview/index.vue index d8ed64c2e..bb9ce4483 100644 --- a/ui/src/views/applicaiton-overview/index.vue +++ b/ui/src/views/applicaiton-overview/index.vue @@ -12,7 +12,7 @@ shape="square" :size="32" /> -

{{ detail?.name }}

+

{{ detail?.name }}

diff --git a/ui/src/views/setting/component/PermissionSetting.vue b/ui/src/views/setting/component/PermissionSetting.vue index efa40f84f..a234318d6 100644 --- a/ui/src/views/setting/component/PermissionSetting.vue +++ b/ui/src/views/setting/component/PermissionSetting.vue @@ -17,11 +17,20 @@ class="mr-12" shape="square" :size="24" + style="flex-shrink: 0" /> - + - {{ row?.name }} + + {{ row?.name }} +