nickchange
2023-10-13 f87aa54781ea269e6be1f74d013c18f5091a8c80
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">
@@ -155,6 +198,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>
@@ -223,7 +298,52 @@
    </div>
</div>
<script src="${ctxPath}/modular/system/coursePackage/coursePackage_info.js"></script>
<script type="text/javascript">
    <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'