|  |  |  | 
|---|
|  |  |  | :close-on-press-escape="false" | 
|---|
|  |  |  | :wrapper-closable="false" | 
|---|
|  |  |  | :append-to-body="true" | 
|---|
|  |  |  | :modal="false" | 
|---|
|  |  |  | @close="close" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <div slot="title" class="window__header"> | 
|---|
|  |  |  | <span class="header__btn-back" @click="close"><i class="el-icon-arrow-left"></i></span>{{title}} | 
|---|
|  |  |  | <!-- {{title}} --> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="window__body"> | 
|---|
|  |  |  | <slot></slot> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div v-if="withFooter" class="window__footer"> | 
|---|
|  |  |  | <slot name="footer"> | 
|---|
|  |  |  | <el-button @click="confirm" :loading="confirmWorking" type="primary">确定</el-button> | 
|---|
|  |  |  | <el-button @click="close">取消</el-button> | 
|---|
|  |  |  | <el-button @click="confirm" :loading="confirmWorking" type="primary">{{text}}</el-button> | 
|---|
|  |  |  | <el-button @click="close">返回</el-button> | 
|---|
|  |  |  | </slot> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-drawer> | 
|---|
|  |  |  | 
|---|
|  |  |  | props: { | 
|---|
|  |  |  | width: { | 
|---|
|  |  |  | type: String, | 
|---|
|  |  |  | default: '36%' | 
|---|
|  |  |  | default: '100%' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 是否包含底部操作 | 
|---|
|  |  |  | withFooter: { | 
|---|
|  |  |  | type: Boolean, | 
|---|
|  |  |  | default: true | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 提交按钮文字 | 
|---|
|  |  |  | text: { | 
|---|
|  |  |  | type: String, | 
|---|
|  |  |  | default: '确定' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 确认按钮loading状态 | 
|---|
|  |  |  | confirmWorking: { | 
|---|
|  |  |  | 
|---|
|  |  |  | // 输入框高度 | 
|---|
|  |  |  | $input-height: 32px; | 
|---|
|  |  |  | .global-window { | 
|---|
|  |  |  | top: 80px !important; | 
|---|
|  |  |  | left: 250px !important; | 
|---|
|  |  |  | // 头部标题 | 
|---|
|  |  |  | /deep/ .el-drawer__header { | 
|---|
|  |  |  | ::v-deep .el-drawer__header { | 
|---|
|  |  |  | padding: 0 10px 0 0; | 
|---|
|  |  |  | line-height: 40px; | 
|---|
|  |  |  | border-bottom: 1px solid #eee; | 
|---|
|  |  |  | // text-align: center; | 
|---|
|  |  |  | font-weight: 500; | 
|---|
|  |  |  | color: #222; | 
|---|
|  |  |  | // 返回按钮 | 
|---|
|  |  |  | .header__btn-back { | 
|---|
|  |  |  | display: inline-block; | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // 主体 | 
|---|
|  |  |  | /deep/ .el-drawer__body { | 
|---|
|  |  |  | ::v-deep .el-drawer__body { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | flex-direction: column; | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | 
|---|
|  |  |  | bottom: 0; | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | overflow: hidden; | 
|---|
|  |  |  | // background-color: #f7f7f7; | 
|---|
|  |  |  | // 内容 | 
|---|
|  |  |  | .window__body { | 
|---|
|  |  |  | // width: 1100px; | 
|---|
|  |  |  | // margin: 0 auto; | 
|---|
|  |  |  | // background-color: #fff; | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | overflow-y: auto; | 
|---|
|  |  |  | padding: 12px 16px; | 
|---|
|  |  |  | // 标签 | 
|---|
|  |  |  | .el-form-item__label { | 
|---|
|  |  |  | float: none; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // .el-form-item__label { | 
|---|
|  |  |  | //   float: none; | 
|---|
|  |  |  | // } | 
|---|
|  |  |  | // 元素宽度为100% | 
|---|
|  |  |  | .el-form-item__content > *{ | 
|---|
|  |  |  | width: 100%; | 
|---|