<template>
  <div class="flex-row">
    <!-- 点火记录 -->
    <div class="basic-main">
      <criteria-paged :model="model" v-ref:cp>
        <criteria partial='criteria' @condition-changed='$parent.searchCondition' v-ref:cri>
          <div class="form-horizontal select-overspread container-fluid auto" partial>
            <div class="row">
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>用户编号：</strong></label>
                <input type="text" class="input_search" style="width: 60%" v-model="model.f_userinfo_id"
                       v-on:keyup.enter="$parent.$parent.search()" condition="ui.f_userinfo_id = '{}'" placeholder='用户编号'>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>工程编号：</strong></label>
                <input type="text" class="input_search" style="width: 60%" v-model="model.f_applycode"
                       v-on:keyup.enter="$parent.$parent.search()" condition="ui.f_applycode like '%{}%'" placeholder='工程编号'>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>状&emsp;&emsp;态：</strong></label>
                <v-select
                  v-model="model.f_ignition_state"
                  placeholder='状态'
                  condition="ir.f_state = '{}'"
                  :value.sync="model.f_ignition_state"
                  :options='$parent.$parent.states'
                  class="select select_list"
                  :value-single="true"
                  close-on-select >
                </v-select>
              </div>
              <div class="form-group col-sm-3 button-range">
                <button class="button_search button_spacing" @click="$parent.$parent.search()" v-el:cx>查询</button>
                <button class="button_clear button_spacing"  @click="$parent.$parent.clear()">清空</button>
                <export-excel :data="$parent.$parent.getCondition"
                              :field="$parent.$parent.getfield"
                              sqlurl="rs/logic/applyExportfile"
                              sql-name="getWaitIgnitionRecord"
                              template-name='点火记录信息'
                              :choose-col="true"></export-excel>
                <div
                  :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                  @click="$parent.$parent.criteriaShow = !$parent.$parent.criteriaShow"
                  class="button_spacing"
                  style="float: right">
                </div>
              </div>
            </div>
            <div class="row" v-show="$parent.$parent.criteriaShow">
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>点&ensp;火&ensp;人：</strong></label>
                <input type="text" class="input_search" style="width: 60%" v-model="model.f_ignition_operator"
                       v-on:keyup.enter="$parent.$parent.search()" condition="ir.f_ignition_operator = '{}'" placeholder='点火人'>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>片&emsp;&emsp;区：</strong></label>
                <v-select
                  v-model="model.f_area"
                  placeholder='片区'
                  condition="ui.f_area = '{}'"
                  :value.sync="model.f_area"
                  :options='$parent.$parent.sliceareas'
                  class="select select_list"
                  :value-single="true"
                  close-on-select >
                </v-select>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>用户类型：</strong></label>
                <v-select
                  v-model="model.f_user_type"
                  placeholder='用户类型'
                  condition="uf.f_user_type = '{}'"
                  :value.sync="model.f_user_type"
                  :options='$parent.$parent.usertype'
                  class="select select_list"
                  :value-single="true"
                  close-on-select >
                </v-select>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>用户性质：</strong></label>
                <v-select
                  v-model="model.f_apply_nature"
                  placeholder='用户性质'
                  condition="ap.f_apply_nature = '{}'"
                  :value.sync="model.f_apply_nature"
                  :options='$parent.$parent.applyNatures'
                  class="select select_list"
                  :value-single="true"
                  close-on-select ></v-select>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>用&ensp;户&ensp;名：</strong></label>
                <input type="text" class="input_search" style="width: 60%" v-model="model.f_user_name"
                       v-on:keyup.enter="$parent.$parent.search()" condition="ui.f_user_name = '{}'" placeholder='用户名'>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>电&emsp;&emsp;话：</strong></label>
                <input type="text" class="input_search" style="width: 60%" v-model="model.f_user_phone"
                       v-on:keyup.enter="$parent.$parent.search()" condition="ui.f_user_phone = '{}'" placeholder='电话'>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>表&emsp;&emsp;号：</strong></label>
                <input type="text" class="input_search" style="width: 60%" v-model="model.f_meternumber"
                       v-on:keyup.enter="$parent.$parent.search()" condition="uf.f_meternumber = '{}'" placeholder='表号'>
              </div>
              <div class="form-group col-sm-3">
                <label  for="startDate" class="font_normal_body"><strong>派单时间：</strong></label>
                <datepicker id="startDate" placeholder="开始日期"
                            style="width: 60%!important;"
                            v-model="model.startDate"
                            :value.sync="model.startDate"
                            :format="'yyyy-MM-dd 00:00:00'"
                            :show-reset-button="true"
                            condition="ir.f_date >= '{}'">
                </datepicker>
              </div>
              <div class="form-group col-sm-3">
                <label for="endDate" class="font_normal_body"><strong>派单时间：</strong></label>
                <datepicker id="endDate" placeholder="结束日期"
                            style="width: 60%!important;"
                            v-model="model.endDate"
                            :value.sync="model.endDate"
                            :format="'yyyy-MM-dd 23:59:59'"
                            :show-reset-button="true"
                            condition="ir.f_date <= '{}'">
                </datepicker>
              </div>
              <div class="form-group col-sm-3">
                <label  for="startFireDate" class="font_normal_body"><strong>点火时间：</strong></label>
                <datepicker id="startFireDate" placeholder="开始日期"
                            style="width: 60%!important;"
                            v-model="model.startFireDate"
                            :value.sync="model.startFireDate"
                            :format="'yyyy-MM-dd 00:00:00'"
                            :show-reset-button="true"
                            condition="ir.f_ignition_date>= '{}'">
                </datepicker>
              </div>
              <div class="form-group col-sm-3">
                <label for="endFireDate" class="font_normal_body"><strong>点火时间：</strong></label>
                <datepicker id="endFireDate" placeholder="结束日期"
                            style="width: 60%!important;"
                            v-model="model.endFireDate"
                            :value.sync="model.endFireDate"
                            :format="'yyyy-MM-dd 23:59:59'"
                            :show-reset-button="true"
                            condition="ir.f_ignition_date <= '{}'">
                </datepicker>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body"><strong>是否旧报建：</strong></label>
                <v-select
                  v-model="model.f_is_old"
                  :value.sync="model.f_is_old"
                  :options='$parent.$parent.Isold'
                  class="select select_list"
                  :value-single="true"
                  close-on-select ></v-select>
              </div>
            </div>
          </div>
        </criteria>
        <data-grid :model="model" partial='list' v-ref:grid style="overflow: auto" class="list_area table_sy">
          <template partial='head'>
            <tr>
              <th style="white-space: nowrap;">序号</th>
              <th style="white-space: nowrap;">用户编号</th>
              <th style="white-space: nowrap;">用户名</th>
              <th style="white-space: nowrap;">联系电话</th>
              <th style="white-space: nowrap;">用户类型</th>
              <th style="white-space: nowrap;">地址</th>
              <th style="white-space: nowrap;">片区</th>
