From 6d30a13071430b1c56764a514cf0541a12e540f2 Mon Sep 17 00:00:00 2001
From: xuhuajiao <13476289682@163.com>
Date: Sat, 2 Apr 2022 14:45:39 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=BB=E9=A2=98=E5=BA=93-=E7=94=BB=E5=86=8C?=
 =?UTF-8?q?=E5=88=86=E7=A6=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/styles/adminIndex.scss         |   1 +
 src/views/components/MyAlbum.vue          | 517 ++++++++++++++++++++++
 src/views/components/ThemeGalleryList.vue | 158 ++-----
 src/views/components/materialFolder.vue   |   2 +
 src/views/dashboard/HomeThemeGallery.vue  |  29 +-
 src/views/immediateRelease/index.vue      |   1 +
 6 files changed, 569 insertions(+), 139 deletions(-)
 create mode 100644 src/views/components/MyAlbum.vue

diff --git a/src/assets/styles/adminIndex.scss b/src/assets/styles/adminIndex.scss
index 5217c01..61c7316 100644
--- a/src/assets/styles/adminIndex.scss
+++ b/src/assets/styles/adminIndex.scss
@@ -405,6 +405,7 @@
       display: block;
       width: 100%;
       height: 100%;
+      object-fit: cover;
     }
   }
 }
