<template>
    <div class="container resource close-left-menu">
        <div class="pop-banner clearfix">

            <div class="operate-btns">
                <a class="fbtn fb-submit" href="javascript:;" @click='pass(listArr,false)'>批量审核</a>
                <a class="fbtn fb-return" href="javascript:;" @click='down(listArr,false)'>批量驳回</a>
            </div>

            <h3 class="current-module">变更单审核</h3>
        </div>

        <!--出库单审核 start-->
        <div class="purchase-plan mt-20">

            <div class=" fast-search-form pd-form">
                <div class="group-row">
                        <div class="form-group form-label">
                        <div class="control">
                            <input type="text"  maxlength="17" v-rule v-model='search.billno' title='变更单号' placeholder="变更单号">
                        </div>
                    </div>
                    <div class="form-group form-label">
                        <div class="control">
                            <input type="text"  maxlength="17" v-rule v-model='search.wvbillno' title='入库单号' placeholder="入库单号">
                        </div>
                    </div>
                </div>
                <div class="group-row">
                    <div class="form-group form-label">
                        <div class="control control-date" style="height:34px;overflow: inherit;">
                            <div style="width: 42%;float: left">
                                <datepicker :target.sync="search.beginbilldate" :readonly="readonlyFlag" :id='cn4'
                                            title='制单开始日期' placeholder='制单开始日期'
                                            styleobj="width:100% !important;border-radius:8px 0px 0px 8px !important;"></datepicker>
                            </div>
                            <span class="text-and" style="width: 45px">至</span>
                            <div style="width: 48%;float: right;">
                                <datepicker :target.sync="search.endbilldate" :readonly="readonlyFlag" title='制单结束日期'
                                            placeholder='制单结束日期'
                                            styleobj="width:100% !important;border-radius:0px 8px 8px 0px !important;"></datepicker>
                            </div>
                        </div>
                    </div>
                    <div class="form-group form-label">
                        <div class="control">
                            <input type="text"  maxlength="20" v-rule v-model='search.suppliername' title='供应商' placeholder="供应商">
                        </div>
                    </div>
                </div>
                <div class="group-row">
                    <div class="form-group w560">
                        <label class="label w80 fl">业务状态</label>
                        <div class="control control-filtering control-filtering-green fl w400">
                            <a class="option" :class="{'all active':search.billstate==''}" href="javascript:void(0)" @click="search.billstate=''">全部</a>
                            <a class="option"
                               :class="{'all active':search.billstate=='VD02'}"
                               href="javascript:void(0)" @click="search.billstate='VD02'">待审核</a>
                            <a class="option"
                               :class="{'all active':search.billstate=='VD03'}"
                               href="javascript:void(0)" @click="search.billstate='VD03'">已审核</a>
                            <a class="option"
                               :class="{'all active':search.billstate=='VD04'}"
                               href="javascript:void(0)" @click="search.billstate='VD04'">已驳回</a>
                        </div>
                    </div>
                    <div class="group-row t-right">
                        <button class="fast-search-form-btn btn-d btn-d-lg btn-d-activate btn-d-circle" @click="getData(false)">查 询</button>
                    </div>
                </div>
            </div>
            <table class="itable itable-bordertop itable-thead-13px">
                <thead>
                <tr>
                    <th class="w80">
                        <div class="checkbox-control">
                            <input type="checkbox" id="pro.guid" v-model="allCheck"  @click="selectAllsum(allCheck)" :value="1">
                            <label class="checkbox" for="pro.guid">序号</label>
                        </div>
                    </th>
                    <th class="w180">供应商</th>
                    <th class="w210">单号</th>
                    <th class="w90">业务状态</th>
                    <th class="w120">变更日期</th>
                    <th class="w120">出库日期</th>
                    <th class="w80">操作</th>
                    <!-- <th class="w100">结算方式</th> -->
                </tr>
                </thead>
                <tbody>
                <tr v-if="getMedcontentList.length==0">
                    <td colspan="11">暂无数据！</td>
                </tr>
                <tr v-for="pro in getMedcontentList">
                    <td>
                        <div class="checkbox-control">
                            <input type="checkbox" :id="$index" v-model="pro.checked" >
                            <label class="checkbox" :for="$index">{{ $index + 1 }} </label>
                        </div>
                    </td>
                    <td class="t-left pr10">{{pro.suppliername }}</td>
                    <td class="t-left pr10">
                        <div class="t-left pr10">
                                     变更：{{pro.billno}} <br>
                                     入库：{{pro.mvbillno}}
                        </div>
                    </td>
                    <td>{{pro.billstate | billstate_trdoh}} </td>
                    <td>{{pro.variationdate | getYMD}} </td>
                    <td>{{pro.inputdate | getYMD}}</td>
                    <td>
                        <a class="btn button-green" v-link="{path:'/outboundOrdeReviewDetail/'+ pro.guid}">明细 </a>
                    </td>
                </tr>
                </tbody>
            </table>
            <div class="pagination m-20-0">
                <em class="page">明细条目数【{{ search.total }}】</em>
                <pagination @page-change="getData(true)" :class="['m-20-0']" :page-no.sync="search.page" :total-pages.sync="search.totalPages">
                </pagination>
            </div>
        </div>
        <div class="modal" v-show='showPopupUp'>
            <div class="pop-refused-reason" style="z-index:10;left:35%;top:35%;">
                <div class="pop-rr-tit text-color-blue" style="text-align:left;">驳回理由</div>
                <textarea class="input-border" v-model="reason" style='width:100%;'></textarea>
                <div class="from-button fr mt-10">
                    <a href="javascript:;" class="red-button p-lr-10" @click="showPopupUp=false">取 消<i style='font-style: inherit'>|</i></a>
                    <a href="javascript:;" class="green-button p-lr-10" @click="submit">确 定</a>
                </div>
            </div>
        </div>
        <!--出库单审核 end-->
    </div>
