作者 mxd

选座结果

1 <template> 1 <template>
2 <view class="wrap_box"> 2 <view class="wrap_box">
3 - <!-- <uParse v-if="datas" :content="datas"></uParse> -->  
4 - <view class="tel_index_bg"></view>  
5 -  
6 -  
7 - <view v-if="datas.info" class="vio_list">  
8 - <view class="main_list">  
9 - <view class="main_top">  
10 - <view class="main_tit">  
11 - {{datas.info.title}} <text>{{datas.info.pid}}</text>  
12 - </view>  
13 - <view class="">  
14 - 课程详情:{{datas.info.content}} 3 +
  4 + <view v-if="datas.info">
  5 + <view class="course-info" >
  6 + <view class="course-info-title">
  7 + <text class="classroom">{{datas.info.pid}}</text>
  8 + <view class="tit">
  9 + {{datas.info.title}}
15 </view> 10 </view>
16 </view> 11 </view>
17 - <view class="my_seat">  
18 - <image class="my_seat_bg" src="/static/images/seat_bg.png" mode="aspectFill"></image>  
19 - <view class="my_seat_num">  
20 - 你选的座位:{{datas.seat_title}}  
21 - </view> 12 + <view class="course-info-content">
  13 + 课程详情:{{datas.info.content}}
22 </view> 14 </view>
23 </view> 15 </view>
24 - <!-- <view class="bz_add" >  
25 - <view @click="save_fuc" data-url="/pagesA/stu_bz_edit/stu_bz_edit">  
26 - 确认选座 16 +
  17 + <view class="my_seat">
  18 + <view class="my_seat_bg">
  19 + <image src="/static/imagesV2/stu_myseat/bg.png" mode="aspectFill"></image>
  20 + </view>
  21 + <view class="my_seat_info">
  22 + <view class="value">
  23 + {{datas.seat_title}}
  24 + </view>
  25 + <view class="label">
  26 + 你选的座位
  27 + </view>
