Selaa lähdekoodia

机器人巡检页面表格样式调整

fbw 1 vuosi sitten
vanhempi
commit
2dcbdc08b9
1 muutettua tiedostoa jossa 61 lisäystä ja 11 poistoa
  1. 61 11
      src/views/robotSLG/robot/index.vue

+ 61 - 11
src/views/robotSLG/robot/index.vue

@@ -167,8 +167,8 @@
         </Container2>
       </div>
       <div class="bottom-center">
-        <el-tabs class="record-list" type="border-card">
-          <el-tab-pane label="巡检记录">
+        <el-tabs class="record-list" type="border-card" style="color: white">
+          <el-tab-pane class="tab" label="巡检记录">
             <el-table
               ref="table"
               :data="patrolRecordList"
@@ -192,7 +192,7 @@
               </el-table-column>
             </el-table>
           </el-tab-pane>
-          <el-tab-pane label="最近任务">
+          <el-tab-pane class="tab" label="最近任务">
             <el-table
               :data="taskList"
               ref="table"
@@ -206,7 +206,7 @@
             >
               <el-table-column label="编号" prop="id" width="130" align="center" />
               <!-- <el-table-column label="类型" prop="type" align="center" /> -->
-              <el-table-column label="开始时间" prop="beginTime"  align="center" />
+              <el-table-column label="开始时间" prop="beginTime" align="center" />
               <el-table-column label="检测总数" prop="totalNumber" width="130" align="center" />
               <el-table-column label="正常数量" prop="finishedNumber" width="130" align="center" />
               <el-table-column label="缺陷数量" prop="defectNumber" width="130" align="center" />
@@ -521,7 +521,7 @@ export default {
       try {
         let res = await getRobotList({ token: this.robotToken, pageIndex: 1, pageSize: 10 })
         if (res.code === 1) {
-          // console.log(res)
+          console.log('机器人列表', res)
           this.robotList = res.data.list
           this.activeRobot = this.robotList[0]
           this.pictureUrl =
@@ -636,7 +636,7 @@ export default {
         let res = await getTaskList({ token: this.robotToken, pageIndex: 1, pageSize: 10 })
         if (res.code === 1) {
           this.taskList = res.data.list
-          // console.log(this.taskList)
+          console.log('任务列表', this.taskList)
         } else {
           this.getRobotToken()
         }
@@ -653,7 +653,7 @@ export default {
         })
         if (res.code === 1) {
           this.runningTask = res.data.list[0]
-          // console.log(this.runningTask)
+          console.log('执行中任务', this.runningTask)
         } else {
           this.getRobotToken()
         }
@@ -670,7 +670,7 @@ export default {
         })
         if (res.code === 1) {
           this.patrolRecordList = res.data.list
-          // console.log(this.patrolRecordList)
+          console.log('执行中任务巡检记录表', this.patrolRecordList)
           this.itemKey = Math.random()
         } else {
           this.getRobotToken()
@@ -683,6 +683,7 @@ export default {
         let res = await getPatrolRecordList({ token: this.robotToken, pageIndex: 1, pageSize: 10 })
         if (res.code === 1) {
           this.patrolRecordList = res.data.list
+          console.log('巡检记录表', this.patrolRecordList)
         } else {
           this.getRobotToken()
         }
@@ -694,6 +695,7 @@ export default {
         let res = await getAlarmList({ token: this.robotToken, pageIndex: 1, pageSize: 10 })
         if (res.code === 1) {
           this.alarmList = res.data.list
+          console.log('报警列表', this.alarmList)
         } else {
           this.getRobotToken()
         }
@@ -839,6 +841,53 @@ export default {
 </style>
 
 <style lang="scss" scoped>
+
+/* 去除灰色横条 */
+::v-deep .el-tabs__nav-wrap::after {
+  position: static !important;
+}
+/* 设置滑块颜色 */
+::v-deep .el-tabs__active-bar {
+  background-color: #538fff !important;
+}
+/* 设置滑块停止位置 */
+::v-deep .el-tabs__active-bar.is-top {
+  height: 37px;
+  width: 104px !important;
+  border-radius: 17px;
+  top: 0px !important;
+  left: -18px !important;
+  position: absolute !important;
+  z-index: 1;
+}
+/* 设置当前选中样式 */
+::v-deep .el-tabs__item.is-active {
+  color: #fff !important;
+  background-color: #1878cc !important;
+  z-index: 2;
+}
+::v-deep .el-tabs__item {
+  color: #1878cc !important;
+  background-color: #ffffff !important;
+  z-index: 2;
+}
+
+::v-deep .el-tabs__nav-scroll {
+  background-color: #ffffff !important;
+}
+/* 设置未被选中样式 */
+::v-deep .el-tabs__item {
+  padding: 0 20px !important;
+  width: 104px;
+  box-sizing: border-box;
+  display: inline-block;
+  position: relative !important;
+  color: #1878cc !important;
+  z-index: 2;
+  border-inline-end-color: #fff;
+}
+
+
 .monitor-container {
   min-height: calc(100vh - 125px);
   height: calc(100vh - 125px);
@@ -1036,17 +1085,18 @@ export default {
       min-width: 53%;
       background-color: rgb(24, 120, 204);
       // .parameter {
-        //   padding: 24px 31px;
+      //   padding: 24px 31px;
       //   display: flex;
       //   flex-wrap: wrap;
       //   gap: 23px;
       //   .parameter-item {
-        //     height: 32px;
+      //     height: 32px;
       //   }
       // }
       .record-list {
         margin-bottom: 10px;
         // min-height: calc(30vh);
+        background-color: rgb(24, 120, 204);
       }
     }
     .bottom-right {
@@ -1055,7 +1105,7 @@ export default {
       // min-width: 25%;
       background-color: rgb(24, 120, 204);
       .alarm {
-        height: 290px;
+        height: 246px;
         // height: calc(30vh);
         overflow-y: scroll;
         .alarm-item-container {