Forráskód Böngészése

lsrx review - adherence UI

Vijayakrishnan 4 éve
szülő
commit
e03c0a4aec

+ 530 - 3
resources/views/app/patient/canvas-sections/lifestyle_rx_review/form.blade.php

@@ -24,6 +24,108 @@ if(!isset($contentData[$sectionPro->uid])) {
         ],
         'barriers' => '',   // free text
         'assessment' => '', // Inactive, Insufficiently Active, Active, Highly Active
+        'adherence' => [
+            'seated' => [
+                'active' => false,
+                'memo' => '',
+                'adherence' => '',
+                'adherence_memo' => '',
+            ],
+            'arm' => [
+                'active' => false,
+                'memo' => '',
+                'adherence' => '',
+                'adherence_memo' => '',
+            ],
+            'aquatic' => [
+                'active' => false,
+                'memo' => '',
+                'adherence' => '',
+                'adherence_memo' => '',
+            ],
+            'aerobic' => [
+                'active' => false,
+                'walk' => [
+                    'active' => false,
+                    'days_per_week' => '',
+                    'minutes_per_day' => '',
+                    'intensity' => '', // Light, Moderate, Vigorous
+                    'memo' => '',
+                    'adherence' => '',
+                    'adherence_memo' => '',
+                ],
+                'jog' => [
+                    'active' => false,
+                    'days_per_week' => '',
+                    'minutes_per_day' => '',
+                    'intensity' => '', // Light, Moderate, Vigorous
+                    'memo' => '',
+                    'adherence' => '',
+                    'adherence_memo' => '',
+                ],
+                'elliptical' => [
+                    'active' => false,
+                    'days_per_week' => '',
+                    'minutes_per_day' => '',
+                    'intensity' => '', // Light, Moderate, Vigorous
+                    'memo' => '',
+                    'adherence' => '',
+                    'adherence_memo' => '',
+                ],
+                'swim' => [
+                    'active' => false,
+                    'days_per_week' => '',
+                    'minutes_per_day' => '',
+                    'intensity' => '', // Light, Moderate, Vigorous
+                    'memo' => '',
+                    'adherence' => '',
+                    'adherence_memo' => '',
+                ],
+                'bike' => [
+                    'active' => false,
+                    'days_per_week' => '',
+                    'minutes_per_day' => '',
+                    'intensity' => '', // Light, Moderate, Vigorous
+                    'memo' => '',
+                    'adherence' => '',
+                    'adherence_memo' => '',
+                ],
+            ],
+            'strength' => [
+                'active' => false,
+                'exercises' => [
+                    [
+                        'name' => '',
+                        'days_per_week' => '',
+                        'reps' => '',
+                        'intensity' => '', // Light, Moderate, Vigorous
+                        'memo' => '',
+                        'adherence' => '',
+                        'adherence_memo' => '',
+                    ]
+                ]
+            ],
+            'neat' => [
+                'active' => false,
+                'recommendations' => [
+                    'park_farther' => false,
+                    'park_farther_adherence' => '',
+                    'park_farther_adherence_memo' => '',
+                    'steps_instead_of_elevator' => false,
+                    'steps_instead_of_elevator_adherence' => '',
+                    'steps_instead_of_elevator_adherence_memo' => '',
+                    'stand_instead_of_sit' => false,
+                    'stand_instead_of_sit_adherence' => '',
+                    'stand_instead_of_sit_adherence_memo' => '',
+                    'steps_goal_per_day' => '',
+                    'steps_goal_per_day_adherence' => '',
+                    'steps_goal_per_day_adherence_memo' => '',
+                    'other' => '',
+                    'other_adherence' => '',
+                    'other_adherence_memo' => '',
+                ]
+            ]
+        ]
     ];
 }
 
@@ -32,7 +134,7 @@ $formID = rand(0, 100000);
 
 <div id="parSection_{{$formID}}">
     <h3 class="stag-popup-title mb-3 border-bottom pb-1 hide-if-note pt-1 pb-2">
-        <span>Lifestyle Rx Update</span>
+        <span>Lifestyle Rx Review</span>
         <a href="#" onclick="return closeStagPopup()"
            class="ml-auto text-secondary">
             <i class="fa fa-times-circle"></i>
@@ -93,12 +195,411 @@ $formID = rand(0, 100000);
         </div>
     </div>
 