27 </view> 28 </view>
28 - </view> --> 29 + </view>
29 </view> 30 </view>
30 -  
31 - <!-- 阻止滑动 -->  
32 - <!-- <view @touchmove.stop.prevent='test'></view> -->  
33 </view> 31 </view>
34 </template> 32 </template>
35 33
@@ -161,178 +159,69 @@ @@ -161,178 +159,69 @@
161 // #ifdef H5 159 // #ifdef H5
162 min-height: calc(100vh - 44px); 160 min-height: calc(100vh - 44px);
163 // #endif 161 // #endif
164 - background: #F8F8F8;  
165 - position: relative;  
166 -}  
167 -  
168 -.tel_index_bg {  
169 - position: absolute;  
170 - top: 0;  
171 - z-index: 1;  
172 - width: 100%;  
173 - min-height: 220rpx;  
174 - background: linear-gradient(0deg, #f8f8f8 0%, #5D9DFD 60%, #428EFE 70%, #2D81FF 100%);  
175 -}  
176 -.top_tabs{  
177 - width: 100%;  
178 -}  
179 -.vip_tab_list{  
180 - // padding: 0 30rpx;  
181 -}  
182 -.vip_tab_li{  
183 - height: 90rpx;  
184 - display: inline-flex;  
185 - align-items: center;  
186 - font-size: 30rpx;  
187 - color: #FFFFFF;  
188 - opacity: 0.6;  
189 -  
190 - position: relative;  
191 - &+.vip_tab_li{  
192 - margin-left: 50rpx;  
193 - }  
194 - &.active{  
195 - opacity: 1;  
196 -  
197 - &:after{  
198 - content: '';  
199 - position: absolute;  
200 - bottom: 0;  
201 - left: 50%;  
202 - margin-left: -18rpx;  
203 - width: 36rpx;  
204 - height: 6rpx;  
205 - background: #FFFFFF;  
206 - border-radius: 3rpx;  
207 - }  
208 - }  
209 -}  
210 -.vio_sx{  
211 - height: 100rpx;  
212 - justify-content: space-between;  
213 - border-bottom: 1px solid #eee;  
214 -}  
215 -.vio_time{  
216 -  
217 - // padding: 0 24rpx;  
218 - font-size: 30rpx;  
219 - color: #7D8087;  
220 - letter-spacing: 0;  
221 - display: flex;  
222 - align-items: center;  
223 - .icon{  
224 - font-size: 20rpx;  
225 - margin-left: 5rpx;  
226 - color: #999999;  
227 - opacity: .5;  
228 - }  
229 - input{  
230 - font-size: 30rpx;  
231 - color: #7D8087;  
232 - text-align: right;  
233 - padding: 0 10rpx;  
234 - }  
235 -}  
236 -.vio_int{  
237 - font-size: 30rpx;  
238 - color: #7D8087;  
239 - text-align: right;  
240 - padding: 0 10rpx;  
241 -}  
242 -/deep/ .vip_intpl{  
243 - color: #D5D7DA;  
244 -}  
245 -.vio_list{  
246 - width: 100%;  
247 - // padding: 0 30rpx 30rpx;  
248 - padding:20rpx 30rpx 30rpx; 162 + background: #fff;
249 position: relative; 163 position: relative;
250 - z-index: 2;  
251 - .main_list{  
252 - background: #FFFFFF;  
253 - border-radius: 10rpx;  
254 - padding-bottom: 30rpx;  
255 - // padding:0 30rpx;  
256 - }  
257 -  
258 } 164 }
259 165
260 -.bz_add{  
261 - width: 100%;  
262 - // position: fixed;  
263 - // bottom: 0;  
264 - background: #f8f8f8;  
265 - z-index: 800;  
266 - // left: 0;  
267 - padding:30rpx 0;  
268 - view{  
269 - font-size: 32rpx;  
270 - color: #FFFFFF;  
271 - width: 100%;  
272 - height: 90rpx;  
273 - background: #2D81FF;  
274 - border-radius: 10rpx; 166 +.course-info {
  167 + padding: 20rpx;
  168 + &-title {
275 display: flex; 169 display: flex;
276 align-items: center; 170 align-items: center;
277 - justify-content: center;  
278 - }  
279 -}  
280 -.main_top{  
281 - width: 100%;  
282 - padding: 30rpx;  
283 - font-size: 28rpx;  
284 - color: #929399;  
285 - border-bottom: 1px solid #eee;  
286 - line-height: 45rpx;  
287 - .main_tit{  
288 - font-size: 32rpx;  
289 - color: #545D71;  
290 - margin-bottom: 20rpx; 171 + font-size: 30rpx;
  172 + font-family: PingFang SC;
291 font-weight: bold; 173 font-weight: bold;
292 - line-height: 55rpx;  
293 - // display: flex;  
294 - // align-items: center;  
295 - // flex-wrap: wrap;  
296 - text{  
297 - height: 48rpx;  
298 - line-height: 48rpx;  
299 - display: inline-flex;  
300 - align-items: center;  
301 - padding: 0 12rpx;  
302 - background: rgba(45, 129, 255, .1);  
303 - border-radius: 10rpx; 174 + color: #323232;
  175 + .classroom {
  176 + background: #FE7631;
  177 + border-radius: 5rpx;
  178 + padding: 7rpx 20rpx;
304 font-size: 26rpx; 179 font-size: 26rpx;
305 - color: #2D81FF;  
306 - font-weight: normal;  
307 - margin-left: 20rpx; 180 + font-family: PingFang SC;
  181 + font-weight: 500;
  182 + color: #FAFBFA;
  183 + margin-right: 20rpx;
  184 + }
  185 + .tit {
  186 + flex: 1;
308 } 187 }
309 } 188 }
  189 + &-content {
  190 + font-size: 26rpx;
  191 + font-family: PingFang SC;
  192 + font-weight: 500;
  193 + color: #646464;
  194 + margin-top: 20rpx;
  195 + }
310 } 196 }
311 197
  198 +
312 .my_seat{ 199 .my_seat{
313 - width: 593rpx;  
314 - height: 140rpx;  
315 - margin: 30rpx auto;  
316 - position: relative;  
317 - padding-top: 24rpx;  
318 - .my_seat_bg{  
319 - width: 593rpx;  
320 - height: 140rpx;  
321 - position: absolute;  
322 - z-index: 3;  
323 - top: 0;  
324 - left: 0; 200 + margin: 20rpx;
  201 + background: #FAFAFA;
  202 + border-radius: 20px;
  203 + padding: 65rpx 0 40rpx;
  204 + &_bg{
  205 + width: 280rpx;
  206 + height: 280rpx;
  207 + margin: 0 auto;
325 } 208 }
326 - .my_seat_num{  
327 - position: relative;  
328 - z-index: 10;  
329 - width: 100%;  
330 - height: 78rpx;  
331 - display: flex;  
332 - align-items: center;  
333 - padding-left: 80rpx;  
334 - font-size: 32rpx;  
335 - color: #FFFFFF; 209 + &_info{
  210 + margin-top: -30rpx;
  211 + text-align: center;
  212 + .value {
  213 + font-size: 30rpx;
  214 + font-family: PingFang SC;
  215 + font-weight: bold;
  216 + color: #2D81FF;
  217 + }
  218 + .label {
  219 + font-size: 26rpx;
  220 + font-family: PingFang SC;
  221 + font-weight: 500;
  222 + color: #646464;
  223 + margin-top: 20rpx;
  224 + }
336 } 225 }
337 } 226 }
338 </style> 227 </style>