diff --git a/package.json b/package.json
index 0282f32..95071df 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
"mic-recorder-to-mp3": "^2.2.2",
"postcss-px2rem": "^0.3.0",
"register-service-worker": "^1.7.1",
+ "socket.io": "^4.7.1",
"swiper": "^4.5.1",
"vant": "^2.12.48",
"vue": "^2.6.11",
diff --git a/src/assets/icon/arrow-down-bold.png b/src/assets/icon/arrow-down-bold.png
new file mode 100644
index 0000000..9c9a02d
Binary files /dev/null and b/src/assets/icon/arrow-down-bold.png differ
diff --git a/src/assets/icon/arrow-up-bold.png b/src/assets/icon/arrow-up-bold.png
new file mode 100644
index 0000000..d54eeee
Binary files /dev/null and b/src/assets/icon/arrow-up-bold.png differ
diff --git a/src/assets/icon/enter.png b/src/assets/icon/enter.png
new file mode 100644
index 0000000..ea09a5f
Binary files /dev/null and b/src/assets/icon/enter.png differ
diff --git a/src/assets/icon/input.png b/src/assets/icon/input.png
new file mode 100644
index 0000000..9c23509
Binary files /dev/null and b/src/assets/icon/input.png differ
diff --git a/src/assets/icon/voice.png b/src/assets/icon/voice.png
new file mode 100644
index 0000000..e0d00c1
Binary files /dev/null and b/src/assets/icon/voice.png differ
diff --git a/src/assets/icon/voice_close.png b/src/assets/icon/voice_close.png
new file mode 100644
index 0000000..7dba6ba
Binary files /dev/null and b/src/assets/icon/voice_close.png differ
diff --git a/src/components/home/home.vue b/src/components/home/home.vue
index e0e9651..362e3e1 100644
--- a/src/components/home/home.vue
+++ b/src/components/home/home.vue
@@ -72,6 +72,15 @@
>
{{ characters == 1 ? "开始聊天" : "Let's Talk" }}
+
+
@@ -941,10 +950,7 @@ export default {
goToChat() {
console.log("goToChat");
this.isBtnActice = false;
- },
-
- startSocket() {
- const socket = new WebSocket("wss://43.143.227.135:8989/webrtc");
+ this.$router.push("/realTimeChat");
},
},
computed: {
@@ -979,7 +985,6 @@ export default {
},
mounted() {
this.goView("top");
- this.startSocket();
this.$nextTick(() => {
this.module_6_data = oneList;
this.carouselLsit = twoList;
@@ -1267,6 +1272,24 @@ export default {
transform: translate(-50%, -50%) scale(0.9);
}
}
+
+ .bottom {
+ position: absolute;
+ color: #fff;
+ width: 300px;
+ text-align: center;
+ left: 50%;
+ bottom: 5%;
+ transform: translate(-50%, 0);
+ font-size: 20px;
+ font-size: 12px;
+ .text1 {
+ margin-bottom: 10px;
+ }
+ .text2 {
+ text-align: center;
+ }
+ }
}
.module_1 {
diff --git a/src/router/index.js b/src/router/index.js
index 005f2f2..7e4af66 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -121,6 +121,12 @@ const routes = [
name: 'downloadVideo',
component: () => import("../views/model/downloadVideo"),
},
+ // 实时对话
+ {
+ path: '/realTimeChat',
+ name: 'realTimeChat',
+ component: () => import("../views/realTimeChat/realTimeChat"),
+ },
]
const router = new VueRouter({
diff --git a/src/views/realTimeChat/realTimeChat.vue b/src/views/realTimeChat/realTimeChat.vue
new file mode 100644
index 0000000..bc9ed73
--- /dev/null
+++ b/src/views/realTimeChat/realTimeChat.vue
@@ -0,0 +1,243 @@
+
+
+
+
+
+
+
+
+
聊天记录
+
我:{{ 123456 }}
+
{{ 123456 }}:你
+
我:{{ 123456 }}
+
{{ 123456 }}:你
+
我:{{ 123456 }}
+
{{ 123456 }}:你
+
我:{{ 123456 }}
+
{{ 123456 }}:你
+
我:{{ 123456 }}
+
{{ 123456 }}:你
+
我:{{ 123456 }}
+
{{ 123456 }}:你
+
已经到底啦
+
+
+
+

+
+
+
+
+

+
+
+

+

+
+
+
+
+
+
+
+
diff --git a/yarn.lock b/yarn.lock
index 12317e1..cc31fba 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -152,6 +152,11 @@
resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.7.0.tgz#9a06f4f137ee84d7df0460c1fdb1135ffa6c50fd"
integrity sha512-ONhaKPIufzzrlNbqtWFFd+jlnemX6lJAgq9ZeiZtS7I1PIf/la7CW4m83rTXRnVnsMbW2k56pGYu7AUFJD9Pow==
+"@socket.io/component-emitter@~3.1.0":
+ version "3.1.0"
+ resolved "https://registry.yarnpkg.com/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz#96116f2a912e0c02817345b3c10751069920d553"
+ integrity sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg==
+
"@soda/friendly-errors-webpack-plugin@^1.7.1":
version "1.8.1"
resolved "https://registry.npmmirror.com/@soda/friendly-errors-webpack-plugin/-/friendly-errors-webpack-plugin-1.8.1.tgz"
@@ -195,6 +200,18 @@
dependencies:
"@types/node" "*"
+"@types/cookie@^0.4.1":
+ version "0.4.1"
+ resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.4.1.tgz#bfd02c1f2224567676c1545199f87c3a861d878d"
+ integrity sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q==
+
+"@types/cors@^2.8.12":
+ version "2.8.13"
+ resolved "https://registry.yarnpkg.com/@types/cors/-/cors-2.8.13.tgz#b8ade22ba455a1b8cb3b5d3f35910fd204f84f94"
+ integrity sha512-RG8AStHlUiV5ysZQKq97copd2UmVYw3/pRMLefISZ3S1hK104Cwm7iLQ3fTKx+lsUH2CE8FlLaYeEA2LSeqYUA==
+ dependencies:
+ "@types/node" "*"
+
"@types/express-serve-static-core@*", "@types/express-serve-static-core@^4.17.31":
version "4.17.32"
resolved "https://registry.npmmirror.com/@types/express-serve-static-core/-/express-serve-static-core-4.17.32.tgz"
@@ -254,6 +271,11 @@
resolved "https://registry.npmmirror.com/@types/node/-/node-18.11.18.tgz"
integrity sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==
+"@types/node@>=10.0.0":
+ version "20.4.4"
+ resolved "https://registry.yarnpkg.com/@types/node/-/node-20.4.4.tgz#c79c7cc22c9d0e97a7944954c9e663bcbd92b0cb"
+ integrity sha512-CukZhumInROvLq3+b5gLev+vgpsIqC2D0deQr/yS1WnxvmYLlJXZpaQrQiseMY+6xusl79E04UjWoqyr+t1/Ew==
+
"@types/normalize-package-data@^2.4.0":
version "2.4.1"
resolved "https://registry.npmmirror.com/@types/normalize-package-data/-/normalize-package-data-2.4.1.tgz"
@@ -1042,6 +1064,11 @@ base64-js@^1.0.2, base64-js@^1.3.1:
resolved "https://registry.npmmirror.com/base64-js/-/base64-js-1.5.1.tgz"
integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
+base64id@2.0.0, base64id@~2.0.0:
+ version "2.0.0"
+ resolved "https://registry.yarnpkg.com/base64id/-/base64id-2.0.0.tgz#2770ac6bc47d312af97a8bf9a634342e0cd25cb6"
+ integrity sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog==
+
base@^0.11.1:
version "0.11.2"
resolved "https://registry.npmmirror.com/base/-/base-0.11.2.tgz"
@@ -1996,6 +2023,11 @@ cookie@0.5.0:
resolved "https://registry.npmmirror.com/cookie/-/cookie-0.5.0.tgz"
integrity sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==
+cookie@~0.4.1:
+ version "0.4.2"
+ resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.4.2.tgz#0e41f24de5ecf317947c82fc789e06a884824432"
+ integrity sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==
+
copy-concurrently@^1.0.0:
version "1.0.5"
resolved "https://registry.npmmirror.com/copy-concurrently/-/copy-concurrently-1.0.5.tgz"
@@ -2046,6 +2078,14 @@ core-util-is@~1.0.0:
resolved "https://registry.npmmirror.com/core-util-is/-/core-util-is-1.0.3.tgz"
integrity sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==
+cors@~2.8.5:
+ version "2.8.5"
+ resolved "https://registry.yarnpkg.com/cors/-/cors-2.8.5.tgz#eac11da51592dd86b9f06f6e7ac293b3df875d29"
+ integrity sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==
+ dependencies:
+ object-assign "^4"
+ vary "^1"
+
cosmiconfig@^5.0.0:
version "5.2.1"
resolved "https://registry.npmmirror.com/cosmiconfig/-/cosmiconfig-5.2.1.tgz"
@@ -2358,7 +2398,7 @@ debug@^3.2.7:
dependencies:
ms "^2.1.1"
-debug@^4.1.0, debug@^4.1.1:
+debug@^4.1.0, debug@^4.1.1, debug@~4.3.1, debug@~4.3.2:
version "4.3.4"
resolved "https://registry.npmmirror.com/debug/-/debug-4.3.4.tgz"
integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
@@ -2833,6 +2873,27 @@ end-of-stream@^1.0.0, end-of-stream@^1.1.0:
dependencies:
once "^1.4.0"
+engine.io-parser@~5.1.0:
+ version "5.1.0"
+ resolved "https://registry.yarnpkg.com/engine.io-parser/-/engine.io-parser-5.1.0.tgz#d593d6372d7f79212df48f807b8cace1ea1cb1b8"
+ integrity sha512-enySgNiK5tyZFynt3z7iqBR+Bto9EVVVvDFuTT0ioHCGbzirZVGDGiQjZzEp8hWl6hd5FSVytJGuScX1C1C35w==
+
+engine.io@~6.5.0:
+ version "6.5.1"
+ resolved "https://registry.yarnpkg.com/engine.io/-/engine.io-6.5.1.tgz#59725f8593ccc891abb47f1efcdc52a089525a56"
+ integrity sha512-mGqhI+D7YxS9KJMppR6Iuo37Ed3abhU8NdfgSvJSDUafQutrN+sPTncJYTyM9+tkhSmWodKtVYGPPHyXJEwEQA==
+ dependencies:
+ "@types/cookie" "^0.4.1"
+ "@types/cors" "^2.8.12"
+ "@types/node" ">=10.0.0"
+ accepts "~1.3.4"
+ base64id "2.0.0"
+ cookie "~0.4.1"
+ cors "~2.8.5"
+ debug "~4.3.1"
+ engine.io-parser "~5.1.0"
+ ws "~8.11.0"
+
enhanced-resolve@^4.5.0:
version "4.5.0"
resolved "https://registry.npmmirror.com/enhanced-resolve/-/enhanced-resolve-4.5.0.tgz"
@@ -5972,7 +6033,7 @@ oauth-sign@~0.9.0:
resolved "https://registry.npmmirror.com/oauth-sign/-/oauth-sign-0.9.0.tgz"
integrity sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ==
-object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1:
+object-assign@^4, object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1:
version "4.1.1"
resolved "https://registry.npmmirror.com/object-assign/-/object-assign-4.1.1.tgz"
integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==
@@ -7728,6 +7789,34 @@ snapdragon@^0.8.1:
source-map-resolve "^0.5.0"
use "^3.1.0"
+socket.io-adapter@~2.5.2:
+ version "2.5.2"
+ resolved "https://registry.yarnpkg.com/socket.io-adapter/-/socket.io-adapter-2.5.2.tgz#5de9477c9182fdc171cd8c8364b9a8894ec75d12"
+ integrity sha512-87C3LO/NOMc+eMcpcxUBebGjkpMDkNBS9tf7KJqcDsmL936EChtVva71Dw2q4tQcuVC+hAUy4an2NO/sYXmwRA==
+ dependencies:
+ ws "~8.11.0"
+
+socket.io-parser@~4.2.4:
+ version "4.2.4"
+ resolved "https://registry.yarnpkg.com/socket.io-parser/-/socket.io-parser-4.2.4.tgz#c806966cf7270601e47469ddeec30fbdfda44c83"
+ integrity sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==
+ dependencies:
+ "@socket.io/component-emitter" "~3.1.0"
+ debug "~4.3.1"
+
+socket.io@^4.7.1:
+ version "4.7.1"
+ resolved "https://registry.yarnpkg.com/socket.io/-/socket.io-4.7.1.tgz#9009f31bf7be25478895145e92fbc972ad1db900"
+ integrity sha512-W+utHys2w//dhFjy7iQQu9sGd3eokCjGbl2r59tyLqNiJJBdIebn3GAKEXBr3osqHTObJi2die/25bCx2zsaaw==
+ dependencies:
+ accepts "~1.3.4"
+ base64id "~2.0.0"
+ cors "~2.8.5"
+ debug "~4.3.2"
+ engine.io "~6.5.0"
+ socket.io-adapter "~2.5.2"
+ socket.io-parser "~4.2.4"
+
sockjs-client@^1.5.0:
version "1.6.1"
resolved "https://registry.npmmirror.com/sockjs-client/-/sockjs-client-1.6.1.tgz"
@@ -8778,7 +8867,7 @@ vant@^2.12.48:
"@vue/babel-helper-vue-jsx-merge-props" "^1.0.0"
vue-lazyload "1.2.3"
-vary@~1.1.2:
+vary@^1, vary@~1.1.2:
version "1.1.2"
resolved "https://registry.npmmirror.com/vary/-/vary-1.1.2.tgz"
integrity sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==
@@ -9289,6 +9378,11 @@ ws@^6.0.0, ws@^6.2.1:
dependencies:
async-limiter "~1.0.0"
+ws@~8.11.0:
+ version "8.11.0"
+ resolved "https://registry.yarnpkg.com/ws/-/ws-8.11.0.tgz#6a0d36b8edfd9f96d8b25683db2f8d7de6e8e143"
+ integrity sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==
+
xtend@^4.0.0, xtend@~4.0.1:
version "4.0.2"
resolved "https://registry.npmmirror.com/xtend/-/xtend-4.0.2.tgz"