样式预留 插件兼容

dsk-operate-ui/src/assets/styles/index.scss

@@ -221,6 +221,7 @@ li {
 }
 
 .app-container {
+  position: absolute;
   width: 100%;
   height: 100%;
   background-color: #f5f5f5;

dsk-operate-ui/src/layout/components/AppMain.vue

@@ -28,10 +28,10 @@ export default {
 <style lang="scss" scoped>
 .app-main {
   position: relative;
-  height: calc(100% - 56px);
+  min-height: calc(100% - 56px);
   width: 100%;
   background: #f5f5f5;
-  overflow: hidden;
+  overflow: auto;
 }
 
 .fixed-header + .app-main {
@@ -40,7 +40,7 @@ export default {
 
 .hasTagsView {
   .app-main {
-    height: calc(100% - 56px);
+    min-height: calc(100% - 56px);
     min-width: 1240px;
   }
 

dsk-operate-ui/src/layout/index.vue

@@ -96,7 +96,6 @@ export default {
     position: relative;
     height: 100%;
     width: 100%;
-    overflow: hidden;
 
     &.mobile.openSidebar {
       position: fixed;

dsk-operate-ui/src/views/system/dept/index.vue

@@ -2,21 +2,11 @@
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
       <el-form-item label="组织名称" prop="deptName">
-        <el-input
-          v-model="queryParams.deptName"
-          placeholder="请输入组织名称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
+        <el-input v-model="queryParams.deptName" placeholder="请输入组织名称" clearable @keyup.enter.native="handleQuery" />
       </el-form-item>
       <el-form-item label="状态" prop="status">
         <el-select v-model="queryParams.status" placeholder="组织状态" clearable>
-          <el-option
-            v-for="dict in dict.type.sys_normal_disable"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
+          <el-option v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
         </el-select>
       </el-form-item>
       <el-form-item>
@@ -27,40 +17,21 @@
 
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['system:dept:add']"
-        >新增</el-button>
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:dept:add']">新增</el-button>
       </el-col>
       <el-col :span="1.5">
-        <el-button
-          type="info"
-          plain
-          icon="el-icon-sort"
-          size="mini"
-          @click="toggleExpandAll"
-        >展开/折叠</el-button>
+        <el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
-    <el-table
-      v-if="refreshTable"
-      v-loading="loading"
-      :data="deptList"
-      row-key="deptId"
-      :default-expand-all="isExpandAll"
-      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
-    >
+    <el-table v-if="refreshTable" v-loading="loading" :data="deptList" row-key="deptId" :default-expand-all="isExpandAll"
+      :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
       <el-table-column prop="deptName" label="组织名称" width="260"></el-table-column>
       <el-table-column prop="orderNum" label="排序" width="200"></el-table-column>
       <el-table-column prop="status" label="状态" width="100">
         <template slot-scope="scope">
-          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
+          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status" />
         </template>
       </el-table-column>
       <el-table-column label="创建时间" align="center" prop="createTime" width="200">
@@ -70,28 +41,10 @@
       </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['system:dept:edit']"
-          >修改</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-plus"
-            @click="handleAdd(scope.row)"
-            v-hasPermi="['system:dept:add']"
-          >新增</el-button>
-          <el-button
-            v-if="scope.row.parentId != 0"
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['system:dept:remove']"
-          >删除</el-button>
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dept:edit']">修改</el-button>
+          <el-button size="mini" type="text" icon="el-icon-plus" @click="handleAdd(scope.row)" v-hasPermi="['system:dept:add']">新增</el-button>
+          <el-button v-if="scope.row.parentId != 0" size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
+            v-hasPermi="['system:dept:remove']">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -139,11 +92,7 @@
           <el-col :span="12">
             <el-form-item label="组织状态">
               <el-radio-group v-model="form.status">
-                <el-radio
-                  v-for="dict in dict.type.sys_normal_disable"
-                  :key="dict.value"
-                  :label="dict.value"
-                >{{dict.label}}</el-radio>
+                <el-radio v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>
               </el-radio-group>
             </el-form-item>
           </el-col>
@@ -154,10 +103,7 @@
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
-    <el-dialog
-      title="验证信息"
-      :visible.sync="yanzheng"
-      width="30%">
+    <el-dialog title="验证信息" :visible.sync="yanzheng" width="30%">
       <div class="phonecont">
         <div class="p1"><i class="el-icon-warning"></i>手机号码验证</div>
         <div>已经向<font color="orange">{{phone}}</font>发送验证码，请注意查收</div>
@@ -181,7 +127,7 @@
 <script>
 import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept";
 import Treeselect from "@riophae/vue-treeselect";
-import {captchaSms,checkSmsCode} from '@/api/login'
+import { captchaSms, checkSmsCode } from '@/api/login';
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 
 export default {
@@ -190,10 +136,10 @@ export default {
   components: { Treeselect },
   data() {
     return {
-      yanzheng:false,
-      phone:'',
-      yzm:'',
-      deptId:'',
+      yanzheng: false,
+      phone: '',
+      yzm: '',
+      deptId: '',
       // 遮罩层
       loading: true,
       // 显示搜索条件
@@ -247,7 +193,7 @@ export default {
   },
   created() {
     this.getList();
-    this.phone = this.$store.state.user.phonenumber
+    this.phone = this.$store.state.user.phonenumber;
   },
   methods: {
     /** 查询组织列表 */
@@ -334,27 +280,27 @@ export default {
       });
     },
     /** 提交按钮 */
-    submitForm: function() {
+    submitForm: function () {
       this.$refs["form"].validate(valid => {
         if (valid) {
           if (this.form.deptId != undefined) {
             updateDept(this.form).then(response => {
-              if(response.code == 200){
+              if (response.code == 200) {
                 this.$modal.msgSuccess("修改成功");
                 this.open = false;
                 this.getList();
-              }else{
-                this.$modal.msgError(response.msg)
+              } else {
+                this.$modal.msgError(response.msg);
               }
             });
           } else {
             addDept(this.form).then(response => {
-              if(response.code == 200){
+              if (response.code == 200) {
                 this.$modal.msgSuccess("新增成功");
                 this.open = false;
                 this.getList();
-              }else{
-                this.$modal.msgError(response.msg)
+              } else {
+                this.$modal.msgError(response.msg);
               }
             });
           }
@@ -363,40 +309,40 @@ export default {
     },
     /** 删除按钮操作 */
     handleDelete(row) {
-      this.deptId = row.deptId
-      let islast = true
-      let txt = '是否确认删除名称为"' + row.deptName + '"的组织？'
-      if((row.children && row.children.length>0) || row.existUsers == true){//该组织下还有数据
-        islast = false
-        txt='是否删除该组织及该组织包含的所有人员？'
+      this.deptId = row.deptId;
+      let islast = true;
+      let txt = '是否确认删除名称为"' + row.deptName + '"的组织？';
+      if ((row.children && row.children.length > 0) || row.existUsers == true) {//该组织下还有数据
+        islast = false;
+        txt = '是否删除该组织及该组织包含的所有人员？';
       }
-      let _this = this
+      let _this = this;
       this.$confirm(txt, '系统提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
       }).then(() => {
-        if(islast){
-          delDept(row.deptId).then(res=>{
-            if(res.code == 200){
+        if (islast) {
+          delDept(row.deptId).then(res => {
+            if (res.code == 200) {
               _this.getList();
               _this.$modal.msgSuccess("删除成功");
-            }else{
-              this.$message.warning('删除失败!')
+            } else {
+              this.$message.warning('删除失败!');
             }
-          }).catch(res=>{
-            this.$message.warning(res.msg)
-          })
-        }else{
+          }).catch(res => {
+            this.$message.warning(res.msg);
+          });
+        } else {
           //发送验证码
-          captchaSms().then(res=>{
-            if(res.code == 200){
-              this.yanzheng = true
-              this.$message.success('短信验证码已发送')
-            }else{
-              this.$message.warning('验证码发送失败')
+          captchaSms().then(res => {
+            if (res.code == 200) {
+              this.yanzheng = true;
+              this.$message.success('短信验证码已发送');
+            } else {
+              this.$message.warning('验证码发送失败');
             }
-          })
+          });
         }
       }).catch(() => {
         this.$message({
@@ -405,55 +351,59 @@ export default {
         });
       });
     },
-    cancel1(){
-      this.yzm = ''
-      this.yanzheng = false
+    cancel1() {
+      this.yzm = '';
+      this.yanzheng = false;
     },
-    subyzm(){
+    subyzm() {
       //验证验证码
       let param = {
-        smsCode:this.yzm
-      }
-      checkSmsCode(param).then(res=>{
-        if(res.code == 200){
-          delDept(this.deptId).then(res=>{
-            if(res.code == 200){
-              this.yzm = ''
-              this.yanzheng = false
+        smsCode: this.yzm
+      };
+      checkSmsCode(param).then(res => {
+        if (res.code == 200) {
+          delDept(this.deptId).then(res => {
+            if (res.code == 200) {
+              this.yzm = '';
+              this.yanzheng = false;
               this.$message({
                 type: 'success',
                 message: '删除成功!'
               });
-              this.getList()
-            }else{
-              this.$message.warning('删除失败!')
+              this.getList();
+            } else {
+              this.$message.warning('删除失败!');
             }
-          }).catch(res=>{
-            this.$message.warning(res.msg)
-          })
-        }else{
-          this.$message.warning(res.msg)
+          }).catch(res => {
+            this.$message.warning(res.msg);
+          });
+        } else {
+          this.$message.warning(res.msg);
         }
-      }).catch(res=>{
-        this.$message.warning(res.msg)
-      })
+      }).catch(res => {
+        this.$message.warning(res.msg);
+      });
 
     },
   }
 };
 </script>
 <style lang="scss" scoped>
-  .phonecont{
+.dept-container {
+  width: 100%;
+  height: 100%;
+}
+.phonecont {
   padding-bottom: 20px;
-    .p1{
-      .el-icon-warning{
+  .p1 {
+    .el-icon-warning {
       color: #f8ac59;
       margin-right: 5px;
     }
     font-size: 18px;
   }
-    >div{
+  > div {
     line-height: 36px;
   }
-  }
+}
 </style>