From 12ca8f0eb0f93ab69d45da216c8cc2ea96716706 Mon Sep 17 00:00:00 2001
From: zhangyh <zhangyahui@haier.com>
Date: Tue, 23 Sep 2025 13:41:07 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20design=E7=95=8C=E9=9D=A2printboard?=
 =?UTF-8?q?=E9=80=89=E6=8B=A9generate=E6=97=B6=E5=8F=AF=E4=BB=8ELibrary?=
 =?UTF-8?q?=E9=80=89=E6=8B=A9=E5=9B=BE=E7=89=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/component/HomePage/Generate.vue   | 100 ++++++++++++++++++++------
 src/component/common/SelectImages.vue |  33 +++++++--
 2 files changed, 108 insertions(+), 25 deletions(-)

diff --git a/src/component/HomePage/Generate.vue b/src/component/HomePage/Generate.vue
index a416623c..9f6a3127 100644
--- a/src/component/HomePage/Generate.vue
+++ b/src/component/HomePage/Generate.vue
@@ -39,6 +39,41 @@
 							</div>
 						</div>
 					</div>
+					<a-dropdown>
+						<i class="fi fi-br-upload" :class="{ Guide_1_2_6:type_.type2 == 'Printboard'}"></i>
+						<template #overlay>
+							<a-menu>
+								<a-menu-item>
+										<a-upload
+											class="search_upImg"
+											:capture="null"
+											:action="uploadUrl + '/api/element/upload'"
+											list-type="picture-card"
+											:data="{
+												...upload,
+											}"
+											:maxCount='1'
+											:headers="{ Authorization: token }"
+											v-model:file-list="sketchboardList"
+											:before-upload="beforeUpload"
+											accept=".jpg,.png,.jpeg,.bmp"
+											@change="(file) => fileUploadChange(file)"
+										>
+										<div class="drop-container">
+										<i class="fi fi-br-upload" :class="{ Guide_1_2_6:type_.type2 == 'Printboard'}" :title="$t('Generate.uploadTitle')" v-show="!isTextarea && upload.level1Type !== 'Moodboard' && scene?.value != 'Slogan' && scene?.value != 'Logo'"></i>
+											<div>{{ $t('PrintboardUpload.Upload') }}</div>
+										</div>
+										</a-upload>
+								</a-menu-item>
+								<a-menu-item>
+									<div class="drop-container" @click.stop="handleOpenLibrarySelect">
+										<i class="fi fi-rr-followcollection"></i>
+										<div>{{ $t('PrintboardUpload.Library') }}</div>
+									</div>
+								</a-menu-item>
+							</a-menu>
+						</template>
+					</a-dropdown>
 					<textarea 
 						class="textarea"  
 						@input="ifMaximumLength" 
@@ -50,25 +85,7 @@
 						@paste="onPaste"
 
 					></textarea>
-					<i class="fi fi-rr-followcollection"></i>
-					<i class="fi fi-br-upload" :class="{ Guide_1_2_6:type_.type2 == 'Printboard'}" :title="$t('Generate.uploadTitle')" v-show="!isTextarea && upload.level1Type !== 'Moodboard' && scene?.value != 'Slogan' && scene?.value != 'Logo'">
-						<a-upload
-							class="search_upImg"
-							:capture="null"
-							:action="uploadUrl + '/api/element/upload'"
-							list-type="picture-card"
-							:data="{
-								...upload,
-							}"
-							:maxCount='1'
-							:headers="{ Authorization: token }"
-							v-model:file-list="sketchboardList"
-							:before-upload="beforeUpload"
-							accept=".jpg,.png,.jpeg,.bmp"
-							@change="(file) => fileUploadChange(file)"
-						>
-						</a-upload>
-					</i>
+					
 					<i v-show="scene?.value == 'Slogan'" :title="$t('Generate.sloganTitle')" @click.stop="setSlogan" class="fi fi-rr-poll-h"></i>
 					<!-- <i v-show="!isTextarea" class="fi fi-br-expand" @click.stop="setTextareaShow"></i>
 					<i v-show="isTextarea" class="fi fi-bs-compress" @click.stop="setTextareaShow"></i> -->
@@ -204,6 +221,13 @@
         </div>
 		<scaleImage ref="scaleImage" :imgType="type_.type2" :sex="workspace.sex"></scaleImage>
 		<createSlogan ref="createSlogan" @setSloganData="setSloganData"></createSlogan>
