<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增活动')" />
    <th:block th:include="include :: select2-css" />
    <th:block th:include="include :: bootstrap-fileinput-css" />
    <link rel="stylesheet" href="">
    <style>
        input {
            height: 34PX;
            line-height: 34PX;
        }
        .required {
            font-style: normal;
            color: red;
        }
        .content_item {
            padding: 20px;
        }
        /* .content_item .content_title {
            display: flex;
        } */
        .content_item .content_title h3 span {
            display: inline-block;
            width: 4px;
            height: 18px;
            background: skyblue;
            margin-right: 6px;
            vertical-align: top;
        }
        .basis_data {
            display: flex;
            font-size: 14px;
            padding: 0 20px;
            margin-top: 20px;
            /* align-items: center; */
        }
        .basis_data span {
            width: 100px;
            text-align: right;
            
        }
        #startTime, #endTime {
            width: 272px;
            margin-right: 10px;
        }
        .storeList, #selectShow, .dropdown-menu, .input-group {
            width: 270px !important;
        }
        .activityStore_item {
            display: flex;
            margin-bottom: 12px;
        }
        #basis_data {
            align-items: flex-start;
        }
        .form-control,.layui-input {
            height: 34px;
            line-height: 34px;
        }
        .kv-upload-progress {
            display: none !important;
        }
        .ibox-content .imgBox {
            max-width: 350px;
            max-height: 180px;
        }
    </style>
</head>
<body>
<div>
    <div class="content_item">
        <div class="content_title">
            <!-- <h3><span></span>基础信息</h3> -->
        </div>
        <div class="basis_data">
            <span>
                <em class="required">*</em>
                标题：
            </span>
            <div class="input-group" style="width: 300px;">
                <input type="text" class="form-control" id="ybTitle" placeholder="请输入活动名称">
                <input type="hidden" class="form-control" id="activityId" placeholder="">
            </div>
        </div>
        <div class="basis_data ibox-content" style="border: none;display: flex;">
            <span>
                <em class="required">*</em>
                活动图片：
            </span>
            <div>
                <img id="viewImg" class="imgBox" src="" alt="">
                <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>
                    <!-- <span style="color: #ccc; font-size: 12px;">适配图片尺寸：660*344</span> -->
                </div>
            </div>
        </div>
        <div class="basis_data">
            <span>
                <em class="required">*</em>
                起止时间：
            </span>
            <input type="text" class="layui-input form-control editDisabled" id="startTime" autocomplete="off" placeholder="请选择活动开始时间">
            ~  
            <input type="text" class="layui-input form-control editDisabled"  id="endTime" style="margin-left: 10px;" autocomplete="off" placeholder="请选择活动结束时间">
        </div>
    </div>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: bootstrap-fileinput-js" />
<th:block th:include="include :: bootstrap-suggest-js" />
</body>
<script th:inline="javascript">
    let count = 1;
    var prefix2 = ctx + "local";
    let activityId = '';
    let editDatas = 0;
    var platformUrl = [[${platformUrl}]];
    $(function() {
        let name = 'id';
        var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            //执行一个laydate实例
            laydate.render({
                elem: '#startTime', //指定元素
                type: 'datetime'
            });
            laydate.render({
                elem: '#endTime', //指定元素
                type: 'datetime'
            });
        });
        if (unescape(r[2]) && unescape(r[2]) != 'undefined') {
            activityId =  unescape(r[2]);
            let data = {
                activityId
            }
            let searchActivity = promiseMethods('/sweet/activity/details', 'get', data);
            Promise.all([searchActivity]).then(res => {
                let data = res[0];
                console.log(data, 'rees')
                $("#viewImg").attr('src', data.cover);
                $("#startTime").val(data.startTime);
                $("#endTime").val(data.endTime);
                $("#ybTitle").val(data.title);
                $("#activityId").val(data.activityId);
            })
        }
        $("#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) {       //上传回调事件
            let showPicture = 'https://img.zhengzai.tv/' + data.response.data.ossPath;
            $("#viewImg").attr('src', showPicture)
        })

    })
    function promiseMethods(url,type,data,contentType) {
        return new Promise((resolve,reject)=>{
            $.ajax({
                url,
                type,
                data,
                contentType,
                success:function(res) {
                    resolve(res);
                }
            })
        })
    }
</script>
</html>
