<template>

<div>
    <div 
    v-bind:class="{'modal' : openDialogFlg, 'modal hide' :!openDialogFlg}">
      <div class="audit-detail contaNEW" 
      style="margin-left:650px;margin-top:300px;">
      <div class="pd-form">
         <div class="group-row group-row-2">
          <div class="form-group ml-20">
            <label for="cn1" class="">请输入模板名称</label>
              <input type="text" id="cn1" v-model="trcollectionmedplanAndTrmedplanVO.collectionName"  >
          </div>
        </div>
         <div class="group-row t-right mr-20 mt-50">
          <a href="javascript:void(0)" 
          class="fast-search-form-btn btn-d btn-d-lg btn-d-activate btn-d-circle"     v-on:click="cancel">取消</a>
          <a href="javascript:void(0)" 
          class="fast-search-form-btn btn-d btn-d-lg btn-d-activate btn-d-circle"    v-on:click="saveModel" 
           v-if="'/hospital/trmedplan:addTrcollectionmedplan' | myqx " >保存</a>

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


	<div class="container resource">
    <div v-show="oneStep">
      <div class="pop-banner clearfix">
        <div class="operate-btns">
          <a href="javascript:void(0)" class="fbtn fb-favorite2" @click="detailes" >添加到收藏夹</a>
        </div>
        <h3 class="current-module">采购计划明细</h3>
      </div>
       <div class="pd-form">
          <div class="fheader" v-if="trmedplan.billstate == 'N'" style="margin-top:-50px;">
            <div class="group-btns fr">
              <a href="javascript:void(0)" @click="commitTrmedplan" class="tbtn tb-submit">提交</a>
            </div>
          </div>
          <div class="group-row group-row-3">
            <div class="form-group">
              <label for="cn1" class="label" readonly="readonly">计划单号</label>
              <div class="control">
                <input type="text" v-model="trmedplan.billno"  id="cn1" readonly="readonly"> </div>
            </div>
            <div class="form-group">
              <label for="cn2" class="label">操作人</label>
              <div class="control">
                <input type="text" id="cn2" v-model="trmedplan.operatername"  readonly="readonly"  ></div>
            </div>
            <div class="form-group">
              <label for="cn3" class="label">执行状态</label>
              <div class="control">
                <input type="text" id="cn3"  v-model="trmedplan.billstate | receipttype"    v-bind:disabled="disabled "   style="background-color: #F5F5F5 "> </div>
            </div>
          </div>
          <div class="group-row group-row-3">
            <div class="form-group">
              <label for="cn5" class="label">订货日期</label>
              <div class="control">
                <input type="text" id="cn5" v-model="trmedplan.planbegindate | getYMD " readonly="readonly"> </div>
            </div>
            <div class="form-group">
              <label for="cn5" class="label">制单日期</label>
              <div class="control">
                <input type="text" id="cn5" v-model="trmedplan.inputdate  " readonly="readonly"> </div>
            </div>
            <div class="form-group">
              <label for="cn6" class="label">要求到货日期</label>
              <div class="control">
                <input type="text" id="cn6" v-model="trmedplan.planenddate   | getYMD" 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="cn7" v-model="trmedplan.medname" readonly="readonly"> </div>
            </div>
            <div class="form-group">
              <label for="cn8" class="label">单据类型</label>
              <div class="control select-style">
                <input type="text" id="cn8" v-model="trmedplan.billtype | billtype" readonly="readonly"> </div>
            </div>
          </div>
          <div class="group-row">
            <div class="form-group">
              <label class="label">收货地点</label>
              <div class="control ">
                <div class="address-select">
                  <input type="text" readonly="readonly" v-model="trmedplan.province">省
                  <input type="text" value="" readonly="readonly" v-model="trmedplan.city">市 
                  <input type="text" value="" readonly="readonly" v-model="trmedplan.district">
                   </div>
                <input type="text" value="" readonly="readonly"  v-model="trmedplan.address"> </div>
            </div>
            <div class="form-group">
              <label for="cn8" class="label">要货科室</label>
              <div class="control">
                <input type="text" id="cn2" v-model="trmedplan.meddeptname" readonly="readonly"> </div>
            </div>
            <div class="form-group">
              <label for="cn8" class="label">要货库房</label>
              <div class="control">
                <input type="text" id="cn2" v-model="trmedplan.medstorename" readonly="readonly"> </div>
            </div>
          </div>
          <div class="group-row">
            <div class="form-group">
              <label for="cn8" class="label">是否优先</label>
              <div class="control">
                 <radio :checked.sync="trmedplan.firstflag" :list="ctns.firstflg" readonly="readonly"></radio>
               </div>
            </div>
          </div>
          <div class="form-group">
            <label for="cn9" class="label">备注</label>
            <div class="control">
              <textarea id="cn9" rows="4" v-model="trmedplan.memo" readonly="readonly"></textarea>
            </div>
          </div>
        </div>
          <table class="itable itable-bordertop itable-thead-13px itable-td-long-text m-20-0">
            <thead>
              <tr>
                <th class="w50">序号</th>
                <th class="w250 t-left">
                  <div class="p-lr-10">商品</div>
                </th>
                <th class="w100">订货数</th>
                <th class="w100">订货单位</th>
                <th class="w120">包装价格</th>
                <th class="w120">含税金额</th>
                <th class="w70"></th>
              </tr>
            </thead>
            <tbody>
              <tr v-for="trmedplandetail in trmedplandetailList">
                 <td>{{ $index + 1 | getIndex}}
                <div class="pro-pic">
                  <imagebox v-bind:imgarr="trmedplandetail.varchar1 | original">
                    <img class="pro-pic" style="margin-top: 0px;" src="{{trmedplandetail.varchar1 | thumbnail}}">
                    <span class="pic-max blue-search">
                    </span>
                  </imagebox>
                </div>

                </td>
                <td class="t-left">
                  <div class="p-lr-10">{{ trmedplandetail.goodscode }}
                    <br>
                    <span class="p-tit-green">{{ trmedplandetail.goodsname }}</span>
                    <br> {{ trmedplandetail.goodsspec }}
                    <br> {{ trmedplandetail.goodstype }}
                      </div>
                </td>
                <td>{{ trmedplandetail.poqty }}</td>
                <td>{{ trmedplandetail.unit }}</td>
                <td>{{ trmedplandetail.taxprice | numDigit 2 | numFmt }}元</td>
                <td>{{ trmedplandetail.taxsum | numDigit 2 | numFmt}} 元</td>
                <td>
                    <a class="btn-d btn-d-activate" v-link="{ path: '/planTrack/' + trmedplan.guid} ">单据跟踪</a>
                </td>
              </tr>
            </tbody>
          </table>
          <div class="pagination m-20-0">
           <pagination 
              @page-change="getTrPlanDatailList" 
              :class="['m-20-0']"
              :page-no.sync="search.page" 
              :total-pages.sync="search.totalPages">
            </pagination>
        </div>
      </div>
      <div class="purchase-add-plan" v-if="twoStep">
        <div class="pap-time-tit">
          医院采购计划单【{{trmedplan.billno}}】提交成功!
        </div>
        <div class="stepok-tips" v-if="hospitalBillTypeVO.supplierBillInfoList.length > 0">
          <strong>供应商采购订单</strong>
          <div v-for="trsupplierpo in hospitalBillTypeVO.supplierBillInfoList"><p>【{{trsupplierpo.billno}}】已发送给供应商【{{trsupplierpo.suppliername}}】</p></div>
        </div>
        <div class="stepok-tips" v-if="hospitalBillTypeVO.distrbBillInfoList.length > 0">
          <strong>配送商采购订单</strong>
          <div v-for="trdistrbpo in hospitalBillTypeVO.distrbBillInfoList"><p>【{{trdistrbpo.billno}}】已发送给配送商【{{trdistrbpo.distrbname}}】</p></div>
        </div>
        <div class="stepok-tips mt-0">
        </div>
      </div>
    </div>
     
