Skip to content

Instantly share code, notes, and snippets.

@arganzheng

arganzheng/lottery_create.jsp

Created July 10, 2013 11:10
Show Gist options
  • Save arganzheng/5965434 to your computer and use it in GitHub Desktop.
Save arganzheng/5965434 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
lottery_create.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>微生活抽奖模块管理后台</title>
<link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="/static/css/datetimepicker.css" rel="stylesheet" media="screen">
</head>
<body>
<h1>微生活抽奖模块管理后台</h1>
<div class="container">
<form class="form-horizontal" method="POST">
<fieldset class="form-horizontal">
<input id="token" name="g_tk" type="hidden" />
<input name="g_ty" type="hidden" value="lk" />
<legend>创建抽奖活动 <small>^_^</small></legend>
<div class="control-group">
<label class="control-label" for="inputName">活动名称*</label>
<div class="controls">
<input type="text" id="inputName" maxlength="20" placeholder="不超过20字" name="name"/>
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputStartTime">开始时间*</label>
<div class="controls">
<div class="input-append date form_datetime" data-date="2013-04-01 00:00:00" >
<input size="16" type="text" value="2013-04-01 00:00:00" id="inputStartTime" name="startTime">
<span class="add-on"><i class="icon-remove"></i></span>
<span class="add-on"><i class="icon-th"></i></span>
</div>
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputEndTime">结束时间*</label>
<div class="controls">
<div class="input-append date form_datetime" data-date="2013-05-01 00:00:00">
<input size="16" type="text" value="2013-05-01 00:00:00" id="inputEndTime" name="endTime">
<span class="add-on"><i class="icon-remove"></i></span>
<span class="add-on"><i class="icon-th"></i></span>
</div>
</div>
</div>
<div class="input-append">
<label class="control-label" for="inputDailyLimit">抽奖次数*</label>
<div class="controls">
<div class="btn-group">
<div class="input-prepend input-append">
<span class="add-on">每天</span>
<input class="span1" id="inputDailyLimit" type="text" name="dailyLimit" value="1">
<span class="add-on">次</span>
</div>
</div>
</div>
</div>
<h4>奖品配置</h4>
<div class="control-group" id="awards" >
<div id="award" class="awardTemplate" style="display:none;">
<label class="control-label" id="labelAwardLevel" for="inputAwardName"></label>
<div class="controls">
<select class="span2" id="selectAwardType">
<option value="Coupon" selected>优惠卷</option>
</select>
<input type="text" id="inputAwardName" placeholder="奖品名称" maxlength="20" >
<input type="text" id="inputAwardBalance" class="input-small" placeholder="奖品数量" >
<input type="text" id="inputCouponTemplateId" placeholder="优惠卷模版id">
<a href="javascript:;" id="remove_award_button" title="删除该奖品" style="display:none;">删除</a>
</div>
</div>
<div id="award-1">
<label class="control-label" id="labelAwardLevel-1" for="inputAwardName-1">一等奖</label>
<div class="controls">
<select class="span2" id="selectAwardType-1">
<option value="Coupon" selected>优惠卷</option>
</select>
<input type="text" id="inputAwardName-1" placeholder="奖品名称" maxlength="20" >
<input type="text" id="inputAwardBalance-1" class="input-small" placeholder="奖品数量" >
<input type="text" id="inputCouponTemplateId-1" placeholder="优惠卷模版id">
</div>
</div>
</div>
<div class="controls">
<a href="javascript:;" id="add_award_button">增加奖项</a>
</div>
<h4>活动简要描述</h4>
<div class="controls">
<textarea id="textareaDescription" class="input-block-level" rows="10" placeholder="活动简要描述：如活动背景、活动规则、职责说明等" name="description"></textarea>
</div>
<div class="form-actions">
<button id="buttonSave" type="submit" class="btn btn-large btn-primary">保存活动</button>
<button type="button" class="btn btn-large">预览</button>
</div>
</fieldset>
</form>
</div> <!-- /container -->
<script type="text/javascript" src="http://static.paipaiimg.com/js/jquery-1.8.0.min.js" ></script>
<script type="text/javascript" src="http://static.paipaiimg.com/js/bootstrap.js" ></script>
<script type="text/javascript" src="/static/js/bootstrap-datetimepicker.min.js" charset="UTF-8"></script>
<script type="text/javascript" src="/static/js/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
<script type="text/javascript" src="/js/ls.core.js" ></script>
<script type="text/javascript">
awardLevelMap={1:'一等奖', 2:'二等奖', 3:'三等奖', 4:'四等奖', 5:'五等奖'};
awardCount=1; // 奖项数量（也是目前的最低奖项）
$('#add_award_button').click( function() { // 添加一个奖项
var level=awardCount+1;
var newAward= $('.awardTemplate').clone()
.attr('id', 'award-'+level)
.find('label#labelAwardLevel').text(awardLevelMap[level]).attr('id','labelAwardLevel-1').attr('for','inputAwardName-'+level).end()
.find('select#selectAwardType').attr('id', 'selectAwardType-'+level).end()
.find('input#inputAwardName').attr('id', 'inputAwardName-'+level).end()
.find('input#inputAwardBalance').attr('id', 'inputAwardBalance-'+level).end()
.find('input#inputCouponTemplateId').attr('id', 'inputCouponTemplateId-'+level).end()
.removeClass('awardTemplate')
.appendTo($('#awards'))
.hide()
.fadeIn("slow");
// 隐藏前面奖项的删除按钮
$('a#remove_award_button').hide();
newAward.find('a#remove_award_button').show();
awardCount++;
});
// 注意：动态的添加的dom元素需要使用live绑定时间，否则不生效。
$('#remove_award_button').live('click', function() {
$('#award-' + awardCount).remove();
// 显示前一个奖项的删除按钮
$('#award-' + --awardCount).find('a#remove_award_button').show();
});
$('.form_datetime').datetimepicker({
language: 'zh-CN',
format: 'yyyy-mm-dd hh:ii:ss',
weekStart: 1,
todayBtn: 1,
todayHighlight: 1,
autoclose: 1,
forceParse: 0,
startView: 2,
showMeridian: 1
});
$("form").on("submit", function( event ) {
event.preventDefault();
// construct token for csrf check
$('#token').val($getToken());
// construct lottery json object
lottery = {};
lottery['name']=$('#inputName').val();
lottery['startTime']=$('#inputStartTime').val();
lottery['endTime']=$('#inputEndTime').val();
lottery['dailyLimit']=$('#inputDailyLimit').val();
lottery['description']=$('#textareaDescription').val();
// awards
awards = [];
for(var i=0;i<awardCount;i++){
var level=i+1;
var award = {};
award['name']=$('#inputAwardName-'+level).val();
award['balance']=$('#inputAwardBalance-'+level).val();
award['type']=$('#selectAwardType-'+level).val();
award['name']=$('#inputAwardName-'+level).val();
award['imageUrl']=''; // should be @NotNull!
var coupon = {};
coupon['code'] = $('#inputCouponTemplateId-'+level).val();
award['property']=JSON.stringify(coupon);
awards[i]=award;
}
lottery['awards']= awards;
$.ajax({
type : "POST",
url : '/buyer/hac-back/save_lottery.xhtml?g_ty=lk&g_tk=' + $getToken(),
data : JSON.stringify(lottery),
contentType: "application/json; charset=UTF-8",
success: function(result) {
console.log(result);
if (result.errorCode) {
alert(result.msg || "服务器异常[" + result.errorCode + "],请稍后再次尝试。");
return;
}
alert("创建活动成功！");
window.location.href = 'lottery_list.xhtml';
},
error : function(err){
alert("http请求错误:" + err);
}
});
return false; // keeps the page from not refreshing
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment