diff --git a/src/assets/style/main.css b/src/assets/style/main.css index d1ab09bd..6d886f0b 100644 --- a/src/assets/style/main.css +++ b/src/assets/style/main.css @@ -189,7 +189,8 @@ body:has(.zindex-1) .v-modal { color: #F56C6C; border-color: #F56C6C; } -.delete_btn:hover { +.delete_btn:hover, +.delete_btn:focus { color: #F56C6C !important; } .border-radius_3 { diff --git a/src/assets/style/main.less b/src/assets/style/main.less index a4c84011..9c54c420 100644 --- a/src/assets/style/main.less +++ b/src/assets/style/main.less @@ -245,7 +245,8 @@ body:has(.zindex-1) .v-modal { color: #F56C6C; border-color: #F56C6C; } -.delete_btn:hover { +.delete_btn:hover, +.delete_btn:focus { color: #F56C6C !important; } .border-radius_3 { diff --git a/src/views/companyAdmin/companyBigScreen/highRiskOperation/homeworkControlProcess.vue b/src/views/companyAdmin/companyBigScreen/highRiskOperation/homeworkControlProcess.vue index a173ee5f..9ff2e92e 100644 --- a/src/views/companyAdmin/companyBigScreen/highRiskOperation/homeworkControlProcess.vue +++ b/src/views/companyAdmin/companyBigScreen/highRiskOperation/homeworkControlProcess.vue @@ -1002,7 +1002,7 @@ const equipmentDetail = ref({}); // 查看设备详情 const onEquipmentClick = (row) => { equipmentDetail.value = row; - getWorkTicketQueryById(); + getWorkTicketQueryById(equipmentDetail.value.workTicketId); equipmentDialog.value = true; }; @@ -1046,7 +1046,7 @@ const timeInterval = ref(null); const onViewDetail = (row, flag) => { if (row.id == workTicketDetail.value.id && flag != true) return; workTicketDetail.value = row; - getWorkTicketQueryById(); + getWorkTicketQueryById(workTicketDetail.value.id); getWorkTicketHistoryList(); initPoliceCameraItemList(); if (timeInterval.value) { @@ -1057,9 +1057,9 @@ const onViewDetail = (row, flag) => { }, 1000 * 60 * 30); }; // 通过id查询作业票详情 -const getWorkTicketQueryById = () => { +const getWorkTicketQueryById = (id) => { getWorkTicketQueryByIdApi({ - id: equipmentDetail.value.workTicketId, + id: id, // projectSn: workTicketInfo.projectSn, }).then((res) => { if (res.code == 200) { diff --git a/src/views/companyAdmin/companyBigScreen/terminalOperation/homeworkControlProcess.vue b/src/views/companyAdmin/companyBigScreen/terminalOperation/homeworkControlProcess.vue index ce392e3c..5d7ac475 100644 --- a/src/views/companyAdmin/companyBigScreen/terminalOperation/homeworkControlProcess.vue +++ b/src/views/companyAdmin/companyBigScreen/terminalOperation/homeworkControlProcess.vue @@ -1186,20 +1186,25 @@ const projectSnName = computed(() => { /deep/ .pagerBox1 { color: white; text-align: center; + .el-pagination__total { color: white; } + .el-pager li { background-color: transparent; } + .el-pager li.active { background-color: #262d47; color: white; } + > button { background-color: transparent; } } + .headerNoise { width: calc(100% - 20px - 40px); height: calc(100% - 132px - 10px - 30px); @@ -1210,19 +1215,23 @@ const projectSnName = computed(() => { background-image: url("~@/assets/images/companyBigScreen/terminalOperation/index-bg.png"); background-size: 100% 100%; background-repeat: no-repeat; + .el-cascader, /deep/ .el-input__icon { line-height: 23px; } + /deep/ .el-input__inner { height: 23px; line-height: 23px; background-color: transparent; color: white; } + .headerNoise-left { width: 22%; height: 100%; + .content-header { position: absolute; top: 8px; @@ -1267,6 +1276,7 @@ const projectSnName = computed(() => { right: 10px; bottom: 10px; } + .wks_active { background-color: #727e93; } @@ -1340,19 +1350,23 @@ const projectSnName = computed(() => { // 滚动条样式 /* 滚动条整体样式 */ .box-main::-webkit-scrollbar { - width: 7px; /* 滚动条宽度 */ + width: 7px; + /* 滚动条宽度 */ } /* 滚动条轨道 */ .box-main::-webkit-scrollbar-track { - background: transparent; /* 轨道背景色 */ + background: transparent; + /* 轨道背景色 */ } /* 滚动条滑块 */ .box-main::-webkit-scrollbar-thumb { - background: #4e5b71; /* 滑块背景色 */ + background: #4e5b71; + /* 滑块背景色 */ width: 10px; - border-radius: 5px; /* 滑块圆角 */ + border-radius: 5px; + /* 滑块圆角 */ } .box-search { @@ -1378,14 +1392,17 @@ const projectSnName = computed(() => { :deep(.el-date-editor) { width: 62%; margin-top: 10px; + .el-range-input { color: white; background-color: transparent; } + .el-range-separator { color: white; line-height: 14px; } + .el-range__icon { line-height: 14px; } @@ -1447,6 +1464,7 @@ const projectSnName = computed(() => { > div:nth-child(1) { width: 41%; + > div:last-child { width: 38px; height: 38px; @@ -1458,6 +1476,7 @@ const projectSnName = computed(() => { > div:nth-child(2) { width: 41%; + > div:last-child { width: 38px; height: 38px; @@ -1472,6 +1491,7 @@ const projectSnName = computed(() => { > div:nth-child(5) { margin-top: 20px; width: 24%; + > div:last-child { width: 30px; height: 30px; @@ -1483,11 +1503,13 @@ const projectSnName = computed(() => { no-repeat; background-size: 100% 100%; } + > div:nth-child(4) > div:last-child { background: url("~@/assets/images/companyBigScreen/terminalOperation/index-icon4.png") no-repeat; background-size: 100% 100%; } + > div:nth-child(5) > div:last-child { background: url("~@/assets/images/companyBigScreen/terminalOperation/index-icon5.png") no-repeat; @@ -1577,6 +1599,7 @@ const projectSnName = computed(() => { right: 10px; top: 10px; cursor: pointer; + > div:last-child { width: 26px; height: 26px; @@ -1584,12 +1607,15 @@ const projectSnName = computed(() => { background-repeat: no-repeat; background-size: 100% 100%; } + .goback { background-image: url("~@/assets/images/companyBigScreen/terminalOperation/goback.png") !important; } + > div:not(:first-child) { margin-left: 10px; } + > div:nth-child(2) { font-weight: bold; font-size: 15px; @@ -1602,6 +1628,7 @@ const projectSnName = computed(() => { margin-top: 1%; height: 94%; display: flex; + .content-left_active { width: 451px !important; } @@ -1612,14 +1639,17 @@ const projectSnName = computed(() => { background: url("~@/assets/images/companyBigScreen/terminalOperation/cardImg.png") no-repeat; background-size: 100% 100%; + .content-left_box1 { padding: 10px 20px 20px; // overflow: auto; overflow: hidden; height: calc(100% - 30px); + .scrollbar-height { height: calc(100% - 30px) !important; } + .box1 { display: flex; align-items: flex-start; @@ -1637,9 +1667,11 @@ const projectSnName = computed(() => { width: 70px; color: #a2a4af; } + .content-file_list { display: flex; flex-direction: column; + > div { display: flex; align-items: center; @@ -1647,15 +1679,18 @@ const projectSnName = computed(() => { height: 30px; padding: 0 16px 0 20px; background: rgba(39, 88, 192, 0.2); + > div:first-child { font-size: 14px; color: rgba(255, 255, 255, 0.6); + > div:last-child { width: 170px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } + > div:first-child { width: 16px; height: 16px; @@ -1664,10 +1699,12 @@ const projectSnName = computed(() => { background-size: 100% 100%; } } + > div:last-child { font-size: 14px; color: #5181f6; cursor: pointer; + > div:first-child { width: 16px; height: 16px; @@ -1676,30 +1713,37 @@ const projectSnName = computed(() => { background-size: 100% 100%; } } + > div { display: flex; align-items: center; + > div:not(:first-child) { margin-left: 6px; } } } } + .content-img { display: flex; flex-wrap: wrap; + > .el-image:nth-child(n + 4) { margin-top: 20px; } + > .el-image:not(:nth-child(3n + 1)) { margin-left: 20px; } + > .el-image { width: 80px; height: 80px; border-radius: 4px; } } + .state-box { padding: 4px 8px; min-width: 40px; @@ -1709,16 +1753,19 @@ const projectSnName = computed(() => { text-align: center; flex: initial !important; } + .gfx_active { background-color: #ff0000; color: #ffffff; } } + .box1-header { display: flex; align-items: center; justify-content: space-between; padding: 10px 0; + .shrink-box { width: 20px; height: 20px; @@ -1728,6 +1775,7 @@ const projectSnName = computed(() => { cursor: pointer; transform: rotate(180deg); } + > div:first-child { font-weight: 800; font-size: 16px; @@ -1735,11 +1783,13 @@ const projectSnName = computed(() => { } } } + .content-left_box { display: flex; align-items: center; justify-content: center; height: 100%; + > div:last-child { width: 20px; height: 20px; @@ -1748,6 +1798,7 @@ const projectSnName = computed(() => { background-size: 100% 100%; cursor: pointer; } + > div:first-child { font-weight: 800; font-size: 16px; @@ -1771,12 +1822,14 @@ const projectSnName = computed(() => { width: 100%; height: 160px; } + .hls-video_title { display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 8px 0; + > div:last-child { width: 20px; height: 20px; @@ -1784,15 +1837,18 @@ const projectSnName = computed(() => { no-repeat; background-size: 100% 100%; } + > div:first-child { font-size: 14px; color: #ffffff; } } + .content-right_box-main { height: calc(100% - 40px) !important; // height: calc(100% - 32px - 182px - 34px - 12px) !important; } + .content-right-top1 { display: flex; flex-wrap: wrap; @@ -1813,6 +1869,7 @@ const projectSnName = computed(() => { margin-top: 10px; } } + .content-right-top { display: flex; flex-wrap: wrap; @@ -1844,10 +1901,12 @@ const projectSnName = computed(() => { background: rgba(39, 88, 192, 0.1); box-shadow: inset 0px 0px 2px 2px #051220; border: 1px solid rgba(39, 88, 192, 0.6); + .el-table__expand-icon > .el-icon { font-size: 14px; color: #b2b8c2; } + .time-diff { padding: 3px 10px; background: rgba(75, 141, 236, 0.1); @@ -1856,6 +1915,7 @@ const projectSnName = computed(() => { font-size: 11px; color: #ffffff; } + .viewreplay { display: flex; align-items: center; @@ -1965,24 +2025,30 @@ const projectSnName = computed(() => { } } } + .headerNoise-right_active { margin-left: 0; width: 100%; + .h-card .content-main .content-right_active { width: 100% !important; } + .content-right { margin-left: 0 !important; width: 100% !important; } + .content-right_box-main1 { height: calc(100% - 40px) !important; } + .content-right-top2 { height: 100% !important; display: flex; flex-wrap: wrap; align-content: flex-start; + > div { width: 32.4% !important; height: 350px; @@ -1990,9 +2056,11 @@ const projectSnName = computed(() => { no-repeat; background-size: 100% 100%; margin: 0 !important; + .hls-video { height: 310px !important; } + :deep(.sub-wnd) { width: 100% !important; } @@ -2008,8 +2076,10 @@ const projectSnName = computed(() => { } } } + :deep(.equipment-dialog) { margin-top: 0; + .el-dialog { top: 50%; left: 50%; @@ -2022,27 +2092,33 @@ const projectSnName = computed(() => { .el-dialog__header { padding: 15px 20px 5px; } + .el-dialog__title { font-style: italic; color: white; } + .el-dialog__body { padding: 0 !important; } + .dialog_content { padding: 0 20px 5px; display: flex; justify-content: space-between; overflow-y: auto; max-height: 85vh; + // flex-wrap: wrap; .content-right { width: 48%; + .content-right_header { font-weight: 800; font-size: 16px; color: #ffffff; } + .box1 { display: flex; align-items: flex-start; @@ -2060,9 +2136,11 @@ const projectSnName = computed(() => { width: 70px; color: #a2a4af; } + .content-file_list { display: flex; flex-direction: column; + > div { display: flex; align-items: center; @@ -2070,15 +2148,18 @@ const projectSnName = computed(() => { height: 30px; padding: 0 16px 0 20px; background: rgba(39, 88, 192, 0.2); + > div:first-child { font-size: 14px; color: rgba(255, 255, 255, 0.6); + > div:last-child { width: 170px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } + > div:first-child { width: 16px; height: 16px; @@ -2087,10 +2168,12 @@ const projectSnName = computed(() => { background-size: 100% 100%; } } + > div:last-child { font-size: 14px; color: #5181f6; cursor: pointer; + > div:first-child { width: 16px; height: 16px; @@ -2099,24 +2182,30 @@ const projectSnName = computed(() => { background-size: 100% 100%; } } + > div { display: flex; align-items: center; + > div:not(:first-child) { margin-left: 6px; } } } } + .content-img { display: flex; flex-wrap: wrap; + > .el-image:nth-child(n + 4) { margin-top: 20px; } + > .el-image:not(:nth-child(3n + 1)) { margin-left: 20px; } + > .el-image { width: 80px; height: 80px; @@ -2125,8 +2214,10 @@ const projectSnName = computed(() => { } } } + .content-left { width: 49%; + > div { display: flex; align-items: flex-start; @@ -2144,6 +2235,7 @@ const projectSnName = computed(() => { width: 70px; color: #a2a4af; } + .state-box { padding: 4px 8px; min-width: 40px; @@ -2153,10 +2245,12 @@ const projectSnName = computed(() => { text-align: center; flex: initial !important; } + .state-box_offline { background-color: #f7f7f7; color: #272d45 !important; } + .gfx_active { background-color: #ff0000; color: #ffffff; @@ -2165,21 +2259,26 @@ const projectSnName = computed(() => { } } } + :deep(.hls-video-dialog) { top: 50%; transform: translateY(-50%); margin-top: 0; + .el-dialog__header { display: none; } + .el-dialog__body { padding: 0 !important; } + .dialog_content { padding: 0 !important; height: initial; overflow: hidden; } + .audio-content { display: flex; align-items: center; @@ -2187,6 +2286,7 @@ const projectSnName = computed(() => { padding: 13px 22px 13px 13px; position: relative; overflow: hidden; + audio { opacity: 0; position: absolute; @@ -2200,34 +2300,42 @@ const projectSnName = computed(() => { background-repeat: no-repeat; background-size: 100% 100%; } + .bodyworn_pause { background-image: url("~@/assets/images/companyBigScreen/terminalOperation/bodyworn_pause.png"); } + .bodyworn_play { background-image: url("~@/assets/images/companyBigScreen/terminalOperation/bodyworn_play.png"); } + > div:first-child { display: flex; flex-direction: column; justify-content: space-between; + > div:last-child { display: flex; align-items: center; font-size: 14px; color: #808080; margin-top: 20px; + > div:not(:first-child) { margin-left: 19px; } } + > div:first-child { display: flex; align-items: center; font-size: 14px; color: #272d45; + > div:not(:first-child) { margin-left: 10px; } + > div:first-child { width: 19px; height: 18px; @@ -2235,6 +2343,7 @@ const projectSnName = computed(() => { background-repeat: no-repeat; background-size: 100% 100%; } + > div:last-child { padding: 2px 10px; border: 1px solid #f7af13; @@ -2244,12 +2353,15 @@ const projectSnName = computed(() => { } } } + .video-content { // height: 260px; padding-bottom: 20px; + .card-img { width: 100%; height: 180px; + img, video, .el-image { @@ -2257,6 +2369,7 @@ const projectSnName = computed(() => { height: 100%; } } + .card-flex { display: flex; justify-content: space-between; @@ -2264,15 +2377,18 @@ const projectSnName = computed(() => { padding: 15px 15px 0; color: #333333; font-size: 15px; + p { margin: 0; } + .webkit-clamp_1 { width: 50%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } + .card-num { font-size: 14px; color: #808080; @@ -2280,16 +2396,19 @@ const projectSnName = computed(() => { } } } + .notoDta { top: 50%; width: 60%; left: 50%; position: absolute; transform: translate(-50%, -50%); + img { width: 40%; margin: 5% 30%; } + p { color: #fff; font-size: calc(100vw * 14 / 1920);