push Develop

This commit is contained in:
X1627315083
2024-06-17 09:39:01 +08:00
parent c93483e36f
commit 363b880276
55 changed files with 5880 additions and 1359 deletions

View File

@@ -1,70 +1,49 @@
<template>
<div class="detail_modal_body_result">
<div v-show="type_ == 1 || type_ == 2" class="result_apparel_print">
<div v-show="type_ == 1" class="result_apparel_print">
<div class="upload_title result_apparel" v-show="type_ == 1">
<i class="color_edit fi fi-bs-comments"></i>
<span>{{ $t('DesignDetailEnd.NewApparel') }}</span>
</div>
<div v-show="type_ == 2" class="result_print">
<div>
<div class="upload_title">
<i class="color_edit fi fi-bs-comments"></i>
<span>{{ $t('DesignDetailEnd.NewPrint') }}</span>
</div>
<div class="print_left">
<!-- <img :src="current.path" :title="current.type"> -->
<img :src="current?.printObject?.prints?.[0]?.path" v-if="current?.printObject?.prints?.[0]?.path">
<div src="@/assets/images/homePage/null_img.png" v-else ></div>
<div
v-show="current?.printObject?.prints?.[0]?.path"
class="delete_file_block"
@click="deleteFile"
>
<span class="icon iconfont icon-shanchu"></span>
</div>
</div>
</div>
<div>
<div class="upload_title">
<i class="color_edit fi fi-bs-comments"></i>
<span>{{ $t('DesignDetailEnd.Placement') }}</span>
</div>
<div class="print_right">
<div class="habit_Overal_Single">
<div
class="habit_Overal_Single_text"
:class="{ active: !overallSingle }"
>
{{ $t('DesignDetailEnd.Overall') }}
</div>
<a-switch @click="setOveralSingle" v-model:checked="overallSingle" />
<div
class="habit_Overal_Single_text"
:class="{ active: overallSingle }"
>
{{ $t('DesignDetailEnd.Single') }}
</div>
</div>
<!-- <div v-show="!overallSingle" class="habit_System_Designer">
<a-slider id="system_silder"
v-model:value="systemDesignerPercentage"
@afterChange="systemDesigner"
:tip-formatter="formatter"
>
</a-slider>
</div> -->
</div>
</div>
</div>
<div class="result_apparel_print_img">
<img v-show="type_==1" class="result_appare_img" :src="sketchImg?.path?sketchImg?.path:current?.path" :title="current?.type">
<!-- <img v-show="type_==2" class="result_print_img" :src="current?.path" :title="current?.type" @click="setPrint"> -->
<div v-show="type_==2" class="result_print_img" @click="setPrint" :title="current?.type">
<!-- <div v-show="type_==2" class="result_print_img" @click="setPrint" :title="current?.type">
<img v-for="item in current?.layersObject" :src="item.imageUrl" alt="">
</div>
</div> -->
</div>
</div>
<div v-show="type_ == 2" class="result_apparel_elements">
<div class="upload_title result_apparel">
<i class="color_edit fi fi-bs-comments"></i>
<span>{{ $t('DesignDetailEnd.NewPrint') }}</span>
</div>
<div class="modal_img">
<div class="modal_img_item" v-for="item,index in exhibitionList.print" :key="item" >
<!-- <div class="modal_img_item" v-for="item,index in current.printObject.prints" :key="item" > -->
<img v-lazy="item.path" alt="">
<sketchCategory :disignTypeList="designTypeList" :generateList="exhibitionList.print" :item="item" :isSpread="true" :isSetSketchCategory="true"></sketchCategory>
<div
class="delete_file_block"
@click="deleteSelectptints(item,index)"
>
<span class="icon iconfont icon-shanchu"></span>
</div>
</div>
<div class="modal_img_item" v-for="item,index in printsList" :key="item" >
<img v-lazy="item.path" alt="">
<sketchCategory :disignTypeList="designTypeList" :generateList="printsList" :item="item" :isSpread="true" :isSetSketchCategory="true"></sketchCategory>
<div
class="delete_file_block"
@click="deleteptints(item,index)"
>
<span class="icon iconfont icon-shanchu"></span>
</div>
</div>
</div>
</div>
<div v-show="type_ == 3">
<div class="result_color upload_title">
<i class="color_edit fi fi-bs-comments"></i>
@@ -84,11 +63,43 @@
</div>
</div>
</div>
<div v-show="type_ == 4" class="result_apparel_elements">
<div class="upload_title result_apparel">
<i class="color_edit fi fi-bs-comments"></i>
<span>New Elements</span>
</div>
<div class="modal_img">
<!-- <div class="modal_img_item" v-for="item,index in current.trims.prints" :key="item" > -->
<div class="modal_img_item" v-for="item,index in exhibitionList.elements" :key="item" >
<img v-lazy="item.path" alt="">
<div
class="delete_file_block"
@click="deleteSelectElements(item,index)"
>
<span class="icon iconfont icon-shanchu"></span>
</div>
</div>
<div class="modal_img_item" v-for="item,index in elementsList" :key="item" >
<img v-lazy="item.url" alt="">
<div
class="delete_file_block"
@click="deleteElements(item,index)"
>
<span class="icon iconfont icon-shanchu"></span>
</div>
</div>
</div>
</div>
<div v-show="type_ == 1 || type_ == 3" @click.stop="setPreview" class="subitOkPreviewBtn" :class="[ !sketchImg?.id?!current?.id?'active':'':'' ]">{{ $t('DesignDetailEnd.preview') }}</div>
<div v-if="type_ == 2 && current?.printObject?.prints?.[0]?.path != null" @click.stop="setPrint" class="subitOkPreviewBtn Guide_1_23">{{ $t('DesignDetailEnd.Layout') }}</div>
<div v-else-if="type_ == 2 && designItemDetail?.clothes?.[currentIndex]?.printObject?.prints?.[0]?.path != null && current?.printObject?.prints?.[0]?.path == null" @click.stop="setPreview" class="subitOkPreviewBtn">{{ $t('DesignDetailEnd.preview') }}</div>
<div v-if="type_ == 2 && (current?.printObject?.prints?.length != 0 || printsList.length != 0)" @click.stop="setPrint" class="subitOkPreviewBtn Guide_1_23">{{ $t('DesignDetailEnd.Layout') }}</div>
<!-- <div v-else-if="type_ == 2 && designItemDetail?.clothes?.[currentIndex]?.printObject?.prints?.[0]?.path != null && current?.printObject?.prints?.[0]?.path == null" @click.stop="setPreview" class="subitOkPreviewBtn">{{ $t('DesignDetailEnd.preview') }}</div> -->
<div v-if="type_ == 4" @click.stop="setElemets" class="subitOkPreviewBtn">{{ $t('DesignDetailEnd.Layout') }}</div>
<DesignPrintOperation v-if="!moible" ref="DesignPrintOperation"></DesignPrintOperation>
<DesignPrintOperationMobile v-else ref="DesignPrintOperationMobile"></DesignPrintOperationMobile>
<DesignElementsOperation v-if="!moible" ref="DesignElementsOperation"></DesignElementsOperation>
<DesignPrintMobile v-else ref="DesignPrintMobile"></DesignPrintMobile>
</div>
<div class="mark_loading" v-show="loadingShow">
<a-spin size="large" />
@@ -102,15 +113,19 @@ import { useStore } from "vuex";
import { Sketch} from '@ans1998/vue3-color'
import DesignPrintOperation from './DesignPrintOperation.vue';
import DesignPrintOperationMobile from './DesignPrintOperationMobile.vue';
import DesignElementsOperation from './DesignElements.vue';
import DesignPrintMobile from './DesignElementsMobile.vue';
import { message,Upload} from 'ant-design-vue';
import { openGuide,driverObj__ } from "@/tool/guide";
import {isMoible,setGradual} from '@/tool/util'
import { useI18n } from 'vue-i18n';
import sketchCategory from "@/component/HomePage/sketchCategory.vue";
export default defineComponent({
props: ["msg"],
components:{
Draggable,Sketch,DesignPrintOperation,DesignPrintOperationMobile
Draggable,Sketch,DesignPrintOperation,DesignPrintOperationMobile,
DesignElementsOperation,DesignPrintMobile,sketchCategory
},
setup(prop) {
const store = useStore();
@@ -122,10 +137,9 @@ export default defineComponent({
let moible = inject('moible')//父组件传过来的数据
let designItemDetail = inject('designItemDetail')//父组件传过来的数据
let currentIndex = inject('currentIndex')//父组件传过来的数据
let designTypeList = inject('designTypeList')//父组件传过来的数据
let previewShow = ref(false)
//印花
let overallSingle = ref(false)
let systemDesignerPercentage = ref(30)
//颜色
// let colorList = ref([{}])
@@ -135,7 +149,12 @@ export default defineComponent({
//加载中
let loadingShow = ref(false)
let exhibitionList = inject('exhibitionList')
let {t} = useI18n()
let printsList = ref([])
let elementsList = ref([
])
return{
store,
current,
@@ -145,14 +164,16 @@ export default defineComponent({
moible,
designItemDetail,
currentIndex,
designTypeList,
previewShow,
type_,
overallSingle,
systemDesignerPercentage,
colorList,
selectIndex,
loadingShow,
exhibitionList,
t,
printsList,
elementsList,
}
},
data(){
@@ -182,14 +203,40 @@ export default defineComponent({
}
}
},
watch: {
'exhibitionList.print':{
handler(newVal,oldVal){
this.printsList = this.printsList.filter(objA => {
return !newVal.some(objB => objB.minIOPath === objA.minIOPath);
});
this.setExhibitionType('print')
}
},
'exhibitionList.elements':{
handler(newVal,oldVal){
this.elementsList = this.elementsList.filter(objA => {
return !newVal.some(objB => objB.minIOPath === objA.minIOPath);
});
this.setExhibitionType('elements')
}
}
},
methods:{
//点击判断
init(num){
// this.current = JSON.parse(JSON.stringify(this.currentItem))
this.type_ = num
this.colorList[this.selectIndex] = this.$parent.selectColor
this.overallSingle = this.current?.printObject?.ifSingle == null?false:this.current?.printObject?.ifSingle
this.systemDesignerPercentage = this.current?.printObject?.ifSingle?this.current?.printObject?.prints[0].scale?this.current?.printObject?.prints[0].scale*100:100:100
if(num == 2){
this.setExhibitionType('print')
}else if(num == 4){
this.setExhibitionType('elements')
}
},
clearModal(){
this.elementsList = []
this.printsList = []
},
//模型
setSketchImg(v){
@@ -201,17 +248,22 @@ export default defineComponent({
this.sketchImg.designType = v.designType
},
//印花
systemDesigner(num) {
this.current.printObject.scale = num
},
setOveralSingle(){
this.current.printObject.ifSingle = this.overallSingle
},
formatter(value) {
return `${value*3}%`;
setExhibitionType(str){
this.exhibitionList[str].forEach((item,index)=>{
if(!item.categoryValue){
this.designTypeList.forEach((typeItem)=>{
if(item.level2Type == typeItem.value){
item.categoryValue = typeItem.name
item.category = typeItem.value
}
})
}
})
},
setPrint(){
if(this.current?.printObject?.prints?.[0]?.path){
// if(this.current?.printObject?.prints?.[0]?.path){
let DesignPrintOperation = isMoible() ? this.$refs.DesignPrintOperationMobile : this.$refs.DesignPrintOperation
DesignPrintOperation.init()
if(this.driver__.driver){
@@ -219,9 +271,9 @@ export default defineComponent({
driverObj__.moveNext();
})
}
}else{
message.info(this.t('DesignDetailEnd.jsContent1'));
}
// }else{
// message.info(this.t('DesignDetailEnd.jsContent1'));
// }
},
deleteFile(){
@@ -286,6 +338,23 @@ export default defineComponent({
// arr[index].id = this.sketchImg.id_? this.sketchImg.id_:this.current.id
return arr
},
deleteptints(item,index){
this.printsList.splice(index,1)
},
deleteSelectptints(item,index){
this.exhibitionList.print.splice(index,1)
},
deleteElements(item,index){
this.elementsList.splice(index,1)
},
deleteSelectElements(item,index){
this.exhibitionList.elements.splice(index,1)
},
setElemets(){
if(this.current.trims.prints && this.current.trims.prints.length == 0 && this.elementsList.length == 0)return message.info('请选择至少一张element')
let DesignElementsOperation = isMoible() ? this.$refs.DesignPrintMobile : this.$refs.DesignElementsOperation
DesignElementsOperation.init()
},
//提交
setPreview(){
let designItemDetail = JSON.parse(JSON.stringify(this.store.state.DesignDetailModule.designItemDetail))
@@ -329,6 +398,8 @@ export default defineComponent({
}
let color = `${this.colorList[this.selectIndex].rgba.r} ${this.colorList[this.selectIndex].rgba.g} ${this.colorList[this.selectIndex].rgba.b}`
data.designSingleItemDTOList[index].color = color
}else if(this.type_ == 4){
data.designSingleItemDTOList[index].trims = this.current.trims
}
if(this.colorList[this.selectIndex].gradient){
let gradient = this.colorList[this.selectIndex].gradient
@@ -353,6 +424,7 @@ export default defineComponent({
delete designItemDetail.clothes[index].gradient
}
designItemDetail.clothes[index].designType = item.designType
designItemDetail.clothes[index].trims = item.trims
designItemDetail.clothes[index].layersObject = item.layersObject
designItemDetail.clothes[index].minIOPath = item.minIOPath
designItemDetail.clothes[index].path = item.path
@@ -544,6 +616,7 @@ export default defineComponent({
display: flex;
flex-wrap: wrap;
padding-left: calc(2rem*1.2);
align-content: flex-start;
&.modal_img::-webkit-scrollbar {
display: none;
}
@@ -590,6 +663,48 @@ export default defineComponent({
}
}
//elements
.result_apparel_elements{
height: 85%;
// height: 100%;
.modal_img{
height: calc(100%);
overflow-y: auto;
}
.modal_img_item{
display: flex;
justify-content: center;
align-items: center;
position: relative;
height: auto;
border: none;
img{
width: 100%;
object-fit: cover;
}
.delete_file_block{
display: none;
width: calc(3.2rem*1.2);
height: calc(3.2rem*1.2);
background: rgba(0,0,0,0.6);
border-radius: calc(0.4rem*1.2);
position: absolute;
top: calc(0.9rem*1.2);
right: calc(0.9rem*1.2);
text-align: center;
line-height: calc(3.2rem*1.2);
left: auto;
cursor: pointer;
.icon-shanchu{
font-size: calc(1.6rem*1.2);
color: #fff;
}
}
&:hover .delete_file_block{
display: block;
}
}
}
.subitOkPreviewBtn{
bottom: calc(4rem*1.2);
position: absolute;