|
|
|
@ -96,6 +96,33 @@ |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="release_layer upload_layer"> |
|
|
|
<el-dialog :close-on-click-modal="false" :show-close="false" :visible.sync="selectContVisible" width="1200px"> |
|
|
|
<div slot="title" class="layer_tab_title"> |
|
|
|
<span>主题库</span> |
|
|
|
</div> |
|
|
|
<!-- 主题库 --> |
|
|
|
<div class="theme_cont"> |
|
|
|
<!-- 主题库list --> |
|
|
|
<ThemeGalleryList |
|
|
|
ref="ThemeGalleryList" |
|
|
|
:mulit-text="mulitText" |
|
|
|
:mulit-album-in-theme="mulitAlbumInTheme" |
|
|
|
:show-item-info="false" |
|
|
|
:is-my-album="false" |
|
|
|
:is-my-album-in-theme-layer="true" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div class="upload_list_right"> |
|
|
|
<div class="mulit_btn" @click="multiSelectBtn">{{ mulitText }}</div> |
|
|
|
</div> |
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
<el-button type="primary" round @click="addToAlbumBtn">确 定</el-button> |
|
|
|
<el-button round @click="cancelAddToAlbum">取 消</el-button> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
@ -103,9 +130,10 @@ |
|
|
|
import { FetchMyAlbum, FetchDeleteMyAlbum, FetchSaveThemeFolder, FetchDeleteThemeFolder, FetchMoveMyThemeMaterial } from '@/api/theme/theme.js' |
|
|
|
import { getSeconds, getFileFormat } from '@/utils/index.js' |
|
|
|
import UploadCover from './upload_cover' |
|
|
|
import ThemeGalleryList from '@/views/components/ThemeGalleryList' |
|
|
|
export default { |
|
|
|
name: 'MyAlbum', |
|
|
|
components: { UploadCover }, |
|
|
|
components: { UploadCover, ThemeGalleryList }, |
|
|
|
filters: { |
|
|
|
getSeconds(s) { |
|
|
|
return getSeconds(s) |
|
|
|
@ -149,7 +177,9 @@ export default { |
|
|
|
name: '', |
|
|
|
orga_id: '' |
|
|
|
}, |
|
|
|
selectContVisible: false |
|
|
|
selectContVisible: false, |
|
|
|
mulitText: '多选', |
|
|
|
mulitAlbumInTheme: false |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
@ -158,8 +188,9 @@ export default { |
|
|
|
} |
|
|
|
}, |
|
|
|
watch: { |
|
|
|
isMultiSelected(newName, oldName) { |
|
|
|
if (newName === false) { |
|
|
|
isMultiSelected(newName) { |
|
|
|
this.mulitAlbumInTheme = newName |
|
|
|
if (newName == false) { |
|
|
|
this.selectedListId = [] |
|
|
|
this.selectInFolderid = [] |
|
|
|
} |
|
|
|
@ -173,6 +204,31 @@ export default { |
|
|
|
addThemeToAlbum() { |
|
|
|
this.selectContVisible = true |
|
|
|
}, |
|
|
|
// 多选btn |
|
|
|
multiSelectBtn() { |
|
|
|
this.mulitAlbumInTheme = !this.mulitAlbumInTheme |
|
|
|
if (this.mulitAlbumInTheme) { |
|
|
|
this.mulitText = '取消' |
|
|
|
} else { |
|
|
|
this.mulitText = '多选' |
|
|
|
} |
|
|
|
}, |
|
|
|
// layer - 添加到画册 - 确定 |
|
|
|
addToAlbumBtn() { |
|
|
|
this.$refs.ThemeGalleryList.isAlbumList = this.isAlbumList |
|
|
|
this.$refs.ThemeGalleryList.addToAlbum() |
|
|
|
this.selectContVisible = false |
|
|
|
this.mulitAlbumInTheme = false |
|
|
|
this.mulitText = '多选' |
|
|
|
this.getMyAlbum() |
|
|
|
}, |
|
|
|
// layer - 添加到画册 - 取消 |
|
|
|
cancelAddToAlbum() { |
|
|
|
this.$refs.ThemeGalleryList.selectedListId = [] |
|
|
|
this.selectContVisible = false |
|
|
|
this.mulitAlbumInTheme = false |
|
|
|
this.mulitText = '多选' |
|
|
|
}, |
|
|
|
breadcrumbToAlbum() { |
|
|
|
this.$router.push('/content/topic') |
|
|
|
this.getMyAlbum() |
|
|
|
@ -200,8 +256,6 @@ export default { |
|
|
|
'end_time': null, |
|
|
|
'folder_id': inOrOutFolderId |
|
|
|
} |
|
|
|
// this.materialFolders = [] |
|
|
|
// this.themeGalleryList = [] |
|
|
|
FetchMyAlbum(params).then(res => { |
|
|
|
if (res.code == 200) { |
|
|
|
this.materialFolders = res.data.materialFolders |
|
|
|
@ -209,6 +263,10 @@ export default { |
|
|
|
|
|
|
|
this.isAlbumList = res.data.pageThemeVO |
|
|
|
this.thisAlbumFoldId = res.data.thisFoldId |
|
|
|
if (res.data.pageThemeVO.length) { |
|
|
|
this.selectedListId = [] |
|
|
|
this.selectInFolderid = [] |
|
|
|
} |
|
|
|
if (!this.$route.query.folderTag) { |
|
|
|
localStorage.setItem('rootFolderId', res.data.thisFoldId) |
|
|
|
} |
|
|
|
@ -221,16 +279,32 @@ 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) |
|
|
|
this.$confirm('此操作将永久删除该素材, 是否继续?', '提示', { |
|
|
|
confirmButtonText: '确定', |
|
|
|
cancelButtonText: '取消', |
|
|
|
type: 'warning' |
|
|
|
}).then(() => { |
|
|
|
const params = { |
|
|
|
ids: this.selectInFolderid |
|
|
|
} |
|
|
|
FetchDeleteMyAlbum(params).then(res => { |
|
|
|
if (res.code == 200) { |
|
|
|
this.$message.success(res.msg) |
|
|
|
this.getMyAlbum() |
|
|
|
console.log(this.isMultiSelected) |
|
|
|
this.selectedListId = [] |
|
|
|
this.selectInFolderid = [] |
|
|
|
this.folderChecked = -1 |
|
|
|
this.isEditFolder = false |
|
|
|
} else { |
|
|
|
this.$message.error(res.msg) |
|
|
|
} |
|
|
|
}) |
|
|
|
}).catch(() => { |
|
|
|
this.$message({ |
|
|
|
message: '已取消删除', |
|
|
|
type: 'info' |
|
|
|
}) |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 多选选中 |
|
|
|
@ -286,6 +360,7 @@ export default { |
|
|
|
localStorage.setItem('currentFolderId', this.currentFolderId) |
|
|
|
this.getMyAlbum() |
|
|
|
this.selectedListId = [] |
|
|
|
this.selectInFolderid = [] |
|
|
|
this.folderChecked = -1 |
|
|
|
this.isEditFolder = false |
|
|
|
}, |
|
|
|
@ -358,6 +433,8 @@ export default { |
|
|
|
}) |
|
|
|
this.mkdirVisible = false |
|
|
|
this.getMyAlbum() |
|
|
|
this.folderChecked = -1 |
|
|
|
this.isEditFolder = false |
|
|
|
} else { |
|
|
|
this.$message({ |
|
|
|
message: '创建文件夹失败', |
|
|
|
@ -476,6 +553,7 @@ export default { |
|
|
|
display: block; |
|
|
|
width: 140px; |
|
|
|
height: 250px; |
|
|
|
object-fit: cover; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -505,4 +583,23 @@ export default { |
|
|
|
color: #999999; |
|
|
|
} |
|
|
|
} |
|
|
|
.theme_main{ |
|
|
|
.release_layer { |
|
|
|
::v-deep .el-tabs { |
|
|
|
margin: -26px 0 8px 0; |
|
|
|
padding: 0; |
|
|
|
} |
|
|
|
::v-deep .el-tabs__nav-wrap::after { |
|
|
|
display: none; |
|
|
|
} |
|
|
|
::v-deep .el-tabs__active-bar { |
|
|
|
display: none; |
|
|
|
} |
|
|
|
::v-deep .theme_img{ |
|
|
|
height: auto; |
|
|
|
padding: 0; |
|
|
|
overflow: auto; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
