no message
Showing
2 changed files
with
47 additions
and
22 deletions
| ... | @@ -54,7 +54,8 @@ | ... | @@ -54,7 +54,8 @@ |
| 54 | </el-link> | 54 | </el-link> |
| 55 | <div v-if="!disabled" class="ele-upload-list__item-content-action"> | 55 | <div v-if="!disabled" class="ele-upload-list__item-content-action"> |
| 56 | <el-link :disabled="props.disabled" :underline="false" type="danger" @click="handleDelete(index)"> | 56 | <el-link :disabled="props.disabled" :underline="false" type="danger" @click="handleDelete(index)"> |
| 57 | {{ language==0?'删除':'Delete' }}</el-link> | 57 | {{ language == 0 ? '删除' : 'Delete' }} |
| 58 | </el-link> | ||
| 58 | </div> | 59 | </div> |
| 59 | </li> | 60 | </li> |
| 60 | </ul> | 61 | </ul> |
| ... | @@ -63,11 +64,12 @@ | ... | @@ -63,11 +64,12 @@ |
| 63 | </template> | 64 | </template> |
| 64 | 65 | ||
| 65 | <script setup> | 66 | <script setup> |
| 66 | import { getToken } from '@/utils/auth' | 67 | import {getToken} from '@/utils/auth' |
| 67 | import { computed } from 'vue' | 68 | import {computed, watch} from 'vue' |
| 68 | import _ from 'lodash' | 69 | import _ from 'lodash' |
| 69 | import cache from "@/plugins/cache"; | ||
| 70 | import {useStorage} from "@vueuse/core/index"; | 70 | import {useStorage} from "@vueuse/core/index"; |
| 71 | // import cache from "@/plugins/cache"; | ||
| 72 | |||
| 71 | const language = useStorage('language', 0) | 73 | const language = useStorage('language', 0) |
| 72 | 74 | ||
| 73 | const props = defineProps({ | 75 | const props = defineProps({ |
| ... | @@ -85,7 +87,7 @@ const props = defineProps({ | ... | @@ -85,7 +87,7 @@ const props = defineProps({ |
| 85 | // 文件类型, 例如['png', 'jpg', 'jpeg'] | 87 | // 文件类型, 例如['png', 'jpg', 'jpeg'] |
| 86 | fileType: { | 88 | fileType: { |
| 87 | type: Array, | 89 | type: Array, |
| 88 | default: () => ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf', 'zip', 'rar','png', 'jpg', 'jpeg'] | 90 | default: () => ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf', 'zip', 'rar', 'png', 'jpg', 'jpeg'] |
| 89 | }, | 91 | }, |
| 90 | // 是否显示提示 | 92 | // 是否显示提示 |
| 91 | isShowTip: { | 93 | isShowTip: { |
| ... | @@ -100,11 +102,11 @@ const props = defineProps({ | ... | @@ -100,11 +102,11 @@ const props = defineProps({ |
| 100 | type: Boolean, | 102 | type: Boolean, |
| 101 | default: false | 103 | default: false |
| 102 | }, | 104 | }, |
| 103 | buttonText:{ | 105 | buttonText: { |
| 104 | type: String, | 106 | type: String, |
| 105 | default: '上传文件' | 107 | default: '上传文件' |
| 106 | }, | 108 | }, |
| 107 | buttonType:{ | 109 | buttonType: { |
| 108 | type: Number, | 110 | type: Number, |
| 109 | default: 0 | 111 | default: 0 |
| 110 | } | 112 | } |
| ... | @@ -120,7 +122,7 @@ const accept = computed(() => { | ... | @@ -120,7 +122,7 @@ const accept = computed(() => { |
| 120 | }) | 122 | }) |
| 121 | 123 | ||
| 122 | 124 | ||
| 123 | const { proxy } = getCurrentInstance() | 125 | const {proxy} = getCurrentInstance() |
| 124 | const emit = defineEmits() | 126 | const emit = defineEmits() |
| 125 | const number = ref(0) | 127 | const number = ref(0) |
| 126 | const uploadList = ref([]) | 128 | const uploadList = ref([]) |
| ... | @@ -128,7 +130,7 @@ const baseUrl = import.meta.env.VITE_APP_BASE_API | ... | @@ -128,7 +130,7 @@ const baseUrl = import.meta.env.VITE_APP_BASE_API |
| 128 | const uploadFileUrl = ref(baseUrl + '/upload/uploadFileToLocalServer') // 上传文件服务器地址 | 130 | const uploadFileUrl = ref(baseUrl + '/upload/uploadFileToLocalServer') // 上传文件服务器地址 |
| 129 | const download = ref(baseUrl + '/upload/getFile?fileUrl=') // 下载地址 | 131 | const download = ref(baseUrl + '/upload/getFile?fileUrl=') // 下载地址 |
| 130 | 132 | ||
| 131 | const headers = ref({ Authorization: 'Bearer ' + getToken() }) | 133 | const headers = ref({Authorization: 'Bearer ' + getToken()}) |
| 132 | const fileList = ref([]) | 134 | const fileList = ref([]) |
| 133 | const showTip = computed( | 135 | const showTip = computed( |
| 134 | () => props.isShowTip && (props.fileType || props.fileSize) | 136 | () => props.isShowTip && (props.fileType || props.fileSize) |
| ... | @@ -136,7 +138,7 @@ const showTip = computed( | ... | @@ -136,7 +138,7 @@ const showTip = computed( |
| 136 | 138 | ||
| 137 | watch( | 139 | watch( |
| 138 | () => props.modelValue, | 140 | () => props.modelValue, |
| 139 | async(val) => { | 141 | async (val) => { |
| 140 | if (val) { | 142 | if (val) { |
| 141 | let temp = 1 | 143 | let temp = 1 |
| 142 | // 首先将值转为数组 | 144 | // 首先将值转为数组 |
| ... | @@ -144,7 +146,7 @@ watch( | ... | @@ -144,7 +146,7 @@ watch( |
| 144 | // 然后将数组转为对象数组 | 146 | // 然后将数组转为对象数组 |
| 145 | fileList.value = list.map((item) => { | 147 | fileList.value = list.map((item) => { |
| 146 | if (typeof item === 'string') { | 148 | if (typeof item === 'string') { |
| 147 | item = { name: item, url: item } | 149 | item = {name: item, url: item} |
| 148 | } | 150 | } |
| 149 | item.uid = item.uid || new Date().getTime() + temp++ | 151 | item.uid = item.uid || new Date().getTime() + temp++ |
| 150 | return item | 152 | return item |
| ... | @@ -154,7 +156,7 @@ watch( | ... | @@ -154,7 +156,7 @@ watch( |
| 154 | return [] | 156 | return [] |
| 155 | } | 157 | } |
| 156 | }, | 158 | }, |
| 157 | { deep: true, immediate: true } | 159 | {deep: true, immediate: true} |
| 158 | ) | 160 | ) |
| 159 | 161 | ||
| 160 | // 上传前校检格式和大小 | 162 | // 上传前校检格式和大小 |
| ... | @@ -166,7 +168,9 @@ function handleBeforeUpload(file) { | ... | @@ -166,7 +168,9 @@ function handleBeforeUpload(file) { |
| 166 | const isTypeOk = props.fileType.indexOf(fileExt) >= 0 | 168 | const isTypeOk = props.fileType.indexOf(fileExt) >= 0 |
| 167 | if (!isTypeOk) { | 169 | if (!isTypeOk) { |
| 168 | proxy.$modal.msgError( | 170 | proxy.$modal.msgError( |
| 169 | `文件格式不正确, 请上传${props.fileType.join('/')}格式文件!` | 171 | language.value == '0' |
| 172 | ? `文件格式不正确, 请上传${props.fileType.join('/')}格式文件!` | ||
| 173 | : `File format error, please upload ${props.fileType.join('/')} format file!` | ||
| 170 | ) | 174 | ) |
| 171 | return false | 175 | return false |
| 172 | } | 176 | } |
| ... | @@ -175,29 +179,40 @@ function handleBeforeUpload(file) { | ... | @@ -175,29 +179,40 @@ function handleBeforeUpload(file) { |
| 175 | if (props.fileSize) { | 179 | if (props.fileSize) { |
| 176 | const isLt = file.size / 1024 / 1024 < props.fileSize | 180 | const isLt = file.size / 1024 / 1024 < props.fileSize |
| 177 | if (!isLt) { | 181 | if (!isLt) { |
| 178 | proxy.$modal.msgError(`上传文件大小不能超过 ${props.fileSize} MB!`) | 182 | proxy.$modal.msgError(language.value == 0 |
| 183 | ? `上传文件大小不能超过 ${props.fileSize} MB!` | ||
| 184 | : `The file size cannot exceed ${props.fileSize} MB!`) | ||
| 179 | return false | 185 | return false |
| 180 | } | 186 | } |
| 181 | } | 187 | } |
| 182 | proxy.$modal.loading('正在上传文件,请稍候...') | 188 | proxy.$modal.loading(language.value == 0 |
| 189 | ? '正在上传文件,请稍候...' | ||
| 190 | : 'Uploading file, please wait...' | ||
| 191 | ) | ||
| 183 | number.value++ | 192 | number.value++ |
| 184 | return true | 193 | return true |
| 185 | } | 194 | } |
| 195 | |||
| 186 | // 文件个数超出 | 196 | // 文件个数超出 |
| 187 | function handleExceed() { | 197 | function handleExceed() { |
| 188 | proxy.$modal.msgError(language=='0'?`上传文件数量不能超过 ${props.limit} 个!`:`Maximum file count: ${props.limit}`) | 198 | proxy.$modal.msgError(language == '0' |
| 199 | ? `上传文件数量不能超过 ${props.limit} 个!` | ||
| 200 | : `Maximum file count: ${props.limit}`) | ||
| 189 | } | 201 | } |
| 190 | 202 | ||
| 191 | // 上传失败 | 203 | // 上传失败 |
| 192 | function handleUploadError(err) { | 204 | function handleUploadError(err) { |
| 193 | proxy.$modal.msgError('上传文件失败') | 205 | proxy.$modal.msgError(language.value == 0 |
| 206 | ? '上传文件失败' | ||
| 207 | : 'Upload failed' | ||
| 208 | ) | ||
| 194 | proxy.$modal.closeLoading() | 209 | proxy.$modal.closeLoading() |
| 195 | } | 210 | } |
| 196 | 211 | ||
| 197 | // 上传成功回调 | 212 | // 上传成功回调 |
| 198 | function handleUploadSuccess(res, file) { | 213 | function handleUploadSuccess(res, file) { |
| 199 | if (res.code === 200) { | 214 | if (res.code === 200) { |
| 200 | uploadList.value.push({ name: file.name, url: res.msg }) | 215 | uploadList.value.push({name: file.name, url: res.msg}) |
| 201 | uploadedSuccessfully() | 216 | uploadedSuccessfully() |
| 202 | } else { | 217 | } else { |
| 203 | number.value-- | 218 | number.value-- |
| ... | @@ -247,18 +262,22 @@ function listToString(list, separator) { | ... | @@ -247,18 +262,22 @@ function listToString(list, separator) { |
| 247 | .upload-file-uploader { | 262 | .upload-file-uploader { |
| 248 | margin-bottom: 5px; | 263 | margin-bottom: 5px; |
| 249 | } | 264 | } |
| 265 | |||
| 250 | .upload-file-list .el-upload-list__item { | 266 | .upload-file-list .el-upload-list__item { |
| 251 | border: 1px solid #e4e7ed; | 267 | border: 1px solid #e4e7ed; |
| 252 | line-height: 2;padding: 0 10px; | 268 | line-height: 2; |
| 269 | padding: 0 10px; | ||
| 253 | margin-bottom: 10px; | 270 | margin-bottom: 10px; |
| 254 | position: relative; | 271 | position: relative; |
| 255 | } | 272 | } |
| 273 | |||
| 256 | .upload-file-list .ele-upload-list__item-content { | 274 | .upload-file-list .ele-upload-list__item-content { |
| 257 | display: flex; | 275 | display: flex; |
| 258 | justify-content: space-between; | 276 | justify-content: space-between; |
| 259 | align-items: center; | 277 | align-items: center; |
| 260 | color: inherit; | 278 | color: inherit; |
| 261 | } | 279 | } |
| 280 | |||
| 262 | .ele-upload-list__item-content-action .el-link { | 281 | .ele-upload-list__item-content-action .el-link { |
| 263 | margin-right: 10px; | 282 | margin-right: 10px; |
| 264 | } | 283 | } | ... | ... |
| ... | @@ -334,6 +334,7 @@ const {proxy} = getCurrentInstance() | ... | @@ -334,6 +334,7 @@ const {proxy} = getCurrentInstance() |
| 334 | const language = useStorage('language', 0) | 334 | const language = useStorage('language', 0) |
| 335 | const form = ref({ | 335 | const form = ref({ |
| 336 | gender: '0', | 336 | gender: '0', |
| 337 | chinese:'0', | ||
| 337 | cptVisaInfoBos: [], | 338 | cptVisaInfoBos: [], |
| 338 | email: user?.email, | 339 | email: user?.email, |
| 339 | }) | 340 | }) |
| ... | @@ -362,9 +363,14 @@ const open = (params) => { | ... | @@ -362,9 +363,14 @@ const open = (params) => { |
| 362 | if (!cptId.value) { | 363 | if (!cptId.value) { |
| 363 | proxy.$modal.msgError('参数有误'); | 364 | proxy.$modal.msgError('参数有误'); |
| 364 | } | 365 | } |
| 365 | 366 | form.value = { | |
| 366 | form.value.userId = user.userId | 367 | gender: '0', |
| 367 | form.value.cptId = params.cptId | 368 | chinese:'0', |
| 369 | cptVisaInfoBos: [], | ||
| 370 | email: user?.email, | ||
| 371 | userId: user?.userId, | ||
| 372 | cptId: params.cptId | ||
| 373 | } | ||
| 368 | getCountryList() | 374 | getCountryList() |
| 369 | getMNAList() | 375 | getMNAList() |
| 370 | // getVisa() | 376 | // getVisa() | ... | ... |
-
Please register or sign in to post a comment