diff options
Diffstat (limited to 'web/html/xui/inbound_info_modal.html')
| -rw-r--r-- | web/html/xui/inbound_info_modal.html | 61 |
1 files changed, 61 insertions, 0 deletions
diff --git a/web/html/xui/inbound_info_modal.html b/web/html/xui/inbound_info_modal.html new file mode 100644 index 00000000..bcd2b25f --- /dev/null +++ b/web/html/xui/inbound_info_modal.html @@ -0,0 +1,61 @@ +{{define "inboundInfoModal"}} +{{template "component/inboundInfo"}} +<a-modal id="inbound-info-modal" v-model="infoModal.visible" title='{{ i18n "pages.inbounds.details"}}' @ok="infoModal.ok" + :closable="true" :mask-closable="true" + ok-text='{{ i18n "pages.inbounds.copyLink"}}' cancel-text='{{ i18n "close" }}' :ok-button-props="infoModal.okBtnPros"> + <inbound-info :db-inbound="dbInbound" :inbound="inbound"></inbound-info> +</a-modal> +<script> + + const infoModal = { + visible: false, + inbound: new Inbound(), + dbInbound: new DBInbound(), + clipboard: null, + okBtnPros: { + attrs: { + id: "inbound-info-modal-ok-btn", + style: "", + }, + }, + show(dbInbound) { + this.inbound = dbInbound.toInbound(); + this.dbInbound = new DBInbound(dbInbound); + this.visible = true; + + if (dbInbound.hasLink()) { + this.okBtnPros.attrs.style = ""; + } else { + this.okBtnPros.attrs.style = "display: none"; + } + + if (this.clipboard == null) { + infoModalApp.$nextTick(() => { + this.clipboard = new ClipboardJS(`#${this.okBtnPros.attrs.id}`, { + text: () => this.dbInbound.genLink(), + }); + this.clipboard.on('success', () => app.$message.success('{{ i18n "copySuccess" }}')); + }); + } + }, + close() { + infoModal.visible = false; + }, + }; + + const infoModalApp = new Vue({ + delimiters: ['[[', ']]'], + el: '#inbound-info-modal', + data: { + infoModal, + get dbInbound() { + return this.infoModal.dbInbound; + }, + get inbound() { + return this.infoModal.inbound; + } + }, + }); + +</script> +{{end}}
\ No newline at end of file |