index.vue
4.61 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
<template>
<div>
<div class="serch-wrap">
<el-row :gutter="20">
<el-form ref="form" :model="form" label-width="60px" label-position="left">
<el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
<el-form-item label="问题类型">
<el-select v-model="form.region" placeholder="请选择问题类型">
<el-option label="问题类型1" value="1"/>
<el-option label="问题类型2" value="2"/>
</el-select>
</el-form-item>
</el-col>
<el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
<el-form-item label="状态">
<el-select v-model="form.region" placeholder="请选择状态">
<el-option label="状态1" value="11"/>
<el-option label="状态2" value="22"/>
</el-select>
</el-form-item>
</el-col>
<el-col :xs="16" :sm="6" :md="3" :lg="3" :xl="1">
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-col>
</el-form>
</el-row>
</div>
<el-card shadow="always" class="card-second-top">
<div slot="header" class="clearfix" style="line-height: 32px;">
<span>详细记录</span>
<el-button type="primary" size="small" style="float: right" @click="dialogFormVisible = true">评价</el-button>
</div>
<el-table
:data="orderData"
style="width: 100%;"
:show-overflow-tooltip="true">
<el-table-column
prop="parkName"
label="问题类型"
:show-overflow-tooltip="true">
</el-table-column>
<el-table-column
prop="license"
label="问题内容"
:show-overflow-tooltip="true">
</el-table-column>
<el-table-column
prop="inTime"
label="提交时间"
:show-overflow-tooltip="true">
</el-table-column>
<el-table-column
prop="status"
label="状态">
</el-table-column>
</el-table>
<el-pagination
:page-size="10"
:pager-count="11"
layout="prev, pager, next"
:total="total">
</el-pagination>
</el-card>
<el-dialog title="提交问题" :visible.sync="dialogFormVisible">
<el-form :model="problemform">
<el-form-item label="">
<el-radio-group v-model="problemform.resource">
<el-radio label="APP问题"></el-radio>
<el-radio label="支付问题"></el-radio>
<el-radio label="停车场问题"></el-radio>
<el-radio label="服务投诉"></el-radio>
<el-radio label="改进建议"></el-radio>
<el-radio label="其他问题"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="问题内容">
<el-input type="textarea" v-model="problemform.desc"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="dialogFormVisible = false">提交</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
},
problemform: {
desc: ''
},
dialogFormVisible: false,
total: 55,
currentPage: 1,
pageSize: 10,
orderData: [
{
parkName: 'APP问题',
license: '任你停APP闪退',
inTime: '2019/03/07',
status: '已受理'
},
{
parkName: '支付问题',
license: '建议开通银联支付',
inTime: '2019/06/02',
status: '已受理'
},
{
parkName: '改进建议',
license: '建议减免电动车停车费',
inTime: '2019/06/02',
status: '未受理'
},
]
}
},
methods: {
onSubmit() {
this.$message('提交!')
},
problemonSubmit() {
this.$message('提交成功!')
},
onCancel() {
this.$message({
message: 'cancel!',
type: 'warning'
})
},
}
}
</script>
<style lang="scss">
.serch-wrap{
background-color: #FFF;
padding: 15px;
}
.card-second-top{
margin-top: 15px;
}
.el-card__header{
padding: 10px 20px;
}
</style>