update:增加loading

src/App.vue

@@ -20,6 +20,8 @@ import { defineComponent, ref } from 'vue';
 import aiHeader from './components/ai-header.vue';
 import aiSider from './components/ai-sider.vue';
 import request from '@/api/sd';
+import defaultImage from '@/assets/label/default.png';
+
 export default defineComponent({
   name: 'App',
   components: {
@@ -27,10 +29,11 @@ export default defineComponent({
     aiSider
   },
   setup () {
-    const image = ref('')
+    const image = ref(defaultImage)
     const getSdData = (item)=> {
-
-        request.gpt(item.prompt).then(res => {
+        console.log('request gpt data ...')
+        return request.gpt(item.prompt).then(res => {
+          console.log('request sd data...')
           return request.draw({}, item.prompt, item.negative_prompt).then(res => {
             if (res) image.value = res;
             return res;
@@ -39,8 +42,16 @@ export default defineComponent({
           alert(err);
           // console.error('gpt err:',err)
         })
-
     }
+    // const getSdData = (item)=> {
+    //   console.log('request sd data ...')
+    //   return request.draw({}, item.prompt, item.negative_prompt).then(res => {
+    //     if (res) image.value = res;
+    //     return res;
+    //   })
+    // }
+
+
     return {
       getSdData,
       image

src/api/sd.js

@@ -46,7 +46,6 @@ export default {
                 'content-type': 'application/json'
             };
             axios.post(apiUrl, data, { headers }).then(response => {
-                console.log('gpt:',response.data)
                 if(response.data.indexOf("免费对话次数已用完，请升级账号后继续使用")>-1){
                     rejcet("免费对话次数已用完，请升级账号后继续使用")
                 }else if(response.data.indexOf("敏感")>-1){

src/components/ai-sider.vue

@@ -39,7 +39,7 @@
     import { defineComponent, onMounted, reactive } from 'vue';
     import image0 from '@/assets/label/00.png';
     import image1 from '@/assets/label/01.png';
-    import image2 from '@/assets/label/02.jpeg';
+    import image2 from '@/assets/label/02.png';
     import image3 from '@/assets/label/03.png';
     import image4 from '@/assets/label/04.png';
     import image5 from '@/assets/label/05.png';
@@ -67,25 +67,13 @@
                         'image': image0
                     },
                     {
-                      'lebel':'星空',
-                      'prompt':'Surrealism in digital art, a collaboration between Beeple and Jeremias Ketner, featuring an exquisitely detailed digital illustration that captures the essence of both artists\' unique styles.',
-                      'negative_prompt':'EasyNegative',
-                      'image': image1
-                    },
-                    {
-                        'label':'雀斑女孩',
-                        'prompt':'beautiful lady, (freckles), big smile, ruby eyes, pigtails hair, dark makeup, hyperdetailed photography, soft light, head and shoulders portrait, cover',
-                        'negative_prompt':'(worst quality, low quality, normal quality, lowres, low details, oversaturated, undersaturated, overexposed, underexposed, grayscale, bw, bad photo, bad photography, bad art:1.4), (watermark, signature, text font, username, error, logo, words, letters, digits, autograph, trademark, name:1.2), (blur, blurry, grainy), morbid, ugly, asymmetrical, mutated malformed, mutilated, poorly lit, bad shadow, draft, cropped, out of frame, cut off, censored, jpeg artifacts, out of focus, glitch, duplicate, (airbrushed, cartoon, anime, semi-realistic, cgi, render, blender, digital art, manga, amateur:1.3), (3D ,3D Game, 3D Game Scene, 3D Character:1.1), (bad hands, bad anatomy, bad body, bad face, bad teeth, bad arms, bad legs, deformities:1.3)',
-                        'image': image2
-                    },
-                    {
-                        'label':'金属',
+                        'label':'机甲战士',
                         'prompt':'Metal armor, metallic texture, solo, 1boy, science fiction, male focus, power armor, humanoid robot, robot, blurry, blurry background, city, helmet',
                         'negative_prompt':'FastNegativeV2,(bad-artist:1),(worst quality, low quality:1.4),(bad_prompt_version2:0.8),bad-hands-5,lowres,bad anatomy,bad hands,((text)),(watermark),error,missing fingers,extra digit,fewer digits,cropped,worst quality,low quality,normal quality,((username)),blurry,(extra limbs),bad-artist-anime,badhandv4,EasyNegative,ng_deepnegative_v1_75t,verybadimagenegative_v1.3,BadDream,(three hands:1.6),(three legs:1.2),(more than two hands:1.4),(more than two legs,:1.2),1abel,',
                         'image': image3
                     },
                     {
-                        'label':'古装女侠',
+                        'label':'汉服',
                         'prompt':'1woman,handsome,high quality,long hair,dark hair,chinese clothes,photorealistic,realistic,photography,masterpiece,best quality,ultra-detailed,1man,looking at viewer,solo,handsome face,pony tail,hanfu,gufeng,black and white hanfu,bamboo,bamboo leaf on clothes,bamboo pattern hanfu,hanfu,(bamboo:1.2)',
                         'negative_prompt':'(worst quality, low quality:1.4),(depth of field, blurry:1.2),(greyscale, monochrome:1.1),3D face,cropped,lowres,text,(nsfw:1.3),(worst quality:2),(low quality:2),(normal quality:2),normal quality,((grayscale)),skin spots,acnes,skin blemishes,age spot,(ugly:1.331),(duplicate:1.331),(morbid:1.21),(mutilated:1.21),(tranny:1.331),mutated hands,(poorly drawn hands:1.5),blurry,(bad anatomy:1.21),(bad proportions:1.331),extra limbs,(disfigured:1.331),(missing arms:1.331),(extra legs:1.331),(fused fingers:1.61051),(too many fingers:1.61051),(unclear eyes:1.331),lowers,bad hands,missing fingers,extra digit,bad hands,missing fingers,(((extra arms and legs))),bad-artist,bad-artist-anime,bad-hands-5,bad-image-v2-39000,bad-picture-chill-75v,bad_prompt,bad_prompt_version2,badhandv4,ng_deepnegative_v1_75t,EasyNegative,2girls,3girls,lowres,bad anatomy,bad hands,text,error,missing fingers,extra digit,fewer digits,cropped,worst quality,low quality,normal quality,signature,watermark,username,blurry,badfeet,ugly,pregnant,duplicate,hermaphrodite,scar,green clothes,bad eyes,bad pupils,green hair,(duplicates),skin spots,acnes,skin blemishes,age spot,bad anatomy,(ugly:1.331),(duplicate:1.331),(morbid:1.21),(mutilated:1.21),mutated hands,(poorly drawn hands:1.331),blurry,(bad anatomy:1.21),(bad proportions:1.331),extra limbs,(disfigured:1.331),(missing arms:1.331),(extra legs:1.331),(fused fingers:1.61051),(too many fingers:1.61051),(unclear eyes:1.331),bad hands,missing fingers,extra digit,bad body,pubic hair,glans,refraction,diffusion,bad body,bad proportions,gross proportions,text,missing fingers,missing arms,missing legs,(((simple background))),fused fingers,too many fingers,missing arms,missing legs,extra arms,extra legs',
                         'image': image4
@@ -95,7 +83,19 @@
                         'prompt':'beautiful girl, chinese clothes',
                         'negative_prompt':'(worst quality, low quality, normal quality, lowres, low details, oversaturated, undersaturated, overexposed, underexposed, grayscale, bw, bad photo, bad photography, bad art:1.4), (watermark, signature, text font, username, error, logo, words, letters, digits, autograph, trademark, name:1.2), (blur, blurry, grainy), morbid, ugly, asymmetrical, mutated malformed, mutilated, poorly lit, bad shadow, draft, cropped, out of frame, cut off, censored, jpeg artifacts, out of focus, glitch, duplicate, (airbrushed, cartoon, anime, semi-realistic, cgi, render, blender, digital art, manga, amateur:1.3), (3D ,3D Game, 3D Game Scene, 3D Character:1.1), (bad hands, bad anatomy, bad body, bad face, bad teeth, bad arms, bad legs, deformities:1.3)',
                         'image': image5
-                    }
+                    },
+                    {
+                      'label':'雀斑女孩',
+                      'prompt':'beautiful lady, (freckles), big smile, ruby eyes, pigtails hair, dark makeup, hyperdetailed photography, soft light, head and shoulders portrait, cover',
+                      'negative_prompt':'(worst quality, low quality, normal quality, lowres, low details, oversaturated, undersaturated, overexposed, underexposed, grayscale, bw, bad photo, bad photography, bad art:1.4), (watermark, signature, text font, username, error, logo, words, letters, digits, autograph, trademark, name:1.2), (blur, blurry, grainy), morbid, ugly, asymmetrical, mutated malformed, mutilated, poorly lit, bad shadow, draft, cropped, out of frame, cut off, censored, jpeg artifacts, out of focus, glitch, duplicate, (airbrushed, cartoon, anime, semi-realistic, cgi, render, blender, digital art, manga, amateur:1.3), (3D ,3D Game, 3D Game Scene, 3D Character:1.1), (bad hands, bad anatomy, bad body, bad face, bad teeth, bad arms, bad legs, deformities:1.3)',
+                      'image': image2
+                    },
+                    {
+                      'label':'星空',
+                      'prompt':'Surrealism in digital art, a collaboration between Beeple and Jeremias Ketner, featuring an exquisitely detailed digital illustration that captures the essence of both artists\' unique styles.',
+                      'negative_prompt':'EasyNegative',
+                      'image': image1
+                    },
                 ]
             })
             const handleSelectTag = (item, isInit)=> {