congzc há 2 anos
ascendente
cometimento
b874336d11
7 ficheiros alterados com 134 adições e 1300 eliminações
  1. +3
    -3
      src/apis/createVideo.js
  2. +11
    -11
      src/router/index.ts
  3. +2
    -2
      src/styles/my.scss
  4. +2
    -0
      src/types/auto-imports.d.ts
  5. +0
    -38
      src/types/components.d.ts
  6. +0
    -1231
      src/views/createVideo/index copy.vue
  7. +116
    -15
      src/views/createVideo/index.vue

+ 3
- 3
src/apis/createVideo.js Ver ficheiro

@@ -39,9 +39,9 @@ export function personBGIListApi(pageNum, pageSize, videoType) {
* @param sex ,pageNum,pageSize
* @returns data
*/
export function systemSCIListApi(sex, pageNum, pageSize) {
export function systemSCIListApi(pageNum, pageSize) {
return request({
url: `/api/personPatch/list?sex=${sex}&pageNum=${pageNum}&pageSize=${pageSize}`,
url: `/api/materialMould/list?type=5&pageNum=${pageNum}&pageSize=${pageSize}`,
method: 'get'
})
}
@@ -52,7 +52,7 @@ export function systemSCIListApi(sex, pageNum, pageSize) {
*/
export function personSCIListApi(pageNum, pageSize, videoType) {
return request({
url: `/api/materialMould/userList?type=4&pageNum=${pageNum}&pageSize=${pageSize}&videoType=${videoType}`,
url: `/api/materialMould/userList?type=5&pageNum=${pageNum}&pageSize=${pageSize}&videoType=${videoType}`,
method: 'get',
})
}


+ 11
- 11
src/router/index.ts Ver ficheiro

@@ -5,17 +5,17 @@ export const Layout = () => import("@/layout/index.vue");

// 静态路由
export const constantRoutes: RouteRecordRaw[] = [
{
path: "/redirect",
component: Layout,
meta: { hidden: true },
children: [
{
path: "/redirect/:path(.*)",
component: () => import("@/views/redirect/index.vue"),
},
],
},
// {
// path: "/redirect",
// component: Layout,
// meta: { hidden: true },
// children: [
// {
// path: "/redirect/:path(.*)",
// component: () => import("@/views/redirect/index.vue"),
// },
// ],
// },
// 登录
{
path: "/login",


+ 2
- 2
src/styles/my.scss Ver ficheiro

@@ -82,13 +82,13 @@ p {
::-webkit-scrollbar {
width: 8px;
/* 滚动条宽度 */
background-color: #f5f5f5;
// background-color: #f5f5f5;
/* 滚动条背景色 */
}

/* 定义滚动条轨道的样式 */
::-webkit-scrollbar-track {
background-color: #f5f5f5;
// background-color: #f5f5f5;
/* 滚动条轨道背景色 */
}



+ 2
- 0
src/types/auto-imports.d.ts Ver ficheiro

@@ -2,6 +2,7 @@
export {}
declare global {
const EffectScope: typeof import('vue')['EffectScope']
const ElForm: typeof import('element-plus/es')['ElForm']
const ElMessage: typeof import('element-plus/es')['ElMessage']
const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
@@ -270,6 +271,7 @@ import { UnwrapRef } from 'vue'
declare module 'vue' {
interface ComponentCustomProperties {
readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
readonly ElForm: UnwrapRef<typeof import('element-plus/es')['ElForm']>
readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']>
readonly ElMessageBox: UnwrapRef<typeof import('element-plus/es')['ElMessageBox']>
readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']>


+ 0
- 38
src/types/components.d.ts Ver ficheiro

@@ -8,14 +8,9 @@ export {}
declare module '@vue/runtime-core' {
export interface GlobalComponents {
Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default']
ElAlert: typeof import('element-plus/es')['ElAlert']
ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
ElButton: typeof import('element-plus/es')['ElButton']
ElCard: typeof import('element-plus/es')['ElCard']
ElCol: typeof import('element-plus/es')['ElCol']
ElDialog: typeof import('element-plus/es')['ElDialog']
ElDivider: typeof import('element-plus/es')['ElDivider']
ElDropdown: typeof import('element-plus/es')['ElDropdown']
ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
@@ -23,59 +18,27 @@ declare module '@vue/runtime-core' {
ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElIcon: typeof import('element-plus/es')['ElIcon']
ElInput: typeof import('element-plus/es')['ElInput']
ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
ElLink: typeof import('element-plus/es')['ElLink']
ElOption: typeof import('element-plus/es')['ElOption']
ElPagination: typeof import('element-plus/es')['ElPagination']
ElPopover: typeof import('element-plus/es')['ElPopover']
ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElSwitch: typeof import('element-plus/es')['ElSwitch']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
ElTabPane: typeof import('element-plus/es')['ElTabPane']
ElTabs: typeof import('element-plus/es')['ElTabs']
ElTag: typeof import('element-plus/es')['ElTag']
ElTooltip: typeof import('element-plus/es')['ElTooltip']
ElTree: typeof import('element-plus/es')['ElTree']
ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
ElUpload: typeof import('element-plus/es')['ElUpload']
GithubCorner: typeof import('./../components/GithubCorner/index.vue')['default']
Hamburger: typeof import('./../components/Hamburger/index.vue')['default']
IconSelect: typeof import('./../components/IconSelect/index.vue')['default']
IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default']
IEpCaretTop: typeof import('~icons/ep/caret-top')['default']
IEpClose: typeof import('~icons/ep/close')['default']
IEpCloseBold: typeof import('~icons/ep/close-bold')['default']
IEpCollection: typeof import('~icons/ep/collection')['default']
IEpDelete: typeof import('~icons/ep/delete')['default']
IEpDocumentAdd: typeof import('~icons/ep/document-add')['default']
IEpDownload: typeof import('~icons/ep/download')['default']
IEpEdit: typeof import('~icons/ep/edit')['default']
IEpGoods: typeof import('~icons/ep/goods')['default']
IEpHeadset: typeof import('~icons/ep/headset')['default']
IEpLoading: typeof import('~icons/ep/loading')['default']
IEpMenu: typeof import('~icons/ep/menu')['default']
IEpMic: typeof import('~icons/ep/mic')['default']
IEpPlus: typeof import('~icons/ep/plus')['default']
IEpPosition: typeof import('~icons/ep/position')['default']
IEpRefresh: typeof import('~icons/ep/refresh')['default']
IEpRefreshLeft: typeof import('~icons/ep/refresh-left')['default']
IEpSearch: typeof import('~icons/ep/search')['default']
IEpSetting: typeof import('~icons/ep/setting')['default']
IEpTop: typeof import('~icons/ep/top')['default']
IEpUploadFilled: typeof import('~icons/ep/upload-filled')['default']
IEpVideoCamera: typeof import('~icons/ep/video-camera')['default']
IEpVideoPlay: typeof import('~icons/ep/video-play')['default']
LangSelect: typeof import('./../components/LangSelect/index.vue')['default']
MultiUpload: typeof import('./../components/Upload/MultiUpload.vue')['default']
MyLoading: typeof import('./../components/myLoading.vue')['default']
MyLoadingIcon: typeof import('./../components/myLoadingIcon.vue')['default']
Pagination: typeof import('./../components/Pagination/index.vue')['default']
RightPanel: typeof import('./../components/RightPanel/index.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
SingleUpload: typeof import('./../components/Upload/SingleUpload.vue')['default']
@@ -85,6 +48,5 @@ declare module '@vue/runtime-core' {
}
export interface ComponentCustomProperties {
vInfiniteScroll: typeof import('element-plus/es')['ElInfiniteScroll']
vLoading: typeof import('element-plus/es')['ElLoadingDirective']
}
}

+ 0
- 1231
src/views/createVideo/index copy.vue
A apresentação das diferenças no ficheiro foi suprimida por ser demasiado grande
Ver ficheiro


+ 116
- 15
src/views/createVideo/index.vue Ver ficheiro

@@ -53,6 +53,7 @@
:infinite-scroll-disabled="overLoadModel"
>
<div
:class="modelId == item.id ? 'modeListBoxItmeActive' : ''"
class="modeListBoxItme"
v-for="item in modeList"
:key="item.id"
@@ -107,8 +108,8 @@
字幕
</div>
</div>
<!-- 文案 -->
<div v-show="tabItemActive == 1" class="tabContent tab1">
<!-- 文案 只能使用v-if,不能使用v-show-->
<div v-if="tabItemActive == 1" class="tabContent tab1">
<!-- 标题 -->
<div class="title">
<el-input
@@ -193,7 +194,7 @@
</el-select>
</div>
<!-- 背景 -->
<div v-show="tabItemActive == 2" class="tabContent tab2">
<div v-if="tabItemActive == 2" class="tabContent tab2">
<div class="tab">
<div
class="tabItem"
@@ -216,13 +217,17 @@
v-infinite-scroll="loadMoreSystemBGI"
:infinite-scroll-disabled="overLoadSystemBG"
>
<div class="bjSystemBoxItem" v-for="item in 15" :key="item">
<img class="boxCentreImg" src="" alt="" />
<div
class="bjSystemBoxItem"
v-for="item in systemBGIList"
:key="item.id"
>
<img class="boxCentreImg" :src="item.material" alt="" />
</div>
</div>
</div>
<!-- 素材 -->
<div v-show="tabItemActive == 3" class="tabContent">
<div v-if="tabItemActive == 3" class="tabContent tab3">
<div class="tab">
<div
class="tabItem"
@@ -239,9 +244,23 @@
个人素材
</div>
</div>
<!-- 素材图片展示 -->
<div
class="bjSystemBox"
v-infinite-scroll="loadMoreSystemSCI"
:infinite-scroll-disabled="overLoadSystemSC"
>
<div
class="bjSystemBoxItem"
v-for="item in systemSCIList"
:key="item.id"
>
<img class="boxCentreImg" :src="item.material" alt="" />
</div>
</div>
</div>
<!-- 字幕 -->
<div v-show="tabItemActive == 4" class="tabContent"></div>
<div v-if="tabItemActive == 4" class="tabContent"></div>
</div>
<!-- 试听的mp3 -->
<div style="opacity: 0; width: 0">
@@ -285,6 +304,7 @@ const modelTabItemActive = ref(0); //模版tab栏
const modelPageNum = ref(1);
const modelPageSize = ref(20);
const overLoadModel = ref(true); //禁用模版加载更多
const modelId = ref(null); // 选中模版的id
// 获取模版列表
async function getModeList(sex, pageNum, pageSize) {
const res = await modeListApi(sex, pageNum, pageSize);
@@ -296,6 +316,7 @@ function clickModelItem(item) {
modelImg.value = item.coverImg;
showChooseModel.value = false;
videoType.value = item.videoType;
modelId.value = item.id;
}
// tab栏切换
function changeTabSex(index) {
@@ -464,7 +485,6 @@ async function loadMoreSystemBGI() {
watch(
() => videoType,
(newValue, oldValue) => {
console.log(123);
systemBGPageNum.value = 1;
getSystemBGIList();
},
@@ -484,7 +504,7 @@ async function getpersonBGIList() {
overLoadpersonBG.value = false;
}
// 加载更多系统背景图
async function loadMorepersonBGI() {
async function loadMorePersonBGI() {
personBGPageNum.value += 1;
const res = await personBGIListApi(
personBGPageNum.value,
@@ -500,7 +520,61 @@ async function loadMorepersonBGI() {
//#endregion ----------------------------

//#region 素材
const scTabItemActive = ref(1);
const scTabItemActive = ref(1); //系统或个人tab高亮
const systemSCIList = ref([]); //系统素材列表
const systemSCPageNum = ref(1); //系统素材页数
const overLoadSystemSC = ref(true);
async function getSystemSCIList() {
const res = await systemSCIListApi(
systemSCPageNum.value,
20,
videoType.value
);
systemSCIList.value = res.data.list;
overLoadSystemSC.value = false;
}
// 加载更多系统素材图
async function loadMoreSystemSCI() {
systemSCPageNum.value += 1;
const res = await systemSCIListApi(
systemSCPageNum.value,
20,
videoType.value
);
systemSCIList.value.push(...res.data.list);
if (res.data.list.length == 0) {
overLoadSystemSC.value = true;
systemSCPageNum.value = modelPageNum.value - 1;
}
}

// 个人素材
const personSCIList = ref([]); //系统素材列表
const personSCPageNum = ref(1); //系统素材页数
const overLoadpersonSC = ref(true);
async function getpersonSCIList() {
const res = await personSCIListApi(
personSCPageNum.value,
20,
videoType.value
);
personSCIList.value = res.data.list;
overLoadpersonSC.value = false;
}
// 加载更多个人素材图
async function loadMorePersonSCI() {
personSCPageNum.value += 1;
const res = await personSCIListApi(
personSCPageNum.value,
20,
videoType.value
);
personSCIList.value.push(...res.data.list);
if (res.data.list.length == 0) {
overLoadpersonSC.value = true;
personSCPageNum.value = modelPageNum.value - 1;
}
}
//#endregion ----------------------------

//#region
@@ -522,6 +596,7 @@ const t = globalProperties.$t(string);

onMounted(async () => {
voiceTotal();
getSystemSCIList();
await getModeList("", 1, 20);
});
</script>
@@ -612,9 +687,10 @@ onMounted(async () => {
padding: 20px;
width: 300px;
height: 300px;
background-color: rgba(0, 0, 0, 0.1);
background: rgba(0, 0, 0, 0.1);
margin: 0 10px 10px 0;
border-radius: 15px;
z-index: 2;
cursor: pointer;
img {
max-width: 100%;
@@ -623,6 +699,23 @@ onMounted(async () => {
// max-height: 200px;
}
}
.modeListBoxItmeActive {
border: 3px solid #7264f5;
// &::before {
// content: "";
// position: absolute;
// top: -5px;
// left: -5px;
// width: 310px;
// height: 310px;
// background: linear-gradient(
// 225deg,
// rgba(81, 217, 202, 1),
// rgba(114, 100, 245, 1)
// );
// border-radius: 16px;
// }
}
}
}
.noModel {
@@ -740,20 +833,28 @@ onMounted(async () => {
margin: 7px 0;
}
}
.tab2 {
.tab2,
.tab3 {
.bjSystemBox {
display: flex;
flex-wrap: wrap;
height: calc(100% - 60px);
max-height: calc(100% - 60px);
overflow-y: scroll;
background-color: pink;
// background-color: pink;
.bjSystemBoxItem {
position: relative;
margin-right: 3%;
margin-bottom: 10px;
width: 30%;
height: 200px;
background-color: red;
background-color: #e5e5e5;
border-radius: 10px;
cursor: pointer;
img {
padding: 10px;
max-width: 100%;
max-height: 100%;
}
}
}
}


Carregando…
Cancelar
Guardar