aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix

Browse Source
This commit is contained in:
X1627315083
2025-04-09 14:09:19 +08:00
parent b6e5f05f06
commit 37f1b36e54
76 changed files with 1969 additions and 970 deletions
Download Patch File Download Diff File Expand all files Collapse all files

144
src/component/LibraryPage/brandDetail.vue
View File

@@ -1,13 +1,7 @@
<template>
<div class="brandDetail">
<div class="title">
<div @click="back" class="back">&lt; Back</div>
<div>
<div class="gallery_btn" @click="compute">Compute</div>
<div>
<a-progress :percent="100" size="small" :showInfo="false" />
</div>
</div>
<div @click="back" class="back"><i class="fi fi-rr-arrow-small-left" style="font-size: 4rem; display:flex;"></i></div>
</div>
<div class="userDetail">
<div class="logo">
@@ -34,19 +28,25 @@
</div>
<div class="info">
<div class="name">
<span v-if="!isEditUserName">{{ brandName }}</span>
<span v-if="!isEditUserName" style="font-size:3rem;">{{ brandName }}</span>
<input v-else type="text" v-model="brandName">
<i v-if="!isEditUserName" class="fi fi-rr-edit" @click="openEdit('userName')"></i>
<i v-else class="fi fi-br-check" @click="editChek('userName')"></i>
</div>
<div class="slogan">
<div>Brand slonan:</div>
<span v-if="!isEditDescribe">{{ brandSlogan }}</span>
<div>Slogan:</div>
<span v-if="!isEditDescribe" style="font-weight: 300;">{{ brandSlogan }}</span>
<input v-else type="text" v-model="brandSlogan">
<i v-if="!isEditDescribe" class="fi fi-rr-edit" @click="openEdit('brandSlogan')"></i>
<i v-else class="fi fi-br-check" @click="editChek('brandSlogan')"></i>
</div>
</div>
<div style="flex:1;text-align: right;" v-show="imgList.length > 0">
<div class="gallery_btn" v-show="schedule.num == 1||(schedule.num == 0 && !schedule.state)" @click="compute">Compute</div>
<div v-show="schedule.num != 1">
<a-progress style="width:20rem;" :percent="schedule.num * 100" size="small" :showInfo="false" />
</div>
</div>
</div>
<div class="content">
<div style="display: flex;">
@@ -61,10 +61,12 @@
>
<div class="gallery_btn">Upload</div>
</a-upload>
<div style="margin-left:2rem;" @click="deleteBatchPic" class="gallery_btn">Delete</div>
</div>
<div class="imgBox">
<div class="imgItem" v-for="item,index in imgList" :key="item.id">
<div class="imgItem" v-for="item,index in imgList" :key="item.id" :class="{active:selectImgList.indexOf(item.id) > -1}" @click="selectImg(item)">
<img :src="item.url" alt="">
<i class="fi fi-rr-trash icon_delete" @click="deleteSinglePic(item,index)"></i>
</div>
</div>
<div class="total">
@@ -86,7 +88,7 @@
</div>
</template>
<script lang="ts">
import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, reactive} from 'vue'
import { defineComponent,computed,ref,provide,onBeforeUnmount,createVNode,toRefs, reactive} from 'vue'
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { Https } from "@/tool/https";
import { Modal,message } from 'ant-design-vue';
@@ -104,9 +106,11 @@ export default defineComponent({
emits:['update:isShowMark','handleBack'],
props: {
isShowMark:{type:Boolean,default:false},
selectCode:{type:String,default:''},
},
setup(props,{emit}) {
const store = useStore();
const {t} = useI18n();
const data = reactive({
cropperFileData:{name:'',uid:''}, //裁剪的原始文件数据
uploadUrl:'',
@@ -126,6 +130,12 @@ export default defineComponent({
total:0,
pageSize:10,
currentPage:1,
selectImgList:[] as any,//选择删除的图片
getProgressTime:null as any,//获取进度的时间
schedule:{
num:0,
state:false
}
})
const dataDom = reactive({
Cropper:null as any,
@@ -233,6 +243,8 @@ export default defineComponent({
data.brandSlogan = value.brandSlogan;
data.logoUrl = value.minioUrl
data.minioUrl = value.brandLogo
clearInterval(data.getProgressTime)
getProgress()
getLibraryList()
// emit("update:isShowMark",true)
// setTimeout(()=>{
@@ -240,6 +252,7 @@ export default defineComponent({
// },2000)
}
const back = ()=>{
clearInterval(data.getProgressTime)
emit("handleBack")
}
const uploadBrand = ()=>{
@@ -255,12 +268,90 @@ export default defineComponent({
})
}
const compute = ()=>{
Https.axiosPost(Https.httpUrls.productImageInitialize,{brandId:data.detail.id}).then((res:any)=>{
getProgress()
}).catch((err:any)=>{
// console.log(err)
})
}
const getProgress = ()=>{
setTimeout
if(props.selectCode != 'MyBrand'){
clearTimeout(data.getProgressTime)
return
}
Https.axiosPost(Https.httpUrls.getInitializeProgress,{brandId:data.detail.id}).then((res:any)=>{
data.schedule.num = res.percent
data.schedule.state = res.analyzed
if(res.percent == 1 || !res.analyzed){return clearTimeout(data.getProgressTime)}
data.getProgressTime = setTimeout(()=>{
getProgress()
},5000)
// analyzed
}).catch((err:any)=>{
// console.log(err)
})
}
const changePage = (current:number, pageSize:number)=>{
data.currentPage = current
data.pageSize = pageSize
}
const deleteBatchPic = ()=>{
if(!data.selectImgList.length){
return
}
Modal.confirm({
title: t('LibraryPage.jsContent2'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',
centered:true,
onOk() {
confirmDeletePic('',0,'')
}
});
}
const deleteSinglePic = (data:any,index:any)=>{
Modal.confirm({
title: t('LibraryPage.jsContent1'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',
mask:false,
centered:true,
onOk() {
confirmDeletePic(data,index,'')
}
});
}
const confirmDeletePic = (value:any,index:any,nData:any)=>{
let libraryIds = value ? [value.id] : data.selectImgList
let newData = {
libraryIds:libraryIds,
deleteModelConfirm:'',
timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
}
if(nData)newData = nData
Https.axiosPost(Https.httpUrls.batchDeleteLibrary, newData).then(
(rv: any) => {
getLibraryList()
data.selectImgList = []
}
).catch((res)=>{
});
}
const selectImg = (item:any)=>{
if(data.selectImgList.indexOf(item.id) > -1){
data.selectImgList = data.selectImgList.filter((selectItem:any)=>selectItem != item.id)
}else{
data.selectImgList.push(item.id)
}
}
onBeforeUnmount(()=>{
clearInterval(data.getProgressTime)
})
return{
...toRefs(dataDom),
...toRefs(data),
@@ -274,6 +365,9 @@ export default defineComponent({
editChek,
compute,
changePage,
deleteBatchPic,
deleteSinglePic,
selectImg,
}
},
provide() {
@@ -299,12 +393,16 @@ export default defineComponent({
font-weight: 400;
font-size: 2rem;
cursor: pointer;
margin-left: -2rem;
}
}
> .userDetail{
display: flex;
margin-top: 4rem;
margin-top: 2rem;
align-items: center;
border-bottom: 1px solid #ccc;
padding-bottom: 1rem;
margin-bottom: 1rem;
> .logo{
position: relative;
margin-right: 3rem;
@@ -386,12 +484,32 @@ export default defineComponent({
> .imgItem{
width: 100px;
margin: 1rem;
position: relative;
cursor: pointer;
aspect-ratio: 1 / 2.5;
&.active{
opacity: 0.5;
}
> img{
width: 100%;
height: 100%;
object-fit: contain;
}
> i{
position: absolute;
top: 1rem;
right: 1rem;
cursor: pointer;
display: none;
cursor: pointer;
padding: 0.5rem;
font-size: 2rem;
}
&:hover{
> i{
display: flex;
}
}
}
}
> .total{

29
src/component/LibraryPage/createBrand.vue
View File

@@ -32,7 +32,7 @@
<input type="text" v-model="brandName">
</div>
<div class="item">
<div class="text">Brand Slogen <span style="color: red;">*</span></div>
<div class="text">Brand Slogan <span style="color: red;">*</span></div>
<input type="text" v-model="brandSlogan">
</div>
<div class="item">
@@ -73,12 +73,12 @@
<div class="right">
<div class="item">
<div class="text">Brand Name </div>
<textarea v-model="generateText" :placeholder="'Please enter the name, logo, and slogan you want to generate'"></textarea>
<textarea v-model="generateText" :placeholder="'Please enter your thoughts about this brand, and we will help you generate the name, logo, and slogan.'"></textarea>
</div>
<div class="btn">
<div class="gallery_btn" style="width: 13rem;" v-show="!isGenerateLoad" @click="generate">Generate</div>
<div class="gallery_btn" style="width: 13rem;" v-show="isGenerateLoad">
<i class="fi fi-br-loading"></i>
<span class="fi fi-br-loading"></span>
</div>
</div>
</div>
@@ -352,6 +352,29 @@ export default defineComponent({
width: 100%;
> .gallery_btn{
margin-left: auto;
width: 13rem;
height: 6rem;
display: flex;
justify-content: center;
align-items: center;
> span{
display: flex;
text-align: center;
line-height: 6rem;
animation: whirl 1s infinite linear;
@keyframes whirl {
0%{
transform: rotate(0deg);
}
50%{
transform: rotate(180deg);
}
100%{
transform: rotate(360deg);
}
}
}
}
}