ops
/
jump-web
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

normalize

master
taylor 8 years ago
parent
933053b550
commit
cb3667c84a
7 changed files with 73 additions and 133 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      index.html
  2. 5
      package.json
  3. 52
      src/App.vue
  4. 13
      src/main.js
  5. 6
      src/mock/mock.js
  6. 20
      src/pages/Home.vue
  7. 108
      src/pages/nav1/Table.vue

2
index.html
View File

@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<title>vue element admin</title>
<title>vueadmin</title>
</head>
<body>

5
package.json
View File

@ -1,9 +1,9 @@
{
"name": "vueadmin",
"version": "1.0.0",
"version": "1.0.2",
"description": "vue admin project",
"author": "taylor <709161610@qq.com>",
"private": true,
"license": "MIT",
"scripts": {
"dev": "node build/dev-server.js",
"build": "node build/build.js"
@ -11,7 +11,6 @@
"dependencies": {
"axios": "^0.15.3",
"echarts": "^3.3.2",
"flex.css": "^1.1.6",
"nprogress": "^0.2.0",
"vue": "^2.1.10",
"vuex": "^2.0.0-rc.6"

52
src/App.vue
View File

@ -1,65 +1,19 @@
<template>
<div id="app">
<!--<transition name="bounce">-->
<router-view></router-view>
<!--</transition>-->
</div>
</template>
<script>
export default {
name: 'app',
components: {
}
}
</script>
<style>
@import "../node_modules/font-awesome/css/font-awesome.min.css";
@import "../node_modules/flex.css/dist/flex.css";
.bounce-enter-active {
animation: bounce-in .5s;
}
.bounce-leave-active {
animation: bounce-out .2s;
}
@keyframes bounce-in {
0% {
transform: scale(0);
}
50% {
transform: scale(1.05);
}
100% {
transform: scale(1);
}
}
@keyframes bounce-out {
0% {
transform: scale(1);
}
50% {
transform: scale(0.95);
}
100% {
transform: scale(0);
}
}
.fade-enter-active, .fade-leave-active {
transition: opacity .5s
}
.fade-enter, .fade-leave-active {
opacity: 0
}
body {
/*background-color: #324057;*/
margin: 0px;
@ -69,7 +23,7 @@
background: #1F2D3D;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif;
/*font-weight: 400;*/
font-size:14px;
font-size: 14px;
-webkit-font-smoothing: antialiased;
}
@ -89,7 +43,7 @@
vertical-align: baseline;
margin-right: 10px;
}
.toolbar .el-form-item {
margin-bottom: 10px;
}

13
src/main.js
View File

@ -9,8 +9,9 @@ import Vuex from 'vuex'
import NProgress from 'nprogress'//页面顶部进度条
import 'nprogress/nprogress.css'
import routes from './routes'
import Mock from './mock';
import Mock from './mock'
Mock.bootstrap();
import 'font-awesome/css/font-awesome.min.css'
Vue.use(ElementUI)
Vue.use(VueRouter)
@ -40,13 +41,11 @@ router.beforeEach((to, from, next) => {
//});
new Vue({
el: '#app',
template: '<App/>',
//el: '#app',
//template: '<App/>',
router,
store,
components: { App }
//render: h => h(Login)
//components: { App }
render: h => h(App)
}).$mount('#app')
//router.replace('/login')

6
src/mock/mock.js
View File

@ -39,7 +39,7 @@ export default {
} else {
resolve([200, { code: 500, msg: '账号或密码错误' }]);
}
}, 500);
}, 1000);
});
});
@ -55,7 +55,7 @@ export default {
resolve([200, {
users: mockUsers
}]);
}, 500);
}, 1000);
});
});
@ -74,7 +74,7 @@ export default {
total: total,
users: mockUsers
}]);
}, 500);
}, 1000);
});
});

20
src/pages/Home.vue
View File

