admin
2021-01-06 beb8523b95753065e67a48f9d7134fda8565bc89
活动添加后台完善
4个文件已修改
6个文件已添加
1677 ■■■■ 已修改文件
service-daylucky/src/main/java/com/ks/daylucky/controller/admin/FileUploadController.java 4 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/java/com/ks/daylucky/pojo/DTO/ImageFromEnum.java 1 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/resources/static/activity-add.html 981 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/resources/static/award-type-redpacket-divide.html 173 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/resources/static/award-type-redpacket-random.html 153 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/resources/static/css/common.css 28 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/resources/static/img/icon_checked_round.png 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/resources/static/js/common.js 125 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/resources/static/js/xadmin.js 5 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/resources/static/sponsor-ad-alipaylife.html 207 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
service-daylucky/src/main/java/com/ks/daylucky/controller/admin/FileUploadController.java
@@ -28,7 +28,7 @@
     */
    @ResponseBody
    @RequestMapping("image")
    public String uploadImage(HttpServletRequest request, String from) {
    public String uploadImage(HttpServletRequest request, String from, String dir) {
        MultipartFile image = ((MultipartHttpServletRequest) request).getFile("image");
        ImageFromEnum imageFromEnum = ImageFromEnum.valueOf(from);
        if (imageFromEnum == null) {
@@ -37,7 +37,7 @@
        String contentType = image.getContentType();
        try {
            FileUploadResult result = COSManager.getInstance().uploadFile(image.getInputStream(), "/image/" + from + "/" + UUID.randomUUID().toString() + "." + getExtensionName(contentType));
            FileUploadResult result = COSManager.getInstance().uploadFile(image.getInputStream(), "/image/" + from + "/" + dir + "/" + UUID.randomUUID().toString() + "." + getExtensionName(contentType));
            return JsonUtil.loadTrueResult(result.getUrl());
        } catch (IOException e) {
            e.printStackTrace();
service-daylucky/src/main/java/com/ks/daylucky/pojo/DTO/ImageFromEnum.java
@@ -5,6 +5,7 @@
    activity("活动");
    private ImageFromEnum(String name) {
    }
service-daylucky/src/main/resources/static/activity-add.html
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html class="x-admin-sm">
<html class="x-admin-sm" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
@@ -10,6 +10,7 @@
          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>
@@ -23,9 +24,69 @@
    <style>
        .poster {
            max-width: 300px;
            max-height: 300px;
            max-width: 150px;
            max-height: 150px;
        }
        .layui-input-inline {
            width: auto !important;
        }
        .btn-add-award {
            color: white !important;
            margin-left: 5px;
        }
        .award-type-list {
            display: flex;
        }
        .award-type-list .award-type {
            position: relative;
            margin-right: 20px;
        }
        .award-type-list img {
            position: absolute;
            right: -5px;
            width: 20px;
            height: 20px;
            top: -5px;
        }
        .desc {
            color: #999;
            padding-bottom: 5px;
        }
        textarea {
            width: 365px !important;
        }
        .banner-container {
            display: none;
        }
        .banner {
            display: flex;
        }
        .banner-image-container {
            position: relative;
            margin-right: 5px;
        }
        .banner-image-container i {
            position: absolute;
            top: 0;
            right: 0;
        }
        .hidden {
            display: none;
        }
    </style>
</head>
<body>
@@ -34,82 +95,52 @@
    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
        <div class="layui-card">
            <div class="layui-card-header">活动内容</div>
            <div class="layui-card-header">抽奖信息</div>
            <div class="layui-card-body">
                <div class="layui-row">
                    <form class="layui-form">
                        <div class="layui-form-item">
                            <label for="L_name" class="layui-form-label">
                                <span class="x-red">*</span>活动名称</label>
                            <div class="layui-input-inline">
                                <input type="text" id="L_name" name="name" lay-verify="username|required"
                                       autocomplete="off" class="layui-input"></div>
                        </div>
                    <form class="layui-form" lay-filter="form-activity-info">
                        <div class="layui-form-item">
                            <label for="L_appName" class="layui-form-label">
                                <span class="x-red">*</span>活动海报</label>
                                <span class="x-red">*</span>抽奖活动封面</label>
                            <div class="layui-input-inline">
                                <div class="layui-upload">
                                    <button type="button" class="layui-btn" id="test1">选择图片</button>
                                    <button type="button" class="layui-btn" id="choicePoster">选择图片</button>
                                    <div class="layui-upload-list">
                                        <img class="layui-upload-img poster" id="poster">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label for="L_desc" class="layui-form-label">
                                活动简介</label>
                            <div class="layui-input-inline">
                    <textarea id="L_desc" name="desc" required="" lay-verify="desc"
                              autocomplete="off" class="layui-textarea"></textarea></div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                <span class="x-red">*</span>最大参与人数</label>
                            <div class="layui-input-inline">
                                <input type="text" name="maxPersonCount" required="" lay-verify="required|number"
                                       autocomplete="off" class="layui-input"></div>
                                <span class="x-red">*</span>抽奖活动详情页横幅设置</label>
                            <div>
                                <div>
                                    <!-- lay-filter="banner" -->
                                    <input type="radio" name="showBanner" value="0" title="和抽奖活动封面一致" checked=""
                                           lay-filter="banner">
                                    <input type="radio" name="showBanner" value="1" title="重新设置" lay-filter="banner">
                                </div>
                                <div class="layui-upload layui-input-inline banner-container">
                                    <button type="button" class="layui-btn" id="choiceBanner">选择图片</button>
                                    <div class="layui-upload-list banner">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <button class="layui-btn layui-btn-radius layui-btn-normal"
                                id="saveActivityInfo" lay-submit="">保存
                        </button>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                <span class="x-red">*</span>预计开始时间</label>
                            <div class="layui-input-inline">
                                <input type="text" name="preStartTime" required=""
                                       autocomplete="off" class="layui-input"></div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                预计结束时间</label>
                            <div class="layui-input-inline">
                                <input type="text" name="preFinishTime"
                                       autocomplete="off" class="layui-input"></div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                预计开奖时间</label>
                            <div class="layui-input-inline">
                                <input type="text" name="preOpenTime"
                                       autocomplete="off" class="layui-input"></div>
                        </div>
                        <div class="layui-form-item">
                            <label for="L_remarks" class="layui-form-label"></label>
                            <button class="layui-btn layui-btn-radius layui-btn-normal" id="save"
                                    lay-filter="save-activity" lay-submit="">保存
                            </button>
                        </div>
                    </form>
                </div>
@@ -117,79 +148,54 @@
        </div>
        <div class="layui-card">
            <div class="layui-card-header">活动奖品</div>
            <div class="layui-card-header">奖品信息</div>
            <div class="layui-card-body">
                <!--奖品列表 -->
                <form class="layui-form award-form">
                    <div v-for="(item,index) in tempAwardsList">
                <form class="layui-form" lay-filter="form-award-info">
                        <div class="layui-form-item">
                            <label for="L_name" class="layui-form-label">
                                <span class="x-red">*</span>奖品名称</label>
                            <div class="layui-input-inline">
                                <input type="text" id="L_name" placeholder="请输入奖品名称" name="name" lay-verify="username|required"
                                       autocomplete="off" class="layui-input"></div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                <span class="x-red">*</span>奖品数量</label>
                            <div class="layui-input-inline">
                                <input type="text" name="maxPersonCount" placeholder="请输入奖品数量" required="" lay-verify="required|number"
                                       autocomplete="off" class="layui-input"></div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                <span class="x-red">*</span>奖品类型</label>
                            <div class="layui-input-inline">
                                <select name="city" lay-verify="required">
                                    <option value=""></option>
                                    <option value="0">支付宝现金红包</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                <span class="x-red">*</span>红包总金额</label>
                            <div class="layui-input-inline">
                                <input type="text" name="maxPersonCount" placeholder="请输入红包总金额" required="" lay-verify="required|number"
                                       autocomplete="off" class="layui-input"></div>
                        </div>
                    <div class="layui-tab layui-tab-card" lay-filter="award">
                        <ul class="layui-tab-title">
                            <li v-for="(item,index) in tempAwardsList" v-bind:class="{'layui-this':item.selected}"
                                v-bind:lay-id="index">{{item.title}}
                            </li>
                            <button class="layui-btn btn-add-award" type="button" data-type="tabAdd"
                                    v-on:click="addAward"><i
                                    class="layui-icon"></i>增加奖项
                            </button>
                        </ul>
                        <div class="layui-tab-content">
                            <div class="layui-tab-item" v-for="(item,index) in tempAwardsList"
                                 v-bind:class="{'layui-show':item.selected}">
                                <div class="award-type-list">
                                    <div class="award-type">
                                        <button type="button" class="layui-btn layui-btn-primary layui-btn-lg"
                                                v-on:click="awardRedPacktRandom($event,index)">随机红包
                                        </button>
                                        <img src="img/icon_checked_round.png" v-if="item.data.type==2">
                                    </div>
                                    <div class="award-type">
                                        <button type="button" class="layui-btn layui-btn-primary layui-btn-lg"
                                                v-on:click="awardRedPacktDivide($event,index)">固定红包
                                        </button>
                                        <img src="img/icon_checked_round.png" v-if="item.data.type==1">
                                    </div>
                                </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                <span class="x-red">*</span>中奖方式</label>
                            <div class="layui-input-inline">
                                <select name="city" lay-verify="required">
                                    <option value=""></option>
                                    <option value="0">随机</option>
                                    <option value="0">均分</option>
                                </select>
                                <button type="button"
                                        class="layui-btn layui-btn-radius layui-btn-danger btn-award-delete"
                                        v-bind:lay-index="index" v-on:click="deleteAward(index)"
                                        style="margin-top: 10px;">
                                    删除
                                </button>
                            </div>
                        </div>
                        <i @click="delAward(index)" class="layui-icon">&#xe640;</i>
                        <hr class="layui-bg-green">
                    </div>
                    <button class="layui-btn layui-btn-radius layui-btn-normal" id="saveAwardInfo" lay-submit="">保存
                    </button>
                    <i v-on:click="addAward" class="layui-btn">添加奖项</i>
                    <div class="layui-form-item">
                        <label for="L_remarks" class="layui-form-label"></label>
                        <button class="layui-btn layui-btn-radius layui-btn-normal"
                                lay-filter="save-awards" lay-submit="">保存
                        </button>
                    </div>
                </form>
            </div>
@@ -197,48 +203,465 @@
        <div class="layui-card">
            <div class="layui-card-header">开奖设置</div>
            <div class="layui-card-header">参与条件</div>
            <div class="layui-card-body">
                <form class="layui-form" lay-filter="form-join-info">
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class="x-red">*</span>参与条件</label>
                        <div class="layui-input-block">
                            <div class="desc">
                                用户满足以下设置条件后方可参与抽奖
                            </div>
                            <div>
                                <input type="radio" name="must" value="0" title="不设置/无" checked="">
                                <input type="radio" name="must" value="1" title="用户必须要满足以下条件">
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class="x-red">*</span>跳转链路</label>
                        <div>
                            <div class="award-type-list">
                                <div class="award-type">
                                    <button type="button" class="layui-btn layui-btn-primary layui-btn-lg"
                                            v-on:click="openAdEditDialog('alipayLife')">关注生活号
                                    </button>
                                    <img src="img/icon_checked_round.png" v-if="joinInfo.adInfo.type=='alipayLife'">
                                </div>
                                <div class="award-type">
                                    <button type="button" class="layui-btn layui-btn-primary layui-btn-lg">浏览小程序
                                    </button>
                                    <img src="img/icon_checked_round.png" v-if="false">
                                </div>
                                <div class="award-type">
                                    <button type="button" class="layui-btn layui-btn-primary layui-btn-lg">浏览直播间
                                    </button>
                                    <img src="img/icon_checked_round.png" v-if="false">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label for="L_desc" class="layui-form-label">
                            参与条件说明</label>
                        <div class="layui-input-inline">
                    <textarea id="L_desc" name="desc" lay-verify="desc"
                              autocomplete="off" class="layui-textarea" maxlength="256"></textarea></div>
                    </div>
                    <button class="layui-btn layui-btn-radius layui-btn-normal" id="saveJoinInfo"
                            lay-filter="save-activity" lay-submit="">保存
                    </button>
                </form>
            </div>
        </div>
        <div class="layui-card">
            <div class="layui-card-header">广告设置</div>
            <div class="layui-card-header">开奖条件</div>
            <div class="layui-card-body">
                <form class="layui-form" lay-filter="form-open-info">
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class="x-red">*</span>至少参与人数</label>
                        <div class="layui-input-inline">
                            <label class="desc">最少1000人,最多100000人,默认5000人(活动结束时止)</label>
                            <div class="flex-row flex-center">
                                <input type="text" name="minPersonCount" required="" lay-verify="integer"
                                       autocomplete="off" class="layui-input input-small" placeholder="正整数">&nbsp;人
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class="x-red">*</span>开奖时间/活动有效期</label>
                        <div class="layui-input-inline">
                            <label class="desc">至少1天,最多7天,默认3天(活动发布时起)</label>
                            <div class="flex-row flex-center">
                                <input type="text" name="day" required="" lay-verify="integer"
                                       autocomplete="off" class="layui-input input-small" placeholder="正整数">&nbsp;天
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            开奖条件说明</label>
                        <div class="layui-input-inline">
                            <label class="desc">最多150个字符,可换行且兼容符号表情</label>
                            <div class="flex-row flex-center">
                                <textarea class="layui-textarea" maxlength="150"></textarea>
                            </div>
                        </div>
                    </div>
                    <button class="layui-btn layui-btn-radius layui-btn-normal" id="saveOpenInfo"
                            lay-filter="save-activity" lay-submit="">保存
                    </button>
                </form>
            </div>
        </div>
        <button class="layui-btn layui-btn-warm layui-btn-lg" id="submit" lay-submit="">立即提交</button>
        <button class="layui-btn layui-btn-warm layui-btn-lg" v-on:click="submit">立即提交</button>
    </div>
</div>
<script src="js/common.js"></script>
<script>
    //验证管理器
    var validManager = {
        //验证抽奖信息
        verifyActivityInfo() {
            const field = common.layuiForm.val('form-activity-info');
            if (!$("#poster").attr("src")) {
                common.notify.error("请选择封面图片");
                return false;
            }
            //判断条件
            if (field.showBanner == 1 && $(".banner").find("img").length == 0) {
                common.notify.error("请选择banner图片");
                return false;
            }
            if (field.showBanner == 1 && $(".banner").find("img").length > 3) {
                common.notify.error("banner图最多3张");
                return false;
            }
            return true;
        },
        //验证奖品信息
        verifyAwardInfo() {
            console.log("verifyAwardInfo");
            if (app.tempAwardsList == null || app.tempAwardsList.length == 0) {
                common.notify.error("请添加奖项");
                return false;
            }
            var hasAward = false;
            for (var i = 0; i < app.tempAwardsList.length; i++) {
                if (app.tempAwardsList[i].data && app.tempAwardsList[i].data.type) {
                    hasAward = true;
                    break;
                }
            }
            if (!hasAward) {
                common.notify.error("请选择奖项类型");
                return false;
            }
            const field = common.layuiForm.val('form-award-info');
            return true;
        },
        //验证参与信息
        verifyJoinInfo() {
            const field = common.layuiForm.val('form-join-info');
            console.log(field);
            if (!app.joinInfo.adInfo.data) {
                common.notify.error("请选择参与条件-跳转链路");
                return false;
            }
            return true;
        },
        //验证开奖条件
        verifyOpenInfo() {
            const field = common.layuiForm.val('form-open-info');
            console.log(field);
            if (parseInt(field.minPersonCount) < 1000 || parseInt(field.minPersonCount) > 10000) {
                common.notify.error("至少参与人数的范围为:1000-10000");
                return false;
            }
            if (parseInt(field.day) < 1 || parseInt(field.day) > 7) {
                common.notify.error("活动有效期的范围为:1-7");
                return false;
            }
            return true;
        },
        verify(es) {
            for (var i = 0; i < es.length; i++) {
                if (!es[i]()) {
                    return false;
                }
            }
            return true;
        },
        verifyAll() {
            return this.verify([this.verifyActivityInfo, this.verifyAwardInfo, this.verifyJoinInfo, this.verifyOpenInfo]);
        }
    };
    var formManager = {
        //保存到临时变量
        saveActivityInfoToTemp() {
            app.temp.activity = app.activity;
        },
        saveAwardInfoToTemp() {
            app.temp.awardInfo = app.tempAwardsList;
        },
        saveJoinInfoToTemp() {
            //赋值
            const field = common.layuiForm.val('form-join-info');
            var joinInfo = app.joinInfo;
            joinInfo.must = field.must;
            joinInfo.desc = field.desc;
            app.temp.joinInfo = joinInfo;
        },
        saveOpenInfoToTemp() {
            const field = common.layuiForm.val('form-open-info');
            var openInfo = app.openInfo;
            for (key in field) {
                openInfo[key] = field[key];
            }
            app.temp.openInfo = openInfo;
        },
        saveToTemp() {
            this.saveActivityInfoToTemp();
            this.saveAwardInfoToTemp();
            this.saveJoinInfoToTemp();
            this.saveOpenInfoToTemp();
        }
    };
</script>
<script>
    //文件上传初始化
    var uploadPoster;
    var uploadBanner;
    var bannerFileList;
    common.initLayui(function () {
        //layui相关初始化成功
        app.initData();
        uploadPoster = common.initUploadImagePlugin({
            elem: "#choicePoster",
            showElem: "#poster",
            uploadUrl: "/admin/upload/image?from=activity",
            dir: 'poster',
            field: "image",
            uploadSuccess: function (res) {
                app.posterUploadSuccess(res.data);
            }
        });
        var bannerUrlList = new Array();
        uploadBanner = common.initUploadImagePlugin({
            elem: "#choiceBanner",
            uploadUrl: "/admin/upload/image?from=activity",
            dir: 'banner',
            field: "image",
            multiple: true,
            choose(obj) {
                var files = bannerFileList = obj.pushFile();
                obj.preview(function (index, file, result) {
                    var item = getBannerItemHtml(result);
                    item.find("i").on('click', function () {
                        //删除当前数据
                        delete files[index]
                        item.remove();
                        uploadBanner.config.elem.next()[0].value = ''; //清空 input file 值,以免删除后出现同名文件不可选
                    });
                    $(".banner").append(item);
                });
            },
            uploadSuccess: function (res) {
                //计算需要上传文件的数量
                var count = 0;
                for (key in bannerFileList) {
                    count++;
                }
                bannerUrlList.push(res.data);
                //文件上传完毕
                if (bannerUrlList.length == count) {
                    app.bannerUploadSuccess(bannerUrlList);
                }
            }
        });
    });
    function getBannerItemHtml(src) {
        var html = "<div class='banner-image-container'>";
        html += "<img class='layui-upload-img poster' src='" + src + "'>";
        html += "<i class='layui-icon'>&#xe640;</i>";
        html += "</div>";
        var item = $(html);
        return item;
    }
    var app = new Vue({
        el: '#main',
        data: {
            poster: '',
            activity: null,
            awardsList: [],
            tempAwardsList: [{}],
            openInfo: null,
            adInfo: null,
            uploadPosterUrl: '/admin/upload/image?from=activity'
            activity: {},
            tempAwardsList: [],
            openInfo: {},
            joinInfo: {adInfo: {}},
            temp: {//临时数据,用于提交到服务端
            },
            tempField: {//field临时存储
            }
        },
        watch: {
            tempAwardsList: function () {
                setTimeout(function () {
                    layui.use(['form'], function () {
                        form.render();
                    })
                    // layui.use(['form'], function () {
                    //     form = layui.form;
                    //     form.render();
                    // })
                    common.layuiForm.render();
                });
            }
        },
        created: function () {
        },
        mounted: function () {
            this.addAward();
        },
        methods: {
            //初始化数据
            initData() {
                $this = this;
                /**************初始化抽奖信息************/
                if (this.activity.poster)
                    $("#poster").attr("src", this.activity.poster);
                if (this.activity.banner && this.activity.banner.length > 0) {
                    for (var i = 0; i < this.activity.banner.length; i++) {
                        var url = this.activity.banner[i].img;
                        var item = getBannerItemHtml(url);
                        item.find("i").on('click', function () {
                            //删除当前数据
                            app.activity.banner.splice(i, 1);
                            item.remove();
                        });
                        $(".banner").append(item);
                    }
                }
                //选择banner
                common.layuiForm.on('radio(banner)', function (data) {
                    if (data.value == 1) {
                        $(".banner-container").css("display", "block");
                    } else {
                        $(".banner-container").css("display", "none");
                    }
                });
                common.layuiForm.on('submit(form-activity-info)',
                    function (data) {
                        field = common.layuiForm.val('form-activity-info');
                        if (!validManager.verifyActivityInfo())
                            return false;
                        // 数据暂存
                        app.tempField.activity = field;
                        //有封面图
                        if ($(".layui-upload-file").eq(0).val()) {
                            //上传封面图
                            uploadPoster.upload();
                        } else {
                            $this.posterUploadSuccess();
                        }
                        return false;
                    });
                /**************初始化奖品信息************/
                common.layuiForm.on('submit(form-award-info)',
                    function (data) {
                        console.log("提交奖品信息");
                        if (!validManager.verifyAwardInfo())
                            return false;
                        //赋值
                        $("#saveJoinInfo").click();
                        return false;
                    });
                /**************初始化参与条件************/
                common.layuiForm.on('submit(form-join-info)',
                    function (data) {
                        console.log("提交参与条件");
                        if (!validManager.verifyJoinInfo())
                            return false;
                        $("#saveOpenInfo").click();
                        return false;
                    });
                /**************初始化开奖条件************/
                common.layuiForm.on('submit(form-open-info)',
                    function (data) {
                        console.log("提交开奖条件");
                        if (!validManager.verifyOpenInfo())
                            return false;
                        return false;
                    });
            },
            //封面图上传成功
            posterUploadSuccess(res) {
                console.log("封面图上传成功");
                console.log(res);
                //上传文件
                var bannerEmpty = true;
                for (key in bannerFileList) {
                    bannerEmpty = false;
                    break;
                }
                if (!bannerEmpty) {
                    //上传banner图片
                    uploadBanner.upload();
                } else {
                    this.bannerUploadSuccess();
                }
            },
            //banner图上传成功
            bannerUploadSuccess(res) {
                console.log(res);
                console.log("Banner图上传成功");
                if (res) {
                    for (var i = 0; i < res.length; i++) {
                        //添加新的数据
                        var banner = {};
                        banner.url = res[i];
                        if (!this.activity.bannerList) {
                            this.activity.bannerList = new Array();
                        }
                        this.activity.bannerList.push(banner);
                    }
                }
                //提交奖项
                $("#saveAwardInfo").click();
            },
            //添加
            requestAdd: function () {
                //组装数据
@@ -277,104 +700,202 @@
                }, function (res) {
                });
            },
            //图片上传成功
            posterUploadSuccess: function (url) {
                //获取表单的数据
                app.data.poster = url;
                app.requestAdd();
            },
            addAward: function () {
                this.tempAwardsList.push({});
            },
            delAward: function (index) {
                this.tempAwardsList.splice(index, 1);
            },
            //提交
            submit: function () {
                $("#poster").trigger("click");
                //未验证通过
                if (!validManager.verifyAll()) {
                    return;
                }
                //触发表单提交
                $("#saveActivityInfo").click();
                //保存临时变量
                formManager.saveToTemp();
                console.log("临时变量")
                //将数据提交到服务器
                var temp = this.temp;
                console.log(this.temp);
            },
            /**
             * 奖项
             */
            addAward: function () {
                var awardCount = this.tempAwardsList.length;
                if (awardCount >= 5) {
                    common.notify.error("奖项最多为5个");
                    return;
                }
                var awardTitle = "";
                switch (awardCount) {
                    case 0:
                        awardTitle = "奖项一"
                        break;
                    case 1:
                        awardTitle = "奖项二"
                        break;
                    case 2:
                        awardTitle = "奖项三"
                        break;
                    case 3:
                        awardTitle = "奖项四"
                        break;
                    case 4:
                        awardTitle = "奖项五"
                        break;
                }
                this.tempAwardsList.push({title: awardTitle, data: {}, selected: true});
                this.selectAward(this.tempAwardsList.length - 1);
            },
            selectAward(index) {
                for (var i = 0; i < this.tempAwardsList.length; i++) {
                    if (i == index) {//选中
                        var award = this.tempAwardsList[i];
                        award.selected = true;
                        this.$set(this.tempAwardsList, i, award);
                    } else {//不选中
                        if (this.tempAwardsList[i].selected) {
                            var award = this.tempAwardsList[i];
                            award.selected = false;
                            this.$set(this.tempAwardsList, i, award);
                        }
                    }
                }
            },
            deleteAward: function (index) {
                if (app.tempAwardsList.length <= 1) {
                    common.notify.error("最低保留一个奖项");
                    return;
                }
                //删除元素后选中的下标
                var selectedIndex;
                if (index == 0) {
                    selectedIndex = 0;
                } else if (index == app.tempAwardsList.length - 1) {
                    selectedIndex = index - 1;
                } else {
                    selectedIndex = index;
                }
                var list = app.tempAwardsList;
                list.splice(index, 1);
                for (var i = 0; i < list.length; i++) {
                    var awardTitle = "";
                    switch (i) {
                        case 0:
                            awardTitle = "奖项一"
                            break;
                        case 1:
                            awardTitle = "奖项二"
                            break;
                        case 2:
                            awardTitle = "奖项三"
                            break;
                        case 3:
                            awardTitle = "奖项四"
                            break;
                        case 4:
                            awardTitle = "奖项五"
                            break;
                    }
                    list[i].title = awardTitle;
                    app.tempAwardsList = list;
                }
                //选中的下表
                console.log("选中下标:" + selectedIndex);
                this.selectAward(selectedIndex);
            },
            awardRedPacktRandom: function (event, index) {
                app.openAwardEdit(index, 2);
            },
            awardRedPacktDivide: function (event, index) {
                app.openAwardEdit(index, 1);
            },
            //打开编辑弹框
            openAwardEdit(index, type) {
                var $this = this;
                var params = {};
                switch (type) {
                    case 1:
                        params.url = "./award-type-redpacket-divide.html";
                        params.title = "固定红包设置";
                        break;//固定红包
                    case 2:
                        params.url = "./award-type-redpacket-random.html";
                        params.title = "随机红包设置";
                        break;//随机红包
                }
                var award = {};
                if (app.tempAwardsList[index].data && app.tempAwardsList[index].data.type == type) {
                    award = app.tempAwardsList[index].data;
                }
                var dialogIndex = common.openEditDialog({
                    title: params.title,
                    width: 500,
                    height: 400,
                    content: params.url + "?data=" + encodeURIComponent(JSON.stringify(award)),
                    submit(res) {
                        var award = app.tempAwardsList[index];
                        var data = award.data;
                        data.total = res.total;
                        data.count = res.count;
                        data.type = type;
                        $this.$set($this.tempAwardsList, index, award);
                        console.log(app.tempAwardsList)
                        common.closeDialog(dialogIndex);
                        // $(el).parent().find("input[type=radio]").eq(0).attr("checked", true);
                    },
                });
            },
            /**
             * 选择参与条件
             */
            openAdEditDialog(type) {
                var $this = this;
                var params = {};
                var data = {};
                switch (type) {
                    case 'alipayLife':
                        params.title = "生活号设置"
                        params.url = "./sponsor-ad-alipaylife.html"
                        if (this.joinInfo.adInfo.data) {
                            data = this.joinInfo.adInfo.data;
                        }
                        break;
                }
                var dialogIndex = common.openEditDialog({
                    title: params.title,
                    width: 500,
                    height: 450,
                    content: params.url + "?data=" + encodeURIComponent(JSON.stringify(data)),
                    submit(res) {
                        console.log("得到的值为:");
                        console.log(res);
                        var data = $this.joinInfo.adInfo.data;
                        if (data == undefined)
                            data = {};
                        data.icon = res.icon;
                        data.name = res.name;
                        data.sceneId = res.sceneId;
                        data.desc = res.desc;
                        $this.$set($this.joinInfo.adInfo, 'data', data);
                        $this.$set($this.joinInfo.adInfo, 'type', type);
                        common.closeDialog(dialogIndex);
                    },
                });
            }
        }
    });
    layui.use('upload', function () {
        var $ = layui.jquery
            , upload = layui.upload;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#test1',
            auto: false,
            url: app.data.uploadPosterUrl,
            field: 'image',
            bindAction: '#poster'
            , choose: function (obj) {
                //预读本地文件示例,不支持ie8
                obj.preview(function (index, file, result) {
                    $('#poster').attr('src', result); //图片链接(base64)
                });
            },
            done: function (res, index, upload) { //上传后的回调
                alert("图片上传成功")
                app.posterUploadSuccess();
            },
            error: function () {
                layer.alert("图片上传失败", {icon: 6}, null);
            }
        });
    });
    //图片上传成功
    var form = null;
    layui.use(['form', 'layer', 'jquery'],
        function () {
            $ = layui.jquery;
            form = layui.form;
            layer = layui.layer;
            //自定义验证规则
            form.verify({
                username: function (value) {
                    if (value.length < 5) {
                        return '活动名称至少得5个字符啊';
                    }
                },
                appcode: [/^([A-Za-z0-9]|\-|_)+$/, '应用标识只能包含 数字、英文字符、_ 、-'],
                desc: function (value) {
                    if (value != null && value.length > 128) {
                        return '简介最大为128个字符';
                    }
                },
                remarks: function (value) {
                    if (value != null && value.length > 128) {
                        return '备注最大为128个字符';
                    }
                },
            });
            //监听提交
            //保存活动
            form.on('submit(save-activity)',
                function (data) {
                    app.data.activity = data.field;
                    console.log(data.field);
                    return false;
                });
            //保存奖项
            form.on('submit(save-awards)',
                function (data) {
                alert(JSON.stringify(data.field));
                    app.data.activity = data.field;
                    console.log(data.field);
                    return true;
                });
        });</script>
