列表样式

ZZJ

2022-07-15 f89c922c7f40425d53cfd4a80ab13ce818d9fdab

 src/views/equipmentManagement/equipmentList/components/FormList.vue

@@ -59,7 +59,7 @@
        :default-sort="{ prop: 'createTime', order: 'descending' }"
        :stripe="true"
      >
        <el-table-column label="序号" width="48" class-name="index">
        <el-table-column label="序号" width="80" class-name="index">
          <template slot-scope="scope">{{
            scope.$index + 1 + (page - 1) * size
          }}</template>
@@ -67,7 +67,7 @@
        <el-table-column
          prop="devId"
          label="设备ID"
          min-width="180"
          min-width="140"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
@@ -114,42 +114,54 @@
        <el-table-column label="操作" min-width="180">
          <template slot-scope="scope">
            <!-- 加入 -->
            <span
              class="iconfont option"
              @click="joinCluster(scope.row)"
            <el-tooltip
              content="加入集群"
              placement="top"
              v-if="!scope.row.clusterId"
              :class="{ disable: scope.row.isOnline != 1 }"
              >&#xe640;</span
            >
              <span
                class="iconfont option"
                @click="joinCluster(scope.row)"
                :class="{ disable: scope.row.isOnline != 1 }"
                >&#xe640;</span
              >
            </el-tooltip>
            <!-- 退出 -->
            <span
              class="iconfont option"
              @click="quitCluster(scope.row)"
              v-else
              :class="{ disable: scope.row.isOnline != 1 }"
              >&#xe63c;</span
            >
            <el-tooltip content="退出集群" placement="top" v-else>
              <span
                class="iconfont option"
                @click="quitCluster(scope.row)"
                :class="{ disable: scope.row.isOnline != 1 }"
                >&#xe63c;</span
              >
            </el-tooltip>
            <!-- 算法详情 -->
            <span
              class="iconfont option"
              :class="{ disable: scope.row.isOnline != 1 }"
              @click="algorithmDetail(scope.row)"
              >&#xe621;</span
            >
            <el-tooltip content="应用详情" placement="top">
              <span
                class="iconfont option"
                :class="{ disable: scope.row.isOnline != 1 }"
                @click="algorithmDetail(scope.row)"
                >&#xe621;</span
              >
            </el-tooltip>
            <!-- 设备详情 -->
            <span
              class="iconfont option"
              :class="{ disable: scope.row.isOnline != 1 }"
              @click="checkDetail(scope.row)"
              >&#xe619;</span
            >
            <el-tooltip content="设备详情" placement="top">
              <span
                class="iconfont option"
                :class="{ disable: scope.row.isOnline != 1 }"
                @click="checkDetail(scope.row)"
                >&#xe619;</span
              >
            </el-tooltip>
            <!-- 解绑 -->
            <span
              class="iconfont option"
              @click="Untying(scope.row)"
              :class="{ disable: scope.row.isOnline != 1 }"
              >&#xe617;</span
            >
            <el-tooltip content="解除绑定" placement="top">
              <span
                class="iconfont option"
                @click="Untying(scope.row)"
                :class="{ disable: scope.row.isOnline != 1 }"
                >&#xe617;</span
              >
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table>