“dzb”
2022-10-03 4d9a35462803c7392dedca8d95fe21ff3d949466
src/components/filePictrue/index.vue
@@ -3,17 +3,15 @@
        <div class="file-tell">
            <div class="tell-title">上报</div>
            <div class="tell-show">
                <el-upload class="upload-demo" :show-file-list="false" action="http://42.193.1.25:8082/sccg/file/medias"
                    :headers="getToken()" multiple :limit="50">
                    <div class="my-demo">
                        <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                            alt="">
                        <div class="tip">
                            <div>【图片类型】上报</div>
                            <div>【上报时间】2022-09-08 14:23:34</div>
                        </div>
                <div class="my-demo">
                    <!-- <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                            alt=""> -->
                    <img class="img" :src="imgSource[0].url" alt="">
                    <div class="tip">
                        <div>【图片类型】上报</div>
                        <div>【上报时间】2022-09-08 14:23:34</div>
                    </div>
                </el-upload>
                </div>
                <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                    alt="">
            </div>
@@ -21,17 +19,15 @@
        <div class="file-deal">
            <div class="tell-title">处置</div>
            <div class="tell-show">
                <el-upload class="upload-demo" :show-file-list="false" action="http://42.193.1.25:8082/sccg/file/medias"
                    :headers="getToken()" multiple :limit="50">
                    <div class="my-demo">
                        <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                            alt="">
                        <div class="tip">
                            <div>【图片类型】处置</div>
                            <div>【上报时间】2022-09-08 14:23:34</div>
                        </div>
                <div class="my-demo">
                    <!-- <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                        alt=""> -->
                    <img class="img" :src="imgSource[1].url" alt="">
                    <div class="tip">
                        <div>【图片类型】处置</div>
                        <div>【上报时间】2022-09-08 14:23:34</div>
                    </div>
                </el-upload>
                </div>
                <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                    alt="">
            </div>
@@ -42,8 +38,14 @@
export default {
    data() {
        return {
            imgSource: []
        }
    },
    props: ['filesPictureVo'],
    created() {
        console.log(this.filesPictureVo);
        const { filesPictureVo: { imageResources: mysource } } = this;
        this.imgSource = mysource;
    },
    methods: {
        // 获取token
@@ -61,33 +63,35 @@
.file-picture {
    padding-top: 50px;
    .file-tell,.file-deal {
    .file-tell,
    .file-deal {
        .tell-title {
            line-height: 40px;
        }
        .tell-show {
            display: flex;
            .upload-demo {
                height: 159px;
                .my-demo {
                    position: relative;
                    height: 100%;
                }
                .tip {
                    div {
                        line-height: 20px;
                    }
                    text-align: left;
                    position: absolute;
                    bottom: 80px;
                }
            }
        }
    }
    .my-demo {
        position: relative;
        height: 159px;
    }
    .tip {
        div {
            line-height: 20px;
        }
        text-align: left;
        position: absolute;
        bottom: 0px;
    }
    .img {
        width: 226px;
        height: 159px;
    }
}
</style>