<!--
  @description: 收货订单管理-列表页
  @author: 王俊楠/高铭昱
  @routerPath: /procurement/procurementOrderReceiveList
  @date： 2020-2-16 15:42:12
-->
<template>
  <div>
    <table-crud
      ref="tableCrud"
      :menu="true"
      :tabs="purchasePurchaseStatusList"
      :search-form.sync="searchForm"
      search-label-width="100px"
      @on-load="loadData"
    >
      <!--标题-->
      <template v-slot:header>
        采购订单管理
      </template>
      <template v-slot:search="search">
        <el-form
          ref="searchForm"
          :model="searchForm"
          label-width="108px"
          label-position="left"
          inline
        >
          <!--订单编号-->
          <el-form-item ref="orderCode" label="订单编号" prop="orderCode">
            <el-input
              v-model.trim="searchForm.orderCode"
              placeholder="订单编号"
              @keyup.enter.native="search.onSearch"
            />
          </el-form-item>
          <!--订单名称-->
          <el-form-item ref="orderName" label="订单名称" prop="orderName">
            <el-input
              v-model.trim="searchForm.orderName"
              placeholder="订单名称"
              @keyup.enter.native="search.onSearch"
            />
          </el-form-item>
          <!--供应商名称-->
          <el-form-item
            ref="winningDepartName"
            label="供应商名称"
            class="el-form-item--three"
            prop="winningDepartName"
          >
            <el-input
              v-model.trim="searchForm.winningDepartName"
              placeholder="供应商名称"
              @keyup.enter.native="search.onSearch"
            />
          </el-form-item>
          <!--采购单位-->
          <el-form-item
            ref="purchaseDepartName"
            label="采购单位"
            class="el-form-item--three"
            prop="purchaseDepartName"
          >
            <el-input
              v-model.trim="searchForm.purchaseDepartName"
              placeholder="采购单位"
              @keyup.enter.native="onSearch"
            />
          </el-form-item>
          <!-- 订单总额 -->
          <el-form-item prop="min" label="订单总额(元)">
            <el-input v-model="searchForm.orderTotalMoney_begin" type="number" style="width: 12%" />
            ~
            <el-input v-model="searchForm.orderTotalMoney_end" type="number" style="width: 12%" />
          </el-form-item>
          <!--创建日期-->
          <el-form-item label="创建日期">
            <el-date-picker
              v-model="searchForm.datePicker"
              type="daterange"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              style="width: 220px"
              @change="handleCreateTime"
            />
          </el-form-item>
        </el-form>
      </template>
      <template v-slot:GXTable>
        <!-- 待提交 待审核表格组件 -->
        <procOderRecPendingComp v-if="searchForm.orderStatus === '00' || searchForm.orderStatus === '01'" :table-data="tableData" :proc-result="procResult">
          <template slot-scope="scope">
            <!-- 00 待确认 01 待审核 02 进行中 03 已取消 -->
            <el-link
              v-if=" searchForm.orderStatus!== '00'"
              type="primary"
              @click.stop="navOrderDetail(scope.row)"
            >
              [详情]
            </el-link>
            <el-link
              v-if="searchForm.orderStatus === '00'"
              type="primary"
              @click.stop="confirmOrder(scope.row)"
            >
              [处理]
            </el-link>
            <!--     <el-link
              v-if="searchForm.orderStatus === '02' || searchForm.orderStatus === '01'"
              type="primary"
              @click.stop="navOrderHandle(scope.row)"
            >
              [处理]
            </el-link>-->
            <el-link v-if="searchForm.orderStatus!=='00'" type="primary" @click.stop="handleFlowTrace(scope.row)">
              [流程追踪]
            </el-link>
          </template>
        </procOderRecPendingComp>
        <!-- 已提交完成表格组件 -->
        <procOrderRecFinishComp v-if="searchForm.orderStatus === '02'" :table-data="tableData" :proc-result="procResult">
          <template slot-scope="scope">
            <!-- 00 待确认 01 待审核 02 进行中 03 已取消 -->
            <el-link
              v-if=" searchForm.orderStatus!== '00'"
              type="primary"
              @click.stop="navOrderDetail(scope.row)"
            >
              [详情]
            </el-link>
            <el-link
              v-if="searchForm.orderStatus === '00'"
              type="primary"
              @click.stop="confirmOrder(scope.row)"
            >
              [处理]
            </el-link>
            <el-link
              v-if="searchForm.orderStatus === '02' || searchForm.orderStatus === '01'"
              type="primary"
              @click.stop="navOrderHandle(scope.row)"
            >
              [处理]
            </el-link>
            <el-link v-if="searchForm.orderStatus!=='00' && procurementOrderPushAuditConfig" type="primary" @click.stop="handleFlowTrace(scope.row)">
              [流程追踪]
            </el-link>
          </template>
        </procOrderRecFinishComp>
      </template>
    </table-crud>
    <!--流程追踪查看弹框-->
    <flow-detail-dialog ref="tracingFlow" />
    <!-- 查看采购单结果弹框 -->
    <procurementResultDialog :dialog-data="procResultData" />
  </div>
