diff --git a/backend/src/questionnaire.js b/backend/src/questionnaire.js
index 0afa382..a96937d 100644
--- a/backend/src/questionnaire.js
+++ b/backend/src/questionnaire.js
@@ -34,7 +34,7 @@ const QUESTIONS = {
opt('ex_smoker', 'Ex-smoker'),
opt('current_smoker', 'Current smoker'),
opt('pulmonary_tb_contact', 'Suffered or ever came in contact with a patient who had Pulmonary TB'),
- opt('indoor_air_pollution', 'Current exposure to any sources of Indoor Air Pollution'),
+ opt('indoor_air_pollution', 'Current exposure to any sources of Indoor Air Pollution (eg: Incense Sticks, Mosquito Coil, Loban, Dhoop, Smoke from Tandoor/ cooking, Smoker in the family, fungus on walls (grey-black patches on wall))'),
],
},
occupation_exposure: {
@@ -143,7 +143,7 @@ const QUESTIONS = {
},
cough_type: {
code: 'cough_type',
- label: 'Is the cough dry or wet?',
+ label: 'Is the cough dry or wet (does the patient expel out sputum/mucus/phlegm during coughing)?',
type: 'single',
required: true,
options: [
@@ -157,9 +157,9 @@ const QUESTIONS = {
type: 'single',
required: true,
options: [
- opt('scanty', 'Scanty'),
- opt('moderate', 'Moderate'),
- opt('excess', 'Excess'),
+ opt('scanty', 'Scanty (very less sputum/mucus/phlegm production/expulsion even after coughing)'),
+ opt('moderate', 'Moderate (some amount of sputum/mucus/phlegm production/expulsion after coughing)'),
+ opt('excess', 'Excess (too much sputum/mucus/phlegm production/expulsion even with or without cough)'),
opt('sometimes_excess_sometimes_less', 'Sometimes excess and sometimes less'),
opt('more_early_morning', 'More in early morning'),
],
diff --git a/frontend/public/organ/abdomen.png b/frontend/public/organ/abdomen.png
new file mode 100644
index 0000000..aa1f34f
Binary files /dev/null and b/frontend/public/organ/abdomen.png differ
diff --git a/frontend/public/organ/brain_spinal.png b/frontend/public/organ/brain_spinal.png
new file mode 100644
index 0000000..83f6f24
Binary files /dev/null and b/frontend/public/organ/brain_spinal.png differ
diff --git a/frontend/public/organ/ent.png b/frontend/public/organ/ent.png
new file mode 100644
index 0000000..7b6e62f
Binary files /dev/null and b/frontend/public/organ/ent.png differ
diff --git a/frontend/public/organ/heart.png b/frontend/public/organ/heart.png
new file mode 100644
index 0000000..7537de9
Binary files /dev/null and b/frontend/public/organ/heart.png differ
diff --git a/frontend/public/organ/kidney.png b/frontend/public/organ/kidney.png
new file mode 100644
index 0000000..672f743
Binary files /dev/null and b/frontend/public/organ/kidney.png differ
diff --git a/frontend/public/organ/lungs.png b/frontend/public/organ/lungs.png
new file mode 100644
index 0000000..d564f15
Binary files /dev/null and b/frontend/public/organ/lungs.png differ
diff --git a/frontend/public/organ/muscles_bones_joints.png b/frontend/public/organ/muscles_bones_joints.png
new file mode 100644
index 0000000..779c78d
Binary files /dev/null and b/frontend/public/organ/muscles_bones_joints.png differ
diff --git a/frontend/public/organ/pregnancy.png b/frontend/public/organ/pregnancy.png
new file mode 100644
index 0000000..967dda5
Binary files /dev/null and b/frontend/public/organ/pregnancy.png differ
diff --git a/frontend/public/organ/reproductive.png b/frontend/public/organ/reproductive.png
new file mode 100644
index 0000000..2791834
Binary files /dev/null and b/frontend/public/organ/reproductive.png differ
diff --git a/frontend/public/organ/skin.png b/frontend/public/organ/skin.png
new file mode 100644
index 0000000..0c6646b
Binary files /dev/null and b/frontend/public/organ/skin.png differ
diff --git a/frontend/src/App.css b/frontend/src/App.css
index e8785cd..dd50a1d 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -230,7 +230,7 @@
.option-row {
display: flex;
gap: 0.6rem;
- align-items: flex-start;
+ align-items: center;
padding: 0.55rem 0.65rem;
border: 1px solid var(--line);
border-radius: 10px;
@@ -239,7 +239,37 @@
}
.option-row input {
- margin-top: 0.2rem;
+ margin-top: 0;
+}
+
+.option-body {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ flex-wrap: nowrap;
+ gap: 0.55rem;
+ min-width: 0;
+}
+
+.option-images {
+ display: flex;
+ flex-wrap: nowrap;
+ gap: 0.35rem;
+ flex-shrink: 0;
+}
+
+.option-image {
+ width: 72px;
+ height: 56px;
+ object-fit: contain;
+ background: #fff;
+ border: 1px solid var(--line);
+ border-radius: 8px;
+}
+
+.option-text {
+ flex: 1;
+ min-width: 0;
}
.mt {
diff --git a/frontend/src/components/QuestionField.jsx b/frontend/src/components/QuestionField.jsx
index ee31855..74cb6d7 100644
--- a/frontend/src/components/QuestionField.jsx
+++ b/frontend/src/components/QuestionField.jsx
@@ -1,3 +1,19 @@
+function OptionLabel({ opt }) {
+ const images = Array.isArray(opt.images) ? opt.images : [];
+ return (
+
+ {images.length > 0 ? (
+
+ {images.map((src) => (
+
+ ))}
+
+ ) : null}
+ {opt.label}
+
+ );
+}
+
export default function QuestionField({ question, value, otherValue, onChange, onOtherChange }) {
if (!question) return null;
@@ -36,7 +52,7 @@ export default function QuestionField({ question, value, otherValue, onChange, o
checked={value === opt.value}
onChange={() => onChange(opt.value)}
/>
- {opt.label}
+
))}
@@ -77,7 +93,7 @@ export default function QuestionField({ question, value, otherValue, onChange, o
}
}}
/>
- {opt.label}
+
);
})}
diff --git a/frontend/src/questionnaire.js b/frontend/src/questionnaire.js
index 314760f..cc9f8b9 100644
--- a/frontend/src/questionnaire.js
+++ b/frontend/src/questionnaire.js
@@ -35,7 +35,7 @@ export const QUESTIONS = {
},
{
value: 'indoor_air_pollution',
- label: 'Current exposure to any sources of Indoor Air Pollution',
+ label: 'Current exposure to any sources of Indoor Air Pollution (eg: Incense Sticks, Mosquito Coil, Loban, Dhoop, Smoke from Tandoor/ cooking, Smoker in the family, fungus on walls (grey-black patches on wall))',
},
],
},
@@ -96,15 +96,19 @@ export const QUESTIONS = {
type: 'multi',
required: true,
options: [
- { value: 'skin', label: 'Skin' },
- { value: 'brain_spinal', label: 'Brain & spinal cord' },
- { value: 'ent', label: 'Ear/Nose/Throat' },
- { value: 'heart', label: 'Heart disease' },
- { value: 'lungs', label: 'Lungs & breathing tubes' },
- { value: 'abdomen', label: 'Abdomen' },
- { value: 'kidney', label: 'Kidney' },
- { value: 'pregnancy_reproductive', label: 'Pregnancy & reproductive issues' },
- { value: 'muscles_bones_joints', label: 'Muscles/Bones/Joints' },
+ { value: 'skin', label: 'Skin', images: ['/organ/skin.png'] },
+ { value: 'brain_spinal', label: 'Brain & spinal cord', images: ['/organ/brain_spinal.png'] },
+ { value: 'ent', label: 'Ear/Nose/Throat', images: ['/organ/ent.png'] },
+ { value: 'heart', label: 'Heart disease', images: ['/organ/heart.png'] },
+ { value: 'lungs', label: 'Lungs & breathing tubes', images: ['/organ/lungs.png'] },
+ { value: 'abdomen', label: 'Abdomen', images: ['/organ/abdomen.png'] },
+ { value: 'kidney', label: 'Kidney', images: ['/organ/kidney.png'] },
+ {
+ value: 'pregnancy_reproductive',
+ label: 'Pregnancy & reproductive issues',
+ images: ['/organ/reproductive.png', '/organ/pregnancy.png'],
+ },
+ { value: 'muscles_bones_joints', label: 'Muscles/Bones/Joints', images: ['/organ/muscles_bones_joints.png'] },
],
},
ailment: {
@@ -154,7 +158,7 @@ export const QUESTIONS = {
},
cough_type: {
code: 'cough_type',
- label: 'Is the cough dry or wet?',
+ label: 'Is the cough dry or wet (does the patient expel out sputum/mucus/phlegm during coughing)?',
type: 'single',
required: true,
options: [
@@ -168,9 +172,9 @@ export const QUESTIONS = {
type: 'single',
required: true,
options: [
- { value: 'scanty', label: 'Scanty' },
- { value: 'moderate', label: 'Moderate' },
- { value: 'excess', label: 'Excess' },
+ { value: 'scanty', label: 'Scanty (very less sputum/mucus/phlegm production/expulsion even after coughing)' },
+ { value: 'moderate', label: 'Moderate (some amount of sputum/mucus/phlegm production/expulsion after coughing)' },
+ { value: 'excess', label: 'Excess (too much sputum/mucus/phlegm production/expulsion even with or without cough)' },
{ value: 'sometimes_excess_sometimes_less', label: 'Sometimes excess and sometimes less' },
{ value: 'more_early_morning', label: 'More in early morning' },
],