</div> 
</template>

<script>

module.exports={
  data: function(){
    return {   
        // 收藏夹：汇总、明细、名字
      trcollectionmedplanAndTrmedplanVO:{
          collectionName: '',
          trmedplan: {},
          trmedplandetailList: [],
       },
      trmedplan:{planbegindate:'',billtype:'',billstate :'',
        planenddate:''
      },//star 11-8
      readonly:true,
      disabled: true,
      trmedplandetail:[],
      billSelect:[],
      trmedplandetailList:[],
      listTrmedplandetail :[],
      openDialogFlg: false,
      search: {
        pageSize:10,
        page: 1,
        totalPages: 0,
        search_EQ_guid: '',
      }, 
      trmedplanAndTrmedplandetailVO:{},
      oneStep:false,
      twoStep:false,
      hospitalBillTypeVO:{distrbBillInfoList:[]},
    };
  },
  methods: {
     // 显示采购计划订单信息
    getListTrmedplan: function(){
      var self = this;
      Ajax.get('/hospitalTrmedplan/trmedplandetailList/'+
        this.$route.params.id)
        .then(function (response){
        var data = response.data.data;
        self.$set('oneStep', true);
        self.$set('trmedplan',data);
        self.getTrPlanDatailList();
      })
    },
    // 显示采购计划明细
    getTrPlanDatailList: function(){
      var self = this;
      self.$set('search.search_EQ_guid',self.trmedplan.guid);
      Ajax.get('/hospitalTrmedplan/listTrmedplandetail', self.search)
       .then(function (response){
        var data = response.data.data;
        self.$set('trmedplandetailList',data.list);
        self.search.totalPages = data.totalPages;
        self.search.total = data.total;
      }) 
    },

    save:function() {
      var self = this;
        Ajax.post('/hospitalTrmedplan/trPlanSave',self.trPlan)
          .then(function (response){
          self.$route.router.go('/buyPlanAdd1');
        })
    },
 
    detailes: function(guid){
    var self = this;
    self.openDialogFlg = true;
    switch(guid){
        case 1:
          this.setControl1(true);
          this.getEnt(guid);
          break;
      }
    }, 
    // 取消按钮
    cancel: function() {
      var self = this;
      self.openDialogFlg = false;
    },
    // 添加到收藏夹
    saveModel: function() {
       var self = this;
       if (self.trcollectionmedplanAndTrmedplanVO.collectionName) {
        self.trcollectionmedplanAndTrmedplanVO.trmedplan = {};
        self.trcollectionmedplanAndTrmedplanVO.trmedplandetailList = [];
        self.trcollectionmedplanAndTrmedplanVO.trmedplan = self.trmedplan;
        for (var i = 0; i < self.trmedplandetailList.length; i ++) {
          self.trcollectionmedplanAndTrmedplanVO.trmedplandetailList.push(self.trmedplandetailList[i]);
        }
        Ajax.post('/hospitalTrmedplan/addTrcollectionmedplan',this.trcollectionmedplanAndTrmedplanVO)
        .then(function (response){
             var data = response.data;
            if (data.errorCode == 0) {
              layer.msg('收藏夹收藏成功！');
              self.cancel();
            } else {
              layer.msg(data.message);
            }
         })
       }
    },
    //控制页面显示内容（更多）
    setControl1: function(hbo1){
          this.$set('hospitalBuyOrder1',hbo1); 
          this.$set('active11',hbo1);      
     },
    // 提交采购计划
    commitTrmedplan: function() {
      var self = this;
      self.$set('trmedplanAndTrmedplandetailVO.trmedplan', self.trmedplan);
      self.$set('trmedplanAndTrmedplandetailVO.trmedplandetailList', self.trmedplandetailList);
      Ajax.post('/hospitalTrmedplan/commitTrmedplan', self.trmedplanAndTrmedplandetailVO)
          .then(function(response) {
            var data = response.data.data;
            if (response.data.errorCode == 0) {
              self.$set('hospitalBillTypeVO', data);
              self.$set('twoStep', true);
              self.$set('oneStep', false);
              self.medPlanBillNo = self.trmedplan.billno;
              self.trmedplan = {};
              self.trmedplandetailList = [];
            } else {
              layer.msg(response.data.message);
            }
      })
    },
  },
  route:{
    activate : function(){
      this.getListTrmedplan();
   }
  }
};
</script>