8fd3ab4e by 任超
2 parents 25daaac4 128ffa16
...@@ -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: 16px;
116 background: #1E9FFF; 120 background: linear-gradient(2deg, #00CCFF, transparent);
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;
...@@ -126,30 +134,31 @@ export default { ...@@ -126,30 +134,31 @@ export default {
126 134
127 .ls-mask-footer { 135 .ls-mask-footer {
128 height: 65px; 136 height: 65px;
129 border-top: 1px solid #f0f0f0;
130 display: flex; 137 display: flex;
131 justify-content: center; 138 justify-content: center;
132 position: absolute; 139 position: absolute;
133 width: 100%; 140 width: 100%;
134 bottom: 0px; 141 bottom: 0px;
135 right: 0px; 142 right: 0px;
136 background: #f3f3f3; 143 box-shadow: 0px 0px 2px 0px;
144 border-radius: 0 0 10px 10px;
137 } 145 }
138 146
139 /deep/.el-icon-close { 147
148 /deep/.closeStyle{
140 position: absolute; 149 position: absolute;
141 top: 20px; 150 top: 17px;
142 right: 12px; 151 right: 12px;
143 font-size: 20px; 152 font-size: 20px;
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 }
151 /deep/.el-button{ 159 /deep/.el-button{
152 margin: 15px 10px; 160 margin: 15px 10px;
161 width: 75px;
153 } 162 }
154 </style> 163 </style>
155 164
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -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
......
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;
......