Vue.component('cvdm-overview', {
	template:
		'<div>' +
			'<el-row>' +
				'<h1 style="text-align: center">Use of Medications to Prevent Major Cardiovascular Events in Persons with Diabetes (CVDM)</h1>' +
			'</el-row>' +
			'<el-row id="cvdm-description" class="scrollspy">' +
				'<h2>Description</h2>' +
			'</el-row>' +
			'<el-row>' +
				'<p>The percentage of individuals &ge;18 years of age who have type 2 diabetes and established atherosclerotic cardiovascular disease (ASCVD) that are prescribed a glucagon-like peptide-1 (GLP-1) receptor agonist or sodium-glucose cotransporter-2 (SGLT-2) inhibitor with proven cardiovascular benefit during the measurement year.</p>' +
				'<p>A higher rate indicates better performance.</p>' +
			'</el-row>' +
			'<el-row id="cvdm-add-info" class="scrollspy">' +
				'<h2>Additional Information</h2>' +
			'</el-row>' +
			'<el-row>' +
				'<el-col :span="6">' +
					'<p><b>Intended Use</b></p>' +
				'</el-col>' +
				'<el-col :span="18">' +
					'<p>Performance measurement for health plans.</p>' +
				'</el-col>' +
			'</el-row>' +
			'<el-row>' +
				'<el-col :span="6">' +
					'<p><b>Data Sources</b></p>' +
				'</el-col>' +
				'<el-col :span="18">' +
					'<p>Medical and prescription claims data.</p>' +
				'</el-col>' +
			'</el-row>' +
			'<el-row>' +
				'<el-col :span="6">' +
					'<p><b>Denominator</b></p>' +
				'</el-col>' +
				'<el-col :span="18">' +
					'<p>Individuals with a diagnosis of type 2 diabetes and established ASCVD.</p>' +
				'</el-col>' +
			'</el-row>' +
			'<el-row>' +
				'<el-col :span="6">' +
					'<p><b>Exclusions</b></p>' +
				'</el-col>' +
				'<el-col :span="18">' +
					'<ul>' +
						"<li>End-Stage Renal Disease (ESRD)</li>" +
						"<li>Heart Failure</li>" +
						"<li>Hospice</li>" +
						'<li>Pregnancy</li>' +
					'</ul>' +
				'</el-col>' +
			'</el-row>' +
			'<el-row>' +
				'<el-col :span="6">' +
					'<p><b>Numerator</b></p>' +
				'</el-col>' +
				'<el-col :span="18">' +
					'<p>Individuals with &ge;1 prescription claims for a GLP-1 receptor agonist or SGLT-2 inhibitor with a proven cardiovascular benefit during the measurement year.</p>' +
				'</el-col>' +
			'</el-row>' +
		'</div>'
});

Vue.component('cvdm-ref-1', {
  template: 
    '<el-popover placement="top-start" width="400" trigger="hover">' +
      '<span></span>' +
      '<sup slot="reference">1</sup>' +
    '</el-popover>'
});

Vue.component('cvdm-rationale', {
	template: 
		'<div>' +
			'<el-row id="cvdm-rationale" class="scrollspy">' +
				'<h2>Rationale</h2>' +
			'</el-row>' +
			'<el-row>' +
               "<p></p>" +
			'</el-row>' +
		'</div>'
});

Vue.component('cvdm', {
	template:
		'<div id="cvdm" class="search-filter inview">' +
			'<cvdm-overview></cvdm-overview>' +
            /*'<cvdm-rationale v-if="rationale"></cvdm-rationale>' +
			'<cvdm-faqs v-if="faqs"></cvdm-faqs>' +*/
			'<br><br><br><br>' +
		'</div>',
	props: {
		rationale: {
			default: false
		},
		faqs: {
			default: false
		}
	}
});