var TemplateItemsSelect = {
    template: '<div style="height: 100%;">\
    				<div class="title-name c-f16">\
	    				<span class="c-vam mr15">项目表</span><img @click="goBack" src="../../../images/fanhui02_icon.png" class="c-vam"/>\
	    			</div>\
	    			<div class="search-warp">\
						<input class="inp-search" v-model="searchName" placeholder="搜索项目名称" @input="debounceSearch"/>\
					</div>\
	    			<div class="mt10 pt10 pl10 ul-wrap">\
		    			<ul>\
							<li v-for="(s,i) in items" class="list-item c-f16" :class="{\'arrow-r\': !s.dropdown, \'arrow-d\': s.dropdown}" >\
								<span @click.stop="s.dropdown=!s.dropdown">{{itemType[s.itemType]}}</span>\
								<ul class="level-sec" v-show="s.dropdown">\
									<li v-for="(g, j) in s.item" class="list-item c-f14 ml15 mt15" :class="{\'arrow-r\': !g.dropdown, \'arrow-d\': g.dropdown}">\
										<span @click.stop="g.dropdown=!g.dropdown">{{g.itemName}}</span>\
										<ul class="level-third" v-show="g.dropdown" >\
											<li v-for="(o, k) in g.hospitalServiceItems" class="mt15" v-show="o.show">\
												<div class="list-item-name pl10 c-nowrap mr5">{{o.specialistServiceItemDO.title}}</div>\
												<a href="javascript:void(0);" @click="addItem(o)" class="add-item-btn" :class="{\'disabled\': !o.enable}">\
													添加\
												</a>\
											</li>\
										</ul>\
									</li>\
								</ul>\
							</li>\
						</ul>\
	    			</div>\
    			</div>',
    props: [],
    data: function() {
        return {
        	isNew: null,
        	searchName: "",
        	itemType: ["", "诊疗服务", "健康服务"],
        	items: [
//      		{
//      			name: "健康服务",
//      			dropdown: false,
//      			items: [
//      				{
//      					name: "门诊",
//      					dropdown: false,
//      					items: [
//      						{
//      							name: "专科医师每周两次查房，指导药物调整和诊疗",
//      							enable: true
//      						},
//      						{
//      							name: "专科医师每周两次查房，指导药物调整和诊疗",
//      							enable: false
//      						}
//      					]
//      				}
//      			]
//      		}
        	]
        }
    },
    beforeRouteEnter: function(to, from, next) {
	    next(function(vm) {
	    	var query = vm.$route.query
	    	if(vm.isNew == true || vm.isNew === "true") {
	    		vm.isNew = true
	    	} else {
	    		vm.isNew = false
	    	}
	    	vm.templateId = query.templateId
//	    	if((to.path == "/template-items" || to.path=="/template-item-detail") 
//	    	&& (from.path != "/template-item-detail" || from.path == "/")) {
//	    		
//	    	}

			if((to.path == "/template-item-detail" || from.path == "/template-item-detail" ) && from.path != "/") {
				return 
			}
			if(!vm.isNew) {
				vm.loading.show()
				vm.findTemplateDetail().then(function(res) {
					if(res.status == 200) {
						var selected = res.data
						var selectedIds = _.pluck(selected, "id")
						vm.findServiceItemsByHospital().then(function() {
							_.each(vm.items, function(o) {
				    			_.each(o.item,function(g) {
				    				_.each(g.hospitalServiceItems, function(v) {
				    					if(_.contains(selectedIds, v.id)) {
				    						v.enable = false
				    						EventBus.$emit("add-template-item", v)
				    					} else {
				    						v.enable = true
				    					}
				    				})
				    			})
				    		})
							vm.loading.close()
						}).catch(function(e) {
							vm.loading.close()
							console.error(e)
						})
					} else {
						vm.loading.close()
						toastr && toastr.error(res.msg)
					}
				})
			} else {
				vm.findServiceItemsByHospital()
			}
	    	
	    })
	 },
	created: function() {
		
	},
    mounted: function() {
    	var vm = this
		
    },
    methods: {
    	goBack: function() {
    		this.$router.replace('/');
    	},
    	addItem: function(o) {
    		o.enable = false
    		EventBus.$emit("add-template-item", o)
    	},
    	debounceSearch: _.debounce(function() {
			var vm = this
			if(vm.searchName.trim()) {
				_.each(vm.items, function(o) {
					o.dropdown = true
	    			_.each(o.item,function(g) {
	    				g.dropdown = true
	    				_.each(g.hospitalServiceItems, function(v) {
	    					if(v.specialistServiceItemDO.title.indexOf(vm.searchName)>-1) {
	    						v.show = true
	    					} else {
	    						v.show = false
	    					}
	    				})
	    			})
	    		})
			} else {
				_.each(vm.items, function(o) {
	    			_.each(o.item,function(g) {
	    				_.each(g.hospitalServiceItems, function(v) {
	    					v.show = true
	    				})
	    			})
	    		})
			}
    		
		}, 500, false),
		findServiceItemsByHospital: function(){
			var vm = this
		 	return rehaAPI.findServiceItemsByHospital({
		 		doctor: storage.docInfo.code
		 	}).then(function(res) {
	    		var items = res.data[0]
	    		vm.items = _.map(items, function(o) {
	    			o.dropdown = false
	    			o.item = _.map(o.item,function(g) {
	    				g.dropdown = false
	    				_.each(g.hospitalServiceItems, function(v) {
	    					v.enable = true
	    					v.show = true
	    				})
	    				return g
	    			})
	    			
	    			return o
	    		})
	    	})
		},
		findTemplateDetail: function() {
    		var vm = this
    		return rehaAPI.findTemplateDetail({
    			templateId: vm.templateId
    		}).then(function(res) {
    			return res
    		})
    	},
    }
}