112 lines
3.7 KiB
Plaintext
112 lines
3.7 KiB
Plaintext
<div class="show-member" module="member">
|
||
<div class="row">
|
||
<div class="member-pic col-sm-3">
|
||
<img src="{{image}}" alt="{{name}}" title="{{name}}" width="100%">
|
||
</div>
|
||
<div class="member-data col-sm-9">
|
||
<table class="table table-striped">
|
||
<div data-list="profile_data" data-level="0">
|
||
<tr class="row">
|
||
<th class="{{title_class}} col-sm-2">{{title}}</th>
|
||
<td class="{{value_class}} col-sm-10">{{value}}</td>
|
||
</tr>
|
||
</div>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<ul class="member-plugins nav nav-pills" role="tablist" data-list="plugins" data-level="0">
|
||
<li class="nav-item {{plugin_class}}">
|
||
<a class="nav-link" href="#{{plugin_name}}" role="tab" data-bs-toggle="tab" title="{{plugin_title}}">{{plugin_title}}</a>
|
||
</li>
|
||
</ul>
|
||
<div class="tab-content" data-list="plugins" data-level="0">
|
||
<div class="tab-pane {{plugin_class}}" id="{{plugin_name}}">
|
||
|
||
<div class="info" data-list="plugin_data_intro" data-level="1">
|
||
{{data_intro_title}}
|
||
</div>
|
||
|
||
<table class="table table-hover table-striped dt-responsive {{complete_display}}">
|
||
<thead>
|
||
<tr data-list="pd_title" data-level="1">
|
||
<th>{{plugin_data_title}}</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody data-level="1" data-list="plugin_datas">
|
||
<tr data-level="2" data-list="pd_datas">
|
||
<td>{{data_title}}</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script>
|
||
(function() {
|
||
// Adding class on first element
|
||
function memberPlugins() {
|
||
var plugins = document.querySelector('.member-plugins');
|
||
if (!plugins || plugins.children.length === 0) return;
|
||
|
||
// 改用 a.nav-link 判斷是否已有 active，不看 li
|
||
if (plugins.querySelectorAll('a.nav-link.active').length === 0) {
|
||
var firstLink = plugins.querySelector('li a.nav-link');
|
||
var firstPane = document.querySelector(firstLink.getAttribute('href'));
|
||
|
||
// active 只加在 a.nav-link，不加在 li
|
||
firstLink.classList.add('active');
|
||
|
||
// pane 要同時加 active 和 show
|
||
if (firstPane) {
|
||
firstPane.classList.add('active', 'show');
|
||
}
|
||
}
|
||
}
|
||
memberPlugins();
|
||
}())
|
||
for(var i = 0;i < $('.show-member img').length ; i++){
|
||
if($('.show-member img').eq(i).attr('alt')=="" ){
|
||
$('.show-member img').eq(i).attr('alt','noname');
|
||
$('.show-member img').eq(i).attr('title','noname');
|
||
}
|
||
}
|
||
for(var i = 0;i < $('.show-member table').length ; i++){
|
||
if($('.show-member table').eq(i).html().trim().replace(' ','')=="" )
|
||
$('.show-member table').eq(i).html('please write down something!');
|
||
}
|
||
for(var i = 0;i < $('.tab-content table').length ; i++){
|
||
$('.tab-content table:eq(' + i + ')').attr('id', 'table' + i);
|
||
}
|
||
for ( var i = 0; i < $('tr[data-list="pd_title"]').length ; i++ ) {
|
||
if( $('tr[data-list="pd_title"]').eq(i).children('th').length > 2 ) {
|
||
var th = $('tr[data-list="pd_title"]').eq(i).children('th');
|
||
for ( var q = 2; q < th.length ; q++ ) {
|
||
th.eq(q).addClass('desktop');
|
||
}
|
||
}
|
||
}
|
||
|
||
$('.tab-pane table').each(function(){
|
||
if($(this).find('thead').length!=0 && $(this).find('td').length!=0 && !$(this).hasClass('dataTable')){
|
||
$(this).DataTable({
|
||
searching: false,
|
||
paging: false,
|
||
ordering: false,
|
||
info: false,
|
||
order: false,
|
||
autoWidth: false
|
||
});
|
||
}
|
||
});
|
||
// 同步 li.nav-item 的 active class
|
||
document.addEventListener('show.bs.tab', function(e) {
|
||
// 移除所有 li 的 active
|
||
document.querySelectorAll('.member-plugins li.nav-item').forEach(function(li) {
|
||
li.classList.remove('active');
|
||
});
|
||
// 把被點的 a 的父層 li 加上 active
|
||
e.target.closest('li.nav-item').classList.add('active');
|
||
});
|
||
</script>
|