This commit is contained in:
X1627315083
2025-04-09 14:09:19 +08:00
parent b6e5f05f06
commit 37f1b36e54
76 changed files with 1969 additions and 970 deletions

View File

@@ -9,9 +9,17 @@
<div class="designPage_left" ref="hidden">
<div class="designPage_left_content" :class="{'active':(domHidden)}">
<!-- 有图状态 start-->
<div class="home_left_info">
<div class="left_info_content scroll_style">
<div class="left_info_content_body" ref="collection_canvas">
<div class="right_content_header">
<div class="content_header_left" style="padding-top: 2rem;">
<i class="fi fi-rs-comments"></i><span class="content_header_des">
{{ $t('HomeView.elementTitle') }}
</span>
</div>
</div>
<NewCollectionReview id="collectionReview"></NewCollectionReview>
<!-- <ExportNewCoolection id="exportNewCoolection"></ExportNewCoolection> -->
@@ -36,15 +44,15 @@
<!-- <div class="gallery_btn white Guide_1_15" @click="designNewCollection()"> -->
{{ $t('HomeView.Design') }}
</div>
<div class="gallery_btn white button_margin_14 Guide_1_30" v-show="designCollectionId"
<!-- <div class="gallery_btn white button_margin_14 Guide_1_30" v-show="designCollectionId"
@click="resDesignCollection()">
{{ $t('HomeView.Redesign') }}
</div>
<div class="silder button_margin_14" v-show="designCollectionId">
</div> -->
<div class="silder button_margin_14" v-show="likeDesignCollectionList?.length > 0">
<div class="text">Small</div>
<a-slider
class="system_silder"
v-model:value="collValue"
v-model:value="elementWidth"
:min="minCollValue"
:max="maxCollValue-1"
@afterChange="setSystemDesigner(500)"
@@ -53,10 +61,9 @@
</a-slider>
<div class="text">Big</div>
</div>
<div v-show="designCollectionId && userGroupId" class="gallery_btn Guide_1_31" style="margin-left: auto" @click="exportModel()">
<!-- {{ $t('HomeView.Export') }} -->
<!-- <div v-show="designCollectionId && userGroupId" class="gallery_btn Guide_1_31" style="margin-left: auto" @click="exportModel()">
{{$t('HomeView.FinalizeCollection')}}
</div>
</div> -->
</div>
</div>
<div class="right_content_block_box">
@@ -73,7 +80,6 @@
</div>
<div class="right_content_img_block scroll_style active">
<div class="right_content_img_item" ref="likeItemDom" designType="like" :index="0">
<div class="content_img_block content_img_GetWidth active" :style="likeStyle"
v-for="(design, index) in likeDesignCollectionList" :key="design.id"
@mousedown.stop="designMousedown(getMousePosition($event,false),design.userLikeSortId,'like')"
@@ -334,9 +340,11 @@ export default defineComponent({
let sessionStorageCollValue = JSON.parse(sessionStorage.getItem('collValue') as any)
const collItemSize = reactive({
collValue:( sessionStorageCollValue>= 20? 10:sessionStorageCollValue) || 3,
minCollValue:4,
maxCollValue:20,
collValue:6,
elementWidth:100,
minCollValue:100,
maxCollValue:999,
padding:60,
likeStyle:{
width:'240px',
height:'370px',
@@ -370,14 +378,18 @@ export default defineComponent({
}
let getDesignTime = null as any;
const setSystemDesigner = (time:any)=>{
clearTimeout(collItemSize.collTime)
collItemSize.collTime = setTimeout(()=>{
nextTick(()=>{
let parentWidth = likeItemDom.value.parentElement.offsetWidth
collItemSize.minCollValue = collItemSize.maxCollValue - Math.round(likeItemDom.value.parentElement.offsetWidth/120)
collItemSize.collValue = collItemSize.collValue<collItemSize.minCollValue?collItemSize.minCollValue:collItemSize.collValue
let value = collItemSize.maxCollValue - collItemSize.collValue
collItemSize.itemStyle.width = (parentWidth - (value * 10)) / value
collItemSize.elementWidth = collItemSize.elementWidth == -1?100:collItemSize.elementWidth
collItemSize.maxCollValue = parentWidth / 2
collItemSize.collValue = Math.floor(parentWidth / collItemSize.elementWidth)
collItemSize.padding = Math.floor(parentWidth - (collItemSize.collValue * collItemSize.elementWidth))
let value = collItemSize.collValue
collItemSize.itemStyle.width = (parentWidth - collItemSize.padding - (value * 10)) / value
collItemSize.itemStyle.height = collItemSize.itemStyle.width * 1.54
collItemSize.collStyle.width = (collItemDom.value.offsetWidth - 30) / 3 * collItemSize.scale[0] + 'px'
@@ -476,6 +488,7 @@ export default defineComponent({
//排序 从大到小
const sortDesignCollection = ()=> {
let arrData:any = []
if(!likeDesignCollectionList.value)return
likeDesignCollectionList.value.forEach((likeItem:any)=>{
let item = posiitonData.value.likeElList.filter((item:any)=>item.userLikeSortId == likeItem.userLikeSortId)[0]
likeItem.sort = item.sort + 1
@@ -499,7 +512,7 @@ export default defineComponent({
const reRange = (item:any, x:number, y:number,str:string)=>{
let elList = str == 'like'? posiitonData.value.likeElList:posiitonData.value.generateElList
let index = str == 'like'?posiitonData.value.likeSelectIndex:posiitonData.value.generateSelectIndex
let value = collItemSize.maxCollValue - collItemSize.collValue
let value = collItemSize.collValue
let width,height,num
if(str == 'like'){
num = value
@@ -579,14 +592,14 @@ export default defineComponent({
const moveItem = (str:any)=>{
let elLikeList = posiitonData.value.likeElList
let generateElList = posiitonData.value.generateElList
let value = collItemSize.maxCollValue - collItemSize.collValue
let value = collItemSize.collValue
let width,height
width = (collItemDom.value.offsetWidth - 30) / 3 * collItemSize.scale[0]
height = (collItemDom.value.offsetWidth - 30) / 3 * collItemSize.scale[1]
// let num = str == 'like'?value:3
for(let i = 0;i < elLikeList.length;i++){
elLikeList[i].el.style.left = (elLikeList.length - 1 - elLikeList[i].sort) % value * (collItemSize.itemStyle.width +10) + 'px';
elLikeList[i].el.style.left = (elLikeList.length - 1 - elLikeList[i].sort) % value * (collItemSize.itemStyle.width +10) + collItemSize.padding/2 + 'px';
elLikeList[i].el.style.top = parseInt(String((elLikeList.length - 1 - elLikeList[i].sort) / value)) * (collItemSize.itemStyle.height +10) + 'px';
}
for(let i = 0;i < generateElList.length;i++){
@@ -820,18 +833,6 @@ export default defineComponent({
//设计新的collection
designNewCollection() {
if(!this.chooseIsDesign.value){
message.info(this.t('HomeView.jsContent10'));
return
}
let { colorBoards } =
this.store.state.UploadFilesModule.allBoardData;
if (!colorBoards || colorBoards?.length < 1) {
message.info(
this.t('HomeView.jsContent1')
);
return;
}
clearTimeout(this.getDesignTime);
let data = this.getDesignData("");
if(this.driver__.driver){
@@ -840,7 +841,7 @@ export default defineComponent({
})
}
this.isShowMark = true
this.store.commit("setLikeDesignCollectionList", []);
// this.store.commit("setLikeDesignCollectionList", []);
Https.axiosPost(Https.httpUrls.designCollection, data)
.then((rv: any) => {
@@ -856,8 +857,8 @@ export default defineComponent({
this.getDesignResult(value,'newDesign')
this.startDesignType = "design";
this.posiitonData.likeSelectIndex = 0
this.posiitonData.likeElList = []
// this.posiitonData.likeSelectIndex = 0
// this.posiitonData.likeElList = []
}
this.isShowMark = false;
})
@@ -906,7 +907,7 @@ export default defineComponent({
this.showDesignMark = false
if(str == 'newDesign'){
if(rv.designCollectionItems){
this.store.commit("deleteUserGroupId");
// this.store.commit("deleteUserGroupId");
this.store.commit(
"setDesignCollectionId",
rv.collectionId
@@ -941,14 +942,6 @@ export default defineComponent({
},
//重新设计collection
resDesignCollection() {
let { colorBoards } =
this.store.state.UploadFilesModule.allBoardData;
if (!colorBoards || colorBoards?.length < 1) {
message.info(
this.t('HomeView.jsContent2')
);
return;
}
if(this.driver__.driver){
nextTick().then(()=>{
driverObj__.moveNext();
@@ -1131,7 +1124,8 @@ export default defineComponent({
likeDesignCollection(design: any, index: any) {
let data = {
designItemId: design.designItemId,
userGroupId: this.userGroupId,
userGroupId: this.store.state.HomeStoreModule.userGroupId,
projectId: this.store.state.Workspace.probjects.id,
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
designPythonOutfitId:design.designOutfitId?design.designOutfitId:design.designPythonOutfitId
};
@@ -1178,7 +1172,7 @@ export default defineComponent({
let data = {
designId: design.designId || this.designId,
designPythonOutfitId:design.designOutfitId,
groupDetailId: design.groupDetailId,
groupDetailId: design.groupDetailId || design.id,
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
};
if (this.disLikeLoading) {
@@ -1392,6 +1386,9 @@ export default defineComponent({
if(button == 'design'){
this.designNewCollection()
}
nextTick(()=>{
this.setSystemDesigner(100)
})
},
//销毁图片详情
setDetailDestroy() {
@@ -1504,6 +1501,62 @@ export default defineComponent({
// padding-bottom: 4rem;
box-sizing: border-box;
z-index:1;
.right_content_header {
display: flex;
justify-content: space-between;
height: 4.5rem;
align-items: center;
padding: 0 3.2rem 0 1.9rem;
background: rgba(255, 255, 255, 0.2);
position: relative;
.right_content_export{
display: flex;
align-items: center;
position: relative;
.icon-xiala{
cursor: pointer;
transition: .3s all;
margin-left: 1rem;
}
.icon_rotate{
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
animation-direction: 0.5s;
}
.export_nav{
display: flex;
flex-direction: column;
position: absolute;
top: 5.5rem;
width: 100%;
background: #fff;
padding: 1rem;
border: 2px solid;
z-index: 2;
label{
margin: 0;
}
}
}
.content_header_left {
display: flex;
justify-content: space-between;
align-items: center;
.icon-dangqianweizhi {
font-size: 1.6rem;
color: #000;
}
.content_header_des {
font-size: 1.6rem;
color: #000000;
margin-left: 1rem;
font-weight: 900;
}
}
}
.designPage_body {
width: 100%;
height: 100%;
@@ -1515,7 +1568,6 @@ export default defineComponent({
.designPage_left {
// width: 44.4rem;
height: 100%;
padding: 2rem 0 0 0;
background: rgba(255, 255, 255, 0.2);
position: relative;
// overflow: hidden;
@@ -1589,7 +1641,7 @@ export default defineComponent({
}
}
.right_top {
padding: 2rem 3.2rem 2rem 1.2rem;
padding: 1rem 3.2rem 2rem 1.2rem;
display: flex;
justify-content: space-between;
box-shadow: 0rem 0.2rem 8rem 0rem rgba(238, 238, 244, 0.25);
@@ -1656,62 +1708,7 @@ export default defineComponent({
&.active{
overflow: hidden;
}
.right_content_header {
display: flex;
justify-content: space-between;
height: 4.5rem;
align-items: center;
padding: 0 3.2rem 0 1.9rem;
background: rgba(255, 255, 255, 0.2);
position: relative;
.right_content_export{
display: flex;
align-items: center;
position: relative;
.icon-xiala{
cursor: pointer;
transition: .3s all;
margin-left: 1rem;
}
.icon_rotate{
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
animation-direction: 0.5s;
}
.export_nav{
display: flex;
flex-direction: column;
position: absolute;
top: 5.5rem;
width: 100%;
background: #fff;
padding: 1rem;
border: 2px solid;
z-index: 2;
label{
margin: 0;
}
}
}
.content_header_left {
display: flex;
justify-content: space-between;
align-items: center;
.icon-dangqianweizhi {
font-size: 1.6rem;
color: #000;
}
.content_header_des {
font-size: 1.6rem;
color: #000000;
margin-left: 1rem;
font-weight: 900;
}
}
}
.right_content_body {
// padding: 0 1.8rem 0 1.2rem;
// height: calc(50% - 4.5rem);