hos-material-demand-monitoring.vue 11 KB
<style>
	.button-green {
		border: 1px solid #649fa3;
		color: #649fa3;
	}
	
	.btn {
		display: inline-block;
		border-radius: 8px;
		padding: 0 20px;
		height: 34px;
		line-height: 32px;
		font-size: 14px;
		background: inherit;
		text-decoration: none !important;
	}
	
	.button-green:hover {
		color: #fff;
		background: #649fa3;
	}
</style>
<template>
	<div class="container resource close-left-menu">
		<div class="pd-form fast-search-form">
		            <div class="group-row">
			            <div class="form-group">
			                    <label class="label">所在省</label>
			                    <div class="control">
			                        <select v-model="search.province" class="inp3">
			                            <option value="">&nbsp;全部</option>
			                            <option v-for="item in areaList" :value="item.province">&nbsp;{{item.province}}</option>
			                        </select>
			                    </div>
			                </div> 
			            <div class="form-group">
			                    <label class="label">所在市</label>
			                    <div class="control">
			                        <select v-model="search.city" class="inp3">
			                            <option value="">&nbsp;全部</option>
			                            <option v-for="ci in cityList" :value="ci.city">{{ci.city}}({{ci.number}})</option>
			                        </select>
			                    </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="pop-banner clearfix">
			<div class="operate-btns">
				<!-- <a href="javascript:;" class="fbtn" @click='allAdd'>全部生成供应关系</a> -->
			</div>
			<h3 class="current-module">自动注册用户监控</h3>
		</div>
		<div class="f-size16 text-color-green">
			<span class="fl ml-198">今日新增注册数<b class="text-color-red"> {{getRegistSumList.one}}</b></span>
			<span class="fl ml-120">近3日新增注册数 <b class="text-color-red"> {{getRegistSumList.three}}</b></span>
			<span class="fl ml-120">近7日新增注册数<b class="text-color-red"> {{getRegistSumList.seven}}</b></span>
		</div>
		<div id='ecstyle' style='width:100%;height:400px;padding-top:60px;padding-bottom: 30px;'></div>
		<!--supply-productlist start-->
		<div class="ctable ct-parent mt-20">
		            <div class="ct-head">
		                <span class="ct-col w60">序号</span>
		                <span class="ct-col w130">医院</span>
		                <span class="ct-col w100">发布时间</span>
		                <span class="ct-col w120">联系方式</span>
		                <span class="ct-col w120">物资信息</span>
		                <span class="ct-col w80">数量</span>
		                <span class="ct-col w60">单位</span>
		                <span class="ct-col w80">响应数量</span>
		                <span class="ct-col w80">响应供应商</span>
		                <span class="ct-col w80">状态</span>
		                <span class="ct-col w80">备注说明</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 w130 t-left pr10">{{cus.medname}}</span>
		                    <span class="ct-col w100 pr10">{{cus.pubtime | getYMD}}</span>
		                    <span class="ct-col w120 t-left pr10">
		                      {{cus.contacts}} / {{cus.contactsdept}}
		                      <br>
		                      {{cus.tel}}
		                      <br>
		                      {{cus.address}}
		                      <br>
		                </span>
		                <span class="ct-col w120 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 w80 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">
		                        {{cus.issatisfy == 'Y'?'满足':'未满足'}}
		                    </span>
		                    <span  class="ct-col w80">
		                        {{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" style="bottom: 0px;" @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>
<script>
	var echarts_api1 = require('../../options/echarts_api.js');
	module.exports = {
		data: function() {
			return {
				getRegistSumList:'',
				hospitalProductList: [],
				search: {
					pageSize: 10,
					page: 1,
					totalPages: 0
				},
			};
		},
		methods: {
			getRegistSum: function() {
				var self = this;
				Ajax.post('/supplier/getRegistSum')
					.then(function(response) {						
						var data = response.data.data;
						if(response.data.errorCode == 0) {
				            			self.$set('getRegistSumList',data);
						} else {
				                            	layer.msg(response.data.message);
				                        	}
					})
			},
			getRegistSupplierList: function() {
				var self = this;
				Ajax.post('/supplier/getRegistSupplierList',self.search)
					.then(function(response) {						
						var data = response.data.data;
						if(response.data.errorCode == 0) {
				            			self.$set('hospitalProductList',data.list);						
							self.search.totalPages = data.totalPages;
						} else {
				                            	layer.msg(response.data.message);
				                        	}
					})
			},
			getData: function() {
				var self = this;
				Ajax.post('/supplier/getAutoRegistList')
					.then(function(response) {						
						var data = response.data.data;
						if(response.data.errorCode == 0) {	
							self.echartsList('ecstyle',data);
						} else {
				                            	layer.msg(response.data.message);
				                        	}
					})
			},
			    echartsList:function(sty,echlist){ 
			      var self=this; 
			        var namess=[];
			        var valuess1=[];
			        var valuess=[];
			        // var color=['#4472c4','ed7d31'];
			        for(var i=0;i<echlist.length;i++){
			          namess.push(echlist[i].date);
			          valuess1.push(echlist[i].allcount);
			          valuess.push(echlist[i].count);
			        }
			       this.chartsty=echarts_api1.init(sty,{
			            title: {
			            	left:'423',
			              text: '自动注册用户增长趋势',
			          },
			          color:['#4472c4','#ed7d31'],
			          tooltip : {
			              trigger: 'axis',
			              axisPointer: {
			                  type: 'cross',
			                  label: {
			                      backgroundColor: '#6a7985'
			                  }
			              }
			          },
			          legend: {
			          	left:'0',
			              data:['累计数量','较昨日新增']
			          },
			          toolbox: {
			              feature: {
			                  saveAsImage: {}
			              }
			          },
			          grid: {
			              left: '3%',
			              right: '4%',
			              bottom: '3%', 
			              containLabel: true
			          },
			          xAxis : [
			              {
			                  type : 'category',
			                  boundaryGap : true,
			                  data : namess,
			              }
			          ],
			          yAxis : [
			              {
			                  type : 'value', 
			                  minInterval:1,
			                  min:0,
            				     max:25,
			              }
			          ],
			          series : [
			              {
			                  name:'累计数量',
			                  type:'line',
			                  stack: '总量',
			                  data:valuess1,
			              },
			              {
			                  name:'较昨日新增',
			                  type:'line',
			                  stack: '总量',
			                  data:valuess,
			              },
			          ]
			        },sty) 
			    },	
		},
		route: {
			activate: function() {
				var self=this; 
				self.getRegistSupplierList();
				self.getRegistSum();
				window.setTimeout(function (){
			                self.getData();
			            },1000);
			}
		}
	};
</script>