</script>
</body>
</html>
service-daylucky/src/main/resources/static/award-type-redpacket-divide.html
New file
@@ -0,0 +1,173 @@
<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>固定红包设置</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">
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script src="js/vue.min.js" type="text/javascript" charset="utf-8"></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/common.js"></script>
    <![endif]-->
    <style>
        .layui-form-label {
            width: 150px;
            padding-top: 0;
            font-size: 14px;
        }
        input[type=text] {
            width: 100px;
            margin-top: 5px;
        }
        .desc {
            color: #999;
            padding-bottom: 5px;
        }
        .layui-btn-fluid {
            max-width: 200px;
        }
    </style>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <form class="layui-form">
            <div class="layui-form-item">
                <label class="layui-form-label">
                    当前账户余额:</label>
                <div class="layui-input-inline">
                    <span style="font-size: 16px;">  1000.00元</span>
                    <a style="float: right;" class="layui-btn">充值</a>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>总金额</label>
                <div class="layui-input-inline">
                    <label class="desc">可被中奖用户获得的金额总和上限,且需要提前预充值以保障用户权益</label>
                    <input type="text" name="total" required="" lay-verify="number"
                           autocomplete="off" class="layui-input" v-model="total" placeholder="请输入总金额">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>份数</label>
                <div class="layui-input-inline">
                    <label class="desc">可获得此奖项的最高人数,平均值不能低于0.01元</label>
                    <input type="text" name="count" v-model="count" required="" lay-verify="integer"
                           autocomplete="off" class="layui-input" placeholder="请输入正整数">
                </div>
            </div>
            <div class="layui-form-item">
                <label for="L_name" class="layui-form-label">
                    中奖金额</label>
                <div class="layui-input-inline">
                    <label style="font-size: 14px;color: black">
                        {{total}}元÷{{count}}份={{result}}元/份
                    </label>
                </div>
            </div>
            <button id="add" style="display: none" class="layui-btn layui-btn-primary layui-btn-fluid" lay-filter="add"
                    lay-submit="">确定
            </button>
        </form>
    </div>
