<template> 
 | 
  <el-form :model="form" label-width="100px" :rules="formRules" ref="formRef"> 
 | 
    <el-row :gutter="20"> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="设备名称" prop="deviceName"> 
 | 
          <el-input v-model="form.deviceName" placeholder="请输入设备名称" /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="规格型号" prop="deviceModel"> 
 | 
          <el-input v-model="form.deviceModel" :disabled="(form.deviceModel != null && operationType === 'edit')" placeholder="请输入规格型号" /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="设备品牌" prop="deviceBrand"> 
 | 
          <el-input v-model="form.deviceBrand" placeholder="请输入设备品牌" /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="供应商" prop="supplierName"> 
 | 
          <el-input v-model="form.supplierName" placeholder="请输入供应商" /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="存放位置" prop="storageLocation"> 
 | 
          <el-input v-model="form.storageLocation" placeholder="请输入存放位置" /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="单位" prop="unit"> 
 | 
          <el-input v-model="form.unit" placeholder="请输入单位" /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="启用折旧" prop="enableDepreciation"> 
 | 
          <el-switch v-model="form.enableDepreciation" :active-value="true" :inactive-value="false" /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="数量" prop="number"> 
 | 
          <el-input-number :min="1" style="width: 100%" 
 | 
            v-model="form.number" 
 | 
                                                     disabled 
 | 
            placeholder="请输入数量" 
 | 
            @change="mathNum" 
 | 
          /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="含税单价" prop="taxIncludingPriceUnit"> 
 | 
          <el-input-number :step="0.01" :min="0" style="width: 100%" 
 | 
            v-model="form.taxIncludingPriceUnit" 
 | 
            placeholder="请输入含税单价" 
 | 
            maxlength="10" 
 | 
            @change="mathNum" 
 | 
          /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="含税总价" prop="taxIncludingPriceTotal"> 
 | 
          <el-input 
 | 
            v-model="form.taxIncludingPriceTotal" 
 | 
            placeholder="自动生成" 
 | 
            type="number" 
 | 
            disabled 
 | 
          /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="税率(%)" prop="taxRate"> 
 | 
          <!-- <el-input 
 | 
            v-model="form.taxRate" 
 | 
            placeholder="请输入税率" 
 | 
            type="number" 
 | 
          > 
 | 
            <template #append> % </template> 
 | 
          </el-input> --> 
 | 
          <el-select 
 | 
            v-model="form.taxRate" 
 | 
            placeholder="请选择" 
 | 
            clearable 
 | 
            @change="mathNum" 
 | 
          > 
 | 
            <el-option label="1" :value="1" /> 
 | 
            <el-option label="6" :value="6" /> 
 | 
            <el-option label="13" :value="13" /> 
 | 
          </el-select> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="不含税总价" prop="unTaxIncludingPriceTotal"> 
 | 
          <el-input 
 | 
            v-model="form.unTaxIncludingPriceTotal" 
 | 
            placeholder="自动生成" 
 | 
            type="number" 
 | 
            disabled 
 | 
          /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
      <!-- <el-col :span="12"> 
 | 
        <el-form-item label="录入人" prop="createUser"> 
 | 
          <el-input v-model="form.createUser" placeholder="请输入录入人" /> 
 | 
        </el-form-item> 
 | 
      </el-col> --> 
 | 
      <el-col :span="12"> 
 | 
        <el-form-item label="录入日期" prop="createTime"> 
 | 
          <el-date-picker 
 | 
            style="width: 100%" 
 | 
            v-model="form.createTime" 
 | 
            format="YYYY-MM-DD" 
 | 
            value-format="YYYY-MM-DD HH:mm:ss" 
 | 
            type="date" 
 | 
            placeholder="请选择录入日期" 
 | 
            clearable 
 | 
          /> 
 | 
        </el-form-item> 
 | 
      </el-col> 
 | 
            <el-col :span="12"> 
 | 
                <el-form-item label="预计运行时间" prop="planRuntimeTime"> 
 | 
                    <el-date-picker 
 | 
                        style="width: 100%" 
 | 
                        v-model="form.planRuntimeTime" 
 | 
                        format="YYYY-MM-DD" 
 | 
                        value-format="YYYY-MM-DD" 
 | 
                        type="date" 
 | 
                        placeholder="请选择录入日期" 
 | 
                        clearable 
 | 
                    /> 
 | 
                </el-form-item> 
 | 
            </el-col> 
 | 
    </el-row> 
 | 
  </el-form> 
 | 
</template> 
 | 
  
 | 
<script setup> 
 | 
import useFormData from "@/hooks/useFormData"; 
 | 
// import useUserStore from "@/store/modules/user"; 
 | 
import { getLedgerById } from "@/api/equipmentManagement/ledger"; 
 | 
import dayjs from "dayjs"; 
 | 
