<template>
  <div>
    <!-- <div class="common-card">
            <h3>订单状态</h3>
            <el-steps :active="orderStatus" class="steps" align-center finish-status="success">
                <el-step
                :title="item.title"
                :description="item.description"
                v-for="(item, index) in items"
                :key="index"
                ></el-step>
            </el-steps>
        </div> -->
    <div class="common-card">
      <h3>订单状态</h3>
      <yl-step :stepId="orderStas"></yl-step>
    </div>
    <div class="common-card" style="height:100%;">
      <h3>药品明细</h3>
      <el-table
        style="margin-top: 30px;"
        v-loading="listLoading"
        element-loading-text="加载中"
        :data="list"
        fit
        stripe
        border
      >
        <template slot="empty">
          <img src="@/assets/nopage.png" alt />
          <p>暂无数据</p>
        </template>
        <el-table-column fixed type="index" label="序号" width="60" />
        <el-table-column label="药品编码" prop="drugListId" />
        <el-table-column label="耗材规格" prop="specName" />
        <el-table-column label="包装单位" prop="pacUnt" />
        <el-table-column label="申请数量" prop="appyCnt" />
        <el-table-column label="生产厂商" prop="prodentpName" />
        <el-table-column label="当前库存" prop="invCnt" />
        <el-table-column label="最低库存" prop="lowInv" />
        <el-table-column label="最高库存" prop="highInv" />
      </el-table>
      <p class="price-css">合计数量：{{ amount.num }}</p>
    </div>
  </div>
</template>

<script>
import ylStep from "@/components/yl-step";
import { getDetlList } from "@/api/applyManage/index";
import { countNumPrice } from "@/utils/utils";
export default {
  components: {
    ylStep
  },
  data() {
    return {
      listLoading: false,
      list: [],
      orderStas: null,
      amount: {
        num: 0
      }
    };
  },
  created() {
    this.orderStas = this.$route.query.stas * 1;
  },
  methods: {
    getData() {
      this.listLoading = true;
      getDetlList({ id: this.$route.query.id })
        .then(res => {
          this.list = res.data;
          this.listLoading = false;
          this.amount = countNumPrice(this.list, "appyCnt");
        })
        .catch(err => {
          this.listLoading = false;
        });
    }
  },
  mounted() {
    this.getData();
  }
};
</script>

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