shanpin
/
chat-server


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
							<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('点点币PK')"/>
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <form id="role-form">
                <div class="select-list">
                    <ul>
                        <li>
                            期号：<input type="text" name="term" placeholder=""/>
                        </li>

                        <li>
                            活动状态：<select name="pkStatus" th:with="type=${@dict.getType('point_pk_activity_status')}">
                            <option value="">所有</option>
                            <option th:each="dict : ${type}" th:text="${dict.dictLabel}"
                                    th:value="${dict.dictValue}"></option>
                        </select>
                        </li>

                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i
                                    class="fa fa-search"></i>&nbsp;搜索</a>
                            <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i
                                    class="fa fa-refresh"></i>&nbsp;重置</a>
                        </li>
                    </ul>
                </div>
            </form>
        </div>

        <div class="btn-group-sm" id="toolbar" role="group">
            <a class="btn btn-success" onclick="add()" shiro:hasPermission="activity:point:pk:add">
                <i class="fa fa-plus"></i> 新增
            </a>
        </div>

        <div class="col-sm-12 select-table table-striped" style="overflow:scroll;">
            <table id="bootstrap-table" data-mobile-responsive="false" style="min-width:1500px;"></table>
        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    var editFlag = [[${@permission.hasPermi('system:key:edit')}]];
    var removeFlag = [[${@permission.hasPermi('system:key:del')}]];
    var osType = [[${@dict.getType('point_pk_activity_status')}]];
    var prefix = ctx + "activity/point/pk";

    $(function () {
        var options = {
            url: prefix + "/list",
            createUrl: prefix + "/add",
            updateUrl: prefix + "/edit/{id}",
            removeUrl: prefix + "/remove",
            modalName: "点点币PK",
            height: 600,
            columns: [
                {
                    field: 'term',
                    title: '活动期号',
                    align: 'center',
                    formatter: function (val, row, index) {
                        return "第" + val + "期";
                    }
                },

                {
                    field: 'title',
                    title: '题目'
                },
                {
                    field: 'redPic',
                    title: '红方图片',
                    align: 'center',
                    formatter:function (value,row,index) {
                        if(typeof value == "undefined" || value == null || value == ""){
                            return  '-';
                        }else{
                            return "<img onclick='ShowFloatingImage(this, 400, 300);' src='" + value + "' width='70' height='60'>";
                        }
                    }
                },
                {
                    field: 'bluePic',
                    title: '蓝方图片',
                    align: 'center',
                    formatter:function (value,row,index) {
                        if(typeof value == "undefined" || value == null || value == ""){
                            return  '-';
                        }else{
                            return "<img onclick='ShowFloatingImage(this, 400, 300);' src='" + value + "' width='70' height='60'>";
                        }
                    }
                }, {
                    field: 'redAnswer',
                    title: '红方选项'
                }, {
                    field: 'blueAnswer',
                    title: '蓝方选项'
                }, {
                    field: 'redPolls',
                    title: '红方票数'
                }, {
                    field: 'bluePolls',
                    title: '蓝方票数'
                }, {
                    field: 'carveUpMcoinNum',
                    title: '瓜分点点币数'
                }, {
                    field: 'pkStatus',
                    title: '活动状态',
                    align: 'center',
                    formatter: function (value, row, index) {
                        return $.table.selectDictLabel(osType, value);
                    }
                },
                {
                    field: 'lotteryTime',
                    title: '开奖时间'
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="edit(\'' + row.id + '\')"><i class="fa fa-edit"></i> 编辑</a> ');
                        return actions.join('');
                    }
                }]
        };
        $.table.init(options);
    });


    function add() {
        var url = prefix + "/add";
        $.modal.open("新增点点币PK", url, '800', '740');
    }

    function edit(id) {
        var url = prefix + "/edit/" + id;
        $.modal.open("编辑点点币PK", url, '800', '740');
    }

    function remove(id) {
        $.modal.confirm("确认要删除该记录吗？", function () {
            $.operate.post(prefix + "/del?signKey=" + id);
        });
    }

    //3个参数  分别是图片对象，图片宽度，图片高度
    function ShowFloatingImage(image, width, height) {
        //这一部分是创建一个div，将图片放大成设定的width，height
        var id = "trailimageid";
        var newdiv = document.getElementById(id);
        if(newdiv == null) {
            newdiv = document.createElement('div');
            newdiv.setAttribute('id',id);
            //需要一个移出事件，将图片返回原来大小
            newdiv.setAttribute('onmouseout', "HideElement('"+id+"');");
            document.body.appendChild(newdiv);
        }
        newdiv.innerHTML = '<img src='+image.src+ ' width='+(image.width + width) + ' height=' + (image.height + height) + ' />';
        //获取图片位置，调整图片位置样式
        var absPos = GetAbsPosition(image);
        newdiv.style.position = "absolute";
        newdiv.style.left =absPos[0] - width/2+'px';
        newdiv.style.top = absPos[1] - height/2+'px';
        newdiv.style.display="block";
    }
    //获取图片在表格中位置
    function GetAbsPosition(obj) {
        var curleft = 0, curtop = 0;
        do {
            curleft += obj.offsetLeft;
            curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);
        return [curleft,curtop];
    }
    //隐藏div
    function HideElement(id) {
        var elem = document.getElementById(id);
        elem.style.display="none";
    }
</script>
</body>
</html>