feat(miniprogram): 用药提醒时间选择器 + 家人编辑功能
- 用药提醒页:时间输入改为 Taro TimePicker 原生选择器 - 家人列表页:每个就诊人增加编辑按钮入口 - 家人添加页:支持编辑模式(URL 传 id + Storage 传数据 + updatePatient API)
This commit is contained in:
@@ -1,19 +1,31 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState, useEffect } from 'react';
|
||||||
import { View, Text, Input, Picker } from '@tarojs/components';
|
import { View, Text, Input, Picker } from '@tarojs/components';
|
||||||
import Taro from '@tarojs/taro';
|
import Taro, { useRouter } from '@tarojs/taro';
|
||||||
import { createPatient } from '../../../services/patient';
|
import { createPatient, updatePatient, Patient } from '../../../services/patient';
|
||||||
import './index.scss';
|
import './index.scss';
|
||||||
|
|
||||||
const RELATION_OPTIONS = ['本人', '配偶', '父母', '子女', '其他'];
|
const RELATION_OPTIONS = ['本人', '配偶', '父母', '子女', '其他'];
|
||||||
const GENDER_OPTIONS = ['男', '女'];
|
const GENDER_OPTIONS = ['男', '女'];
|
||||||
|
|
||||||
export default function FamilyAdd() {
|
export default function FamilyAdd() {
|
||||||
const [name, setName] = useState('');
|
const router = useRouter();
|
||||||
const [relationIdx, setRelationIdx] = useState(0);
|
const editId = router.params.id || '';
|
||||||
const [genderIdx, setGenderIdx] = useState(0);
|
const editData = Taro.getStorageSync('edit_patient') as Patient | null;
|
||||||
const [birthDate, setBirthDate] = useState('');
|
|
||||||
|
const [name, setName] = useState(editData?.name || '');
|
||||||
|
const [relationIdx, setRelationIdx] = useState(
|
||||||
|
editData?.relation ? RELATION_OPTIONS.indexOf(editData.relation) : 0
|
||||||
|
);
|
||||||
|
const [genderIdx, setGenderIdx] = useState(
|
||||||
|
editData?.gender === 'female' ? 1 : 0
|
||||||
|
);
|
||||||
|
const [birthDate, setBirthDate] = useState(editData?.birthday || '');
|
||||||
const [submitting, setSubmitting] = useState(false);
|
const [submitting, setSubmitting] = useState(false);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
return () => { Taro.removeStorageSync('edit_patient'); };
|
||||||
|
}, []);
|
||||||
|
|
||||||
const handleSubmit = async () => {
|
const handleSubmit = async () => {
|
||||||
if (!name.trim()) {
|
if (!name.trim()) {
|
||||||
Taro.showToast({ title: '请输入姓名', icon: 'none' });
|
Taro.showToast({ title: '请输入姓名', icon: 'none' });
|
||||||
@@ -21,17 +33,25 @@ export default function FamilyAdd() {
|
|||||||
}
|
}
|
||||||
setSubmitting(true);
|
setSubmitting(true);
|
||||||
try {
|
try {
|
||||||
await createPatient({
|
if (editId && editData) {
|
||||||
name: name.trim(),
|
await updatePatient(editId, {
|
||||||
gender: GENDER_OPTIONS[genderIdx] === '男' ? 'male' : 'female',
|
name: name.trim(),
|
||||||
birthday: birthDate || undefined,
|
gender: GENDER_OPTIONS[genderIdx] === '男' ? 'male' : 'female',
|
||||||
});
|
birthday: birthDate || undefined,
|
||||||
Taro.showToast({ title: '添加成功', icon: 'success' });
|
relation: RELATION_OPTIONS[relationIdx],
|
||||||
setTimeout(() => {
|
}, editData.version);
|
||||||
Taro.navigateBack();
|
Taro.showToast({ title: '修改成功', icon: 'success' });
|
||||||
}, 1000);
|
} else {
|
||||||
|
await createPatient({
|
||||||
|
name: name.trim(),
|
||||||
|
gender: GENDER_OPTIONS[genderIdx] === '男' ? 'male' : 'female',
|
||||||
|
birthday: birthDate || undefined,
|
||||||
|
});
|
||||||
|
Taro.showToast({ title: '添加成功', icon: 'success' });
|
||||||
|
}
|
||||||
|
setTimeout(() => Taro.navigateBack(), 1000);
|
||||||
} catch {
|
} catch {
|
||||||
Taro.showToast({ title: '添加失败', icon: 'none' });
|
Taro.showToast({ title: editId ? '修改失败' : '添加失败', icon: 'none' });
|
||||||
} finally {
|
} finally {
|
||||||
setSubmitting(false);
|
setSubmitting(false);
|
||||||
}
|
}
|
||||||
@@ -40,7 +60,6 @@ export default function FamilyAdd() {
|
|||||||
return (
|
return (
|
||||||
<View className='family-add-page'>
|
<View className='family-add-page'>
|
||||||
<View className='form-card'>
|
<View className='form-card'>
|
||||||
{/* 姓名 */}
|
|
||||||
<View className='form-item'>
|
<View className='form-item'>
|
||||||
<Text className='form-label'>姓名</Text>
|
<Text className='form-label'>姓名</Text>
|
||||||
<Input
|
<Input
|
||||||
@@ -51,7 +70,6 @@ export default function FamilyAdd() {
|
|||||||
/>
|
/>
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
{/* 关系 */}
|
|
||||||
<View className='form-item'>
|
<View className='form-item'>
|
||||||
<Text className='form-label'>关系</Text>
|
<Text className='form-label'>关系</Text>
|
||||||
<Picker
|
<Picker
|
||||||
@@ -67,7 +85,6 @@ export default function FamilyAdd() {
|
|||||||
</Picker>
|
</Picker>
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
{/* 性别 */}
|
|
||||||
<View className='form-item'>
|
<View className='form-item'>
|
||||||
<Text className='form-label'>性别</Text>
|
<Text className='form-label'>性别</Text>
|
||||||
<Picker
|
<Picker
|
||||||
@@ -83,7 +100,6 @@ export default function FamilyAdd() {
|
|||||||
</Picker>
|
</Picker>
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
{/* 出生日期 */}
|
|
||||||
<View className='form-item'>
|
<View className='form-item'>
|
||||||
<Text className='form-label'>出生日期</Text>
|
<Text className='form-label'>出生日期</Text>
|
||||||
<Picker
|
<Picker
|
||||||
@@ -103,7 +119,7 @@ export default function FamilyAdd() {
|
|||||||
className={`submit-btn ${submitting ? 'disabled' : ''}`}
|
className={`submit-btn ${submitting ? 'disabled' : ''}`}
|
||||||
onClick={submitting ? undefined : handleSubmit}
|
onClick={submitting ? undefined : handleSubmit}
|
||||||
>
|
>
|
||||||
<Text className='submit-text'>{submitting ? '提交中...' : '确认添加'}</Text>
|
<Text className='submit-text'>{submitting ? '提交中...' : editId ? '保存修改' : '确认添加'}</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -68,6 +68,15 @@
|
|||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.family-edit {
|
||||||
|
font-size: 24px;
|
||||||
|
color: $pri;
|
||||||
|
margin-left: 16px;
|
||||||
|
padding: 6px 16px;
|
||||||
|
border: 1px solid $pri;
|
||||||
|
border-radius: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
.empty-state {
|
.empty-state {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|||||||
@@ -42,6 +42,11 @@ export default function FamilyList() {
|
|||||||
Taro.navigateTo({ url: '/pages/profile/family-add/index' });
|
Taro.navigateTo({ url: '/pages/profile/family-add/index' });
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const goToEdit = (patient: Patient) => {
|
||||||
|
Taro.setStorageSync('edit_patient', patient);
|
||||||
|
Taro.navigateTo({ url: `/pages/profile/family-add/index?id=${patient.id}` });
|
||||||
|
};
|
||||||
|
|
||||||
const genderText = (g?: string) => {
|
const genderText = (g?: string) => {
|
||||||
if (g === 'male') return '男';
|
if (g === 'male') return '男';
|
||||||
if (g === 'female') return '女';
|
if (g === 'female') return '女';
|
||||||
@@ -67,6 +72,7 @@ export default function FamilyList() {
|
|||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
{isActive && <Text className='family-check'>当前</Text>}
|
{isActive && <Text className='family-check'>当前</Text>}
|
||||||
|
<Text className='family-edit' onClick={(e) => { e.stopPropagation(); goToEdit(p); }}>编辑</Text>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import React, { useState, useEffect } from 'react';
|
import React, { useState, useEffect } from 'react';
|
||||||
import { View, Text, Input } from '@tarojs/components';
|
import { View, Text, Input, Picker } from '@tarojs/components';
|
||||||
import Taro from '@tarojs/taro';
|
import Taro from '@tarojs/taro';
|
||||||
import EmptyState from '../../../components/EmptyState';
|
import EmptyState from '../../../components/EmptyState';
|
||||||
import './index.scss';
|
import './index.scss';
|
||||||
@@ -132,9 +132,16 @@ export default function MedicationReminder() {
|
|||||||
</View>
|
</View>
|
||||||
<View className='form-item'>
|
<View className='form-item'>
|
||||||
<Text className='form-label'>提醒时间</Text>
|
<Text className='form-label'>提醒时间</Text>
|
||||||
<View className='time-picker-wrap'>
|
<Picker
|
||||||
<Text className='time-value'>{formTime}</Text>
|
mode='time'
|
||||||
</View>
|
value={formTime}
|
||||||
|
onChange={(e) => setFormTime(e.detail.value)}
|
||||||
|
>
|
||||||
|
<View className='time-picker-wrap'>
|
||||||
|
<Text className='time-value'>{formTime}</Text>
|
||||||
|
<Text className='time-arrow'>修改</Text>
|
||||||
|
</View>
|
||||||
|
</Picker>
|
||||||
</View>
|
</View>
|
||||||
<View className='form-actions'>
|
<View className='form-actions'>
|
||||||
<View className='form-cancel' onClick={() => setShowForm(false)}>
|
<View className='form-cancel' onClick={() => setShowForm(false)}>
|
||||||
|
|||||||
Reference in New Issue
Block a user