ZZJ
2021-11-10 9e8e7fa9a379eb5a633ad1087211bd5dd38d014a
src/pages/syslog/views/pollingLog.vue
@@ -11,7 +11,7 @@
          <div class="opts">
            <div class="opt" @click="openDialog">选择摄像机</div>
          </div>
          <div class="pick-num">已选({{pickNum}})</div>
          <div class="pick-num">已选 : ( {{ pickNum }} )</div>
        </div>
        <div class="search">
          <el-input
@@ -20,11 +20,18 @@
            size="small"
            class="input-with-select"
          >
            <el-button
            <span
              class="icon iconfont"
              @click="getOperationLog(1)"
              slot="append"
            >
              &#xe714;
            </span>
            <!-- <el-button
              slot="append"
              icon="el-icon-search"
              @click="getScheduleLog"
            ></el-button>
            ></el-button> -->
          </el-input>
        </div>
      </div>
@@ -77,11 +84,22 @@
        ></el-table-column>
        <el-table-column
          :align="'center'"
          prop="procName"
          prop="minute"
          label="轮询时长(分)"
        ></el-table-column>
      </el-table>
    </div>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="page"
      :page-sizes="[15, 30, 50, 100]"
      :page-size="15"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
    >
    </el-pagination>
    <el-dialog
      title="选择摄像机"
@@ -142,7 +160,7 @@
      dialogVisible: false,
      procID: "",
      procName: "",
      pickNum:0
      pickNum: 0,
    };
  },
  mounted() {
@@ -151,6 +169,14 @@
    this.getOptions();
  },
  methods: {
    handleSizeChange(val) {
      this.pageSize = val;
      this.getOperationLog();
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getOperationLog();
    },
    cancelShow() {
      this.dialogVisible = false;
      this.pickAllNot();
@@ -163,7 +189,7 @@
    },
    confirmCamera() {
      const selectedIDs = this.$refs.cameraTree.getCheckedKeys();
      this.pickNum = selectedIDs.length
      this.pickNum = selectedIDs.length;
      this.procID = selectedIDs.join(",");
      this.getScheduleLog();
      this.dialogVisible = false;
@@ -230,8 +256,9 @@
<style lang="scss">
.polling-log {
  margin: 0 auto;
  padding: 10px 8px 10px 5px;
  background-color: rgba(248, 248, 248, 1);
  padding: 0px 8px 10px 5px;
  border-top: 1px solid #e1e0e6;
  background-color: rgba(242, 242, 247, 1);
  width: 100%;
  display: flex;
  overflow: auto;
@@ -267,57 +294,100 @@
    }
  }
  .top {
    height: 100px;
    height: 132px;
    background: #fff;
    border-radius: 5px;
    .first {
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 45px;
      padding: 0 20px;
      padding: 20px 20px 0 20px;
      .time-option {
        display: flex;
        justify-content: space-between;
        align-items: center;
        .title,.pick-num {
        .title,
        .pick-num {
          margin-right: 10px;
          font-size: 14px;
          min-width: fit-content;
          font-weight: bold;
          font-size: 12px;
        }
        .opts {
          display: flex;
          justify-content: space-between;
          .opt {
            width: fit-content;
            height: 32px;
            width: 100px;
            height: 36px;
            padding: 0 15px;
            border-radius: 4px;
            cursor: pointer;
            margin-right: 20px;
            line-height: 32px;
            font-size: 14px;
            line-height: 36px;
            font-size: 12px;
            font-weight: 700;
            color: #fff;
            background-color: rgba(61, 104, 225, 1);
            background-color: #4e94ff;
          }
        }
      }
      .search {
        width: 280px;
        height: 36px;
        display: flex;
        align-items: center;
        .input-with-select {
          width: 100%;
          height: 100%;
          input {
            height: 100%;
            border-radius: 18px 0 0 18px;
            border: 2px solid #f2f2f7;
            border-right: none;
            &:focus,
            &:focus + .el-input-group__append {
              border-color: #409eff;
            }
          }
          .el-input-group__append {
            transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
            background-color: #fff;
            border: 2px solid #f2f2f7;
            border-radius: 0 18px 18px 0;
            border-left: none;
          }
        }
        span {
          cursor: pointer;
          color: rgb(47, 45, 61);
          font-weight: 700;
          font-size: 19px;
        }
      }
    }
    .second {
      display: flex;
      margin: 10px 0;
      margin: 15px 0 20px 0;
      padding: 0 20px;
      align-items: center;
      font-size: 14px;
      .bar {
        display: flex;
        align-items: baseline;
        width: fit-content;
        padding-left: 20px;
        margin-right: 30px;
        min-width: 120px;
        .name {
          margin-right: 5px;
          margin-right: 15px;
          min-width: fit-content;
          font-weight: bold;
          font-size: 12px;
        }
      }
    }
@@ -327,6 +397,7 @@
    border-radius: 5px;
    padding: 12px;
    background-color: white;
    .tableBox {
      th {
        padding: 0 !important;
@@ -340,5 +411,11 @@
      }
    }
  }
  .el-pagination {
    padding: 20px 5px;
    height: 100%;
    box-sizing: border-box;
    background-color: white;
  }
}
</style>