<template>
   <div class="container resource basic-message">
      <div class="pop-banner clearfix">
        <div class="current-operate">配送商出库单【{{trsupplierdo.billno}}】详情</div>
        <div class="operate-btns"> </div>
        <h3 class="current-module">配送商出库单明细</h3>
      </div>{{dual}}
      <div class="clearfix mb-40">
        <button class="btn-d btn-d-lg btn-d-green btn-d-activate btn-d-circle"
        v-link="{ path: '/planTrack/' + trsupplierdo.guid}" v-if="authoritySetting.twoTraceFlag">单据追溯</button>
        <button class="btn-d btn-d-lg btn-d-green btn-d-activate btn-d-circle ml-10"  @click="print">打印配送商出库单</button>
      </div>

  <div class="pd-form"> 
    <div class="group-row group-row-3">
      <div class="form-group">
        <label for="cn1" class="label lable-xf pl10">出库单号</label>
        <div class="control">
          <input type="text" id="cn1"  :value="trsupplierdo.billno" class="pl75" readonly="readonly"></div>
      </div>
      <div class="form-group">
        <label for="cn3" class="label lable-xf pl10">单据类型</label>
        <div class="control">
          <input type="text" id="cn3" :value="trsupplierdo.billtype | billtype" class="pl75" readonly="readonly">
        </div>
      </div> 
      <div class="form-group">
        <label for="cn2" class="label lable-xf pl10">执行状态</label>
        <div class="control">
          <input type="text" id="cn2" :value="trsupplierdo.billstate | billstate_trdo" class="pl75" readonly="readonly"></div>
      </div>
    </div>
    <div class="group-row group-row-3">
      <div class="form-group">
        <label for="cn4" class="label lable-xf pl10">采购订单</label>
        <div class="control">
          <input type="text" id="cn4" :value="trsupplierdo.supplierpobillno" class="pl75" readonly="readonly"></div>
      </div>
      <div class="form-group">
        <label for="cn5" class="label lable-xf w100 pl10">要求到货日期</label>
        <div class="control">
          <input type="text" id="cn5" :value="trsupplierdo.planenddate | getYMD" class="pl105" readonly="readonly"></div>
      </div>
      <div class="form-group">
        <label for="cn6" class="label lable-xf pl10">订货日期</label>
        <div class="control">
          <input type="text" id="cn6" :value="trsupplierdo.billdate | getYMD" class="pl75" readonly="readonly"></div>
      </div>
    </div>
    <div class="group-row group-row-3">
      <div class="form-group">
        <label for="cn7" class="label lable-xf pl10">操作人</label>
        <div class="control">
          <input type="text" id="cn7" :value="trsupplierdo.operatername" class="pl60" readonly="readonly"></div>
      </div>
      <div class="form-group">
        <label for="cn8" class="label lable-xf pl10">业务员</label>
        <div class="control">
          <input type="text" id="cn8" :value="trsupplierdo.mkstaffname" class="pl60" readonly="readonly">
        </div>
      </div>
      <div class="form-group">
        <label for="cn9" class="label lable-xf pl10">出库日期</label>
        <div class="control">
          <input type="text" id="cn9" :value="trsupplierdo.dodate | getYMD" class="pl75" readonly="readonly"></div>
      </div>
    </div>
    <div class="group-row">
      <div class="form-group">
        <label for="cn10" class="label lable-xf pl10">收货单位</label>
        <div class="control">
          <input type="text" id="cn10" :value="trsupplierdo.medname" class="pl75" readonly="readonly"></div>
      </div>
      <div class="form-group">
        <label for="cn11" class="label lable-xf pl10">收货地点</label>
        <div class="control">
          <input type="text" id="cn11" :value="trsupplierdo.address" class="pl75" readonly="readonly"></div>
      </div>
    </div>
    <div class="group-row"> 
      <div class="form-group">
        <label for="cn12" class="label lable-xf pl10">供应商</label>
        <div class="control">
          <input type="text" id="cn12" :value="trsupplierdo.suppliername" class="pl60 w700" readonly="readonly"></div>
      </div>
    </div>
    <div class="group-row"> 
      <div class="form-group">
        <label for="cn12" class="label lable-xf pl10">配送商</label>
        <div class="control">
          <input type="text" id="cn12" :value="trsupplierdo.distrbname" class="pl60 w700" readonly="readonly"></div>
      </div>
    </div>
  </div>
 

       <div class="pd-form mb-40">
        <div class="group-row group-row-3">
          <div class="form-group">
            <label for="cn1" class="label">出库单号</label>
            <div class="control">
              <input type="text" id="cn1" v-model="trsupplierdo.billno"
               readonly="readonly"> </div>
          </div>
          <div class="form-group">
            <label for="cn2" class="label">出库日期</label>
            <div class="control">
              <input type="text" id="cn2" v-model="trsupplierdo.dodate"
               readonly="readonly"> </div>
          </div>
          <div class="form-group">
            <label for="cn2" class="label">执行状态</label>
            <div class="control">
              <input type="text" id="cn2"
              v-model="trsupplierdo.billstate | billstate_trdo"
               readonly="readonly"> </div>
          </div>
        </div>
        <div class="group-row group-row-3">
          <div class="form-group">
            <label for="cn1" class="label">订单号</label>
            <div class="control">
              <input type="text" id="cn1" v-model="trsupplierdo.medplanbillno"
               readonly="readonly"> </div>
          </div>
          <div class="form-group">
            <label for="cn2" class="label label-6em">要求到货日期</label>
            <div class="control">
              <input type="text" id="cn2" v-model="trsupplierdo.planenddate"
               readonly="readonly"> </div>
          </div>
          <div class="form-group">
            <label for="cn2" class="label">订货日期</label>
            <div class="control">
              <input type="text" id="cn2" v-model="trsupplierdo.billdate"
               readonly="readonly"> </div>
          </div>
        </div>
        <div class="group-row">
          <div class="form-group">
            <label for="cn3" class="label">收货单位</label>
            <div class="control">
              <input type="text" id="cn3" v-model="trsupplierdo.medname"
               readonly="readonly"> </div>
          </div>
          <div class="form-group">
            <label for="cn4" class="label">收货地点</label>
            <div class="control">
              <input type="text" id="cn3" v-model="trsupplierdo.address"
               readonly="readonly"> </div>
          </div>
        </div>
        <div class="group-row">
            <div class="form-group">
              <label for="cn7" class="label">单据类型</label>
              <div class="control">
               <input type="text" id="cn3" v-model="trsupplierdo.billtype | billtype"
               readonly="readonly"> </div>
          </div>
          <div class="form-group">
            <label for="cn4" class="label">供应商</label>
            <div class="control">
              <input type="text" id="cn3" v-model="trsupplierdo.suppliername"
               readonly="readonly"> </div>
          </div>
        </div>
        <div class="group-row">
          <div class="form-group">
            <label for="cn3" class="label">操作人</label>
            <div class="control">
              <input type="text" id="cn3" v-model="trsupplierdo.operatername"
               readonly="readonly"> </div>
          </div>
          <div class="form-group">
            <label for="cn4" class="label">业务员</label>
            <div class="control">
              <input type="text" id="cn3" v-model="trsupplierdo.mkstaffname"
               readonly="readonly"></option>
              </select
            </div>
          </div>
        </div>
        <div class="form-group">
          <label for="cn4" class="label">配送商</label>
          <div class="control">
            <input type="text" id="cn3" v-model="trsupplierdo.distrbname"
             readonly="readonly"> </div>
        </div>
      </div>



      <table class="itable itable-bordertop itable-td-long-text">
        <thead>
          <tr>
            <th class="w50">序号</th>
            <th class="w260">商品</th>
            <th class="w30"></th>
            <th class="w60">订货数</th>
            <th class="w80">本次出库数</th>
            <th class="w90">已出库数</th>
            <th class="w90">价格</th>
            <th class="w90">含税金额</th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="orderoutQuerys in orderoutQuerysList">
            <td>{{ $index + 1 }}
                <div class="pro-pic pro-pic-lg">
                <imagebox :imgarr="orderoutQuerysListImg[orderoutQuerys.purchaserGoodsguid] | original">
                  <div class="pro-pic" style="background-image: url({{orderoutQuerysListImg[orderoutQuerys.purchaserGoodsguid] | thumbnail}});margin-left: 12px;">
                    <span class="pic-max blue-search"></span>
                  </div>
                </imagebox>
              </div>
            </td>
            <td class="t-left">
              <div class="p-lr-10">{{ orderoutQuerys.purchaserGoodscode}}
                <br>
                <span class="p-tit-green">{{ orderoutQuerys.purchaserGoodsname }}</span>
                <br> {{ orderoutQuerys.purchaserGoodsspec }}
                <br> {{ orderoutQuerys.registkey }}
                <br> {{ orderoutQuerys.manufacturer }} </div>
            </td>
            <td class="w30">
              <span class="table-detail-icon">医</span>
              <span class="table-detail-icon">供</span>
            </td>
            <td>
              <span class="table-detail-text"> {{ orderoutQuerys.supplierPoqty }}
                <br>{{ orderoutQuerys.supplierUnit }}</span>
              <span class="table-detail-text">{{ orderoutQuerys.purchaserPoqty }}
                <br>{{ orderoutQuerys.purchaserUnit }}</span>
            </td>
            <td>
              <span class="table-detail-text">{{ orderoutQuerys.purchaserPesentqty  }}
                <br>{{ orderoutQuerys.supplierUnit}}</span>
              <span class="table-detail-text">{{ orderoutQuerys.supplierPesentqty  }}
                <br>{{ orderoutQuerys.purchaserUnit }}</span>
            </td>
            <td>
              <span class="table-detail-text">{{ orderoutQuerys.purchaserArrivalqty }}
                <br>{{ orderoutQuerys.supplierUnit }}</span>
              <span class="table-detail-text">{{ orderoutQuerys.supplierArrivalqty }}
                <br>{{ orderoutQuerys.purchaserUnit }}</span>
            </td>
            <td>
              <span class="table-detail-text">{{ orderoutQuerys.purchaserPrice }}元
                <br>/{{ orderoutQuerys.supplierUnit}}</span>
              <span class="table-detail-text">{{ orderoutQuerys.supplierPrice}}元
                <br>/{{ orderoutQuerys.purchaserUnit }}</span>
            </td>
            <td class="v-middle">
            <span class="table-detail-text">{{ orderoutQuerys.amount }}元</span>
            </td>
          </tr>
        </tbody>
      </table>
       <table class="itable itable-bordertop itable-td-long-text">
        <thead>
          <tr>
            <th class="w50"></th>
            <th class="w50">批号</th>
            <th class="w260">生产日期</th>
            <th class="w60">有效期至</th>
            <th class="w80">灭菌批号</th>
            <th class="w90">灭菌日期</th>
            <th class="w90">灭菌效期</th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="orderoutQuerys in orderoutQuerysList">
            <td class="t-left">
              <span></span>
            </td>
            <td>
              <span>{{orderoutQuerys.lot }}</span>
            </td>
            <td>
              <span>{{orderoutQuerys.productiondate}}</span>
            </td>
            <td>
              <span>{{orderoutQuerys.expiredate}}</span>
            </td>
            <td>
              <span>{{orderoutQuerys.sterilantlot}}</span>
            </td>
            <td>
              <span>{{orderoutQuerys.sterilantdate}}</span>
            </td>
            <td>
              <span>{{orderoutQuerys.sterilantexpdate}}</span>
            </td>
          </tr>
        </tbody>
      </table>
      <div class="pagination m-20-0">
        <em class="page">明细条目数【{{search.total}}】</em>
        <pagination 
            @page-change="getData" 
            :class="['m-20-0']"
            :page-no.sync="search.page" 
            :total-pages.sync="search.totalPages">
          </pagination>
      </div>