</div>
<script src="js/common.js"></script>
<script>
    var listener;
    function submit(callback) {
        listener = callback;
        $("#add").click();
    }
    var app = new Vue({
        el: '.layui-form',
        data: {
            total: "",
            count: "",
            result: "",
        },
        created: function () {
            var data = JSON.parse(decodeURIComponent(common.getQueryString("data")));
            this.total = data.total;
            this.count = data.count;
            setTimeout(function () {
                app.render();
            });
        },
        watch: {
            total: function (e) {
                console.log(e);
                if (app.total && app.count) {
                    app.result = Math.floor(app.total * 100 / app.count) / 100;
                }
            },
            count: function (e) {
                if (app.total && app.count) {
                    app.result = Math.floor(app.total * 100 / app.count) / 100;
                }
            }
        },
        methods: {
            getAppList: function () {
                ksapp.post("/admin/api/app/list", {page: 1, limit: 100}, function (e) {
                    if (e.code == 0) {
                        app.appList = e.data.data;
                    } else
                        layer.msg(e.msg);
                }, function (e) {
                });
            },
            render: function () {
                console.log("render")
                layui.use(['form', 'layer', 'jquery'], function () {
                    $ = layui.jquery;
                    var form = layui.form,
                        layer = layui.layer;
                    common.initLayuiForm(form);
                    //监听提交
                    form.on('submit(add)',
                        function (data) {
                            listener(data.field);
                            return false;
                        });
                });
            }
        }
    });
