hms/apps/miniprogram/src/pages/doctor/prescription/index.tsx

import { useState, useEffect } from 'react';
import { View, Text, Input, ScrollView } from '@tarojs/components';
import Taro, { useRouter } from '@tarojs/taro';
import * as doctorApi from '@/services/doctor';
import Loading from '@/components/Loading';
import EmptyState from '@/components/EmptyState';
import { useElderClass } from '../../../hooks/useElderClass';
import './index.scss';

const TABS = [
  { key: '', label: '全部' },
  { key: 'active', label: '生效中' },
  { key: 'inactive', label: '已停用' },
];

export default function PrescriptionList() {
  const router = useRouter();
  const patientId = router.params.patientId || '';
  const modeClass = useElderClass();
  const [searchPatient, setSearchPatient] = useState('');
  const [currentPatientId, setCurrentPatientId] = useState(patientId);
  const [activeTab, setActiveTab] = useState('');
  const [prescriptions, setPrescriptions] = useState<doctorApi.DialysisPrescription[]>([]);
  const [loading, setLoading] = useState(false);
  const [total, setTotal] = useState(0);
  const [page, setPage] = useState(1);

  useEffect(() => {
    loadData(1);
  }, [currentPatientId, activeTab]);

  const loadData = async (p: number) => {
    setLoading(true);
    try {
      const res = await doctorApi.listDialysisPrescriptions({
        patient_id: currentPatientId || undefined,
        status: activeTab || undefined,
        page: p,
        page_size: 20,
      });
      setPrescriptions(res.data || []);
      setTotal(res.total || 0);
      setPage(p);
    } catch {
      Taro.showToast({ title: '加载失败', icon: 'none' });
    } finally {
      setLoading(false);
    }
  };

  const handleSearch = async () => {
    if (!searchPatient.trim()) return;
    setLoading(true);
    try {
      const res = await doctorApi.listPatients({ search: searchPatient.trim(), page: 1, page_size: 1 });
      if (res.data && res.data.length > 0) {
        setCurrentPatientId(res.data[0].id);
      } else {
        Taro.showToast({ title: '未找到患者', icon: 'none' });
      }
    } catch {
      Taro.showToast({ title: '搜索失败', icon: 'none' });
    } finally {
      setLoading(false);
    }
  };

  if (loading && prescriptions.length === 0) return <Loading />;

  return (
    <ScrollView scrollY className={`prescription-page ${modeClass}`}>
      {!patientId && (
        <View className='search-bar'>
          <Input
            className='search-input'
            placeholder='搜索患者姓名'
            value={searchPatient}
            onInput={(e) => setSearchPatient(e.detail.value)}
            confirmType='search'
            onConfirm={handleSearch}
          />
        </View>
      )}

      <View className='tabs'>
        {TABS.map((t) => (
          <View
            key={t.key}
            className={`tab ${activeTab === t.key ? 'tab--active' : ''}`}
            onClick={() => { setActiveTab(t.key); setPage(1); }}
          >
            <Text className='tab-text'>{t.label}</Text>
          </View>
        ))}
      </View>

      {prescriptions.length === 0 ? (
        <EmptyState text='暂无透析处方' />
      ) : (
        <View className='prescription-list'>
          <View className='prescription-count'><Text>共 {total} 条处方</Text></View>
          {prescriptions.map((p) => (
            <View
              key={p.id}
              className='prescription-card'
              onClick={() => Taro.navigateTo({
                url: `/pages/doctor/prescription/detail/index?id=${p.id}`,
              })}
            >
              <View className='prescription-card__header'>
                <Text className='prescription-card__model'>{p.dialyzer_model || '透析处方'}</Text>
                <Text className={`status-tag status-tag--${p.status}`}>
                  {p.status === 'active' ? '生效中' : p.status === 'inactive' ? '已停用' : p.status}
                </Text>
              </View>
              <View className='prescription-card__body'>
                {p.frequency_per_week != null && (
                  <Text className='prescription-card__meta'>{p.frequency_per_week}次/周</Text>
                )}
                {p.duration_minutes != null && (
                  <Text className='prescription-card__meta'>每次{p.duration_minutes}分钟</Text>
                )}
              </View>
              {(p.effective_from || p.effective_to) && (
                <Text className='prescription-card__date'>
                  {p.effective_from || '...'} ~ {p.effective_to || '...'}
                </Text>
              )}
            </View>
          ))}
          {total > 20 && (
            <View className='pagination'>
              <View
                className={`page-btn ${page <= 1 ? 'page-btn--disabled' : ''}`}
                onClick={() => page > 1 && loadData(page - 1)}
              >
                <Text>上一页</Text>
              </View>
              <Text className='page-info'>{page} / {Math.ceil(total / 20)}</Text>
              <View
                className={`page-btn ${page * 20 >= total ? 'page-btn--disabled' : ''}`}
                onClick={() => page * 20 < total && loadData(page + 1)}
              >
                <Text>下一页</Text>
              </View>
            </View>
          )}
        </View>
      )}

      <View
        className='fab'
        onClick={() => {
          if (!currentPatientId) {
            Taro.showToast({ title: '请先选择患者', icon: 'none' });
            return;
          }
          Taro.navigateTo({ url: `/pages/doctor/prescription/create/index?patientId=${currentPatientId}` });
        }}
      >
        <Text className='fab-text'>+</Text>
      </View>
    </ScrollView>
  );
}