Cool
/
Chat-Vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

2023-12-01版本

This commit is contained in:
Cool 2023-12-01 20:58:56 +08:00
parent 2afcad01e6
commit 51bde198f1
6 changed files with 59 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/router/index.js
View File

@ -41,11 +41,11 @@ const routes = [
}
},
{
path:"/chat",
name:"Chat",
component:()=>import("../views/main/Chat.vue"),
meta:{
isLogin:true
path: "/chat",
name: "Chat",
component: () => import("../views/main/Chat.vue"),
meta: {
isLogin: true
}
}
]

1
src/store/index.js
View File

@ -17,7 +17,6 @@ export default new Vuex.Store({
delToken(state) {
state.token = ''
localStorage.removeItem("token")//删除token
}
},
actions: {

2
src/store/request.js
View File

@ -4,7 +4,7 @@ import { Message } from "element-ui";
//创建axios实例
const axiosInstance = axios.create({
baseURL: 'http://localhost:8080', // 设置默认发送地址为后端端口
baseURL: 'http://localhost:8887', // 设置默认发送地址为后端端口
});
//添加拦截器，在每次ajax之前都会执行这个操作

4
src/views/LoginView.vue
View File

@ -215,7 +215,7 @@ export default {
.then(function (response) {
if (response.data.responseStr !== "No") {
that.$store.commit("setToken", response.data.responseStr);
localStorage.setItem("nickname", that.loginForm.account);
localStorage.setItem("account", that.loginForm.account);
that.$router.push({ path: "/home" });
} else {
that.$message.error('账号或密码错误');
@ -265,7 +265,7 @@ export default {
that.$message.error('验证码错误');
} else {
that.$message.error('验证码失效');
}
});

14
src/views/main/Chat.vue
View File

@ -13,7 +13,7 @@
<p>{{ message.nickname }} {{ message.sendTime }}</p>
</div>
<div class="info">
<el-avatar :src="message.pic" class="head"></el-avatar>
<el-avatar :src=message.pic class="head"></el-avatar>
<div class="message">
<div class="detail">
{{ message.message }}
@ -31,7 +31,7 @@
</div>
<div class="info">
<el-avatar :src="message.pic" class="head"></el-avatar>
<el-avatar :src=message.pic class="head"></el-avatar>
<div class="message">
<div class="detail">
@ -59,6 +59,8 @@
</template>
<script>
import axiosInstance from '@/store/request';
let socket;
export default {
@ -78,12 +80,12 @@ export default {
this.myName = localStorage.getItem("nickname");
},
methods: {
getDate(){
getDate() {
var date = new Date();
var year = date.getFullYear();
var month = (date.getMonth() + 1).toString().padStart(2, '0');
var day = date.getDate().toString().padStart(2, '0');
var hour =date.getHours().toString().padStart(2, '0');
var hour = date.getHours().toString().padStart(2, '0');
var minute = date.getMinutes().toString().padStart(2, '0');
var second = date.getSeconds().toString().padStart(2, '0');
this.dateNow = year + '/' + month + '/' + day + ' ' + hour + ':' + minute + ':' + second;
@ -93,6 +95,7 @@ export default {
if (!this.textarea) {
this.$message({ type: 'warning', message: "请输入内容" })
} else {
axiosInstance.get("/interceptor")
this.getDate()
let SendMessage = {
nickname: this.myName,
@ -114,11 +117,12 @@ export default {
init() {
const that = this
axiosInstance.get("/interceptor")
if (typeof (WebSocket) === undefined) {
console.log("您的浏览器不支持WebSocket");
} else {
console.log("您的浏览器支持WebSocket");
let socketUrl = "ws://localhost:8080/chat/get";
let socketUrl = "ws://localhost:8887/chat/get";
if (socket != null) {
socket.close();
socket = null;

58
src/views/main/Index.vue
View File

@ -32,33 +32,56 @@
<div class="left">
<h2 class="versionText">ChatABC Windows版 1.1.1</h2>
<p class="time">发布时间: 2023年11月17号</p>
<img src="../../assets/img/cool.jpg" class="img">
<img :src=headPic class="img">
<br>
<el-button type="primary" round class="button" @click="download">立即下载</el-button>
</div>
<div class="right">
<h2 class="versionText">ChatABC Linux版 1.1.1</h2>
<p class="time">发布时间: 2023年11月17号</p>
<img src="../../assets/img/cool.jpg" class="img">
<el-button type="primary" class="button" @click="download" round>立即下载</el-button>
<img :src=headPic class="img">
<el-button type="primary" class="button" @click="download" round>立即下载</el-button>
</div>
</div>
</div>
</template>
<script>
import axiosInstance from "@/store/request";
export default {
data() {
return {
myName: "",
headPic: require("@/assets/img/cool.jpg"),
headPic: "",
};
},
mounted() {
this.myName = localStorage.getItem("nickname");
this.headPic = localStorage.getItem("headPic");
console.log(this.headPic);
this.init()
},
methods: {
init() {
const that=this
axiosInstance.post("/getHead", {
account: localStorage.getItem("account"),
}).then(function (response) {
that.headPic = response.data.pic;
that.myName = response.data.username;
localStorage.setItem("nickname", response.data.username);
});
},
download() {
//下载文件
var blob = new Blob(['Hello, this is the content of the file!'], { type: 'text/plain' });
var link = document.createElement('a');
@ -103,6 +126,7 @@ export default {
align-items: center;
justify-content: center;
height: 100%;
}
.dropdownMenu {
@ -121,18 +145,8 @@ export default {
}
.el-popper[x-placement^=bottom] .popper__arrow {
display: none;
}
.el-icon-arrow-down {
font-size: 12px;
}
.headerNav {
background-color: rgb(35, 40, 52) ;
background-color: rgb(35, 40, 52);
// position: relative;
// right: 0;
// top: 0;
@ -250,6 +264,7 @@ export default {
height: 300px;
}
.button {
margin-top: 50px;
margin-left: 190px;
@ -260,4 +275,15 @@ export default {
}
}
}
}</style>
}
</style>
<style lang="scss">
//style设置为scope时不生效
.el-popper[x-placement^=bottom] .popper__arrow {
display: none;
}
.el-icon-arrow-down {
font-size: 12px;
}
</style>