@layout("/common/_container.html"){
<style>
    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        height: 100px;
        width: 100px;
        overflow: hidden;
    }

    .avatar-uploader .el-upload:hover {
        border-color: #409eff;
    }
    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 100px;
        height: 100px;
        line-height: 100px;
        margin-top: 34px;
        text-align: center;
    }
    .avatar {
        width: 100px;
        height: 100px;
        display: block;
    }

    .col-sm-12 {
        margin-top: 20px;
    }

    .col-sm-12 select {
        height: 33px;
    }
</style>
<div class="ibox float-e-margins">
    <div class="ibox-content">
        <input hidden id="t1" value="${item.type}">
        <input hidden id="t2" value="${item.distributionMethod}">
        <input hidden id="t3" value="${item.redemptionMethod}">
        <input hidden id="t4" value="${item.userPopulation}">
        <input hidden id="t5" value="${item.useScope}">
        <input hidden id="one" value="${one}">
        <input hidden id="two" value="${two}">
        <input hidden id="three" value="${three}">
        <input hidden id="city" value="${city}">
        <div class="form-horizontal">
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">*优惠券名称: </label>
                        <div class="col-sm-9">
                            <input class="form-control" id="name" name="name" autocomplete="off" placeholder="请输入优惠券名称" value="${item.name}" readonly>
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">*优惠券类型: </label>
                        <input class="col-sm-1" style="margin-left: 2.7%;width: 13px;height: 13px;"
                               name="prescription" onclick="radio1()" checked disabled
                               value="1" type="radio">
                        <label class="col-sm-1" style="margin-left: 10px;width: 17%">满减券: 满</label>
                        <input type="text" class="col-sm-1" id="conditionalAmount" readonly
                               onkeyup="value=value.replace(/\D/g,'')"/>
                        <label class="col-sm-1" style="margin-left: -1.5%;width: 14%"> 元 , 减 </label>
                        <input type="text" class="col-sm-1" id="deductionAmount" readonly
                               onkeyup="value=value.replace(/\D/g,'')"/>
                        <label class="col-sm-1" style="margin-left: -1.5%"> 元</label>
                    </div>
                    <div class="form-group">
                        <input class="col-sm-1" name="prescription" type="radio" value="2" disabled
                               onclick="radio2()"
                               style="margin-left: 24.7%;">
                        <label class="col-sm-1" style="margin-left: -17px;width: 20%;">代金券: 可抵</label>
                        <input class="col-sm-1" id="voucherAmount" readonly />
                        <label class="col-sm-1">元</label>
                    </div>
                    <div class="form-group">
                        <input class="col-sm-1" name="prescription" type="radio" value="3" disabled
                               onclick="radio3()"
                               style="margin-left: 24.7%;">
                        <label class="col-sm-1 control-label" style="margin-left: -1%;width: 14%;margin-top: -5px">体验券: </label>
                        <input class="col-sm-1" style="width: 35%" id="experienceName" name="name"
                               autocomplete="off" placeholder="请输入体验券名称" readonly>
                    </div>
                    
                </div>
            </div>

            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">*优惠券说明: </label>
                        <div class="col-sm-9">
                            <textarea type="checkbox" id="illustrate" style="margin-left: 1%;width: 75%;height: 120px"
                                      placeholder="请输入优惠券说明" disabled>${item.illustrate}</textarea>
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <div class="initialLevel col-sm-12 control-label form-group">
                            <label class="col-sm-3 control-label">*发放方式: </label>
                            <input class="col-sm-1 control-label"  name="distributionMethod" type="radio" disabled
                                   value="1" checked style="margin-top: 10px"/>
                            <label class="col-sm-1" style="margin-left: -15px;width: 16%;margin-top: 7px">积分购买</label>
                            <input class="col-sm-1 control-label" name="distributionMethod"  type="radio" disabled
                                   value="2" style="margin-left: 5%;margin-top: 10px;width: 13px;height: 13px"/>
                            <label class="col-sm-1" style="width: 16%;margin-top: 7px">注册赠送</label>
                            <input class="col-sm-1 control-label" name="distributionMethod"  type="radio" disabled
                                   value="3" style="margin-left: 4%;margin-top: 10px;width: 13px;height: 13px"/>
                            <label class="col-sm-1" style="width: 16%;margin-top: 7px">自动发券</label>
                            <input class="col-sm-1 control-label" name="distributionMethod"  type="radio" disabled
                                   value="4" style="margin-left: 4%;margin-top: 10px;width: 13px;height: 13px"/>
                            <label class="col-sm-1" style="width: 16%;margin-top: 7px">课包赠送</label>
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row" id="exchangeType"  >
                <div class="col-sm-6">
                    <div class="form-group">
                        <div class="initialLevel col-sm-12 control-label form-group">
                            <label class="col-sm-3 control-label">*兑换方式: </label>
                            <input class="col-sm-1 control-label" onclick="exchangeMethod1()" name="exchangeMethod" type="radio" disabled
                                   value="1"  style="margin-top: 10px"/>
                            <label class="col-sm-1" style="margin-left: -15px;width: 16%;margin-top: 7px">积分</label>
                            <input class="col-sm-1 control-label" name="exchangeMethod" onclick="exchangeMethod2()" type="radio" disabled
                                   value="2"  style="margin-left: 5%;margin-top: 10px;width: 13px;height: 13px"/>
                            <label class="col-sm-1" style="width: 20%;margin-top: 7px">现金+积分</label>
                            <input class="col-sm-1 control-label" name="exchangeMethod" onclick="exchangeMethod3()" type="radio" disabled
                                   value="3"  style="margin-left: 5%;margin-top: 10px;width: 13px;height: 13px"/>
                            <label class="col-sm-1" style="width: 9%;margin-top: 7px">现金</label>
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row" id="needAmount" >
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">*所需现金</label>
                        <div class="col-sm-9">
                            <input class="form-control" id="requiredCash" placeholder="请输入所需现金" name="requiredCash" autocomplete="off" type="text" value="${item.cash}" readonly
                                   onkeyup="this.value=this.value.replace(/\D/g,'')">
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row" id="needIntegral" >
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">*所需积分</label>
                        <div class="col-sm-9">
                            <input class="form-control" id="requiredPoints" placeholder="请输入所需积分" name="requiredPoints" autocomplete="off" type="text"  value="${item.integral}" readonly
                                   onkeyup="this.value=this.value.replace(/\D/g,'')">
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <div class="initialLevel col-sm-12 control-label form-group">
                            <label class="col-sm-3 control-label">*用户人群: </label>
                            <input class="col-sm-1 control-label" name="userGroup" type="radio" disabled
                                   value="1" checked style="margin-top: 10px"/>
                            <label class="col-sm-1" style="margin-left: -15px;width: 16%;margin-top: 7px">全部用户</label>
                            <input class="col-sm-1 control-label" name="userGroup" type="radio" disabled
                                   value="2"  style="margin-left: 5%;margin-top: 10px;width: 13px;height: 13px"/>
                            <label class="col-sm-1" style="width: 16%;margin-top: 7px">年度会员</label>
                            <input class="col-sm-1 control-label" name="userGroup" type="radio" disabled
                                   value="3"  style="margin-left: 4%;margin-top: 10px;width: 13px;height: 13px"/>
                            <label class="col-sm-1" style="width: 18%;margin-top: 5px">已有学员用户</label>
                        </div>
                    </div>
                    
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">*发放数量</label>
                        <div class="col-sm-9">
                            <input class="form-control" id="quantityIssued" placeholder="请输入发放数量" name="quantityIssued" autocomplete="off" type="text" value="${item.quantityIssued}" readonly
                                   onkeyup="this.value=this.value.replace(/\D/g,'')">
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">*限领数量</label>
                        <div class="col-sm-9">
                            <input class="form-control" id="pickUpQuantity" placeholder="请输入限领数量" name="pickUpQuantity" autocomplete="off" type="text" value="${item.pickUpQuantity}" readonly
                                   onkeyup="this.value=this.value.replace(/\D/g,'')">
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row">
                <div class="col-sm-6">
                    <label class="col-sm-3 control-label">*有效期: </label>
                    <input type="text" style="width: 30%;margin-left: 1%" class="col-sm-3" id="periodOfValidity" value="${s} - ${e}" disabled
                           placeholder="请选择"/>
                </div>
            </div>

            <div class="row" id="app" >
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">*商品封面: </label>
                        <div class="col-sm-2" style="margin-top: 2%">
                            <img src=${item.cover}>
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row" id="app1" >
                <div class="col-sm-6" style="width: 100%">
                    <div class="form-group">
                        <label class="col-sm-3 control-label" style="width: 15%;margin-left: 7%">*商品图片(请上传不超过五张图片): </label>
                        <div class="col-sm-2" style="width: 100%;margin-left: 12%;margin-top: 1%">
                            @for(i in img){
                            <img src=${i} style="width: 150px">
                            @}
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row" id="belongsCon" >
                <div class="col-sm-6">
                    <div class="form-group">
                        <div class="initialLevel col-sm-12 control-label form-group">
                            <label class="col-sm-3">*适用范围: </label>
                            <div class="col-sm-3" id="belongsNationwide" >
                                <input class="col-sm-1" onclick="scopeOfApplication1()" name="company" type="radio" disabled
                                       value="1"  style="margin-top: 10px"/>
                                <label class="col-sm-2" style="width: 68%;margin-top: 7px">全国通用</label>
                            </div>
                            <div class="col-sm-3" id="belongsCity" >
                                <input class="col-sm-1" name="company" onclick="scopeOfApplication2()" type="radio" disabled
                                       value="2"  style="margin-top: 10px"/>
                                <label class="col-sm-2" style="width: 64%;margin-top: 7px">指定城市</label>
                            </div>
                            <div class="col-sm-3" id="belongsStore" >
                                <input class="col-sm-1" name="company" onclick="scopeOfApplication3()" type="radio" disabled
                                       value="3" style="margin-left: 4%;margin-top: 10px;width: 13px;height: 13px"/>
                                <label class="col-sm-2" style="width: 64%;margin-top: 6px;">指定门店</label>
                            </div>
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row" id="citySelect" hidden="hidden">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">*指定城市: </label>
                        <table class="table table-bordered" style="width: 70%;margin-left: 228px;" id="">
                            <thead>
                            <tr>
                                <td>省</td>
                                <td>市</td>
                            </tr>
                            @for(c in city){
                            <td>${c.province}</td>
                            <td>${c.city}</td>
                            @}
                            </thead>
                        </table>
                    </div>
                    
                </div>
            </div>

            <div class="row" id="storeSelect" hidden="hidden">
                <div class="col-sm-6">
                    <div class="form-group">
                        <div class="col-sm-12">
                            <label class="col-sm-3 control-label">*指定门店: </label>
                        </div>
                        <div class="col-sm-12" style="margin-left: -57px;margin-top: 20px">
                            <table class="table table-bordered" style="width: 70%;margin-left: 228px;" id="storeTable">
                                <thead>
                                <tr>
                                    <td>所在省市</td>
                                    <td>所属账号</td>
                                    <td>门店名称</td>
                                </tr>
                                @for(s in store){
                                <td>${s.province}</td>
                                <td>${s.phone}</td>
                                <td>${s.name}</td>
                                @}
                                </thead>
                            </table>
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="row">
                <div class="row btn-group-m-t">
                    <div class="col-sm-10" style="margin-left: 20%;">
                        <#button btnCss="danger" name="取消" id="cancel" icon="fa-eraser"
                        clickFun="couponInfoDlg.close()"/>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>
