response-list.vue 12.9 KB
<!--出库单汇总-->
<script>

    module.exports = {
        data: function () {
            return {
                // 医院
                hosList: [],
                // 明细数据
                mxList: [],
                // 订单总数量
                totalNum:0,
                // 查询条件
                search: {
                    pageSize: 50,
                    page: 1,
                    totalPages: 0,
                    goodsinfo: '',// 出库单号
                    starttime: '',// 出库日期 起
                    endtime: '',// 出库日期 止
                    flag:'',// 业务状态
                    isSatisfy:'',
                    province:'',
                    city:'',
                    area:''
                },
                getFlagCountList:"",
                getStateCountList:"",
                // 日期控件
                readonlyFlag:false,
                detailList:[],
                subFlage:false,
                shower:false,
                shower2:false
            };
        },
        methods: {
            // 获取数据
            getData:function(){
                var self = this;
                if(self.search.province == '请选择'){
                    self.search.province = '';
                }
                if(self.search.city == '请选择'){
                    self.search.city = '';
                }
                if(self.search.area == '请选择'){
                    self.search.area = '';
                }
                self.$set('mxList',[]);
                self.shower=true
                Ajax.post('/procurment/getDemandPublishList', this.search)
                    .then(function (response){
                        var data = response.data.data;
                        self.$set('mxList',data.list);
                        self.shower=false
                        self.search.pageno = data.pageno;
                        self.search.totalPages = data.totalPages;
                        self.search.total = data.total;
                    })
            },
            // 发布状态数量统计
            getFlagCount:function(){
                var self = this;
                Ajax.post('/procurment/getFlagCount',{})
                    .then(function (response){
                        var data = response.data.data;
                        self.$set('getFlagCountList',data);
                    })
            },
            // 需求状态数量统计
            getStateCount:function(){
                var self = this;
                Ajax.post('/procurment/getStateCount',{})
                    .then(function (response){
                        var data = response.data.data;
                        self.$set('getStateCountList',data);
                    })
            },
            //获取品规数
            getDetail:function(guid,rowno){
                var self = this;
                self.shower2=true;
                Ajax.post('/procurment/getDetails',{'guid':guid,'rowno':rowno,})
                    .then(function (response){
                        var data = response.data.data;
                        self.$set('detailList',data);
                        self.shower2=false;
                    })
            },
            slidedown:function(index,guid,rowno){
                var self = this;
                self.getDetail(guid,rowno);
                $('#warp2' + index).find(".row-launch").slideDown(400, function () {
                    $('#warp2' + index).siblings().find(".row-launch").slideUp(400)
                    $('#warp2' + index).siblings().find(".isFocus").removeClass("focus");
                    $('#warp2' + index).find(".isFocus").addClass("focus active");
                })

            },
            slideup:function(index){
                $('#warp2' + index).find(".row-launch").slideUp(400, function () {
                    $('#warp2' + index).removeClass('active');
                    $('#warp2' + index).find(".isFocus").removeClass("focus");
                })
            },
        },
        route: {
            activate: function () {
                this.getData();
                this.getFlagCount();
                this.getStateCount();
            }
        },
        watch:{
            'search.flag': function(val) {
                this.getData();
            },
            'search.isSatisfy': function(val) {
                this.getData();
            },
        },
    };
</script>

