处理图片显示问题

zhanghua

2025-04-14 829f5116884f98643ffc5b2a548a600d40c0cedb

 src/views/operate/disposal/casepool/learn/updateUser/uploadResult/components/arrive/index.vue

@@ -2,76 +2,35 @@
    <div class="arrive">
        <div class="arrive-title">到大现场情况</div>
        <div class="arrive-form">
            <el-form
                ref="arriveForm"
                label-width="160px"
                :model="arrive"
                :rules="arriveRules"
                autoComplete="on"
            >
            <el-form ref="arriveForm" label-width="160px" :model="arrive" :rules="arriveRules" autoComplete="on">
                <!-- 到达时间 -->
                <el-form-item label="到达时间:" prop="arrivalTime">
                    <el-date-picker
                        v-model="arrive.arrivalTime"
                        type="datetime"
                        placeholder="选择到达时间"
                    >
                    <el-date-picker v-model="arrive.arrivalTime" type="datetime" placeholder="选择到达时间">
                    </el-date-picker>
                </el-form-item>
                <!-- 到达地址 -->
                <el-form-item label="到达地址:" prop="arrivalAddress">
                    <el-input
                        v-model="arrive.arrivalAddress"
                        placeholder="请输入地址"
                    ></el-input>
                    <el-input v-model="arrive.arrivalAddress" placeholder="请输入地址"></el-input>
                </el-form-item>
                <!-- 现场情况说明 -->
                <el-form-item label="现场情况说明:" prop="situationExplain">
                    <el-input
                        type="textarea"
                        :autosize="{ minRows: 2, maxRows: 4 }"
                        maxlength="200"
                        show-word-limit
                        v-model="arrive.situationExplain"
                        placeholder="请输入情况说明,限制200字以内"
                    ></el-input>
                    <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" maxlength="200" show-word-limit
                        v-model="arrive.situationExplain" placeholder="请输入情况说明,限制200字以内"></el-input>
                </el-form-item>
                <!-- 信访回复说明 -->
                <el-form-item label="信访回复说明:" prop="replyExplain">
                    <el-input
                        type="textarea"
                        :autosize="{ minRows: 2, maxRows: 4 }"
                        maxlength="200"
                        show-word-limit
                        v-model="arrive.replyExplain"
                        placeholder="请输入回访说明,限制200字以内"
                    ></el-input>
                    <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" maxlength="200" show-word-limit
                        v-model="arrive.replyExplain" placeholder="请输入回访说明,限制200字以内"></el-input>
                </el-form-item>
                <!-- 现场情况照片 -->
                <el-form-item label="现场情况照片:" prop="situationPic">
                    <div class="upImg">
                        <div class="img-list">
                            <img
                                :src="item"
                                alt=""
                                v-for="(item, index) in arrive.situationPic"
                                :key="index"
                            />
                            <img :src="item" alt="" v-for="(item, index) in arrive.situationPic" :key="index" />
                        </div>
                        <div
                            class="upload"
                            v-if="arrive.situationPic.length < 4"
                        >
                            <el-upload
                                :file-list="fileList"
                                class="upload-demo"
                                action="/sccg/file/medias"
                                multiple
                                :show-file-list="false"
                                :limit="4"
                                :on-success="handleSuccess"
                                :headers="getToken()"
                            >
                        <div class="upload" v-if="arrive.situationPic.length < 4">
                            <el-upload :file-list="fileList" class="upload-demo" action="/sccg/file/medias" multiple
                                :show-file-list="false" :limit="4" :on-success="handleSuccess" :headers="getToken()">
                                <i class="el-icon-plus"></i>
                            </el-upload>
                        </div>
@@ -166,6 +125,10 @@
        },
        // 获取arrive对象
        backData() {
            this.arrive.situationPic.forEach(item => {
                item = item.replace(FILE_ORIGINAL_PATH, '')
            })

            const { arrive } = this;
            this.$emit('getArrive', { arrive });
        }
@@ -225,5 +188,4 @@

// ::v-deep .el-form-item__label {
//     color: #4b9bb7;
// }
</style>
// }</style>