index.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <template>
  2. <view class="page">
  3. <u-navbar title="团餐设置" :autoBack="true" :placeholder="true" :border-bottom="true"></u-navbar>
  4. <view class="menu">
  5. <view
  6. v-for="(item, i) in menus"
  7. :key="i"
  8. :class="['row', i === menus.length - 1 ? 'last' : '']"
  9. @click="go(item)"
  10. >
  11. <text class="label">{{ item.name }}</text>
  12. <u-icon name="arrow-right" color="#C7C6CA" size="28"></u-icon>
  13. </view>
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. export default {
  19. data() {
  20. return {
  21. menus: [
  22. { name: '我的团长', path: '/pages/merchantDish/settings/leader' },
  23. { name: '餐盒设置', path: '/pages/merchantDish/settings/box-list' }
  24. ]
  25. };
  26. },
  27. methods: {
  28. go(item) {
  29. uni.navigateTo({ url: item.path });
  30. }
  31. }
  32. };
  33. </script>
  34. <style lang="scss" scoped>
  35. .page {
  36. min-height: 100vh;
  37. background: #f7f8fa;
  38. }
  39. .menu {
  40. background: #fff;
  41. }
  42. .row {
  43. display: flex;
  44. align-items: center;
  45. justify-content: space-between;
  46. min-height: 104rpx;
  47. padding: 0 32rpx;
  48. border-bottom: 1rpx solid #f0f0f0;
  49. &.last {
  50. border-bottom: none;
  51. }
  52. &:active {
  53. background: #fafafa;
  54. }
  55. .label {
  56. font-size: 30rpx;
  57. color: #333;
  58. }
  59. }
  60. </style>