From a99c4840e265fe58f79702b2b876bb62b576cdb5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=B1=B3=E4=BA=9A=E6=B5=81=E5=B9=B4?= <354849262@qq.com> Date: Tue, 2 Mar 2021 10:46:50 +0800 Subject: [PATCH 01/14] =?UTF-8?q?=E7=AC=AC=E5=85=AB=E7=AB=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/components/index/InfoBar.vue | 2 +- .../{index => topbar}/TopBarItem.vue | 0 .../components/{index => topbar}/Topbar.vue | 22 -- .../VideoList.bak.vue} | 4 +- src/common/components/videoList/VideoList.vue | 237 ++++++++++++++++++ .../Videos.vue => videoList/Videos.bak.vue} | 0 src/common/components/videoList/Videos.vue | 72 ++++++ src/main.js | 8 +- src/router/index.js | 8 +- src/views/index/Index.vue | 37 +-- 10 files changed, 325 insertions(+), 65 deletions(-) rename src/common/components/{index => topbar}/TopBarItem.vue (100%) rename src/common/components/{index => topbar}/Topbar.vue (74%) rename src/common/components/{index/VideoList.vue => videoList/VideoList.bak.vue} (99%) create mode 100755 src/common/components/videoList/VideoList.vue rename src/common/components/{index/Videos.vue => videoList/Videos.bak.vue} (100%) create mode 100755 src/common/components/videoList/Videos.vue diff --git a/src/common/components/index/InfoBar.vue b/src/common/components/index/InfoBar.vue index e212195..fb79439 100755 --- a/src/common/components/index/InfoBar.vue +++ b/src/common/components/index/InfoBar.vue @@ -1,7 +1,7 @@ @@ -32,7 +82,7 @@ export default { }, data() { return { - showComment: false, + showComment: false, // 用于控制评论列表是否显示 swiperOptions: { direction: 'vertical', grabCursor: true, @@ -97,6 +147,10 @@ export default { this.$refs.videos[index].play(); this.$refs.videos[index - 1].stop(); }, + // 弹出评论列表或者关闭评论列表 + showComOrclose() { + this.showComment = !this.showComment; + }, }, }; @@ -104,18 +158,8 @@ export default { From 5d40096049129811550619900c46bdd01b689963 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=B1=B3=E4=BA=9A=E6=B5=81=E5=B9=B4?= <354849262@qq.com> Date: Sat, 6 Mar 2021 15:07:23 +0800 Subject: [PATCH 07/14] =?UTF-8?q?=E7=AC=AC=E5=8D=81=E7=AB=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/components/index/InfoBar.vue | 14 ++- src/common/components/index/RightBar.vue | 14 ++- src/common/components/videoList/VideoList.vue | 30 ++++- .../components/videoList/Videos.bak.vue | 103 ------------------ 4 files changed, 50 insertions(+), 111 deletions(-) delete mode 100755 src/common/components/videoList/Videos.bak.vue diff --git a/src/common/components/index/InfoBar.vue b/src/common/components/index/InfoBar.vue index fb79439..3a3024c 100755 --- a/src/common/components/index/InfoBar.vue +++ b/src/common/components/index/InfoBar.vue @@ -1,11 +1,11 @@ diff --git a/src/common/styles/common.less b/src/common/styles/common.less new file mode 100644 index 0000000..830fcb9 --- /dev/null +++ b/src/common/styles/common.less @@ -0,0 +1,8 @@ + + .up-enter-active, .up-leave-active { + transition: all .5s; + } + .up-enter, .up-leave-to /* .fade-leave-active below version 2.1.8 */ { + opacity: 1; + transform: translateY(100%); + } diff --git a/src/router/index.js b/src/router/index.js index 10ac4fa..20f0425 100755 --- a/src/router/index.js +++ b/src/router/index.js @@ -1,105 +1,9 @@ import Vue from 'vue'; import VueRouter from 'vue-router'; -import Home from '../views/Home.vue'; +import { routes } from './routers.js'; Vue.use(VueRouter); -const routes = [ - { - path: '/', - redirect: '/index/recommend/', // app打开之后 默认跳转到首页的推荐标签栏 - }, - { - path: '/index', - redirect: '/index/recommend/', - }, - { - path: '/', - name: 'Home', - component: Home, - children: [ - { - path: '/index', - name: 'index', - component: () => import(/* webpackChunkName: "index" */ '../views/index/Index.vue'), - children: [ - { - path: 'follows', // 关注 - name: 'follows', - component: () => import(/* webpackChunkName: "Follows" */ '../views/follow/Follows.vue'), - children: [ - { - path: 'reVidelList', - name: 'reVidelList', - component: () => import(/* webpackChunkName: "reVidelList" */ '../common/components/videoList/VideoList.vue'), - }, - ], - }, - { - path: 'recommend', // 推荐 - name: 'recommend', - component: () => import(/* webpackChunkName: "Recommend" */ '../views/recommend/Recommend.vue'), - children: [ - { - path: 'reVidelList', - name: 'reVidelList', - component: () => import(/* webpackChunkName: "reVidelList" */ '../common/components/videoList/VideoList.vue'), - }, - ], - }, - ], - }, - { - path: '/friends', - name: 'friends', - component: () => import(/* webpackChunkName: "fllow" */ '../views/friends/Friends.vue'), - children: [ - { - path: '/friends', - name: 'friends', - component: () => import(/* webpackChunkName: "videoList" */ '../common/components/videoList/VideoList.vue'), - }, - ], - }, - { - path: '/msg', - name: 'msg', - component: () => import(/* webpackChunkName: "msg" */ '../views/message/Message.vue'), - }, - { - path: '/me', - name: 'me', - component: () => import(/* webpackChunkName: "me" */ '../views/me/Me.vue'), - }, - ], - }, - { - path: '/sign', - name: 'Sign', - component: () => import(/* webpackChunkName: "sign" */ '../views/Sign'), - }, - { - path: '/tpsign', - name: 'TPSign', - component: () => import(/* webpackChunkName: "sign" */ '../views/TPSign'), - }, - { - path: '/code', - name: 'Code', - component: () => import(/* webpackChunkName: "sign" */ '../views/Code'), - }, - { - path: '/edit', - name: 'edit', - component: () => import(/* webpackChunkName: "edit" */ '../views/me/Edit.vue'), - }, - { - path: '/publish', - name: 'publish', - component: () => import(/* webpackChunkName: "publish" */ '../views/publish/Publish.vue'), - }, -]; - const originalPush = VueRouter.prototype.push; VueRouter.prototype.push = function push(location, onResolve, onReject) { if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject); diff --git a/src/router/module/home.js b/src/router/module/home.js new file mode 100644 index 0000000..f195c77 --- /dev/null +++ b/src/router/module/home.js @@ -0,0 +1,65 @@ +/* eslint-disable import/prefer-default-export */ +import Home from 'views/Home.vue'; + +export const home = [ + { + path: '/', + name: 'Home', + component: Home, + children: [ + { + path: '/index', + name: 'index', + component: () => import(/* webpackChunkName: "index" */ 'views/index/Index.vue'), + children: [ + { + path: 'follows', // 关注 + name: 'follows', + component: () => import(/* webpackChunkName: "Follows" */ 'views/follow/Follows.vue'), + children: [ + { + path: 'reVidelList', + name: 'reVidelList', + component: () => import(/* webpackChunkName: "reVidelList" */ 'components/videoList/VideoList.vue'), + }, + ], + }, + { + path: 'recommend', // 推荐 + name: 'recommend', + component: () => import(/* webpackChunkName: "Recommend" */ 'views/recommend/Recommend.vue'), + children: [ + { + path: 'reVidelList', + name: 'reVidelList', + component: () => import(/* webpackChunkName: "reVidelList" */ 'components/videoList/VideoList.vue'), + }, + ], + }, + ], + }, + { + path: '/friends', + name: 'friends', + component: () => import(/* webpackChunkName: "fllow" */ 'views/friends/Friends.vue'), + children: [ + { + path: '/friends', + name: 'friends', + component: () => import(/* webpackChunkName: "videoList" */ 'components/videoList/VideoList.vue'), + }, + ], + }, + { + path: '/msg', + name: 'msg', + component: () => import(/* webpackChunkName: "msg" */ 'views/message/Message.vue'), + }, + { + path: '/me', + name: 'me', + component: () => import(/* webpackChunkName: "me" */ 'views/me/Me.vue'), + }, + ], + }, +]; diff --git a/src/router/module/publish.js b/src/router/module/publish.js new file mode 100644 index 0000000..3f95d9a --- /dev/null +++ b/src/router/module/publish.js @@ -0,0 +1,8 @@ +/* eslint-disable import/prefer-default-export */ +export const publish = [ + { + path: '/publish', + name: 'publish', + component: () => import(/* webpackChunkName: "publish" */ 'views/publish/Publish.vue'), + }, +]; diff --git a/src/router/module/sign.js b/src/router/module/sign.js new file mode 100644 index 0000000..c1dd62d --- /dev/null +++ b/src/router/module/sign.js @@ -0,0 +1,19 @@ +/* eslint-disable import/prefer-default-export */ +export const sign = [ + { + path: '/sign', + name: 'Sign', + component: () => import(/* webpackChunkName: "sign" */ 'views/Sign'), + }, + { + path: '/code', + name: 'Code', + component: () => import(/* webpackChunkName: "sign" */ 'views/Code'), + }, + { + path: '/tpsign', + name: 'TPSign', + component: () => import(/* webpackChunkName: "sign" */ 'views/TPSign'), + }, + +]; diff --git a/src/router/routers.js b/src/router/routers.js new file mode 100644 index 0000000..33061d1 --- /dev/null +++ b/src/router/routers.js @@ -0,0 +1,18 @@ +/* eslint-disable import/prefer-default-export */ +import { publish } from './module/publish'; +import { home } from './module/home'; +import { sign } from './module/sign'; + +export const routes = [ + { + path: '/', + redirect: '/index/recommend/', // app打开之后 默认跳转到首页的推荐标签栏 + }, + { + path: '/index', + redirect: '/index/recommend/', + }, + ...home, + ...sign, + ...publish, +]; diff --git a/src/views/Sign.vue b/src/views/Sign.vue index f5597a3..e1c336f 100755 --- a/src/views/Sign.vue +++ b/src/views/Sign.vue @@ -31,7 +31,7 @@ 其他方式登录 - +
    @@ -43,7 +43,7 @@
- + @@ -52,11 +52,11 @@ export default { name: 'Sign', data() { return { - telErea: '', - showMask: false, - disabled: true, - btnBg: false, - phone: ' ', + telErea: '', // 号码所属度 + showMask: false, // 是否显示其它登录方式 + disabled: true, // 获取短信验证码按钮是否可用 + btnBg: false, // 用于’获取短信验证码‘按钮动态样式处理 + phone: ' ', // v-modal input输入框 双向数据绑定 }; }, methods: { @@ -89,6 +89,7 @@ export default { From b4aa6489a56ebc3f423d2c60d709ebd80b1757b9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=B1=B3=E4=BA=9A=E6=B5=81=E5=B9=B4?= <354849262@qq.com> Date: Mon, 8 Mar 2021 16:54:22 +0800 Subject: [PATCH 11/14] =?UTF-8?q?=E7=AC=AC=E5=8D=81=E4=BA=94=E7=AB=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/router/module/sign.js | 6 +++--- src/store/index.js | 2 ++ src/store/modules/sign.js | 24 ++++++++++++++++++++++++ src/views/Code.vue | 23 +++++++++++++++++------ src/views/Sign.vue | 4 ++-- 5 files changed, 48 insertions(+), 11 deletions(-) create mode 100644 src/store/modules/sign.js diff --git a/src/router/module/sign.js b/src/router/module/sign.js index c1dd62d..0c4d662 100644 --- a/src/router/module/sign.js +++ b/src/router/module/sign.js @@ -1,17 +1,17 @@ /* eslint-disable import/prefer-default-export */ export const sign = [ { - path: '/sign', + path: '/sign', // 登录页面 name: 'Sign', component: () => import(/* webpackChunkName: "sign" */ 'views/Sign'), }, { - path: '/code', + path: '/codeSign', // 验证码登录 name: 'Code', component: () => import(/* webpackChunkName: "sign" */ 'views/Code'), }, { - path: '/tpsign', + path: '/phoneSign', // 手机号密码登录 name: 'TPSign', component: () => import(/* webpackChunkName: "sign" */ 'views/TPSign'), }, diff --git a/src/store/index.js b/src/store/index.js index 9ea7685..c015ba0 100755 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,5 +1,6 @@ import Vue from 'vue'; import Vuex from 'vuex'; +import sign from './modules/sign'; Vue.use(Vuex); @@ -11,5 +12,6 @@ export default new Vuex.Store({ actions: { }, modules: { + sign, }, }); diff --git a/src/store/modules/sign.js b/src/store/modules/sign.js new file mode 100644 index 0000000..df3c892 --- /dev/null +++ b/src/store/modules/sign.js @@ -0,0 +1,24 @@ +import router from '../../router'; + +const sign = { + namespaced: true, // 命名空间 + state: { + defaultCode: '094607', // 默认的验证码 + }, + mutations: { + + }, + actions: { + // 登录操作 + sign({ state, commit, rootState }, params) { + // 登录成功之后 session中缓存登录标识 + sessionStorage.setItem('isLogin', JSON.stringify(true)); + // 登录成功之后 跳转到webApp主页 + router.replace({ path: '/' }); + }, + }, + getters: { + + }, +}; +export default sign; diff --git a/src/views/Code.vue b/src/views/Code.vue index 7952980..28dcbf6 100755 --- a/src/views/Code.vue +++ b/src/views/Code.vue @@ -18,15 +18,18 @@
- +
diff --git a/src/views/Sign.vue b/src/views/Sign.vue index e1c336f..f848717 100755 --- a/src/views/Sign.vue +++ b/src/views/Sign.vue @@ -27,7 +27,7 @@
- 密码登录 + 密码登录 其他方式登录
@@ -61,7 +61,7 @@ export default { }, methods: { getCode() { - this.$router.push({ path: '/code' }); + this.$router.push({ path: '/codeSign' }); }, show() { this.showMask = true; From d45d176d0649ef4c6758aede29bb8e435acf8159 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=B1=B3=E4=BA=9A=E6=B5=81=E5=B9=B4?= <354849262@qq.com> Date: Tue, 9 Mar 2021 09:56:09 +0800 Subject: [PATCH 12/14] =?UTF-8?q?=E7=AC=AC=E5=8D=81=E5=85=AD=E7=AB=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/components/toast/Toast.vue | 58 +++++++++++++++++++++++++++ src/common/components/toast/toast.js | 34 ++++++++++++++++ src/main.js | 5 ++- 3 files changed, 95 insertions(+), 2 deletions(-) create mode 100644 src/common/components/toast/Toast.vue create mode 100644 src/common/components/toast/toast.js diff --git a/src/common/components/toast/Toast.vue b/src/common/components/toast/Toast.vue new file mode 100644 index 0000000..e8d6081 --- /dev/null +++ b/src/common/components/toast/Toast.vue @@ -0,0 +1,58 @@ + + + + + diff --git a/src/common/components/toast/toast.js b/src/common/components/toast/toast.js new file mode 100644 index 0000000..91be576 --- /dev/null +++ b/src/common/components/toast/toast.js @@ -0,0 +1,34 @@ +import Vue from 'vue'; +import toast from './Toast.vue'; + +const Toast = Vue.extend(toast); +let instance; +// 时间定时器 +let timer = null; +const toastMsg = (options) => { + if (!instance) { + // 创建实例 + instance = new Toast(); + // 挂载到页面上 + document.body.append(instance.$mount.$el); + } + // 默认时间 + instance.duration = 2000; + if (typeof options === 'string') { + instance.message = options; + } else if (typeof options === 'object') { + instance.type = options.type; + instance.message = options.message; + instance.duration = options.duration || 2000; + } else { + return; + } + instance.show = true; + timer = setTimeout(() => { + instance.show = false; + clearTimeout(timer); + timer = null; + }, instance.duration); +}; + +export default toastMsg; diff --git a/src/main.js b/src/main.js index ec88d46..656658a 100755 --- a/src/main.js +++ b/src/main.js @@ -8,13 +8,14 @@ import 'normalize.css/normalize.css'; // 全屏滚动组件 import VueSwiper from 'vue-awesome-swiper'; import 'swiper/css/swiper.css'; - +// 自定义Toast +import Toast from 'components/toast/toast.js' // vue 视频播放组件 import VueVideoPlayer from 'vue-video-player' import 'video.js/dist/video-js.css'; import 'vue-video-player/src/custom-theme.css' - +Vue.prototype.$toast = Toast Vue.use(VueSwiper) Vue.use(VueVideoPlayer) From e6f8ec422fe2f5b73bcf97c18399e8ecea4a74cc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=B1=B3=E4=BA=9A=E6=B5=81=E5=B9=B4?= <354849262@qq.com> Date: Tue, 9 Mar 2021 11:28:49 +0800 Subject: [PATCH 13/14] =?UTF-8?q?=E7=AC=AC=E5=8D=81=E5=85=AD=E7=AB=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/components/toast/Toast.vue | 74 +++++++++++++-------------- src/common/components/toast/toast.js | 24 +++++---- src/main.js | 4 +- src/views/TPSign.vue | 18 +++++-- 4 files changed, 67 insertions(+), 53 deletions(-) diff --git a/src/common/components/toast/Toast.vue b/src/common/components/toast/Toast.vue index e8d6081..9e563ba 100644 --- a/src/common/components/toast/Toast.vue +++ b/src/common/components/toast/Toast.vue @@ -1,58 +1,54 @@ - diff --git a/src/common/components/toast/toast.js b/src/common/components/toast/toast.js index 91be576..d017380 100644 --- a/src/common/components/toast/toast.js +++ b/src/common/components/toast/toast.js @@ -1,28 +1,34 @@ +// 实例化组件 import Vue from 'vue'; -import toast from './Toast.vue'; +/* eslint-disable import/no-unresolved */ +import toast from './toast.vue'; const Toast = Vue.extend(toast); + let instance; -// 时间定时器 + +// 时间，设置一个定时器 用于关闭toast提示框 let timer = null; +// 设置参数 const toastMsg = (options) => { - if (!instance) { - // 创建实例 + if (!instance) { // 判断是否实例化 + // 创建一个实例 instance = new Toast(); - // 挂载到页面上 - document.body.append(instance.$mount.$el); + // 挂载到页面 + document.body.append(instance.$mount().$el); } - // 默认时间 - instance.duration = 2000; + // 默认时间 + instance.duration = 1500; if (typeof options === 'string') { instance.message = options; } else if (typeof options === 'object') { instance.type = options.type; instance.message = options.message; - instance.duration = options.duration || 2000; + instance.duration = options.duration || 1500; } else { return; } + instance.show = true; timer = setTimeout(() => { instance.show = false; diff --git a/src/main.js b/src/main.js index 656658a..cb051d8 100755 --- a/src/main.js +++ b/src/main.js @@ -9,13 +9,15 @@ import 'normalize.css/normalize.css'; import VueSwiper from 'vue-awesome-swiper'; import 'swiper/css/swiper.css'; // 自定义Toast +//自定义弹框 import Toast from 'components/toast/toast.js' +//挂载(链式) +Vue.prototype.$toast = Toast // vue 视频播放组件 import VueVideoPlayer from 'vue-video-player' import 'video.js/dist/video-js.css'; import 'vue-video-player/src/custom-theme.css' -Vue.prototype.$toast = Toast Vue.use(VueSwiper) Vue.use(VueVideoPlayer) diff --git a/src/views/TPSign.vue b/src/views/TPSign.vue index 90fbb42..43c2e35 100755 --- a/src/views/TPSign.vue +++ b/src/views/TPSign.vue @@ -65,7 +65,7 @@ export default { this.phone = e.target.value; const regTel = /^[1][3456789][0-9]{9}$/; if (!regTel.test(this.phone)) { - console.log('不附和正则表达式'); + this.$toast('手机号格式不正确'); this.btnBg = false; this.disabled = true; } @@ -77,15 +77,25 @@ export default { // eslint-disable-next-line no-useless-escape const regTel = /^[1][3456789][0-9]{9}$/; if (this.phone === '') { - console.log('手机号不能为空'); + this.$toast({ + message: '手机号不能为空', + type: 'error', + duration: 20000, + }); this.disabled = true; this.btnBg = false; } else if (!regTel.test(this.phone)) { - console.log('请填写正确的手机号'); + this.$toast({ + message: '请填写正确的手机号', + type: 'error', + }); this.disabled = true; this.btnBg = false; } else if (this.password === '') { - console.log('密码不能为空'); + this.$toast({ + message: '密码不能为空', + type: 'error', + }); this.disabled = true; this.btnBg = false; } else { From 39ad79fefad5ac69d972d6016446a36b89176ae6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=B1=B3=E4=BA=9A=E6=B5=81=E5=B9=B4?= <354849262@qq.com> Date: Sat, 13 Mar 2021 19:06:08 +0800 Subject: [PATCH 14/14] =?UTF-8?q?=E7=AC=AC=E5=8D=81=E4=B8=83=E7=AB=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env.development | 2 +- README.md | 2 +- .../img/1.jpeg => public/assets/img/1.png | Bin .../img/2.jpg => public/assets/img/2.png | Bin .../img/3.jpg => public/assets/img/3.png | Bin public/static/me.json | 89 ++++++++++++++++++ src/main.js | 4 +- src/router/module/home.js | 5 + src/store/index.js | 2 + src/store/modules/me.js | 28 ++++++ src/views/me/Me.vue | 64 ++++++++----- ...\261\273webApp\345\244\247\347\272\262.md" | 4 +- yarn.lock | 12 +++ 13 files changed, 182 insertions(+), 30 deletions(-) rename src/assets/img/1.jpeg => public/assets/img/1.png (100%) rename src/assets/img/2.jpg => public/assets/img/2.png (100%) rename src/assets/img/3.jpg => public/assets/img/3.png (100%) create mode 100644 public/static/me.json create mode 100644 src/store/modules/me.js diff --git a/.env.development b/.env.development index 6320849..e643641 100755 --- a/.env.development +++ b/.env.development @@ -1,4 +1,4 @@ -VUE_APP_ERUDA=true +VUE_APP_ERUDA=false NODE_ENV="development"; BASE_URL='/' VUE_APP_BASE_API="/dev-api" diff --git a/README.md b/README.md index 184613c..a580498 100755 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# dou-yin +# 视频类WebApp ## Project setup ``` diff --git a/src/assets/img/1.jpeg b/public/assets/img/1.png similarity index 100% rename from src/assets/img/1.jpeg rename to public/assets/img/1.png diff --git a/src/assets/img/2.jpg b/public/assets/img/2.png similarity index 100% rename from src/assets/img/2.jpg rename to public/assets/img/2.png diff --git a/src/assets/img/3.jpg b/public/assets/img/3.png similarity index 100% rename from src/assets/img/3.jpg rename to public/assets/img/3.png diff --git a/public/static/me.json b/public/static/me.json new file mode 100644 index 0000000..6c34127 --- /dev/null +++ b/public/static/me.json @@ -0,0 +1,89 @@ +{ + "userInfo": { + "name": "前端逗逗飞", + "sn": "201509094607", + "sub": "带你走进前端开发", + "age": "23", + "desc": "公众号前端逗逗飞", + "tag": "标签", + "like": "2", + "fans": "20000" + + }, + "vlist": { + "works": [{ + "id": "001", + "url": "http://video.jishiyoo.com/3720932b9b474f51a4cf79f245325118/913d4790b8f046bfa1c9a966cd75099f-8ef4af9b34003bd0bc0261cda372521f-ld.mp4", + "icon": "/assets/img/1.png" + }, + { + "id": "002", + "url": "http://video.jishiyoo.com/3720932b9b474f51a4cf79f245325118/913d4790b8f046bfa1c9a966cd75099f-8ef4af9b34003bd0bc0261cda372521f-ld.mp4", + "icon": "/assets/img/1.png" + }, + { + "id": "002", + "url": "http://video.jishiyoo.com/3720932b9b474f51a4cf79f245325118/913d4790b8f046bfa1c9a966cd75099f-8ef4af9b34003bd0bc0261cda372521f-ld.mp4", + "icon": "/assets/img/1.png" + }, + { + "id": "003", + "url": "http://video.jishiyoo.com/3720932b9b474f51a4cf79f245325118/913d4790b8f046bfa1c9a966cd75099f-8ef4af9b34003bd0bc0261cda372521f-ld.mp4", + "icon": "/assets/img/1.png" + } + ], + "movs": [ + { + "id": "001", + "url": "http://video.jishiyoo.com/1eedc49bba7b4eaebe000e3721149807/d5ab221b92c74af8976bd3c1473bfbe2-4518fe288016ee98c8783733da0e2da4-ld.mp4", + "icon": "/assets/img/2.png" + }, + { + "id": "002", + "url": "http://video.jishiyoo.com/1eedc49bba7b4eaebe000e3721149807/d5ab221b92c74af8976bd3c1473bfbe2-4518fe288016ee98c8783733da0e2da4-ld.mp4", + "icon": "/assets/img/2.png" + }, + { + "id": "003", + "url": "http://video.jishiyoo.com/1eedc49bba7b4eaebe000e3721149807/d5ab221b92c74af8976bd3c1473bfbe2-4518fe288016ee98c8783733da0e2da4-ld.mp4", + "icon": "/assets/img/2.png" + }, { + "id": "004", + "url": "http://video.jishiyoo.com/1eedc49bba7b4eaebe000e3721149807/d5ab221b92c74af8976bd3c1473bfbe2-4518fe288016ee98c8783733da0e2da4-ld.mp4", + "icon": "/assets/img/2.png" + } + ], + "likes": [ + { + "id": "001", + "url": "http://video.jishiyoo.com/549ed372c9d14b029bfb0512ba879055/8e2dc540573d496cb0942273c4a4c78c-15844fe70971f715c01d57c0c6595f45-ld.mp4", + "icon": "/assets/img/3.png" + }, + { + "id": "002", + "url": "http://video.jishiyoo.com/549ed372c9d14b029bfb0512ba879055/8e2dc540573d496cb0942273c4a4c78c-15844fe70971f715c01d57c0c6595f45-ld.mp4", + "icon": "/assets/img/3.png" + }, + { + "id": "003", + "url": "http://video.jishiyoo.com/549ed372c9d14b029bfb0512ba879055/8e2dc540573d496cb0942273c4a4c78c-15844fe70971f715c01d57c0c6595f45-ld.mp4", + "icon": "/assets/img/3.png" + }, + { + "id": "004", + "url": "http://video.jishiyoo.com/549ed372c9d14b029bfb0512ba879055/8e2dc540573d496cb0942273c4a4c78c-15844fe70971f715c01d57c0c6595f45-ld.mp4", + "icon": "/assets/img/3.png" + }, + { + "id": "005", + "url": "http://video.jishiyoo.com/549ed372c9d14b029bfb0512ba879055/8e2dc540573d496cb0942273c4a4c78c-15844fe70971f715c01d57c0c6595f45-ld.mp4", + "icon": "/assets/img/3.png" + }, + { + "id": "006", + "url": "http://video.jishiyoo.com/549ed372c9d14b029bfb0512ba879055/8e2dc540573d496cb0942273c4a4c78c-15844fe70971f715c01d57c0c6595f45-ld.mp4", + "icon": "/assets/img/3.png" + } + ] + } + } diff --git a/src/main.js b/src/main.js index cb051d8..d64454d 100755 --- a/src/main.js +++ b/src/main.js @@ -25,8 +25,8 @@ Vue.config.productionTip = false; Vue.config.devtools = true store.subscribe((mutation, state) => { - console.log(mutation.type); - console.log(mutation.payload); + // console.log(mutation.type); + // console.log(mutation.payload); }) store.subscribeAction((action, state)=>{ diff --git a/src/router/module/home.js b/src/router/module/home.js index f195c77..cf86332 100644 --- a/src/router/module/home.js +++ b/src/router/module/home.js @@ -60,6 +60,11 @@ export const home = [ name: 'me', component: () => import(/* webpackChunkName: "me" */ 'views/me/Me.vue'), }, + { + path: '/toast', + name: 'toast', + component: () => import(/* webpackChunkName: "me" */ 'components/toast/toast.vue'), + }, ], }, ]; diff --git a/src/store/index.js b/src/store/index.js index c015ba0..1ccb240 100755 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,6 +1,7 @@ import Vue from 'vue'; import Vuex from 'vuex'; import sign from './modules/sign'; +import me from './modules/me'; Vue.use(Vuex); @@ -13,5 +14,6 @@ export default new Vuex.Store({ }, modules: { sign, + me, }, }); diff --git a/src/store/modules/me.js b/src/store/modules/me.js new file mode 100644 index 0000000..267f890 --- /dev/null +++ b/src/store/modules/me.js @@ -0,0 +1,28 @@ +import { get } from 'request/http'; +import router from '../../router'; + +const me = { + namespaced: true, + state: { + useInfo: '', // 我的页面的数据暂存 + vlist: '', // 我的页面的数据暂存 + }, + mutations: { + assignUseInfo(state, res) { + state.useInfo = res.userInfo; + state.vlist = res.vlist; + }, + }, + actions: { + fetchMe({ state, commit }, params) { + get('/static/me.json') // 发送网络请求 + .then((res) => { + commit('assignUseInfo', res); // 将请求到的数据赋值给vuex中的state + }) + .catch((err) => { + }); + }, + }, +}; + +export default me; diff --git a/src/views/me/Me.vue b/src/views/me/Me.vue index 9a94068..93e9c59 100755 --- a/src/views/me/Me.vue +++ b/src/views/me/Me.vue @@ -8,25 +8,25 @@
-
-

爱学习的孩子

- 抖音号：xxxxxx -

越努力越幸运

+

{{useInfo.name}}

+ 抖音号：{{useInfo.sn}} +

{{useInfo.sub}}

- 23岁 - 中国最富垃圾车 - +添加学校等标签 + {{useInfo.age}}岁 + {{useInfo.desc}} + +{{useInfo.tag}}
- 2获赞 + {{useInfo.like}}获赞 543关注 - 2.0W+粉丝 + {{useInfo.fans}}W+粉丝
好好学习，天天向上 @@ -40,24 +40,18 @@
-
- - - +
+
-
- - - +
+
-
- - - +
+
@@ -67,8 +61,10 @@ @@ -206,8 +212,18 @@ export default { } } .tab-wrap { - .tab-con img { - width: 30%; + background-color: #000; + .tab-con { + display: flex; + flex-direction: row; + justify-content: space-between; + flex-wrap: wrap; + .tab-img { + width: 33%; + &:nth-child(3n) { + border-right: 0; + } + } } } } diff --git "a/vue 2.5\345\256\236\347\216\260\350\247\206\351\242\221\347\261\273webApp\345\244\247\347\272\262.md" "b/vue 2.5\345\256\236\347\216\260\350\247\206\351\242\221\347\261\273webApp\345\244\247\347\272\262.md" index 5843455..0059973 100644 --- "a/vue 2.5\345\256\236\347\216\260\350\247\206\351\242\221\347\261\273webApp\345\244\247\347\272\262.md" +++ "b/vue 2.5\345\256\236\347\216\260\350\247\206\351\242\221\347\261\273webApp\345\244\247\347\272\262.md" @@ -34,9 +34,9 @@ ### 评论列表：完结 -### 注册登录：4 +### 注册登录：3月8日 -### 验证码页面：4 +### 验证码页面：3月8日 ### 登录鉴权：5 diff --git a/yarn.lock b/yarn.lock index 5c5cd97..9a7232a 100755 --- a/yarn.lock +++ b/yarn.lock @@ -1917,6 +1917,13 @@ aws4@^1.8.0: resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.10.1.tgz#e1e82e4f3e999e2cfd61b161280d16a111f86428" integrity sha512-zg7Hz2k5lI8kb7U32998pRRFin7zJlkfezGJjUc2heaD4Pw2wObakCDVzkKztTm/Ln7eiVvYsjqak0Ed4LkMDA== +axios@^0.21.1: + version "0.21.1" + resolved "https://registry.yarnpkg.com/axios/-/axios-0.21.1.tgz#22563481962f4d6bde9a76d516ef0e5d3c09b2b8" + integrity sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA== + dependencies: + follow-redirects "^1.10.0" + babel-eslint@^10.1.0: version "10.1.0" resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.1.0.tgz#6968e568a910b78fb3779cdd8b6ac2f479943232" @@ -4150,6 +4157,11 @@ follow-redirects@^1.0.0: resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.0.tgz#b42e8d93a2a7eea5ed88633676d6597bc8e384db" integrity sha512-aq6gF1BEKje4a9i9+5jimNFIpq4Q1WiwBToeRK5NvZBd/TRsmW8BsJfOEGkr76TbOyPVD3OVDN910EcUNtRYEA== +follow-redirects@^1.10.0: + version "1.13.3" + resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.3.tgz#e5598ad50174c1bc4e872301e82ac2cd97f90267" + integrity sha512-DUgl6+HDzB0iEptNQEXLx/KhTmDb8tZUHSeLqpnjpknR70H0nC2t9N73BK6fN4hOvJ84pKlIQVQ4k5FFlBedKA== + for-in@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"