lcw
This commit is contained in:
148
package-lock.json
generated
148
package-lock.json
generated
@ -1457,12 +1457,12 @@
|
|||||||
},
|
},
|
||||||
"@paddlejs/paddlejs-backend-webgl": {
|
"@paddlejs/paddlejs-backend-webgl": {
|
||||||
"version": "1.2.9",
|
"version": "1.2.9",
|
||||||
"resolved": "https://registry.npmmirror.com/@paddlejs/paddlejs-backend-webgl/-/paddlejs-backend-webgl-1.2.9.tgz",
|
"resolved": "https://registry.npmjs.org/@paddlejs/paddlejs-backend-webgl/-/paddlejs-backend-webgl-1.2.9.tgz",
|
||||||
"integrity": "sha512-cVDa0/Wbw2EyfsYqdYUPhFeqKsET79keEUWjyhYQmQkJfWg8j1qdR6yp7g6nx9qAGrqFvwuj1s0EqkYA1dok6A=="
|
"integrity": "sha512-cVDa0/Wbw2EyfsYqdYUPhFeqKsET79keEUWjyhYQmQkJfWg8j1qdR6yp7g6nx9qAGrqFvwuj1s0EqkYA1dok6A=="
|
||||||
},
|
},
|
||||||
"@paddlejs/paddlejs-core": {
|
"@paddlejs/paddlejs-core": {
|
||||||
"version": "2.2.0",
|
"version": "2.2.0",
|
||||||
"resolved": "https://registry.npmmirror.com/@paddlejs/paddlejs-core/-/paddlejs-core-2.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/@paddlejs/paddlejs-core/-/paddlejs-core-2.2.0.tgz",
|
||||||
"integrity": "sha512-P3rPkF9fFHtq8uSte5gA7fJQwBNl9Ytsvj6aTcfQSsirnBO/HxMNu0gJyh7+lItvEtF92PR15eI0eOwJYfZDhQ=="
|
"integrity": "sha512-P3rPkF9fFHtq8uSte5gA7fJQwBNl9Ytsvj6aTcfQSsirnBO/HxMNu0gJyh7+lItvEtF92PR15eI0eOwJYfZDhQ=="
|
||||||
},
|
},
|
||||||
"@petamoriken/float16": {
|
"@petamoriken/float16": {
|
||||||
@ -2134,51 +2134,6 @@
|
|||||||
"integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
|
"integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"ansi-styles": {
|
|
||||||
"version": "4.3.0",
|
|
||||||
"resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
|
|
||||||
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
|
|
||||||
"dev": true,
|
|
||||||
"optional": true,
|
|
||||||
"requires": {
|
|
||||||
"color-convert": "^2.0.1"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"chalk": {
|
|
||||||
"version": "4.1.2",
|
|
||||||
"resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
|
|
||||||
"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
|
|
||||||
"dev": true,
|
|
||||||
"optional": true,
|
|
||||||
"requires": {
|
|
||||||
"ansi-styles": "^4.1.0",
|
|
||||||
"supports-color": "^7.1.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"color-convert": {
|
|
||||||
"version": "2.0.1",
|
|
||||||
"resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
|
|
||||||
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
|
|
||||||
"dev": true,
|
|
||||||
"optional": true,
|
|
||||||
"requires": {
|
|
||||||
"color-name": "~1.1.4"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"color-name": {
|
|
||||||
"version": "1.1.4",
|
|
||||||
"resolved": "https://registry.npmmirror.com/color-name/-/color-name-1.1.4.tgz",
|
|
||||||
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
|
|
||||||
"dev": true,
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"has-flag": {
|
|
||||||
"version": "4.0.0",
|
|
||||||
"resolved": "https://registry.npmmirror.com/has-flag/-/has-flag-4.0.0.tgz",
|
|
||||||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
|
||||||
"dev": true,
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"ssri": {
|
"ssri": {
|
||||||
"version": "8.0.1",
|
"version": "8.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/ssri/-/ssri-8.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/ssri/-/ssri-8.0.1.tgz",
|
||||||
@ -2187,28 +2142,6 @@
|
|||||||
"requires": {
|
"requires": {
|
||||||
"minipass": "^3.1.1"
|
"minipass": "^3.1.1"
|
||||||
}
|
}
|
||||||
},
|
|
||||||
"supports-color": {
|
|
||||||
"version": "7.2.0",
|
|
||||||
"resolved": "https://registry.npmmirror.com/supports-color/-/supports-color-7.2.0.tgz",
|
|
||||||
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
|
||||||
"dev": true,
|
|
||||||
"optional": true,
|
|
||||||
"requires": {
|
|
||||||
"has-flag": "^4.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"vue-loader-v16": {
|
|
||||||
"version": "npm:vue-loader@16.8.3",
|
|
||||||
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz",
|
|
||||||
"integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
|
|
||||||
"dev": true,
|
|
||||||
"optional": true,
|
|
||||||
"requires": {
|
|
||||||
"chalk": "^4.1.0",
|
|
||||||
"hash-sum": "^2.0.0",
|
|
||||||
"loader-utils": "^2.0.0"
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -3368,7 +3301,7 @@
|
|||||||
},
|
},
|
||||||
"blueimp-canvas-to-blob": {
|
"blueimp-canvas-to-blob": {
|
||||||
"version": "3.29.0",
|
"version": "3.29.0",
|
||||||
"resolved": "https://registry.npmmirror.com/blueimp-canvas-to-blob/-/blueimp-canvas-to-blob-3.29.0.tgz",
|
"resolved": "https://registry.npmjs.org/blueimp-canvas-to-blob/-/blueimp-canvas-to-blob-3.29.0.tgz",
|
||||||
"integrity": "sha512-0pcSSGxC0QxT+yVkivxIqW0Y4VlO2XSDPofBAqoJ1qJxgH9eiUDLv50Rixij2cDuEfx4M6DpD9UGZpRhT5Q8qg=="
|
"integrity": "sha512-0pcSSGxC0QxT+yVkivxIqW0Y4VlO2XSDPofBAqoJ1qJxgH9eiUDLv50Rixij2cDuEfx4M6DpD9UGZpRhT5Q8qg=="
|
||||||
},
|
},
|
||||||
"bmp-js": {
|
"bmp-js": {
|
||||||
@ -6969,7 +6902,7 @@
|
|||||||
},
|
},
|
||||||
"file-saver": {
|
"file-saver": {
|
||||||
"version": "2.0.5",
|
"version": "2.0.5",
|
||||||
"resolved": "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz",
|
"resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
|
||||||
"integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
|
"integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
|
||||||
},
|
},
|
||||||
"file-uri-to-path": {
|
"file-uri-to-path": {
|
||||||
@ -7949,7 +7882,7 @@
|
|||||||
},
|
},
|
||||||
"image-compressor.js": {
|
"image-compressor.js": {
|
||||||
"version": "1.1.4",
|
"version": "1.1.4",
|
||||||
"resolved": "https://registry.npmmirror.com/image-compressor.js/-/image-compressor.js-1.1.4.tgz",
|
"resolved": "https://registry.npmjs.org/image-compressor.js/-/image-compressor.js-1.1.4.tgz",
|
||||||
"integrity": "sha512-DF1YFSw+m6FqpXsleD4+q9eu/wFFkm8sHuYhgYy5GWFVencXeuB1/UqC12xz+dCZooPetf5LIb8JOGkgEWmlcg==",
|
"integrity": "sha512-DF1YFSw+m6FqpXsleD4+q9eu/wFFkm8sHuYhgYy5GWFVencXeuB1/UqC12xz+dCZooPetf5LIb8JOGkgEWmlcg==",
|
||||||
"requires": {
|
"requires": {
|
||||||
"blueimp-canvas-to-blob": "^3.14.0",
|
"blueimp-canvas-to-blob": "^3.14.0",
|
||||||
@ -8321,7 +8254,7 @@
|
|||||||
},
|
},
|
||||||
"is-blob": {
|
"is-blob": {
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"resolved": "https://registry.npmmirror.com/is-blob/-/is-blob-1.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/is-blob/-/is-blob-1.0.0.tgz",
|
||||||
"integrity": "sha512-QIZDHQZpRfMEZwSTD7egdNZS7H/awVW9FZ3yJv+gg1z8d8GPXEs76QWL67fZs2BoBqp2dGtamTJpEYFJHmD73g=="
|
"integrity": "sha512-QIZDHQZpRfMEZwSTD7egdNZS7H/awVW9FZ3yJv+gg1z8d8GPXEs76QWL67fZs2BoBqp2dGtamTJpEYFJHmD73g=="
|
||||||
},
|
},
|
||||||
"is-boolean-object": {
|
"is-boolean-object": {
|
||||||
@ -15121,6 +15054,75 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"vue-loader-v16": {
|
||||||
|
"version": "npm:vue-loader@16.8.3",
|
||||||
|
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz",
|
||||||
|
"integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"chalk": "^4.1.0",
|
||||||
|
"hash-sum": "^2.0.0",
|
||||||
|
"loader-utils": "^2.0.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"ansi-styles": {
|
||||||
|
"version": "4.3.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
|
||||||
|
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"color-convert": "^2.0.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"chalk": {
|
||||||
|
"version": "4.1.2",
|
||||||
|
"resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
|
||||||
|
"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"ansi-styles": "^4.1.0",
|
||||||
|
"supports-color": "^7.1.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"color-convert": {
|
||||||
|
"version": "2.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
|
||||||
|
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"color-name": "~1.1.4"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"color-name": {
|
||||||
|
"version": "1.1.4",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-name/-/color-name-1.1.4.tgz",
|
||||||
|
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"has-flag": {
|
||||||
|
"version": "4.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/has-flag/-/has-flag-4.0.0.tgz",
|
||||||
|
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"supports-color": {
|
||||||
|
"version": "7.2.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/supports-color/-/supports-color-7.2.0.tgz",
|
||||||
|
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"has-flag": "^4.0.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"vue-router": {
|
"vue-router": {
|
||||||
"version": "4.1.3",
|
"version": "4.1.3",
|
||||||
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.1.3.tgz",
|
||||||
|
|||||||
@ -3,261 +3,306 @@
|
|||||||
-webkit-background-clip: text;
|
-webkit-background-clip: text;
|
||||||
-webkit-text-fill-color: transparent;
|
-webkit-text-fill-color: transparent;
|
||||||
}
|
}
|
||||||
.homeBox{
|
|
||||||
|
.homeBox {
|
||||||
|
width: 100%;
|
||||||
|
height: 100vh;
|
||||||
|
|
||||||
|
.home-aside {
|
||||||
|
position: relative;
|
||||||
|
width: 442px;
|
||||||
|
top: 70px;
|
||||||
|
height: 100%;
|
||||||
|
height: calc(100vh - 72px);
|
||||||
|
overflow: hidden;
|
||||||
|
z-index: 10;
|
||||||
|
|
||||||
|
.asideTitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: linear-gradient(90deg, #124CB3 0%, rgba(18, 76, 179, 0.23) 77%, rgba(18, 76, 179, 0) 100%);
|
||||||
|
border-radius: 0px 0px 0px 0px;
|
||||||
|
height: 40px;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.asideCnt {
|
||||||
|
height: calc(100% - 40px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.aside-middle {
|
||||||
|
height: calc(100%/2);
|
||||||
|
padding: 4px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.homeBtn {
|
||||||
|
height: 302px;
|
||||||
|
width: calc(100% - 894px);
|
||||||
|
position: absolute;
|
||||||
|
bottom: 2px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 头部
|
||||||
|
.headBox {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100vh;
|
height: 70px;
|
||||||
.home-aside{
|
background: rgba(0, 0, 0, 0.8);
|
||||||
position: relative;
|
z-index: 2;
|
||||||
width: 442px;
|
|
||||||
top: 70px;
|
.headBoxBg {
|
||||||
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
height: calc(100vh - 72px);
|
background: url("~@/assets/images/home_head.png") no-repeat center center;
|
||||||
overflow: hidden;
|
background-size: 100% 100%;
|
||||||
z-index: 10;
|
height: 151px;
|
||||||
.asideTitle{
|
}
|
||||||
|
|
||||||
|
.top-center {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 2%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
font-size: 56px;
|
||||||
|
letter-spacing: 2px;
|
||||||
|
font-family: "YSBTH";
|
||||||
|
white-space: nowrap;
|
||||||
|
background: linear-gradient(180deg, #FFFFFF 0%, #66B5FF 100%);
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 4px 4px 4px rgba(54, 255, 243, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.topBtn {
|
||||||
|
display: flex;
|
||||||
|
position: absolute;
|
||||||
|
top: 22px;
|
||||||
|
|
||||||
|
.topBtn-item {
|
||||||
|
width: 190px;
|
||||||
|
height: 38px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: center;
|
||||||
padding: 0 10px;
|
background: url("~@/assets/images/home_btns.png") no-repeat center center;
|
||||||
box-sizing: border-box;
|
|
||||||
background: linear-gradient( 90deg, #124CB3 0%, rgba(18,76,179,0.23) 77%, rgba(18,76,179,0) 100%);
|
|
||||||
border-radius: 0px 0px 0px 0px;
|
|
||||||
height: 40px;
|
|
||||||
.title{
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 16px;
|
|
||||||
color: #FFFFFF;
|
|
||||||
margin-right: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.asideCnt{
|
|
||||||
height: calc(100% - 40px);
|
|
||||||
}
|
|
||||||
.aside-middle{
|
|
||||||
height: calc(100%/2);
|
|
||||||
padding: 4px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.homeBtn{
|
|
||||||
height: 302px;
|
|
||||||
width: calc(100% - 894px);
|
|
||||||
position: absolute;
|
|
||||||
bottom: 2px;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
}
|
|
||||||
// 头部
|
|
||||||
.headBox {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 70px;
|
|
||||||
background: rgba(0,0,0,0.8);
|
|
||||||
z-index: 2;
|
|
||||||
.headBoxBg{
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background: url("~@/assets/images/home_head.png") no-repeat center center;
|
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
height: 151px;
|
font-size: 18px;
|
||||||
}
|
cursor: pointer;
|
||||||
.top-center {
|
|
||||||
position: absolute;
|
span {
|
||||||
left: 50%;
|
|
||||||
top: 2%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
font-size: 56px;
|
|
||||||
letter-spacing: 2px;
|
|
||||||
font-family: "YSBTH";
|
|
||||||
white-space: nowrap;
|
|
||||||
background: linear-gradient(180deg, #FFFFFF 0%, #66B5FF 100%);
|
|
||||||
-webkit-background-clip: text;
|
|
||||||
-webkit-text-fill-color: transparent;
|
|
||||||
text-shadow: 4px 4px 4px rgba(54, 255, 243, 0.15);
|
|
||||||
}
|
|
||||||
.topBtn {
|
|
||||||
display: flex;
|
|
||||||
position: absolute;
|
|
||||||
top: 22px;
|
|
||||||
.topBtn-item {
|
|
||||||
width: 190px;
|
|
||||||
height: 38px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
background: url("~@/assets/images/home_btns.png") no-repeat center center;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
font-size: 18px;
|
|
||||||
cursor: pointer;
|
|
||||||
span {
|
|
||||||
font-family: "YSBTH";
|
|
||||||
margin-top: -4px;
|
|
||||||
@include textColor(#a1d6ff, #ffffff);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.topBtn-left {
|
|
||||||
left: 30px;
|
|
||||||
font-size: 12px;
|
|
||||||
.text {
|
|
||||||
font-family: "YSBTH";
|
font-family: "YSBTH";
|
||||||
color: #0bb7ff;
|
margin-top: -4px;
|
||||||
}
|
|
||||||
.tests {
|
|
||||||
color: #0a99ff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.leftBtn-yjbtn{
|
|
||||||
position: absolute;
|
|
||||||
left: 360px;
|
|
||||||
top: 20px;
|
|
||||||
.leftBtn-item{
|
|
||||||
width: 155px;
|
|
||||||
height: 38px;
|
|
||||||
line-height: 38px;
|
|
||||||
text-align: center;
|
|
||||||
background: url("~@/assets/images/home_btns.png") no-repeat center center;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
font-size: 16px;
|
|
||||||
font-family: "YSBTH";
|
|
||||||
}
|
|
||||||
.btms{
|
|
||||||
@include textColor(#a1d6ff, #ffffff);
|
@include textColor(#a1d6ff, #ffffff);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.yjbtnActive{
|
|
||||||
background: url("~@/assets/images/home_btns_active.png") no-repeat center center;
|
}
|
||||||
|
|
||||||
|
.topBtn-left {
|
||||||
|
left: 30px;
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
.text {
|
||||||
|
font-family: "YSBTH";
|
||||||
|
color: #0bb7ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tests {
|
||||||
|
color: #0a99ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.leftBtn-yjbtn {
|
||||||
|
position: absolute;
|
||||||
|
left: 360px;
|
||||||
|
top: 20px;
|
||||||
|
|
||||||
|
.leftBtn-item {
|
||||||
|
width: 155px;
|
||||||
|
height: 38px;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: center;
|
||||||
|
background: url("~@/assets/images/home_btns.png") no-repeat center center;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
.btms{
|
font-size: 16px;
|
||||||
|
font-family: "YSBTH";
|
||||||
|
}
|
||||||
|
|
||||||
|
.btms {
|
||||||
|
@include textColor(#a1d6ff, #ffffff);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.yjbtnActive {
|
||||||
|
background: url("~@/assets/images/home_btns_active.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
|
||||||
|
.btms {
|
||||||
|
@include textColor(#00ffff, #faff00);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.topBtn-right {
|
||||||
|
right: 270px;
|
||||||
|
top: 22px;
|
||||||
|
|
||||||
|
.topBtn-item {
|
||||||
|
background: url("~@/assets/images/home_btns_right.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-topBtn {
|
||||||
|
background: url("~@/assets/images/home_btns_right_active.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
|
||||||
|
span {
|
||||||
@include textColor(#00ffff, #faff00);
|
@include textColor(#00ffff, #faff00);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.topBtn-right {
|
|
||||||
right: 270px;
|
|
||||||
top: 22px;
|
|
||||||
.topBtn-item {
|
|
||||||
background: url("~@/assets/images/home_btns_right.png") no-repeat center
|
|
||||||
center;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
}
|
|
||||||
.active-topBtn {
|
|
||||||
background: url("~@/assets/images/home_btns_right_active.png") no-repeat
|
|
||||||
center center;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
span {
|
|
||||||
@include textColor(#00ffff, #faff00);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.rightIcon {
|
|
||||||
position: absolute;
|
|
||||||
right: 20px;
|
|
||||||
top: 22px;
|
|
||||||
font-size: 17px;
|
|
||||||
z-index: 9;
|
|
||||||
span {
|
|
||||||
color: #0bb7ff;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
img {
|
|
||||||
width: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
// 左边
|
|
||||||
.asideL{
|
.rightIcon {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
box-sizing: border-box;
|
right: 20px;
|
||||||
left: 0px;
|
top: 22px;
|
||||||
.asideL-top{
|
font-size: 17px;
|
||||||
width: 100%;
|
|
||||||
height: 141px;
|
|
||||||
background: #052249;
|
|
||||||
}
|
|
||||||
.asideL-Bottom{
|
|
||||||
height: calc(100% - 141px);
|
|
||||||
.commom-aside{
|
|
||||||
height: calc((100%/3) - 6px);
|
|
||||||
margin-top: 7px;
|
|
||||||
background: #052249;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// 右边
|
|
||||||
.asideR{
|
|
||||||
position: absolute;
|
|
||||||
right: 0px;
|
|
||||||
.commom-aside-small{
|
|
||||||
height: calc(((100% - 146px) /3) - 6px);
|
|
||||||
background: #052249;
|
|
||||||
margin-top: 9px;
|
|
||||||
}
|
|
||||||
.commom-aside-big{
|
|
||||||
height: calc(((100% - (100% - 146px) /3)/2) - 6px);
|
|
||||||
margin-bottom: 9px;
|
|
||||||
background: #052249;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.home-center{
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
top: 70px;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
width: calc(100% - 890px);
|
|
||||||
height: 80px;
|
|
||||||
z-index: 9;
|
z-index: 9;
|
||||||
|
|
||||||
|
span {
|
||||||
|
color: #0bb7ff;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 左边
|
||||||
|
.asideL {
|
||||||
|
position: absolute;
|
||||||
|
box-sizing: border-box;
|
||||||
|
left: 0px;
|
||||||
|
|
||||||
|
.asideL-top {
|
||||||
|
width: 100%;
|
||||||
|
height: 141px;
|
||||||
background: #052249;
|
background: #052249;
|
||||||
}
|
}
|
||||||
|
|
||||||
.home-foot-t{
|
.asideL-Bottom {
|
||||||
position: absolute;
|
height: calc(100% - 141px);
|
||||||
left: 50%;
|
|
||||||
bottom: 2px;
|
.commom-aside {
|
||||||
transform: translateX(-50%);
|
height: calc((100%/3) - 6px);
|
||||||
width: calc(100% - 920px);
|
margin-top: 7px;
|
||||||
height: calc((100% - 141px)/3 - 32px);
|
background: #052249;
|
||||||
min-width: 560px;
|
|
||||||
overflow: hidden;
|
|
||||||
z-index: 9;
|
|
||||||
background: url("~@/assets/images/right-1.png") no-repeat center center;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
.comom-title{
|
|
||||||
background: url("~@/assets/images/bg18.png") no-repeat center center;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
.title{
|
|
||||||
font-size: 22px;
|
|
||||||
font-family: 'YSBTH';
|
|
||||||
padding-left: 35px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
// 公用
|
|
||||||
.comom-title{
|
// 右边
|
||||||
background: url("~@/assets/images/bg17.png") no-repeat center center;
|
.asideR {
|
||||||
|
position: absolute;
|
||||||
|
right: 0px;
|
||||||
|
|
||||||
|
.commom-aside-small {
|
||||||
|
height: calc(((100% - 146px) /3) - 6px);
|
||||||
|
background: #052249;
|
||||||
|
margin-top: 9px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.commom-aside-big {
|
||||||
|
height: calc(((100% - (100% - 146px) /3)/2) - 6px);
|
||||||
|
margin-bottom: 9px;
|
||||||
|
background: #052249;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-center {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 70px;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
width: calc(100% - 890px);
|
||||||
|
z-index: 9;
|
||||||
|
background: #052249;
|
||||||
|
height: calc(100% - (100% - 141px) / 3 - 45px);
|
||||||
|
|
||||||
|
.middle-top {
|
||||||
|
height: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.middle-bottom {
|
||||||
|
height: calc(100% - 90px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-foot-t {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
bottom: 2px;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
width: calc(100% - 920px);
|
||||||
|
height: calc((100% - 141px)/3 - 32px);
|
||||||
|
min-width: 560px;
|
||||||
|
overflow: hidden;
|
||||||
|
z-index: 9;
|
||||||
|
background: url("~@/assets/images/right-1.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
|
||||||
|
.comom-title {
|
||||||
|
background: url("~@/assets/images/bg18.png") no-repeat center center;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
width: 100%;
|
|
||||||
height: 35px;
|
.title {
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
padding: 0 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
.title{
|
|
||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
font-family: 'YSBTH';
|
font-family: 'YSBTH';
|
||||||
padding-left: 35px;
|
padding-left: 35px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.comom-cnt{
|
}
|
||||||
height: calc(100% - 35px);
|
|
||||||
padding: 4px 10px;
|
// 公用
|
||||||
box-sizing: border-box;
|
.comom-title {
|
||||||
background: url("~@/assets/images/bg_13.png") no-repeat center center;
|
background: url("~@/assets/images/bg17.png") no-repeat center center;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
|
width: 100%;
|
||||||
|
height: 35px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 22px;
|
||||||
|
font-family: 'YSBTH';
|
||||||
|
padding-left: 35px;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
|
||||||
|
.comom-cnt {
|
||||||
|
height: calc(100% - 35px);
|
||||||
|
padding: 4px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: url("~@/assets/images/bg_13.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
BIN
src/assets/images/ddtb.png
Normal file
BIN
src/assets/images/ddtb.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/assets/images/xxxxxx.png
Normal file
BIN
src/assets/images/xxxxxx.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
@ -340,7 +340,7 @@ export const publicRoutes = [
|
|||||||
"@/views/backOfficeSystem/HumanIntelligence/CollectCrculate/index"
|
"@/views/backOfficeSystem/HumanIntelligence/CollectCrculate/index"
|
||||||
),
|
),
|
||||||
meta: {
|
meta: {
|
||||||
title: "人力情报数据采集管理",
|
title: "人力情报管理",
|
||||||
icon: "article"
|
icon: "article"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -485,7 +485,7 @@ export const publicRoutes = [
|
|||||||
{
|
{
|
||||||
path: "/mpvPeo",
|
path: "/mpvPeo",
|
||||||
name: "mpvPeo",
|
name: "mpvPeo",
|
||||||
component: () =>import("@/views/backOfficeSystem/DeploymentDisposal/mpvPeo/index"),
|
component: () => import("@/views/backOfficeSystem/DeploymentDisposal/mpvPeo/index"),
|
||||||
meta: {
|
meta: {
|
||||||
title: "重点人管理",
|
title: "重点人管理",
|
||||||
icon: "article"
|
icon: "article"
|
||||||
@ -494,7 +494,7 @@ export const publicRoutes = [
|
|||||||
{
|
{
|
||||||
path: "/mpvPeoSh",
|
path: "/mpvPeoSh",
|
||||||
name: "mpvPeoSh",
|
name: "mpvPeoSh",
|
||||||
component: () =>import("@/views/backOfficeSystem/DeploymentDisposal/mpvPeoSh/index"),
|
component: () => import("@/views/backOfficeSystem/DeploymentDisposal/mpvPeoSh/index"),
|
||||||
meta: {
|
meta: {
|
||||||
title: "重点人审批",
|
title: "重点人审批",
|
||||||
icon: "article"
|
icon: "article"
|
||||||
@ -503,7 +503,7 @@ export const publicRoutes = [
|
|||||||
{
|
{
|
||||||
path: "/mpvGroup",
|
path: "/mpvGroup",
|
||||||
name: "mpvGroup",
|
name: "mpvGroup",
|
||||||
component: () =>import("@/views/backOfficeSystem/DeploymentDisposal/mpvGroup/index"),
|
component: () => import("@/views/backOfficeSystem/DeploymentDisposal/mpvGroup/index"),
|
||||||
meta: {
|
meta: {
|
||||||
title: "重点群体管理",
|
title: "重点群体管理",
|
||||||
icon: "article"
|
icon: "article"
|
||||||
@ -512,7 +512,7 @@ export const publicRoutes = [
|
|||||||
{
|
{
|
||||||
path: "/mpvGroupSh",
|
path: "/mpvGroupSh",
|
||||||
name: "mpvGroupSh",
|
name: "mpvGroupSh",
|
||||||
component: () =>import("@/views/backOfficeSystem/DeploymentDisposal/mpvGroupSh/index"),
|
component: () => import("@/views/backOfficeSystem/DeploymentDisposal/mpvGroupSh/index"),
|
||||||
meta: {
|
meta: {
|
||||||
title: "重点群体审核",
|
title: "重点群体审核",
|
||||||
icon: "article"
|
icon: "article"
|
||||||
@ -521,7 +521,7 @@ export const publicRoutes = [
|
|||||||
{
|
{
|
||||||
path: "/mpvCar",
|
path: "/mpvCar",
|
||||||
name: "mpvCar",
|
name: "mpvCar",
|
||||||
component: () =>import("@/views/backOfficeSystem/DeploymentDisposal/mpvCar/index"),
|
component: () => import("@/views/backOfficeSystem/DeploymentDisposal/mpvCar/index"),
|
||||||
meta: {
|
meta: {
|
||||||
title: "重点车辆管理",
|
title: "重点车辆管理",
|
||||||
icon: "article"
|
icon: "article"
|
||||||
@ -548,6 +548,18 @@ export const publicRoutes = [
|
|||||||
title: "布控监视",
|
title: "布控监视",
|
||||||
icon: "article"
|
icon: "article"
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: "/experienceShare",
|
||||||
|
name: "experienceShare",
|
||||||
|
component: () =>
|
||||||
|
import(
|
||||||
|
"@/views/backOfficeSystem/BasicManagement/experienceShare/index"
|
||||||
|
),
|
||||||
|
meta: {
|
||||||
|
title: "经验分享",
|
||||||
|
icon: "article"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
@ -0,0 +1,109 @@
|
|||||||
|
<template>
|
||||||
|
<div class="dialog" v-if="dialogForm">
|
||||||
|
<div class="head_box">
|
||||||
|
<span class="title">经验分享{{ title }} </span>
|
||||||
|
<div>
|
||||||
|
<el-button type="primary" size="small" :loading="loading" @click="submit">保存</el-button>
|
||||||
|
<el-button size="small" @click="close">关闭</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form_cnt">
|
||||||
|
<FormMessage :formList="formData" v-model="listQuery" ref="elform" :rules="rules">
|
||||||
|
</FormMessage>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||||
|
import Xslist from '@/components/ChooseList/ChooseXs/index.vue'
|
||||||
|
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance } from "vue";
|
||||||
|
const emit = defineEmits(["updateDate"]);
|
||||||
|
const props = defineProps({
|
||||||
|
dic: Object
|
||||||
|
});
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
|
||||||
|
const dialogForm = ref(false); //弹窗
|
||||||
|
|
||||||
|
const rules = reactive({
|
||||||
|
jymc: [
|
||||||
|
{ required: true, message: "请输入经验名称", trigger: "blur" }
|
||||||
|
],
|
||||||
|
fbnr: [
|
||||||
|
{ required: true, message: "请输入经验内容", trigger: "blur" }
|
||||||
|
]
|
||||||
|
});
|
||||||
|
const formData = ref([
|
||||||
|
|
||||||
|
]);
|
||||||
|
const listQuery = ref({}); //表单
|
||||||
|
const loading = ref(false);
|
||||||
|
const elform = ref();
|
||||||
|
const title = ref("");
|
||||||
|
|
||||||
|
// 初始化数据
|
||||||
|
const init = (type, row) => {
|
||||||
|
dialogForm.value = true;
|
||||||
|
title.value = type == "add" ? "新增" : "编辑";
|
||||||
|
// 根据id查询详情
|
||||||
|
if (row) {
|
||||||
|
console.log(row,"xxxxx");
|
||||||
|
formData.value = [
|
||||||
|
{ label: "经验名称", prop: "jymc", type: "input", width: "100%" },
|
||||||
|
{ label: "发布时间", prop: "fbsj", type: "input", width: "50%",disabled:true },
|
||||||
|
{ label: "发布人", prop: "fbr", type: "input", width: "50%",disabled:true },
|
||||||
|
{ label: "经验内容", prop: "fbnr", type: "textarea", width: "100%" },
|
||||||
|
]
|
||||||
|
listQuery.value = row;
|
||||||
|
} else {
|
||||||
|
formData.value = [
|
||||||
|
{ label: "经验名称", prop: "jymc", type: "input", width: "100%" },
|
||||||
|
{ label: "任务内容", prop: "fbnr", type: "textarea", width: "100%" },
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
const submit = () => {
|
||||||
|
elform.value.submit((data) => {
|
||||||
|
let url = title.value == "新增" ? "/mosty-gsxt/gsxt/jyfx/add" : "/mosty-gsxt/gsxt/jyfx/edit";
|
||||||
|
let params = { ...data };
|
||||||
|
qcckPost(params, url).then(() => {
|
||||||
|
loading.value = false;
|
||||||
|
proxy.$message({ type: "success", message: title.value + "成功" });
|
||||||
|
emit("updateDate");
|
||||||
|
close();
|
||||||
|
}).catch(()=>{
|
||||||
|
loading.value = false;
|
||||||
|
})
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// 关闭
|
||||||
|
const close = () => {
|
||||||
|
listQuery.value = {};
|
||||||
|
loading.value = false;
|
||||||
|
dialogForm.value = false;
|
||||||
|
listQuery.value={}
|
||||||
|
};
|
||||||
|
|
||||||
|
defineExpose({ init });
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "~@/assets/css/layout.scss";
|
||||||
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
|
||||||
|
.boxlist {
|
||||||
|
width: 99%;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
::v-deep .el-textarea__inner {
|
||||||
|
min-height: 550px !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,195 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="titleBox">
|
||||||
|
<PageTitle title="经验分享">
|
||||||
|
<el-button type="primary" @click="addEdit('add', '')">
|
||||||
|
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||||
|
<span style="vertical-align: middle">新增</span>
|
||||||
|
</el-button>
|
||||||
|
</PageTitle>
|
||||||
|
</div>
|
||||||
|
<!-- 搜索 -->
|
||||||
|
<div ref="searchBox">
|
||||||
|
<Search
|
||||||
|
:searchArr="searchConfiger"
|
||||||
|
@submit="onSearch"
|
||||||
|
:key="pageData.keyCount"
|
||||||
|
></Search>
|
||||||
|
</div>
|
||||||
|
<!-- 表格 -->
|
||||||
|
<div class="tabBox">
|
||||||
|
<MyTable
|
||||||
|
:tableData="pageData.tableData"
|
||||||
|
:tableColumn="pageData.tableColumn"
|
||||||
|
:tableHeight="pageData.tableHeight"
|
||||||
|
:key="pageData.keyCount"
|
||||||
|
:tableConfiger="pageData.tableConfiger"
|
||||||
|
:controlsWidth="pageData.controlsWidth"
|
||||||
|
>
|
||||||
|
<!-- 操作 -->
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link type="primary" @click="addEdit('edit', row)">编辑</el-link>
|
||||||
|
<el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
<Pages
|
||||||
|
@changeNo="changeNo"
|
||||||
|
@changeSize="changeSize"
|
||||||
|
:tableHeight="pageData.tableHeight"
|
||||||
|
:pageConfiger="{
|
||||||
|
...pageData.pageConfiger,
|
||||||
|
total: pageData.total
|
||||||
|
}"
|
||||||
|
></Pages>
|
||||||
|
</div>
|
||||||
|
<!-- 编辑详情 -->
|
||||||
|
<EditAddForm
|
||||||
|
v-if="show"
|
||||||
|
ref="detailDiloag"
|
||||||
|
:dic="{ D_GS_BQ_LX, D_GS_BQ_DJ, D_GS_SSYJ, D_GS_BQ_LB }"
|
||||||
|
@updateDate="getList"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import Pages from "@/components/aboutTable/Pages.vue";
|
||||||
|
import Search from "@/components/aboutTable/Search.vue";
|
||||||
|
import EditAddForm from "./components/editAddForm.vue";
|
||||||
|
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
||||||
|
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
|
||||||
|
const detailDiloag = ref();
|
||||||
|
const show = ref(false);
|
||||||
|
const searchBox = ref(); //搜索框
|
||||||
|
const searchConfiger = ref([
|
||||||
|
{
|
||||||
|
label: "发布人",
|
||||||
|
prop: "fbr",
|
||||||
|
placeholder: "请输入发布人",
|
||||||
|
showType: "input"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "经验标题",
|
||||||
|
prop: "jymc",
|
||||||
|
placeholder: "请输入经验标题",
|
||||||
|
showType: "input"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "发布时间",
|
||||||
|
prop: "startTime",
|
||||||
|
placeholder: "请选择发布时间",
|
||||||
|
showType: "daterange"
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
const queryFrom = ref({});
|
||||||
|
const pageData = reactive({
|
||||||
|
tableData: [], //表格数据
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
showSelectType: "null",
|
||||||
|
loading: false
|
||||||
|
},
|
||||||
|
total: 0,
|
||||||
|
pageConfiger: {
|
||||||
|
pageSize: 20,
|
||||||
|
pageCurrent: 1
|
||||||
|
}, //分页
|
||||||
|
controlsWidth: 160, //操作栏宽度
|
||||||
|
tableColumn: [
|
||||||
|
{
|
||||||
|
label: "发布人",
|
||||||
|
prop: "fbr"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "经验名称",
|
||||||
|
prop: "jymc"
|
||||||
|
},{
|
||||||
|
label: "发布时间",
|
||||||
|
prop: "fbsj"
|
||||||
|
},{
|
||||||
|
label: "发布内容",
|
||||||
|
prop: "fbnr",
|
||||||
|
showOverflowTooltip:true
|
||||||
|
},
|
||||||
|
|
||||||
|
]
|
||||||
|
});
|
||||||
|
onMounted(() => {
|
||||||
|
tabHeightFn();
|
||||||
|
getList();
|
||||||
|
});
|
||||||
|
|
||||||
|
// 搜索
|
||||||
|
const onSearch = (val) => {
|
||||||
|
queryFrom.value = {
|
||||||
|
...val,
|
||||||
|
startTime: val.startTime&&val.startTime.length > 0 ? val.startTime[0] : '',
|
||||||
|
endTime: val.startTime&& val.startTime.length > 0 ? val.startTime[1] : ''
|
||||||
|
};
|
||||||
|
pageData.pageConfiger.pageCurrent = 1;
|
||||||
|
getList();
|
||||||
|
};
|
||||||
|
|
||||||
|
const changeNo = (val) => {
|
||||||
|
pageData.pageConfiger.pageCurrent = val;
|
||||||
|
getList();
|
||||||
|
};
|
||||||
|
const changeSize = (val) => {
|
||||||
|
pageData.pageConfiger.pageSize = val;
|
||||||
|
getList();
|
||||||
|
};
|
||||||
|
|
||||||
|
const getList = () => {
|
||||||
|
pageData.tableConfiger.loading = true;
|
||||||
|
qcckPost(queryFrom.value, "/mosty-gsxt/gsxt/jyfx/selectPage")
|
||||||
|
.then((res) => {
|
||||||
|
pageData.tableData = res.records;
|
||||||
|
pageData.total = res.total;
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 删除
|
||||||
|
const delDictItem = (id) => {
|
||||||
|
proxy
|
||||||
|
.$confirm("确定要删除", "警告", { type: "warning" })
|
||||||
|
.then(() => {
|
||||||
|
qcckDelete({}, "/mosty-gsxt/tbGsxtBqzh/" + id).then(() => {
|
||||||
|
proxy.$message({ type: "success", message: "删除成功" });
|
||||||
|
getList();
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(() => {});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 新增
|
||||||
|
const addEdit = (type, row) => {
|
||||||
|
show.value = true;
|
||||||
|
nextTick(() => {
|
||||||
|
detailDiloag.value.init(type, row);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 表格高度计算
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
pageData.tableHeight =
|
||||||
|
window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||||
|
window.onresize = function () {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-loading-mask {
|
||||||
|
background: rgba(0, 0, 0, 0.5) !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
131
src/views/home/components/assessmentItem.vue
Normal file
131
src/views/home/components/assessmentItem.vue
Normal file
@ -0,0 +1,131 @@
|
|||||||
|
<template>
|
||||||
|
<div class="warning-card ">
|
||||||
|
<div class="warning-info warning-boder pb5">
|
||||||
|
<div class="mt4 two_text_detail">{{ item[nameData.title] }}</div>
|
||||||
|
</div>
|
||||||
|
<!-- 态势研判预警 -->
|
||||||
|
<div class="warning-info pt5 pb5 flex align-center just-between" v-if="lx == 1">
|
||||||
|
<div class="mt4 two_text_detail flex align-center">预警类别：
|
||||||
|
<DictTag :tag="false" :value="item.ypLx" color="#fff" :options="dict.D_SG_TSYPGZ" />
|
||||||
|
</div>
|
||||||
|
<div class="mt4 two_text_detail">预警次数：{{ item.num }}</div>
|
||||||
|
</div>
|
||||||
|
<!-- 群体预警 -->
|
||||||
|
<div class="warning-info pt5 pb5 flex align-center just-between" v-if="lx == 2">
|
||||||
|
<div class="mt4 two_text_detail flex align-center">群体类别：
|
||||||
|
<DictTag :tag="false" :value="item.qtlb" color="#fff" :options="dict.D_GS_ZDQT_LB" />
|
||||||
|
</div>
|
||||||
|
<div class="mt4 two_text_detail flex align-center">风险等级：
|
||||||
|
<DictTag :tag="false" :value="item.yjJb" color="#fff" :options="dict.D_BZ_TYJB" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 经验分享 -->
|
||||||
|
<div class="warning-info pt5 pb5 flex align-center just-between" v-if="lx == 3">
|
||||||
|
<div class="mt4 two_text_detail">经验发布人：{{ item.fbr }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="warning-info pt5 pb5 warning-boder" v-if="lx == 1 || lx == 2">
|
||||||
|
<div class="mt4 two_text_detail">预警时间：{{ item.yjsj }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="warning-info pt5 pb5 warning-boder" v-if="lx == 3">
|
||||||
|
<div class="mt4 two_text_detail">经验内容：{{ item.fbnr }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { IdCard } from '@/utils/validate.js'
|
||||||
|
import { reactive, ref, watch } from "vue";
|
||||||
|
const props = defineProps({
|
||||||
|
item: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
}, dict: {
|
||||||
|
tupe: Object,
|
||||||
|
default: {}
|
||||||
|
},
|
||||||
|
lx: {
|
||||||
|
type: Number,
|
||||||
|
default: 1
|
||||||
|
}
|
||||||
|
});
|
||||||
|
let nameData = ref({
|
||||||
|
title: "ypMc",
|
||||||
|
lbNoe: "预警类别：",
|
||||||
|
})
|
||||||
|
watch(() => props.lx, (val) => {
|
||||||
|
switch (val) {
|
||||||
|
case 1:
|
||||||
|
nameData.value = { title: 'ypMc' }
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
nameData.value = { title: 'qtMc' }
|
||||||
|
case 3:
|
||||||
|
nameData.value = { title: 'qtMc' }
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}, { immediate: true })
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.warning-card {
|
||||||
|
background: url("~@/assets/images/xxxxxx.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
gap: 12px;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
padding: 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.warning-image {
|
||||||
|
//
|
||||||
|
// width: 80px;
|
||||||
|
// height: 100px;
|
||||||
|
|
||||||
|
// img {
|
||||||
|
// width: 100%;
|
||||||
|
// height: 100%;
|
||||||
|
// object-fit: cover;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-info {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
padding: 1px 6px;
|
||||||
|
background: #0072FF;
|
||||||
|
border-radius: 2px 2px 2px 2px;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gapline {
|
||||||
|
width: 2px;
|
||||||
|
height: 14px;
|
||||||
|
background: #e9e9e9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-boder {
|
||||||
|
border-bottom: 2px dashed #0958b2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.red {
|
||||||
|
background: url("~@/assets/images/GroupRed.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orange {
|
||||||
|
background: url("~@/assets/images/GroupOrange.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.yellow {
|
||||||
|
background: url("~@/assets/images/GroupYellow.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blue {
|
||||||
|
background: url("~@/assets/images/GroupBlue.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
125
src/views/home/components/deployControlItem.vue
Normal file
125
src/views/home/components/deployControlItem.vue
Normal file
@ -0,0 +1,125 @@
|
|||||||
|
<template>
|
||||||
|
<div class="warning-card ">
|
||||||
|
<div class="warning-image flex">
|
||||||
|
<img :src="item.yjTp" width="65" height="70" />
|
||||||
|
<div class="ml10 warning-info">
|
||||||
|
<div class="flex just-between align-center">
|
||||||
|
<div class="flex align-center mt4" v-if="item.yjLx == 2">
|
||||||
|
<span >{{ item.yjClcph }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex align-center mt4" v-else>
|
||||||
|
<span>{{ item.yjRyxm }}</span>
|
||||||
|
<span class="gapline mr10 ml10"></span>
|
||||||
|
<span>{{ IdCard(item.yjRysfzh, 2) }}</span>
|
||||||
|
<span class="gapline mr10 ml10"></span>
|
||||||
|
<span>{{ IdCard(item.yjRysfzh, 3) }}</span>
|
||||||
|
</div>
|
||||||
|
<span class="tag" v-if="item.yjbqmc">{{ item.yjbqmc }}</span>
|
||||||
|
</div>
|
||||||
|
<div v-if="item.yjLx == 2" class="flex">车牌类型：
|
||||||
|
<DictTag :tag="false" :value="item.yjHplx" color="#fff" :options="dict.D_BZ_HPZL"/>
|
||||||
|
</div>
|
||||||
|
<div class="mt4" v-else>身份证：{{ item.yjRysfzh }}</div>
|
||||||
|
<div class="mt4 two_text_detail">预警时间：{{ item.yjSj }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="warning-info warning-boder pb5">
|
||||||
|
<div class="mt4 two_text_detail">预警内容：{{ item.yjNr }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="warning-info pt5 pb5 warning-boder">
|
||||||
|
<div class="mt4 two_text_detail">处置结果：{{ item.yjNr }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="warning-info pt5 ">
|
||||||
|
<div class="two_text_detail flex lh25"><img src="@/assets/images/ddtb.png" width="20" height="25" alt="" srcset="">{{ item.yjNr }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { IdCard } from '@/utils/validate.js'
|
||||||
|
import { reactive, ref } from "vue";
|
||||||
|
const props = defineProps({
|
||||||
|
item: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
}, dict: {
|
||||||
|
tupe: Object,
|
||||||
|
default: {}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const changeBG = (str) => {
|
||||||
|
switch (str) {
|
||||||
|
case "10":
|
||||||
|
return "red";
|
||||||
|
case "20":
|
||||||
|
return "orange";
|
||||||
|
case "30":
|
||||||
|
return "yellow";
|
||||||
|
default: return "blue";
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.warning-card {
|
||||||
|
background: url("~@/assets/images/xxxxxx.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
gap: 12px;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
padding: 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.warning-image {
|
||||||
|
//
|
||||||
|
// width: 80px;
|
||||||
|
// height: 100px;
|
||||||
|
|
||||||
|
// img {
|
||||||
|
// width: 100%;
|
||||||
|
// height: 100%;
|
||||||
|
// object-fit: cover;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-info {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
padding: 1px 6px;
|
||||||
|
background: #0072FF;
|
||||||
|
border-radius: 2px 2px 2px 2px;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gapline {
|
||||||
|
width: 2px;
|
||||||
|
height: 14px;
|
||||||
|
background: #e9e9e9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.warning-boder{
|
||||||
|
border-bottom: 2px dashed #0958b2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.red {
|
||||||
|
background: url("~@/assets/images/GroupRed.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orange {
|
||||||
|
background: url("~@/assets/images/GroupOrange.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.yellow {
|
||||||
|
background: url("~@/assets/images/GroupYellow.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blue {
|
||||||
|
background: url("~@/assets/images/GroupBlue.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -5,16 +5,24 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="warning-info">
|
<div class="warning-info">
|
||||||
<div class="flex just-between align-center">
|
<div class="flex just-between align-center">
|
||||||
<div class="flex align-center mt4">
|
<div class="flex align-center mt4" v-if="item.yjLx == 2">
|
||||||
<span>{{ item.yjRyxm }}</span>
|
<span >{{ item.yjClcph }}</span>
|
||||||
<span class="gapline mr10 ml10"></span>
|
</div>
|
||||||
<span>{{ IdCard(item.yjRysfzh,2) }}</span>
|
<div class="flex align-center mt4" v-else>
|
||||||
<span class="gapline mr10 ml10"></span>
|
<span>{{ item.yjRyxm }}</span>
|
||||||
<span>{{ IdCard(item.yjRysfzh,3) }}</span>
|
<span class="gapline mr10 ml10"></span>
|
||||||
</div>
|
<span>{{ IdCard(item.yjRysfzh, 2) }}</span>
|
||||||
|
<span class="gapline mr10 ml10"></span>
|
||||||
|
<span>{{ IdCard(item.yjRysfzh, 3) }}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
<span class="tag" v-if="item.yjbqmc">{{ item.yjbqmc }}</span>
|
<span class="tag" v-if="item.yjbqmc">{{ item.yjbqmc }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt4">身份证：{{ item.yjRysfzh }}</div>
|
<div v-if="item.yjLx == 2" class="flex">车牌类型：
|
||||||
|
<DictTag :tag="false" :value="item.yjHplx" color="#fff" :options="dict.D_BZ_HPZL"/>
|
||||||
|
</div>
|
||||||
|
<div class="mt4" v-else>身份证：{{ item.yjRysfzh }}</div>
|
||||||
|
<div class="mt4 two_text_detail">预警时间：{{ item.yjSj }}</div>
|
||||||
<div class="mt4 one_text_detail">预警地址：{{ item.yjDz }}</div>
|
<div class="mt4 one_text_detail">预警地址：{{ item.yjDz }}</div>
|
||||||
<div class="mt4 two_text_detail">预警内容：{{ item.yjNr }}</div>
|
<div class="mt4 two_text_detail">预警内容：{{ item.yjNr }}</div>
|
||||||
</div>
|
</div>
|
||||||
@ -28,19 +36,22 @@ const props = defineProps({
|
|||||||
item: {
|
item: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {}
|
default: {}
|
||||||
|
}, dict: {
|
||||||
|
tupe: Object,
|
||||||
|
default: {}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const changeBG = (str) => {
|
const changeBG = (str) => {
|
||||||
switch(str){
|
switch (str) {
|
||||||
case "10":
|
case "10":
|
||||||
return "red";
|
return "red";
|
||||||
case "20":
|
case "20":
|
||||||
return "orange";
|
return "orange";
|
||||||
case "30":
|
case "30":
|
||||||
return "yellow";
|
return "yellow";
|
||||||
default: return "blue";
|
default: return "blue";
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -52,31 +63,36 @@ const changeBG = (str) => {
|
|||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
||||||
.warning-image {
|
.warning-image {
|
||||||
width: 80px;
|
width: 80px;
|
||||||
height: 100px;
|
height: 100px;
|
||||||
img {
|
|
||||||
width: 100%;
|
img {
|
||||||
height: 100%;
|
width: 100%;
|
||||||
object-fit: cover;
|
height: 100%;
|
||||||
}
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-info {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
padding: 1px 6px;
|
||||||
|
background: #0072FF;
|
||||||
|
border-radius: 2px 2px 2px 2px;
|
||||||
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.warning-info {
|
.gapline {
|
||||||
flex: 1;
|
width: 2px;
|
||||||
.tag{
|
height: 14px;
|
||||||
padding: 1px 6px;
|
background: #e9e9e9;
|
||||||
background: #0072FF;
|
|
||||||
border-radius: 2px 2px 2px 2px;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
.gapline{
|
|
||||||
width: 2px;
|
|
||||||
height: 14px;
|
|
||||||
background: #e9e9e9;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.red {
|
.red {
|
||||||
background: url("~@/assets/images/GroupRed.png") no-repeat center center;
|
background: url("~@/assets/images/GroupRed.png") no-repeat center center;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
@ -86,13 +102,14 @@ const changeBG = (str) => {
|
|||||||
background: url("~@/assets/images/GroupOrange.png") no-repeat center center;
|
background: url("~@/assets/images/GroupOrange.png") no-repeat center center;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.yellow {
|
.yellow {
|
||||||
background: url("~@/assets/images/GroupYellow.png") no-repeat center center;
|
background: url("~@/assets/images/GroupYellow.png") no-repeat center center;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.blue {
|
.blue {
|
||||||
background: url("~@/assets/images/GroupBlue.png") no-repeat center center;
|
background: url("~@/assets/images/GroupBlue.png") no-repeat center center;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -1,7 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="homeBox">
|
<div class="homeBox">
|
||||||
<GdMap></GdMap>
|
<!-- <GdMap></GdMap> -->
|
||||||
<!-- 头部 -->
|
<!-- 头部 -->
|
||||||
|
|
||||||
<Head></Head>
|
<Head></Head>
|
||||||
<!-- 内容 -->
|
<!-- 内容 -->
|
||||||
<!-- 左边 -->
|
<!-- 左边 -->
|
||||||
@ -10,19 +11,44 @@
|
|||||||
<DbCount></DbCount>
|
<DbCount></DbCount>
|
||||||
</div>
|
</div>
|
||||||
<div class="asideL-Bottom">
|
<div class="asideL-Bottom">
|
||||||
<div class="commom-aside"><QbsbCount></QbsbCount></div>
|
<div class="commom-aside">
|
||||||
<div class="commom-aside"><QblyType></QblyType></div>
|
<QbsbCount></QbsbCount>
|
||||||
<div class="commom-aside"><QbfkCount></QbfkCount></div>
|
</div>
|
||||||
|
<div class="commom-aside">
|
||||||
|
<QblyType></QblyType>
|
||||||
|
</div>
|
||||||
|
<div class="commom-aside">
|
||||||
|
<QbfkCount></QbfkCount>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 右边 -->
|
<!-- 右边 -->
|
||||||
<div class="home-aside asideR">
|
<div class="home-aside asideR">
|
||||||
<div class="commom-aside-big"><ZdryWarning></ZdryWarning></div>
|
<div class="commom-aside-big">
|
||||||
<div class="commom-aside-big"><Zdgk></Zdgk></div>
|
<SituationAssessment/>
|
||||||
<div class="commom-aside-small"><Fjqk></Fjqk></div>
|
</div>
|
||||||
|
<div class="commom-aside-big">
|
||||||
|
<GroupWarning/>
|
||||||
|
</div>
|
||||||
|
<div class="commom-aside-small">
|
||||||
|
<Experience/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 中间 -->
|
<!-- 中间 -->
|
||||||
<div class="home-center"><Yszs></Yszs></div>
|
<div class="home-center">
|
||||||
|
<div class="middle-top">
|
||||||
|
<Yszs />
|
||||||
|
</div>
|
||||||
|
<div class="flex middle-bottom mt10">
|
||||||
|
<div class="mr10" style="width: 50%;">
|
||||||
|
<DeployControl />
|
||||||
|
</div>
|
||||||
|
<div class="flex-1" style="flex: 1;">
|
||||||
|
<ZdryWarning />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
<!-- 底部 -->
|
<!-- 底部 -->
|
||||||
<div class="home-foot-t">
|
<div class="home-foot-t">
|
||||||
<Bkcz></Bkcz>
|
<Bkcz></Bkcz>
|
||||||
@ -43,14 +69,18 @@ import QbsbCount from './model/qbsbCount.vue'
|
|||||||
import QblyType from './model/qblyType.vue'
|
import QblyType from './model/qblyType.vue'
|
||||||
import Bkcz from './model/bkcz.vue'
|
import Bkcz from './model/bkcz.vue'
|
||||||
import ZdryWarning from './model/zdryWarning.vue'
|
import ZdryWarning from './model/zdryWarning.vue'
|
||||||
import Zdgk from './model/zdgk.vue'
|
import GroupWarning from './model/groupWarning.vue'
|
||||||
import Fjqk from './model/fjqk.vue'
|
import Fjqk from './model/fjqk.vue'
|
||||||
import Yszs from './model/yszs.vue'
|
import Yszs from './model/yszs.vue'
|
||||||
|
import DeployControl from './model/deployControl.vue';
|
||||||
|
import SituationAssessment from './model/situationAssessment.vue'
|
||||||
|
import Experience from './model/experience.vue'
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "@/assets/css/homeScreen.scss";
|
@import "@/assets/css/homeScreen.scss";
|
||||||
|
|
||||||
.transition {
|
.transition {
|
||||||
transition: all 0.5s;
|
transition: all 0.5s;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
149
src/views/home/model/deployControl.vue
Normal file
149
src/views/home/model/deployControl.vue
Normal file
@ -0,0 +1,149 @@
|
|||||||
|
<template>
|
||||||
|
<div class="comom-title">
|
||||||
|
<span class="title">布控预警</span>
|
||||||
|
</div>
|
||||||
|
<div class="comom-cnt zdryBox">
|
||||||
|
<div style="height:33px;">
|
||||||
|
<CheckBox :data="checkData" @changeData="changeData"></CheckBox>
|
||||||
|
</div>
|
||||||
|
<ul class="ryBox" v-loading="loading" v-infinite-scroll="loadList" style="overflow: auto">
|
||||||
|
<li v-for="item in personList" :key="item.id" @click="chooseItem(item)">
|
||||||
|
<DeployControlItem :item="item" :dict="{D_BZ_HPZL}"/>
|
||||||
|
</li>
|
||||||
|
<MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="100"></MOSTY.Empty>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
|
import { qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import DeployControlItem from "@/views/home/components/deployControlItem.vue";
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import CheckBox from "@/components/checkBox/index.vue";
|
||||||
|
import { ref ,reactive, onMounted,getCurrentInstance} from 'vue';
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const {D_BZ_HPZL} =proxy.$dict('D_BZ_HPZL')
|
||||||
|
const checkData = reactive({
|
||||||
|
list: ["一级", "二级", "三级", "四级"],
|
||||||
|
hasChoose: ["一级", "二级", "三级", "四级"]
|
||||||
|
});
|
||||||
|
const total = ref(0);
|
||||||
|
const yjJb = ref('10,20,30,40');
|
||||||
|
const pageNum = ref(1);
|
||||||
|
const loading = ref(false); // 加载中
|
||||||
|
const personList = ref([]);
|
||||||
|
onMounted(()=>{
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
// 复选框切换
|
||||||
|
function changeData(val){
|
||||||
|
pageNum.value = 1;
|
||||||
|
personList.value = [];
|
||||||
|
checkData.hasChoose = val;
|
||||||
|
let ids = [];
|
||||||
|
val.forEach(it => {
|
||||||
|
if(it == '一级') ids.push(10);
|
||||||
|
if(it == '二级') ids.push(20);
|
||||||
|
if(it == '三级') ids.push(30);
|
||||||
|
if(it == '四级') ids.push(40);
|
||||||
|
});
|
||||||
|
yjJb.value = ids.join(',')
|
||||||
|
if(val.length == 0) personList.value = [];
|
||||||
|
else getList();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 触底加载
|
||||||
|
const loadList = () =>{
|
||||||
|
if( personList.value.length == total.value) return;
|
||||||
|
pageNum.value++;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
const getList = () =>{
|
||||||
|
let data = { pageSize:10, pageNum:pageNum.value,yjJb:yjJb.value ,bkyj:1};
|
||||||
|
loading.value = true;
|
||||||
|
qcckPost(data,'/mosty-gsxt/tbYjxx/getPageList').then(res=>{
|
||||||
|
loading.value = false;
|
||||||
|
let arr = res.records || [];
|
||||||
|
personList.value = pageNum.value == 1 ? arr : personList.value.concat(arr);
|
||||||
|
total.value = res.total;
|
||||||
|
}).catch(()=>{
|
||||||
|
loading.value = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const chooseItem = (item) =>{
|
||||||
|
emitter.emit('showHomeYJ',[item]);
|
||||||
|
emitter.emit('deletePointArea','home_yj_map');
|
||||||
|
if(!item.jd || !item.jd) return proxy.$message({ type: "warning", message: "该预警没有坐标！" });
|
||||||
|
let icon = require('@/assets/point/yj.png');
|
||||||
|
if(item.yjjb == '20') icon = require('@/assets/point/yj1.png');
|
||||||
|
if(item.yjjb == '30') icon = require('@/assets/point/yj2.png');
|
||||||
|
if(item.yjjb == '40') icon = require('@/assets/point/yj3.png');
|
||||||
|
emitter.emit('addPointArea',{flag:'home_yj_map',icon,coords:[item]});
|
||||||
|
emitter.emit('setMapCenter',{location:[item.jd,item.wd],zoomLevel:10});
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-loading-mask{
|
||||||
|
background: rgba(0,0,0,0.5);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/assets/css/homeScreen.scss";
|
||||||
|
.zdryBox{
|
||||||
|
background: #052249;
|
||||||
|
height: 100%;
|
||||||
|
.ryBox{
|
||||||
|
height: calc(100% - 33px);
|
||||||
|
overflow: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
background-color: #263b70;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background-color: #146bbe;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background-color: #263b70;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-corner {
|
||||||
|
background-color: #142141;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-checkbox__label{
|
||||||
|
color:#fff;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-checked+.el-checkbox__label{
|
||||||
|
color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__inner{
|
||||||
|
background:rgba(0,144,255,0.2);
|
||||||
|
border:1px solid #0072FF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner{
|
||||||
|
background-color: #00FFFF;
|
||||||
|
border-color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner{
|
||||||
|
background-color: #00FFFF;
|
||||||
|
border-color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__inner::after{
|
||||||
|
border:2px solid #000;
|
||||||
|
border-left:0;
|
||||||
|
border-top:0;
|
||||||
|
left:3px;
|
||||||
|
top:0px;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner::before{
|
||||||
|
background: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
144
src/views/home/model/experience.vue
Normal file
144
src/views/home/model/experience.vue
Normal file
@ -0,0 +1,144 @@
|
|||||||
|
<template>
|
||||||
|
<div class="comom-title">
|
||||||
|
<span class="title">经验分享</span>
|
||||||
|
</div>
|
||||||
|
<div class="comom-cnt zdryBox">
|
||||||
|
<ul class="ryBox" v-loading="loading" v-infinite-scroll="loadList" style="overflow: auto">
|
||||||
|
<li v-for="item in personList" :key="item.id" >
|
||||||
|
<Assessment :item="item" :dict="{D_GS_ZDQT_LB,D_BZ_TYJB}" :lx="3"/>
|
||||||
|
</li>
|
||||||
|
<MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="100"></MOSTY.Empty>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
|
import { qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import Assessment from "@/views/home/components/assessmentItem.vue";
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import CheckBox from "@/components/checkBox/index.vue";
|
||||||
|
import { ref ,reactive, onMounted,getCurrentInstance} from 'vue';
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const {D_GS_ZDQT_LB,D_BZ_TYJB} =proxy.$dict('D_GS_ZDQT_LB','D_BZ_TYJB')
|
||||||
|
const checkData = reactive({
|
||||||
|
list: ["人员", "车辆"],
|
||||||
|
hasChoose: ["人员", "车辆"],
|
||||||
|
});
|
||||||
|
const total = ref(0);
|
||||||
|
const yjJb = ref('10,20,30,40');
|
||||||
|
const pageNum = ref(1);
|
||||||
|
const loading = ref(false); // 加载中
|
||||||
|
const personList = ref([]);
|
||||||
|
onMounted(()=>{
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
// 复选框切换
|
||||||
|
function changeData(val){
|
||||||
|
pageNum.value = 1;
|
||||||
|
personList.value = [];
|
||||||
|
checkData.hasChoose = val;
|
||||||
|
let ids = [];
|
||||||
|
val.forEach(it => {
|
||||||
|
if(it == '人员') ids.push(1);
|
||||||
|
if(it == '车辆') ids.push(2);
|
||||||
|
});
|
||||||
|
yjJb.value = ids.join(',')
|
||||||
|
if(val.length == 0) personList.value = [];
|
||||||
|
else getList();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 触底加载
|
||||||
|
const loadList = () =>{
|
||||||
|
if( personList.value.length == total.value) return;
|
||||||
|
pageNum.value++;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
const getList = () =>{
|
||||||
|
let data = { pageSize:10, pageCurrent:pageNum.value };
|
||||||
|
loading.value = true;
|
||||||
|
qcckPost(data,'/mosty-gsxt/gsxt/jyfx/selectPage').then(res=>{
|
||||||
|
loading.value = false;
|
||||||
|
let arr = res.records || [];
|
||||||
|
personList.value = pageNum.value == 1 ? arr : personList.value.concat(arr);
|
||||||
|
total.value = res.total;
|
||||||
|
}).catch(()=>{
|
||||||
|
loading.value = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const chooseItem = (item) =>{
|
||||||
|
emitter.emit('showHomeYJ',[item]);
|
||||||
|
emitter.emit('deletePointArea','home_yj_map');
|
||||||
|
if(!item.jd || !item.jd) return proxy.$message({ type: "warning", message: "该预警没有坐标！" });
|
||||||
|
let icon = require('@/assets/point/yj.png');
|
||||||
|
if(item.yjjb == '20') icon = require('@/assets/point/yj1.png');
|
||||||
|
if(item.yjjb == '30') icon = require('@/assets/point/yj2.png');
|
||||||
|
if(item.yjjb == '40') icon = require('@/assets/point/yj3.png');
|
||||||
|
emitter.emit('addPointArea',{flag:'home_yj_map',icon,coords:[item]});
|
||||||
|
emitter.emit('setMapCenter',{location:[item.jd,item.wd],zoomLevel:10});
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-loading-mask{
|
||||||
|
background: rgba(0,0,0,0.5);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/assets/css/homeScreen.scss";
|
||||||
|
.zdryBox{
|
||||||
|
background: #052249;
|
||||||
|
height: 100%;
|
||||||
|
.ryBox{
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
background-color: #263b70;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background-color: #146bbe;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background-color: #263b70;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-corner {
|
||||||
|
background-color: #142141;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-checkbox__label{
|
||||||
|
color:#fff;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-checked+.el-checkbox__label{
|
||||||
|
color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__inner{
|
||||||
|
background:rgba(0,144,255,0.2);
|
||||||
|
border:1px solid #0072FF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner{
|
||||||
|
background-color: #00FFFF;
|
||||||
|
border-color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner{
|
||||||
|
background-color: #00FFFF;
|
||||||
|
border-color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__inner::after{
|
||||||
|
border:2px solid #000;
|
||||||
|
border-left:0;
|
||||||
|
border-top:0;
|
||||||
|
left:3px;
|
||||||
|
top:0px;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner::before{
|
||||||
|
background: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
144
src/views/home/model/groupWarning.vue
Normal file
144
src/views/home/model/groupWarning.vue
Normal file
@ -0,0 +1,144 @@
|
|||||||
|
<template>
|
||||||
|
<div class="comom-title">
|
||||||
|
<span class="title">群体预警</span>
|
||||||
|
</div>
|
||||||
|
<div class="comom-cnt zdryBox">
|
||||||
|
<ul class="ryBox" v-loading="loading" v-infinite-scroll="loadList" style="overflow: auto">
|
||||||
|
<li v-for="item in personList" :key="item.id" >
|
||||||
|
<Assessment :item="item" :dict="{D_GS_ZDQT_LB,D_BZ_TYJB}" :lx="2"/>
|
||||||
|
</li>
|
||||||
|
<MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="100"></MOSTY.Empty>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
|
import { qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import Assessment from "@/views/home/components/assessmentItem.vue";
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import CheckBox from "@/components/checkBox/index.vue";
|
||||||
|
import { ref ,reactive, onMounted,getCurrentInstance} from 'vue';
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const {D_GS_ZDQT_LB,D_BZ_TYJB} =proxy.$dict('D_GS_ZDQT_LB','D_BZ_TYJB')
|
||||||
|
const checkData = reactive({
|
||||||
|
list: ["人员", "车辆"],
|
||||||
|
hasChoose: ["人员", "车辆"],
|
||||||
|
});
|
||||||
|
const total = ref(0);
|
||||||
|
const yjJb = ref('10,20,30,40');
|
||||||
|
const pageNum = ref(1);
|
||||||
|
const loading = ref(false); // 加载中
|
||||||
|
const personList = ref([]);
|
||||||
|
onMounted(()=>{
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
// 复选框切换
|
||||||
|
function changeData(val){
|
||||||
|
pageNum.value = 1;
|
||||||
|
personList.value = [];
|
||||||
|
checkData.hasChoose = val;
|
||||||
|
let ids = [];
|
||||||
|
val.forEach(it => {
|
||||||
|
if(it == '人员') ids.push(1);
|
||||||
|
if(it == '车辆') ids.push(2);
|
||||||
|
});
|
||||||
|
yjJb.value = ids.join(',')
|
||||||
|
if(val.length == 0) personList.value = [];
|
||||||
|
else getList();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 触底加载
|
||||||
|
const loadList = () =>{
|
||||||
|
if( personList.value.length == total.value) return;
|
||||||
|
pageNum.value++;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
const getList = () =>{
|
||||||
|
let data = { pageSize:10, pageCurrent:pageNum.value };
|
||||||
|
loading.value = true;
|
||||||
|
qcckPost(data,'/mosty-gsxt/qtYjxx/getPageList').then(res=>{
|
||||||
|
loading.value = false;
|
||||||
|
let arr = res.records || [];
|
||||||
|
personList.value = pageNum.value == 1 ? arr : personList.value.concat(arr);
|
||||||
|
total.value = res.total;
|
||||||
|
}).catch(()=>{
|
||||||
|
loading.value = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const chooseItem = (item) =>{
|
||||||
|
emitter.emit('showHomeYJ',[item]);
|
||||||
|
emitter.emit('deletePointArea','home_yj_map');
|
||||||
|
if(!item.jd || !item.jd) return proxy.$message({ type: "warning", message: "该预警没有坐标！" });
|
||||||
|
let icon = require('@/assets/point/yj.png');
|
||||||
|
if(item.yjjb == '20') icon = require('@/assets/point/yj1.png');
|
||||||
|
if(item.yjjb == '30') icon = require('@/assets/point/yj2.png');
|
||||||
|
if(item.yjjb == '40') icon = require('@/assets/point/yj3.png');
|
||||||
|
emitter.emit('addPointArea',{flag:'home_yj_map',icon,coords:[item]});
|
||||||
|
emitter.emit('setMapCenter',{location:[item.jd,item.wd],zoomLevel:10});
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-loading-mask{
|
||||||
|
background: rgba(0,0,0,0.5);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/assets/css/homeScreen.scss";
|
||||||
|
.zdryBox{
|
||||||
|
background: #052249;
|
||||||
|
height: 100%;
|
||||||
|
.ryBox{
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
background-color: #263b70;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background-color: #146bbe;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background-color: #263b70;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-corner {
|
||||||
|
background-color: #142141;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-checkbox__label{
|
||||||
|
color:#fff;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-checked+.el-checkbox__label{
|
||||||
|
color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__inner{
|
||||||
|
background:rgba(0,144,255,0.2);
|
||||||
|
border:1px solid #0072FF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner{
|
||||||
|
background-color: #00FFFF;
|
||||||
|
border-color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner{
|
||||||
|
background-color: #00FFFF;
|
||||||
|
border-color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__inner::after{
|
||||||
|
border:2px solid #000;
|
||||||
|
border-left:0;
|
||||||
|
border-top:0;
|
||||||
|
left:3px;
|
||||||
|
top:0px;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner::before{
|
||||||
|
background: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
144
src/views/home/model/situationAssessment.vue
Normal file
144
src/views/home/model/situationAssessment.vue
Normal file
@ -0,0 +1,144 @@
|
|||||||
|
<template>
|
||||||
|
<div class="comom-title">
|
||||||
|
<span class="title">态势研判预警</span>
|
||||||
|
</div>
|
||||||
|
<div class="comom-cnt zdryBox">
|
||||||
|
<ul class="ryBox" v-loading="loading" v-infinite-scroll="loadList" style="overflow: auto">
|
||||||
|
<li v-for="item in personList" :key="item.id" >
|
||||||
|
<Assessment :item="item" :dict="{D_SG_TSYPGZ}" :lx="2"/>
|
||||||
|
</li>
|
||||||
|
<MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="100"></MOSTY.Empty>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
|
import { qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import Assessment from "@/views/home/components/assessmentItem.vue";
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import CheckBox from "@/components/checkBox/index.vue";
|
||||||
|
import { ref ,reactive, onMounted,getCurrentInstance} from 'vue';
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const {D_SG_TSYPGZ} =proxy.$dict('D_SG_TSYPGZ')
|
||||||
|
const checkData = reactive({
|
||||||
|
list: ["人员", "车辆"],
|
||||||
|
hasChoose: ["人员", "车辆"],
|
||||||
|
});
|
||||||
|
const total = ref(0);
|
||||||
|
const yjJb = ref('10,20,30,40');
|
||||||
|
const pageNum = ref(1);
|
||||||
|
const loading = ref(false); // 加载中
|
||||||
|
const personList = ref([]);
|
||||||
|
onMounted(()=>{
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
// 复选框切换
|
||||||
|
function changeData(val){
|
||||||
|
pageNum.value = 1;
|
||||||
|
personList.value = [];
|
||||||
|
checkData.hasChoose = val;
|
||||||
|
let ids = [];
|
||||||
|
val.forEach(it => {
|
||||||
|
if(it == '人员') ids.push(1);
|
||||||
|
if(it == '车辆') ids.push(2);
|
||||||
|
});
|
||||||
|
yjJb.value = ids.join(',')
|
||||||
|
if(val.length == 0) personList.value = [];
|
||||||
|
else getList();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 触底加载
|
||||||
|
const loadList = () =>{
|
||||||
|
if( personList.value.length == total.value) return;
|
||||||
|
pageNum.value++;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
const getList = () =>{
|
||||||
|
let data = { pageSize:10, pageCurrent:pageNum.value };
|
||||||
|
loading.value = true;
|
||||||
|
qcckPost(data,'/mosty-gsxt/tsyp/selectPage').then(res=>{
|
||||||
|
loading.value = false;
|
||||||
|
let arr = res.records || [];
|
||||||
|
personList.value = pageNum.value == 1 ? arr : personList.value.concat(arr);
|
||||||
|
total.value = res.total;
|
||||||
|
}).catch(()=>{
|
||||||
|
loading.value = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const chooseItem = (item) =>{
|
||||||
|
emitter.emit('showHomeYJ',[item]);
|
||||||
|
emitter.emit('deletePointArea','home_yj_map');
|
||||||
|
if(!item.jd || !item.jd) return proxy.$message({ type: "warning", message: "该预警没有坐标！" });
|
||||||
|
let icon = require('@/assets/point/yj.png');
|
||||||
|
if(item.yjjb == '20') icon = require('@/assets/point/yj1.png');
|
||||||
|
if(item.yjjb == '30') icon = require('@/assets/point/yj2.png');
|
||||||
|
if(item.yjjb == '40') icon = require('@/assets/point/yj3.png');
|
||||||
|
emitter.emit('addPointArea',{flag:'home_yj_map',icon,coords:[item]});
|
||||||
|
emitter.emit('setMapCenter',{location:[item.jd,item.wd],zoomLevel:10});
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-loading-mask{
|
||||||
|
background: rgba(0,0,0,0.5);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/assets/css/homeScreen.scss";
|
||||||
|
.zdryBox{
|
||||||
|
background: #052249;
|
||||||
|
height: 100%;
|
||||||
|
.ryBox{
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
background-color: #263b70;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background-color: #146bbe;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background-color: #263b70;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-corner {
|
||||||
|
background-color: #142141;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-checkbox__label{
|
||||||
|
color:#fff;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-checked+.el-checkbox__label{
|
||||||
|
color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__inner{
|
||||||
|
background:rgba(0,144,255,0.2);
|
||||||
|
border:1px solid #0072FF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner{
|
||||||
|
background-color: #00FFFF;
|
||||||
|
border-color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner{
|
||||||
|
background-color: #00FFFF;
|
||||||
|
border-color:#00FFFF;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__inner::after{
|
||||||
|
border:2px solid #000;
|
||||||
|
border-left:0;
|
||||||
|
border-top:0;
|
||||||
|
left:3px;
|
||||||
|
top:0px;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner::before{
|
||||||
|
background: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
@ -41,4 +41,4 @@ const getCount = () =>{
|
|||||||
height: 50px;
|
height: 50px;
|
||||||
background: url('~@/assets/images/line.png') no-repeat bottom center;
|
background: url('~@/assets/images/line.png') no-repeat bottom center;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -1,14 +1,14 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="comom-title">
|
<div class="comom-title">
|
||||||
<span class="title">重点人员动态预警</span>
|
<span class="title">常规预警</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="comom-cnt zdryBox">
|
<div class="comom-cnt zdryBox">
|
||||||
<div style="height:33px;">
|
<div style="height:33px;">
|
||||||
<CheckBox :data="checkData" @changeData="changeData"></CheckBox>
|
<CheckBox :data="checkData" @changeData="changeData"></CheckBox>
|
||||||
</div>
|
</div>
|
||||||
<ul class="ryBox" v-loading="loading" v-infinite-scroll="loadList" style="overflow: auto">
|
<ul class="ryBox" v-loading="loading" v-infinite-scroll="loadList" style="overflow: auto">
|
||||||
<li v-for="item in personList" :key="item.id" @click="chooseItem(item)">
|
<li v-for="item in personList" :key="item.id" @click="chooseItem(item)">
|
||||||
<YjItem :item="item"></YjItem>
|
<YjItem :item="item" :dict="{D_BZ_HPZL}"></YjItem>
|
||||||
</li>
|
</li>
|
||||||
<MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="100"></MOSTY.Empty>
|
<MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="100"></MOSTY.Empty>
|
||||||
</ul>
|
</ul>
|
||||||
@ -23,12 +23,13 @@ import * as MOSTY from "@/components/MyComponents/index";
|
|||||||
import CheckBox from "@/components/checkBox/index.vue";
|
import CheckBox from "@/components/checkBox/index.vue";
|
||||||
import { ref ,reactive, onMounted,getCurrentInstance} from 'vue';
|
import { ref ,reactive, onMounted,getCurrentInstance} from 'vue';
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
|
const {D_BZ_HPZL} =proxy.$dict('D_BZ_HPZL')
|
||||||
const checkData = reactive({
|
const checkData = reactive({
|
||||||
list: ["红", "橙", "黄", "蓝"],
|
list: ["人员", "车辆"],
|
||||||
hasChoose: ["红","橙", "黄", "蓝"]
|
hasChoose: ["人员", "车辆"],
|
||||||
});
|
});
|
||||||
const total = ref(0);
|
const total = ref(0);
|
||||||
const yjJb = ref('10,20,30,40');
|
const yjJb = ref('1,2');
|
||||||
const pageNum = ref(1);
|
const pageNum = ref(1);
|
||||||
const loading = ref(false); // 加载中
|
const loading = ref(false); // 加载中
|
||||||
const personList = ref([]);
|
const personList = ref([]);
|
||||||
@ -42,10 +43,8 @@ function changeData(val){
|
|||||||
checkData.hasChoose = val;
|
checkData.hasChoose = val;
|
||||||
let ids = [];
|
let ids = [];
|
||||||
val.forEach(it => {
|
val.forEach(it => {
|
||||||
if(it == '红') ids.push(10);
|
if(it == '人员') ids.push(1);
|
||||||
if(it == '橙') ids.push(20);
|
if(it == '车辆') ids.push(2);
|
||||||
if(it == '黄') ids.push(30);
|
|
||||||
if(it == '蓝') ids.push(40);
|
|
||||||
});
|
});
|
||||||
yjJb.value = ids.join(',')
|
yjJb.value = ids.join(',')
|
||||||
if(val.length == 0) personList.value = [];
|
if(val.length == 0) personList.value = [];
|
||||||
@ -60,9 +59,9 @@ const loadList = () =>{
|
|||||||
}
|
}
|
||||||
|
|
||||||
const getList = () =>{
|
const getList = () =>{
|
||||||
let data = { pageSize:10, pageNum:pageNum.value,yjJb:yjJb.value };
|
let data = { pageSize:10, pageNum:pageNum.value,yjLx:yjJb.value };
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
qcckPost(data,'/mosty-jmxf/tbYjxx/getPageList').then(res=>{
|
qcckPost(data,'/mosty-gsxt/tbYjxx/getPageList').then(res=>{
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
let arr = res.records || [];
|
let arr = res.records || [];
|
||||||
personList.value = pageNum.value == 1 ? arr : personList.value.concat(arr);
|
personList.value = pageNum.value == 1 ? arr : personList.value.concat(arr);
|
||||||
|
|||||||
@ -4,7 +4,7 @@ function resolve(dir) {
|
|||||||
return path.join(__dirname, dir);
|
return path.join(__dirname, dir);
|
||||||
}
|
}
|
||||||
|
|
||||||
const serverHost = "http://192.168.8.15:8066"//波哥
|
const serverHost = "http://192.168.1.32:8066"//波哥
|
||||||
// const serverHost = "http://192.168.0.231:8006"//线上
|
// const serverHost = "http://192.168.0.231:8006"//线上
|
||||||
// const serverHost = "http://192.168.1.117:8006"//周
|
// const serverHost = "http://192.168.1.117:8006"//周
|
||||||
// const serverHost = "http://192.168.1.98:8006"//毛毛
|
// const serverHost = "http://192.168.1.98:8006"//毛毛
|
||||||
|
|||||||
Reference in New Issue
Block a user