<template>
  <div  class="flex">
    <criteria-paged :model="model" v-ref:paged>
      <criteria partial='criteria' @condition-changed='$parent.selfSearch' v-ref:cri>
        <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
          <div class="row">
            <div :class="$parent.$parent.styles">
              <label class="font_normal_body">组织机构&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
              <res-select restype='organization'
                          class="select select_list"
                          style="width: 60%"
                          @res-select="$parent.$parent.getorg"
                          :initresid='$parent.$parent.curorgid'>
              </res-select>
            </div>
            <div :class="$parent.$parent.styles">
              <label class="font_normal_body">项目名称&nbsp;&nbsp;&nbsp;</label>
              <input  type="text" class="input_search" style="width:60%" v-model="model.f_price_name" placeholder='项目名称'
                     condition="f_dispathch_name like '%{}%'" v-next-el="cx" v-el:qjmc
              >
            </div>
            <div :class="$parent.$parent.styles">
              <label  class="font_normal_body">用户编号</label>
              <input type="text" class="input_search" style="width:60%" v-model="model.f_userinfo_code" placeholder='用户编号'
                     condition="f_userinfo_code like '%{}%'" v-next-el="cx" v-el:qjmc>
            </div>



            <!--            <div class="col-sm-4">-->
            <!--              <label class="font_normal_body">生效时间小于</label>-->
            <!--              <datepicker :format="'yyyy-MM-dd'"-->
            <!--                          :value.sync="model.performDate"-->
            <!--                          placeholder="生效日期"-->
            <!--                          v-model="model.performDate" style="width: 55%">-->
            <!--              </datepicker>-->
            <!--            </div>-->
            <div class="span" style="float:right;">
              <button class="button_search" @click="$parent.$parent.search()" v-el:cx>查询</button>
              <button class="button_new" @click="$parent.$parent.add()">新增</button>
              <export-excel :data="$parent.$parent.getCondition"
                            :field="$parent.$parent.getfield"
                            sqlurl="rs/logic/saleExport" progress="saleGetExportProgress" sql-name="getDispatchInfo" template-name='派单记录导出'  :choose-col="true"></export-excel>
              <div style="float: right"  class="button_spacing"
                   :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                   @click="$parent.$parent.hidden()"></div>
            </div>
          </div>
          <div class="row" v-show="$parent.$parent.criteriaShow">
            <div :class="$parent.$parent.styles">
              <label  class="font_normal_body">派工单状态&nbsp;&nbsp;&nbsp;</label>
              <v-select  :value.sync="model.f_dispathch_state" v-model="model.f_dispathch_state" value="is null"
                         :options='$parent.$parent.f_dispathch_state' placeholder='派工单状态'
                         close-on-select condition="f_dispathch_state ='{}'"></v-select>
            </div>
            <div :class="$parent.$parent.styles">
              <label  class="font_normal_body">派工单类型</label>
              <v-select  :value.sync="model.f_dispathch_type" v-model="model.f_dispathch_type" value="is null"
                         :options='$parent.$parent.f_dispathch_type' placeholder='派工单类型'
                         close-on-select condition="f_dispathch_type ='{}'"></v-select>
            </div>
            <div :class="$parent.$parent.styles">
              <label class="font_normal_body">是否超期</label>
              <v-select :value.sync="model.f_warn_state" v-model="model.f_warn_state" value="is null"
                        :options='$parent.$parent.f_warn_state' placeholder='是否超期'
                        close-on-select condition="f_warn_state ='{}'"></v-select>
            </div>
            <div :class="$parent.$parent.styles">
              <label class="font_normal_body">施工人&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
              <v-select  :value.sync="model.f_build_people" v-model="model.f_build_people" value="is null"
                         :options='$parent.$parent.f_build_people' placeholder='施工人'
                         close-on-select condition="f_build_people ='{}'"></v-select>
            </div>
            <div :class="$parent.$parent.styles" >
              <label class="font_normal_body">派工日期&nbsp;&nbsp;&nbsp;</label>
              <datepicker  id="startDate" placeholder="开始日期"
                           v-model="model.startDate"
                           :value.sync="model.startDate"
                           :disabled-days-of-Week="[]"
                           style="width: 60%"
                           :format="'yyyy-MM-dd 00:00:00'"
                           condition="f_dispathch_date > '{}'">
              </datepicker>
            </div>
            <div :class="$parent.$parent.styles" >
              <label class="font_normal_body">至&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
              <datepicker   id="endDate" placeholder="结束日期"
                            v-model="model.endDate"
                            :value.sync="model.endDate"
                            style="width: 60%"
                            :disabled-days-of-Week="[]"
                            :format="'yyyy-MM-dd 23:59:59'"
                            condition="f_dispathch_date < '{}'">
              </datepicker>
            </div>
            <div :class="$parent.$parent.styles">
              <label class="font_normal_body">预约是否超期</label>
              <v-select :value.sync="model.f_yuyue_state" v-model="model.f_yuyue_state" value="is null"
                        :options='$parent.$parent.f_yuyue_state' placeholder='预约是否超期'
                        close-on-select condition="f_yuyue_state ='{}'"></v-select>
            </div>
          </div>
        </div>

      </criteria>
      <data-grid :model="model" partial='list'  class="list_area table_sy"  v-ref:grid>
        <template partial='head'>
          <tr>
            <th>
              <nobr>序号</nobr>
            </th>
            <th>
              <nobr>用户编号</nobr>
            </th>
            <th>
              <nobr>项目名称</nobr>
            </th>
            <th>
              <nobr>联系电话</nobr>
            </th>
            <th>
              <nobr>安装地址</nobr>
            </th>
            <th>
              <nobr>派工类型</nobr>
            </th>
            <th>
              <nobr>派工日期</nobr>
            </th>
            <th>
              <nobr>来源</nobr>
            </th>
            <th>
              <nobr>紧急程度</nobr>
            </th>
            <th>
              <nobr>施工人</nobr>
            </th>
            <th>
              <nobr>派工单状态</nobr>
            </th>
            <th>
              <nobr>预约时间</nobr>
            </th>
            <th >
              <nobr>操作</nobr>
            </th>
          </tr>
        </template>
        <template partial='body'>
          <tr>
            <td  :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]"  style="text-align:center">{{$index + 1}}</td>
            <td  :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center">{{row.f_userinfo_code}}</td>
            <td  :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center">{{row.f_dispathch_name}}</td>
            <td  :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center">{{row.f_phone}}</td>
            <td :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center"><nobr>{{row.f_dispathch_address}}</nobr></td>
            <td :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center">{{row.f_dispathch_type}}</td>
            <td :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center">{{row.f_dispathch_date}}</td>
            <td :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center">{{row.f_source}}</td>
            <td :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center">{{row.f_dispathch_num}}</td>
            <td :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center">{{row.f_build_people}}</td>
            <td :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center"><nobr><p style="font-weight: bold">{{row.f_dispathch_state}}</p></nobr></td>
            <td :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align:center">{{row.f_yuyue_date}}</td>
            <td :class="[ row.f_dispathch_state ==='待分配' ? 'p' : row.f_dispathch_state === '施工中'? 'p1':''  ]" style="text-align: center;">
        <!--           <p v-if="row.f_yuyue_date">  </p>
              <button v-else v-if="row.f_dispathch_state ==='待分配'||row.f_dispathch_state === '施工中'" class=" button_search" @click="$parent.$parent.$parent.showlist(row)">预约</button>
