-
+
+
+
+
+
-
-
-
-
+
+
+
+
+
+
+
+
+
text {{ v }}
+
+
+
+
-
+
diff --git a/src/components/TestMenu1.vue b/src/components/TestMenu1.vue
new file mode 100644
index 0000000..d07593c
--- /dev/null
+++ b/src/components/TestMenu1.vue
@@ -0,0 +1,270 @@
+
+
+
+
+
+
+
+ V
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ item.title }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ item.title }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Профиль
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ getActiveTitle }}
+
+
+
+
+
+
Добро пожаловать в раздел "{{ getActiveTitle }}"
+
+
+
+
+ Карточка {{ n }}
+ Описание карточки {{ n }}
+
+
+ Контент карточки {{ n }}. Здесь может быть любая информация.
+
+
+
+
+
+
+
+
+
diff --git a/src/components/TestMenu2.vue b/src/components/TestMenu2.vue
new file mode 100644
index 0000000..378965c
--- /dev/null
+++ b/src/components/TestMenu2.vue
@@ -0,0 +1,72 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Профиль
+
+
+
+
+
+
+
+
+
diff --git a/src/components/WebSocketComponent.vue b/src/components/WebSocketComponent.vue
deleted file mode 100644
index 165e712..0000000
--- a/src/components/WebSocketComponent.vue
+++ /dev/null
@@ -1,88 +0,0 @@
-
-
-
-
-
-
-
-
- selected chat {{ selectedChat }}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/composables/useSharedWebSocket.ts b/src/composables/useSharedWebSocket.ts
deleted file mode 100644
index ed47dd1..0000000
--- a/src/composables/useSharedWebSocket.ts
+++ /dev/null
@@ -1,141 +0,0 @@
-import { ref, onUnmounted, onMounted } from 'vue'
-
-export interface Message {
- id: number
- text: string
- userId: string
- createdAt: string
-}
-
-export interface Chat {
- id: string
- type_id: number
- users: User[]
-}
-
-export interface User {
- id: number
- email: string
-}
-
-export interface WsData {
- type: WsDataType2
- // data: Chat | Message | User | User[] | Message[] | Chat[]
- data: unknown
-}
-
-export enum WsDataType2 {
- GET_CHATS = 'GET_CHATS',
- GET_USERS = 'GET_USERS',
- GET_MESSAGES = 'GET_MESSAGES',
- CREATE_MESSAGE = 'CREATE_MESSAGE',
- CHATS = 'CHATS',
- USER = 'USER',
- MESSAGES = 'MESSAGES',
- STATUS = 'STATUS',
- ERROR = 'ERROR',
-}
-
-export enum COMMAND2 {
- CONNECT = 'CONNECT',
- SEND = 'SEND',
- CLOSE = 'CLOSE',
-}
-
-export function useSharedWebSocket(options?: { url?: string; autoConnect?: true }) {
- const url = options?.url || 'ws://localhost:3000/ws'
- const autoConnect = options?.autoConnect ?? false
- const messages = ref
([])
- const chats = ref([])
- const users = ref([])
- const isConnected = ref(false)
- const error = ref()
- const worker = ref()
-
- const init = () => {
- console.log('INIT WORKER')
-
- if (!window.SharedWorker) {
- console.log('SharedWorker not supported')
- error.value = 'SharedWorker not supported'
- }
-
- worker.value = new SharedWorker(new URL('@/workers/worker.js', import.meta.url), {
- type: 'module',
- })
-
- worker.value.port.onmessage = (event) => {
- const { type, data, connected, message } = event.data
-
- switch (type) {
- case WsDataType2.USER:
- break
- case WsDataType2.CHATS:
- chats.value = data
- break
- case WsDataType2.MESSAGES:
- messages.value = data
- // if (options.onMessage) {
- // options.onMessage(data)
- // }
- break
- case WsDataType2.CREATE_MESSAGE:
- messages.value.push(data)
- break
- case WsDataType2.STATUS:
- isConnected.value = connected
- break
- case WsDataType2.ERROR:
- error.value = message
- logout()
- break
- }
- }
-
- worker.value.port.postMessage({
- command: COMMAND2.CONNECT,
- data: { url: url, token: getToken() },
- })
- }
-
- function logout() {
- return localStorage.removeItem('token')
- }
-
- function getToken() {
- return localStorage.getItem('token')
- }
-
- const send = (data: WsData) => {
- if (worker.value) {
- worker.value.port.postMessage({
- command: COMMAND2.SEND,
- data: data,
- })
- }
- }
-
- const close = () => {
- if (worker.value) {
- worker.value.port.postMessage({ command: COMMAND2.CLOSE })
- }
- }
-
- onMounted(() => {
- if (autoConnect) init()
- })
-
- onUnmounted(() => {
- if (worker.value) close()
- })
-
- return {
- messages,
- chats,
- isConnected,
- error,
- send,
- close,
- init,
- }
-}
diff --git a/src/main.ts b/src/main.ts
index a6d1513..e1cf1ee 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,28 +1,12 @@
-import '@fontsource/roboto/100.css'
-import '@fontsource/roboto/300.css'
-import '@fontsource/roboto/400.css'
import '@mdi/font/css/materialdesignicons.css'
-
+import './assets/clean.css'
+import './assets/main.css'
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
-import 'vuetify/styles'
-import { createVuetify } from 'vuetify'
-import * as components from 'vuetify/components'
-import * as directives from 'vuetify/directives'
-
const app = createApp(App)
app.use(createPinia())
-const vuetify = createVuetify({
- components,
- directives,
- icons: {
- defaultSet: 'mdi',
- },
-})
-app.use(vuetify)
-
app.mount('#app')
diff --git a/src/stores/auth.ts b/src/stores/auth.ts
index 88821f2..63031d7 100644
--- a/src/stores/auth.ts
+++ b/src/stores/auth.ts
@@ -1,6 +1,5 @@
import { defineStore } from 'pinia'
import { computed, ref } from 'vue'
-import type { WsData } from '@/composables/useSharedWebSocket.ts'
import type { User } from '@/stores/users.ts'
export const useAuthStore = defineStore('auth', () => {
diff --git a/src/stores/sockets.ts b/src/stores/sockets.ts
index fc5ea78..a689af2 100644
--- a/src/stores/sockets.ts
+++ b/src/stores/sockets.ts
@@ -70,14 +70,14 @@ export const useSocketsStore = defineStore('sockets', () => {
case SocketDataRes.MESSAGES:
console.log('MESSAGES', data)
- messagesStore.messages = data.reverse()
+ messagesStore.messages = data
// if (options.onMessage) {
// options.onMessage(data)
// }
break
case SocketDataRes.MESSAGE:
console.log('MESSAGE', data)
- messagesStore.messages.push(data)
+ messagesStore.messages.unshift(data)
break
case SocketDataRes.STATUS:
isConnected.value = connected
diff --git a/src/views/ChatView.vue b/src/views/ChatView.vue
index 859d62d..6c2821a 100644
--- a/src/views/ChatView.vue
+++ b/src/views/ChatView.vue
@@ -4,6 +4,7 @@ import ChatsPane from '@/components/ChatsPane.vue'
import MessagesPane from '@/components/MessagesPane.vue'
import { useSocketsStore } from '@/stores/sockets.ts'
import { useChatsStore } from '@/stores/chats.ts'
+import AppMenu from '@/components/AppMenu.vue'
const socketsStore = useSocketsStore()
// const { messages, chats, isConnected, error, send } = useSharedWebSocket({ autoConnect: true })
@@ -42,14 +43,13 @@ onMounted(() => {
-
-
+
diff --git a/src/views/SignInView.vue b/src/views/SignInView.vue
index c2306f6..1993f21 100644
--- a/src/views/SignInView.vue
+++ b/src/views/SignInView.vue
@@ -5,37 +5,28 @@ import { useAuthStore } from '@/stores/auth.ts'
const authStore = useAuthStore()
const email = ref('vadim.olonin@gmail.com')
+const name = ref('')
async function onSubmit() {
await authStore.login(email.value)
}
-
-
-
- Sign in
-
-
-
-
-
-
+