From ad3651b7964653a610fb9ca99cc18dcbe467dbdc Mon Sep 17 00:00:00 2001 From: liukangdong <898885815@qq.com> Date: 星期二, 28 五月 2024 17:10:40 +0800 Subject: [PATCH] Merge branch 'master' of http://139.186.142.91:10010/r/productDev/dmvisit --- admin/src/components/common/upload.vue | 140 ++++++++++++++++++++++++---------------------- 1 files changed, 73 insertions(+), 67 deletions(-) diff --git a/admin/src/components/common/upload.vue b/admin/src/components/common/upload.vue index 9917980..d6dfc8d 100644 --- a/admin/src/components/common/upload.vue +++ b/admin/src/components/common/upload.vue @@ -8,76 +8,82 @@ <img :src="item.url" v-if="fileType(item.url) === 'img'" /> <video controls autoplay :src="item.url" v-else></video> </div> - <div class="file_list_item" :style="{width: width, height: height, cursor: 'pointer'}" @click="$refs.file.click()"> - <i class="el-icon-plus"></i> - </div> + <div class="file_list_item" :style="{width: width, height: height, cursor: 'pointer'}" @click="$refs.file.click()"> + <i class="el-icon-plus" style="font-size: 18px;color: #8c939d;text-align: center;margin-top: 10px"></i> + <i style="font-size: 12px;color: #8c939d;font-style: normal;text-align: center">{{tips}}</i> + </div> + <input type="file" ref="file" :accept="accept" @change="getFile" /> </div> - <input type="file" ref="file" :accept="accept" @change="getFile" /> </div> </template> <script> - import axios from 'axios'; - export default { - props: { - width: { - type: String, - default: '90px' - }, - height: { - type: String, - default: '90px' - }, - list: { - type: Array, - default: [] - }, - accept: { - type: String, - default: '' - }, - folder: { - type: String, - default: '' - } - }, - data() { - return { - uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/upload' - } - }, - - methods: { - fileType(url) { - if (url.indexOf('.mp4') !== -1) { - return 'video' - } else { - return 'img' - } - }, - getFile(e) { - if (e.target && e.target.files.length > 0) { - this.$emit('loading') - const formdate = new FormData() - formdate.append('file', e.target.files[0]) - formdate.append('folder', this.folder) - axios.post(this.uploadImgUrl, formdate) - .then(res => { - this.$emit('success', res.data.data) - }) - .catch(e => { - this.$message.error(e) - }) - .finally(() => { - this.$refs.file.value = null - }) - } - }, - deleItem(index) { - this.$emit('dele', index) - } - } +import axios from 'axios' +export default { + props: { + width: { + type: String, + default: '90px' + }, + height: { + type: String, + default: '90px' + }, + list: { + type: Array, + default: [] + }, + tips: { + type: String, + default: '0' + }, + accept: { + type: String, + default: '' + }, + folder: { + type: String, + default: '' } + }, + data () { + return { + uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/upload' + } + }, + + methods: { + fileType (url) { + if (url.indexOf('.mp4') !== -1) { + return 'video' + } else { + return 'img' + } + }, + getFile (e) { + if (e.target && e.target.files.length > 0) { + this.$emit('loading') + const formdate = new FormData() + formdate.append('file', e.target.files[0]) + formdate.append('folder', this.folder) + axios.post(this.uploadImgUrl, formdate) + .then(res => { + this.$emit('success', res.data.data) + console.log(res.data.data) + }) + .catch(e => { + this.$message.error(e) + }) + .finally(() => { + this.$refs.file.value = null + }) + } + }, + deleItem (index) { + this.$emit('dele', index) + } + } +} </script> <style lang="scss" scoped> @@ -102,7 +108,7 @@ overflow: hidden; border-radius: 5px; border: 1px solid #d5d5d5; - margin-left: 15px; + margin: 5px; position: relative; &:first-child { margin: 0 !important; @@ -117,10 +123,11 @@ display: flex; align-items: center; justify-content: center; + z-index: 10000; cursor: pointer; .el-icon-close { color: #ffffff; - font-size: 19px; + font-size: 14px; } } .el-icon-plus { @@ -138,4 +145,3 @@ } } </style> - -- Gitblit v1.9.3