<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">地区</label>
                    <div class="control">
                        <city :province.sync="search.province" :city.sync="search.city" :area.sync="search.area"></city>
                    </div>
                </div> -->
                <div class="form-group form-label">
                    <!-- <label class="label w80" for="cn6">物资</label> -->
                    <div class="control">
                        <input type="text" v-model="search.goodsinfo" placeholder="请输入物资信息过滤" title="请输入物资信息过滤">
                    </div>
                </div>
                <div class="form-group form-label">
                    <label class="label" for='cn25'>发布日期</label>
                    <div class="control control-date inp2" style="height:34px;overflow: inherit;width: 100%;padding-left: 69px; background: #fff;">
                        <div style="width:44%;float:left;height:32px;">
                            <datepicker :target.sync="search.starttime" :readonly="readonlyFlag" title='发布开始日期' placeholder='发布开始日期' styleobj="width:100% !important;border-radius:8px 0px 0px 8px !important;"></datepicker>
                        </div>
                        <span class="text-and">-</span>
                        <div style="width:48%;float:left;height:32px;">
                            <datepicker :target.sync="search.endtime" :readonly="readonlyFlag" title='发布结束日期' placeholder='发布结束日期'
                                        styleobj="width:100% !important;border-radius:0px 8px 8px 0px !important;"></datepicker>
                        </div>
                    </div>
                </div>
            </div>
            <div class="group-row">
            <div class="form-group" style='width:480px;'>
                    <label class="label w70">发布状态</label>
                    <div class="control control-filtering control-filtering-green fl w300">
                        <a class="option" href="javascript:;" :class="{'all active':search.flag==''}" v-on:click="search.flag=''">全部</a>
                        <a class="option" href="javascript:;" :class="{'all active':search.flag=='Y'}" v-on:click="search.flag='Y'">新发布({{getFlagCountList[0].np}})</a>
                        <a class="option" href="javascript:;" :class="{'all active':search.flag=='N'}" v-on:click="search.flag='N'">已响应({{getFlagCountList[1].yp}})</a>
                    </div>
                </div>
                <div class="form-group" style='width:460px;'>
                    <label class="label w70">需求状态</label>
                    <div class="control control-filtering control-filtering-green fl w300">
                        <a class="option" href="javascript:;" :class="{'all active':search.isSatisfy==''}" v-on:click="search.isSatisfy=''">全部</a>
                        <a class="option" href="javascript:;" :class="{'all active':search.isSatisfy=='Y'}" v-on:click="search.isSatisfy='Y'">满足({{getStateCountList[1].y}})</a>
                        <a class="option" href="javascript:;" :class="{'all active':search.isSatisfy=='N'}" v-on:click="search.isSatisfy='N'">未满足({{getStateCountList[0].a - getStateCountList[1].y}})</a>
                    </div>
                </div>
            </div>
            <div class="group-row t-right">
                <button v-on:click="getData()" class="fast-search-form-btn btn-d btn-d-lg btn-d-activate btn-d-circle">查 询</button>
            </div>
        </div>
        <div 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 w180">联系方式</span>
                <span class="ct-col w160">物资信息</span>
                <span class="ct-col w80">数量</span>
                <span class="ct-col w60">单位</span>
                <span class="ct-col w80">响应数量</span>
                <span class="ct-col w100">响应供应商</span>
                <span class="ct-col w80">状态</span>
                <span class="ct-col w100">备注说明</span>
            </div>
            <div v-if="shower" style="height: 100px;
                text-align: center;
                font-size: 20px;
                line-height: 100px;
                font-weight: 500;">数据正在加载中...</div>
            <div class="ct-row mt-0 pt10" id="warp2{{$index}}" v-for="(one,cus) in mxList" track-by="$index">
                <div class="row-line" v-else>
                    <span class="ct-col w60">{{$index+1}}</span>
                    <span class="ct-col w100 pr10">{{cus.pubtime | getYMD}}</span>
                    <span class="ct-col w180 t-left pr10">
                      {{cus.contacts}} / {{cus.contactsdept}}
                      <br>
                      {{cus.tel}}
                      <br>
                      {{cus.address}}
                      <br>
                </span>
                <span class="ct-col w160 t-left pr10">{{cus.goodsname}}<br>{{cus.goodstype | goodscateresponse}}<br>{{cus.goodsspec}}<br>{{cus.executivestandard}}</span>
                <span class="ct-col w80">{{cus.qty == 999999.99?'不限':cus.qty}}</span>
                <span class="ct-col w60">{{cus.unitstyle}}</span>
                <span class="ct-col w80">{{cus.resqty}}</span>
                    <span  class="ct-col w100 activate isFocus">
                      <a href="javascript:;" @click="slidedown($index,cus.guid,cus.rowno)"  class="txt_underline  status-switch text-color-blue">{{cus.supcount}}</a>
                   </span>
                    <span  class="ct-col w80">
                    <div v-if="cus.issatisfy == 'Y'" style="color: #4fa1a4">{{cus.issatisfy == 'Y'?'满足':'未满足'}}</div>
                    <div style="color: red" v-else>{{cus.issatisfy == 'Y'?'满足':'未满足'}}</div>
                    </span>
                    <span  class="ct-col w100">
                        {{cus.note}}
                    </span>
                </div>
                <div class="row-launch" style="display: none;">
                    <table class="itable mb-15">
                        <thead>
                        <tr>
                            <th class="w50">序号</th>
                            <th class="w120">单位名称</th>
                            <th class="w100">联系人</th>
                            <th class="w100">联系电话</th>
                            <th class="w120">响应数量</th>
                            <th class="w120">响应时间</th>
                        </tr>
                        </thead>
                        <tbody>

                        <tr v-if="shower2">
                            <td colspan="12">数据正在加载中...</td>
                        </tr>
                        <tr v-if="detailList==null || detailList.length==0&&!shower2">
                            <td colspan="12">暂无符合条件的记录</td>
                        </tr>
                        <tr v-for="(index,variation) in detailList" v-if="!shower2">
                            <td >{{ $index + 1 }}</td>
                            <td>{{variation.suppliername}}</td>
                            <td>{{variation.contacts}}</td>
                            <td>{{variation.tel}}</td>
                            <td>{{variation.responseqty}}</td>
                            <td>{{variation.responsetime}}</td>
                        </tr>
                        </tbody>
                    </table>
                    <div class="zip" @click="slideup($index)"></div>
                </div>

            </div>
            <!--      <div class="mt-20" style="text-align: center" v-if="getTrMedDeptDoList.length==0">
                     未查询到相关数据!
                 </div> -->
            <div class="pagination" style="margin: 20px 0">
                <pagination @page-change="getData" :class="['m-20-0']" :page-no.sync="search.page"
                            :total-pages.sync="search.totalPages"></pagination>
            </div>
        </div>

    </div>

</template>