BJ_web_developers / HSpark

Commit d3de4a93f0b8699ee754d12e28bcb62071643eae

Authored by Andy
1 parent f53f45e7

add 我的评价 前端页面 弹窗

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