@ -1,8 +1,8 @@
<template>
<el-row class="panel">
<el-col :span="24" class="panel-top">
<el-col :span="20" style="font-size:26px;">
<img src="../assets/logo4.png" class="logo"> <span>AD<i style="color:#20a0ff">MIN</i>
<el-col :span="20" style="font-size:22px;">
<img src="../assets/logo4.png" class="logo"> <span>VUE<i style="color:#20a0ff">ADMIN</i>
</span>
</el-col>
<el-col :span="4" class="rightbar">
@ -44,9 +44,9 @@
</el-breadcrumb>
</el-col>
<el-col :span="24" style="background-color:#fff;box-sizing: border-box;">
<!--<transition name="fade">-->
<router-view></router-view>
<!--</transition>-->
<transition>
<router-view></router-view>
</transition>
</el-col>
</div>
</section>
@ -113,16 +113,6 @@
</script>
<style scoped>
.fade-enter-active,
.fade-leave-active {
transition: opacity .5s
}
.fade-enter,
.fade-leave-active {
opacity: 0
}
.panel {
position: absolute;
top: 0px;

108
src/pages/nav1/Table.vue
View File

@ -18,65 +18,65 @@
<!--列表-->
<template>
<el-table :data="users" highlight-current-row v-loading="listLoading" style="width: 100%;">
<el-table-column type="index" width="60">
</el-table-column>
<el-table-column prop="name" label="姓名" width="120" sortable>
</el-table-column>
<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable>
</el-table-column>
<el-table-column prop="age" label="年龄" width="100" sortable>
</el-table-column>
<el-table-column prop="birth" label="生日" width="120" sortable>
</el-table-column>
<el-table-column prop="addr" label="地址" min-width="180" sortable>
</el-table-column>
<el-table-column inline-template :context="_self" label="操作" width="150">
<span>
<el-table-column type="index" width="60">
</el-table-column>
<el-table-column prop="name" label="姓名" width="120" sortable>
</el-table-column>
<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable>
</el-table-column>
<el-table-column prop="age" label="年龄" width="100" sortable>
</el-table-column>
<el-table-column prop="birth" label="生日" width="120" sortable>
</el-table-column>
<el-table-column prop="addr" label="地址" min-width="180" sortable>
</el-table-column>
<el-table-column inline-template :context="_self" label="操作" width="150">
<span>
<el-button size="small" @click="handleEdit(row)">编辑</el-button>
<el-button type="danger" size="small" @click="handleDel(row)">删除</el-button>
</span>
</el-table-column>
</el-table>
</template>
</el-table-column>
</el-table>
</template>
<!--分页-->
<el-col :span="24" class="toolbar" style="padding-bottom:10px;">
<el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="20" :total="total" style="float:right;">
</el-pagination>
</el-col>
<!--分页-->
<el-col :span="24" class="toolbar" style="padding-bottom:10px;">
<el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="20" :total="total" style="float:right;">
</el-pagination>
</el-col>
<!--编辑界面-->
<el-dialog :title="editFormTtile" v-model="editFormVisible" :close-on-click-modal="false">
<el-form :model="editForm" label-width="80px" :rules="editFormRules" ref="editForm">
<el-form-item label="姓名" prop="name">
<el-input v-model="editForm.name" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="性别">
<!--<el-select v-model="editForm.sex" placeholder="请选择性别">
<!--编辑界面-->
<el-dialog :title="editFormTtile" v-model="editFormVisible" :close-on-click-modal="false">
<el-form :model="editForm" label-width="80px" :rules="editFormRules" ref="editForm">
<el-form-item label="姓名" prop="name">
<el-input v-model="editForm.name" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="性别">
<!--<el-select v-model="editForm.sex" placeholder="请选择性别">
<el-option label="男" :value="1"></el-option>
<el-option label="女" :value="0"></el-option>
</el-select>-->
<el-radio-group v-model="editForm.sex">
<el-radio class="radio" :label="1">男</el-radio>
<el-radio class="radio" :label="0">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="年龄">
<el-input-number v-model="editForm.age" :min="0" :max="200"></el-input-number>
</el-form-item>
<el-form-item label="生日">
<el-date-picker type="date" placeholder="选择日期" v-model="editForm.birth"></el-date-picker>
</el-form-item>
<el-form-item label="地址">
<el-input type="textarea" v-model="editForm.addr"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click.native="editFormVisible = false">取 消</el-button>
<el-button type="primary" @click.native="editSubmit" :loading="editLoading">{{btnEditText}}</el-button>
</div>
</el-dialog>
</section>
<el-radio-group v-model="editForm.sex">
<el-radio class="radio" :label="1">男</el-radio>
<el-radio class="radio" :label="0">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="年龄">
<el-input-number v-model="editForm.age" :min="0" :max="200"></el-input-number>
</el-form-item>
<el-form-item label="生日">
<el-date-picker type="date" placeholder="选择日期" v-model="editForm.birth"></el-date-picker>
</el-form-item>
<el-form-item label="地址">
<el-input type="textarea" v-model="editForm.addr"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click.native="editFormVisible = false">取消</el-button>
<el-button type="primary" @click.native="editSubmit" :loading="editLoading">提交</el-button>
</div>
</el-dialog>
</section>
</template>
<script>
@ -106,7 +106,6 @@
addr: ''
},
editLoading: false,
btnEditText: '提 交',
editFormRules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' }
@ -185,7 +184,6 @@
_this.$confirm('确认提交吗？', '提示', {}).then(() => {
_this.editLoading = true;
NProgress.start();
_this.btnEditText = '提交中';
if (_this.editForm.id == 0) {
//新增
@ -199,7 +197,6 @@
addUser(para).then((res) => {
_this.editLoading = false;
NProgress.done();
_this.btnEditText = '提 交';
_this.$notify({
title: '成功',
message: '提交成功',
@ -221,7 +218,6 @@
editUser(para).then((res) => {
_this.editLoading = false;
NProgress.done();
_this.btnEditText = '提 交';
_this.$notify({
title: '成功',
message: '提交成功',
@ -258,7 +254,9 @@
this.getUsers();
}
}
</script>
<style scoped>
</style>
Write Preview
Loading…
Cancel
Save