feat:适配调整

张含笑

2025-05-30 ed58b6c48482f67d8c13ad7d6ae2a7e355ae056b

 src/views/device/airport.vue

@@ -35,44 +35,24 @@
        <el-tag>{{ row.dept_name }}</el-tag>
      </template>
      <template #status="{ row }">
        <div
          v-if="row.status == true"
          class="onlineStatus"
         
        >
          <div
          class="onlineStatus-dot"
            
          ></div>
          <span style="margin-left: 5px">在线</span>
        <div v-if="row.status == true" class="onlineStatus">
          <div class="onlineStatus-dot"></div>
          <span class="online">在线</span>
        </div>
        <div
          v-if="row.status == false"
          class="onlineStatus"
        >
          <div
            class="onlineStatus-dot1"
            
          ></div>
          <span style="margin-left: 5px">离线</span>
        <div v-if="row.status == false" class="onlineStatus">
          <div class="onlineStatus-dot1"></div>
          <span class="online">离线</span>
        </div>
      </template>
      <template #firmware_status="{ row }">
        <div
          v-if="row.firmware_status == 1"
          class="onlineStatus1"
         
        >
        <div v-if="row.firmware_status == 1" class="onlineStatus1">
          <el-tag type="info">无需升级</el-tag>
          <el-tag type="primary" effect="dark" class="active-element" @click="rollFirmware(row)"
            >版本管理</el-tag
          >
          <!-- <div style="background-color: #f1f1f1; border-radius: 4px">无需升级</div> -->
        </div>
        <div
          v-if="row.firmware_status == 2"
          class="onlineStatus1"
        >
        <div v-if="row.firmware_status == 2" class="onlineStatus1">
          <!-- <el-tag type="success" effect="dark" class="active-element" @click="updateFirmware(row)"
            >升级固件</el-tag
          > -->
@@ -81,19 +61,13 @@
          >
          <!-- <div @click="updateFirmware(row)" class="firmware_status">升级固件</div> -->
        </div>
        <div
          v-if="row.firmware_status == 3"
          class="onlineStatus "
        >
        <div v-if="row.firmware_status == 3" class="onlineStatus">
          <el-tag type="success" effect="dark" class="active-element" @click="updateFirmware(row)"
            >一致性升级</el-tag
          >
          <!-- <div @click="updateFirmware(row)" class="firmware_status">一致性升级</div> -->
        </div>
        <div
          v-if="row.firmware_status == 4"
          class="onlineStatus "
        >
        <div v-if="row.firmware_status == 4" class="onlineStatus">
          <el-tag effect="dark" class="active-element" @click="updateFirmware(row)">升级中</el-tag>
          <el-progress
            v-if="row.firmware_progress > 0 && row.firmware_progress < 100"
@@ -171,12 +145,8 @@
            :value="item.id"
          >
            <span style="float: left">{{ item.name + ': ' + item.endpoint }}</span>
            <span v-if="item.status == 1" style="float: right; color: #8492a6; font-size: 13px">{{
              item.categoryName
            }}</span>
            <span v-if="item.status == 2" style="float: right; color: #40cb8b; font-size: 13px">{{
              item.categoryName
            }}</span>
            <span v-if="item.status == 1" class="status1">{{ item.categoryName }}</span>
            <span v-if="item.status == 2" class="status2">{{ item.categoryName }}</span>
          </el-option>
        </el-select>
      </div>
@@ -707,9 +677,9 @@
      this.ossEnd = row.oss_id;
      // 查询下拉列表
      const param = {
        categoryKeys: "1,3,6"
      }
      getOssList(1, 50,param).then(res => {
        categoryKeys: '1,3,6',
      };
      getOssList(1, 50, param).then(res => {
        const data = res.data.data;
        that.ossList = data.records;
      });
@@ -1154,17 +1124,40 @@
</script>

<style lang="scss" scoped>
.status2 {
  float: right;
  color: #40cb8b;
  font-size: 13px;
}
.status1 {
  float: right;
  color: #8492a6;
  font-size: 13px;
}
.online {
  margin-left: 5px;
}
.onlineStatus1 {
display: flex; flex-direction: column; align-items: center
  display: flex;
  flex-direction: column;
  align-items: center;
}
.onlineStatus {
display: flex; flex-direction: row; align-items: center
  display: flex;
  flex-direction: row;
  align-items: center;
}
.onlineStatus-dot {
width: 15px; height: 15px; background-color: #40cb8b; border-radius: 50%
  width: 15px;
  height: 15px;
  background-color: #40cb8b;
  border-radius: 50%;
}
.onlineStatus-dot1 {
width: 15px; height: 15px; background-color: #de5e5e; border-radius: 50%
  width: 15px;
  height: 15px;
  background-color: #de5e5e;
  border-radius: 50%;
}
.firmware_status {
  background-color: aqua;