<template>
  <div class="container resource close-left-menu contaNEW">
    <div class="pop-banner clearfix">
      <h3 class="current-module">医院对账单详情</h3>
    </div>
    <div class="pd-form fast-search-form">
      <div class="group-row">
        <div class="form-group form-label">
          <label class="label" for="cn1">医疗机构</label>
          <div class="control">
            <input type="text" v-model="mxListList[0].medname" id="cn1" class="inp4" readonly="readonly" maxlength="20">

          </div>
        </div>
        <div class="form-group form-label">
          <label class="label" for="cn2">供货单位</label>
          <div class="control">
            <input type="text" v-model="mxListList[0].suppliername" id="cn2" class="inp4" readonly="readonly"
              maxlength="20">

          </div>
        </div>
      </div>

      <div class="group-row">
        <div class="form-group form-label">
          <label class="label" for="cn3">业务开始</label>
          <div class="control">
            <input type="text" v-model="mxListList[0].dzbegindate" id="cn3" class="inp4" readonly="readonly"
              maxlength="20">

          </div>
        </div>
        <div class="form-group form-label">
          <label class="label" for="cn4">业务结束</label>
          <div class="control">
            <input type="text" v-model="mxListList[0].dzenddate" id="cn4" class="inp4" readonly="readonly"
              maxlength="20">

          </div>
        </div>
      </div>

      <div class="group-row">
        <div class="form-group form-label">
          <label class="label" for="cn5">账期</label>
          <div class="control">
            <input type="text" v-model="mxListList[0].accountperiod" id="cn5" class="inp4" readonly="readonly"
              maxlength="20">

          </div>
        </div>
      </div>
    </div>

    <section class="ctable ct-parent mt-20">
      <div class="ct-head">
        <span class="ct-col w60">序号</span>
        <span class="ct-col w100">商品编码</span>
        <span class="ct-col w150">商品名称</span>
        <span class="ct-col w100">规格</span>
        <span class="ct-col w100">期初数量</span>
        <span class="ct-col w100">期初金额</span>
        <span class="ct-col w100">采购入库数量</span>
        <span class="ct-col w100">采购入库金额</span>
        <span class="ct-col w90">退货数量</span>
        <span class="ct-col w90">退货金额</span>
      </div>
      <div class="ct-row">
        <div>
          <div class="row-line" v-for="sup in mxList">
            <span class="ct-col w60">{{ $index + 1 }}</span>
            <span class="ct-col w100">{{ sup.goodscode }}</span>
            <span class="ct-col w150">{{ sup.goodsname }}</span>
            <span class="ct-col w100">{{ sup.goodsspec }}</span>
            <span class="ct-col w100">{{ sup.periodqty }}</span>
            <span class="ct-col w100">{{ sup.periodamount }}</span>
            <span class="ct-col w100">{{ sup.mvqty }}</span>
            <span class="ct-col w100">{{ sup.mvamount }}</span>
            <span class="ct-col w90">{{ sup.returnqty }}</span>
            <span class="ct-col w90">{{ sup.returnamount }}</span>
          </div>
          <div class="row-line">
            <span class="ct-col w60">合计</span>
            <span class="ct-col w100">{{ sup.goodscode }}</span>
            <span class="ct-col w150">{{ sup.goodsname }}</span>
            <span class="ct-col w100">{{ sup.goodsspec }}</span>
            <span class="ct-col w100">{{ sum1 == 0 ? '':sum1 }}</span>
            <span class="ct-col w100">{{ sum2 == 0 ? '':sum2 }}</span>
            <span class="ct-col w100">{{ sum3 == 0 ? '':sum3 }}</span>
            <span class="ct-col w100">{{ sum4 == 0 ? '':sum4 }}</span>
            <span class="ct-col w90">{{ sum5 == 0 ? '':sum5 }}</span>
            <span class="ct-col w90">{{ sum6 == 0 ? '':sum6 }}</span>
          </div>

        </div>

      </div>
    </section>

    <section class="ctable ct-parent mt-20">
      <div class="ct-head">
        <span class="ct-col w100">消耗数量</span>
        <span class="ct-col w100">消耗金额</span>
        <span class="ct-col w120">消耗退货数量</span>
        <span class="ct-col w120">消耗退货金额</span>
        <span class="ct-col w90">报溢数量</span>
        <span class="ct-col w90">报溢金额</span>
        <span class="ct-col w90">报损数量</span>
        <span class="ct-col w90">报损金额</span>
        <span class="ct-col w90">期末数量</span>
        <span class="ct-col w90">期末金额</span>
      </div>
      <div class="ct-row">
        <div>
          <div class="row-line" v-for="sup in mxList">
            <span class="ct-col w100">{{ sup.useqty }}</span>
            <span class="ct-col w100">{{ sup.useamount }}</span>
            <span class="ct-col w120">0000</span>
            <span class="ct-col w120">0000</span>
            <span class="ct-col w90">{{ sup.profitqty }}</span>
            <span class="ct-col w90">{{ sup.profitamount }}</span>
            <span class="ct-col w90">{{ sup.lossqty }}</span>
            <span class="ct-col w90">{{ sup.lossamount }}</span>
            <span class="ct-col w90">{{ sup.balanceqty }}</span>
            <span class="ct-col w90">{{ sup.balanceamount }}</span>
          </div>
          <div class="row-line">
            <span class="ct-col w100">{{ sum7 == 0 ? '':sum7 }}</span>
            <span class="ct-col w100">{{ sum8 == 0 ? '':sum8 }}</span>
            <span class="ct-col w120">{{ sum9 == 0 ? '':sum9 }}</span>
            <span class="ct-col w120">{{ sum10 == 0 ? '':sum10 }}</span>
            <span class="ct-col w90">{{ sum11 == 0 ? '':sum11 }}</span>
            <span class="ct-col w90">{{ sum12 == 0 ? '':sum12 }}</span>
            <span class="ct-col w90">{{ sum13 == 0 ? '':sum13 }}</span>
            <span class="ct-col w90">{{ sum14 == 0 ? '':sum14 }}</span>
            <span class="ct-col w90">{{ sum15 == 0 ? '':sum15 }}</span>
            <span class="ct-col w90">{{ sum16 == 0 ? '':sum16 }}</span>
          </div>
        </div>
      </div>
    </section>
    <!--翻页-->
    <div class="pagination m-20-0">
      <pagination @page-change="getData()" :page-no.sync="search.page" :total-pages.sync="search.totalPages">
      </pagination>
    </div>
