detail preview可以设置空颜色

2025-05-08 14:09:12 +08:00
parent a4e040d0ff
commit 610e715ca7
30 changed files with 1323 additions and 6496 deletions
--- a/src/views/HomeView/Events.vue
+++ b/src/views/HomeView/Events.vue
@@ -1,11 +1,11 @@
 <template>
    <div class="events_page" :class="{active:isScroll}">
-		<div class="modal_title_text modal_search">
+		<!-- <div class="modal_title_text modal_search">
 			<div v-show="isScroll || userDetail.systemUser>-1" v-for="item in worksType" :key="item" class="gallery_btn white" @click="setWorksSelect(item)" :class="{active:item.value == worksSelect}">
 				{{ item.name }}
 			</div>
 			<div v-show="!isScroll && userDetail.systemUser == -1" class="gallery_btn active">All</div>
-		</div>
+		</div> -->
        <div class="page_content" >
 			<div class="page_content_itemBox">
 				<div class="page_content_item" v-for="item,index in eventsList" :key="eventsList[eventsList.length-1-index].id"  v-fadeIn="isScroll">
@@ -27,7 +27,6 @@
 </template>
 <script lang="ts">
 import { defineComponent,h ,toRefs,ref,reactive,onMounted,nextTick,provide,computed} from 'vue'
-// import HeaderComponent from "@/component/HomePage/Header.vue";
 // import RobotAssist from "@/component/HomePage/RobotAssist.vue";
 import { Https } from "@/tool/https";
 import { useI18n } from "vue-i18n";
