<div class="layui-fluid layui-anim febs-anim" id="febs-select-goods" lay-title="商品列表">
|
<div class="layui-row febs-container">
|
<div class="layui-col-md12">
|
<div class="layui-tab layui-tab-brief" lay-filter="goods-select-tab">
|
<ul class="layui-tab-title">
|
<li class="layui-this">付费商品</li>
|
<li>积分商品</li>
|
</ul>
|
<div class="layui-tab-content">
|
<div class="layui-tab-item layui-show">
|
<div class="layui-card">
|
<div class="layui-card-body febs-table-full">
|
<form class="layui-form layui-table-form" lay-filter="goods-select-table-form" id="form">
|
<div class="layui-row">
|
<div class="layui-col-md10">
|
<div class="layui-form-item">
|
<div class="layui-inline">
|
<label class="layui-form-label layui-form-label-sm">商品名称</label>
|
<div class="layui-input-inline">
|
<input type="text" placeholder="商品名称" name="goodsName" autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="layui-col-md2 layui-col-sm12 layui-col-xs12 table-action-area">
|
<div class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain table-action" id="query">
|
<i class="layui-icon"></i>
|
</div>
|
</div>
|
</div>
|
</form>
|
<table lay-filter="goodsListTable" id="goodsListTable" lay-data="{id: 'goodsListTable'}"></table>
|
</div>
|
</div>
|
</div>
|
|
<div class="layui-tab-item">
|
<div class="layui-card">
|
<div class="layui-card-body febs-table-full" id="scoreForm">
|
<form class="layui-form layui-table-form" lay-filter="goods-select-table-form">
|
<div class="layui-row">
|
<div class="layui-col-md10">
|
<div class="layui-form-item">
|
<div class="layui-inline">
|
<label class="layui-form-label layui-form-label-sm">商品名称</label>
|
<div class="layui-input-inline">
|
<input type="text" placeholder="商品名称" name="goodsName" autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="layui-col-md2 layui-col-sm12 layui-col-xs12 table-action-area">
|
<div class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain table-action" id="scoreQuery">
|
<i class="layui-icon"></i>
|
</div>
|
</div>
|
</div>
|
</form>
|
<table lay-filter="scoreGoodsListTable" id="scoreGoodsListTable" lay-data="{id: 'scoreGoodsListTable'}"></table>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
|
<div class="layui-form-item febs-hide">
|
<button class="layui-btn" id="goods-select-form-submit"></button>
|
<button class="layui-btn" id="goods-select-close"></button>
|
</div>
|
</div>
|
</div>
|
<style type="text/css">
|
.layui-table-cell{
|
text-align:center;
|
height: auto;
|
white-space: nowrap; /*文本不会换行，在同一行显示*/
|
overflow: hidden; /*超出隐藏*/
|
text-overflow: ellipsis; /*省略号显示*/
|
}
|
.layui-table img{
|
max-width:100px
|
}
|
::-webkit-scrollbar {
|
height: 20px !important;
|
background-color: #f4f4f4;
|
}
|
</style>
|
<script type="text/html" id="isSkuFormat">
|
{{# if(d.isSku === 1) { }}
|
<span>是</span>
|
{{# } else { }}
|
<span>否</span>
|
{{# } }}
|
</script>
|
<script type="text/html" id="goodsTypeFormat">
|
{{# if(d.isNormal == 1) { }}
|
<span>普通商品</span>
|
{{# } else { }}
|
<span>套餐</span>
|
{{# } }}
|
</script>
|
<style>
|
.layui-form-onswitch {
|
background-color: #5FB878 !important;
|
}
|
</style>
|
<!-- 表格操作栏 end -->
|
<script data-th-inline="javascript" type="text/javascript">
|
// 引入组件并初始化
|
layui.use([ 'jquery', 'form', 'table', 'febs'], function () {
|
var $ = layui.jquery,
|
febs = layui.febs,
|
form = layui.form,
|
table = layui.table,
|
element = layui.element,
|
$view = $('#febs-select-goods'),
|
$query = $view.find('#query'),
|
$searchForm = $view.find('#form'),
|
$scoreSearchForm = $view.find('#scoreForm'),
|
$scoreQuery = $view.find('#scoreQuery'),
|
sortObject = {field: 'isSale', type: 'asc'},
|
tableIns,
|
tableIndex = [[${tableIndex}]],
|
tableSelect = 'goodsListTable',
|
scoreTableIns;
|
|
form.render();
|
let currPageGoods = 1;//首先默认值为1，防止出错
|
//获取当前页
|
currPageGoods = $view.find(".layui-laypage-em").next().html();
|
// 表格初始化
|
initTable();
|
initScoreTable();
|
|
// 查询按钮
|
$query.on('click', function () {
|
var params = $.extend(getQueryParams($searchForm), {field: sortObject.field, order: sortObject.type});
|
tableIns.reload({where: params, page: {curr: 1}});
|
});
|
|
// 查询按钮
|
$scoreQuery.on('click', function () {
|
var params = $.extend(getQueryParams($scoreSearchForm), {field: sortObject.field, order: sortObject.type});
|
scoreTableIns.reload({where: params, page: {curr: 1}});
|
});
|
|
function initTable() {
|
var tableFeilds = [
|
{type: 'radio', title: ''},
|
{field: 'goodsName', title: '商品名称', minWidth: 140,align:'left'},
|
{field: 'thumb', title: '缩略图',
|
templet: function (d) {
|
return '<a lay-event="seeImgThumb"><img id="seeImgThumb'+d.id+'" src="'+d.thumb+'" alt=""></a>';
|
}, minWidth: 150,align:'center'},
|
{field: 'categaryName', title: '分类', minWidth: 140,align:'left'},
|
{templet:"#goodsTypeFormat", title: '商品类型', minWidth: 140,align:'left'},
|
{field: 'presentPrice', title: '现价', minWidth: 100,align:'left'},
|
{field: 'originalPrice', title: '原价', minWidth: 100,align:'left'},
|
{field: 'stock', title: '商品库存', minWidth: 100,align:'left'},
|
{field: 'skuVolume', title: '商品销量', minWidth: 100,align:'left'},
|
];
|
|
tableIns = febs.table.init({
|
elem: $("#goodsListTable"),
|
id: 'goodsListTable',
|
url: ctx + 'admin/goods/goodsList?goodsType=1&isSale=1',
|
cols: [tableFeilds]
|
});
|
}
|
|
// table.on('row(goodsListTable)', function(obj){
|
// var data = obj.data; // 获取当前行数据
|
//
|
// console.log(obj)
|
// // obj.setRowChecked({
|
// // type: 'radio'
|
// // });
|
// });
|
|
function initScoreTable() {
|
var scoreFields = [
|
{type: 'radio', title: ''},
|
{field: 'goodsName', title: '商品名称', minWidth: 140,align:'left'},
|
{field: 'thumb', title: '缩略图',
|
templet: function (d) {
|
return '<a lay-event="seeImgThumb"><img id="seeImgThumb'+d.id+'" src="'+d.thumb+'" alt=""></a>';
|
}, minWidth: 150,align:'center'},
|
{field: 'categaryName', title: '分类', minWidth: 140,align:'left'},
|
{field: 'presentPrice', title: '现价', minWidth: 100,align:'left'},
|
{field: 'originalPrice', title: '原价', minWidth: 100,align:'left'},
|
{field: 'stock', title: '商品库存', minWidth: 100,align:'left'},
|
{field: 'skuVolume', title: '商品销量', minWidth: 100,align:'left'},
|
]
|
|
scoreTableIns = febs.table.init({
|
elem: $("#scoreGoodsListTable"),
|
id: 'scoreGoodsListTable',
|
url: ctx + 'admin/goods/goodsList?goodsType=2&isSale=1',
|
cols: [scoreFields]
|
});
|
}
|
|
// 获取查询参数
|
function getQueryParams(elem) {
|
return {
|
goodsName: elem.find('input[name="goodsName"]').val().trim(),
|
};
|
}
|
|
$("#goods-select-form-submit").on('click', function() {
|
var checkData = table.checkStatus(tableSelect).data;
|
if (checkData.length > 0) {
|
if (tableIndex != -1) {
|
parent.setGoodsSelect(tableIndex, checkData[0]);
|
} else {
|
parent.setConfigGoodsSelect(tableIndex, checkData[0]);
|
}
|
}
|
})
|
|
element.on('tab(goods-select-tab)', function(data) {
|
if (data.index == 0) {
|
tableSelect = 'goodsListTable';
|
}
|
|
if (data.index == 1) {
|
tableSelect = 'scoreGoodsListTable';
|
}
|
});
|
|
})
|
</script>
|
