运维管理样式修改

584911253@qq.com

2023-02-25 9660afd3e2ed1b9bd87c9316f8b24c63ad4c9a4e

 src/views/AuthorizationManagement/userRoleAuthorization.vue

@@ -52,7 +52,7 @@
        :data="tableData"
        style="width: 100%"
        @row-click="singleElection"
        height="calc(100% - 124px)"
        height="calc(100% - 80px)"
      >
        <el-table-column align="center" width="55">
          <template slot-scope="scope">
@@ -77,7 +77,7 @@
        >
        </el-table-column>
      </el-table>
      <div style="text-align: center; margin-top: 20px" class="pagination_box">
      <div style="text-align: center; margin-top: 10px" class="pagination_box">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
@@ -135,7 +135,7 @@
      <el-table
        :data="usertableData"
        style="width: 100%"
         height="calc(100% - 124px)"
         height="calc(100% - 80px)"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
@@ -151,7 +151,7 @@
        </el-table-column>
      </el-table>

      <div style="margin-top: 20px; text-align: center" class="pagination_box">
      <div style="margin-top: 10px; text-align: center" class="pagination_box">
        <el-pagination
          @size-change="userhandleSizeChange"
          @current-change="userhandleCurrentChange"
@@ -337,12 +337,12 @@
          resize[i].left = resize[i].offsetLeft;
          // 鼠标拖动事件
          document.onmousemove = function (e) {
           

            let endX = e.clientX;
             console.log(endX ,startX)
            let moveLen = resize[i].left  + (endX - startX) - left1[i].offsetWidth ; // （endx-startx）=移动的距离。resize[i].left+移动的距离=左边区域最后的宽度
            let maxT = box[i].clientWidth - resize[i].offsetWidth; // 容器宽度 - 左边区域的宽度 = 右边区域的宽度
        

            if (moveLen < 205) moveLen = 205; // 左边区域的最小宽度为32px
            if (moveLen > maxT - 300) moveLen = maxT - 300; //右边区域最小宽度为150px

@@ -585,16 +585,18 @@
<style lang="less" scoped>
//@import url(); 引入公共css类
.menuSettings_box {
  height: 98%;
  //height: 98%;
  height: 100%;
  width: 98%;
  padding: 1%;
  padding: 0 1%;
// position: relative;
  display: flex;
  justify-content: space-between;

  .menuSettings_tree {
    width: 33%;
    height: 98%;
    //height: 98%;
    height: 100%;
    position: relative;
    padding: 10px;
    border-radius: 10px;
@@ -621,6 +623,6 @@
.el-table /deep/ th,
.el-table /deep/ tr {
  background-color: transparent !important;
} 
}
</style>