<template>
  <div class="main-contain">
    <div class="position">
      <bread-crumb v-if="this.$route.query.type == 1" :crumbs='crumbs'></bread-crumb>
      <bread-crumb v-if="this.$route.query.type == 2" :crumbs='crumbs2'></bread-crumb>
    </div>

    <div class="app-container">

      <div class="filter-container">
        <span style="font-size: 18px;color: #606266">退货单详情</span>
        <el-row style="float:right;color: #606266">
          <span style="color: #606266">{{ReturnInfo.salesReturn.order_number}}</span>
        </el-row>
      </div>


      <div class="cell clearfix">
        <span style="width: 300px;color: #606266">单据日期:  {{ReturnInfo.salesReturn.return_time | parseTime('{y}-{m}-{d}')}} </span>
        <span style="width: 300px;color: #606266"
        >厂商:
          {{ ReturnInfo.salesReturn.manufacturers? ReturnInfo.salesReturn.manufacturers.manufacturer_name:'' }}</span
        >
        <span style="width: 300px;color: #606266"
        >经销商: {{ ReturnInfo.salesReturn.dealers? ReturnInfo.salesReturn.dealers.dealer_name:''}}</span
        >
      </div>

      <div class="filter-container" style="margin-top: 10px">
        <el-button size="small" icon="el-icon-edit" @click="editRecord">编辑</el-button>
        <el-button size="small" icon="el-icon-delete" @click="deleteRecord">删除</el-button>
      </div>

      <el-row :gutter="12" style="margin-top: 10px">
        <el-table :data="ReturnInfo.returnInfoData" :class="signAndWeighBoxPatients" style="width: 100%" border
                  :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}"
        >
          <el-table-column min-width="35" align="center">
            <template slot="header" slot-scope="scope">
              <span>药品名称</span>
            </template>

            <template slot-scope="scope">
              <span v-if="scope.row.drug_id != 0">{{
                scope.row.drug.drug_name
              }}</span>
            </template>
          </el-table-column>
          <el-table-column min-width="35" align="center">
            <template slot="header" slot-scope="scope">
              <span>规格名称</span>
            </template>
            <template slot-scope="scope">
              <span v-if="scope.row.drug_id != 0">{{
                scope.row.drug?scope.row.drug.drug_spec:''
              }}</span>
            </template>
          </el-table-column>

          <el-table-column min-width="23" align="center">
            <template slot="header" slot-scope="scope">
              <span>退货数量</span>
            </template>
            <template slot-scope="scope">
              <span>{{scope.row.count}}</span>

            </template>
          </el-table-column>


        </el-table>
      </el-row>
    </div>
  </div>

</template>

<script>
  import { uParseTime } from '@/utils/tools'
  import { deleteDrugSalesReturn, GetAllConfig, getDrugReturnList } from "@/api/drug/drug_stock";
  import BreadCrumb from '../../components/bread-crumb'

  export default {
    name: 'stockInOrderDetail',
    components: { BreadCrumb },
    created() {
      const order_id = this.$route.query.id
      this.GetConfigInfo()
      this.GetOrderDetail(order_id)
    },
    data() {
      return {
        crumbs: [
          { path: false, name: '库存管理' },
          { path: false, name: '退货药品单' },
          { path: false, name: '退货单详情' }
        ],
        crumbs2: [
          { path: false, name: '库存管理' },
          { path: false, name: '其他退货单' },
          { path: false, name: '退货单详情' }
        ],
        isEdit: 0,
        checked: false,
        signAndWeighBoxPatients: 'sign-and-weigh-box-patients',
        goodType: [],
        goodInfo: [],
        manufacturer: [],
        dealer: [],

        ReturnInfo: {
          loading: false,
          returnInfoData: [],
          salesReturn: {}
        }
      }
    },
    methods: {
      GetConfigInfo: function() {
        GetAllConfig().then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            this.manufacturer = response.data.data.manufacturer
            this.dealer = response.data.data.dealer
            this.goodInfo = response.data.data.goodInfo
            this.goodType = response.data.data.goodType
          }
        })
      }, calculate: function(val) {
        if (val == 0) {
          return ''
        }
        return Math.round(parseFloat(val) * 100) / 100
      }, GetOrderDetail: function(order_id) {
        const params = {
          'id': order_id
        }
        getDrugReturnList(params).then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            for (let i = 0; i < response.data.data.list.length; i++) {
              this.ReturnInfo.returnInfoData.push(response.data.data.list[i])
            }
            this.ReturnInfo.salesReturn = response.data.data.salesReturn
          }
        })
      }, deleteRecord: function() {
        const ids = []
        ids.push(this.ReturnInfo.salesReturn.id)
        const idStr = ids.join(',')

        const params = {
          ids: idStr
        }

        this.$confirm('确认删除退货单?', '删除退货单记录', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          deleteDrugSalesReturn(params).then(response => {
            if (response.data.state == 0) {
              this.$message.error(response.data.msg)
              return false
            } else {
              this.$notify({
                title: '成功',
                message: '删除成功',
                type: 'success',
                duration: 2000
              })

              this.$router.back(-1)
            }
          })
        }).catch(() => {
        })
      }, editRecord: function() {
        this.$emit('edit-record')
      }
    }
  }
</script>

<style rel="stylesheet/css" lang="scss" scoped>
  .information {
    border: 1px #dcdfe6 solid;
    padding: 30px 20px 30px 20px;

  .border {
    border-bottom: 1px #dcdfe6 solid;
    margin: 0px 0 20px 0;
  }

  }


  .edit_separater {
    border-top: 1px solid rgb(233, 233, 233);
    margin-top: 15px;
    margin-bottom: 15px;
  }

</style>

<style>
  .sign-and-weigh-box .sign-and-weigh-box-patients .cell {
    font-size: 12px;
  }

  .sign-and-weigh-box .sign-and-weigh-box-patients .current-row > td {
    background: #6fb5fa;
  }

  .count {
    color: #bd2c00;

  }

</style>
