<!DOCTYPE html>
|
<html class="x-admin-sm" xmlns:v-bind="http://www.w3.org/1999/xhtml">
|
|
<head>
|
<meta charset="UTF-8">
|
<title>欢迎页面-X-admin2.2</title>
|
<meta name="renderer" content="webkit">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="viewport"
|
content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
|
<link rel="stylesheet" href="./css/font.css">
|
<link rel="stylesheet" href="./css/xadmin.css">
|
<link rel="stylesheet" href="./css/common.css">
|
<script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
|
<script type="text/javascript" src="./js/xadmin.js"></script>
|
<script type="text/javascript" src="./js/vue.min.js"></script>
|
<script src="js/http.js" type="text/javascript" charset="utf-8"></script>
|
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
|
<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
|
<!--[if lt IE 9]>
|
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
|
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
|
<script src="js/http.js"></script>
|
|
<![endif]-->
|
|
<style>
|
body {
|
background: white;
|
}
|
|
#main {
|
max-width: 700px;
|
padding: 20px;
|
}
|
|
.item .title {
|
background: #EEEEEE;
|
color: black;
|
font-weight: bold;
|
padding: 2px 10px;
|
font-size: 16px;
|
}
|
|
.item .content {
|
padding: 10px 10px;
|
font-size: 14px;
|
color: grey;
|
}
|
|
p {
|
line-height: 20px;
|
}
|
|
div {
|
line-height: 20px;
|
}
|
|
.item .content .banner {
|
max-width: 150px;
|
max-height: 150px;
|
margin-right: 15px;
|
}
|
|
.item .content .icon {
|
width: 60px;
|
height: 60px;
|
}
|
|
</style>
|
</head>
|
<body>
|
<div id="main">
|
|
<div class="body">
|
|
|
<div class="item">
|
|
<div class="title">
|
抽奖活动封面:
|
</div>
|
<div class="content">
|
<img class="banner" v-bind:src="activity.poster"/>
|
</div>
|
|
|
</div>
|
|
<div class="item">
|
|
<div class="title">
|
抽奖活动横幅:
|
</div>
|
<div class="content" style="display: flex;flex-wrap: wrap;">
|
<img class="banner" v-bind:src="banner.url" v-for="banner in activity.bannerList"/>
|
</div>
|
</div>
|
|
|
<div class="item">
|
|
<div class="title">
|
奖品信息共{{awardInfo.length}}项:
|
</div>
|
<div class="content">
|
|
<div class="award" v-for="(item,index) in awardInfo" style="display: flex;">
|
奖品信息{{index+1}}:[{{item.type}}]{{item.name}} 预估奖金成本：{{item.data.total}}元
|
</div>
|
|
</div>
|
</div>
|
|
|
<div class="item">
|
|
<div class="title">
|
参与条件:
|
</div>
|
<div class="content">
|
|
<div>{{joinInfo.must?'必要参与条件:':'非必要参与条件：'}}</div>
|
<div>
|
<p>sceneId:{{joinInfo.adInfo.data.sceneId}}</p>
|
<p>生活号名称：{{joinInfo.adInfo.data.name}}</p>
|
<p>生活号头像：</p>
|
<p><img class="icon" v-bind:src="joinInfo.adInfo.data.icon"></p>
|
|
<p>参与条件说明：<br><span v-html="joinInfo.desc?joinInfo.desc.replace(/\n/g,'<br>') :'未设置'"> {{joinInfo.desc?joinInfo.desc :'未设置'}}</span>
|
</p>
|
</div>
|
</div>
|
</div>
|
|
|
<div class="item">
|
|
<div class="title">
|
开奖条件:
|
</div>
|
<div class="content">
|
<div>至少参与人数：{{openInfo.minPersonCount}}人</div>
|
<div>至多参与人数：{{openInfo.maxPersonCount}}人</div>
|
<div>有效期：{{openInfo.day}}天</div>
|
<div>开奖条件说明：</div>
|
<span v-html="openInfo.desc?openInfo.desc.replace(/\n/g,'<br>'):'无/未设置'"></span>
|
</div>
|
</div>
|
|
|
<div class="item">
|
本次活动需要预付金额：<span style="color: red;font-size: 20px;">{{money}}元</span>
|
|
|
</div>
|
|
</div>
|
|
<hr class="layui-bg-gray">
|
|
|
<div class="bottom">
|
<div class="layui-col-md4">
|
<button class="layui-btn layui-btn-primary" v-on:click="back">返回修改</button>
|
</div>
|
|
<div class="layui-col-md8" style="text-align: right;">
|
<button class="layui-btn layui-btn-normal" style="width: 150px" v-on:click="saveActivity">仅保存</button>
|
|
<button class="layui-btn" style="width: 150px" v-on:click="publishActivity">发布活动</button>
|
</div>
|
</div>
|
|
</div>
|
|
<script src="js/lodash.js"></script>
|
<script src="js/common.js"></script>
|
|
<script>
|
common.initLayui(function () {
|
//layui相关初始化成功
|
app.initData();
|
});
|
|
var data;
|
|
var app = new Vue({
|
el: '#main',
|
data: {
|
activity: {},
|
awardInfo: [],
|
openInfo: {},
|
joinInfo: {
|
adInfo: {}
|
},
|
money: 0.00
|
},
|
created: function () {
|
|
},
|
methods: {
|
//初始化数据
|
initData() {
|
data = common.getTempData("activity");
|
if (!data) {
|
common.notify.error("活动数据为空")
|
return;
|
}
|
// var data = "{\"activity\":{\"id\":10048,\"poster\":\"https://daylucky-1255749512.cos.ap-nanjing.myqcloud.com/image/activity/poster/71b27cc5-d3cb-4bfc-b602-0326a44b7fb8.jpeg\",\"bannerList\":[],\"tags\":[]},\"joinInfo\":{\"id\":50,\"adInfo\":{\"data\":{\"icon\":\"https://daylucky-1255749512.cos.ap-nanjing.myqcloud.com/image/activity/sponsorad/ecd50bfd-6ae9-4246-9cca-45b95498dcdb.png\",\"name\":\"天天快省\",\"sceneId\":\"48a5df949dd5406193dcdba81f0bb9fd\",\"desc\":\"每天为广大用户提供日常生活热门资讯，推荐吃喝玩乐等优惠和内容服务\"},\"type\":\"alipayLife\"},\"must\":0,\"desc\":\"注：无需关注生活号，生活号仅作呈现\\n参与说明：\\n1. 本次抽奖活动是由生活号[天天快省]赞助所有奖品；\\n2. 本抽奖活动绝对真实有效、公平公正；\\n3. 感恩每个参与抽奖活动的用户；\"},\"openInfo\":{\"id\":50,\"minPersonCount\":40000,\"maxPersonCount\":50000,\"day\":3,\"desc\":\"1. 若累计参与抽奖人数不足40000人，本活动将不会开奖；\\n2. 在开奖时间提前达到30000人需等待至开奖时间达到后开奖；\\n3. 为了保障本抽奖活动公平性，抽奖人数达50000人后将会提前开奖；\\n4. 开奖后五分钟内中奖者即可收到中奖提醒消息。\"},\"awardInfo\":[{\"id\":92,\"title\":\"\",\"data\":{\"total\":2000,\"count\":1,\"type\":1},\"type\":\"alipayRedPackage\",\"selected\":false},{\"id\":93,\"title\":\"\",\"data\":{\"total\":5000,\"count\":500,\"type\":1},\"type\":\"alipayRedPackage\",\"selected\":false},{\"id\":94,\"title\":\"\",\"data\":{\"total\":10000,\"count\":5000,\"type\":2},\"type\":\"alipayRedPackage\",\"selected\":false}]}";
|
var temp = JSON.parse(data);
|
for (key in temp) {
|
this[key] = temp[key];
|
}
|
var money = 0;
|
for (var i = 0; i < this.awardInfo.length; i++) {
|
var award = this.awardInfo[i];
|
var type = award.data.type;
|
switch (type) {
|
//平分
|
case 1:
|
var percent = award.data.total / award.data.count;
|
award.type = '分'
|
award.name = "固定金额红包" + percent + "元×" + award.data.count + "份"
|
break;
|
//随机
|
case 2:
|
award.type = '随'
|
award.name = this.awardInfo[i].name = "随机金额红包共" + award.data.total + "元，" + award.data.count + "份"
|
break;
|
|
}
|
money += parseFloat(this.awardInfo[i].data.total)
|
}
|
this.money = money;
|
},
|
back: function () {
|
window.history.go(-1);
|
},
|
//添加
|
requestAdd: function (data, type) {
|
var params = {
|
data: data,
|
type: type
|
}
|
|
common.show
|
|
//发异步，把数据提交给php
|
ksapp.post('/admin/activity/addActivity', params, function (res) {
|
if (res.code == 0) {
|
var index = layer.alert("增加成功", {
|
icon: 6
|
},
|
function () {
|
layer.close(index);
|
});
|
common.removeTempData("activity");
|
} else {
|
layer.msg(res.msg);
|
}
|
|
}, function (res) {
|
});
|
},
|
|
saveActivity: function () {
|
this.requestAdd(data, 'save');
|
},
|
publishActivity: function () {
|
this.requestAdd(data, 'publish');
|
},
|
}
|
});
|
</script>
|
</body>
|
|
</html>
|
