完善展览在新增和修改中的文件删除问题

src/components/DisplayBaseInfo/index.vue

@@ -8,10 +8,10 @@
           v-for="(item, index) in displayTabletitle"
           :key="index"
         >
-          <RichTextShow
-            :richText="info['intro']"
-            v-if="hasProp(item, 'intro')"
-          />
+          <el-card v-if="hasProp(item, 'intro')" shadow="never">
+            <RichTextShow :richText="info['intro']" />
+          </el-card>
+
           <!-- 展览类型 -->
           <DictText
             v-else-if="hasProp(item, 'type')"
@@ -66,10 +66,10 @@
             <el-table-column prop="source" label="来源"></el-table-column>
           </el-table>
           <!-- 展览单元 -->
-          <ExhibitionPreview
-            v-else-if="hasProp(item, 'exhibitionUnits')"
-            :data="info['exhibitionUnits']"
-          />
+          <el-card v-else-if="hasProp(item, 'exhibitionUnits')" shadow="never">
+            <ExhibitionPreview :data="info['exhibitionUnits']" />
+          </el-card>
+
           <span v-else-if="info[item.prop] && info[item.prop].length == 0"
             >无</span
           >

src/components/ExhibitionPreview/components/CollapsItem.vue

-<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>

src/components/ExhibitionPreview/index.vue

@@ -11,7 +11,7 @@
             <h3>{{ item.title }}</h3>
             <el-form-item label="文字介绍：">
               <div class="intro">
-                <RichTextShow :richText="item.intro"></RichTextShow>
+                <RichTextShow :richText="item.intro" />
               </div>
             </el-form-item>
             <div
@@ -23,6 +23,7 @@
                   <el-col :span="4" v-for="(v, i) in item.culturalRelics">
                     <el-image
                       fit="contain"
+                      class="image"
                       :src="v.faceImagePressUrl"
                     ></el-image>
                   </el-col>
@@ -36,7 +37,11 @@
               <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-image
+                      fit="contain"
+                      class="image"
+                      :src="v.middleUrl"
+                    ></el-image>
                   </el-col>
                 </el-row>
               </el-form-item>
@@ -77,4 +82,10 @@ export default {
 .indent20 {
   padding-left: 20px;
 }
+.image {
+  width: 100%;
+  height: 200px;
+  border: 1px solid #dadada;
+  border-radius: 4px;
+}
 </style>

src/styles/grayscale.scss

+// 悼念模式，必要时引用
+
+html {
+    filter: grayscale(100%);
+    -webkit-filter: grayscale(100%);
+    -moz-filter: grayscale(100%);
+    -ms-filter: grayscale(100%);
+    -o-filter: grayscale(100%);
+    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
+    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
+    -webkit-filter: grayscale(1);
+}
\ No newline at end of file

src/styles/index.scss

@@ -4,6 +4,7 @@
 @import './element-ui.scss';
 @import './sidebar.scss';
 
+
 body {
   height: 100%;
   -moz-osx-font-smoothing: grayscale;
@@ -62,4 +63,4 @@ div:focus {
 // main-container global css
 .app-container {
   padding: 40px;
-}
+}
\ No newline at end of file

src/views/display/components/ExhibitionUnit.vue

@@ -17,7 +17,7 @@
                 </el-input>
                 <span v-else>{{ data.title }}</span>
               </div>
-              <span v-if="!isDisableEvent">
+              <span v-if="!isDisableEvent" class="icons">
                 <el-tooltip content="编辑标题" placement="top">
                   <i
                     v-if="!data.isEditing"
@@ -191,7 +191,6 @@ export default {
               if (arr.length > 0) {
                 arr.forEach((item) => {
                   if (item.culturalRelics && item.culturalRelics.length > 0) {
-                    // item.crList = item.culturalRelics;
                     item.crIds = [];
                     item.culturalRelics.map((cr) => {
                       item.crIds.push(cr.crId);
@@ -255,9 +254,9 @@ export default {
 
     handleClickNode(node, data) {
       this.currentData = data;
-      this.crList = [
-        ...new Set([...this.crList, ...this.currentData.culturalRelics]),
-      ];
+      const crList = this.crList || [];
+      const currentDataCr = this.currentData.culturalRelics || [];
+      this.crList = [...new Set([...crList, ...currentDataCr])];
     },
     editNode(node, data) {
       this.$set(data, "isEditing", true);
@@ -403,6 +402,10 @@ export default {
     text-overflow: ellipsis;
   }
 }
+.icons {
+  display: flex;
+  align-items: center;
+}
 
 ::v-deep .el-tree-node__content {
   // padding: 10px;

src/views/display/components/InfoEditDialog.vue

@@ -432,12 +432,6 @@ export default {
         }
       },
     },
-    images: {
-      handler: function (value) {
-        console.log(value);
-      },
-      deep: true,
-    },
     // currentId(value) {
     //   this.$emit("changeDisplay", value);
     // },
@@ -780,7 +774,6 @@ export default {
           crIds: [], //关联文物集合
         },
       ];
-
       this.images = [];
       this.videos = [];
       this.audios = [];

src/views/display/components/submit.js

@@ -72,7 +72,7 @@ const uploadFile = ($el) => {
 };
 
 const getUnitRemovedIds = ($el) => {
-  return $el.$refs["exhibitionUnits"].getRemovedIds();
+  return $el.$refs["exhibitionUnits"].removedIds;
 };
 
 
@@ -270,10 +270,13 @@ const submit = (submitFlag, $el) => {
         ...formUploaded,
         exhibitionUnits: unitsUploaded,
       };
-      // debugger
+      // 删除一些需要删除的字段
       needDelete.forEach(key => {
         delete params[key]
       })
+      const unitDeleteIds = getUnitRemovedIds($el)
+      const formDeleteIds = $el.removedIds
+      const removedIds = [...new Set([...unitDeleteIds, ...formDeleteIds])]
       addOrUpdateDisplayTemp(params)
         .then((res) => {
           if (res.code == 0) {
@@ -284,6 +287,7 @@ const submit = (submitFlag, $el) => {
               $el.$message.success("提交成功！");
               $el.visible = false;
               //   TODO:删除文件
+              handleDeleteFiles(removedIds)
             }, 1000);
           }
         })
@@ -293,4 +297,5 @@ const submit = (submitFlag, $el) => {
     }
   });
 };
+
 export default submit;