安全培训管理:完成编辑弹框,培训照片上传

This commit is contained in:
杜海鹏 2022-07-14 11:26:24 +08:00
parent ce54b6fd29
commit 70391446e5

View File

@ -253,11 +253,13 @@
class="photoUpload" class="photoUpload"
:action="$store.state.UPLOADURL" :action="$store.state.UPLOADURL"
:show-file-list="false" :show-file-list="false"
:on-success="handleAvatarSuccess" :on-success="file => handleUpload(file, i)"
:before-upload="beforeAvatarUpload"> :before-upload="beforeAvatarUpload">
<img v-if="imageUrl" :src="imageUrl" class="avatar"> <img v-if="eduPhotos['photo' + i]" :src="$store.state.FILEURL + eduPhotos['photo' + i]" class="photo">
<i v-else class="el-icon-plus avatar-uploader-icon"></i> <template v-else>
<span>培训{{i === 1 ? '前' : i === 2 ? '中' : '后'}}</span> <i class="el-icon-plus avatar-uploader-icon"></i>
<span>培训{{i === 1 ? '前' : i === 2 ? '中' : '后'}}</span>
</template>
</el-upload> </el-upload>
</div> </div>
</el-form-item> </el-form-item>
@ -458,6 +460,11 @@ export default {
allPersonList: [], allPersonList: [],
educateTypeList: this.$t("message.laborDev.educateTypeList"), educateTypeList: this.$t("message.laborDev.educateTypeList"),
selectWorkerDialog: false, selectWorkerDialog: false,
eduPhotos: {
photo1: '',
photo2: '',
photo3: '',
}
}; };
}, },
mounted() { mounted() {
@ -467,6 +474,11 @@ export default {
console.log('url',xxx) console.log('url',xxx)
}, },
methods: { methods: {
handleUpload(res, num) {
const imageUrl = res.data[0].imageUrl
this.eduPhotos['photo' + num] = imageUrl
console.log(this.eduPhoto1,this.eduPhoto2,this.eduPhoto3, num);
},
handlePreview(file,type){ handlePreview(file,type){
// console.log('file',file) // console.log('file',file)
// console.log('fileList',type) // console.log('fileList',type)
@ -722,6 +734,10 @@ export default {
flex-wrap: wrap; flex-wrap: wrap;
.photoUpload{ .photoUpload{
margin-right: 10px; margin-right: 10px;
.photo{
width: 100%;
height: 100%;
}
} }
} }