</template>

<script>
module.exports={
  data: function(){
    return {
      disabled : true,
      distrbutorOrder:[],
      orderoutQuerysListImg:[],
      orderoutQuerysList:[],
      billType:[],
      operationFlag:"0",
      disabled: true,
      search: {
        pageSize: 5,
        page: 1,
        total: 0,
        totalPages: 0,
        search_EQ_guid: '',
        search_EQ_distrbguid:''
      },
      authoritySetting: {
          twoTraceFlag:false,
      },
    };
  },
  computed: {
      dual: function () {
        var self = this;
        var curMenuRole = this.$store.state.user.curMenuRole;
        self.search.search_EQ_distrbguid = this.$store.state.user.curUser.distrbguid;
        
        if (self.search.search_EQ_distrbguid!=undefined && self.search.search_EQ_distrbguid!=null) {
        if (curMenuRole!=undefined && curMenuRole!=null) {
            for (var i=0;i<curMenuRole.length;i++) {
                if(curMenuRole[i].menu != null) {
                    if (curMenuRole[i].menu.name.trim() == '出库单查询') {
                        for (var j=0;j<curMenuRole[i].buttonList.length;j++) {
                             var name = curMenuRole[i].buttonList[j].name.trim();
                             var isValid = curMenuRole[i].buttonList[j].isvalid;
                             var level = curMenuRole[i].buttonList[j].level;
                            if (!self.authoritySetting.twoTraceFlag && level=='2' && name =='单据跟踪' && isValid=='y') {
                                self.authoritySetting.twoTraceFlag = true;
                             }
                         }
                       break;
                    }
                }
            }
        }
        }
        return '';
      }
    },
  methods: {
    getOrderoutQuery: function(){
      var self = this;
      Ajax.get('/distrbutorOrder/distrbutorOrderQuery/'+this.$route.params.id)
        .then(function (response){
        var data = response.data.data;
        self.$set('trsupplierdo',data);
        self.getOrderoutqueryList();
      })
    },

    getOrderoutqueryList: function(){
      var self = this;
      self.$set('search.search_EQ_guid',this.$route.params.id);
      Ajax.get('/distrbutorOrder/orderoutQuerysList', self.search)
       .then(function (response){
        var data = response.data;
        // self.$set('orderoutQuerysList',data.list);
        // self.search.totalPages = data.totalPages;
        if(data.errorCode == 0){
            self.$set('orderoutQuerysList',data.data.list);
            self.$set('orderoutQuerysListImg',data.senData);

            self.search.totalPages = data.data.totalPages;
            self.search.total = data.data.total;
          }else{
            self.MessageBox({
              title:'提示',message:data.message,type:'alert'
            },function(action){})
          }
      })
    },
    // 打印配送商出库单
    print:function(){
      var self=this;
      Ajax.get('/distrbutorwarehouse/printDistributionDo',{'doBillno':self.trsupplierdo.billno})
        .then(function (response){
          var data=response.data.data;
          window.open(data);
      })
    }
  },
route:{
    activate : function(){
      this.getOrderoutQuery();
      this.getBillType();
    }
  }
};   

</script>