44323
2023-10-16 865fc8d02e44811fb423df7125055c3a85e38964
cloud-server-management/src/main/webapp/WEB-INF/view/system/coursePackage/coursePackage_add.html
@@ -1,4 +1,47 @@
    @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: 32px;
            text-align: center;
        }
        .avatar {
            width: 100px;
            height: 100px;
            display: block;
        }
        .col-sm-12 {
            margin-top: 20px;
        }
        .col-sm-12 select {
            height: 33px;
        }
        #app1{
            margin-left: 255px;
        }
    </style>
<div class="ibox float-e-margins">
    <div class="ibox-content">
        <div class="form-horizontal">
@@ -141,23 +184,11 @@
                    <label class="col-sm-3 control-label head-scu-label"></label>
                    <label>推荐像素:210x280px</label>
                </div>
                <div class="row" id="app1">
                    <div class="form-group">
                        <label class="col-sm-3 control-label head-scu-label">*实景图片(请上传不超过五张图片): </label>
                        <div class="col-sm-2" style="width: 100%;margin-left: 11%;margin-top: 1%">
                            <el-upload
                                    :limit="5"
                                    class="avatar-uploader"
                                    action="/tCouponManage/uploadPic"
                                    list-type="picture-card"
                                    accept="."
                                    :on-success="handleAvatarSuccess"
                                    :on-remove="handleRemove">
                                <i class="el-icon-plus"></i>
                            </el-upload>
                            <el-dialog :visible.sync="dialogVisible">
                                <img width="100%" :src="imageUrl1" alt="">
                            </el-dialog>
                <div class="form-group">
                    <label class="col-sm-3 control-label head-scu-label">*详情页</label>
                    <div class="col-sm-2">
                        <div id="detailDrawingPreId">
                            <div><img width="100px" height="100px" src="${ctxPath}/img/NoPIC.png"></div>
                        </div>
                    </div>
                </div>
@@ -175,6 +206,38 @@
<!--                    </div>-->
<!--                    <input type="hidden" id="detailDrawing" value=""/>-->
<!--                </div>-->
    <div class="row" id="app1">
    <div class="form-group">
        <label class="col-sm-3 control-label head-scu-label">*赛事活动图片(请上传不超过五张图片): </label>
        <div class="col-sm-2" style="width: 100%;margin-left: 11%;margin-top: 1%">
            <el-upload
                    :limit="5"
                    class="avatar-uploader"
                    action="/tCouponManage/uploadPic"
                    list-type="picture-card"
                    accept="."
                    :on-success="handleAvatarSuccess"
                    :on-remove="handleRemove">
                <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisible">
                <img width="100%" :src="imageUrl1" alt="">
            </el-dialog>
        </div>
    </div>
    </div>
    </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label head-scu-label"></label>
                    <label>推荐像素:780x440px</label>
@@ -281,6 +344,52 @@
        created() {
        },
    });
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script>
    <script src="${ctxPath}/js/elementui/index.js"></script>
    <link rel="stylesheet" href="${ctxPath}/js/elementui/index.css">
    <script src="${ctxPath}/js/vue/vue.js"></script>
    <script type="text/javascript">
        var vue2 = new Vue({
            el: '#app1',
            props: {
                // 数量限制
                limit: {
                    type: Number,
                    default: 2
                },
            },
            data: {
                autoUpload: true,//自动上传
                imageUrl1: '',//模型数据,用于上传图片完成后图片预览
                dialogVisible: false
            },
            methods: {
                handleAvatarSuccess(res, file) {
                    console.log(TCarInfoDlg.goodsPicArray1)
                    TCarInfoDlg.goodsPicArray1.push(file);
                },
                beforeAvatarUpload(file) {
                    const isLt2M = file.size / 1024 / 1024 < 10;
                    if (!isLt2M) {
                        this.$message.error('上传图片大小不能超过 10MB!');
                    }
                    return isLt2M;
                },
                handleRemove(file, fileList) {
                    TCarInfoDlg.goodsPicArray1 = TCarInfoDlg.goodsPicArray1.filter(item => {
                        return item.uid != file.uid;
                    });
                },
            },
            created() {
            },
        });
    laydate.render({
        elem: '#classStartTime'
        ,type: 'time'