index.vue 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266
  1. <template>
  2. <view class="start-index">
  3. <view v-if="tabberPageLoadFlag[0]" :style="{display: currentIndex === 0 ? '' : 'none'}">
  4. <scroll-view class="custom-tabbar-page" scroll-y enable-back-to-top @scrolltolower="tabbarPageScrollLower">
  5. <Home ref="home"></Home>
  6. </scroll-view>
  7. </view>
  8. <view v-if="tabberPageLoadFlag[1]" :style="{display: currentIndex === 1 ? '' : 'none'}">
  9. <scroll-view class="custom-tabbar-page" scroll-y enable-back-to-top @scrolltolower="tabbarPageScrollLower">
  10. <Comm ref="comm"></Comm>
  11. </scroll-view>
  12. </view>
  13. <view v-if="tabberPageLoadFlag[2]" :style="{display: currentIndex === 2 ? '' : 'none'}">
  14. <scroll-view class="custom-tabbar-page" scroll-y enable-back-to-top @scrolltolower="tabbarPageScrollLower">
  15. <Discovery ref="discovery"></Discovery>
  16. </scroll-view>
  17. </view>
  18. <!-- <view v-if="tabberPageLoadFlag[3]" :style="{display: currentIndex === 3 ? '' : 'none'}">
  19. <scroll-view class="custom-tabbar-page" scroll-y enable-back-to-top @scrolltolower="tabbarPageScrollLower">
  20. <Message ref="message"></Message>
  21. </scroll-view>
  22. </view> -->
  23. <view v-if="tabberPageLoadFlag[3]" :style="{display: currentIndex === 3 ? '' : 'none'}">
  24. <scroll-view class="custom-tabbar-page" scroll-y enable-back-to-top @scrolltolower="tabbarPageScrollLower">
  25. <Mine ref="mine"></Mine>
  26. </scroll-view>
  27. </view>
  28. <tn-tabbar v-model="currentIndex" :list="tabbarList" activeColor="#1d60b1" inactiveColor="#AAAAAA"
  29. activeIconColor="#1d60b1" :animation="true" :safeAreaInsetBottom="true" @change="switchTabbar"></tn-tabbar>
  30. </view>
  31. </template>
  32. <script>
  33. import Home from '../home/home.vue'
  34. import Comm from '../comm/comm.vue'
  35. import Discovery from '../discovery/discovery.vue'
  36. import Mine from '../mine/mine.vue'
  37. import request from '../../utils/request'
  38. export default {
  39. components: {
  40. Home,
  41. Comm,
  42. Discovery,
  43. Mine
  44. },
  45. data() {
  46. return {
  47. // 底部tabbar菜单数据
  48. tabbarList: [{
  49. title: '我要什么',
  50. activeIcon: 'home-smile-fill',
  51. inactiveIcon: 'home-smile'
  52. },
  53. {
  54. title: '我有什么',
  55. activeIcon: 'shop-fill',
  56. inactiveIcon: 'shop'
  57. },
  58. // {
  59. // title: '发现',
  60. // activeIcon: 'rocket',
  61. // inactiveIcon: 'cube',
  62. // activeIconColor: '#FFFFFF',
  63. // inactiveIconColor: '#FFFFFF',
  64. // iconSize: 50,
  65. // out: true
  66. // },
  67. {
  68. title: '供需发布平台',
  69. activeIcon: 'add-fill',
  70. inactiveIcon: 'add-circle',
  71. // count: 12
  72. },
  73. {
  74. title: '我的',
  75. activeIcon: 'my-fill',
  76. inactiveIcon: 'my'
  77. }
  78. ],
  79. // tabbar当前被选中的序号
  80. currentIndex: 0,
  81. // 自定义底栏对应页面的加载情况
  82. tabberPageLoadFlag: []
  83. }
  84. },
  85. onLoad(options) {
  86. const index = Number(options.index || 0)
  87. // 根据底部tabbar菜单列表设置对应页面的加载情况
  88. this.tabberPageLoadFlag = this.tabbarList.map((item, tabbar_index) => {
  89. return index === tabbar_index
  90. })
  91. this.switchTabbar(index);
  92. let that = this;
  93. // uni.login({
  94. // success(res) {
  95. // console.error(res);
  96. // that.loginByCode(res.code);
  97. // },
  98. // fail(res) {
  99. // console.error(res);
  100. // uni.hideLoading();
  101. // }
  102. // });
  103. },
  104. onShow(){
  105. if (this.currentIndex === 3&&this.$refs.mine) {
  106. this.$refs.mine.getContentRectInfo();
  107. }
  108. if (this.currentIndex === 1&&this.$refs.comm) {
  109. this.$refs.comm.fetchData();
  110. }
  111. },
  112. methods: {
  113. // 切换导航
  114. switchTabbar(index) {
  115. this._switchTabbarPage(index)
  116. if (index !== 1) {
  117. this.$refs?.commRef?.stopAllVideo()
  118. }
  119. },
  120. //获取openId,unionid
  121. getOpenId(code) {
  122. const that = this;
  123. request.post('/wxma/code2Session',{
  124. code: code,
  125. platType: "slb",
  126. mpType: "engineer",
  127. }).then(res=>{
  128. console.error(res);
  129. if(res.success){
  130. //登录成功
  131. uni.setStorageSync('userMap', JSON.stringify(res.resultMap));
  132. }
  133. })
  134. // wx.request({
  135. // method: 'post',
  136. // url: 'http://slb-m.dev.ml1993.com/lx-api/wxma/code2Session', //仅为示例,并非真实的接口地址
  137. // data: {
  138. // code: code,
  139. // platType: "slb",
  140. // mpType: "engineer",
  141. // },
  142. // header: {
  143. // 'content-type': 'application/json' ,// 默认值
  144. // platType: "slb",
  145. // mpType: "engineer",
  146. // },
  147. // success(res) {
  148. // console.warn(res);
  149. // //unionid存到本地
  150. // wx.setStorage({
  151. // key: "frontlixiangsid",
  152. // data: res.data.resultMap.frontlixiangsid
  153. // }, {
  154. // key: "userId",
  155. // data: res.data.resultMap.unionid
  156. // })
  157. // }
  158. // })
  159. },
  160. loginByCode(frontId) {
  161. const that = this;
  162. uni.setStorageSync('loginStatus', 'false');
  163. wx.getUserInfo({
  164. success: function(res) {
  165. console.error(res);
  166. request.post("/slbMpAutoLogin", {
  167. code:frontId,
  168. appType:'ma',
  169. encryptedData:res.encryptedData,
  170. iv: res.iv
  171. }, {
  172. login: false,
  173. warn:false,
  174. loading:false
  175. }).then(res2=>{
  176. console.error(res2);
  177. if(res2.success){
  178. //登录成功
  179. uni.setStorageSync('loginStatus', 'true');
  180. uni.setStorageSync('userMap', JSON.stringify(res2.resultMap));
  181. uni.setStorageSync('userNo', res2.resultMap.accountName);
  182. }else{
  183. console.error(12345);
  184. uni.setStorageSync('loginStatus', 'false');
  185. //登录失败,
  186. uni.login({
  187. success(res) {
  188. console.error(res);
  189. that.getOpenId(res.code);
  190. },
  191. fail(res) {
  192. console.error(res);
  193. uni.hideLoading();
  194. }
  195. });
  196. }
  197. console.error(res2);
  198. });
  199. // uni.request({
  200. // method: 'post',
  201. // url: 'http://slb-m.dev.ml1993.com/lx-api/slbMpAutoLogin', //仅为示例,并非真实的接口地址
  202. // data: {
  203. // code:frontId,
  204. // appType:'ma',
  205. // encryptedData:res.encryptedData,
  206. // iv: res.iv
  207. // },
  208. // header: {
  209. // 'content-type': 'application/json', // 默认值
  210. // platType: "slb",
  211. // mpType: "engineer",
  212. // },
  213. // success(res2) {
  214. // console.error(res2);
  215. // //unionid存到本地
  216. // }
  217. // })
  218. }
  219. })
  220. },
  221. // 瀑布流导航页面滚动到底部
  222. tabbarPageScrollLower(e) {
  223. if (this.currentIndex === 0) {
  224. this.$refs.home.loadMore();
  225. }
  226. if (this.currentIndex === 1) {
  227. this.$refs.comm.loadMore();
  228. }
  229. if (this.currentIndex === 2) {
  230. this.$refs.discovery.getRandomData && this.$refs.discovery.getRandomData()
  231. }
  232. },
  233. // 切换导航页面
  234. _switchTabbarPage(index) {
  235. const selectPageFlag = this.tabberPageLoadFlag[index]
  236. if (selectPageFlag === undefined) {
  237. return
  238. }
  239. if (selectPageFlag === false) {
  240. this.tabberPageLoadFlag[index] = true
  241. }
  242. this.currentIndex = index
  243. }
  244. }
  245. }
  246. </script>
  247. <style lang="scss" scoped>
  248. </style>