| 1 | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
|---|
| 2 | <html>
|
|---|
| 3 | <head>
|
|---|
| 4 | <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
|
|---|
| 5 | <title>DFD0055 - Protótipo de tela: expresso-admin</title>
|
|---|
| 6 | <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/ui-lightness/jquery-ui.css" type="text/css" media="screen" />
|
|---|
| 7 |
|
|---|
| 8 | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
|
|---|
| 9 | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.js"></script>
|
|---|
| 10 |
|
|---|
| 11 |
|
|---|
| 12 | <style>
|
|---|
| 13 | body { font-size:11px;}
|
|---|
| 14 | fieldset, div {margin:0;}
|
|---|
| 15 | .ui-autocomplete-input { height:22px; width:200px; margin-right:-1px; }
|
|---|
| 16 | #wrap-progressbar { height:22px; width:122px; float:left; }
|
|---|
| 17 | #wrap-progressbar #inner-progressbar { text-align:center; width:100px; }
|
|---|
| 18 | #wrap-progressbar #inner-progressbar span { font-size:10px; line-height:12px; }
|
|---|
| 19 | #wrap-progressbar #inner-progressbar #progressbar { width:100px; height:10px; }
|
|---|
| 20 | .clear {clear:both;}
|
|---|
| 21 | #fieldset1 label {width:95px;display:inline-block;}
|
|---|
| 22 | fieldset { border:1px solid #AAA; border-radius:5px; margin:5px;}
|
|---|
| 23 | ul {list-style:none; margin:0; padding:0;}
|
|---|
| 24 |
|
|---|
| 25 | #list-acc-users li, #search-result-users li {margin-right:5px;border-radius:3px;}
|
|---|
| 26 | #list-acc-mails li {margin-right:5px;padding-bottom:4px;border-radius:3px;}
|
|---|
| 27 | #list-acc-users li:hover, #list-acc-mails li:hover, #search-result-users li:hover {background-color:#DDD;}
|
|---|
| 28 | #list-acc-users li span.ui-icon, #list-acc-mails li span.ui-icon, #search-result-users li span.ui-icon {display:none; margin:2px;}
|
|---|
| 29 | #list-acc-users li input, #list-acc-mails li input, #search-result-users li input {margin-top:5px;}
|
|---|
| 30 | #list-acc-users li label, #list-acc-mails li label, #search-result-users li label {margin-top:-5px;}
|
|---|
| 31 | #list-acc-users li:hover span, #list-acc-mails li:hover span, #search-result-users li:hover span {display:inline;}
|
|---|
| 32 | #search-result-users li span.ui-icon {display:none;}
|
|---|
| 33 | .ui-icon {float:right;}
|
|---|
| 34 | #icon-bar1 .ui-icon {float:left; margin:0 3px;}
|
|---|
| 35 | #icon-bar1 span {float:left; margin:2px 3px 0 0;}
|
|---|
| 36 | .ui-icon-trash, .ui-icon-edit, .ui-icon-close, .ui-icon-plus, .ui-icon-pencil {background-color:#EEE;}
|
|---|
| 37 | .ui-icon-trash:hover, .ui-icon-edit:hover, .ui-icon-close:hover, .ui-icon-plus:hover, .ui-icon-pencil:hover {background-color:#BBB;}
|
|---|
| 38 | .ui-autocomplete-input {width:170px;}
|
|---|
| 39 | .ui-accordion .ui-accordion-content{padding:5px;}
|
|---|
| 40 |
|
|---|
| 41 | .foot-note {width:905px; padding:5px;margin-top:20px;border-top:1px solid #ddd;}
|
|---|
| 42 | .acc-list {font-family: "Trebuchet MS", Tahoma, Verdana, Arial, sans-serif; font-size:11px; color:#555; }
|
|---|
| 43 | .acc-list h3{font-family: "Trebuchet MS", Tahoma, Verdana, Arial, sans-serif; font-size:11px; color:#555; margin:0; padding:5px 3px; background-color:#fff;}
|
|---|
| 44 | .acc-list ul{ margin:5px 0;}
|
|---|
| 45 | .acc-list ul li{ border-radius:3px; padding:3px;}
|
|---|
| 46 | .acc-list ul li:hover {background-color:#DDD;}
|
|---|
| 47 | .acc-list ul li.active {background-color:#EB8F00;}
|
|---|
| 48 | .acc-list ul li strong {display:block;}
|
|---|
| 49 | .acc-list ul li em {display:block;}
|
|---|
| 50 |
|
|---|
| 51 | </style>
|
|---|
| 52 |
|
|---|
| 53 | </head>
|
|---|
| 54 | <body>
|
|---|
| 55 |
|
|---|
| 56 | <script type="text/javascript">
|
|---|
| 57 |
|
|---|
| 58 | //nao accordion
|
|---|
| 59 | (function( $ ) {
|
|---|
| 60 | $.widget( "ui.combobox", {
|
|---|
| 61 | _create: function() {
|
|---|
| 62 | var self = this,
|
|---|
| 63 | select = this.element.hide(),
|
|---|
| 64 | selected = select.children( ":selected" ),
|
|---|
| 65 | value = selected.val() ? selected.text() : "";
|
|---|
| 66 | var input = this.input = $( "<input>" )
|
|---|
| 67 | .insertAfter( select )
|
|---|
| 68 | .val( value )
|
|---|
| 69 | .autocomplete({
|
|---|
| 70 | delay: 0,
|
|---|
| 71 | minLength: 0,
|
|---|
| 72 | source: function( request, response ) {
|
|---|
| 73 | var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
|
|---|
| 74 | response( select.children( "option" ).map(function() {
|
|---|
| 75 | var text = $( this ).text();
|
|---|
| 76 | if ( this.value && ( !request.term || matcher.test(text) ) )
|
|---|
| 77 | return {
|
|---|
| 78 | label: text.replace(
|
|---|
| 79 | new RegExp(
|
|---|
| 80 | "(?![^&;]+;)(?!<[^<>]*)(" +
|
|---|
| 81 | $.ui.autocomplete.escapeRegex(request.term) +
|
|---|
| 82 | ")(?![^<>]*>)(?![^&;]+;)", "gi"
|
|---|
| 83 | ), "<strong>$1</strong>" ),
|
|---|
| 84 | value: text,
|
|---|
| 85 | option: this
|
|---|
| 86 | };
|
|---|
| 87 | }) );
|
|---|
| 88 | },
|
|---|
| 89 | select: function( event, ui ) {
|
|---|
| 90 | ui.item.option.selected = true;
|
|---|
| 91 | self._trigger( "selected", event, {
|
|---|
| 92 | item: ui.item.option
|
|---|
| 93 | });
|
|---|
| 94 | },
|
|---|
| 95 | change: function( event, ui ) {
|
|---|
| 96 | if ( !ui.item ) {
|
|---|
| 97 | var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ),
|
|---|
| 98 | valid = false;
|
|---|
| 99 | select.children( "option" ).each(function() {
|
|---|
| 100 | if ( $( this ).text().match( matcher ) ) {
|
|---|
| 101 | this.selected = valid = true;
|
|---|
| 102 | return false;
|
|---|
| 103 | }
|
|---|
| 104 | });
|
|---|
| 105 | if ( !valid ) {
|
|---|
| 106 | // remove invalid value, as it didn't match anything
|
|---|
| 107 | $( this ).val( "" );
|
|---|
| 108 | select.val( "" );
|
|---|
| 109 | input.data( "autocomplete" ).term = "";
|
|---|
| 110 | return false;
|
|---|
| 111 | }
|
|---|
| 112 | }
|
|---|
| 113 | }
|
|---|
| 114 | })
|
|---|
| 115 | .addClass( "ui-widget ui-widget-content ui-corner-left" );
|
|---|
| 116 |
|
|---|
| 117 | input.data( "autocomplete" )._renderItem = function( ul, item ) {
|
|---|
| 118 | return $( "<li></li>" )
|
|---|
| 119 | .data( "item.autocomplete", item )
|
|---|
| 120 | .append( "<a>" + item.label + "</a>" )
|
|---|
| 121 | .appendTo( ul );
|
|---|
| 122 | };
|
|---|
| 123 |
|
|---|
| 124 | this.button = $( "<button type='button'> </button>" )
|
|---|
| 125 | .attr( "tabIndex", -1 )
|
|---|
| 126 | .attr( "title", "Show All Items" )
|
|---|
| 127 | .insertAfter( input )
|
|---|
| 128 | .button({
|
|---|
| 129 | icons: {
|
|---|
| 130 | primary: "ui-icon-triangle-1-s"
|
|---|
| 131 | },
|
|---|
| 132 | text: false
|
|---|
| 133 | })
|
|---|
| 134 | .removeClass( "ui-corner-all" )
|
|---|
| 135 | .addClass( "ui-corner-right ui-button-icon" )
|
|---|
| 136 | .click(function() {
|
|---|
| 137 | // close if already visible
|
|---|
| 138 | if ( input.autocomplete( "widget" ).is( ":visible" ) ) {
|
|---|
| 139 | input.autocomplete( "close" );
|
|---|
| 140 | return;
|
|---|
| 141 | }
|
|---|
| 142 |
|
|---|
| 143 | // work around a bug (likely same cause as #5265)
|
|---|
| 144 | $( this ).blur();
|
|---|
| 145 |
|
|---|
| 146 | // pass empty string as value to search for, displaying all results
|
|---|
| 147 | input.autocomplete( "search", "" );
|
|---|
| 148 | input.focus();
|
|---|
| 149 | });
|
|---|
| 150 | },
|
|---|
| 151 |
|
|---|
| 152 | destroy: function() {
|
|---|
| 153 | this.input.remove();
|
|---|
| 154 | this.button.remove();
|
|---|
| 155 | this.element.show();
|
|---|
| 156 | $.Widget.prototype.destroy.call( this );
|
|---|
| 157 | }
|
|---|
| 158 | });
|
|---|
| 159 | })( jQuery );
|
|---|
| 160 |
|
|---|
| 161 | $(function() {
|
|---|
| 162 |
|
|---|
| 163 | //autocomplete
|
|---|
| 164 | $( "#combobox" ).combobox();
|
|---|
| 165 | //accordion
|
|---|
| 166 | $( "#accordion" ).accordion({ fillSpace: true }).resizable();
|
|---|
| 167 |
|
|---|
| 168 | $( ".button, #input-button1, #input-button2" ).button();
|
|---|
| 169 |
|
|---|
| 170 | //toggle user list
|
|---|
| 171 | var callback1 = function(){ $('#acl1').toggle( 'slide', false, 500 ) };
|
|---|
| 172 | var callback2 = function(){ $('#users1').effect( 'size', { from:{width:430}, to:{ width:665} }, 200 ) };
|
|---|
| 173 | $( ".edit-acl1" ).click(function(){
|
|---|
| 174 | if ($('#users1').css('width') == '665px') {
|
|---|
| 175 | $('#users1').effect( 'size', { from:{width:665}, to:{ width:430} }, 500, callback1 );
|
|---|
| 176 | } else {
|
|---|
| 177 | $('#acl1').toggle( 'slide', {direction:'left'}, 400, callback2 );
|
|---|
| 178 | }
|
|---|
| 179 | });
|
|---|
| 180 | //#toggle user list
|
|---|
| 181 |
|
|---|
| 182 | $( "#progressbar" ).progressbar({
|
|---|
| 183 | value: 37
|
|---|
| 184 | });
|
|---|
| 185 |
|
|---|
| 186 | //toggle icon-bar1-selected
|
|---|
| 187 | $('#list-acc-users li').click(function(){
|
|---|
| 188 | var j =0;
|
|---|
| 189 | $('#list-acc-users input').each(function(){
|
|---|
| 190 | if (this.checked)
|
|---|
| 191 | j++;
|
|---|
| 192 | });
|
|---|
| 193 |
|
|---|
| 194 | if (j > 0) {
|
|---|
| 195 | if ($('#icon-bar1-selected').css('display') == 'none')
|
|---|
| 196 | $('#icon-bar1-selected').effect( 'slide', false, 400 );
|
|---|
| 197 | } else {
|
|---|
| 198 | if ($('#icon-bar1-selected').css('display') != 'none')
|
|---|
| 199 | $('#icon-bar1-selected').toggle( 'slide', false, 400 );
|
|---|
| 200 | }
|
|---|
| 201 | });
|
|---|
| 202 | //#toggle icon-bar1-selected
|
|---|
| 203 |
|
|---|
| 204 | //toggle search result edit
|
|---|
| 205 | $('#input-search').keydown(function() {
|
|---|
| 206 | $('#search-result').css('display','block');
|
|---|
| 207 | });
|
|---|
| 208 | $('#search-result li').click(function(){
|
|---|
| 209 | var i =0;
|
|---|
| 210 | $('#search-result input').each(function(){
|
|---|
| 211 | if (this.checked)
|
|---|
| 212 | i++;
|
|---|
| 213 | });
|
|---|
| 214 |
|
|---|
| 215 | if (i === 1) {
|
|---|
| 216 | $('#search-result-addall').css('display','none');
|
|---|
| 217 | $('#search-result-add').css('display','inline-block');
|
|---|
| 218 | if ($('#acl2').css('display') == 'none') {
|
|---|
| 219 | $('#acl2').effect( 'slide', false, 400 );
|
|---|
| 220 | }
|
|---|
| 221 | } else if (i > 1) {
|
|---|
| 222 | $('#search-result-addall').css('display','inline-block');
|
|---|
| 223 | $('#search-result-add').css('display','none');
|
|---|
| 224 | }
|
|---|
| 225 | });
|
|---|
| 226 | //#toggle search result edit
|
|---|
| 227 | });
|
|---|
| 228 | </script>
|
|---|
| 229 | <div style="width:875px;height:510px;">
|
|---|
| 230 | <div class="acc-list" style="width:190px;height:100%;float:left;border:1px solid #DDD;background-color:#EEE;border-radius:3px;margin-left:1px;">
|
|---|
| 231 | <h3>Contas Compartilhadas</h3>
|
|---|
| 232 | <ul>
|
|---|
| 233 | <li><strong>Mocca Café</strong><em>mocca@compart.org</em></li>
|
|---|
| 234 | <li class="active"><strong>Teste Café</strong><em>conta1teste@compart.org</em></li>
|
|---|
| 235 | <li><strong>Capuccino Café</strong><em>capuccino@compart.org</em></li>
|
|---|
| 236 | <li><strong>Expresso Café</strong><em>espresso@compart.org</em></li>
|
|---|
| 237 | </ul>
|
|---|
| 238 | </div>
|
|---|
| 239 | <div style="width:680px;height:100%;float:right;">
|
|---|
| 240 | <div id="accordion">
|
|---|
| 241 | <h3><a href="#">Gerenciar dados conta compartilhada: <em>Teste Café</em></a></h3>
|
|---|
| 242 | <div>
|
|---|
| 243 |
|
|---|
| 244 | <div style="width:665px;">
|
|---|
| 245 | <fieldset id="fieldset1">
|
|---|
| 246 | <legend>Dados da conta</legend>
|
|---|
| 247 | <!-- coisa tensa -->
|
|---|
| 248 | <div class="ui-widget">
|
|---|
| 249 | <label>Organização: </label>
|
|---|
| 250 | <select id="combobox">
|
|---|
| 251 | <option value="org">+ PROGNUS</option>
|
|---|
| 252 | <option value="org1">org1</option>
|
|---|
| 253 | <option value="org2">org2</option>
|
|---|
| 254 | <option value="org3">org3</option>
|
|---|
| 255 | <option value="org4">org4</option>
|
|---|
| 256 | </select>
|
|---|
| 257 | </div>
|
|---|
| 258 | <div style="float:left;">
|
|---|
| 259 | <div>
|
|---|
| 260 | <label>Nome da conta: </label>
|
|---|
| 261 | <input class="ui-corner-all" id="input-nome" type="text" style="width:198px" value="Teste Café"/>
|
|---|
| 262 | </div>
|
|---|
| 263 | <div>
|
|---|
| 264 | <label>Descrição: </label>
|
|---|
| 265 | <input class="ui-corner-all" id="input-descricao" type="text" style="width:198px" value="Teste de conta com café"/>
|
|---|
| 266 | </div>
|
|---|
| 267 | <div>
|
|---|
| 268 | <div style="float:left; margin-right:10px">
|
|---|
| 269 | <label>Cota de email: </label>
|
|---|
| 270 | <input class="ui-corner-all" id="input-descricao" value="700" type="text" style="width:50px;text-align:right;"/><span>MB</span>
|
|---|
| 271 | </div>
|
|---|
| 272 | <div id="wrap-progressbar">
|
|---|
| 273 | <div id="inner-progressbar">
|
|---|
| 274 | <span><strong>204MB</strong> utilizados</span>
|
|---|
| 275 | <div id="progressbar"></div>
|
|---|
| 276 | </div>
|
|---|
| 277 | <span id="btn-trash1" class="ui-icon ui-icon-trash ui-corner-all" style="margin-top: -17px;"></span>
|
|---|
| 278 | </div>
|
|---|
| 279 | <!--<div style="float:right; margin-right:5px"><input id="input-button2" type="button" value="Esvaziar INBOX"/></div>-->
|
|---|
| 280 | <div class="clear"></div>
|
|---|
| 281 | </div>
|
|---|
| 282 | <div>
|
|---|
| 283 | <div>
|
|---|
| 284 | <input type="checkbox" name="opcao" value="op1" checked="checked"id="opcao1"/> <label for="opcao1" style="width:200px;">Ativar conta</label>
|
|---|
| 285 | </div>
|
|---|
| 286 | <div>
|
|---|
| 287 | <input type="checkbox" name="opcao" value="op1" id="opcao2"/> <label for="opca2" style="width:200px;">Omitir do catálogo</label>
|
|---|
| 288 | </div>
|
|---|
| 289 | </div>
|
|---|
| 290 | </div>
|
|---|
| 291 | <fieldset style="float:right; width:275px; height:100px;">
|
|---|
| 292 | <label>Email da conta: </label>
|
|---|
| 293 | <input class="ui-corner-all" id="input-email" type="text" style="width:130px"/>
|
|---|
| 294 | <span style="margin:5px 18px 0 0" class="ui-icon ui-icon-plus ui-corner-all"></span>
|
|---|
| 295 | <ul id="list-acc-mails" style="height:70px; overflow:auto;">
|
|---|
| 296 | <li><em>conta1teste@compart.org</em><span class="ui-icon ui-icon-close ui-corner-all"></span></label></li>
|
|---|
| 297 | <li><em>teste2@contacompart.teste.gov</em><span class="ui-icon ui-icon-close ui-corner-all"></span></label></li>
|
|---|
| 298 | <li><em>teste33@contacompart.teste.gov</em><span class="ui-icon ui-icon-close ui-corner-all"></span></label></li>
|
|---|
| 299 | <li><em>teste14@contacompart.teste.gov</em><span class="ui-icon ui-icon-close ui-corner-all"></span></label></li>
|
|---|
| 300 | <li><em>teste5@contacompart.teste.gov</em><span class="ui-icon ui-icon-close ui-corner-all"></span></label></li>
|
|---|
| 301 | <li><em>teste23@contacompart.teste.gov</em><span class="ui-icon ui-icon-close ui-corner-all"></span></label></li>
|
|---|
| 302 | </ul>
|
|---|
| 303 | <div class="clear"></div>
|
|---|
| 304 | </fieldset>
|
|---|
| 305 | </fieldset>
|
|---|
| 306 | </div>
|
|---|
| 307 | <div class="clear"></div>
|
|---|
| 308 | <div id="users1" style="height:173px;width:665px;float:left;">
|
|---|
| 309 | <fieldset style="height:100%;">
|
|---|
| 310 | <legend>Usuários da conta</legend>
|
|---|
| 311 | <ul id="list-acc-users" style="height:160px; overflow:auto;">
|
|---|
| 312 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Talita Equina da Silva <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all">Editar prefs</span></label></li>
|
|---|
| 313 | <li><input type="checkbox" name="opcao" value="op1" id="opcao22"/> <label for="opcao22">Random Molusco da Silva <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 314 | <li><input type="checkbox" name="opcao" value="op1" id="opcao23"/> <label for="opcao23">Mano Daltonico dos Santos <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 315 | <li><input type="checkbox" name="opcao" value="op1" id="opcao24"/> <label for="opcao24">Fulano da Silva <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 316 | <li><input type="checkbox" name="opcao" value="op1" id="opcao25"/> <label for="opcao25">Beltrano dos Santos <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 317 | <li><input type="checkbox" name="opcao" value="op1" id="opcao26"/> <label for="opcao26">Fulano da Silva <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 318 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Talita Equina da Silva <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 319 | <li><input type="checkbox" name="opcao" value="op1" id="opcao22"/> <label for="opcao22">Random Molusco da Silva <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 320 | <li><input type="checkbox" name="opcao" value="op1" id="opcao23"/> <label for="opcao23">Mano Daltonico dos Santos <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 321 | <li><input type="checkbox" name="opcao" value="op1" id="opcao24"/> <label for="opcao24">Fulano da Silva <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 322 | <li><input type="checkbox" name="opcao" value="op1" id="opcao25"/> <label for="opcao25">Beltrano dos Santos <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 323 | <li><input type="checkbox" name="opcao" value="op1" id="opcao26"/> <label for="opcao26">Fulano da Silva <span class="ui-icon ui-icon-close ui-corner-all"></span><span class="ui-icon ui-icon-pencil edit-acl1 ui-corner-all"></span></label></li>
|
|---|
| 324 | </ul>
|
|---|
| 325 | </fieldset>
|
|---|
| 326 | </div>
|
|---|
| 327 | <div id="acl1" style="height:173px;float:right;display:none;">
|
|---|
| 328 | <fieldset style="width:200px; height:100%;">
|
|---|
| 329 | <legend>Permissões</legend>
|
|---|
| 330 | <ul id="list-acc-users" style="height:173px; width:100px; float:left; overflow:auto;">
|
|---|
| 331 | <li><strong>Gerais</strong></li>
|
|---|
| 332 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Leitura</label></li>
|
|---|
| 333 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Exclusão</label></li>
|
|---|
| 334 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Criação</label></li>
|
|---|
| 335 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Enviar</label></li>
|
|---|
| 336 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Salvar</label></li>
|
|---|
| 337 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Pasta</label></li>
|
|---|
| 338 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Gerente</label></li>
|
|---|
| 339 | </ul>
|
|---|
| 340 | <ul id="list-acc-users" style="height:133px; width:100px; float:left;overflow:auto;">
|
|---|
| 341 | <li><strong>Agenda</strong></li>
|
|---|
| 342 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Leitura</label></li>
|
|---|
| 343 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Adicionar</label></li>
|
|---|
| 344 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Editar</label></li>
|
|---|
| 345 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Excluir</label></li>
|
|---|
| 346 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Privado</label></li>
|
|---|
| 347 | </ul>
|
|---|
| 348 | <span class="button" style="margin-left:30px;">Aplicar</span>
|
|---|
| 349 | </fieldset>
|
|---|
| 350 | </div>
|
|---|
| 351 | <div id="icon-bar1" style="width:665px;margin-top:200px;">
|
|---|
| 352 | <fieldset id="icon-bar1-selected" style="float:left;width:150px;display:none;">
|
|---|
| 353 | <legend>Seleção:</legend>
|
|---|
| 354 | <span class="ui-icon ui-icon-pencil ui-corner-all"></span><span>Editar</span>
|
|---|
| 355 | <span class="ui-icon ui-icon-trash ui-corner-all"></span><span>Excluir</span>
|
|---|
| 356 | </fieldset>
|
|---|
| 357 | <fieldset style="float:left;width:150px;">
|
|---|
| 358 | <legend>Novo:</legend>
|
|---|
| 359 | <span class="ui-icon ui-icon-plus ui-corner-all"></span><span>Adicionar usuário</span>
|
|---|
| 360 | </fieldset>
|
|---|
| 361 | <div style="float:right; margin-top:20px;">
|
|---|
| 362 | <span class="button">Aplicar</span><span class="button">Cancelar</span>
|
|---|
| 363 | </div>
|
|---|
| 364 | </div>
|
|---|
| 365 | </div>
|
|---|
| 366 |
|
|---|
| 367 |
|
|---|
| 368 | <!-- acordion aba 2 -->
|
|---|
| 369 | <h3><a href="#">Adicionar usuários na conta compartilhada: <em>Teste Café</em></a></h3>
|
|---|
| 370 | <div>
|
|---|
| 371 | <div style="width:220px;">
|
|---|
| 372 | <input class="ui-corner-all" id="input-search" type="text" style="width:200px;"/><span class="ui-icon ui-icon-search ui-corner-all" style="margin:5px 0 0 -20px;"></span>
|
|---|
| 373 | </div>
|
|---|
| 374 | <div id="search-result" style="width:320px; float:left; margin:0;background-color:#E4E3EE;border-radius:3px;height:410px;overflow:auto;display:none;">
|
|---|
| 375 | <ul id="search-result-users" style="">
|
|---|
| 376 | <li><input type="checkbox" name="opcao" value="op1" id="opcao511"/> <label for="opcao511">Talita Equina da Silva <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 377 | <li><input type="checkbox" name="opcao" value="op1" id="opcao512"/> <label for="opcao512">Random Molusco da Silva <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 378 | <li><input type="checkbox" name="opcao" value="op1" id="opcao513"/> <label for="opcao513">Mano Daltonico dos Santos <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 379 | <li><input type="checkbox" name="opcao" value="op1" id="opcao514"/> <label for="opcao514">Fulano da Silva <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 380 | <li><input type="checkbox" name="opcao" value="op1" id="opcao515"/> <label for="opcao515">Beltrano dos Santos <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 381 | <li><input type="checkbox" name="opcao" value="op1" id="opcao516"/> <label for="opcao516">Fulano da Silva <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 382 | <li><input type="checkbox" name="opcao" value="op1" id="opcao517"/> <label for="opcao517">Talita Equina da Silva <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 383 | <li><input type="checkbox" name="opcao" value="op1" id="opcao518"/> <label for="opcao518">Random Molusco da Silva <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 384 | <li><input type="checkbox" name="opcao" value="op1" id="opcao519"/> <label for="opcao519">Mano Daltonico dos Santos <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 385 | <li><input type="checkbox" name="opcao" value="op1" id="opcao521"/> <label for="opcao521">Fulano da Silva <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 386 | <li><input type="checkbox" name="opcao" value="op1" id="opcao522"/> <label for="opcao522">Beltrano dos Santos <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></span></label></li>
|
|---|
| 387 | <li><input type="checkbox" name="opcao" value="op1" id="opcao523"/> <label for="opcao523">Fulano da Silva <span class="ui-icon ui-icon-close edit-acl2 ui-corner-all"></span></label></li>
|
|---|
| 388 | </ul>
|
|---|
| 389 | </div>
|
|---|
| 390 | <div id="acl2" style="width:300px; float:right; display:none;">
|
|---|
| 391 | <fieldset>
|
|---|
| 392 | <legend>Permissões</legend>
|
|---|
| 393 | <ul id="list-acc-users" style="">
|
|---|
| 394 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Leitura</label></li>
|
|---|
| 395 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Exclusão</label></li>
|
|---|
| 396 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Criação</label></li>
|
|---|
| 397 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Enviar</label></li>
|
|---|
| 398 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Salvar</label></li>
|
|---|
| 399 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Pasta</label></li>
|
|---|
| 400 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Gerente</label></li>
|
|---|
| 401 | </ul>
|
|---|
| 402 | </fieldset>
|
|---|
| 403 | <fieldset>
|
|---|
| 404 | <legend>Agenda de Eventos</legend>
|
|---|
| 405 | <ul id="list-acc-users" style="">
|
|---|
| 406 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Leitura</label></li>
|
|---|
| 407 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Adicionar</label></li>
|
|---|
| 408 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Editar</label></li>
|
|---|
| 409 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Excluir</label></li>
|
|---|
| 410 | <li><input type="checkbox" name="opcao" value="op1" id="opcao21"/> <label for="opcao21">Privado</label></li>
|
|---|
| 411 | </ul>
|
|---|
| 412 | </fieldset>
|
|---|
| 413 | <div style="text-align:right;margin:3px;">
|
|---|
| 414 | <span id="search-result-add" class="button">Adicionar</span>
|
|---|
| 415 | <span id="search-result-addall" class="button">Adicionar todos</span>
|
|---|
| 416 | <span id="search-result-cancel" class="button">Cancelar</span>
|
|---|
| 417 | </div>
|
|---|
| 418 | </div>
|
|---|
| 419 | </div>
|
|---|
| 420 | </div> <!--acordion-->
|
|---|
| 421 | </div>
|
|---|
| 422 | </div>
|
|---|
| 423 |
|
|---|
| 424 | <div class="clear"></div>
|
|---|
| 425 | <div class="foot-note">
|
|---|
| 426 | <span>*<small>Os protótipos de tela apresentados limitam-se a mera apresentação da estrutura e disposição dos elementos na tela,
|
|---|
| 427 | não devendo servir, portanto, para definição de características específicas do layout como ícones, cores e efeitos de eventos disparados.
|
|---|
| 428 | A presença dos ícones nestes protótipos não pressupõe a autorização de uso no Expresso Livre. </small></span>
|
|---|
| 429 | </div>
|
|---|
| 430 | </body>
|
|---|
| 431 | </html> |
|---|
