From f771621e4f8853c4b392170e21cdd1c510f0d90a Mon Sep 17 00:00:00 2001 From: Qing Date: Sun, 2 Jul 2023 22:51:30 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E4=B8=AA=E4=BA=BA=E4=BF=A1?= =?UTF-8?q?=E6=81=AF=E7=BB=84=E4=BB=B6=E4=BB=A5=E5=8F=8A=E6=90=9C=E7=B4=A2?= =?UTF-8?q?=E6=A1=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 45 +++++- package.json | 5 +- src/components/Home/Home.vue | 183 ++++++++++++++++--------- src/components/Home/ManageCategory.vue | 25 ---- src/components/Home/SearchInput.vue | 126 +++++++++++------ src/components/Home/UserInfo.vue | 49 +++++++ src/components/UserInfoPage.vue | 15 ++ src/main.js | 6 + src/router/index.js | 6 + src/store/index.js | 21 +++ 10 files changed, 342 insertions(+), 139 deletions(-) delete mode 100644 src/components/Home/ManageCategory.vue create mode 100644 src/components/Home/UserInfo.vue create mode 100644 src/components/UserInfoPage.vue create mode 100644 src/store/index.js diff --git a/package-lock.json b/package-lock.json index 73054b1..1d93d74 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,9 @@ "core-js": "^3.8.3", "element-ui": "^2.15.13", "vue": "^2.6.14", - "vue-router": "^3.5.1" + "vue-cookie": "^1.1.4", + "vue-router": "^3.5.1", + "vuex": "^3.6.2" }, "devDependencies": { "@babel/core": "^7.12.16", @@ -20,6 +22,7 @@ "@vue/cli-plugin-babel": "~5.0.0", "@vue/cli-plugin-eslint": "~5.0.0", "@vue/cli-plugin-router": "~5.0.0", + "@vue/cli-plugin-vuex": "~5.0.0", "@vue/cli-service": "~5.0.0", "eslint": "^7.32.0", "eslint-plugin-vue": "^8.0.3", @@ -11532,6 +11535,11 @@ "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==", "dev": true }, + "node_modules/tiny-cookie": { + "version": "1.0.1", + "resolved": "https://registry.npmmirror.com/tiny-cookie/-/tiny-cookie-1.0.1.tgz", + "integrity": "sha512-4KJ21HYTNumxnHvCbLrtrrhSwtWXzpmaRJIUg4biBii5AiSe2izod5bauXiiQxVuf2Fta57U2DTW1Fa4/6Cmgw==" + }, "node_modules/to-fast-properties": { "version": "2.0.0", "resolved": "https://registry.npmmirror.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz", @@ -11803,6 +11811,14 @@ "csstype": "^3.1.0" } }, + "node_modules/vue-cookie": { + "version": "1.1.4", + "resolved": "https://registry.npmmirror.com/vue-cookie/-/vue-cookie-1.1.4.tgz", + "integrity": "sha512-lxWIzmUTCVra0H7YPbNpYx0wbTQThV+n7ueUOcqtK8dlckmfB8fcyf4OEiRuQUd7iiVub2T3IDlWiisEM5Ku0Q==", + "dependencies": { + "tiny-cookie": "^1.0" + } + }, "node_modules/vue-eslint-parser": { "version": "8.3.0", "resolved": "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz", @@ -12031,6 +12047,14 @@ "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==", "dev": true }, + "node_modules/vuex": { + "version": "3.6.2", + "resolved": "https://registry.npmmirror.com/vuex/-/vuex-3.6.2.tgz", + "integrity": "sha512-ETW44IqCgBpVomy520DT5jf8n0zoCac+sxWnn+hMe/CzaSejb/eVw2YToiXYX+Ex/AuHHia28vWTq4goAexFbw==", + "peerDependencies": { + "vue": "^2.0.0" + } + }, "node_modules/watchpack": { "version": "2.4.0", "resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-2.4.0.tgz", @@ -21724,6 +21748,11 @@ "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==", "dev": true }, + "tiny-cookie": { + "version": "1.0.1", + "resolved": "https://registry.npmmirror.com/tiny-cookie/-/tiny-cookie-1.0.1.tgz", + "integrity": "sha512-4KJ21HYTNumxnHvCbLrtrrhSwtWXzpmaRJIUg4biBii5AiSe2izod5bauXiiQxVuf2Fta57U2DTW1Fa4/6Cmgw==" + }, "to-fast-properties": { "version": "2.0.0", "resolved": "https://registry.npmmirror.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz", @@ -21932,6 +21961,14 @@ "csstype": "^3.1.0" } }, + "vue-cookie": { + "version": "1.1.4", + "resolved": "https://registry.npmmirror.com/vue-cookie/-/vue-cookie-1.1.4.tgz", + "integrity": "sha512-lxWIzmUTCVra0H7YPbNpYx0wbTQThV+n7ueUOcqtK8dlckmfB8fcyf4OEiRuQUd7iiVub2T3IDlWiisEM5Ku0Q==", + "requires": { + "tiny-cookie": "^1.0" + } + }, "vue-eslint-parser": { "version": "8.3.0", "resolved": "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz", @@ -22113,6 +22150,12 @@ "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==", "dev": true }, + "vuex": { + "version": "3.6.2", + "resolved": "https://registry.npmmirror.com/vuex/-/vuex-3.6.2.tgz", + "integrity": "sha512-ETW44IqCgBpVomy520DT5jf8n0zoCac+sxWnn+hMe/CzaSejb/eVw2YToiXYX+Ex/AuHHia28vWTq4goAexFbw==", + "requires": {} + }, "watchpack": { "version": "2.4.0", "resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-2.4.0.tgz", diff --git a/package.json b/package.json index 6d75672..10ab45c 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,9 @@ "core-js": "^3.8.3", "element-ui": "^2.15.13", "vue": "^2.6.14", - "vue-router": "^3.5.1" + "vue-cookie": "^1.1.4", + "vue-router": "^3.5.1", + "vuex": "^3.6.2" }, "devDependencies": { "@babel/core": "^7.12.16", @@ -20,6 +22,7 @@ "@vue/cli-plugin-babel": "~5.0.0", "@vue/cli-plugin-eslint": "~5.0.0", "@vue/cli-plugin-router": "~5.0.0", + "@vue/cli-plugin-vuex": "~5.0.0", "@vue/cli-service": "~5.0.0", "eslint": "^7.32.0", "eslint-plugin-vue": "^8.0.3", diff --git a/src/components/Home/Home.vue b/src/components/Home/Home.vue index 6c7c47d..12ba79f 100644 --- a/src/components/Home/Home.vue +++ b/src/components/Home/Home.vue @@ -43,8 +43,8 @@ -

加载中...

-

没有更多了

+

加载中...

+

- 你不经意间触碰到了底线 -

@@ -60,8 +60,8 @@ -

加载中...

-

没有更多了

+

加载中...

+

- 你不经意间触碰到了底线 -

@@ -70,16 +70,35 @@
- 登 录 + 登 录 +
- 卡片名称 - 操作按钮 + + + + + + + + +
-
- {{ '列表内容 ' + o }} +
+
关于本站
+ +HelloGitHub 是一个发现和分享有趣、入门级开源项目的平台。 希望大家能够在这里找到编程的快乐、 轻松搞定问题的技术方案、 大呼过瘾的开源神器， 顺其自然地开启开源之旅。 +
@@ -209,11 +228,15 @@ -
- -
+ + + + + + + 总共: + - @@ -222,14 +245,17 @@ import axios from 'axios' import Vue from "vue"; import ProjectList from "@/components/Home/ProjectList.vue"; -import manageCategory from "@/components/Home/ManageCategory.vue"; -import ManageCategory from "@/components/Home/ManageCategory.vue"; +import UserInfo from "@/components/Home/UserInfo.vue"; export default { name: "HomeComponent", - components: {ManageCategory, ProjectList}, + components: {UserInfo, ProjectList}, + data() { return { + userTotal:null, + projectTotal:null, + checkboxGroup: [], activeName: 'first', currentTabName:"综合", currentTabIndex:null, @@ -267,9 +293,11 @@ export default { }; }, mounted() { - this.account(); //获取cookie的方法 + // this.account(); //获取cookie的方法 this.ProjectLists(); this.categoryList(); + this.getUserTotal(); + this.getProjectTotal(); }, created() { // if (sessionStorage.getItem('current_name') == null){ @@ -285,9 +313,6 @@ export default { // next() }, computed: { - manageCategory() { - return manageCategory - }, noMore() { return this.count >= 10 }, @@ -300,6 +325,8 @@ export default { openLogin() { this.loginDialogVisible = true; + // this.$cookie.delete('username') + // this.$cookie.delete('password') }, closeLogin() { this.loginDialogVisible = false; @@ -311,49 +338,44 @@ export default { this.registerDialogVisible = false; }, // ******登录***** - account() { - // console.log(this.getCookie("username")); - this.ruleForm.username = this.getCookie("username"); - this.ruleForm.password = this.getCookie("password"); - }, - setCookie(c_name, c_pwd, exdate) { - //账号，密码 ，过期的天数 - exdate = new Date(); - exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdate); //保存的天数 - document.cookie = - "username=" + c_name + ";path=/;expires=" + exdate.toLocaleString(); - document.cookie = - "password=" + c_pwd + ";path=/;expires=" + exdate.toLocaleString(); - }, - getCookie(name) { - var arr = document.cookie.split(";"); - for (var i = 0; i < arr.length; i++) { - var arr2 = arr[i].split("="); - if (arr2[0].trim() == name) { - return arr2[1]; - } - } - }, - clearCookie() { - this.setCookie("", "", -1); //清除cookie - }, + // account() { + // this.ruleForm.username = this.getCookie("username"); + // this.ruleForm.password = this.getCookie("password"); + // this.CookieUserName=this.getCookie("username"); + // }, + // setCookie(c_name, c_pwd, exdate) { + // //账号，密码 ，过期的天数 + // exdate = new Date(); + // exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdate); //保存的天数 + // document.cookie = + // "username=" + c_name + ";path=/;expires=" + exdate.toLocaleString(); + // document.cookie = + // "password=" + c_pwd + ";path=/;expires=" + exdate.toLocaleString(); + // }, + // getCookie(name) { + // var arr = document.cookie.split(";"); + // for (var i = 0; i < arr.length; i++) { + // var arr2 = arr[i].split("="); + // if (arr2[0].trim() == name) { + // return arr2[1]; + // } + // } + // }, + // clearCookie() { + // this.setCookie("", "", -1); //清除cookie + // }, // 方法 submitForm(formName) { this.$refs[formName].validate((valid) => { if (valid) { - //取参数 - // let params = new URLSearchParams(); - // params.append("username", this.ruleForm.username); - // params.append("password", this.ruleForm.password); - // params.append("code", this.ruleForm.code); - // params.append("remember",this.ruleForm.remember) - if (this.checked == true) { //存入cookie - this.setCookie(this.ruleForm.username, this.ruleForm.password, 7); //保存7天 - } else { - this.clearCookie(); - } + // this.setCookie(this.ruleForm.username, this.ruleForm.password, 7); //保存7天 + this.$cookie.set('username',this.ruleForm.username,7); + + // } else { + // this.clearCookie(); + // } //调用方法提交 axios({ @@ -380,6 +402,7 @@ export default { type: 'success', offset: 50 }); + window.location.reload(); } else { Vue.prototype.$notify.error({ title: '错误', @@ -387,7 +410,6 @@ export default { offset: 50 }); } - console.log(res); }); } else { this.closeLogin(); @@ -435,12 +457,12 @@ export default { // params.append("password", this.ruleForm.password); // params.append("code", this.ruleForm.code); // params.append("remember",this.ruleForm.remember) - if (this.checked == true) { - //存入cookie - this.setCookie(this.ruleForm.username, this.ruleForm.password, 7); //保存7天 - } else { - this.clearCookie(); - } + // if (this.checked == true) { + // //存入cookie + // this.setCookie(this.ruleForm.username, this.ruleForm.password, 7); //保存7天 + // } else { + // this.clearCookie(); + // } //调用方法提交 axios({ @@ -473,7 +495,7 @@ export default { offset: 50 }); } - console.log(res); + // console.log(res); }); } else { this.closeRegister(); @@ -553,7 +575,6 @@ export default { name:name } }).then((res)=>{ - console.log(res.data); that.projectLists=res.data; }); }, @@ -578,11 +599,39 @@ export default { params: { } }).then((res)=>{ - console.log(res); + // console.log(res); that.tags=res.data; }); }, + getUserTotal(){ + var that=this; + axios({ + method: 'post', + // 请求的地址 + url: 'http://localhost:8082/helloGithub_war_exploded/userNum', + // URL 中的查询参数 + params: { + } + }).then((res)=>{ + that.userTotal=res.data; + }); + }, + getProjectTotal(){ + var that=this; + axios({ + method: 'post', + // 请求的地址 + url: 'http://localhost:8082/helloGithub_war_exploded/countNum', + // URL 中的查询参数 + params: { + + } + }).then((res)=>{ + that.projectTotal=res.data; + }); + } + } } diff --git a/src/components/Home/ManageCategory.vue b/src/components/Home/ManageCategory.vue deleted file mode 100644 index c361c04..0000000 --- a/src/components/Home/ManageCategory.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - - - \ No newline at end of file diff --git a/src/components/Home/SearchInput.vue b/src/components/Home/SearchInput.vue index 5d0c9b9..9587cf9 100644 --- a/src/components/Home/SearchInput.vue +++ b/src/components/Home/SearchInput.vue @@ -7,40 +7,28 @@ trigger="focus" :visible-arrow="false" style="padding-top: 0" - v-model="visible"> -
-
+ v-model="visible" + > +
+
搜索历史 清空
- {{ tag.name }} + @click="handleSearch(tag)" + > + {{ tag }}
- -
- 热门搜索 -
    -
  • - - - - - {{ index + 1 }} - - {{ item }} -
    • -
-
+ +import axios from "axios"; +import Vue from "vue"; + export default { data() { return { + visible: false, isMouseOver: false, search: '', tipsWord: '', - historySearch: [ - {name: '标签一66666', type: 'info'}, - {name: '标签二无敌无敌', type: 'info'}, - {name: '标签三66', type: 'info'}, - {name: '标签四1', type: 'info'}, - {name: '标签四2', type: 'info'}, - {name: '标签四3', type: 'info'}, - {name: '标签四4', type: 'info'}, - {name: '标签五', type: 'danger'} - ], + historySearch: [], items: [ - '重生之我是都市霸主', - '热搜', - '热搜重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主重生之我是都市霸主', - '热搜', - '热搜', - '热搜', - '热搜', - '热搜', - '热搜', - '热搜' ] } }, @@ -94,7 +67,29 @@ export default { this.searchRequest() }, clearHistory() { - this.historySearch = [] + axios({ + method: 'post', + // 请求的地址 + url: 'http://localhost:8082/helloGithub_war_exploded/deleteAllLabel', + // URL 中的查询参数 + params: { + } + }).then((res)=>{ + if (res.data.code === 200) { + Vue.prototype.$notify({ + title: '成功', + message: ('i', {style: 'color: teal'}, res.data.msg), + type: 'success', + offset: 50 + }); + } else { + Vue.prototype.$notify.error({ + title: '错误', + message: res.data.msg, + offset: 50 + }); + } + }); }, searchRequest() { const params = { @@ -103,10 +98,51 @@ export default { const queryString = new URLSearchParams(params).toString(); const url = `${window.location.origin}/video/search?${queryString}`; window.open(url, '_blank'); + }, + gethistorySearch(){ + var that=this; + axios({ + method: 'post', + // 请求的地址 + url: 'http://localhost:8082/helloGithub_war_exploded/selectUserLabel', + // URL 中的查询参数 + params: { + } + }).then((res)=>{ + // console.log(res.data); + that.historySearch=res.data; + }); + }, + handleClose(tag){ + var that=this; + axios({ + method: 'post', + // 请求的地址 + url: 'http://localhost:8082/helloGithub_war_exploded/deletelabel', + // URL 中的查询参数 + params: { + tag:tag+';' + } + }).then((res)=>{ + if(res.date.code===200){ + that.$message({ + showClose: true, + message: res.date.msg, + type: 'success' + }); + }else{ + that.$message({ + showClose: true, + message: res.date.msg, + type: 'error' + }); + } + }); } }, mounted() { - this.tipsWord = this.items[0] + this.tipsWord = "helloGithub"; + this.gethistorySearch(); } }; diff --git a/src/components/Home/UserInfo.vue b/src/components/Home/UserInfo.vue new file mode 100644 index 0000000..e37090b --- /dev/null +++ b/src/components/Home/UserInfo.vue @@ -0,0 +1,49 @@ + + + + + \ No newline at end of file diff --git a/src/components/UserInfoPage.vue b/src/components/UserInfoPage.vue new file mode 100644 index 0000000..9a89d7f --- /dev/null +++ b/src/components/UserInfoPage.vue @@ -0,0 +1,15 @@ + + + + + \ No newline at end of file diff --git a/src/main.js b/src/main.js index 3f8dba4..abb9a55 100644 --- a/src/main.js +++ b/src/main.js @@ -5,13 +5,19 @@ import Element from 'element-ui' import './assets/styles/element-variables.scss' import axios from "axios"; import './assets/icon/iconfont.css' +import store from './store' axios.defaults.withCredentials=true; +import cookie from 'vue-cookie' +Vue.prototype.$cookie = cookie; + Vue.config.productionTip = false Vue.use(Element); new Vue({ router, axios, + store, + cookie, render: h => h(App) }).$mount('#app') diff --git a/src/router/index.js b/src/router/index.js index a8c5512..575da7d 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -5,6 +5,7 @@ import home from "@/components/Home/Home.vue"; import monthly from "@/components/Monthly.vue"; import ranking from "@/components/Ranking.vue"; import paper from "@/components/Paper.vue"; +import UserInfoPage from "@/components/UserInfoPage.vue"; Vue.use(VueRouter) @@ -39,6 +40,11 @@ const routes = [ name: 'paper', component: paper }, + { + path: '/UserInfoPage', + name: 'UserInfoPage', + component: UserInfoPage + }, ] } diff --git a/src/store/index.js b/src/store/index.js new file mode 100644 index 0000000..583d20b --- /dev/null +++ b/src/store/index.js @@ -0,0 +1,21 @@ +import Vue from 'vue' +import Vuex from 'vuex' + +Vue.use(Vuex) + +export default new Vuex.Store({ + state: { + // CookieUserName:"" + }, + getters: { + }, + mutations: { + // saveCookieUserName(state,userName){ + // state.pathName = userName; + // }, + }, + actions: { + }, + modules: { + } +})