(root, data)
| 159 | close_icon.onclick = close_func |
| 160 | } |
| 161 | const initChat = (root, data) => { |
| 162 | // 添加对话icon |
| 163 | root.insertAdjacentHTML('beforeend', chatButtonHtml(data)) |
| 164 | // 添加对话框 |
| 165 | root.insertAdjacentHTML('beforeend', getChatContainerHtml(data)) |
| 166 | // 按钮元素 |
| 167 | const chat_button = root.querySelector('.sqlbot-assistant-chat-button') |
| 168 | let chat_button_img = root.querySelector('.sqlbot-assistant-chat-button > svg') |
| 169 | if (data.float_icon) { |
| 170 | chat_button_img = root.querySelector('.sqlbot-assistant-chat-button > img') |
| 171 | } |
| 172 | chat_button_img.style.display = 'block' |
| 173 | function resizeImg() { |
| 174 | const rate = window.outerWidth / window.innerWidth; |
| 175 | chat_button_img.style.width = `${30 * (1 / rate)}px`; |
| 176 | chat_button_img.style.height = `${30 * (1 / rate)}px`; |
| 177 | } |
| 178 | resizeImg() |
| 179 | window.addEventListener('resize', resizeImg); |
| 180 | // 对话框元素 |
| 181 | const chat_container = root.querySelector('#sqlbot-assistant-chat-container') |
| 182 | // 引导层 |
| 183 | const mask_content = root.querySelector('.sqlbot-assistant-mask > .sqlbot-assistant-content') |
| 184 | const mask_tips = root.querySelector('.sqlbot-assistant-tips') |
| 185 | chat_button_img.onload = (event) => { |
| 186 | if (mask_content) { |
| 187 | mask_content.style.width = chat_button_img.width + 'px' |
| 188 | mask_content.style.height = chat_button_img.height + 'px' |
| 189 | if (data.x_type == 'left') { |
| 190 | mask_tips.style.marginLeft = |
| 191 | (chat_button_img.naturalWidth > 500 ? 500 : chat_button_img.naturalWidth) - 64 + 'px' |
| 192 | } else { |
| 193 | mask_tips.style.marginRight = |
| 194 | (chat_button_img.naturalWidth > 500 ? 500 : chat_button_img.naturalWidth) - 64 + 'px' |
| 195 | } |
| 196 | } |
| 197 | } |
| 198 | |
| 199 | const viewport = root.querySelector('.sqlbot-assistant-openviewport') |
| 200 | const closeviewport = root.querySelector('.sqlbot-assistant-closeviewport') |
| 201 | const close_func = () => { |
| 202 | chat_container.style['display'] = |
| 203 | chat_container.style['display'] == 'block' ? 'none' : 'block' |
| 204 | chat_button.style['display'] = chat_container.style['display'] == 'block' ? 'none' : 'block' |
| 205 | } |
| 206 | close_icon = chat_container.querySelector('.sqlbot-assistant-chat-close') |
| 207 | chat_button.onclick = close_func |
| 208 | close_icon.onclick = close_func |
| 209 | const viewport_func = () => { |
| 210 | if (chat_container.classList.contains('sqlbot-assistant-enlarge')) { |
| 211 | chat_container.classList.remove('sqlbot-assistant-enlarge') |
| 212 | viewport.classList.remove('sqlbot-assistant-viewportnone') |
| 213 | closeviewport.classList.add('sqlbot-assistant-viewportnone') |
| 214 | } else { |
| 215 | chat_container.classList.add('sqlbot-assistant-enlarge') |
| 216 | viewport.classList.add('sqlbot-assistant-viewportnone') |
| 217 | closeviewport.classList.remove('sqlbot-assistant-viewportnone') |
| 218 | } |
no test coverage detected