+			<SelectImages
+				radio
+				full-data
+				ref="selectImages"
+				@select="handleImageSelect"
+				:api="Https.httpUrls.queryLibraryPage"
+				isLibrary/>
     </div>
 </template>
 <script lang="ts">
@@ -223,6 +247,7 @@ import { openGuide,driverObj__,driverIndex__ } from "@/tool/guide";
 import createSlogan from "@/component/HomePage/createSlogan.vue";
 import { useI18n } from "vue-i18n";
 import sketchCategory from "@/component/HomePage/sketchCategory.vue";
+import SelectImages from '@/component/common/SelectImages.vue'
 
 export default defineComponent({
 	components: {
@@ -230,6 +255,7 @@ export default defineComponent({
 		generalMenu,
 		createSlogan,
 		sketchCategory,
+		SelectImages
 	},
     props: ["msg",'sketchCatecoryList','scene','gender'],
 	emits:['setLibrary'],
@@ -393,6 +419,7 @@ export default defineComponent({
 			openSpeed,
 			setSpeed,
 			upload,
+			Https
         };
     },
     data(prop) {
@@ -898,6 +925,7 @@ export default defineComponent({
 					let paste = this.sketchboardList.filter((v: any) => v.id === file.id);
 					if(paste.length == 0)this.sketchboardList.push(file);
 					this.sketchboardList = this.sketchboardList.filter((v: any) => v.status === "done");
+					console.log('插入图片',this.sketchboardList)
 					nextTick().then(()=>{
 						if(this.driver__.driver && this.type_.type2 == 'Printboard'){
 							driverObj__.moveNext()
@@ -1038,6 +1066,22 @@ export default defineComponent({
 				})
 			}
 			
+		},
+		handleOpenLibrarySelect(){
+			let selectImages:any = this.$refs.selectImages
+			selectImages.init()
+		},
+		handleImageSelect(data:any){
+			const	file={
+				status: 'done',
+				...data,
+				errCode:0,
+				imgUrl:data.url,
+				xhr:{
+					response:JSON.stringify({...data,errCode:0,imgUrl:data.url,status:'done'})
+				}
+			}
+			this.sketchboardList = [file]
 		}
     },
 });
@@ -1180,6 +1224,22 @@ export default defineComponent({
             }
         }
     }
-}
 
+	}
+
+	.search_upImg	:deep(.ant-upload.ant-upload-select-picture-card){
+		background-color: transparent;
+		border: none;
+		width: inherit;
+		height: inherit;
+		margin: 0;
+	}
+
+	.drop-container{
+		display: flex;
+		align-items: center;
+		column-gap: 1rem;
+		padding: 0.25rem 0.3rem 0.25rem;
+		
+	}
 </style>
diff --git a/src/component/common/SelectImages.vue b/src/component/common/SelectImages.vue
index 50db5d45..99f2e50d 100644
--- a/src/component/common/SelectImages.vue
+++ b/src/component/common/SelectImages.vue
@@ -102,6 +102,14 @@ const props = defineProps({
   isLibrary: {
     type: Boolean,
     default: false
+  },
+  radio: {
+    type: Boolean,
+    default: false
+  },
+  fullData: {
+    type: Boolean,
+    default: false
   }
 })
 
@@ -236,11 +244,18 @@ watch(
 
 // 处理图片点击
 const handleImageClick = item => {
-  // 已选中，取消选中
-  if (selectList.value.includes(item.url)) {
-    selectList.value = selectList.value.filter(url => url !== item.url)
+  const isSelected = selectList.value.includes(item.url)
+
+  if (props.radio) {
+    // 单选模式：选中当前图片或取消选中
+    selectList.value = isSelected ? [] : [item.url]
   } else {
-    selectList.value.push(item.url)
+    // 多选模式：切换选中状态
+    if (isSelected) {
+      selectList.value = selectList.value.filter(url => url !== item.url)
+    } else {
+      selectList.value.push(item.url)
+    }
   }
 }
 
@@ -262,7 +277,15 @@ const handleImageError = event => {
 }
 
 const confirm = () => {
-  emits('select', selectList.value)
+  // console.log('selectList.value',selectList.value,'list.value',list.value)
+  let emitData = null
+  if (props.fullData) {
+    const selected = list.value.filter(item => selectList.value.includes(item.url))
+    emitData = props.radio ? selected[0] : selected
+  } else {
+    emitData = selectList.value
+  }
+  emits('select', emitData)
   showPanel.value = false
 }