|
|
|
|
@@ -57,7 +57,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 有图状态 end-->
|
|
|
|
|
</div>
|
|
|
|
|
<div class="home_page_left_bottom" @click="()=>domHidden = !domHidden" v-show="designCollectionId">
|
|
|
|
|
<div class="home_page_left_bottom" @click="setShowHide('domHidden')" v-show="designCollectionId">
|
|
|
|
|
<span class="icon iconfont icon-xiala" :class="{'active':domHidden}"></span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
@@ -89,127 +89,120 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="right_content_block">
|
|
|
|
|
<div class="right_content_header">
|
|
|
|
|
<div class="content_header_left">
|
|
|
|
|
<i class="fi fi-rs-comments"></i><span class="content_header_des">
|
|
|
|
|
{{ $t('HomeView.GeneratedDesign') }}
|
|
|
|
|
</span>
|
|
|
|
|
<div class="right_content_block_box">
|
|
|
|
|
<div class="right_content_block">
|
|
|
|
|
<div class="right_content_header">
|
|
|
|
|
<div class="content_header_left">
|
|
|
|
|
<i class="fi fi-rs-comments"></i><span class="content_header_des">
|
|
|
|
|
{{ $t('HomeView.GeneratedDesign') }}
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="right_content_body">
|
|
|
|
|
<div class="right_content_img_block scroll_style Guide_1_17 active" :class="[driver__.driver?'showEvents':'']">
|
|
|
|
|
<div class="right_content_img_item" ref="designImg">
|
|
|
|
|
<!-- <draggable
|
|
|
|
|
group="people" > -->
|
|
|
|
|
<div class="right_content_body">
|
|
|
|
|
<div class="right_content_img_block scroll_style Guide_1_17 active" :class="[driver__.driver?'showEvents':'']">
|
|
|
|
|
<div class="right_content_img_item" ref="designImg">
|
|
|
|
|
|
|
|
|
|
<div class="content_img_block active" :style="collStyle" draggable
|
|
|
|
|
v-for="(design, index) in likeDesignCollectionList" :key="design.id"
|
|
|
|
|
@click="designDetail(
|
|
|
|
|
design,
|
|
|
|
|
index,
|
|
|
|
|
likeDesignCollectionList,
|
|
|
|
|
'like'
|
|
|
|
|
)"
|
|
|
|
|
@dragstart="dragstart($event, index)"
|
|
|
|
|
@dragover.prevent
|
|
|
|
|
@drop="dragDrop($event, index,likeDesignCollectionList)">
|
|
|
|
|
<div class="content_img_flex">
|
|
|
|
|
<img class="content_img" :src="design.designOutfitUrl"
|
|
|
|
|
:key="design.designOutfitUrl" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="icon iconfont icon-jushoucanggift icon_like" @click.stop="
|
|
|
|
|
dislikeDesignCollection(
|
|
|
|
|
design,
|
|
|
|
|
index
|
|
|
|
|
)">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content_img_block" v-show="showDesignMark" :style="collStyle">
|
|
|
|
|
<a-spin size="large"></a-spin>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- </draggable> -->
|
|
|
|
|
<div class="content_img_block" :style="collStyle" draggable v-for="(
|
|
|
|
|
design, index
|
|
|
|
|
) in designCollectionList" :key="design?.designItemId">
|
|
|
|
|
<div class="content_img_flex"
|
|
|
|
|
:class="[(driver__.driver && driver__.index == 32)?'hideEvents':'']"
|
|
|
|
|
@click="
|
|
|
|
|
designDetail(
|
|
|
|
|
<div class="content_img_block active" :style="collStyle" @mousedown.stop="designMousedown(getMousePosition($event,false))" @touchstart.passive="designMousedown(getMousePosition($event,true))"
|
|
|
|
|
v-for="(design, index) in likeDesignCollectionList" :key="design.id"
|
|
|
|
|
@click="designDetail(
|
|
|
|
|
design,
|
|
|
|
|
index,
|
|
|
|
|
designCollectionList,
|
|
|
|
|
'dislike'
|
|
|
|
|
)"
|
|
|
|
|
@dragstart="dragstart($event, index)"
|
|
|
|
|
@dragover.prevent
|
|
|
|
|
@drop="dragDrop($event, index,designCollectionList)">
|
|
|
|
|
<img class="content_img" :src="design.designOutfitUrl" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="icon iconfont icon-jushoucang icon_like" :class="[driver__.driver?index == 0?driver__.index == 32?'Guide_img showEvents':'':'':'']" @click.stop="
|
|
|
|
|
likeDesignCollection(
|
|
|
|
|
likeDesignCollectionList,
|
|
|
|
|
'like'
|
|
|
|
|
)">
|
|
|
|
|
<div class="content_img_flex">
|
|
|
|
|
<img class="content_img" :src="design.designOutfitUrl"
|
|
|
|
|
:key="design.designOutfitUrl" designType="like" :index="index"/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="icon iconfont icon-jushoucanggift icon_like" @click.stop="
|
|
|
|
|
dislikeDesignCollection(
|
|
|
|
|
design,
|
|
|
|
|
index
|
|
|
|
|
)
|
|
|
|
|
">
|
|
|
|
|
)">
|
|
|
|
|
</div>
|
|
|
|
|
<i class="fi fi-rr-trash icon_delete" @click.stop="
|
|
|
|
|
deleteDesignCollection(
|
|
|
|
|
designCollectionList,
|
|
|
|
|
index
|
|
|
|
|
)
|
|
|
|
|
">
|
|
|
|
|
</i>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content_img_block" v-show="showDesignMark" :style="collStyle">
|
|
|
|
|
<a-spin size="large" class="content_img_flex"></a-spin>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content_img_block" :style="collStyle" v-for="(
|
|
|
|
|
design, index
|
|
|
|
|
) in designCollectionList" :key="design?.designItemId" @mousedown.stop="designMousedown(getMousePosition($event,false))" @touchstart.passive="designMousedown(getMousePosition($event,true))">
|
|
|
|
|
<div class="content_img_flex"
|
|
|
|
|
:class="[(driver__.driver && driver__.index == 32)?'hideEvents':'']"
|
|
|
|
|
@click="
|
|
|
|
|
designDetail(
|
|
|
|
|
design,
|
|
|
|
|
index,
|
|
|
|
|
designCollectionList,
|
|
|
|
|
'dislike'
|
|
|
|
|
)">
|
|
|
|
|
<img class="content_img" :src="design.designOutfitUrl" designType="dislike" :index="index"/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="icon iconfont icon-jushoucang icon_like" :class="[driver__.driver?index == 0?driver__.index == 32?'Guide_img showEvents':'':'':'']" @click.stop="
|
|
|
|
|
likeDesignCollection(
|
|
|
|
|
design,
|
|
|
|
|
index
|
|
|
|
|
)
|
|
|
|
|
">
|
|
|
|
|
</div>
|
|
|
|
|
<i class="fi fi-rr-trash icon_delete" @click.stop="
|
|
|
|
|
setDeleteDesign(index)">
|
|
|
|
|
</i>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- <div class="right_content_header">
|
|
|
|
|
<div class="content_header_left">
|
|
|
|
|
<i class="fi fi-rs-comments"></i><span class="content_header_des">{{ $t('HomeView.SelectedDesign') }}</span>
|
|
|
|
|
<div class="right_content_block recycleBin" :class="{recycleBinShow:recycleDomHidden && designCollectionId}">
|
|
|
|
|
<div class="right_content_header">
|
|
|
|
|
<div class="content_header_left">
|
|
|
|
|
<i class="fi fi-rs-comments"></i><span class="content_header_des">
|
|
|
|
|
{{ $t('HomeView.recycleBin') }}
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="right_content_export" v-show="likeDesignCollectionList.length">
|
|
|
|
|
|
|
|
|
|
<div class="right_content_body">
|
|
|
|
|
<div class="right_content_img_block scroll_style">
|
|
|
|
|
<div class="right_content_img_item">
|
|
|
|
|
<div class="content_img_block" v-for="(
|
|
|
|
|
design, index
|
|
|
|
|
) in deleteDesignCollectionList" :key="design?.designItemId">
|
|
|
|
|
<div class="content_img_flex"
|
|
|
|
|
@click="
|
|
|
|
|
designDetail(
|
|
|
|
|
design,
|
|
|
|
|
index,
|
|
|
|
|
designCollectionList,
|
|
|
|
|
'dislike'
|
|
|
|
|
)">
|
|
|
|
|
<img class="content_img" :src="design.designOutfitUrl" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="Dustbin" @click.stop="
|
|
|
|
|
cancelDeleteDesign(index)">
|
|
|
|
|
Dustbin
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="right_content_body">
|
|
|
|
|
<div class="right_content_img_block scroll_style" :class="{active:likeDesignCollectionList.length != 0}">
|
|
|
|
|
<div class="right_content_img_item" id="right_content_img_block">
|
|
|
|
|
<div class="content_img_block" draggable
|
|
|
|
|
v-for="(design, index) in likeDesignCollectionList" :key="design.id"
|
|
|
|
|
@click="designDetail(
|
|
|
|
|
design,
|
|
|
|
|
index,
|
|
|
|
|
likeDesignCollectionList,
|
|
|
|
|
'like'
|
|
|
|
|
)"
|
|
|
|
|
@dragstart="dragstart($event, index)"
|
|
|
|
|
@dragover.prevent
|
|
|
|
|
@drop="dragDrop($event, index)">
|
|
|
|
|
<div class="content_img_flex">
|
|
|
|
|
<img class="content_img" :src="design.designOutfitUrl"
|
|
|
|
|
:key="design.designOutfitUrl" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="icon iconfont icon-jushoucanggift icon_like" @click.stop="
|
|
|
|
|
dislikeDesignCollection(
|
|
|
|
|
design,
|
|
|
|
|
index
|
|
|
|
|
)
|
|
|
|
|
"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div> -->
|
|
|
|
|
<div class="home_page_left_bottom" :class="{active:recycleDomHidden}" @click="setShowHide('recycleDomHidden')" v-show="designCollectionId">
|
|
|
|
|
<span class="icon iconfont icon-xiala" :class="{'active':recycleDomHidden}"></span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<teleport to="body">
|
|
|
|
|
<img class="moveDataImg" v-if="moveDataImg" :style="moveDataStyle" :src="moveDataImg" alt="">
|
|
|
|
|
</teleport>
|
|
|
|
|
<KeepAlive>
|
|
|
|
|
<CollectionModal :getDesignData="getDesignData" ref="collectionModal" @finishCollection="finishCollection()"></CollectionModal>
|
|
|
|
|
</KeepAlive>
|
|
|
|
|
@@ -241,7 +234,7 @@
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script lang="ts">
|
|
|
|
|
import { defineComponent, h, ref, computed, reactive, toRefs, inject,provide,nextTick,createVNode,onBeforeUnmount} from "vue";
|
|
|
|
|
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";
|
|
|
|
|
@@ -258,11 +251,11 @@ import { useStore } from "vuex";
|
|
|
|
|
import { Https } from "@/tool/https";
|
|
|
|
|
import { openGuide,driverObj__ } from "@/tool/guide";
|
|
|
|
|
import { LoadingOutlined ,ExclamationCircleOutlined} from "@ant-design/icons-vue";
|
|
|
|
|
import draggable from 'vuedraggable'
|
|
|
|
|
// import JSZip, { forEach } from "jszip";
|
|
|
|
|
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
|
|
|
|
|
import i18n from "@/lang";
|
|
|
|
|
import { useI18n } from "vue-i18n";
|
|
|
|
|
import { getMousePosition } from "@/tool/mdEvent";
|
|
|
|
|
const FileSaver = require("file-saver");
|
|
|
|
|
|
|
|
|
|
export default defineComponent({
|
|
|
|
|
@@ -275,7 +268,6 @@ export default defineComponent({
|
|
|
|
|
DesignDetail,
|
|
|
|
|
ExportNewCoolection,
|
|
|
|
|
affiche,
|
|
|
|
|
draggable,
|
|
|
|
|
productImg,
|
|
|
|
|
generalCanvas
|
|
|
|
|
},
|
|
|
|
|
@@ -293,6 +285,9 @@ export default defineComponent({
|
|
|
|
|
let likeDesignCollectionList: any = computed(() => {
|
|
|
|
|
return store.state.HomeStoreModule.likeDesignCollectionList;
|
|
|
|
|
});
|
|
|
|
|
let deleteDesignCollectionList: any = computed(() => {
|
|
|
|
|
return store.state.HomeStoreModule.deleteDesignCollectionList;
|
|
|
|
|
});
|
|
|
|
|
let designCollectionList: any = computed(() => {
|
|
|
|
|
return store.state.HomeStoreModule.designCollectionList;
|
|
|
|
|
});
|
|
|
|
|
@@ -375,6 +370,9 @@ export default defineComponent({
|
|
|
|
|
collTime:null as any,
|
|
|
|
|
})
|
|
|
|
|
let designImg = ref()
|
|
|
|
|
let domHidden = ref(JSON.parse(sessionStorage.getItem('domHidden') as any) || false);
|
|
|
|
|
let recycleDomHidden = ref(JSON.parse(sessionStorage.getItem('recycleDomHidden') as any) || false);
|
|
|
|
|
let getDesignTime = null as any;
|
|
|
|
|
const setSystemDesigner = (time:any)=>{
|
|
|
|
|
clearTimeout(collItemSize.collTime)
|
|
|
|
|
collItemSize.collTime = setTimeout(()=>{
|
|
|
|
|
@@ -390,18 +388,91 @@ export default defineComponent({
|
|
|
|
|
const setDesignImgWidth = ()=>{
|
|
|
|
|
nextTick(()=>{
|
|
|
|
|
let width = designImg.value.parentElement.offsetWidth
|
|
|
|
|
let sonDom = designImg.value.querySelectorAll('div')[0]
|
|
|
|
|
let sonDom = designImg.value.querySelectorAll('.content_img_block')[designImg.value.querySelectorAll('.content_img_block').length - 1]
|
|
|
|
|
if(Math.floor(width / (sonDom.offsetWidth+10 + 1)) > (likeDesignCollectionList.value.length + designCollectionList.value.length)){
|
|
|
|
|
designImg.value.style.width = 100+'%'
|
|
|
|
|
}else{
|
|
|
|
|
designImg.value.style.width = Math.floor(width / (sonDom.offsetWidth+10 + 1)) * (sonDom.offsetWidth + 10 + 1) + 'px'
|
|
|
|
|
// let recycleBinW = recycleDomHidden.value?'53rem':0
|
|
|
|
|
designImg.value.style.width = Math.floor(width / (sonDom.offsetWidth+10 + 1)) * (sonDom.offsetWidth + 10 + 1)+ 'px'
|
|
|
|
|
// designImg.value.style.width = `calc(${Math.floor(width / (sonDom.offsetWidth+10 + 1)) * (sonDom.offsetWidth + 10 + 1)}px - ${recycleBinW})`
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
const setDeleteDesign = (index:any)=>{
|
|
|
|
|
store.commit("setDeleteDesignCollectionList",index);
|
|
|
|
|
}
|
|
|
|
|
const cancelDeleteDesign = (index:any)=>{
|
|
|
|
|
store.commit("cancelDeleteDesignCollectionList",index);
|
|
|
|
|
}
|
|
|
|
|
setSystemDesigner(0)
|
|
|
|
|
|
|
|
|
|
let moveData = reactive({
|
|
|
|
|
moveDataImg:'',
|
|
|
|
|
moveDataImg_:'',
|
|
|
|
|
moveDataStyle:{
|
|
|
|
|
position: 'absolute',
|
|
|
|
|
top: '0',
|
|
|
|
|
left: '0',
|
|
|
|
|
width:'',
|
|
|
|
|
height:'',
|
|
|
|
|
zIndex: 9,
|
|
|
|
|
opacity:.5,
|
|
|
|
|
pointerEvents:'none'
|
|
|
|
|
},
|
|
|
|
|
downIndex:-1,
|
|
|
|
|
downXy:{x:0,y:0},
|
|
|
|
|
})
|
|
|
|
|
const designMousedown = (e:any)=>{
|
|
|
|
|
if(e.target.getAttribute('index')){
|
|
|
|
|
moveData.downIndex = e.target.getAttribute('index');
|
|
|
|
|
moveData.moveDataImg_ = e.target.src
|
|
|
|
|
moveData.downXy.x = e.clientX
|
|
|
|
|
moveData.downXy.y = e.clientY
|
|
|
|
|
moveData.moveDataStyle.width = e.target.offsetWidth + 'px'
|
|
|
|
|
moveData.moveDataStyle.height = e.target.offsetHeight + 'px'
|
|
|
|
|
|
|
|
|
|
window.addEventListener('mousemove', mouseMove);
|
|
|
|
|
window.addEventListener('touchmove', touchmove);
|
|
|
|
|
window.addEventListener('mouseup', designMouseup);
|
|
|
|
|
window.addEventListener('touchend', designMouseup);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
let mouseMove = function(event:any){
|
|
|
|
|
let e = getMousePosition(event,false)
|
|
|
|
|
desingMousemove(e)
|
|
|
|
|
}
|
|
|
|
|
let touchmove = function(event:any){
|
|
|
|
|
let e = getMousePosition(event,true)
|
|
|
|
|
desingMousemove(e)
|
|
|
|
|
}
|
|
|
|
|
const designMouseup = (e:any)=>{
|
|
|
|
|
document.removeEventListener('mousemove',mouseMove)
|
|
|
|
|
document.removeEventListener('touchmove',touchmove)
|
|
|
|
|
document.removeEventListener('mouseup',designMouseup)
|
|
|
|
|
document.removeEventListener('touchend',designMouseup)
|
|
|
|
|
moveData.moveDataImg = ''
|
|
|
|
|
moveData.moveDataImg_ = ''
|
|
|
|
|
moveData.downXy = {x:0,y:0}
|
|
|
|
|
var type = e.target.getAttribute('designType');
|
|
|
|
|
var index = e.target.getAttribute('index');
|
|
|
|
|
if(index){
|
|
|
|
|
let arr = type == 'like'?likeDesignCollectionList.value:designCollectionList.value
|
|
|
|
|
// arr[index]
|
|
|
|
|
let item = arr.splice(moveData.downIndex, 1)
|
|
|
|
|
arr.splice(index, 0, ...item)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
const desingMousemove = (e:any)=>{
|
|
|
|
|
if(!moveData.moveDataImg)moveData.moveDataImg = moveData.moveDataImg_
|
|
|
|
|
let width = moveData.moveDataStyle.width.split('px')[0]
|
|
|
|
|
let height = moveData.moveDataStyle.height.split('px')[0]
|
|
|
|
|
moveData.moveDataStyle.left = e.clientX - Number(width)/2+'px'
|
|
|
|
|
moveData.moveDataStyle.top = e.clientY - Number(height)/2+'px'
|
|
|
|
|
}
|
|
|
|
|
return {
|
|
|
|
|
store,
|
|
|
|
|
likeDesignCollectionList,
|
|
|
|
|
deleteDesignCollectionList,
|
|
|
|
|
designCollectionList,
|
|
|
|
|
userGroupId,
|
|
|
|
|
userDetail,
|
|
|
|
|
@@ -423,7 +494,16 @@ export default defineComponent({
|
|
|
|
|
setSystemDesigner,
|
|
|
|
|
...toRefs(collItemSize),
|
|
|
|
|
designImg,
|
|
|
|
|
domHidden,
|
|
|
|
|
recycleDomHidden,
|
|
|
|
|
getDesignTime,
|
|
|
|
|
|
|
|
|
|
setDesignImgWidth,
|
|
|
|
|
setDeleteDesign,
|
|
|
|
|
cancelDeleteDesign,
|
|
|
|
|
...toRefs(moveData),
|
|
|
|
|
designMousedown,
|
|
|
|
|
getMousePosition,
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
@@ -446,9 +526,7 @@ export default defineComponent({
|
|
|
|
|
likeLoading: false, //喜欢防抖
|
|
|
|
|
dragIdx:0,
|
|
|
|
|
designRandom:'',
|
|
|
|
|
domHidden:JSON.parse(sessionStorage.getItem('domHidden') as any) || false,
|
|
|
|
|
|
|
|
|
|
getDesignTime:null as any,
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
@@ -467,6 +545,7 @@ export default defineComponent({
|
|
|
|
|
beforeUnmount(){
|
|
|
|
|
clearTimeout(this.getDesignTime);
|
|
|
|
|
sessionStorage.setItem('domHidden',JSON.stringify(this.domHidden))
|
|
|
|
|
sessionStorage.setItem('recycleDomHidden',JSON.stringify(this.recycleDomHidden))
|
|
|
|
|
sessionStorage.setItem('collValue',JSON.stringify(this.collValue))
|
|
|
|
|
},
|
|
|
|
|
async mounted() {
|
|
|
|
|
@@ -614,17 +693,6 @@ export default defineComponent({
|
|
|
|
|
|
|
|
|
|
// affiche.afficheMask = true
|
|
|
|
|
},
|
|
|
|
|
dragstart (e:any, index:any) {
|
|
|
|
|
|
|
|
|
|
this.dragIdx = index
|
|
|
|
|
},
|
|
|
|
|
dragDrop (e:any, index:any,list:any) {
|
|
|
|
|
let _teams = list //将hotteams存起来
|
|
|
|
|
let _dragitem = _teams[this.dragIdx] //将被拖拽的那条数据存起来
|
|
|
|
|
if(!_dragitem)return
|
|
|
|
|
_teams.splice(this.dragIdx, 1) //删除被拖拽的那条数据
|
|
|
|
|
_teams.splice(index, 0, _dragitem) //将被拖拽的那条数据放到数组中指定的位置
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//判断模特和当前start的sketch是否匹配
|
|
|
|
|
isMannequin(){
|
|
|
|
|
@@ -1264,6 +1332,11 @@ export default defineComponent({
|
|
|
|
|
this.$emit('setTask',data)
|
|
|
|
|
// this.exportModel()
|
|
|
|
|
},
|
|
|
|
|
setShowHide(str:string){
|
|
|
|
|
if(str == 'recycleDomHidden')this.recycleDomHidden = !this.recycleDomHidden
|
|
|
|
|
if(str == 'domHidden')this.domHidden = !this.domHidden
|
|
|
|
|
this.setDesignImgWidth()
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
@@ -1278,8 +1351,10 @@ export default defineComponent({
|
|
|
|
|
// left: 50%;
|
|
|
|
|
// margin-left: -50%;
|
|
|
|
|
// transform: translateX(-50%);
|
|
|
|
|
|
|
|
|
|
.page_content {
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
.userSystem{
|
|
|
|
|
position: absolute;
|
|
|
|
|
width: 100%;
|
|
|
|
|
@@ -1293,6 +1368,31 @@ export default defineComponent({
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
font-size: 4rem;
|
|
|
|
|
}
|
|
|
|
|
.home_page_left_bottom{
|
|
|
|
|
position: absolute;
|
|
|
|
|
width: 4rem;
|
|
|
|
|
height: 7rem;
|
|
|
|
|
background: #fff;
|
|
|
|
|
border: 2px solid;
|
|
|
|
|
border-right: none;
|
|
|
|
|
border-radius: 2rem 0 0 2rem;
|
|
|
|
|
top: 50%;
|
|
|
|
|
transform: translate(-100%,-50%);
|
|
|
|
|
left: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
z-index: 2;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
>span{
|
|
|
|
|
transition: all .3s;
|
|
|
|
|
transform: rotate(90deg);
|
|
|
|
|
&.active{
|
|
|
|
|
transform: rotate(270deg);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.page_content_body {
|
|
|
|
|
position: absolute;
|
|
|
|
|
width: 100%;
|
|
|
|
|
@@ -1316,31 +1416,7 @@ export default defineComponent({
|
|
|
|
|
position: relative;
|
|
|
|
|
// overflow: hidden;
|
|
|
|
|
|
|
|
|
|
.home_page_left_bottom{
|
|
|
|
|
position: absolute;
|
|
|
|
|
width: 4rem;
|
|
|
|
|
height: 7rem;
|
|
|
|
|
background: #fff;
|
|
|
|
|
border: 2px solid;
|
|
|
|
|
border-right: none;
|
|
|
|
|
border-radius: 2rem 0 0 2rem;
|
|
|
|
|
top: 50%;
|
|
|
|
|
transform: translate(-100%,-50%);
|
|
|
|
|
left: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
z-index: 2;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
>span{
|
|
|
|
|
transition: all .3s;
|
|
|
|
|
transform: rotate(90deg);
|
|
|
|
|
&.active{
|
|
|
|
|
transform: rotate(270deg);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.home_page_left_content {
|
|
|
|
|
height: 100%;
|
|
|
|
|
width: 55rem;
|
|
|
|
|
@@ -1439,10 +1515,27 @@ export default defineComponent({
|
|
|
|
|
// width: calc(100% - 44.4rem);
|
|
|
|
|
flex: 1;
|
|
|
|
|
height: 100%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
width: 100%;
|
|
|
|
|
// overflow: hidden;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
position: relative;
|
|
|
|
|
.home_page_left_bottom{
|
|
|
|
|
border-radius: 0 2rem 2rem 0rem;
|
|
|
|
|
left: 2rem;
|
|
|
|
|
top: 50%;
|
|
|
|
|
left: auto;
|
|
|
|
|
right: 0;
|
|
|
|
|
transform: translate(100%, -50%);
|
|
|
|
|
// top: calc(50% - 10.4rem / 2);
|
|
|
|
|
border: 2px solid;
|
|
|
|
|
border-left: none;
|
|
|
|
|
&.active{
|
|
|
|
|
right: 53rem;
|
|
|
|
|
transform: translate(0, -50%);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.right_top {
|
|
|
|
|
padding: 2rem 3.2rem 2rem 1.2rem;
|
|
|
|
|
display: flex;
|
|
|
|
|
@@ -1477,12 +1570,35 @@ export default defineComponent({
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.right_content_block {
|
|
|
|
|
overflow-y: auto;
|
|
|
|
|
.right_content_block_box{
|
|
|
|
|
flex: 1;
|
|
|
|
|
display: flex;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
|
|
|
|
.right_content_block {
|
|
|
|
|
flex: 1;
|
|
|
|
|
display: flex;
|
|
|
|
|
width: 0;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
&.recycleBin{
|
|
|
|
|
flex: none;
|
|
|
|
|
margin-left: 0;
|
|
|
|
|
width: 0;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
&.recycleBinShow{
|
|
|
|
|
width: auto;
|
|
|
|
|
margin-left: 2rem;
|
|
|
|
|
}
|
|
|
|
|
.right_content_body {
|
|
|
|
|
width: 55rem;
|
|
|
|
|
.right_content_img_block{
|
|
|
|
|
.content_img_block{
|
|
|
|
|
width: 16rem;
|
|
|
|
|
height: 23rem;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
&.right_content_block::-webkit-scrollbar{display: none;}
|
|
|
|
|
&.active{
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
@@ -1616,7 +1732,7 @@ export default defineComponent({
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
&:hover .icon_like,&:hover .icon_delete {
|
|
|
|
|
&:hover .icon_like,&:hover .icon_delete,&:hover .Dustbin {
|
|
|
|
|
display: block;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@@ -1631,7 +1747,7 @@ export default defineComponent({
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
border-radius: 2rem;
|
|
|
|
|
|
|
|
|
|
border: 2px solid #E0E0E0;
|
|
|
|
|
}
|
|
|
|
|
&.active{
|
|
|
|
|
.icon_like,.icon_delete{
|
|
|
|
|
@@ -1648,7 +1764,19 @@ export default defineComponent({
|
|
|
|
|
// max-height: 100%;
|
|
|
|
|
object-fit: contain;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.Dustbin{
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 50%;
|
|
|
|
|
left: 50%;
|
|
|
|
|
transform: translate(-50%,-50%);
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
color: #fff;
|
|
|
|
|
border-radius: 4rem;
|
|
|
|
|
font-size: 1.8rem;
|
|
|
|
|
padding: 1rem 1.5rem;
|
|
|
|
|
background: rgba(0, 0, 0, 0.7);
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
.icon_like,.icon_delete {
|
|
|
|
|
font-size: 2.4rem;
|
|
|
|
|
top: 1rem;
|
|
|
|
|
|