样式及部分文件更改

shuishen

2021-07-15 44d43dbe44639f6c14222e1c90a8225db16c56e3

样式及部分文件更改

 src/page/index/index.vue

@@ -16,7 +16,7 @@
          <search class="avue-view" v-show="isSearch"></search>
        </transition>
        <!-- 主体视图层 -->
        <div style="height:100%;overflow-y:auto;overflow-x:hidden;" id="avue-view" v-show="!isSearch">
        <div style="height: calc(100% - 40px);overflow-y:auto;overflow-x:hidden;" id="avue-view" v-show="!isSearch">
          <keep-alive>
            <router-view class="avue-view" v-if="$route.meta.keepAlive"/>
          </keep-alive>

 src/page/index/top/index.vue

@@ -123,9 +123,9 @@
      </div>
    </div>
    <!-- //面包屑 -->
    <div id="crumbsL">
    <!-- <div id="crumbsL">
      <crumbsL></crumbsL>
    </div>
    </div> -->
  </div>
</template>
<script>

 src/store/modules/common.js

@@ -23,7 +23,7 @@
    isShade: false,
    screen: -1,
    isLock: getStore({name: 'isLock'}) || false,
    showTag: false,
    showTag: true,
    showDebug: true,
    showCollapse: true,
    showSearch: true,

 src/styles/media.scss

@@ -54,7 +54,7 @@
  left: 240px;
  padding: 0;
  width: calc(100% - 240px);
  height: calc(100% - 94px);
  height: calc(100% - 64px);
  box-sizing: border-box;
  overflow: hidden;
  transition: all 0.5s;

 src/styles/tags.scss

