src/views/carousel/index.vue

@@ -91,8 +91,7 @@
 							<el-icon><Plus /></el-icon>
 							<template #file="{ file }">
 							<div>
-								<img class="el-upload-list__item-thumbnail" :src="encodeURI(file.url.includes('http') ? 
+								<img class="el-upload-list__item-thumbnail" :src="encodeURI(file.url)" alt="" />
-								file.url : viteUrl+file.url)" alt="" />
 								<span class="el-upload-list__item-actions">
 								<span
 									class="el-upload-list__item-preview"
@@ -203,7 +202,7 @@ const getTableData = async() => {
 	try {
 		state.tableData.loading = true;
 		let res = await banApi.getBannerList(state.tableData.param);
-		// console.log(res);
+		console.log(res);
 		if(res?.success){
 			state.tableData.data = res.data.records;
 			state.tableData.total = res.data.total;
@@ -233,9 +232,13 @@ const viteUrl = import.meta.env.VITE_API_URL;
 
 // 图片链接格式化
 const jpgFormatter = (row: any) => {
-	let newPath = row?.data ? row.data.path : row.path;
+	let newPath;
-	newPath = encodeURI( newPath.includes('http') ? newPath : (viteUrl + newPath));
+	if (row?.data) {
-	
+		newPath = row.data.path.replaceAll('\\', '/')	
+	} else {
+		newPath = row.path.replaceAll('\\\\', '/')		
+	}
+	newPath = newPath.includes('http://localhost:8888/') ? newPath : encodeURI(viteUrl + newPath)
   	return `${newPath}`;
 };
 
@@ -275,21 +278,22 @@ const uploadDisabled = ref(false)
 
 
 const switchDrawer = async (id: number, staus) => {
-	// console.log("switchDrawer",id,state.formData,state.formData.fileList);
+	console.log("switchDrawer",id,state.formData,state.formData.fileList);
 	dialog.value = true;
 	if (staus == 1) {
 		flag.value = false;
 		state.formData.loading = true;
 		let res = await banApi.getBannerDetail(id)
-		// console.log("res",res.data.path);
+		console.log("res",res.data.path);
 		if (res?.success) {
-			state.formData.fileList.push({ url: res.data.path });
+			state.formData.fileList.push({ url: jpgFormatter(res.data) });
 			// console.log("state.formData.fileList",state.formData);
 			Object.assign(state.formData, res.data);
 			// console.log("state.formData",state.formData);
+			state.formData.path = jpgFormatter(res.data);
 			uploadDisabled.value = true;
 			state.formData.loading = false;
-			// console.log("state.formData",state.formData);
+			console.log("state.formData",state.formData);
 		} else {
 			ElMessage.error('获取轮播图详情失败！')
 			state.formData.loading = false;
@@ -311,8 +315,8 @@ const handleChange: UploadProps['onChange'] = async (file: uploadFile, uploadFil
 			const formdata = new FormData();
 			formdata.append('file', file.raw);
 			let res = await banApi.uploadFile(formdata);
-			// console.log("result", res);
+			console.log("result", res);
-			// console.log("state.formData", state.formData);
+			console.log("state.formData", state.formData);
 			if(res?.success){
 				// state.formData.url = jpgFormatter(res);
 				state.formData.path = res.data.path;
@@ -334,9 +338,9 @@ const handleChange: UploadProps['onChange'] = async (file: uploadFile, uploadFil
 		ElMessageBox.alert('轮播图的格式不正确，请重新选择！', '提示', {
 			confirmButtonText: '确定',
 		})
-		// console.log("handleChange3",uploadFiles);
+		console.log("handleChange3",uploadFiles);
 		uploadFiles.pop()
-		// console.log("handleChange4",uploadFiles);
+		console.log("handleChange4",uploadFiles);
 		uploadDisabled.value = false;
 	}
 }
@@ -345,20 +349,24 @@ const dialogImageUrl = ref('')
 const dialogVisible = ref(false)
 
 const handlePictureCardPreview = (file: UploadFile,uploadFiles) => {
-  dialogImageUrl.value = encodeURI(file.url.includes('http') ? file.url : viteUrl+file.url);
+  dialogImageUrl.value = file.url!
   dialogVisible.value = true
 }
 
 const uploadRef = ref();
 
 const handleRemove = (file: UploadFile, uploadFiles) => {
+	console.log("handleRemove1",file);
+	console.log("handleRemove2",uploadFiles);
 	uploadRef.value.clearFiles();
 	state.formData.path = "";
+	console.log("handleRemove3",uploadFiles);
 	uploadDisabled.value = false;
 
 }
 // 删除轮播图
 const deleteBanner = (id: number) => {
+	console.log("删除",id);
 	ElMessageBox.confirm('确定要删除该轮播图吗?', '提示', {
 		confirmButtonText: '确定',
 		cancelButtonText: '取消',
@@ -388,10 +396,13 @@ const submitForm = (decision) => {
 	ruleFormRef.value?.validate(async(valid: boolean) => {
 		if (valid) {
 			if (decision) {
+				console.log("新增新增新增");
 				loading.value = true;
 				const form = { ...state.formData };
+				console.log('submitForm', form);
 				try {
 					let res = await banApi.addBanner(form);
+					console.log("submitFormREs", res);
 					if(res?.success){
 						ElMessage({
 							message: '保存成功！',
@@ -402,13 +413,17 @@ const submitForm = (decision) => {
 						dialog.value = false;
 					}
 				} catch (error) {
+					console.log(error);
 					ElMessage.error('保存失败！');
 					loading.value = false;
 				}
 			} else {
+				console.log("编辑编辑编辑");
 				const form = { ...state.formData };
+				console.log('submitForm', form);
 				try {
 					let res = await banApi.updateBanner(form);
+					console.log("submitFormREs", res);
 					if(res?.success){
 						ElMessage({
 							message: '保存成功！',
@@ -444,6 +459,8 @@ const resetForm = () => {
 const cancelForm = () => {
 	dialog.value = false;
 	resetForm();
+	console.log(state);
+	
 }
 // #endregion