一個Vue+Canvas的酷炫後臺管理

又一個Vue+Cnavas酷炫的後臺管理，依然先後端分離（用PC打開，還沒適配移動端）。

項目地址： https://github.com/hzzly/canv...
demo地址： http://hjingren.cn/curriculum...
帳號：hzzly 密碼：123456
歡迎你們的star啦~

技術棧

前臺:

1. vue-cli

2. vue

3. vue-router

4. webpak

5. canvas

6. ajax

後臺:

1. wamp

2. PHP(ThinkPHP)

3. mysql

功能說明

• 登陸

  • 用戶登陸

  • 管理員登陸

• 註冊

  • 用戶註冊

• Canvas

  • 流星滑過

  • 星星閃閃

  • 後臺折線

  • 折線跟着鼠標滑動

• Vue

  • 彈出框組件

  • 路由切換動畫

  • 經過Ajax調用後臺接口

• 留言板(時間軸)

• 添加房屋信息

• 出租 求租

• 出售 求購

• 我的信息修改

• 密碼修改

• ......

1.登陸註冊模塊，流星與星星爲canvas，登陸註冊切換動畫爲vue transition

<!--more-->

2.後臺管理頁面，背景爲canvas(會動的折線+跟着鼠標滑動) 功能模塊切換爲vue transition

3.留言板(時間軸特效)

目錄結構

|——canvas-vue/
|   |——build/
|   |——confg/
|   |——node_modules/
|   |——src/
|   |   |——assets/                 //靜態文件
|   |   |——components/             //頁面組件
|   |   |   |——Menu.vue            //登陸註冊加載頁面
|   |   |   |——Home.vue            //後臺首頁
|   |   |   |——Login.vue           //登陸頁面
|   |   |   |——Regist.vue          //註冊頁面
|   |   |   |——Navbar.vue          //個人發佈
|   |   |   |——Messageboard.vue    //留言板頁面
|   |   |   |——...                 //等等
|   |   |——router/                 
|   |   |   |——index.js            //頁面路由
|   |   |——App.vue                 //父組件
|   |   |——main.js                 //入口文件
|   |——static/                     
|   |——.babelrc
|   |——.editorconfig
|   |——.gitgnore
|   |——index.html
|   |——package.json
|   |——README.md

總結

這個項目尚未完成，後期將不按期更新，敬請期待。。

若是以爲還行，歡迎star
項目地址： https://github.com/hzzly/canv...
項目後臺(PHP)地址： https://github.com/hzzly/canv...

個人博客地址：https://hzzly.github.io/

好了，溜了溜了。。。