gemercheung 1 年之前
父节点
当前提交
127c34452c
共有 5 个文件被更改,包括 45 次插入22 次删除
  1. 1 0
      src/components.d.ts
  2. 1 0
      src/locales/lang/en/room.ts
  3. 2 2
      src/locales/lang/zh/room.ts
  4. 40 19
      src/views/room/edit-room/index.vue
  5. 1 1
      src/views/room/list.vue

+ 1 - 0
src/components.d.ts

@@ -37,6 +37,7 @@ declare module '@vue/runtime-core' {
     ATable: typeof import('ant-design-vue/es')['Table']
     ATabPane: typeof import('ant-design-vue/es')['TabPane']
     ATabs: typeof import('ant-design-vue/es')['Tabs']
+    ATextarea: typeof import('ant-design-vue/es')['Textarea']
     AUpload: typeof import('ant-design-vue/es')['Upload']
     BarChartOutlined: typeof import('@ant-design/icons-vue')['BarChartOutlined']
     CloseOutlined: typeof import('@ant-design/icons-vue')['CloseOutlined']

+ 1 - 0
src/locales/lang/en/room.ts

@@ -58,5 +58,6 @@ export default {
   usingTime: "Time of Use",
   usingTime1: "Duratation",
   usingTime2: "Create",
+  deletedRoom: 'Deleted Studios',
 
 }

+ 2 - 2
src/locales/lang/zh/room.ts

@@ -56,6 +56,6 @@ export default {
   usingTime: "使用时间",
   usingTime1: "时间段",
   usingTime2: "创建时间",
-  nodata: "您还没有房间,请先创建房间~"
-  
+  nodata: "您还没有房间,请先创建房间~",
+  deletedRoom: '删除房间',
 }

+ 40 - 19
src/views/room/edit-room/index.vue

@@ -91,13 +91,7 @@
           <a-form-item :label="t('room.form.desc')" name="desc">
             <!-- <QuillEditor style="{minHeight: '400px';}" theme="snow" v-model:content="current.desc"  /> -->
 
-            <div style="border: 1px solid #ccc">
-              <!-- <Toolbar
-                style="border-bottom: 1px solid #ccc"
-                :editor="editorRef"
-                :defaultConfig="{}"
-                mode="simple"
-              /> -->
+            <!-- <div style="border: 1px solid #ccc">
               <Editor
                 style="height: 150px; overflow-y: hidden"
                 v-model="current.desc"
@@ -111,14 +105,14 @@
                 @onBlur="handleEditorOnBlur"
                 @customPaste="handleEditorCustomPaste"
               />
-            </div>
-            <!-- <a-textarea
+            </div> -->
+            <a-textarea
               v-model:value="current.desc"
               :placeholder="t('room.form.descplaceHolder')"
               :maxlength="200"
               show-count
               :disabled="isRoomEnd"
-            /> -->
+            />
           </a-form-item>
           <!-- <h4>{{ t('room.form.host') }}</h4> -->
 
@@ -192,16 +186,18 @@
             style="margin-bottom: 2px"
           >
             <v-otp-input
+               ref="otpInput"
               v-model:value="current.visitPassword"
               class="otp-container"
               input-classes="otp-input"
               input-type="number"
               separator="-"
               :num-inputs="4"
-              :should-auto-focus="false"
+              :should-auto-focus="true"
               :class="{ disabled: isRoomEnd }"
               :conditionalClass="['one', 'two', 'three', 'four']"
               :placeholder="['-', '-', '-', '-']"
+              @on-change="handlePsOnChange"
             />
           </a-form-item>
           <a-form-item name="scenes" style="margin-bottom: 2px">
@@ -347,8 +343,8 @@ import { useScript } from '@/hook/useScript'
 import { onMounted, onBeforeUnmount } from 'vue'
 import type { UploadChangeParam } from 'ant-design-vue'
 import { watchEffect } from 'vue'
-import '@wangeditor/editor/dist/css/style.css' // 引入 css
-import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
+// import '@wangeditor/editor/dist/css/style.css' // 引入 css
+// import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
 
 dayjs.extend(duration)
 dayjs.extend(utc)
@@ -376,9 +372,9 @@ export default defineComponent({
     VOtpInput,
     EditAlbum,
     EditAvatar,
-    EditVideo,
-    Editor,
-    Toolbar
+    EditVideo
+    // Editor,
+    // Toolbar
   },
   props,
   setup(props) {
@@ -472,6 +468,8 @@ export default defineComponent({
         current.visitPassword.length > 0 &&
         current.visitPassword.length < 4
       ) {
+
+        // otpInput.value?.clearInput();
         return message.error(t('room.passwordError'))
       } else {
         current.takeLookLock = 1
@@ -723,10 +721,32 @@ export default defineComponent({
       }
     }
     const handleEditorOnBlur = (editor: any) => {
-      // debugger
+      const text = editor.getText()
+
+      if (text.length > 200) {
+        debugger
+        //   const html = text
+        //     .substring(0, 200)
+        //     .split(/\n/)
+        //     .map((line: string) => `<p>${line}</p>`)
+        //     .join('\n')
+        //   current.desc = html
+      }
     }
     const handleEditorCustomPaste = (editor: any) => {
       // debugger
+      // const text = editor.getText()
+      // if (text.length > 200) {
+      //   const html = text
+      //     .substring(0, 200)
+      //     .split(/\n/)
+      //     .map((line: string) => `<p>${line}</p>`)
+      //     .join('\n')
+      //   current.desc = html
+      // }
+    }
+    const handlePsOnChange = (value: string) => {
+      console.log('OTP changed: ', value)
     }
 
     return {
@@ -767,7 +787,8 @@ export default defineComponent({
       handleAvatarSync,
       handleVideoSync,
       editorRef,
-      handleEditorCreated
+      handleEditorCreated,
+      handlePsOnChange
     }
   }
 })
@@ -884,7 +905,7 @@ export default defineComponent({
       position: absolute;
       bottom: 4px;
       right: 8px;
-      margin: 0;
+      margin: 0 !important;
     }
   }
 

+ 1 - 1
src/views/room/list.vue

@@ -165,7 +165,7 @@ const deleteRoom = async (room: Room) => {
 
   Modal.confirm({
     content: t('room.deletedScenesWaring'),
-    title: t('room.deletedScenes'),
+    title: t('room.deletedRoom'),
     width: '400px',
     okText: t('base.delete'),
     icon: null,