正在显示
1 个修改的文件
包含
139 行增加
和
107 行删除
| @@ -13,6 +13,7 @@ | @@ -13,6 +13,7 @@ | ||
| 13 | <view class="vio_sx dis_flex aic"> | 13 | <view class="vio_sx dis_flex aic"> |
| 14 | <picker mode="date" :value="vio_time" :start="startDate" :end="endDate" @change="bindDateChange"> | 14 | <picker mode="date" :value="vio_time" :start="startDate" :end="endDate" @change="bindDateChange"> |
| 15 | <view class="vio_time"> | 15 | <view class="vio_time"> |
| 16 | + | ||
| 16 | <view class="flex_1"> | 17 | <view class="flex_1"> |
| 17 | {{vio_time||'请选择时间'}} | 18 | {{vio_time||'请选择时间'}} |
| 18 | </view> | 19 | </view> |
| @@ -20,51 +21,71 @@ | @@ -20,51 +21,71 @@ | ||
| 20 | </view> | 21 | </view> |
| 21 | </picker> | 22 | </picker> |
| 22 | <view class="vio_ss"> | 23 | <view class="vio_ss"> |
| 23 | - <input type="text" placeholder="请输入姓名" v-model="name" @confirm="onRetry"> | ||
| 24 | <text class="icon icon-sousuo" @click="onRetry"></text> | 24 | <text class="icon icon-sousuo" @click="onRetry"></text> |
| 25 | + <input type="text" placeholder="请输入姓名" v-model="name" @confirm="onRetry"> | ||
| 26 | + | ||
| 25 | </view> | 27 | </view> |
| 26 | </view> | 28 | </view> |
| 27 | </view> | 29 | </view> |
| 28 | - <view class="vio_list"> | ||
| 29 | - <view class="vio_li" v-for="(item,index) in datas"> | ||
| 30 | - <view class="vio_li_msg"> | ||
| 31 | - <view class="vio_li_tit"> | ||
| 32 | - <text class="li_type"></text> | ||
| 33 | - <text class="li_name">{{item.title}}</text> | ||
| 34 | - <block v-if="active==5"> | ||
| 35 | - <view v-if="item.type==1" class="li_tip" style="background:#2D81FF1a"><text style="color:#2D81FF">事假</text></view> | ||
| 36 | - <view v-else class="li_tip" style="background:#FF90001a"><text style="color:#FF9000">病假</text></view> | ||
| 37 | - </block> | ||
| 38 | - <text class="identification" style="color: #FF9000;" v-if="item.examine === AUDITSTATUS.PENDINGREVIEW">待审核</text> | ||
| 39 | - <text class="identification" style="color: #67c23a;" v-else-if="item.examine === AUDITSTATUS.APPROVED">已通过</text> | ||
| 40 | - <text class="identification" style="color: #f56c6c;" v-else-if="item.examine === AUDITSTATUS.FAILED">未通过</text> | ||
| 41 | - <view class="flex_1"></view> | ||
| 42 | - <text v-if="active==5||active==6">学员:{{item.name}}</text> | ||
| 43 | - <text v-else>学员:{{item.uid}}</text> | 30 | + <view class="list"> |
| 31 | + <view class="item" v-for="(item,index) in datas"> | ||
| 32 | + <view class="item-top"> | ||
| 33 | + <template v-if="active==5"> | ||
| 34 | + <view class="tab" v-if="item.type==1"> | ||
| 35 | + 事假 | ||
| 44 | </view> | 36 | </view> |
| 45 | - <view class="vio_li_inr"> | ||
| 46 | - {{item.content}} | 37 | + <view class="tab bg" v-else> |
| 38 | + 病假 | ||
| 47 | </view> | 39 | </view> |
| 40 | + </template> | ||
| 41 | + | ||
| 42 | + <view class="name"> | ||
| 43 | + <template v-if="active==5||active==6"> | ||
| 44 | + {{item.name}} | ||
| 45 | + </template> | ||
| 46 | + <template v-else> | ||
| 47 | + {{item.uid}} | ||
| 48 | + </template> | ||
| 48 | </view> | 49 | </view> |
| 49 | - <view v-if="active==5" class="li_time"> | ||
| 50 | - {{item.start_time}} | 50 | + |
| 51 | + <text class="state" v-if="item.examine === AUDITSTATUS.PENDINGREVIEW"> | ||
| 52 | + 待审核 | ||
| 53 | + </text> | ||
| 54 | + <text class="state bg" v-else-if="item.examine === AUDITSTATUS.APPROVED"> | ||
| 55 | + 已通过 | ||
| 56 | + </text> | ||
| 57 | + <text class="state bg1" v-else-if="item.examine === AUDITSTATUS.FAILED"> | ||
| 58 | + 未通过 | ||
| 59 | + </text> | ||
| 60 | + | ||
| 51 | </view> | 61 | </view> |
| 52 | - <view v-else-if="active==6" class="li_time"> | ||
| 53 | - {{item.create_time}} | 62 | + <view class="item-remarks" v-if="active==5"> |
| 63 | + {{item.content || ''}} | ||
| 64 | + </view> | ||
| 65 | + <view class="item-title" v-else> | ||
| 66 | + <text class="icon"></text> | ||
| 67 | + <text class="content"> | ||
| 68 | + <template v-if="active==6"> | ||
| 69 | + {{item.content || ''}} | ||
| 70 | + </template> | ||
| 71 | + <template v-else> | ||
| 72 | + {{item.title}} | ||
| 73 | + </template> | ||
| 74 | + </text> | ||
| 54 | </view> | 75 | </view> |
| 55 | - <view v-else class="li_time"> | 76 | + <view class="item-time"> |
| 77 | + <template v-if="active==5"> | ||
| 78 | + {{item.start_time}} | ||
| 79 | + </template> | ||
| 80 | + <template v-else-if="active==6"> | ||
| 81 | + {{item.create_time}} | ||
| 82 | + </template> | ||
| 83 | + <template v-else> | ||
| 56 | {{item.deduct_time}} | 84 | {{item.deduct_time}} |
| 85 | + </template> | ||
| 57 | </view> | 86 | </view> |
| 58 | </view> | 87 | </view> |
| 59 | - <u-empty v-if="datas.length==0" | ||
| 60 | - mode="data" | ||
| 61 | - text="暂无违纪" | ||
| 62 | - icon="/static/images/tch/img_blank.png" | ||
| 63 | - > | ||
| 64 | - </u-empty> | ||
| 65 | </view> | 88 | </view> |
| 66 | - <!-- 阻止滑动 --> | ||
| 67 | - <!-- <view @touchmove.stop.prevent='test'></view> --> | ||
| 68 | </view> | 89 | </view> |
| 69 | </template> | 90 | </template> |
| 70 | 91 | ||
| @@ -272,41 +293,34 @@ | @@ -272,41 +293,34 @@ | ||
| 272 | background: #F8F8F8; | 293 | background: #F8F8F8; |
| 273 | } | 294 | } |
| 274 | .vio_top{ | 295 | .vio_top{ |
| 275 | - // position: absolute; | ||
| 276 | - // top: 0; | ||
| 277 | - // z-index: 1; | ||
| 278 | width: 100%; | 296 | width: 100%; |
| 279 | - min-height: 220rpx; | ||
| 280 | - background: linear-gradient(0deg, rgba(45, 129, 255, .01) 0%, #428EFE 80%, #2D81FF 100%); | ||
| 281 | -} | ||
| 282 | -.vip_tab_list{ | ||
| 283 | - padding: 0 30rpx; | ||
| 284 | } | 297 | } |
| 285 | .vip_tab_li{ | 298 | .vip_tab_li{ |
| 286 | - height: 100rpx; | ||
| 287 | display: inline-flex; | 299 | display: inline-flex; |
| 288 | - align-items: center; | ||
| 289 | - font-size: 30rpx; | ||
| 290 | - color: #FFFFFF; | ||
| 291 | - opacity: 0.6; | ||
| 292 | - margin-right: 50rpx; | 300 | + font-size: 28rpx; |
| 301 | + font-family: PingFang SC; | ||
| 302 | + font-weight: 500; | ||
| 303 | + color: #323232; | ||
| 293 | position: relative; | 304 | position: relative; |
| 305 | + background-color: #fff; | ||
| 306 | + border-top:1rpx solid #f3f4f6; | ||
| 307 | + padding:30rpx; | ||
| 294 | &.active{ | 308 | &.active{ |
| 295 | - opacity: 1; | ||
| 296 | - | 309 | + color: #2D81FF; |
| 297 | &:after{ | 310 | &:after{ |
| 298 | content: ''; | 311 | content: ''; |
| 299 | position: absolute; | 312 | position: absolute; |
| 300 | - bottom: 0; | 313 | + bottom: 8rpx; |
| 301 | left: 50%; | 314 | left: 50%; |
| 302 | - margin-left: -18rpx; | ||
| 303 | - width: 36rpx; | ||
| 304 | - height: 6rpx; | ||
| 305 | - background: #FFFFFF; | ||
| 306 | - border-radius: 3rpx; | 315 | + background-image: url(@/static/imagesV2/icon23.png); |
| 316 | + background-size: 100% 100%; | ||
| 317 | + transform: translateX(-50%); | ||
| 318 | + height: 24rpx; | ||
| 319 | + width: 24rpx; | ||
| 307 | } | 320 | } |
| 308 | } | 321 | } |
| 309 | } | 322 | } |
| 323 | + | ||
| 310 | .vio_sx{ | 324 | .vio_sx{ |
| 311 | margin-top: 28rpx; | 325 | margin-top: 28rpx; |
| 312 | padding: 0 30rpx 30rpx; | 326 | padding: 0 30rpx 30rpx; |
| @@ -323,6 +337,7 @@ | @@ -323,6 +337,7 @@ | ||
| 323 | letter-spacing: 0; | 337 | letter-spacing: 0; |
| 324 | display: flex; | 338 | display: flex; |
| 325 | align-items: center; | 339 | align-items: center; |
| 340 | + border-radius: 36rpx; | ||
| 326 | .icon{ | 341 | .icon{ |
| 327 | font-size: 20rpx; | 342 | font-size: 20rpx; |
| 328 | margin-left: 5rpx; | 343 | margin-left: 5rpx; |
| @@ -333,86 +348,103 @@ | @@ -333,86 +348,103 @@ | ||
| 333 | height: 80rpx; | 348 | height: 80rpx; |
| 334 | background: #FFFFFF; | 349 | background: #FFFFFF; |
| 335 | border-radius: 10rpx; | 350 | border-radius: 10rpx; |
| 336 | - padding: 0 24rpx; | 351 | + padding: 0 30rpx; |
| 337 | display: flex; | 352 | display: flex; |
| 338 | align-items: center; | 353 | align-items: center; |
| 354 | + border-radius: 36rpx; | ||
| 355 | + | ||
| 339 | input{ | 356 | input{ |
| 340 | flex: 1; | 357 | flex: 1; |
| 341 | min-width: 0; | 358 | min-width: 0; |
| 342 | - padding-right: 20rpx; | ||
| 343 | font-size: 30rpx; | 359 | font-size: 30rpx; |
| 344 | } | 360 | } |
| 345 | .icon{ | 361 | .icon{ |
| 346 | color: #B7BAC0; | 362 | color: #B7BAC0; |
| 347 | - font-size: 40rpx; | 363 | + font-size: 30rpx; |
| 364 | + margin-right: 20rpx; | ||
| 348 | } | 365 | } |
| 349 | } | 366 | } |
| 350 | -.vio_list{ | ||
| 351 | - width: 100%; | 367 | + |
| 368 | +.list { | ||
| 352 | padding: 0 30rpx 30rpx; | 369 | padding: 0 30rpx 30rpx; |
| 353 | - .vio_li{ | ||
| 354 | - width: 100%; | ||
| 355 | - // min-height: 235rpx; | 370 | + .item { |
| 356 | background: #FFFFFF; | 371 | background: #FFFFFF; |
| 357 | - border-radius: 10rpx; | ||
| 358 | - &+.vio_li{ | ||
| 359 | - margin-top: 20rpx; | ||
| 360 | - } | ||
| 361 | - .vio_li_msg{ | ||
| 362 | - width: 100%; | 372 | + border-radius: 20rpx; |
| 363 | padding: 30rpx; | 373 | padding: 30rpx; |
| 364 | - .vio_li_tit{ | ||
| 365 | - font-size: 28rpx; | ||
| 366 | - color: #7D8087; | 374 | + & + .item { |
| 375 | + margin-top: 30rpx; | ||
| 376 | + } | ||
| 377 | + &-top { | ||
| 367 | display: flex; | 378 | display: flex; |
| 368 | align-items: center; | 379 | align-items: center; |
| 369 | - margin-bottom: 20rpx; | ||
| 370 | - .li_type{ | ||
| 371 | - width: 14rpx; | ||
| 372 | - height: 14rpx; | ||
| 373 | - background: #2D81FF; | ||
| 374 | - border-radius: 50%; | 380 | + .tab { |
| 381 | + border: 1px solid #2E86FE; | ||
| 382 | + border-radius: 2rpx; | ||
| 383 | + font-size: 22rpx; | ||
| 384 | + font-family: PingFang SC; | ||
| 385 | + font-weight: 400; | ||
| 386 | + color: #2E86FE; | ||
| 387 | + padding: 4rpx 10rpx; | ||
| 375 | margin-right: 10rpx; | 388 | margin-right: 10rpx; |
| 389 | + & .bg { | ||
| 390 | + border: 1px solid #FF7E00; | ||
| 391 | + color: #FF7E00; | ||
| 376 | } | 392 | } |
| 377 | - .li_name{ | ||
| 378 | - font-size: 32rpx; | ||
| 379 | - color: #545D71; | ||
| 380 | } | 393 | } |
| 381 | - .li_tip{ | ||
| 382 | - font-size: 26rpx; | ||
| 383 | - // color: #2D81FF; | ||
| 384 | - // background: rgba(#2D81FF, .1); | ||
| 385 | - padding: 2rpx 14rpx; | ||
| 386 | - line-height: 30rpx; | ||
| 387 | - margin-left: 10rpx; | ||
| 388 | 394 | ||
| 389 | - text{ | ||
| 390 | - // opacity: 1; | ||
| 391 | - } | 395 | + |
| 396 | + .name { | ||
| 397 | + font-size: 30rpx; | ||
| 398 | + font-family: PingFang SC; | ||
| 399 | + font-weight: 500; | ||
| 400 | + color: #323232; | ||
| 401 | + flex: 1; | ||
| 392 | } | 402 | } |
| 393 | - .identification{ | ||
| 394 | - font-size: 26rpx; | ||
| 395 | - // color: #2D81FF; | ||
| 396 | - // background: rgba(#2D81FF, .1); | ||
| 397 | - padding: 2rpx 14rpx; | ||
| 398 | - line-height: 30rpx; | ||
| 399 | - margin-left: 10rpx; | 403 | + .state { |
| 404 | + background: linear-gradient(0deg, #0AC49C 0%, #34D5AA 100%); | ||
| 405 | + border-radius: 21rpx 21rpx 0 21rpx; | ||
| 406 | + padding: 5rpx 20rpx; | ||
| 407 | + font-size: 22rpx; | ||
| 408 | + font-family: PingFang SC; | ||
| 409 | + font-weight: 500; | ||
| 410 | + color: #FFFFFF; | ||
| 411 | + & .bg { | ||
| 412 | + background: linear-gradient(0deg, #0088FF 0%, #2C9DFF 100%); | ||
| 400 | } | 413 | } |
| 414 | + & .bg1 { | ||
| 415 | + background: linear-gradient(0deg, #BEBEBE 0%, #AAAAAA 100%); | ||
| 401 | } | 416 | } |
| 402 | - .vio_li_inr{ | ||
| 403 | - font-size: 30rpx; | ||
| 404 | - color: #545D71; | ||
| 405 | } | 417 | } |
| 406 | } | 418 | } |
| 407 | - .li_time{ | ||
| 408 | - width: 100%; | ||
| 409 | - height: 80rpx; | ||
| 410 | - border-top: 1rpx solid #eee; | ||
| 411 | - font-size: 28rpx; | ||
| 412 | - color: #545D71; | ||
| 413 | - padding: 0 28rpx; | 419 | + &-title { |
| 414 | display: flex; | 420 | display: flex; |
| 415 | align-items: center; | 421 | align-items: center; |
| 422 | + font-size: 26rpx; | ||
| 423 | + font-family: PingFang SC; | ||
| 424 | + font-weight: 400; | ||
| 425 | + color: #646464; | ||
| 426 | + margin-top: 30rpx; | ||
| 427 | + .icon { | ||
| 428 | + width: 12rpx; | ||
| 429 | + height: 12rpx; | ||
| 430 | + background: #2D81FF; | ||
| 431 | + border-radius: 50%; | ||
| 432 | + margin-right: 10rpx; | ||
| 433 | + } | ||
| 434 | + } | ||
| 435 | + &-remarks { | ||
| 436 | + font-size: 26rpx; | ||
| 437 | + font-family: PingFang SC; | ||
| 438 | + font-weight: 400; | ||
| 439 | + color: #646464; | ||
| 440 | + margin-top: 30rpx; | ||
| 441 | + } | ||
| 442 | + &-time { | ||
| 443 | + font-size: 24rpx; | ||
| 444 | + font-family: PingFang SC; | ||
| 445 | + font-weight: 400; | ||
| 446 | + color: #979797; | ||
| 447 | + margin-top: 30rpx; | ||
| 416 | } | 448 | } |
| 417 | } | 449 | } |
| 418 | } | 450 | } |
-
请 注册 或 登录 后发表评论