<template>
	<div>
		<div class="container resource close-left-menu" style="min-height: 491px;">
			<div class="pop-banner clearfix">
				<div class="operate-btns">
					<a @click="allotToMedList()" class="fbtn fb-submit">批量指定</a>
				</div>
				<h3 class="current-module">医院指定供应商</h3>
			</div>
			<!--suppliername start 分配供应商-->
			<div class="purchase-add-plan">
				<div class="supplylist clearfix supply-select">
					<div class="supplylist-table ml-0">
						<div class="min-search min-search-green " style="display: inline-block;border-right:0px; margin: 10px 10px;" v-if="isShowPage">
							<input class="min-search-txt" v-model="hosSearch.medname" style="border-right:0px;" placeholder="医院名称">
							<button class="min-search-btn" v-on:click="getAllHos()" style="margin-left:0px;"></button>
						</div>
						<div id="leftCtable" class="ctable ct-parentr">
							<div class="ct-head">
								<span class="ct-col w60">序号</span>
								<span class="ct-col w350">医疗机构	</span>
								<span class="ct-col w200">联系人</span>
								<span class="ct-col w230">联系电话</span>
								<span class="ct-col w130">操作</span>
							</div>
							<div class="ct-row pb20" v-if="getHosList.length==null || getHosList.length==0">
								<div class="row-line">
									<span class="ct-col" style="width: 1003px;">    暂无数据    </span>
								</div>
							</div>
							<div class="ct-row" id="div1{{$index}}" v-for="(indOne,hos) in getHosList">
								<div class="row-line">
									<span class="ct-col w60"> {{$index + 1}}       </span>
									<span class="ct-col w350 pr5">{{hos.name}}      </span>
									<span class="ct-col w200">{{hos.linkman }}  </span>
									<span class="ct-col w230">{{hos.contacttel }}      </span>
									<span class="ct-col w130"><a class="btn-d btn-d-activate" @click="slidedown($index)">指定供应商</a></span>
								</div>
								<div class="row-launch clearfix pd0" v-show="sh1">
									<div class="min-search min-search-green " style="display: inline-block;border-right:0px; margin: 30px 10px;">
										<input class="min-search-txt" v-model="search[indOne].suppliername" style="border-right:0px;" placeholder="供应商名称">
										<button class="min-search-btn" v-on:click="getSup(indOne)" style="margin-left:0px;"></button>
									</div>
									<table class="itable mb-30">
										<thead>
											<tr>
												<th class="w60">
													<div class="checkbox-control">
														<input type="checkbox" :id="indOne" v-model="hos.selectAllList" :value="indOne" @change="selectAll(hos.selectAllList,indOne)">
														<label class="checkbox" style="line-height: 19px;" :for="indOne">序号</label>
													</div>
												</th>
												<th class="w100">医院供应商名称</th>

												<th class="w100">供应商名称</th>
												<th class="w60">联系人</th>
												<th class="w100">电话</th>
												<th class="w60">供应商更新日期</th>

											</tr>
										</thead>
										<tbody>
											<tr v-if="getSupList[indOne]==null || getSupList[indOne]==0">
												<td colspan="9">暂无符合条件的记录</td>
											</tr>
											<tr v-for="(indTwo,sup) in getSupList[indOne]">
												<td class="pt7">
													<div class="checkbox-control">
														<input type="checkbox" :id="sup.guid+indOne+indTwo" v-model="selectSup[indOne]" :value="hos.guid+'/'+hos.name+'/'+sup.guid+'/'+sup.chinesename+'/'+sup.helpcode">

														<!--<input type="checkbox" :id="sup.guid+indOne+indTwo" v-model="sup.checkArr" :value="sup.guid+'/'+indOne+'/'+indTwo" @click="checkfun(sup.checkArr,indOne,indTwo)">-->
														<label class="checkbox" :for="sup.guid+indOne+indTwo">{{ $index + 1 }}</label>
													</div>
												</td>
												<td>
													{{sup.chinesename}}
												</td>
												<td>{{sup.chinesename}} </td>
												<td>{{sup.contacts}} </td>
												<td>{{sup.contacttel}} </td>
												<td>{{sup.updateTime|getYMD}} </td>

											</tr>
										</tbody>
									</table>
									<div class="pagination mt-20 mb-40">
										<pagination @page-change="getSup(indOne)" :class="['m-20-0']" :page-no.sync="search[indOne].page" :total-pages.sync="search[indOne].totalPages">
										</pagination>
									</div>
									<div class="zip" style="bottom: -1px;" @click="slideup($index)"></div>
								</div>
							</div>
						</div>

					</div>
					<div class="pagination mt-20" v-if="isShowPage">
						<pagination @page-change="getAllHos()" :class="['m-20-0']" :page-no.sync="hosSearch.page" :total-pages.sync="hosSearch.totalPages">
						</pagination>
					</div>
				</div>
			</div>

		</div>
	</div>
</template>
<style type="text/css">
	.filed1::-ms-input-placeholder {
		text-align: right;
	}
	
	.filed1::-webkit-input-placeholder {
		text-align: right;
	}