</template>

<script>
/* api接口*/
import {
  listProcurementOrderPages
} from '@/api/procurement/procurementOrder'
/* 公共方法 */
import { filterDictText, moneyFormat } from '@/assets/js/utils' // 深拷贝
/* 混合开发-参数字段*/
import { procurementOrderGroupMixins } from '@/views/procurement/procurementOrder/mixins/procurementOrderGroupMixins.js'
/*  公共组件 */
import flowDetailDialog from '@views/work/process/flowDetail-dialog' //  流程追踪组件
import procurementResultDialog from '../procurementOrderQuery/procurementResult-dialog' // 采购单结果弹窗
import procOderRecPendingComp from './procOderRecPendingComp.vue' // 待提交待审核组件
import procOrderRecFinishComp from './procOrderRecFinishComp.vue' // 已完成提交组件
import { checkRate } from '@/assets/js/validate'// 校验输入内容
import { orderWormMixins } from '../mixins/orderWormMixins' // 工作流配置
export default {
  name: 'ProcurementOrderReceiveList',
  components: {
    flowDetailDialog,
    procurementResultDialog, // 采购单结果弹窗
    procOderRecPendingComp, // 待提交待审核表格
    procOrderRecFinishComp
  },
  mixins: [procurementOrderGroupMixins, orderWormMixins],
  props: {
    // 订单基本信息 不可编辑的
    orderInfoBase: {
      type: Object,
      default: function() {
        return {}
      }
    }
  },
  data() {
    return {
      createTime: '',
      searchForm: {
        datePicker: [], // 选择开始时间结束时间
        orderTotalMoney_begin: '', // 订单总额开始
        orderTotalMoney_end: '', // 订单总额结束
        // tenderMethod: '', // 生成方式
        orderStatus: '00', // 订单状态
        orderCode: '', // 订单编号
        orderName: '', // 订单名称
        winningDepartName: '', // 供应商名称
        purchaseDepartName: '', // 创建人
        createTime_begin: '', // 创建日期
        createTime_end: '', // 结束日期
        purchaseDepartExecuteName: '' // 代理单位
      },
      confirmLoading: false, // 提交按钮loading
      // 校验规则
      rules: {
        receiptNum: [
          { required: true, validator: checkRate, trigger: 'blur' }
        ] // 收货数量
      },
      loading: false,
      tableData: [],
      // 采购单结果弹窗数据
      procResultData: {
        dialog: false,
        projectData: {}
      }
    }
  },
  computed: {
  },
  watch: {
  },
  created() {
  },
  methods: {
    filterDictText, // 字典值替换文本通用方法
    moneyFormat,
    // 获取数据
    loadData(params, callback, tabData) {
      if (tabData) {
        params.orderStatus = tabData.index
        this.searchForm.orderStatus = tabData.index // tabs数据
      }
      listProcurementOrderPages(params).then(response => {
        this.loading = false
        this.tableData = response.data.records
        callback(response.data.total)
      }).catch(() => {
        this.loading = false
      })
    },
    // 返回收货订单处理详情页面
    back() {
      this.$router.push({
        path: '/procurement/procurementOrderList'
      })
    },
    // 跳转收货订单详情
    navOrderDetail(row) {
      this.$router.push({
        name: 'ProcurementOrderReceiveHandleDetail',
        params: {
          orderId: row.id,
          sapOrderCode: row.sapOrderCode
        }
      })
    },
    // 跳转收货处理订单
    navOrderHandle(row) {
      this.$router.push({
        name: 'ProcurementOrderReceiveHandleAdd',
        params: {
          orderId: row.id
        }
      })
    },
    // 确认查看
    confirmOrder(row) {
      this.$router.push({
        name: 'ProcurementOrderConfirmDetail',
        params: {
          orderId: row.id // 订单id
        }
      })
    },
    // 处理搜索时间格式
    handleCreateTime(val) {
      if (val) {
        this.searchForm.createTime_begin = this.$Moment(val[0]).format(this.momentDate)// 创建开始时间
        this.searchForm.createTime_end = this.$Moment(val[1]).format(this.momentDate)// 创建结束时间
      }
    },
    // 流程追踪
    handleFlowTrace(row) {
      this.$refs.tracingFlow.openDialogInitData(row.id)
    },
    // 采购单结果弹窗
    procResult(row) {
      this.procResultData.projectData = row
      this.procResultData.dialog = true
    }
  }
}
</script>

<style lang="less" scoped>
</style>