<!--              <th>定位地址</th>-->
              <th style="white-space: nowrap;">气表类型</th>
              <th style="white-space: nowrap;">气表品牌</th>
              <th style="white-space: nowrap;">表号</th>
              <th style="white-space: nowrap;">派单人</th>
              <th style="white-space: nowrap;">派单时间</th>
              <th style="white-space: nowrap;">备注</th>
              <th style="white-space: nowrap;">点火人</th>
              <th style="white-space: nowrap;">是否共享</th>
              <th style="white-space: nowrap;">点火时间</th>
              <th style="white-space: nowrap;">状态</th>
              <th style="white-space: nowrap;">工程编号</th>
              <th style="white-space: nowrap;">操作</th>
            </tr>
          </template>
          <template partial='body'>
            <tr >
              <td style="text-align: center;">
                <nobr><font><div style="width:35px">{{$index+1}}</div></font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font><div style="width:70px">{{row.f_userinfo_id}}</div></font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_user_name}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_user_phone}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font><div style="width:65px">{{row.f_user_type}}</div></font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_address}}{{row.f_address_detail}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_area}}</font></nobr>
              </td>
<!--              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">-->
<!--                <nobr><font>-->
<!--                  <a @click="$parent.$parent.$parent.openAmap(row)" style="text-decoration: none">-->
<!--                    {{row.f_location_address}}-->
<!--                  </a>-->
<!--                </font></nobr>-->
<!--              </td>-->
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font><div style="width:65px">{{row.f_meter_classify}}</div></font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_meter_brand}}</font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_meternumber}}</font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_dispatch_operator}}</font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_dispatch_date}}</font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_ignition_remarks}}</font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_ignition_operator}}</font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_shared_dispatch}}</font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_ignition_date}}</font></nobr>
              </td>
              <td style="text-align: center;" @click="$parent.$parent.$parent.getFiles(row)">
                <nobr><font>{{row.f_ignition_state}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_apply_num}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <button
                  type="button" name="button" class="btn btn-link"
                  v-if="row.f_ignition_state === '正在进行'"
                  @click="$parent.$parent.$parent.delet(row)"
                >派单收回</button>
              </td>
            </tr>
          </template>
        </data-grid>
      </criteria-paged>
    </div>
  </div>

  <modal v-if="showFiles" :show.sync="showFiles" v-ref:modal :large="true" :backdrop="false">
    <header slot="modal-header" class="modal-header">
      <button type="button" class="close" @click="closeModal"><span>&times;</span></button>
      <h4 class="modal-title">点火照片</h4>
    </header>
    <article slot="modal-body" class="modal-body clearfix">
      <exhibition-picture :imgs="filesList" max-height="400px" img-height="250px" img-padding="15px"></exhibition-picture>
    </article>
    <footer slot="modal-footer" class="modal-footer">
    </footer>
  </modal>