</script>
</body>
</html>
service-daylucky/src/main/resources/static/award-type-redpacket-random.html
New file
@@ -0,0 +1,153 @@
<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>随机红包设置</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">
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script src="js/vue.min.js" type="text/javascript" charset="utf-8"></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>
    <![endif]-->
    <style>
        .layui-form-label {
            width: 100px;
            padding-top: 0;
            font-size: 14px;
        }
        input[type=text] {
            width: 100px;
            margin-top: 5px;
        }
        .desc {
            color: #999;
            padding-bottom: 5px;
        }
        .layui-btn-fluid {
            max-width: 200px;
        }
    </style>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <form class="layui-form">
            <div class="layui-form-item">
                <label class="layui-form-label">
                    当前账户余额:</label>
                <div class="layui-input-inline">
                    <span style="font-size: 16px;">1000.00元</span>
                    <a style="float: right;" class="layui-btn">充值</a>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>总金额</label>
                <div class="layui-input-inline">
                    <label class="desc">可被中奖用户获得的金额总和上限,且需要提前预充值以保障用户权益</label>
                    <input type="text" name="total" required="" lay-verify="number"
                           autocomplete="off" class="layui-input" v-model="total" placeholder="请输入总金额">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>份数</label>
                <div class="layui-input-inline">
                    <label class="desc">可获得此奖项的最高人数,平均值不能低于0.01元</label>
                    <input type="text" name="count" v-model="count" required="" lay-verify="integer"
                           autocomplete="off" class="layui-input" placeholder="请输入正整数">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    中奖金额</label>
                <div class="layui-input-inline">
                    <label style="font-size: 14px;color: black">由系统随机产生</label>
                </div>
            </div>
            <button id="add" style="display: none" class="layui-btn layui-btn-primary layui-btn-fluid" lay-filter="add"
                    lay-submit="">确定
            </button>
        </form>
    </div>