diff --git a/src/views/components/MyAlbum.vue b/src/views/components/MyAlbum.vue
new file mode 100644
index 0000000..6d9d239
--- /dev/null
+++ b/src/views/components/MyAlbum.vue
@@ -0,0 +1,517 @@
+<template>
+  <div>
+    <!-- 我的画册-创建文件夹btn -->
+    <div v-if="isToFolder" class="material_crumbs">
+      <el-breadcrumb separator-class="el-icon-arrow-right">
+        <el-breadcrumb-item><a href="/theme">主题库</a></el-breadcrumb-item>
+        <el-breadcrumb-item><a @click="breadcrumbToAlbum">我的画册</a></el-breadcrumb-item>
+        <el-breadcrumb-item>{{ currentFolder }}</el-breadcrumb-item>
+      </el-breadcrumb>
+    </div>
+    <div style="display:flex; flex-wrap: wrap">
+      <div v-if="!isToFolder" class="theme_mkdir cont_upload" @click="handleMkdir(0)">
+        <svg class="font-icon icon" aria-hidden="true">
+          <use xlink:href="#icon-a-xinzeng" />
+        </svg>
+        <el-button class="mkdir_btn" round type="primary">创建文件夹</el-button>
+      </div>
+      <div v-else class="theme_mkdir cont_upload">
+        <el-button class="cont_upload_btn" round type="primary">添加</el-button>
+        <el-button class="return_btn" round type="primary" @click="breadcrumbToAlbum">返回</el-button>
+      </div>
+      <div v-for="(item,index) in materialFolders" :key="item.id" :class="['theme_mkdir', 'folder', { 'item_multi': folderChecked == index }]" @click.stop="editFolder(item,index)" @dblclick="floderDbClick(item,index)">
+        <div class="icon_bg">
+          <svg v-if="!item.imgPath" class="font-icon icon" aria-hidden="true">
+            <use xlink:href="#icon-wenjianjia" />
+          </svg>
+          <img v-else :src="item.imgPath" />
+        </div>
+        <p class="file_name">{{ item.name }}</p>
+        <span v-if="folderChecked == index" class="checked_btn"></span>
+      </div>
+      <!-- 画册list -->
+      <div v-for="(item, index) in themeGalleryList" :key="index" :class="['theme_item', { 'item_multi': selectInFolderid.includes(item.in_folder_id) }]">
+        <img v-if="item.img_path || item.material_type == 1" :src="item.img_path" :onerror="defaultImg" alt />
+        <div v-if="!item.img_path && item.material_type == 2" class="radio_img"></div>
+        <div class="item_format">
+          <span class="item_type">{{ item.deposit_url | getFileFormat }}</span>
+          <span v-if="item.material_type != 0" class="item_time">{{ item.duration | getSeconds }}</span>
+        </div>
+        <div class="file_name">{{ item.material_name }}</div>
+        <span v-if="isMultiSelected" class="checked_btn" @click="selectedItem(item)"></span>
+      </div>
+    </div>
+
+    <!-- 多选操作 -->
+    <div v-if="selectInFolderid.length !== 0 || folderChecked != -1" class="multi_handle">
+      <div v-if="!isEditFolder && folderChecked == -1 && isMultiSelected">
+        <el-button type="button" class="mulit_btn" @click="publishHandle(0)">即时发布</el-button>
+        <el-button type="button" class="mulit_btn" @click="publishHandle(1)">定时发布</el-button>
+        <el-button type="button" class="mulit_btn">下载</el-button>
+        <el-button type="button" class="mulit_btn" @click="moveingTo">移动</el-button>
+        <el-button type="button" class="mulit_btn mulit_delt_btn" @click="deltMyAlbumItem">删除</el-button>
+      </div>
+      <div v-else>
+        <el-button type="button" class="mulit_btn" @click="handleMkdir(1)">编辑</el-button>
+        <el-button type="button" class="mulit_btn mulit_delt_btn" @click="deleteMaterialFolder">删除</el-button>
+      </div>
+    </div>
+    <!-- 创建文件夹layer / 编辑 -->
+    <div class="publish_layer">
+      <el-dialog title="创建文件夹" :close-on-click-modal="false" :show-close="false" :visible.sync="mkdirVisible" width="616px" height="384px">
+        <el-form ref="folderForm" :inline="true" :model="folderForm" size="small" label-width="100px">
+          <el-form-item
+            label="文件夹名称"
+            prop="name"
+            :rules="[
+              { required: true, message: '请输入名称', trigger: 'blur' }
+            ]"
+          >
+            <el-input v-model="folderForm.name" style="width: 336px" />
+          </el-form-item>
+          <el-form-item label="封面" prop="file">
+            <UploadCover ref="childUpload" />
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" round @click="submitFolderForm('folderForm')">保 存</el-button>
+          <el-button round @click="mkdirVisible=false">取 消</el-button>
+        </div>
+      </el-dialog>
+    </div>
+
+    <!-- 移动至layer -->
+    <div class="wjj_layer">
+      <!-- width="736px" -->
+      <el-dialog title="移动至" :close-on-click-modal="false" :show-close="false" :visible.sync="movingVisible" width="576px" height="384px">
+        <div class="wjj_list">
+          <div v-for="(item, index) in folderList" :key="index" :class="['wjj_item', { 'wjj_item_active': folderListChecked == index }]" @click="wjjSelected(item,index)">
+            <svg class="font-icon icon" aria-hidden="true">
+              <use xlink:href="#icon-wenjianjia" />
+            </svg>
+            <p class="wjj_name">{{ item.name }}</p>
+          </div>
+        </div>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" round @click="moveFile">确定</el-button>
+          <el-button round @click="movingVisible=false">取消</el-button>
+        </div>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script>
+import { FetchMyAlbum, FetchDeleteMyAlbum, FetchSaveThemeFolder, FetchDeleteThemeFolder, FetchMoveMyThemeMaterial } from '@/api/theme/theme.js'
+import { getSeconds, getFileFormat } from '@/utils/index.js'
+import UploadCover from './upload_cover'
+export default {
+  name: 'ThemeGalleryList',
+  components: { UploadCover },
+  filters: {
+    getSeconds(s) {
+      return getSeconds(s)
+    },
+    getFileFormat(s) {
+      return getFileFormat(s)
+    }
+  },
+  props: {
+    isMultiSelected: {
+      type: Boolean,
+      required: true
+    }
+  },
+  data() {
+    return {
+      orga_id: '133221333123111', // 机构ID
+      isAlbumList: [],
+      themeGalleryList: [], // 主题库的列表
+      materialFolders: [], // 文件夹list
+      selectedListId: [],
+      selectInFolderid: [], // 关联素材得主键得ID
+      selectedMaterial: [], // 素材选中
+      thisFoldId: null || '',
+      rootFolderId: null,
+      thisAlbumFoldId: null,
+      isEditFolder: false, // 是否编辑文件夹
+      mkdirVisible: false, // 新建编辑layer
+      folderChecked: -1, // 文件夹是否单击选中
+      folderListChecked: -1,
+      isToFolder: false, // 是否进入文件夹
+      currentFolder: '', // 当前进入的文件夹名
+      currentFolderId: null,
+      folderList: [], // 文件夹list
+      movingVisible: false,
+      movingChecked: null,
+      folderForm: { // form
+        fid: '',
+        id: '',
+        img_path: '',
+        name: '',
+        orga_id: ''
+      }
+    }
+  },
+  computed: {
+    defaultImg() {
+      return 'this.src="' + require('@/assets/images/menu_bg_02.png') + '"'
+    }
+  },
+  watch: {
+    isMultiSelected(newName, oldName) {
+      if (newName === false) {
+        this.selectedListId = []
+        this.selectInFolderid = []
+      }
+    }
+  },
+  mounted() {
+    this.getMyAlbum()
+    document.addEventListener('click', this.hiddenFolderActiveClick)
+  },
+  methods: {
+    breadcrumbToAlbum() {
+      this.$router.push('/theme')
+      this.getMyAlbum()
+    },
+    // 获取我的画册 list
+    getMyAlbum() {
+      let inOrOutFolderId
+      if (this.$route.query.folderTag) {
+        console.log('文件夹内')
+        this.isToFolder = true
+        this.currentFolder = localStorage.getItem('currentFolder')
+        this.currentFolderId = localStorage.getItem('currentFolderId')
+        inOrOutFolderId = this.currentFolderId
+      } else {
+        console.log('文件夹外')
+        this.isToFolder = false
+        localStorage.removeItem('currentFolder')
+        localStorage.removeItem('currentFolderId')
+        inOrOutFolderId = null
+      }
+      const params = {
+        'theme_name': null,
+        'theme_class': null,
+        'device_direction': null,
+        'orga_id': this.orga_id,
+        'start_time': null,
+        'end_time': null,
+        'folder_id': inOrOutFolderId
+      }
+      // this.materialFolders = []
+      // this.themeGalleryList = []
+      FetchMyAlbum(params).then(res => {
+        if (res.code == 200) {
+          this.materialFolders = res.data.materialFolders
+          this.themeGalleryList = res.data.pageThemeVO
+
+          this.isAlbumList = res.data.pageThemeVO
+          this.thisAlbumFoldId = res.data.thisFoldId
+          if (!this.$route.query.folderTag) {
+            localStorage.setItem('rootFolderId', res.data.thisFoldId)
+          }
+          // 创建文件夹获取data
+          this.thisFoldId = res.data.thisFoldId
+        } else {
+          this.$message.error(res.msg)
+        }
+      })
+    },
+    // 删除我的画册里的素材
+    deltMyAlbumItem() {
+      const params = {
+        ids: this.selectInFolderid
+      }
+      FetchDeleteMyAlbum(params).then(res => {
+        if (res.code == 200) {
+          this.$message.success(res.msg)
+          this.getMyAlbum()
+        } else {
+          this.$message.error(res.msg)
+        }
+      })
+    },
+    // 多选选中
+    selectedItem(item) {
+      const id = item.material_id
+      const inFolderId = item.in_folder_id
+      // const type = item.material_type
+      const arr = this.selectedListId
+      const arr2 = this.selectInFolderid
+      if (arr2.includes(inFolderId)) {
+        const index = arr2.indexOf(inFolderId)
+        if (index > -1) {
+          arr2.splice(index, 1)
+          arr.splice(index, 1)
+          this.selectInFolderid.splice(index, 1)
+          this.selectedMaterial.splice(index, 1)
+        }
+      } else {
+        this.selectedListId.push(id)
+        this.selectInFolderid.push(inFolderId)
+        this.selectedMaterial.push(item)
+        // this.formatType = type
+      }
+    },
+    // 新建 / 编辑 文件夹
+    handleMkdir(mkdirType) {
+      this.mkdirVisible = true
+      this.folderForm.fid = this.thisFoldId
+      this.folderForm.orga_id = this.orga_id
+      if (mkdirType === 0) {
+        this.$nextTick(() => {
+          this.$refs.childUpload.imageUrl = ''
+          this.folderForm.img_path = ''
+          this.folderForm.name = ''
+        })
+        delete this.folderForm.id
+      } else {
+        this.$nextTick(() => {
+          this.$refs.childUpload.imageUrl = this.folderForm.img_path
+        })
+      }
+    },
+    // 文件夹双击操作
+    floderDbClick(item, index) {
+      this.$router.replace(
+        {
+          path: '/theme', query: { folderTag: 1 }
+        }
+      )
+      this.currentFolder = item.name
+      this.currentFolderId = item.id
+      localStorage.setItem('currentFolder', this.currentFolder)
+      localStorage.setItem('currentFolderId', this.currentFolderId)
+      this.getMyAlbum()
+      this.selectedListId = []
+      this.folderChecked = -1
+      this.isEditFolder = false
+    },
+    // 点击其他区域选中的文件夹 去掉选中样式
+    hiddenFolderActiveClick() {
+      this.folderChecked = -1
+      this.isEditFolder = false
+    },
+    // 选择 编辑 文件夹
+    editFolder(item, index) {
+      this.selectedListId = []
+      // 有选择中的文件夹时，同时存在素材多选操作时
+      this.$emit('changedMultiSelected')
+      if (index != this.folderChecked) {
+        this.folderChecked = index
+        this.isEditFolder = true
+        this.folderForm = {
+          fid: item.fid,
+          id: item.id,
+          name: item.name,
+          img_path: item.imgPath,
+          orga_id: item.orgaId
+        }
+      } else {
+        this.folderChecked = -1
+        this.isEditFolder = false
+      }
+    },
+    // 删除 文件夹
+    deleteMaterialFolder() {
+      console.log(this.folderForm.id)
+      this.$confirm('此操作将永久删除该文件夹, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        const ids = []
+        ids.push(this.folderForm.id)
+        const params = {
+          ids: ids
+        }
+        FetchDeleteThemeFolder(params).then(res => {
+          if (res.code === 200) {
+            this.$message({
+              message: '删除文件夹成功',
+              type: 'success'
+            })
+            this.getMyAlbum()
+            this.folderChecked = -1
+            this.isEditFolder = false
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          message: '已取消删除',
+          type: 'info'
+        })
+      })
+    },
+    // 提交表单 - 新建/编辑
+    submitFolderForm(formName) {
+      this.folderForm.img_path = this.$refs.childUpload.imageUrl
+      console.log(this.folderForm)
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          FetchSaveThemeFolder(this.folderForm).then(res => {
+            if (res.code === 200) {
+              this.$message({
+                message: '创建文件夹成功',
+                duration: 2000,
+                type: 'success'
+              })
+              this.mkdirVisible = false
+              this.getMyAlbum()
+            } else {
+              this.$message({
+                message: '创建文件夹失败',
+                duration: 2000,
+                type: 'warning'
+              })
+            }
+          })
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    // 点击-移动btn
+    moveingTo(index) {
+      this.folderList = []
+      if (this.materialFolders.length > 0) {
+        this.folderList = this.materialFolders.slice(0, this.materialFolders.length)
+      }
+      this.rootFolderId = localStorage.getItem('rootFolderId')
+      const returnFolder = {
+        id: this.rootFolderId,
+        name: '返回上一级'
+      }
+      this.folderList.unshift(returnFolder)
+      this.movingVisible = true
+    },
+    // 文件夹list - 选中操作
+    wjjSelected(item, index) {
+      this.folderListChecked = index
+      this.thisFoldId = item.id
+    },
+    // 点击确定 - 移动素材
+    moveFile() {
+      if (this.materialFolders.length > 0) {
+        if (this.thisFoldId == this.rootFolderId) {
+          this.$message({
+            message: '不能讲文件移动到自身目录下哦~',
+            type: 'error'
+          })
+          return
+        }
+      } else {
+        this.thisFoldId = this.rootFolderId
+      }
+      const params = {
+        'folder_id': this.thisFoldId,
+        'ids': this.selectInFolderid,
+        'material_ids': this.selectedListId
+      }
+      FetchMoveMyThemeMaterial(params).then(res => {
+        if (res.code === 200) {
+          this.$message({
+            message: '移动成功',
+            type: 'success'
+          })
+          this.movingVisible = false
+          this.getMyAlbum()
+          this.selectedListId = []
+          this.selectInFolderid = []
+        }
+      })
+    },
+    // 即时发布/定时发布
+    publishHandle(index) {
+      localStorage.removeItem('selectedMaterial')
+      localStorage.removeItem('releaseId')
+      this.selectedMaterial = this.filterArrObj(this.selectedMaterial, 'material_id')
+      // 判断是否选择了多个音频文件
+      const resultAudio = []
+      this.selectedMaterial.map(item => {
+        if (item.material_type == 2) {
+          resultAudio.push(item)
+        }
+      })
+      if (resultAudio.length > 1) {
+        this.$message.error('音频类型的文件只可选择1个')
+        return
+      }
+      localStorage.setItem('selectedMaterial', JSON.stringify(this.selectedMaterial))
+      this.$router.push(
+        {
+          path: '/release', query: { tag: index }
+        }
+      )
+    },
+    // 主题库存在重复得情况，发布前过滤
+    filterArrObj(arr, filterField) {
+      const newArr = arr.reduce((pre, cur) => pre.some(item => item[filterField] == cur[filterField])
+        ? pre : [...pre, cur], [])
+      return newArr
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.el-tabs {
+  margin-bottom: 0;
+}
+::v-deep .el-tabs__item.is-active {
+  color: #3a8aeb;
+}
+.theme_img {
+  .theme_mkdir {
+    position: relative;
+    width: 140px;
+    height: 250px;
+    margin: 0 24px 24px 0;
+    &.cont_upload .font-icon {
+      width: 45px;
+      height: 45px;
+      margin-bottom: 20px;
+    }
+    &.folder .font-icon {
+      width: 84px;
+      height: 69px;
+    }
+    .icon_bg{
+      img{
+        display: block;
+        width: 140px;
+        height: 250px;
+      }
+    }
+  }
+  .theme_item {
+    width: 140px;
+    height: 250px;
+  }
+  .icon_bg {
+    height: 220px;
+  }
+  .theme_item {
+    .file_name {
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      width: 100%;
+      height: 30px;
+      background: rgba(255, 255, 255, 0.6);
+      line-height: 30px;
+    }
+  }
+}
+.material_crumbs {
+  padding: 0 0 15px 0;
+  line-height: 30px;
+  background: #fff;
+  ::v-deep .el-breadcrumb {
+    font-size: 12px;
+    color: #999999;
+  }
+}
+</style>
diff --git a/src/views/components/ThemeGalleryList.vue b/src/views/components/ThemeGalleryList.vue
index 91a4ec0..deac9ee 100644
--- a/src/views/components/ThemeGalleryList.vue
+++ b/src/views/components/ThemeGalleryList.vue
@@ -8,25 +8,12 @@
       <el-tab-pane label="横屏" name="1" />
       <el-tab-pane label="我的画册" name="2" />
     </el-tabs>
-    <div v-if="isToFolder && themeItemActive==2" class="material_crumbs">
-      <el-breadcrumb separator-class="el-icon-arrow-right">
-        <el-breadcrumb-item><a href="/theme">主题库</a></el-breadcrumb-item>
-        <el-breadcrumb-item><a @click="breadcrumbToAlbum">我的画册</a></el-breadcrumb-item>
-        <el-breadcrumb-item>{{ currentFolder }}</el-breadcrumb-item>
-      </el-breadcrumb>
-    </div>
+
     <div class="theme_img">
-      <MaterialFolder
-        ref="MaterialFolder"
-        :theme-item-active="themeItemActive"
-        :material-folders="materialFolders"
-        :is-to-folder="isToFolder"
-        :this-fold-id="thisFoldId"
-        :selected-list-id="selectedListId"
-        :select-in-folderid="selectInFolderid"
-        @getMyAlbum="getMyAlbum"
-      />
-      <div style="display: flex;">
+      <div v-show="themeItemActive==2">
+        <MyAlbum ref="myAlbum" :is-multi-selected="isMultiSelected" />
+      </div>
+      <div v-if="themeItemActive!=2" style="display:flex">
         <!-- 主题库list -->
         <div v-for="(item, index) in themeGalleryList" :key="index" :class="['theme_item', { 'item_multi': selectedListId.includes(item.material_id) }]">
           <img v-if="item.img_path || item.material_type == 1" :src="item.img_path" :onerror="defaultImg" alt />
@@ -42,18 +29,12 @@
     </div>
     <!-- 多选操作 -->
     <div v-if="showItemInfo">
-      <div v-if="selectedListId.length !== 0 || folderChecked != -1" class="multi_handle">
-        <div v-if="!isEditFolder && folderChecked == -1 && isMultiSelected">
+      <div v-if="selectedListId.length != 0" class="multi_handle">
+        <div v-if="isMultiSelected">
           <el-button type="button" class="mulit_btn" @click="publishHandle(0)">即时发布</el-button>
           <el-button type="button" class="mulit_btn" @click="publishHandle(1)">定时发布</el-button>
           <el-button type="button" class="mulit_btn">下载</el-button>
-          <el-button v-if="themeItemActive!=2" type="button" class="mulit_btn" @click="addToAlbum">添加到画册</el-button>
-          <el-button v-if="themeItemActive==2" type="button" class="mulit_btn" @click="moveingTo">移动</el-button>
-          <el-button v-if="themeItemActive==2" type="button" class="mulit_btn mulit_delt_btn" @click="deltMyAlbumItem">删除</el-button>
-        </div>
-        <div v-else>
-          <el-button type="button" class="mulit_btn" @click="handleMkdir(1)">编辑</el-button>
-          <el-button type="button" class="mulit_btn mulit_delt_btn" @click="deleteMaterialFolder">删除</el-button>
+          <el-button type="button" class="mulit_btn" @click="addToAlbum">添加到画册</el-button>
         </div>
       </div>
     </div>
@@ -61,12 +42,12 @@
 </template>
 
 <script>
-import { FetchThemeClassList, FetchThemeGallery, FetchMyAlbum, FetchAddToMyAlbum, FetchDeleteMyAlbum } from '@/api/theme/theme.js'
+import { FetchThemeClassList, FetchThemeGallery, FetchAddToMyAlbum } from '@/api/theme/theme.js'
 import { getSeconds, getFileFormat } from '@/utils/index.js'
-import MaterialFolder from './materialFolder'
+import MyAlbum from './MyAlbum'
 export default {
   name: 'ThemeGalleryList',
-  components: { MaterialFolder },
+  components: { MyAlbum },
   filters: {
     getSeconds(s) {
       return getSeconds(s)
@@ -108,23 +89,11 @@ export default {
       total: 0,
       tabItem: [], // 主题库分类菜单
       activeIndex: 0,
-      themeItemActive: 0 || '0', // 横屏/ 竖屏/ 画册 activeIndex
+      themeItemActive: 0, // 横屏/ 竖屏/ 画册 activeIndex
       themeGalleryList: [], // 主题库的列表
-      materialFolders: [], // 文件夹list
       selectedListId: [],
       selectInFolderid: [], // 关联素材得主键得ID
-      selectedMaterial: [], // 素材选中
-      thisFoldId: null || '',
-      rootFolderId: null,
-      thisAlbumFoldId: null,
-      isEditFolder: false, // 是否编辑文件夹
-      mkdirVisible: false, // 新建编辑layer
-      folderChecked: -1, // 文件夹是否单击选中
-      isEditMaterial: false, // 是否是编辑素材
-      folderListChecked: -1,
-      isToFolder: false, // 是否进入文件夹
-      currentFolder: '', // 当前进入的文件夹名
-      currentFolderId: null
+      selectedMaterial: [] // 素材选中
     }
   },
   computed: {
@@ -136,13 +105,12 @@ export default {
     isMultiSelected(newName, oldName) {
       if (newName === false) {
         this.selectedListId = []
+        this.$refs.myAlbum.selectInFolderid = []
       }
     }
   },
   mounted() {
     this.getThemeClassList()
-    this.getMyAlbum()
-    document.addEventListener('click', this.hiddenFolderActiveClick)
   },
   methods: {
     // 根据机构id查询主题库分类列表
@@ -159,7 +127,9 @@ export default {
     tabThemeClassifyClick(tab) {
       this.activeIndex = tab.index
       if (this.themeItemActive == 2) {
-        this.getMyAlbum()
+        this.selectedListId = []
+        this.$refs.myAlbum.selectInFolderid = []
+        this.$refs.myAlbum.getMyAlbum()
       } else {
         this.themeGalleryList = []
         this.getThemeGallery()
@@ -169,22 +139,21 @@ export default {
     tabItemClick(tab) {
       this.themeItemActive = tab.index
       if (this.themeItemActive == 2) {
+        this.selectedListId = []
+        this.$refs.myAlbum.selectInFolderid = []
         this.$router.push('/theme')
-        this.getMyAlbum()
+        this.$nextTick(function() {
+          this.$refs.myAlbum.getMyAlbum()
+        })
       } else {
         this.themeGalleryList = []
         this.getThemeGallery()
       }
     },
-    breadcrumbToAlbum() {
-      this.$router.push('/theme')
-      this.getMyAlbum()
-    },
     // 获取主题库list
     getThemeGallery() {
       this.themeListForm.orga_id = this.orga_id
       this.themeListForm.theme_class = this.tabItem[this.activeIndex].id
-      console.log(this.showItemInfo)
       if (this.showItemInfo) {
         this.themeListForm.device_direction = this.themeItemActive == 0 ? 2 : 1
       } else {
@@ -201,61 +170,19 @@ export default {
         }
       })
     },
-    // 获取我的画册 list
-    getMyAlbum() {
-      let inOrOutFolderId
-      if (this.$route.query.folderTag) {
-        console.log('文件夹内')
-        this.isToFolder = true
-        this.currentFolder = localStorage.getItem('currentFolder')
-        this.currentFolderId = localStorage.getItem('currentFolderId')
-        inOrOutFolderId = this.currentFolderId
-      } else {
-        console.log('文件夹外')
-        this.isToFolder = false
-        localStorage.removeItem('currentFolder')
-        localStorage.removeItem('currentFolderId')
-        inOrOutFolderId = null
-      }
-      const params = {
-        'theme_name': null,
-        'theme_class': null,
-        'device_direction': null,
-        'orga_id': this.orga_id,
-        'start_time': null,
-        'end_time': null,
-        'folder_id': inOrOutFolderId
-      }
-      this.materialFolders = []
-      this.themeGalleryList = []
-      FetchMyAlbum(params).then(res => {
-        if (res.code == 200) {
-          this.materialFolders = res.data.materialFolders
-          this.themeGalleryList = res.data.pageThemeVO
-          this.isAlbumList = res.data.pageThemeVO
-          this.thisAlbumFoldId = res.data.thisFoldId
-          if (!this.$route.query.folderTag) {
-            localStorage.setItem('rootFolderId', res.data.thisFoldId)
-          }
-          // 创建文件夹获取data
-          this.thisFoldId = res.data.thisFoldId
-        } else {
-          this.$message.error(res.msg)
-        }
-      })
-    },
     // 添加到画册
     addToAlbum() {
-      const isRepeatItem = this.isAlbumList.filter(item => {
+      const thisAlbumFoldId = this.$refs.myAlbum.thisAlbumFoldId
+      const isAlbumList = this.$refs.myAlbum.isAlbumList
+      const isRepeatItem = isAlbumList.filter(item => {
         return this.selectedListId.indexOf(item.material_id) != -1
       })
-      console.log(isRepeatItem)
       if (isRepeatItem.length != 0) {
         this.$message.error('选中得素材，我的画册里已存在，请勿重复添加！')
         return
       }
       const params = {
-        id: this.thisAlbumFoldId, // 文件夹id
+        id: thisAlbumFoldId, // 文件夹id
         material_ids: this.selectedListId, // 主题素材id集合
         orga_id: this.orga_id
       }
@@ -268,25 +195,10 @@ export default {
         }
       })
     },
-    // 删除我的画册里的素材
-    deltMyAlbumItem() {
-      const params = {
-        ids: this.selectInFolderid
-      }
-      FetchDeleteMyAlbum(params).then(res => {
-        if (res.code == 200) {
-          this.$message.success(res.msg)
-          this.getMyAlbum()
-        } else {
-          this.$message.error(res.msg)
-        }
-      })
-    },
     // 多选选中
     selectedItem(item) {
       const id = item.material_id
       const inFolderId = item.in_folder_id
-      // const type = item.material_type
       const arr = this.selectedListId
       if (arr.includes(id)) {
         const index = arr.indexOf(id)
@@ -306,7 +218,7 @@ export default {
     publishHandle(index) {
       localStorage.removeItem('selectedMaterial')
       localStorage.removeItem('releaseId')
-      localStorage.setItem('selectedMaterial', JSON.stringify(this.selectedMaterial))
+      this.selectedMaterial = this.filterArrObj(this.selectedMaterial, 'material_id')
       // 判断是否选择了多个音频文件
       const resultAudio = []
       this.selectedMaterial.map(item => {
@@ -318,11 +230,18 @@ export default {
         this.$message.error('音频类型的文件只可选择1个')
         return
       }
+      localStorage.setItem('selectedMaterial', JSON.stringify(this.selectedMaterial))
       this.$router.push(
         {
           path: '/release', query: { tag: index }
         }
       )
+    },
+    // 主题库存在重复得情况，发布前过滤
+    filterArrObj(arr, filterField) {
+      const newArr = arr.reduce((pre, cur) => pre.some(item => item[filterField] == cur[filterField])
+        ? pre : [...pre, cur], [])
+      return newArr
     }
   }
 }
@@ -376,13 +295,4 @@ export default {
     }
   }
 }
-.material_crumbs {
-  padding: 15px 24px 0 24px;
-  line-height: 30px;
-  background: #fff;
-  ::v-deep .el-breadcrumb {
-    font-size: 12px;
-    color: #999999;
-  }
-}
 </style>
diff --git a/src/views/components/materialFolder.vue b/src/views/components/materialFolder.vue
index cf5f142..06650a9 100644
--- a/src/views/components/materialFolder.vue
+++ b/src/views/components/materialFolder.vue
@@ -196,6 +196,7 @@ export default {
     editFolder(item, index) {
       this.isEditMaterial = false
       this.ChildSelectedListId = []
+      this.ChildSelectInFolderid = []
       // 有选择中的文件夹时，同时存在素材多选操作时
       this.$emit('changedMultiSelected')
       if (index != this.folderChecked) {
@@ -355,6 +356,7 @@ export default {
         display: block;
         width: 140px;
         height: 250px;
+        object-fit: cover;
       }
     }
   }
diff --git a/src/views/dashboard/HomeThemeGallery.vue b/src/views/dashboard/HomeThemeGallery.vue
index 688d519..d3bf140 100644
--- a/src/views/dashboard/HomeThemeGallery.vue
+++ b/src/views/dashboard/HomeThemeGallery.vue
@@ -26,8 +26,7 @@ export default {
   data() {
     return {
       mulitText: '多选',
-      isMultiSelected: false,
-      selectedMaterial: []
+      isMultiSelected: false
     }
   },
   mounted() {
@@ -45,19 +44,19 @@ export default {
     publishHandle(index) {
       localStorage.removeItem('selectedMaterial')
       localStorage.removeItem('releaseId')
-      this.selectedMaterial = this.$refs.ThemeGalleryList.selectedMaterial
-      localStorage.setItem('selectedMaterial', JSON.stringify(this.selectedMaterial))
-      // 判断是否选择了多个音频文件
-      const resultAudio = []
-      this.selectedMaterial.map(item => {
-        if (item.material_type == 2) {
-          resultAudio.push(item)
-        }
-      })
-      if (resultAudio.length > 1) {
-        this.$message.error('音频类型的文件只可选择1个')
-        return
-      }
+      const selectedMaterial = this.$refs.ThemeGalleryList.selectedMaterial
+      localStorage.setItem('selectedMaterial', JSON.stringify(selectedMaterial))
+      // // 判断是否选择了多个音频文件
+      // const resultAudio = []
+      // this.selectedMaterial.map(item => {
+      //   if (item.material_type == 2) {
+      //     resultAudio.push(item)
+      //   }
+      // })
+      // if (resultAudio.length > 1) {
+      //   this.$message.error('音频类型的文件只可选择1个')
+      //   return
+      // }
       this.$router.push(
         {
           path: '/release', query: { tag: index }
diff --git a/src/views/immediateRelease/index.vue b/src/views/immediateRelease/index.vue
index ebe28a3..f23d00e 100644
--- a/src/views/immediateRelease/index.vue
+++ b/src/views/immediateRelease/index.vue
@@ -495,6 +495,7 @@ export default {
         }
       })
     },
+    // 比较排序
     compare(attr) {
       return function(a, b) {
         var val1 = a[attr]