index.vue 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291
  1. <template>
  2. <view class="ezy-my-page">
  3. <view class="my-head-box">
  4. <icon class="head-img-box" :style="{backgroundImage: 'url(' + myInfoData.userImg + ')'}"></icon>
  5. <view class="head-content-box">
  6. <text>{{myInfoData.userName}}</text>
  7. <view class="ezy-jf-box" v-if="loginFlag">
  8. <icon class="jf-icon"></icon>
  9. <text class="jf-text" >{{myInfoData.credit}}</text>
  10. </view>
  11. </view>
  12. </view>
  13. <swiper class="my-hyqy-swiper" circular :indicator-dots="hyqyData.indicatorDots" :autoplay="hyqyData.autoplay"
  14. :interval="hyqyData.interval" :duration="hyqyData.duration" indicator-color="#5195d3" indicator-active-color="#83d9ff">
  15. <!-- 1.数学 2.英语-->
  16. <swiper-item v-for="(item, index) in 2" :key="index" class="hyqy-box" :class="getHyqyClass(index)">
  17. <view class="hyqy-btn" @click="hyqyBtn(index)" v-if="getHyqyBtn(index)"></view>
  18. </swiper-item>
  19. </swiper>
  20. <view class="my-list-box">
  21. <view class="list-row" @click="telClick">
  22. <icon class="list-icon tel-icon"></icon>
  23. <text>手机号码</text>
  24. </view>
  25. <view class="list-row" @click="checkWrong">
  26. <icon class="list-icon error-icon"></icon>
  27. <text>我的错题</text>
  28. </view>
  29. <view class="list-row" @click="orderClick">
  30. <icon class="list-icon order-icon"></icon>
  31. <text>我的订单</text>
  32. </view>
  33. <view class="list-row no-jt" @click="aboutClick">
  34. <icon class="list-icon about-icon"></icon>
  35. <text>关于我们</text>
  36. </view>
  37. <view class="list-row no-jt" @click="exitLogin">
  38. <icon class="list-icon login-out-icon"></icon>
  39. <text>退出登录</text>
  40. </view>
  41. </view>
  42. <CustomTabBar :cardId="cardId" :nianji="nianji" :zhangId="zhangId"></CustomTabBar>
  43. <tip-small-dialog ref="exitDialogRef" @confirm-btn="exitBtn" :content="tipContent"></tip-small-dialog>
  44. <tip-middle-dialog ref="youkeDialogRef" @confirm-btn="ykConfirm" :content="MESSAGE_VISITER_TO_LOGIN"></tip-middle-dialog>
  45. <tel-dialog @telClose="telClose" @bindBtn="bindBtn" v-if="telDialogFlag"></tel-dialog>
  46. </view>
  47. </template>
  48. <script setup>
  49. import {toast,getUserIdentity} from "@/utils/common";
  50. import cacheManager from '@/utils/cacheManager.js';
  51. import {logout} from '@/api/login.js'
  52. import {myInfo} from '@/api/my.js'
  53. import CustomTabBar from '@/components/custom-tabbar/custom-tabbar.vue';
  54. import {getCurrentInstance} from 'vue';
  55. import {onLoad} from '@dcloudio/uni-app';
  56. import {reactive,ref} from "vue";
  57. import tipSmallDialog from '@/components/dialog/tipSmallDialog.vue';
  58. import tipMiddleDialog from '@/components/dialog/tipMiddleDialog.vue';
  59. import telDialog from './telDialog.vue'
  60. import {MESSAGE_VISITER_TO_LOGIN} from "@/utils/constant.js"
  61. const zhangId = ref(null);
  62. const nianji = ref(null);
  63. const cardId = ref(null);
  64. const tipContent = '你确定要执行这个操作吗?';
  65. let hyqyData = reactive({
  66. indicatorDots: true,
  67. autoplay: true,
  68. interval: 10000,
  69. duration: 500
  70. });
  71. let loginFlag = ref(false);
  72. let telDialogFlag = ref(false);
  73. let myInfoData = reactive({
  74. userImg: '',
  75. userName: '',
  76. credit: '',
  77. vipFlag: '',
  78. });
  79. let routerOpt = ref(false);
  80. const exitDialogRef = ref(null);
  81. const youkeDialogRef = ref(null);
  82. const exitLogin = () => {
  83. exitDialogRef.value.handleShow();
  84. }
  85. // 退出按钮
  86. const exitBtn = () => {
  87. if(loginFlag.value){
  88. logout().then(res => {
  89. cacheManager.clearAll();
  90. uni.redirectTo({
  91. url: '/pages/login/index'
  92. });
  93. }).catch(err => {
  94. toast('退出登录失败,请稍后重试')
  95. })
  96. }else{
  97. uni.redirectTo({
  98. url: '/pages/login/index'
  99. });
  100. }
  101. }
  102. // 游客弹窗---确定
  103. function ykConfirm(){
  104. uni.redirectTo({
  105. url: '/pages/login/index'
  106. });
  107. }
  108. // 手机号码
  109. function telClick(){
  110. if(loginFlag.value){
  111. telDialogFlag.value = true;
  112. }else{
  113. youkeDialogRef.value.handleShow();
  114. }
  115. }
  116. // 手机号码绑定
  117. function bindBtn(){
  118. telDialogFlag.value = false;
  119. myGetAuth()
  120. }
  121. // 关闭手机号码弹窗
  122. function telClose(){
  123. telDialogFlag.value = false;
  124. }
  125. // 关于我们
  126. function aboutClick(){
  127. if(loginFlag.value){
  128. uni.redirectTo({
  129. url: '/pages/my/aboutPage'
  130. });
  131. }else{
  132. uni.redirectTo({
  133. url: `/pages/my/aboutPage?nianji=${routerOpt.nianji}&cardId=${routerOpt.cardId}&zhangId=${routerOpt.zhangId}`
  134. });
  135. }
  136. }
  137. // 订单
  138. function orderClick(){
  139. if(loginFlag.value){
  140. uni.redirectTo({
  141. url: '/pages/pay/order'
  142. });
  143. }else{
  144. youkeDialogRef.value.handleShow();
  145. }
  146. }
  147. // 获取用户数据
  148. function getMyInfo(){
  149. myInfo({}).then(res => {
  150. getUserImg(res.data.growthType)
  151. myInfoData.userName = res.data.userName;
  152. myInfoData.credit = res.data.credit;
  153. })
  154. }
  155. // 获取用户头像
  156. function getUserImg(data){
  157. switch (data) {
  158. case 0:
  159. myInfoData.userImg = 'static/images/my/head-img0.png'
  160. break;
  161. case 1:
  162. myInfoData.userImg = 'static/images/my/head-img1.png'
  163. break;
  164. case 2:
  165. myInfoData.userImg = 'static/images/my/head-img2.png'
  166. break;
  167. case 3:
  168. myInfoData.userImg = 'static/images/my/head-img3.png'
  169. break;
  170. default:
  171. myInfoData.userImg = 'static/images/my/head-unlogin-img.png'
  172. break;
  173. }
  174. }
  175. // 会员权益按钮
  176. function hyqyBtn(index){
  177. let cardId = index+1;
  178. /* index为学科 1数学 2英语 */
  179. if(loginFlag.value){
  180. // 非游客
  181. uni.redirectTo({
  182. url: `/pages/pay/svip?cardId=${cardId}`
  183. })
  184. }else{
  185. // 游客
  186. youkeDialogRef.value.handleShow();
  187. }
  188. }
  189. // 判断是否是游客
  190. function myGetAuth(){
  191. let LocalStorage = cacheManager.get('auth');
  192. if (LocalStorage) {
  193. // 非游客
  194. noYoukeFun()
  195. }else{
  196. youkeFun();
  197. }
  198. }
  199. // 游客
  200. function youkeFun(){
  201. zhangId.value = routerOpt.zhangId
  202. nianji.value = routerOpt.nianji
  203. cardId.value = routerOpt.cardId
  204. // my游客
  205. loginFlag.value = false;
  206. myInfoData.userName = '游客';
  207. myInfoData.userImg = 'static/images/my/head-unlogin-img.png'
  208. }
  209. // 非游客
  210. function noYoukeFun(){
  211. loginFlag.value = true;
  212. getMyInfo();
  213. }
  214. // 获取会员权益card class
  215. function getHyqyClass(index){
  216. let VipIndex =index +1;
  217. if(cacheManager.get('auth')){
  218. // 非游客
  219. let VipArr = cacheManager.get('auth').cardList;
  220. if (VipArr.includes(VipIndex)) {
  221. return 'hyqy-box' + VipIndex;
  222. } else {
  223. return 'hyqy-disabled-box' + VipIndex;
  224. }
  225. }else{
  226. // 游客
  227. return 'hyqy-disabled-box' + VipIndex;
  228. }
  229. }
  230. //获取会员权益按钮是否显示
  231. function getHyqyBtn(index){
  232. let VipIndex =index +1;
  233. if(cacheManager.get('auth')){
  234. let VipArr = cacheManager.get('auth').cardList;
  235. if (VipArr.includes(VipIndex)) {
  236. return false;
  237. } else {
  238. return true;
  239. }
  240. }else{
  241. // 游客
  242. return 'hyqy-disabled-box' + VipIndex;
  243. }
  244. }
  245. onLoad((options) => {
  246. if(!cacheManager.get('auth')){
  247. // 游客
  248. routerOpt = options;
  249. youkeFun();
  250. }else{
  251. // 非游客
  252. noYoukeFun();
  253. }
  254. })
  255. function checkWrong() {
  256. if(loginFlag.value){
  257. const AuthCode = getUserIdentity();
  258. if (AuthCode == 'Visitor') {
  259. youkeDialogRef.value.handleShow();
  260. return;
  261. }
  262. uni.redirectTo({
  263. url: '/pages/wrong/index'
  264. })
  265. }else{
  266. youkeDialogRef.value.handleShow();
  267. }
  268. }
  269. </script>