PC-application/component/statistics/renew-progress-filter.js

(function(){
    Vue.component('renew-progress-filter',{
        template:'<div style="height: 400px;overflow: auto;margin-bottom: 50px;">\
				<div class="ml10 filter-title">统计维度</div>\
				<div class="div-content" @click="contentClick">\
					<div class="mt20 div-group-btn c-row ml40">\
						<div class="div-btn c-33 active" data-lowCode="">\
							<a href="#" class="f-fs14">所有居民</a>\
						</div>\
						<div class="div-btn c-33" data-lowCode="3">\
							<a href="#" class="f-fs14">65岁以上签约</a>\
						</div>\
						<div class="div-btn c-33" data-lowCode="1">\
							<a href="#" class="f-fs14">高血压</a>\
						</div>\
					</div>\
					<div class="mt20 div-group-btn c-row ml40">\
						<div class="div-btn c-33" data-lowCode="2">\
							<a href="#" class="f-fs14">糖尿病</a>\
						</div>\
					</div>\
				</div>\
				<div id="footer">\
					<div class="c-row btn-wrap c-border-top fr">\
						<div class="div-foot-btn mr20" @click="resetClick">\
							<a href="#" class="c-666 f-fs16">重置</a>\
						</div>\
						<div class="div-foot-btn active" @click="confirmClick">\
							<a href="#" class="c-666 f-fs16">保存</a>\
						</div>\
					</div>\
				</div>\
			</div>',
        props:['contentHtml'],
        data: function(){
            return {
                
            }
        },
        methods: {
	         contentClick:function(){
	         	$(".div-content").find(".div-btn").removeClass('active');
	         	$(event.target.closest("div")).addClass('active');
	         },
	         resetClick:function(){
				$(".div-content").find(".c-33").removeClass("active");
				$(".div-content").find(".c-33").eq(0).addClass("active");
	         },
	         confirmClick:function(){
	         	var vm = this;
	         	var $type = $(".div-content .div-btn.active"),
                    typeCode = $type.attr("data-val"),
                    lowCode = $type.attr("data-lowCode"),
                    name = $type.find("a").html();
	         	console.log("lowCode:"+lowCode)
	         	console.log("name:"+name)
				//触发刷新
				this.$emit('vuedals:close', {
					lowCode: lowCode,
					name: name,
					contentHtml:$(".div-content").html()
				});
	         }
        },
        mounted: function(){
        	if(this.contentHtml){
        		$(".div-content").html(this.contentHtml);
        	}
        }
    });
    
})()