Skip to content

R
recruiting-management
Commit 86f798b3 authored by 郝聪敏's avatar 郝聪敏
Browse files
Options

添加登录、home

parent d0979a9c
Hide whitespace changes
Inline Side-by-side
Showing with 275 additions and 122 deletions
.eslintrc.js
View file @ 86f798b3
...@@ -45,6 +45,22 @@ module.exports = { ...@@ -45,6 +45,22 @@ module.exports = {
optionalDependencies: ['test/unit/index.js'] optionalDependencies: ['test/unit/index.js']
}], }],
// allow debugger during development // allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off' 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'global-require': 'off',
// allow async-await
'generator-star-spacing': 'off',
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
// 防止iview的标签报错
"vue/no-parsing-error": [1, { "x-invalid-end-tag": false }],
"linebreak-style": 0,
'indent': [0, 2],
"comma-dangle": 0,
"semi": 0,
"max-len": 0,
"no-tabs": 0,
"no-mixed-spaces-and-tabs": 0,
"eol-last": 0,
"key-spacing": 0
} }
} }
build/webpack.base.conf.js
View file @ 86f798b3
...@@ -74,7 +74,11 @@ module.exports = { ...@@ -74,7 +74,11 @@ module.exports = {
limit: 10000, limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]') name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
} }
} },
{
test: /\.less$/,
loader: "style-loader!css-loader!less-loader"
},
] ]
}, },
node: { node: {
......
package.json
View file @ 86f798b3
...@@ -11,6 +11,9 @@ ...@@ -11,6 +11,9 @@
"build": "node build/build.js" "build": "node build/build.js"
}, },
"dependencies": { "dependencies": {
"iview": "^3.4.2",
"less": "^3.9.0",
"less-loader": "^5.0.0",
"vue": "^2.5.2", "vue": "^2.5.2",
"vue-router": "^3.0.1" "vue-router": "^3.0.1"
}, },
......
src/App.vue
View file @ 86f798b3
<template> <template>
<div id="app"> <div id="app">
<img src="./assets/logo.png">
<router-view/> <router-view/>
</div> </div>
</template> </template>
...@@ -13,11 +12,21 @@ export default { ...@@ -13,11 +12,21 @@ export default {
<style> <style>
#app { #app {
font-family: 'Avenir', Helvetica, Arial, sans-serif; position: absolute;
top: 0;
bottom: 0;
width: 100%;
min-width: 1341px;
min-height: 741px;
text-align: left;
font-family: 'PingFangSC-Regular', 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50; color: #2c3e50;
margin-top: 60px; -webkit-user-select: text !important; /*webkit浏览器*/
-khtml-user-select: text !important; /*早期浏览器*/
-moz-user-select: text !important; /*火狐*/
-ms-user-select: text !important; /*IE10*/
user-select: text !important;
} }
</style> </style>
src/components/HelloWorld.vue deleted 100644 → 0
View file @ d0979a9c
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<h2>Essential Links</h2>
<ul>
<li>
<a
href="https://vuejs.org"
target="_blank"
>
Core Docs
</a>
</li>
<li>
<a
href="https://forum.vuejs.org"
target="_blank"
>
Forum
</a>
</li>
<li>
<a
href="https://chat.vuejs.org"
target="_blank"
>
Community Chat
</a>
</li>
<li>
<a
href="https://twitter.com/vuejs"
target="_blank"
>
Twitter
</a>
</li>
<br>
<li>
<a
href="http://vuejs-templates.github.io/webpack/"
target="_blank"
>
Docs for This Template
</a>
</li>
</ul>
<h2>Ecosystem</h2>
<ul>
<li>
<a
href="http://router.vuejs.org/"
target="_blank"
>
vue-router
</a>
</li>
<li>
<a
href="http://vuex.vuejs.org/"
target="_blank"
>
vuex
</a>
</li>
<li>
<a
href="http://vue-loader.vuejs.org/"
target="_blank"
>
vue-loader
</a>
</li>
<li>
<a
href="https://github.com/vuejs/awesome-vue"
target="_blank"
>
awesome-vue
</a>
</li>
</ul>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data() {
return {
msg: 'Welcome to Your Vue.js App',
};
},
};
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1, h2 {
font-weight: normal;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
src/components/home.vue 0 → 100644
View file @ 86f798b3
<template>
<Row id="home" class="home">
<Col span="3" class="aside">
<img src="https://org.modao.cc/uploads4/images/3427/34274354/v2_prfn6r.png" alt="">
<Menu style="width: 100%;" ref='subMenu' :active-name="vSubName" :open-names="vName" @on-select="go">
<Submenu v-for="menu in childMenu" :name="menu.name" :key="menu.name">
<template slot="title">
<Icon type="ios-paper" />
{{menu.item}}
</template>
<MenuItem v-for="child in menu.child" :key="child.name" :name="child.name" @click="go(menu.route)">{{child.item}}</MenuItem>
</Submenu>
</Menu>
</Col>
<Col span="21" class="content">
<Row class="header">
<Col span="20">
<Menu mode="horizontal" :active-name="hName" @on-select="selectMenu">
<MenuItem v-for="menu in menuList" :name="menu.name" :key="menu.name">
{{menu.item}}
</MenuItem>
</Menu>
</Col>
<Col span="2" class="account">
13718672532
</Col>
<Col span="2" class="sign-out">
<a @click="loginOut" >退出</a>
</Col>
</Row>
<Row>
<router-view></router-view>
</Row>
</Col>
</Row>
</template>
<script>
export default{
data() {
return {
name: '1',
hName: '1',
vName: ['1'],
vSubName: '1-1',
menuList: [
{ name: '1', item: '简历管理', child: [{ name: '1', item: '全部简历', child: [{ name: '1-1', item:'全部简历', route: '/user/login' }] }] },
{ name: '2', item: '面试管理', child: [{ name: '1', item: '面试管理', child: [{ name: '1-1', item:'全部简历', route: '/home' }] }] }
],
childMenu: [{ name: '1', item: '全部简历', child: [{ name: '1-1', item:'全部简历', route: '/user/login' }] }]
}
},
methods: {
go(name) {
const menu = this.childMenu.filter(v => this.vName === v.name)
const route = menu.length === 1 ? menu[0].child.filter(v => name === v.name)[0].route : '/login'
this.$router.push(route)
},
loginOut() {
this.$router.push('/login')
},
selectMenu(name) {
const menus = this.menuList.filter(v => name === v.name)
this.childMenu = menus.length > 0 ? menus[0].child : [{ name: '1', item: '全部简历', child: [{ name: '1-1', item:'全部简历', route: '/user/login' }] }]
this.go(this.vSubName)
}
},
mounted() {}
}
</script>
<style lang="less" scoped>
.home{
height: 100%;
.aside{
height: 100%;
border-right: 1px solid #dcdee2;
box-shadow: #dcdee2 0 0 6px 1px;
img{
height: 49px;
width: 100%;
padding: 3% 28%;
}
.ivu-menu{
.ivu-menu-item{
padding-left: 49px !important;
}
}
}
.content{
.header{
display: flex;
align-items: center;height: 55px;
border-bottom: 1px solid #dcdee2;
line-height: 55px;
border-bottom: 1px solid rgb(220, 222, 226);
font-size: 14px;
.sign-out{
}
.ivu-menu{
height: 35px;
line-height: 35px;
margin: 0 10px;
.ivu-menu-item{
padding: 0 13px;
margin: 0 49px;
}
&:after{
height: 0;
}
}
}
}
}
</style>
src/components/login.vue 0 → 100644
View file @ 86f798b3
<template>
<Row class="login">
<Col span="16" class="left">
<img src="https://org.modao.cc/uploads4/images/3427/34276822/v2_prfobz.jpg" alt="">
</Col>
<Col span="8" class="right">
<Row class="head">
<img src="https://org.modao.cc/uploads4/images/3427/34274354/v2_prfn6r.png" alt="">
<h1>登录</h1>
</Row>
<Row class="login-content">
<span class="tip"><Icon type="md-alert" /> 请输入正确的手机号码</span>
<Input type="text" placeholder="请输入11为手机号">
<Icon color="#2d8cf0" type="ios-person-outline" slot="prepend"></Icon>
</Input>
<span class="tip"><Icon type="md-alert" /> 请输入正确的密码</span>
<Input type="password" placeholder="请输入密码">
<Icon color="#2d8cf0" type="ios-lock-outline" slot="prepend"></Icon>
</Input>
<Button type="primary" @click="login" >登录</Button>
<span class="tip"><Icon type="md-alert" /> 请输入正确的手机号码</span>
</Row>
<Row class="foot">
<span>量化派为您提供全程服务</span>
<span>量化派版权所有</span>
</Row>
</Col>
</Row>
</template>
<script>
export default {
methods: {
login() {
this.$router.push('/user/login')
}
}
}
</script>
<style lang="less" scoped>
.login{
height: 100%;
padding: 6% 22%;
background: #F5F5F5;
display: flex;
.left{
img{
height: 100%;
width: 100%;
}
}
.right{
padding: 80px 20px;
background: #fff;
.head{
img{
width: 63%;
}
}
.foot{
position: absolute;
bottom: 40px;
span{
display: block;
}
}
}
}
</style>
<style lang="less">
.login-content{
text-align: center;
.tip{
color: red;
}
button{
width: 100%;
margin-bottom: 10px;
}
.ivu-input-wrapper{
margin-bottom: 20px;
border-bottom: 1px solid #dcdee2;
.ivu-input-group-prepend{
border: 0;
background: #fff;
.ivu-icon{
font-size: 20px !important;
font-weight: 300 !important;
}
}
input{
border: 0;
&:focus{
outline: 0 !important;
box-shadow: none;
}
}
}
}
</style>
\ No newline at end of file
src/main.js
View file @ 86f798b3
// The Vue build version to load with the `import` command // The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias. // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'; import Vue from 'vue';
import iView from 'iview';
import 'iview/dist/styles/iview.css';
import App from './App'; import App from './App';
import router from './router'; import router from './router';
Vue.use(iView);
Vue.config.productionTip = false; Vue.config.productionTip = false;
/* eslint-disable no-new */ /* eslint-disable no-new */
......
src/router/index.js
View file @ 86f798b3
import Vue from 'vue'; import Vue from 'vue';
import Router from 'vue-router'; import Router from 'vue-router';
import HelloWorld from '@/components/HelloWorld';
const home = r => require.ensure([], () => r(require('@/components/home.vue')), 'home');
const login = r => require.ensure([], () => r(require('@/components/login.vue')), 'login');
Vue.use(Router); Vue.use(Router);
export default new Router({ export default new Router({
mode: 'history',
routes: [ routes: [
{ {
path: '/', path: '/',
name: 'HelloWorld', redirect: '/home',
component: HelloWorld, }, {
path: '/login',
name: 'login',
component: login,
}, {
path: '/home',
name: 'home',
component: home,
children: [
{
path: '/user/login',
name: 'userLogin',
component: login
}
]
}, },
], ],
}); });
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment