This commit is contained in:
2023-10-11 17:34:14 +08:00
parent 98dc5cd8f7
commit 268ffecff7
35 changed files with 1947 additions and 878 deletions

View File

@@ -27,80 +27,120 @@
</div>
</div>
<div v-show="openClick == 1" class="detail_Upload_item">
<div class="moodboard_body">
<div class="upload_img_body scroll_style">
<div class="upload_item">
<div class="moodboard_body">
<div class="upload_img_body scroll_style">
<div class="upload_item">
<div
class="upload_file_item"
v-for="(file, index) in uploadList"
:key="file"
@click.stop="selectImgItem(file)"
>
<div
class="upload_file_item"
v-for="(file, index) in uploadList"
:key="file"
@click.stop="selectImgItem(file)"
class="upload_file_item_content"
v-show="file?.status === 'uploading'"
>
<div
class="upload_file_item_content"
v-show="file?.status === 'uploading'"
>
<a-spin :indicator="indicator" tip="Uploading..." />
</div>
<div
class="upload_file_item_content"
v-show="file?.status === 'done'"
>
<img :src="file?.url" class="upload_img" />
<div class="operate_file_block" v-show="selectCode == 'Sketchboard'">
<div class="select_img_type">
<div
class="select_category"
@click.stop="showFileCategory(file)"
>
{{ current.type }}
</div>
<a-spin :indicator="indicator" tip="Uploading..." />
</div>
<div
class="upload_file_item_content"
v-show="file?.status === 'done'"
>
<img :src="file?.url" class="upload_img" />
<div class="operate_file_block" v-show="selectCode == 'Sketchboard'">
<div class="select_img_type">
<div
class="select_category"
@click.stop="showFileCategory(file)"
>
{{ current.type }}
</div>
</div>
<div
class="delete_file_block"
@click.stop="deleteFile(index)"
>
<span class="icon iconfont icon-shanchu"></span>
</div>
</div>
<div
class="delete_file_block"
@click.stop="deleteFile(index)"
>
<span class="icon iconfont icon-shanchu"></span>
</div>
</div>
<div
class="upload_file_item upload_component"
v-show="uploadList.length != 8"
</div>
<div
class="upload_file_item upload_component"
v-show="uploadList.length != 8"
>
<a-upload
:action="uploadUrl + '/api/element/upload'"
list-type="picture-card"
:data="{
...upload,
}"
:headers="{ Authorization: token }"
v-model:file-list="uploadList"
:before-upload="beforeUpload"
:maxCount="8 - uploadList.length"
accept=".jpg,.png,.jpeg,.bmp"
@change="(file) => upFileUploadChange(file)"
>
<a-upload
:action="uploadUrl + '/api/element/upload'"
list-type="picture-card"
:data="{
...upload,
}"
:headers="{ Authorization: token }"
v-model:file-list="uploadList"
:before-upload="beforeUpload"
:maxCount="8 - uploadList.length"
accept=".jpg,.png,.jpeg,.bmp"
@change="(file) => upFileUploadChange(file)"
<div
class="upload_tip_block"
v-show="uploadList.length != 8"
>
<div
class="upload_tip_block"
v-show="uploadList.length != 8"
>
<i class="fi fi-br-upload"></i>
<!-- <img class="upload_img_icon" src="@/assets/images/homePage/add_file.png"> -->
</div>
</a-upload>
</div>
<i class="fi fi-br-upload"></i>
<!-- <img class="upload_img_icon" src="@/assets/images/homePage/add_file.png"> -->
</div>
</a-upload>
</div>
</div>
</div>
</div>
</div>
<div v-show="openClick == 2" class="detail_Library_item">
<div class="material_content_body scroll_style">
<div class="content_img_item" v-for="(file) in clothesList" :key="file.id" :class="{active:selectCode !== 'Moodboard'}">
<div class="content_img_item_block" :class="{active:file?.checked}">
<img :class="[ selectCode == 'Printboard' ? 'print_content_img' : 'content_img']" v-lazy="file.url" :key="file.url" :alt="file.name" @click.stop="selectImgItem(file)"/>
<div v-if="selectCode == 'Sketchboard'" class="operate_file_block">
<div class="select_img_type">
<div
class="select_category"
@click.stop="showFileCategory(file)"
>
{{ getSketchLabel(file.level2Type) }}
<div
:class="[
'icon',
'iconfont',
'icon-xiala',
file.categoryShow
? 'icon_rotate'
: '',
]"
></div>
</div>
<div
class="category_list"
v-show="file.categoryShow"
>
<div
:class="[
'category_item',
file.level2Type == cate.value
? 'select_category_item'
: '',
]"
v-for="(
cate, index
) in disignTypeList"
:key="index"
@click.stop="selectFileCategory(file, cate)"
>
{{ cate.label }}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@@ -270,6 +310,8 @@ export default defineComponent({
}) //顔色选择器默认颜色
let selectColorList = ref({
})
let workspace = ref({})
return{
store,
current,
@@ -287,54 +329,10 @@ export default defineComponent({
select,
selectColor,
selectColorList,
workspace,
}
},
watch:{
selectColor(newVal,oldVal){
let DesignDetailEnd = this.$refs.DesignDetailEnd
DesignDetailEnd.colorList[DesignDetailEnd.selectIndex] = newVal
let colorList = DesignDetailEnd.colorList.filter((v) => v && Object.keys(v).length)
this.setColorboardList(colorList)
clearInterval(this.getPantongNameTime)
this.getPantongNameTime = setTimeout(() => {
this.getPantongName(newVal.rgba)
}, 100);
}
},
computed:{
getSketchLabel(value) {
return (value) => {
let lable = "";
for (let item of this.disignTypeList) {
if (item.value === value) {
lable = item.label;
break;
}
}
return lable;
};
},
getSelectRGB(selectColor){
return (selectColor)=>{
let rgba = selectColor.rgba
let data = {
r:rgba?.r || rgba?.r===0 ? rgba?.r : 255,
g:rgba?.g || rgba?.g===0 ? rgba?.g : 255,
b:rgba?.b || rgba?.b===0 ? rgba?.b : 255,
a:rgba?.a || rgba?.a===1 ? rgba?.a : 1,
hex:selectColor.hex == undefined ? '#FFFFFF': selectColor.hex
}
if(data.a != 1 || data.a != 0){
data.hex = selectColor.hex8?selectColor.hex8:selectColor.hex
}
return data
}
},
},
data(){
return{
@@ -372,13 +370,66 @@ export default defineComponent({
},
spin: true,
}),
getPantongNameTime:true
getPantongNameTime:true,
workspaceCom:{}
}
},
computed:{
getSketchLabel(value) {
return (value) => {
let lable = "";
for (let item of this.disignTypeList) {
if (item.value === value) {
lable = item.label;
break;
}
}
return lable;
};
},
getSelectRGB(selectColor){
return (selectColor)=>{
let rgba = selectColor.rgba
let data = {
r:rgba?.r || rgba?.r===0 ? rgba?.r : 255,
g:rgba?.g || rgba?.g===0 ? rgba?.g : 255,
b:rgba?.b || rgba?.b===0 ? rgba?.b : 255,
a:rgba?.a || rgba?.a===1 ? rgba?.a : 1,
hex:selectColor.hex == undefined ? '#FFFFFF': selectColor.hex
}
if(data.a != 1 || data.a != 0){
data.hex = selectColor.hex8?selectColor.hex8:selectColor.hex
}
return data
}
},
},
mounted(){
},
watch:{
selectColor(newVal,oldVal){
let DesignDetailEnd = this.$refs.DesignDetailEnd
DesignDetailEnd.colorList[DesignDetailEnd.selectIndex] = newVal
let colorList = DesignDetailEnd.colorList.filter((v) => v && Object.keys(v).length)
this.setColorboardList(colorList)
clearInterval(this.getPantongNameTime)
this.getPantongNameTime = setTimeout(() => {
this.getPantongName(newVal.rgba)
}, 100);
},
workspaceCom(newVal,oldVal){
this.workspace = newVal
this.getPosition()
},
},
mounted () {
this.token = getCookie("token") || "";
this.uploadUrl = getUploadUrl();
let dropperDom = document.getElementsByClassName("detail_modal_body_select")[0].getElementsByClassName('vc-sketch-color-wrap')[0]
dropperDom.addEventListener('click',async ()=>{
try {
@@ -433,8 +484,31 @@ export default defineComponent({
}
let DesignDetailEnd = this.$refs.DesignDetailEnd
DesignDetailEnd.init(num)
this.workspaceCom = computed(()=>{
return this.store?.state?.Workspace?.workspace
})
},
getPosition(){
let params
if(this.workspace.sex == 'Female'){
params = 'FemalePosition'
}else{
params = 'MalePosition'
}
Https.axiosGet(Https.httpUrls.workspaceenumValues,{params:{enumName:params}}).then((rv) => {
if (rv) {
let arr = []
rv.forEach((item) => {
let obj = {
value:item.name,
label:item.name,
}
arr.push(obj)
});
this.disignTypeList = arr
}
})
},
deleteFile(num){
this.uploadList.splice(num, 1)
},
@@ -506,11 +580,12 @@ export default defineComponent({
file.categoryShow = true;
document.addEventListener("click", this.hiddenFileCategory);
},
selectFileCategory(file, cate,list) {
file.category = cate.value;
for (let item of list) {
selectFileCategory(file, cate) {
file.level2Type = cate.value;
for (let item of this.clothesList) {
item.categoryShow = false;
}
this.setSketchLibrary(file)
},
hiddenFileCategory() {
for (let item of this.clothesList) {
@@ -518,6 +593,17 @@ export default defineComponent({
}
document.removeEventListener("click", this.hiddenFileCategory);
},
setSketchLibrary(item){
let data = {
libraryId:item.id,
level2Type:item.level2Type,
}
Https.axiosPost(Https.httpUrls.setSketchLibrary,data).then(
(rv) => {
}
).catch((res)=>{
});
},
selectImgItem(imgData){
if(this.selectCode == 'Sketchboard'){
// this.current.id_ = imgData.id
@@ -526,10 +612,16 @@ export default defineComponent({
DesignDetailEnd.setSketchImg(imgData)
// DesignDetailEnd.sketchImg.id_ = imgData.id
// DesignDetailEnd.sketchImg.path = imgData.url
}else{
this.current.printObject.path = imgData.url
this.current.printObject.id = imgData.id
this.current.printObject.path = imgData?.url
this.current.printObject.id = imgData?.id
this.current.printObject.minIOPath = imgData.minIOPath
this.current.printObject.prints = [{
minIOPath:imgData.minIOPath,
path:imgData?.url
}]
// console.log(this.current.printObject,imgData);
}
@@ -538,7 +630,6 @@ export default defineComponent({
},
//请求我的印花&&模型
getLibraryList(){
let data = {
level1Type:this.selectCode,
// level2Type:this.designType,
@@ -547,6 +638,7 @@ export default defineComponent({
size:10,
}
this.isShowLoading = true
Https.axiosPost(Https.httpUrls.queryLibraryPage,data).then(
(rv) => {
this.clothesList = rv.content
@@ -561,6 +653,7 @@ export default defineComponent({
open(num) {
this.openClick = num;
if(num ==2 ){
this.getLibraryList()
}
},
@@ -904,7 +997,7 @@ export default defineComponent({
// margin-bottom: 2.8rem;
margin-bottom: 2rem;
padding: 0;
height: 9rem;
// height: 9rem;
&.active{
margin-bottom: 2rem;
.pin_block{