index.vue 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <view class="page-wrap">
  3. <view class="nav-row" @click="handleOpenDetail">
  4. <view class="label">2023-10</view>
  5. <view class="state warn">未到票</view>
  6. <image class="arrow" src="../../../static/svg/arrow.svg"></image>
  7. </view>
  8. <view class="nav-row">
  9. <view class="label">2023-10</view>
  10. <view class="state">处理中</view>
  11. <image class="arrow" src="../../../static/svg/arrow.svg"></image>
  12. </view>
  13. <view class="nav-row">
  14. <view class="label">2023-10</view>
  15. <view class="state">已完成</view>
  16. <image class="arrow" src="../../../static/svg/arrow.svg"></image>
  17. </view>
  18. </view>
  19. </template>
  20. <script>
  21. export default {
  22. data() {
  23. return {};
  24. },
  25. methods: {
  26. handleOpenDetail() {
  27. uni.navigateTo({
  28. url: 'detail'
  29. });
  30. }
  31. }
  32. };
  33. </script>
  34. <style lang="scss" scoped>
  35. .nav-row {
  36. display: flex;
  37. align-items: center;
  38. height: 96.15rpx;
  39. padding: 0 41.21rpx;
  40. font-size: 27.47rpx;
  41. background: #fff;
  42. border-top: 1rpx solid #e0e0e0;
  43. &:first-child {
  44. border: none;
  45. }
  46. .label {
  47. flex: 1;
  48. }
  49. .warn {
  50. color: #f97631;
  51. }
  52. .arrow {
  53. width: 34.34rpx;
  54. height: 34.34rpx;
  55. margin: 0 -13.74rpx 0 13.74rpx;
  56. }
  57. }
  58. </style>