Spaces:
Sleeping
Sleeping
| <html lang="zh-CN"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title> | |
| <span class="lang-zh">SarcoAdvisor-BSU - 肌少症风险评估系统</span> | |
| <span class="lang-en" style="display: none;">SarcoAdvisor-BSU - Sarcopenia Risk Assessment System</span> | |
| </title> | |
| <!-- Bootstrap CSS --> | |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"> | |
| <!-- Font Awesome --> | |
| <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"> | |
| <!-- 自定义CSS --> | |
| <link href="/static/style.css" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <!-- 导航栏 --> | |
| <nav class="navbar navbar-expand-lg navbar-dark bg-danger"> | |
| <div class="container"> | |
| <a class="navbar-brand" href="#"> | |
| <i class="fas fa-heartbeat me-2"></i>SarcoAdvisor-BSU | |
| </a> | |
| <!-- 移除导航栏中的语言切换按钮 --> | |
| </div> | |
| </nav> | |
| <!-- 主容器 --> | |
| <div class="container my-5"> | |
| <!-- 系统介绍 --> | |
| <div class="row mb-5"> | |
| <div class="col-12"> | |
| <div class="card shadow-sm"> | |
| <div class="card-body text-center"> | |
| <h2 class="card-title text-danger mb-3"> | |
| <i class="fas fa-user-md me-2"></i> | |
| <span class="lang-zh">智能肌少症风险评估</span> | |
| <span class="lang-en" style="display: none;">AI-Powered Sarcopenia Risk Assessment</span> | |
| </h2> | |
| <p class="card-text lead"> | |
| <span class="lang-zh">基于先进机器学习技术，为您提供个性化的肌少症风险评估和生活方式建议</span> | |
| <span class="lang-en" style="display: none;">Advanced machine learning technology providing personalized sarcopenia risk assessment and lifestyle recommendations</span> | |
| </p> | |
| <div class="alert alert-info mt-3"> | |
| <i class="fas fa-info-circle me-2"></i> | |
| <strong> | |
| <span class="lang-zh">适用人群：本系统专为18-55岁成年人群设计，基于NHANES数据训练</span> | |
| <span class="lang-en" style="display: none;">Target Population: This system is designed for adults aged 18-55 years, trained on NHANES data</span> | |
| </strong> | |
| </div> | |
| <div class="row mt-4"> | |
| <div class="col-md-4"> | |
| <div class="feature-item"> | |
| <i class="fas fa-search fa-2x text-danger mb-2"></i> | |
| <h5> | |
| <span class="lang-zh">智能筛查</span> | |
| <span class="lang-en" style="display: none;">Smart Screening</span> | |
| </h5> | |
| <p class="text-muted"> | |
| <span class="lang-zh">高灵敏度模型快速识别风险</span> | |
| <span class="lang-en" style="display: none;">High-sensitivity models for rapid risk identification</span> | |
| </p> | |
| </div> | |
| </div> | |
| <div class="col-md-4"> | |
| <div class="feature-item"> | |
| <i class="fas fa-brain fa-2x text-danger mb-2"></i> | |
| <h5> | |
| <span class="lang-zh">AI建议</span> | |
| <span class="lang-en" style="display: none;">AI Recommendations</span> | |
| </h5> | |
| <p class="text-muted"> | |
| <span class="lang-zh">DiCE反事实解释生成个性化建议</span> | |
| <span class="lang-en" style="display: none;">DiCE counterfactual explanations for personalized recommendations</span> | |
| </p> | |
| </div> | |
| </div> | |
| <div class="col-md-4"> | |
| <div class="feature-item"> | |
| <i class="fas fa-chart-line fa-2x text-danger mb-2"></i> | |
| <h5> | |
| <span class="lang-zh">科学指导</span> | |
| <span class="lang-en" style="display: none;">Scientific Guidance</span> | |
| </h5> | |
| <p class="text-muted"> | |
| <span class="lang-zh">循证医学支持的干预方案</span> | |
| <span class="lang-en" style="display: none;">Evidence-based medical intervention protocols</span> | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 评估表单 --> | |
| <div class="row"> | |
| <div class="col-lg-8 mx-auto"> | |
| <div class="card shadow"> | |
| <div class="card-header bg-danger text-white"> | |
| <h3 class="card-title mb-0"> | |
| <i class="fas fa-clipboard-list me-2"></i> | |
| <span class="lang-zh">健康信息评估表</span> | |
| <span class="lang-en" style="display: none;">Health Information Assessment Form</span> | |
| </h3> | |
| </div> | |
| <div class="card-body"> | |
| <form id="assessmentForm"> | |
| <!-- 基本信息 --> | |
| <div class="section-header"> | |
| <h4 class="text-danger"> | |
| <i class="fas fa-user me-2"></i> | |
| <span class="lang-zh">基本信息</span> | |
| <span class="lang-en" style="display: none;">Basic Information</span> | |
| </h4> | |
| <hr> | |
| </div> | |
| <div class="row mb-3"> | |
| <div class="col-md-6"> | |
| <label for="age_years" class="form-label"> | |
| <span class="lang-zh">年龄 (岁) <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Age (years) <span class="text-danger">*</span></span> | |
| </label> | |
| <input type="number" class="form-control" id="age_years" name="age_years" | |
| min="16" max="120" step="1" required> | |
| <div class="form-text"> | |
| <span class="lang-zh">⚠️ 推荐年龄：18-55岁 (系统训练数据范围)</span> | |
| <span class="lang-en" style="display: none;">⚠️ Recommended age: 18-55 years (training data range)</span> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <label for="race_ethnicity" class="form-label"> | |
| <span class="lang-zh">种族/民族 <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Race/Ethnicity <span class="text-danger">*</span></span> | |
| </label> | |
| <select class="form-select" id="race_ethnicity" name="race_ethnicity" required> | |
| <option value=""> | |
| <span class="lang-zh">请选择</span> | |
| <span class="lang-en" style="display: none;">Please select</span> | |
| </option> | |
| <option value="0"> | |
| <span class="lang-zh">美洲原住民</span> | |
| <span class="lang-en" style="display: none;">Native American</span> | |
| </option> | |
| <option value="1"> | |
| <span class="lang-zh">亚洲人</span> | |
| <span class="lang-en" style="display: none;">Asian</span> | |
| </option> | |
| <option value="2"> | |
| <span class="lang-zh">非洲裔美国人</span> | |
| <span class="lang-en" style="display: none;">African American</span> | |
| </option> | |
| <option value="3"> | |
| <span class="lang-zh">西班牙裔</span> | |
| <span class="lang-en" style="display: none;">Hispanic</span> | |
| </option> | |
| <option value="4"> | |
| <span class="lang-zh">白人</span> | |
| <span class="lang-en" style="display: none;">White</span> | |
| </option> | |
| </select> | |
| </div> | |
| </div> | |
| <!-- 医疗史 --> | |
| <div class="section-header mt-4"> | |
| <h4 class="text-danger"> | |
| <i class="fas fa-notes-medical me-2"></i> | |
| <span class="lang-zh">医疗史</span> | |
| <span class="lang-en" style="display: none;">Medical History</span> | |
| </h4> | |
| <hr> | |
| </div> | |
| <div class="row mb-3"> | |
| <div class="col-md-6"> | |
| <label for="arthritis" class="form-label"> | |
| <span class="lang-zh">是否患有关节炎？ <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Do you have arthritis? <span class="text-danger">*</span></span> | |
| </label> | |
| <select class="form-select" id="arthritis" name="arthritis" required> | |
| <option value=""> | |
| <span class="lang-zh">请选择</span> | |
| <span class="lang-en" style="display: none;">Please select</span> | |
| </option> | |
| <option value="0"> | |
| <span class="lang-zh">否</span> | |
| <span class="lang-en" style="display: none;">No</span> | |
| </option> | |
| <option value="1"> | |
| <span class="lang-zh">是</span> | |
| <span class="lang-en" style="display: none;">Yes</span> | |
| </option> | |
| </select> | |
| </div> | |
| <div class="col-md-6"> | |
| <label for="diabetes" class="form-label"> | |
| <span class="lang-zh">是否患有糖尿病？ <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Do you have diabetes? <span class="text-danger">*</span></span> | |
| </label> | |
| <select class="form-select" id="diabetes" name="diabetes" required> | |
| <option value=""> | |
| <span class="lang-zh">请选择</span> | |
| <span class="lang-en" style="display: none;">Please select</span> | |
| </option> | |
| <option value="0"> | |
| <span class="lang-zh">否</span> | |
| <span class="lang-en" style="display: none;">No</span> | |
| </option> | |
| <option value="1"> | |
| <span class="lang-zh">是</span> | |
| <span class="lang-en" style="display: none;">Yes</span> | |
| </option> | |
| </select> | |
| </div> | |
| </div> | |
| <!-- 身体指标 --> | |
| <div class="section-header mt-4"> | |
| <h4 class="text-danger"> | |
| <i class="fas fa-weight me-2"></i> | |
| <span class="lang-zh">身体指标</span> | |
| <span class="lang-en" style="display: none;">Physical Measurements</span> | |
| </h4> | |
| <hr> | |
| </div> | |
| <!-- 基础测量输入 --> | |
| <div class="row mb-3"> | |
| <div class="col-md-4"> | |
| <label for="height" class="form-label"> | |
| <span class="lang-zh">身高 (cm) <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Height (cm) <span class="text-danger">*</span></span> | |
| </label> | |
| <input type="number" class="form-control" id="height" name="height" | |
| min="80" max="300" step="0.1" required> | |
| <div class="form-text"> | |
| <span class="lang-zh">请输入您的身高</span> | |
| <span class="lang-en" style="display: none;">Please enter your height</span> | |
| </div> | |
| </div> | |
| <div class="col-md-4"> | |
| <label for="weight" class="form-label"> | |
| <span class="lang-zh">体重 (kg) <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Weight (kg) <span class="text-danger">*</span></span> | |
| </label> | |
| <input type="number" class="form-control" id="weight" name="weight" | |
| min="20" max="300" step="0.1" required> | |
| <div class="form-text"> | |
| <span class="lang-zh">请输入您的体重</span> | |
| <span class="lang-en" style="display: none;">Please enter your weight</span> | |
| </div> | |
| </div> | |
| <div class="col-md-4"> | |
| <label for="waist" class="form-label"> | |
| <span class="lang-zh">腰围 (cm) <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Waist Circumference (cm) <span class="text-danger">*</span></span> | |
| </label> | |
| <input type="number" class="form-control" id="waist" name="waist" | |
| min="40" max="250" step="0.1" required> | |
| <div class="form-text"> | |
| <span class="lang-zh">请输入您的腰围</span> | |
| <span class="lang-en" style="display: none;">Please enter your waist circumference</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 自动计算的指标 --> | |
| <div class="row mb-3"> | |
| <div class="col-md-6"> | |
| <label for="body_mass_index" class="form-label"> | |
| <span class="lang-zh">体质量指数 (BMI)</span> | |
| <span class="lang-en" style="display: none;">Body Mass Index (BMI)</span> | |
| </label> | |
| <input type="number" class="form-control bg-light" id="body_mass_index" name="body_mass_index" | |
| min="10" max="80" step="0.1" readonly> | |
| <div class="form-text"> | |
| <span class="lang-zh">🔄 自动计算: 体重(kg) ÷ 身高²(m²)</span> | |
| <span class="lang-en" style="display: none;">🔄 Auto-calculated: weight(kg) ÷ height²(m²)</span> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <label for="WWI" class="form-label"> | |
| <span class="lang-zh">腰围重量指数 (WWI)</span> | |
| <span class="lang-en" style="display: none;">Waist-to-Weight Index (WWI)</span> | |
| </label> | |
| <input type="number" class="form-control bg-light" id="WWI" name="WWI" | |
| min="3" max="50" step="0.1" readonly> | |
| <div class="form-text"> | |
| <span class="lang-zh">🔄 自动计算: 腰围(cm) ÷ √体重(kg)</span> | |
| <span class="lang-en" style="display: none;">🔄 Auto-calculated: waist(cm) ÷ √weight(kg)</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 工作相关体力活动 --> | |
| <div class="section-header mt-4"> | |
| <h4 class="text-danger"> | |
| <i class="fas fa-briefcase me-2"></i> | |
| <span class="lang-zh">工作相关体力活动</span> | |
| <span class="lang-en" style="display: none;">Work-Related Physical Activity</span> | |
| </h4> | |
| <hr> | |
| </div> | |
| <!-- 高强度工作活动 --> | |
| <div class="row mb-3"> | |
| <div class="col-12"> | |
| <label for="PAQ605" class="form-label"> | |
| <span class="lang-zh">您的工作是否涉及高强度体力活动？ <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Does your work involve vigorous-intensity activity? <span class="text-danger">*</span></span> | |
| </label> | |
| <select class="form-select" id="PAQ605" name="PAQ605" required> | |
| <option value=""> | |
| <span class="lang-zh">请选择</span> | |
| <span class="lang-en" style="display: none;">Please select</span> | |
| </option> | |
| <option value="1"> | |
| <span class="lang-zh">是</span> | |
| <span class="lang-en" style="display: none;">Yes</span> | |
| </option> | |
| <option value="2"> | |
| <span class="lang-zh">否</span> | |
| <span class="lang-en" style="display: none;">No</span> | |
| </option> | |
| </select> | |
| <div class="form-text"> | |
| <span class="lang-zh">如搬运重物、挖掘或建筑工作等，持续至少10分钟</span> | |
| <span class="lang-en" style="display: none;">Such as carrying heavy loads, digging or construction work for at least 10 minutes</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="row mb-3" id="vigorous_work_details" style="display: none;"> | |
| <div class="col-md-6"> | |
| <label for="PAQ610" class="form-label"> | |
| <span class="lang-zh">一周内有几天进行高强度工作活动？</span> | |
| <span class="lang-en" style="display: none;">How many days per week?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAQ610" name="PAQ610" | |
| min="1" max="7" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">1-7天</span> | |
| <span class="lang-en" style="display: none;">1-7 days</span> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <label for="PAD615" class="form-label"> | |
| <span class="lang-zh">每次活动多长时间？(分钟)</span> | |
| <span class="lang-en" style="display: none;">Minutes per day?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAD615" name="PAD615" | |
| min="10" max="1440" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">每次典型的高强度工作活动时间</span> | |
| <span class="lang-en" style="display: none;">Time spent on a typical day</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 中等强度工作活动 --> | |
| <div class="row mb-3"> | |
| <div class="col-12"> | |
| <label for="PAQ620" class="form-label"> | |
| <span class="lang-zh">您的工作是否涉及中等强度体力活动？ <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Does your work involve moderate-intensity activity? <span class="text-danger">*</span></span> | |
| </label> | |
| <select class="form-select" id="PAQ620" name="PAQ620" required> | |
| <option value=""> | |
| <span class="lang-zh">请选择</span> | |
| <span class="lang-en" style="display: none;">Please select</span> | |
| </option> | |
| <option value="1"> | |
| <span class="lang-zh">是</span> | |
| <span class="lang-en" style="display: none;">Yes</span> | |
| </option> | |
| <option value="2"> | |
| <span class="lang-zh">否</span> | |
| <span class="lang-en" style="display: none;">No</span> | |
| </option> | |
| </select> | |
| <div class="form-text"> | |
| <span class="lang-zh">如快步走或搬运轻物等，持续至少10分钟</span> | |
| <span class="lang-en" style="display: none;">Such as brisk walking or carrying light loads for at least 10 minutes</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="row mb-3" id="moderate_work_details" style="display: none;"> | |
| <div class="col-md-6"> | |
| <label for="PAQ625" class="form-label"> | |
| <span class="lang-zh">一周内有几天进行中等强度工作活动？</span> | |
| <span class="lang-en" style="display: none;">How many days per week?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAQ625" name="PAQ625" | |
| min="1" max="7" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">1-7天</span> | |
| <span class="lang-en" style="display: none;">1-7 days</span> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <label for="PAD630" class="form-label"> | |
| <span class="lang-zh">每次活动多长时间？(分钟)</span> | |
| <span class="lang-en" style="display: none;">Minutes per day?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAD630" name="PAD630" | |
| min="10" max="1440" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">每次典型的中等强度工作活动时间</span> | |
| <span class="lang-en" style="display: none;">Time spent on a typical day</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 交通相关活动 --> | |
| <div class="section-header mt-4"> | |
| <h4 class="text-danger"> | |
| <i class="fas fa-bicycle me-2"></i> | |
| <span class="lang-zh">交通相关活动</span> | |
| <span class="lang-en" style="display: none;">Transportation Activity</span> | |
| </h4> | |
| <hr> | |
| </div> | |
| <div class="row mb-3"> | |
| <div class="col-12"> | |
| <label for="PAQ635" class="form-label"> | |
| <span class="lang-zh">您是否步行或骑自行车出行？ <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Do you walk or bicycle for transportation? <span class="text-danger">*</span></span> | |
| </label> | |
| <select class="form-select" id="PAQ635" name="PAQ635" required> | |
| <option value=""> | |
| <span class="lang-zh">请选择</span> | |
| <span class="lang-en" style="display: none;">Please select</span> | |
| </option> | |
| <option value="1"> | |
| <span class="lang-zh">是</span> | |
| <span class="lang-en" style="display: none;">Yes</span> | |
| </option> | |
| <option value="2"> | |
| <span class="lang-zh">否</span> | |
| <span class="lang-en" style="display: none;">No</span> | |
| </option> | |
| </select> | |
| <div class="form-text"> | |
| <span class="lang-zh">如上学、购物、上班等出行方式，持续至少10分钟</span> | |
| <span class="lang-en" style="display: none;">Such as to school, shopping, or work for at least 10 minutes</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="row mb-3" id="transport_details" style="display: none;"> | |
| <div class="col-md-6"> | |
| <label for="PAQ640" class="form-label"> | |
| <span class="lang-zh">一周内有几天步行或骑车出行？</span> | |
| <span class="lang-en" style="display: none;">How many days per week?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAQ640" name="PAQ640" | |
| min="1" max="7" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">1-7天</span> | |
| <span class="lang-en" style="display: none;">1-7 days</span> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <label for="PAD645" class="form-label"> | |
| <span class="lang-zh">每次出行多长时间？(分钟)</span> | |
| <span class="lang-en" style="display: none;">Minutes per day?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAD645" name="PAD645" | |
| min="10" max="1440" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">每次典型的步行或骑车出行时间</span> | |
| <span class="lang-en" style="display: none;">Time spent walking/bicycling on a typical day</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 休闲运动活动 --> | |
| <div class="section-header mt-4"> | |
| <h4 class="text-danger"> | |
| <i class="fas fa-running me-2"></i> | |
| <span class="lang-zh">休闲运动活动</span> | |
| <span class="lang-en" style="display: none;">Recreational Physical Activity</span> | |
| </h4> | |
| <hr> | |
| </div> | |
| <!-- 高强度休闲活动 --> | |
| <div class="row mb-3"> | |
| <div class="col-12"> | |
| <label for="PAQ650" class="form-label"> | |
| <span class="lang-zh">您是否参与高强度休闲运动？ <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Do you do vigorous recreational activities? <span class="text-danger">*</span></span> | |
| </label> | |
| <select class="form-select" id="PAQ650" name="PAQ650" required> | |
| <option value=""> | |
| <span class="lang-zh">请选择</span> | |
| <span class="lang-en" style="display: none;">Please select</span> | |
| </option> | |
| <option value="1"> | |
| <span class="lang-zh">是</span> | |
| <span class="lang-en" style="display: none;">Yes</span> | |
| </option> | |
| <option value="2"> | |
| <span class="lang-zh">否</span> | |
| <span class="lang-en" style="display: none;">No</span> | |
| </option> | |
| </select> | |
| <div class="form-text"> | |
| <span class="lang-zh">如跑步、篮球等引起大量喘息或心率增加的运动，持续至少10分钟</span> | |
| <span class="lang-en" style="display: none;">Such as running or basketball that cause large increases in breathing or heart rate for at least 10 minutes</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="row mb-3" id="vigorous_rec_details" style="display: none;"> | |
| <div class="col-md-6"> | |
| <label for="PAQ655" class="form-label"> | |
| <span class="lang-zh">一周内有几天进行高强度休闲运动？</span> | |
| <span class="lang-en" style="display: none;">How many days per week?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAQ655" name="PAQ655" | |
| min="1" max="7" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">1-7天</span> | |
| <span class="lang-en" style="display: none;">1-7 days</span> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <label for="PAD660" class="form-label"> | |
| <span class="lang-zh">每次运动多长时间？(分钟)</span> | |
| <span class="lang-en" style="display: none;">Minutes per day?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAD660" name="PAD660" | |
| min="10" max="1440" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">每次典型的高强度休闲运动时间</span> | |
| <span class="lang-en" style="display: none;">Time spent on a typical day</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 中等强度休闲活动 --> | |
| <div class="row mb-3"> | |
| <div class="col-12"> | |
| <label for="PAQ665" class="form-label"> | |
| <span class="lang-zh">您是否参与中等强度休闲运动？ <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">Do you do moderate recreational activities? <span class="text-danger">*</span></span> | |
| </label> | |
| <select class="form-select" id="PAQ665" name="PAQ665" required> | |
| <option value=""> | |
| <span class="lang-zh">请选择</span> | |
| <span class="lang-en" style="display: none;">Please select</span> | |
| </option> | |
| <option value="1"> | |
| <span class="lang-zh">是</span> | |
| <span class="lang-en" style="display: none;">Yes</span> | |
| </option> | |
| <option value="2"> | |
| <span class="lang-zh">否</span> | |
| <span class="lang-en" style="display: none;">No</span> | |
| </option> | |
| </select> | |
| <div class="form-text"> | |
| <span class="lang-zh">如快步走、骑车、游泳或排球等，持续至少10分钟</span> | |
| <span class="lang-en" style="display: none;">Such as brisk walking, bicycling, swimming, or volleyball for at least 10 minutes</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="row mb-3" id="moderate_rec_details" style="display: none;"> | |
| <div class="col-md-6"> | |
| <label for="PAQ670" class="form-label"> | |
| <span class="lang-zh">一周内有几天进行中等强度休闲运动？</span> | |
| <span class="lang-en" style="display: none;">How many days per week?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAQ670" name="PAQ670" | |
| min="1" max="7" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">1-7天</span> | |
| <span class="lang-en" style="display: none;">1-7 days</span> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <label for="PAD675" class="form-label"> | |
| <span class="lang-zh">每次运动多长时间？(分钟)</span> | |
| <span class="lang-en" style="display: none;">Minutes per day?</span> | |
| </label> | |
| <input type="number" class="form-control" id="PAD675" name="PAD675" | |
| min="10" max="1440" step="1"> | |
| <div class="form-text"> | |
| <span class="lang-zh">每次典型的中等强度休闲运动时间</span> | |
| <span class="lang-en" style="display: none;">Time spent on a typical day</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 久坐行为 --> | |
| <div class="section-header mt-4"> | |
| <h4 class="text-danger"> | |
| <i class="fas fa-chair me-2"></i> | |
| <span class="lang-zh">久坐行为</span> | |
| <span class="lang-en" style="display: none;">Sedentary Behavior</span> | |
| </h4> | |
| <hr> | |
| </div> | |
| <div class="row mb-4"> | |
| <div class="col-12"> | |
| <label for="PAD680" class="form-label"> | |
| <span class="lang-zh">您每天通常坐着多长时间？(分钟) <span class="text-danger">*</span></span> | |
| <span class="lang-en" style="display: none;">How much time do you usually spend sitting on a typical day? (minutes) <span class="text-danger">*</span></span> | |
| </label> | |
| <input type="number" class="form-control" id="PAD680" name="PAD680" | |
| min="0" max="1440" step="1" required> | |
| <div class="form-text"> | |
| <span class="lang-zh">包括在学校、家中、通勤、与朋友相处时的坐着时间，如办公、乘车、读书、看电视、使用电脑等（不包括睡觉时间）</span> | |
| <span class="lang-en" style="display: none;">Include time spent sitting at school, home, getting to/from places, or with friends including desk work, traveling, reading, watching TV, or using computer (do not include sleeping)</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 提交按钮 --> | |
| <div class="text-center"> | |
| <button type="submit" class="btn btn-danger btn-lg px-5" id="submitBtn"> | |
| <i class="fas fa-search me-2"></i> | |
| <span class="lang-zh">开始评估</span> | |
| <span class="lang-en" style="display: none;">Start Assessment</span> | |
| </button> | |
| </div> | |
| </form> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 结果显示区域 --> | |
| <div class="row mt-5" id="resultsSection" style="display: none;"> | |
| <div class="col-12"> | |
| <div class="card shadow"> | |
| <div class="card-header bg-danger text-white"> | |
| <h3 class="card-title mb-0"> | |
| <i class="fas fa-chart-pie me-2"></i> | |
| <span class="lang-zh">评估结果</span> | |
| <span class="lang-en" style="display: none;">Assessment Results</span> | |
| </h3> | |
| </div> | |
| <div class="card-body" id="resultsContent"> | |
| <!-- 结果内容将通过JavaScript动态填充 --> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 加载状态 --> | |
| <div class="row mt-5" id="loadingSection" style="display: none;"> | |
| <div class="col-12 text-center"> | |
| <div class="spinner-border text-primary" role="status"> | |
| <span class="visually-hidden"> | |
| <span class="lang-zh">加载中...</span> | |
| <span class="lang-en" style="display: none;">Loading...</span> | |
| </span> | |
| </div> | |
| <p class="mt-3"> | |
| <span class="lang-zh">正在分析您的健康数据，请稍候...</span> | |
| <span class="lang-en" style="display: none;">Analyzing your health data, please wait...</span> | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 页脚 --> | |
| <footer class="bg-light py-4 mt-5"> | |
| <div class="container text-center"> | |
| <div class="row"> | |
| <div class="col-12"> | |
| <p class="text-muted mb-1"> | |
| <i class="fas fa-shield-alt me-1"></i> | |
| <span class="lang-zh">SarcoAdvisor-BSU - 基于人工智能的肌少症风险评估系统</span> | |
| <span class="lang-en" style="display: none;">SarcoAdvisor-BSU - AI-powered sarcopenia risk assessment system</span> | |
| </p> | |
| <p class="text-muted small"> | |
| <i class="fas fa-exclamation-triangle me-1"></i> | |
| <span class="lang-zh">本系统仅供参考，具体诊疗请咨询专业医生</span> | |
| <span class="lang-en" style="display: none;">This system is for reference only. Please consult professional doctors for specific diagnosis and treatment</span> | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- 语言切换按钮 - 固定在页面底部 --> | |
| <div class="language-toggle-container" style="position: fixed; bottom: 20px; right: 20px; z-index: 1000;"> | |
| <button class="btn btn-primary btn-sm shadow" onclick="toggleLanguage()" | |
| style="border-radius: 25px; padding: 8px 16px;"> | |
| <i class="fas fa-globe me-1"></i> | |
| <span id="langToggleText">English</span> | |
| </button> | |
| </div> | |
| <!-- Bootstrap JavaScript --> | |
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script> | |
| <!-- 自定义JavaScript --> | |
| <script src="/static/app.js"></script> | |
| </body> | |
| </html> |