index.vue 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256
  1. <template>
  2. <view class="page-fitness">
  3. <uni-nav-bar :fixed="true" height="200rpx" color="#FFF" left-icon="home" backgroundColor="rgb(0,0,0,0)" :border="false" @clickLeft="onHome"/>
  4. <view class="swiper-item">
  5. <swiper >
  6. <swiper-item v-for="(item ,index) in bannerList" :key="index" style="width:100%;">
  7. <view class="swiper-img" style="width:100%;">
  8. <image :src="item.imageUrl" style=" width:100%;"></image>
  9. </view>
  10. </swiper-item>
  11. </swiper>
  12. </view>
  13. <view class="teacher">
  14. <view class="title">明星教练</view>
  15. <view class="list">
  16. <view class="left">
  17. <block v-for="(it,index) in teacherList">
  18. <view class="header" @click="onViewTeacher(it)">
  19. <image :src="it.headerImg" class="img"></image>
  20. </view>
  21. </block>
  22. </view>
  23. <view class="right">
  24. <uni-icons type="right" size="24"></uni-icons>
  25. </view>
  26. </view>
  27. </view>
  28. <view class="section1">
  29. <view class="title">
  30. <view class="txt">团课课表</view>
  31. <view class="more" @click="onViewHome()">健身特权卡售卖中,查看详情</view>
  32. </view>
  33. <view class="time-bg">
  34. <PlanDate @onSetDate="onSetDate"></PlanDate>
  35. </view>
  36. <!--
  37. <view class="selection">
  38. <uni-data-select :localdata="courseSectionList" :clear="false" style="margin-right:10px;"></uni-data-select>
  39. <uni-data-select :localdata="areaSectionList" :clear="false" style="margin-right:10px;"></uni-data-select>
  40. <uni-data-select :localdata="sortSectionList" :clear="false" style="margin-right:10px;"></uni-data-select>
  41. </view>
  42. -->
  43. <view class="sections-tab">
  44. <template v-for="(it,index) in tabQuery">
  45. <view class="item" :class="index==tabIndex?'active':''" @click="onChangeTab(index)">{{it.name}}</view>
  46. </template>
  47. </view>
  48. <view class="teacher-list">
  49. <block v-if="tabQuery[tabIndex].dataList.length>0">
  50. <block v-for="(it,index) in tabQuery[tabIndex].dataList">
  51. <CourseItem :info="it" @onStart="onStartCourse"></CourseItem>
  52. </block>
  53. </block>
  54. <block v-else>
  55. <view class="empty-course">没有课程信息</view>
  56. </block>
  57. </view>
  58. </view>
  59. <page-btm-bar :active="1" />
  60. </view>
  61. </template>
  62. <script>
  63. import {
  64. mapState,
  65. mapGetters,
  66. mapMutations
  67. } from 'vuex'
  68. const app = getApp();
  69. let hideLoading = true;
  70. import CourseItem from "@/components/CourseItem/CourseItem.vue"
  71. import PlanDate from '@/components/PlanDate/PlanDate.vue'
  72. export default {
  73. components:{
  74. CourseItem,
  75. PlanDate
  76. },
  77. data() {
  78. return {
  79. teacherList:[],//教练列表
  80. bannerList:[],
  81. tabIndex:0,
  82. tabQuery:[
  83. {
  84. name:'私教课',
  85. queryForm:{
  86. page:0,
  87. type:1,
  88. pageSize:10,
  89. startTime:'',
  90. endTime:'',
  91. },
  92. dataList:[],
  93. },
  94. {
  95. name:'团课',
  96. queryForm:{
  97. page:0,
  98. type:2,
  99. pageSize:10,
  100. startTime:'',
  101. endTime:'',
  102. },
  103. dataList:[],
  104. }
  105. ],
  106. storeInfo:null,
  107. courseSectionList:[
  108. {
  109. value:'',
  110. text:'全部课程 '
  111. }
  112. ],
  113. sortSectionList:[
  114. {
  115. value:'',
  116. text:'距离优先'
  117. }
  118. ],
  119. areaSectionList:[
  120. {
  121. value:'',
  122. text:'所有区域'
  123. }
  124. ]
  125. };
  126. },
  127. computed: {
  128. ...mapState(['store_id','systemInfo'])
  129. },
  130. onShow(){
  131. this.initBanner();
  132. this.initTeacherList();
  133. this.tabIndex=0;
  134. this.tabQuery[0].queryForm.page=0;
  135. this.onSearchCourse();
  136. },
  137. methods:{
  138. onChangeTab(e){
  139. let _this=this;
  140. _this.tabIndex=e;
  141. _this.tabQuery[e].queryForm.page=0;
  142. _this.onSearchCourse();
  143. },
  144. onViewTeacher(e){
  145. uni.navigateTo({
  146. url:'/pages/fitness/teacher/teacher?id='+e.id,
  147. })
  148. },
  149. onViewHome(e){
  150. // 设置全局数据
  151. getApp().globalData.runMethod = true;
  152. // 切换 tab
  153. uni.switchTab({
  154. url:'/pages/home/home',
  155. });
  156. },
  157. initBanner(){
  158. let _this=this;
  159. this.$http.request('banner/search', {
  160. page:1,
  161. pageSize:10,
  162. type:3,
  163. }, "", "", hideLoading).then(res => {
  164. _this.bannerList=res.data.dataList;
  165. }).catch(err => {})
  166. },
  167. initTeacherList(){
  168. let _this=this;
  169. this.$http.request('course/teacherList ', {
  170. page:0,
  171. pageSize:4
  172. }, "", "", hideLoading).then(res => {
  173. _this.teacherList=res.data.dataList;
  174. }).catch(err => {})
  175. },
  176. onSetDate(e){
  177. let _this=this;
  178. _this.tabQuery[_this.tabIndex].queryForm.startTime=e+" 00:00:00";
  179. _this.tabQuery[_this.tabIndex].queryForm.endTime=e+" 23:00:00";
  180. _this.tabQuery[_this.tabIndex].queryForm.page=0;
  181. _this.onSearchCourse();
  182. },
  183. onSearchCourse(){
  184. let _this=this;
  185. if(_this.tabQuery[_this.tabIndex].queryForm.page<1){
  186. _this.tabQuery[_this.tabIndex].dataList=[];
  187. }
  188. _this.tabQuery[_this.tabIndex].queryForm.page++;
  189. this.$http.request('course/searchCourse', _this.tabQuery[_this.tabIndex].queryForm, "", "", hideLoading).then(res => {
  190. _this.tabQuery[_this.tabIndex].dataList=res.data.dataList;
  191. }).catch(err => {})
  192. },
  193. onHome(e){
  194. uni.switchTab({
  195. url:'/pages/home/home'
  196. })
  197. },
  198. initStoreInfo(){
  199. let _this=this;
  200. this.$http.request('xcx/system', {
  201. store_id: this.store_id,
  202. }, "", "", hideLoading).then(res => {
  203. _this.storeInfo=res.data;
  204. }).catch(err => {})
  205. },
  206. //开始课程
  207. onStartCourse(e){
  208. uni.navigateTo({
  209. url:"/pages/fitness/Course/Course?id="+e
  210. })
  211. },
  212. }
  213. }
  214. </script>
  215. <style lang="scss">
  216. @import './index.scss'
  217. </style>