修复bug
This commit is contained in:
X1627315083
206
src/component/DetailCopy/designDetail.vue
Normal file
206
src/component/DetailCopy/designDetail.vue
Normal file
@@ -0,0 +1,206 @@
|
||||
<template>
|
||||
<div ref="designDetailModal" class="designDetailModal">
|
||||
<!-- designDetailShow -->
|
||||
<!-- :class="[driver__.driver?'hideEvents':'']" -->
|
||||
<a-modal class="Guide_1_18 generalModel fullScreen"
|
||||
v-model:visible="designDetailShow"
|
||||
:footer="null"
|
||||
:get-container="() => $refs.designDetailModal"
|
||||
width="100%"
|
||||
height="100%"
|
||||
:maskClosable="false"
|
||||
:mask="false"
|
||||
:centered="true"
|
||||
:keyboard="false"
|
||||
:closable="false"
|
||||
>
|
||||
<div class="content">
|
||||
<div class="nav">
|
||||
<div class="back_home">
|
||||
<div class="gallery_btn" @click="closeModal()">
|
||||
<i class="fi fi-rs-house-chimney"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="nav_list">
|
||||
<div class="nav_item active">
|
||||
<img src="@/assets/images/icon/details_sketch.png" alt="">
|
||||
<div class="detailText">Apparel</div>
|
||||
</div>
|
||||
<div class="nav_item">
|
||||
<img src="@/assets/images/icon/details_print.png" alt="">
|
||||
<div class="detailText">Print</div>
|
||||
</div>
|
||||
<div class="nav_item">
|
||||
<img src="@/assets/images/icon/details_color.png" alt="">
|
||||
<div class="detailText">Color</div>
|
||||
</div>
|
||||
<div class="nav_item">
|
||||
<img src="@/assets/images/icon/details_elements.png" alt="">
|
||||
<div class="detailText">Elements</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<sketchLeft></sketchLeft>
|
||||
</div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div class="gallery_btn submit">Submit</div>
|
||||
</div>
|
||||
|
||||
</a-modal>
|
||||
<div class="mark_loading" v-show="loadingShow">
|
||||
<a-spin size="large" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, reactive} from 'vue'
|
||||
import sketchLeft from './sketchLeft.vue'
|
||||
|
||||
// import setDesignItem from '@/component/Detail/setDesignItem2.vue'
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { Https } from "@/tool/https";
|
||||
import { Modal,message } from 'ant-design-vue';
|
||||
import {getUploadUrl,isMoible,setGradual} from '@/tool/util'
|
||||
import { useStore } from "vuex";
|
||||
import { openGuide,driverObj__ } from "@/tool/guide";
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import addDetails from '@/component/Detail/addDetails.vue'
|
||||
export default defineComponent({
|
||||
components:{
|
||||
sketchLeft,
|
||||
},
|
||||
setup() {
|
||||
const store = useStore();
|
||||
|
||||
let designItemDetail :any = computed(()=>{
|
||||
return store.state.DesignDetailModule.designItemDetail
|
||||
})
|
||||
const userDetail = computed(()=>{
|
||||
return store.state.UserHabit.userDetail
|
||||
})
|
||||
const detailData = reactive({
|
||||
designDetailShow:true,
|
||||
loadingShow:false,
|
||||
})
|
||||
const closeModal = ()=>{
|
||||
detailData.designDetailShow = false
|
||||
}
|
||||
return{
|
||||
...toRefs(detailData),
|
||||
closeModal,
|
||||
}
|
||||
},
|
||||
provide() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
let beforeunload = () => {
|
||||
window.removeEventListener('beforeunload',beforeunload)
|
||||
}
|
||||
window.addEventListener('beforeunload',beforeunload)
|
||||
// let url = Https.httpUrls.getDesignDetail + `?designItemId=34242&designPythonOutfitId=34004`
|
||||
// this.loadingShow = true
|
||||
// Https.axiosGet(url).then(
|
||||
// async (rv: any) => {
|
||||
// rv.clothes.forEach((item:any)=>{
|
||||
// let a
|
||||
// if(item.layersObject[0].imageCategory.indexOf("back") == -1){
|
||||
// a = item.layersObject[0]
|
||||
// item.layersObject[0] = item.layersObject[1]
|
||||
// item.layersObject[1] = a
|
||||
// }
|
||||
// if(item.printObject.prints == null){
|
||||
// item.printObject.prints = [{}]
|
||||
// }
|
||||
// })
|
||||
// this.store.commit('setDesignItemDetail',rv)
|
||||
// if(rv.others[0].printObject.path == null){
|
||||
// this.body = false
|
||||
// }else{
|
||||
// this.body = true
|
||||
// }
|
||||
// this.setImgSize()
|
||||
// this.generateHighDesignImg = rv.highDesignUrl
|
||||
// this.designShowPrview = 1
|
||||
// this.designDetailShow = true
|
||||
// this.loadingShow = false
|
||||
// }
|
||||
// ).catch(rv=>{
|
||||
// this.loadingShow = false
|
||||
// })
|
||||
},
|
||||
|
||||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
:deep(.detailText){
|
||||
font-size: 1.8rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.designDetailModal{
|
||||
position: relative;
|
||||
top: -100%;
|
||||
height: 100%;
|
||||
:deep(.ant-modal-wrap){
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
.content{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
> .item{
|
||||
height: 100%;
|
||||
}
|
||||
> .nav{
|
||||
margin-right: 5rem;
|
||||
> .back_home{
|
||||
width: 9rem;
|
||||
text-align: center;
|
||||
> .gallery_btn{
|
||||
width: 6rem;
|
||||
height: 6rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
> .nav_list{
|
||||
margin-top: 2.7rem;
|
||||
height: 38rem;
|
||||
width: 9rem;
|
||||
background: #f4f4f4;
|
||||
border-radius: 1.4rem;
|
||||
padding: 1.4rem 0;
|
||||
> .nav_item{
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
height: calc((38rem - 1.4rem * 2) / 4);
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
> img{
|
||||
width: 4rem;
|
||||
height: 3.6rem;
|
||||
object-fit: contain;
|
||||
}
|
||||
&.active{
|
||||
background: #bdbdbd;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
> .submit{
|
||||
margin-left: auto;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user