+    <p class="font-weight-bold my-2">Lifestyle Rx Adherence</p>
+
+    <div class="pl-3 border-left mb-3">
+        <table class="table table-sm table-bordered mb-2 table-edit-sheet bg-white">
+        <thead>
+        <tr class="bg-light">
+            <th class="px-2 text-secondary border-bottom-0 width-100px text-nowrap">Lifestyle Rx</th>
+            <th class="px-2 text-secondary border-bottom-0 width-100px text-nowrap">Rx Memo</th>
+            <th class="px-2 text-secondary border-bottom-0 width-100px text-nowrap">Adherence</th>
+            <th class="px-2 text-secondary border-bottom-0 width-100px text-nowrap">Adherence Memo</th>
+        </tr>
+        </thead>
+
+        <tbody v-if="data['{{$sectionPro->uid}}']['adherence']['seated']['active'] || data['{{$sectionPro->uid}}']['adherence']['arm']['active'] || data['{{$sectionPro->uid}}']['adherence']['aquatic']['active']">
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['seated']['active']">
+                <td class="px-2 align-middle">
+                    Seated Exercises
+                </td>
+                <td class="px-2 align-middle" v-html="data['{{$sectionPro->uid}}']['adherence']['seated']['memo']"></td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['seated']['adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['seated']['adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['seated']['adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['seated']['adherence_memo']">
+                </td>
+            </tr>
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['arm']['active']">
+                <td class="px-2 align-middle">
+                    Arm Exercises
+                </td>
+                <td class="px-2 align-middle" v-html="data['{{$sectionPro->uid}}']['adherence']['arm']['memo']"></td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['arm']['adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['arm']['adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['arm']['adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['arm']['adherence_memo']">
+                </td>
+            </tr>
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['aquatic']['active']">
+                <td class="px-2 align-middle">
+                    Aquatic Exercises
+                </td>
+                <td class="px-2 align-middle" v-html="data['{{$sectionPro->uid}}']['adherence']['aquatic']['memo']"></td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aquatic']['adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aquatic']['adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aquatic']['adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['aquatic']['adherence_memo']">
+                </td>
+            </tr>
+        </tbody>
+
+        <tbody v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['active']">
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['active']">
+                <td class="px-2 align-middle">
+                    Walk
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['intensity']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['intensity']"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['days_per_week']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['days_per_week'] + ' days/wk'"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['minutes_per_day']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['minutes_per_day'] + ' mins/days'"></span>
+                </td>
+                <td class="px-2 align-middle" v-html="data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['memo']"></td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['walk']['adherence_memo']">
+                </td>
+            </tr>
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['active']">
+                <td class="px-2 align-middle">
+                    Jog
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['intensity']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['intensity']"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['days_per_week']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['days_per_week'] + ' days/wk'"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['minutes_per_day']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['minutes_per_day'] + ' mins/days'"></span>
+                </td>
+                <td class="px-2 align-middle" v-html="data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['memo']"></td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['jog']['adherence_memo']">
+                </td>
+            </tr>
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['active']">
+                <td class="px-2 align-middle">
+                    Elliptical
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['intensity']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['intensity']"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['days_per_week']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['days_per_week'] + ' days/wk'"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['minutes_per_day']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['minutes_per_day'] + ' mins/days'"></span>
+                </td>
+                <td class="px-2 align-middle" v-html="data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['memo']"></td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['elliptical']['adherence_memo']">
+                </td>
+            </tr>
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['active']">
+                <td class="px-2 align-middle">
+                    Swim
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['intensity']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['intensity']"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['days_per_week']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['days_per_week'] + ' days/wk'"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['minutes_per_day']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['minutes_per_day'] + ' mins/days'"></span>
+                </td>
+                <td class="px-2 align-middle" v-html="data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['memo']"></td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['swim']['adherence_memo']">
+                </td>
+            </tr>
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['active']">
+                <td class="px-2 align-middle">
+                    Bike
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['intensity']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['intensity']"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['days_per_week']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['days_per_week'] + ' days/wk'"></span>
+                    <span v-if="data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['minutes_per_day']" v-html="' / ' + data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['minutes_per_day'] + ' mins/days'"></span>
+                </td>
+                <td class="px-2 align-middle" v-html="data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['memo']"></td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3 mb-0">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['aerobic']['bike']['adherence_memo']">
+                </td>
+            </tr>
+        </tbody>
+
+
+        <tbody v-if="data['{{$sectionPro->uid}}']['adherence']['strength']['active']">
+
+            <tr v-for="(exercise) in data['{{$sectionPro->uid}}']['adherence']['strength']['exercises']">
+                <td class="px-2 align-middle">
+                    <span v-html="exercise.name"></span>
+                    <span v-if="exercise.intensity" v-html="' / ' + exercise.intensity"></span>
+                    <span v-if="exercise.reps" v-html="' / ' + exercise.reps + ' reps'"></span>
+                    <span v-if="exercise.days_per_week" v-html="' / ' + exercise.days_per_week + ' days/wk'"></span>
+                </td>
+                <td class="px-2 align-middle" v-html="exercise['memo']"></td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="exercise['adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="exercise['adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="exercise['adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="exercise['adherence_memo']">
+                </td>
+            </tr>
+        </tbody>
+
+        <tbody v-if="data['{{$sectionPro->uid}}']['adherence']['neat']['active']">
+
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['park_farther']">
+                <td class="px-2 align-middle" colspan="2">
+                    Park farther away from entrances
+                </td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['park_farther_adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['park_farther_adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['park_farther_adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['park_farther_adherence_memo']">
+                </td>
+            </tr>
+
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_instead_of_elevator']">
+                <td class="px-2 align-middle" colspan="2">
+                    Take the stairs instead of escalator/elevator
+                </td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_instead_of_elevator_adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_instead_of_elevator_adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_instead_of_elevator_adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_instead_of_elevator_adherence_memo']">
+                </td>
+            </tr>
+
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['stand_instead_of_sit']">
+                <td class="px-2 align-middle" colspan="2">
+                    Stand instead of sit
+                </td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['stand_instead_of_sit_adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['stand_instead_of_sit_adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['stand_instead_of_sit_adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['stand_instead_of_sit_adherence_memo']">
+                </td>
+            </tr>
+
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_goal_per_day']">
+                <td class="px-2 align-middle" colspan="2">
+                    Steps goal / day: <b v-html="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_goal_per_day']"></b>
+                </td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_goal_per_day_adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_goal_per_day_adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_goal_per_day_adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['steps_goal_per_day_adherence_memo']">
+                </td>
+            </tr>
+
+            <tr v-if="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['other']">
+                <td class="px-2 align-middle" colspan="2">
+                    Other: <b v-html="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['other']"></b>
+                </td>
+                <td class="px-2 align-middle">
+                    <div class="d-flex align-items-center">
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['other_adherence']" value="Yes">
+                            <span class="ml-1">Yes</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['other_adherence']" value="No">
+                            <span class="ml-1">No</span>
+                        </label>
+                        <label class="d-inline-flex align-items-center mr-3">
+                            <input type="radio" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['other_adherence']" value="Other">
+                            <span class="ml-1">Other</span>
+                        </label>
+                    </div>
+                </td>
+                <td class="px-0 align-middle">
+                    <input type="text" class="form-control form-control-sm" v-model="data['{{$sectionPro->uid}}']['adherence']['neat']['recommendations']['other_adherence_memo']">
+                </td>
+            </tr>
+
+        </tbody>
+    </table>
+    </div>
+
 </div>
 <script>
     (function() {
         function init() {
-            window.clientPAUApp_{{$formID}} = new Vue({
+            window.clientPARApp_{{$formID}} = new Vue({
                 el: '#parSection_{{$formID}}',
+                delimiters: ['@{{', '}}'],
                 data: {
                     data: <?= json_encode($contentData) ?>,
                 },
@@ -115,7 +616,33 @@ $formID = rand(0, 100000);
                     }
                 },
                 methods: {
-
+                    addItem: function() {
+                        this.data['{{$sectionPro->uid}}']['current_cch']['list'].push({
+                            "category": '',
+                            "name": '',
+                            "icd": '',
+                            "memo": '',
+                            "hpi": {
+                                "free_text": ''
+                            },
+                        });
+                    },
+                    removeItem: function(_index) {
+                        this.data['{{$sectionPro->uid}}']['current_cch']['list'].splice(_index, 1);
+                    },
+                    cleanArray: function(_source) {
+                        let plItems = [], plObject = {};
+                        for (let x=0; x<_source.length; x++) {
+                            plObject = {};
+                            for (let y in _source[x]) {
+                                if(_source[x].hasOwnProperty(y)) {
+                                    plObject[y] = _source[x][y];
+                                }
+                            }
+                            plItems.push(plObject);
+                        }
+                        return plItems;
+                    },
                 }
             });
         }