admin-apps/js/shop/coupondetail.js

let cacheData = {
}
var brandName =  getQueryString("brandName");
var couponname =  getQueryString("name");

$(function () {
    let couponId = getQueryString("couponId");
    
    let url = '../coupon/useDetailList';
    if (couponId) {
        url += '?couponId=' + couponId;
    }
    $("#jqGrid").Grid({
        url: url,
        rownumWidth:60,
        
        loadComplete:function()
        {
            var rowNum = $("#jqGrid").find('.jqgrow').length;
            if(!rowNum)
            {
                if(!$("#emptyRecords").html())
                {
                    $("#jqGrid").append('<div id="emptyRecords" style="width:100%; height:200px;  text-align:center;">'
                            +'<div style="width:220px; height:100px; padding-top:40px; clear:both; margin:0 auto ;position: absolute;top: 190px;left: 50%;transform: translateX(-50%);">'
                            +'<div>暂无人领取优惠券</div>'
                            +'</div></div>');
                    console.log('wwwww',$("#gridTable").parent());

                }
                $("#emptyRecords").show();
            }
            else
            {
                $("#emptyRecords").hide();
            }
        },
        colModel: [
            {label: 'idx', name: 'idx', index: 'id', key: true, hidden: true},
            {label: '优惠券编码', name: 'couponSn', index: 'coupon_sn', width: 80},
            {
                label: '发放类型', name: 'sendType', index: 'send_type', width: 80, formatter: function (value) {
                    if (value == 0) {
                        return '全场赠券';
                    } else if (value == 1) {
                        return '会员赠券';
                    } else if (value == 2) {
                        return '购物赠券';
                    } else if (value == 3) {
                        return '注册赠券';
                    }
                    return '-';
                }
            },
            {label: '订单号', name: 'orderSn', index: 'order_sn', width: 80},
            {label: '会员编码', name: 'userId', index: 'user_id', width: 80},
            {label: '会员名称', name: 'userName', index: 'user_name', width: 80},
            {label: '使用状态', name: 'useStatus', index: 'use_status', width: 80,
                formatter: function (value) {
                    if (value == 1) {
                        return '已领取';
                    } else if (value == 2) {
                        return '已使用';
                    } else if (value == 3) {
                        return '已过期';
                    } else if (value == 4) {
                        return '已作废';
                    }
                    return '-';
            }},
            {label: '状态变更时间', name: 'updateTime', index: 'update_time', width: 80},
            {
                label: '操作', width: 100,  align:'center', sortable: false, formatter: function (value, col, row) {
                    cacheData[col.rowId] = row
                    if (row.useStatus == 1) {
                        return '<button class="btn btn-outline btn-warning" onclick="vm.void(' + col.rowId + ');event.cancelBubble=true;"><i></i>&nbsp;作废</button>'
                    }
                    return '';
            }
        }]
    });
});

var vm = new Vue({
    el: '#rrapp',
    data: {
        showList: true,
        title: null,
        userCoupon: {},
        q: {
            userName: '',
            couponName: ''
        },
        brandName:brandName,
        name:couponname
    },
    methods: {
        query: function () {
            vm.reload();
        },
        add: function () {
            vm.showList = false;
            vm.title = "新增";
            vm.userCoupon = {};
        },
        update: function (event) {
            var id = getSelectedRow("#jqGrid");
            if (id == null) {
                return;
            }
            vm.showList = false;
            vm.title = "修改";

            vm.getInfo(id)
        },
        saveOrUpdate: function (event) {
            var url = vm.userCoupon.id == null ? "../usercoupon/save" : "../usercoupon/update";

            Ajax.request({
                type: "POST",
                url: url,
                contentType: "application/json",
                params: JSON.stringify(vm.userCoupon),
                successCallback: function (r) {
                    alert('操作成功', function (index) {
                        vm.reload();
                    });
                }
            });
        },
        void: function (rowId) {
            let row = cacheData[rowId]
            let msg = '作废后，优惠券将无法使用，是否继续？'
            confirm(msg, function () {
                Ajax.request({
                    url: '../usercoupon/cancelUserCoupon?userId='+row.userId+'&couponId='+row.id,
                    contentType: "application/json",
                    successCallback: function (r) {
                        alert('操作成功', function (index) {
                            vm.reload();
                        });
                    }
                });
            })
        },
        del: function (event) {
            var ids = getSelectedRows("#jqGrid");
            if (ids == null) {
                return;
            }
            confirm('确定要删除选中的记录？', function () {

                Ajax.request({
                    type: "POST",
                    url: "../usercoupon/delete",
                    contentType: "application/json",
                    params: JSON.stringify(ids),
                    successCallback: function (r) {
                        alert('操作成功', function (index) {
                            vm.reload();
                        });
                    }
                });
            });
        },
        getInfo: function (id) {
            Ajax.request({
                url: "../usercoupon/info/" + id,
                async: true,
                successCallback: function (r) {
                    vm.userCoupon = r.userCoupon;
                }
            });
        },
        reload: function (event) {
            vm.showList = true;
            var page = $("#jqGrid").jqGrid('getGridParam', 'page');
            $("#jqGrid").jqGrid('setGridParam', {
                postData: {'userName': vm.q.userName, 'couponName': vm.q.couponName},
                page: page
            }).trigger("reloadGrid");
        }
    }
});