Compare commits
3 commits
ca5f7dd446
...
f935380781
| Author | SHA1 | Date | |
|---|---|---|---|
| f935380781 | |||
| fa48cd01b2 | |||
| f38083420a |
3 changed files with 205 additions and 194 deletions
|
|
@ -4,6 +4,8 @@
|
|||
"private": true,
|
||||
"scripts": {
|
||||
"build": "nuxt build",
|
||||
"start": "node .output/server/index.mjs",
|
||||
"prestart": "node -e \"process.exit(require('fs').existsSync('.output/server/index.mjs')?0:1)\" || yarn build",
|
||||
"dev": "nuxt dev",
|
||||
"generate": "nuxt generate",
|
||||
"preview": "nuxt preview",
|
||||
|
|
|
|||
|
|
@ -5,15 +5,16 @@
|
|||
|
||||
<!-- Export Options - Top -->
|
||||
<div class="flex justify-center py-6">
|
||||
<ExportOptions
|
||||
:export-data="exportData"
|
||||
filename="conflict-resolution-framework"
|
||||
title="Conflict Resolution Framework"
|
||||
<ExportOptions
|
||||
:export-data="exportData"
|
||||
filename="conflict-resolution-framework"
|
||||
title="Conflict Resolution Framework"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="template-wrapper bg-white dark:bg-neutral-950 text-neutral-900 dark:text-neutral-100">
|
||||
class="template-wrapper bg-white dark:bg-neutral-950 text-neutral-900 dark:text-neutral-100"
|
||||
>
|
||||
<!-- Document Container -->
|
||||
<div class="document-page">
|
||||
<div class="template-content">
|
||||
|
|
@ -21,7 +22,8 @@
|
|||
<div class="text-center mb-8">
|
||||
<h1
|
||||
class="text-3xl md:text-5xl font-bold uppercase m-0 py-4 border-t-2 border-b-2 text-black dark:text-white border-black dark:border-white"
|
||||
:data-org-name="formData.orgName || 'Organization'">
|
||||
:data-org-name="formData.orgName || 'Organization'"
|
||||
>
|
||||
CONFLICT RESOLUTION FRAMEWORK
|
||||
</h1>
|
||||
</div>
|
||||
|
|
@ -38,7 +40,8 @@
|
|||
size="xl"
|
||||
class="w-full"
|
||||
:error="validationErrors.orgName"
|
||||
@input="debouncedAutoSave" />
|
||||
@input="debouncedAutoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
<div class="flex flex-row gap-4 space-x-4">
|
||||
<UFormField label="Organization Type" class="form-group-large">
|
||||
|
|
@ -49,12 +52,11 @@
|
|||
size="xl"
|
||||
class="w-full"
|
||||
:error="validationErrors.orgType"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Number of Members/Staff"
|
||||
class="form-group-large">
|
||||
<UFormField label="Number of Members/Staff" class="form-group-large">
|
||||
<UInput
|
||||
v-model="formData.memberCount"
|
||||
type="number"
|
||||
|
|
@ -62,7 +64,8 @@
|
|||
placeholder="e.g., 5"
|
||||
size="xl"
|
||||
:error="validationErrors.memberCount"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -79,38 +82,44 @@
|
|||
label="Include this section"
|
||||
:ui="{
|
||||
label: 'text-xs text-neutral-700 dark:text-neutral-300',
|
||||
}" />
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6" v-show="sectionsEnabled.values">
|
||||
<UFormField
|
||||
label="Select Core Values (check all that apply)"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<div class="values-grid">
|
||||
<div
|
||||
v-for="(value, index) in coreValues"
|
||||
:key="index"
|
||||
class="checkbox-item">
|
||||
class="checkbox-item"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="value.checked"
|
||||
:id="`core-value-${index}`"
|
||||
:label="value.label"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Additional Values or Principles"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<UTextarea
|
||||
v-model="formData.customValues"
|
||||
:rows="3"
|
||||
placeholder="Add any additional values specific to your organization..."
|
||||
size="xl"
|
||||
class="w-full"
|
||||
@input="debouncedAutoSave" />
|
||||
@input="debouncedAutoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -126,12 +135,14 @@
|
|||
<div
|
||||
v-for="(conflict, index) in conflictTypes"
|
||||
:key="index"
|
||||
class="checkbox-item">
|
||||
class="checkbox-item"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="conflict.checked"
|
||||
:id="`conflict-type-${index}`"
|
||||
:label="conflict.label"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="validationErrors.conflictTypes" class="validation-error">
|
||||
|
|
@ -144,14 +155,14 @@
|
|||
<h2 class="section-title">4. Primary Resolution Approach</h2>
|
||||
|
||||
<div class="space-y-6">
|
||||
<UFormField
|
||||
label="Choose your primary conflict resolution philosophy:">
|
||||
<UFormField label="Choose your primary conflict resolution philosophy:">
|
||||
<URadioGroup
|
||||
v-model="formData.approach"
|
||||
:items="approachOptions"
|
||||
variant="card"
|
||||
size="lg"
|
||||
class="mt-2" />
|
||||
class="mt-2"
|
||||
/>
|
||||
<div v-if="validationErrors.approach" class="validation-error">
|
||||
{{ validationErrors.approach }}
|
||||
</div>
|
||||
|
|
@ -163,7 +174,8 @@
|
|||
id="anonymous-reporting"
|
||||
label="Allow anonymous reporting"
|
||||
help="Members can report issues without revealing their identity"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -175,36 +187,36 @@
|
|||
<div class="space-y-6">
|
||||
<UFormField
|
||||
label="Who can receive initial conflict reports? (check all that apply)"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<div class="checkbox-group space-y-2 mt-4">
|
||||
<div
|
||||
v-for="(receiver, index) in reportReceivers"
|
||||
:key="index"
|
||||
class="checkbox-item">
|
||||
class="checkbox-item"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="receiver.checked"
|
||||
:id="`report-receiver-${index}`"
|
||||
:label="receiver.label"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="validationErrors.reportReceivers"
|
||||
class="validation-error">
|
||||
<div v-if="validationErrors.reportReceivers" class="validation-error">
|
||||
{{ validationErrors.reportReceivers }}
|
||||
</div>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Mediator/Facilitator Structure"
|
||||
class="form-group-large">
|
||||
<UFormField label="Mediator/Facilitator Structure" class="form-group-large">
|
||||
<USelect
|
||||
v-model="formData.mediatorType"
|
||||
:items="mediatorTypeOptions"
|
||||
placeholder="Select mediator structure..."
|
||||
size="xl"
|
||||
:error="validationErrors.mediatorType"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField class="form-group-large">
|
||||
|
|
@ -213,7 +225,8 @@
|
|||
id="support-people"
|
||||
label="Allow support people in mediation sessions"
|
||||
help="Parties can bring a trusted person for emotional support"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -224,9 +237,7 @@
|
|||
|
||||
<div class="space-y-6">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<UFormField
|
||||
label="Initial Response Time"
|
||||
class="form-group-large">
|
||||
<UFormField label="Initial Response Time" class="form-group-large">
|
||||
<USelect
|
||||
v-model="formData.initialResponse"
|
||||
:items="responseTimeOptions"
|
||||
|
|
@ -234,12 +245,11 @@
|
|||
size="xl"
|
||||
class="w-full"
|
||||
:error="validationErrors.initialResponse"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Target Resolution Time"
|
||||
class="form-group-large">
|
||||
<UFormField label="Target Resolution Time" class="form-group-large">
|
||||
<USelect
|
||||
v-model="formData.resolutionTarget"
|
||||
:items="resolutionTimeOptions"
|
||||
|
|
@ -247,28 +257,30 @@
|
|||
size="xl"
|
||||
class="w-full"
|
||||
:error="validationErrors.resolutionTarget"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
|
||||
<UFormField
|
||||
label="Process Steps (select applicable steps)"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<div class="checkbox-group mt-4 space-y-3">
|
||||
<div
|
||||
v-for="(step, index) in processSteps"
|
||||
:key="index"
|
||||
class="checkbox-item">
|
||||
class="checkbox-item"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="step.checked"
|
||||
:id="`process-step-${index}`"
|
||||
:label="`${index + 1}. ${step.label}`"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="validationErrors.processSteps"
|
||||
class="validation-error">
|
||||
<div v-if="validationErrors.processSteps" class="validation-error">
|
||||
{{ validationErrors.processSteps }}
|
||||
</div>
|
||||
</UFormField>
|
||||
|
|
@ -277,8 +289,7 @@
|
|||
|
||||
<!-- Section 7: Documentation & Privacy -->
|
||||
<div class="section-card">
|
||||
<div
|
||||
class="section-header flex flex-row justify-between items-center">
|
||||
<div class="section-header flex flex-row justify-between items-center">
|
||||
<h2 class="section-title">7. Documentation & Privacy</h2>
|
||||
<div class="flex flex-row gap-2 items-center no-print no-pdf">
|
||||
<USwitch
|
||||
|
|
@ -287,7 +298,8 @@
|
|||
label="Include this section"
|
||||
:ui="{
|
||||
label: 'text-xs text-neutral-700 dark:text-neutral-300',
|
||||
}" />
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -299,31 +311,30 @@
|
|||
placeholder="Select documentation level..."
|
||||
size="xl"
|
||||
class="w-full"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Confidentiality Level"
|
||||
class="form-group-large">
|
||||
<UFormField label="Confidentiality Level" class="form-group-large">
|
||||
<USelect
|
||||
v-model="formData.confidentiality"
|
||||
:items="confidentialityOptions"
|
||||
placeholder="Select confidentiality level..."
|
||||
size="xl"
|
||||
class="w-full"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Record Retention Period"
|
||||
class="form-group-large">
|
||||
<UFormField label="Record Retention Period" class="form-group-large">
|
||||
<USelect
|
||||
v-model="formData.retention"
|
||||
:items="retentionOptions"
|
||||
placeholder="Select retention period..."
|
||||
size="xl"
|
||||
class="w-full"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -335,42 +346,44 @@
|
|||
<div class="space-y-6">
|
||||
<UFormField
|
||||
label="Available Actions (check all that apply)"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<div class="checkbox-group mt-4 space-y-3">
|
||||
<div
|
||||
v-for="(action, index) in availableActions"
|
||||
:key="index"
|
||||
class="checkbox-item">
|
||||
class="checkbox-item"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="action.checked"
|
||||
:id="`available-action-${index}`"
|
||||
:label="action.label"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="validationErrors.availableActions"
|
||||
class="validation-error">
|
||||
<div v-if="validationErrors.availableActions" class="validation-error">
|
||||
{{ validationErrors.availableActions }}
|
||||
</div>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
class="form-group-large border-t border-neutral-200 dark:border-neutral-800 pt-4">
|
||||
class="form-group-large border-t border-neutral-200 dark:border-neutral-800 pt-4"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="formData.appealProcess"
|
||||
id="appeal-process"
|
||||
label="Include appeals process"
|
||||
help="Parties can request review of decisions"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 9: Special Circumstances -->
|
||||
<div class="section-card">
|
||||
<div
|
||||
class="section-header flex flex-row justify-between items-center">
|
||||
<div class="section-header flex flex-row justify-between items-center">
|
||||
<h2 class="section-title">9. Special Circumstances</h2>
|
||||
<div class="flex flex-row gap-2 items-center no-print no-pdf">
|
||||
<USwitch
|
||||
|
|
@ -379,7 +392,8 @@
|
|||
label="Include this section"
|
||||
:ui="{
|
||||
label: 'text-xs text-neutral-700 dark:text-neutral-300',
|
||||
}" />
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -388,12 +402,14 @@
|
|||
<div
|
||||
v-for="(circumstance, index) in specialCircumstances"
|
||||
:key="index"
|
||||
class="checkbox-item">
|
||||
class="checkbox-item"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="circumstance.checked"
|
||||
:id="`special-circumstance-${index}`"
|
||||
:label="circumstance.label"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -404,22 +420,19 @@
|
|||
<h2 class="section-title">10. Implementation Details</h2>
|
||||
|
||||
<div class="space-y-6">
|
||||
<UFormField
|
||||
label="Training Requirements"
|
||||
class="form-group-large">
|
||||
<UFormField label="Training Requirements" class="form-group-large">
|
||||
<UTextarea
|
||||
v-model="formData.training"
|
||||
:rows="3"
|
||||
class="w-full"
|
||||
placeholder="Describe any training needed for members, facilitators, or committee members..."
|
||||
size="xl"
|
||||
@input="debouncedAutoSave" />
|
||||
@input="debouncedAutoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<div class="flex flex-row space-x-4">
|
||||
<UFormField
|
||||
label="Policy Review Schedule"
|
||||
class="form-group-large">
|
||||
<UFormField label="Policy Review Schedule" class="form-group-large">
|
||||
<USelect
|
||||
v-model="formData.reviewSchedule"
|
||||
:items="reviewScheduleOptions"
|
||||
|
|
@ -427,11 +440,13 @@
|
|||
size="xl"
|
||||
class="w-full"
|
||||
:error="validationErrors.reviewSchedule"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
<UFormField
|
||||
label="How can this policy be amended?"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<USelect
|
||||
v-model="formData.amendments"
|
||||
:items="amendmentOptions"
|
||||
|
|
@ -439,7 +454,8 @@
|
|||
size="xl"
|
||||
class="w-full"
|
||||
:error="validationErrors.amendments"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
|
||||
|
|
@ -451,7 +467,8 @@
|
|||
type="date"
|
||||
size="xl"
|
||||
class="w-full mb-0"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField label="Next Review Date">
|
||||
|
|
@ -460,7 +477,8 @@
|
|||
type="date"
|
||||
size="xl"
|
||||
class="w-full mb-0"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -469,8 +487,7 @@
|
|||
|
||||
<!-- Section 11: Reflection Process -->
|
||||
<div class="section-card">
|
||||
<div
|
||||
class="section-header flex flex-row justify-between items-center">
|
||||
<div class="section-header flex flex-row justify-between items-center">
|
||||
<h2 class="section-title">11. Reflection Process</h2>
|
||||
<div class="flex flex-row gap-2 items-center no-print no-pdf">
|
||||
<USwitch
|
||||
|
|
@ -479,41 +496,39 @@
|
|||
label="Include detailed reflection guidance"
|
||||
:ui="{
|
||||
label: 'text-xs text-neutral-700 dark:text-neutral-300',
|
||||
}" />
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6" v-show="sectionsEnabled.reflection">
|
||||
<UFormField
|
||||
label="Reflection Period Timeframe"
|
||||
class="form-group-large">
|
||||
<UFormField label="Reflection Period Timeframe" class="form-group-large">
|
||||
<USelect
|
||||
v-model="formData.reflectionPeriod"
|
||||
:items="reflectionPeriodOptions"
|
||||
placeholder="Select reflection timeframe..."
|
||||
size="xl"
|
||||
class="w-full md:w-1/2 mt-2"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Additional Reflection Prompts"
|
||||
class="form-group-large">
|
||||
<UFormField label="Additional Reflection Prompts" class="form-group-large">
|
||||
<UTextarea
|
||||
v-model="formData.customReflectionPrompts"
|
||||
:rows="4"
|
||||
placeholder="Add any organization-specific reflection questions or prompts..."
|
||||
size="xl"
|
||||
class="w-full mt-2"
|
||||
@input="debouncedAutoSave" />
|
||||
@input="debouncedAutoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 12: Direct Resolution Guidelines -->
|
||||
<div class="section-card">
|
||||
<div
|
||||
class="section-header flex flex-row justify-between items-center">
|
||||
<div class="section-header flex flex-row justify-between items-center">
|
||||
<h2 class="section-title">12. Direct Resolution Guidelines</h2>
|
||||
<div class="flex flex-row gap-2 items-center no-print no-pdf">
|
||||
<USwitch
|
||||
|
|
@ -522,90 +537,99 @@
|
|||
label="Include detailed conversation guidance"
|
||||
:ui="{
|
||||
label: 'text-xs text-neutral-700 dark:text-neutral-300',
|
||||
}" />
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6" v-show="sectionsEnabled.directResolution">
|
||||
<UFormField
|
||||
label="Communication Channels (select preferred escalation order)"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<div class="checkbox-group space-y-3 mt-4">
|
||||
<div
|
||||
v-for="(channel, index) in communicationChannels"
|
||||
:key="index"
|
||||
class="checkbox-item">
|
||||
class="checkbox-item"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="channel.checked"
|
||||
:id="`comm-channel-${index}`"
|
||||
:label="channel.label"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
class="form-group-large border-t border-neutral-200 dark:border-neutral-800 pt-4">
|
||||
class="form-group-large border-t border-neutral-200 dark:border-neutral-800 pt-4"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="formData.requireDirectAttempt"
|
||||
id="require-direct-attempt"
|
||||
label="Require direct resolution attempt before escalation"
|
||||
help="Parties must try to resolve directly before filing complaints"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
class="form-group-large border-t border-neutral-200 dark:border-neutral-800 pt-4">
|
||||
class="form-group-large border-t border-neutral-200 dark:border-neutral-800 pt-4"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="formData.documentDirectResolution"
|
||||
id="document-direct-resolution"
|
||||
label="Require written record of direct resolution attempts"
|
||||
help="Parties should document outcomes of direct conversations"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 13: Responsible Contact People -->
|
||||
<div class="section-card">
|
||||
<h2 class="section-title">
|
||||
13. Responsible Contact People Structure
|
||||
</h2>
|
||||
<h2 class="section-title">13. Responsible Contact People Structure</h2>
|
||||
|
||||
<div class="space-y-6">
|
||||
<UFormField
|
||||
label="Internal Advisor Designation"
|
||||
class="form-group-large">
|
||||
<UFormField label="Internal Advisor Designation" class="form-group-large">
|
||||
<USelect
|
||||
v-model="formData.internalAdvisorType"
|
||||
:items="internalAdvisorOptions"
|
||||
placeholder="Select internal advisor structure..."
|
||||
class="w-full md:w-1/2"
|
||||
size="xl"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Staff Liaison for Conflict Resolution Committee"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<UInput
|
||||
v-model="formData.staffLiaison"
|
||||
placeholder="Title/role of designated staff liaison"
|
||||
size="xl"
|
||||
class="w-full md:w-1/2"
|
||||
@input="debouncedAutoSave" />
|
||||
@input="debouncedAutoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Board Chair Role in Conflict Resolution"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<USelect
|
||||
v-model="formData.boardChairRole"
|
||||
:items="boardChairRoleOptions"
|
||||
placeholder="Select board chair involvement..."
|
||||
size="xl"
|
||||
class="w-full md:w-1/2"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -615,19 +639,19 @@
|
|||
<h2 class="section-title">14. Formal Complaint Requirements</h2>
|
||||
|
||||
<div class="space-y-6">
|
||||
<UFormField
|
||||
label="Required Complaint Elements"
|
||||
class="form-group-large">
|
||||
<UFormField label="Required Complaint Elements" class="form-group-large">
|
||||
<div class="checkbox-group space-y-3 mt-4">
|
||||
<div
|
||||
v-for="(element, index) in formalComplaintElements"
|
||||
:key="index"
|
||||
class="checkbox-item">
|
||||
class="checkbox-item"
|
||||
>
|
||||
<UCheckbox
|
||||
v-model="element.checked"
|
||||
:id="`complaint-element-${index}`"
|
||||
:label="element.label"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</UFormField>
|
||||
|
|
@ -635,26 +659,30 @@
|
|||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<UFormField
|
||||
label="Formal Complaint Acknowledgment Time"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<USelect
|
||||
v-model="formData.formalAcknowledgmentTime"
|
||||
:items="acknowledgmentTimeOptions"
|
||||
placeholder="Select acknowledgment timeframe..."
|
||||
class="w-full"
|
||||
size="xl"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Formal Review Completion Time"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<USelect
|
||||
v-model="formData.formalReviewTime"
|
||||
:items="reviewTimeOptions"
|
||||
placeholder="Select review timeframe..."
|
||||
size="xl"
|
||||
class="w-full"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
|
||||
|
|
@ -664,7 +692,8 @@
|
|||
id="require-external-advice"
|
||||
label="Require external legal advice for complex complaints"
|
||||
help="Seek external expertise for multi-party or staff/director complaints"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -680,31 +709,36 @@
|
|||
id="minutes-of-settlement"
|
||||
label="Require 'Minutes of Settlement' for resolved complaints"
|
||||
help="Agreements must be documented in writing and signed by both parties"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<div class="flex flex-row space-x-4">
|
||||
<UFormField
|
||||
label="Settlement Confidentiality Level"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<USelect
|
||||
v-model="formData.settlementConfidentiality"
|
||||
:items="confidentialityOptions"
|
||||
placeholder="Select confidentiality level..."
|
||||
size="xl"
|
||||
class="w-full"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
<UFormField
|
||||
label="Conflict Resolution File Retention"
|
||||
class="form-group-large">
|
||||
class="form-group-large"
|
||||
>
|
||||
<USelect
|
||||
v-model="formData.conflictFileRetention"
|
||||
:items="retentionOptions"
|
||||
placeholder="Select retention period..."
|
||||
size="xl"
|
||||
class="w-full"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -712,8 +746,7 @@
|
|||
|
||||
<!-- Section 16: External Resources -->
|
||||
<div class="section-card">
|
||||
<div
|
||||
class="section-header flex flex-row justify-between items-center">
|
||||
<div class="section-header flex flex-row justify-between items-center">
|
||||
<h2 class="section-title">16. External Resources & Redress</h2>
|
||||
<div class="flex flex-row gap-2 items-center no-print no-pdf">
|
||||
<USwitch
|
||||
|
|
@ -722,7 +755,8 @@
|
|||
label="Include external resource information"
|
||||
:ui="{
|
||||
label: 'text-xs text-neutral-700 dark:text-neutral-300',
|
||||
}" />
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -733,31 +767,30 @@
|
|||
id="include-human-rights"
|
||||
label="Include Human Rights Commission information"
|
||||
help="Reference external discrimination complaint options"
|
||||
@change="autoSave" />
|
||||
@change="autoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Additional External Resources"
|
||||
class="form-group-large">
|
||||
<UFormField label="Additional External Resources" class="form-group-large">
|
||||
<UTextarea
|
||||
v-model="formData.additionalResources"
|
||||
:rows="3"
|
||||
class="w-full"
|
||||
placeholder="List any other external resources, legal aid contacts, or specialized support services..."
|
||||
size="xl"
|
||||
@input="debouncedAutoSave" />
|
||||
@input="debouncedAutoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
|
||||
<UFormField
|
||||
label="Acknowledgment/Attribution"
|
||||
class="form-group-large">
|
||||
<UFormField label="Acknowledgment/Attribution" class="form-group-large">
|
||||
<UTextarea
|
||||
v-model="formData.acknowledgments"
|
||||
:rows="2"
|
||||
placeholder="Credit any sources used in developing this policy..."
|
||||
class="w-full"
|
||||
size="xl"
|
||||
@input="debouncedAutoSave" />
|
||||
@input="debouncedAutoSave"
|
||||
/>
|
||||
</UFormField>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -765,20 +798,23 @@
|
|||
<!-- Document Preview Section -->
|
||||
<div class="no-print" v-if="showPreview">
|
||||
<div
|
||||
class="border border-neutral-200 dark:border-neutral-800 bg-white dark:bg-neutral-950 p-5 rounded-lg shadow-sm">
|
||||
class="border border-neutral-200 dark:border-neutral-800 bg-white dark:bg-neutral-950 p-5 rounded-lg shadow-sm"
|
||||
>
|
||||
<div class="flex flex-row justify-between items-center mb-4">
|
||||
<h2 class="section-title m-0">📄 Policy Document Preview</h2>
|
||||
<UButton
|
||||
size="sm"
|
||||
variant="ghost"
|
||||
@click="showPreview = false"
|
||||
title="Hide preview">
|
||||
title="Hide preview"
|
||||
>
|
||||
✕
|
||||
</UButton>
|
||||
</div>
|
||||
<div
|
||||
class="policy-preview prose prose-neutral dark:prose-invert max-w-none px-6 py-5 bg-neutral-50 dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800 rounded-md max-h-[600px] overflow-y-auto text-left"
|
||||
v-html="markdownToHtml(generatePolicyDocument())"></div>
|
||||
class="policy-preview prose prose-neutral dark:prose-invert max-w-none px-6 py-5 bg-neutral-50 dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-900 rounded-md max-h-[600px] overflow-y-auto text-left"
|
||||
v-html="markdownToHtml(generatePolicyDocument())"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -787,10 +823,10 @@
|
|||
|
||||
<!-- Export Options - Bottom -->
|
||||
<div class="flex justify-center py-6">
|
||||
<ExportOptions
|
||||
:export-data="exportData"
|
||||
filename="conflict-resolution-framework"
|
||||
title="Conflict Resolution Framework"
|
||||
<ExportOptions
|
||||
:export-data="exportData"
|
||||
filename="conflict-resolution-framework"
|
||||
title="Conflict Resolution Framework"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -870,13 +906,7 @@ const responseTimeOptions = [
|
|||
"Within 2 weeks",
|
||||
];
|
||||
|
||||
const resolutionTimeOptions = [
|
||||
"1 week",
|
||||
"2 weeks",
|
||||
"30 days",
|
||||
"60 days",
|
||||
"90 days",
|
||||
];
|
||||
const resolutionTimeOptions = ["1 week", "2 weeks", "30 days", "60 days", "90 days"];
|
||||
|
||||
const docLevelOptions = [
|
||||
"Minimal - outcomes only",
|
||||
|
|
@ -937,13 +967,7 @@ const acknowledgmentTimeOptions = [
|
|||
"Within 2 weeks",
|
||||
];
|
||||
|
||||
const reviewTimeOptions = [
|
||||
"2 weeks",
|
||||
"1 month",
|
||||
"6 weeks",
|
||||
"2 months",
|
||||
"3 months",
|
||||
];
|
||||
const reviewTimeOptions = ["2 weeks", "1 month", "6 weeks", "2 months", "3 months"];
|
||||
|
||||
const sectionsEnabled = ref({
|
||||
values: true,
|
||||
|
|
@ -1117,18 +1141,14 @@ const validateForm = () => {
|
|||
}
|
||||
|
||||
// Required checkbox groups (must have at least one checked)
|
||||
const checkedConflictTypes = conflictTypes.value.filter(
|
||||
(item) => item.checked
|
||||
);
|
||||
const checkedConflictTypes = conflictTypes.value.filter((item) => item.checked);
|
||||
if (checkedConflictTypes.length === 0) {
|
||||
errors.conflictTypes = "Please select at least one type of conflict";
|
||||
}
|
||||
|
||||
// Note: Guiding Principles & Values section is optional - no validation needed
|
||||
|
||||
const checkedReportReceivers = reportReceivers.value.filter(
|
||||
(item) => item.checked
|
||||
);
|
||||
const checkedReportReceivers = reportReceivers.value.filter((item) => item.checked);
|
||||
if (checkedReportReceivers.length === 0) {
|
||||
errors.reportReceivers = "Please select at least one report receiver";
|
||||
}
|
||||
|
|
@ -1138,9 +1158,7 @@ const validateForm = () => {
|
|||
errors.processSteps = "Please select at least one process step";
|
||||
}
|
||||
|
||||
const checkedAvailableActions = availableActions.value.filter(
|
||||
(item) => item.checked
|
||||
);
|
||||
const checkedAvailableActions = availableActions.value.filter((item) => item.checked);
|
||||
if (checkedAvailableActions.length === 0) {
|
||||
errors.availableActions = "Please select at least one available action";
|
||||
}
|
||||
|
|
@ -1188,9 +1206,8 @@ const completionPercentage = computed(() => {
|
|||
...specialCircumstances.value,
|
||||
];
|
||||
|
||||
const filledInputs = allInputs.filter(
|
||||
(val) => val && val.toString().trim() !== ""
|
||||
).length;
|
||||
const filledInputs = allInputs.filter((val) => val && val.toString().trim() !== "")
|
||||
.length;
|
||||
const checkedBoxes = checkboxInputs.filter((item) => item.checked).length;
|
||||
|
||||
const totalFields = allInputs.length + checkboxInputs.length;
|
||||
|
|
@ -1214,12 +1231,10 @@ const loadSavedData = () => {
|
|||
|
||||
// Load checkbox arrays
|
||||
if (parsedData.coreValues) coreValues.value = parsedData.coreValues;
|
||||
if (parsedData.conflictTypes)
|
||||
conflictTypes.value = parsedData.conflictTypes;
|
||||
if (parsedData.conflictTypes) conflictTypes.value = parsedData.conflictTypes;
|
||||
if (parsedData.reportReceivers)
|
||||
reportReceivers.value = parsedData.reportReceivers;
|
||||
if (parsedData.processSteps)
|
||||
processSteps.value = parsedData.processSteps;
|
||||
if (parsedData.processSteps) processSteps.value = parsedData.processSteps;
|
||||
if (parsedData.availableActions)
|
||||
availableActions.value = parsedData.availableActions;
|
||||
if (parsedData.specialCircumstances)
|
||||
|
|
@ -1369,12 +1384,11 @@ const exportData = computed(() => ({
|
|||
finalDecision: formData.value.finalDecision,
|
||||
learning: formData.value.learning,
|
||||
emergencyProcedures: formData.value.emergencyProcedures,
|
||||
annualReview: formData.value.annualReview
|
||||
annualReview: formData.value.annualReview,
|
||||
},
|
||||
exportedAt: new Date().toISOString(),
|
||||
section: "conflict-resolution-framework"
|
||||
section: "conflict-resolution-framework",
|
||||
}));
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
|
@ -1397,11 +1411,7 @@ const exportData = computed(() => ({
|
|||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-image: radial-gradient(
|
||||
circle at 25% 25%,
|
||||
black 1px,
|
||||
transparent 1px
|
||||
),
|
||||
background-image: radial-gradient(circle at 25% 25%, black 1px, transparent 1px),
|
||||
radial-gradient(circle at 75% 75%, black 1px, transparent 1px);
|
||||
background-size: 8px 8px, 8px 8px;
|
||||
background-position: 0 0, 4px 4px;
|
||||
|
|
@ -1793,8 +1803,8 @@ html.dark .policy-preview blockquote {
|
|||
}
|
||||
|
||||
.policy-preview code {
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
|
||||
"Liberation Mono", "Courier New", monospace !important;
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
||||
"Courier New", monospace !important;
|
||||
background: #f3f4f6;
|
||||
padding: 0.1rem 0.35rem;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,6 @@
|
|||
<div class="mb-8">
|
||||
<h1
|
||||
class="text-3xl font-bold text-neutral-900 dark:text-white mb-2"
|
||||
style="font-family: 'Ubuntu', monospace">
|
||||
Wizards
|
||||
</h1>
|
||||
<p class="text-neutral-700 dark:text-neutral-200">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue