odc.xiaohui
2023-02-09 085fa2fb257e9f11f8f6d34bf12e2dc281c36b4d
src/views/operate/log/index.vue
@@ -3,35 +3,42 @@
    <header>
      <div class="header-nav">
        <span class="nav-left">数据筛选</span>
        <span class="nav-right">高级搜索</span>
        <!-- <span class="nav-right">高级搜索</span> -->
      </div>
      <div class="header-content">
        <div class="search">
          <span>输入查询:</span>
          <el-input placeholder="内容信息" v-model="context"></el-input>
          <div class="option">
            <el-input placeholder="内容信息" v-model="context"></el-input>
          </div>
        </div>
        <div class="message-status">
          <span>操作类型:</span>
          <el-select v-model="operationType">
            <el-option
              v-for="item in operationTypeList"
              :key="item.id"
              :label="item.operationType"
              :value="item.operationType"
            >
            </el-option>
          </el-select>
          <div class="option">
            <el-select v-model="operationType">
              <el-option
                v-for="item in operationTypeList"
                :key="item.id"
                :label="item.operationType"
                :value="item.operationType"
              >
              </el-option>
            </el-select>
          </div>
        </div>
        <div class="message-kind">
          <span>时间范围:</span>
          <el-date-picker
            v-model="mytime"
            type="daterange"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          >
          </el-date-picker>
          <div class="option">
            <el-date-picker
              v-model="mytime"
              type="daterange"
              range-separator="-"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            >
            </el-date-picker>
          </div>
        </div>
        <div class="find">
          <el-button
@@ -62,11 +69,14 @@
        </div>
        <!-- 数据展示 -->
        <el-table
          border
          stripe
          ref="multipleTable"
          :header-cell-style="{
            background: '#06122c',
            // background: '#06122c',
            background: '#F5F5F5',
            'font-size': '12px',
            color: '#4b9bb7',
            color: '#606266',
            'font-weight': '650',
            'line-height': '45px',
          }"
@@ -102,7 +112,7 @@
        <!-- tools -->
        <div class="tools">
          <div class="funs">
            <div class="funsItem funs-sp">
            <div class="funsItem funs-sp funs-first">
              <el-checkbox v-model="all" @change="selectAll()"
                >全选</el-checkbox
              >
@@ -147,7 +157,7 @@
  </div>
</template>
<script>
import { getNowDate } from "@/utils/helper";
import { downloadFile, getNowDate } from "@/utils/helper";
import helper from "@/utils/mydate";
import { parseTime } from "@/utils/index";
import { createNamespacedHelpers } from "vuex";
@@ -342,8 +352,7 @@
            }
          });
        })
        .catch((err) => {
        });
        .catch((err) => {});
    },
    // 表格监听
    tableChange(list) {
@@ -405,8 +414,7 @@
        .then((_) => {
          done();
        })
        .catch((err) => {
        });
        .catch((err) => {});
    },
    // 自定义关闭弹窗
    closeDialog({ flag, index }) {
@@ -415,51 +423,53 @@
      }
    },
    //
    timechange(data) {
    },
    timechange(data) {},
  },
};
</script>
<style lang="scss" scoped>
.userList {
  text-align: left;
  margin: 10px 20px;
  color: #4b9bb7;
  padding: 10px 20px;
  color: #606266;
  border: 1px solid #ccc;
  header {
    background-color: #09152f;
    border: 1pox solid #fff;
    background-color: white;
    border: 1px solid #fff;
    .header-nav {
      line-height: 40px;
      padding: 0 30px;
      padding-left: 10px;
      display: flex;
      justify-content: space-between;
      font-weight: 650;
    }
    .header-content {
      padding: 0 40px;
      padding: 0;
      display: flex;
      line-height: 100px;
      justify-content: space-between;
      // justify-content: space-between;
      align-items: center;
      span {
        min-width: 120px;
        padding-left: 15px;
      }
      .search,
      .message-status,
      .message-kind {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex: 1;
        // flex: 1;
        .el-input {
          flex: 1;
          color: #1d3f57;
          &::v-deep .el-input__inner {
            background-color: #09152f;
            border: 1px solid #17324c;
          }
          //&::v-deep .el-input__inner {
          //  background-color: #09152f;
          //  border: 1px solid #17324c;
          //}
        }
        .el-select {
          flex: 1;
@@ -467,11 +477,13 @@
        .el-date-editor {
          flex: 1;
        }
        :deep(.el-range-input) {
          background-color: #09152f;
        }
        //:deep(.el-range-input) {
        //  background-color: #09152f;
        //}
      }
      .find {
        margin-left: 15px;
      }
      .findBtn {
        line-height: 100px;
        margin-left: 15px;
@@ -488,10 +500,10 @@
  }
  main {
    background-color: #09152f;
    background-color: white;
    margin-top: 20px;
    padding-bottom: 50px;
    border: 1pox solid #fff;
    border: 1px solid #fff;
    .el-link {
      color: #4b9bb7;
@@ -516,13 +528,15 @@
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 20px;
      //padding: 0 20px;
      .funs {
        display: flex;
        .funs-first {
          margin-left: 0 !important;
        }
        .funs-sp {
          border: 1px solid #17324c;
          border: 1px solid #dcdfe6;
        }
        .funsItem {
@@ -543,10 +557,10 @@
            width: 120px;
          }
          &::v-deep .el-input__inner {
            border: none;
            background-color: #09152f;
          }
          //&::v-deep .el-input__inner {
          //  border: none;
          //  background-color: #09152f;
          //}
          &:hover {
            border: 1px solid #4b9bb7;
@@ -564,33 +578,33 @@
        line-height: 50px;
        justify-content: center;
        .el-pagination {
          &::v-deep li,
          &::v-deep .btn-prev,
          &::v-deep .btn-next {
            background-color: #071f39;
            color: #4b9bb7;
          }
          &::v-deep .active {
            background-color: #409eff;
            color: #fff;
          }
        }
        //.el-pagination {
        //  &::v-deep li,
        //  &::v-deep .btn-prev,
        //  &::v-deep .btn-next {
        //    background-color: #071f39;
        //    color: #4b9bb7;
        //  }
        //
        //  &::v-deep .active {
        //    background-color: #409eff;
        //    color: #fff;
        //  }
        //}
      }
    }
    .el-table {
      color: #4b9bb7;
      font-size: 10px;
      // color: #606266;
      // font-size: 10px;
      &::v-deep .el-table__empty-block {
        background-color: #09152f;
      }
      &::v-deep .el-table__empty-block {
        color: #4b9bb7;
      }
      //&::v-deep .el-table__empty-block {
      //  background-color: #09152f;
      //}
      //
      //&::v-deep .el-table__empty-block {
      //  color: #4b9bb7;
      //}
      .operation {
        display: flex;
@@ -598,20 +612,20 @@
        .line {
          padding: 0 5px;
        }
        color: var(--operation-color);
        span:hover {
          cursor: pointer;
        }
      }
    }
    .el-table::v-deep .warning-row {
      background: #06122c;
    }
    .el-table::v-deep .success-row {
      background: #071f39;
    }
    //.el-table::v-deep .warning-row {
    //  background: #06122c;
    //}
    //
    //.el-table::v-deep .success-row {
    //  background: #071f39;
    //}
  }
}
</style>
</style>