</style>
<script>
	module.exports = {

		data: function() {
			return {
				// 分页
				search: [],
				// 医院分页
				hosSearch: {
					pageSize: 50,
					page: 1,
					totalPages: 0,
					medname: ''
				},
				getHosList: [],
				getSupList: '',
				goodsInfo: '',
				oParamList: [],
				checkArr: [], //复选框数组
				checkArrList: [],
				supCode: [],
				isShowPage: true,
				selectSup: [],
				allSelect: [],
			};
		},
		methods: {
			// 加载数据
			getHos: function() {
				this.isShowPage = false;
				this.getHosList = JSON.parse(localStorage.getItem('newHos'));
				this.init();

			},
			init: function() {
				for(let i = 0; i < this.getHosList.length; i++) {
					var obj = {
						pageSize: 10,
						page: 1,
						totalPages: 0,
						total: 0,
						suppliername: '',
						medguid: this.getHosList[i].guid,
					}
					this.$set('getHosList[' + i + '].selectAllList', false);
					this.$set('allSelect[' + i + ']', []);
					this.selectSup[i] = [];
					this.$set('search[' + i + ']', obj)
				}
			},
			getSup: function(ind) {
				var self = this;
				Ajax.post('/supplier/getMfsupplierList', self.search[ind])
					.then(function(response) {
						var data = response.data.data;
						if(response.data.errorCode == 0) {
							self.$set('getSupList[' + ind + ']', data.list);
							for(let i = 0; i < self.getSupList[ind].length; i++) {
								self.$set('getSupList[' + ind + '][' + i + '].code', '');
								self.$set('getSupList[' + ind + '][' + i + '].hosName', '');
								self.$set('getSupList[' + ind + '][' + i + '].checkArr', false);
							}

							self.$set('getHosList[' + ind + '].selectAllList', false);
							self.allSelect[ind] = self.selectSup[ind];
							self.search[ind].totalPages = data.totalPages;

						} else {
                            layer.msg(response.data.message);
						}
					})
			},
			getAllHos: function(ind) {
				var self = this;
				this.isShowPage = true;
				Ajax.post('/supplier/getMfmedList', self.hosSearch)
					.then(function(response) {
						var data = response.data.data;
						if(response.data.errorCode == 0) {
							self.$set('getHosList', data.list);
							self.hosSearch.totalPages = data.totalPages;
							self.init();
						} else {
                            layer.msg(response.data.message);

                        }
					})
			},
			selectAll: function(flag, one) {
				var self = this;

				if(flag) {
					self.getSupList[one].forEach(function(item, i) {
						var data = self.getHosList[one].guid + '/' + self.getHosList[one].name + '/' + item.guid + '/' + item.chinesename + '/' + item.helpcode;
						self.allSelect[one].push(data);
					});
					self.$set('selectSup[' + one + ']', self.allSelect[one]);
				} else {
					self.getSupList[one].forEach(function(item, i) {
						self.selectSup[one].forEach(function(sup, j) {
							var arr = sup.split("/");
							if(arr[2] == item.guid && arr[0] == self.getHosList[one].guid) {
								self.selectSup[one].splice(j, 1);
							}
						})
					});
				}

			}, //  批量指定
			allotToMedList: function() {
				var self = this;

				self.MessageBox({
					title: '提示',
					message: '确定批量指定',
					type: 'alert',
					showCancelButton: true
				}, function(action) {

					if(action == "confirm") {
						Ajax.post('/supplier/insertMfsupplyrelation', {
								list: self.oParamList
							})
							.then(function(response) {
								var data = response.data.data;
								if(response.data.errorCode == 0) {
									self.MessageBox({
										title: '提示',
										message: '操作成功！',
										type: 'alert'
									}, function(action) {
										if(self.$route.params.id == 'true') {
											localStorage.removeItem("newHos");
											self.$router.go({
												path: '/hosUsers'
											})
										} else {
											self.getAllHos();
										}
									});
								} else {
                                    layer.msg(response.data.message);

                                }
							})
					}
				})

			},

			slidedown: function(index) {
				var self = this;
				this.getSup(index);
				$(".ct-row:eq(" + index + ")").addClass("active");
				$(".row-launch:eq(" + index + ")").slideDown(400, function() {});

			},
			slideup: function(index) {
				$(".row-launch:eq(" + index + ")").slideUp(400, function() {
					$(".ct-row:eq(" + index + ")").removeClass('active');
					$(".ct-col:eq(" + index + ")").removeClass('activate');
				});
			},

		},
		watch: {
			'selectSup': function(val) {
				var self = this;
				self.oParamList = [];

				for(let i = 0; i < val.length; i++) {
					for(let j = 0; j < val[i].length; j++) {
						var arr = val[i][j].split("/");
						var oList = {
							medguid: arr[0], //医院GUID
							medname: arr[1], //医疗机构名称	
							supplierguid: arr[2], //平台供应商GUID
							medsuppliername: arr[3], //医院供应商名称  
							platformsupcode: arr[4], //招标平台供应商编码 
							medsuppliercode: arr[4], //医院供应商编码
							suppliername: arr[3], //平台供应商名称
						}
						self.oParamList.push(oList);
					}

				}
				// console.log(val)
			},

		},
		route: {
			activate: function() {
				if(this.$route.params.id == 'true') {
					this.getHos();
				} else {
					this.getAllHos();
				}
			}
		}

	};
</script>