</template>

<script>
export default {
  data() {
    return {
      mxList: [],
      mxListList: '',
      search: {
        page: 1,
        pageSize: 10,
        guid: '',
        pageNo: 0,
        totalPages: 0,
        total: 0
      },
      sum1:0,
      sum2:0,
      sum3:0,
      sum4:0,
      sum5:0,
      sum6:0,
      sum7:0,
      sum8:0,
      sum9:0,
      sum10:0,
      sum11:0,
      sum12:0,
      sum13:0,
      sum14:0,
      sum15:0,
      sum16:0
    }
  },
  methods: {
    getData: async function () {
      // console.log(111);
      var self = this;
      self.$set('mxList', []);
      // console.log(self.$route.params.guid);
      self.search.guid = self.$route.params.guid;
      try {

        var response = await Ajax.post('/statement/trMedStatementDetails', self.search);
        var data = response.data.data;
        console.log(data);
        if (data.list) {
          self.$set('mxList', data.list);
        }

        self.search.pageno = data.pageno;
        self.search.totalPages = data.totalPages;
        self.search.total = data.total;
        // console.log(self.mxList);
      } catch (error) {
        console.error(error);
        // 处理错误情况
      }

      self.$set('mxListList', []);

      try {
        var self = this
        var response = await Ajax.post('/statement/listTrMedStatements', self.search);
        var data = response.data.data;
        // console.log(data);
        if (data.list) {
          self.$set('mxListList', data.list);
        }

        self.search.pageno = data.pageno;
        self.search.totalPages = data.totalPages;
        self.search.total = data.total;
        // console.log(self.mxList);
      } catch (error) {
        console.error(error);
        // 处理错误情况
      }

      for (let i = 0; i < this.mxList.length; i++) {
        self.sum1 += this.mxList[i].periodqty;
        self.sum2 += this.mxList[i].periodamount;
        self.sum3 += this.mxList[i].mvqty;
        self.sum4 += this.mxList[i].mvamount;
        self.sum5 += this.mxList[i].returnqty;
        self.sum6 += this.mxList[i].returnamount;
        self.sum7 += this.mxList[i].useqty;
        self.sum8 += this.mxList[i].useamount;
        // self.sum9 += this.mxList[i].periodqty;
        // self.sum10 += this.mxList[i].periodqty;
        self.sum11 += this.mxList[i].profitqty;
        self.sum12 += this.mxList[i].profitamount;
        self.sum13 += this.mxList[i].lossqty;
        self.sum14 += this.mxList[i].lossamount;
        self.sum15 += this.mxList[i].balanceqty;
        self.sum16 += this.mxList[i].balanceamount;
      }
    }
  },
  route: {
    activate: function () {
      this.getData();
    }
  }
}


</script>