pc-master #35
@ -1,20 +1,20 @@
|
||||
@charset "UTF-8";
|
||||
.scroll, .el-dropdown-menu, .formula .page-content, .history .page-content .el-table--scrollable-x .el-table__body-wrapper {
|
||||
.scroll, .el-dropdown-menu, .index .index-content .right.right-page .page-content, .formula .page-content, .realTime, .history .page-content .el-table--scrollable-x .el-table__body-wrapper {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar, .el-dropdown-menu::-webkit-scrollbar, .formula .page-content::-webkit-scrollbar, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar {
|
||||
.scroll::-webkit-scrollbar, .el-dropdown-menu::-webkit-scrollbar, .index .index-content .right.right-page .page-content::-webkit-scrollbar, .formula .page-content::-webkit-scrollbar, .realTime::-webkit-scrollbar, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar {
|
||||
/*滚动条整体*/
|
||||
width: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar-track, .el-dropdown-menu::-webkit-scrollbar-track, .formula .page-content::-webkit-scrollbar-track, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-track {
|
||||
.scroll::-webkit-scrollbar-track, .el-dropdown-menu::-webkit-scrollbar-track, .index .index-content .right.right-page .page-content::-webkit-scrollbar-track, .formula .page-content::-webkit-scrollbar-track, .realTime::-webkit-scrollbar-track, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-track {
|
||||
/*滚动条轨道*/
|
||||
background: #013769;
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar-thumb, .el-dropdown-menu::-webkit-scrollbar-thumb, .formula .page-content::-webkit-scrollbar-thumb, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb {
|
||||
.scroll::-webkit-scrollbar-thumb, .el-dropdown-menu::-webkit-scrollbar-thumb, .index .index-content .right.right-page .page-content::-webkit-scrollbar-thumb, .formula .page-content::-webkit-scrollbar-thumb, .realTime::-webkit-scrollbar-thumb, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb {
|
||||
/*滚动条里面的滑块*/
|
||||
width: 4px;
|
||||
cursor: pointer;
|
||||
@ -22,11 +22,11 @@
|
||||
border: 3px solid #013769;
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar-thumb:hover, .el-dropdown-menu::-webkit-scrollbar-thumb:hover, .formula .page-content::-webkit-scrollbar-thumb:hover, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
|
||||
.scroll::-webkit-scrollbar-thumb:hover, .el-dropdown-menu::-webkit-scrollbar-thumb:hover, .index .index-content .right.right-page .page-content::-webkit-scrollbar-thumb:hover, .formula .page-content::-webkit-scrollbar-thumb:hover, .realTime::-webkit-scrollbar-thumb:hover, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
|
||||
/*滚动条鼠标事件，鼠标放上去出现的事件*/
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar-corner, .el-dropdown-menu::-webkit-scrollbar-corner, .formula .page-content::-webkit-scrollbar-corner, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-corner {
|
||||
.scroll::-webkit-scrollbar-corner, .el-dropdown-menu::-webkit-scrollbar-corner, .index .index-content .right.right-page .page-content::-webkit-scrollbar-corner, .formula .page-content::-webkit-scrollbar-corner, .realTime::-webkit-scrollbar-corner, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-corner {
|
||||
/*滚动条边角*/
|
||||
}
|
||||
|
||||
@ -404,6 +404,19 @@
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.index .index-content .right.right-page {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.index .index-content .right.right-page .page-content {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 92, 178, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.2);
|
||||
padding: 30px 30px 20px;
|
||||
}
|
||||
|
||||
.input-view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -1467,15 +1480,22 @@
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 20px;
|
||||
flex-direction: column;
|
||||
justify-content: unset;
|
||||
}
|
||||
|
||||
.realTime .new-data {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.realTime .page-content {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
height: auto;
|
||||
flex-shrink: 0;
|
||||
background: rgba(0, 92, 178, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.2);
|
||||
padding: 30px 30px 20px;
|
||||
padding: 30px 20px 20px;
|
||||
}
|
||||
|
||||
.realTime .page-content .control-view {
|
||||
@ -1635,6 +1655,62 @@
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.realTime .page-content .status-view {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
background: rgba(0, 132, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.35);
|
||||
margin: 7.5px;
|
||||
}
|
||||
|
||||
.realTime .page-content .status-view .status-view-top {
|
||||
padding: 0 10px 0 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 50px;
|
||||
border-bottom: 1px solid rgba(0, 180, 255, 0.35);
|
||||
}
|
||||
|
||||
.realTime .page-content .status-view .status-view-top .status-view-top-left {
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.realTime .page-content .status-view .status-view-top .status-view-top-right {
|
||||
cursor: pointer;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.realTime .page-content .status-view .status-view-content {
|
||||
width: 100%;
|
||||
height: calc(100% - 51px);
|
||||
}
|
||||
|
||||
.realTime .page-content .status-view .status-view-content .status-noTrue {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.realTime .page-content .status-view .status-view-content .status-noTrue > img {
|
||||
width: 40px;
|
||||
height: 35px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.realTime .page-content .status-view .status-view-content .status-noTrue > div {
|
||||
font-size: 14px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #8BEAFF;
|
||||
}
|
||||
|
||||
.history .page-content {
|
||||
width: 100%;
|
||||
}
|
||||
@ -2032,3 +2108,25 @@
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.plantingPlan {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.plantingPlan .btn {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.plantingPlan .btn .img {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.plantingPlan .plan-view {
|
||||
width: 440px;
|
||||
height: 200px;
|
||||
background: url(../img/plan-bg.png) no-repeat center;
|
||||
background-size: 100% 100%;
|
||||
margin: 7.5px 15px;
|
||||
}
|
||||
|
||||
2
src/assets/css/main.min.css
vendored
2
src/assets/css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -426,6 +426,20 @@
|
||||
width: calc(100% - 240px);
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
|
||||
&.right-page {
|
||||
padding: 20px;
|
||||
|
||||
.page-content {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 92, 178, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.20);
|
||||
padding: 30px 30px 20px;
|
||||
@extend .scroll;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1047,6 +1061,7 @@
|
||||
|
||||
.sensorSet {
|
||||
height: 100%;
|
||||
|
||||
.sensor-view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -1117,14 +1132,15 @@
|
||||
.right-sel {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
|
||||
>div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
margin-right: 30px;
|
||||
padding:0 0 15px 0;
|
||||
padding: 0 0 15px 0;
|
||||
|
||||
>.no-sel {
|
||||
margin-right: 10px;
|
||||
width: 35px;
|
||||
@ -1161,26 +1177,30 @@
|
||||
}
|
||||
}
|
||||
|
||||
&.sensorSet-con{
|
||||
.sensor-view{
|
||||
&.sensorSet-con {
|
||||
.sensor-view {
|
||||
height: calc(100% - 120px);
|
||||
}
|
||||
.right-sel{
|
||||
|
||||
.right-sel {
|
||||
width: 100%;
|
||||
flex-wrap: wrap;
|
||||
.sensor-type-div{
|
||||
|
||||
.sensor-type-div {
|
||||
margin-bottom: 0;
|
||||
background: unset;
|
||||
border: none;
|
||||
height: auto;
|
||||
.sensor-sel{
|
||||
>div{
|
||||
|
||||
.sensor-sel {
|
||||
>div {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sensor-type {
|
||||
.sensor-title {
|
||||
font-size: 20px;
|
||||
@ -1188,8 +1208,9 @@
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
padding: 20px 0;
|
||||
.sensor-sel{
|
||||
>div{
|
||||
|
||||
.sensor-sel {
|
||||
>div {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
@ -1553,34 +1574,46 @@
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 20px;
|
||||
|
||||
flex-direction: column;
|
||||
justify-content: unset;
|
||||
@extend .scroll;
|
||||
|
||||
.new-data {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
height: auto;
|
||||
flex-shrink: 0;
|
||||
background: rgba(0, 92, 178, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.20);
|
||||
padding: 30px 30px 20px;
|
||||
.control-view{
|
||||
padding: 30px 20px 20px;
|
||||
|
||||
.control-view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: 10px;
|
||||
.title{
|
||||
|
||||
.title {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.control-list{
|
||||
|
||||
.control-list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
|
||||
overflow: hidden;
|
||||
max-width: 806px;
|
||||
|
||||
>div {
|
||||
// width: 100%!important;
|
||||
display: flex;
|
||||
overflow: unset !important;
|
||||
|
||||
|
||||
>div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -1588,18 +1621,20 @@
|
||||
margin-right: 100px;
|
||||
}
|
||||
}
|
||||
.list-view{
|
||||
|
||||
.list-view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 10px;
|
||||
.icon{
|
||||
|
||||
.icon {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.timeNow {
|
||||
text-align: center;
|
||||
// position: absolute;
|
||||
@ -1725,6 +1760,63 @@
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.status-view {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
background: rgba(0, 132, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.35);
|
||||
margin: 7.5px;
|
||||
|
||||
.status-view-top {
|
||||
padding: 0 10px 0 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 50px;
|
||||
border-bottom: 1px solid rgba(0, 180, 255, .35);
|
||||
|
||||
.status-view-top-left {
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.status-view-top-right {
|
||||
cursor: pointer;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.status-view-content {
|
||||
width: 100%;
|
||||
height: calc(100% - 51px);
|
||||
|
||||
.status-noTrue {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
|
||||
>img {
|
||||
width: 40px;
|
||||
height: 35px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
>div {
|
||||
font-size: 14px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #8BEAFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -2062,11 +2154,11 @@
|
||||
border-top: 1px solid rgba(0, 180, 255, .75);
|
||||
border-bottom: 1px solid rgba(0, 180, 255, .75);
|
||||
padding-bottom: 17px;
|
||||
|
||||
.table-header{
|
||||
|
||||
.table-header {
|
||||
font-size: 18px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
@ -2075,16 +2167,19 @@ font-weight: bold;
|
||||
border-top: 1px solid rgba(0, 180, 255, .75);
|
||||
border-bottom: 1px solid rgba(0, 180, 255, .75);
|
||||
overflow-x: scroll;
|
||||
>div{
|
||||
|
||||
>div {
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
}
|
||||
.table-header{
|
||||
|
||||
.table-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
>div{
|
||||
width:70px;
|
||||
|
||||
>div {
|
||||
width: 70px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -2092,14 +2187,16 @@ font-weight: bold;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
.table-tr{
|
||||
>div{
|
||||
|
||||
|
||||
.table-tr {
|
||||
>div {
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
>div{
|
||||
width:70px;
|
||||
|
||||
>div {
|
||||
width: 70px;
|
||||
height: 100%;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
@ -2109,19 +2206,24 @@ font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
.table-tr{
|
||||
|
||||
.table-tr {
|
||||
width: 100%;
|
||||
>div{
|
||||
|
||||
>div {
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
}
|
||||
>div:nth-child(odd){
|
||||
|
||||
>div:nth-child(odd) {
|
||||
background: rgba(0, 47, 94, .35);
|
||||
}
|
||||
>div:nth-child(even){
|
||||
background: rgba(0,180,255,0.2);
|
||||
|
||||
>div:nth-child(even) {
|
||||
background: rgba(0, 180, 255, 0.2);
|
||||
}
|
||||
|
||||
.no-sel {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
@ -2139,6 +2241,7 @@ font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.table-header {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
@ -2146,9 +2249,31 @@ font-weight: bold;
|
||||
text-align: center;
|
||||
background: rgba(0, 180, 255, 0.2);
|
||||
font-size: 16px;
|
||||
font-family: Arial;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
font-family: Arial;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.plantingPlan {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.btn {
|
||||
opacity: 1;
|
||||
|
||||
.img {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.plan-view {
|
||||
width: 440px;
|
||||
height: 200px;
|
||||
background: url(../img/plan-bg.png) no-repeat center;
|
||||
background-size: 100% 100%;
|
||||
margin: 7.5px 15px;
|
||||
}
|
||||
}
|
||||
BIN
src/assets/image/status.png
Normal file
BIN
src/assets/image/status.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
BIN
src/assets/image/vrcode-icon0.png
Normal file
BIN
src/assets/image/vrcode-icon0.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 376 B |
BIN
src/assets/image/vrcode-icon1.png
Normal file
BIN
src/assets/image/vrcode-icon1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 160 B |
BIN
src/assets/image/vrcode-icon2.png
Normal file
BIN
src/assets/image/vrcode-icon2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 441 B |
BIN
src/assets/image/vrcode-icon3.png
Normal file
BIN
src/assets/image/vrcode-icon3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 519 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
BIN
src/assets/img/add.png
Normal file
BIN
src/assets/img/add.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 682 B |
BIN
src/assets/img/more.png
Normal file
BIN
src/assets/img/more.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 272 B |
BIN
src/assets/img/plan-bg.png
Normal file
BIN
src/assets/img/plan-bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
BIN
src/assets/img/plan.png
Normal file
BIN
src/assets/img/plan.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
BIN
src/assets/img/status-no.png
Normal file
BIN
src/assets/img/status-no.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/assets/img/线条.png
Normal file
BIN
src/assets/img/线条.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/img/组 1.png
Normal file
BIN
src/assets/img/组 1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
src/assets/img/组 2.png
Normal file
BIN
src/assets/img/组 2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 908 B |
BIN
src/assets/img/组 3.png
Normal file
BIN
src/assets/img/组 3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 744 B |
BIN
src/assets/img/组 4.png
Normal file
BIN
src/assets/img/组 4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
@ -97,6 +97,18 @@ const routes = [
|
||||
},]
|
||||
},]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/vrcode',
|
||||
name: 'vrcode',
|
||||
component: () => import('../views/vrcode.vue'),
|
||||
redirect: '/plantingPlan',
|
||||
children: [{
|
||||
path: '/plantingPlan',
|
||||
name: 'plantingPlan',
|
||||
component: () => import('../views/vrcode/plantingPlan.vue')
|
||||
}]
|
||||
},
|
||||
]
|
||||
|
||||
const router = new VueRouter({
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="formula realTime">
|
||||
<div class="page-content">
|
||||
<div class="page-content new-data">
|
||||
|
||||
<div class="control-view" v-if="deviceName == 10">
|
||||
<div class="title">气象站:</div>
|
||||
@ -62,6 +62,7 @@
|
||||
<div class="right" id="realTime-line"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -102,6 +103,8 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
statusList:[{name:'左向天窗',open:true,progress:55,isTrue:true,index:1},
|
||||
{name:'右向天窗',open:true,progress:55,isTrue:false,index:2}],
|
||||
time: null,//右上角时间
|
||||
list: [],
|
||||
inputData: [],
|
||||
@ -120,15 +123,15 @@ export default {
|
||||
this.indexs = this.$route.query.index ? this.$route.query.index : store.equipmentIndex;
|
||||
this.deviceName = store.equipmentList[this.indexs - 1].deviceName
|
||||
setTimeout(() => {
|
||||
|
||||
if(this.player){
|
||||
|
||||
if (this.player) {
|
||||
this.player.stop()
|
||||
that.player.destroy()
|
||||
that.player=null
|
||||
that.player = null
|
||||
}
|
||||
that.dataInit();
|
||||
|
||||
|
||||
|
||||
|
||||
}, 0);
|
||||
},
|
||||
},
|
||||
@ -155,7 +158,7 @@ export default {
|
||||
// this.player.dispose();
|
||||
this.player.stop()
|
||||
this.player.destroy()
|
||||
this.player=null
|
||||
this.player = null
|
||||
}
|
||||
that.timer && clearInterval(that.timer)
|
||||
this.$bus.$off('refreshTime')
|
||||
@ -165,7 +168,7 @@ export default {
|
||||
// divW和divH是获取了父级宽高 使播放容器能铺满div
|
||||
let divW = this.$refs.monitor.clientWidth
|
||||
let divH = this.$refs.monitor.clientHeight
|
||||
this.player = new EZUIKit.EZUIKitPlayer({
|
||||
this.player = new EZUIKit.EZUIKitPlayer({
|
||||
id: 'video-js', // 视频容器ID
|
||||
accessToken: 'at.757ro68z1ur26g6f1ondfwl1cl1bivxy-4ckiflya3u-1192hd2-ucup11mjb',
|
||||
url: this.url,
|
||||
@ -330,14 +333,14 @@ export default {
|
||||
// channelid: '1'
|
||||
// }
|
||||
if (!this.player) {
|
||||
this.api.getGethls(data2).then(res => {
|
||||
if (res.data.code == 200) {
|
||||
this.url = res.data.msg
|
||||
this.createVideoNew()
|
||||
}
|
||||
})
|
||||
this.api.getGethls(data2).then(res => {
|
||||
if (res.data.code == 200) {
|
||||
this.url = res.data.msg
|
||||
this.createVideoNew()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
} else if (this.deviceName == 10) {
|
||||
this.api.getControlRtdata(equipmentId).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
@ -454,4 +457,39 @@ export default {
|
||||
.video-js-select-quality-item {
|
||||
color: rgba(0, 0, 0, 0.85) !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
.set-status-blue {
|
||||
color: #409eff;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.set-status-red {
|
||||
color: red;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.del-text {
|
||||
color: #000;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.color-blue {
|
||||
span {
|
||||
color: #409eff;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.status-save {
|
||||
width: 45px;
|
||||
height: 28px;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #dcdfe6;
|
||||
color: #606266;
|
||||
font-size: 14px;
|
||||
}</style>
|
||||
170
src/views/vrcode.vue
Normal file
170
src/views/vrcode.vue
Normal file
@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<div class="index">
|
||||
<div class="header">
|
||||
<div class="header-left">
|
||||
<img src="../assets/image/logo.png" alt="">
|
||||
</div>
|
||||
<div class="header-center">
|
||||
|
||||
</div>
|
||||
<div class="header-right" v-if="userInfo">
|
||||
<img src="../assets/image/avatar.png" alt="">
|
||||
<div class="user-data">
|
||||
<div class="name">欢迎，{{ userInfo.nickName }}</div>
|
||||
<div class="time" v-if="time"> {{ time.year.year }}-{{ time.year.month }}-{{ time.year.date }}</div>
|
||||
</div>
|
||||
<div class="login-out" @click="loginOut"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="index-content">
|
||||
<div class="left collapse scroll">
|
||||
<el-collapse v-model="activeNames">
|
||||
<template v-for="item, index in leftList">
|
||||
<el-collapse-item :name="index + 1" :key="index" v-if="!item.isRouter">
|
||||
<template slot="title" class="collapse-title">
|
||||
<div class="img"><img :src="item.img" alt=""></div> {{ item.name }}
|
||||
</template>
|
||||
<ul class="table-ul">
|
||||
<li class="table-li" @click="toRouter1(item1)"
|
||||
:class="item.routerList.indexOf(routerNow) != -1 && routerIndex == item1.index ? 'active' : ''"
|
||||
v-for="item1, index1 in item.list" :key="index1">{{ item1.name }}
|
||||
</li>
|
||||
</ul>
|
||||
</el-collapse-item>
|
||||
<div @click="toRouter1(item)" :class="routerNow == item.router ? 'active' : ''" class="no-list"
|
||||
v-else>
|
||||
<div class="img"><img :src="item.img" alt=""></div>{{ item.name }}
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</el-collapse>
|
||||
</div>
|
||||
<div class="right right-page">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getnowtime } from '../assets/js/nowTime'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
time: null,//当前时间
|
||||
|
||||
|
||||
activeNames: [3],
|
||||
leftList: [
|
||||
{ name: '种植计划', img: require('../assets/image/vrcode-icon0.png'), list: [], router: '', isRouter: true, },
|
||||
{ name: '生产环节', routerList: [], img: require('../assets/image/vrcode-icon1.png'), list: [{ name: '农事管理' }, { name: '施肥记录' }, { name: '打药记录' }, { name: '采摘记录' }, { name: '清洁记录' }, { name: '病虫害管理' },] },
|
||||
{ name: '产品追溯', routerList: [], img: require('../assets/image/vrcode-icon2.png'), list: [{ name: '溯源批次' }, { name: '配置溯源版面' }, { name: '各种报告库' }] },
|
||||
{ name: '基础信息设置', routerList: [], img: require('../assets/image/vrcode-icon3.png'), list: [{ name: '作物品种' }, { name: '种植栽培模式' }, { name: '农事作业工序' }, { name: '人员管理' }, { name: '农场信息管理' }, { name: '供应商管理' }, { name: '生产资料管理' }, { name: '农机工具管理' }, { name: '作物外观图片库' },] },],
|
||||
routerNow: 'plantingPlan',
|
||||
deviceName: 1,
|
||||
routerIndex: 1,
|
||||
equipmentList: [],
|
||||
userInfo: null,
|
||||
loading: true,//页面加载
|
||||
IDTimer: null,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
"$route"(newName, oldName) {
|
||||
this.gerRouter();
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
const that = this
|
||||
this.getTime()
|
||||
var router = this.$route.query
|
||||
if (router.token && router.userid) {
|
||||
localStorage.setItem('token', router.token)
|
||||
|
||||
this.api.getUser({ userId: router.userid }).then(res => {
|
||||
var data = res.data.data
|
||||
data.userid = router.userid
|
||||
localStorage.setItem('userInfo', JSON.stringify(data))
|
||||
this.userInfo = JSON.parse(localStorage.getItem('userInfo'))
|
||||
this.gerRouter();
|
||||
// this.getEqbyid()
|
||||
})
|
||||
return
|
||||
} else {
|
||||
if (localStorage.getItem('token')) {
|
||||
this.userInfo = JSON.parse(localStorage.getItem('userInfo'))
|
||||
}
|
||||
this.gerRouter();
|
||||
// this.getEqbyid()
|
||||
}
|
||||
this.IDTimer && clearInterval(this.IDTimer)
|
||||
this.IDTimer = setInterval(() => {
|
||||
// that.getEqbyid()
|
||||
}, 120000);
|
||||
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.IDTimer && clearInterval(this.IDTimer)
|
||||
},
|
||||
methods: {
|
||||
|
||||
gerRouter() {
|
||||
var store = this.$store.state
|
||||
this.routerIndex = this.$route.query.index ? this.$route.query.index : store.equipmentIndex
|
||||
this.routerNow = this.$route.name;
|
||||
if (store.equipmentList.length) {
|
||||
this.deviceName = store.equipmentList[this.routerIndex - 1].deviceName
|
||||
} else {
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
loginOut() {
|
||||
this.api.loginOut().then((res) => {
|
||||
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: '退出登录成功',
|
||||
type: "success",
|
||||
});
|
||||
localStorage.removeItem('token')
|
||||
localStorage.removeItem('userInfo')
|
||||
this.$router.push({ name: 'login' })
|
||||
} else {
|
||||
this.$message.error("请求出错");
|
||||
}
|
||||
})
|
||||
},
|
||||
toHome() {
|
||||
this.$router.push({ name: 'home' })
|
||||
},
|
||||
toRouter(item) {
|
||||
if (item.router) {
|
||||
if (item.http) {
|
||||
window.location.href = item.http;
|
||||
}
|
||||
} else {
|
||||
this.$message('当前页面正在努力开发中');
|
||||
}
|
||||
},
|
||||
toRouter1(item) {
|
||||
if (item.router) {
|
||||
if (item.http) {
|
||||
window.location.href = item.http;
|
||||
}
|
||||
} else {
|
||||
this.$message('当前页面正在努力开发中');
|
||||
}
|
||||
},
|
||||
getTime() {
|
||||
this.time = getnowtime()
|
||||
const that = this
|
||||
setInterval(() => {
|
||||
that.time = getnowtime()
|
||||
}, 1000);
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
31
src/views/vrcode/plantingPlan.vue
Normal file
31
src/views/vrcode/plantingPlan.vue
Normal file
@ -0,0 +1,31 @@
|
||||
<template>
|
||||
<div class="plantingPlan">
|
||||
<div class="page-content">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/img/plan.png" alt="" />
|
||||
种植计划
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="btn green"><img src="../../assets/img/add.png" alt="">新增种植计划</div>
|
||||
</div>
|
||||
<div class="flex-view border-none">
|
||||
<div class="plan-view" v-for="item,index in 10">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
mounted() { },
|
||||
methods: {},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user