chenrong 9 mesi fa
parent
commit
b6142bd6f5

+ 34 - 16
src/layout/index.vue

@@ -4,7 +4,7 @@
     <div class="pageContent" :class="$store.state.app.isMobile && 'w-full'">
       <app-main />
     </div>
-    <NavMenu_H5 v-if="$store.state.app.isMobile" />
+    <NavMenu_H5 v-if="$store.state.app.isMobile && hideshow" />
   </div>
 </template>
 
@@ -22,9 +22,25 @@ export default {
     NavMenu,
     NavMenu_H5
   },
+  data() {
+    return {
+      docmHeight: document.documentElement.clientHeight,  //默认屏幕高度
+      showHeight: document.documentElement.clientHeight,   //实时屏幕高度
+      hideshow: true,  //显示或者隐藏footer
+    }
+  },
   mixins: [ResizeMixin],
+  watch: {
+    showHeight: function () {
+      if (this.docmHeight > this.showHeight) {
+        this.hideshow = false
+      } else {
+        this.hideshow = true
+      }
+    }
+  },
   computed: {
-    
+
   },
   methods: {
 
@@ -33,18 +49,20 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-  .app-wrapper {
-    position: relative;
-    height: 100%;
-    width: 100%;
-  }
-  .pageContent {
-    width: calc(100% - 72px);
-    height: 100%;
-    overflow: visible;
-    // overflow-y: auto;
-  }
-  .w-full {
-    width: 100%;
-  }
+.app-wrapper {
+  position: relative;
+  height: 100%;
+  width: 100%;
+}
+
+.pageContent {
+  width: calc(100% - 72px);
+  height: 100%;
+  overflow: visible;
+  // overflow-y: auto;
+}
+
+.w-full {
+  width: 100%;
+}
 </style>

+ 1 - 1
src/views/chat/ChatH5.vue

@@ -51,7 +51,7 @@
                   <div v-show="!item.content" class="loadingMessage">
                     <div v-loading="!item.content" element-loading-background="rgba(0, 0, 0, 0.0)"></div>
                   </div>
-                  <p style="white-space: pre-line;" v-show="item.content">{{ item.content }} </p>
+                  <p style="white-space: pre-line; overflow-wrap: anywhere;" v-show="item.content">{{ item.content }} </p>
                 </div>
               </div>
               <!-- 用户发送的信息 -->

+ 52 - 21
src/views/chat/ChatPC.vue

@@ -80,13 +80,13 @@
                 <div class="mt-1 text-gray-500 text-sm">Xchat No.{{ info.id }}</div>
               </div>
             </div>
-            <div class="flex mt-4">
+            <div class="flex mt-3">
               <div class="hot flex w-auto items-center px-2 py-1 text-sm mr-2 rounded-full">
                 <v-icon name="fire" scale="1" />
                 <span class="ml-1">{{ info.hotCount }}</span>
               </div>
             </div>
-            <div class="flex justify-around mt-4">
+            <div class="flex justify-around mt-3">
               <div class=" rounded-full w-32 text-center py-2 text-sm cursor-pointer" style="border: solid 1px #000">分享
               </div>
               <div class=" rounded-full w-32 text-center py-2 text-sm cursor-pointer" style="border: solid 1px #000"
@@ -94,17 +94,18 @@
             </div>
             <transition name="el-zoom-in-top">
               <div v-show="showDetail">
-                <div class="mt-5 text-base pb-3 border-b border-gray-200">
+                <div class="mt-3 text-base pb-3 border-b border-gray-200">
                   <div>
                     <i class="el-icon-document"></i>
                     简介
                   </div>
                   <div class="flex">
-                    <div ref="prologue" class="mt-3 text-sm max-h-48 prologue" :class="showPrologue && 'prologueOpen'">
-                      <div v-show="showPrologueButton" class="textButton" @click="showPrologue = !showPrologue">{{
-                        showPrologue ? '收起' :
-                        '展开' }}</div>
+                    <div ref="prologue" class="mt-3 text-sm max-h-48 prologue"
+                      :class="showPrologue ? 'prologueOpen' : 'prologueHide'">
+                      <div v-show="showPrologueButton && !showPrologue" class="textButton"
+                        @click="showPrologue = !showPrologue">展开</div>
                       {{ info.prologue }}
+                      <div v-show="showPrologue" class="textButton2" @click="showPrologueHiden">收起</div>
                     </div>
                   </div>
                 </div>
@@ -137,7 +138,7 @@
                 </div>
               </div>
             </transition>
-            <div class="mt-5 text-base pb-3 flex-1 flex flex-col">
+            <div class="mt-2 text-base pb-3 flex-1 flex flex-col">
               <div>
                 <!-- <i class="el-icon-document"></i> -->
                 查看场景
@@ -154,8 +155,8 @@
                     </div>
                   </template>
                 </div>
-                <el-empty v-else description="暂无场景"></el-empty>
-                <div class="flex justify-center mt-10">
+                <el-empty class=" py-2" v-else description="暂无场景"></el-empty>
+                <div class="flex justify-center mt-2">
                   <el-button type="primary" round @click="toCreateScene">创建场景</el-button>
                 </div>
               </div>
@@ -267,7 +268,8 @@
                     <div v-show="!item.content" class="loadingMessage">
                       <div v-loading="!item.content" element-loading-background="rgba(0, 0, 0, 0.0)"></div>
                     </div>
-                    <p style="white-space: pre-line;" v-show="item.content">{{ item.content }}</p>
+                    <p style="white-space: pre-line; overflow-wrap: anywhere;" v-show="item.content">{{ item.content }}
+                    </p>
                     <div class="messageOptions" v-show="returnMessage.length == 1">
                       <div class="option" v-for="(item, index) in messageOptions" :key="index"
                         @click="messageOptionClick(item.chatGuidance)">
@@ -529,6 +531,11 @@ export default {
     }
   },
   methods: {
+    showPrologueHiden() {
+      this.$refs.prologue.scrollTop = 0;
+      this.showPrologue = !this.showPrologue
+
+    },
     async init() {
       // 获取模型列表
       this.getModelList()
@@ -1564,7 +1571,7 @@ export default {
   }
 
   >.chatInfo {
-    overflow: hidden;
+    // overflow: hidden;
 
     .chatInfo_photo {
       >img {}
@@ -1761,10 +1768,7 @@ export default {
 
 .prologue {
   position: relative;
-  display: -webkit-box;
-  -webkit-line-clamp: 3;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
+
   padding-bottom: 4px;
 
   .textButton {
@@ -1778,14 +1782,19 @@ export default {
     font-size: 12px;
     cursor: pointer;
   }
-}
 
-.prologueOpen {
-  -webkit-line-clamp: 20;
+  .textButton2 {
+    display: inline-block;
+    color: #fff;
+    padding: 0 5px;
+    border-radius: 5px;
+    background: var(--bg-color1);
+    font-size: 12px;
+    cursor: pointer;
+    float: right;
+  }
 }
 
-.prologueOpen::before {}
-
 .prologue::before {
   content: '';
   float: right;
@@ -1794,6 +1803,28 @@ export default {
   /*先随便设置一个高度*/
   background: red
 }
+
+.prologueHide {
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+
+.prologueOpen {
+  display: inline;
+  padding-bottom: 20px;
+  overflow: auto;
+
+  .textButton {
+    position: relative;
+    bottom: 0;
+  }
+}
+
+.prologueOpen::before {
+  height: 100% !important;
+}
 </style>
 <style scoped>
 .loadingMessage>>>.el-loading-parent--relative {

+ 1 - 11
src/views/components/NavMenu_H5.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="nav-menu h-full bg-white w-full" v-show="hideshow">
+  <div class="nav-menu h-full bg-white w-full">
     <div class="menus">
       <div class="menu " :class="$route.path == '/home' && 'menuActive'" @click="routeTo('/home')">
         <i class="icon el-icon-discover"></i>
@@ -56,9 +56,6 @@ import 'vue-awesome/icons/crown'
 export default {
   data() {
     return {
-      docmHeight: document.documentElement.clientHeight,  //默认屏幕高度
-      showHeight: document.documentElement.clientHeight,   //实时屏幕高度
-      hideshow: true,  //显示或者隐藏footer
       popoverVisible: false,
       haveToken: false,
       getToken,
@@ -83,13 +80,6 @@ export default {
         this.haveToken = false
       }
     },
-    showHeight: function () {
-      if (this.docmHeight > this.showHeight) {
-        this.hideshow = false
-      } else {
-        this.hideshow = true
-      }
-    }
   },
   methods: {
     toUser() {

+ 12 - 4
src/views/create/createH5.vue

@@ -77,7 +77,7 @@
               </el-form-item>
               <el-form-item label="角色描述" prop="characterIntroduction" label-width="80px">
                 <el-input v-model="form.characterIntroduction" type="textarea" :autosize="{ minRows: 4, maxRows: 4 }"
-                  maxlength="400" show-word-limit
+                  show-word-limit
                   placeholder="通过设置机器人的指令和反馈,机器人在玩家互动时即时回复,增强玩家的互动,有什么较好的指令。我们会对指令的使用情况进行了解,确保指令的正常使用。"></el-input>
               </el-form-item>
               <el-form-item label="场景" prop="scene" label-width="80px" style="margin-bottom: 20px;">
@@ -98,10 +98,10 @@
             <button class="w-full px-4 py-2 rounded-lg mr-2 border" @click.prevent="previous" v-show="pageNum == 2">
               上一步
             </button>
-            <button v-show="pageNum == 2" class="w-full text-white px-4 py-2 rounded-lg bgColor1"
-              @click.prevent="submitForm">
+            <el-button :loading="submitLoading" v-show="pageNum == 2"
+              class="w-full text-white px-4 py-2 rounded-lg bgColor1" @click.prevent="submitForm">
               提交
-            </button>
+            </el-button>
           </div>
         </div>
       </div>
@@ -123,6 +123,7 @@ export default {
   },
   data() {
     return {
+      submitLoading: false,
       pageNum: 1,
       labelData: [],
       personalityList: [],
@@ -242,6 +243,7 @@ export default {
     submitForm() {
       this.$refs.form.validate((valid, object) => {
         if (valid) {
+          this.submitLoading = true
           if (this.form.id) {
             updateCharacterApi(this.form).then(() => {
               this.$message({
@@ -249,7 +251,10 @@ export default {
                 type: 'success'
               });
               this.$refs.form.resetFields()
+              this.submitLoading = false
               this.$router.push('/profile')
+            }).catch(() => {
+              this.submitLoading = false
             })
           } else {
             addCharacterApi(this.form).then(() => {
@@ -258,7 +263,10 @@ export default {
                 type: 'success'
               });
               this.$refs.form.resetFields()
+              this.submitLoading = false
               this.$router.push('/profile')
+            }).catch(() => {
+              this.submitLoading = false
             })
           }
 

+ 12 - 4
src/views/create/createPC.vue

@@ -80,8 +80,7 @@
               </el-form-item>
               <el-form-item label="角色描述" prop="characterIntroduction" label-width="80px" style="margin-bottom: 20px;">
                 <el-input v-model="form.characterIntroduction" type="textarea" :autosize="{ minRows: 4, maxRows: 4 }"
-                  maxlength="400" show-word-limit
-                  placeholder="请在此处提供该角色的背景资讯。 使用'{char}'來指代您的角色。 例如:{char}是一个从小娇生惯养的大小姐。"></el-input>
+                  show-word-limit placeholder="请在此处提供该角色的背景资讯。 使用'{char}'來指代您的角色。 例如:{char}是一个从小娇生惯养的大小姐。"></el-input>
               </el-form-item>
               <el-collapse class="collapse">
                 <el-collapse-item title="更多设置" name="1">
@@ -101,9 +100,10 @@
           </el-form>
 
           <div class="flex justify-center">
-            <button class="bg-blue-600 text-white px-4 py-2 rounded-lg" @click.prevent="submitForm">
+            <el-button :loading="submitLoading" class="bg-blue-600 text-white px-4 py-2 rounded-lg"
+              @click.prevent="submitForm">
               提交
-            </button>
+            </el-button>
           </div>
         </div>
       </div>
@@ -124,6 +124,7 @@ export default {
   },
   data() {
     return {
+      submitLoading: false,
       modelList: [],
       labelData: [],
       personalityList: [],
@@ -239,6 +240,7 @@ export default {
     submitForm() {
       this.$refs.form.validate((valid, object) => {
         if (valid) {
+          this.submitLoading = true
           if (this.form.id) {
             updateCharacterApi(this.form).then(() => {
               this.$message({
@@ -246,7 +248,10 @@ export default {
                 type: 'success'
               });
               this.$refs.form.resetFields()
+              this.submitLoading = false
               this.$router.push('/profile')
+            }).catch(() => {
+              this.submitLoading = false
             })
           } else {
             addCharacterApi(this.form).then(() => {
@@ -255,7 +260,10 @@ export default {
                 type: 'success'
               });
               this.$refs.form.resetFields()
+              this.submitLoading = false
               this.$router.push('/profile')
+            }).catch(() => {
+              this.submitLoading = false
             })
           }
 

+ 161 - 100
src/views/create/createSceneH5.vue

@@ -2,91 +2,107 @@
   <div class=" w-full app-pageContainer relative" style="overflow: hidden; height: calc(var(--vh, 1vh) * 100);">
     <TitleH5 titleName=" 创建场景" />
     <!-- 第一步场景基本信息 -->
-    <div class="overflow-y-auto" style="height: calc(100% - 49px - 60px);">
-      <div v-show="active == 1" class="px-6 pb-4 mx-auto  w-full">
-        <div>
-          <div class="py-4 flex flex-col">
-            <div class="w-20 h-20">
-              <div v-if="!character.id" @click="showPopup1 = true"
-                class="w-20 h-20 bg-gray-100 rounded-full cursor-pointer flex flex-col justify-center items-center text-sm hover:bg-gray-200">
-                <p>选择</p>
-                <p>角色</p>
-              </div>
-              <img v-else class="w-20 h-20 rounded-full cursor-pointer object-cover shadow" @click="showPopup1 = true"
-                :src="baseApi + character.picture" alt="">
+    <div class="overflow-y-auto flex flex-col justify-between" style="height: calc(100% - 49px - 60px);">
+      <el-form :model="form" :rules="rules" ref="form" label-position="top" label-width="60px" class="form">
+        <div v-show="active == 1" class="px-6 pb-4 mx-auto w-full">
+          <div>
+            <div class="py-4 flex flex-col">
+              <el-form-item prop="characterId">
+                <div class="w-20 h-20">
+                  <div v-if="!character.id" @click="showPopup1 = true"
+                    class="w-20 h-20 bg-gray-100 rounded-full cursor-pointer flex flex-col justify-center items-center text-sm hover:bg-gray-200">
+                    <p>选择</p>
+                    <p>角色</p>
+                  </div>
+                  <img v-else class="w-20 h-20 rounded-full cursor-pointer object-cover shadow" @click="showPopup1 = true"
+                    :src="baseApi + character.picture" alt="">
+                </div>
+              </el-form-item>
+              <div class="mt-1.5 text-2xl">{{ character.id ? character.characterName : '请选择角色' }}</div>
+              <div class="mt-1 text-gray-400 text-sm">定义角色所属的上下文,为角色补充创作的故事或设定。</div>
             </div>
-            <div class="mt-1.5 text-2xl">{{ character.id ? character.characterName : '请选择角色' }}</div>
-            <div class="mt-1 text-gray-400 text-sm">定义角色所属的上下文,为角色补充创作的故事或设定。</div>
-          </div>
 
-          <div class="py-4">
-            <div>场景名称</div>
-            <div class="mt-1 text-gray-400 text-sm">场景的标题</div>
-            <el-input class="mt-4" v-model="form.sceneName" placeholder="例如:第一次约会" maxlength="10"
-              show-word-limit></el-input>
-          </div>
+            <div class="py-4">
+              <div>场景名称</div>
+              <div class="mt-1 text-gray-400 text-sm">场景的标题</div>
+              <el-form-item prop="sceneName">
+                <el-input class="mt-4" v-model="form.sceneName" placeholder="例如:第一次约会" maxlength="10"
+                  show-word-limit></el-input>
+              </el-form-item>
+            </div>
 
-          <div class="py-4">
-            <div>场景描述</div>
-            <div class="mt-1 text-gray-400 text-sm">
-              详细的场景描述,可以为角色补充创作的故事或设定,可以指定互动发生的位置和时间。
+            <div class="py-4">
+              <div>场景描述</div>
+              <div class="mt-1 text-gray-400 text-sm">
+                详细的场景描述,可以为角色补充创作的故事或设定,可以指定互动发生的位置和时间。
+              </div>
+              <el-form-item prop="sceneDescription">
+                <el-input class="mt-4" v-model="form.sceneDescription"
+                  placeholder="例:{char} 成为 {user} 的女朋友已有一段時間了,今天你们决定开始同居。" type="textarea" maxlength="400"
+                  :autosize="{ minRows: 4 }" show-word-limit></el-input>
+              </el-form-item>
             </div>
-            <el-input class="mt-4" v-model="form.sceneDescription"
-              placeholder="例:{char} 成为 {user} 的女朋友已有一段時間了,今天你们决定开始同居。" type="textarea" maxlength="400"
-              :autosize="{ minRows: 4 }" show-word-limit></el-input>
-          </div>
-          <div class="py-4">
-            <div>欢迎语</div>
-            <div class="mt-1 text-gray-400 text-sm">
-              请填写欢迎语和指定的发言角色,這将会是进入场景时收到的第一句话,将会印象场景的剧情走向
+            <div class="py-4">
+              <div>欢迎语</div>
+              <div class="mt-1 text-gray-400 text-sm">
+                请填写欢迎语和指定的发言角色,這将会是进入场景时收到的第一句话,将会印象场景的剧情走向
+              </div>
+              <el-form-item prop="sceneWelcome">
+                <el-input class="mt-4" v-model="form.sceneWelcome" placeholder="例如:他的声音里充满了恼怒,问道: “你是我新來的保姆吗?”"
+                  type="textarea" maxlength="400" :autosize="{ minRows: 4 }" show-word-limit></el-input>
+              </el-form-item>
             </div>
-            <el-input class="mt-4" v-model="form.sceneWelcome" placeholder="例如:他的声音里充满了恼怒,问道: “你是我新來的保姆吗?”"
-              type="textarea" maxlength="400" :autosize="{ minRows: 4 }" show-word-limit></el-input>
-          </div>
-          <div class="py-4">
-            <div>模型</div>
-            <div class="flex items-start py-3">
-              <el-radio-group class="radio" v-model="form.modelId">
-                <el-radio-button v-for="(item, index) in modelList" :key="index" :label="item.id">
-                  {{ item.model }}
-                </el-radio-button>
-              </el-radio-group>
+            <div class="py-4">
+              <div>模型</div>
+              <div class="flex items-start py-3">
+                <el-form-item prop="modelId">
+                  <el-radio-group class="radio" v-model="form.modelId">
+                    <el-radio-button v-for="(item, index) in modelList" :key="index" :label="item.id">
+                      {{ item.model }}
+                    </el-radio-button>
+                  </el-radio-group>
+                </el-form-item>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <!-- 第二步背景 -->
-      <div v-show="active == 2" class="w-full">
-        <img v-if="uploadList.length > 0" class=" w-full h-full object-cover" :src="baseApi + uploadList[bgActive].url"
-          alt="">
-        <div
-          class="absolute h-full bg-white p-4 bottom-1/2 right-1/2 transform translate-x-1/2 translate-y-1/2 rounded-lg border border-gray-200">
-          <el-tabs v-model="tabActive2">
-            <el-tab-pane label="上传背景" name="1">
-              <div class="flex flex-col">
-                <div>直接使用上传的图像</div>
-                <div class="mt-1 text-gray-400 text-sm">直接使用上传的图像</div>
-                <el-upload class=" w-full text-center mt-4" drag :action="uploadUrl" :headers="headers"
-                  :before-upload="handleBeforeUpload" :on-success="handleUploadSuccess" :on-error="handleUploadError"
-                  :show-file-list="false" :limit="10">
-                  <i class="el-icon-upload"></i>
-                  <div class="el-upload__text"><em>点击上传</em></div>
-                  <div class="el-upload__tip" slot="tip">只能上传jpg/png文件,且不超过5M</div>
-                </el-upload>
-                <div>背景</div>
-                <div class="mt-2 grid grid-cols-4 gap-1 gap-y-2">
-                  <div v-for="(item, index) in uploadList" :key="index" @click="bgActive = index">
-                    <img class=" rounded object-cover cursor-pointer border" :class="bgActive === index ? 'bgActive' : ''"
-                      style="width: 120px; height: 90px;" :src="baseApi + item.url" alt="">
-                  </div>
+        <!-- 第二步背景 -->
+        <div v-if="active == 2" class="w-full">
+          <img v-if="uploadList.length > 0" class=" w-full h-full object-cover" :src="baseApi + uploadList[bgActive].url"
+            alt="">
+          <div
+            class="absolute h-full bg-white p-4 bottom-1/2 right-1/2 transform translate-x-1/2 translate-y-1/2 rounded-lg border border-gray-200">
+            <el-tabs v-model="tabActive2">
+              <el-tab-pane label="上传背景" name="1">
+                <div class="flex flex-col">
+                  <div>直接使用上传的图像</div>
+                  <div class="mt-1 text-gray-400 text-sm">直接使用上传的图像</div>
+                  <el-form-item prop="background" :rules="{ required: true, message: '请上传背景图', trigger: 'change' }">
+                    <el-upload class=" w-full text-center mt-4" drag :action="uploadUrl" :headers="headers"
+                      :before-upload="handleBeforeUpload" :on-success="handleUploadSuccess" :on-error="handleUploadError"
+                      :show-file-list="false" :limit="10">
+                      <i class="el-icon-upload"></i>
+                      <div class="el-upload__text"><em>点击上传</em></div>
+                      <div class="el-upload__tip" slot="tip">只能上传jpg/png文件,且不超过5M</div>
+                    </el-upload>
+                    <div>背景</div>
+                    <div class="mt-2 grid grid-cols-4 gap-1 gap-y-2">
+                      <div v-for="( item, index ) in  uploadList " :key="index" @click="bgActive = index">
+                        <img class=" rounded object-cover cursor-pointer border"
+                          :class="bgActive === index ? 'bgActive' : ''" style="width: 120px; height: 90px;"
+                          :src="baseApi + item.url" alt="">
+                      </div>
+                    </div>
+                  </el-form-item>
                 </div>
-              </div>
-            </el-tab-pane>
-          </el-tabs>
+              </el-tab-pane>
+            </el-tabs>
+          </div>
         </div>
-      </div>
+      </el-form>
+
       <div class="bottomA flex justify-end items-center pr-6">
-        <el-button v-if="active == 1" type="primary" :disabled="nextDisabled" @click="next()">下一步</el-button>
+        <el-button v-if="active == 1" type="primary" @click="next()">下一步</el-button>
         <el-button v-if="active == 2" @click="active--">上一步</el-button>
 
         <el-dropdown @command="handleCommand" trigger="click">
@@ -99,7 +115,8 @@
             <el-dropdown-item command="1">非公开</el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
-        <el-button v-if="active == 2" :disabled="uploadList.length == 0" type="primary" @click="submit">发布</el-button>
+        <el-button :loading="submitLoading" v-if="active == 2" :disabled="uploadList.length == 0" type="primary"
+          @click="submit">发布</el-button>
       </div>
     </div>
     <!-- 选择角色对话框 -->
@@ -109,7 +126,7 @@
         <el-tabs v-model="tabActive" @tab-click="handleClickTab">
           <el-tab-pane label="我的角色" name="1">
             <div class=" grid grid-cols-3 gap-8">
-              <div v-for="(item, index) in userCharacterList" :key="index" @click="selectCharacter(item)">
+              <div v-for="( item, index ) in  userCharacterList " :key="index" @click="selectCharacter(item)">
                 <img class="rounded-full object-cover cursor-pointer w-20 h-20" :src="baseApi + item.picture" alt="">
                 <div class="characterName text-center w-20">{{ item.characterName }}</div>
               </div>
@@ -117,7 +134,7 @@
           </el-tab-pane>
           <el-tab-pane label="热门角色" name="2">
             <div class=" grid grid-cols-3 gap-8 justify-items-center">
-              <div v-for="(item, index) in characterList" :key="index" @click="selectCharacter(item)">
+              <div v-for="( item, index ) in  characterList " :key="index" @click="selectCharacter(item)">
                 <img class="rounded-full object-cover cursor-pointer w-20 h-20" :src="baseApi + item.picture" alt="">
                 <div class="characterName text-center w-20">{{ item.characterName }}</div>
               </div>
@@ -146,6 +163,7 @@ export default {
   },
   data() {
     return {
+      submitLoading: false,
       active: 1,
       showPopup1: false,
       tabActive: '1',
@@ -182,7 +200,25 @@ export default {
       },
       uploadList: [],
       fileSize: 5,
-      bgActive: 0
+      bgActive: 0,
+      rules: {
+        characterId: [
+          { required: true, message: "请选择角色", trigger: "change" },
+        ],
+        sceneName: [
+          { required: true, message: "请输入场景名称", trigger: "change" },
+        ],
+        sceneDescription: [
+          { required: true, message: "请输入场景描述", trigger: "change" },
+        ],
+        sceneWelcome: [
+          { required: true, message: "请输入欢迎语", trigger: "change" },
+        ],
+        modelId: [
+          { required: true, message: "请选择模型", trigger: "change" },
+        ],
+
+      }
     }
   },
   mounted() {
@@ -264,31 +300,56 @@ export default {
     },
     // 下一步
     next() {
-      this.active++
+      // this.active++
+
+      this.$refs.form.validate((valid, object) => {
+        if (valid) {
+          this.active++
+        } else {
+          let keys = Object.keys(object)
+          this.$modal.msgError(object[keys[0]][0].message);
+        }
+      })
     },
     submit() {
-      this.form.background = this.uploadList[this.bgActive].url
-      if (this.form.sceneId) {
-        // 修改
-        editSceneApi(this.form).then(res => {
-          console.log(res, 'res>>>>>');
-          this.$message({
-            type: 'success',
-            message: '修改成功!'
-          });
-          this.$router.push('/profile')
-        })
-      } else {
-        // 新增
-        addSceneApi(this.form).then(res => {
-          console.log(res, 'res>>>>>');
-          this.$message({
-            type: 'success',
-            message: '发布成功!'
-          });
-          this.$router.push('/profile')
-        })
+      if (this.uploadList.length > 0) {
+        this.form.background = this.uploadList[this.bgActive].url
       }
+      this.$refs.form.validate((valid, object) => {
+        if (valid) {
+          this.submitLoading = true
+          if (this.form.sceneId) {
+            // 修改
+            editSceneApi(this.form).then(res => {
+              console.log(res, 'res>>>>>');
+              this.$message({
+                type: 'success',
+                message: '修改成功!'
+              });
+              this.submitLoading = false
+              this.$router.push('/profile')
+            }).catch(() => {
+              this.submitLoading = false
+            })
+          } else {
+            // 新增
+            addSceneApi(this.form).then(res => {
+              console.log(res, 'res>>>>>');
+              this.$message({
+                type: 'success',
+                message: '发布成功!'
+              });
+              this.submitLoading = false
+              this.$router.push('/profile')
+            }).catch(() => {
+              this.submitLoading = false
+            })
+          }
+        } else {
+          let keys = Object.keys(object)
+          this.$modal.msgError(object[keys[0]][0].message);
+        }
+      })
     },
     handleClickTab(tab, event) {
 

+ 10 - 1
src/views/create/createScenePC.vue

@@ -101,7 +101,8 @@
           <el-dropdown-item command="1">非公开</el-dropdown-item>
         </el-dropdown-menu>
       </el-dropdown>
-      <el-button v-if="active == 2" :disabled="uploadList.length == 0" type="primary" @click="submit">发布</el-button>
+      <el-button :loading="submitLoading" v-if="active == 2" :disabled="uploadList.length == 0" type="primary"
+        @click="submit">发布</el-button>
     </div>
     <!-- 选择角色对话框 -->
     <el-dialog class="dialog" title="选择角色" :visible.sync="showPopup1" width="600">
@@ -143,6 +144,7 @@ import { queryCharactersApi } from "@/api/profile.js"
 export default {
   data() {
     return {
+      submitLoading: false,
       active: 1,
       showPopup1: false,
       tabActive: '1',
@@ -265,6 +267,7 @@ export default {
     },
     submit() {
       this.form.background = this.uploadList[this.bgActive].url
+      this.submitLoading = true
       if (this.form.sceneId) {
         // 修改
         editSceneApi(this.form).then(res => {
@@ -273,7 +276,10 @@ export default {
             type: 'success',
             message: '修改成功!'
           });
+          this.submitLoading = false
           this.$router.push('/profile')
+        }).catch(() => {
+          this.submitLoading = false
         })
       } else {
         // 新增
@@ -283,7 +289,10 @@ export default {
             type: 'success',
             message: '发布成功!'
           });
+          this.submitLoading = false
           this.$router.push('/profile')
+        }).catch(() => {
+          this.submitLoading = false
         })
       }
     },

+ 1 - 1
src/views/user/components/userInfo.vue

@@ -14,7 +14,7 @@
               <div class="text-base text-white">账号:{{ userInfo.account }}</div>
               <div class=" text-sm text-white">
                 UID: {{ userInfo.id }}
-                <i class="el-icon-copy-document cursor-pointer"></i>
+                <!-- <i class="el-icon-copy-document cursor-pointer"></i> -->
               </div>
             </div>
           </div>

+ 1 - 1
src/views/user/userH5.vue

@@ -18,7 +18,7 @@
       <!-- <div class="text-sm">账号:{{ userInfo.account }}</div> -->
       <div class=" text-sm">
         UID: {{ userInfo.id }}
-        <i class="el-icon-copy-document cursor-pointer"></i>
+        <!-- <i class="el-icon-copy-document cursor-pointer"></i> -->
       </div>
       <div class="flex mt-2">
         <div class="text-xs">