</div>
<script src="js/common.js"></script>
<script>
    var listener;
    var app = new Vue({
        el: '.layui-form',
        data: {
            total: "",
            count: ""
        },
        created: function () {
            var data = JSON.parse(decodeURIComponent(common.getQueryString("data")));
            this.total = data.total;
            this.count = data.count;
            setTimeout(function () {
                app.render();
            });
        },
        watch: {},
        methods: {
            render: function () {
                console.log("render")
                layui.use(['form', 'layer', 'jquery'], function () {
                    $ = layui.jquery;
                    var form = layui.form,
                        layer = layui.layer;
                    common.initLayuiForm(form);
                    //监听提交
                    form.on('submit(add)',
                        function (data) {
                            listener(data.field);
                            return false;
                        });
                });
            }
        }
    });
    function submit(callback) {
        listener = callback;
        $("#add").click();
    }
</script>
</body>
</html>
service-daylucky/src/main/resources/static/css/common.css
New file
@@ -0,0 +1,28 @@
.layui-form-label {
    padding-top: 0 !important;
    font-size: 13px;
}
input[type=text] {
    width: 200px;
}
.flex-row {
    display: flex;
}
.flex-center {
    align-items: center;
}
.input-small {
    width: 80px !important;
}
.input-middle {
    width: 150px;
}
.input-large {
    width: 250px;
}
service-daylucky/src/main/resources/static/img/icon_checked_round.png
service-daylucky/src/main/resources/static/js/common.js
New file
@@ -0,0 +1,125 @@
var common = {
        layuiForm: null, layuiUpload: null, layuiElement: null,
        layuiLayer: null,
        $: null,
        initLayui(callback) {
            console.log("开始初始化");
            layui.use(['form', 'upload', 'element', 'layer', 'jquery'], function () {
                common.$ = layui.jquery
                    , common.layuiUpload = layui.upload
                    , common.layuiElement = layui.element
                    , common.layuiLayer = layui.layer
                    , common.layuiForm = layui.form;
                common.layuiForm.verify({
                    decimal: [/^(?:[1-9][0-9]*\.[0-9]+|0\.(?!0+$)[0-9]+|0)$/, '请输入数字'],
                    integer: [/^\+?[1-9][0-9]*$/, '请输入正整数'],
                });
                console.log("初始化完成")
                callback();
            });
        },
        initLayuiForm: function (form) {
            form.verify({
                decimal: [/^(?:[1-9][0-9]*\.[0-9]+|0\.(?!0+$)[0-9]+|0)$/, '请输入数字'],
                integer: [/^\+?[1-9][0-9]*$/, '请输入正整数'],
            });
        }
        ,
        openEditDialog: function (params) {
            var layerIndex = layer.open({
                title: params.title,
                type: 2,
                area: [params.width + 'px', params.height + 'px'],
                shade: 0.3,
                shadeClose: false,//默认开启遮罩关闭
                resize: false,//默认重设大小是否
                content: params.content,
                //如果不让iframe出现滚动条,
                //可以content: ['http://sentsin.com', 'no']
                btn: [params.sure ? params.sure : '确定'],
                yes: function (index) {
                    //获取选择的row,并加载到页面
                    window["layui-layer-iframe" + index].submit(function (res) {
                        if (params.submit) {
                            params.submit(res);
                        }
                    });
                },
                cancel: function () {
                    //右上角关闭回调
                    if (params.close) {
                        params.close();
                    }
                }
            });
            return layerIndex;
        }
        ,
        closeDialog(index) {
            layer.close(index);
        }
        ,
        getQueryString(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return unescape(r[2]);
            return null;
        }
        ,
//初始化图片上传插件
        initUploadImagePlugin(params) {
            console.log(params);
            params.data = {
                dir: params.dir
            }
            //普通图片上传
            var uploadInst = common.layuiUpload.render({
                elem: params.elem,
                //自动上传图片
                auto: false,
                data: params.data,
                url: params.uploadUrl,
                field: params.field ? params.field : 'image',
                accept: 'images',
                acceptMime: 'image/*',
                multiple: params.multiple ? true : false
                , choose: function (obj) {
                    if (params.choose) {
                        params.choose(obj)
                        return;
                    }
                    //预读本地文件示例,不支持ie8
                    obj.preview(function (index, file, result) {
                        $(params.showElem).attr('src', result); //图片链接(base64)
                    });
                },
                done: function (res, index, upload) { //上传后的回调
                    console.log("上传成功");
                    console.log(res);
                    if (res.code == 0) {
                        params.uploadSuccess(res);
                    } else {
                        layer.alert(res.msg, {icon: 5}, null);
                    }
                },
                error: function () {
                    layer.alert("图片上传失败", {icon: 5}, null);
                    if (params.uploadFail) {
                        params.uploadFail();
                    }
                }
            });
            return uploadInst;
        },
        notify: {
            error(msg) {
                layer.msg(msg, {icon: 5, anim: 6});
            }
        }
    }
