agilebuilder-ui 1.1.65-tmp8 → 1.1.65-tmp9

package/packages/fs-upload/src/fs-upload-multi.vue

@@ -1,464 +0,0 @@
-<template>
-	<div v-loading="loading">
-		<el-button
-				v-if="isShowButton && !disabled"
-				:icon="ElIconUpload2"
-				size="default"
-				type="primary"
-				@click="selectDataFile"
-		>
-			{{ $t('fsUpload.upload') }}
-		</el-button>
-		<input
-				ref="uploadTemplate"
-				:accept="accepts"
-				name="uploadTemplate"
-				style="display: none"
-				type="file"
-				@change="upload"
-		/>
-		<div v-if="unifiedEnclosures && unifiedEnclosures.length > 0 && isShowData">
-			<div v-if="isImg">
-				<el-table
-						:data="unifiedEnclosures"
-						:height="tableHeight"
-						style="width: 100%"
-				>
-					<el-table-column :label="$t('fsUpload.name')" width="240">
-						<template v-slot="scope">
-							<el-link
-									:href="
-                  baseURL +
-                  '/common/fs-upload/download?serverPath=' +
-                  scope.row.uuid +
-                  '&showName=' +
-                  scope.row.fileName
-                "
-									type="primary"
-							>
-								{{ scope.row.fileName }}
-							</el-link>
-						</template>
-					</el-table-column>
-					<el-table-column :label="$t('fsUpload.picture')" width="240">
-						<template v-slot="scope">
-							<el-image
-									:preview-src-list="[
-                  baseURL +
-                    '/common/fs-upload/download?serverPath=' +
-                    scope.row.uuid +
-                    '&showName=' +
-                    scope.row.fileName,
-                ]"
-									:src="
-                  baseURL +
-                  '/common/fs-upload/download?serverPath=' +
-                  scope.row.uuid +
-                  '&showName=' +
-                  scope.row.fileName
-                "
-									@click="bigPicture(scope.$index)"
-							/>
-						</template>
-					</el-table-column>
-					<el-table-column
-							v-if="!disabled"
-							:label="$t('fsUpload.operating')"
-							width="120"
-					>
-						<template v-slot="scope">
-							<el-button
-									size="default"
-									type="danger"
-									@click="deleteFile(scope.$index)"
-							>
-								{{ $t('fsUpload.delete') }}
-							</el-button>
-						</template>
-					</el-table-column>
-				</el-table>
-			</div>
-			<div v-else-if="isShowList">
-				<el-table
-						:data="unifiedEnclosures"
-						:height="tableHeight"
-						style="width: 100%"
-				>
-					<el-table-column :label="$t('fsUpload.name')" width="240">
-						<template v-slot="scope">
-							<el-link
-									:href="
-                  baseURL +
-                  '/common/fs-upload/download?serverPath=' +
-                  scope.row.uuid +
-                  '&showName=' +
-                  scope.row.fileName
-                "
-									type="primary"
-							>
-								{{ scope.row.fileName }}
-							</el-link>
-						</template>
-					</el-table-column>
-					<el-table-column :label="$t('fsUpload.operating')" width="200">
-						<template v-slot="scope">
-							<el-button
-									v-if="!disabled"
-									size="default"
-									type="danger"
-									@click="deleteFile(scope.$index)"
-							>
-								{{ $t('fsUpload.delete') }}
-							</el-button>
-							<el-button size="default" @click="preview(scope.row)">
-								{{ $t('fsUpload.preview') }}
-							</el-button>
-						</template>
-					</el-table-column>
-				</el-table>
-			</div>
-			<div v-else>
-				<div v-for="(item, index) in unifiedEnclosures" :key="index">
-					<el-link
-							:href="
-              baseURL +
-              '/common/fs-upload/download?serverPath=' +
-              item.uuid +
-              '&showName=' +
-              item.fileName
-            "
-							type="primary"
-					>
-						{{ item.fileName }}
-					</el-link>
-					<el-tooltip :content="$t('fsUpload.delete')" effect="light">
-						<el-icon v-if="!disabled" style="color: red; margin-left: 10px" @click="deleteFile(index)"
-						>
-							<el-icon-delete
-							/>
-						</el-icon>
-					</el-tooltip>
-					<el-tooltip
-							:content="$t('fsUpload.preview')"
-							effect="light"
-							style="margin-left: 10px"
-					>
-						<el-icon @click="preview(item)">
-							<el-icon-view/>
-						</el-icon>
-					</el-tooltip>
-				</div>
-			</div>
-		</div>
-		<see-big-picture
-				v-if="bigPictureVisible"
-				:show-index="showIndex"
-				:unified-enclosures="unifiedEnclosures"
-				@close="bigPictureVisible = false"
-		/>
-	</div>
-</template>
-
-<script>
-import {
-	Delete as ElIconDelete,
-	View as ElIconView,
-	Upload as ElIconUpload2,
-} from '@element-plus/icons-vue'
-import {$on, $off, $once, $emit} from '../../utils/gogocodeTransfer'
-import * as Vue from 'vue'
-import seeBigPicture from './see-big-picture.vue'
-import {getToken} from '../../../src/utils/auth'
-import {
-	isPlateSys,
-	getSystemFrontendUrlWith,
-  getRelativeBaseUrl,
-  getKkFilePreviewUrl,
-} from '../../../src//utils//common-util.js'
-
-export default {
-	data() {
-		return {
-			unifiedEnclosures: [],
-			bigPictureVisible: false,
-			baseURL: '',
-			accepts: '',
-			showIndex: 0,
-			loading: '',
-			ElIconUpload2,
-		}
-	},
-	components: {
-		seeBigPicture,
-		ElIconDelete,
-		ElIconView,
-	},
-	name: 'FsUploadMulti',
-	props: {
-		/**
-		 * 系统编码
-		 */
-		systemCode: {
-			type: String,
-			default: null,
-		},
-		/**
-		 * 上传限制的类型
-		 */
-		accept: {
-			type: String,
-			default: null,
-		},
-		/**
-		 * 是否是图片
-		 */
-		isImg: {
-			type: Boolean,
-			default: false,
-		},
-		/**
-		 * 针对多选情况
-		 * 是否显示拼接字符串
-		 * 如果未选择，直接显示表单
-		 */
-		isShowList: {
-			type: Boolean,
-			default: true,
-		},
-		/**
-		 * 针对图片类型
-		 * 具体参考element-ui中的图片参数fit属性
-		 */
-		fit: {
-			type: String,
-			default: null,
-		},
-		/**
-		 * 禁止编辑
-		 */
-		disabled: {
-			type: Boolean,
-			default: false,
-		},
-		/**
-		 * 是否显示按钮
-		 */
-		isShowButton: {
-			type: Boolean,
-			default: true,
-		},
-		/**
-		 * 是否显示数据
-		 */
-		isShowData: {
-			type: Boolean,
-			default: true,
-		},
-		/**
-		 * 回传数据
-		 */
-		data: {
-			type: Array,
-			default: null,
-		},
-		/** 图片显示数量 */
-		imgSize: {
-			type: Number,
-			default: 0,
-		},
-		/** 设置附件的上传数量 */
-		fileSize: {
-			type: Number,
-			default: 0,
-		},
-		/** 设置table高度 */
-		tableHeight: {
-			type: String,
-			default: null,
-		},
-	},
-	created() {
-		this.baseURL = getRelativeBaseUrl(window.$vueApp.config.globalProperties.baseURL)
-		if (this.data) {
-			this.unifiedEnclosures = this.data
-		}
-		this.judgeImg()
-	},
-	methods: {
-		// 预览图片
-		bigPicture(index) {
-			this.showIndex = index
-			this.bigPictureVisible = true
-		},
-		// 成功后返回数据
-		onSuccess() {
-			const data = this.unifiedEnclosures
-			$emit(this, 'onSuccess', data)
-		},
-		// 判断是否是图片格式，如果是限制只能上传图片
-		judgeImg() {
-			if (this.isImg) {
-				this.accepts = 'image/*'
-			} else {
-				if (this.accept) {
-					this.accepts = this.accept
-				}
-			}
-		},
-		selectDataFile() {
-			this.$refs.uploadTemplate.click()
-		},
-		deleteFile(index) {
-			this.deleteUuid = this.unifiedEnclosures[index].uuid
-			this.unifiedEnclosures.splice(index, 1)
-			this.deleteSuccess()
-		},
-		deleteSuccess() {
-			const data = this.unifiedEnclosures
-			$emit(this, 'deleteSuccess', this.deleteUuid, data)
-		},
-		// 预览
-		preview(row) {
-			if (window.$vueApp.config.globalProperties.isOffice) {
-				const jwt = getToken()
-				const map = {
-					fileName:
-							window.$vueApp.config.globalProperties.officeweb365Url +
-							'/common/fs-upload/download?serverPath=' +
-							row.uuid +
-							'&showName=' +
-							row.fileName +
-							'&jwt=' +
-							jwt,
-				}
-				const http = this.$http
-				http
-						.post(
-								this.baseURL +
-								'/common/fs-upload/des-encrypt',
-								map
-						)
-						.then((data) => {
-							window.open(window.$vueApp.config.globalProperties.isOffice + data)
-						})
-			} else {
-				let showName
-				const split = row.fileName.split('.')
-				if (
-						split[split.length - 1].toLowerCase() === 'xls' ||
-						split[split.length - 1].toLowerCase() === 'xlsx' ||
-						split[split.length - 1].toLowerCase() === 'csv'
-				) {
-					showName = split[0] + '.html'
-				} else {
-					showName = split[0] + '.pdf'
-				}
-				const token = getToken()
-				if (window.$vueApp.config.globalProperties.customPreviewUrl) {
-					window.open(
-							getSystemFrontendUrlWith(
-									window.$vueApp.config.globalProperties.portalUrl
-							) +
-							'/#/file-service/preview?serverPath=' +
-							row.uuid +
-							'&showName=' +
-							encodeURI(row.fileName),
-							showName
-					)
-				} else {
-					const myShowName = row.fileName
-					const uuid = row.uuid
-					let baseUrl = this.baseURL
-					if (isPlateSys(window.$vueApp.config.globalProperties.systemCode)) {
-						baseUrl = window.$vueApp.config.globalProperties.baseAPI
-					}
-					let previewUrl
-					if (window.$vueApp.config.globalProperties.kkFileViewUrl) {
-						const originUrl = baseUrl + '/common/super-form/downloads?jwt=' + token+
-							'&showName=' +
-							encodeURI(myShowName) +
-							'&serverPath=' +
-							uuid
-						//要预览文件的访问地址
-						const myPreviewUrl = originUrl + '&fullfilename='+myShowName
-						// http://127.0.0.1:8012/onlinePreview
-						getKkFilePreviewUrl(myPreviewUrl).then(url=>{
-							window.open(url, showName)
-						})
-						// previewUrl = window.$vueApp.config.globalProperties.kkFileViewUrl+'?url='+encodeURIComponent(Base64.encode(myPreviewUrl))
-					} else {
-						previewUrl =
-						baseUrl +
-						'/common/fs-upload/preview?jwt=' +
-						token
-						previewUrl = previewUrl +
-							'&showName=' +
-							encodeURI(myShowName) +
-							'&serverPath=' +
-							uuid
-						previewUrl = getRelativeBaseUrl(previewUrl)
-						window.open(previewUrl, showName)
-					}
-				}
-			}
-		},
-		// 上传
-		upload(params) {
-			let message
-			if (this.fileSize) {
-				if (
-						this.fileSize !== 0 &&
-						this.unifiedEnclosures.length >= this.fileSize
-				) {
-					message =
-							this.$t('fsUpload.theNumberOfUploadsExceedsTheLimitTheLimitIs') +
-							'：' +
-							this.fileSize
-				}
-			}
-
-			if (!message) {
-				this.loading = true
-				const param = new FormData()
-				param.append('file', this.$refs.uploadTemplate.files[0])
-				const http = this.$http
-				http.headers = "'Content-Type': 'multipart/form-data'"
-				http
-						.post(
-								this.baseURL +
-								'/common/fs-upload/upload-template/' +
-								this.systemCode,
-								param,
-								{headers: {'Content-Type': 'multipart/form-data'}}
-						)
-						.then((data) => {
-							this.unifiedEnclosures.push(data)
-							params.target.value = ''
-							console.log('data', data)
-							this.judgeImg()
-							console.log(' this.unifiedEnclosures', this.unifiedEnclosures)
-							this.onSuccess()
-							this.$message({
-								showClose: true,
-								type: 'success',
-								message: this.$t('fsUpload.uploadSucceeded'),
-							})
-							this.loading = false
-						})
-						.catch(() => {
-							params.target.value = ''
-							this.loading = false
-						})
-			} else {
-				params.target.value = ''
-				this.$message({
-					showClose: true,
-					type: 'warning',
-					message: message,
-				})
-			}
-		},
-	},
-	emits: ['onSuccess', 'deleteSuccess'],
-}
-</script>