<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
    <head>
        <th:block th:include="include :: header('添加活动')"/>
        <th:block th:include="include :: bootstrap-fileinput-css" />
    </head>

    <body class="white-bg">
        <!--奖品项配置表单-->
        <form id="form-user-add"  class="layui-form">
            <div>
                基础信息
            </div>
            <div class="main_type">
                <span class="labelName"><i class="required">*</i>活动名称：</span>
                <div class="layui-input-block" style="display: flex">
                    <input type="text" id="ActivityName" autocomplete="off" class="layui-input" placeholder="请输入名称">
                </div>
            </div>
            <div class="main_type">
                <span class="labelName"><i class="required">*</i>活动类型：</span>
                <div class="layui-input-block" style="display: flex">
                    <input type="text" id="ActivityType" autocomplete="off" class="layui-input" value="转盘" disabled placeholder="请输入类型">
                </div>
            </div>
            <input id="ceshi" class="scoreFile" type="file" name="scoreFile" style="display: none;">
            <input id="selectCeshi" class="scoreFile" type="file" name="scoreFile" style="display: none;">
            <div class="main_type">
                <span class="labelName"><i class="required">*</i>banner图：</span>
                <div class="layui-input-block" style="display: flex;flex-direction: column;">
                    <img id="viewImg" src="" alt="" style="max-height:242px;">
                    <div class="ibox-content">
                        <div class="form-group">
                            <div class="file-loading">
                                <input id="fileinput" type="file" name="file" data-browse-on-zone-click="true" data-theme="fas">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="main_type">
                <span class="labelName"><i class="required">*</i>所需积分：</span>
                <div class="layui-input-block" style="display: flex">
                    <input type="text" id="integral" autocomplete="off" class="layui-input" placeholder="请输入所需积分">
                </div>
            </div>
            <div class="sendType">
                <div style="display: flex;align-items: center;">
                    <span class="labelName"><i class="required">*</i>活动时间：</span>
                    <div class="layui-input-block" style="display: flex">
                        <input type="radio" value="1" name="sendType" checked><span>长期</span>
                        <input type="radio" value="2" name="sendType"><span>选择开始结束时间</span>
                        <div class="selectTime">
                            <input type="text" class="layui-input" id="startTime" autocomplete="off" placeholder="请选择起始时间">
                            <span>~</span>
                            <input type="text" class="layui-input" id="endTime" autocomplete="off" placeholder="请选择结束时间">
                        </div>
                    </div>
                </div>
            </div>
            <div class="selectScore">
                <p><i class="required">*</i>选择商品</p>
                <!-- <button type="button" class="btn btn-primary" onclick="addColumn()">新增商品</button>
                <span>最多可上传6个</span> -->
            </div>
            <!-- <img src="img/select.png" alt=""> -->
            <div class="scoreTable">
                <div class="row">
                    <div class="col-sm-12">
                        <div class="col-sm-12 select-table table-striped">
                            <table id="bootstrap-table"></table>
                        </div>
                    </div>
                </div>
            </div>
            <div class="main_bottom">
                <div class="main_type">
                    <span class="labelName"><i class="required">*</i>预估玩此活动的总人数：</span>
                    <div class="layui-input-block" style="display: flex">
                        <input type="text" id="estimatedNum" autocomplete="off" class="layui-input" placeholder="预估玩此活动的总人数">
                    </div>
                </div>
                <div class="describe">
                        <span class="labelName">
                            <i class="required">*</i>活动规则：
                        </span>
                    <textarea id="activityRule" class="form-control" style="min-height: 160px;"></textarea>
                </div>
                <div class="describe">
                        <span class="labelName">
                            <i class="required">*</i>概率公示：
                        </span>
                    <textarea id="probabilityPublicity" class="form-control" style="min-height: 160px;"></textarea>
                </div>
                <div class="sendTime">
                    <span class="labelName"><i class="required">*</i>是否上线：</span>
                    <div class="layui-input-block" style="display: flex">
                        <input type="radio" name="online" value="1" checked><span>未上线</span>
                        <input type="radio" name="online" value="2" style="margin-left: 12px;"><span>已上线</span>
                    </div>
                </div>
                <div class="sendTime">
                    <span class="labelName"><i class="required">*</i>快递费用：</span>
                    <div class="layui-input-block" style="display: flex">
                        <input type="radio" name="sex" value="1" checked><span>包邮</span>
                        <input type="radio" name="sex" value="2" style="margin-left: 12px;"><span>到付</span>
                    </div>
                    <!-- <span style="margin-right:12px;"><p>输入金额</p></span>
                    <input type="text" id="courierMoney" autocomplete="off" class="layui-input" placeholder="请输入金额"> -->
                </div>
                <div class="bottom_btn">
                    <!-- <button type="button" class="layui-btn btn btn-primary" lay-filter="formDemo" onclick="create()">创建代金券</button> -->
                    <button type="button" class="btn btn-primary" onclick="create()">确  定</button>
                </div>
            </div>
        </form>
        <div id="detailsFormList" class="details-form-list" style="display: none">
            <!--奖品详情-->
            <div class="details-pop-inner">
                <button type="button" class="btn btn-primary" onclick="addCouponShow()">添加</button>
                <button type="button" class="btn btn-primary" onclick="closeCouponShow()">关闭窗口</button>
                <hr>
                <div class="coupon-select" style="display: none">
                    <!--选择优惠券-->
                    <div class="scope_application" id="scope_application">
                        <span class="labelName"><i class="required">*</i>选择优惠券：</span>
                        <div class="search_ipt" style="position: relative;display: inline;">
                            <input type="text" id="searchIpt" autocomplete="off" class="layui-input" placeholder="全部">
                            <ul id="dataList" style="position: absolute;"></ul>
                        </div>
                        <button type="button" class="btn btn-primary" onclick="addCouponFun()">确认添加当前优惠券</button>
                    </div>
                </div>

                <hr>
                <div class="scoreTable">
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="col-sm-12 select-table table-striped">
                                <table id="details-table"></table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </body>

    <th:block th:include="include :: footer"/>
    <script th:src="@{/js/jquery.tmpl.js}"></script>
    <th:block th:include="include :: bootstrap-fileinput-js" />

    <script type="text/javascript">
        var platformUrl = `[[${platformUrl}]]`
        var prefix = ctx + "sweet/sweetIntegralActivity";
        var candyfix = ctx + "candy/coupon";

        let showIndex = null;
        // 初始化数据, 可以由后台传过来
        var data = []; // 表格内数据集合
        let activityName = ''; // 活动名称
        let activityType = ''; // 活动类型
        let timeType = '1'; // 活动时间类型
        let startTime = ''; // 开始时间
        let endTime = ''; // 结束时间
        let activityRule = ''; // 活动规则
        let courierType = '1'; // 快递类型
        let courierMoney = ''; // 快递费用
        let showPicture = ''; // banner
        let online = '1'; // 是否上线
        let itemId = '';
        let activitySize = false;
        var options = {
            id: "bootstrap-table",
            data: data,
            pagination: false,
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            sidePagination: "client",
            columns: [
                {
                    field: 'index',
                    align: 'center',
                    title: "序号",
                    formatter: function (value, row, index) {
                        return index+1;
                    }
                },
                {
                    field: 'prizeTitle',
                    align: 'center',
                    title: '奖品名称',
                    formatter: function(value, row, index) {
                        let str = '';
                        if (data[index].prizeTitle) {
                            str = "<input id='prizeTitle"+index+"' class='form-control' type='text' name='' value='"+data[index].prizeTitle+"'>"
                        } else {
                            str = "<input id='prizeTitle"+index+"' class='form-control' type='text' name='' value=''>"
                        }
                        var html = $.common.sprintf(str, index, value);
                        return html;
                    }
                },
                {
                    field: 'prizeImgInit',
                    align: 'center',
                    title: '商品图片',
                    formatter: function(value, row, index) { //
                        let str = '';
                        if (data[index].prizeImgInit) {
                            str = `<img id="showPic${index}" onclick=upFile(${index}) src="${data[index].prizeImgInit}" alt="" style="max-height:50px;">`
                        } else {
                            str = `<img id="showPic${index}" onclick=upFile(${index}) src="${value}" alt="点击上传" style="max-height:50px;">`
                        }
                        var html = $.common.sprintf(str, index, value);
                        return html;
                    }
                },
                {
                    field: 'prizeImgSelect',
                    align: 'center',
                    title: '选中图片',
                    formatter: function(value, row, index) { //
                        let str = '';
                        if (data[index].prizeImgSelect) {
                            str = `<img id="showPicSelect${index}" onclick=upFileSelect(${index}) src="${data[index].prizeImgSelect}" alt="" style="max-height:50px;">`
                        } else {
                            str = `<img id="showPicSelect${index}" onclick=upFileSelect(${index}) src="${value}" alt="点击上传" style="max-height:50px;">`
                        }
                        var html = $.common.sprintf(str, index, value);
                        return html;
                    }
                },
                {
                    field: 'prizeType',
                    align: 'center',
                    title: '奖品类型',
                    formatter: function(value, row, index) {
                        let arr = ['积分', '优惠券', '实物', '登登登VIP'];
                        let str = '';
                        arr.forEach((item,i)=> {
                            i++
                            if (i == data[index].prizeType) {
                                str += `<option value="${i}" selected>${item}</option>`
                            } else {
                                str += `<option value="${i}">${item}</option>`
                            }
                        })
                        let dom = `<select id='prizeType${index}' class='form-control' name=''>
                            ${str}
                        </select>`
                        return dom;
                    }
                },
                {
                    field: 'prizeTypeNum',
                    align: 'center',
                    title: '奖励积分数量',
                    formatter: function(value, row, index) {
                        let str = '';
                        if (data[index].prizeTypeNum && (data[index].prizeType === 1)) {
                            str = `<input id='prizeTypeNum${index}' class='form-control' type='text' name='' value='${data[index].prizeTypeNum}'>`
                        } else {
                            str = `<input id='prizeTypeNum${index}' class='form-control' type='text' name='' value=''>`
                        }
                        var html = $.common.sprintf(str, index, value);
                        return html;
                    }
                },
                {
                    field: 'winningProbability',
                    align: 'center',
                    title: '概率',
                    formatter: function(value, row, index) {
                        let str = '';
                        if (data[index].winningProbability) {
                            str = `<input id='winningProbability${index}' class='form-control' type='text' name='' value='${data[index].winningProbability}'>`
                        } else {
                            str = `<input id='winningProbability${index}' class='form-control' type='text' name='' value=''>`
                        }
                        var html = $.common.sprintf(str, index, value);
                        return html;
                    }
                },
                {
                    field: 'prizeNum',
                    align: 'center',
                    title: '数量',
                    formatter: function(value, row, index) {
                        let str = '';
                        if (data[index].prizeNum) {
                            str = `<input id='prizeNum${index}' class='form-control' type='text' name='' value='${data[index].prizeNum}'>`
                        } else {
                            str = `<input id='prizeNum${index}' class='form-control' type='text' name='' value=''>`
                        }
                        var html = $.common.sprintf(str, index, value);
                        return html;
                    }
                },
                {
                    field: 'prizeDescribe',
                    align: 'center',
                    title: '奖品描述',
                    formatter: function(value, row, index) {
                        let str = '';
                        if (data[index].prizeNum) {
                            str = `<input id='prizeDescribe${index}' class='form-control' type='text' name='' value='${data[index].prizeDescribe}'>`
                        } else {
                            str = `<input id='prizeDescribe${index}' class='form-control' type='text' name='' value=''>`
                        }
                        var html = $.common.sprintf(str, index, value);
                        return html;
                    }
                },
                // {
                //     field: 'winnersNum',
                //     align: 'center',
                //     title: '中奖人数',
                //     formatter: function(value, row, index) {
                //         let str = '';
                //         if (data[index].winnersNum) {
                //             str = `<input id='winnersNum${index}' class='form-control' type='text' name='' value='${data[index].winnersNum}'>`
                //         } else {
                //             str = `<input id='winnersNum${index}' class='form-control' type='text' name='' value=''>`
                //         }
                //         var html = $.common.sprintf(str, index, value);
                //         return html;
                //     }
                // },
                {
                    field: 'winPrizeNum',
                    align: 'center',
                    title: '已发出'
                },
                {
                    field: 'residue',
                    align: 'center',
                    title: '奖品剩余',
                    formatter: function(value, row, index) {
                        if (itemId) {
                            return (row.prizeNum - row.winPrizeNum) || '0'
                        } else {
                            return '0'
                        }
                    }
                },
                {
                    field: '',
                    align: 'center',
                    title: '操作',
                    formatter: function(value, row, index) {
                        let str = '';
                        if (data[index].prizeTitle) {
                            str = `<button type="button" class="btn btn-primary" onclick="showList(` + index + `)">查看列表</button>`
                        }

                        var html = $.common.sprintf(str, index, value);
                        return html;
                    }
                }
            ]
        };
        var nowList = []; // 当前编辑的奖品详情列表
        var nowShowData = {}; // 当前编辑的奖品信息
        let searchVal = ''; // 优惠券输入框内数据
        let searchData = []; // 优惠券搜索总数据
        var nowCouponSelect = {}; // 当前选择的优惠券
        var detailsOptions = {
            id: "details-table",
            data: nowList,
            pagination: false,
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            sidePagination: "client",
            columns: [
                {
                    field: 'index',
                    align: 'center',
                    title: "序号",
                    formatter: function (value, row, index) {
                        return index+1;
                    }
                },
                {
                    field: 'couponId',
                    align: 'center',
                    title: "优惠券ID",
                    formatter: function (value, row, index) {
                        return nowList[index].couponId;
                    }
                },
                {
                    field: 'couponTitle',
                    align: 'center',
                    title: "优惠券名称",
                    formatter: function (value, row, index) {
                        return nowList[index].couponTitle;
                    }
                },
                {
                    field: '',
                    align: 'center',
                    title: '操作',
                    formatter: function(value, row, index) {
                        let str = '';
                        str = `<button type="button" class="btn btn-primary" onclick="deleteCoupon(` + index + `)">删除</button>`
                        var html = $.common.sprintf(str, index, value);
                        return html;
                    }
                }
            ]
        };

        $(function() {
            itemId = getUrlParms('id')
            function getUrlParms(name){
                var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                if(r!=null)
                    return unescape(r[2]);
                return null;
            }
            if (itemId) {
                $.ajax({
                    type: 'get',
                    url: '/sweet/integralActivity/details',
                    data: {integralActivityId: itemId},
                    success:function(e) {
                        if (e.code == 0) {
                            let res = e.data;
                            showPicture = res.activityImg;
                            $("#viewImg").attr('src', showPicture);
                            $("#integral").val(res.activityNum);
                            $("#activityRule").val(res.activityRules);
                            $("#ActivityName").val(res.activityTitle);
                            $("#estimatedNum").val(res.estimatedNum);
                            $("#probabilityPublicity").val(res.probabilityPublicity);
                            // activityType: 1,
                            courierType = res.expressFeeType;
                            if (courierType == 2) {
                                $("input[name='sex'][value='2']").attr('checked', true).siblings().removeAttr('checked');
                            }
                            integralActivityId = res.integralActivityId;
                            online = res.isOnline;
                            if (online == 2) {
                                $("input[name='online'][value='2']").attr('checked', true).siblings().removeAttr('checked');
                            }

                            timeType = res.timeType;
                            if (timeType == 2) {
                                $("input[name='sendType'][value='2']").attr('checked', true).siblings().removeAttr('checked');
                                $("#endTime").val($.common.dateFormat(res.endTime, 'yyyy-MM-dd HH:mm:ss'));
                                $("#startTime").val($.common.dateFormat(res.startTime, 'yyyy-MM-dd HH:mm:ss'));
                            } else {
                                $("#endTime").val("");
                                $("#startTime").val("");
                            }
                            data = [...res.prizeList]
                            options.data = data;
                            setTimeout(()=>{
                                $.table.init(options);
                            }, 500)
                        }
                    }
                })
            } else {
                let obj = {
                    prizeTitle: "",
                    prizeImgInit: "",
                    prizeImgSelect: "",
                    winPrizeNum: "",
                    prizeType: "",
                    prizeTypeNum: "",
                    winningProbability: "",
                    prizeDescribe: "",
                    residue: "",
                    prizeNum: ""
                };
                for( var i = 0; i < 12; i++) {
                    data.push(obj)
                }
                $.table.init(options);
            }

        });

        layui.use('laydate', function(){
            var laydate = layui.laydate;
            //执行一个laydate实例
            laydate.render({
                elem: '#startTime', //指定元素
                type: 'datetime'
            });
            laydate.render({
                elem: '#endTime', //指定元素
                type: 'datetime'
            });
        });
        $("#ActivityName").blur(function(e) {
            if (e.target.value.length > 20) {
                activitySize = true;
                layer.msg('活动名称限制在20个字符以内！')
                return
            } else {
                activitySize = false;
            }
        })
        $("input[name=sendType]").change((e)=>{
            timeType = e.target.value;
            if (timeType == 1) {
                $("#endTime").val("");
                $("#startTime").val("");
            }
        })
        $("input[name=sex]").change((e)=>{
            courierType = e.target.value;
        })
        $("input[name=online]").change((e)=>{
            online = e.target.value;
        })
        function upFile(e) {
            showIndex = e;
            $("#ceshi").click();
        }
        function upFileSelect(e) {
            showIndex = e;
            $("#selectCeshi").click();
        }
        $("#ceshi").change((e) => {
            if (!e.target.files[0]) {
                return
            }
            var formData = new FormData();
            formData.append("file", e.target.files[0]);
            $.ajax({
                url: platformUrl + "/platform/basicServices/alOss/upload",//路径是你控制器中上传图片的方法，下面controller里面我会写到
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                type: 'POST',
                success: function (res) {
                    $("#showPic"+showIndex).attr('src','https://img.zhengzai.tv/' + res.data.ossPath)
                    data[showIndex].prizeImgInit = 'https://img.zhengzai.tv/' + res.data.ossPath;
                    $("#ceshi").val("");
                    // $summernote.summernote('insertImage', 'https://img.zhengzai.tv/' + data.data.ossPath)
                }
            });
        })
        $("#selectCeshi").change((e) => {
            if (!e.target.files[0]) {
                return
            }
            var formData = new FormData();
            formData.append("file", e.target.files[0]);
            $.ajax({
                url: platformUrl + "/platform/basicServices/alOss/upload",//路径是你控制器中上传图片的方法，下面controller里面我会写到
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                type: 'POST',
                success: function (res) {
                    $("#showPicSelect"+showIndex).attr('src','https://img.zhengzai.tv/' + res.data.ossPath)
                    data[showIndex].prizeImgInit = 'https://img.zhengzai.tv/' + res.data.ossPath;
                    $("#selectCeshi").val("");
                    // $summernote.summernote('insertImage', 'https://img.zhengzai.tv/' + data.data.ossPath)
                }
            });
        })
        $("#fileinput").fileinput({
            'theme': 'explorer-fas',
            'uploadUrl': platformUrl + "/platform/basicServices/alOss/upload",
            "uploadExtraData": {
                "pathName" : "banner",
                "buckType" : 1
            },
            autoReplace: true,
            showCaption: false,
            showPreview: false,
            showRemove: false,
            showUpload: false,
            showCancel: false,
            showClose: false,
            autoReplace: true,
            dropZoneTitle: "请上传文件",
            maxFileCount: 1
        }).on("filebatchselected", function (event, files) {         //默认上传
            $(this).fileinput("upload");
        })
        .on("fileuploaded", function (event, data) {       //上传回调事件
            showPicture = 'https://img.zhengzai.tv/' + data.response.data.ossPath;
            $("#viewImg").attr('src', showPicture)
        })
        function create() {
            if (!$("#ActivityName").val()
                || !$("#ActivityType").val()
                || !showPicture
                || !$("#integral").val()
                || !$("#activityRule").val()
                || !$("#viewImg").attr('src')
                || !$("#estimatedNum").val()
                || !$("#probabilityPublicity").val()
            ) {
                return layer.msg('请将必填信息填写完整！')
            }
            if (timeType == 2) {
                if (!$("#startTime").val() || !$("#endTime").val()) {
                    return layer.msg('请选择时间！')
                }
            } else {
                $("#startTime").val("")
                $("#endTime").val("")
            }
            if (activitySize) {
                layer.msg("活动名称限制在20个字符以内！")
                return
            }
            let flag = false;
            let prizeListArr = []
            data = data.map((item,index)=>{
                let temp = {};
                if (!$("#prizeTitle"+index).val()
                    || !$("#showPic"+index).attr('src')
                    || !$("#showPicSelect"+index).attr('src')
                    || !$("#prizeType"+index).val()
                    || !$("#winningProbability"+index).val()
                    || !$("#prizeNum"+index).val()
                    || !$("#prizeDescribe"+index).val()
                ) {
                    flag = true
                } else {
                    temp.prizeId = data[index].prizeId ? data[index].prizeId : '';
                    temp.prizeTitle = $("#prizeTitle"+index).val();
                    temp.prizeImgInit = $("#showPic"+index).attr('src');
                    temp.prizeImgSelect = $("#showPicSelect"+index).attr('src');
                    temp.prizeType = $("#prizeType"+index).val();
                    temp.prizeTypeNum = temp.prizeType == '1' ? $("#prizeTypeNum"+index).val() : 0;
                    temp.prizeNum = $("#prizeNum"+index).val();
                    temp.winningProbability = $("#winningProbability"+index).val();
                    temp.prizeDescribe = $("#prizeDescribe"+index).val();
                }
                // TODO
                temp.prizeId = data[index].prizeId ? data[index].prizeId : '';
                temp.prizeTitle = '名称';
                temp.prizeImgInit = "https://img.zhengzai.tv/other/2021/12/03/9b70f3c310f0452bb4544f9d7d5f482e.png";
                temp.prizeImgSelect = "https://img.zhengzai.tv/other/2021/12/03/9b70f3c310f0452bb4544f9d7d5f482e.png";
                temp.prizeType = $("#prizeType"+index).val();
                temp.winningProbability = 1;
                temp.prizeNum = 1;
                temp.prizeTypeNum = temp.prizeType == '1' ? 1: 0;
                temp.prizeDescribe = "描述";

                prizeListArr.push(temp);
                // return {...item};
            })
            // if (flag) {
            //     return layer.msg('请将表格内容填写完整！')
            // }
            let datas = {
                activityImg: showPicture,
                activityNum: $("#integral").val(),
                activityRules: $("#activityRule").val(),
                activityTitle: $("#ActivityName").val(),
                activityType: 1,
                expressFeeType: courierType,
                integralActivityId: itemId || '',
                endTime: $.common.dateFormat($("#endTime").val(), 'yyyy-MM-dd HH:mm:ss') , //
                isOnline: online,
                prizeList: prizeListArr,
                startTime: $.common.dateFormat($("#startTime").val(), 'yyyy-MM-dd HH:mm:ss'),
                timeType: timeType,
                estimatedNum: $("#estimatedNum").val(),
                probabilityPublicity: $("#probabilityPublicity").val()
            }
            let url = '/sweet/integralActivity/create';
            let type = 'post';
            if (itemId) {
                url = '/sweet/integralActivity/update'
                type = 'put'
            }
            $.ajax({
                type,
                url,
                contentType: "application/json;charset=UTF-8",
                data: JSON.stringify(datas),
                success:function(res) {
                    layer.msg('' + res);
                    if (res.code != undefined && res.code != web_status.SUCCESS) {
                        $.modal.alertWarning(res.msg);
                        return [];
                    } else if (res.code == web_status.SUCCESS) {
                        $.operate.successTabCallback(res);
                        closeItem();
                    }
                }
            })
        }
        // 展示已配置的优惠券列表
        function showList (index) {
            nowShowData = data[index];
            nowShowData.index = index;
            nowList = [];
            detailsOptions.data = [];
            $.table.destroy("details-table");
            $.ajax({
                type: 'get',
                url: '/sweet/integralActivityPrizeRelation/list',
                data: { prizeId: nowShowData['prizeId'] },
                success: function (res) {
                    nowList = res;
                    detailsOptions.data = res;
                    setTimeout(()=>{
                        $.table.init(detailsOptions);
                    }, 500)
                    $("#detailsFormList").show();
                }
            });
        }
        function addCouponShow () {
            $(".coupon-select").show();
        }
        function closeCouponShow () {
            $("#detailsFormList").hide();
        }
        // 添加优惠券
        function addCouponFun () {
            let postData = {
                "couponId": nowCouponSelect.couponId,
                "couponTitle": nowCouponSelect.title,
                "integralActivityId": nowShowData['integralActivityId'],
                "prizeId": nowShowData['prizeId']
            };
            $.ajax({
                type: 'post',
                url: '/sweet/integralActivityPrizeRelation/create',
                data: JSON.stringify(postData),
                contentType: 'application/json',
                success: function (e) {
                    if (e.code == 0) {
                        showList(nowShowData.index);
                        alert('添加成功！');
                    }
                }
            });
        }
        // 删除优惠券
        function deleteCoupon(index) {
            let postData = {
                "integralActivityId": nowShowData['integralActivityId'],
                "prizeRelationId": nowList[index]['prizeRelationId']
            };
            $.ajax({
                type: 'put',
                url: '/sweet/integralActivityPrizeRelation/delete',
                data: postData,
                success: function (e) {
                    if (e.code == 0) {
                        showList(nowShowData.index);
                        alert('删除成功！');
                    }
                }
            });
        }
        // 远程搜索券
        function getMallList() {
            let data = {
                keyword: searchVal,
                busiType: 0,
                pageSize: 20,
                pageNum: 1,
                bindType: 2
            }
            let str = '';
            promiseMethods(candyfix + "/list",'post',data,'application/x-www-form-urlencoded').then(res=>{
                if (res.rows.length>0) {
                    searchData = res.rows;
                    searchData.forEach((item,index)=>{
                        str+= `<li class="selectData" onclick="selectOne('${item.couponId}', 'couponId')">${item.title}</li>`
                    })
                    $('#dataList').html(str);
                } else {
                    $('#dataList').html('<li style="width:100%;text-align:center;color:#ccc;">--- 暂无数据 ---</li>');
                }
            })
        }
        function promiseMethods(url,type,data,contentType) {
            return new Promise((resolve,reject)=>{
                $.ajax({
                    url,
                    type,
                    data,
                    contentType,
                    success:function(res) {
                        resolve(res);
                    }
                })
            })
        }
        // 选择优惠券
        function selectOne(id, name) {
            searchData.some( (item, index) => {
                if (item[name] == id) {
                    nowCouponSelect = item;
                    return $("#searchIpt").val(item.title);
                }
            } )
        }
        $("#searchIpt").focus(function(){
            getMallList()
            $('#dataList').show()
        });
        $("#searchIpt").blur(function(){
            setTimeout(() => {
                $('#dataList').hide()
            }, 500);
        });
        $("#searchIpt").keyup(function(){
            searchVal = $("#searchIpt").val()
            getMallList()
        });
    </script>

    <style>
        .layui-form {
            padding: 20px;
        }
        .main_type, .money, .scope_application, .sendType,.phoneNumber,.playMethod {
            margin-bottom: 20px;
        }

        .phoneNumber,.playMethod {
            display: none;
        }
        .labelName {
            display: inline-block;
            width: 100px;
            text-align: right;
        }
        input {
            border: 1px solid #ddd;
            border-radius: 4px;
            background: transparent;
            outline: none;
            padding-left: 5px;
            height: 30px;
        }
        .main_type .form-control.kv-fileinput-caption {
            height: 42px !important;
        }
        .prompt {
            margin-left: 100px !important;
        }

        .main_type input, .sendType input,.playMethod input {
            margin-top: -2px;
            margin-right: 5px;
        }
        .main_type span, .sendType span, .playMethod span {
            margin-right: 12px;
            line-height: 28px;
        }
        .layui-form .money input {
            width: 60px;
        }
        .main_bottom .describe, .main_bottom .sendTime {
            margin-bottom: 20px;
        }
        .describe,.main_type {
            display: flex;
        }
        .sendTime {
            display: flex;
        }
        .sendTime input {
            margin-top: -6px;
            margin-right: 5px;
        }
        .bottom_btn {
            width: 25%;
            text-align: center;
        }
        select {
            border: 1px solid #ddd;
            border-radius: 4px;
            background: transparent;
            outline: none;
            height: 30px;
            width: 200px;
        }
        .required {
            font-style: normal;
            color: red;
        }
        .ibox-content {
            border-style: none;
            border-width: 0px;
        }
        .main_type .file-footer-buttons .kv-file-remove {
            display: none !important;
        }
        .selectScore {
            display: flex;
            align-items: center;
        }
        .selectScore p {
            margin: 0;
        }
        .selectScore button {
            margin: 0 12px;
        }
        .selectScore span {
            color: #ccc;
        }
        .scoreTable {
            margin-bottom: 12px;
        }
        .details-form-list {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, .5);
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .details-pop-inner {
            width: 800px;
            height: 800px;
            padding: 10px;
            background: #fff;
        }
        .search_ipt ul,.search_ipt li{
            padding: 0;
            margin: 0;
            font-style: normal;
            list-style: none;
        }
        .search_ipt ul {
            display: none;
            position: absolute;
            left: 0;
            top: 26px;
            padding: 5px 0;
            z-index: 899;
            min-width: 200px;
            border: 1px solid #eee;
            max-height: 300px;
            overflow-y: auto;
            background-color: #fff;
            border-radius: 2px;
            box-sizing: border-box;
            box-shadow: 1px 1px 4px rgb(0 0 0 / 8%);
        }
        .search_ipt li {
            background-color: #fff;
            cursor: pointer;
            padding-left: 10px!important;
            color: #999;
            padding: 0 10px;
            line-height: 36px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .search_ipt li:hover {
            background: #F6F6F6;
        }
        .search_ipt .layui-input {
            width: 200px;
        }
    </style>

</html>