Lab WIKI
This is a Vue.js webapp, developing with module bundler Webpack.
Getting start
-
Download node.js
-
Clone this repository
-
In the directory, run
npm install
to install dependencies.
-
Start the webpack-dev-server:
npm run dev
-
Download Vue.js Devtool chrome extension
-
Visit your
localhost:12345
Deploy
-
Clone this repository and duckingod/lab-wiki-backend
-
In the directory, run
npm install
to install dependencies.
-
Set environment variable WIKI_HOME
export WIKI_HOME=wiki
-
Build
npm run build
Application Starting Flow
After
npm run dev
-
Webpack finds
webpack.config.js
, in which designating the entry file/src/main.js
.entry: ['babel-polyfill', './src/main.js']
-
In
main.js
, a Vue instance is created, rendering the root component defined in/src/App.vue
.import App from 'App.vue' new Vue({ el: '#app', render: h => h(App), router, store })
-
In
App.vue
, the skeleton of the web view is defined, includingnavigator
,toolbar
andpage
.import page from 'page.vue' import navigator from 'components/navigator.vue' import toolbar from 'components/toolbar.vue'
Application Structure
src\
assets\ static files
components\ reusable vue components
pages\ page components
store\ vuex store
stylus\ main style
References
Features
Google Authentication
- Sign In
✔️ - Check Role
✔️
Contact List
- Display
✔️ - Search/Highlight
✔️ - Add, Update, Remove
✔️
GPU Usage
- Table
✔️ - Chart
✔️ - Multiple GPU in one machine
✔️
Workstations - Table
✔️
CPU/MEM Usage
- Table
✔️ - Chart
✔️
News
- Display
✔️ - Pagination
- Add, Update, Remove
✔️
Seminar
- Table
✔️ - Search, Highlight
✔️ - Admin Add, Update, Remove
✔️ - Owner Update
✔️ - Highlight Changed Rows
- Postpone, advance, exchange dates
- Google Drive Upload
✔️
Clean Our Lab
- Table
✔️ - Scheduling
✔️
Call for Papers
- Table
✔️ - Add: search from WikiCFP
✔️ - Remove
✔️ - Update: the same conference update to latest edition