zouyu
10 天以前 93b79b3a68e19cc36a8feb3bfea4e08ae76ec233
src/views/equipmentManagement/ledger/Form.vue
@@ -1,70 +1,76 @@
<template>
  <el-form :model="form" label-width="100px">
  <el-form :model="form" label-width="120px" :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 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" placeholder="请输入规格型号" />
        <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="supplierName">
          <el-input v-model="form.supplierName" placeholder="请输入供应商" />
        <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="unit">
          <el-input v-model="form.unit" placeholder="请输入单位" />
        <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="number">
          <el-input
          <el-input-number :step="0.01" :min="0" style="width: 100%"
            v-model="form.number"
            placeholder="请输入数量"
            type="number"
            @change="mathNum"
          />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="含税单价" prop="taxIncludingPriceUnit">
          <el-input
        <el-form-item label="监控阈值上限" prop="taxIncludingPriceUnit">
          <el-input-number :step="0.01" :min="0" style="width: 100%"
            v-model="form.taxIncludingPriceUnit"
            placeholder="请输入含税单价"
            type="number"
            placeholder="请输入监控阈值上限"
            maxlength="10"
            @change="mathNum"
          />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="含税总价" prop="taxIncludingPriceTotal">
        <el-form-item label="监控阈值下限" prop="taxIncludingPriceTotal">
          <el-input
            v-model="form.taxIncludingPriceTotal"
            placeholder="请输入含税总价"
            placeholder="自动生成"
            type="number"
            disabled
          />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="税率" prop="taxRate">
          <el-input
        <el-form-item label="实时监测值" prop="taxRate">
          <el-select
            v-model="form.taxRate"
            placeholder="请输入税率"
            type="number"
            placeholder="请选择实时监测值"
            clearable
            @change="mathNum"
          >
            <template #append> % </template>
          </el-input>
            <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-form-item label="累计能耗" prop="unTaxIncludingPriceTotal">
          <el-input
            v-model="form.unTaxIncludingPriceTotal"
            placeholder="请输入不含税总价"
            placeholder="自动生成"
            type="number"
            disabled
          />
        </el-form-item>
      </el-col>
@@ -74,14 +80,14 @@
        </el-form-item>
      </el-col> -->
      <el-col :span="12">
        <el-form-item label="录入日期" prop="createTime">
        <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="请选择录入日期"
            placeholder="请选择监控日期"
            clearable
          />
        </el-form-item>
@@ -95,10 +101,27 @@
// 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: "请输入" }],
}
const { form, resetForm } = useFormData({
  deviceName: undefined, // 设备名称
@@ -115,6 +138,9 @@
});
const loadForm = async (id) => {
   if (id) {
      operationType.value = 'edit'
   }
  const { code, data } = await getLedgerById(id);
  if (code == 200) {
    form.deviceName = data.deviceName;
@@ -130,8 +156,44 @@
  }
};
const mathNum = () => {
  if (!form.taxIncludingPriceUnit) {
    ElMessage.error("请输入监控阈值上限");
    return;
  }
  if (!form.number) {
    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>