fix
This commit is contained in:
@@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div class="color">
|
||||
<div class="detailText">Palette</div>
|
||||
<div class="detailText">Current color</div>
|
||||
<div class="pallet">
|
||||
<pallet :selectColor="selectColor" @selectUplpadColor="selectUplpadColor"></pallet>
|
||||
</div>
|
||||
<div class="detailText">New color</div>
|
||||
<div class="detailText">Color pelette</div>
|
||||
<div class="colorBox">
|
||||
<div v-for="item,index in colorList.list[selectDetail.id]" @click="setSelectColor(item,index)" class="colorBoxItem" :class="{active:colorList.index == index}">
|
||||
<div v-show="!item.gradient" class="background" :style="{'background-color':item.hex}"></div>
|
||||
@@ -13,7 +13,7 @@
|
||||
<div v-show="item.gradient" class="backgroundImg" :style="{'background-image':`linear-gradient(${item.gradient?.angle}deg,${setGradient(item.gradient)})`}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detailText">Upload Image</div>
|
||||
<div class="detailText">Choose color from image</div>
|
||||
<div class="uploadImage">
|
||||
<upload @selectUplpadColor="selectUplpadColor"></upload>
|
||||
</div>
|
||||
@@ -246,18 +246,19 @@ export default defineComponent({
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
> .detailText{
|
||||
margin-bottom: 1rem;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
> .pallet{
|
||||
margin-bottom: 4.5rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
> .colorBox{
|
||||
margin-bottom: 3rem;
|
||||
margin-bottom: 1rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
> .colorBoxItem{
|
||||
margin: 1rem 0;
|
||||
// margin: 1rem 0;
|
||||
margin-bottom: 1rem;
|
||||
width: 32%;
|
||||
height: 11rem;
|
||||
border-radius: .5rem;
|
||||
|
||||
@@ -272,7 +272,7 @@ export default defineComponent({
|
||||
nextTick().then(()=>{
|
||||
const backIcon = document.createElement('div');
|
||||
backIcon.classList.add('vc-sketch-color-wrap')
|
||||
let dropperDom = document.getElementsByClassName("pallet")?.[0].getElementsByClassName('vc-chrome-fields-wrap')[0]
|
||||
let dropperDom = document.getElementsByClassName("pallet")?.[0]?.getElementsByClassName('vc-chrome-fields-wrap')[0]
|
||||
dropperDom.appendChild(backIcon);
|
||||
backIcon.addEventListener('click',async ()=>{
|
||||
try {
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
accept=".jpg,.png,.jpeg,.bmp"
|
||||
>
|
||||
<div class="upload_tip_block">
|
||||
<i class="fi fi-rr-picture"></i>
|
||||
<i class="fi fi-br-upload"></i>
|
||||
</div>
|
||||
</a-upload>
|
||||
</div>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div class="detailLeft">
|
||||
<sketch v-show="currentDetailType == 'sketch'" @addDetail="addDetail"></sketch>
|
||||
<print v-show="currentDetailType == 'print'"></print>
|
||||
<color v-show="currentDetailType == 'color'"></color>
|
||||
<color v-if="currentDetailType == 'color'"></color>
|
||||
<element v-show="currentDetailType == 'element'"></element>
|
||||
<addDetails ref="addDetails" @setSloganData="setSloganData"></addDetails>
|
||||
</div>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="libraryList">
|
||||
<div class="generalModel_state">
|
||||
<div class="generalModel_state_item">
|
||||
<div class="generalModel_state" v-if="type != 'element'">
|
||||
<div class="generalModel_state_item" style="width: 40%;">
|
||||
<a-select
|
||||
v-model:value="designType"
|
||||
:options="designTypeList"
|
||||
@@ -18,8 +18,10 @@
|
||||
></template>
|
||||
</a-select>
|
||||
</div>
|
||||
<div class="generalModel_state_item">
|
||||
<input class="search_input" :placeholder="$t('DesignDetailAlter.inputContent1')" v-model="searchPictureName" @keydown.enter="getLibraryList()">
|
||||
<div class="generalModel_state_item" style="width: 35%;">
|
||||
<input class="search_input" style="width: 100%;" :placeholder="$t('DesignDetailAlter.inputContent1')" v-model="searchPictureName" @keydown.enter="getLibraryList()">
|
||||
</div>
|
||||
<div class="generalModel_state_item" style="width: auto;">
|
||||
<div class="search_icon_block" @click.stop="getLibraryList()"><span class="icon iconfont icon-sousuo"></span></div>
|
||||
</div>
|
||||
<!-- clothesPrint -->
|
||||
@@ -84,6 +86,7 @@ export default defineComponent({
|
||||
currentPage:1,
|
||||
})
|
||||
const init = ()=>{
|
||||
console.log(123)
|
||||
detailData.designTypeList = props.catecoryList
|
||||
detailData.designType = detailData.designTypeList[0].value
|
||||
getLibraryList()
|
||||
@@ -207,13 +210,15 @@ export default defineComponent({
|
||||
flex-direction: column;
|
||||
> .generalModel_state{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
> .generalModel_state_item{
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
position: relative;
|
||||
> .search_icon_block{
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
// position: absolute;
|
||||
// right: 5px;
|
||||
width: calc(6rem - 4px);
|
||||
height: calc(6rem - 4px);
|
||||
color: #fff;
|
||||
@@ -227,7 +232,7 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
> .generalModel_state_item:last-child{
|
||||
margin-top: 2rem;
|
||||
// margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
> .libraryList_box{
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
<template>
|
||||
<div class="selectList">
|
||||
<div class="switch_type_list">
|
||||
<div class="switch_type_list" v-if="type != 'element'">
|
||||
<div
|
||||
v-if="type != 'element'"
|
||||
@click.stop="openCurrent()"
|
||||
class="switch_type_item"
|
||||
:class="[selectTitle == 'current' ? 'select_swtich' : '',]"
|
||||
@@ -28,7 +27,7 @@
|
||||
<div class="content_item" v-show="selectTitle == 'current'" v-if="type != 'element'">
|
||||
<currentList ref="currentList" :level1Type="level1Type" :type="type" @selectImgItem="selectImgItem" :catecoryList="catecoryList"></currentList>
|
||||
</div>
|
||||
<div class="content_item" v-show="selectTitle == 'upload'">
|
||||
<div class="content_item" v-show="selectTitle == 'upload'" v-if="type != 'element'">
|
||||
<uploadList @selectImgItem="selectImgItem" :level1Type="level1Type" :catecoryList="catecoryList"></uploadList>
|
||||
</div>
|
||||
<div class="content_item" v-show="selectTitle == 'library'">
|
||||
@@ -39,7 +38,7 @@
|
||||
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent,computed,ref,watch,nextTick,createVNode,toRefs, reactive} from 'vue'
|
||||
import { defineComponent,computed,onMounted,watch,nextTick,createVNode,toRefs, reactive} from 'vue'
|
||||
// import setDesignItem from '@/component/Detail/setDesignItem2.vue'
|
||||
import { useStore } from "vuex";
|
||||
import { useI18n } from 'vue-i18n'
|
||||
@@ -78,7 +77,7 @@ export default defineComponent({
|
||||
setup(props,{emit}) {
|
||||
const store = useStore();
|
||||
const detailData = reactive({
|
||||
selectTitle: props.type == 'element'?'upload':'current',
|
||||
selectTitle: props.type == 'element'?'library':'current',
|
||||
printList:[]
|
||||
})
|
||||
const getDetailListDom = reactive({
|
||||
@@ -97,7 +96,11 @@ export default defineComponent({
|
||||
const selectImgItem = (data:any)=>{
|
||||
emit('selectImgItem',data)
|
||||
}
|
||||
|
||||
onMounted(()=>{
|
||||
if(props.type == 'element'){
|
||||
openLibrary()
|
||||
}
|
||||
})
|
||||
return{
|
||||
...toRefs(detailData),
|
||||
...toRefs(getDetailListDom),
|
||||
|
||||
Reference in New Issue
Block a user