Commit 74f12e0b9f8f17ec45b65a13292953bb06afb682

Authored by ycak47
1 parent c53034a2

优化el-dialog

1.设置默认点击背景不关闭dialog(这个很容易误操作,体验较差)
2.el-dialog内容较多时,滚动条限定在内部而不撑开父页面的滚动条
3.代码生成的el-dialog默认添加 v-dialogDrag属性(可拖拽移动)
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue/views/index.vue.vm
... ... @@ -96,7 +96,7 @@
96 96 @pagination="getList"/>
97 97  
98 98 <!-- 对话框(添加 / 修改) -->
99   - <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
  99 + <el-dialog :title="title" :visible.sync="open" width="500px" v-dialogDrag append-to-body>
100 100 <el-form ref="form" :model="form" :rules="rules" label-width="80px">
101 101 #foreach($column in $columns)
102 102 #if ($column.createOperation || $column.updateOperation)
... ...
yudao-ui-admin/src/assets/styles/ruoyi.scss
... ... @@ -71,6 +71,16 @@
71 71 padding: 10px 20px 0;
72 72 }
73 73  
  74 +.el-dialog{
  75 + display: flex;
  76 + flex-direction: column;
  77 + max-width: calc(100% - 30px);
  78 + max-height: calc(100% - 70px);
  79 + .el-dialog__body {
  80 + overflow: auto;
  81 + }
  82 +}
  83 +
74 84 .el-table {
75 85 .el-table__header-wrapper, .el-table__fixed-header-wrapper {
76 86 th {
... ...
yudao-ui-admin/src/main.js
... ... @@ -70,6 +70,10 @@ console.log(request)
70 70 Vue.prototype.$axios = request
71 71 import '@/styles/index.scss'
72 72  
  73 +// 默认点击背景不关闭弹窗
  74 +import ElementUI from 'element-ui'
  75 +ElementUI.Dialog.props.closeOnClickModal.default = false
  76 +
73 77 /**
74 78 * If you don't want to use mock-server
75 79 * you want to use MockJs for mock api
... ...