afx-list-view now can add action buttons

This commit is contained in:
Xuan Sang LE
2018-03-12 11:33:33 +01:00
parent 6c7aec69b7
commit 7fd6492a31
9 changed files with 94 additions and 55 deletions

View File

@ -57,9 +57,9 @@ class BasicDialog extends BaseDialog
html = "<afx-app-window data-id = 'dia-window' width='#{@conf.width}' height='#{@conf.height}'>
<afx-vbox>"
html += "<#{v.tag} #{v.att} style = 'margin-left:5px; margin-right:5px;' data-id = 'content#{k}'></#{v.tag}>" for k,v of @conf.tags
html += "<div data-height = '35' style=' text-align:right;padding-top:3px;'>"
html += "<div data-height = '30' style=' text-align:right;padding-top:3px;'>"
html += "<afx-button data-id = 'bt#{k}' text = '#{v.label}' style='margin-right:5px;'></afx-button>" for k,v of @conf.buttons
html += "</div><div data-height='5'></div></afx-vbox></afx-app-window>"
html += "</div><div data-height='2'></div></afx-vbox></afx-app-window>"
#render the html
_GUI.htmlToScheme html, @, @host
@ -80,11 +80,11 @@ class PromptDialog extends BasicDialog
constructor: () ->
super "PromptDialog", {
tags: [
{ tag: "afx-label", att: "data-height = '20'" },
{ tag: "input", att: "type = 'text'" }
{ tag: "afx-label" },
{ tag: "input", att: "type = 'text' data-height='25'" }
],
width: 200,
height: 100,
height: 120,
resizable: false,
buttons: [
{

View File

@ -4,7 +4,7 @@
<afx-vbox>
<afx-file-view data-id = "fileview" view='tree' status = false></afx-file-view>
<input data-height = '26' type = "text" data-id = "filename" style="margin-left:5px; margin-right:5px;display:none;" />
<div data-height = '30' style=' text-align:right;padding-top:3px;'>
<div data-height = '30' style=' text-align:right;padding:3px;'>
<afx-button data-id = "bt-ok" text = "__(Ok)"></afx-button>
<afx-button data-id = "bt-cancel" text = "__(Cancel)"></afx-button>
</div>

View File

@ -1,16 +1,18 @@
<afx-list-view class = {dropdown: opts.dropdown == "true"}>
<div class = "list-container" ref = "container">
<div if = {opts.dropdown == "true"} ref = "current" style = {opts.width?"min-width:" + opts.width + "px;":""} onclick = {show_list}>
<afx-list-view class = {dropdown: opts.dropdown == "true"} style = "display:flex; flex-direction:column">
<div class = "list-container" ref = "container" style="flex:1;">
<div if = {opts.dropdown == "true"} ref = "current" style = {opts.width?"min-width:" + opts.width + "px;":""} onclick = {show_list}></div>
<ul ref = "mlist" >
<li each={item,i in items } class={selected: parent._autoselect(item,i)} ondblclick = {parent._dbclick} onclick = {parent._select} oncontextmenu = {parent._select}>
<afx-label class = {item.class} color = {item.color} iconclass = {item.iconclass} icon = {item.icon} text = {item.text}></afx-label>
<i if = {item.closable} class = "closable" click = {parent._remove}></i>
<ul if = {item.complex} class = "complex-content">
<li each = {ctn,j in item.detail} class = {ctn.class}>{ctn.text}</li>
</ul>
</li>
</ul>
</div>
<ul ref = "mlist">
<li each={item,i in items } class={selected: parent._autoselect(item,i)} ondblclick = {parent._dbclick} onclick = {parent._select} oncontextmenu = {parent._select}>
<afx-label class = {item.class} color = {item.color} iconclass = {item.iconclass} icon = {item.icon} text = {item.text}></afx-label>
<i if = {item.closable} class = "closable" click = {parent._remove}></i>
<ul if = {item.complex} class = "complex-content">
<li each = {ctn,j in item.detail} class = {ctn.class}>{ctn.text}</li>
</ul>
</li>
</ul>
<div if = {opts.dropdown != "true" && buttons} class = "button_container">
<afx-button each = {btn,i in buttons} text = {btn.text} icon = {btn.icon} iconclass = {btn.icon} onbtclick = {btn.onbtclick}></afx-button>
</div>
<script>
this.items = opts.items || []
@ -19,6 +21,7 @@
self.onlistselect = opts.onlistselect
self.onlistdbclick = opts.onlistdbclick
self.onitemclose = opts.onitemclose
self.buttons = opts.buttons
var onclose = false
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
self.root.set = function(k,v)