<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('创建活动')" />
    <th:block th:include="include :: bootstrap-fileinput-css" />
    <style>
        .create_activity_box {
            padding: 20px;
        }
        .items {
            /* border: 1px dashed #ccc; */
            border-radius: 10px;
            padding: 12px;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
        }
        .items .title {
            width: 80px;
        }
        label {
            width: 80px;
            text-align: right;
        }
        input {
            width: 200px;
            height: 30px;
        }
        .footer_btn {
            position: absolute;
            margin-top: 20px;
            display: flex;
            justify-content: center;
            align-items: center;
            position: absolute;
            bottom: 20px;
            left: 50%;
            margin-left: -20px;
        }
        select {
            height: 30px;
            width: 200px;
        }
    </style>
</head>
<body>
    <div class="create_activity_box">
        <div class="items">
            <div class="title">关联循演：</div>
            <div class="input-group">
                <input id="goodsName" type="text" class="form-control storeList" placeholder="搜索商品名称">
                <div class="input-group-btn">
                    <ul class="dropdown-menu dropdown-menu-right" role="menu">
                    </ul>
                </div>
            </div>
        </div>
        <div class="footer_btn">
            <button type="button" class="btn btn-success" onclick="save()">保存</button>
        </div>
    </div>
    <th:block th:include="include :: footer"/>
    <th:block th:include="include :: bootstrap-fileinput-js" />
    <th:block th:include="include :: bootstrap-suggest-js" />
    <script th:inline="javascript">
        var prefix2 = ctx + "local";
        var platformUrl = [[${platformUrl}]];
        let couponId = '';
        let showId = '';
        let showName = '';
        $(function () {
            couponId = getUrlParms('couponId')
            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;
            }
            console.log(couponId, 'dasdasdasd')
            $(".storeList").bsSuggest({
                idField: 'roadShowId',                 // data.value 的第几个数据，作为input输入框的内容
	            keyField: 'title',                // data.value 的第几个数据，作为input输入框的内容
                allowNoKeyword: false, //是否允许无关键字时请求数据
                showBtn:false,
                multiWord: true, //以分隔符号分割的多关键字支持
                hideOnSelect: true,
                getDataMethod: "url", //获取数据的方式，总是从 URL 获取
                effectiveFields: ['title'],
                url: '/kylin/performances/roadShow/getList?pageSize=10&pageNum=1&title=',
                /*如果从 url 获取数据，并且需要跨域，则该参数必须设置*/
                processData: function (json) { // url 获取数据时，对数据的处理，作为 getData 的回调函数
                    console.log(json, '?????')
                    //字符串转化为 js 对象
                    let data = {};
                    data.value = json.rows
                    return data
                }
            }).on('onDataRequestSuccess', function (e, result) {
            }).on('onSetSelectValue', function (e, selectedData,selectedRawData ) { // 当前行的所有值都能拿到
                console.log(e, selectedData,selectedRawData, 'dsadasdas')
                showId = selectedData.id;
                showName = selectedData.key;
            }).on('onUnsetSelectValue', function (e) {
            });;
        })
        function save () {
            let data = {
                "couponId": couponId,
                "idList": [
                    showId
                ],
                "scope": 1
            }
            promiseMethods('/candy/coupon/mgt/relate', 'post', JSON.stringify(data), 'application/json').then((res) => {
                layer.msg("关联成功！")
                $.operate.successCallback(res);
            }).catch(() => {
                layer.msg("关联失败，请重试！")
                $.operate.successCallback(res);
            })
        }
        function promiseMethods(url,type,data,contentType) {
            return new Promise((resolve,reject)=>{
                $.ajax({
                    url,
                    type,
                    data,
                    contentType,
                    success:function(res) {
                        resolve(res);
                    }
                })
            })
        }
    </script>
</body>
</html>
