对接审核列表；对接展览模块新接口

src/api/display.js

@@ -69,11 +69,11 @@ export function getDisplayById(params) {
 }
 
 // 修改展览（临时表）
-export function getDisplayByIdTemp(params) {
+export function getDisplayByIdTemp(data) {
   return request({
     url: '/bizExhibitionTemp/detailById',
-    method: 'get',
-    params
+    method: 'post',
+    data
   })
 }
 

src/utils/bizCommon.js

+// 本文件用于提取一些通用的业务层面的公共方法
+
+import store from '@/store'
+const bizCommon = {
+
+
+}
\ No newline at end of file

src/utils/fileUploadFuctions.js

@@ -143,5 +143,19 @@ const fileUploadFuctions = {
     });
     return arr;
   },
+
+  /**
+ * @param {array} fileArr 需要被删除的文件ID数组
+ */
+  async handleDeleteFiles(fileArr) {
+    console.log("doing delete");
+    if (fileArr.length == 0) {
+      console.log("nothing to delete");
+      return;
+    }
+    await deleteFiles(fileArr);
+    console.log("delete done");
+  },
+
 };
 export default fileUploadFuctions;

src/utils/transformData.js

+
+// 本文件提供一些前端和后端数据交互和转换的一些方法，可批量使用的
 const transformData = {
   /**
    * 转换服务器的封面数据到前端可用的封面数据

src/views/culturalRelic/components/InfoEditDialog.vue

@@ -280,12 +280,12 @@
 <script>
 import { getLiteratureList } from "@/api/literature";
 import { addOrUpdateCulturalRelic } from "@/api/culturalRelic";
-import { mapGetters } from "vuex";
+import { mapGetters, mapActions } from "vuex";
 import { uploadV1 } from "@/utils/file";
 import { deleteFiles } from "@/api/file";
-import { rules } from "./js/validateRules";
-import fileUploadFunctions from "./js/fileUploadFuctions";
-import transformData from "./js/transformData";
+import { rules } from "../configs/validateRules";
+import fileUploadFunctions from "@/utils/fileUploadFuctions";
+import transformData from "@/utils/transformData";
 const {
   faceImageToClient,
   literatureIdArrToStr,
@@ -294,7 +294,7 @@ const {
   statusStrToBool,
   getDeptIdArr,
   getDeptIdStr,
-  file3dToClient
+  file3dToClient,
 } = transformData;
 export default {
   name: "InfoEditDialog",
@@ -374,11 +374,23 @@ export default {
     };
   },
   async created() {
-    await this.getDictList();
-    await this.getDictTree();
-    await this.getMuseumData();
+    await this.getDictList([
+      "culturalRelicLevel",
+      "culturalRelicType",
+      "culturalRelicSourceWay",
+    ]);
+    const res = await this.getDictTree([
+      "culturalRelicTextureType",
+      "culturalRelicYears",
+    ]);
+    this.culturalRelicTextureType = res.culturalRelicTextureType;
+    this.culturalRelicYears = res.culturalRelicYears;
+    this.orgTreeData = await this.getMuseumTreeData(false);
+    this.searchLiterature();
   },
   methods: {
+    ...mapActions("dict", ["getDictList", "getDictTree"]),
+    ...mapActions("org", ["getMuseumTreeData"]),
     //回显服务器传来的数据
     covertServerData(serverData) {
       this.dialogForm = JSON.parse(JSON.stringify(serverData));
@@ -391,43 +403,21 @@ export default {
         status,
         literatureVo,
         deptId,
+        file3d,
+        file3dUrl,
       } = this.dialogForm;
       this.dialogForm.status = statusStrToBool(status);
       this.faceImage = faceImageToClient(faceImagePressUrl, faceImageUrl);
-      this.file3d = file3dToClient(faceImagePressUrl, faceImageUrl);
+      this.file3d = file3dToClient(file3d, file3dUrl);
       this.images = imagesVo || [];
       this.videos = videosVo || [];
       this.audios = audiosVo || [];
-
       this.literatureIdArr = literatureListToIds(literatureVo);
       this.dialogForm.deptId = getDeptIdArr(deptId, this.userInfo);
     },
-    // 获取字典列表
-    async getDictList() {
-      await this.$store.dispatch("dict/getDictList", [
-        "culturalRelicLevel",
-        "culturalRelicType",
-        "culturalRelicSourceWay",
-      ]);
-    },
-    // 获取字典树
-    async getDictTree() {
-      let res = await this.$store.dispatch("dict/getDictTree", [
-        "culturalRelicTextureType",
-        "culturalRelicYears",
-      ]);
-      this.culturalRelicTextureType = res.culturalRelicTextureType;
-      this.culturalRelicYears = res.culturalRelicYears;
-    },
-    // 获取博物馆数据
-    async getMuseumData() {
-      let res = await this.$store.dispatch("org/getMuseumTreeData", false);
-      this.orgTreeData = res;
-    },
-
     // 关联文献查询
     searchLiterature(queryString) {
-      if (!queryString.trim()) {
+      if (!queryString || !queryString.trim()) {
         this.literatureList = [];
         return;
       }
@@ -477,14 +467,13 @@ export default {
           this.submitLoading = true;
           this.uploadMediaFiles(this.mediaKeys, this.dialogForm)
             .then(async (mediaForm) => {
-              console.log(mediaForm);
+              // console.log(mediaForm);
               this.loadingText = "正在提交表单...";
               const form = this.getSubmitForm(this.dialogForm, mediaForm);
               const { status, years, textureType, deptId } = form;
               const { literatureIdArr } = this;
               form.status = statusBoolToNum(status);
               form.literature = literatureIdArrToStr(literatureIdArr);
-              // 处理年份
               form.years = this.processYear(years);
               form.textureType = this.processTextureType(textureType);
               form.deptId = getDeptIdStr(deptId);
@@ -492,6 +481,8 @@ export default {
               this.submitLoading = false;
               if (res.code == 0) {
                 this.$message.success("提交成功！");
+                this.$emit("refresh");
+                this.$emit("handleClose");
               }
             })
             .catch((err) => {
@@ -523,18 +514,7 @@ export default {
         return "";
       }
     },
-    /**
-     * @param {array} fileArr 需要被删除的文件ID数组
-     */
-    async handleDeleteFiles(fileArr) {
-      console.log("doing delete");
-      if (fileArr.length == 0) {
-        console.log("nothing to delete");
-        return;
-      }
-      await deleteFiles(fileArr);
-      console.log("delete done");
-    },
+
     /**
      * 上传对应的媒体文件,并返回一个promise
      * @param {array} dialogForm 当前需要提交的表单
@@ -551,6 +531,7 @@ export default {
           getMergedIdsObj,
           getDeleteFileArr,
           isFormDataHasData,
+          handleDeleteFiles,
         } = fileUploadFunctions;
         const formData = getNeedUploadFormData(this, mediaKeys);
         try {
@@ -571,7 +552,7 @@ export default {
                 newIdObj,
                 mediaKeys
               );
-              this.handleDeleteFiles(deleteIdArr);
+              handleDeleteFiles(deleteIdArr);
               console.log("mergedFileIdsObj", mergedIdObj);
               console.log("deleteFiles", deleteIdArr);
               console.log("uploadMediaFiles done");
@@ -579,7 +560,7 @@ export default {
             }
           } else {
             console.log("uploadMediaFiles nothing to upload");
-            resolve(false);
+            resolve({});
           }
         } catch (error) {
           console.error("uploadMediaFiles error");

src/views/culturalRelic/configs/list.js

@@ -201,13 +201,13 @@ export const unPassedTitle = [{
   columnAlign: 'center',
   isFaceImage: true,
 },
-{
-  prop: "status",
-  label: "上下架状态",
-  width: 100,
-  columnAlign: 'center',
-  isStatus: true
-},
+// {
+//   prop: "status",
+//   label: "上下架状态",
+//   width: 100,
+//   columnAlign: 'center',
+//   isStatus: true
+// },
 // {
 //   prop: "num",
 //   label: "数量",
@@ -284,7 +284,7 @@ export const searchConfig = [
   {
     prop: "name",
     type: "input",
-    label: "文物名称",
+    label: "展览名称",
   },
   {
     prop: "status",
@@ -301,11 +301,5 @@ export const searchConfig = [
       },
     ],
   },
-  // 是否只看3D
-  {
-    prop: "upload3dFlag",
-    type: "checkbox",
-    label: "只看3D",
-  },
 ]
 

src/views/culturalRelic/index.vue

@@ -310,6 +310,7 @@ export default {
           this.$refs.View3dDialog.visible = true;
           break;
         case "edit":
+          console.log(value, row);
           let detailRes = await getRCDetailByIdTemp({ crId: row.crId });
           if (detailRes.code == 0) {
             this.form = detailRes.data;

src/views/display/components/InfoEditDialog copy.vue

+<template>
+  <el-dialog
+    v-loading="submitLoading"
+    element-loading-background="rgba(0, 0, 0, 0.5)"
+    :element-loading-text="loadingText"
+    :visible.sync="dialogVisible"
+    width="80%"
+    :before-close="handleClose"
+    top="2vh"
+    lock-scroll
+  >
+    <div class="title" slot="title">
+      <div class="divider"></div>
+      <div class="label">
+        {{ title }}
+        <span
+          v-if="dialogForm.exhibitionId"
+          style="font-size: 12px; margin-left: 10px; font-weight: 500"
+        >
+          <i class="el-icon-warning-outline"></i
+          >点击左右切换按钮可切换展览。<span style="color: #f56c6c">
+            注意：切换前请注意保存当前展览信息
+          </span>
+        </span>
+      </div>
+    </div>
+    <div class="el-dialog-div">
+      <div class="dialog-content" v-if="dialogVisible" id="dialog-content">
+        <el-form
+          size="mini"
+          :model="dialogForm"
+          class="basic-info"
+          :rules="rules"
+          ref="form"
+        >
+          <el-row :gutter="50">
+            <el-col :span="12">
+              <el-form-item
+                label="展览标题"
+                :label-width="formLabelWidth"
+                prop="title"
+              >
+                <el-input
+                  v-model="dialogForm.title"
+                  autocomplete="off"
+                  placeholder="请输入展览标题"
+                  clearable
+                ></el-input>
+              </el-form-item>
+              <el-form-item
+                label="展览单位"
+                :label-width="formLabelWidth"
+                prop="deptId"
+              >
+                <el-cascader
+                  style="width: 100%"
+                  v-model="dialogForm.deptId"
+                  :options="orgTreeData"
+                  :props="optionProps"
+                  placeholder="请选择展览单位"
+                  clearable
+                >
+                </el-cascader>
+              </el-form-item>
+              <el-form-item label="展览地区" :label-width="formLabelWidth">
+                <el-cascader
+                  class="years item"
+                  style="width: 100%"
+                  v-model="dialogForm.regionCode"
+                  :options="regionTree"
+                  :props="culturalRegionProps"
+                  placeholder="请选择所属地区"
+                  filterable
+                  clearable
+                >
+                </el-cascader>
+              </el-form-item>
+              <el-form-item label="展览类型" :label-width="formLabelWidth">
+                <el-select
+                  v-model="dialogForm.type"
+                  placeholder="请选择展览类型"
+                  style="width: 100%"
+                  clearable
+                >
+                  <el-option
+                    v-for="(value, key) in dicts.displayType"
+                    :key="key"
+                    :label="value"
+                    :value="key"
+                  >
+                  </el-option>
+                </el-select>
+              </el-form-item>
+
+              <el-form-item
+                label="展览性质"
+                :label-width="formLabelWidth"
+                style="display: none"
+              >
+                <el-select
+                  v-model="dialogForm.displayCharacter"
+                  placeholder="请选择展览性质"
+                  style="width: 100%"
+                  clearable
+                >
+                  <el-option
+                    v-for="(value, key) in dicts.displayCharacter"
+                    :key="key"
+                    :label="value"
+                    :value="key"
+                  >
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="模板主题" :label-width="formLabelWidth">
+                <el-select
+                  v-model="dialogForm.themeType"
+                  placeholder="请选择模板主题"
+                  style="width: 100%"
+                  clearable
+                >
+                  <el-option
+                    v-for="item in themeTypeOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  >
+                  </el-option>
+                </el-select>
+              </el-form-item>
+
+              <el-form-item label="展览介绍" :label-width="formLabelWidth">
+                <VueQuillEditor
+                  v-model="dialogForm.intro"
+                  placeholder="请输入展览介绍"
+                />
+              </el-form-item>
+              <el-form-item label="关键词" :label-width="formLabelWidth">
+                <el-input
+                  v-model="dialogForm.keyword"
+                  autocomplete="off"
+                  placeholder="请输入关键词"
+                  clearable
+                ></el-input>
+              </el-form-item>
+
+              <el-form-item label="展览文物" :label-width="formLabelWidth">
+                <el-select
+                  v-model="crIds"
+                  multiple
+                  filterable
+                  remote
+                  reserve-keyword
+                  placeholder="请输入关键词搜索文物"
+                  :remote-method="searchCR"
+                  :loading="loading"
+                  style="width: 100%"
+                  clearable
+                >
+                  <el-option
+                    v-for="item in crList"
+                    :key="item.crId"
+                    :label="item.name"
+                    :value="item.crId"
+                  >
+                  </el-option>
+                </el-select>
+                <!-- <PageSelect
+                ref="PageSelect"
+                label="name"
+                value="crId"
+                :select.sync="value"
+                :url="pageSelectUrl"
+                filter-key="name"
+              /> -->
+              </el-form-item>
+
+              <el-form-item label="关联文献" :label-width="formLabelWidth">
+                <el-select
+                  v-model="literatureIdArr"
+                  multiple
+                  filterable
+                  remote
+                  reserve-keyword
+                  placeholder="请输入关键词搜索文献"
+                  :remote-method="searchLiterature"
+                  :loading="loading"
+                  style="width: 100%"
+                  ref="literatureSelect"
+                  clearable
+                >
+                  <el-option
+                    v-for="item in literatureList"
+                    :key="item.literatureId"
+                    :label="item.name"
+                    :value="item.literatureId"
+                  >
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="关联虚拟展厅" :label-width="formLabelWidth">
+                <el-select
+                  v-model="vrIds"
+                  multiple
+                  filterable
+                  remote
+                  reserve-keyword
+                  placeholder="请输入关键词搜索虚拟展厅"
+                  :remote-method="searchVirtual"
+                  :loading="loading"
+                  style="width: 100%"
+                  ref="virtualSelect"
+                  clearable
+                >
+                  <el-option
+                    v-for="item in vrList"
+                    :key="item.bvId"
+                    :label="item.name"
+                    :value="item.bvId"
+                  >
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="是否上架" :label-width="formLabelWidth">
+                <el-switch v-model="dialogForm.status"> </el-switch>
+              </el-form-item>
+              <el-form-item label="备注" :label-width="formLabelWidth">
+                <el-input
+                  type="textarea"
+                  placeholder="请输入备注"
+                  v-model="dialogForm.remark"
+                  maxlength="100"
+                  show-word-limit
+                  clearable
+                >
+                </el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="展览封面" :label-width="formLabelWidth">
+                <ManualUploader
+                  :fileLimit="1"
+                  listType="picture-card"
+                  :fileType="['png', 'jpeg', 'jpg']"
+                  :files="faceImage"
+                  ref="faceImage"
+                />
+              </el-form-item>
+
+              <el-form-item label="展览图片" :label-width="formLabelWidth">
+                <ManualUploader
+                  :files="images"
+                  :fileLimit="20"
+                  :fileSize="50"
+                  listType="picture-card"
+                  :fileType="['png', 'jpeg', 'jpg']"
+                  ref="images"
+                  :advice="imagesAdvice"
+                />
+              </el-form-item>
+              <el-form-item label="展览音频" :label-width="formLabelWidth">
+                <ManualUploader
+                  :files="audios"
+                  :fileLimit="1"
+                  :fileSize="50"
+                  :fileType="['mp3']"
+                  listType="card"
+                  ref="audios"
+                />
+              </el-form-item>
+              <el-form-item label="展览视频" :label-width="formLabelWidth">
+                <ManualUploader
+                  :files="videos"
+                  :fileLimit="6"
+                  :fileSize="500"
+                  :fileType="['mp4']"
+                  listType="card"
+                  ref="videos"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-form-item label="展览单元" :label-width="formLabelWidth">
+              <ExhibitionUnit
+                :exhibitionUnits="dialogForm.exhibitionUnits"
+                ref="exhibitionUnits"
+              />
+            </el-form-item>
+          </el-row>
+        </el-form>
+      </div>
+      <div class="dialog-footer">
+        <el-button
+          size="mini"
+          icon="el-icon-top"
+          @click.native="handleToTop"
+        ></el-button>
+        <el-button
+          size="mini"
+          @click="cancelForm"
+          icon="el-icon-circle-close"
+          type="warning"
+          >取 消</el-button
+        >
+        <!-- <el-button
+          size="mini"
+          type="primary"
+          @click="handleSubmit(0)"
+          :disabled="loading"
+          icon="el-icon-document-checked"
+        >
+          只保存
+        </el-button> -->
+        <!-- <el-button @click="handlePreview">预 览</el-button> -->
+        <!-- <el-button
+          size="mini"
+          type="primary"
+          @click="handleSubmit(1)"
+          icon="el-icon-circle-check"
+          :disabled="loading"
+          >保存并提交审核
+        </el-button> -->
+        <el-button
+          size="mini"
+          type="primary"
+          @click="handleSubmit"
+          icon="el-icon-circle-check"
+          :disabled="loading"
+          >提交
+        </el-button>
+      </div>
+    </div>
+    <el-tooltip
+      class="item"
+      effect="dark"
+      content="下一展览"
+      placement="top-start"
+    >
+      <div
+        class="next btn"
+        v-if="dialogForm.exhibitionId"
+        @click="handleChangeDisplay('next')"
+      >
+        <i class="el-icon-arrow-right"></i>
+      </div>
+    </el-tooltip>
+    <el-tooltip
+      class="item"
+      effect="dark"
+      content="上一展览"
+      placement="top-start"
+    >
+      <div
+        class="prev btn"
+        v-if="dialogForm.exhibitionId"
+        @click="handleChangeDisplay('prev')"
+      >
+        <i class="el-icon-arrow-left"></i>
+      </div>
+    </el-tooltip>
+  </el-dialog>
+</template>
+
+<script>
+import { addOrUpdateDisplayTemp } from "@/api/display";
+import { mapGetters, mapActions } from "vuex";
+import ExhibitionUnit from "./ExhibitionUnit.vue";
+import { uploadV1 } from "@/utils/file";
+import { themeTypeOptions } from "../contants";
+import { deleteFiles } from "@/api/file";
+import { getVirtualListPer } from "@/api/vitual";
+import { rules } from "../configs/validateRules";
+import { pageSelectUrl, upLoadAddress } from "../configs/urls";
+import transformData from "@/utils/transformData";
+import fileUploadFunctions from "@/utils/fileUploadFuctions";
+import unitsFunctions from "./units";
+const {
+  faceImageToClient,
+  literatureIdArrToStr,
+  literatureListToIds,
+  statusBoolToNum,
+  statusStrToBool,
+  getDeptIdArr,
+  getDeptIdStr,
+  file3dToClient,
+} = transformData;
+const {
+  getNeedUploadFormData,
+  getNewIdsObj,
+  getOldIdsObj,
+  getMergedIdsObj,
+  getDeleteFileArr,
+  isFormDataHasData,
+  isFileRaw,
+} = fileUploadFunctions;
+export default {
+  name: "InfoEditDialog",
+  components: {
+    ExhibitionUnit,
+  },
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    form: {
+      type: Object,
+      default: () => ({}),
+    },
+    currentPageIds: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  computed: {
+    ...mapGetters(["userInfo", "dicts"]),
+    title() {
+      if (this.dialogForm.exhibitionId) {
+        return "修改信息";
+      } else {
+        return "发布展览";
+      }
+    },
+    themeTypeOptions() {
+      return themeTypeOptions;
+    },
+  },
+  watch: {
+    visible: {
+      handler: function (value) {
+        this.dialogVisible = value;
+      },
+      deep: true,
+      immediate: true,
+    },
+    form: {
+      handler: function (value) {
+        if (!value) {
+          return;
+        }
+        this.coverServerData(value);
+      },
+      immediate: true,
+    },
+    "dialogForm.themeType": {
+      handler: function (value) {
+        switch (value) {
+          case "2":
+            this.imagesAdvice =
+              "中国风主题建议上传10张以上的展览图片，效果更好";
+            break;
+          default:
+            this.imagesAdvice = "";
+            break;
+        }
+      },
+    },
+    currentId(value) {
+      this.$emit("changeDisplay", value);
+    },
+  },
+  data() {
+    return {
+      dialogForm: {
+        ...this.form,
+      },
+      formLabelWidth: "100px",
+      loading: false,
+      submitLoading: false,
+      loadingText: "",
+      typeOptions: [{ label: "展览类型", value: 1 }], //后期从vuex中取
+      disabled: false,
+      exhibitionUnits: [],
+      literatureList: [], //文献列表
+      literatureIdArr: [], //选中的文献列表
+      crList: [], //文物列表
+      crIds: [], //选中的文物列表
+      vrList: [], //虚拟展厅列表
+      vrIds: [],
+      faceImage: [],
+      images: [],
+      videos: [],
+      audios: [],
+      orgTreeData: [],
+      optionProps: {
+        value: "id",
+        label: "name",
+        children: "children",
+        checkStrictly: true,
+      },
+      culturalRegionProps: {
+        value: "code",
+        label: "name",
+        children: "children",
+        checkStrictly: true,
+      },
+      regionTree: [],
+      imagesAdvice: "",
+      dialogVisible: false,
+      nextDiaplayId: null,
+      prevDiaplayId: null,
+      currentId: null,
+      pageSelectUrl,
+      upLoadAddress,
+      rules,
+      mediaKeys: ["faceImage", "images", "videos", "audios"],
+    };
+  },
+  async created() {
+    await this.getDictList(["displayType", "displayCharacter"]);
+    this.orgTreeData = await this.getMuseumTreeData(false);
+    this.loadRegionTree();
+  },
+
+  methods: {
+    ...mapActions("dict", ["getDictList", "getLtList", "getCrList"]),
+    ...mapActions("org", ["getMuseumTreeData", "getSysRegionTreeData"]),
+    ...unitsFunctions, //全部导入布展单元的所有函数
+    coverServerData(value) {
+      if (value) {
+        this.dialogForm = JSON.parse(JSON.stringify(value));
+        if (!this.dialogForm.exhibitionId) {
+          this.dialogForm.deptId = this.userInfo.deptId;
+          this.dialogForm.regionCode = this.userInfo.regionCode;
+        } else {
+          this.currentId = this.dialogForm.exhibitionId;
+        }
+        const {
+          faceImageUrl,
+          faceImagePressUrl,
+          imagesVo,
+          videosVo,
+          audiosVo,
+          status,
+          literatureVo,
+          deptId,
+          exhibitionUnits,
+        } = this.dialogForm;
+        this.faceImage = faceImageToClient(faceImagePressUrl, faceImageUrl);
+        this.images = imagesVo || [];
+        this.videos = videosVo || [];
+        this.audios = audiosVo || [];
+        this.crList = this.getClientCrList();
+        this.crIds = this.getClientCrIds();
+        this.vrList = this.getClientVrList();
+        this.vrIds = this.getClientVrIds();
+        this.dialogForm.status = statusStrToBool(status);
+        this.literatureIdArr = literatureListToIds(literatureVo);
+        this.dialogForm.deptId = getDeptIdArr(deptId, this.userInfo);
+        this.dialogForm.exhibitionUnits = this.getClientUnit(exhibitionUnits);
+      }
+    },
+    // 获取前端需要的文物list
+    getClientCrList(culturalRelicVo) {
+      if (!culturalRelicVo || culturalRelicVo.length == 0) {
+        return;
+      }
+      return culturalRelicVo;
+    },
+    // 获取前端需要的文物id合集
+    getClientCrIds(culturalRelicVo) {
+      if (!culturalRelicVo || culturalRelicVo.length == 0) {
+        return;
+      }
+      const crIds = culturalRelicVo.map((item) => {
+        return item.crId;
+      });
+      return crIds;
+    },
+
+    // 获取前端需要的虚拟展list
+    getClientVrList(virtualVo) {
+      if (!virtualVo || virtualVo.length == 0) {
+        return;
+      }
+      return virtualVo;
+    },
+    // 获取前端需要的虚拟展id合集
+    getClientVrIds(virtualVo) {
+      if (!virtualVo || virtualVo.length == 0) {
+        return;
+      }
+      const vrIds = virtualVo.map((item) => {
+        return item.bvId;
+      });
+      return vrIds;
+    },
+    // 获取前端需要的布展单元
+    getClientUnit(exhibitionUnits) {
+      function loopUnit(arr) {
+        arr.forEach((unit) => {
+          if (unit.length > 0) {
+            // 如果有文物，回填文物
+            if (unit.culturalRelics && uni.culturalRelics.length > 0) {
+              this.$set(unit, "crIds", unit.culturalRelics);
+            }
+            if (unit.children) {
+              loopUnit(unit.children);
+            }
+          }
+        });
+        return arr;
+      }
+      if (!exhibitionUnits || exhibitionUnits.length == 0) {
+        return;
+      }
+      const newUnits = loopUnit(exhibitionUnits);
+      return newUnits;
+    },
+    // 关联文献查询
+    searchLiterature(queryString) {
+      if (!queryString.trim()) {
+        this.literatureList = [];
+        return;
+      }
+      this.loading = true;
+      const params = {
+        name: queryString,
+        page: "1",
+        limit: "100",
+      };
+      setTimeout(async () => {
+        this.loading = false;
+        const res = await this.getLtList(params);
+        if (res.code == 0) {
+          this.literatureList = res.data.records;
+        } else {
+          this.literatureList = [];
+          this.$message.error(res.msg);
+        }
+      }, 500);
+    },
+
+    // 关联虚拟展厅查询
+    searchVirtual(queryString) {
+      let that = this;
+      if (!queryString.trim()) {
+        that.vrList = [];
+        return;
+      }
+      that.loading = true;
+      const params = {
+        name: queryString,
+        page: "1",
+        limit: "100",
+      };
+
+      setTimeout(async () => {
+        that.loading = false;
+        let res = await getVirtualListPer(params);
+        if (res.code == 0) {
+          that.vrList = res.data.records;
+        } else {
+          that.vrList = [];
+          that.$message.error(res.msg);
+        }
+      }, 500);
+    },
+    // 关联文物查询
+    searchCR(queryString) {
+      let that = this;
+      if (!queryString.trim()) {
+        that.crList = [];
+        return;
+      }
+      that.loading = true;
+      const params = {
+        name: queryString,
+        page: "1",
+        limit: "100",
+      };
+      setTimeout(async () => {
+        that.loading = false;
+        const res = await this.getCrList({
+          params,
+          isReload: true,
+        });
+        if (res.code == 0) {
+          that.crList = res.data.records;
+        } else {
+          that.crList = [];
+          that.$message.error(res.msg);
+        }
+      }, 500);
+    },
+
+    // 取消编辑
+    cancelForm() {
+      if (this.loading) {
+        this.loading = false;
+      }
+      if (this.submitLoading) {
+        this.submitLoading = false;
+      }
+      this.reload();
+    },
+
+    handleToTop() {
+      let el = document.getElementById("dialog-content");
+      el.scrollIntoView({ block: "start", behavior: "smooth" });
+    },
+
+    loadRegionTree() {
+      function loopTree(arr) {
+        if (!arr || arr.length == 0) {
+          return;
+        }
+        arr.forEach((item) => {
+          if (item.children && item.children.length == 0) {
+            delete item.children;
+          } else {
+            loopTree(item.children);
+          }
+        });
+      }
+      let parentId = "";
+      this.getSysRegionTreeData(parentId).then((res) => {
+        this.regionTree = res;
+        loopTree(res);
+      });
+    },
+
+    handleChangeDisplay(dir) {
+      let index = this.currentPageIds.indexOf(this.currentId);
+      switch (dir) {
+        case "next":
+          if (this.currentPageIds[index + 1]) {
+            this.currentId = this.currentPageIds[index + 1];
+          } else {
+            this.$message.info("已经是此页最后一个！");
+          }
+          console.log("this.currentId", this.currentId);
+          break;
+        case "prev":
+          if (this.currentPageIds[index - 1]) {
+            this.currentId = this.currentPageIds[index - 1];
+          } else {
+            this.$message.info("已经是此页第一个！");
+          }
+          console.log("this.currentId", this.currentId);
+          break;
+      }
+    },
+    handleSubmit() {
+      // this.loading = true;
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          this.submitLoading = true;
+          // 添加文件并上传文件
+          this.uploadMediaFiles(this.mediaKeys, this.dialogForm)
+            .then((form) => {})
+            .catch((err) => {
+              console.log(err);
+              this.submitLoading = false;
+            });
+        }
+      });
+    },
+    /**
+     * 上传对应的媒体文件,并返回一个promise
+     * @param {array} dialogForm 当前需要提交的表单
+     * @param {array} mediaKeys 媒体keys数组
+     * @returns {object} 传入的媒体key对应的id字符串，多个以逗号隔开
+     */
+    async uploadMediaFiles(mediaKeys, dialogForm) {
+      console.log("doing uploadMediaFiles");
+      return new Promise(async (resolve, reject) => {
+        const formData = getNeedUploadFormData(this, mediaKeys);
+        const unitData = [...this.$refs["exhibitionUnits"].getUnitData()];
+        const oldUnitData = JSON.parse(JSON.stringify(unitData));
+        // console.log(123, unitData);
+        // return;
+        this.addUnitImageToFormData(unitData, formData);
+        try {
+          if (isFormDataHasData(formData)) {
+            this.loadingText = "正在上传文件...请耐心等待";
+            let upLoadRes = await uploadV1(formData);
+            if (upLoadRes.code == 0) {
+              this.dialogForm.exhibitionUnits = this.getNewUnits(
+                unitData,
+                upLoadRes
+              );
+              console.log(
+                "this.dialogForm.exhibitionUnits ",
+                this.dialogForm.exhibitionUnits
+              );
+              // return;
+              // 除去布展单元之外的id对象;
+              const newIdObj = getNewIdsObj(mediaKeys, upLoadRes);
+              //除去布展单元之外的ID对象
+              const oldIdObj = getOldIdsObj(mediaKeys, this.dialogForm);
+              //除去布展单元之外的合并后的id对象
+              const displayMediaForm = getMergedIdsObj(
+                oldIdObj,
+                newIdObj,
+                mediaKeys
+              );
+              this.dialogForm = Object.assign(
+                this.dialogForm,
+                displayMediaForm
+              );
+              // 除去布展单元之外的需要删除的id对象
+              const deleteIdArr = getDeleteFileArr(
+                oldIdObj,
+                newIdObj,
+                mediaKeys
+              );
+              const unitDeleteArr = getUnitDeleteArr(oldUnitData);
+              const delArr = [...deleteIdArr, ...unitDeleteArr];
+              handleDeleteFiles(delArr);
+              resolve(this.dialogForm);
+            }
+          } else {
+            console.log("uploadMediaFiles nothing to upload");
+
+            resolve(this.dialogForm);
+          }
+        } catch (error) {
+          console.error("uploadMediaFiles error");
+          reject(error);
+        }
+      });
+    },
+
+    /**
+     * 回填布展单元的字符串
+     */
+    backUpUnit(units, uploadRes) {
+      if (units.length > 0) {
+        // 每个unitItem下方都有自己的images,让images回填idsStr
+        units.forEach((item) => {
+          const obj = this.getUnitFileIdstr(item.euId, uploadRes);
+          // 将媒体id字符串回填上去
+          item = Object.assign(item.obj);
+        });
+        if (units.children) {
+          this.backUpUnit(units.children, uploadRes);
+        }
+      }
+    },
+    // 清空编辑组件中的所有值
+    reload() {
+      //父组件将清空form绑定的值
+      this.$emit("handleClose");
+      // 清空文献
+      this.literatureIdArr = [];
+      // 清空文物
+      this.crIds = [];
+      // this.literatureNames = [];
+      // 清空布展单元
+      this.exhibitionUnits = [
+        {
+          euId: 1, //后期去掉
+          // unit: "", //单元名称,如前言、第一单元，暂时忽略
+          title: "", //单元标题，类似主题名称
+          intro: "", //单元介绍
+          images: "", //图片id集合
+          videos: "", //视频id集合
+          crIds: [], //关联文物集合
+        },
+      ];
+
+      this.images = [];
+      this.videos = [];
+      this.audios = [];
+      this.faceImage = [];
+    },
+
+    handleClose(done) {
+      this.$confirm("确认关闭？")
+        .then((_) => {
+          done();
+          this.reload();
+          this.submitLoading = false;
+        })
+        .catch((_) => {});
+    },
+    refresh() {
+      this.$emit("refresh");
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.title {
+  display: flex;
+  margin-bottom: 16px;
+
+  .divider {
+    width: 8px;
+    border-left: 4px solid #409eff;
+    margin-right: 8px;
+  }
+
+  .label {
+    font-weight: bold;
+  }
+}
+
+.el-dialog-div {
+  height: 80vh;
+  overflow-x: hidden;
+}
+
+.dialog-content {
+  padding: 0 32px;
+  display: flex;
+
+  .basic-info {
+    flex: 1;
+    margin-right: 48px;
+  }
+
+  .relate {
+    flex: 1;
+  }
+}
+
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+  margin: 20px 50px;
+  position: sticky;
+  bottom: 0;
+}
+
+.video-lists {
+  display: flex;
+}
+
+::v-deep .el-dialog__body {
+  position: relative;
+}
+
+.btn {
+  width: 80px;
+  height: 80px;
+  border: 2px solid #fff;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  top: 40%;
+  cursor: pointer;
+
+  i {
+    font-size: 50px;
+    color: #fff;
+  }
+}
+
+.prev {
+  left: -8%;
+}
+
+.next {
+  right: -8%;
+}
+</style>

src/views/display/components/InfoEditDialog.vue

@@ -177,7 +177,7 @@
 
               <el-form-item label="关联文献" :label-width="formLabelWidth">
                 <el-select
-                  v-model="literatureValues"
+                  v-model="literatureIdArr"
                   multiple
                   filterable
                   remote
@@ -321,6 +321,14 @@
           :disabled="loading"
           >保存并提交审核
         </el-button>
+        <!-- <el-button
+          size="mini"
+          type="primary"
+          @click="handleSubmit"
+          icon="el-icon-circle-check"
+          :disabled="loading"
+          >提交
+        </el-button> -->
       </div>
     </div>
     <el-tooltip
@@ -355,14 +363,37 @@
 </template>
 
 <script>
-import { addDisplay, editDisplay } from "@/api/display";
-import { mapGetters } from "vuex";
+import { addOrUpdateDisplayTemp } from "@/api/display";
+import { mapGetters, mapActions } from "vuex";
 import ExhibitionUnit from "./ExhibitionUnit.vue";
 import { uploadV1 } from "@/utils/file";
 import { themeTypeOptions } from "../contants";
 import { deleteFiles } from "@/api/file";
 import { getVirtualListPer } from "@/api/vitual";
-
+import { rules } from "../configs/validateRules";
+import { pageSelectUrl, upLoadAddress } from "../configs/urls";
+import transformData from "@/utils/transformData";
+import fileUploadFunctions from "@/utils/fileUploadFuctions";
+import unitsFunctions from "./units";
+const {
+  faceImageToClient,
+  literatureIdArrToStr,
+  literatureListToIds,
+  statusBoolToNum,
+  statusStrToBool,
+  getDeptIdArr,
+  getDeptIdStr,
+  file3dToClient,
+} = transformData;
+const {
+  getNeedUploadFormData,
+  getNewIdsObj,
+  getOldIdsObj,
+  getMergedIdsObj,
+  getDeleteFileArr,
+  isFormDataHasData,
+  isFileRaw,
+} = fileUploadFunctions;
 export default {
   name: "InfoEditDialog",
   components: {
@@ -405,140 +436,31 @@ export default {
     },
     form: {
       handler: function (value) {
-        if (value) {
-          this.dialogForm = JSON.parse(JSON.stringify(value));
-          if (!this.dialogForm.exhibitionId) {
-            this.dialogForm.deptId = this.userInfo.deptId;
-            this.dialogForm.regionCode = this.userInfo.regionCode;
-          } else {
-            this.currentId = this.dialogForm.exhibitionId;
-          }
-          if (
-            this.dialogForm.exhibitionUnits &&
-            this.dialogForm.exhibitionUnits.length > 0
-          ) {
-            loopUnit(this.dialogForm.exhibitionUnits);
-            function loopUnit(arr) {
-              arr.forEach((unit) => {
-                if (unit.length > 0) {
-                  // 如果有文物，回填文物
-                  if (unit.culturalRelics && uni.culturalRelics.length > 0) {
-                    this.$set(unit, "crIds", unit.culturalRelics);
-                  }
-                  if (unit.children) {
-                    loopUnit(unit.children);
-                  }
-                }
-              });
-            }
-          }
-          // 回填媒体资源
-          if (
-            this.dialogForm.faceImageUrl ||
-            this.dialogForm.faceImagePressUrl
-          ) {
-            this.faceImage = [
-              {
-                name: "",
-                url: this.dialogForm.faceImageUrl || "",
-                pressUrl:
-                  this.dialogForm.faceImagePressUrl ||
-                  this.dialogForm.faceImageUrl ||
-                  "",
-                fileId: this.dialogForm.faceImage || "",
-              },
-            ];
-          } else {
-            this.faceImage = [];
-          }
-          this.images = this.dialogForm.imagesVo || [];
-          this.videos = this.dialogForm.videosVo || [];
-          this.audios = this.dialogForm.audiosVo || [];
-
-          // 编辑
-          // 回填状态
-          this.dialogForm.status = Boolean(Number(this.dialogForm.status));
-          // 回填文献
-          this.literatureValues = [];
-
-          if (
-            this.dialogForm.literatureVo &&
-            this.dialogForm.literatureVo.length > 0
-          ) {
-            this.literatureList = this.dialogForm.literatureVo;
-            this.dialogForm.literatureVo.forEach((lt) => {
-              if (this.literatureValues) {
-                this.literatureValues.push(lt.literatureId);
-              }
-            });
-          }
-          // 回填文物
-          this.crIds = [];
-          if (
-            this.dialogForm.culturalRelicVo &&
-            this.dialogForm.culturalRelicVo.length > 0
-          ) {
-            this.crList = this.dialogForm.culturalRelicVo;
-            this.dialogForm.culturalRelicVo.forEach((cr) => {
-              if (this.crIds) {
-                this.crIds.push(cr.crId);
-              }
-            });
-          }
-          // 回填虚拟展厅
-          this.vrIds = [];
-          if (
-            this.dialogForm.virtualVo &&
-            this.dialogForm.virtualVo.length > 0
-          ) {
-            this.vrList = this.dialogForm.virtualVo;
-            this.dialogForm.virtualVo.forEach((vr) => {
-              if (this.vrIds) {
-                this.vrIds.push(vr.bvId);
-              }
-            });
-          }
-          // 回填展览单位
-          // if (this.dialogForm.deptId) {
-          //   this.dialogForm.deptId = this.dialogForm.deptId;
-          // }
+        if (!value) {
+          return;
         }
+        this.coverServerData(value);
       },
       immediate: true,
     },
     "dialogForm.themeType": {
       handler: function (value) {
         switch (value) {
-          case "1":
-            console.log("默认主题");
-            this.imagesAdvice = "";
-            break;
           case "2":
-            console.log("中国风");
             this.imagesAdvice =
               "中国风主题建议上传10张以上的展览图片，效果更好";
             break;
-          case "3":
-            console.log("红色主题");
+          default:
             this.imagesAdvice = "";
             break;
         }
       },
     },
-
     currentId(value) {
       this.$emit("changeDisplay", value);
     },
   },
   data() {
-    let that = this;
-    var checkFaceImage = (rule, value, callback) => {
-      if (that.faceImage.length == 0) {
-        return callback(new Error("请上传封面"));
-      } else {
-        callback();
-      }
-    };
     return {
       dialogForm: {
         ...this.form,
@@ -547,22 +469,19 @@ export default {
       loading: false,
       submitLoading: false,
       loadingText: "",
-      upLoadAddress: process.env.VUE_APP_BASE_API + "/sysFiles/upload",
       typeOptions: [{ label: "展览类型", value: 1 }], //后期从vuex中取
       disabled: false,
       exhibitionUnits: [],
       literatureList: [], //文献列表
-      literatureValues: [], //选中的文献列表
+      literatureIdArr: [], //选中的文献列表
       crList: [], //文物列表
       crIds: [], //选中的文物列表
       vrList: [], //虚拟展厅列表
       vrIds: [],
-      // showUnit: false,
       faceImage: [],
       images: [],
       videos: [],
       audios: [],
-      pageSelectUrl: "/api/bizCulturalRelic/listByPage",
       orgTreeData: [],
       optionProps: {
         value: "id",
@@ -577,37 +496,118 @@ export default {
         checkStrictly: true,
       },
       regionTree: [],
-      rules: {
-        title: [{ required: true, message: "请输入展览标题", trigger: "blur" }],
-        // faceImage: [
-        //   { required: true, validator: checkFaceImage, trigger: "change" },
-        // ],
-        deptId: [
-          { required: true, message: "请填写展览单位", trigger: "change" },
-        ],
-        intro: [{ required: true, message: "请填写展览介绍", trigger: "blur" }],
-      },
       imagesAdvice: "",
       dialogVisible: false,
       nextDiaplayId: null,
       prevDiaplayId: null,
       currentId: null,
+      pageSelectUrl,
+      upLoadAddress,
+      rules,
+      mediaKeys: ["faceImage", "images", "videos", "audios"],
     };
   },
   async created() {
-    await this.$store.dispatch("dict/getDictList", [
-      "displayType",
-      "displayCharacter",
-    ]);
-    this.$store.dispatch("org/getMuseumTreeData", false).then((res) => {
-      // this.orgTreeData = res[0].children; //去掉根节点的文旅厅
-      this.orgTreeData = res;
-    });
-
+    await this.getDictList(["displayType", "displayCharacter"]);
+    this.orgTreeData = await this.getMuseumTreeData(false);
     this.loadRegionTree();
   },
 
   methods: {
+    ...mapActions("dict", ["getDictList", "getLtList", "getCrList"]),
+    ...mapActions("org", ["getMuseumTreeData", "getSysRegionTreeData"]),
+    ...unitsFunctions, //全部导入布展单元的所有函数
+    coverServerData(value) {
+      if (value) {
+        this.dialogForm = JSON.parse(JSON.stringify(value));
+        if (!this.dialogForm.exhibitionId) {
+          this.dialogForm.deptId = this.userInfo.deptId;
+          this.dialogForm.regionCode = this.userInfo.regionCode;
+        } else {
+          this.currentId = this.dialogForm.exhibitionId;
+        }
+        const {
+          faceImageUrl,
+          faceImagePressUrl,
+          imagesVo,
+          videosVo,
+          audiosVo,
+          status,
+          literatureVo,
+          deptId,
+          exhibitionUnits,
+        } = this.dialogForm;
+        this.faceImage = faceImageToClient(faceImagePressUrl, faceImageUrl);
+        this.images = imagesVo || [];
+        this.videos = videosVo || [];
+        this.audios = audiosVo || [];
+        this.crList = this.getClientCrList();
+        this.crIds = this.getClientCrIds();
+        this.vrList = this.getClientVrList();
+        this.vrIds = this.getClientVrIds();
+        this.dialogForm.status = statusStrToBool(status);
+        this.literatureIdArr = literatureListToIds(literatureVo);
+        this.dialogForm.deptId = getDeptIdArr(deptId, this.userInfo);
+        this.dialogForm.exhibitionUnits = this.getClientUnit(exhibitionUnits);
+      }
+    },
+    // 获取前端需要的文物list
+    getClientCrList(culturalRelicVo) {
+      if (!culturalRelicVo || culturalRelicVo.length == 0) {
+        return;
+      }
+      return culturalRelicVo;
+    },
+    // 获取前端需要的文物id合集
+    getClientCrIds(culturalRelicVo) {
+      if (!culturalRelicVo || culturalRelicVo.length == 0) {
+        return;
+      }
+      const crIds = culturalRelicVo.map((item) => {
+        return item.crId;
+      });
+      return crIds;
+    },
+
+    // 获取前端需要的虚拟展list
+    getClientVrList(virtualVo) {
+      if (!virtualVo || virtualVo.length == 0) {
+        return;
+      }
+      return virtualVo;
+    },
+    // 获取前端需要的虚拟展id合集
+    getClientVrIds(virtualVo) {
+      if (!virtualVo || virtualVo.length == 0) {
+        return;
+      }
+      const vrIds = virtualVo.map((item) => {
+        return item.bvId;
+      });
+      return vrIds;
+    },
+    // 获取前端需要的布展单元
+    getClientUnit(exhibitionUnits) {
+      function loopUnit(arr) {
+        arr.forEach((unit) => {
+          if (unit.length > 0) {
+            // 如果有文物，回填文物
+            if (unit.culturalRelics && uni.culturalRelics.length > 0) {
+              this.$set(unit, "crIds", unit.culturalRelics);
+            }
+            if (unit.children) {
+              loopUnit(unit.children);
+            }
+          }
+        });
+        return arr;
+      }
+      if (!exhibitionUnits || exhibitionUnits.length == 0) {
+        return;
+      }
+      const newUnits = loopUnit(exhibitionUnits);
+      return newUnits;
+    },
     // 关联文献查询
     searchLiterature(queryString) {
       if (!queryString.trim()) {
@@ -622,7 +622,7 @@ export default {
       };
       setTimeout(async () => {
         this.loading = false;
-        const res = await this.$store.dispatch("dict/getLtList", params);
+        const res = await this.getLtList(params);
         if (res.code == 0) {
           this.literatureList = res.data.records;
         } else {
@@ -670,10 +670,9 @@ export default {
         page: "1",
         limit: "100",
       };
-
       setTimeout(async () => {
         that.loading = false;
-        const res = await that.$store.dispatch("dict/getCrList", {
+        const res = await this.getCrList({
           params,
           isReload: true,
         });
@@ -703,21 +702,22 @@ export default {
     },
 
     loadRegionTree() {
+      function loopTree(arr) {
+        if (!arr || arr.length == 0) {
+          return;
+        }
+        arr.forEach((item) => {
+          if (item.children && item.children.length == 0) {
+            delete item.children;
+          } else {
+            loopTree(item.children);
+          }
+        });
+      }
       let parentId = "";
-      this.$store.dispatch("org/getSysRegionTreeData", parentId).then((res) => {
+      this.getSysRegionTreeData(parentId).then((res) => {
         this.regionTree = res;
-        loopTree(this.regionTree);
-        function loopTree(arr) {
-          if (arr && arr.length > 0) {
-            arr.forEach((item) => {
-              if (item.children && item.children.length == 0) {
-                delete item.children;
-              } else {
-                loopTree(item.children);
-              }
-            });
-          }
-        }
+        loopTree(res);
       });
     },
 
@@ -747,7 +747,6 @@ export default {
       this.$refs.form.validate(async (valid) => {
         if (valid) {
           this.submitLoading = true;
-
           var that = this;
           let formData = new FormData();
           // 已存在的文件的对象
@@ -755,9 +754,9 @@ export default {
           // 需要被删除的文件Id
           let deleteFileArr = [];
           // 添加布展本身的媒体文件至formData
-          const mediaArr = ["faceImage", "images", "videos", "audios"];
+          const mediaKeys = ["faceImage", "images", "videos", "audios"];
           let newFiles = {}; //key：字段名或者单元id名, value:不同媒体或单元已经存在的文件id数组
-          mediaArr.map((media) => {
+          mediaKeys.map((media) => {
             let files = [...this.$refs[media].getFiles()];
             let fileIds = []; //不同媒体或单元已经存在的文件id数组
             files.map((f) => {
@@ -776,7 +775,7 @@ export default {
             newFiles[media] = fileIds;
           });
 
-          mediaArr.map((media) => {
+          mediaKeys.map((media) => {
             if (this.dialogForm[media]) {
               let oldFileIdArr = this.dialogForm[media].split(",");
               oldFileIdArr.map((oldId) => {
@@ -866,7 +865,7 @@ export default {
             }
           }
           // 2、回填布展自带的媒体文件
-          mediaArr.forEach((media) => {
+          mediaKeys.forEach((media) => {
             if (filesObj[media]) {
               this.dialogForm[media] = filesObj[media].join(",");
             } else {
@@ -919,112 +918,135 @@ export default {
               });
             }
           }
+          const params = {
+            ...this.dialogForm,
+            exhibitionUnits: unitData,
+          };
+          params.literature = this.literatureIdArr.join(",");
+          params.status = this.dialogForm.status ? 1 : 0;
+          params.crIds = this.crIds.join(",");
+          params.bvIds = this.vrIds.join(",");
+          params.displayCharacter = 1; //传布展
+          params.submitFlag = submitFlag;
+          addOrUpdateDisplayTemp(params)
+            .then((res) => {
+              if (res.code == 0) {
+                setTimeout(() => {
+                  this.$emit("refresh");
+                  this.reload();
+                  this.submitLoading = false;
+                  this.$message.success("提交成功！");
+                }, 1000);
+              }
+            })
+            .catch((err) => {
+              this.submitLoading = false;
+            });
+          // if (!that.dialogForm.exhibitionId) {
+          //   this.loadingText = "正在处理展览数据...请耐心等待";
+          //   const params = {
+          //     ...this.dialogForm,
+          //     exhibitionUnits: unitData,
+          //   };
+          //   params.literature = this.literatureIdArr.join(",");
+          //   params.status = this.dialogForm.status ? 1 : 0;
+          //   params.crIds = this.crIds.join(",");
+          //   params.bvIds = this.vrIds.join(",");
+          //   params.displayCharacter = 1; //传布展
+          //   params.submitFlag = submitFlag;
+          //   addDisplay(params)
+          //     .then((res) => {
+          //       if (res.code == 0) {
+          //         setTimeout(() => {
+          //           this.$emit("refresh");
+          //           this.reload();
+          //           this.submitLoading = false;
+          //           this.$message.success("新增展览成功！");
+          //         }, 1000);
+          //       }
+          //     })
+          //     .catch((err) => {
+          //       this.submitLoading = false;
+          //     });
+          // } else {
+          //   this.loadingText = "正在处理展览数据...请耐心等待";
+          //   const {
+          //     exhibitionId,
+          //     title,
+          //     type,
+          //     keyword,
+          //     intro,
+          //     themeType,
+          //     remark,
+          //     faceImage,
+          //     faceImageUrl,
+          //     images,
+          //     audios,
+          //     videos,
+          //     regionCode,
+          //     deptId,
+          //     displayCharacter,
+          //   } = this.dialogForm;
+          //   let literature = this.literatureIdArr.join(",");
+          //   let crIds = this.crIds.join(",");
+          //   let bvIds = this.vrIds.join(",");
+          //   let status = this.dialogForm.status ? 1 : 0;
 
-          if (!that.dialogForm.exhibitionId) {
-            this.loadingText = "正在处理展览数据...请耐心等待";
-            const params = {
-              ...this.dialogForm,
-              exhibitionUnits: unitData,
-            };
-            params.literature = this.literatureValues.join(",");
-            params.status = this.dialogForm.status ? 1 : 0;
-            params.crIds = this.crIds.join(",");
-            params.bvIds = this.vrIds.join(",");
-            params.displayCharacter = 1; //传布展
-            params.submitFlag = submitFlag;
-            addDisplay(params)
-              .then((res) => {
-                if (res.code == 0) {
-                  setTimeout(() => {
-                    this.$emit("refresh");
-                    this.reload();
-                    this.submitLoading = false;
-                    this.$message.success("新增展览成功！");
-                  }, 1000);
-                }
-              })
-              .catch((err) => {
-                this.submitLoading = false;
-              });
-          } else {
-            this.loadingText = "正在处理展览数据...请耐心等待";
-            const {
-              exhibitionId,
-              title,
-              type,
-              keyword,
-              intro,
-              themeType,
-              remark,
-              faceImage,
-              faceImageUrl,
-              images,
-              audios,
-              videos,
-              regionCode,
-              deptId,
-              displayCharacter,
-            } = this.dialogForm;
-            let literature = this.literatureValues.join(",");
-            let crIds = this.crIds.join(",");
-            let bvIds = this.vrIds.join(",");
-            let status = this.dialogForm.status ? 1 : 0;
-
-            // return;
-            const params = {
-              exhibitionId,
-              title,
-              type,
-              keyword,
-              intro,
-              themeType,
-              remark,
-              audios,
-              deptId,
-              faceImage,
-              faceImageUrl,
-              images,
-              regionCode,
-              videos,
-              status,
-              literature,
-              crIds,
-              bvIds,
-              displayCharacter,
-              exhibitionUnits: unitData,
-            };
-            // 处理馆藏单位
-            if (params.deptId instanceof Array) {
-              params.deptId = params.deptId[params.deptId.length - 1];
-            }
+          //   // return;
+          //   const params = {
+          //     exhibitionId,
+          //     title,
+          //     type,
+          //     keyword,
+          //     intro,
+          //     themeType,
+          //     remark,
+          //     audios,
+          //     deptId,
+          //     faceImage,
+          //     faceImageUrl,
+          //     images,
+          //     regionCode,
+          //     videos,
+          //     status,
+          //     literature,
+          //     crIds,
+          //     bvIds,
+          //     displayCharacter,
+          //     exhibitionUnits: unitData,
+          //   };
+          //   // 处理馆藏单位
+          //   if (params.deptId instanceof Array) {
+          //     params.deptId = params.deptId[params.deptId.length - 1];
+          //   }
 
-            if (deleteFileArr.length > 0) {
-              await deleteFiles(deleteFileArr);
-            }
-            params.submitFlag = submitFlag;
+          //   if (deleteFileArr.length > 0) {
+          //     await deleteFiles(deleteFileArr);
+          //   }
+          //   params.submitFlag = submitFlag;
 
-            editDisplay(params)
-              .then(async (res) => {
-                let deleteRes;
-                // console.log(res);
-                // return
+          //   editDisplay(params)
+          //     .then(async (res) => {
+          //       let deleteRes;
+          //       // console.log(res);
+          //       // return
 
-                if (res.code == 0) {
-                  this.$emit("refresh");
-                  this.reload();
+          //       if (res.code == 0) {
+          //         this.$emit("refresh");
+          //         this.reload();
 
-                  setTimeout(() => {
-                    this.loadingText = "上传完毕";
-                    this.submitLoading = false;
-                    this.$message.success("修改成功！");
-                  }, 1000);
-                }
-              })
-              .catch((err) => {
-                console.log("err", err);
-                this.submitLoading = false;
-              });
-          }
+          //         setTimeout(() => {
+          //           this.loadingText = "上传完毕";
+          //           this.submitLoading = false;
+          //           this.$message.success("修改成功！");
+          //         }, 1000);
+          //       }
+          //     })
+          //     .catch((err) => {
+          //       console.log("err", err);
+          //       this.submitLoading = false;
+          //     });
+          // }
         }
       });
     },
@@ -1033,7 +1055,7 @@ export default {
       //父组件将清空form绑定的值
       this.$emit("handleClose");
       // 清空文献
-      this.literatureValues = [];
+      this.literatureIdArr = [];
       // 清空文物
       this.crIds = [];
       // this.literatureNames = [];

src/views/display/components/units.js

+import fileUploadFuctions from "@/utils/fileUploadFuctions";
+const unitsFunctions = {
+    /**
+     * 获取新的布展单元，实装媒体id，
+     * @param {*} exhibitionUnits 
+     * @param {*} upLoadRes 
+     * @returns 
+     */
+    getNewUnits(exhibitionUnits, upLoadRes) {
+        const unitCopy = JSON.parse(JSON.stringify(exhibitionUnits))//不要修改原本的数据
+        const callback = (arr) => {
+            arr.forEach(unitItem => {
+                // 每一个unitItem有自己的euid，有唯一的一个images,唯一的一个videos
+                // 目的是要让每一个unitItem的images，videos实装回去,crId拼接回去
+                // mediaObj形如{
+                //     images: "1,2,3",
+                //     videos: "4,5,6",
+                //   }
+                const mediaForm = unitsFunctions.getMediaForm(unitItem, upLoadRes)
+                const crForm = unitsFunctions.getCrForm(unitItem)
+                unitItem = Object.assign(unitItem, mediaForm, crForm)
+            });
+        }
+        // 遍历布展单元，并执行callback
+        unitsFunctions.loopUnits(unitCopy, callback)
+        return unitCopy
+    },
+
+    getMediaForm(unitItem, upLoadRes) {
+        const { euId } = unitItem
+        const mediaForm = unitsFunctions.getUnitFileIdstrObj(euId, upLoadRes)
+        return mediaForm
+    },
+
+    getCrForm(unitItem) {
+        const obj = {
+            crIds: ''
+        }
+        const { crIds } = unitItem
+        if (crIds instanceof Array) {
+            obj.crIds = crIds.join(",");
+        } else if (crIds) {
+            obj.crIds = crIds
+        }
+        return obj
+    },
+    /**
+     * 
+     * @param {Array} arr 布展单元的数组
+     * @param {Function} callback 循环处理什么事
+     */
+    loopUnits(arr, callback) {
+        if (arr.length > 0) {
+            callback(arr)
+            if (arr.children) {
+                unitsFunctions.loopUnits(arr.children, callback)
+            }
+        }
+    },
+    /**
+ * 获取布展单元下面的媒体的id字符串
+ * @param {String} euId 布展单元的key euId
+ * @param {String} res 上传后的结果 如unit-images-${euid}
+ * @returns {Obj} euId对应媒体文件ID字符串
+ * 形如{
+    images: "1,2,3",
+    videos: "4,5,6",
+}item.fileId
+*/
+    getUnitFileIdstrObj(euId, res) {
+        const obj = {};
+        const unitMediaKeys = ["images"];
+        const unitMediaFileIdArr = unitMediaKeys.map((mediaKey) => {
+            const filterArr = res.data.filter((item) => {
+                // 如果是当前的euId下的文件
+                const str1 = `unit-${mediaKey}-${euId}`
+                const arr = item.fileKey.split('-')
+                const str2 = arr.slice(0, 3).join('-') //前三位拼接
+                return str1 === str2
+            });
+            const arr = filterArr.map(item => {
+                return item.fileId
+            })
+            return arr;
+        });
+        unitMediaKeys.forEach((key, index) => {
+            if (unitMediaFileIdArr[index].length > 0) {
+                obj[key] = unitMediaFileIdArr[index].join(",");
+            } else {
+                obj[key] = "";
+            }
+        });
+        return obj;
+    },
+
+    /**
+ * 添加布展单元的图片至formData
+ * @param {array} unitData 布展单元数据
+ * @param {FormData} formData 需要上传的表单
+ */
+    addUnitImageToFormData(unitData, formData) {
+        const callback = (arr) => {
+            arr.forEach(unitItem => {
+                unitsFunctions.appendMediaItemToFormData(unitItem, formData, "images");
+            })
+        }
+        unitsFunctions.loopUnits(unitData, callback)
+    },
+    /**
+     * 添加布展单元媒体item至formData
+     * @param {array} unitItem 布展单元的item
+     * @param {FormData} media 表单中存储ids的key
+     * @param {FormData} mediaVo 表单中存储文件List的key
+     */
+    appendMediaItemToFormData(unitItem, formData, mediaKey) {
+        const mediaVo = unitItem[`${mediaKey}Vo`];
+        if (mediaVo && mediaVo.length > 0) {
+            mediaVo.forEach((file, index) => {
+                if (fileUploadFuctions.isFileRaw(file)) {
+                    const uploadKey = `unit-${mediaKey}-${unitItem.euId}-${index}`;
+                    formData.append(uploadKey, file.raw);
+                }
+            });
+        }
+    },
+
+    getUnitDeleteArr(newUnit, oldUnit) {
+        const deleteArr = []
+
+        return deleteArr
+    }
+}
+
+export default unitsFunctions
\ No newline at end of file

src/views/display/configs/list.js

@@ -44,7 +44,7 @@ export const searchConfig = [
   },
 ];
 
-export const title = [
+export const passedTitle = [
   {
     prop: "title",
     label: "标题",
@@ -118,6 +118,97 @@ export const title = [
     sortable: true,
   },
 
+  {
+    prop: "status",
+    label: "是否上架",
+    columnAlign: "center",
+    isStatus: true,
+  },
+  {
+    prop: "themeType",
+    label: "模板主题",
+    columnAlign: "center",
+  },
+  {
+    prop: "remark",
+    label: "备注",
+    columnAlign: "center",
+    showOverFlowToolTip: true,
+  },
+  // {
+  //   prop: "images",
+  //   label: "展览图片",
+  //   columnAlign: 'center',
+  //   isImages: true
+  // },
+  // {
+  //   prop: "audios",
+  //   label: "展览音频",
+  //   columnAlign: 'center',
+  //   isAudios: true
+  // },
+  // {
+  //   prop: "videos",
+  //   label: "展览视频",
+  //   columnAlign: 'center',
+  //   isVideos: true
+  // },
+];
+export const unPassedTitle = [
+  {
+    prop: "title",
+    label: "标题",
+    columnAlign: "center",
+    width: 120,
+    showOverFlowToolTip: true,
+  },
+  {
+    prop: "keyword",
+    label: "关键词",
+    columnAlign: "center",
+    showOverFlowToolTip: true,
+  },
+  {
+    prop: "type",
+    label: "展览类型",
+    columnAlign: "center",
+    isDisplayType: true,
+    showOverFlowToolTip: true,
+  },
+
+  {
+    prop: "deptName",
+    label: "展览单位",
+    columnAlign: "center",
+    showOverFlowToolTip: true,
+  },
+  {
+    prop: "regionName",
+    label: "所在地区",
+    columnAlign: "center",
+    showOverFlowToolTip: true,
+  },
+
+  {
+    prop: "faceImageUrl",
+    label: "封面",
+    columnAlign: "center",
+    isFaceImage: true,
+    width: 130,
+  },
+
+  // {
+  //   prop: "intro",
+  //   label: "展览介绍",
+  //   columnAlign: 'center',
+  // },
+
+  // {
+  //   prop: "literature",
+  //   label: "关联文献",
+  //   columnAlign: 'center',
+  //   width:100
+  // },
   {
     prop: "status",
     label: "是否上架",
@@ -169,13 +260,13 @@ export const title = [
 export const operates = {
   operate: true,
   label: "操作",
-  width: "320px",
-  minwidth: "220px",
+  width: "140px",
   titleAlign: "center",
   columnAlign: "center",
 };
 
-export const operations = [
+// 临时表
+export const operationsTemp = [
   {
     type: "view",
     title: "预览",
@@ -184,10 +275,18 @@ export const operations = [
     type: "edit",
     title: "编辑",
   },
-  // {
-  //   type: 'approval',
-  //   title: '提交审核'
-  // },
+  {
+    type: "delete",
+    title: "删除",
+  },
+];
+
+// 最终表
+export const operations = [
+  {
+    type: "edit",
+    title: "编辑",
+  },
   {
     type: "delete",
     title: "删除",

src/views/display/configs/urls.js

+export const pageSelectUrl = "/api/bizCulturalRelic/listByPage"
+export const upLoadAddress = process.env.VUE_APP_BASE_API + "/sysFiles/upload"
\ No newline at end of file

src/views/display/configs/validateRules.js

+export const rules = {
+  title: [{ required: true, message: "请输入展览标题", trigger: "blur" }],
+  deptId: [
+    { required: true, message: "请填写展览单位", trigger: "change" },
+  ],
+  intro: [{ required: true, message: "请填写展览介绍", trigger: "blur" }],
+}
\ No newline at end of file

src/views/display/index.vue

@@ -55,87 +55,97 @@
         </el-upload>
       </div>
     </div>
-    <TablePage
-      :data="list.records"
-      :tableTitle="tableTitle"
-      :operates="tableOperates"
-    >
-      <template v-slot:status="data">
-        <el-popconfirm
-          :title="getStatusTitle(data.scope.status)"
-          @confirm="handleChangeStatus(data.scope)"
-          v-if="!isDisabledStatusbtn(data.scope.checkStatus)"
-        >
+    <div class="list">
+      <el-tabs v-model="tabActive">
+        <el-tab-pane label="待办" name="unPassed"></el-tab-pane>
+        <el-tab-pane label="已审核通过" name="passed"></el-tab-pane>
+      </el-tabs>
+      <TablePage
+        :data="getCurrentList().records"
+        :tableTitle="getTitle"
+        :operates="operates"
+      >
+        <template v-slot:status="data">
+          <el-popconfirm
+            :title="getStatusTitle(data.scope.status)"
+            @confirm="handleChangeStatus(data.scope)"
+            v-if="!isDisabledStatusbtn(data.scope.checkStatus)"
+          >
+            <el-switch
+              slot="reference"
+              :disabled="isDisabledStatusbtn(data.scope.checkStatus)"
+              :value="Boolean(Number(data.scope.status))"
+            ></el-switch>
+          </el-popconfirm>
           <el-switch
             slot="reference"
             :disabled="isDisabledStatusbtn(data.scope.checkStatus)"
             :value="Boolean(Number(data.scope.status))"
+            v-else
           ></el-switch>
-        </el-popconfirm>
-        <el-switch
-          slot="reference"
-          :disabled="isDisabledStatusbtn(data.scope.checkStatus)"
-          :value="Boolean(Number(data.scope.status))"
-          v-else
-        ></el-switch>
-      </template>
-      <template v-slot:displayType="data">
-        {{ dicts.displayType[data.scope.type] }}
-      </template>
-      <template v-slot:checkStatus="data">
-        <!-- {{ data.scope.checkStatus }} -->
-        <el-tag type="primary" v-if="data.scope.checkStatus == 0">
-          审核中
-        </el-tag>
-        <el-tag type="success" v-if="data.scope.checkStatus == 1">
-          已通过
-        </el-tag>
-        <el-tag type="danger" v-if="data.scope.checkStatus == -2">
-          已驳回
-        </el-tag>
-        <el-tag type="warning" v-if="data.scope.checkStatus == -1">
-          待提交
-        </el-tag>
-      </template>
-      <template v-slot:faceImageUrl="data">
-        <img
-          :src="
-            $getFullUrl(data.scope.faceImagePressUrl || data.scope.faceImageUrl)
-          "
-          alt="暂无图片"
-          v-if="
-            $getFullUrl(data.scope.faceImagePressUrl || data.scope.faceImageUrl)
-          "
-          style="cursor: pointer"
-          width="100px"
-          @click="handelPreviewImages(data.scope.faceImageUrl)"
-        />
-      </template>
-      <template v-slot:themeType="data">
-        {{ themeTypeCode(data.scope.themeType) }}
-      </template>
-      <template v-slot:operates="scope">
-        <TableOperation
-          :operations="tableOperations"
-          :rawData="scope.scope.row"
-          @handleOperation="handleOperation"
-          :disabled="isDisabled(scope.scope.row.checkStatus)"
-        >
-        </TableOperation>
-      </template>
-    </TablePage>
-    <el-pagination
-      style="margin: 16px 0"
-      @size-change="handleSizeChange"
-      @current-change="handleCurrentChange"
-      :current-page="Number(list.current)"
-      :page-sizes="[10, 20, 50, 100]"
-      :page-size="Number(list.size)"
-      layout="total, sizes, prev, pager, next, jumper"
-      :total="Number(list.total)"
-      class="pagination"
-    >
-    </el-pagination>
+        </template>
+        <template v-slot:displayType="data">
+          {{ dicts.displayType[data.scope.type] }}
+        </template>
+        <template v-slot:checkStatus="data">
+          <!-- {{ data.scope.checkStatus }} -->
+          <el-tag type="primary" v-if="data.scope.checkStatus == 0">
+            审核中
+          </el-tag>
+          <el-tag type="success" v-if="data.scope.checkStatus == 1">
+            已通过
+          </el-tag>
+          <el-tag type="danger" v-if="data.scope.checkStatus == -2">
+            已驳回
+          </el-tag>
+          <el-tag type="warning" v-if="data.scope.checkStatus == -1">
+            待提交
+          </el-tag>
+        </template>
+        <template v-slot:faceImageUrl="data">
+          <img
+            :src="
+              $getFullUrl(
+                data.scope.faceImagePressUrl || data.scope.faceImageUrl
+              )
+            "
+            alt="暂无图片"
+            v-if="
+              $getFullUrl(
+                data.scope.faceImagePressUrl || data.scope.faceImageUrl
+              )
+            "
+            style="cursor: pointer"
+            width="100px"
+            @click="handelPreviewImages(data.scope.faceImageUrl)"
+          />
+        </template>
+        <template v-slot:themeType="data">
+          {{ themeTypeCode(data.scope.themeType) }}
+        </template>
+        <template v-slot:operates="scope">
+          <TableOperation
+            :operations="getOperations"
+            :rawData="scope.scope.row"
+            @handleOperation="handleOperation"
+          >
+          </TableOperation>
+        </template>
+      </TablePage>
+      <el-pagination
+        style="margin: 16px 0"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="Number(list.current)"
+        :page-sizes="[10, 20, 50, 100]"
+        :page-size="Number(list.size)"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="Number(list.total)"
+        class="pagination"
+      >
+      </el-pagination>
+    </div>
+
     <InfoEditDialog
       :visible="editDialogVisible"
       :form="form"
@@ -173,11 +183,18 @@
 </template>
 
 <script>
-import { title, operates, operations } from "./configs/list";
+import {
+  passedTitle,
+  unPassedTitle,
+  operates,
+  operations,
+  operationsTemp,
+} from "./configs/list";
 import {
   getListPer,
+  getListPerTemp,
   deleteDisplay,
-  getDisplayById,
+  getDisplayByIdTemp,
   editDisplay,
 } from "@/api/display";
 import InfoEditDialog from "./components/InfoEditDialog";
@@ -194,22 +211,25 @@ export default {
   components: {
     InfoEditDialog,
     PreviewDialog,
-    SearchBar,
     ImportRecordDialog,
     UploadListDialog,
   },
   data() {
-    let that = this;
     return {
+      // （存放两份数据的目的是为了防止切换的时候分页被重置）
+      //最终表
       list: {
-        record: [],
+        records: [],
         size: 10,
         current: 1,
         total: 0,
       },
-      searchForm: {
-        name: "",
-        status: "",
+      // 临时表
+      listTemp: {
+        records: [],
+        size: 10,
+        current: 1,
+        total: 0,
       },
       searchConfig,
       editDialogVisible: false,
@@ -250,16 +270,16 @@ export default {
       uploadCount: 0, //处于上传中的文件数量，当等于fileList的时候就关闭弹窗，请求完毕一个就++
       cancelUploadArr: [], //保存每个文件上传接口对应的取消请求的函数[fn,fn,fn...]
       isUpLoading: false,
+      tabActive: "unPassed",
+      passedTitle,
+      unPassedTitle,
+      operates,
+      operations,
+      operationsTemp,
     };
   },
   computed: {
     ...mapGetters(["dicts"]),
-    tableTitle() {
-      return title;
-    },
-    tableOperates() {
-      return operates;
-    },
     tableOperations() {
       return operations;
     },
@@ -272,7 +292,6 @@ export default {
         }
       };
     },
-
     isDisabled(checkStatus) {
       return (checkStatus) => {
         return checkStatus == "0";
@@ -286,6 +305,12 @@ export default {
         return checkStatus == "0" || checkStatus == "-1";
       };
     },
+    getOperations() {
+      return this.tabActive == "passed" ? this.operations : this.operationsTemp;
+    },
+    getTitle() {
+      return this.tabActive == "passed" ? this.passedTitle : this.unPassedTitle;
+    },
   },
 
   async created() {
@@ -293,7 +318,6 @@ export default {
     this.loadData();
   },
 
-  //watch部分
   watch: {
     //监听弹窗变化
     multiUploadVisible(val) {
@@ -309,41 +333,58 @@ export default {
         this.cancelUploadArr = [];
       }
     },
+    // 监听Tab值不同调取不同的接口
+    tabActive(value) {
+      this.resetPage();
+      this.loadData();
+    },
   },
   methods: {
-    async search(form) {
-      var params = {
-        page: 1,
-        limit: this.list.size,
-        ...form,
-      };
-      if (params.status == "") {
-        delete params.status;
-      }
-      let res = await getListPer(params);
-      if (res.code == 0) {
-        this.list = res.data;
-        this.currentPageIds = this.list.records.map((item) => {
-          return item.exhibitionId;
-        });
+    // 清除分页到初始状态
+    resetPage() {
+      this.getCurrentList().current = 1;
+    },
+    // 设置两张表的数据
+    setList(data) {
+      if (this.tabActive === "passed") {
+        this.list = data;
+      } else {
+        this.listTemp = data;
       }
     },
+    // 获取当前加载的list
+    getCurrentList() {
+      const currentList =
+        this.tabActive == "passed" ? this.list : this.listTemp;
+      return currentList;
+    },
+    // 获取当前请求方法
+    getCurrentRequest() {
+      const currentRequest =
+        this.tabActive == "passed" ? getListPer : getListPerTemp;
+      return currentRequest;
+    },
+
+    async search(form) {
+      this.resetPage();
+      this.loadData(form);
+    },
     reset() {
       this.loadData();
     },
 
     // 加载表格数据
-    async loadData() {
+    async loadData(form) {
+      const { current, size } = this.getCurrentList();
       var params = {
         page: this.list.current,
         limit: this.list.size,
+        ...form,
       };
-      let res = await getListPer(params);
+      const currentRequest = this.getCurrentRequest();
+      const res = await currentRequest(params);
       if (res.code == 0) {
-        this.list = res.data;
-        this.currentPageIds = this.list.records.map((item) => {
-          return item.exhibitionId;
-        });
+        this.setList(res.data);
       }
     },
 
@@ -358,12 +399,14 @@ export default {
               return;
             }
             this.previewDialogVisible = true;
-            let res = await getDisplayById({ exhibitionId: row.exhibitionId });
+            let res = await getDisplayByIdTemp({
+              exhibitionId: row.exhibitionId,
+            });
             this.curPreviewObj = res.data;
           }
           break;
         case "edit":
-          let editRes = await getDisplayById({
+          let editRes = await getDisplayByIdTemp({
             exhibitionId: row.exhibitionId,
           });
           this.form = editRes.data;
@@ -496,7 +539,7 @@ export default {
     async reloadDisplay(exhibitionId) {
       this.$refs.InfoEditDialog.submitLoading = true;
       this.$refs.InfoEditDialog.loadingText = "加载中...";
-      let editRes = await getDisplayById({
+      let editRes = await getDisplayByIdTemp({
         exhibitionId,
       });
       this.form = editRes.data;
@@ -570,7 +613,7 @@ export default {
     },
     async handleCopySelect(value) {
       const { exhibitionId } = value;
-      let res = await getDisplayById({ exhibitionId });
+      let res = await getDisplayByIdTemp({ exhibitionId });
       delete res.data.exhibitionId;
       this.form = { ...res.data };
       this.editDialogVisible = true;

src/views/displayApproval copy/index.vue

@@ -12,8 +12,18 @@
     </div> -->
     </div>
     <el-tabs v-model="activeName" type="border-card" ref="tabs">
-      <el-tab-pane :label="item.label" :name="item.name" v-for="(item, tabIndex) in tabs" :key="tabIndex">
-        <TablePage :data="dataList[tabIndex].records" :tableTitle="tableTitle" :operates="tableOperates" v-loading="loading">
+      <el-tab-pane
+        :label="item.label"
+        :name="item.name"
+        v-for="(item, tabIndex) in tabs"
+        :key="tabIndex"
+      >
+        <TablePage
+          :data="dataList[tabIndex].records"
+          :tableTitle="tableTitle"
+          :operates="tableOperates"
+          v-loading="loading"
+        >
           <template v-slot:checkStatus="data">
             <!-- {{ data.scope.checkStatus }} -->
             <el-tag type="primary" v-if="data.scope.checkStatus == 0">
@@ -30,55 +40,77 @@
             {{ dicts.displayType[data.scope.type] }}
           </template>
           <template v-slot:faceImageUrl="data">
-            <img :src="
-              $getFullUrl(data.scope.faceImagePressUrl || data.scope.faceImageUrl)
-            " alt="暂无图片" v-if="$getFullUrl(data.scope.faceImagePressUrl || data.scope.faceImageUrl)"
-              style="cursor: pointer" width="100px" @click="handelPreviewImages(data.scope.faceImageUrl)" />
+            <img
+              :src="
+                $getFullUrl(
+                  data.scope.faceImagePressUrl || data.scope.faceImageUrl
+                )
+              "
+              alt="暂无图片"
+              v-if="
+                $getFullUrl(
+                  data.scope.faceImagePressUrl || data.scope.faceImageUrl
+                )
+              "
+              style="cursor: pointer"
+              width="100px"
+              @click="handelPreviewImages(data.scope.faceImageUrl)"
+            />
           </template>
           <template v-slot:operates="scope">
-            <TableOperation :operations="tableOperations" :rawData="scope.scope.row" @handleOperation="handleOperation">
+            <TableOperation
+              :operations="tableOperations"
+              :rawData="scope.scope.row"
+              @handleOperation="handleOperation"
+            >
             </TableOperation>
           </template>
         </TablePage>
-        <el-pagination style="margin: 16px 0" @size-change="handleSizeChange" @current-change="handleCurrentChange"
-          :current-page="Number(dataList[currentTabIndex].current)" :page-sizes="[10, 20, 50, 100]"
-          :page-size="Number(dataList[currentTabIndex].size)" layout="total, sizes, prev, pager, next, jumper"
-          :total="Number(dataList[currentTabIndex].total)" class="pagination">
+        <el-pagination
+          style="margin: 16px 0"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="Number(dataList[currentTabIndex].current)"
+          :page-sizes="[10, 20, 50, 100]"
+          :page-size="Number(dataList[currentTabIndex].size)"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="Number(dataList[currentTabIndex].total)"
+          class="pagination"
+        >
         </el-pagination>
       </el-tab-pane>
-
     </el-tabs>
 
-    <PreviewDisplayDialog v-if="Object.keys(curPreviewObj).length > 0" 
+    <PreviewDisplayDialog
+      v-if="Object.keys(curPreviewObj).length > 0"
       :visible="previewDialogVisible"
-      :displayDetail="curPreviewObj"  
-      :loading="previewLoading" 
-      @handleClose="handleClosePreviewDialog" 
-      @refresh="loadData" />
+      :displayDetail="curPreviewObj"
+      :loading="previewLoading"
+      @handleClose="handleClosePreviewDialog"
+      @refresh="loadData"
+    />
 
-    <el-image-viewer v-if="imgViewerVisible" :on-close="closeImgViewer" :url-list="imgList" />
+    <el-image-viewer
+      v-if="imgViewerVisible"
+      :on-close="closeImgViewer"
+      :url-list="imgList"
+    />
   </div>
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
-import PreviewDisplayDialog from './components/PreviewDisplayDialog.vue'
-import { displayTabletitle, operates, approvalOperations, viewOperations } from "./config";
+import PreviewDisplayDialog from "./components/PreviewDisplayDialog.vue";
 import {
-  getListPer,
-  getDisplayCheckById,
-} from "@/api/display";
-import SearchBar from "@/components/SearchBar";
+  displayTabletitle,
+  operates,
+  approvalOperations,
+  viewOperations,
+} from "./config";
+import { getListPer, getDisplayCheckById } from "@/api/display";
 import { mapGetters } from "vuex";
 export default {
   components: {
-    TablePage,
-    TableOperation,
-    SearchBar,
     PreviewDisplayDialog,
-    "el-image-viewer": () =>
-      import("element-ui/packages/image/src/image-viewer"),
   },
   data() {
     let that = this;
@@ -101,7 +133,7 @@ export default {
           size: 10,
           current: 1,
           total: 0,
-        }
+        },
       ],
       searchConfig: [
         {
@@ -115,21 +147,23 @@ export default {
       previewDialogVisible: false,
       curPreviewObj: {}, //当前预览的对象
       currentPageIds: [], //当前的id数组，用于给详情页切换用
-      tabs: [{
-        name: '0',
-        label: '待审核'
-      }, {
-        name: '1',
-        label: '已通过'
-      },
-      {
-        name: '-2',
-        label: '已驳回'
-      }
+      tabs: [
+        {
+          name: "0",
+          label: "待审核",
+        },
+        {
+          name: "1",
+          label: "已通过",
+        },
+        {
+          name: "-2",
+          label: "已驳回",
+        },
       ],
-      activeName: '0',
+      activeName: "0",
       currentTabIndex: 0,
-      dialogLoading:false
+      dialogLoading: false,
     };
   },
   computed: {
@@ -141,18 +175,18 @@ export default {
       return operates;
     },
     tableOperations() {
-      if (this.activeName == '0') {
-        return approvalOperations
+      if (this.activeName == "0") {
+        return approvalOperations;
       } else {
-        return viewOperations
+        return viewOperations;
       }
-    }
+    },
   },
   watch: {
     activeName(value) {
-      this.currentTabIndex = Number(Math.abs(value)) //当前索引正好对应状态的绝对值
-      this.loadData()
-    }
+      this.currentTabIndex = Number(Math.abs(value)); //当前索引正好对应状态的绝对值
+      this.loadData();
+    },
   },
 
   async created() {
@@ -171,7 +205,7 @@ export default {
       }
       let res = await getListPer(params);
       if (res.code == 0) {
-        this.$set(this.dataList, this.currentTabIndex, res.data)
+        this.$set(this.dataList, this.currentTabIndex, res.data);
         // this.dataList[this.currentTabIndex] = res.data
         // this.currentPageIds =  this.dataList[this.currentTabIndex].records.map((item) => {
         //   return item.exhibitionId;
@@ -184,35 +218,36 @@ export default {
 
     // 加载表格数据
     async loadData() {
-      this.loading = true
+      this.loading = true;
       var params = {
         page: this.dataList[this.currentTabIndex].current,
         limit: this.dataList[this.currentTabIndex].size,
-        checkStatus: Number(this.activeName)
+        checkStatus: Number(this.activeName),
       };
       let res = await getListPer(params);
       if (res.code == 0) {
-        this.$set(this.dataList, this.currentTabIndex, res.data)
+        this.$set(this.dataList, this.currentTabIndex, res.data);
         // this.currentPageIds =  this.dataList[this.currentTabIndex].records.map((item) => {
         //   return item.exhibitionId;
         // });
       }
-      this.loading = false
+      this.loading = false;
     },
 
     async handleOperation(value, row) {
       console.log(value, row);
       // debugger
-      if (value.type == 'approval' || value.type == 'view') {
-        this.previewLoading = true
+      if (value.type == "approval" || value.type == "view") {
+        this.previewLoading = true;
         if (row) {
           this.previewDialogVisible = true;
-          let res = await getDisplayCheckById({ exhibitionId: row.exhibitionId });
+          let res = await getDisplayCheckById({
+            exhibitionId: row.exhibitionId,
+          });
           this.curPreviewObj = res.data;
           this.previewLoading = false;
         }
       }
-
     },
 
     // 多选
@@ -256,7 +291,7 @@ export default {
 
     handleClosePreviewDialog() {
       this.previewDialogVisible = false;
-    }
+    },
   },
 };
 </script>
@@ -283,4 +318,4 @@ export default {
     }
   }
 }
-</style>
\ No newline at end of file
+</style>

src/views/displayApproval/config.js

@@ -23,13 +23,13 @@ export const displayTabletitle = [{
 {
   prop: "deptName",
   label: "展览单位",
-  columnAlign: 'center', 
+  columnAlign: 'center',
   showOverFlowToolTip: true,
 },
 {
   prop: "regionName",
   label: "所在地区",
-  columnAlign: 'center', 
+  columnAlign: 'center',
   showOverFlowToolTip: true,
 },
 
@@ -51,7 +51,7 @@ export const displayTabletitle = [{
   prop: "literatureVo",
   label: "关联文献",
   columnAlign: 'center',
-  width:100
+  width: 100
 },
 {
   prop: "themeType",
@@ -62,26 +62,26 @@ export const displayTabletitle = [{
   prop: "remark",
   label: "备注",
   columnAlign: 'center',
-   showOverFlowToolTip: true,
+  showOverFlowToolTip: true,
+},
+{
+  prop: "imagesVo",
+  label: "展览图片",
+  columnAlign: 'center',
+  isImages: true
+},
+{
+  prop: "audiosVo",
+  label: "展览音频",
+  columnAlign: 'center',
+  isAudios: true
+},
+{
+  prop: "videosVo",
+  label: "展览视频",
+  columnAlign: 'center',
+  isVideos: true
 },
-  {
-    prop: "imagesVo",
-    label: "展览图片",
-    columnAlign: 'center',
-    isImages: true
-  },
-  {
-    prop: "audiosVo",
-    label: "展览音频",
-    columnAlign: 'center',
-    isAudios: true
-  },
-  {
-    prop: "videosVo",
-    label: "展览视频",
-    columnAlign: 'center',
-    isVideos: true
-  },
 ]
 
 export const operates = {
@@ -147,7 +147,7 @@ export const crTabletitle = [{
   label: "类别",
   width: 100,
   columnAlign: 'center',
-  isCulturalRelicType:true
+  isCulturalRelicType: true
 },
 {
   prop: "createId",
@@ -193,25 +193,25 @@ export const crTabletitle = [{
   isFaceImage: true,
 },
 {
-  prop:"imagesVo",
+  prop: "imagesVo",
   label: "文物图片",
   columnAlign: 'center',
   isFaceImage: true,
 },
 {
-  prop:"audiosVo",
+  prop: "audiosVo",
   label: "文物音频",
   columnAlign: 'center',
   isFaceImage: true,
 },
 {
-  prop:"videosVo",
+  prop: "videosVo",
   label: "文物视频",
   columnAlign: 'center',
   isFaceImage: true,
 },
 {
-  prop:"literatureVo",
+  prop: "literatureVo",
   label: "相关文献",
   columnAlign: 'center',
   isFaceImage: true,
@@ -287,7 +287,7 @@ export const approvleTableTitle = [
     columnAlign: 'center',
   },
   {
-    prop: "status",
+    prop: "checkStatus",
     label: "审核状态",
     columnAlign: 'center',
     isStatus: true

src/views/displayApproval/index.vue

@@ -4,7 +4,7 @@
       <SearchBar :config="searchConfig" @search="search" @reset="reset" />
     </div>
     <TablePage
-      :data="dataList.records"
+      :data="list.records"
       :tableTitle="approvleTableTitle"
       :operates="operates"
       v-loading="loading"
@@ -30,11 +30,11 @@
       style="margin: 16px 0"
       @size-change="handleSizeChange"
       @current-change="handleCurrentChange"
-      :current-page="Number(dataList.current)"
+      :current-page="Number(list.current)"
       :page-sizes="[10, 20, 50, 100]"
-      :page-size="Number(dataList.size)"
+      :page-size="Number(list.size)"
       layout="total, sizes, prev, pager, next, jumper"
-      :total="Number(dataList.total)"
+      :total="Number(list.total)"
       class="pagination"
     >
     </el-pagination>
@@ -50,25 +50,19 @@
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
 import PreviewDialog from "./components/PreviewDialog.vue";
 import { approvleTableTitle, operates, operations } from "./config";
-import { getListPer } from "@/api/display";
-import SearchBar from "@/components/SearchBar";
+import { getFlowListPagePer } from "@/api/approval";
 import { mapGetters } from "vuex";
 import { approvalData } from "./mock";
 export default {
   components: {
-    TablePage,
-    TableOperation,
-    SearchBar,
     PreviewDialog,
   },
   data() {
     let that = this;
     return {
-      dataList: {
+      list: {
         record: [],
         size: 10,
         current: 1,
@@ -81,17 +75,17 @@ export default {
           label: "标题",
         },
         {
-          prop: "type",
+          prop: "sourceType",
           type: "select",
           label: "类别",
           selectOptions: [
             {
               label: "文物",
-              value: "1",
+              value: "文物",
             },
             {
               label: "展览",
-              value: "2",
+              value: "展览",
             },
           ],
         },
@@ -129,41 +123,24 @@ export default {
   },
   methods: {
     async search(form) {
-      this.loadData();
-      // var params = {
-      //   page: 1,
-      //   limit: this.dataList[this.currentTabIndex].size,
-      //   ...form,
-      // };
-      // if (params.status == "") {
-      //   delete params.status;
-      // }
-      // let res = await getListPer(params);
-      // if (res.code == 0) {
-      //   this.$set(this.dataList, this.currentTabIndex, res.data);
-      //   // this.dataList[this.currentTabIndex] = res.data
-      //   // this.currentPageIds =  this.dataList[this.currentTabIndex].records.map((item) => {
-      //   //   return item.exhibitionId;
-      //   // });
-      // }
+      this.loadData(form);
     },
     reset() {
       this.loadData();
     },
 
     // 加载表格数据
-    async loadData() {
+    async loadData(form) {
       this.loading = true;
-      this.dataList = approvalData;
-      // var params = {
-      //   page: this.dataList.current,
-      //   limit: this.dataList.size,
-      //   checkStatus: Number(this.activeName),
-      // };
-      // let res = await getListPer(params);
-      // if (res.code == 0) {
-      //   this.$set(this.dataList, this.currentTabIndex, res.data);
-      // }
+      const params = {
+        page: this.list.current,
+        limit: this.list.size,
+        ...form,
+      };
+      let res = await getFlowListPagePer(params);
+      if (res.code == 0) {
+        this.list = res.data;
+      }
       this.loading = false;
     },
 
@@ -182,13 +159,13 @@ export default {
 
     // 改变页容量
     handleSizeChange(value) {
-      this.dataList[this.currentTabIndex].size = value;
+      this.list[this.currentTabIndex].size = value;
       this.loadData();
     },
 
     // 改变当前显示页
     handleCurrentChange(value) {
-      this.dataList[this.currentTabIndex].current = value;
+      this.list[this.currentTabIndex].current = value;
       this.loadData();
     },
 

src/views/importExport/index.vue

@@ -34,19 +34,10 @@
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
 import { importRecordsTitle, importOperates, importOperations } from "./config";
 import { getImportListPage, deleteByBatchNum } from "@/api/file";
 
-import SearchBar from "@/components/SearchBar";
-
 export default {
-  components: {
-    TablePage,
-    TableOperation,
-    SearchBar,
-  },
   data() {
     return {
       list: {
@@ -139,7 +130,7 @@ export default {
         case "view":
           break;
         case "delete":
-          let { batchNum, type,id } = row;
+          let { batchNum, type, id } = row;
           let deleteRes = await deleteByBatchNum({ batchNum, type });
           if (deleteRes.code == 0) {
             this.$message.success("删除成功！");
@@ -174,4 +165,4 @@ export default {
 .pagination {
   margin: 16px;
 }
-</style>
\ No newline at end of file
+</style>

src/views/literature/index.vue

@@ -3,7 +3,7 @@
     <div class="top-bar">
       <SearchBar :config="searchConfig" @search="search" @reset="reset" />
       <el-button
-      size="mini"
+        size="mini"
         type="primary"
         @click.native="handleOperation({ type: 'add' })"
         icon="el-icon-plus"
@@ -59,20 +59,14 @@
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
 import { title, operates, operations } from "./config";
 import { editLiterature, deleteLt } from "@/api/literature";
 import InfoEditDialog from "./components/InfoEditDialog";
-import SearchBar from "@/components/SearchBar";
 import { downloadFile, previewFile, downloadBlob } from "@/utils/file";
 
 export default {
   components: {
-    TablePage,
-    TableOperation,
     InfoEditDialog,
-    SearchBar,
   },
   data() {
     return {
@@ -122,7 +116,7 @@ export default {
         status: 1, //上下架状态
         remark: "", //备注
       },
-      loading:false
+      loading: false,
     };
   },
 
@@ -151,7 +145,7 @@ export default {
   },
   methods: {
     async search(form) {
-      this.loading = true
+      this.loading = true;
       var params = {
         page: this.list.current,
         limit: this.list.size,
@@ -164,7 +158,7 @@ export default {
       if (res.code == 0) {
         this.list = res.data;
       }
-      this.loading = false
+      this.loading = false;
     },
 
     reset() {
@@ -173,7 +167,7 @@ export default {
 
     //   加载表格数据
     async loadData() {
-      this.loading = true
+      this.loading = true;
       var params = {
         page: this.list.current,
         limit: this.list.size,
@@ -182,7 +176,7 @@ export default {
       if (res.code == 0) {
         this.list = res.data;
       }
-      this.loading = false
+      this.loading = false;
     },
     async handleOperation(value, row) {
       switch (value.type) {
@@ -190,7 +184,7 @@ export default {
           this.drawerVisible = true;
           break;
         case "view":
-          if (row.files && row.files.length > 0 && row.files[0].url ) {
+          if (row.files && row.files.length > 0 && row.files[0].url) {
             previewFile(row.files[0].url, row.name);
           } else {
             let m = this.$message.info("暂无文献附件！");
@@ -291,4 +285,4 @@ export default {
   padding: 10px 20px;
   font-weight: bold;
 }
-</style>
\ No newline at end of file
+</style>

src/views/log/index.vue

@@ -3,7 +3,12 @@
     <div class="top-bar">
       <SearchBar :config="searchConfig" @search="search" @reset="reset" />
     </div>
-    <TablePage :data="list.records" :tableTitle="tableTitle" v-loading="loading"> </TablePage>
+    <TablePage
+      :data="list.records"
+      :tableTitle="tableTitle"
+      v-loading="loading"
+    >
+    </TablePage>
 
     <el-pagination
       @size-change="handleSizeChange"
@@ -20,19 +25,10 @@
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
 import { title } from "./config";
 import { getLogList } from "@/api/log";
 
-import SearchBar from "@/components/SearchBar";
-
 export default {
-  components: {
-    TablePage,
-    TableOperation,
-    SearchBar,
-  },
   data() {
     return {
       list: {
@@ -82,7 +78,7 @@ export default {
             },
           ],
         },
-       
+
         {
           prop: "optType",
           type: "select",
@@ -156,7 +152,7 @@ export default {
           label: "用户名",
         },
       ],
-      loading:false
+      loading: false,
     };
   },
 
@@ -182,7 +178,7 @@ export default {
   },
   methods: {
     async search(form) {
-      this.loading = true
+      this.loading = true;
       this.list.current = 1;
       var params = {
         page: this.list.current,
@@ -202,7 +198,7 @@ export default {
       if (res.code == 0) {
         this.list = res.data;
       }
-      this.loading = false
+      this.loading = false;
     },
 
     reset() {
@@ -211,7 +207,7 @@ export default {
 
     //   加载表格数据
     async loadData() {
-      this.loading = true
+      this.loading = true;
       var params = {
         page: this.list.current,
         limit: this.list.size,
@@ -220,7 +216,7 @@ export default {
       if (res.code == 0) {
         this.list = res.data;
       }
-      this.loading = false
+      this.loading = false;
     },
 
     // 改变页容量
@@ -249,7 +245,7 @@ export default {
   margin: 16px;
 }
 
-::v-deep .el-form-item{
+::v-deep .el-form-item {
   margin-bottom: 20px;
 }
-</style>
\ No newline at end of file
+</style>

src/views/museum/index.vue

@@ -112,20 +112,12 @@
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
 import { title, operates, operations } from "./config";
 import InfoEditDialog from "./components/InfoEditDialog";
-import SearchBar from "@/components/SearchBar";
 import { deleteMuseum, editMuseum } from "@/api/org";
 export default {
   components: {
-    TablePage,
-    TableOperation,
     InfoEditDialog,
-    SearchBar,
-    "el-image-viewer": () =>
-      import("element-ui/packages/image/src/image-viewer"),
   },
   data() {
     return {

src/views/product/index.vue

@@ -2,57 +2,93 @@
   <div class="app-container">
     <div class="top-bar">
       <SearchBar :config="searchConfig" @search="search" @reset="reset" />
-      <el-button  size="mini" type="primary" @click.native="handleOperation({ type: 'add' })" icon="el-icon-plus">
-        添加</el-button>
+      <el-button
+        size="mini"
+        type="primary"
+        @click.native="handleOperation({ type: 'add' })"
+        icon="el-icon-plus"
+      >
+        添加</el-button
+      >
     </div>
-    <TablePage :data="list.records" :tableTitle="tableTitle" :operates="tableOperates" v-loading="loading">
+    <TablePage
+      :data="list.records"
+      :tableTitle="tableTitle"
+      :operates="tableOperates"
+      v-loading="loading"
+    >
       <template v-slot:images="data">
-        <img :src="$getFullUrl(data.scope.imagesVo[0].pressUrl)" alt="暂无图片" v-if="data.scope.imagesVo.length > 0" style="
+        <img
+          :src="$getFullUrl(data.scope.imagesVo[0].pressUrl)"
+          alt="暂无图片"
+          v-if="data.scope.imagesVo.length > 0"
+          style="
             cursor: pointer;
             height: 100px;
             width: 100px;
             object-fit: contain;
-          " width="100px" @click="
+          "
+          width="100px"
+          @click="
             handelPreviewImages($getFullUrl(data.scope.imagesVo[0].pressUrl))
-          " />
+          "
+        />
       </template>
       <template v-slot:status="data">
-        <el-popconfirm :title="getStatusTitle(data.scope.status)" @confirm="handleChangeStatus(data.scope)">
-          <el-switch slot="reference" :value="Boolean(Number(data.scope.status))"></el-switch>
+        <el-popconfirm
+          :title="getStatusTitle(data.scope.status)"
+          @confirm="handleChangeStatus(data.scope)"
+        >
+          <el-switch
+            slot="reference"
+            :value="Boolean(Number(data.scope.status))"
+          ></el-switch>
         </el-popconfirm>
       </template>
 
       <template v-slot:operates="scope">
-        <TableOperation :operations="tableOperations" :rawData="scope.scope.row" @handleOperation="handleOperation">
+        <TableOperation
+          :operations="tableOperations"
+          :rawData="scope.scope.row"
+          @handleOperation="handleOperation"
+        >
         </TableOperation>
       </template>
     </TablePage>
-    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
-      :current-page="Number(list.current)" :page-sizes="[10, 20, 40, 50]" :page-size="Number(list.size)"
-      layout="total, sizes, prev, pager, next, jumper" :total="Number(list.total)" class="pagination">
+    <el-pagination
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :current-page="Number(list.current)"
+      :page-sizes="[10, 20, 40, 50]"
+      :page-size="Number(list.size)"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="Number(list.total)"
+      class="pagination"
+    >
     </el-pagination>
-    <InfoEditDialog :visible="drawerVisible" :form="form" :orgTreeData="orgTreeData" @handleClose="handleClose"
-      @refresh="loadData" />
-    <el-image-viewer v-if="imgViewerVisible" :on-close="closeImgViewer" :url-list="imgList" />
+    <InfoEditDialog
+      :visible="drawerVisible"
+      :form="form"
+      :orgTreeData="orgTreeData"
+      @handleClose="handleClose"
+      @refresh="loadData"
+    />
+    <el-image-viewer
+      v-if="imgViewerVisible"
+      :on-close="closeImgViewer"
+      :url-list="imgList"
+    />
   </div>
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
 import { title, operates, operations } from "./config";
 import { getCcProduct, deleteCcProduct } from "@/api/literature";
 import InfoEditDialog from "./components/InfoEditDialog";
-import SearchBar from "@/components/SearchBar";
 
 export default {
   components: {
-    TablePage,
-    TableOperation,
     InfoEditDialog,
-    SearchBar,
-    "el-image-viewer": () =>
-      import("element-ui/packages/image/src/image-viewer"),
   },
   data() {
     return {
@@ -149,7 +185,7 @@ export default {
 
     //   加载表格数据
     async loadData() {
-      this.loading = true
+      this.loading = true;
       var params = {
         page: this.list.current,
         limit: this.list.size,
@@ -158,7 +194,7 @@ export default {
       if (res.code == 0) {
         this.list = res.data;
       }
-      this.loading = false
+      this.loading = false;
     },
     loadOrgTree() {
       this.$store.dispatch("org/getMuseumTreeData", true).then((res) => {
@@ -355,4 +391,4 @@ export default {
     border-radius: 0;
   }
 }
-</style>
\ No newline at end of file
+</style>

src/views/role/index.vue

@@ -3,7 +3,7 @@
     <div class="top-bar">
       <SearchBar :config="searchConfig" @search="search" @reset="reset" />
       <el-button
-      size="mini"
+        size="mini"
         type="primary"
         @click.native="handleOperation({ type: 'add' })"
         icon="el-icon-plus"
@@ -65,21 +65,15 @@
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
 import { title, operates, operations } from "./config";
 import { getRoleList, getRoleById, deleteRole, upadateRole } from "@/api/user";
 import InfoEditDialog from "./components/InfoEditDialog";
 import DataEditDialog from "./components/DataEditDialog";
-import SearchBar from "@/components/SearchBar";
 
 export default {
   components: {
-    TablePage,
-    TableOperation,
     InfoEditDialog,
     DataEditDialog,
-    SearchBar,
   },
   data() {
     return {
@@ -120,12 +114,12 @@ export default {
         name: "",
         remark: "",
         status: 1,
-        permissionRespNodes: [],//菜单权限树
-        dataScope: 5,//默认数据权限为自己
+        permissionRespNodes: [], //菜单权限树
+        dataScope: 5, //默认数据权限为自己
       },
-      dataScopeForm: {},//编辑数据权限的表单
+      dataScopeForm: {}, //编辑数据权限的表单
       dataEditDialog: false, //编辑数据的对话框
-      loading:false
+      loading: false,
     };
   },
 
@@ -155,7 +149,7 @@ export default {
   },
   methods: {
     async search(form) {
-      this.loading = true
+      this.loading = true;
       var params = {
         page: this.list.current,
         limit: this.list.size,
@@ -168,7 +162,7 @@ export default {
       if (res.code == 0) {
         this.list = res.data;
       }
-      this.loading = false
+      this.loading = false;
     },
 
     reset() {
@@ -278,4 +272,4 @@ export default {
   padding: 10px 20px;
   font-weight: bold;
 }
-</style>
\ No newline at end of file
+</style>

src/views/user/index.vue

@@ -2,56 +2,98 @@
   <div class="users app-container">
     <el-row :gutter="16">
       <el-col :span="4" class="left-tree">
-        <el-scrollbar style="height:100%;">
-          <el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick" default-expand-all
-            :expand-on-click-node="false"></el-tree>
+        <el-scrollbar style="height: 100%">
+          <el-tree
+            :data="treeData"
+            :props="defaultProps"
+            @node-click="handleNodeClick"
+            default-expand-all
+            :expand-on-click-node="false"
+          ></el-tree>
         </el-scrollbar>
       </el-col>
 
-
       <el-col :span="20">
         <div class="top-bar">
           <SearchBar :config="searchConfig" @search="search" @reset="reset" />
-          <el-button size="mini" type="primary" @click.native="handleOperation({ type: 'add' })" icon="el-icon-plus">
-            新增</el-button>
+          <el-button
+            size="mini"
+            type="primary"
+            @click.native="handleOperation({ type: 'add' })"
+            icon="el-icon-plus"
+          >
+            新增</el-button
+          >
         </div>
-        <TablePage :data="list.records" :tableTitle="tableTitle" :operates="tableOperates" v-loading="loading">
+        <TablePage
+          :data="list.records"
+          :tableTitle="tableTitle"
+          :operates="tableOperates"
+          v-loading="loading"
+        >
           <template v-slot:status="data">
-            <el-popconfirm :title="getStatusTitle(data.scope.status)" @confirm="handleChangeStatus(data.scope)">
-              <el-switch slot="reference" :value="Boolean(Number(data.scope.status))"></el-switch>
+            <el-popconfirm
+              :title="getStatusTitle(data.scope.status)"
+              @confirm="handleChangeStatus(data.scope)"
+            >
+              <el-switch
+                slot="reference"
+                :value="Boolean(Number(data.scope.status))"
+              ></el-switch>
             </el-popconfirm>
           </template>
 
           <template v-slot:operates="scope">
-            <TableOperation :operations="tableOperations" :rawData="scope.scope.row" @handleOperation="handleOperation">
+            <TableOperation
+              :operations="tableOperations"
+              :rawData="scope.scope.row"
+              @handleOperation="handleOperation"
+            >
             </TableOperation>
           </template>
         </TablePage>
-        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
-          :current-page="Number(list.current)" :page-sizes="[10, 20, 40, 50]" :page-size="Number(list.size)"
-          layout="total, sizes, prev, pager, next, jumper" :total="Number(list.total)" class="pagination">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="Number(list.current)"
+          :page-sizes="[10, 20, 40, 50]"
+          :page-size="Number(list.size)"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="Number(list.total)"
+          class="pagination"
+        >
         </el-pagination>
       </el-col>
     </el-row>
-    <InfoEditDialog :visible="dialogVisible" :form="form" :orgTreeData="treeData" @handleClose="handleClose"
-      @refresh="loadListData" />
-    <EditRole :visible="editRoleVisible" :roleData="currentRoleData" :id="currentId"
-      @handleClose="handleCloseEditRole" />
-    <EditPassword :visible="editPasswordVisible" :id="currentId" @handleClose="handleCloseEditPassword" />
+    <InfoEditDialog
+      :visible="dialogVisible"
+      :form="form"
+      :orgTreeData="treeData"
+      @handleClose="handleClose"
+      @refresh="loadListData"
+    />
+    <EditRole
+      :visible="editRoleVisible"
+      :roleData="currentRoleData"
+      :id="currentId"
+      @handleClose="handleCloseEditRole"
+    />
+    <EditPassword
+      :visible="editPasswordVisible"
+      :id="currentId"
+      @handleClose="handleCloseEditPassword"
+    />
   </div>
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
-import SearchBar from "@/components/SearchBar";
 import { title, operates, operations } from "./config";
 import {
   getDeptTree,
   getUserList,
   deleteUser,
   getUserOwnRoles,
-  getUserOwnRolesV1
+  getUserOwnRolesV1,
 } from "@/api/user";
 import InfoEditDialog from "./components/InfoEditDialog.vue";
 import EditRole from "./components/EditRole.vue";
@@ -59,12 +101,9 @@ import EditPassword from "./components/EditPassword.vue";
 
 export default {
   components: {
-    TablePage,
-    TableOperation,
-    SearchBar,
     InfoEditDialog,
     EditRole,
-    EditPassword
+    EditPassword,
   },
   computed: {
     tableTitle() {
@@ -127,7 +166,7 @@ export default {
       editPasswordVisible: false,
       currentRoleData: {},
       currentId: null,
-      loading:false
+      loading: false,
     };
   },
   mounted() {
@@ -136,19 +175,16 @@ export default {
   methods: {
     //   加载树结构数据
     async loadTreeData() {
-    
       const res = await getDeptTree();
       if (res.code == 0) {
         this.treeData = res.data[0].children; //去除默认顶级部门
         this.currentDeptNo = this.treeData[0].deptNo;
         this.loadListData();
       }
-    
-
     },
     //   加载表格数据
     async loadListData() {
-      this.loading = true
+      this.loading = true;
       var params = {
         page: this.list.current,
         limit: this.list.size,
@@ -158,7 +194,7 @@ export default {
       if (res.code == 0) {
         this.list = res.data;
       }
-      this.loading = false
+      this.loading = false;
     },
 
     async search(form) {
@@ -217,8 +253,8 @@ export default {
           this.currentRoleData = roleRes.data;
           this.currentId = row.id;
           break;
-        case 'editPassword':
-          console.log('editPassword');
+        case "editPassword":
+          console.log("editPassword");
           this.editPasswordVisible = true;
           this.currentId = row.id;
           break;
@@ -237,10 +273,10 @@ export default {
       this.currentId = null;
     },
 
-    handleCloseEditPassword(){
+    handleCloseEditPassword() {
       this.editPasswordVisible = false;
       this.currentId = null;
-    }
+    },
   },
 };
 </script>
@@ -268,4 +304,4 @@ export default {
 ::v-deep .el-scrollbar .el-scrollbar__wrap {
   overflow-x: hidden;
 }
-</style>
\ No newline at end of file
+</style>

src/views/virtual/index.vue

@@ -2,51 +2,86 @@
   <div class="app-container">
     <div class="top-bar">
       <SearchBar :config="searchConfig" @search="search" @reset="reset" />
-      <el-button size="mini" type="primary" @click.native="handleOperation({ type: 'add' })" icon="el-icon-plus">
-        添加</el-button>
+      <el-button
+        size="mini"
+        type="primary"
+        @click.native="handleOperation({ type: 'add' })"
+        icon="el-icon-plus"
+      >
+        添加</el-button
+      >
     </div>
-    <TablePage :data="list.records" :tableTitle="tableTitle" :operates="tableOperates" v-loading="loading">
+    <TablePage
+      :data="list.records"
+      :tableTitle="tableTitle"
+      :operates="tableOperates"
+      v-loading="loading"
+    >
       <template v-slot:faceImageUrl="data">
-        <img :src="data.scope.faceImageUrl" alt="暂无图片" v-if="data.scope.faceImageUrl" style="cursor: pointer"
-          width="100px" @click="handelPreviewImages(data.scope.faceImageUrl)" />
+        <img
+          :src="data.scope.faceImageUrl"
+          alt="暂无图片"
+          v-if="data.scope.faceImageUrl"
+          style="cursor: pointer"
+          width="100px"
+          @click="handelPreviewImages(data.scope.faceImageUrl)"
+        />
       </template>
       <template v-slot:status="data">
-        <el-popconfirm :title="getStatusTitle(data.scope.status)" @confirm="handleChangeStatus(data.scope)">
-          <el-switch slot="reference" :value="Boolean(Number(data.scope.status))"></el-switch>
+        <el-popconfirm
+          :title="getStatusTitle(data.scope.status)"
+          @confirm="handleChangeStatus(data.scope)"
+        >
+          <el-switch
+            slot="reference"
+            :value="Boolean(Number(data.scope.status))"
+          ></el-switch>
         </el-popconfirm>
       </template>
 
       <template v-slot:operates="scope">
-        <TableOperation :operations="tableOperations" :rawData="scope.scope.row" @handleOperation="handleOperation">
+        <TableOperation
+          :operations="tableOperations"
+          :rawData="scope.scope.row"
+          @handleOperation="handleOperation"
+        >
         </TableOperation>
       </template>
     </TablePage>
-    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
-      :current-page="Number(list.current)" :page-sizes="[10, 20, 40, 50]" :page-size="Number(list.size)"
-      layout="total, sizes, prev, pager, next, jumper" :total="Number(list.total)" class="pagination">
+    <el-pagination
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :current-page="Number(list.current)"
+      :page-sizes="[10, 20, 40, 50]"
+      :page-size="Number(list.size)"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="Number(list.total)"
+      class="pagination"
+    >
     </el-pagination>
-    <InfoEditDialog :visible="drawerVisible" :form="form" :orgTreeData="orgTreeData" @handleClose="handleClose"
-      @refresh="loadData" />
-    <el-image-viewer v-if="imgViewerVisible" :on-close="closeImgViewer" :url-list="imgList" />
+    <InfoEditDialog
+      :visible="drawerVisible"
+      :form="form"
+      :orgTreeData="orgTreeData"
+      @handleClose="handleClose"
+      @refresh="loadData"
+    />
+    <el-image-viewer
+      v-if="imgViewerVisible"
+      :on-close="closeImgViewer"
+      :url-list="imgList"
+    />
   </div>
 </template>
 
 <script>
-import TablePage from "@/components/Table/TablePage.vue";
-import TableOperation from "@/components/Table/TableOperation.vue";
 import { title, operates, operations } from "./config";
 import { deleteVirtual, editVirtual, getVirtualListPer } from "@/api/vitual";
 import InfoEditDialog from "./components/InfoEditDialog";
-import SearchBar from "@/components/SearchBar";
 
 export default {
   components: {
-    TablePage,
-    TableOperation,
     InfoEditDialog,
-    SearchBar,
-    "el-image-viewer": () =>
-      import("element-ui/packages/image/src/image-viewer"),
   },
   data() {
     return {
@@ -124,7 +159,7 @@ export default {
   },
   methods: {
     async search(form) {
-      this.loading = true
+      this.loading = true;
       var params = {
         page: this.list.current,
         limit: this.list.size,
@@ -137,7 +172,7 @@ export default {
       if (res.code == 0) {
         this.list = res.data;
       }
-      this.loading = false
+      this.loading = false;
     },
 
     reset() {
@@ -146,7 +181,7 @@ export default {
 
     //   加载表格数据
     async loadData() {
-      this.loading = true
+      this.loading = true;
       var params = {
         page: this.list.current,
         limit: this.list.size,
@@ -155,7 +190,7 @@ export default {
       if (res.code == 0) {
         this.list = res.data;
       }
-      this.loading = false
+      this.loading = false;
     },
     loadOrgTree() {
       this.$store.dispatch("org/getMuseumTreeData", true).then((res) => {
@@ -352,4 +387,4 @@ export default {
     border-radius: 0;
   }
 }
-</style>
\ No newline at end of file
+</style>

vue.config.js

@@ -31,7 +31,7 @@ module.exports = {
   lintOnSave: false,
   productionSourceMap: false,
   devServer: {
-    host: 'localhost',
+    host: '172.24.100.158',
     port: port,
     open: true,
     overlay: {