fix

Helius

2024-01-30 7eb522243fb5dce2b7268fdf0927409d5a3b0d70

 src/main/resources/templates/febs/views/modules/vip/goods-select-list.html

New file
@@ -0,0 +1,233 @@
<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">&#xe848;</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">&#xe848;</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>