mirror of
https://gitcode.com/gh_mirrors/hy/Hydro.git
synced 2026-10-20 01:38:19 +08:00
ui: add tpl tsx example
This commit is contained in:
3 files changed
+41
-27
No files matched your search
+12
-11
@@ -1,4 +1,5 @@
|
||||
import $ from 'jquery';
|
||||
import React from 'react';
|
||||
import { i18n, tpl } from 'vj/utils';
|
||||
import DomDialog, { DialogOptions } from './DomDialog';
|
||||
|
||||
@@ -14,19 +15,19 @@ export class Dialog {
|
||||
$action: null,
|
||||
...options,
|
||||
};
|
||||
let box = '';
|
||||
if (options.width) box += `width:${options.width};max-width:${options.width};`;
|
||||
if (options.height) box += `height:${options.height};max-height:${options.height};`;
|
||||
this.$dom = $(tpl`
|
||||
<div class="dialog withBg ${this.options.classes}" style="display:none">
|
||||
<div class="dialog__content" style="${box}">
|
||||
<div class="dialog__body" style="height:calc(100% - 45px);"></div>
|
||||
<div class="row"><div class="columns clearfix">
|
||||
<div class="float-right dialog__action"></div>
|
||||
const box: React.CSSProperties = {};
|
||||
if (options.width) box.width = box.maxWidth = options.width;
|
||||
if (options.height) box.height = box.maxHeight = options.height;
|
||||
this.$dom = $(tpl(
|
||||
<div className={`dialog withBg ${this.options.classes}`} style={{ display: 'none' }}>
|
||||
<div className="dialog__content" style={box}>
|
||||
<div className="dialog__body" style={{ height: 'calc(100% - 45px);' }} />
|
||||
<div className="row"><div className="columns clearfix">
|
||||
<div className="float-right dialog__action" />
|
||||
</div></div>
|
||||
</div>
|
||||
</div>
|
||||
`);
|
||||
</div>,
|
||||
));
|
||||
this.$dom.on('click', '[data-action]', this.handleActionButton.bind(this));
|
||||
this.$dom.on('vjDomDialogShow', this.beforeShow.bind(this));
|
||||
this.$dom.on('vjDomDialogHidden', this.afterHide.bind(this));
|
||||
Reference in new issue
Block a user