From 6ea2efd28a5c2f5b5ca8b4dd0af056b2c6efb0ec Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 26 Dec 2022 09:18:08 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/srs-police-affairs
---
public/img/bg/login-bg.png | 0
src/router/page/index.js | 10
src/views/lyout/index.vue | 99 ++++
public/img/bg/login-content-bg.png | 0
src/styles/media/index.scss | 633 ++++++++++++++++++++------
package-lock.json | 22
src/views/login/index.vue | 342 ++++++++++++++
src/router/axios.js | 48 +-
public/img/bg/right-bottom.png | 0
src/utils/auth.js | 19
public/img/bg/editLogin.webp | 0
public/img/bg/group13@2x.png | 0
src/views/house/index.vue | 168 ++++++
public/img/bg/group16@2x.png | 0
public/img/bg/group16@2x(1).png | 0
public/img/bg/left-top.png | 0
public/img/bg/b-t.png | 0
public/img/bg/login_title@2x.png | 0
package.json | 18
public/img/bg/rectangle11@2x.png | 0
public/img/bg/left-bottom.png | 0
public/img/bg/right-top.png | 0
public/img/bg/echarts-content.png | 0
public/img/bg/echarts-title.png | 0
24 files changed, 1,146 insertions(+), 213 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index f0775ba..f2eee74 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -22,8 +22,10 @@
"element-ui": "^2.15.6",
"flv.js": "^1.6.2",
"font-awesome": "^4.7.0",
+ "js-md5": "^0.7.3",
"lib-flexible": "^0.3.2",
"moment": "^2.29.1",
+ "nprogress": "^0.2.0",
"postcss-px-to-viewport": "^1.1.1",
"postcss-px2rem": "^0.3.0",
"px2rem-loader": "^0.1.9",
@@ -10322,6 +10324,11 @@
"resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz",
"integrity": "sha512-pZe//GGmwJndub7ZghVHz7vjb2LgC1m8B07Au3eYqeqv9emhESByMXxaEgkUkEqJe87oBbSniGYoQNIBklc7IQ=="
},
+ "node_modules/js-md5": {
+ "version": "0.7.3",
+ "resolved": "https://registry.npmmirror.com/js-md5/-/js-md5-0.7.3.tgz",
+ "integrity": "sha512-ZC41vPSTLKGwIRjqDh8DfXoCrdQIyBgspJVPXHBGu4nZlAEvG3nf+jO9avM9RmLiGakg7vz974ms99nEV0tmTQ=="
+ },
"node_modules/js-message": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
@@ -11374,6 +11381,11 @@
"engines": {
"node": ">=4"
}
+ },
+ "node_modules/nprogress": {
+ "version": "0.2.0",
+ "resolved": "https://registry.npmmirror.com/nprogress/-/nprogress-0.2.0.tgz",
+ "integrity": "sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA=="
},
"node_modules/nth-check": {
"version": "2.1.1",
@@ -26310,6 +26322,11 @@
"resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz",
"integrity": "sha512-pZe//GGmwJndub7ZghVHz7vjb2LgC1m8B07Au3eYqeqv9emhESByMXxaEgkUkEqJe87oBbSniGYoQNIBklc7IQ=="
},
+ "js-md5": {
+ "version": "0.7.3",
+ "resolved": "https://registry.npmmirror.com/js-md5/-/js-md5-0.7.3.tgz",
+ "integrity": "sha512-ZC41vPSTLKGwIRjqDh8DfXoCrdQIyBgspJVPXHBGu4nZlAEvG3nf+jO9avM9RmLiGakg7vz974ms99nEV0tmTQ=="
+ },
"js-message": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
@@ -27203,6 +27220,11 @@
"path-key": "^2.0.0"
}
},
+ "nprogress": {
+ "version": "0.2.0",
+ "resolved": "https://registry.npmmirror.com/nprogress/-/nprogress-0.2.0.tgz",
+ "integrity": "sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA=="
+ },
"nth-check": {
"version": "2.1.1",
"resolved": "https://registry.npmmirror.com/nth-check/-/nth-check-2.1.1.tgz",
diff --git a/package.json b/package.json
index 3cdc28c..046b7cc 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,11 @@
},
"dependencies": {
"@dvgis/dc-sdk": "^2.16.2",
+ "@fullcalendar/core": "^5.10.1",
+ "@fullcalendar/daygrid": "^5.10.1",
+ "@fullcalendar/interaction": "^5.10.1",
+ "@fullcalendar/timegrid": "^5.10.1",
+ "@fullcalendar/vue": "^5.10.1",
"@turf/turf": "^6.5.0",
"axios": "^0.22.0",
"core-js": "^3.6.5",
@@ -17,23 +22,20 @@
"element-ui": "^2.15.6",
"flv.js": "^1.6.2",
"font-awesome": "^4.7.0",
+ "js-md5": "^0.7.3",
"lib-flexible": "^0.3.2",
+ "moment": "^2.29.1",
+ "nprogress": "^0.2.0",
"postcss-px-to-viewport": "^1.1.1",
"postcss-px2rem": "^0.3.0",
"px2rem-loader": "^0.1.9",
"qs.js": "^0.1.12",
+ "tippy.js": "^6.3.7",
"vue": "^2.6.11",
"vue-axios": "^3.3.7",
"vue-router": "^3.2.0",
"vue-seamless-scroll": "^1.1.23",
- "vuex": "^3.4.0",
- "@fullcalendar/core": "^5.10.1",
- "@fullcalendar/daygrid": "^5.10.1",
- "@fullcalendar/interaction": "^5.10.1",
- "@fullcalendar/timegrid": "^5.10.1",
- "@fullcalendar/vue": "^5.10.1",
- "moment": "^2.29.1",
- "tippy.js": "^6.3.7"
+ "vuex": "^3.4.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.15",
diff --git a/public/img/bg/b-t.png b/public/img/bg/b-t.png
new file mode 100644
index 0000000..854450e
--- /dev/null
+++ b/public/img/bg/b-t.png
Binary files differ
diff --git a/public/img/bg/echarts-content.png b/public/img/bg/echarts-content.png
new file mode 100644
index 0000000..489c7ef
--- /dev/null
+++ b/public/img/bg/echarts-content.png
Binary files differ
diff --git a/public/img/bg/echarts-title.png b/public/img/bg/echarts-title.png
new file mode 100644
index 0000000..198e6cb
--- /dev/null
+++ b/public/img/bg/echarts-title.png
Binary files differ
diff --git a/public/img/bg/editLogin.webp b/public/img/bg/editLogin.webp
new file mode 100644
index 0000000..f677b0d
--- /dev/null
+++ b/public/img/bg/editLogin.webp
Binary files differ
diff --git a/public/img/bg/group13@2x.png b/public/img/bg/group13@2x.png
new file mode 100644
index 0000000..46cd0c1
--- /dev/null
+++ b/public/img/bg/group13@2x.png
Binary files differ
diff --git "a/public/img/bg/group16@2x\0501\051.png" "b/public/img/bg/group16@2x\0501\051.png"
new file mode 100644
index 0000000..4daa1b4
--- /dev/null
+++ "b/public/img/bg/group16@2x\0501\051.png"
Binary files differ
diff --git a/public/img/bg/group16@2x.png b/public/img/bg/group16@2x.png
new file mode 100644
index 0000000..b994d86
--- /dev/null
+++ b/public/img/bg/group16@2x.png
Binary files differ
diff --git a/public/img/bg/left-bottom.png b/public/img/bg/left-bottom.png
new file mode 100644
index 0000000..9f08ca1
--- /dev/null
+++ b/public/img/bg/left-bottom.png
Binary files differ
diff --git a/public/img/bg/left-top.png b/public/img/bg/left-top.png
new file mode 100644
index 0000000..3631075
--- /dev/null
+++ b/public/img/bg/left-top.png
Binary files differ
diff --git a/public/img/bg/login-bg.png b/public/img/bg/login-bg.png
new file mode 100644
index 0000000..b6f6bd7
--- /dev/null
+++ b/public/img/bg/login-bg.png
Binary files differ
diff --git a/public/img/bg/login-content-bg.png b/public/img/bg/login-content-bg.png
new file mode 100644
index 0000000..684c716
--- /dev/null
+++ b/public/img/bg/login-content-bg.png
Binary files differ
diff --git a/public/img/bg/login_title@2x.png b/public/img/bg/login_title@2x.png
new file mode 100644
index 0000000..b488434
--- /dev/null
+++ b/public/img/bg/login_title@2x.png
Binary files differ
diff --git a/public/img/bg/rectangle11@2x.png b/public/img/bg/rectangle11@2x.png
new file mode 100644
index 0000000..c46923e
--- /dev/null
+++ b/public/img/bg/rectangle11@2x.png
Binary files differ
diff --git a/public/img/bg/right-bottom.png b/public/img/bg/right-bottom.png
new file mode 100644
index 0000000..8886ab3
--- /dev/null
+++ b/public/img/bg/right-bottom.png
Binary files differ
diff --git a/public/img/bg/right-top.png b/public/img/bg/right-top.png
new file mode 100644
index 0000000..1147690
--- /dev/null
+++ b/public/img/bg/right-top.png
Binary files differ
diff --git a/src/router/axios.js b/src/router/axios.js
index f388211..663b141 100644
--- a/src/router/axios.js
+++ b/src/router/axios.js
@@ -14,6 +14,8 @@
* isToken是否需要token
*/
import axios from 'axios'
+import router from '@/router/page/index.js'
+import { Message } from 'element-ui'
// 获取公共配置域名
@@ -30,11 +32,11 @@
// baseURL: 'http://192.168.0.115:82',
// baseURL: 'http://192.168.0.112:18080',
- // baseURL: 'http://192.168.0.112:9091',
+ baseURL: 'http://192.168.0.112:9091',
// baseURL: 'http://192.168.0.106:1888/api',
// 内网部署地址
- baseURL: 'http://10.141.11.11:82',
+ // baseURL: 'http://10.141.11.11:82',
timeout: 600000 // request timeout
})
@@ -75,28 +77,26 @@
)
// http response 拦截
-// service.interceptors.response.use(
-// (res) => {
-// const code = res.data.code
+service.interceptors.response.use(
+ (res) => {
+ // console.log(res, 12569)
+ const code = res.data.code
+ if (code == 403 && res.data.data == 'token 验证失败!') {
+ // sessionStorage.removeItem('token')
+ router.push('/login')
+ } else {
+ return res
+ }
+ },
+ (error) => {
+ Message({
+ message: error.message,
+ type: 'error',
+ duration: 5 * 1000
+ })
-// // console.log(code, 555)
-
-// if (code == 403 && res.data.data == 'token 验证失败!') {
-// sessionStorage.removeItem('token')
-// router.push('/login')
-// } else {
-// return res
-// }
-// },
-// (error) => {
-// Message({
-// message: error.message,
-// type: 'error',
-// duration: 5 * 1000
-// })
-
-// return Promise.reject(new Error(error))
-// }
-// )
+ return Promise.reject(new Error(error))
+ }
+)
export default service
diff --git a/src/router/page/index.js b/src/router/page/index.js
index 03a3369..cca9aeb 100644
--- a/src/router/page/index.js
+++ b/src/router/page/index.js
@@ -17,9 +17,19 @@
const videoList = () => import('../../views/video/list.vue')
const videoRegion = () => import('../../views/video/region.vue')
const activity = () => import('../../views/activity/index.vue')
+const login = () => import('../../views/login/index.vue')
const routes = [
{
+ path: '/login',
+ name: 'login',
+ component: resolve => require(['../../views/login/index.vue'], resolve),
+ meta: {
+ title: '登录页',
+ isAuth: false
+ }
+ },
+ {
path: '/',
redirect: '/lyout'
},
diff --git a/src/styles/media/index.scss b/src/styles/media/index.scss
index 43d068d..5c61877 100644
--- a/src/styles/media/index.scss
+++ b/src/styles/media/index.scss
@@ -40,22 +40,22 @@
border-top: countSizeVh(14) solid transparent;
top: countSizeVh(28);
left: countSizeVw(72, 1920);
-
+
div {
height: countSizeVh(36);
line-height: countSizeVh(36);
font-size: countSizeVh(16);
}
-
+
div:first-child {
padding-top: countSizeVh(10);
}
-
+
div:last-child {
padding-bottom: countSizeVh(10);
}
}
-
+
}
}
}
@@ -91,7 +91,116 @@
height: countSizeVh(58);
line-height: countSizeVh(58);
font-size: countSizeVh(16);
+
+ .title-num {
+ font-size: countSizeVh(16);
+ }
+
+ .timer {
+ width: countSizeVw(250, 1920);
+ height: countSizeVh(30);
+
+ .el-range-editor.el-input__inner {
+ width: 100% !important;
+ height: countSizeVh(32);
+ }
+
+ .el-range-editor .el-range-input {
+ font-size: countSizeVh(14);
+ height: countSizeVh(32);
+ line-height: countSizeVh(32);
+ }
+
+ .el-icon-date:before {
+ font-size: countSizeVh(14);
+ }
+
+ .el-date-editor .el-range__icon {
+ line-height: countSizeVh(32);
+ height: countSizeVh(32);
+ margin-left: countSizeVw(4, 1920);
+ }
+
+ .el-date-editor .el-range-separator {
+ height: countSizeVh(32);
+ line-height: countSizeVh(32);
+ font-size: countSizeVh(14);
+ }
+
+ .el-select {
+ height: countSizeVh(32);
+ }
+
+ .el-input--suffix .el-input__inner {
+ height: countSizeVh(32);
+ font-size: countSizeVh(14);
+ padding-left: countSizeVw(10, 1920);
+ }
+
+ .el-select .el-input .el-select__caret {
+ font-size: countSizeVh(14);
+ line-height: countSizeVh(32);
+ }
+ }
+
+ .legend {
+ width: calc(100% - countSizeVw(36, 1920));
+
+ ul {
+ li {
+ margin-right: countSizeVw(10, 1920);
+
+ div {
+ width: countSizeVw(20, 1920);
+ border-radius: countSizeVh(4);
+ margin-top: countSizeVh(5);
+ margin-right: countSizeVw(2, 1920);
+ }
+ }
+ }
+ }
}
+
+ .table-box {
+ .el-checkbox__inner {
+ width: countSizeVh(20);
+ height: countSizeVh(20);
+ }
+
+ .el-checkbox__label {
+ font-size: countSizeVh(16) !important;
+ }
+
+ .el-table__header-wrapper {
+ height: countSizeVh(48);
+
+ .el-table__header {
+ height: 100%;
+ }
+ }
+
+ .el-table .el-table__cell {
+ padding: 0;
+ }
+
+ .el-table th.el-table__cell {
+ height: 100%;
+ }
+
+ .el-table .cell {
+ line-height: countSizeVh(48);
+ font-size: countSizeVh(16);
+ }
+
+ .el-table th.el-table__cell>.cell {
+ height: 100%;
+ }
+
+ .el-table__empty-text {
+ font-size: countSizeVh(16);
+ }
+ }
+
.sub-title {
line-height: countSizeVh(36);
@@ -100,7 +209,8 @@
.sub-tab {
padding: countSizeVh(10);
- .tab {
+ .tab,
+ .tab3 {
&>div {
height: countSizeVh(22);
@@ -130,10 +240,71 @@
left: countSizeVw(400, 1920);
width: calc(100% - countSizeVw(400, 1920) * 2);
height: countSizeVh(320);
+
+ .header {
+ height: countSizeVh(56);
+
+ .bottom-title {
+ left: countSizeVw(18, 1920);
+ height: countSizeVh(56);
+ line-height: countSizeVh(56);
+ font-size: countSizeVh(16);
+ letter-spacing: countSizeVw(2, 1920);
+ }
+
+ .timeTab {
+ top: countSizeVh(22);
+ right: countSizeVw(12, 1920);
+ border-radius: countSizeVh(6);
+
+ span {
+ padding: 0 countSizeVw(10, 1920);
+ height: countSizeVh(26);
+ line-height: countSizeVh(26);
+ }
+ }
+
+ .history-tab {
+ top: countSizeVh(22);
+ right: countSizeVw(96, 1920);
+ border-radius: countSizeVh(6);
+
+ span {
+ padding: 0 countSizeVw(10, 1920);
+ height: countSizeVh(26);
+ line-height: countSizeVh(26);
+ }
+ }
+ }
+
+ .body {
+ margin: countSizeVh(12);
+ margin-top: countSizeVh(10);
+ margin-bottom: countSizeVh(14);
+ width: calc(100% - countSizeVw(24, 1920));
+ height: calc(100% - countSizeVh(80));
+
+ .warp {
+ height: calc(100% - countSizeVh(44));
+ }
+
+ ul {
+ li {
+ height: countSizeVh(44);
+ line-height: countSizeVh(44);
+ }
+ }
+ }
}
.region-select {
top: countSizeVh(20);
+ width: countSizeVw(640, 1920);
+ height: countSizeVh(36);
+
+ .selects-container .selects-box .text {
+ font-size: countSizeVh(15);
+ }
}
.center-container {
@@ -142,18 +313,27 @@
.layers-control-btn {
width: countSizeVw(96, 1920);
height: countSizeVh(40);
- border-radius: countSizeVh(20)
+ border-radius: countSizeVh(20);
+
+ .el-checkbox .el-checkbox__label {
+ font-size: countSizeVh(16);
+ }
+
+ .el-checkbox .el-checkbox__inner {
+ width: countSizeVh(20);
+ height: countSizeVh(20);
+
+ }
+
+ .el-checkbox .el-checkbox__inner::after {
+ height: countSizeVh(12);
+ left: countSizeVw(7, 1920);
+ }
}
}
- .el-checkbox__inner {
- width: countSizeVh(20);
- height: countSizeVh(20);
- }
- .el-checkbox__label {
- font-size: countSizeVh(16) !important;
- }
+
}
.house-page {
@@ -171,6 +351,13 @@
font-size: countSizeVh(24);
border: countSizeVh(1) solid rgb(0, 92, 169);
border-radius: 0 countSizeVh(20) countSizeVh(20) 0;
+ }
+
+ .el-input__inner {
+ height: countSizeVh(40);
+ line-height: countSizeVh(40);
+ padding: 0 countSizeVw(15, 1920);
+ border-radius: countSizeVh(4);
}
}
@@ -218,6 +405,7 @@
&>div {
padding: 0 countSizeVw(10, 1920);
+ font-size: countSizeVh(16);
.l {
width: countSizeVw(80, 1920);
@@ -267,7 +455,7 @@
width: countSizeVw(20, 1920);
height: countSizeVh(60);
padding-top: countSizeVh(12);
-
+
i {
font-size: countSizeVh(30);
margin-left: countSizeVw(-5, 1920);
@@ -302,35 +490,35 @@
.ridgepole-info {
.content {
- & > div {
+ &>div {
height: countSizeVh(26);
line-height: countSizeVh(26);
border-right: countSizeVh(1) solid #50555f;
-
- & > div:last-child {
- margin-left: countSizeVw(14,1920);
+
+ &>div:last-child {
+ margin-left: countSizeVw(14, 1920);
font-size: countSizeVh(18);
}
}
}
}
-
+
.people-info {
.content {
.two {
margin-top: countSizeVh(16);
}
-
+
.one,
.two {
- & > div {
- & > div:first-child {
+ &>div {
+ &>div:first-child {
height: countSizeVh(30);
line-height: countSizeVh(30);
font-size: countSizeVh(18);
}
-
- & > div:last-child {
+
+ &>div:last-child {
height: countSizeVh(26);
line-height: countSizeVh(26);
}
@@ -338,20 +526,21 @@
}
}
}
-
+
.house-info {
.content {
- & > div {
- & > div:first-child {
+ &>div {
+ &>div:first-child {
height: countSizeVh(30);
line-height: countSizeVh(30);
font-size: countSizeVh(18);
}
}
}
+
border-bottom: countSizeVh(1) dashed #ccc;
}
-
+
.ridgepole-info,
.people-info,
.house-info {
@@ -359,41 +548,47 @@
height: countSizeVh(40);
line-height: countSizeVh(40);
}
-
+
.content {
padding: countSizeVh(10) 0;
}
}
-
+
.house-element-info {
+
.condo,
.legend {
height: countSizeVh(36);
-
+
.type {
- width: countSizeVw(80,1920);
+ width: countSizeVw(80, 1920);
}
-
+
.type-select {
- margin-left: countSizeVw(20,1920);
-
+ margin-left: countSizeVw(20, 1920);
+
:deep(.el-input--suffix .el-input__inner) {
- padding-right: countSizeVw(54,1920);
+ padding-right: countSizeVw(54, 1920);
}
- .el-input--small{
+
+ .el-input--small {
font-size: countSizeVh(18);
}
- .el-select:hover .el-input__inner{
+
+ .el-select:hover .el-input__inner {
height: countSizeVh(36);
}
+
.el-input--small .el-input__inner {
height: countSizeVh(36);
}
- .el-input__suffix{
+
+ .el-input__suffix {
height: countSizeVh(36);
- margin-right: countSizeVw(6,1920);
- .el-icon-arrow-up:before{
+ margin-right: countSizeVw(6, 1920);
+
+ .el-icon-arrow-up:before {
font-size: countSizeVh(18);
height: countSizeVh(36);
line-height: countSizeVh(36);
@@ -401,191 +596,192 @@
}
}
}
-
+
.type-val {
- & > div {
- & > span {
- margin: 0 countSizeVw(10,1920);
- width: countSizeVw(14,1920);
+ &>div {
+ &>span {
+ margin: 0 countSizeVw(10, 1920);
+ width: countSizeVw(14, 1920);
height: countSizeVh(8);
}
+
.chuzu {
border: countSizeVh(1) solid #348b3a;
}
+
.zizhu {
border: countSizeVh(1) solid #2c77bb;
}
+
.kongzhi {
border: countSizeVh(1) solid #5c6169;
}
+
.shangye {
border: countSizeVh(1) solid #cc9456;
}
}
}
}
-
+
.floor-outBox {
height: countSizeVh(26);
margin-top: countSizeVh(9);
-
+
.floorBtn {
- left: countSizeVw(30,1920);
+ left: countSizeVw(30, 1920);
top: -countSizeVh(2);
- width: countSizeVw(20,1920);
+ width: countSizeVw(20, 1920);
height: countSizeVh(26);
-
+
i {
font-size: countSizeVh(30);
- margin-left: -countSizeVw(5,1920);
+ margin-left: -countSizeVw(5, 1920);
}
}
-
+
.rightFloorBtn {
- left: countSizeVw(350,1920);
+ left: countSizeVw(350, 1920);
}
-
+
.floor-box {
- width: countSizeVw(252,1920);
+ width: countSizeVw(252, 1920);
height: countSizeVh(26);
- left: countSizeVw(67,1920);
-
+ left: countSizeVw(67, 1920);
+
.floor-num {
- width: countSizeVw(504,1920);
+ width: countSizeVw(504, 1920);
left: 0;
- & > div {
- margin: 0 countSizeVw(4,1920);
- width: countSizeVw(84,1920);
+ &>div {
+ margin: 0 countSizeVw(4, 1920);
+ width: countSizeVw(84, 1920);
height: countSizeVh(26);
border-radius: countSizeVh(13);
}
-
- & > .on {
+
+ &>.on {
border: countSizeVh(1) solid orange;
}
}
}
}
-
+
.floor-detail {
margin-top: countSizeVh(14);
height: countSizeVh(220);
-
- & > div {
+
+ &>div {
margin: countSizeVh(8);
height: countSizeVh(36);
line-height: countSizeVh(36);
-
+
.title {
- width: countSizeVw(50,1920);
+ width: countSizeVw(50, 1920);
}
-
+
.detail {
- & > div {
- margin: 0 countSizeVw(4,1920);
- width: countSizeVw(68,1920);
+ &>div {
+ margin: 0 countSizeVw(4, 1920);
+ width: countSizeVw(68, 1920);
height: countSizeVh(36);
border: countSizeVh(1) solid #ccc;
-
+
.flow,
.focus,
.warning {
- right: countSizeVw(4,1920);
- width: countSizeVw(6,1920);
+ right: countSizeVw(4, 1920);
+ width: countSizeVw(6, 1920);
height: countSizeVh(6);
}
-
+
.flow {
top: calc((100% - countSizeVh(18)) / 4);
}
-
+
.focus {
- top: calc(
- (100% - countSizeVh(18)) / 4 * 2 + countSizeVh(6)
- );
+ top: calc((100% - countSizeVh(18)) / 4 * 2 + countSizeVh(6));
}
-
+
.warning {
- top: calc(
- (100% - countSizeVh(18)) / 4 * 3 + countSizeVh(12)
- );
+ top: calc((100% - countSizeVh(18)) / 4 * 3 + countSizeVh(12));
}
}
-
- & > .chuzu {
+
+ &>.chuzu {
border: countSizeVh(1) solid #3a8b3a;
}
-
- & > .zizhu {
+
+ &>.zizhu {
border: countSizeVh(1) solid #2c77bb;
}
-
- & > .kongzhi {
+
+ &>.kongzhi {
border: countSizeVh(1) solid #5c6169;
}
-
- & > .shangye {
+
+ &>.shangye {
border: countSizeVh(1) solid #cc9456;
}
}
}
}
}
-
+
}
}
.police-info {
.tableClass {
- width: countSizeVw(600,1920);
+ width: countSizeVw(600, 1920);
height: countSizeVh(400);
}
-
+
.tableClass th,
.tableClass td {
- width: countSizeVw(200,1920);
+ width: countSizeVw(200, 1920);
}
}
}
}
+
.search-content {
- left: countSizeVw(760, 1920);
+ left: countSizeVw(760, 1920);
top: countSizeVh(40);
- width: countSizeVh(460);
+ width: countSizeVw(460, 1920);
height: countSizeVh(36);
-
+
input {
- width: calc(100% - countSizeVw(80, 1920));
+ width: countSizeVw(380, 1920);
font-size: countSizeVh(18);
border: countSizeVh(1) solid rgb(0, 92, 169);
border-radius: countSizeVh(20) 0 0 countSizeVh(20);
// vertical-align: top;
}
-
+
button {
font-size: countSizeVh(24);
- width: countSizeVw(80, 1920);
+ width: countSizeVw(80, 1920);
border: countSizeVh(1) solid rgb(0, 92, 169);
border-radius: 0 countSizeVh(20) countSizeVh(20) 0;
}
-
+
button:active {
border: countSizeVh(1) solid rgb(0, 92, 169);
}
}
.searchExtensively-val-box {
- top: countSizeVh(80);
- left: countSizeVw(760,1920);
- width: countSizeVw(314,1920);
- max-height: countSizeVh(200);
- border-radius: countSizeVh(10);
-
- & > div {
+ top: countSizeVh(80);
+ left: countSizeVw(760, 1920);
+ width: countSizeVw(380, 1920);
+ max-height: countSizeVh(400);
+ border-radius: countSizeVh(10);
+
+ &>div {
div {
- padding: 0 countSizeVw(10,1920);
- line-height: countSizeVh(36);
+ padding: 0 countSizeVw(10, 1920);
+ line-height: countSizeVh(36);
}
}
}
@@ -702,9 +898,9 @@
.el-table__header {
height: 100%;
-
}
}
+
.el-table .el-table__cell {
padding: 0;
}
@@ -804,7 +1000,8 @@
.draw-btn {
margin: countSizeVh(8) countSizeVw(8, 1920);
height: countSizeVh(26);
- .el-button--mini{
+
+ .el-button--mini {
font-size: countSizeVh(16);
padding: countSizeVh(8) 0;
border-radius: countSizeVh(4);
@@ -961,12 +1158,12 @@
.el-table__header-wrapper {
height: countSizeVh(48);
-
+
.el-table__header {
height: 100%;
}
}
-
+
.el-table .el-table__cell {
padding: 0;
}
@@ -974,16 +1171,16 @@
.el-table th.el-table__cell {
height: 100%;
}
-
+
.el-table .cell {
line-height: countSizeVh(48);
font-size: countSizeVh(16);
}
-
+
.el-table th.el-table__cell>.cell {
height: 100%;
}
-
+
.el-table__empty-text {
font-size: countSizeVh(16);
}
@@ -994,20 +1191,20 @@
&>div {
display: flex;
align-items: center;
-
+
&>button {
width: countSizeVh(32);
height: countSizeVh(32);
-
+
&>i {
font-size: countSizeVh(16);
}
}
-
+
&>ul {
display: flex;
align-items: center;
-
+
li {
width: countSizeVh(32);
height: countSizeVh(32);
@@ -1017,7 +1214,7 @@
}
}
-
+
}
}
}
@@ -1045,7 +1242,8 @@
width: countSizeVw(88, 1920);
font-size: countSizeVh(16);
}
- .category-value{
+
+ .category-value {
.category-input {
width: 80%;
height: countSizeVh(32);
@@ -1053,7 +1251,7 @@
border: countSizeVh(1) solid rgb(0, 92, 169);
border-radius: countSizeVh(5) 0 0 countSizeVw(5, 1920);
}
-
+
.category-button {
font-size: countSizeVh(20);
// width: countSizeVw(60, 1920);
@@ -1062,54 +1260,56 @@
border: countSizeVh(1) solid rgb(0, 92, 169);
border-radius: 0 countSizeVw(5, 1920) countSizeVh(5) 0;
}
-
+
.category-button:active {
border: countSizeVh(1) solid rgb(0, 92, 169);
}
- .el-range-editor.el-input__inner{
- width: 100%!important;
+ .el-range-editor.el-input__inner {
+ width: 100% !important;
height: countSizeVh(32);
}
- .el-range-editor .el-range-input{
+ .el-range-editor .el-range-input {
font-size: countSizeVh(14);
height: countSizeVh(32);
line-height: countSizeVh(32);
}
- .el-icon-date:before{
+ .el-icon-date:before {
font-size: countSizeVh(14);
}
- .el-date-editor .el-range__icon{
- line-height: countSizeVh(32);
- height: countSizeVh(32);
- margin-left: countSizeVw(4, 1920);
+ .el-date-editor .el-range__icon {
+ line-height: countSizeVh(32);
+ height: countSizeVh(32);
+ margin-left: countSizeVw(4, 1920);
}
- .el-date-editor .el-range-separator{
- height: countSizeVh(32);
- line-height: countSizeVh(32);
- font-size: countSizeVh(14);
+ .el-date-editor .el-range-separator {
+ height: countSizeVh(32);
+ line-height: countSizeVh(32);
+ font-size: countSizeVh(14);
}
.el-select {
width: 100%;
height: countSizeVh(32);
}
- .el-input--suffix .el-input__inner{
+
+ .el-input--suffix .el-input__inner {
height: countSizeVh(32);
font-size: countSizeVh(14);
padding-left: countSizeVw(10, 1920);
}
- .el-select .el-input .el-select__caret{
+
+ .el-select .el-input .el-select__caret {
font-size: countSizeVh(14);
line-height: countSizeVh(32);
}
}
-
+
}
}
@@ -1196,26 +1396,30 @@
.second-container {
top: countSizeVh(10);
width: countSizeVw(240, 1920);
-
- .el-tree-node__content{
+
+ .el-tree-node__content {
height: countSizeVh(30);
font-size: countSizeVh(16);
}
- .el-tree-node__label{
+
+ .el-tree-node__label {
font-size: countSizeVh(16);
}
- .el-checkbox .el-checkbox__inner{
+
+ .el-checkbox .el-checkbox__inner {
height: countSizeVh(20);
width: countSizeVh(20);
border-radius: countSizeVh(2);
}
- .el-tree-node__expand-icon{
+
+ .el-tree-node__expand-icon {
font-size: countSizeVh(16);
}
- .el-checkbox .el-checkbox__inner::after{
+
+ .el-checkbox .el-checkbox__inner::after {
height: countSizeVh(16);
- left:countSizeVw(7, 1920);
+ left: countSizeVw(7, 1920);
}
}
@@ -1271,7 +1475,7 @@
}
- .flexible-btn{
+ .flexible-btn {
font-size: countSizeVh(24);
}
@@ -1386,40 +1590,151 @@
bottom: countSizeVh(154);
}
}
+
+ .auth-page {
+ .loginTitle {
+ font-size: countSizeVh(46);
+ letter-spacing: countSizeVh(6);
+ }
+
+ .login_content {
+ width: countSizeVw(300, 1920);
+ padding: countSizeVh(30);
+ background-size: 100% 100%, countSizeVh(25), countSizeVh(25), countSizeVh(25), countSizeVh(25);
+
+ p {
+ font-size: countSizeVh(26);
+ margin-bottom: countSizeVh(15);
+ letter-spacing: countSizeVh(4);
+ }
+
+ .el-button--primary {
+ height: countSizeVh(34);
+ border-radius: countSizeVh(2);
+ }
+
+ .el-button {
+ height: countSizeVh(34);
+ line-height: countSizeVh(24);
+ font-size: countSizeVh(14);
+ }
+
+ .el-input__inner,
+ .el-input__icon {
+ font-size: countSizeVh(14);
+ line-height: countSizeVh(34);
+ }
+
+ .el-input__inner {
+ height: countSizeVh(34);
+ }
+
+ .el-input__prefix {
+ left: countSizeVw(5, 1920);
+ }
+
+ .el-input--prefix .el-input__inner {
+ padding-left: countSizeVw(30, 1920);
+ }
+ }
+ }
}
- .option-css,.activity-option,.unit-option{
+
+ .option-css,
+ .activity-option,
+ .unit-option {
height: countSizeVh(40);
line-height: countSizeVh(40);
font-size: countSizeVh(16);
}
- .option-css:hover,.option-css.selected {
+
+ .option-css:hover,
+ .option-css.selected {
color: #409EFF;
}
+
.option-css:hover {
- background-color:rgba(0, 92, 169, 0.3) !important;
+ background-color: rgba(0, 92, 169, 0.3) !important;
}
+
.el-select-dropdown__wrap {
max-height: countSizeVh(200);
}
- .el-picker-panel{
- width: countSizeVw(536, 1920)!important;
+
+ .el-picker-panel {
+ width: countSizeVw(536, 1920) !important;
}
- .el-date-range-picker__header div{
+
+ .el-date-range-picker__header div {
font-size: countSizeVh(16);
height: countSizeVh(36);
line-height: countSizeVh(36);
}
+
.el-picker-panel .el-date-range-picker__header button {
font-size: countSizeVh(16);
height: countSizeVh(36);
line-height: countSizeVh(36);
}
- .el-date-table td span,.el-date-table th{
+
+ .el-date-table td span,
+ .el-date-table th {
font-size: countSizeVh(16);
}
- .el-date-table tr{
+
+ .el-date-table tr {
height: countSizeVh(22);
}
+
+ .el-picker-panel__sidebar {
+ width: countSizeVw(110, 1920);
+ }
+
+ .el-picker-panel__shortcut {
+ font-size: countSizeVh(14);
+ height: countSizeVh(32);
+ }
+
+ .el-picker-panel [slot=sidebar]+.el-picker-panel__body,
+ .el-picker-panel__sidebar+.el-picker-panel__body {
+ margin-left: countSizeVw(110, 1920);
+ }
+
+ .tree-search-popup {
+ top: countSizeVh(135) !important;
+ left: countSizeVw(0, 1920) !important;
+
+ }
+
+ .el-popover {
+ min-width: countSizeVw(150, 1920);
+ padding: countSizeVh(12);
+ border-radius: countSizeVh(4);
+ font-size: countSizeVh(14);
+
+ .el-input {
+ font-size: countSizeVh(14);
+ }
+
+ .el-tree {
+ height: countSizeVh(360) !important;
+ width: countSizeVw(400, 1920) !important;
+
+ .el-tree-node__content {
+ height: countSizeVh(26);
+ }
+
+ .el-tree-node__expand-icon {
+ font-size: countSizeVh(12);
+ }
+
+ .el-tree-node__label {
+ font-size: countSizeVh(14);
+
+ }
+
+ }
+ }
}
}
diff --git a/src/utils/auth.js b/src/utils/auth.js
new file mode 100644
index 0000000..4191e45
--- /dev/null
+++ b/src/utils/auth.js
@@ -0,0 +1,19 @@
+/*
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2022-07-28 17:50:14
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2022-08-05 11:45:20
+ * @FilePath: \zhny-dsj\src\utils\auth.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+export const getToken = () => {
+ return window.sessionStorage.getItem('token')
+}
+
+export const setToken = token => {
+ return window.sessionStorage.setItem('token', token)
+}
+
+export const removeToken = () => {
+ return window.sessionStorage.removeItem('token')
+}
diff --git a/src/views/house/index.vue b/src/views/house/index.vue
index 2c022e5..a02aaf5 100644
--- a/src/views/house/index.vue
+++ b/src/views/house/index.vue
@@ -2,7 +2,7 @@
* @Author: shuishen 1109946754@qq.com
* @Date: 2022-08-18 16:18:17
* @LastEditors: shuishen 1109946754@qq.com
- * @LastEditTime: 2022-12-19 16:51:19
+ * @LastEditTime: 2022-12-26 09:17:46
* @FilePath: \srs-police-affairs\src\views\house\index.vue
* @Description: 小区-栋-层-房屋
*
@@ -35,8 +35,8 @@
<div>
<div @click="searchVlaClick(item)" v-for="(item, index) in searchArray" :key="index">
{{
- item.name
- }}
+ item.name
+}}
</div>
</div>
</div>
@@ -97,8 +97,8 @@
<div v-for="(item, index) in buildingList.slice((index - 1) * 10, index * 10)"
:key="index" @click="buildingClick(item)"
:class="{ on: buildingChoosed.name == item.name }" :title="item.name">{{
- item.name
- }}</div>
+ item.name
+}}</div>
</div>
</div>
</div>
@@ -186,7 +186,7 @@
<div class="type-select">
<el-select size="small" v-model="unitValue" placeholder="请选择" @change="chooseUnit">
<el-option v-for="item in unitOptions" :key="item.value" :label="item.label"
- :value="item.value"></el-option>
+ :value="item.value" class="unit-option"></el-option>
</el-select>
</div>
</div>
@@ -214,19 +214,19 @@
<div class="type">房屋图例</div>
<div class="type-val">
<div>
- <span style="width: 14px; height: 8px; border: 1px solid #3A8B3A;"></span>
+ <span class="chuzu"></span>
出租
</div>
<div>
- <span style="width: 14px; height: 8px; border: 1px solid #2C77BB;"></span>
+ <span class="zizhu"></span>
自住
</div>
<div>
- <span style="width: 14px; height: 8px; border: 1px solid #5C6169;"></span>
+ <span class="kongzhi"></span>
空置
</div>
<div>
- <span style="width: 14px; height: 8px; border: 1px solid #CC9456;"></span>
+ <span class="shangye"></span>
商业
</div>
</div>
@@ -240,10 +240,10 @@
<div :class="{ on: floorsType == index }" @click="floorsType = index"
v-for="index in Math.ceil(unitHouseChoosed.length / 5)" :key="index">
{{ unitHouseChoosed[index * 5 - 5].floor_num }}-{{ unitHouseChoosed[index *
- 5
- - 1] ? unitHouseChoosed[index * 5
- - 1].floor_num : unitHouseChoosed[unitHouseChoosed.length - 1].floor_num
- }}层</div>
+ 5
+ - 1] ? unitHouseChoosed[index * 5
+ - 1].floor_num : unitHouseChoosed[unitHouseChoosed.length - 1].floor_num
+}}层</div>
</div>
</div>
<div @click="nextFloorBtn" class="floorBtn rightFloorBtn" v-show="nextFloorShow">
@@ -325,7 +325,17 @@
</div>
</div>
<!-- <transition name="special-animal"></transition>-->
-
+ <div class="search-content">
+ <input v-model="searchExtensivelyValue" @input="searchExtensivelyChange" @focus="searchExtensivelyFocus"
+ type="text" placeholder="请输入搜索条件" />
+ <button @click="searchExtensivelyClick" class="el-icon-search"></button>
+ </div>
+ <div v-show="searchExtensivelyValBoxShow" class="searchExtensively-val-box">
+ <div>
+ <div @click="searchExtensivelyVlaClick(item)" v-for="(item, index) in searchExtensivelyArray"
+ :key="index">{{ item.name }}</div>
+ </div>
+ </div>
<el-dialog title="信息详情" :modal="true" :visible.sync="dialogVisible" :before-close="handleClose"
:close-on-click-modal="true" class="police-affairs-details-box">
<div class="item">
@@ -568,6 +578,9 @@
buildingList: [],
buildingChoosed: {},
unitHouseChoosed: [],
+ searchExtensivelyValBoxShow: false,
+ searchExtensivelyArray: [],
+ searchExtensivelyValue: '',
}
},
watch: {
@@ -635,7 +648,7 @@
// 大搜
getSearchExtensively (ak, region, query) {
getSearchExtensively(ak, region, query).then(res => {
- console.log(res, 333)
+ this.searchExtensivelyArray = res.data.result
})
},
@@ -815,6 +828,38 @@
console.log(current, currentNode)
this.$refs[`popover`].doClose()
},
+
+ searchExtensivelyClick () {
+ this.getSearchExtensively('ebf48ecaa1fd436fa3d40c4600aa051f', '361100', this.searchExtensivelyValue)
+ this.searchExtensivelyValBoxShow = false
+ },
+
+ searchExtensivelyChange () {
+ if (this.searchExtensivelyValue == '') {
+ this.searchExtensivelyValBoxShow = false
+ this.searchExtensivelyArray = []
+ } else {
+ this.searchExtensivelyValBoxShow = true
+ this.getSearchExtensively('ebf48ecaa1fd436fa3d40c4600aa051f', '361100', this.searchExtensivelyValue)
+ }
+ },
+
+ searchExtensivelyVlaClick (item) {
+ this.searchExtensivelyValBoxShow = false
+ this.searchExtensivelyValue = item.name
+ this.$EventBus.$emit('toPosition', {
+ siteJd: `${item.location.lng}`,
+ siteWd: `${item.location.lat}`,
+ siteGd: 200,
+ siteHeading: -3,
+ sitePitch: -45
+ })
+ },
+
+ searchExtensivelyFocus () {
+ this.searchExtensivelyValBoxShow = true
+ this.getSearchExtensively('ebf48ecaa1fd436fa3d40c4600aa051f', '361100', this.searchExtensivelyValue)
+ }
},
destroyed () {
@@ -1210,6 +1255,24 @@
&>span {
margin: 0 10px;
+ width: 14px;
+ height: 8px;
+ }
+
+ .chuzu {
+ border: 1px solid #348b3a;
+ }
+
+ .zizhu {
+ border: 1px solid #2c77bb;
+ }
+
+ .kongzhi {
+ border: 1px solid #5c6169;
+ }
+
+ .shangye {
+ border: 1px solid #cc9456;
}
}
}
@@ -1366,6 +1429,79 @@
}
}
}
+
+ .search-content {
+ position: absolute;
+ left: 760px;
+ top: 40px;
+ width: 460px;
+ height: 36px;
+
+ input {
+ flex: 1;
+ width: 380px;
+ height: 100%;
+ font-size: 18px;
+ text-indent: 1em;
+ color: #ffffff;
+ background-color: $table-body-tr-2n-color;
+ border: 1px solid rgb(0, 92, 169);
+ border-radius: 20px 0 0 20px;
+ vertical-align: top;
+ }
+
+ input:focus {
+ outline: none;
+ }
+
+ input::-webkit-input-placeholder {
+ color: rgba(238, 238, 238, 0.7);
+ }
+
+ button {
+ font-size: 24px;
+ font-weight: 700;
+ width: 80px;
+ height: 100%;
+ background-color: $table-body-tr-n-color;
+ color: #fff;
+ border: 1px solid rgb(0, 92, 169);
+ cursor: pointer;
+ border-radius: 0 20px 20px 0;
+ }
+
+ button:active {
+ background-color: $table-body-tr-2n-color;
+ border: 1px solid rgb(0, 92, 169);
+ }
+ }
+
+ .searchExtensively-val-box {
+ display: flex;
+ flex-direction: column;
+ position: absolute;
+ top: 80px;
+ left: 760px;
+ width: 380px;
+ max-height: 160px;
+ text-align: left;
+ color: #fff;
+ background: $el-dialog-bg-color;
+ z-index: 1111;
+ border-radius: 10px;
+ overflow: hidden;
+
+ &>div {
+ height: 100%;
+ overflow-y: auto;
+
+ div {
+ padding: 0 10px;
+ line-height: 36px;
+ cursor: pointer;
+ }
+ }
+ }
}
.progress {
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
new file mode 100644
index 0000000..3fa593e
--- /dev/null
+++ b/src/views/login/index.vue
@@ -0,0 +1,342 @@
+<template>
+ <div class="auth-page">
+ <!-- <div class="title">社区警务平台</div> -->
+ <!-- <div class="container"> -->
+ <!-- <h1 class="text-xs-center">用户登录</h1> -->
+ <!-- <div class="loginbody">
+ <el-form :model="user" ref="formName" status-icon :rules="rules">
+ <span class="input">用户名：</span>
+ <el-form-item prop="username">
+ <el-input
+ v-model="user.username"
+ prefix-icon="el-icon-user"
+ placeholder="请输入您的用户名"
+ autocomplete="off"
+ ></el-input>
+ </el-form-item>
+ <span class="input">密码：</span>
+ <el-form-item prop="password">
+ <el-input
+ type="password"
+ v-model="user.password"
+ prefix-icon="el-icon-lock"
+ placeholder="请输入您密码"
+ autocomplete="off"
+ ></el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click.enter="onLogin(user)">登 录</el-button>
+ </el-form-item>
+ </el-form>
+ </div>-->
+ <!-- </div> -->
+ <div class="loginTitle">社区警务平台</div>
+ <div class="layui-form login_content">
+ <p>用户登录</p>
+ <el-form :model="user" ref="formName" status-icon :rules="rules">
+ <el-form-item prop="username">
+ <el-input
+ v-model="user.username"
+ prefix-icon="el-icon-user"
+ placeholder="请输入您的用户名"
+ autocomplete="off"
+ ></el-input>
+ </el-form-item>
+ <el-form-item prop="password">
+ <el-input
+ type="password"
+ v-model="user.password"
+ prefix-icon="el-icon-lock"
+ placeholder="请输入您密码"
+ autocomplete="off"
+ ></el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click.enter="onLogin(user)">登 录</el-button>
+ </el-form-item>
+ </el-form>
+ </div>
+ </div>
+</template>
+
+<script>
+import nprogress from 'nprogress'
+import md5 from 'js-md5'
+import axios from 'axios'
+import * as auth from '@/utils/auth'
+
+export default {
+ name: 'AppRegister',
+ data () {
+ return {
+ user: {
+ username: '',
+ password: ''
+ },
+ rules: {
+ username: [
+ { required: true, message: '用户名不能为空', trigger: 'blur' },
+ {
+ min: 3,
+ max: 10,
+ message: '用户账号长度在3~10个字符之间',
+ trigger: 'blur'
+ }
+ ],
+ password: [
+ { required: true, message: '密码不能为空', trigger: 'blur' },
+ {
+ min: 3,
+ max: 10,
+ message: '用户密码长度在3~10个字符之间',
+ trigger: 'blur'
+ }
+ ]
+ },
+ errors: null,
+ newAxios: null
+ }
+ },
+ created () {
+ var that = this
+
+ this.newAxios = axios.create({
+ baseURL: 'http://dev.jxpskj.com:8020/api',
+ timeout: 600000,
+ headers: {
+ Authorization: 'Basic c2FiZXI6c2FiZXJfc2VjcmV0',
+ 'Tenant-Id': '000000'
+ }
+ })
+
+ document.onkeydown = (e) => {
+ const _key = window.event.keyCode
+ if (_key === 13) {
+ that.onLogin(that.user)
+ }
+ }
+ },
+ methods: {
+ onLogin ({ username, password }) {
+ this.$refs.formName.validate((valid) => {
+ if (valid) {
+ nprogress.start()
+
+ this.newAxios({
+ method: 'POST',
+ url: '/blade-auth/oauth/token',
+ params: {
+ username: username,
+ password: md5(password),
+ tenantId: '000000'
+ }
+ }).then((res) => {
+ if (res.data.access_token) {
+ this.$store.commit('setUser', res.data)
+ auth.setToken(res.data.access_token)
+ console.log('23232323', res.data)
+ window.localStorage.setItem('userName', res.data.nick_name)//赋值
+ this.$router.push({ path: '/' })
+ } else {
+ this.$message({
+ type: 'warning',
+ message: '用户名或密码不正确，请重新输入'
+ })
+ }
+ nprogress.done()
+ })
+ }
+ })
+ }
+ }
+}
+</script>
+
+<style scoped lang="scss">
+.auth-page {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background-image: url(../../../public/img/bg/login-bg.png);
+ background-size: 100% 100%;
+ margin: 0;
+ padding: 0;
+
+ .loginTitle {
+ color: #00cbdd;
+ font-size: 46px;
+ letter-spacing: 6px;
+ font-weight: 700;
+ position: absolute;
+ top: 20%;
+ right: 25%;
+ transform: translateX(50%);
+ }
+ .login_content {
+ width: 300px;
+ position: absolute;
+ text-align: center;
+ top: 50%;
+ right: 25%;
+ transform: translateY(-40%) translateX(50%);
+ color: #ffffff;
+ padding: 30px;
+ background: url(../../../public/img/bg/login-content-bg.png),
+ url(../../../public/img/bg/left-top.png) no-repeat left top,
+ url(../../../public/img/bg/left-bottom.png) no-repeat left bottom,
+ url(../../../public/img/bg/right-top.png) no-repeat right top,
+ url(../../../public/img/bg/right-bottom.png) no-repeat right bottom;
+ background-repeat: no-repeat;
+ background-size: 100% 100%, 25px, 25px, 25px, 25px;
+
+ p {
+ font-size: 26px;
+ margin-bottom: 15px;
+ letter-spacing: 4px;
+ }
+ :deep(.el-button--primary) {
+ width: 100%;
+ height: 34px;
+ border-radius: 2px;
+ }
+ :deep(.el-button) {
+ line-height: 14px;
+ }
+ }
+
+ // .title {
+ // width: 1389px;
+ // height: 115px;
+ // // background-image: url(../../../public/img/bg/login_title@2x.png);
+ // background-size: 100% 100%;
+ // margin: 99px 264px 0px 266px;
+ // font-size: 74px;
+ // color: #fff;
+ // }
+ // .container {
+ // position: absolute;
+ // top: 0;
+ // left: 0;
+ // right: 0;
+ // bottom: 0;
+ // margin: 317px auto;
+ // width: 653px;
+ // height: 552px;
+ // background-image: url(../../../public/img/bg/rectangle11@2x.png);
+ // background-size: 100% 100%;
+ // border-radius: 10px;
+ // letter-spacing: 100;
+
+ // // h1 {
+ // // margin: 54px 244px 0px 243px;
+ // // width: 166px;
+ // // text-align: left;
+ // // width: 176px;
+ // // height: 30px;
+ // // font-size: 42px;
+ // // font-family: PangMenZhengDao;
+ // // font-weight: 400;
+ // // color: #ffffff;
+ // // line-height: 30px;
+ // // letter-spacing: 2px;
+ // // }
+
+ // // .loginbody {
+ // // position: absolute;
+ // // top: 120px;
+ // // left: 0;
+ // // right: 0;
+ // // bottom: 0;
+ // // width: 72%;
+ // // // margin: auto;
+ // // margin-left: 51px;
+
+ // // .el-form-item {
+ // // text-align: center;
+
+ // // :deep(.el-input__inner) {
+ // // width: 548px;
+ // // height: 59px;
+ // // background: #0c2d49;
+ // // opacity: 0.5;
+ // // margin-bottom: 15px;
+ // // font-size: 21px;
+ // // }
+ // // :deep(.el-input--prefix .el-input__inner) {
+ // // padding-left: 40px;
+ // // }
+ // // :deep(.el-input__inner:focus) {
+ // // border: 2px solid #22b4cb;
+ // // opacity: 0.8;
+ // // color: #fff;
+ // // }
+ // // :deep(.el-form-item__error) {
+ // // color: #f00;
+ // // line-height: 0;
+ // // font-size: 15px;
+ // // opacity: 0.8;
+ // // letter-spacing: 2px;
+ // // font-weight: 700;
+ // // }
+ // // :deep(.el-input__icon) {
+ // // height: 91%;
+ // // width: 34px;
+ // // }
+ // // :deep(.el-icon-user::before),
+ // // :deep(.el-icon-lock::before) {
+ // // font-size: 22px;
+ // // }
+ // // :deep(.el-form-item.is-error)v,
+ // // :deep(.el-input__validateIcon) {
+ // // font-size: 22px;
+ // // }
+ // // :deep(.el-input__suffix) {
+ // // right: -48px;
+ // // }
+ // // :deep(.el-input input::-webkit-input-placeholder) {
+ // // color: #ffffff;
+ // // font-size: 21px;
+ // // opacity: 0.5;
+ // // line-height: 27px;
+ // // }
+ // // :deep(.el-input input::-moz-input-placeholder) {
+ // // color: #ffffff;
+ // // font-size: 21px;
+ // // opacity: 0.5;
+ // // }
+ // // :deep(.el-input input::-ms-input-placeholder) {
+ // // color: #ffffff;
+ // // font-size: 21px;
+ // // opacity: 0.5;
+ // // line-height: 27px;
+ // // }
+
+ // // :deep(.el-button) {
+ // // width: 548px;
+ // // height: 59px;
+ // // background: linear-gradient(
+ // // 90deg,
+ // // rgba(0, 249, 247, 0.54),
+ // // rgba(0, 182, 249, 0.54)
+ // // );
+ // // box-shadow: 0px 2px 20px 1px rgba(1, 25, 70, 0.46);
+ // // font-size: 29px;
+ // // margin-top: 25px;
+ // // }
+ // // }
+
+ // // .input {
+ // // display: inline-block;
+ // // width: 100px;
+ // // height: 23px;
+ // // font-size: 24px;
+ // // font-family: PingFang SC;
+ // // color: #ffffff;
+ // // margin-bottom: 21px;
+ // // }
+ // // }
+ // }
+}
+</style>
diff --git a/src/views/lyout/index.vue b/src/views/lyout/index.vue
index 74ce54c..8622c77 100644
--- a/src/views/lyout/index.vue
+++ b/src/views/lyout/index.vue
@@ -11,7 +11,6 @@
<template>
<div class="wrapper">
<div class="main-header">
- <!-- <div class="title"></div> -->
<div class="menu-list left">
<div @mouseenter="item.childrenFlag = true" @mouseleave="item.childrenFlag = false" class="nav-list"
@click="goToPath(item)" v-for="(item, index) in menuLeftList" :key="index">
@@ -27,7 +26,6 @@
</div>
<div class="title">
- <!-- <img src="../../../public/img/icon.png" /> -->
<h3>社区警务平台</h3>
</div>
@@ -47,11 +45,33 @@
</div>
<!-- 用户登录展示的 -->
- <div class="user-infor">
- <div>
+ <div class="user-infor" @click="openUser">
+ <div class="userIcon" :class="{on: userOn == true}">
<i class="el-icon-user-solid"></i>
</div>
+ <div class="userDetail" v-if="isShowUserDetail">
+ <div class="triangle"></div>
+ <div class="userName">用户名：{{userName}}</div>
+ <div class="userBtn">
+ <div class="edit" @click="goTOLogin">
+ <img src="../../../public/img/bg/editLogin.webp" alt />
+ </div>
+ </div>
+ </div>
</div>
+ <!-- <div class="userIcon" :class="{on: userOn == true}" @click="openUser">
+ <div class="userDetail" v-if="isShowUserDetail">
+ <div class="triangle"></div>
+ <div class="userName">用户名：{{userName}}</div>
+ <div class="userBtn">
+ <div class="edit" @click="goTOLogin">
+ >
+ <img src="../../../public/img/editLogin.webp" alt />
+ </div>
+ <div class="return" @click="goTOFllow">返回引导页</div>
+ </div>
+ </div>
+ </div>-->
</div>
<div class="main-container">
@@ -124,7 +144,9 @@
boxWidth: 0,
- currentUrl: '/lyout/home'
+ currentUrl: '/lyout/home',
+ userOn: false,
+ isShowUserDetail: false,
}
},
@@ -224,6 +246,11 @@
document.querySelector('.image-switch-img-btn').classList.remove('shrink-btn')
}
})
+ },
+
+ openUser () {
+ this.userOn = !this.userOn
+ this.isShowUserDetail = !this.isShowUserDetail
},
}
}
@@ -389,7 +416,7 @@
font-size: 24px;
cursor: pointer;
- div {
+ .userIcon {
position: absolute;
top: 0;
right: 0;
@@ -404,6 +431,66 @@
box-shadow: inset 0 0 10px $menu-tab-shadow;
border-radius: 50%;
}
+
+ .userIcon.on {
+ color: rgba(252, 189, 86, 1);
+ }
+ .userDetail {
+ width: 180px;
+ height: 92px;
+ position: absolute;
+ top: 64px;
+ right: 4px;
+ background: $menu-tab-bg-color;
+ border-radius: 8px;
+ cursor: default;
+
+ .triangle {
+ position: absolute;
+ top: -16px;
+ right: 20px;
+ width: 0px;
+ height: 0px;
+ border: 8px solid #000;
+ border-top-color: transparent;
+ border-bottom-color: rgba(3, 82, 102, 0.8);
+ border-left-color: transparent;
+ border-right-color: transparent;
+ }
+ .userName {
+ width: 100%;
+ height: 40px;
+ font-size: 14px;
+ font-weight: 500;
+ color: #fff;
+ line-height: 40px;
+ border-bottom: 1px solid rgba(255, 255, 255, 0.5);
+ position: absolute;
+ top: 0px;
+ }
+ .userBtn {
+ width: 100%;
+ height: 50px;
+ position: absolute;
+ bottom: 0px;
+ display: flex;
+ justify-content: space-around;
+ padding-top: 4px;
+
+ & > div {
+ width: 100px;
+ height: 40px;
+ background-color: rgba(168, 222, 255, 0.6);
+ border-radius: 4px;
+ cursor: pointer;
+ line-height: 44px;
+ img {
+ width: 76px;
+ height: 20px;
+ }
+ }
+ }
+ }
}
}
--
Gitblit v1.9.3