mirror of https://github.com/mashirozx/sakura.git
48 lines
2.4 KiB
HTML
48 lines
2.4 KiB
HTML
<div class="botui botui-container" v-botui-container>
|
|
<div class="botui-messages-container">
|
|
<div v-for="msg in messages" class="botui-message" :class="msg.cssClass" v-botui-scroll>
|
|
<transition name="slide-fade">
|
|
<div v-if="msg.visible" :class="[{human: msg.human, 'botui-message-content': true}, msg.type]">
|
|
<span v-if="msg.type == 'text'" v-text="msg.content" v-botui-markdown></span>
|
|
<iframe v-if="msg.type == 'embed'" :src="msg.content" frameborder="0" allowfullscreen></iframe>
|
|
</div>
|
|
</transition>
|
|
<div v-if="msg.loading" class="botui-message-content loading">
|
|
<i class="dot"></i>
|
|
<i class="dot"></i>
|
|
<i class="dot"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="botui-actions-container">
|
|
<transition name="slide-fade">
|
|
<div v-if="action.show" v-botui-scroll>
|
|
<form v-if="action.type == 'text'" class="botui-actions-text"
|
|
@submit.prevent="handle_action_text()" :class="action.cssClass">
|
|
<i v-if="action.text.icon"
|
|
class="botui-icon botui-action-text-icon fa"
|
|
:class="'fa-' + action.text.icon"></i>
|
|
<input type="text" ref="input" :type="action.text.sub_type"
|
|
v-model="action.text.value" class="botui-actions-text-input" :placeholder="action.text.placeholder"
|
|
:size="action.text.size" :value="action.text.value" :class="action.text.cssClass" required v-focus/>
|
|
<button type="submit"
|
|
:class="{'botui-actions-buttons-button': !!action.text.button, 'botui-actions-text-submit': !action.text.button}">
|
|
<i v-if="action.text.button && action.text.button.icon" class="botui-icon botui-action-button-icon fa"
|
|
:class="'fa-' + action.text.button.icon"></i>
|
|
<span>{{(action.text.button && action.text.button.label) || 'Go'}}</span>
|
|
</button>
|
|
</form>
|
|
<div v-if="action.type == 'button'" class="botui-actions-buttons" :class="action.cssClass">
|
|
<button type="button" :class="button.cssClass"
|
|
class="botui-actions-buttons-button" v-for="button in action.button.buttons"
|
|
@click="handle_action_button(button)"
|
|
autofocus>
|
|
<i v-if="button.icon" class="botui-icon botui-action-button-icon fa" :class="'fa-' + button.icon"></i>
|
|
{{button.text}}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</transition>
|
|
</div>
|
|
</div>
|