首页 发现 帮助
注册 登录
bill
/
shop-back
1
0
派生 0
文件 工单管理 0 合并请求 0 Wiki
浏览代码

feat: 对接服务

bill 2 年之前
父节点
a201a8cb83
当前提交
7ce92ea2ec
共有 19 个文件被更改，包括 318 次插入 和 188 次删除
合并视图 显示文件统计
  1. 2 2
      index.html
  2. 4 3
      src/api/constant.ts
  3. 7 0
      src/api/index.ts
  4. 68 69
      src/api/room.ts
  5. 40 34
      src/api/scene.ts
  6. 13 6
      src/api/user.ts
  7. 10 2
      src/components/loading/index.ts
  8. 59 0
      src/components/loading/index.vue
  9. 1 2
      src/main.ts
  10. 1 0
      src/store/index.ts
  11. 30 9
      src/store/room.ts
  12. 22 24
      src/views/room/edit-room/index.vue
  13. 1 2
      src/views/room/edit-room/props.ts
  14. 5 5
      src/views/room/edit-room/scene-list.vue
  15. 15 7
      src/views/room/list.vue
  16. 4 1
      src/views/room/modal/share.vue
  17. 1 1
      src/views/room/sign.vue
  18. 33 19
      src/views/scene/list.vue
  19. 2 2
      vite.config.ts

+ 2 - 2
index.html
查看文件 

@@ -2,9 +2,9 @@
 
 <html lang="en">
 
 <html lang="en">
 
   <head>
 
   <head>
 
     <meta charset="UTF-8" />
 
     <meta charset="UTF-8" />
 
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
 
+    <link rel="icon" type="image/svg+xml" href="//4dkk.4dage.com/FDKKIMG/icon/kankan_icon.ico" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
-    <title>Vite + Vue + TS</title>
 
+    <title>四维全景VR</title>
 
   </head>
 
   </head>
 
   <body>
 
   <body>
 
     <div id="app"></div>
 
     <div id="app"></div>

+ 4 - 3
src/api/constant.ts
查看文件 

@@ -8,11 +8,12 @@ export const ResCodeDesc: { [key in ResCode]: string } = {
 
   [ResCode.SUCCESS]: '请求成功'
 
   [ResCode.SUCCESS]: '请求成功'
 
 }
 
 }
 
 
 
+export const GET_USER = '/takelook/getUserInfo'
 
+
 
+export const GET_SCENE_LIST = '/takelook/sceneList'
 
+
 
 export const GET_ROOM_LIST = '/takelook/roomList'
 
 export const GET_ROOM_LIST = '/takelook/roomList'
 
 export const GET_ROOM = '/takelook/roomInfo'
 
 export const GET_ROOM = '/takelook/roomInfo'
 
 export const SET_ROOM = '/takelook/roomAddOrUpdate'
 
 export const SET_ROOM = '/takelook/roomAddOrUpdate'
 
 export const DEL_ROOM = '/takelook/roomDelete'
 
 export const DEL_ROOM = '/takelook/roomDelete'
 
 export const GET_ROOM_MINI_CODE = '/takelook/roomGetShareCode'
 
 export const GET_ROOM_MINI_CODE = '/takelook/roomGetShareCode'
 
-export const GET_SECELE_LIST = '/takelook/sceneList'
 
-
 
-export const GET_SCENE_LIST = '/takelook/sceneList'

+ 7 - 0
src/api/index.ts
查看文件 

@@ -2,3 +2,10 @@ export * from './room'
 
 export * from './user'
 
 export * from './user'
 
 export * from './instance'
 
 export * from './instance'
 
 export * from './scene'
 
 export * from './scene'
 
+
 
+export type PageResult<T> = {
 
+  pageNum: number
 
+  PageSize: number
 
+  total: number
 
+  list: T[]
 
+}

+ 68 - 69
src/api/room.ts
查看文件 

@@ -1,5 +1,21 @@
 
-import { GET_ROOM_LIST, GET_ROOM_MINI_CODE } from './constant'
 
+import {
 
+  GET_ROOM_LIST,
 
+  GET_ROOM_MINI_CODE,
 
+  DEL_ROOM,
 
+  SET_ROOM
 
+} from './constant'
 
 import axios from './instance'
 
 import axios from './instance'
 
+import type { PageResult, Scene } from './'
 
+
 
