<template>
  <el-form ref="NutritionSettingFormRef" :model="form" :rules="rules" label-width="80px">
    <el-form-item label="所需热量" prop="caloriesKcalPerDay">
      <el-input v-model="form.caloriesKcalPerDay" placeholder="请输入所需热量" />
    </el-form-item>
    <el-form-item label="所需热量" prop="caloriesKcalPerKgDay">
      <el-input v-model="form.caloriesKcalPerKgDay" placeholder="请输入所需热量" />
    </el-form-item>
    <el-form-item label="所需热量" prop="caloriesKjPerDay">
      <el-input v-model="form.caloriesKjPerDay" placeholder="请输入所需热量" />
    </el-form-item>
    <el-form-item label="蛋白质热量占比" prop="proteinCaloriePercentage">
      <el-input v-model="form.proteinCaloriePercentage" placeholder="请输入蛋白质热量占比" />
    </el-form-item>
    <el-form-item label="脂肪热量占比" prop="fatCaloriePercentage">
      <el-input v-model="form.fatCaloriePercentage" placeholder="请输入脂肪热量占比" />
    </el-form-item>
    <el-form-item label="碳水化合物热量占比" prop="carbohydrateCaloriePercentage">
      <el-input v-model="form.carbohydrateCaloriePercentage" placeholder="请输入碳水化合物热量占比" />
    </el-form-item>
    <el-form-item label="所需蛋白质" prop="proteinGPerKgDay">
      <el-input v-model="form.proteinGPerKgDay" placeholder="请输入所需蛋白质" />
    </el-form-item>
    <el-form-item label="所需蛋白质" prop="proteinGPerDay">
      <el-input v-model="form.proteinGPerDay" placeholder="请输入所需蛋白质" />
    </el-form-item>
    <el-form-item label="所需脂肪" prop="fatGPerKgDay">
      <el-input v-model="form.fatGPerKgDay" placeholder="请输入所需脂肪" />
    </el-form-item>
    <el-form-item label="所需脂肪" prop="fatGPerDay">
      <el-input v-model="form.fatGPerDay" placeholder="请输入所需脂肪" />
    </el-form-item>
    <el-form-item label="所需碳水化合物" prop="carbohydrateGPerKgDay">
      <el-input v-model="form.carbohydrateGPerKgDay" placeholder="请输入所需碳水化合物" />
    </el-form-item>
    <el-form-item label="所需碳水化合物" prop="carbohydrateGPerDay">
      <el-input v-model="form.carbohydrateGPerDay" placeholder="请输入所需碳水化合物" />
    </el-form-item>
    <el-form-item label="钙" prop="calcium">
      <el-input v-model="form.calcium" placeholder="请输入钙" />
    </el-form-item>
    <el-form-item label="钾" prop="potassium">
      <el-input v-model="form.potassium" placeholder="请输入钾" />
    </el-form-item>
    <el-form-item label="钠" prop="sodium">
      <el-input v-model="form.sodium" placeholder="请输入钠" />
    </el-form-item>
    <el-form-item label="镁" prop="magnesium">
      <el-input v-model="form.magnesium" placeholder="请输入镁" />
    </el-form-item>
    <el-form-item label="磷" prop="phosphorus">
      <el-input v-model="form.phosphorus" placeholder="请输入磷" />
    </el-form-item>
    <el-form-item label="氯" prop="chloride">
      <el-input v-model="form.chloride" placeholder="请输入氯" />
    </el-form-item>
    <el-form-item label="铁" prop="iron">
      <el-input v-model="form.iron" placeholder="请输入铁" />
    </el-form-item>
    <el-form-item label="硒" prop="selenium">
      <el-input v-model="form.selenium" placeholder="请输入硒" />
    </el-form-item>
    <el-form-item label="锰" prop="manganese">
      <el-input v-model="form.manganese" placeholder="请输入锰" />
    </el-form-item>
    <el-form-item label="氟" prop="fluoride">
      <el-input v-model="form.fluoride" placeholder="请输入氟" />
    </el-form-item>
    <el-form-item label="钼" prop="molybdenum">
      <el-input v-model="form.molybdenum" placeholder="请输入钼" />
    </el-form-item>
    <el-form-item label="锌" prop="zinc">
      <el-input v-model="form.zinc" placeholder="请输入锌" />
    </el-form-item>
    <el-form-item label="铜" prop="copper">
      <el-input v-model="form.copper" placeholder="请输入铜" />
    </el-form-item>
    <el-form-item label="碘" prop="iodine">
      <el-input v-model="form.iodine" placeholder="请输入碘" />
    </el-form-item>
    <el-form-item label="铬" prop="chromium">
      <el-input v-model="form.chromium" placeholder="请输入铬" />
    </el-form-item>
    <el-form-item label="维生素A" prop="vitaminA">
      <el-input v-model="form.vitaminA" placeholder="请输入维生素A" />
    </el-form-item>
    <el-form-item label="维生素D" prop="vitaminD">
      <el-input v-model="form.vitaminD" placeholder="请输入维生素D" />
    </el-form-item>
    <el-form-item label="维生素E" prop="vitaminE">
      <el-input v-model="form.vitaminE" placeholder="请输入维生素E" />
    </el-form-item>
    <el-form-item label="维生素K" prop="vitaminK">
      <el-input v-model="form.vitaminK" placeholder="请输入维生素K" />
    </el-form-item>
    <el-form-item label="维生素B1" prop="vitaminBOne">
      <el-input v-model="form.vitaminBOne" placeholder="请输入维生素B1" />
    </el-form-item>
    <el-form-item label="维生素B2" prop="vitaminBTwo">
      <el-input v-model="form.vitaminBTwo" placeholder="请输入维生素B2" />
    </el-form-item>
    <el-form-item label="维生素B6" prop="vitaminBSix">
      <el-input v-model="form.vitaminBSix" placeholder="请输入维生素B6" />
    </el-form-item>
    <el-form-item label="维生素B12" prop="vitaminBTwelve">
      <el-input v-model="form.vitaminBTwelve" placeholder="请输入维生素B12" />
    </el-form-item>
    <el-form-item label="烟酸" prop="niacin">
      <el-input v-model="form.niacin" placeholder="请输入烟酸" />
    </el-form-item>
    <el-form-item label="维生素C" prop="vitaminC">
      <el-input v-model="form.vitaminC" placeholder="请输入维生素C" />
    </el-form-item>
    <el-form-item label="叶酸" prop="folicAcid">
      <el-input v-model="form.folicAcid" placeholder="请输入叶酸" />
    </el-form-item>
    <el-form-item label="胆碱" prop="choline">
      <el-input v-model="form.choline" placeholder="请输入胆碱" />
    </el-form-item>
    <el-form-item label="生物素" prop="biotin">
      <el-input v-model="form.biotin" placeholder="请输入生物素" />
    </el-form-item>
    <el-form-item label="泛酸" prop="pantothenicAcid">
      <el-input v-model="form.pantothenicAcid" placeholder="请输入泛酸" />
    </el-form-item>
    <el-form-item label="膳食纤维" prop="dietaryFiber">
      <el-input v-model="form.dietaryFiber" placeholder="请输入膳食纤维" />
    </el-form-item>
    <el-form-item label="患者id" prop="patientId">
      <el-input v-model="form.patientId" placeholder="请输入患者id" />
    </el-form-item>
    <el-form-item label="科室" prop="deptId">
      <el-input v-model="form.deptId" placeholder="请输入科室" />
    </el-form-item>
    <el-form-item label="门诊号" prop="outpatientNo">
      <el-input v-model="form.outpatientNo" placeholder="请输入门诊号" />
    </el-form-item>
    <template>
      <div class="dialog-footer">
        <el-button :loading="buttonLoading" type="primary" @click="() => submitForm()">确 定</el-button>
        <el-button @click="() => cancel()">取 消</el-button>
      </div>
    </template>
  </el-form>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { addSetting, updateSetting } from '@/api/patients/nutritionSetting';
import type { FormInstance } from 'element-plus';

// 接收父组件传递的参数
const props = defineProps({
  form: {
    type: Object,
    required: true
  },
  rules: {
    type: Object,
    required: true
  },
  buttonLoading: {
    type: Boolean,
    required: true
  },
  submitForm: {
    type: Function,
    required: true
  },
  cancel: {
    type: Function,
    required: true
  }
});

// 表单ref
const NutritionSettingFormRef = ref<FormInstance>();

// 新增
const handleAdd = async () => {
  await addSetting({ ...props.form });
};
// 更新
const handleUpdate = async () => {
  await updateSetting({ ...props.form });
};
</script>
