Skip to content

M
meet
Commit 86b5205e authored by wangqinghua's avatar wangqinghua
Browse files
Options

init

parent 32cd90e3
Show whitespace changes
Inline Side-by-side
Showing with 103 additions and 107 deletions
src/App.vue
View file @ 86b5205e
<template> <template>
<el-container class="container"> <el-container class="container">
<el-header class="text-right">
<navbar></navbar>
</el-header>
<el-container>
<el-aside width="200px"> <el-aside width="200px">
<sidebar></sidebar> <sidebar></sidebar>
</el-aside> </el-aside>
<el-container> <div ref="mainContainer" class="main-container">
<el-header>
<navbar></navbar>
</el-header>
<div class="margin-0-20">
<router-view/> <router-view/>
</div> </div>
</el-container> </el-container>
...@@ -20,7 +20,10 @@ ...@@ -20,7 +20,10 @@
export default { export default {
components: { components: {
Navbar, Navbar,
Sidebar} Sidebar},
mounted(){
}
} }
</script> </script>
...@@ -32,6 +35,7 @@ ...@@ -32,6 +35,7 @@
text-align: center; text-align: center;
color: #2c3e50; color: #2c3e50;
} }
el-aside,
.container{ .container{
height: 100%; height: 100%;
} }
...@@ -45,5 +49,15 @@ ...@@ -45,5 +49,15 @@
} }
} }
} }
.el-header{
line-height: 60px;
background: #3d89cb;
color: #ffffff;
}
.main-container{
padding: 0 20px;
width: calc(100% - 240px);
background-color: #f8f8f8;
}
</style> </style>
src/components/HelloWorld.vue deleted 100755 → 0
View file @ 32cd90e3
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br>
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
</ul>
<h3>Essential Links</h3>
<ul>
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
</ul>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
props: {
msg: String
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
src/components/indexDialog.vue
View file @ 86b5205e
...@@ -5,9 +5,9 @@ ...@@ -5,9 +5,9 @@
<div> <div>
<el-row> <el-row>
<el-col :span="18"> <el-col :span="18">
<div class="border padding-10-10"> <div class="border padding-10-0">
<template v-for="(item,i) in list"> <template v-for="(item,i) in list">
<p @click="selectIndex(i)"> {{item.name}}</p> <p class="padding-5-10 pointer" :class="sIndex == i ? 'select':''" @click="selectIndex(i)"> {{item.name}}</p>
</template> </template>
</div> </div>
</el-col> </el-col>
...@@ -61,9 +61,15 @@ ...@@ -61,9 +61,15 @@
//置顶 //置顶
toTop(){ toTop(){
if (this.sIndex != 0) { if (this.sIndex != 0) {
this.swapArray(this.list, this.sIndex, this.sIndex - 1); const index = this.sIndex
// this.list.unshift( this.list.splice(this.sIndex,1)[0] )
const a = this.list.splice(index,1)[0]
this.list.unshift(a)
this.sIndex = 0
// this.swapArray(this.list, this.sIndex, 0);
} else { } else {
alert('已经处于置底，无法下移'); this.$message.warning('已经处于顶部，无法置顶');
} }
}, },
//上移 //上移
...@@ -71,7 +77,7 @@ ...@@ -71,7 +77,7 @@
if (this.sIndex != 0) { if (this.sIndex != 0) {
this.swapArray(this.list, this.sIndex, this.sIndex - 1); this.swapArray(this.list, this.sIndex, this.sIndex - 1);
} else { } else {
this.$message.warning("已经处于置底，无法下移") this.$message.warning("已经处于最顶部，无法上移")
} }
}, },
//下移 //下移
...@@ -79,7 +85,7 @@ ...@@ -79,7 +85,7 @@
if (this.sIndex + 1 != this.list.length) { if (this.sIndex + 1 != this.list.length) {
this.swapArray(this.list, this.sIndex ,this.sIndex + 1); this.swapArray(this.list, this.sIndex ,this.sIndex + 1);
} else { } else {
// alert('已经处于置顶，无法上移'); this.$message.warning('已经处于最底部，无法下移');
} }
}, },
/** /**
...@@ -88,6 +94,7 @@ ...@@ -88,6 +94,7 @@
* @param index2 需要被变更的对象序号 * @param index2 需要被变更的对象序号
*/ */
swapArray(arr,index1,index2){ swapArray(arr,index1,index2){
this.sIndex = index2
arr[index1] = arr.splice(index2,1,arr[index1])[0] arr[index1] = arr.splice(index2,1,arr[index1])[0]
return arr return arr
} }
...@@ -95,6 +102,10 @@ ...@@ -95,6 +102,10 @@
} }
</script> </script>
<style scoped> <style lang="scss">
.select{
background-color: rgb(30,144,255);
opacity: 0.7;
color: #ffffff;
}
</style> </style>
\ No newline at end of file
src/style/common.scss
View file @ 86b5205e
html, body { html, body {
width: 100%; width: 100%;
height: 100%; //height: 100vh;
font-weight: 400; font-weight: 400;
} }
html,body, div, span, header, footer, nav, section, aside, article, ul, dl, dt, dd, li, a,p, h1, h2, h3, h4, h5, h6, i, b, textarea, button, input, select, figure, figcaption { html,body, div, span, header, footer, nav, section, aside, article, ul, dl, dt, dd, li, a,p, h1, h2, h3, h4, h5, h6, i, b, textarea, button, input, select, figure, figcaption {
...@@ -26,6 +26,7 @@ $border-color:#dddddd; ...@@ -26,6 +26,7 @@ $border-color:#dddddd;
$color-333:#333333; $color-333:#333333;
$color-666:#666666; $color-666:#666666;
$color-999:#999999; $color-999:#999999;
$color-fff:#ffffff;
//字体常用颜色 //字体常用颜色
.main-color{color:$main-color;} .main-color{color:$main-color;}
...@@ -34,6 +35,7 @@ $color-999:#999999; ...@@ -34,6 +35,7 @@ $color-999:#999999;
.color-333{color:$color-333} .color-333{color:$color-333}
.color-666{color:$color-666} .color-666{color:$color-666}
.color-999{color:$color-999} .color-999{color:$color-999}
.color-fff{color: $color-fff;}
//行内元素位置 //行内元素位置
.text-center {text-align: center;} .text-center {text-align: center;}
...@@ -110,4 +112,7 @@ $color-999:#999999; ...@@ -110,4 +112,7 @@ $color-999:#999999;
//背景色 //背景色
.background-white{background-color: #fff;} .background-white{background-color: #fff;}
//鼠标手指
.pointer{cursor: pointer}
src/views/Home.vue
View file @ 86b5205e
...@@ -2,23 +2,19 @@ ...@@ -2,23 +2,19 @@
<div class="home"> <div class="home">
<button @click="logout">退出</button> <button @click="logout">退出</button>
<img alt="Vue logo" src="../assets/logo.png"> <img alt="Vue logo" src="../assets/logo.png">
<HelloWorld msg="Welcome to Your Vue.js App"/>
</div> </div>
</template> </template>
<script> <script>
// @ is an alias to /src // @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'
import * as types from '../store/types'; import * as types from '../store/types';
export default { export default {
name: 'home', name: 'home',
components: { components: {
HelloWorld
}, },
methods:{ methods:{
async logout(){ async logout(){
console.log("logout");
this.$store.commit(types.LOGOUT); this.$store.commit(types.LOGOUT);
this.$router.push({ this.$router.push({
path:'login', path:'login',
......
src/views/intention.vue
View file @ 86b5205e
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="intention"> <div class="intention">
<p class="margin-20-0">当前位置：部务会议程管理 - 部务会会议意向</p> <p class="margin-20-0">当前位置：部务会议程管理 - 部务会会议意向</p>
<el-row> <el-row>
<el-col :span="6"> <el-col :span="8">
<span>意向主题：</span> <span>意向主题：</span>
<el-input style="width: 180px;" size="small" <el-input style="width: 180px;" size="small"
placeholder="会议名称" placeholder="会议名称"
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
v-model="input2"> v-model="input2">
</el-input> </el-input>
</el-col> </el-col>
<el-col class="text-right" :span="10"> <el-col class="text-right" :span="8">
<el-button size="small" plain>查询</el-button> <el-button size="small" plain>查询</el-button>
<el-button size="small" plain>添加</el-button> <el-button size="small" plain>添加</el-button>
</el-col> </el-col>
......
src/views/meetList.vue
View file @ 86b5205e
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="meetList"> <div class="meetList">
<p class="margin-20-0">当前位置：部务会议程管理 - 部务会会议列表</p> <p class="margin-20-0">当前位置：部务会议程管理 - 部务会会议列表</p>
<el-row> <el-row>
<el-col :span="6"> <el-col :span="8">
<span>会议名称：</span> <span>会议名称：</span>
<el-input style="width: 180px;" size="small" <el-input style="width: 180px;" size="small"
placeholder="会议名称" placeholder="会议名称"
...@@ -12,11 +12,11 @@ ...@@ -12,11 +12,11 @@
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<span>会议日期：</span> <span>会议日期：</span>
<el-date-picker size="small" v-model="value1" type="date" placeholder="选择日期"> <el-date-picker size="small" v-model="input1" type="date" placeholder="选择日期">
</el-date-picker> </el-date-picker>
</el-col> </el-col>
<el-col class="text-right" :span="10"> <el-col class="text-right" :span="8">
<el-button size="small" plain> 查 询 </el-button> <el-button size="small" plain> 查 询 </el-button>
<el-button size="small" plain>新增会议</el-button> <el-button size="small" plain>新增会议</el-button>
</el-col> </el-col>
...@@ -26,8 +26,7 @@ ...@@ -26,8 +26,7 @@
<el-table-column <el-table-column
type="index" type="index"
label="序号" label="序号"
width="90" width="90">
:index="index">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="name" prop="name"
...@@ -61,7 +60,7 @@ ...@@ -61,7 +60,7 @@
<el-pagination <el-pagination
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="currentPage4" :current-page="currentPage"
:page-sizes="[100, 200, 300, 400]" :page-sizes="[100, 200, 300, 400]"
:page-size="100" :page-size="100"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
...@@ -78,6 +77,8 @@ ...@@ -78,6 +77,8 @@
name: "meet-list", name: "meet-list",
data(){ data(){
return { return {
currentPage:1,
input1:"",
tableData: [ tableData: [
{ {
date: '2016-05-02', date: '2016-05-02',
......
src/views/navbar.vue
View file @ 86b5205e
<template> <template>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :offset="12" :span="6"><div class="grid-content bg-purple"> <el-col class="text-center" :span="3">
部位会会议管理
</el-col>
<el-col :offset="15" :span="4"><div class="grid-content bg-purple">
欢迎您！系统管理员 欢迎您！系统管理员
</div></el-col> </div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"> <el-col :span="2"><div class="grid-content bg-purple">
退出系统 退出系统
</div></el-col> </div></el-col>
</el-row> </el-row>
...@@ -16,6 +18,6 @@ ...@@ -16,6 +18,6 @@
} }
</script> </script>
<style scoped> <style lang="scss">
</style> </style>
\ No newline at end of file
src/views/sidebar.vue
View file @ 86b5205e
<template> <template>
<el-menu> <div ref="sidebar" class="sidebar">
<el-submenu index="1"> <el-menu ref="elMenu">
<template slot="title"> <el-menu-item index="1">
<span slot="title">
<router-link to="/meetList"> <router-link to="/meetList">
部位会会议列表 部位会会议列表
</router-link> </router-link>
</template> </span>
</el-submenu> </el-menu-item>
<el-submenu index="2"> <el-menu-item index="2">
<template slot="title"> <span slot="title">
<router-link to="/intention">部位会会议意向</router-link> <router-link to="/intention">
</template> 部位会会议意向
</el-submenu> </router-link>
</span>
</el-menu-item>
<el-submenu index="3"> <el-submenu index="3">
<template slot="title"> <template slot="title">
代码管理 <span class="color-fff">代码管理</span>
</template> </template>
<el-menu-item-group> <el-menu-item-group>
<el-menu-item index="1-1"> <el-menu-item index="3-1">
<router-link to="/agenda">特殊会议</router-link> <router-link to="/agenda">特殊会议</router-link>
</el-menu-item> </el-menu-item>
<el-menu-item index="1-2"> <el-menu-item index="3-2">
<router-link to="/attend">列席信息</router-link> <router-link to="/attend">列席信息</router-link>
</el-menu-item> </el-menu-item>
</el-menu-item-group> </el-menu-item-group>
</el-submenu> </el-submenu>
</el-menu> </el-menu>
</div>
</template> </template>
<script> <script>
export default { export default {
name: "sidebar" name: "sidebar",
data(){
return {
pageHeight:"",
}
},
mounted(){
this.$refs.sidebar.style.minHeight = window.innerHeight +'px'
}
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.el-menu{ .sidebar {
height: 100%;
.el-menu {
height: 100%; height: 100%;
background-color: #3869a7; /*background-color: #2282d8;*/
background: #38619c;
border-right: none;
a {
color: #ffffff;
}
}
.el-menu-item:focus, .el-menu-item:hover,
.el-submenu__title:hover {
outline: 0;
background-color: #12457d;
}
} }
</style> </style>
\ No newline at end of file
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