--><button v-if="row.f_dispathch_state ==='已完成'||row.f_dispathch_state === '施工中'" class="button_search" @click="$parent.$parent.$parent.downDispatcher(row)">下载</button>
                <button v-if="row.f_dispathch_state ==='待分配'||row.f_dispathch_state === '施工中'" class="button_clear" @click="$parent.$parent.$parent.quxiao(row)">取消</button>
            <!--  <button v-if="row.f_dispathch_state=='施工中' || row.f_dispathch_state=='完成'" class="btn btn-link" @click.stop="$parent.$parent.$parent.downDispatcher(row)">打印派工单</button>
           --> </td>
          </tr>
        </template>
        <template partial='foot'></template>
      </data-grid>
    </criteria-paged>
    <modal v-if="show" :show.sync="show" width="500px" backdrop="true">
      <header slot="modal-header" class="modal-header">
        <h4 class="modal-title">预约</h4>
      </header>
      <article slot="modal-body"  class="modal-body" style="height:100%;width:100%">
        <form class="form-horizontal">
          <div class="form-group" >
            <label for="f_qxr" class="control-label">预约时间</label>
            <datepicker  :aria-required="true"
                        :format="'yyyy-MM-dd'"
                        :value.sync="model.f_yuyue_date"
                        id="f_yuyue_date"
                        placeholder="完成日期"
                        v-model="model.f_yuyue_date" style="width: 60%">
            </datepicker>
          </div>
        </form>
      </article>
      <footer slot="modal-footer" class="modal-footer">
        <button type="button" class="btn btn-success" @click='yuyueConfirm'>确认</button>
        <button type="button" class="btn btn-default" @click='thisclose'>取消</button>
      </footer>
    </modal>
    <modal v-if="qxshow" :show.sync="qxshow" width="600px" backdrop="true">
      <header slot="modal-header" class="modal-header">
        <h4 class="modal-title">取消派工</h4>
      </header>
      <article slot="modal-body" class="modal-body">
        <form class="form-horizontal">
          <div class="form-group" >
            <label for="f_qxr" class="control-label">取消原因</label>
            <input type="text" class="form-control col-sm-2" v-model="model.f_qxyy"
                   placeholder='取消原因'>
          </div>
        </form>
      </article>
      <footer slot="modal-footer" class="modal-footer">
        <button type="button" class="btn btn-success" @click='insertConfirm'>确认</button>
        <button type="button" class="btn btn-default" @click='thisclose'>取消</button>
      </footer>
    </modal>
  </div>
