提交 8f485294 authored 作者: 龙菲's avatar 龙菲

修复展览编辑过程中出现的问题

上级 0d8b179b
...@@ -82,4 +82,10 @@ export const displayTabletitle = [{ ...@@ -82,4 +82,10 @@ export const displayTabletitle = [{
columnAlign: 'center', columnAlign: 'center',
isVideos: true isVideos: true
}, },
{
prop: "exhibitionUnits",
label: "展览单元",
columnAlign: 'center',
isVideos: true
},
] ]
\ No newline at end of file
...@@ -8,94 +8,72 @@ ...@@ -8,94 +8,72 @@
v-for="(item, index) in displayTabletitle" v-for="(item, index) in displayTabletitle"
:key="index" :key="index"
> >
<div v-if="item.prop == 'intro'"> <RichTextShow
<span v-if="info['intro']">{{ info["intro"] }}</span> :richText="info['intro']"
<span v-else></span> v-if="hasProp(item, 'intro')"
</div> />
<!-- 展览类型 --> <!-- 展览类型 -->
<div v-else-if="item.prop === 'type'"> <DictText
<DictText v-else-if="hasProp(item, 'type')"
name="displayType" name="displayType"
:dictValue="info['type']" :dictValue="info['type']"
v-if="info['type']" />
/>
<span v-else></span>
</div>
<!-- 模板主题 --> <!-- 模板主题 -->
<div v-else-if="item.prop == 'themeType'"> <div v-else-if="hasProp(item, 'themeType')">
<span v-if="info['themeType']">{{ {{ $constantsTool.getLabelByValue("themeType", info["themeType"]) }}
$constantsTool.getLabelByValue("themeType", info["themeType"])
}}</span>
<span v-else></span>
</div>
<div v-else-if="item.prop == 'faceImagePressUrl'">
<el-image
v-if="info['faceImagePressUrl']"
class="image"
:src="info['faceImagePressUrl']"
fit="contain"
:preview-src-list="[info['faceImageUrl']]"
>
</el-image>
<span v-else></span>
</div> </div>
<!-- 封面 -->
<div v-else-if="item.prop == 'imagesVo'"> <el-image
<div v-if="info['imagesVo'].length > 0"> v-else-if="hasProp(item, 'faceImagePressUrl')"
class="face-image"
:src="info['faceImagePressUrl']"
fit="contain"
:preview-src-list="[info['faceImageUrl']]"
>
</el-image>
<!-- 图片 -->
<el-row :gutter="10" v-else-if="hasProp(item, 'imagesVo')">
<el-col :span="4" v-for="(v, i) in info['imagesVo']">
<el-image <el-image
v-for="(v, i) in info['imagesVo']" fit="contain"
:key="i"
class="image" class="image"
:src="v.pressUrl" :src="v.pressUrl"
fit="contain"
:preview-src-list="imgsList" :preview-src-list="imgsList"
> ></el-image>
</el-image> </el-col>
</div> </el-row>
<span v-else></span> <!-- 视频 -->
</div> <el-row :gutter="10" v-else-if="hasProp(item, 'videosVo')">
<div v-else-if="item.prop == 'videosVo'"> <el-col :span="4" v-for="(v, i) in info['videosVo']">
<div v-if="info['videosVo'].length > 0"> <VideoPlayer class="video" :key="i" :src="v.url" />
<VideoPlayer </el-col>
class="video" </el-row>
v-for="(v, i) in info['videosVo']" <!-- 音频 -->
:key="i" <el-row :gutter="10" v-else-if="hasProp(item, 'audiosVo')">
:src="v.url" <el-col :span="4" v-for="(v, i) in info['audiosVo']">
/> <AudioPlayer :key="i" :url="v.url" ref="AudioPlayer" />
</div> </el-col>
<span v-else></span> </el-row>
</div> <!-- 文献 -->
<div v-else-if="item.prop == 'audiosVo'"> <el-table
<div v-if="info['audiosVo'].length > 0"> stripe
<AudioPlayer border
v-for="(v, i) in info['audiosVo']" :data="info['literatureVo']"
:key="i" v-else-if="hasProp(item, 'literatureVo')"
:url="v.url" >
ref="AudioPlayer" <el-table-column prop="name" label="名称"></el-table-column>
/> <el-table-column prop="authors" label="作者"></el-table-column>
</div> <el-table-column prop="source" label="来源"></el-table-column>
<span v-else></span> </el-table>
</div> <!-- 展览单元 -->
<div v-else-if="item.prop == 'literatureVo'"> <ExhibitionPreview
<div v-if="info['literatureVo'].length > 0"> v-else-if="hasProp(item, 'exhibitionUnits')"
<el-table stripe border :data="info['literatureVo']"> :data="info['exhibitionUnits']"
<el-table-column prop="name" label="名称"></el-table-column> />
<el-table-column prop="authors" label="作者"></el-table-column> <span v-else-if="info[item.prop] && info[item.prop].length == 0"
<el-table-column prop="source" label="来源"></el-table-column> ></span
<!-- <el-table-column prop="source" label="操作"> >
<template slot-scope="scope"> <span v-else>{{ info[item.prop] }}</span>
<el-button type="text">预览</el-button>
</template>
</el-table-column> -->
</el-table>
</div>
<span v-else>暂无文献</span>
</div>
<RichTextShow
v-else-if="item.prop === 'intro'"
:richText="info['intro']"
></RichTextShow>
<span v-else>{{ info[item.prop] || "无" }}</span>
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
</el-card> </el-card>
...@@ -107,10 +85,12 @@ ...@@ -107,10 +85,12 @@
import { displayTabletitle } from "./config"; import { displayTabletitle } from "./config";
import VideoPlayer from "@/components/VideoPlayer"; import VideoPlayer from "@/components/VideoPlayer";
import AudioPlayer from "@/components/AudioPlayer"; import AudioPlayer from "@/components/AudioPlayer";
import ExhibitionPreview from "@/components/ExhibitionPreview";
export default { export default {
components: { components: {
VideoPlayer, VideoPlayer,
AudioPlayer, AudioPlayer,
ExhibitionPreview,
}, },
props: { props: {
info: { info: {
...@@ -131,6 +111,15 @@ export default { ...@@ -131,6 +111,15 @@ export default {
displayTabletitle, displayTabletitle,
}; };
}, },
methods: {
hasProp(item, key) {
if (this.info[key] instanceof Array) {
return item.prop == key && this.info[key] && this.info[key].length > 0;
} else {
return item.prop == key && this.info[key];
}
},
},
}; };
</script> </script>
...@@ -143,17 +132,23 @@ export default { ...@@ -143,17 +132,23 @@ export default {
flex: 1; flex: 1;
} }
.face-image,
.image { .image {
margin-right: 20px;
width: 200px;
height: 200px; height: 200px;
border: 1px solid #dadada; border: 1px solid #dadada;
border-radius: 4px; border-radius: 4px;
} }
.face-image {
width: 200px;
}
.image {
width: 100%;
}
.video { .video {
width: 400px; width: 400px;
height: 400px; height: 400px;
border: 1px solid #dadada; border: 1px solid #dadada;
border-radius: 4px; border-radius: 8px;
} }
</style> </style>
<template>
<el-collapse-item :title="item.title" :name="item.euId">
<el-card>
<h3>{{ item.title }}</h3>
<el-form-item label="文字介绍:">
<div class="intro">
<RichTextShow :richText="item.intro"></RichTextShow>
</div>
</el-form-item>
<div
class="crId"
v-if="item.culturalRelics && item.culturalRelics.length > 0"
>
<el-form-item label="相关文物:">
<el-row :gutter="10">
<el-col :span="4" v-for="(v, i) in item.culturalRelics">
<el-image fit="contain" :src="v.faceImagePressUrl"></el-image>
</el-col>
</el-row>
</el-form-item>
</div>
<div class="images" v-if="item.imagesVo && item.imagesVo.length > 0">
<el-form-item label="相关图片:">
<el-row :gutter="10">
<el-col :span="4" v-for="(v, i) in item.imagesVo">
<el-image fit="contain" :src="v.middleUrl"></el-image>
</el-col>
</el-row>
</el-form-item>
</div>
</el-card>
</el-collapse-item>
</template>
<script>
export default {
name: "CollapsItem",
props: {
item: {
default: () => ({}),
type: Object,
},
},
mounted() {},
methods: {},
};
</script>
<style scoped lang="scss">
::v-deep .el-image {
width: 100%;
height: 200px;
border: 1px solid #dadada;
border-radius: 8px;
}
</style>
<template>
<div v-if="data && data.length > 0">
<el-collapse
v-model="activeNames"
v-for="(item, index) in data"
:key="index"
>
<el-form>
<el-collapse-item :title="item.title" :name="item.euId">
<el-card>
<h3>{{ item.title }}</h3>
<el-form-item label="文字介绍:">
<div class="intro">
<RichTextShow :richText="item.intro"></RichTextShow>
</div>
</el-form-item>
<div
class="crId"
v-if="item.culturalRelics && item.culturalRelics.length > 0"
>
<el-form-item label="相关文物:">
<el-row :gutter="10">
<el-col :span="4" v-for="(v, i) in item.culturalRelics">
<el-image
fit="contain"
:src="v.faceImagePressUrl"
></el-image>
</el-col>
</el-row>
</el-form-item>
</div>
<div
class="images"
v-if="item.imagesVo && item.imagesVo.length > 0"
>
<el-form-item label="相关图片:">
<el-row :gutter="10">
<el-col :span="4" v-for="(v, i) in item.imagesVo">
<el-image fit="contain" :src="v.middleUrl"></el-image>
</el-col>
</el-row>
</el-form-item>
</div>
</el-card>
</el-collapse-item>
<div class="indent20">
<ExhibitionPreview
v-for="(v, i) in item.children"
:key="i"
:data="item.children"
/>
</div>
</el-form>
</el-collapse>
</div>
</template>
<script>
export default {
name: "ExhibitionPreview",
props: {
data: {
type: Array,
default: () => [],
},
},
data() {
return {
activeNames: "",
};
},
mounted() {},
methods: {},
};
</script>
<style scoped lang="scss">
.indent20 {
padding-left: 20px;
}
</style>
...@@ -102,6 +102,9 @@ export default { ...@@ -102,6 +102,9 @@ export default {
immediate: true, immediate: true,
deep: true, deep: true,
}, },
fileList(value) {
console.log(444, value);
},
}, },
computed: { computed: {
// 是否显示提示 // 是否显示提示
...@@ -126,21 +129,22 @@ export default { ...@@ -126,21 +129,22 @@ export default {
// return this.fileList.length == this.fileLimit; // return this.fileList.length == this.fileLimit;
// }, // },
}, },
methods: { methods: {
getFiles() { getFiles() {
if ( const isImage = this.fileType.some((item) => {
this.fileType.indexOf("jpg") != -1 || return ["jpg", "jpeg", "png"].includes(item);
this.fileType.indexOf("jpeg") != -1 || });
this.fileType.indexOf("png") != -1 // 不能使用JSON.stringify及JSON.parse,因为有File对象
) { const tempList = [...this.fileList];
let tempList = [...this.fileList]; if (isImage) {
let newFileList = tempList.map((item) => { const newFileList = tempList.map((item) => {
if (item.status == "ready") { if (item.status == "ready") {
return item; return item;
} else { } else {
const { highImg, lowImg, name, fileId, status } = item; const { highImg, lowImg, name, fileId, status } = item;
const obj = { const obj = {
urL: highImg, url: highImg,
pressUrl: lowImg, pressUrl: lowImg,
name, name,
fileId, fileId,
...@@ -151,7 +155,7 @@ export default { ...@@ -151,7 +155,7 @@ export default {
}); });
return newFileList; return newFileList;
} else { } else {
return this.fileList; return tempList;
} }
}, },
// 上传前校检格式和大小 // 上传前校检格式和大小
...@@ -200,17 +204,14 @@ export default { ...@@ -200,17 +204,14 @@ export default {
// 文件列表移除文件时的钩子 // 文件列表移除文件时的钩子
handleRemove(file, fileList) { handleRemove(file, fileList) {
let that = this; // debugger;
const { status } = file; const { status } = file;
if (status == "success") { if (status == "success") {
this.removedIds.push(file.fileId); this.removedIds.push(file.fileId);
this.$emit("getRemovedIds", this.removedIds); this.$emit("getRemovedIds", this.removedIds);
} }
that.fileList.map(async (item, index) => { this.fileList = fileList;
if (item.uid === file.uid) { console.log(123, this.fileList);
that.fileList.splice(index, 1);
}
});
}, },
handleChange(file, fileList) { handleChange(file, fileList) {
......
...@@ -86,15 +86,12 @@ const bizTransform = { ...@@ -86,15 +86,12 @@ const bizTransform = {
* @returns {Boolean} 组件需要的布尔值 * @returns {Boolean} 组件需要的布尔值
*/ */
statusStrToBool(statusString) { statusStrToBool(statusString) {
if ( if (!statusString) {
!(
statusString &&
statusString instanceof String &&
statusString instanceof Number
)
) {
return; return;
} }
if (!statusString instanceof String) {
return statusString
}
const statusBoolean = Boolean(Number(statusString)); const statusBoolean = Boolean(Number(statusString));
return statusBoolean; return statusBoolean;
}, },
...@@ -109,8 +106,10 @@ const bizTransform = { ...@@ -109,8 +106,10 @@ const bizTransform = {
let deptIdArr = []; let deptIdArr = [];
if (deptId) { if (deptId) {
deptIdArr = [deptId]; deptIdArr = [deptId];
} else if (userInfo) { } else if (userInfo.deptId) {
deptIdArr = [userInfo.deptId]; deptIdArr = [userInfo.deptId];
} else {
return deptId
} }
return deptIdArr; return deptIdArr;
}, },
......
...@@ -49,6 +49,7 @@ const fileUploadFuctions = { ...@@ -49,6 +49,7 @@ const fileUploadFuctions = {
const currentFileList = fileUploadFuctions.getMediaFile($el, mediaKey); const currentFileList = fileUploadFuctions.getMediaFile($el, mediaKey);
currentFileList.forEach((file) => { currentFileList.forEach((file) => {
if (fileUploadFuctions.isFileRaw(file)) { if (fileUploadFuctions.isFileRaw(file)) {
console.log(' file.raw', file.raw);
formData.append(mediaKey, file.raw); formData.append(mediaKey, file.raw);
} }
}); });
......
...@@ -219,7 +219,7 @@ export default { ...@@ -219,7 +219,7 @@ export default {
imagesVo: [], imagesVo: [],
videosVo: [], videosVo: [],
currentData: {}, //当前点击的树节点 currentData: {}, //当前点击的树节点
// 富文本编辑器默认内容 removedIds: [],
}; };
}, },
methods: { methods: {
...@@ -382,8 +382,9 @@ export default { ...@@ -382,8 +382,9 @@ export default {
} }
}, },
getRemovedIds(removedIds) { getRemovedIds(removedIds) {
this.removedIds = [...new Set([...this.removedIds, ...removedIds])]; if (removedIds) {
console.log("this.removedIds", this.removedIds); this.removedIds = [...new Set([...this.removedIds, ...removedIds])];
}
}, },
}, },
}; };
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<div class="divider"></div> <div class="divider"></div>
<div class="label"> <div class="label">
{{ title }} {{ title }}
<span <!-- <span
v-if="dialogForm.exhibitionId" v-if="dialogForm.exhibitionId"
style="font-size: 12px; margin-left: 10px; font-weight: 500" style="font-size: 12px; margin-left: 10px; font-weight: 500"
> >
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
>点击左右切换按钮可切换展览。<span style="color: #f56c6c"> >点击左右切换按钮可切换展览。<span style="color: #f56c6c">
注意:切换前请注意保存当前展览信息 注意:切换前请注意保存当前展览信息
</span> </span>
</span> </span> -->
</div> </div>
</div> </div>
<div class="el-dialog-div"> <div class="el-dialog-div">
...@@ -335,7 +335,7 @@ ...@@ -335,7 +335,7 @@
</el-button> --> </el-button> -->
</div> </div>
</div> </div>
<el-tooltip <!-- <el-tooltip
class="item" class="item"
effect="dark" effect="dark"
content="下一展览" content="下一展览"
...@@ -362,7 +362,7 @@ ...@@ -362,7 +362,7 @@
> >
<i class="el-icon-arrow-left"></i> <i class="el-icon-arrow-left"></i>
</div> </div>
</el-tooltip> </el-tooltip> -->
</el-dialog> </el-dialog>
</template> </template>
...@@ -404,11 +404,7 @@ export default { ...@@ -404,11 +404,7 @@ export default {
computed: { computed: {
...mapGetters(["userInfo", "dicts"]), ...mapGetters(["userInfo", "dicts"]),
title() { title() {
if (this.dialogForm.exhibitionId) { return this.dialogForm.exhibitionId ? "修改信息" : "发布展览";
return "修改信息";
} else {
return "发布展览";
}
}, },
themeTypeOptions() { themeTypeOptions() {
return themeTypeOptions; return themeTypeOptions;
...@@ -426,20 +422,25 @@ export default { ...@@ -426,20 +422,25 @@ export default {
}, },
"dialogForm.themeType": { "dialogForm.themeType": {
handler: function (value) { handler: function (value) {
switch (value) { if (!value) {
case "2": return;
this.imagesAdvice = }
"中国风主题建议上传10张以上的展览图片,效果更好"; if (value == "2") {
break; this.imagesAdvice = "中国风主题建议上传10张以上的展览图片,效果更好";
default: } else {
this.imagesAdvice = ""; this.imagesAdvice = "";
break;
} }
}, },
}, },
currentId(value) { images: {
this.$emit("changeDisplay", value); handler: function (value) {
console.log(value);
},
deep: true,
}, },
// currentId(value) {
// this.$emit("changeDisplay", value);
// },
}, },
data() { data() {
return { return {
...@@ -516,10 +517,12 @@ export default { ...@@ -516,10 +517,12 @@ export default {
videosVo, videosVo,
audiosVo, audiosVo,
status, status,
literature,
literatureVo, literatureVo,
deptId, deptId,
exhibitionUnits, exhibitionUnits,
culturalRelicVo, culturalRelicVo,
crIds,
virtualVo, virtualVo,
} = this.dialogForm; } = this.dialogForm;
this.faceImage = faceImageToClient( this.faceImage = faceImageToClient(
...@@ -531,15 +534,22 @@ export default { ...@@ -531,15 +534,22 @@ export default {
this.videos = videosVo || []; this.videos = videosVo || [];
this.audios = audiosVo || []; this.audios = audiosVo || [];
this.crList = this.getClientCrList(culturalRelicVo); this.crList = this.getClientCrList(culturalRelicVo);
this.crIds = this.getClientCrIds(culturalRelicVo); this.crIds = this.getClientCrIds(crIds);
this.vrList = this.getClientVrList(virtualVo); this.vrList = this.getClientVrList(virtualVo);
this.vrIds = this.getClientVrIds(virtualVo); this.vrIds = this.getClientVrIds(virtualVo);
this.dialogForm.status = statusStrToBool(status); this.dialogForm.status = this.getClientStatus(status);
this.literatureIdArr = literatureListToIds(literatureVo); this.literatureIdArr = this.getClientLiteratureIds(literature);
this.literatureList = literatureVo;
this.dialogForm.deptId = getDeptIdArr(deptId, this.userInfo); this.dialogForm.deptId = getDeptIdArr(deptId, this.userInfo);
this.dialogForm.exhibitionUnits = this.getClientUnit(exhibitionUnits); this.dialogForm.exhibitionUnits = this.getClientUnit(exhibitionUnits);
} }
}, },
getClientStatus(status) {
if (status == undefined) {
return false;
}
return Boolean(Number(status));
},
// 获取前端需要的文物list // 获取前端需要的文物list
getClientCrList(culturalRelicVo) { getClientCrList(culturalRelicVo) {
if (!culturalRelicVo || culturalRelicVo.length == 0) { if (!culturalRelicVo || culturalRelicVo.length == 0) {
...@@ -548,16 +558,16 @@ export default { ...@@ -548,16 +558,16 @@ export default {
return culturalRelicVo; return culturalRelicVo;
}, },
// 获取前端需要的文物id合集 // 获取前端需要的文物id合集
getClientCrIds(culturalRelicVo) { getClientCrIds(crIds) {
if (!culturalRelicVo || culturalRelicVo.length == 0) { if (!crIds) {
return; return;
} }
const crIds = culturalRelicVo.map((item) => { if (crIds.includes(",")) {
return item.crId; return crIds.split(",");
}); } else {
return crIds; return [crIds];
}
}, },
// 获取前端需要的虚拟展list // 获取前端需要的虚拟展list
getClientVrList(virtualVo) { getClientVrList(virtualVo) {
if (!virtualVo || virtualVo.length == 0) { if (!virtualVo || virtualVo.length == 0) {
...@@ -575,6 +585,17 @@ export default { ...@@ -575,6 +585,17 @@ export default {
}); });
return vrIds; return vrIds;
}, },
getClientLiteratureIds(literature) {
if (!literature) {
return;
}
if (literature.includes(",")) {
return literature.split(",");
} else {
return [literature];
}
},
// 获取前端需要的布展单元 // 获取前端需要的布展单元
getClientUnit(exhibitionUnits) { getClientUnit(exhibitionUnits) {
function loopUnit(arr) { function loopUnit(arr) {
...@@ -646,6 +667,7 @@ export default { ...@@ -646,6 +667,7 @@ export default {
} }
}, 500); }, 500);
}, },
// 关联文物查询 // 关联文物查询
searchCR(queryString) { searchCR(queryString) {
let that = this; let that = this;
...@@ -682,7 +704,7 @@ export default { ...@@ -682,7 +704,7 @@ export default {
if (this.submitLoading) { if (this.submitLoading) {
this.submitLoading = false; this.submitLoading = false;
} }
this.reload(); this.resetData();
}, },
handleToTop() { handleToTop() {
...@@ -719,7 +741,6 @@ export default { ...@@ -719,7 +741,6 @@ export default {
} else { } else {
this.$message.info("已经是此页最后一个!"); this.$message.info("已经是此页最后一个!");
} }
console.log("this.currentId", this.currentId);
break; break;
case "prev": case "prev":
if (this.currentPageIds[index - 1]) { if (this.currentPageIds[index - 1]) {
...@@ -727,23 +748,21 @@ export default { ...@@ -727,23 +748,21 @@ export default {
} else { } else {
this.$message.info("已经是此页第一个!"); this.$message.info("已经是此页第一个!");
} }
console.log("this.currentId", this.currentId);
break; break;
} }
}, },
getRemovedIds(removedIds) { getRemovedIds(removedIds) {
this.removedIds = [...new Set([...this.removedIds, ...removedIds])]; if (removedIds) {
console.log("this.removedIds", this.removedIds); this.removedIds = [...new Set([...this.removedIds, ...removedIds])];
}
}, },
handleDeleteForm() {},
handleSubmit(submitFlag) { handleSubmit(submitFlag) {
submit(submitFlag, this); submit(submitFlag, this);
}, },
// 清空编辑组件中的所有值 // 清空编辑组件中的所有值
reload() { resetData() {
// 清空文献 // 清空文献
this.literatureIdArr = []; this.literatureIdArr = [];
// 清空文物 // 清空文物
...@@ -773,15 +792,13 @@ export default { ...@@ -773,15 +792,13 @@ export default {
this.$confirm("确认关闭?") this.$confirm("确认关闭?")
.then((_) => { .then((_) => {
this.visible = false; this.visible = false;
this.reload(); this.resetData();
this.submitLoading = false; this.submitLoading = false;
this.$emit("handleClose");
done(); done();
}) })
.catch((_) => {}); .catch((_) => {});
}, },
refresh() {
this.$emit("refresh");
},
}, },
}; };
</script> </script>
......
...@@ -2,14 +2,16 @@ ...@@ -2,14 +2,16 @@
import { addOrUpdateDisplayTemp } from "@/api/display"; import { addOrUpdateDisplayTemp } from "@/api/display";
import bizUploadFunctions from "@/utils/bizUploadFunctions"; import bizUploadFunctions from "@/utils/bizUploadFunctions";
import bizTransform from "@/utils/bizTransform"; import bizTransform from "@/utils/bizTransform";
import { uploadV1 } from "@/utils/file"; import { file, uploadV1 } from "@/utils/file";
const { getNeedUploadFormData, isFileRaw, isFormDataHasData, handleDeleteFiles } = const { getNeedUploadFormData, isFileRaw, isFormDataHasData, handleDeleteFiles, getMediaFile } =
bizUploadFunctions; bizUploadFunctions;
const { getDeptIdStr } = bizTransform; const { getDeptIdStr } = bizTransform;
const mediaKeys = ["faceImage", "images", "videos", "audios"]; const mediaKeys = ["faceImage", "images", "videos", "audios"];
// 新增和修改提交时表单需要删除的字段,因为后端没有做更新
const needDelete = ['culturalRelicVo', 'imagesVo', 'videosVo', 'audiosVo', 'literatureVo', 'virtualVo', 'literatureVo', 'faceImageMiddleUrl', 'faceImagePressUrl', 'faceImageUrl']
const getUnitData = ($el) => { const getUnitData = ($el) => {
const units = $el.$refs["exhibitionUnits"].getUnitData(); const units = $el.$refs["exhibitionUnits"].getUnitData();
...@@ -73,20 +75,21 @@ const getUnitRemovedIds = ($el) => { ...@@ -73,20 +75,21 @@ const getUnitRemovedIds = ($el) => {
return $el.$refs["exhibitionUnits"].getRemovedIds(); return $el.$refs["exhibitionUnits"].getRemovedIds();
}; };
//获取布展单元媒体文件中仍然需要保留的文件id
const getUnitExsitedObj = ($el, units) => { const getUnitExsitedObj = ($el, units) => {
const obj = {}; const obj = {};
loopUnits(units, obj); loopUnits(units, obj);
return obj; return obj;
function loopUnits(arr, obj) { function loopUnits(arr, obj) {
arr.forEach((item) => { arr.forEach((item) => {
if (item.images) { if (item.imagesVo) {
const { euId } = item; const { euId } = item;
const key = `unit-images-${euId}`; const key = `unit-images-${euId}`;
const removedIds = getUnitRemovedIds($el); const ids = item.imagesVo.filter((file) => {
const imgArr = item.images.split(","); return !isFileRaw(file);
// 筛选存在在images字符串中,并且没有被删除的id,这些是仍然要保留的 }).map(file => {
const ids = imgArr.filter((id) => { return file.fileId
return !removedIds.includes(id);
}); });
obj[key] = ids; obj[key] = ids;
} }
...@@ -114,7 +117,7 @@ const getUploadedIdByKey = (key, res) => { ...@@ -114,7 +117,7 @@ const getUploadedIdByKey = (key, res) => {
} }
}; };
// 获取已经上传了的文件的id集合 // 获取已经上传了的文件的id集合
const getUnitSuccessObj = ($el, units, res) => { const getUnitUploadedObj = ($el, units, res) => {
const obj = {}; const obj = {};
loopUnits(units, obj, res); loopUnits(units, obj, res);
return obj; return obj;
...@@ -135,31 +138,18 @@ const getUnitSuccessObj = ($el, units, res) => { ...@@ -135,31 +138,18 @@ const getUnitSuccessObj = ($el, units, res) => {
} }
}; };
const mergeObjects = (objA, objB) => { /**
* 获取form中媒体文件最终需要传到后台的文件ID
* @param {Object} oldObj 遗留的媒体文件id
* @param {Object} newObj 新添加的文件,上传后回填的 包含所有mediaKeys键名
* @returns {Object}最终需要传到后台的文件ID
*/
const mergeObjects = (oldObj, newObj) => {
let result = {}; let result = {};
for (const key in newObj) {
// 遍历对象A,复制键值对 const oldArr = oldObj[key] || []
for (let key in objA) { const newArr = [...oldArr, ...newObj[key]]
if (objA.hasOwnProperty(key)) { result[key] = newArr
result[key] = objA[key];
}
}
// 遍历对象B,合并相同的键对应的值
for (let key in objB) {
if (objB.hasOwnProperty(key)) {
if (result.hasOwnProperty(key)) {
if (Array.isArray(result[key])) {
result[key].push(...objB[key]);
} else {
console.log(
`Warning: Key ${key} exists in both objA and objB, but the value is not an array in objA.`
);
}
} else {
result[key] = objB[key]; // 如果键在result中不存在,就创建一个新的键值对
}
}
} }
return result; return result;
}; };
...@@ -167,17 +157,19 @@ const mergeObjects = (objA, objB) => { ...@@ -167,17 +157,19 @@ const mergeObjects = (objA, objB) => {
const getUploadedUnits = ($el, res) => { const getUploadedUnits = ($el, res) => {
const units = getUnitData($el); const units = getUnitData($el);
const exsitedObj = getUnitExsitedObj($el, units); const exsitedObj = getUnitExsitedObj($el, units);
const successObj = getUnitSuccessObj($el, units, res); const uploadedObj = getUnitUploadedObj($el, units, res);
// 将存在的和新上传的取交集,因为当key重复时,已存在的会被新上传的覆盖,因此需要再和已存在的进行取并集 // 将存在的和新上传的取交集,因为当key重复时,已存在的会被新上传的覆盖,因此需要再和已存在的进行取并集
const mergeObj = mergeObjects(exsitedObj, successObj); const mergeObj = mergeObjects(exsitedObj, uploadedObj);
loopUnits(units); loopUnits(units);
return units; return units;
function loopUnits(arr) { function loopUnits(arr) {
arr.forEach((item) => { arr.forEach((item) => {
const { euId } = item; const { euId } = item;
const key = `unit-images-${euId}`; const key = `unit-images-${euId}`;
if (mergeObj[key]) { if (mergeObj[key] && mergeObj[key].length > 0) {
item.images = mergeObj[key].join(","); item.images = mergeObj[key].join(",");
} else {
item.images = ''
} }
// 处理关联文物 // 处理关联文物
if (item.crIds && item.crIds instanceof Array) { if (item.crIds && item.crIds instanceof Array) {
...@@ -185,36 +177,42 @@ const getUploadedUnits = ($el, res) => { ...@@ -185,36 +177,42 @@ const getUploadedUnits = ($el, res) => {
} }
// 删除imagesVo不要传到后台 // 删除imagesVo不要传到后台
delete item.imagesVo; delete item.imagesVo;
if (item.children && item.length > 0) { if (item.children && item.children.length > 0) {
loopUnits(item.children); loopUnits(item.children);
} }
}); });
} }
}; };
/**
* 获取表单中仍然还需要保留的媒体文件的文件ID
* @param {*} $el infoEditDialog的this对象
* @returns {Object} 形如{faceImage:[1,2,3],imagesVo:[4,5,6]}
*/
const getFormExsitedObj = ($el) => { const getFormExsitedObj = ($el) => {
const obj = {}; const obj = {};
mediaKeys.forEach((key) => { mediaKeys.forEach((key) => {
// 已存在的不为空再继续 // 已存在的不为空再继续
if ($el.dialogForm[key]) { const files = getMediaFile($el, key)
const removedIds = $el.getRemovedIds(); if (files && files.length > 0) {
const arr = $el.dialogForm[key].split(","); const ids = files.filter((item) => {
// 筛选存在在媒体字符串中,并且没有被删除的id,这些是仍然要保留的 return !isFileRaw(item)
const ids = arr.filter((id) => { }).map(item => {
return !removedIds.includes(id); return item.fileId
}); })
obj[key] = ids; obj[key] = ids
} }
}); });
return obj; return obj;
}; };
// 获取已经上传了的文件的id集合 // 获取已经上传了的文件的id集合
const getFormSuccessObj = ($el, res) => { const getFormUploadedObj = ($el, res) => {
const obj = {}; const obj = {};
mediaKeys.forEach((key) => { mediaKeys.forEach((key) => {
// 通过key去查找res中的fileId // 通过key去查找res中的fileId
const idsArr = getUploadedIdByKey(key, res); const idsArr = getUploadedIdByKey(key, res);
// 获取本来还没被删除的id
obj[key] = idsArr; obj[key] = idsArr;
}); });
return obj; return obj;
...@@ -237,14 +235,14 @@ const getStatusNumByBool = (bool) => { ...@@ -237,14 +235,14 @@ const getStatusNumByBool = (bool) => {
// 获取最终的展览表单 // 获取最终的展览表单
const getUploadedForm = ($el, res, submitFlag) => { const getUploadedForm = ($el, res, submitFlag) => {
const form = JSON.parse(JSON.stringify($el.dialogForm)); const form = JSON.parse(JSON.stringify($el.dialogForm));
// 不需要上传,仍然需要保留的
const exsitedObj = getFormExsitedObj($el); const exsitedObj = getFormExsitedObj($el);
const successObj = getFormSuccessObj($el, res); // 需要新上传的
const uploadedObj = getFormUploadedObj($el, res);
// 将存在的和新上传的取交集,因为当key重复时,已存在的会被新上传的覆盖,因此需要再和已存在的进行取并集 // 将存在的和新上传的取交集,因为当key重复时,已存在的会被新上传的覆盖,因此需要再和已存在的进行取并集
const mergeObj = mergeObjects(exsitedObj, successObj); const mergeObj = mergeObjects(exsitedObj, uploadedObj);
mediaKeys.forEach((key) => { mediaKeys.forEach((key) => {
if (mergeObj[key] && mergeObj[key].length > 0) { form[key] = mergeObj[key].join(",")
form[key] = mergeObj[key].join(",");
}
}); });
form.literature = getLtStrByArr($el.literatureIdArr); //文献 form.literature = getLtStrByArr($el.literatureIdArr); //文献
form.status = getStatusNumByBool($el.dialogForm.status); form.status = getStatusNumByBool($el.dialogForm.status);
...@@ -262,25 +260,26 @@ const getUploadedForm = ($el, res, submitFlag) => { ...@@ -262,25 +260,26 @@ const getUploadedForm = ($el, res, submitFlag) => {
* @param {*} $el 当前this对象 * @param {*} $el 当前this对象
*/ */
const submit = (submitFlag, $el) => { const submit = (submitFlag, $el) => {
// this.loading = true; $el.submitLoading = true;
$el.$refs.form.validate(async (valid) => { $el.$refs.form.validate(async (valid) => {
if (valid) { if (valid) {
const res = await uploadFile($el); const res = await uploadFile($el);
const unitsUploaded = getUploadedUnits($el, res); const unitsUploaded = getUploadedUnits($el, res);
const formUploaded = getUploadedForm($el, res, submitFlag); const formUploaded = getUploadedForm($el, res, submitFlag);
const params = { const params = {
...formUploaded, ...formUploaded,
exhibitionUnits: unitsUploaded, exhibitionUnits: unitsUploaded,
}; };
// console.log("unitsUploaded", unitsUploaded); // debugger
// console.log("formUploaded", formUploaded); needDelete.forEach(key => {
delete params[key]
})
addOrUpdateDisplayTemp(params) addOrUpdateDisplayTemp(params)
.then((res) => { .then((res) => {
if (res.code == 0) { if (res.code == 0) {
setTimeout(() => { setTimeout(() => {
$el.$emit("refresh"); $el.$emit("refresh");
$el.reload(); $el.resetData();
$el.submitLoading = false; $el.submitLoading = false;
$el.$message.success("提交成功!"); $el.$message.success("提交成功!");
$el.visible = false; $el.visible = false;
......
...@@ -571,16 +571,9 @@ export default { ...@@ -571,16 +571,9 @@ export default {
onSubmitSearch() { onSubmitSearch() {
console.log("submit!"); console.log("submit!");
}, },
// 关闭Dialog // 关闭编辑弹窗
closeInfoEditDialog() { closeInfoEditDialog() {
this.form = { this.form = {};
status: 1,
faceImage: "", // 封面(图片1张)
images: "", //展览图片
videos: "", //展览视频
audios: "", //展览音频
exhibitionUnits: [], //布展单元
};
}, },
// 关闭预览图片 // 关闭预览图片
closeImgViewer() { closeImgViewer() {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论