<!--
@name:  密集库任务推送查询
@author: 李恒
@time: 2022-06-06 09:33:12
-->
<template>
  <p-card title='密集库任务推送查询'>
    <div slot='extra'>
      <p-button icon='filter' @click='toggleFormTag = !toggleFormTag'>{{ toggleFormTag ? '隐藏' : '显示' }}</p-button>
      <p-button type='primary' class='ml-10' @click='rePush'>重发</p-button>
    </div>
    <p-form-model v-show='toggleFormTag' ref='formTarget' :label-col='{ span: 8 }' :model='form'
                  :wrapper-col='{ span: 16 }' class='plg-grid-from'>
      <a-row>
        <a-col :span='8' :xxl='6'>
          <p-form-model-item label='任务推送状态'>
            <p-select v-model='form.wmFlag' :options="wmFlagOptions"/>
          </p-form-model-item>
        </a-col>
        <a-col :span='8' :xxl='6'>
          <p-form-model-item label='出库单号'>
            <p-input v-model='form.billNo' placeholder='请输入单据编号'/>
          </p-form-model-item>
        </a-col>
        <a-col :span='8' :xxl='6'>
          <p-form-model-item label='开始时间'>
            <p-date-picker v-model='form.dateStart' :disabled-date='disabledStartDate'
                           :showTime='startShowTime' style='width: 100%;' valueFormat='YYYY-MM-DD HH:mm:ss'/>
          </p-form-model-item>
        </a-col>
        <a-col :span='8' :xxl='6'>
          <p-form-model-item label='结束时间'>
            <p-date-picker v-model='form.dateEnd' :disabled-date='disabledEndDate'
                           :showTime='endShowTime' style='width: 100%;' valueFormat='YYYY-MM-DD HH:mm:ss'/>
          </p-form-model-item>
        </a-col>
        <a-col :span='8' :xxl='{span:6,offset:18}'>
          <p-form-model-item :wrapper-col='{ span: 16, offset: 8 }'>
            <p-button type='primary' @click='onSubmit'>查询</p-button>
            <p-button class='ml-10' @click='onReset'>重置</p-button>
          </p-form-model-item>
        </a-col>
      </a-row>
    </p-form-model>
    <p-table ref='dataSource' :data-source.sync='dataSource'
             :scroll='{x:true}'
             :autoLoad='false'
             :remote-url='listRemoteUrl'
             :remoteData='listParams'
             :selectedRowKeys.sync='selectedRowKeys'
             bordered dragle row-key='msgId'>
      <p-table-column data-index='billNo' title='出库单号'/>
      <p-table-column data-index='seqNo' title='任务号'/>
      <p-table-column data-index='wmFlg' title='任务推送状态'/>
      <p-table-column data-index='gmtCreate' title='第一次推送时间'/>
      <p-table-column data-index='gmtModified' title='最后推送时间'/>
      <p-table-column data-index='extend02' title='失败原因'/>
    </p-table>
  </p-card>
</template>

<script>
import {listRemoteUrl, rePush} from './api'

export default {
  components: {},
  data() {
    return {
      toggleFormTag: true,
      form: {},
      startShowTime: {
        format: 'HH:mm:ss',
        defaultValue: this.$moment('00:00:00', 'HH:mm:ss')
      },
      endShowTime: {
        format: 'HH:mm:ss',
        defaultValue: this.$moment('23:59:59', 'HH:mm:ss')
      },
      // 列表参数
      listRemoteUrl,
      listParams: {},
      dataSource: [],
      selectedRowKeys: [],
      // 字典
      wmFlagOptions: [
        {label: '成功', value: 'Y'},
        {label: '失败', value: 'N'},
      ]
    }
  },
  methods: {
    onSubmit() {
      this.$refs.formTarget.validate(flag => {
        if (!flag) return
        this.listParams = {...this.form}
      })
    },
    onReset() {
      this.$refs.formTarget.resetFields()
      this.form = {}
      this.onSubmit()
    },
    // 日期选择限制
    disabledStartDate(startValue) {
      if (!startValue || !this.form.endtime) return false
      const endValue = this.$moment(this.form.endtime)
      return startValue.valueOf() > endValue.valueOf()
    },
    disabledEndDate(endValue) {
      const current = this.$moment()
      if (!endValue || !this.form.starttime) {
        return current.valueOf() > endValue.valueOf()
      }
      const startValue = this.$moment(this.form.starttime)
      return startValue.valueOf() > endValue.valueOf() || current.valueOf() > endValue.valueOf()
    },
    rePush() {
      const selectedRowKeys = this.selectedRowKeys
      if (selectedRowKeys.length === 0) return this.$message.warn('请选择需要重推的任务')
      const selectRows = this.dataSource.filter(_ => selectedRowKeys.includes(_.msgId))
      this.spinning = true
      rePush(selectRows).then(res => {
        if (res.success) {
          this.$message.success(res.message)
          this.onSubmit()
        } else {
          this.$message.error(res.message)
        }
      }).finally(() => {
        this.spinning = false
      })
    }
  }
}
</script>
