| @@ -24,6 +24,17 @@ export function doGetVideoDetialById(id) { | |||
| }) | |||
| } | |||
| /** | |||
| * @description 根据id删除作品 | |||
| * @param {number} id (pageNum, pageSize) | |||
| */ | |||
| export function deleteVideoById(id) { | |||
| return request({ | |||
| url: `/api/userVideo/del?id=${id}`, | |||
| method: 'get' | |||
| }) | |||
| } | |||
| /** | |||
| * @description 查询用户邀请码状态 | |||
| * @returns data | |||
| @@ -33,4 +44,5 @@ export function doFindInviteCode() { | |||
| url: `/api/inviteCode/find`, | |||
| method: 'get', | |||
| }) | |||
| } | |||
| } | |||
| @@ -60,6 +60,7 @@ export default { | |||
| try { | |||
| const res = await doLoginOut(); | |||
| this.$router.push("/login"); | |||
| localStorage.removeItem("AccessToken"); | |||
| } catch (error) { | |||
| console.log(error, "error"); | |||
| Toast.fail(error.message); | |||
| @@ -820,7 +820,7 @@ export default { | |||
| overflow: hidden; | |||
| transform: translateX(30%); | |||
| opacity: 0; | |||
| transition: all 1s; | |||
| transition: all 0.5s; // global-transition | |||
| &.active { | |||
| opacity: 1; | |||
| transform: translateX(0); | |||
| @@ -44,7 +44,7 @@ export default { | |||
| .page { | |||
| transform: translateX(30%); | |||
| opacity: 0; | |||
| transition: all 1s; | |||
| transition: all 0.5s; // global-transition | |||
| &.active { | |||
| opacity: 1; | |||
| transform: translateX(0); | |||
| @@ -68,13 +68,11 @@ export function scrollToID(id) { | |||
| */ | |||
| export function timestampToTime(timestamp, format) { | |||
| //时间戳为10位需*1000,时间戳为13位不需乘1000 | |||
| const length = timestamp.length || '' | |||
| const length = timestamp.length | |||
| if (length <= 10) { | |||
| var date = new Date(timestamp * 1000) | |||
| } else if (length > 10) { | |||
| var date = new Date(timestamp) | |||
| } else { | |||
| return '无时间戳' | |||
| var date = new Date(timestamp) | |||
| } | |||
| let Y = String(date.getFullYear()) | |||
| let M = String(date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) | |||
| @@ -324,12 +324,10 @@ export default { | |||
| <style lang="scss" scoped> | |||
| .page { | |||
| transform: translateX(30%); | |||
| opacity: 0; | |||
| transition: all 1s; | |||
| transition: all 0.5s; // global-transition | |||
| &.active { | |||
| opacity: 1; | |||
| transform: translateX(0); | |||
| } | |||
| .logoBox { | |||
| // margin-top: 10px; | |||
| @@ -135,7 +135,7 @@ export default { | |||
| this.$router.push({ | |||
| path: "/getPaper", | |||
| query: { | |||
| modelDetail: modelDetail, | |||
| modelDetail: JSON.stringify(modelDetail), | |||
| saveID: res.data.id, | |||
| }, | |||
| }); | |||
| @@ -176,7 +176,7 @@ export default { | |||
| .page { | |||
| transform: translateX(30%); | |||
| opacity: 0; | |||
| transition: all 1s; | |||
| transition: all 0.5s; // global-transition | |||
| padding-bottom: 25px; | |||
| &.active { | |||
| opacity: 1; | |||
| @@ -138,7 +138,7 @@ export default { | |||
| .page { | |||
| transform: translateX(30%); | |||
| opacity: 0; | |||
| transition: all 1s; | |||
| transition: all 0.5s; // global-transition | |||
| padding-bottom: 25px; | |||
| &.active { | |||
| opacity: 1; | |||
| @@ -131,6 +131,7 @@ export default { | |||
| backgroundMouldId: "", | |||
| backgroundMouldSmId: "", | |||
| }, | |||
| comeFrom: "", // 由哪个页面跳转而来 | |||
| }; | |||
| }, | |||
| computed: { | |||
| @@ -185,7 +186,16 @@ export default { | |||
| }, | |||
| back() { | |||
| this.$router.back(); | |||
| if (this.comeFrom == "getPaper") { | |||
| this.$router.push({ | |||
| path: "/getPaper", | |||
| query: { | |||
| id: this.id, | |||
| }, | |||
| }); | |||
| } else { | |||
| this.$router.back(); | |||
| } | |||
| }, | |||
| goMy() { | |||
| @@ -305,6 +315,7 @@ export default { | |||
| }; | |||
| console.log(data, "最终提交的参数"); | |||
| // 当没有选择声音参数时 | |||
| if (!this.soundParams.voiceMouldId || !this.soundParams.voiceMouldSmId) { | |||
| Toast.fail("请选择声音!"); | |||
| return; | |||
| @@ -328,6 +339,12 @@ export default { | |||
| }, | |||
| }, | |||
| beforeRouteEnter(to, from, next) { | |||
| next((vm) => { | |||
| vm.comeFrom = from.name; | |||
| }); | |||
| }, | |||
| created() { | |||
| this.coverImg = this.$route.query.coverImg; | |||
| this.id = this.$route.query.id; | |||
| @@ -349,7 +366,7 @@ export default { | |||
| .page { | |||
| transform: translateX(30%); | |||
| opacity: 0; | |||
| transition: all 1s; | |||
| transition: all 0.5s; // global-transition | |||
| padding-bottom: 25px; | |||
| &.active { | |||
| opacity: 1; | |||
| @@ -124,6 +124,7 @@ export default { | |||
| title: this.title, | |||
| }; | |||
| // 来自编辑 | |||
| if (this.id) { | |||
| data.id = this.id; | |||
| } | |||
| @@ -180,16 +181,18 @@ export default { | |||
| } | |||
| }, | |||
| }, | |||
| created() { | |||
| this.id = this.$route.query.id; | |||
| if (this.id) { | |||
| this.getDetailById(this.id); | |||
| } else { | |||
| this.modelDetail = this.$route.query.modelDetail; | |||
| this.modelDetail = JSON.parse(this.$route.query.modelDetail); | |||
| console.log(this.modelDetail, "modelDetail"); | |||
| } | |||
| this.saveID = this.$route.query.saveID; | |||
| }, | |||
| mounted() { | |||
| this.inPage = true; | |||
| scrollToID("top"); | |||
| @@ -201,7 +204,7 @@ export default { | |||
| .page { | |||
| transform: translateX(30%); | |||
| opacity: 0; | |||
| transition: all 1s; | |||
| transition: all 0.5s; // global-transition | |||
| padding-bottom: 25px; | |||
| &.active { | |||
| opacity: 1; | |||
| @@ -5,34 +5,49 @@ | |||
| <img class="showIMG" src="../../assets/img/BG-Page.png" alt="" /> | |||
| <div class="item"> | |||
| <div class="title">我的视频作品</div> | |||
| <div class="itemList"> | |||
| <div | |||
| v-if="videoList.length > 0" | |||
| class="videoModel" | |||
| v-for="(item, index) in videoList" | |||
| :key="index" | |||
| @click="goDetail(item)" | |||
| > | |||
| <div class="videoPrv"> | |||
| <img src="../../assets/img/BG@2x.png" /> | |||
| <div v-if="item.videoStatus == 0" class="cover">草稿</div> | |||
| <div v-if="item.videoStatus == 1" class="cover">视频生成中</div> | |||
| <div v-if="item.videoStatus == 3" class="cover">视频生成失败</div> | |||
| <!-- <div v-if="item.videoStatus == ?" class="cover">排队中</div> --> | |||
| </div> | |||
| <div class="videoInfo"> | |||
| <div class="videoName"> | |||
| {{ item.title || "暂无" }} | |||
| <van-swipe-cell v-for="(item, index) in videoList"> | |||
| <div class="itemList"> | |||
| <div | |||
| v-if="videoList.length > 0" | |||
| class="videoModel" | |||
| :key="index" | |||
| @click="goDetail(item)" | |||
| > | |||
| <div class="videoPrv"> | |||
| <img src="../../assets/img/BG@2x.png" /> | |||
| <div v-if="item.videoStatus == 0" class="cover">草稿</div> | |||
| <div v-if="item.videoStatus == 1" class="cover">视频生成中</div> | |||
| <div v-if="item.videoStatus == 3" class="cover">视频生成失败</div> | |||
| <!-- <div v-if="item.videoStatus == ?" class="cover">排队中</div> --> | |||
| </div> | |||
| <div class="createTime">视频时长:{{ item.videoTime }}</div> | |||
| <div class="createTime">视频容量:{{ item.videoSize }}</div> | |||
| <div class="createTime"> | |||
| 创建时间:{{ changeTime(item.createDate, "YYYY-MM-DD hh:mm:ss") }} | |||
| <div class="videoInfo"> | |||
| <div class="videoName"> | |||
| {{ item.title || "暂无" }} | |||
| </div> | |||
| <div class="createTime">视频时长:{{ item.videoTime }}</div> | |||
| <div class="createTime">视频容量:{{ item.videoSize }}</div> | |||
| <div class="createTime"> | |||
| 创建时间:{{ | |||
| changeTime(item.createDate, "YYYY-MM-DD hh:mm:ss") | |||
| }} | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <div v-if="videoList.length <= 0" class="noWork"> | |||
| 您还没有视频作品 | |||
| </div> | |||
| </div> | |||
| <div v-if="videoList.length <= 0" class="noWork">您还没有视频作品</div> | |||
| </div> | |||
| <template #right> | |||
| <van-button | |||
| square | |||
| text="删除" | |||
| type="danger" | |||
| class="delete-button" | |||
| @click="goDelete(item.id)" | |||
| /> | |||
| </template> | |||
| </van-swipe-cell> | |||
| </div> | |||
| <van-pagination | |||
| v-model="currentPage" | |||
| @@ -63,7 +78,7 @@ | |||
| <script> | |||
| // 组件 | |||
| import Vue from "vue"; | |||
| import { Toast } from "vant"; | |||
| import { Toast, Dialog } from "vant"; | |||
| import { mapState, mapActions } from "vuex"; | |||
| import HeadTop from "./../../components/common/head.vue"; | |||
| // 工具 | |||
| @@ -78,6 +93,7 @@ import { | |||
| getVideoList, | |||
| doGetVideoDetialById, | |||
| doFindInviteCode, | |||
| deleteVideoById, | |||
| } from "../../api/myPage"; | |||
| Vue.use(Toast); | |||
| @@ -146,20 +162,27 @@ export default { | |||
| }, | |||
| }); | |||
| } else if (status == 3) { | |||
| this.$router.push({ | |||
| path: "/getPaper", | |||
| query: { | |||
| id: item.id, | |||
| }, | |||
| }); | |||
| } | |||
| }, | |||
| async loadVideoList(pageNum, pageSize) { | |||
| try { | |||
| const res = await getVideoList(pageNum, pageSize); | |||
| console.log(res, "获取作品列表"); | |||
| this.videoList = res.data.list; | |||
| this.getDetailJoinList(this.videoList); | |||
| this.total = res.data.total; | |||
| } catch (error) { | |||
| console.log(error, "error"); | |||
| Toast.fail(error.message); | |||
| } | |||
| goDelete(id) { | |||
| Dialog.confirm({ | |||
| title: "删除作品", | |||
| message: "您确定要删除该作品吗?", | |||
| }) | |||
| .then(() => { | |||
| this.deleteVideoById(id); | |||
| this.loadVideoList(this.currentPage, this.pageSize); | |||
| }) | |||
| .catch(() => { | |||
| return; | |||
| }); | |||
| }, | |||
| // 将获取到的视频详情(视频时长、视频容量)加入视频列表 | |||
| @@ -189,6 +212,22 @@ export default { | |||
| }); | |||
| }, | |||
| /** | |||
| * @description:获取作品列表 | |||
| */ | |||
| async loadVideoList(pageNum, pageSize) { | |||
| try { | |||
| const res = await getVideoList(pageNum, pageSize); | |||
| console.log(res, "获取作品列表"); | |||
| this.videoList = res.data.list; | |||
| this.getDetailJoinList(this.videoList); | |||
| this.total = res.data.total; | |||
| } catch (error) { | |||
| console.log(error, "error"); | |||
| Toast.fail(error.message); | |||
| } | |||
| }, | |||
| /** | |||
| * @description 通过视频id获取视频详情 | |||
| */ | |||
| @@ -203,6 +242,19 @@ export default { | |||
| } | |||
| }, | |||
| /** | |||
| * @description 根据id删除作品 | |||
| */ | |||
| async deleteVideoById(id) { | |||
| try { | |||
| const res = await deleteVideoById(id); | |||
| console.log(res, "根据id删除作品"); | |||
| } catch (error) { | |||
| console.log(error, "error"); | |||
| Toast.fail(error.message); | |||
| } | |||
| }, | |||
| /** | |||
| * @description:查询用户邀请码状态 | |||
| */ | |||
| @@ -229,10 +281,12 @@ export default { | |||
| this.$router.push("/chooseModel"); | |||
| }, | |||
| }, | |||
| mounted() { | |||
| this.inPage = true; | |||
| scrollToID("top"); | |||
| }, | |||
| created() { | |||
| this.loadVideoList(1, this.pageSize); | |||
| }, | |||
| @@ -243,7 +297,7 @@ export default { | |||
| .page { | |||
| transform: translateX(30%); | |||
| opacity: 0; | |||
| transition: all 1s; | |||
| transition: all 0.5s; // global-transition | |||
| padding-bottom: 25px; | |||
| &.active { | |||
| opacity: 1; | |||
| @@ -445,5 +499,10 @@ export default { | |||
| opacity: 1; | |||
| } | |||
| } | |||
| .delete-button { | |||
| position: relative; | |||
| left: 1%; | |||
| height: 100%; | |||
| } | |||
| } | |||
| </style> | |||
| @@ -1,4 +1,4 @@ | |||
| const UglifyJsPlugin = require('uglifyjs-webpack-plugin') | |||
| // const UglifyJsPlugin = require('uglifyjs-webpack-plugin') | |||
| module.exports = { | |||
| css: { | |||
| @@ -47,18 +47,18 @@ module.exports = { | |||
| lintOnSave: false, | |||
| publicPath: './', // 打包后引用的资源路径 | |||
| configureWebpack: { | |||
| plugins: [ | |||
| //打包环境去掉console.log | |||
| new UglifyJsPlugin({ | |||
| uglifyOptions: { | |||
| compress: { | |||
| drop_console: true, //注释console | |||
| drop_debugger: true, //注释debugger | |||
| pure_funcs: ['console.log'], //移除console.log | |||
| }, | |||
| }, | |||
| }), | |||
| ], | |||
| } | |||
| // configureWebpack: { | |||
| // plugins: [ | |||
| // //打包环境去掉console.log | |||
| // new UglifyJsPlugin({ | |||
| // uglifyOptions: { | |||
| // compress: { | |||
| // drop_console: true, //注释console | |||
| // drop_debugger: true, //注释debugger | |||
| // pure_funcs: ['console.log'], //移除console.log | |||
| // }, | |||
| // }, | |||
| // }), | |||
| // ], | |||
| // } | |||
| } | |||