bindLockStatus.vue 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <template>
  2. <view class="jpmain ">
  3. <view class="body">
  4. <u-steps :list="numList" mode="number" :current="current" un-active-color="#999999"></u-steps>
  5. </view>
  6. <view class="data">
  7. <!-- <u-icon name="clock-fill" color="#1677FF" size="128"></u-icon>-->
  8. <u-icon name="checkmark-circle-fill" color="#00B962" size="128"></u-icon>
  9. <view class="t1">等待审核中</view>
  10. <view class="t2">绑定申请已提交,等待后台审核完成建站</view>
  11. </view>
  12. <view class="floating-button">
  13. <view class="button button2">
  14. 返回
  15. </view>
  16. </view>
  17. </view>
  18. </view>
  19. </template>
  20. <script>
  21. export default {
  22. data() {
  23. return {
  24. current: 1,
  25. numList: [{
  26. name: '绑定地锁'
  27. }, {
  28. name: '等待审核'
  29. }, {
  30. name: '完成绑定'
  31. }],
  32. };
  33. }
  34. }
  35. </script>
  36. <style lang="scss">
  37. .body {
  38. padding: 32rpx;
  39. background-color: rgba(242, 244, 246, 1);
  40. }
  41. .data{
  42. text-align: center;
  43. padding-top:120rpx;
  44. .t1{
  45. color: #101010;
  46. font-weight: bold;
  47. margin-top: 40rpx;
  48. font-size: 40rpx;
  49. }
  50. .t2{
  51. margin-top: 8rpx;
  52. color: rgba(119,119,119,1);
  53. font-size: 24rpx;
  54. }
  55. }
  56. .floating-button {
  57. padding-top:120rpx;
  58. text-align: center;
  59. .button {
  60. margin: 0 auto;
  61. border-radius: 50px;
  62. height: 80rpx;
  63. width: 80%;
  64. display: flex;
  65. align-items: center;
  66. justify-content: center;
  67. padding: 12rpx;
  68. background-color: rgba(22, 119, 255, 1);
  69. color: rgba(255, 255, 255, 1);
  70. font-size: 36rpx;
  71. }
  72. .button2{
  73. background-color: #00B962
  74. }
  75. }
  76. </style>