<script src="${ctxPath}/js/vue/vue.js"></script>
<script src="${ctxPath}/js/elementui/index.js"></script>
<link rel="stylesheet" href="${ctxPath}/js/elementui/index.css">
<script src="${ctxPath}/modular/system/tCoupon/TCouponInfo.js"></script>
<script src="${ctxPath}/modular/system/tCoupon/TStoreInfo.js"></script>
<script type="text/javascript">
    window.onload = function() {
        console.log(12312)
    }
    laydate.render({
        elem: '#periodOfValidity',
        type: 'date',
        range: true
    });
    var vue1 = new Vue({
        el: '#app',
        data: {
            autoUpload: true,//自动上传
            imageUrl: '',//模型数据，用于上传图片完成后图片预览
            dialogVisible: false
        },
        methods: {
            handleAvatarSuccess(res, file) {
                this.imageUrl = URL.createObjectURL(file.raw);
                couponInfoDlg.goodsCover = file.response;
            },
            beforeAvatarUpload(file) {
                const isLt2M = file.size / 1024 / 1024 < 10;
                if (!isLt2M) {
                    this.$message.error('上传图片大小不能超过 10MB!');
                }
                return isLt2M;
            },
            handleRemove(file, fileList) {
                couponInfoDlg.goodsCover = '';
                console.log(couponInfoDlg.goodsCover)
            },
        },
        created() {
        },
    });

    var vue2 = new Vue({
        el: '#app1',
        data: {
            autoUpload: true,//自动上传
            imageUrl1: '',//模型数据，用于上传图片完成后图片预览
            dialogVisible: false
        },
        methods: {
            handleAvatarSuccess(res, file) {
                couponInfoDlg.goodsPicArray.push(file);
            },
            beforeAvatarUpload(file) {
                const isLt2M = file.size / 1024 / 1024 < 10;
                if (!isLt2M) {
                    this.$message.error('上传图片大小不能超过 10MB!');
                }
                return isLt2M;
            },
            handleRemove(file, fileList) {
                couponInfoDlg.goodsPicArray = couponInfoDlg.goodsPicArray.filter(item => {
                    return item.uid != file.uid;
                });
            },
        },
        created() {
        },
    });



</script>
@}