<template> 
 | 
  <TableLayout :permissions="['business:bikerepair:query']"> 
 | 
    <!-- 搜索表单 --> 
 | 
    <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline> 
 | 
      <el-form-item label="用户" prop="openid"> 
 | 
        <el-input v-model="searchForm.openid" placeholder="请输入" @keypress.enter.native="search"></el-input> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="车辆编码" prop="bikeCode"> 
 | 
        <el-input v-model="searchForm.bikeCode" placeholder="请输入车辆编号" @keypress.enter.native="search"></el-input> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="状态" prop="status"> 
 | 
        <el-select v-model="searchForm.status" placeholder="请选择"> 
 | 
          <el-option 
 | 
            label="待处理" 
 | 
            :value="0"> 
 | 
          </el-option> 
 | 
          <el-option 
 | 
            label="已处理" 
 | 
            :value="1"> 
 | 
          </el-option> 
 | 
        </el-select> 
 | 
        <!-- <el-input v-model="searchForm.status" placeholder="请输入状态 0待处理 1已处理 2其他" @keypress.enter.native="search"></el-input> --> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="创建时间" prop="createDate"> 
 | 
        <!-- <el-date-picker v-model="searchForm.editDate" value-format="yyyy-MM-dd" placeholder="请输入编辑时间" @change="search"/> --> 
 | 
        <el-date-picker 
 | 
          v-model="value1" 
 | 
          type="daterange" 
 | 
          @change="selectDate" 
 | 
          format="yyyy-MM-dd" 
 | 
          value-format="yyyy-MM-dd HH:mm:ss" 
 | 
          range-separator="至" 
 | 
          start-placeholder="开始日期" 
 | 
          end-placeholder="结束日期"> 
 | 
        </el-date-picker> 
 | 
      </el-form-item> 
 | 
       
 | 
      <section> 
 | 
        <el-button type="primary" @click="search">搜索</el-button> 
 | 
        <el-button @click="reset">重置</el-button> 
 | 
      </section> 
 | 
    </el-form> 
 | 
    <!-- 表格和分页 --> 
 | 
    <template v-slot:table-wrap> 
 | 
      <el-table 
 | 
        v-loading="isWorking.search" 
 | 
        :data="tableData.list" 
 | 
        stripe 
 | 
        border 
 | 
      > 
 | 
        <el-table-column prop="openid" label="用户" min-width="180px" align="center"></el-table-column> 
 | 
        <el-table-column prop="linkname" label="联系人" min-width="100px" align="center"> 
 | 
          <template slot-scope="{row}"> 
 | 
            {{ `${row.linkname} ${row.linkphone}`  }} 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <el-table-column prop="bikeCode" label="车辆编码" min-width="100px" align="center"></el-table-column> 
 | 
        <el-table-column prop="bikeTypeName" label="车类型" min-width="100px" align="center"></el-table-column> 
 | 
        <el-table-column prop="param" label="问题类型" min-width="100px" show-overflow-tooltip align="center"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <div class="long-title-style">{{ row.param }}</div> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <!-- <el-table-column prop="param" label="车辆问题" min-width="100px"></el-table-column> --> 
 | 
        <el-table-column prop="content" label="问题说明" min-width="100px" show-overflow-tooltip align="center"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <el-button type="text" @click="showProblem(row)">点击查看</el-button> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <el-table-column prop="createDate" label="创建时间" min-width="100px" align="center"></el-table-column> 
 | 
        <el-table-column prop="status" label="状态" min-width="80px" align="center"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <div v-if="row.status==0" style="color: red;">待处理</div> 
 | 
            <div v-else-if="row.status==1">已处理</div> 
 | 
            <div v-else>其他</div> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <el-table-column label="操作" min-width="80px" fixed="right" align="center"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <el-button v-if="row.status==0" type="text" @click="dealAction(row)">处理</el-button> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
      </el-table> 
 | 
      <pagination 
 | 
        @size-change="handleSizeChange" 
 | 
        @current-change="handlePageChange" 
 | 
        :pagination="tableData.pagination" 
 | 
      > 
 | 
      </pagination> 
 | 
    </template> 
 | 
    <OperaRepairDealWindow ref="operaRepairDealWindow" @success="handlePageChange"/> 
 | 
    <RepairDetailWindow ref="repairDetailWindow"/> 
 | 
  </TableLayout> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import BaseTable from '@/components/base/BaseTable' 
 | 
import TableLayout from '@/layouts/TableLayout' 
 | 
import Pagination from '@/components/common/Pagination' 
 | 
import OperaRepairDealWindow from '@/components/business/OperaRepairDealWindow' 
 | 
import RepairDetailWindow from '@/components/business/RepairDetailWindow' 
 | 
import { formatDateTime } from '@/utils/util' 
 | 
import { getFileList } from '@/api/business/bikeRepair' 
 | 
export default { 
 | 
  name: 'BikeRepair', 
 | 
  extends: BaseTable, 
 | 
  components: { TableLayout, Pagination, OperaRepairDealWindow, RepairDetailWindow }, 
 | 
  data () { 
 | 
    return { 
 | 
      value1: [new Date(), new Date()], 
 | 
      // 搜索 
 | 
      searchForm: { 
 | 
        id: '', 
 | 
        createDate: '', 
 | 
        openid: '', 
 | 
        editDate: '', 
 | 
        editor: '', 
 | 
        isdeleted: '', 
 | 
        binkeId: '', 
 | 
        longitude: '', 
 | 
        latitude: '', 
 | 
        addr: '', 
 | 
        paramId: '', 
 | 
        param: '', 
 | 
        status: '', 
 | 
        info: '', 
 | 
        linkname: '', 
 | 
        linkphone: '', 
 | 
        dealUser: '', 
 | 
        dealDate: '', 
 | 
        dealInfo: '', 
 | 
        startDate: '', 
 | 
        endDate: '', 
 | 
        content: '' 
 | 
      } 
 | 
    } 
 | 
  }, 
 | 
  created () { 
 | 
    this.config({ 
 | 
      module: '车辆问题上报信息表', 
 | 
      api: '/business/bikeRepair', 
 | 
      'field.id': 'id', 
 | 
      'field.main': 'id' 
 | 
    }) 
 | 
    this.searchForm.startDate = formatDateTime(new Date(), 'yyyy-MM-dd') + ' 00:00:00' 
 | 
    this.search() 
 | 
  }, 
 | 
  methods: { 
 | 
    reset() { 
 | 
      this.searchForm.startDate = '' 
 | 
      this.searchForm.endDate = '' 
 | 
      this.value1 = [] 
 | 
      this.$refs.searchForm.resetFields() 
 | 
      this.search() 
 | 
    }, 
 | 
    selectDate(v) { 
 | 
      this.searchForm.startDate = '' 
 | 
      this.searchForm.endDate = '' 
 | 
      if (v) { 
 | 
        this.searchForm.startDate = v[0] 
 | 
        this.searchForm.endDate = v[1] 
 | 
      } 
 | 
      this.search() 
 | 
    }, 
 | 
    dealAction(row) { 
 | 
      this.$refs.operaRepairDealWindow.open('处理', row) 
 | 
    }, 
 | 
    showProblem(row) { 
 | 
      getFileList(row.id) 
 | 
        .then(res => { 
 | 
          this.$refs.repairDetailWindow.open('问题说明',{ imgList: res.map(item => item.fileurlfull), ...row }) 
 | 
        }) 
 | 
        .catch(e => { 
 | 
          this.$tip.apiFailed(e) 
 | 
        }) 
 | 
       
 | 
    } 
 | 
  }, 
 | 
} 
 | 
</script> 
 |