77 lines
2.1 KiB
Plaintext
77 lines
2.1 KiB
Plaintext
<style>
|
||
.select-icon{
|
||
display: inline-block;
|
||
width: 32px;
|
||
height: 24px;
|
||
text-align: center;
|
||
vertical-align: middle;
|
||
cursor: pointer;
|
||
line-height: 24px;
|
||
font-size:28px;
|
||
}
|
||
.selected-icon{
|
||
border: 1px green solid;
|
||
}
|
||
</style>
|
||
<div class="modal fade" id="icons-panel" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
|
||
<div class="modal-dialog modal-lg" role="document">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||
<h4 class="modal-title" id="myLargeModalLabel">icons选择面板</h4>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<div class="card">
|
||
<div class="card-body">
|
||
|
||
<div class="table-responsive">
|
||
<table class="table table-bordered table-striped">
|
||
<tbody id="icons-tbody">
|
||
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" id="confirm-icon-btn" class="btn btn-primary">确认</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script type="text/javascript" src="/admin/js/icons.js"></script>
|
||
<script type="text/javascript">
|
||
$(document).ready(function(){
|
||
//js调用图表常量库进行展示
|
||
showIcons();
|
||
});
|
||
$(document).on('click','.select-icon',function() {
|
||
$(".select-icon").removeClass('selected-icon');
|
||
$(this).addClass('selected-icon');
|
||
});
|
||
$(document).on('dblclick','.select-icon',function() {
|
||
getSelectedIcon();
|
||
});
|
||
function showIcons(){
|
||
var html = '';
|
||
for(var i = 0; i < all_system_icons.length; i++){
|
||
var td = '';
|
||
if(i == 0){
|
||
td += '<tr align="center">';
|
||
}
|
||
td += '<td><i class="mdi ' + all_system_icons[i] + ' select-icon" val="' + all_system_icons[i] + '"></i></td>';
|
||
if((i+1) % 15 == 0){
|
||
td += '</tr><tr align="center">'
|
||
}
|
||
html += td;
|
||
}
|
||
html += '</tr>';
|
||
$("#icons-tbody").append(html);
|
||
}
|
||
|
||
</script> |