+type SRoom = {
 
+  roomId: number
 
+  roomTitle: string
 
+  roomInfo: string
 
+  roomHostName: string
 
+  roomCoverUrl: string
 
+  roomViewCount: number
 
+  createTime: string
 
+}
 
 
 
 export interface RoomScene {
 
 export interface RoomScene {
 
   num: string
 
   num: string
 
@@ -15,78 +31,61 @@ export interface Room {
 
   viewCount: number
 
   viewCount: number
 
   cover: string
 
   cover: string
 
   leaderName: string
 
   leaderName: string
 
-  userName: string
 
-  shareUrl: string
 
-  scenes: RoomScene[]
 
 }
 
 }
 
 
 
 export type Rooms = Room[]
 
 export type Rooms = Room[]
 
 
 
-export const fetchRomms = async () => {
 
-  const test: Rooms = [
 
-    {
 
-      id: 1,
 
-      title: '1212121212121212121212121212121212121212121212121212121212121212',
 
-      desc: '1231',
 
-      cover: 'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-      leaderName: 'asdasd',
 
-      userName: 'aaa',
 
-      shareUrl: 'http://www.4dkankan.com',
 
-      time: '2020-03-02',
 
-      viewCount: 1002,
 
-      scenes: [
 
-        {
 
-          num: 't-cc',
 
-          cover:
 
-            'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-          title: '田心村'
 
-        }
 
-      ]
 
-    },
 
-    {
 
-      id: 2,
 
-      title: '12',
 
-      desc: '1231',
 
-      cover: 'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-      leaderName: 'asdasd',
 
-      time: '2020-03-02',
 
-      userName: 'aaa',
 
-      shareUrl: 'http://www.4dkankan.com',
 
-      viewCount: 1002,
 
-      scenes: [
 
-        {
 
-          num: 't-cc',
 
-          cover:
 
-            'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-          title: '田心村'
 
-        }
 
-      ]
 
-    },
 
-    {
 
-      id: 3,
 
-      title: '12',
 
-      time: '2020-03-02',
 
-      viewCount: 1002,
 
-      desc: '1231',
 
-      userName: 'aaa',
 
-      shareUrl: 'http://www.4dkankan.com',
 
-      cover: 'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-      leaderName: 'asdasd',
 
-      scenes: [
 
-        {
 
-          num: 't-cc',
 
-          cover:
 
-            'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-          title: '田心村'
 
-        }
 
-      ]
 
-    }
 
-  ]
 
-  // const res = await axios.get<Room[]>(GET_ROOM_LIST)
 
-  return test
 
+const serverToLocal = (sroom: SRoom): Room => ({
 
+  id: sroom.roomId,
 
+  title: sroom.roomTitle,
 
+  desc: sroom.roomInfo,
 
+  time: sroom.createTime,
 
+  viewCount: sroom.roomViewCount,
 
+  cover: sroom.roomCoverUrl,
 
+  leaderName: sroom.roomHostName
 
+})
 
+const localToServer = (room: Room): SRoom => ({
 
+  roomId: room.id,
 
+  roomTitle: room.title,
 
+  roomInfo: room.desc,
 
+  roomHostName: room.leaderName,
 
+  roomCoverUrl: room.cover,
 
+  roomViewCount: room.viewCount,
 
+  createTime: room.time
 
+})
 
+
 
+export const fetchRomms = async (): Promise<Rooms> => {
 
+  const res = await axios.post<PageResult<SRoom>>(GET_ROOM_LIST, {
 
+    pageNum: 1,
 
+    pageSize: 1000
 
+  })
 
+  return res.list.map(serverToLocal)
 
+}
 
+
 
+export const deleteRoom = async (room: Room) => {
 
+  await axios.post(DEL_ROOM, { roomId: room.id })
 
+}
 
+
 
+export const insertRoom = async (
 
+  room: Omit<Room, 'id'>,
 
+  numList: Scene['num'][]
 
+) => {
 
+  const sroom = await axios.post<SRoom>(SET_ROOM, {
 
+    ...localToServer({ ...room, id: -1 }),
 
+    roomId: null,
 
+    createTime: null,
 
+    numList
 
+  })
 
+  return serverToLocal(sroom)
 
+}
 
+
 
+export const updateRoom = async (room: Room, numList: Scene['num'][]) => {
 
+  await axios.post(SET_ROOM, {
 
+    ...localToServer(room),
 
+    numList
 
+  })
 
 }
 
 }
 
 
 
-export const fetchRoomMiniCode = (room: Room) => {
 
-  return 'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png'
 
-  // return axios.get<string>(GET_ROOM_MINI_CODE, { params: { roomId: room.id } })
 
+export const fetchRoomMiniCode = async (room: Room) => {
 
+  return axios.get<string>(GET_ROOM_MINI_CODE, { params: { roomId: room.id } })
 
 }
 
 }

+ 40 - 34
src/api/scene.ts
查看文件 

@@ -1,8 +1,19 @@
 
 import axios from './instance'
 
 import axios from './instance'
 
-import { GET_SCENE_LIST } from './constant'
 
+import { GET_SCENE_LIST, GET_ROOM } from './constant'
 
+import type { PageResult, Room } from './'
 
+
 
+type SScene = {
 
+  id: number
 
+  name: string
 
+  num: string
 
+  title: string
 
+  sceneName: string
 
+  thumb: string
 
+  createTime: string
 
+}
 
 
 
 export interface Scene {
 
 export interface Scene {
 
-  id: string
 
+  id: number
 
   num: string
 
   num: string
 
   title: string
 
   title: string
 
   cover: string
 
   cover: string
 
@@ -11,36 +22,31 @@ export interface Scene {
 
 
 
 export type Scenes = Scene[]
 
 export type Scenes = Scene[]
 
 
 
-export const fetchScenes = async () => {
 
-  return [
 
-    {
 
-      id: '1',
 
-      num: 't-cc',
 
-      time: '2020-03-02',
 
-      cover: 'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-      title: '田心村'
 
-    },
 
-    {
 
-      id: '2',
 
-      num: 't-cc2',
 
-      time: '2020-03-02',
 
-      cover: 'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-      title: '田心村'
 
-    },
 
-    {
 
-      id: '3',
 
-      num: 't-cc3',
 
-      time: '2020-03-02',
 
-      cover: 'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-      title: '田心村'
 
-    },
 
-    {
 
-      id: '4',
 
-      num: 't-cc4',
 
-      time: '2020-03-02',
 
-      cover: 'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png',
 
-      title: '田心村'
 
-    }
 
-  ]
 
-  // return axios.get<Scenes>(GET_SCENE_LIST)
 
+const serverToLocal = (sscene: SScene): Scene => ({
 
+  ...sscene,
 
+  cover: sscene.thumb,
 
+  time: sscene.createTime
 
+})
 
+
 
+export const fetchScenes = async (): Promise<Scenes> => {
 
+  const params = {
 
+    status: 2,
 
+    pageNum: 1,
 
+    pageSize: 1000,
 
+    sceneName: ''
 
+  }
 
+
 
+  const [kkScenes, kjScenes] = await Promise.all([
 
+    axios.post<PageResult<SScene>>(GET_SCENE_LIST, { type: 0, ...params }),
 
+    axios.post<PageResult<SScene>>(GET_SCENE_LIST, { type: 1, ...params })
 
+  ])
 
+
 
+  return kkScenes.list.concat(kjScenes.list).map(serverToLocal)
 
+}
 
+
 
+export const fetchRoomScenes = async (roomId: Room['id']) => {
 
+  const res = await axios.get<Room & { sceneData: SScene[] }>(GET_ROOM, {
 
+    params: { roomId }
 
+  })
 
+  return res.sceneData.map(serverToLocal)
 
 }
 
 }

+ 13 - 6
src/api/user.ts
查看文件 

@@ -1,4 +1,5 @@
 
-import axios from 'axios'
 
+import axios from './instance'
 
+import { GET_USER } from './constant'
 
 
 
 export interface User {
 
 export interface User {
 
   nickname: string
 
   nickname: string
 
@@ -6,11 +7,17 @@ export interface User {
 
   avatar: string
 
   avatar: string
 
 }
 
 }
 
 
 
-export const fetchUser = async () => {
 
-  // const res = axios.get<User>('')
 
+type SUser = {
 
+  head: string
 
+  nickName: string
 
+  userName: string
 
+}
 
+
 
+export const fetchUser = async (): Promise<User> => {
 
+  const res = await axios.post<{ data: SUser }>(GET_USER)
 
   return {
 
   return {
 
-    nickname: 'aaa',
 
-    phone: '15919209354',
 
-    avatar: 'https://4dkk.4dage.com/head/18819272208/head_1662022947583.png'
 
+    nickname: res.data.nickName,
 
+    avatar: res.data.head,
 
+    phone: res.data.userName
 
   }
 
   }
 
 }
 
 }

+ 10 - 2
src/components/loading/index.ts
查看文件 

@@ -16,8 +16,15 @@ export const showLoading = function (
 
   if (closeStack.length) {
 
   if (closeStack.length) {
 
     closeStack.push({ key })
 
     closeStack.push({ key })
 
   } else {
 
   } else {
 
-    const { destroy } = mount(Loading, { app, props })
 
-    closeStack.push({ key, close: destroy })
 
+    const timeout = setTimeout(() => {
 
+      const { destroy } = mount(Loading, { app, props })
 
+      item.close = destroy
 
+    }, 300)
 
+    const item: Stack[number] = {
 
+      key,
 
+      close: () => clearTimeout(timeout)
 
+    }
 
+    closeStack.push(item)
 
   }
 
   }
 
 }
 
 }
 
 
 
@@ -25,6 +32,7 @@ export const hideLoading = function (hkey?: LoginMark) {
 
   if (closeStack.length) {
 
   if (closeStack.length) {
 
     const { key } = closeStack[closeStack.length - 1]
 
     const { key } = closeStack[closeStack.length - 1]
 
     if (key === hkey) {
 
     if (key === hkey) {
 
+      console.log('hide')
 
       const stack = closeStack.pop()
 
       const stack = closeStack.pop()
 
       stack?.close && stack?.close()
 
       stack?.close && stack?.close()
 
     }
 
     }

+ 59 - 0
src/components/loading/index.vue
查看文件 

@@ -24,3 +24,62 @@ export default defineComponent({
 
   props: props
 
   props: props
 
 })
 
 })
 
 </script>
 
 </script>
 
+
 
+<style lang="scss" scoped>
 
+.ui-loading {
 
+  position: absolute;
 
+  display: flex;
 
+  align-items: center;
 
+  justify-content: center;
 
+  left: 0;
 
+  top: 0;
 
+  width: 100%;
 
+  height: 100%;
 
+  overflow: hidden;
 
+  background-color: rgba($color: #000000, $alpha: 0.3);
 
+  --width: 15px;
 
+  --color: #fff;
 
+}
 
+.ui-loading__box {
 
+  position: relative;
 
+  width: 100px;
 
+  height: 100px;
 
+  display: flex;
 
+  align-items: center;
 
+  justify-content: center;
 
+  .default {
 
+    div {
 
+      width: var(--width);
 
+      height: var(--width);
 
+      background: var(--color);
 
+      border-radius: 50%;
 
+      display: inline-block;
 
+      margin-left: calc(var(--width) * 0.6);
 
+    }
 
+    div:nth-child(1) {
 
+      animation: ui-loading-default 1s -0.5s linear infinite;
 
+    }
 
+    div:nth-child(2) {
 
+      animation: ui-loading-default 1s -0.25s linear infinite;
 
+    }
 
+    div:nth-child(3) {
 
+      animation: ui-loading-default 1s 0s linear infinite;
 
+    }
 
+  }
 
+}
 
+
 
+@keyframes ui-loading-default {
 
+  0% {
 
+    transform: scale(1);
 
+    opacity: 1;
 
+  }
 
+  50% {
 
+    transform: scale(0.5);
 
+    opacity: 0.5;
 
+  }
 
+  100% {
 
+    transform: scale(1);
 
+    opacity: 0.8;
 
+  }
 
+}
 
+</style>

+ 1 - 2
src/main.ts
查看文件 

@@ -1,6 +1,5 @@
 
 import { createApp } from 'vue'
 
 import { createApp } from 'vue'
 
-import 'ant-design-vue/lib/modal/style/index.css'
 
-import 'ant-design-vue/lib/message/style/index.css'
 
+import 'ant-design-vue/lib/message/style/index.less'
 
 import './style.css'
 
 import './style.css'
 
 import App from './App.vue'
 
 import App from './App.vue'
 
 import router from './router'
 
 import router from './router'

+ 1 - 0
src/store/index.ts
查看文件 

@@ -3,6 +3,7 @@ import { createPinia } from 'pinia'
 
 export * from './room'
 
 export * from './room'
 
 export * from './user'
 
 export * from './user'
 
 export * from './scene'
 
 export * from './scene'
 
+export * from './constant'
 
 
 
 export const pinia = createPinia()
 
 export const pinia = createPinia()
 
 export default pinia
 
 export default pinia

+ 30 - 9
src/store/room.ts
查看文件 

@@ -1,25 +1,30 @@
 
-import { fetchRomms, fetchRoomMiniCode } from '@/api'
 
 import { defineStore } from 'pinia'
 
 import { defineStore } from 'pinia'
 
 import { TemplateId } from './constant'
 
 import { TemplateId } from './constant'
 
 import { useUserStore } from './user'
 
 import { useUserStore } from './user'
 
+import {
 
+  fetchRomms,
 
+  fetchRoomMiniCode,
 
+  insertRoom,
 
+  updateRoom,
 
+  deleteRoom,
 
+  fetchRoomScenes
 
+} from '@/api'
 
 
 
-import { Room as SRoom } from '@/api'
 
+import { Room as SRoom, Scenes } from '@/api'
 
 
 
 export type { RoomScene } from '@/api'
 
 export type { RoomScene } from '@/api'
 
 export type Rooms = Room[]
 
 export type Rooms = Room[]
 
-export type Room = SRoom & { miniCode?: string }
 
+export type Room = SRoom & { miniCode?: string; scenes: Scenes }
 
 
 
 export const createRoom = (room: Partial<Room>): Room => {
 
 export const createRoom = (room: Partial<Room>): Room => {
 
   const user = useUserStore().current
 
   const user = useUserStore().current
 
   return {
 
   return {
 
     id: TemplateId,
 
     id: TemplateId,
 
-    userName: user.nickname,
 
     leaderName: user.nickname,
 
     leaderName: user.nickname,
 
     title: '',
 
     title: '',
 
     time: new Date().toDateString(),
 
     time: new Date().toDateString(),
 
     viewCount: 0,
 
     viewCount: 0,
 
     desc: '',
 
     desc: '',
 
-    shareUrl: '',
 
     cover: '',
 
     cover: '',
 
     scenes: [],
 
     scenes: [],
 
     ...room
 
     ...room
 
@@ -31,14 +36,22 @@ export const useRoomStore = defineStore('room', {
 
     list: [] as Rooms
 
     list: [] as Rooms
 
   }),
 
   }),
 
   getters: {
 
   getters: {
 
+    getNums:
 
+      () =>
 
+      <T extends Pick<Room, 'scenes'>>(room: T) =>
 
+        room.scenes.map(scene => scene.num),
 
+    getShareUrl: () => (room: Room) =>
 
+      `https://test.4dkankan.com?roomId=${room.id}`,
 
     filter: state => (keyowrd: string) =>
 
     filter: state => (keyowrd: string) =>
 
       state.list.filter(room => room.title.includes(keyowrd))
 
       state.list.filter(room => room.title.includes(keyowrd))
 
   },
 
   },
 
   actions: {
 
   actions: {
 
-    async fetch() {
 
-      this.list = await fetchRomms()
 
+    async fetchList() {
 
+      const srooms = await fetchRomms()
 
+      this.list = srooms.map(room => ({ ...room, scenes: [] }))
 
     },
 
     },
 
     async delete(room: Room) {
 
     async delete(room: Room) {
 
+      await deleteRoom(room)
 
       const index = this.list.indexOf(room)
 
       const index = this.list.indexOf(room)
 
       if (~index) {
 
       if (~index) {
 
         this.list.splice(index, 1)
 
         this.list.splice(index, 1)
 
@@ -46,14 +59,22 @@ export const useRoomStore = defineStore('room', {
 
     },
 
     },
 
     async update(room: Room) {
 
     async update(room: Room) {
 
       const storeRoom = this.list.find(({ id }) => id === room.id)
 
       const storeRoom = this.list.find(({ id }) => id === room.id)
 
+      await updateRoom(room, this.getNums(room))
 
       if (storeRoom) {
 
       if (storeRoom) {
 
         Object.assign(storeRoom, room)
 
         Object.assign(storeRoom, room)
 
       }
 
       }
 
     },
 
     },
 
     async insert(room: Omit<Room, 'id'>) {
 
     async insert(room: Omit<Room, 'id'>) {
 
-      this.list.push({ ...room, id: -1 })
 
+      await insertRoom(room, this.getNums(room))
 
+      // const sroom =
 
+      // this.list.push({ ...room, ...sroom })
 
+      this.fetchList()
 
     },
 
     },
 
-    async setMiniCode(room: Room) {
 
+    async setRoomScenes(room: Room) {
 
+      const scenes = await fetchRoomScenes(room.id)
 
+      room.scenes = scenes
 
+    },
 
+    async setRoomMiniCode(room: Room) {
 
       const code = room.miniCode || (await fetchRoomMiniCode(room))
 
       const code = room.miniCode || (await fetchRoomMiniCode(room))
 
       room.miniCode = code
 
       room.miniCode = code
 
     }
 
     }

+ 22 - 24
src/views/room/edit-room/index.vue
查看文件 

@@ -1,7 +1,7 @@
 
 <template>
 
 <template>
 
   <a-modal
 
   <a-modal
 
     :visible="visible"
 
     :visible="visible"
 
-    title="创建房间"
 
+    :title="`${!room ? '创建' : '修改'}房间`"
 
     :after-close="onCancel"
 
     :after-close="onCancel"
 
     width="912px"
 
     width="912px"
 
     @cancel="visible = false"
 
     @cancel="visible = false"
 
@@ -19,21 +19,19 @@
 
         保存
 
         保存
 
       </a-button>
 
       </a-button>
 
       <a-button
 
       <a-button
 
+        v-if="room"
 
         class="action-bottom"
 
         class="action-bottom"
 
         type="primary"
 
         type="primary"
 
         size="middle"
 
         size="middle"
 
-        @click="onSave && onSave(current)"
 
+        @click="startSync"
 
       >
 
       >
 
         开始带看
 
         开始带看
 
       </a-button>
 
       </a-button>
 
     </template>
 
     </template>
 
     <div class="edit-room-layout">
 
     <div class="edit-room-layout">
 
       <div class="scene">
 
       <div class="scene">
 
-        <template v-if="!current.scenes.length">
 
-          {{ current }}
 
-        </template>
 
         <iframe
 
         <iframe
 
-          v-else
 
+          v-if="current.scenes.length"
 
           :src="`https://test.4dkankan.com/spg.html?m=${current.scenes[0].num}`"
 
           :src="`https://test.4dkankan.com/spg.html?m=${current.scenes[0].num}`"
 
           frameborder="0"
 
           frameborder="0"
 
         />
 
         />
 
@@ -86,12 +84,15 @@
 
 
 
 <script lang="ts">
 
 <script lang="ts">
 
 import { ref, defineComponent, reactive } from 'vue'
 
 import { ref, defineComponent, reactive } from 'vue'
 
-import { createRoom } from '@/store'
 
+import { createRoom, useRoomStore } from '@/store'
 
 import { props } from './props'
 
 import { props } from './props'
 
+import { message } from 'ant-design-vue'
 
 import EditScenes from './scene-list.vue'
 
 import EditScenes from './scene-list.vue'
 
 
 
-import type { RoomScene } from '@/store'
 
-import { FormInstance, message } from 'ant-design-vue'
 
+import type { Scene } from '@/store'
 
+import type { FormInstance } from 'ant-design-vue'
 
+
 
+const roomStore = useRoomStore()
 
 
 
 export default defineComponent({
 
 export default defineComponent({
 
   name: 'EditRoom',
 
   name: 'EditRoom',
 
@@ -101,27 +102,23 @@ export default defineComponent({
 
     const visible = ref(true)
 
     const visible = ref(true)
 
     const formRef = ref<FormInstance>()
 
     const formRef = ref<FormInstance>()
 
     const current = reactive(createRoom(props.room || {}))
 
     const current = reactive(createRoom(props.room || {}))
 
-    const deleteScene = (scene: RoomScene) => {
 
+    const deleteScene = (scene: Scene) => {
 
       const index = current.scenes.indexOf(scene)
 
       const index = current.scenes.indexOf(scene)
 
       if (~index) {
 
       if (~index) {
 
         current.scenes.splice(index, 1)
 
         current.scenes.splice(index, 1)
 
       }
 
       }
 
     }
 
     }
 
     const saveRoom = async () => {
 
     const saveRoom = async () => {
 
-      try {
 
-        await formRef.value?.validate()
 
-        if (!current.scenes.length) {
 
-          return message.error('至少添加一个场景')
 
-        }
 
-
 
-        current.cover = current.scenes[0].cover
 
-        props.onSave && props.onSave(current)
 
-        visible.value = false
 
-      } catch (config: any) {
 
-        if (config && config.errorFields && config.errorFields.length) {
 
-          message.error(config.errorFields[0].errors.join('，'))
 
-        }
 
+      await formRef.value?.validate()
 
+      if (!current.scenes.length) {
 
+        return message.error('至少添加一个场景')
 
       }
 
       }
 
+      current.cover = current.scenes[0].cover
 
+      props.onSave && props.onSave(current)
 
+      visible.value = false
 
+    }
 
+    const startSync = () => {
 
+      window.open(roomStore.getShareUrl(current))
 
     }
 
     }
 
 
 
     return {
 
     return {
 
@@ -129,7 +126,8 @@ export default defineComponent({
 
       current,
 
       current,
 
       formRef,
 
       formRef,
 
       deleteScene,
 
       deleteScene,
 
-      saveRoom
 
+      saveRoom,
 
+      startSync
 
     }
 
     }
 
   }
 
   }
 
 })
 
 })

+ 1 - 2
src/views/room/edit-room/props.ts
查看文件 

@@ -3,8 +3,7 @@ import type { PropType, ExtractPropTypes } from 'vue'
 
 
 
 export const props = {
 
 export const props = {
 
   room: {
 
   room: {
 
-    type: Object as PropType<Room>,
 
-    required: true
 
+    type: Object as PropType<Room>
 
   },
 
   },
 
   onSave: {
 
   onSave: {
 
     type: Function as PropType<(room: Room) => void>
 
     type: Function as PropType<(room: Room) => void>

+ 5 - 5
src/views/room/edit-room/scene-list.vue
查看文件 

@@ -27,21 +27,21 @@ import { useSceneStore } from '@/store'
 
 import { diffArrayChange } from '@/shared'
 
 import { diffArrayChange } from '@/shared'
 
 import SceneList from '@/views/scene/list.vue'
 
 import SceneList from '@/views/scene/list.vue'
 
 
 
-import type { RoomScene } from '@/store'
 
+import type { Scene } from '@/store'
 
 import { renderModal } from '@/helper'
 
 import { renderModal } from '@/helper'
 
 
 
 defineOptions<{ name: 'RoomSceneList' }>()
 
 defineOptions<{ name: 'RoomSceneList' }>()
 
-const props = defineProps<{ scenes: RoomScene[] }>()
 
+const props = defineProps<{ scenes: Scene[] }>()
 
 const emit = defineEmits<{
 
 const emit = defineEmits<{
 
-  (e: 'delete', scene: RoomScene): void
 
-  (e: 'insert', scene: RoomScene): void
 
+  (e: 'delete', scene: Scene): void
 
+  (e: 'insert', scene: Scene): void
 
 }>()
 
 }>()
 
 
 
 const addMarked = Symbol('add-scene')
 
 const addMarked = Symbol('add-scene')
 
 const current = computed(() => [addMarked, ...props.scenes])
 
 const current = computed(() => [addMarked, ...props.scenes])
 
 const sceneStore = useSceneStore()
 
 const sceneStore = useSceneStore()
 
 
 
-const deleteScene = (scene: RoomScene) => {
 
+const deleteScene = (scene: Scene) => {
 
   Modal.confirm({
 
   Modal.confirm({
 
     content: '删除后无法恢复，是否确认？',
 
     content: '删除后无法恢复，是否确认？',
 
     title: '删除场景',
 
     title: '删除场景',

+ 15 - 7
src/views/room/list.vue
查看文件 

@@ -21,7 +21,10 @@
 
         创建作品
 
         创建作品
 
       </a-button>
 
       </a-button>
 
     </template>
 
     </template>
 
-    <a-list :grid="{ gutter: 20, column: 5 }" :data-source="roomList">
 
+    <a-list
 
+      :grid="{ gutter: 20, xl: 5, lg: 4, md: 3, sm: 2, xs: 1, column: 5 }"
 
+      :data-source="roomList"
 
+    >
 
       <template #renderItem="{ item }">
 
       <template #renderItem="{ item }">
 
         <a-list-item>
 
         <a-list-item>
 
           <RoomSign
 
           <RoomSign
 
@@ -56,6 +59,7 @@ import RoomSign from './sign.vue'
 
 import Share from './modal/share.vue'
 
 import Share from './modal/share.vue'
 
 import MiniSync from './modal/mini-sync.vue'
 
 import MiniSync from './modal/mini-sync.vue'
 
 import DataList from '@/components/data-list/index.vue'
 
 import DataList from '@/components/data-list/index.vue'
 
+import { app } from '@/main'
 
 
 
 import type { Room } from '@/store'
 
 import type { Room } from '@/store'
 
 
 
@@ -63,7 +67,7 @@ defineOptions({ name: 'RoomList' })
 
 
 
 const addMarked = Symbol('add-room')
 
 const addMarked = Symbol('add-room')
 
 const roomStore = useRoomStore()
 
 const roomStore = useRoomStore()
 
-roomStore.fetch()
 
+roomStore.fetchList()
 
 
 
 const keyword = ref('')
 
 const keyword = ref('')
 
 const roomList = computed(() => [addMarked, ...roomStore.filter(keyword.value)])
 
 const roomList = computed(() => [addMarked, ...roomStore.filter(keyword.value)])
 
@@ -80,22 +84,23 @@ const deleteRoom = (room: Room) => {
 
   })
 
   })
 
 }
 
 }
 
 const shareRoom = async (room: Room) => {
 
 const shareRoom = async (room: Room) => {
 
-  await roomStore.setMiniCode(room)
 
+  await roomStore.setRoomMiniCode(room)
 
   Modal.confirm({
 
   Modal.confirm({
 
     content: createVNode(Share, { room }),
 
     content: createVNode(Share, { room }),
 
     title: '分享',
 
     title: '分享',
 
     icon: null,
 
     icon: null,
 
     width: '500px',
 
     width: '500px',
 
     okText: '复制链接',
 
     okText: '复制链接',
 
+    appContext: app._context,
 
     cancelText: '取消',
 
     cancelText: '取消',
 
     onOk: async (room: Room) => {
 
     onOk: async (room: Room) => {
 
-      await copyText(room.shareUrl)
 
+      await copyText(roomStore.getShareUrl(room))
 
       message.success('链接复制成功')
 
       message.success('链接复制成功')
 
     }
 
     }
 
   })
 
   })
 
 }
 
 }
 
 const miniSyncRoom = async (room: Room) => {
 
 const miniSyncRoom = async (room: Room) => {
 
-  await roomStore.setMiniCode(room)
 
+  await roomStore.setRoomMiniCode(room)
 
   Modal.info({
 
   Modal.info({
 
     content: createVNode(MiniSync, { room }),
 
     content: createVNode(MiniSync, { room }),
 
     title: '小程序带看',
 
     title: '小程序带看',
 
@@ -105,9 +110,12 @@ const miniSyncRoom = async (room: Room) => {
 
     cancelText: null
 
     cancelText: null
 
   })
 
   })
 
 }
 
 }
 
-const webSyncRoom = (room: Room) => window.open(room.shareUrl)
 
+const webSyncRoom = (room: Room) => window.open(roomStore.getShareUrl(room))
 
 
 
-const editRoom = (room?: Room) => {
 
+const editRoom = async (room?: Room) => {
 
+  if (room) {
 
+    await roomStore.setRoomScenes(room)
 
+  }
 
   renderModal(EditRoom, {
 
   renderModal(EditRoom, {
 
     room,
 
     room,
 
     onSave(actionRoom) {
 
     onSave(actionRoom) {

+ 4 - 1
src/views/room/modal/share.vue
查看文件 

@@ -5,7 +5,7 @@
 
     class="share-form"
 
     class="share-form"
 
   >
 
   >
 
     <a-form-item label="作品链接">
 
     <a-form-item label="作品链接">
 
-      <a-input disabled :value="room.shareUrl" />
 
+      <a-input disabled :value="roomStore.getShareUrl(room)" />
 
     </a-form-item>
 
     </a-form-item>
 
     <a-form-item label="作品葵花码">
 
     <a-form-item label="作品葵花码">
 
       <img :src="room.miniCode" class="mini-code" />
 
       <img :src="room.miniCode" class="mini-code" />
 
@@ -14,10 +14,13 @@
 
 </template>
 
 </template>
 
 
 
 <script lang="ts" setup>
 
 <script lang="ts" setup>
 
+import { useRoomStore } from '@/store'
 
 import type { Room } from '@/store'
 
 import type { Room } from '@/store'
 
 
 
 defineOptions({ name: 'RoomShare' })
 
 defineOptions({ name: 'RoomShare' })
 
 defineProps<{ room: Room }>()
 
 defineProps<{ room: Room }>()
 
+
 
+const roomStore = useRoomStore()
 
 </script>
 
 </script>
 
 
 
 <style lang="scss" scoped>
 
 <style lang="scss" scoped>

+ 1 - 1
src/views/room/sign.vue
查看文件 

@@ -49,7 +49,7 @@
 
       <h4 v-else>{{ room.title }}</h4>
 
       <h4 v-else>{{ room.title }}</h4>
 
       <div class="desc">
 
       <div class="desc">
 
         <span>{{ room.time }}</span>
 
         <span>{{ room.time }}</span>
 
-        <span><eye-outlined />{{ room.viewCount }}</span>
 
+        <span><eye-outlined /> {{ room.viewCount }}</span>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </a-card>
 
   </a-card>

+ 33 - 19
src/views/scene/list.vue
查看文件 

@@ -14,26 +14,28 @@
 
           <search-outlined class="search-icon" />
 
           <search-outlined class="search-icon" />
 
         </template>
 
         </template>
 
       </a-input>
 
       </a-input>
 
-      <DataList :data-source="filterScenes" :keyword="keyword" name="场景">
 
-        <div class="scene-list">
 
-          <a-table
 
-            row-key="num"
 
-            :columns="sceneColumns"
 
-            :data-source="filterScenes"
 
-            :pagination="false"
 
-            :row-selection="{
 
-              selectedRowKeys: selectedSceneKeys,
 
-              onChange: keys => (selectedSceneKeys = keys as SceneKey[])
 
-            }"
 
-          >
 
-            <template #bodyCell="{ column, record }">
 
-              <template v-if="column.key === 'cover'">
 
-                <img :src="record.cover" />
 
+      <div class="scene-list-layout">
 
+        <DataList :data-source="filterScenes" :keyword="keyword" name="场景">
 
+          <div class="scene-list">
 
+            <a-table
 
+              row-key="num"
 
+              :columns="sceneColumns"
 
+              :data-source="filterScenes"
 
+              :pagination="false"
 
+              :row-selection="{
 
+                selectedRowKeys: selectedSceneKeys,
 
+                onChange: keys => (selectedSceneKeys = keys as SceneKey[])
 
+              }"
 
+            >
 
+              <template #bodyCell="{ column, record }">
 
+                <template v-if="column.key === 'cover'">
 
+                  <img :src="record.cover" class="scene-cover" />
 
+                </template>
 
               </template>
 
               </template>
 
-            </template>
 
-          </a-table>
 
-        </div>
 
-      </DataList>
 
+            </a-table>
 
+          </div>
 
+        </DataList>
 
+      </div>
 
     </div>
 
     </div>
 
   </a-modal>
 
   </a-modal>
 
 </template>
 
 </template>
 
@@ -94,10 +96,22 @@ const saveHandler = () => {
 
   border-bottom: none;
 
   border-bottom: none;
 
 }
 
 }
 
 
 
+.scene-cover {
 
+  width: 38px;
 
+  height: 38px;
 
+}
 
+
 
 .search-icon {
 
 .search-icon {
 
   color: #1890ff;
 
   color: #1890ff;
 
   font-size: 18px;
 
   font-size: 18px;
 
 }
 
 }
 
+
 
+.scene-list-layout {
 
+  max-height: 500px;
 
+  overflow-y: auto;
 
+  margin-right: -20px;
 
+  padding-right: 10px;
 
+}
 
 </style>
 
 </style>
 
 
 
 <style lang="scss">
 
 <style lang="scss">

+ 2 - 2
vite.config.ts
查看文件 

@@ -8,9 +8,9 @@ import { resolve } from 'path'
 
 
 
 const proxy = {
 
 const proxy = {
 
   '/api': {
 
   '/api': {
 
-    target: 'http://192.168.0.38:8818',
 
+    target: 'http://v4-test.4dkankan.com/',
 
     changeOrigin: true,
 
     changeOrigin: true,
 
-    rewrite: path => path.replace(/^\/local/, '')
 
+    rewrite: path => path.replace(/^\/api/, '')
 
   }
 
   }
 
 }
 
 }