commit
This commit is contained in:
@@ -214,6 +214,7 @@
|
||||
import { defineComponent,computed,ref, h ,nextTick ,inject,provide } from 'vue'
|
||||
import Draggable from 'vuedraggable'
|
||||
import { Https } from "@/tool/https";
|
||||
import GO from "@/tool/GO";
|
||||
import { useStore } from "vuex";
|
||||
import { LoadingOutlined } from '@ant-design/icons-vue';
|
||||
import { message,Upload} from 'ant-design-vue';
|
||||
@@ -415,7 +416,6 @@ export default defineComponent({
|
||||
},
|
||||
hex:this.rgbaToHex([arr.r,arr.g,arr.b,arr.a?arr.a:1])
|
||||
}
|
||||
console.log(this.selectColor);
|
||||
|
||||
this.uploadList = []
|
||||
if (num == 1) {
|
||||
@@ -447,12 +447,11 @@ export default defineComponent({
|
||||
file.resData = res.data;
|
||||
file.designType = res.data.designType
|
||||
file.category = this.current;
|
||||
console.log(file);
|
||||
let fileList = this.uploadList.filter(
|
||||
(v) => v.status === "done"
|
||||
);
|
||||
if (this.uploadList.length >= 8) {
|
||||
message.error("You can select up to 8 images");
|
||||
message.warning("You can select up to 8 images");
|
||||
} else {
|
||||
// this.store.commit("setSketchboardFile", fileList);
|
||||
this.uploadList = fileList
|
||||
@@ -473,7 +472,7 @@ export default defineComponent({
|
||||
if (index > -1) {
|
||||
this.uploadList.splice(index, 1);
|
||||
}
|
||||
message.error(file.name + "upload failed");
|
||||
message.warning(file.name + "upload failed");
|
||||
}
|
||||
|
||||
},
|
||||
@@ -498,6 +497,7 @@ export default defineComponent({
|
||||
this.select = false
|
||||
DesignDetailEnd.colorList = [{},{},{},{},{},{},{},{}]
|
||||
DesignDetailEnd.selectIndex = 0
|
||||
DesignDetailEnd.sketchImg={}
|
||||
},
|
||||
// this.getLibraryList('Moodboard')
|
||||
// this.getLibraryList('Printboard')
|
||||
@@ -520,14 +520,19 @@ export default defineComponent({
|
||||
},
|
||||
selectImgItem(imgData){
|
||||
if(this.selectCode == 'Sketchboard'){
|
||||
this.current.id_ = imgData.id
|
||||
this.current.path = imgData.url
|
||||
// this.current.id_ = imgData.id
|
||||
// this.current.path = imgData.url
|
||||
let DesignDetailEnd = this.$refs.DesignDetailEnd
|
||||
DesignDetailEnd.setSketchImg(imgData)
|
||||
// DesignDetailEnd.sketchImg.id_ = imgData.id
|
||||
// DesignDetailEnd.sketchImg.path = imgData.url
|
||||
|
||||
}else{
|
||||
console.log(imgData,this.current.printObject);
|
||||
this.current.printObject.url = imgData.url
|
||||
this.current.printObject.path = imgData.url
|
||||
this.current.printObject.id = imgData.id
|
||||
}
|
||||
|
||||
|
||||
// imgData.type_ = this.type_
|
||||
// this.store.commit("addGenerateMaterialFils", imgData);
|
||||
},
|
||||
@@ -568,11 +573,11 @@ export default defineComponent({
|
||||
beforeUpload(file){
|
||||
const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png' || file.type === 'image/jpg' || file.type === 'image/bmp';
|
||||
if (!isJpgOrPng) {
|
||||
message.error('You can only upload Image file!');
|
||||
message.warning('You can only upload Image file!');
|
||||
}
|
||||
const isLt2M = file.size / 1024 / 1024 < 5;
|
||||
if (!isLt2M) {
|
||||
message.error('Image must smaller than 5MB!');
|
||||
message.warning('Image must smaller than 5MB!');
|
||||
}
|
||||
return (isJpgOrPng && isLt2M) || Upload.LIST_IGNORE;
|
||||
},
|
||||
@@ -655,7 +660,7 @@ export default defineComponent({
|
||||
this.setColorboardList(colorList)
|
||||
this.getColorBg = true
|
||||
}else{
|
||||
message.error("Can't find the TCX color")
|
||||
message.warning("Can't find the TCX color")
|
||||
}
|
||||
})
|
||||
},
|
||||
@@ -714,15 +719,39 @@ export default defineComponent({
|
||||
file.status = 'done'
|
||||
this.colorFileList.push(file)
|
||||
|
||||
setTimeout(()=>{
|
||||
setTimeout(async ()=>{
|
||||
const colorThief = new ColorThief();
|
||||
let colorImage = this.$refs.colorImage
|
||||
let domImg = colorImage[0];
|
||||
let color = colorThief.getColor(domImg)
|
||||
let colorHex = this.rgbaToHex(color)
|
||||
let selectColorList = [];
|
||||
let selectColor = colorThief.getPalette(domImg,7)
|
||||
selectColor = selectColor.join('&').split("&")
|
||||
let selectColor = colorThief.getPalette(domImg,9)
|
||||
//排序
|
||||
let obj = {
|
||||
max : 30,
|
||||
min: 30,
|
||||
}
|
||||
let colorSort
|
||||
await GO.setColor(selectColor,file.imgUrl,obj).then(
|
||||
(rv) => {
|
||||
if(rv){
|
||||
colorSort = rv.ratio
|
||||
}
|
||||
}
|
||||
)
|
||||
colorSort.sort((a, b) => {
|
||||
var a_num = a.ratio;
|
||||
var b_num = b.ratio;
|
||||
return b_num - a_num;
|
||||
});
|
||||
selectColor = []
|
||||
colorSort.forEach(v=>{
|
||||
selectColor.push(v.rgb)
|
||||
})
|
||||
|
||||
selectColor = selectColor.join('&')
|
||||
selectColor = selectColor.split("&")
|
||||
let colorLi = []
|
||||
new Set(selectColor).forEach((item)=>{
|
||||
colorLi.push(item.split(","))
|
||||
@@ -788,10 +817,10 @@ export default defineComponent({
|
||||
content: "";
|
||||
display: block;
|
||||
background: #000;
|
||||
height: 3px;
|
||||
height: .3rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 6px;
|
||||
bottom: .6rem;
|
||||
width: 0px;
|
||||
transition: 0.3s all;
|
||||
}
|
||||
@@ -887,8 +916,8 @@ export default defineComponent({
|
||||
}
|
||||
.content_img_item_block{
|
||||
// border: 0.1rem solid transparent;
|
||||
width: 9rem;
|
||||
height: 9rem;
|
||||
width: 10rem;
|
||||
height: 10rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -1142,7 +1171,7 @@ export default defineComponent({
|
||||
margin: auto;
|
||||
background: #f0eaee;
|
||||
|
||||
border-radius: 10px;
|
||||
border-radius: 1rem;
|
||||
overflow: hidden;
|
||||
// box-shadow: 2px 2px 8px #000;
|
||||
box-shadow: 2px 2px 8px rgba(0,0,0,.3);
|
||||
@@ -1152,15 +1181,14 @@ export default defineComponent({
|
||||
width: 18rem;
|
||||
background: rgba(0,0,0,0);
|
||||
padding-top: 1rem !important;
|
||||
max-width: 170px;
|
||||
padding: 0;
|
||||
.vc-sketch{
|
||||
}
|
||||
.vc-sketch-saturation-wrap{
|
||||
width: 16rem;
|
||||
height: 16rem;
|
||||
max-height: 170px;
|
||||
max-width: 170px;
|
||||
max-height: 17rem;
|
||||
max-width: 17rem;
|
||||
margin: auto;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
@@ -1196,7 +1224,7 @@ export default defineComponent({
|
||||
|
||||
.vc-sketch-color-wrap{
|
||||
background-image: url(@../../../../assets/images/homePage/dropper.png);
|
||||
background-size: 15px;
|
||||
background-size: 1.5rem;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 50%;
|
||||
cursor: pointer;
|
||||
@@ -1210,10 +1238,10 @@ export default defineComponent({
|
||||
margin: .5rem auto;
|
||||
.vc-sketch-hue-wrap,.vc-sketch-alpha-wrap{
|
||||
.vc-hue{
|
||||
border-radius: 15px;
|
||||
border-radius: 1.5rem;
|
||||
}
|
||||
.vc-alpha{
|
||||
border-radius: 15px;
|
||||
border-radius: 1.5rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
@@ -1275,7 +1303,7 @@ export default defineComponent({
|
||||
align-items: center;
|
||||
.color_right{
|
||||
width: 11rem;
|
||||
font-size: 12px;
|
||||
font-size: 1,2rem;
|
||||
color: #666666;
|
||||
.color_rgb_block{
|
||||
display: flex;
|
||||
|
||||
Reference in New Issue
Block a user