;
service-daylucky/src/main/resources/static/js/xadmin.js
@@ -94,7 +94,10 @@
            shadeClose: true,
            shade:0.4,
            title: title,
            content: url
            content: url,
            end: function(){
                alert("弹框关闭")
            }
        });
        if(full){
           layer.full(index); 
service-daylucky/src/main/resources/static/sponsor-ad-alipaylife.html
New file
@@ -0,0 +1,207 @@
<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>生活号设置</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">
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script src="js/vue.min.js" type="text/javascript" charset="utf-8"></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>
    <![endif]-->
    <style>
        .layui-form-label {
            width: 100px;
            padding-top: 0;
            font-size: 14px;
        }
        .layui-input-inline {
            width: 220px !important;
        }
        input[type=text] {
            width: 100px;
            margin-top: 5px;
        }
        .desc {
            color: #999;
            padding-bottom: 5px;
        }
        .layui-btn-fluid {
            max-width: 200px;
        }
        input[type=text] {
            width: 200px !important;
            margin-top: 0px;
        }
        #poster {
            max-width: 100px;
            max-height: 100px;
        }
    </style>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <form class="layui-form">
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>SceneID</label>
                <div class="layui-input-inline" style="display: flex;align-items: center">
                    <input type="text" name="sceneId" lay-verify="required"
                           autocomplete="off" class="layui-input" v-model="sceneId" placeholder="请输入SceneID">
                    <a target="_blank" href="http://www.baidu.com" style="margin-left: 5px;"><i class="layui-icon">&#xe607;</i>
                    </a>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>生活号名称</label>
                <div class="layui-input-inline">
                    <input type="text" name="name" lay-verify="required"
                           autocomplete="off" class="layui-input" v-model="name" placeholder="请输入生活号名称">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>生活号头像</label>
                <div class="layui-input-inline">
                    <label class="desc">建议和支付宝生活号图标一致</label>
                    <div class="layui-upload">
                        <button type="button" class="layui-btn" id="test1">上传图片</button>
                        <div class="layui-upload-list">
                            <img class="layui-upload-img poster" id="poster">
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    生活号简介</label>
                <div class="layui-input-inline">
                    <label class="desc">最少6个字符,最多150个字符</label>
                    <textarea class="layui-textarea" maxlength="150" minlength="6" name="desc"
                              placeholder="请输入简介" v-model="desc"></textarea>
                </div>
            </div>
            <button id="add" style="display: none" class="layui-btn layui-btn-primary layui-btn-fluid" lay-filter="add"
                    lay-submit="">确定
            </button>
        </form>
    </div>
