支持table转卡片

This commit is contained in:
augushong
2020-03-26 20:59:50 +08:00
parent 0b0b8bd35d
commit 317e91ffba
7 changed files with 95 additions and 25 deletions

View File

@@ -114,7 +114,6 @@ abstract class BaseController
$jump_to_url = $jump_to_url;
}else{
$jump_to_url = url($jump_to_url);
}
}

View File

@@ -49,7 +49,7 @@
<tbody>
{volist name='$list' id='vo'}
<tr data-id="{$vo.id}">
<tr class="item" data-id="{$vo.id}">
<td>{$vo.id}</td>
<td><img src="{$vo.avatar}" alt=""></td>
<td>{$vo.account}</td>
@@ -86,11 +86,11 @@
var item = this;
layer.confirm('确定要删除吗?',function(){
$.get('{:url("delete")}',{
id:$(item).parents('tr').data('id')
id:$(item).parents('.item').data('id')
},function(result){
layer.msg('删除成功');
$(item).parents('tr').remove();
$(item).parents('.item').remove();
})
})
})

View File

@@ -45,7 +45,7 @@
</thead>
<tbody>
{volist name='list' id='vo'}
<tr>
<tr class="item">
<td>{$vo.id}</td>
<td>{$vo.name}</td>
<td>
@@ -77,7 +77,7 @@
layer.confirm('确定要删除吗?',function(){
$.get($(item).data('href'),function(result){
if(result.code == 0){
$(item).parents('tr').remove();
$(item).parents('.item').remove();
}
layer.msg(result.msg);
})

View File

@@ -93,7 +93,7 @@
value: $(item).data('name')
}, function (value, index) {
$.post('{:url("AdminPermission/update")}', {
id: $(item).parents('tr').data('id'),
id: $(item).parents('.item').data('id'),
name: value
}, function (result) {
layer.close(index)
@@ -107,7 +107,7 @@
value: $(item).data('url')
}, function (value, index) {
$.post('{:url("AdminPermission/update")}', {
id: $(item).parents('tr').data('id'),
id: $(item).parents('.item').data('id'),
url: value
}, function (result) {
layer.close(index)
@@ -120,11 +120,11 @@
var item = this;
layer.confirm('确定要删除吗?', function () {
$.get('{:url("AdminPermission/delete")}', {
id: $(item).parents('tr').data('id')
id: $(item).parents('.item').data('id')
}, function (result) {
if (result.code == 0) {
layer.msg('删除成功');
$(item).parents('tr').remove();
$(item).parents('.item').remove();
} else {
layer.msg(result.msg)
}
@@ -134,14 +134,14 @@
$('.is-log').click(function () {
var item = this;
var isLog = $(item).parents('tr').data('is-log')
var isLog = $(item).parents('.item').data('is-log')
if (isLog == 0) {
isLog = 1
} else {
isLog = 0
}
$.post('{:url("AdminPermission/update")}', {
id: $(item).parents('tr').data('id'),
id: $(item).parents('.item').data('id'),
is_log: isLog
}, function () {
if (isLog == 1) {
@@ -150,6 +150,7 @@
$(item).text('不记录')
}
$(item).parents('.item').data('is-log',isLog)
})
})
})

View File

@@ -17,6 +17,31 @@
max-width: 60px;
max-height: 60px;
}
.table-card-box{
}
.table-card-item{
background-color: #eee;
margin-bottom: 2px;
margin-top: 3px;
}
.table-card-item img{
max-width: 60px;
max-height: 60px;
}
.table-card-item .item-title{
background-color: #666;
color: #fff;
padding: 5px;
}
.table-card-item .item-value{
padding: 5px;
}
</style>
<script>
@@ -26,7 +51,7 @@
var element = layui.element;
var util = layui.util;
var defaultCookieSetting = {
path:'/',
path: '/',
expires: 7,
}
//执行
@@ -37,11 +62,11 @@
if (type === 'bar1') {
var skinName = $.cookie('skin-name')
$('body').removeClass()
if(skinName == 'skin-1'){
$.cookie('skin-name','skin-0',defaultCookieSetting)
if (skinName == 'skin-1') {
$.cookie('skin-name', 'skin-0', defaultCookieSetting)
$('body').addClass('skin-0')
}else{
$.cookie('skin-name','skin-1',defaultCookieSetting)
} else {
$.cookie('skin-name', 'skin-1', defaultCookieSetting)
$('body').addClass('skin-1')
}
@@ -73,7 +98,52 @@
}
})
}
// 表格转卡片
var tableContainer = $('.layui-table').parent()
$('.layui-table').addClass('layui-hide-xs')
var cardList = $('<div class="table-card layui-show-xs-block layui-hide-md"></div>').prependTo(tableContainer)
$('.layui-table tbody tr').each(function () {
var trItem = this;
var boxItem = $('.tpl .table-card-box').clone()
$.each($(trItem).data(),function(index,value){
$(boxItem).data(index,value)
})
$(trItem).find('td').each(function (index, ele) {
var itemItem = $('.tpl .table-card-item').clone()
$(itemItem).find('.item-title').text($('.layui-table thead th').eq(index).text())
$(ele).children().clone().appendTo($(itemItem).find('.item-value'))
$(itemItem).appendTo(boxItem)
})
$(boxItem).appendTo(cardList)
})
}, 1);
})
</script>
{:get_system_config('site_tongji')}
{:get_system_config('site_tongji')}
<div class="tpl" style="display: none;">
<div class="table-card-box item">
</div>
<div class="table-card-item">
<div class="item-title"></div>
<div class="item-value"></div>
</div>
</div>

View File

@@ -72,7 +72,7 @@
<td colspan="10">暂无数据</td>
</tr>';{/php}
{volist name="list" id="vo" empty="$empty"}
<tr data-id="{$vo.id}">
<tr class="item" data-id="{$vo.id}">
<td>{$vo.id}</td>
<td>
{switch $vo.mime_type}
@@ -143,11 +143,11 @@
$('.clear').click(function () {
var item = this;
console.log($(item).parents('tr').data('id'));
console.log($(item).parents('.item').data('id'));
layer.confirm('确定要清除吗?清除后不能恢复', function () {
$.get('{:url("File/clear")}', {
id: $(item).parents('tr').data('id')
id: $(item).parents('.item').data('id')
}, function (result) {
if (result.code == 0) {
layer.msg('删除成功');
@@ -163,7 +163,7 @@
layer.confirm('确定要强制清除吗?该文件有可能正在使用', function () {
$.get('{:url("File/clear")}', {
id: $(item).parents('tr').data('id')
id: $(item).parents('.item').data('id')
}, function (result) {
if (result.code == 0) {
layer.msg('删除成功');

View File

@@ -50,7 +50,7 @@
<tbody>
{volist name='list' id='vo'}
<tr data-id="{$vo.id}">
<tr class="item" data-id="{$vo.id}">
<td>{$vo.id}</td>
<td>{$vo.account}</td>
<td><img src="{$vo.avatar}" alt=""></td>
@@ -90,11 +90,11 @@
var item = this;
layer.confirm('确定要删除吗?',function(){
$.get('{:url("delete")}',{
id:$(item).parents('tr').data('id')
id:$(item).parents('.item').data('id')
},function(result){
layer.msg('删除成功');
$(item).parents('tr').remove();
$(item).parents('.item').remove();
})
})
})