marketing.vue 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. <!-- 技师营销 -->
  2. <template>
  3. <s-layout class="homepage-wrap ss-w-100 box-sizing" title="订单" navbar="custom"
  4. tabbar="/pages/XDHomePage/orderInfoList/orderInfoList">
  5. <view class="body" :style="'padding-top:' + bottomHeight">
  6. <!-- 导航 -->
  7. <view class="ss-flex-2 ss-col-center ss-margin-width2" style="position: relative">
  8. <view style="color: #3D444E; font-size: 28rpx">营销</view>
  9. <view class="ss-flex-1"></view>
  10. <text class="textIcon icon-kefu icon-navigation"></text>
  11. <text class="textIcon icon-tongzhiguanli icon-navigation" style="margin-left: 30rpx"></text>
  12. </view>
  13. <!-- 中部 -->
  14. <view class="list-wrap">
  15. <scroll-view scroll-y="true" class="list">
  16. <view class="list-scroll-view">
  17. </view>
  18. </scroll-view>
  19. </view>
  20. </view>
  21. </s-layout>
  22. </template>
  23. <script setup>
  24. import {
  25. reactive,
  26. ref
  27. } from 'vue';
  28. import {
  29. computed
  30. } from 'vue';
  31. import {
  32. onLoad,
  33. onPageScroll,
  34. onPullDownRefresh,
  35. onReady,
  36. onReachBottom,
  37. onShow,
  38. } from '@dcloudio/uni-app';
  39. import sheep from '@/sheep';
  40. import $share from '@/sheep/platform/share';
  41. // 隐藏原生tabBar
  42. // uni.hideTabBar();
  43. // 返回首页
  44. const backPage = async () => {
  45. uni.reLaunch({
  46. url: '/pages/XDHome/homePage/homePage',
  47. });
  48. };
  49. const bottomHeight = ref('0rpx');
  50. // #ifdef APP-PlUS
  51. //获取顶部安全距离
  52. const app = uni.getSystemInfoSync();
  53. const bottomHeightOne = app.statusBarHeight + 'rpx';
  54. bottomHeight.value = bottomHeightOne
  55. // #endif
  56. </script>
  57. <style scoped lang="scss">
  58. .icon-navigation {
  59. font-size: 32rpx;
  60. color: #3D444E;
  61. font-weight: 700;
  62. }
  63. // 上中下布局样式
  64. .body {
  65. display: flex;
  66. flex-direction: column;
  67. background-color: #EEEEF0;
  68. height: calc(100vh - 50px);
  69. box-sizing: border-box;
  70. }
  71. .head {
  72. text-align: center;
  73. }
  74. // 中部滚动
  75. .list-wrap {
  76. flex-grow: 1;
  77. position: relative;
  78. width: 95%;
  79. margin-left: 2.5%;
  80. box-sizing: border-box;
  81. }
  82. .list {
  83. position: absolute;
  84. top: 0;
  85. left: 0;
  86. right: 0;
  87. bottom: 50rpx;
  88. padding: 10rpx;
  89. border-radius: 15rpx;
  90. box-sizing: border-box;
  91. }
  92. .list-scroll-view {
  93. width: 100%;
  94. margin-bottom: 20rpx;
  95. box-sizing: border-box;
  96. }
  97. .course-card {
  98. width: 47vw;
  99. margin-top: 10px;
  100. margin-bottom: 10px;
  101. }
  102. // 底部
  103. .tools {
  104. display: flex;
  105. flex-direction: row;
  106. justify-content: space-between;
  107. }
  108. .tools-item {
  109. width: 45px;
  110. text-align: center;
  111. font-size: 14px;
  112. padding: 20px;
  113. }
  114. </style>