</div>
<script src="js/common.js"></script>
<script>
    var upload;
    common.initLayui(function () {
        upload = common.initUploadImagePlugin({
            elem: "#test1",
            showElem: "#poster",
            uploadUrl: "/admin/upload/image?from=activity",
            dir: 'sponsorad',
            field: "image",
            uploadSuccess: function (res) {
                app.uploadSuccess(res.data);
            }
        });
    });
    var listener;
    //外部触发的提交按钮
    function submit(callback) {
        listener = callback;
        //提交文件
        if ($(".layui-upload-file").eq(0).val())
            upload.upload();
        else
            app.uploadSuccess();
    }
    var app = new Vue({
        el: '.layui-form',
        data: {
            icon: "",
            name: "",
            desc: "",
            sceneId: ""
        },
        created: function () {
            var data = JSON.parse(decodeURIComponent(common.getQueryString("data")));
            this.icon = data.icon;
            this.name = data.name;
            this.desc = data.desc;
            this.sceneId = data.sceneId;
            $("#poster").attr("src", this.icon);
            setTimeout(function () {
                app.render();
            });
        },
        watch: {},
        methods: {
            render: function () {
                console.log("render")
                layui.use(['form', 'layer', 'jquery'], function () {
                    $ = layui.jquery;
                    var form = layui.form,
                        layer = layui.layer;
                    common.initLayuiForm(form);
                    //监听提交
                    form.on('submit(add)',
                        function (data) {
                            if (!$("#poster").attr("src")) {
                                common.notify.error("请选择生活号头像")
                                return false;
                            }
                            //重新赋值
                            data.field.icon = app.icon;
                            console.log(data.field);
                            listener(data.field);
                            return false;
                        });
                });
            },
            uploadSuccess(res) {
                if (res)
                    this.icon = res;
                //提交表单
                $("#add").click();
            }
        }
    });
</script>
</body>
</html>