import { 
 | 
  calculateTaxIncludeTotalPrice, 
 | 
  calculateTaxExclusiveTotalPrice, 
 | 
} from "@/utils/summarizeTable"; 
 | 
import { ElMessage } from "element-plus"; 
 | 
import {ref} from "vue"; 
 | 
  
 | 
defineOptions({ 
 | 
  name: "设备台账表单", 
 | 
}); 
 | 
const formRef = ref(null); 
 | 
const operationType = ref(''); 
 | 
const formRules = { 
 | 
    deviceName: [{ required: true, trigger: "blur", message: "请输入" }], 
 | 
    deviceModel: [{ required: true, trigger: "blur", message: "请输入" }], 
 | 
    supplierName: [{ required: true, trigger: "blur", message: "请输入" }], 
 | 
    unit: [{ required: true, trigger: "blur", message: "请输入" }], 
 | 
    number: [{ required: true, trigger: "blur", message: "请输入" }], 
 | 
    taxIncludingPriceUnit: [{ required: true, trigger: "blur", message: "请输入" }], 
 | 
    taxRate: [{ required: true, trigger: "change", message: "请输入" }], 
 | 
    planRuntimeTime: [{ required: true, trigger: "change", message: "请选择" }], 
 | 
} 
 | 
  
 | 
const { form, resetForm } = useFormData({ 
 | 
  deviceName: undefined, // 设备名称 
 | 
  deviceModel: undefined, // 规格型号 
 | 
  deviceBrand: undefined, // 设备品牌 
 | 
  supplierName: undefined, // 供应商 
 | 
  storageLocation: undefined, // 存放位置 
 | 
  enableDepreciation: false, // 是否启用折旧 
 | 
  unit: undefined, // 单位 
 | 
  number: 1, // 数量 
 | 
  taxIncludingPriceUnit: undefined, // 含税单价 
 | 
  taxIncludingPriceTotal: undefined, // 含税总价 
 | 
  taxRate: undefined, // 税率 
 | 
  unTaxIncludingPriceTotal: undefined, // 不含税总价 
 | 
  // createUser: useUserStore().nickName, // 录入人 
 | 
  createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"), // 录入日期 
 | 
    planRuntimeTime: dayjs().format("YYYY-MM-DD"), // 录入日期 
 | 
}); 
 | 
  
 | 
const loadForm = async (id) => { 
 | 
    if (id) { 
 | 
        operationType.value = 'edit' 
 | 
    } 
 | 
  const { code, data } = await getLedgerById(id); 
 | 
  if (code == 200) { 
 | 
    form.deviceName = data.deviceName; 
 | 
    form.deviceModel = data.deviceModel; 
 | 
    form.deviceBrand = data.deviceBrand; 
 | 
    form.supplierName = data.supplierName; 
 | 
    form.storageLocation = data.storageLocation; 
 | 
    form.enableDepreciation = data.enableDepreciation; 
 | 
    form.unit = data.unit; 
 | 
    form.number = 1; 
 | 
    form.taxIncludingPriceUnit = data.taxIncludingPriceUnit; 
 | 
    form.taxIncludingPriceTotal = data.taxIncludingPriceTotal; 
 | 
    form.taxRate = data.taxRate; 
 | 
    form.unTaxIncludingPriceTotal = data.unTaxIncludingPriceTotal; 
 | 
    form.createTime = data.createTime; 
 | 
  } 
 | 
}; 
 | 
  
 | 
const mathNum = () => { 
 | 
  if (!form.taxIncludingPriceUnit) { 
 | 
    ElMessage.error("请输入单价"); 
 | 
    return; 
 | 
  } 
 | 
  form.taxIncludingPriceTotal = calculateTaxIncludeTotalPrice( 
 | 
    form.taxIncludingPriceUnit, 
 | 
    form.number 
 | 
  ); 
 | 
  if (form.taxRate) { 
 | 
    form.unTaxIncludingPriceTotal = calculateTaxExclusiveTotalPrice( 
 | 
      form.taxIncludingPriceTotal, 
 | 
      form.taxRate 
 | 
    ); 
 | 
  } 
 | 
}; 
 | 
  
 | 
// 清除表单校验状态 
 | 
const clearValidate = () => { 
 | 
  formRef.value?.clearValidate(); 
 | 
}; 
 | 
  
 | 
// 重置表单数据和校验状态 
 | 
const resetFormAndValidate = () => { 
 | 
  resetForm(); 
 | 
  clearValidate(); 
 | 
}; 
 | 
  
 | 
defineExpose({ 
 | 
  form, 
 | 
  loadForm, 
 | 
  resetForm, 
 | 
  clearValidate, 
 | 
  resetFormAndValidate, 
 | 
    formRef, 
 | 
}); 
 | 
</script> 
 |