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 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 87 </div>
15 88 </template>
16 89  
17 90 <script>
18 91 export default {
19   -
20 92 data() {
21 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 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 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 +
... ...