123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="referrer" content="no-referrer"/>
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
- <meta http-equiv="pragma" content="no-cache">
- <meta http-equiv="cache-control" content="no-cache">
- <meta http-equiv="expires" content="0">
- <link rel="shortcut icon" href="/favicon.ico"/>
- <link rel="bookmark" href="/favicon.ico"/>
- <link href="/css/common/common.css" rel="stylesheet" type="text/css" />
- <link href="/css/admin/console.css" rel="stylesheet" type="text/css"/>
- <link href="/ref/layui-v2.6.8/layui/css/layui.css" rel="stylesheet" type="text/css" />
- <script src="/ref/layui-v2.6.8/layui/layui.js" type="text/javascript"></script>
- <script src="/ref/jquery/jquery-3.4.1.js" type="text/javascript"></script>
- <script src="/js/common/common.js" type="text/javascript"></script>
- </head>
- <body style="overflow-x: hidden">
- <center>
- <div class="aiqr-container" style="margin-bottom: 0px; padding-top: 40px; width: calc(100% - 100px); margin-bottom: 20px">
- <div class="cms-manage-title">
- <div style="float: right">
- <input class="search-condition-elem" style="margin-top: 0px" id="search-name" placeholder="奖品名">
- <input class="search-condition-elem" style="margin-top: 0px" id="search-activityId" placeholder="活动id">
- <select class="search-condition-elem" style="margin-top: 0px" id="search-type">
- <option value="">全部状态</option>
- <option value="1">积分</option>
- <option value="2">实体商品</option>
- <option value="3">现金红包</option>
- </select>
- <button class="cms-bar-btn" id="add-lottery-item-btn" style="background-color: orangered; box-shadow: 0px 0px 5px #e56535;">新增奖品</button>
- </div>
- </div>
- <table class="account-apply-tab layui-table" id="search-result-tab">
- <thead>
- <tr>
- <th style="width: 50px">奖品编号</th>
- <th style="width: 120px">活动编号</th>
- <th style="width: 100px">奖品名</th>
- <th style="width: 100px">类型</th>
- <th style="width: 100px">icon</th>
- <th style="width: 100px">封面图</th>
- <th style="width: 70px">槽位</th>
- <th style="width: 70px">总库存</th>
- <th style="width: 95px">时间</th>
- </tr>
- </thead>
- <tbody>
- </tbody>
- </table>
- <div id="page"></div>
- <div style="clear: both"></div>
- </div>
- </center>
- </body>
- <script>
- var activityId = currentActivityId;
- if (activityId != '') {
- $("#search-activityId").val(activityId);
- }
- var firstSearch = true;
- var curr = 0, size = 10, total = 0;
- $("#add-lottery-item-btn").on('click', function () {
- addLotteryItem();
- })
- function addLotteryItem() {
- layer.open({
- type: 1,
- title: false,
- skin: 'layui-layer-demo', //样式类名
- closeBtn: 0, //不显示关闭按钮
- anim: 2,
- area: ['380px', '716px'],
- shadeClose: true, //开启遮罩关闭
- content: '<div class=\"popup-module-header-div\">' +
- '<p class=\"popup-module-title\">创建抽奖奖品</p>' +
- '<p class=\"popup-module-desc\">抽奖奖品必须8个额</p>' +
- '</div>' +
- '<div class=\"popup-module-core-div\">' +
- '<div class="popup-module-core-div-item">' +
- '<input class="popup-input-number" id="activity-id" placeholder="活动id" value="'+activityId+'">' +
- '</div>' +
- '<div class="popup-module-core-div-item">' +
- '<select class="popup-input-number" style="width: 100%; height: 100%; border: 0px" id="item-type">' +
- ' <option value="">类型</option>' +
- // ' <option value="1">猿气值</option>' +
- ' <option value="2">实体商品</option>' +
- ' <option value="3">现金红包</option>' +
- '</select>' +
- '</div>' +
- '<div class="popup-module-core-div-item">' +
- '<input class="popup-input-number" id="item-name" placeholder="奖品名称,如: 猿气值 X1">' +
- '</div>' +
- '<div class="popup-module-core-div-item">' +
- '<input class="popup-input-number" id="item-slot" placeholder="卡槽, 支持1 ~ 8">' +
- '</div>' +
- '<div class="popup-module-core-div-item">' +
- '<input class="popup-input-number" id="item-stock" placeholder="库存总量,大于0">' +
- '</div>' +
- '<div class="popup-module-core-div-item layui-upload" style="width: 50px; height: 50px" id="upload-item-icon">' +
- '<div style="width: 40px; border: 1px solid #f5f5f5; height: 50px; text-align: center; color: #c7c7c7; font-size: 20px; font-weight: 700; line-height: 100px">' +
- '<img style="position: absolute; left:0px; top:0px; width: 50px; height: 100%; border: 0px" id="item-icon">' +
- '</div>' +
- '</div>' +
- '<div class="popup-module-core-div-item layui-upload" style="width: 160px; height: 100px" id="upload-item-cover">' +
- '<div style="width: 160px; border: 1px solid #f5f5f5; height: 100px; text-align: center; color: #c7c7c7; font-size: 20px; font-weight: 700; line-height: 100px">' +
- '<img style="position: absolute; left:0px; top:0px; width: 100%; height: 100%; border: 0px" id="item-cover">' +
- '主图 <i class="layui-icon" style="font-size: 25px; margin-right: 20px;"></i> ' +
- '</div>' +
- '</div>' +
- '<div class="popup-module-core-div-item" style=\"border: 0px\">' +
- '<button class=\"popup-btn\" onclick=\"updateLotteryItem($(\'#activity-id\').val(), $(\'#item-type\').val(), ' +
- '$(\'#item-name\').val(), $(\'#item-slot\').val(), $(\'#item-stock\').val(), $(\'#item-icon\').attr(\'src\'), $(\'#item-cover\').attr(\'src\'))\">创建奖品</button>' +
- '</div>' +
- '</div>' +
- '</div>'
- });
- layui.use(['upload'], function(){
- var $ = layui.jquery
- ,upload = layui.upload
- //常规使用 - 普通图片上传
- upload.render({
- elem: '#upload-item-cover'
- ,url: '/api/file/moment/upload' //改成您自己的上传接口
- ,accept: 'images'
- ,acceptMime: '*'
- ,done: function(res){
- if(!res.success){
- return layer.msg('上传失败');
- } else {
- $('#item-cover').attr('src', res.data.url);
- }
- }
- });
- });
- layui.use(['upload'], function(){
- var $ = layui.jquery
- ,upload = layui.upload
- //常规使用 - 普通图片上传
- upload.render({
- elem: '#upload-item-icon'
- ,url: '/api/file/chat/upload' //改成您自己的上传接口
- ,headers: {upload_path: "lottery"}
- ,accept: 'images'
- ,acceptMime: '*'
- ,done: function(res){
- if(!res.success){
- return layer.msg('上传失败');
- } else {
- $('#item-icon').attr('src', res.data.url);
- }
- }
- });
- });
- }
- function updateLotteryItem(activityId, type, name, slot, stock, icon, cover) {
- if (activityId == '') {
- layer.msg("活动id不能为空");
- return;
- }
- if (type == '') {
- layer.msg("类型不能为空");
- return;
- }
- if (name == '') {
- layer.msg("名称不能为空");
- return;
- }
- if (slot == '') {
- layer.msg("卡槽设置不能为空");
- return;
- }
- if (stock == '') {
- layer.msg("库存不能为空");
- return;
- }
- if (icon == '') {
- layer.msg("icon不能为空");
- return;
- }
- if (cover == '') {
- layer.msg("封面不能为空");
- return;
- }
- $.ajax({
- url: "/api/lottery/item/save",
- type: "post",
- dataType: "json",
- contentType: "application/json;charset=utf-8",
- data: "{\"activityId\":\""+activityId+"\",\"name\":\""+name+"\",\"icon\":\""+icon+"\",\"cover\":\""+cover+"\", \"stock\": "+stock+",\"slot\": "+slot+",\"type\": "+type+"}",
- success:function (data) {
- data = eval(data);
- if (data.success){
- layer.closeAll();
- layer.msg("操作成功");
- pageNo = 1;
- searchList();
- } else {
- layer.msg(data.msg);
- }
- },error:function () {
- layer.msg("服务端异常");
- }
- })
- }
- $("#search-list-btn").on('click', function() {
- curr = 1;
- searchList();
- })
- searchList();
- function searchList() {
- $("#search-result-tab").children("tbody").empty();
- $.ajax({
- url:"/api/lottery/item/page?name="+$("#search-name").val()+"&type="+$("#search-type").val()+"&pageNo="+(curr == 0 ? 1 : curr)+"&pageSize="+size+"&activityId="+$("#search-activityId").val(),
- type:"get",
- success:function (data) {
- data = eval(data);
- if (data.success){
- $.each(data.data, function (index, value) {
- var tr = "<tr>"+
- "<td>"+value.id+"</td>"+
- "<td>"+value.activityId+"</td>"+
- "<td>"+value.name+"</td>"+
- "<td>"+value.typeName+"</td>"+
- "<td><img style='height: 40px' src='"+value.icon+"'></td>"+
- "<td><img style='height: 40px' src='"+value.cover+"'></td>"+
- "<td>"+value.slot+"</td>"+
- "<td>"+value.stock+"</td>"+
- "<td>"+formatMsgTime(value.createTime)+"</td>"+
- "</tr>";
- if (!firstSearch) {
- $("#search-result-tab").children("tbody").append(tr);
- }
- })
- if (curr == 0 || data.total != total) {
- curr = 1;
- firstSearch = false;
- total = data.total;
- initPage();
- }
- } else {}
- },error:function () {}
- })
- }
- function initPage() {
- layui.use('laypage', function(){
- var laypage = layui.laypage;
- laypage.render({
- elem: 'page',
- count: total,
- limit: size,
- curr: curr,
- jump: function(obj){
- curr = obj.curr;
- searchList();
- }
- });
- })
- }
- </script>
- <style>
- .layui-laypage a, .layui-laypage span {
- display: inline-block;
- *display: inline;
- *zoom: 1;
- vertical-align: middle;
- padding: 3px 13px;
- height: 28px;
- line-height: 28px;
- margin: 0px 5px;
- border-radius: 4px;
- background-color: #fff;
- color: #4e6ef2;
- font-size: 14px;
- border: none;
- }
- .layui-laypage a:hover, .layui-laypage span:hover {
- background: #4e6ef2;
- color: #fff;
- }
- .layui-laypage .layui-laypage-curr .layui-laypage-em {
- position: absolute;
- left: -1px;
- top: -1px;
- padding: 1px;
- width: 100%;
- height: 100%;
- border-radius: 4px;
- background: #4e6ef2;
- color: #fff;
- font-weight: normal;
- }
- .layui-laypage-next, .layui-laypage-prev {
- border-radius: 4px;
- }
- .layui-laypage-default {
- float: right;
- }
- </style>
- </html>
|