合并画布,部分样式调整

This commit is contained in:
X1627315083
2025-06-26 15:41:08 +08:00
parent fd05c70937
commit fc6d8d4c8d
75 changed files with 1772 additions and 672 deletions

View File

@@ -2,7 +2,7 @@
<div class="newProject">
<div class="contentBox">
<div class="content">
<div class="title">How can I help you today?</div>
<div class="title">{{$t('newProjectg.helpYou')}}</div>
<div class="selectFlow">
<div class="select">
<div class="item" @click="setFlow(item)" :class="{active:item.title == selectFlow.title}" v-for="item in flowList">{{ item.title }}</div>
@@ -13,8 +13,8 @@
</div>
<div class="chatOrSetting">
<div class="select">
<div class="item" @click="setChatOrSetting('chat')" :class="{active:chatOrSetting == 'chat'}">Chat</div>
<div class="item" @click="setChatOrSetting('setting')" :class="{active:chatOrSetting == 'setting'}">Setting</div>
<div class="item" @click="setChatOrSetting('chat')" :class="{active:chatOrSetting == 'chat'}">{{$t('newProjectg.Chat')}}</div>
<div class="item" @click="setChatOrSetting('setting')" :class="{active:chatOrSetting == 'setting'}">{{$t('newProjectg.Setting')}}</div>
</div>
</div>
<div class="chatBox" v-show="chatOrSetting == 'chat'">
@@ -30,7 +30,7 @@
<i class="fi fi-rs-paperclip-vertical">
<input type="file" @change="handleFileUpload($event)">
</i>
<div class="enableThinking" :class="{active:enableThinking}" @click="()=>enableThinking = !enableThinking">Deep Thinking</div>
<div class="enableThinking" :class="{active:enableThinking}" @click="()=>enableThinking = !enableThinking">{{$t('newProjectg.DeepThinking')}}</div>
</div>
<div class="sendBox">
<div class="maxNum">{{ chatContent.length }}/10000</div>
@@ -44,7 +44,7 @@
<workspace @setProject="setProject" :httpWorkflowType="selectFlow.value"></workspace>
</div>
<div class="hint" v-show="chatOrSetting == 'chat'">
<div class="item" v-for="item in hintList" @click="addChatContent(item)">{{ item }}</div>
<div class="item" v-for="item in hintList" :title="item" @click="addChatContent(item)">{{ item }}</div>
</div>
</div>
</div>
@@ -71,36 +71,37 @@ export default defineComponent({
},
emits:['newProject'],
setup(props,{emit}) {
const {t} = useI18n()
const store = useStore();
const data = reactive({
flowList:[
{
title:'Series Design',
title:computed(()=>t('newProjectg.SeriesDesign')),
value:'SERIES_DESIGN',
describe:[
'Series Design focuses on the coordinated design of multi-category clothing, ideal for creating a unified fashion collection. You can use the Moodboard, Printboard, Colorboard, Sketchboard, and Mannequin sections in the Design Assests panel to organize your inspiration and design complementary clothing combinations. Finally, refine your designs in the Draft and Collection panels using tools like To Product Image, Relight, and Transfer Pose, then export to the Canvas to showcase your complete series design.',
computed(()=>t('newProjectg.SeriesDesignInfo')),
]
},
{
title:'Single Design',
title:computed(()=>t('newProjectg.SingleDesign')),
value:'SINGLE_DESIGN',
describe:[
'Single Design centers on the independent design of a single clothing category, such as a T-shirt, dress, or jacket, without considering coordination with other items. Use the Moodboard, Printboard, Colorboard, and Sketchboard in the Design Assests panel to gather inspiration and focus on crafting a unique piece. Once completed, optimize your design in the Draft and Collection panels with tools like To Product Image, Relight, and Transfer Pose, then export to the Canvas to display your individual creation.',
computed(()=>t('newProjectg.SingleDesignInfo')),
]
},
],
selectFlow:{
title:'Series Design',
title:computed(()=>t('newProjectg.SeriesDesign')),
value:'SERIES_DESIGN',
describe:[
'Series Design focuses on the coordinated design of multi-category clothing, ideal for creating a unified fashion collection. You can use the Moodboard, Printboard, Colorboard, Sketchboard, and Mannequin sections in the Design Assests panel to organize your inspiration and design complementary clothing combinations. Finally, refine your designs in the Draft and Collection panels using tools like To Product Image, Relight, and Transfer Pose, then export to the Canvas to showcase your complete series design.',
computed(()=>t('newProjectg.SeriesDesignInfo')),
]
},
chatContent:'',
hintList:[
'设计一套田园风衣服',
'设计一套夏日风衣服',
'设计一套未来风格的衣服',
computed(()=>t('newProjectg.hintList1')),
computed(()=>t('newProjectg.hintList2')),
computed(()=>t('newProjectg.hintList3')),
],
enableThinking:false,//深度思考
uploadFile:null as any,
@@ -125,11 +126,12 @@ export default defineComponent({
e.target.style.height = `${e.target.scrollHeight}px`;
}
const addChatContent = (item:any)=>{
if((data.textarea.value?.length + item.length) > 10000)return
let str = item.value
if((data.textarea.value?.length + str.length) > 10000)return
// data.chatContent += item
// data.textarea.value += item
data.chatContent = item
data.textarea.value = item
data.chatContent = str
data.textarea.value = str
}
const sendChat = ()=>{
if(!data.chatContent)return
@@ -145,6 +147,7 @@ export default defineComponent({
fileList:fileList,
chatContent:data.chatContent,
enableThinking:data.enableThinking,
newMode:'chat',
}
emit('newProject',value)
}
@@ -173,18 +176,18 @@ export default defineComponent({
}
const handleFileUpload = (event:any)=>{
if (event.target.files[0].size > 5 * 1024 * 1024) { // 5MB
message.info('The file size cannot exceed 5MB.');
message.info(t('newProjectg.jsContent1'));
return
}
let type = event.target.files[0].type.startsWith('image/')
if(type){
if(data.filList.filter((item:any)=>item.type == 'image').length >= 5){
message.info('You can only upload five pictures.');
message.info(t('newProjectg.jsContent2'));
return
}
}else{
if(data.filList.filter((item:any)=>item.type == 'file').length >= 1){
message.info('You can only upload one file.');
message.info(t('newProjectg.jsContent3'));
return
}
}
@@ -448,6 +451,9 @@ export default defineComponent({
border-radius: 1.6rem;
cursor: pointer;
padding: 1.2rem;
white-space: nowrap; /* 文本不换行 */
overflow: hidden; /* 溢出部分隐藏 */
text-overflow: ellipsis; /* 显示省略号 */
&:hover{
background: #f5f5f5;
}

View File

@@ -2,51 +2,51 @@
<div class="workspace">
<div class="workspaceBox">
<div class="projectName marginBottom" v-if="show.title">
<div class="text">Project name: <span style="color: red;">*</span></div>
<div class="text">{{$t('Habit.ProjectName')}}: <span style="color: red;">*</span></div>
<div class="input">
<input type="text" v-model="selectObject.name">
</div>
</div>
<div class="gender marginBottom" v-if="show.age">
<div class="text">Role</div>
<div class="text">{{$t('Habit.Role')}}</div>
<div class="radio">
<label>
<input type="radio" name="ageGroup" v-model="selectObject.ageGroup" value="Adult">
<span>Adult</span>
<span>{{$t('Habit.Adult')}}</span>
</label>
<label>
<input type="radio" name="ageGroup" v-model="selectObject.ageGroup" value="Child">
<span>Child</span>
<span>{{$t('Habit.Child')}}</span>
</label>
</div>
</div>
<div class="gender marginBottom">
<div class="text">Gender</div>
<div class="text">{{$t('Habit.Gender')}}</div>
<div class="radio">
<label>
<input type="radio" name="gender" v-model="selectObject.sex" value="Female">
<span>Female</span>
<span>{{$t('Habit.Female')}}</span>
</label>
<label>
<input type="radio" name="gender" v-model="selectObject.sex" value="Male">
<span>Male</span>
<span>{{$t('Habit.Male')}}</span>
</label>
</div>
</div>
<div class="style marginBottom" v-if="show.style">
<div class="text">Style</div>
<div class="text">{{$t('Habit.Style')}}</div>
<div class="text">{{ selectObject?.styleName?selectObject?.styleName:'All' }}</div>
<div class="gallery_btn" style="line-height: 5rem;" @click="setStyle">{{ $t('Habit.Select') }}</div>
</div>
<div class="style marginBottom brand">
<div class="text">Brand DNA</div>
<div class="text">{{$t('Habit.Brand')}}</div>
<div class="text"><img v-show="selectObject.userBrandDna" :src="selectObject.userBrandDnaImg"></div>
<!-- <div class="text"><img v-show="selectObject.userBrandDna" :src="selectObject.userBrandDnaImg">{{ selectObject.userBrandDnaName }}</div> -->
<div class="gallery_btn" style="line-height: 5rem;" @click="setBrandDNA">{{ $t('Habit.Select') }}</div>
</div>
<div class="brandDNAStrenght marginBottom" v-if="selectObject.userBrandDna">
<div class="text">
Brand DNA Strength
{{$t('Habit.BrandStrength')}}
</div>
<a-slider class="system_silder"
v-model:value="selectObject.brandPercentage"
@@ -73,12 +73,12 @@
</div>
<div class="position marginBottom" style="display: flex; align-items: center;justify-content: space-between;" v-show="show.position" v-if="httpWorkflowType == 'SINGLE_DESIGN'">
<div class="text">
Category:
{{$t('Habit.Category')}}:
</div>
<generalMenu style="width:80%" :selectWidth="'100%'" :dataList="selectObject.positionList" @setprintModel="setprintModel" :item="selectObject.position"></generalMenu>
</div>
<div class="complete">
<div class="gallery_btn" @click="complete">Complete</div>
<div class="gallery_btn" @click="complete">{{$t('Habit.Complete')}}</div>
</div>
</div>
<habitSetStyle ref="habitSetStyle" @setWorkspaceStyle="setWorkspaceStyle" :mannequinStyle="mannequinStyle"></habitSetStyle>