@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;
        display: inline-block;
    }

    .avatar-uploader .el-upload:hover {
        border-color: #409eff;
    }

    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 100px;
        height: 100px;
        line-height: 110px;
        margin-top: 40px;
        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">
        <div class="form-horizontal" id="carInfoForm">
            <div id="b1">
                <input id="goodsId" value="${id}" hidden="hidden">
                <#input id="name" name="商品名称" type="text" value="${item.name}" readonly="true" />

                <#avatar id="cover" name="商品封面:" avatarImg="${item.cover}" />


                <div class="row" id="app" style="margin-left: 225px;">
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">商品图片(请上传不超过五张图片): </label>
                            <div class="col-sm-2" style="width: 100%;margin-left: 24%;margin-top: 1%">
                                @for(im in pictures){
                                <div class="avatar-uploader" style="display: inline-block;">
                                    <img height="100px" width="100px" src="${im}">
                                    <i class="fa fa-close" onclick="delImg(this)" style="color: red;font-size: 18px;position: absolute;"></i>
                                </div>
                                @}
                                <el-upload
                                        style="display: inline-block;"
                                        :limit="5"
                                        class="avatar-uploader"
                                        action="/tCouponManage/uploadPic"
                                        list-type="picture-card"
                                        accept=".jpg,.jpeg,.png,.JPG,.JPEG"
                                        :on-success="handleAvatarSuccess"
                                        :on-remove="handleRemove">
                                    <i class="el-icon-plus"></i>
                                </el-upload>

                            </div>
                        </div>

                    </div>
                </div>
                <input id="quantityHas" value="${item.quantityHas}" hidden="hidden">
                <div class="form-group">
                    <label class="col-sm-3 control-label">发放数量：</label>
                    <div class="col-sm-9">
                        <input class="form-control" id="quantityIssued" name="quantityIssued" type="text" value="${item.quantityIssued}">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label">限领数量：</label>
                    <div class="col-sm-9">
                        <input class="form-control" id="pickUpQuantity" name="pickUpQuantity" type="text"  value="${item.pickUpQuantity}">
                    </div>
                </div>

                <div class="form-group" style="margin-left:262px">
                    <label class="col-sm-1 control-label">兑换说明：</label>
                    <div class="col-sm-5">
                        <textarea type="text/plain" id="editor"  style="height: 300px;width: 800px;">${item.content}</textarea>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label">排序：</label>
                    <div class="col-sm-9">
                        <input class="form-control" id="sort" name="sort" type="text"  value="${item.sort}">
                    </div>
                </div>
            </div>


        </div>
    </div>

    <div class="row btn-group-m-t">
        <div class="col-sm-10 col-sm-offset-5">
            <#button btnCss="info" name="提交" id="ensure" icon="fa-check" clickFun="TGoodsInfoDlg.editSubmit()"/>
            <#button btnCss="danger" name="取消" id="cancel" icon="fa-eraser" clickFun="TGoodsInfoDlg.close()"/>
        </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/tGoods/tGoods_info.js"></script>
<script>
    var vue2 = new Vue({
        el: '#app',
        data: {
            autoUpload: true,//自动上传
            imageUrl1: '',//模型数据，用于上传图片完成后图片预览
            dialogVisible: false
        },
        methods: {
            handleAvatarSuccess(res, file) {
                TGoodsInfoDlg.goodsPicArray.push(file.response);
            },
            beforeAvatarUpload(file) {
                const isLt2M = file.size / 1024 / 1024 < 10;
                if (!isLt2M) {
                    this.$message.error('上传图片大小不能超过 10MB!');
                }
                return isLt2M;
            },
            handleRemove(file, fileList) {
                TGoodsInfoDlg.goodsPicArray = TGoodsInfoDlg.goodsPicArray.filter(item => {
                    return item.uid != file.uid;
                });
            },
        },
        created() {
        },
    });
</script>
@}