
<!--
  @description:采购立项-项目管理-已生效订单列表
  @Modifier:lxl
  @routerPath:/procurement/procurementTakeOrder/takeOrderDetail
  @date:2021/3/22-16:37
-->
<template>
  <div class="main">
    <div>
      <section>
        <el-table
          ref="multipleTable"
          :data="tableData"
          :loading="loading"
        >
          <el-table-column type="index" label="序号" align="center" width="60" />
          <!-- 订单编号 -->
          <el-table-column
            prop="orderCode"
            label="订单编号"
            header-align="center"
            align="center"
            min-width="150"
          />
          <!-- sap订单号 -->
          <!--          <el-table-column
            prop="sapOrderCode"
            label="SAP订单号"
            header-align="center"
            align="center"
            min-width="150"
          />-->
          <!-- 订单名称 -->
          <el-table-column
            prop="orderName"
            label="订单名称"
            header-align="center"
            align="left"
            min-width="230"
          />
          <!-- 采购单位 -->
          <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 label="创建日期" align="center" width="180" header-align="center">
            <template slot-scope="scope">
              <span>{{ $Moment(scope.row.createTime).format(momentDate) }}</span>
            </template>
          </el-table-column>
          <!-- 订单状态 -->
          <el-table-column
            label="订单状态"
            width="150"
            header-align="center"
            align="center"
          >
            <template slot-scope="scope">
              {{ filterDictText(procurementOrderOrderStatusList, scope.row.orderStatus) }}
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            min-width="120"
            align="center"
          >
            <template slot-scope="scope">
              <el-link
                type="primary"
                @click.stop="navOrderDetail(scope.row)"
              >
                详情
              </el-link>
            </template>
          </el-table-column>
        </el-table>

        <!--分页组件-->
        <!-- <pagination :pagination-data="paginationData" @change="initData" /> -->
      </section>
    </div>
  </div>
</template>

<script>
/** api */
import {
  getProcurementOrderInfoByPackId
} from '@/api/procurement/procurementOrder'
/* 组件*/
import pagination from '@comp/common/pagination/pagination' // 分页
/* 公共方法*/
import { ListMixin } from '@/mixins/ListMixin' // 分页
// eslint-disable-next-line no-unused-vars
import { filterDictText, moneyFormat } from '@/assets/js/utils' // 深拷贝
export default {
  name: 'TakeOrderDetail',
  inject: ['getTenderBase'],
  components: {
    pagination // 分页
  },
  mixins: [ListMixin],
  data() {
    return {
      tableData: [],
      loading: true,
      tenderBase: this.getTenderBase(), // 获取项目信息
      tender_methodList: [],
      procurementOrderOrderStatusList: [],
      dictionaryType: ['tender_method', 'procurementOrderOrderStatus'] // 字典参数
    }
  },
  created() {
    // 初始化查询成交通知书列表信息
    this.initData()
    // 字典请求初始化
    this.getGroupType()
  },
  methods: {
    filterDictText, // 字典替换
    moneyFormat,
    // 字典请求
    getGroupType() {
      this.$store.dispatch('getGroupType', this.dictionaryType).then((data) => {
        // 遍历key存储相应的数据
        for (const key in data.bidTypeData) {
          /* 是否有数据*/
          if (data.bidTypeData[key]) {
            this[key] = data.bidTypeData[key]
          }
        }
      })
    },
    // 数据初始化
    initData() {
      const params = {
        packId: this.tenderBase.packId
      }
      getProcurementOrderInfoByPackId(params).then(response => {
        this.loading = false
        this.tableData = response.data
        // this.paginationData.total = response.data.total
      }).catch(() => {
        this.loading = false
      })
    },
    // 详情查看
    navOrderDetail(row) {
      this.$router.push({
        name: 'takeOrderLineDetail',
        params: {
          orderId: row.id,
          orderStatus: '00'
        }
      })
    }
  }
}
</script>

<style>
</style>
