heyujie
2021-11-03 a827dbadd7dcc86067cb71d36a62abbf3418a91f
src/pages/shuohuangMonitorAnalyze/components/memberManage.vue
@@ -1,11 +1,11 @@
<template>
  <div class="member-manage">
    <div class="left">
      <div style="margin-bottom: 10px">
        <!-- <el-input placeholder="请输入" v-model="treeWord" size="small">
      <!-- <div style="margin-bottom: 10px">
       <el-input placeholder="请输入" v-model="treeWord" size="small">
          <el-button slot="append" icon="el-icon-search"></el-button>
        </el-input> -->
      </div>
        </el-input>
      </div> -->
      <el-tree
        ref="leftTreeNodes"
        :data="treeData"
@@ -17,7 +17,7 @@
        @node-click="checkNode"
        @node-contextmenu="nodeContextMenu"
      ></el-tree>
      <div
      <!-- <div
        class="menuList"
        v-show="showMenu"
        :style="{ top: menuTop + 'px', left: menuLeft + 'px' }"
@@ -28,7 +28,7 @@
          <li>重命名节点</li>
          <li @click="showMenu = false">关闭</li>
        </ul>
      </div>
      </div> -->
    </div>
    <div class="right">
      <div class="filter-bar">
@@ -42,7 +42,7 @@
          v-model="gender"
          size="small"
          placeholder="性别"
          style="margin: 0 10px"
          style="margin: 0px 17px; width: 153px"
        >
          <el-option
            v-for="item in genders"
@@ -52,10 +52,18 @@
            >{{ item.name }}</el-option
          >
        </el-select>
        <el-button type="primary" size="small" @click="renderMemberTable"
        <el-button
          type="primary"
          size="small"
          @click="renderMemberTable"
          class="query-btn"
          >查询</el-button
        >
        <el-button type="primary" size="small" @click="resetFilter"
        <el-button
          type="primary"
          size="small"
          @click="resetFilter"
          class="reset-btn"
          >重置</el-button
        >
      </div>
@@ -82,6 +90,11 @@
          fit
          ref="elTable"
          @selection-change="tableSelection"
          :header-cell-style="{
            background: '#757FA2',
            color: '#fff',
            height: '50px',
          }"
        >
          <el-table-column type="selection" width="55"></el-table-column>
          <el-table-column label="姓名" prop="Name" sortable>
@@ -103,7 +116,7 @@
          <el-table-column label="用户权限" prop="userpermission">
            <template slot-scope="scope">
              <div>
                <el-switch
                <el-switch active-color="#4B72E2" inactive-color="#B7BEC8"
                  v-model="scope.row.UserPermissions"
                  @change="memberUpdate(scope.row)"
                ></el-switch>
@@ -113,7 +126,7 @@
          <el-table-column label="转储权限" prop="transferpermission">
            <template slot-scope="scope">
              <div>
                <el-switch
                <el-switch active-color="#4B72E2" inactive-color="#B7BEC8"
                  v-model="scope.row.DumpPermissions"
                  @change="memberUpdate(scope.row)"
                ></el-switch>
@@ -402,7 +415,7 @@
        a.download = "批量导入模板.xlsx";
        a.href = blobUrl;
        a.click();
        document.body.removeChild(a)
        document.body.removeChild(a);
      });
    },
    updateOrg() {
@@ -624,8 +637,42 @@
<style lang="scss">
.member-manage {
  display: flex;
  padding: 20px;
  background: #fff;
  margin: 33px;
  display: flex;
  box-sizing: border-box;
  .left {
    .el-tree--highlight-current
      .el-tree-node.is-current
      > .el-tree-node__content {
      background-color: #2d52d7 !important;
      .el-tree-node__label {
        color: #fff;
      }
    }
    .el-tree {
      background: #f4f6f9;
      width: 160px;
      padding-bottom: 10px;
      .el-tree-node__label {
        font-size: 14px;
        color: #606f8f;
      }
      .el-tree-node:focus > .el-tree-node__content {
        background-color: #2d52d7 !important;
        color: #fff !important;
      }
      .el-tree-node__content:hover {
        background-color: #fff;
      }
      .el-tree-node__content {
        height: 36px;
      }
    }
  }
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
@@ -734,22 +781,49 @@
  }
  .right {
    padding-left: 20px;
    width: calc(100% - 109px);
    .filter-bar {
      display: flex;
      margin-bottom: 20px;
      margin-bottom: 14px;
      .el-input__inner {
        border: 1px solid rgba(26, 55, 122, 0.35);
      }
      .keyword-input {
        width: 300px;
        width: 320px;
      }
      .reset-btn {
        background-color: #a6b5cb !important;
        border-color: #a6b5cb !important;
        font-size: 13px;
        padding: 8px 12px;
      }
      .query-btn {
        background-color: #2d52d7 !important;
        font-size: 13px;
        padding: 8px 12px;
      }
    }
    .table-area {
      .actions {
        text-align: left;
        text-align: right;
      }
      .el-table td.el-table__cell div {
        color: #425277;
      }
      .el-table.thbg {
        margin: 14px 0;
      }
      .table-cell-pic {
        img {
          width: 70px;
          vertical-align: middle;
          width: 53px;
        }
      }
      .el-table .el-table__cell {
        padding: 7.5px 0;
      }
    }
  }
}