</template>
<script>
    module.exports = {
        data: function() {
            return {
                getMedcontentList: [],
                getDistributions: [],
                search: {
                    pageSize: 50,
                    page: 1,
                    totalPages: 0,
                    total: 0,
                    billno:'',
                    wvbillno:'',
                    suppliername:'',
                    beginbilldate: this.GetDate().begindate,
                    endbilldate: this.GetDate().enddate,
                    billstate:''
                },
                updateDisList: [], //复选框勾选的数据
                listArr:[],
                showPopupUp:false,
                reason:'',
                downitem:{},
                falg:true,
                endbilldate:{
                    createBeginTime:'',
                    createBndTime:'',
                    medname:'',
                    billno:'',
                    settlestate:'J2',
                    suppliername:'',
                    contentstate: '',
                    goodsinfo:''
                },
                MedcontentListNUM:0,
                getMedcontentList2num:0,
                checkArr:[],
                //删除不用的属性
                deletList:['auditordate','auditorguid','auditorname','billno','billstate','billtype','checked','contentguid','countsum','createTime','detailsum','inputdate','medguid','medname','operaterguid','operatername','rejectdate','supplierdobillno','supplierdoguid','supplierguid','suppliername','supplierpobillno','supplierpoguid','updateTime','variationdate']
            };
        },

        methods: {
            selectAllsum: function(flag) {
                var self = this;
                self.checkArr = [];
                if(!flag) {
                    self.getMedcontentList.forEach(function(item, i) {
                        var data = item.guid + '/' + item.begindate + '/' + item.enddate +'/'+ item.paystate +'/'+ item.isShowButton;
                        self.checkArr.push(data);
                    });
                } else {
                    self.$set('checkArr', []);
                }
            },
            getData:function(falg){
                var self=this;
                if(!falg){
                    self.search.page=1;
                }
                Ajax.post('/hospitalTrmedwv/getTrvariationdoList',self.search).
                then(function(response){
                    var data = response.data.data;
                    if(response.data.errorCode==0){
                        self.$set("getMedcontentList", data.list);
                        self.search.totalPages = data.totalPages;
                        self.search.total = data.total;
                        self.MedcontentListNUM = data.total;
                    }

                })
            },
            del:function(obj,keys){
                keys.forEach(function (index) {
                    delete obj[index]
                })
                return obj;
            },
            pass:function(item,falg,n){
                var self=this;
                var volist=[];
                if(falg){
                    item.contentguid=item.guid;
                    volist.push(item);
                }else{
                    for(var a=0;a<item.length;a++){
                        volist.push(item[a].guid);
                    }
                }
                if(volist == null || volist == ''){
                    self.MessageBox({title:'提示',message:"请勾选数据!",type:'alert'});
                    return;
                }
                Ajax.post('/hospitalTrmedwv/auditTravriationdo',{'guids':volist})
                    .then(function(response) {
                        var data = response.data.data;
                        self.allCheck = '';
                        self.search.goodsinfo = '';
                        if(data){
                            self.MessageBox({
                                title: '提示',
                                message: '操作成功!',
                                type: 'alert'
                            }, function(action) {
                                window.location.reload();
                            });
                        }else{
                            self.MessageBox({title:'提示',message:response.data.message,type:'alert'});
                        }
                    })
            },
            submit:function(){
                var self=this;
                var item=self.downitem;
                var volist=[];
                var falg=self.falg;

                if(self.reason.trim()==''){
                    self.MessageBox({title:'提示',message:"请输入驳回理由!",type:'alert'});
                    return;
                }else{
                    self.showPopupUp=false;
                }
                if(falg){
                    item.contentguid=item.guid;
                    volist.push(item);
                }else{
                    for(var a=0;a<item.length;a++){
                        volist.push(item[a].guid);
                    }
                }
                if(volist == null || volist == ''){
                    self.MessageBox({title:'提示',message:"请勾选数据!",type:'alert'});
                    return;
                }
                Ajax.post('/hospitalTrmedwv/rejectTrvariationdo',{'guids':volist,'rejectreason':self.reason})
                    .then(function(response) {
                        var data = response.data.data;
                        if(data){
                            self.MessageBox({
                                title: '提示',
                                message: '操作成功!',
                                type: 'alert'
                            }, function(action) {
                                window.location.reload();
                            });
                        }else{
                            self.MessageBox({title:'提示',message:"操作失败!",type:'alert'});
                        }
                    })
            },
            down:function(item,falg){
                var self=this;
                if(!falg && item.length == 0){
                    self.MessageBox({title:'提示',message:"请勾选数据!",type:'alert'});
                    return;
                }
                self.showPopupUp=true;
                self.downitem=item;
                self.falg=falg;
            }

        },
        watch: {
            allCheck:function(){
                var self=this;
                for(var a=0;a<self.getMedcontentList.length;a++){
                    self.getMedcontentList.splice( a,1, Object.assign({}, self.getMedcontentList[a], { 'checked': self.allCheck}));
                }
                self.$set('getMedcontentList',self.getMedcontentList);
            },
            'getMedcontentList':{
                handler(checkbox){
                    var self=this;
                    var arr=[];
                    if(checkbox != null && checkbox != ''){
                        for( var a=0;a<checkbox.length;a++){
                            if(checkbox[a].checked){
                                arr.push(checkbox[a]);
                            }
                        }
                        self.listArr=arr;
                    }
                },
                deep:true
            },
            'search.billstate': function () {
                this.getData();
            }
        },
        route: {
            activate: function() {
                this.getData(true);
            }
        }

    };
</script>