Vue.component('amo-overview', {
	template:
		'<div>' +
			'<el-row>' +
				'<h1 style="text-align: center">Annual Monitoring for Persons on Long-Term Opioid Therapy (AMO)</h1>' +
			'</el-row>' +
			'<el-row id="amo-description" class="scrollspy">' +
				'<h2>Description</h2>' +
			'</el-row>' +
			'<el-row>' +
				'<p>The percentage of individuals &ge;18 years of age who are prescribed long-term opioid therapy and have not received a drug test at least once during the measurement year.</p>' +
				'<p>A lower rate indicates better performance.</p>' +
			'</el-row>' +
			'<el-row id="amo-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. This measure is specified for Qualified Health Plans in the Health Insurance Marketplace Quality Rating System.</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 pharmacy 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 who are prescribed long-term opioid therapy.</p>' +
				'</el-col>' +
			'</el-row>' +
			'<el-row>' +
				'<el-col :span="6">' +
					'<p><b>Exclusions</b></p>' +
				'</el-col>' +
				'<el-col :span="18">' +
					'<p>Hospice and cancer.</p>' +
				'</el-col>' +
			'</el-row>' +
			'<el-row>' +
				'<el-col :span="6">' +
					'<p><b>Numerator</b></p>' +
				'</el-col>' +
				'<el-col :span="18">' +
					'<p>Individuals who have not received a drug test during the measurement year.</p>' +
				'</el-col>' +
			'</el-row>' +
		'</div>'
});

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

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

Vue.component('amo-faqs', {
	template: 
		'<div>' +
			'<el-row id="amo-faqs" class="scrollspy">' +
				'<h2>FAQs</h2>' +
			'</el-row>' +
			'<el-row>' +
				'<el-collapse v-model="active" v-on:change="changed">' +
					'<el-collapse-item name="1">' +
						'<template slot="title"><span style="font-size: 15px; text-decoration: underline; height: 48px; line-height: 20px;">Why is long-term opioid therapy defined as &ge;90 cumulative days\' supply of opioids during the measurement year?</span></template>' +
						"<p>This threshold was chosen to align with existing literature and also with common definitions of chronic pain which can range from 3-6 months. Ultimately, the technical expert panel agreed upon &ge;90 cumulative days' supply during development.</p>" +
					'</el-collapse-item>' +
					'<el-collapse-item name="2">' +
						'<template slot="title"><span style="font-size: 15px; text-decoration: underline;">How was the annual threshold for monitoring chosen?</span></template>' +
						'<p>The annual threshold is based on the CDC and American Association for Clinical Chemistry Academy guidelines. While many guidelines provide strong recommendations for periodic testing without a precise interval, the CDC recommends annual testing and the AACC recommends 1-2 times per year, and the annual approach was agreed upon by the technical expert panel during development.</p>' +
						"<p>Gaps in prescription claims for warfarin can occur during the treatment period.</p>" +
					'</el-collapse-item>' +
					'<el-collapse-item name="3">' +
						'<template slot="title"><span style="font-size: 15px; text-decoration: underline;">The measure includes testing for which drug classes?</span></template>' +
						"<p>The measure includes presumptive or definitive tests for amphetamines, barbiturates, benzodiazepines, cannabinoids, cocaine, and opiates/opioids.</p>" +
					'</el-collapse-item>' +
					'<el-collapse-item name="4">' +
						'<template slot="title"><span style="font-size: 15px; text-decoration: underline;">Are drugs related to treating opioid use disorder (OUD) excluded?</span></template>' +
						"<p>The medication tables used to identify the eligible population only include opioids indicated for pain. Therefore, drugs whose primary use is treating OUD are not included in the measure.</p>" +
					'</el-collapse-item>' +
					'<el-collapse-item name="5">' +
						'<template slot="title"><span style="font-size: 15px; text-decoration: underline;">Why are individuals with sickle cell disease (SCD) not excluded?</span></template>' +
						"<p>Individuals with SCD have unique pain management needs. Most existing PQA opioid measures exclude individuals with and SCD diagnosis to prevent unintended consequences, especially around limiting needed access to pain management for this vulnerable population. Notably, the CDC guidelines for opioid prescribing state that sickle cell disease is out-of-scope.</p>" +
						"<p>However, unlike other PQA opioid measures, this measure does not capture prescribing behavior or have to potential to limit access to care. Instead, it focuses on monitoring. Even if individuals have SCD, annual monitoring to prevent adverse events like drug-drug interactions or opioid use disorder is likely still appropriate. This decision was supported by the technical expert panel during development and reaffirmed by the PQA Measure Update Panel.</p>" +
					'</el-collapse-item>' +
					'<el-collapse-item name="6">' +
						'<template slot="title"><span style="font-size: 15px; text-decoration: underline; height: 48px; line-height: 20px;">Are there concerns about unintended consequences with physicians discontinuing care in response to a negative drug test?</span></template>' +
						"<p>This measure is not intended for clinical decision-making. This measure is intended for retrospective evaluation of populations of patients and should not be used to guide clinical decisions for individual patients. </p>" +
						"<p>It is important that physicians have a plan in place for how to respond to unexpected results of a drug test. Moreover, it is against recommended practice to dismiss patients from care as a result of drug test findings.</p>" +
					'</el-collapse-item>' +
				'</el-collapse>' +
			'</el-row>' +
		'</div>',
	data: function() {
		return {
			active: '',
			active2: ''
		}
	},
	methods: {
		changed: function () {
		}
	}
});

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