@@ -204,14 +203,12 @@ export default defineComponent({
 .events_page {
 	border-radius: 4rem;
    width: 100%;
-	// overflow: hidden;
    // height: 100%;
 	height: auto;
 	min-height: 100%;
-	padding: 0 6rem;
-	// min-width: 1440px;
+	// padding: 0 6rem;
 	position: relative;
-	padding-top: 5rem;
+	// padding-top: 5rem;
 	display: flex;
    flex-direction: column;
 	.modal_title_text{
--- a/src/views/HomeView/HomeView.vue
+++ b/src/views/HomeView/HomeView.vue
@@ -7,7 +7,6 @@
 <script lang="ts">
 import { defineComponent, h, ref, computed, reactive, toRefs, inject,provide,nextTick,createVNode,onBeforeUnmount, toRef} from "vue";
 // import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
-// import HeaderComponent from "@/component/HomePage/Header.vue";
 import CollectionModal from "@/component/HomePage/collectionModal.vue";
 import NewCollectionReview from "@/component/HomePage/NewCollectionReview.vue";
 import ExportNewCoolection from "@/component/HomePage/ExportNewCoolection.vue";
@@ -34,7 +33,6 @@ const FileSaver = require("file-saver");
 export default defineComponent({
 	name: "homePage",
 	components: {
-		// HeaderComponent,
 		homeIndex,
 		NewCollectionReview,
 		DesignDetail,
--- a/src/views/HomeView/Works.vue
+++ b/src/views/HomeView/Works.vue
@@ -1,20 +1,16 @@
 <template>
-    <div class="works_page" :class="{active:isScroll,'otherUsersActive':otherUsers,'positionLogin':position=='login'}">
-		<!-- <div class="modal_title_text">
-			<div>Works</div>
-		</div> -->
-		<div class="modal_title_text modal_search" v-if="!otherUsers && position!='login'">
+    <div class="works_page" :class="{active:isScroll,'otherUsersActive':otherUsers,'positionLogin':true}">
+		<!-- <div class="works_page" :class="{active:isScroll,'otherUsersActive':otherUsers,'positionLogin':position=='login'}"> -->
+
+		<!-- <div class="modal_title_text modal_search" v-if="!otherUsers && position!='login'">
 			<div v-show="isScroll" v-for="item in worksType" :key="item" class="gallery_btn white" @click="setWorksSelect(item)" :class="{active:item.value == worksSelect}">
 				{{ item.name }}
 			</div>
 			<div v-show="!isScroll" class="modal_title_text_assistant gallery_btn white" :class="{active:'all' == worksSelect}" @click="setWorksSelect({value:'all'})">All</div>
 			<div v-show="!isScroll" class="modal_title_text_assistant gallery_btn white" :class="{active:'NewYear_2025' == worksSelect}" @click="setWorksSelect({value:'NewYear_2025'})">NewYear_2025</div>
-			<!-- <div class="modal_search_menu">
-				<generalMenu :dataList="menuList" @setprintModel="setprintModel" :item="selectMenu"></generalMenu>
-			</div> -->
-		</div>
+		</div> -->
        <div class="page_content" >
-			<Falls ref="fall" @loadend="isShowMark = false"  @setPortfolioLike="setPortfolioLike" :isScroll="isScroll" @getImgScale="getImgScale"></Falls>
+			<Falls ref="fall" @loadend="isShowMark = false" @setPortfolioLike="setPortfolioLike" :isScroll="isScroll" @getImgScale="getImgScale"></Falls>
 			<div class="page_loading_box" v-show="!isNoData">
 				<span class="page_loading" v-show="!isShowMark"></span>
 				<span v-show="isShowMark">
@@ -32,8 +28,7 @@
 </template>
 <script lang="ts">
 import { LoadingOutlined } from "@ant-design/icons-vue";
-import { defineComponent,h ,toRefs,ref,reactive,onMounted,nextTick,provide,computed} from 'vue'
-// import HeaderComponent from "@/component/HomePage/Header.vue";
+import { defineComponent,h ,toRefs,ref,reactive,onMounted,nextTick,watch,computed} from 'vue'
 // import RobotAssist from "@/component/HomePage/RobotAssist.vue";
 import { Https } from "@/tool/https";
 import newScaleImage from "@/component/WorksPage/newScaleImage.vue";
@@ -68,7 +63,8 @@ export default defineComponent({
 		 },
 	},
    setup(prop) {
-		const router = useRouter()
+		const router = useRouter() as any
+		const route = useRoute() as any
 		let filter:any = reactive({
 			worksSelect: 'all',
 			isNull:true,
@@ -135,18 +131,18 @@ export default defineComponent({
 		let newScaleImageMobile:any = ref()
 		let fall:any = ref()
 		let setWorksSelect = (val:any) => {
-			filter.worksSelect = val.value
+			filter.worksSelect = val
 			filter.getListDate.getLikePortfolio = 0
 			filter.getListDate.getMyPortfolio = 0
 			filter.getListDate.tagId = ''
-			if(val.value == 'all'){
-			}else if(val.value == 'favoriteWorks'){
+			if(val == 'all'){
+			}else if(val == 'favoriteWorks'){
 				filter.getListDate.getLikePortfolio = 1
-			}else if(val.value == 'myWorks'){
+			}else if(val == 'myWorks'){
 				filter.getListDate.getMyPortfolio = 1
-			}else if(val.value == 'RCAworkshop_2024'){
+			}else if(val == 'RCAworkshop_2024'){
 				filter.getListDate.tagId = 1
-			}else if(val.value == 'NewYear_2025'){
+			}else if(val == 'NewYear_2025'){
 				filter.getListDate.tagId = 3
 			}
 			filter.getListDate.page = 0
@@ -226,7 +222,7 @@ export default defineComponent({
 		let setPorfolioDom = ()=>{
 			filter.isShowMark = false
 			filter.isNoData = false
-			getPorfolio()
+			// getPorfolio()
 			let worksPage:any = document.querySelector('.works_page')
 			let imgParent:any = document.querySelector('.works_page .page_loading')
 			new IntersectionObserver(
@@ -240,6 +236,17 @@ export default defineComponent({
 				// { root:worksPage }
 			).observe(imgParent);
 		}
+		watch(() => route.query,
+			(query, oldQuery) => {
+				if(oldQuery && query?.works == oldQuery?.works)return
+				let str = query.works
+				if(!str)str = 'all'
+				nextTick(()=>{
+					setWorksSelect(str)
+				})
+			},
+			{ immediate: true } // 立即触发一次以处理初始参数
+			);
 		onMounted (()=>{
 			nextTick(()=>{
 				setPorfolioDom()
--- a/src/views/HomeView/history.vue
+++ b/src/views/HomeView/history.vue
@@ -88,7 +88,6 @@
 </template>
 <script lang="ts">
 import { defineComponent,ref,createVNode,computed,nextTick,provide} from 'vue'
-// import HeaderComponent from "@/component/HomePage/Header.vue";
 import HistoryDetail from "@/component/Detail/HistoryDetail.vue";
 import { Https } from "@/tool/https";
 import { formatTime } from "@/tool/util"
--- a/src/views/HomeView/library.vue
+++ b/src/views/HomeView/library.vue
@@ -8,7 +8,7 @@
            <div class="page_content_body">
                <!-- <HeaderComponent></HeaderComponent> -->
                <div class="library_page_body">
-                    <div class="library_body_left">
+                    <!-- <div class="library_body_left">
 						<div>
 							<div class="library_menu_list" v-for="(menu,index) in menuList" :key="menu.title">
 								<div :class="['menu_item', selectCode==menu.code ? 'select_menu_item' :'']"  @click="selectMenuItem(menu,index)">
@@ -24,7 +24,7 @@
 								</div>
 							</div>
 						</div>
-                    </div>
+                    </div> -->

 					
                    <div class="library_body_right">
@@ -485,7 +485,6 @@
 <script lang="ts">
 import { LoadingOutlined } from "@ant-design/icons-vue";
 import { defineComponent,h ,ref,createVNode,nextTick,watch,provide,computed,reactive,toRefs} from 'vue'
-// import HeaderComponent from "@/component/HomePage/Header.vue";
 import ModelPlacement from '@/component/LibraryPage/ModelPlacement.vue';
 // import ModelPlacement from '@/component/LibraryPage/ModelPlacementUpdata.vue';
 import setLabel from '@/component/LibraryPage/setLabel.vue';
@@ -511,7 +510,6 @@ import generalMenu from "@/component/HomePage/generalMenu.vue";
 import UpgradePlan from "@/component/HomePage/UpgradePlan.vue";
 export default defineComponent({
    components: {
-        // HeaderComponent,
        ModelPlacement,
 		setLabel,
        ModelPlacementMobile,
@@ -893,14 +891,6 @@ export default defineComponent({
        };
    },
 	watch:{
-		searchPictureName(newVal,oldVal){
-			// clearTimeout(this.getLibraryListInputTime)
-			// this.getLibraryListInputTime = setTimeout(() => {
-			// 	if(newVal != oldVal){
-			// 		this.currentPage = 1
-			// 	}
-			// }, 500);
-		},
 		scene:{
 			handler(newVal,oldVal){
 				if(this.selectCode == 'Printboard' && newVal.value == 'Slogan'){
@@ -911,6 +901,19 @@ export default defineComponent({
 					this.isSloganHint = ''
 				}
 			}
+		},
+		'$route.query':{
+			handler(query, oldQuery) {
+				if(oldQuery && query?.library == oldQuery?.library)return
+				let str = query.library
+				if(!str)str = 'Moodboard'
+				nextTick(()=>{
+					console.log()
+					this.selectMenuItem({code:str})
+					// setWorksSelect(str)
+				})
+			},
+			immediate: true,
 		}
 	},
    async mounted(){
@@ -920,6 +923,7 @@ export default defineComponent({
        this.uploadUrl = getUploadUrl()
 		this.token = getCookie("token") || "";
    },
+	
    methods:{

 		
@@ -958,71 +962,67 @@ export default defineComponent({
 				});
 			}
 		},
-        selectMenuItem(menu:any,index:any){
-            if(menu.children?.length){ //证明是有子菜单
-                menu.showChildren = !menu.showChildren
-            }else{
-				
-				if(menu.code != this.upload.level1Type){
-					this.selectCode = menu.code
-					this.currentPage = 1
-					this.total = 0
-					if(menu.code == 'MyBrand'){
-						this.getBrandDNAList()
-						return
-					}
-					this.searchPictureName = ''
-					this.imgList = [],
-					this.selectImgList = []
-					this.isTextarea = false
-					this.value.labelValue = []
-					if(this.designTypeList[this.selectCode].length >= 1){
-						this.designType = this.designTypeList[this.selectCode][0].value
-					}else{
-						this.designType = ''
-					}
-					if(this.selectCode != 'DesignElements'){
-						this.getClass()
-					}
-					if(this.selectCode == 'Sketchboard' || this.selectCode == 'Models')this.getSex()
-					if(this.selectCode == 'Sketchboard'){
-						this.positionType = computed(() => {
-							return this.store.state.UserHabit.Position;
-						});
-						this.printModelList = JSON.parse(JSON.stringify(this.store.state.UserHabit.SketchStyle))
-						let imgList = ['/image/sketch/sketch-thick.jpg','/image/sketch/sketch-medium.jpg','/image/sketch/sketch-fine.jpg']
-						this.printModelList.forEach((item:any,index:number)=>{
-							item.img = imgList[index]
-						})
-					}
-					if(this.selectCode == 'Printboard'){
-						this.printModelList = [
-							{
-								num:1,
-								optype:false,
-								value:'Painting Style',
-								label:this.t('Generate.Model1')
-							},{
-								num:2,
-								optype:false,
-								value:'Illustration Style',
-								label:this.t('Generate.Model2')
-							},{
-								num:3,
-								optype:false,
-								value:'Real Style',
-								label:this.t('Generate.Model3')
-							},
-						]
-					}
-					if(this.printModelList[0])this.printModel = this.printModelList[0]
-					this.captionGeneration = ''
-					this.selectGenerateList = []
-					this.inputShow = false
-					this.uploadGenerateOpen('Upload')
+        selectMenuItem(menu:any){
+           
+			if(menu.code != this.upload.level1Type){
+				this.selectCode = menu.code
+				this.currentPage = 1
+				this.total = 0
+				if(menu.code == 'MyBrand'){
+					this.getBrandDNAList()
+					return
 				}
-				this.upload.level1Type = menu.code
-            }
+				this.searchPictureName = ''
+				this.imgList = [],
+				this.selectImgList = []
+				this.isTextarea = false
+				this.value.labelValue = []
+				if(this.designTypeList[this.selectCode].length >= 1){
+					this.designType = this.designTypeList[this.selectCode][0].value
+				}else{
+					this.designType = ''
+				}
+				if(this.selectCode != 'DesignElements'){
+					this.getClass()
+				}
+				if(this.selectCode == 'Sketchboard' || this.selectCode == 'Models')this.getSex()
+				if(this.selectCode == 'Sketchboard'){
+					this.positionType = computed(() => {
+						return this.store.state.UserHabit.Position;
+					});
+					this.printModelList = JSON.parse(JSON.stringify(this.store.state.UserHabit.SketchStyle))
+					let imgList = ['/image/sketch/sketch-thick.jpg','/image/sketch/sketch-medium.jpg','/image/sketch/sketch-fine.jpg']
+					this.printModelList.forEach((item:any,index:number)=>{
+						item.img = imgList[index]
+					})
+				}
+				if(this.selectCode == 'Printboard'){
+					this.printModelList = [
+						{
+							num:1,
+							optype:false,
+							value:'Painting Style',
+							label:this.t('Generate.Model1')
+						},{
+							num:2,
+							optype:false,
+							value:'Illustration Style',
+							label:this.t('Generate.Model2')
+						},{
+							num:3,
+							optype:false,
+							value:'Real Style',
+							label:this.t('Generate.Model3')
+						},
+					]
+				}
+				if(this.printModelList[0])this.printModel = this.printModelList[0]
+				this.captionGeneration = ''
+				this.selectGenerateList = []
+				this.inputShow = false
+				this.uploadGenerateOpen('Upload')
+			}
+			this.upload.level1Type = menu.code
        },

 		async sexChange(){
@@ -1860,7 +1860,6 @@ export default defineComponent({
    width: 100%;
 	overflow: hidden;
    height: 100%;
-	padding: 0 6rem;
 	// min-width: 1440px;
 	position: relative;
 	.mark_loading{
@@ -1956,7 +1955,8 @@ export default defineComponent({
                    }
                }
                .library_body_right{
-                    width: calc(100% - 23.5rem);
+                    width: 100%;
+                    // width: calc(100% - 23.5rem);
                    height: 100%;
 					.header_operate_item{
 						margin-right: 5rem;