@@ -4,11 +4,11 @@
    user-select: none; 
    position: relative;
    padding: 0 10px;
    margin-bottom: 10px;
    margin-bottom: 0px;
    box-sizing: border-box;
    overflow: hidden;
    border-top: 1px solid #f6f6f6;
    background-color: #fff;
    border-top: 1px solid #19305C;
    background-color: rgb(15, 84, 173);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    .el-tabs--card>.el-tabs__header {
        margin: 0;

 src/styles/theme/bule.scss

@@ -1,22 +1,29 @@
.theme-bule{

  .avue-header,.avue-logo{
  .avue-header,
  .avue-logo {
    background: #004ca7;
  }

  .avue-sidebar{
    background: #004ca7;
    .el-menu-item.is-active, .el-submenu__title.is-active {

    .el-menu-item.is-active,
    .el-submenu__title.is-active {
        background-color: rgba(0, 0, 0, 0.2);
    }
  }

  .el-dropdown{
    color: #fff;
  }

  .avue-logo{
    .avue-logo_title{
      color:#fff;
    }
  }

  .avue-breadcrumb{
    i{
      color:#fff;
@@ -28,14 +35,18 @@
      color: #fff;
    }
  }

  .avue-top{

    .el-menu-item {

        i,
        span {
          color: #fff;
        }

      &:hover {

          i,
          span {
            color: #fff;
@@ -48,24 +59,44 @@


.theme-deep-bule{
  background: #19305C;

  .avue-header,.avue-logo{
  .avue-tags .el-tabs--card>.el-tabs__header .el-tabs__item {
    color: #fff;
  }

  .avue-tags .el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
    color: #409EFF;
  }

  .avue-contail {
    background: #19305C;
  }

  .avue-header,
  .avue-logo {
    background: #19305C;
  }

  .avue-sidebar{
    background: #19305C;
    .el-menu-item.is-active, .el-submenu__title.is-active {

    .el-menu-item.is-active,
    .el-submenu__title.is-active {
        background-color: rgba(0, 0, 0, 0.2);
    }
  }

  .el-dropdown{
    color: #fff;
  }

  .avue-logo{
    .avue-logo_title{
      color:#fff;
    }
  }

  .avue-breadcrumb{
    i{
      color:#fff;
@@ -77,14 +108,18 @@
      color: #fff;
    }
  }

  .avue-top{

    .el-menu-item {

        i,
        span {
          color: #fff;
        }

      &:hover {

          i,
          span {
            color: #fff;
@@ -92,4 +127,202 @@
      }
    }
  }

  .el-select-dropdown {
    background: #0146F0;
    color: #8ab6ff;
    border: 1px solid #0140D8;
  }


  .el-popper[x-placement^=bottom] .popper__arrow::after {
    border-bottom-color: #0146F0;
  }

  .el-popper[x-placement^=bottom] .popper__arrow {
    border-bottom-color: #0146F0;
  }

  .el-select-dropdown__item {
    color: #8ab6ff;
  }

  .el-select-dropdown__item.hover,
  .el-select-dropdown__item:hover {
    background-color: #155CF7;
  }

  .el-button:focus,
  .el-button:hover {
    color: #F0F0F0;
    border-color: #83C1FF;
    background-color: #83C1FF;
  }

  .avue-crud__right {
    display: none !important;
  }

  .el-button--default {
    background-color: #409EFF;
    border-color: #409EFF;
    color: #FFF9FF;
  }

  .el-card {
    height: 100%;
    background: #19305C;
    color: #fff;

    .el-table,
    .el-table__expanded-cell {
      background-color: #19305C;

    }

    .el-table--border::after,
    .el-table--group::after,
    .el-table::before {
      background-color: #1a325f;
    }

    .el-table__fixed-right::before,
    .el-table__fixed::before {
      background-color: #1a325f;
    }


    .el-loading-mask {
      background-color: #1a325fe1;
    }

    .el-table th {
      background-color: #155CF7;
      color: #fff;
    }

    .el-table td {
      background: #0142D6;
      color: #fff;
    }

    .el-table--striped .el-table__body tr.el-table__row--striped td {
      background: #044BE3;
    }

    .el-button--text {
      color: #fff;
    }

    .el-collapse-item__wrap {
      background-color: #19305C;

    }

    .el-collapse {
      border-top: 1px solid #1a325f;
      border-bottom: 1px solid #1a325f;
    }

    .avue-crud__menu {
      background-color: #19305C;
    }

    .el-form-item__label {

      color: #fff;
    }

    .el-pagination__total {
      color: #fff;
    }

    .el-pagination__jump {
      color: #fff;
    }

    .avue-empty__desc {
      color: #fff;
    }

    .el-table--border,
    .el-table--group {
      border: 1px solid#53a7fa;
    }

    .el-table--border td,
    .el-table--border th,
    .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed {
      border-color: #53a7fa;
    }

    .el-table td,
    .el-table th.is-leaf {
      border-color: #53a7fa;
    }

    .el-input__inner {
      background: #0146F0;
      color: #8ab6ff;
    }

    .el-tooltip input {
      background: #0146F0;
      color: #8ab6ff;
    }

    .el-range-separator {
      color: #8ab6ff;
    }

    .el-date-editor,
    .el-input input {
      border-color: #0140D8;
    }

    .avue-group .el-collapse,
    .avue-group .el-collapse-item__wrap {
      border-color: #19305C;
    }

    .el-pagination.is-background .btn-next,
    .el-pagination.is-background .btn-prev,
    .el-pagination.is-background .el-pager li {
      margin: 0 5px;
      background-color: #409EFF;
      color: #fff;
      min-width: 30px;
      border-radius: 2px;
    }

    .el-tag {
      background-color: #409EFF;
      color: #fff;
      border-color: #53a7fa;
    }

  }

  #avue-view {
    &>.el-row {

      &>.el-col:first-child {
        padding-right: 2px;
      }

      &>.el-col:last-child {
        padding-left: 2px;
      }

      &>.el-col {
        height: 100%;
        margin-bottom: 0px;

        &>.basic-container {
          padding: 0;
          height: 100%;
        }
      }
    }
  }
}

 src/views/examination/examination.vue

@@ -1,5 +1,4 @@
<template>
  <el-row>
      <basic-container>
        <avue-crud :option="option"
                   :search.sync="search"
@@ -45,21 +44,20 @@
                    slot="userTypeName">
            <el-tag>{{row.userTypeName}}</el-tag>
          </template>
          <template slot-scope="{ row }" slot="examination_type">
            <el-tag
            >{{
            <template slot-scope="{ row }"
                      slot="examination_type">
                <el-tag>{{
              row.examination_type == "0" ? "正常" : row.examination_type == "1" ? "异常" : "异常"
              }}
            </el-tag>
          </template>
          <template slot-scope="{ row }" slot="online_status">
            <el-tag
            >{{
            <template slot-scope="{ row }"
                      slot="online_status">
                <el-tag>{{
              row.online_status == "0" ? "离线" : row.online_status == "1" ? "在线" : "离线"
              }}
            </el-tag>
          </template>


        </avue-crud>
        <el-dialog title="用户角色配置"
@@ -77,7 +75,8 @@
                   :props="props">
          </el-tree>

          <span slot="footer" class="dialog-footer">
            <span slot="footer"
                  class="dialog-footer">
            <el-button @click="roleBox = false">取 消</el-button>
            <el-button type="primary"
                       @click="submitRole">确 定</el-button>
@@ -87,9 +86,12 @@
                   append-to-body
                   :visible.sync="excelBox"
                   width="555px">
          <avue-form :option="excelOption" v-model="excelForm" :upload-after="uploadAfter">
            <avue-form :option="excelOption"
                       v-model="excelForm"
                       :upload-after="uploadAfter">
            <template slot="excelTemplate">
              <el-button type="primary" @click="handleTemplate">
                    <el-button type="primary"
                               @click="handleTemplate">
                点击下载<i class="el-icon-download el-icon--right"></i>
              </el-button>
            </template>
@@ -125,7 +127,6 @@
          </avue-crud>
        </el-dialog>
      </basic-container>
  </el-row>
</template>

<script>