<template>
  <div class="panel panel-info auto">
    <div class="panel-heading auto" style="height: 35px">
      <h4 style="display:inline-block;margin-top: auto" title="参数:维修情况查询">置换通气情况</h4>
    </div>
    <table class="table table-striped table-bordered" v-if="pared==1">
      <thead>
      <tr>
        <th colspan="4" style="text-align: center;background-color: #8cbce2;">置换通气情况</th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td colspan="1" style="text-align: center;border: #E9E9E9 solid 1px;">上传时间:</td>
        <td colspan="3" style="text-align: center;border: #E9E9E9 solid 1px;">{{ model.f_date }}</td>
      </tr>
      <tr>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 17%">到达时间:</td>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 33%">{{ model.f_date_come }}</td>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 17%">离开时间:</td>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 33%">{{ model.f_date_leave }}</td>
      </tr>
      <tr>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 17%">维修结果:</td>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 33%">{{ model.f_result_status }}</td>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 17%">维修人:</td>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 33%">{{ model.f_order_man }}</td>
      </tr>
      <tr>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 17%">工单类型:</td>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 33%">{{ model.f_workorder_type }}</td>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 17%">工单状态:</td>
        <td style="text-align: center;border: #E9E9E9 solid 1px;width: 33%">{{ model.f_result_status }}</td>
      </tr>
      <tr>
        <td colspan="1" style="text-align: center;border: #E9E9E9 solid 1px;">工单备注:</td>
        <td colspan="3" style="text-align: center;border: #E9E9E9 solid 1px;">{{ model.f_remarks }}</td>
      </tr>
      </tbody>
    </table>
    <table class="table table-striped table-bordered" v-if="pared == 1">
      <thead>
      <tr>
        <th colspan="4" style="text-align: center;background-color: #8cbce2;">总体图片</th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td style="margin: auto;text-align: center">
          <div class="container" style="background: #FFFFFF;margin:0;width:100%;">
            <div class="img" v-for="img in model.imgs">
              <img-self :src="'rs/image/file/' + img.android_file" style="float: left" width="140"
                        height="150"></img-self>
            </div>
          </div>
        </td>
      </tr>
      </tbody>
    </table>
    <div class="auto info-content" v-if="pared == 0">
      <div class="row">
        <strong>暂无置换通气信息</strong>
      </div>
    </div>
  </div>
</template>
<script>
/**
 *用户信息
 *维修情况
 */

import {HttpResetClass} from 'vue-client'

export default {
  title: '置换通气情况',
  data () {
    return {
      model: {},
      pared: 0
    }
  },
  props: ['data'],
  ready () {
  },
  methods: {
    async getServiceRepair () {
      if (this.data && this.data.f_userinfo_id) {
        let http = new HttpResetClass()
        let res = await http.load('POST', 'rs/sql/singleTable_OrderBy', {
          data: {
            items: 'w.id',
            tablename: 't_serviceworkorder wo left join t_servicework w on wo.id = w.serviceid',
            condition: `wo.f_userinfo_id = '${this.data.f_userinfo_id}'`,
            orderitem: 'w.id desc'
          }
        }, {resolveMsg: null, rejectMsg: null})
        if (res.data.length > 0) {
          let http2 = new HttpResetClass()
          let result = await http2.load('POST', 'rs/path/serviceWork', {
            data: {
              id: res.data[0].id
            }
          }, {resolveMsg: null, rejectMsg: null})
          this.model = result.data[0]
          console.log('看看维修情况', result, this.model)
          if (this.model) {
            this.pared = 1
          } else {
            this.pared = 0
          }
        } else {
          this.pared = 0
        }
      } else {
        this.pared = 0
      }
    }
  },
  watch: {
    'data' () {
      console.log('维修情况', this.data)
      this.getServiceRepair()
    }
  }
}
</script>
<style scoped>
.img {
  border: 1px solid #9773ed;
  width: auto;
  height: auto;
  float: left;
  text-align: center;
  margin: 6px;
}

img {
  margin: 6px;
}


.container {
  margin: 10px auto;
  width: 80%;
  height: auto;
}

div::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}

div {
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
}
</style>
