<!--
  @description: 发货订单管理-订单列表
  @author:王俊楠
  @routerPath:/procurement/procurementOrderDeliverList
  @date： 2020-11-10 14:44:01
-->
<template>
  <div>
    <table-crud
      ref="tableCrud"
      :menu="true"
      :tabs="purchaseSupplierStatusList"
      :search-form="searchForm"
      search-label-width="100px"
      @on-load="loadData"
    >
      <template v-slot:header>
        供应商采购订单管理
      </template>
      <template v-slot:search="search">
        <!--订单编号-->
        <el-form-item ref="orderCode" label="订单编号" class="el-form-item--three" prop="orderCode">
          <el-input
            v-model.trim="searchForm.orderCode"
            placeholder="订单编号"
            @keyup.enter.native="search.onSearch"
          />
        </el-form-item>
        <!--订单名称-->
        <el-form-item ref="orderName" label="订单名称" class="el-form-item--three" prop="orderName">
          <el-input
            v-model.trim="searchForm.orderName"
            placeholder="订单名称"
            @keyup.enter.native="search.onSearch"
          />
        </el-form-item>
        <!-- 订单总额 -->
        <el-form-item prop="min" label="订单总额(元)">
          <el-input v-model="searchForm.orderTotalMoney_begin" type="number" />
        </el-form-item>~
        <el-form-item prop="max">
          <el-input v-model="searchForm.orderTotalMoney_end" type="number" />
        </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="search.onSearch"
          />
        </el-form-item>
      </template>
      <template v-slot:GXTable>
        <el-table ref="smallTable" v-loading="loading" :data="tableData">
          <el-table-column type="index" label="序号" align="center" width="60" />
          <el-table-column
            prop="orderCode"
            label="订单编号"
            header-align="center"
            align="center"
            min-width="140"
          />
          <el-table-column
            prop="orderName"
            label="订单名称"
            header-align="center"
            align="left"
            min-width="230"
          >
            <template slot-scope="scope">
              <span>{{ scope.row.orderName }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="purchaseDepartName"
            label="采购单位"
            min-width="180"
            header-align="center"
            align="left"
          />
          <el-table-column
            prop="purchaseDepartExecuteName"
            label="采购执行单位"
            min-width="200"
            header-align="center"
            align="left"
          />
          <el-table-column
            label="生成方式"
            width="150"
            header-align="center"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{ filterDictText(tender_methodList, scope.row.tenderMethod) }}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="订单总额(元)"
            min-width="110"
            header-align="center"
            align="right"
          >
            <template slot-scope="scope">
              <span>{{ scope.row.orderTotalMoney?moneyFormat(scope.row.orderTotalMoney.toFixed(2)):scope.row.orderTotalMoney }}</span>
            </template>
          </el-table-column>
          <!--          <el-table-column
            prop="sapOrderCode"
            label="sap订单号"
            min-width="140"
            header-align="center"
            align="center"
          />-->
          <el-table-column label="发布时间" align="center" width="150" header-align="center">
            <template slot-scope="scope">
              <span>{{ $Moment(scope.row.createTime).format(momentDateTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="订单状态"
            width="100"
            header-align="center"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{ filterDictText(procurementSupplierOrderStatusList, scope.row.orderStatus) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" min-width="200" fixed="right">
            <template slot-scope="scope">
              <el-link
                type="primary"
                @click.stop="navOrderDetail(scope.row)"
              >
                [详情]
              </el-link>
              <el-link
                type="primary"
                @click.stop="navOrderHandle(scope.row)"
              >
                [处理]
              </el-link>
            </template>
          </el-table-column>
        </el-table>
      </template>
    </table-crud>
  </div>
</template>

<script>
/* api接口*/
import {
  listSupplierProcurementOrderPages // 供应商订单管理列表
} from '@/api/procurement/procurementOrder'
/* 公共方法 */
import { filterDictText, moneyFormat } from '@/assets/js/utils' // 深拷贝
import { procurementOrderGroupMixins } from '@/views/procurement/procurementOrder/mixins/procurementOrderGroupMixins.js'
/* 正则 */
import { checkRate } from '@/assets/js/validate'// 校验输入内容
export default {
  name: 'ProcurementOrderReceiveList',
  mixins: [procurementOrderGroupMixins],
  data() {
    return {
      createTime: '',
      searchForm: {
        orderTotalMoney_begin: '', // 订单总额开始
        orderTotalMoney_end: '', // 订单总额结束
        tenderMethod: '', // 生成方式
        orderStatus: '', // 订单状态
        orderCode: '', // 订单编号
        orderName: '', // 订单名称
        winningDepartName: '', // 供应商名称
        purchaseDepartName: '', // 创建人
        createTime_begin: '', // 创建日期
        createTime_end: '', // 结束日期
        purchaseDepartExecuteName: '' // 代理单位
      },
      confirmLoading: false, // 提交按钮loading
      // 校验规则
      rules: {
        receiptNum: [
          { required: true, validator: checkRate, trigger: 'blur' }
        ] // 收货数量
      },
      loading: false,
      tableData: []
    }
  },
  computed: {
  },
  watch: {
  },
  created() {
  },
  methods: {
    filterDictText, // 字典值替换文本通用方法
    moneyFormat, // 金额千分位
    // 获取数据
    loadData(params, callback, tabData) {
      const PARAMS = { ...params, tabData }
      listSupplierProcurementOrderPages(PARAMS).then(response => {
        this.loading = false
        this.tableData = response.data.records
        callback(response.data.total)
      }).catch(() => {
        this.loading = false
      })
    },
    // 跳转发货处理订单
    navOrderHandle(row) {
      this.$router.push({
        path: 'procurementOrderDeliverHandleAdd',
        name: 'ProcurementOrderDeliverHandleAdd',
        params: {
          orderId: row.id
        }
      })
    },
    // 跳转发货详情
    navOrderDetail(row) {
      this.$router.push({
        name: 'ProcurementOrderDeliverHandleDetail',
        params: {
          orderId: row.id
        }
      })
    }
  }
}
</script>

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