</template>

<script>
    import {PagedList} from 'vue-client'
    import Vue from 'vue'

    let passGen = async function (self, row) {
      let param = {
        id: row.id,
        userid: self.$login.f.id
      }
      await self.$resetpost('rs/logic/priceNextFlow', param, {
        warnMsg: `确定要通过气价名称为: ${row.f_price_name}的气价吗？`,
        resolveMsg: '审核通过',
        rejectMsg: '流程进行出错！！！'
      })
      self.$dispatch('success')
    }

    export default {
      data () {
        return {
          styles: 'col-sm-2 form-grop',
          model: new PagedList('rs/sql/getDispatchInfo', 20, {performDate: 'this.model.performDate', orderitem: '"' + this.orderitem + '"'}),
          show: false,
                // 公司下拉
          curorgid: [this.$login.f.orgid],
          row: {},
          f_orgid: '',
          qxshow: false,
          qxrow: null,
          criteriaShow: false,
          f_dispathch_state: [{label: '全部', value: ''}, {label: '已取消', value: '已取消'}, {label: '待分配', value: '待分配'}, {label: '施工中', value: '施工中'}, {label: '已完成', value: '已完成'}],
          f_dispathch_type: [{label: '全部', value: ''}, {label: '改装', value: '改装'}, {label: '安装', value: '安装'}],
          f_warn_state: [{label: '全部', value: ''}, {label: '超时', value: '超时'}, {label: '正常', value: '正常'}],
          f_yuyue_state: [{label: '全部', value: ''}, {label: '预约超期', value: '预约超期'}, {label: '正常', value: '正常'}],
          f_build_people: this.$appdata.getParam('施工人', {label: '全部', value: ''}),
          headData: ['用户编号', '项目名称', '联系电话', '安装地址', '派工类型', '派工日期', '来源', '紧急程度', '施工人', '派工单状态', '预约时间'],
          bodyData: ['f_userinfo_code', 'f_dispathch_name', 'f_phone', 'f_dispathch_address', 'f_dispathch_type', 'f_dispathch_date', 'f_source', 'f_dispathch_num', 'f_build_people', 'f_dispathch_state', 'f_yuyue_date']

        }
      },
      props: {
        orderitem: {
          type: String,
          default: 'id desc'
        },
        row: {},
        config: {},
        ispartial: false,

        f_filialeid: {
          type: String
        }
      },
      ready () {
        this.$refs.paged.$refs.cri.model.performDate = this.$login.toStandardDateString()
        this.search()
      },
      methods: {
        hidden () {
          this.criteriaShow = !this.criteriaShow
        },
        showlist (val) {
          this.show = true
          this.qxrow = val
        },
        quxiao (val) {
          this.styles = 'col-sm-4 form-group'
          this.qxshow = true
          this.qxrow = val
        },
        thisclose () {
          this.qxshow = false
          this.show = false
        },
        yuyueConfirm () {
          let param = {
            id: this.qxrow.id,
            f_yuyue_date: this.model.f_yuyue_date
          }
          this.$resetpost('rs/entity/t_dispatch_list', param).then((res) => {
              // this.params.rows.splice(index, 1)
            console.log('成功')
            this.show = false
            this.qxrow = null
            this.model.f_yuyue_date = ''
            this.search()
          })
        },
        insertConfirm () {
          let param = {
            id: this.qxrow.id,
            f_qxr: this.$login.f.name,
            f_qxyy: this.model.f_qxyy,
            f_dispathch_state: '已取消'
          }
          this.$resetpost('rs/entity/t_dispatch_list', param).then((res) => {
              // this.params.rows.splice(index, 1)
            console.log('成功')
            this.qxshow = false
            this.qxrow = null
            this.model.f_qxyy = ''
            this.search()
          })
        },
        async downDispatcher (row) {
          this.styles = 'col-sm-4 form-group'
          var link = document.createElement('a')
          var param = {'condition': 'id=' + row.id, 'orderitem': 'id'}
          var res = await this.$resetpost('rs/sql/getDispatchInfo', {data: param}, {
            rejectMsg: '查询出错'
          })
          console.log(res)
          let path = res.data[0].f_dispathch_path
          console.log(path)
          let filepath = {'filepath': path}
          var rses = await this.$resetpost('rs/logic/getDispatcherFile', {data: filepath}, {
            rejectMsg: '获取失败'
          })
          console.log(rses)
          let downfilepath = rses.data
            // webapps这个是在服务器上导出用的
          let pathName = 'http://' + location.host + '/webapps' + downfilepath.split('webapps')[1]
                // word这个是在本地导出用的
             //   let pathName = "http://" + "localhost:8080" + "/word" + downfilepath.split('word')[1]
          console.log(pathName)
          window.location.href = pathName

           // link.href = pathName;
           // link.download = path.split('excel/')[1];
         //   link.dispatchEvent(new MouseEvent('click'));
        },
        showhistory (row) {
          this.show = true
          this.row = row
        },
        operate (id, pricename) {
          this.$parent.usershow = true
          this.$parent.priceid = id
          this.$parent.pricename = pricename
        },
        search () {
          this.$refs.paged.$refs.cri.search()
          this.$dispatch('search')
        },
        getorg (val) {
          this.f_orgid = this.$login.convertToIn(val)
          this.f_filialeid = val[0]
        },
        selfSearch (args) {
          if (!this.f_orgid) {
            this.getorg([this.$login.f.orgid])
          }
          console.log('查询。。。', this.f_orgid)
          if (this.f_orgid) {
            args.condition = `${args.condition}`
          }
          this.$refs.paged.$refs.grid.$el.scrollTop = 0
          this.model.search(args.condition, args.model)
        },
        add () {
          this.$dispatch('add')
        },
        passPrice (row) {
          console.log('气价审核通过。。。', row, this.$refs.paged.$refs.grid.selected)
          let selectedRow = this.$refs.paged.$refs.grid.selected
          if (selectedRow) {
            if (row.id !== selectedRow.id && selectedRow.f_state === '待审核') {
              this.$showAlert('您通过的气价信息不是您选中的信息', 'warning', 3000)
            } else {
              passGen(this, row)
            }
          } else {
            passGen(this, row)
          }
        },
        historySeleted () {

        }

      },
      watch: {
        'model.rows.length' (val) {
          if (val === 1) {
            this.$refs.paged.$refs.grid.select(this.model.rows[0])
            this.$parent.usershow = false
          }
        }
      },
      computed: {
        getCondition () {
          return {condition: this.$refs.paged.$refs.cri.condition}
        },
        getfield () {
          let data = {}
          this.bodyData.forEach((value, index) => {
            data[this.bodyData[index]] = this.headData[index]
          })
          return data
        }
      }
    }
</script>
<style scoped>
  .p1 {
    color: #28dc1f;
    font-weight:bold
  }
  .p {
    color: #5f37ff;
  }
</style>
