页面初始化创建游客用户

src/api/account.js

@@ -43,3 +43,7 @@ export function bindVisitor(data) {
 export function getIsVip() {
   return httpRequest.get('/zy/user/is-vip')
 }
+// 创建游客用户
+export function createGuestUser() {
+  return httpRequest.get('/zy/user/create-guest-user')
+}

src/api/base_api.js

@@ -2,6 +2,7 @@ import axios from 'axios'
 import _ from 'lodash'
 import store from '../store'
 import router from '../router'
+
 export default class API {
   constructor(config) {
     /* 创建一个 自定义配置axios实例 */
@@ -15,9 +16,6 @@ export default class API {
       baseURL: config.apiBaseURL || '',
       /* 即将被发送的自定义请求头 */
       headers: {
-        // Accept: '*/*',
-        // cookie: 'VEdULTgxNy1nLW5ULWMwWjlESnNpMGVLaEw4M3VwZFN4SDhJLUZzMHo2aEVPcHJUWHoyTGNCbGhPZWpCR0o2Y1BFTnRBc1hKSHZNLXNlcnZlckBAQDE5Mi4xNjguMTAuMTQ1QEBATW96aWxsYS81LjAgKGlQaG9uZTsgQ1BVIGlQaG9uZSBPUyAxM18yXzMgbGlrZSBNYWMgT1MgWCkgQXBwbGVXZWJLaXQvNjA1LjEuMTUgKEtIVE1MLCBsaWtlIEdlY2tvKSBWZXJzaW9uLzEzLjAuMyBNb2JpbGUvMTVFMTQ4IFNhZmFyaS82MDQuMUBAQDY2NDU1NjUyNDc1ODUyNTU0MjQ=',
-        // 'Accept-Language': '',
         'Content-Type': 'application/x-www-form-urlencoded'
       }
     })
@@ -34,9 +32,11 @@ export default class API {
     const beforeSuccess = _config.beforeSuccess ? _config.beforeSuccess : this._reqSuccess
     /* 具体执行请求失败后业务逻辑前，先执行该方法 */
     const beforeFail = _config.beforeFail ? _config.beforeFail : this._reqFail
+    const guestUser = store.state.guestUser || {}
     const headers = {
-      tenant: 'transport'
-      // 'Content-Type': 'application/x-www-form-urlencoded'
+      tenant: 'transport',
+      userId: guestUser.user_id,
+      studentId: guestUser.student_id
     }
     _config.headers = _.assignIn(_config.headers, headers)
     /* 判别 传输方式 */
@@ -114,7 +114,7 @@ export default class API {
           }
         }
         if (status === 500) {
-          window.alert(res.response.message)
+          window.alert(data.message)
         }
       }
       err = new Error(JSON.stringify(res.response))

src/components/CourseItem2.vue

@@ -6,15 +6,23 @@
       <div class="course-item-content">
         <div class="course-item__title">{{ data.title }}</div>
         <div class="course-item__tools">
-          <div class="course-item__text course-item__text__course">含{{ data.course_num }}节课</div>
+          <div>
+            <div
+              class="course-item__text course-item__text__freevideo"
+            >{{ data.free_video_num }}个免费视频</div>
+          </div>
           <div class="course-item__text course-item__text__video">{{ data.video_num }}节视频课</div>
+          <div class="course-item__text course-item__text__course">含{{ data.course_num }}节课</div>
         </div>
       </div>
     </div>
     <div class="course-item-bottom" v-show="isOpen">
-      <div class="course-child" v-for="item in data.child" :key="item.id" @click="onClick(item)">
-        {{ item.course_name }}
-      </div>
+      <div
+        class="course-child"
+        v-for="item in data.child"
+        :key="item.id"
+        @click="onClick(item)"
+      >{{ item.course_name }}</div>
     </div>
   </div>
 </template>
@@ -65,7 +73,7 @@ export default {
 .course-item-pic {
   width: 3.15rem;
   height: 2rem;
-  margin-right: 10px;
+  margin-right: 0.15rem;
   overflow: hidden;
 }
 .course-item-content {
@@ -86,22 +94,31 @@ export default {
 .course-item__text {
   display: inline-block;
   height: 0.48rem;
-  margin-left: 0.15rem;
   padding: 0 0.2rem;
   font-size: 0.24rem;
   line-height: 0.48rem;
+  text-align: center;
+  box-sizing: border-box;
 }
-.course-item__text:first-child {
-  margin-left: 0;
+.course-item__text + .course-item__text {
+  margin-left: 0.1rem;
 }
+
 .course-item__text__course {
   color: #fff;
   background-color: #75b0ff;
 }
 .course-item__text__video {
+  min-width: 1.8rem;
   color: #fff;
   background-color: #5ad0b2;
 }
+.course-item__text__freevideo {
+  min-width: 1.8rem;
+  margin-bottom: 0.1rem;
+  color: #fff;
+  background-color: #d05a5a;
+}
 .course-child {
   font-size: 13px;
   color: #666;

src/components/beforeEnter/Before.js

@@ -5,6 +5,9 @@ export default class Before {
   }
 
   async update(to, from, next) {
+    // 创建游客用户
+    await store.dispatch('createGuestUser')
+
     if (to.meta.requiredLogin) {
       const isLogin = store.state.isLogin || (await store.dispatch('checkLogin'))
       if (isLogin) {

src/main.js

 import Vue from 'vue' // 引入vue框架
-import VueRouter from 'vue-router' // 使用 vue-router
 import router from './router' // router定义
-import store from '@/store'
+import store from './store'
 import VueI18n from 'vue-i18n' // 使用 国际化
 import createI18n from './assets/languages' // 国际化定义
-
 import App from './app.vue' // 初始化 vue页面
 import './style.scss' // 公共样式
 import './assets/rem/rem.js'
@@ -24,7 +22,6 @@ Vue.use(Vant)
 require('promise.prototype.finally').shim()
 /* 兼容处理 end */
 
-Vue.use(VueRouter)
 Vue.use(VueI18n)
 const i18n = createI18n()
 
@@ -57,6 +54,3 @@ window.G.$instance_vue = new Vue({
   i18n,
   render: h => h(App)
 }).$mount('#app')
-
-// 获取环境
-store.dispatch('getEnv')

src/pages/course/learn/components/courseChapter.vue

@@ -7,7 +7,10 @@
       </template>
       <ul>
         <li v-for="subItem in item.children" :key="subItem.id" @click="onClick(subItem)">
-          <div class="name">{{subItem.name}}</div>
+          <div class="name">
+            {{subItem.name}}
+            <template v-if="subItem.free">（免费）</template>
+          </div>
           <!-- <div class="progress">{{subItem.video_progress | progressText}}</div> -->
         </li>
       </ul>

src/pages/course/learn/item.vue

@@ -24,7 +24,6 @@
 </template>
 
 <script>
-import { random } from 'lodash'
 import CourseChapter from './components/courseChapter.vue'
 import CourseTag from '../tag/index.vue'
 import * as api from '@/api/course.js'
@@ -46,9 +45,6 @@ export default {
   computed: {
     courseId() {
       return this.$route.params.id
-    },
-    isVip() {
-      return this.$store.state.isVip
     }
   },
   methods: {
@@ -68,16 +64,7 @@ export default {
     }
   },
   beforeMount() {
-    // 检测是否是付费用户
-    this.$store.dispatch('checkIsVip').then(isVip => {
-      if (isVip) {
-        this.getCourse()
-      } else {
-        const routes = { 0: '/pay', 1: '/payPage' }
-        const path = routes[random(1)] || '/pay'
-        this.$router.replace(path)
-      }
-    })
+    this.getCourse()
   }
 }
 </script>

src/pages/my/alarm/components/update.vue

@@ -4,12 +4,12 @@
     <div class="alarm-form">
       <div class="alarm-form-time">
         <div class="alarm-form-time__lable">提醒时间</div>
-        <van-picker
+        <van-datetime-picker
           v-model="ruleForm.time"
-          :columns="timeColumns"
+          type="time"
+          :filter="filter"
           :item-height="30"
-          :default-index="defaultIndex"
-          @change="onChangeTime"
+          :show-toolbar="false"
         />
       </div>
       <div class="alarm-form-item">
@@ -35,12 +35,7 @@ export default {
   name: 'AlarmUpdate',
   props: {
     isUpdate: { type: Boolean, default: false },
-    data: {
-      type: Object,
-      default() {
-        return {}
-      }
-    }
+    data: { type: Object, default: () => ({}) }
   },
   data() {
     return {
@@ -50,7 +45,6 @@ export default {
         status: 1
       },
       weeks: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
-      defaultIndex: 13,
       submitLoading: false
     }
   },
@@ -62,7 +56,6 @@ export default {
           return
         }
         const weeks = data.week_json ? JSON.parse(data.week_json) : []
-        this.defaultIndex = this.timeColumns.findIndex(item => item === data.time)
         this.ruleForm = Object.assign({}, this.ruleForm, data, {
           week_json: weeks
         })
@@ -73,10 +66,6 @@ export default {
     title() {
       return this.isUpdate ? '修改提醒时间' : '新增提醒时间'
     },
-    // 时间选择项
-    timeColumns() {
-      return this.genTimeColumns()
-    },
     // 重复类型
     selectedResultType() {
       const weeks = this.ruleForm.week_json.sort()
@@ -155,22 +144,9 @@ export default {
     },
     filter(type, options) {
       if (type === 'minute') {
-        return options.filter(option => option % 30 === 0)
+        return options.filter(option => option % 5 === 0)
       }
       return options
-    },
-    // 生成提醒时间数据
-    genTimeColumns() {
-      const columns = []
-      for (let i = 0; i <= 23; i++) {
-        const temp = i < 10 ? `0${i}` : i
-        columns.push(`${temp}:00`)
-        columns.push(`${temp}:30`)
-      }
-      return columns
-    },
-    onChangeTime(picker, value, index) {
-      this.ruleForm.time = value
     }
   }
 }
@@ -193,6 +169,7 @@ export default {
 .alarm-form-time {
   position: relative;
   margin-bottom: 20px;
+  padding: 0 60px;
 }
 .alarm-form-time__lable {
   position: absolute;

src/pages/my/alarm/index.vue

@@ -11,7 +11,7 @@
     </template>
     <van-empty description="暂无内容" v-else />
     <div class="add-button">
-      <div class="inner" @click="popupVisible = true"></div>
+      <div class="inner" @click="onAdd"></div>
     </div>
     <!-- 添加/修改 -->
     <van-popup v-model="popupVisible" position="bottom" @closed="onClosed">
@@ -49,6 +49,7 @@ export default {
       popupVisible: false,
       isUpdate: false,
       activeItem: null,
+      hasFollow: false,
       followPopupVisible: false
     }
   },
@@ -56,7 +57,8 @@ export default {
     // 检查是否关注公众号
     checkFollowWechat() {
       api.checkFollowWechat().then(response => {
-        this.followPopupVisible = !response.flag
+        this.hasFollow = response.flag
+        this.followPopupVisible = !this.hasFollow
       })
     },
     // 获取提醒列表
@@ -85,6 +87,13 @@ export default {
     onClosed() {
       this.isUpdate = false
       this.activeItem = null
+    },
+    onAdd() {
+      if (this.hasFollow) {
+        this.popupVisible = true
+      } else {
+        this.followPopupVisible = true
+      }
     }
   },
   beforeMount() {

src/router/index.js

+import Vue from 'vue'
 import Router from 'vue-router'
 import routes from './routes'
 
+Vue.use(Router)
+
 export default new Router({
   routes,
   mode: 'history', // 还有一个 hash 默认

src/router/routes.js

@@ -79,22 +79,19 @@ export default [
   {
     path: '/course/learn/:id',
     name: 'courseLearnItem',
-    component: () => import('../pages/course/learn/item.vue'),
-    meta: { requiredLogin: true }
+    component: () => import('../pages/course/learn/item.vue')
   },
   // 课程学习详情
   {
     path: '/course/learn/:id/tag',
     name: 'courseLearnTag',
-    component: () => import('../pages/course/tag/index.vue'),
-    meta: { requiredLogin: true }
+    component: () => import('../pages/course/tag/index.vue')
   },
   // 课程知识点
   {
     path: '/course/learn/:courseId/tag/:chapterId',
     name: 'courseTag',
-    component: () => import('../pages/course/tag/list.vue'),
-    meta: { requiredLogin: true }
+    component: () => import('../pages/course/tag/list.vue')
   },
   // 课程知识点详情
   {
@@ -106,8 +103,7 @@ export default [
   {
     path: '/course/tag/:id',
     name: 'courseTagItem',
-    component: () => import('../pages/course/tag/item.vue'),
-    meta: { requiredLogin: true }
+    component: () => import('../pages/course/tag/item.vue')
   },
   // 登录
   {

src/store/index.js

@@ -2,15 +2,17 @@ import Vue from 'vue'
 import Vuex from 'vuex'
 import Cookies from 'js-cookie'
 
-import { getUser, logout, getIsVip } from '@/api/account'
+import { getUser, logout, getIsVip, createGuestUser } from '@/api/account'
 Vue.use(Vuex)
-export default new Vuex.Store({
+
+const store = new Vuex.Store({
   state: {
     user: {},
     token: '',
     isVip: false,
     isLogin: false,
-    isWeapp: /miniProgram/.test(navigator.userAgent)
+    isWeapp: /miniProgram/.test(navigator.userAgent),
+    guestUser: { user_id: '', student_id: '' }
   },
   mutations: {
     setToken(state, token) {
@@ -27,6 +29,10 @@ export default new Vuex.Store({
     },
     setIsVip(state, isVip) {
       state.isVip = isVip
+    },
+    setGuestUser(state, user) {
+      state.guestUser = user
+      window.localStorage.setItem('guestUser', JSON.stringify(user))
     }
   },
   actions: {
@@ -40,6 +46,15 @@ export default new Vuex.Store({
         commit('setUser', response)
       })
     },
+    // 退出登录
+    logout({ commit }) {
+      return logout().then(response => {
+        commit('setUser', {})
+        commit('setIsLogin', false)
+        return response
+      })
+    },
+    // 检测登录状态
     async checkLogin({ commit }) {
       const isLogin = await getUser()
         .then(response => {
@@ -55,22 +70,39 @@ export default new Vuex.Store({
       commit('setIsLogin', isLogin)
       return isLogin
     },
-    logout({ commit }) {
-      return logout().then(response => {
-        commit('setUser', {})
-        commit('setIsLogin', false)
-        return response
-      })
-    },
+    // 检测是否付费
     async checkIsVip({ commit, state }) {
-      if (state.isVip) {
-        return state.isVip
+      if (!state.isVip) {
+        await getIsVip().then(response => commit('setIsVip', response.is_vip))
       }
-      const isVip = await getIsVip()
-        .then(response => response.is_vip)
-        .catch(() => false)
-      commit('setIsVip', isVip)
-      return isVip
+      return state.isVip
+    },
+    // 创建游客用户
+    async createGuestUser({ commit, state }) {
+      const { user_id: userId, student_id: studentId } = state.guestUser
+      if (!userId || !studentId) {
+        await createGuestUser().then(response => commit('setGuestUser', response))
+      }
+      return state.guestUser
+    },
+    // 加载本地游客信息
+    loadGuestUser({ commit, state }) {
+      const localGuestUser = window.localStorage.getItem('guestUser')
+      let guestUser = { user_id: '', student_id: '' }
+      if (localGuestUser) {
+        try {
+          guestUser = JSON.parse(localGuestUser)
+        } catch (error) {
+          console.log(error)
+        }
+      }
+      commit('setGuestUser', guestUser)
     }
   }
 })
+
+export default store
+
+// 获取环境
+store.dispatch('getEnv')
+store.dispatch('loadGuestUser')