<template>
	<!-- 公共图片上传 h5+微信小程序（无压缩版）-->
	<view class="uploadImage">
		<uni-file-picker v-model="fileList" fileMediatype="image" mode="grid" :limit="limit" @select="uploadStart" @delete="deleteImg" :sizeType="['compressed']" />
	</view>
</template>

<script setup>
import { onMounted, ref } from 'vue';
import { sysUpload } from '@/utils/homeApi.js';

// baseUrl设置
let baseUrl = '';
/* #ifdef MP-WEIXIN */
// baseUrl = 'http://192.168.20.162:7200'; //谢斌斌
baseUrl = 'https://server1.wh-nf.cn:8131/prod-api'; //公司环境
/* #endif */
/* #ifdef H5 */
baseUrl = '';
/* #endif */

const fileList = ref([]);
const props = defineProps({
	// 图片数组值
	saveFileArr: {
		type: Array,
		default: () => []
	},
	// 图片数量限制
	limit: {
		type: Number,
		default: 3
	},
	// 关联类型和字段
	refField: {
		type: String,
		default: 'picXG'
	},
	refType: {
		type: String,
		default: 'picXG'
	}
});

// 文件上传
async function uploadStart(e) {
	console.log(e.tempFiles[0]);
	uni.showLoading({
		title: '正在上传',
		mask: true
	});
	uni.uploadFile({
		url: baseUrl + '/system/upload',
		filePath: e.tempFiles[0].path,
		name: 'file',
		success(res) {
			let dataRes = JSON.parse(res.data);
			if (dataRes.code == 200) {
				uni.hideLoading();
				let datas = dataRes.data;
				datas.refField = props.refField; //关联字段
				datas.refType = props.refType; //关联类型
				fileList.value.push(datas);
				props.saveFileArr.push(datas);
			} else {
				uni.showToast({
					icon: 'none',
					title: '上传失败,请重新上传'
				});
			}
		}
	});
}

// 文件删除
function deleteImg(e) {
	console.log(e.tempFile.name);
	let fileIndex = null;
	fileList.value.map((item, index) => {
		if (e.tempFile.name == item.originalName) {
			fileIndex = index;
		}
	});
	fileList.value.splice(fileIndex, 1);
	props.saveFileArr.splice(fileIndex, 1);
}

// 清空图片
function clearImages() {
	fileList.value = [];
	props.saveFileArr = [];
}
defineExpose({
	clearImages
});
</script>

<style lang="scss">
.uploadImage {
	height: 250rpx;
}
</style>