</template>

<script>
import {HttpResetClass, PagedList} from 'vue-client'
import {isEmpty} from "../../Util";

export default {
  title: '点火记录',
  data () {
    return {
      model: new PagedList('rs/sql/getWaitIgnitionRecord', 20, null),
      criteriaShow: false,
      showFiles: false,
      filesList: [] ,
      Isold:[{label: '全部', value: ''},{label: '是', value: '是'},{label: '否', value: '否'}],
      states:[{label: '已通气', value: '结束'},{label: '已派单', value: '正在进行'}],//通气状态
      sliceareas: [], // 片区
      usertype:[{label: "全部", value: ""}, {label: "民用", value: "民用"}, {label: "非民用", value: "非民用"}],//用户类型
      applyNatures: [{label: '全部', value: ''},{label: '工业', value: '工业'},{label: '商业', value: '商业'},{label: '散户', value: '散户'},{label: '小区', value: '小区'},{label: '分户挂表', value: '分户挂表'}], // 报建性质
      getfield: {
        'f_userinfo_id': '  用户编号  ',
        'f_user_name': '  用户名称  ',
        'f_user_type': '    用户类型    ',
        'f_user_phone': '  电话  ',
        'f_address': '       地      址       ',
        'f_area': '  片  区  ',
        'f_meter_classify': '  气 表 类 型  ',
        'f_meter_brand': '  气 表 品 牌  ',
        'f_meter_style': '  气 表 型 号  ',
        'f_ignition_remarks': '  点 火 备 注  ',
        'f_ignition_operator': '  点 火 人 员  ',
        'f_ignition_date': '  点 火 时 间  '
      }
    }
  },
  ready () {
    this.search()
    setTimeout (this.getsliceareas,500)
  },
  methods: {
    async delet(row) {
      let http = new HttpResetClass()
      let data = {
        f_userinfo_id:row.f_userinfo_id
      }
      let res = await http.load(
        'POST',
        'rs/logic/deleteIgnition',
        {data: data},
        {
          warnMsg: null,
          resolveMsg: null
        })
      this.search()
    },
    async getsliceareas () {

      let res = await this.$resetpost(
        'rs/logic/getsliceareas',{data:null},
        {resolveMsg: null, rejectMsg: '获取片区失败！！！'}
      )
      this.sliceareas = [{label: '全部', value: ''}, ...res.data]
    },
    async getFiles (row) {
      console.log('获取')
      let http = new HttpResetClass()
      let data = {
        tablename: 't_files',
        condition: `f_blobid = '${row.f_blobid}'`,
        orderitem: 'f_uploaddate desc'
      }
      let res = await http.load(
        'POST',
        'rs/sql/applySingleTable',
        {data: data},
        {
          warnMsg: null,
          resolveMsg: null
      })

      this.filesList = res.data.map(item => {
        return `http://${location.host}/${item.f_downloadpath.substring(item.f_downloadpath.lastIndexOf(":\\") + 2)}`
      })

      this.showFiles = true
    },
    searchCondition (args) {
      if(!isEmpty(this.$refs.cp.$refs.cri.model.f_is_old)){
        if(this.$refs.cp.$refs.cri.model.f_is_old == '是'){
          args.condition = args.condition + ` and ir.f_is_old = '是'`
        }else if(this.$refs.cp.$refs.cri.model.f_is_old == '否'){
          args.condition = args.condition + ` and (ir.f_is_old ='' or ir.f_is_old is null )  `
        }
      }
      args.condition = args.condition + ` and ir.id is not null`
      this.model.search(args.condition, args.model)
    },
    // 查询
    search () {
      this.$refs.cp.$refs.cri.search()
    },
    clear () {
      Object.keys(this.$refs.cp.$refs.cri.model).forEach((key) => {
        this.$refs.cp.$refs.cri.model[key] = null
      })
    },
    closeModal () {
      this.showFiles = false
    }
  },
  computed: {
    getCondition () {
      return {
        condition: this.$refs.cp.$refs.cri.condition + `and ir.id is not null`,
        data: {
          orgid: this.$login.f.orgid
        }
      }
    }
  }
}
</script>

<style scoped>
</style>
