Skip to content

Commit

Permalink
use action
Browse files Browse the repository at this point in the history
  • Loading branch information
@ximumukang
ximumukang committed Jul 20, 2017
1 parent 6703fa4 commit 7e5a978
Show file tree
Hide file tree
Showing 7 changed files with 346 additions and 276 deletions.
329 changes: 188 additions & 141 deletions .idea/workspace.xml
View file

Large diffs are not rendered by default.

16 changes: 16 additions & 0 deletions src/App.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@
}
button{
cursor: pointer;
padding: .25em 1em;
}
button:hover{
background: #ee7419;
Expand Down Expand Up @@ -159,6 +160,21 @@
box-shadow: 0 .05em .25em rgba(0,0,0,.5);
background-color: rgb(255, 255, 255);
}
a.btn {
display: inline-block;
color: black;
width: 90px;
height: 34px;
line-height: 34px;
border-radius: 5px;
border: 1px solid gainsboro;
background: white;
overflow: hidden;
}
a.btn:hover {
color: white;
background: #ee7419;
}
/*清除浮动*/
.clearfix:after {
content: '';
Expand Down
2 changes: 1 addition & 1 deletion src/components/Fill.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
</div>
<hr>
<div id="submit-fill">
<button @click="submitFill">提交问卷</button>
<a @click="submitFill" class="btn">提交问卷</a>
</div>
<Modal></Modal>
</div>
Expand Down
65 changes: 32 additions & 33 deletions src/components/Home.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,22 +7,18 @@
<th>时间</th>
<th>状态</th>
<th>操作
<button class="build-new">
<router-link to="/edit">新建问卷</router-link>
</button>
<router-link to="/edit" class="build-new btn">新建问卷</router-link>
</th>
</tr>
<tr v-for="(questionnaire,index) in savedQuestionnaire" class="tr">
<td>{{questionnaire.titleAndDate.title}}</td>
<td>{{ questionnaire.titleAndDate.date | empty }}</td>
<td class="saving">未发布</td>
<td>
<button>
<router-link to="/edit">
<span @click="editAgain(index)">编辑问卷</span>
</router-link>
</button>
<button @click="deleteSaved(index)">删除问卷</button>
<router-link to="/edit" class="btn">
<span @click="editAgain(index)">编辑问卷</span>
</router-link>
<a @click="deleteSaved(index)" class="btn">删除问卷</a>
</td>
</tr>
<tr v-for="(questionnaire,index) in submitQuestionnaire" class="tr">
Expand All @@ -31,15 +27,17 @@
<td v-if="new Date(questionnaire.titleAndDate.date)>new Date()" class="ing">发布中</td>
<td v-else class="been">已结束</td>
<td>
<button v-if="new Date(questionnaire.titleAndDate.date)>new Date()">
<router-link to="/fill"><span @click="fill(index)">填写问卷</span></router-link>
</button>
<button>
<router-link to="/view"><span @click="view(index)">查看数据</span></router-link>
</button>
<button @click="deleteSubmit(index)" v-if="new Date(questionnaire.titleAndDate.date)<new Date()">
<router-link to="/fill" v-if="new Date(questionnaire.titleAndDate.date)>new Date()" class="btn">
<span @click="fill(index)">填写问卷</span>
</router-link>
<router-link to="/view" class="btn">
<span @click="view(index)">查看数据</span>
</router-link>
<a @click="deleteSubmit(index)"
v-if="new Date(questionnaire.titleAndDate.date)<new Date()"
class="btn">
删除问卷
</button>
</a>
</td>
</tr>
</table>
Expand Down Expand Up @@ -79,7 +77,7 @@
}
},
updated: function () {
if(this.savedQuestionnaire.length > 0 || this.submitQuestionnaire.length > 0) {
if (this.savedQuestionnaire.length > 0 || this.submitQuestionnaire.length > 0) {
this.isShowTable = true
} else {
this.isShowTable = false
Expand Down Expand Up @@ -151,10 +149,18 @@

table th {
font-size: 20px;
height: 30px;
font-weight: bold;
padding: 1em;
}

th span {
display: inline-block;
width: 90px;
height: 34px;
border: 1px solid black;
}

th:hover {
background: rgb(254, 241, 232);
}
Expand All @@ -163,12 +169,6 @@
background: rgb(254, 241, 232);
}

button {
width: 6em;
padding: 3px;
margin-left: 1em;
}

td {
font-size: 18px;
text-align: center;
Expand All @@ -177,19 +177,18 @@
border-bottom: 1px solid grey;
}

a {
color: black;
th a {
display: inline-table;
}

a:hover {
color: white;
a span {
display: inline-block;
width: 100%;
height: 34px;
}

button a {
display: block;
width: 100%;
height: 100%;
padding: 3px;
a span:hover {
color: white;
}

.add-btn, .view-data, .build-new {
Expand Down
78 changes: 43 additions & 35 deletions src/components/Modal.vue
View file
Original file line number Diff line number Diff line change
@@ -1,46 +1,48 @@
<template>
<div class="modal" v-show="isOpenModal">
<div class="message-box__wrapper" @click.self="closeModal">
<div class="message-box">
<h2 class="message-box__title">提示</h2>
<p class="message-box__message">{{message}}</p>
<div class="message-box__btns">
<router-link to="/" v-if="isToIndex"><button @click="confirm" >确定</button></router-link>
<button @click="confirm" v-else>确定</button>
<button @click="cancelModal" v-show="hasCancel">取消</button>
</div>
</div>
<div class="modal" v-show="isOpenModal">
<div class="message-box__wrapper" @click.self="closeModal">
<div class="message-box">
<h2 class="message-box__title">提示</h2>
<p class="message-box__message">{{message}}</p>
<div class="message-box__btns">
<router-link to="/" v-if="isToIndex">
<button @click="confirm">确定</button>
</router-link>
<button @click="confirm" v-else>确定</button>
<button @click="cancelModal" v-show="hasCancel">取消</button>
</div>
<div id="modal"></div>
</div>
</div>
<div id="modal"></div>
</div>
</template>

<script type="text/ecmascript-6">
import { mapState} from 'vuex'
import { mapMutations } from 'vuex'
export default {
name : 'Modal' ,
data : function () {
return {
import {mapState,mapMutations,mapActions} from 'vuex'
}
} ,
computed : {
...mapState([
'isOpenModal',
'hasCancel',
'message',
'isToIndex'
])
} ,
methods : {
...mapMutations([
'cancelModal',
'confirm',
'closeModal'
])
}
export default {
name: 'Modal',
data: function () {
return {}
},
computed: {
...mapState([
'isOpenModal',
'hasCancel',
'message',
'isToIndex'
])
},
methods: {
...mapMutations([
'cancelModal',
'closeModal'
]),
...mapActions([
'confirm'
])
}
}
</script>

<style>
Expand All @@ -53,13 +55,15 @@
text-align: center;
z-index: 2;
}
.message-box__wrapper:after {
content: "";
display: inline-block;
height: 100%;
width: 0;
vertical-align: middle;
}
#modal {
position: fixed;
left: 0;
Expand All @@ -70,6 +74,7 @@
background: #000;
z-index: 1;
}
.message-box {
text-align: left;
display: inline-block;
Expand All @@ -82,17 +87,20 @@
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.message-box__title {
text-indent: 1em;
background-color: rgb(238, 238, 238);
line-height: 2em;
font-size: 20px;
font-weight: bold;
}
.message-box__message {
line-height: 120px;
text-align: center;
}
.message-box__btns {
text-align: center;
padding: 10px;
Expand Down
4 changes: 1 addition & 3 deletions src/components/View.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,7 @@
</div><!--question-list-->
<hr>
<div id="back-div">
<button>
<router-link to="/">返回</router-link>
</button>
<router-link to="/" class="btn">返回</router-link>
</div>
<Modal></Modal>
</div>
Expand Down
Loading

0 comments on commit 7e5a978

Please sign in to comment.