2023-10-20

src/component/HomePage/Generate.vue

@@ -39,14 +39,18 @@
 				</ul>
 			</div>
         </div>
-        <div v-else class="input_box">
+        <div v-else class="input_box" :class="{active:inputShow}">
             <input
                 class="search_input"
+				@input="ifMaximumLength"
                 placeholder="Promopt input"
+				:maxlength='inputShow?0:9999'
                 v-model="searchPictureName"
                 @keydown.enter="getgenerate()"
             />
             <div class="generage_btn started_btn" @click.stop="getgenerate">Generate</div>
+			<span>The entered content exceeds the maximum length.</span>
+
         </div>
         <div v-if="type_.type2 == 'Sketchboard' || type_.type2 == 'Printboard'" class="generage_img">
             <div class="upload_item">
@@ -179,7 +183,7 @@ import { getCookie } from "@/tool/cookie";
 import { getUploadUrl } from "@/tool/util";
 import { forEach } from "jszip";
 export default defineComponent({
-    props: ["msg"],
+    props: ["msg",'sketchCatecoryList'],
     setup() {
         // console.log(prop.msg);
         let checkbox = ref([
@@ -219,10 +223,12 @@ export default defineComponent({
 			num:1,
 			optype:false,
 		})
-		let sketchCatecoryList:any = ref([])
+		// let sketchCatecoryList:any = ref([])
 		let workspace:any = ref({})
 
 		let loadingShow = ref(false)
+		let inputShow = ref(false)
+		let inputTime = ref()
         return {
             imgList,
             selectImgList,
@@ -244,8 +250,10 @@ export default defineComponent({
 			checkboxImage,
 			printModel,
 			loadingShow,
-			sketchCatecoryList,
-			workspace
+			// sketchCatecoryList,
+			workspace,
+			inputShow,
+			inputTime,
         };
     },
     data(prop) {
@@ -281,6 +289,7 @@ export default defineComponent({
         // this.store.commit("addGenerateFils", this.fileList);
         this.token = getCookie("token") || "";
         this.uploadUrl = getUploadUrl();
+		this.workspace = this.store.state.Workspace.workspace
     },
     computed: {
         getSketchLabel(value: any) {
@@ -347,6 +356,20 @@ export default defineComponent({
 					);
 				return
 			}
+			if(this.searchPictureName){
+				let arr = this.searchPictureName.split(/\s+/).length
+				if(arr > 75){
+					message.warning(
+						"The entered content exceeds the maximum length."
+					);
+					return
+				}
+			}else{
+				message.warning(
+					"Please enter content"
+				);
+				return
+			}
 			let data = {
 				generateType:'text',
 				designType:'',
@@ -356,6 +379,7 @@ export default defineComponent({
 				text:this.searchPictureName,
 				timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
 				version:this.printModel.num,//为1就是Print
+				gender:'',
 			}
 			this.loadingShow = true
 			Https.axiosPost(Https.httpUrls.sketchAndPrintGenerate, data).then(
@@ -378,6 +402,21 @@ export default defineComponent({
 				this.loadingShow = false
             });
 		},
+		ifMaximumLength(e){
+			clearTimeout(this.inputTime)
+			let inputBox = document.getElementsByClassName('generate')[0].getElementsByClassName('input_box')[0]
+			let input = inputBox.getElementsByClassName('search_input')[0]
+			this.inputTime = setTimeout(()=>{
+				// let num1 = ((input as HTMLInputElement).value.match(/ /g) || []).length
+				// let num2 = (input as HTMLInputElement).value.split(' ').length
+				if(this.searchPictureName.split(/\s+/).length > 75){
+					this.inputShow = true
+				}else{
+					this.inputShow = false
+				}
+			},500)
+		},
+		
         fileUploadChange(data: any) {
             let file = data.file;
             if (file.status === "done") {
@@ -387,7 +426,7 @@ export default defineComponent({
                 file.resData = res.data;
                 file.type_ = "upload";
                 file.id_ = GO.id++;
-                file.category = this.sketchCatecoryList[0].value;
+                file.category = this.sketchCatecoryList?.[0]?.value;
                 let fileList = this.sketchboardList.filter(
                     (v: any) => v.status === "done"
                 );
@@ -509,7 +548,7 @@ export default defineComponent({
 .generate {
 	flex: 1;
     // height: 30rem;
-    overflow-x: hidden;
+    // overflow-x: hidden;
     border-right: 1px solid #e5e5e5;
     &.generate::-webkit-scrollbar {
         display: none;
@@ -622,20 +661,20 @@ export default defineComponent({
         }
         .upload_item {
             .upload_file_item {
-				&.active {
-					opacity: 0.5;
-					// border: 2px solid;
-					border-radius: 1rem;
-					transform: scale(0.9);
-					.delete_file_block{
-						pointer-events:none;
-					}
-					.operate_file_block{
-						pointer-events:none;
-					}
-					img {
-					}
-				}
+				// &.active {
+				// 	opacity: 0.5;
+				// 	// border: 2px solid;
+				// 	border-radius: 1rem;
+				// 	transform: scale(0.9);
+				// 	.delete_file_block{
+				// 		pointer-events:none;
+				// 	}
+				// 	.operate_file_block{
+				// 		pointer-events:none;
+				// 	}
+				// 	img {
+				// 	}
+				// }
 				&.forbidden{
 					cursor:not-allowed;
 					img{