11
Showing
4 changed files
with
16 additions
and
6 deletions
... | @@ -3,8 +3,11 @@ | ... | @@ -3,8 +3,11 @@ |
3 | <div class="ls-mask" v-loading="loading"> | 3 | <div class="ls-mask" v-loading="loading"> |
4 | <div class="ls-mask-window" :style="{'width':width,'height':height}"> | 4 | <div class="ls-mask-window" :style="{'width':width,'height':height}"> |
5 | <div class="ls-head"> | 5 | <div class="ls-head"> |
6 | <div class="ls-title" :style="{'text-align':titleStyle}"><b>{{title}}</b></div> | 6 | <div class="ls-title" :style="{'text-align':titleStyle}"> |
7 | <i class="el-icon-close" @click="onCancel"></i> | 7 | <svg-icon v-if="iconClass!=''" :icon-class='iconClass' /> |
8 | <b>{{title}}</b> | ||
9 | </div> | ||
10 | <svg-icon icon-class='close' class="closeStyle" @click="onCancel" /> | ||
8 | </div> | 11 | </div> |
9 | 12 | ||
10 | <div class="ls-mask-content" ref='contentRef' :style="{'height': contentHeight + 'px'}"> | 13 | <div class="ls-mask-content" ref='contentRef' :style="{'height': contentHeight + 'px'}"> |
... | @@ -36,6 +39,7 @@ export default { | ... | @@ -36,6 +39,7 @@ export default { |
36 | height: "auto", | 39 | height: "auto", |
37 | formData: "",//父组件传递的参数 负责传给子组件 | 40 | formData: "",//父组件传递的参数 负责传给子组件 |
38 | contentHeight:"", | 41 | contentHeight:"", |
42 | iconClass:"", | ||
39 | } | 43 | } |
40 | }, | 44 | }, |
41 | 45 | ||
... | @@ -109,13 +113,17 @@ export default { | ... | @@ -109,13 +113,17 @@ export default { |
109 | position: relative; | 113 | position: relative; |
110 | } | 114 | } |
111 | .ls-mask-window b { | 115 | .ls-mask-window b { |
112 | padding-left: 12px; | 116 | padding-left: 5px; |
113 | } | 117 | } |
114 | .ls-title{ | 118 | .ls-title{ |
115 | padding: 20px; | 119 | padding: 20px; |
116 | background: #1E9FFF; | 120 | background: #1E9FFF; |
117 | color: #ffffff; | 121 | color: #ffffff; |
122 | |||
118 | } | 123 | } |
124 | .ls-title .svg-icon{ | ||
125 | font-size: 18px; | ||
126 | } | ||
119 | .ls-mask-content { | 127 | .ls-mask-content { |
120 | padding: 20px; | 128 | padding: 20px; |
121 | text-align: center; | 129 | text-align: center; |
... | @@ -136,7 +144,8 @@ export default { | ... | @@ -136,7 +144,8 @@ export default { |
136 | background: #f3f3f3; | 144 | background: #f3f3f3; |
137 | } | 145 | } |
138 | 146 | ||
139 | /deep/.el-icon-close { | 147 | |
148 | /deep/.closeStyle{ | ||
140 | position: absolute; | 149 | position: absolute; |
141 | top: 20px; | 150 | top: 20px; |
142 | right: 12px; | 151 | right: 12px; |
... | @@ -144,7 +153,6 @@ export default { | ... | @@ -144,7 +153,6 @@ export default { |
144 | cursor: pointer; | 153 | cursor: pointer; |
145 | color: #ffffff; | 154 | color: #ffffff; |
146 | } | 155 | } |
147 | |||
148 | /deep/.el-loading-mask { | 156 | /deep/.el-loading-mask { |
149 | background: none; | 157 | background: none; |
150 | } | 158 | } | ... | ... |
... | @@ -13,6 +13,7 @@ | ... | @@ -13,6 +13,7 @@ |
13 | cancelText:"" //取消按钮的文字 | 13 | cancelText:"" //取消按钮的文字 |
14 | cancel: function () {}, //取消事件的回调 | 14 | cancel: function () {}, //取消事件的回调 |
15 | confirm: function () {}, //确认事件的回调 | 15 | confirm: function () {}, //确认事件的回调 |
16 | iconClass:"",//标题前面icon图标名称 | ||
16 | }) | 17 | }) |
17 | 3.子组件的方法名字必须统一为 childFn() | 18 | 3.子组件的方法名字必须统一为 childFn() |
18 | 4.子组件切记props接收 父组件传参formData | 19 | 4.子组件切记props接收 父组件传参formData | ... | ... |
src/image/icons/svg/close.svg
0 → 100644
1 | <svg t="1665567795982" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2615" width="200" height="200"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667z m0 810.666666c-204.8 0-373.333333-168.533333-373.333333-373.333333S307.2 138.666667 512 138.666667 885.333333 307.2 885.333333 512 716.8 885.333333 512 885.333333z" p-id="2616"></path><path d="M657.066667 360.533333c-12.8-12.8-32-12.8-44.8 0l-102.4 102.4-102.4-102.4c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l102.4 102.4-102.4 102.4c-12.8 12.8-12.8 32 0 44.8 6.4 6.4 14.933333 8.533333 23.466666 8.533334s17.066667-2.133333 23.466667-8.533334l102.4-102.4 102.4 102.4c6.4 6.4 14.933333 8.533333 23.466667 8.533334s17.066667-2.133333 23.466666-8.533334c12.8-12.8 12.8-32 0-44.8l-106.666666-100.266666 102.4-102.4c12.8-12.8 12.8-34.133333 0-46.933334z" p-id="2617"></path></svg> | ||
... | \ No newline at end of file | ... | \ No newline at end of file |
... | @@ -229,7 +229,7 @@ export default { | ... | @@ -229,7 +229,7 @@ export default { |
229 | height: calc(100% - 80px); | 229 | height: calc(100% - 80px); |
230 | align-items: center; | 230 | align-items: center; |
231 | background: rgba(194, 190, 190, 0.1); | 231 | background: rgba(194, 190, 190, 0.1); |
232 | 232 | overflow: scroll; | |
233 | img { | 233 | img { |
234 | display: block; | 234 | display: block; |
235 | object-fit: scale-down; | 235 | object-fit: scale-down; | ... | ... |
-
Please register or sign in to post a comment