完善基础管理 供应商、客户、煤种等功能

张诺

18 小时以前 dd159ea51a7a77bd8cc00c70c0e900f472fb3395

完善基础管理 供应商、客户、煤种等功能

 src/views/basicInformation/index.vue

@@ -30,12 +30,12 @@
      </div>
      <pagination v-if="total>0" :page="pageNum" :limit="pageSizes" :total="total" @pagination="handPagination"
        :layout="'total, prev, pager, next, jumper'" />
      <Supplier v-if="tabName === 'supplier'" v-model:supplierDialogFormVisible="dialogFormVisible" :form="form"
      <Supplier v-if="tabName === 'supplier'" v-model:copyForm="copyForm" v-model:supplierDialogFormVisible="dialogFormVisible" :form="form"
        :title="title" @submit="handleSubmit" @beforeClose="handleBeforeClose"
        @update:dialogFormVisible="handleDialogFormVisible" :addOrEdit="addOrEdit" />
      <Customer v-if="tabName === 'customer'" v-model:customerDialogFormVisible="dialogFormVisible" :form="form"
      <Customer v-if="tabName === 'customer'" v-model:copyForm="copyForm" v-model:customerDialogFormVisible="dialogFormVisible" :form="form"
        :title="title" @submit="handleSubmit" :addOrEdit="addOrEdit" @beforeClose="handleBeforeClose" />
      <Coal v-if="tabName === 'coal'" v-model:coalDialogFormVisible="dialogFormVisible" :form="form" :title="title"
      <Coal v-if="tabName === 'coal'" v-model:copyForm="copyForm" v-model:coalDialogFormVisible="dialogFormVisible" :form="form" :title="title"
        :addOrEdit="addOrEdit" @submit="handleSubmit" />
      <coalQualityMaintenance v-if="tabName === 'coalQualityMaintenance'"
        v-model:coalQualityMaintenanceDialogFormVisible="dialogFormVisible" :form="form" :title="title"
@@ -144,7 +144,6 @@
      userList.value.forEach(user => {
        userMap.value[user.userId] = user.username;
      });
      console.log('用户映射表:', userMap.value);
    }
  } catch (error) {
    console.error('获取用户列表失败:', error);
@@ -236,7 +235,6 @@
    minWidth: 150,
    showOverflowTooltip: true,
    formatter: (row, column, cellValue) => {
      console.log(row, column, cellValue);
      let arr = [
        row.businessProvinceId,
        row.businessCityId,
@@ -387,7 +385,6 @@
};
// 提交表单
const handleSubmit = async (val) => {
  console.log(val);
  if (val.result.code !== 200) {
    ElMessage.error("操作失败：" + val.result.msg);
    return;

 src/views/basicInformation/mould/coal.vue

@@ -32,12 +32,12 @@
                    />
                </el-form-item>
                    
                <el-form-item>
                <el-form-item class="dialog-footer">
                    <el-button v-if="addOrEdit === 'edit'" @click="resetForm">重置</el-button>
                    <el-button v-if="addOrEdit === 'add'" @click="cancelForm">取消</el-button>
                    <el-button type="primary" @click="submitForm">
                        确定
                    </el-button>
                    <el-button v-if="addOrEdit === 'edit'" @click="resetForm">重置</el-button>
                    <el-button v-if="addOrEdit === 'add'" @click="cancelForm">取消</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
@@ -69,18 +69,16 @@
        default: ''
    },
})

const copyForm = defineModel("copyForm", {
  required: true,
  type: Object,
});
// 在组件挂载时获取用户信息
onMounted(async () => {
    // 如果store中没有用户信息，则获取用户信息
    if (!userStore.name) {
        try {
            await userStore.getInfo()
            console.log('用户信息:', {
                id: userStore.id,
                name: userStore.name,
                nickName: userStore.nickName
            })
            // 自动填充维护人ID
            if (props.addOrEdit === 'add') {
                formData.value.maintainerId = userStore.id
@@ -89,11 +87,6 @@
            console.error('获取用户信息失败:', error)
        }
    } else {
        console.log('用户信息:', {
            id: userStore.id,
            name: userStore.name,
            nickName: userStore.nickName
        })
        // 自动填充维护人ID
        if (props.addOrEdit === 'add') {
            formData.value.maintainerId = userStore.id
@@ -159,7 +152,8 @@
// 重置表单
const resetForm = () => {
    if (!formRef.value) return
    formRef.value.resetFields()
  formData.value = JSON.parse(JSON.stringify(copyForm.value));
    // formRef.value.resetFields()
}
// 关闭弹窗
const handleClose = () => {
@@ -186,5 +180,11 @@
}
</script>

<style lang="sass" scoped>
<style lang="scss" scoped>
.dialog-footer {
    display: flex;
    margin-top: 20px;
    flex-direction: column;
    align-items: flex-end;
}
</style>

 src/views/basicInformation/mould/customer.vue

@@ -38,12 +38,12 @@
        <el-form-item label="联系人详细" prop="contactAddress">
          <el-input v-model="formData.contactAddress" placeholder="请输入联系人详细地址" />
        </el-form-item>
        <el-form-item>
        <el-form-item class="dialog-footer"> 
          <el-button v-if="addOrEdit === 'edit'" @click="resetForm">重置</el-button>
          <el-button v-if="addOrEdit === 'add'" @click="cancelForm">取消</el-button>
          <el-button type="primary" @click="submitForm">
            确定
          </el-button>
          <el-button v-if="addOrEdit === 'edit'" @click="resetForm">重置</el-button>
          <el-button v-if="addOrEdit === 'add'" @click="cancelForm">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
@@ -83,6 +83,10 @@
  "handleBeforeClose",
  "update:customerDialogFormVisible",
]);
const copyForm = defineModel("copyForm", {
  required: true,
  type: Object,
});
onMounted(() => {
  fetchAreaOptions()
})
@@ -159,7 +163,6 @@
        let result = await addOrEditCustomer({
          ...formData.value,
        })
        console.log(result);
        obj.value = {
          title: "编辑",
          ...formData.value,
@@ -178,7 +181,9 @@
// 重置表单
const resetForm = () => {
  if (!formRef.value) return;
  formRef.value.resetFields();
  formData.value = JSON.parse(JSON.stringify(copyForm.value));

  // formRef.value.resetFields();
};
// 关闭弹窗
const handleClose = () => {
@@ -213,5 +218,11 @@
});
</script>

<style lang="sass" scoped>
<style lang="scss" scoped>
.dialog-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
  flex-direction: column;
}
</style>

 src/views/basicInformation/mould/supplier.vue

@@ -37,10 +37,10 @@
        <el-form-item label="联系人详细地址" prop="contactAddress">
          <el-input v-model="formData.contactAddress" placeholder="请输入联系人地址" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submitForm"> 确定</el-button>
        <el-form-item class="dialog-footer">
          <el-button v-if="addOrEdit === 'edit'" @click="resetForm">重置</el-button>
          <el-button v-if="addOrEdit === 'add'" @click="cancelForm">取消</el-button>
          <el-button type="primary" @click="submitForm"> 确定</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
@@ -73,7 +73,10 @@
});

const emit = defineEmits(["submit", "handleBeforeClose"]);

const copyForm = defineModel("copyForm", {
  required: true,
  type: Object,
});
onMounted(() => {
  fetchAreaOptions()
})
@@ -173,7 +176,8 @@
// 重置表单
const resetForm = () => {
  if (!formRef.value) return;
  formRef.value.resetFields();
  formData.value = JSON.parse(JSON.stringify(copyForm.value));
  // formRef.value.resetFields();
};
// 关闭弹窗
const handleClose = () => {
@@ -205,5 +209,11 @@
  ],
});
</script>
<style lang="sass" scoped>
<style lang="scss" scoped>
.dialog-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
  flex-direction: column;
}
</style>

 src/views/procureMent/components/ProductionDialog.vue

@@ -19,29 +19,52 @@
        <el-form-item label="供应商名称" prop="supplierName">
          <el-input v-model="form.supplierName" placeholder="请输入" />
        </el-form-item>
        <el-form-item label="煤种" prop="category">
          <el-input v-model="form.category" placeholder="请输入" />
        <el-form-item label="煤种" prop="coal">
          <el-input v-model="form.coal" placeholder="请输入" />
        </el-form-item>
        <el-form-item label="单位" prop="unit">
          <el-input v-model="form.unit" placeholder="请输入" />
        </el-form-item>
        <el-form-item label="采购数量" prop="purchaseAmount">
          <el-input v-model="form.purchaseAmount" placeholder="请输入" />
        <el-form-item label="采购数量" prop="purchaseQuantity">
          <el-input v-model="form.purchaseQuantity" placeholder="请输入"  />
        </el-form-item>
        <el-form-item label="单价(税前)" prop="priceBeforeTax">
          <el-input v-model="form.priceBeforeTax" placeholder="请输入" />
        <el-form-item label="单价(不含税)" prop="priceExcludingTax">
          <el-input v-model="form.priceExcludingTax" placeholder="请输入" >
            <template v-slot:suffix>
            <i style="font-style:normal;">元</i>
          </template>
          </el-input>
        </el-form-item>
        <el-form-item label="总价(税前)" prop="totalBeforeTax">
          <el-input v-model="form.totalBeforeTax" placeholder="请输入" />
        <el-form-item label="总价(不含税)" prop="totalPriceExcludingTax">
          <el-input v-model="form.totalPriceExcludingTax" placeholder="请输入" >
            <template v-slot:suffix>
            <i style="font-style:normal;">元</i>
          </template>
          </el-input>
        </el-form-item>
        <el-form-item label="热值" prop="calorificValue">
          <el-input v-model="form.calorificValue" placeholder="请输入" />
        <el-form-item label="单价(含税)" prop="priceIncludingTax">
          <el-input v-model="form.priceIncludingTax" placeholder="请输入" >
            <template v-slot:suffix>
            <i style="font-style:normal;">元</i>
          </template>
          </el-input>
        </el-form-item>
        <el-form-item label="登记人" prop="registrant">
          <el-input v-model="form.registrant" placeholder="请输入" />
        <el-form-item label="总价(含税)" prop="totalPriceIncludingTax">
          <el-input v-model="form.totalPriceIncludingTax" placeholder="请输入" >
            <template v-slot:suffix>
            <i style="font-style:normal;">元</i>
          </template>
          </el-input>
        </el-form-item>
        <el-form-item label="税率" prop="taxRate">
          <el-input v-model="form.taxRate" placeholder="请输入" />
        </el-form-item>
        <el-form-item label="登记人" prop="registrantId">
          <el-input v-model="form.registrantId" disabled placeholder="请输入" />
        </el-form-item>
        <el-form-item label="登记日期" prop="registrationDate">
          <el-date-picker
            disabled
            v-model="form.registrationDate"
            type="date"
            placeholder="YYYY-MM-DD"
@@ -52,20 +75,18 @@
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="handleSubmit">保存</el-button>
          <!-- 重置和取消 -->
          <el-button
            type="primary"
            @click="handleClose"
            v-if="title.includes('新增')"
            >取消</el-button
          >
          <el-button
            type="primary"
            @click="handleReset"
            v-if="title.includes('编辑')"
            >重置</el-button
          >
          <el-button type="primary" @click="handleSubmit">确认</el-button>
        </div>
      </template>
    </el-dialog>
@@ -73,8 +94,10 @@
</template>

<script setup name="ProductionDialog">
import { ref, defineProps, watch } from "vue";
import { ref, defineProps, watch, onMounted, nextTick } from "vue";
import { ElMessage } from "element-plus";
import useUserStore from '@/store/modules/user'
import {addOrEditPR} from "@/api/procureMent";
const props = defineProps({
  title: {
    type: String,
@@ -90,19 +113,31 @@
  required: true,
  type: Object,
});
const copyForm = defineModel("copyForm", {
  required: true,
  type: Object,
});
const userStore = useUserStore()
const userInfo = ref({});
onMounted(async () => {
  let res = await userStore.getInfo()
  userInfo.value = res;
})
const rules = {
  supplierName: [
    { required: true, message: "请输入供应商名称", trigger: "blur" },
  ],
  category: [{ required: true, message: "请输入煤种", trigger: "blur" }],
  coal: [{ required: true, message: "请输入煤种", trigger: "blur" }],
  unit: [{ required: true, message: "请输入单位", trigger: "blur" }],
  purchaseAmount: [
  purchaseQuantity: [
    { required: true, message: "请输入采购数量", trigger: "blur" },
  ],
  priceBeforeTax: [{ required: true, message: "请输入单价", trigger: "blur" }],
  totalBeforeTax: [{ required: true, message: "请输入总价", trigger: "blur" }],
  calorificValue: [{ required: true, message: "请输入热值", trigger: "blur" }],
  registrant: [{ required: true, message: "请输入登记人", trigger: "blur" }],
  priceExcludingTax: [{ required: true, message: "请输入单价", trigger: "blur" }],
  totalPriceExcludingTax: [{ required: true, message: "请输入总价", trigger: "blur" }],
  priceIncludingTax: [{ required: true, message: "请输入含税单价", trigger: "blur" }],
  totalPriceIncludingTax: [{ required: true, message: "请输入含税总价", trigger: "blur" }],
  taxRate: [{ required: true, message: "请输入税率", trigger: "blur" }],
  registrantId: [{ required: true, message: "请输入登记人", trigger: "blur" }],
  registrationDate: [
    { required: true, message: "请选择登记日期", trigger: "change" },
  ],
@@ -110,34 +145,47 @@
// 关闭弹窗
const handleClose = () => {
  dialogFormVisible.value = false;
};
const handleReset = async () => {
  // 重置表单数据
  form.value = JSON.parse(JSON.stringify(copyForm.value));
  // 等待DOM更新完成后清除表单验证状态
  await nextTick();
  if (formRef.value) {
    formRef.value.clearValidate();
  }
  console.log(form.value);
};
const handleReset = () => {
  if (!formRef.value) return;
  formRef.value.resetFields();
  ElMessage.success("表单已重置");
};
// 持续监听form.value的变化
watch(
  () => form.value,
  (val) => {
    console.log(val);
  }
);
const formRef = ref(null);
// 提交表单
const handleSubmit = async () => {
  if (!formRef.value) return;
  await formRef.value.validate((valid) => {
  await formRef.value.validate(async (valid) => {
    if (valid) {
      try {
        emit("success", { ...form.value });
        handleClose();
        ElMessage.success("保存成功");
      } catch (error) {
        console.error("保存失败:", error);
        ElMessage.error("保存失败");
      console.log("表单验证通过", form.value);
      const obj = ref({});
      if (props.title.includes('新增')) {
        let result = await addOrEditPR({
          ...form.value,
        })
        obj.value = {
          title: "新增",
          ...form.value,
          result
        };
      } else {
        delete form.value.updateTime
        delete form.value.createTime
        let result = await addOrEditPR({
          ...form.value,
        })
        obj.value = {
          title: "编辑",
          ...form.value,
          result
        };
      }
      emit("submit", obj.value);
    }
  });
};

 src/views/procureMent/index.vue

@@ -2,36 +2,16 @@
  <div class="app-container">
      <el-form :inline="true" :model="queryParams" class="search-form">
        <el-form-item label="搜索">
          <el-input
            v-model="queryParams.searchText"
            placeholder="请输入关键词"
            clearable
            :style="{ width: '100%' }"
          />
        <el-input v-model="queryParams.searchText" placeholder="请输入关键词" clearable :style="{ width: '100%' }" />
        </el-form-item>
        <el-form-item label="供应商名称">
          <el-input
            v-model="queryParams.supplierName"
            placeholder="请输入"
            clearable
            :style="{ width: '100%' }"
          />
        <el-input v-model="queryParams.supplierName" placeholder="请输入" clearable :style="{ width: '100%' }" />
        </el-form-item>
        <el-form-item label="统一人识别号">
          <el-input
            v-model="queryParams.identifyNumber"
            placeholder="请输入"
            clearable
            :style="{ width: '100%' }"
          />
        <el-input v-model="queryParams.identifyNumber" placeholder="请输入" clearable :style="{ width: '100%' }" />
        </el-form-item>
        <el-form-item label="经营地址">
          <el-input
            v-model="queryParams.address"
            placeholder="请输入"
            clearable
            :style="{ width: '100%' }"
          />
        <el-input v-model="queryParams.address" placeholder="请输入" clearable :style="{ width: '100%' }" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="handleQuery">查询</el-button>
@@ -41,38 +21,17 @@
    <el-card>
      <!-- 操作按钮区 -->
      <el-row :gutter="24" class="table-toolbar">
        <el-button type="primary" :icon="Plus" @click="handleAdd"
          >新建</el-button
        >
        <el-button type="primary" :icon="Plus" @click="handleAdd">新建</el-button>
        <el-button type="danger" :icon="Delete" @click="handleDelete">删除</el-button>
        <el-button type="info" :icon="Download" @click="handleExport">导出</el-button>
      </el-row> 
      <!-- 表格组件 -->
        <data-table
          :loading="loading"
          :table-data="tableData"
          :columns="columns"
          @selection-change="handleSelectionChange"
          @edit="handleEdit"
          @delete="handleDeleteSuccess"
          :show-selection="true"
          :border="true"
          :maxHeight="440"
        />      <pagination
        v-if="total>0"
        :page="pageNum"
        :limit="pageSize"
        :total="total"
        @pagination="handlePagination"
        :layout="'total, prev, pager, next, jumper'"
      />
    </el-card>    <ProductionDialog
        v-model:dialogFormVisible="dialogFormVisible"
        :form="form"
        :title="title"
        @submit="handleSubmit"
        @success="handleSuccess"
      />
      <data-table :loading="loading" :table-data="tableData" :columns="columns" @selection-change="handleSelectionChange"
        @edit="handleEdit" @delete="handleDeleteSuccess" :show-selection="true" :border="true" :maxHeight="440" />
      <pagination v-if="total>0" :page="pageNum" :limit="pageSize" :total="total" @pagination="handlePagination"
        :layout="'total, prev, pager, next, jumper'" />
    </el-card>    <ProductionDialog v-model:copyForm="copyForm" v-model:dialogFormVisible="dialogFormVisible" v-model:form="form" :title="title" @submit="handleSubmit"
      @success="handleSuccess" />
  </div>
</template>

@@ -84,6 +43,8 @@
import Pagination from "@/components/Pagination";
import ProductionDialog from './components/ProductionDialog.vue';
import { purchaseRegistration } from "@/api/procureMent";
import useUserStore from '@/store/modules/user'

const { proxy } = getCurrentInstance()
const dialogFormVisible = ref(false);
const form = ref({});
@@ -94,6 +55,7 @@
const pageNum = ref(1)
const pageSize = ref(10);
const selectedRows = ref([]);
const copyForm = ref({});
// 查询参数
const queryParams = reactive({
  searchText: "",
@@ -113,10 +75,13 @@
  // 这里添加实际的查询逻辑
  getList();
};

const userStore = useUserStore();
onMounted(async() => {
  let res = await userStore.getInfo()
  form.value.registrantId = res.user.userName; // 设置登记人ID
});
// 分页处理
const handlePagination = (val) => {
  console.log("分页参数：", val);
  pageNum.value = val.page;
  pageSize.value = val.limit;
  queryParams.pageNum = val.page;
@@ -127,8 +92,8 @@
// supplier 供应商数据
const columns = ref([
  { prop: "supplierName", label: "供应商名称", minWidth: 200 },
  { prop: "unit", label: "单位", minWidth: 150 },
  { prop: "coal", label: "煤种类型", minWidth: 120 },
  { prop: "unit", label: "单位", minWidth: 150 },
  { prop: "purchaseQuantity", label: "采购数量", minWidth: 100 },
  { prop: "priceIncludingTax", label: "单价（含税）", minWidth: 150 },
  { prop: "totalPriceIncludingTax", label: "总价（含税）", minWidth: 100 },
@@ -145,11 +110,9 @@
      queryParams[key] = "";
    }
  });
  handleQuery();
};
// 新增
const handleAdd = () => {
  console.log("点击新增按钮");
  addOrEdit.value = "add";
  handleAddEdit();
};
@@ -163,28 +126,36 @@
const openDialog = () => {
  if (addOrEdit.value === "edit") {
    // 确保复制一份数据，避免直接引用
    form.value = JSON.parse(JSON.stringify(form.value));
    copyForm.value = JSON.parse(JSON.stringify(form.value));
    dialogFormVisible.value = true;
    return;
  }
  // 新建时初始化表单
  form.value = {
    supplierName: "",
    category: "",
    coal: "",
    unit: "",
    purchaseAmount: "",
    priceBeforeTax: "",
    totalBeforeTax: "",
    calorificValue: "",
    registrant: "",
    purchaseQuantity: "",
    priceExcludingTax: "",
    totalPriceExcludingTax: "",
    priceIncludingTax: "",
    totalPriceIncludingTax: "",
    taxRate: "",
    registrantId: "",
    registrationDate: new Date().toISOString().split('T')[0]
  };  dialogFormVisible.value = true;
  console.log("openDialog 设置 dialogFormVisible =", dialogFormVisible.value);
  };
  // 新建时也需要设置 copyForm 用于重置功能
  copyForm.value = JSON.parse(JSON.stringify(form.value));
  dialogFormVisible.value = true;
};

// 提交表单
const handleSubmit = () => {
  // 拿到提交数据
const handleSubmit = (val) => {
  if (val.result.code !== 200) {
    ElMessage.error("操作失败：" + val.result.msg);
    return;
  }
  ElMessage.success(val.title + val.result.msg);
  dialogFormVisible.value = false;
  getList();
};
@@ -204,7 +175,7 @@
    return;
  }
  ElMessageBox.confirm(
    `确认删除选中的 ${selectedRows.value.length} 条数据吗？`,
    `确定删除选中的数据吗？`,
    "提示",
    {
      confirmButtonText: "确定",
@@ -236,7 +207,6 @@
};
// 成功
const handleSuccess = (val) => {
  console.log(val);
  tableData.value.push(val);
  // getList();
  total.value = tableData.value.length;
@@ -251,13 +221,11 @@
      pageSize: pageSize.value,
      ...queryParams
    });
    console.log("API返回数据:", res);
    if (res && res.data) {
      tableData.value = res.data.records || [];
      total.value = res.data.total || 0;
    }
  } catch (error) {
    console.error("获取数据失败:", error);
    ElMessage.error("获取数据失败");
  } finally {
    loading.value = false;
@@ -310,7 +278,8 @@
  }
}
/* 表格工具栏 */
.table-toolbar, .table-toolbar > * {
.table-toolbar,
.table-toolbar>* {
  margin: 0 0 0 0 !important;
}
.table-toolbar{

 src/views/production/components/ProductionDialog.vue

@@ -1,22 +1,11 @@
<template>
  <el-dialog
    v-model="dialogVisible"
    :title="dialogType === 'add' ? '新增生产加工' : '编辑生产加工'"
    width="800px"
    :close-on-click-modal="false"
    @close="handleClose"
  >
    <el-form
      ref="formRef"
      :model="formData"
      :rules="rules"
      label-width="120px"
      class="production-form"
    >
      <el-row :gutter="20">
        <el-col :span="12">
  <el-dialog v-model="dialogVisible" :title="dialogType === 'add' ? '新增生产加工' : '编辑生产加工'" width="1200px"
    :close-on-click-modal="false" @close="handleClose">
    <el-form ref="formRef" :model="formData" :rules="rules" class="production-form">
      <el-row :gutter="24">
        <el-col :span="6">
          <el-form-item label="煤种" prop="category">
            <el-select v-model="formData.category" placeholder="请选择煤种" clearable style="width: 100%">
            <el-select v-model="formData.category" placeholder="请选择煤种" clearable style="width: 100%" @change="selectChange">
              <el-option label="炼焦" value="炼焦" />
              <el-option label="气煤" value="气煤" />
              <el-option label="无烟煤" value="无烟煤" />
@@ -25,137 +14,53 @@
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="单位" prop="unit">
            <el-select v-model="formData.unit" placeholder="请选择单位" clearable style="width: 100%">
              <el-option label="吨位" value="吨位" />
              <el-option label="千克" value="千克" />
            </el-select>
        <el-col :span="6">
          <el-form-item label="热值" prop="Calorific">
            <el-input v-model="formData.Calorific" placeholder="请输入热值" clearable />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="生产数量" prop="productionVolume">
            <el-input-number
              v-model="formData.productionVolume"
              :min="0"
              :precision="2"
              style="width: 100%"
              @change="calculateTotal"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="人工成本" prop="laborCost">
            <el-input-number
              v-model="formData.laborCost"
              :min="0"
              :precision="2"
              style="width: 100%"
              @change="calculateTotal"
            />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="原料成本" prop="materialCost">
            <el-input-number
              v-model="formData.materialCost"
              :min="0"
              :precision="2"
              style="width: 100%"
              @change="calculateTotal"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="设备费用" prop="equipmentCost">
            <el-input-number
              v-model="formData.equipmentCost"
              :min="0"
              :precision="2"
              style="width: 100%"
              @change="calculateTotal"
            />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="总成本" prop="totalCost">
            <el-input-number
              v-model="formData.totalCost"
              :min="0"
              :precision="2"
              style="width: 100%"
              disabled
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="总价格" prop="totalPrice">
            <el-input-number
              v-model="formData.totalPrice"
              :min="0"
              :precision="2"
              style="width: 100%"
              @change="calculateProfit"
            />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="利润" prop="profit">
            <el-input-number
              v-model="formData.profit"
              :min="0"
              :precision="2"
              style="width: 100%"
              disabled
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="复记人" prop="reviewer">
            <el-input v-model="formData.reviewer" placeholder="请输入复记人" />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="日期" prop="date">
            <el-date-picker
              v-model="formData.date"
              type="date"
              placeholder="请选择日期"
              style="width: 100%"
              value-format="YYYY-MM-DD"
            />
          </el-form-item>
        <el-col :span="4" :offset="8">
          <el-button type="primary" @click="search">查询</el-button>
          <el-button @click="reset">重置</el-button>
        </el-col>
      </el-row>
    </el-form>

    <ETable :columns="columns" height="200" @cell-edit="handleCellEdit" :showOperations="false" :tableData="tableData" @row-click="handleRowClick" :editableColumns="['used']" />
    <el-row :gutter="10">
        <el-col :span="4">
          <h1>生产明细</h1>
        </el-col>
    </el-row>
    <el-row :gutter="10">
        <el-col :span="2">
          <el-button type="primary">
            <el-icon><Plus /></el-icon> 新增
          </el-button>
        </el-col>
        <el-col :span="2"><el-button type="danger">
            <el-icon><Delete /></el-icon> 删除
          </el-button></el-col>
        <el-col :span="2">
          <el-button type="warning">
            <el-icon><Warning /></el-icon> 修改
          </el-button>
        </el-col>
    </el-row>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="handleClose">取 消</el-button>
        <el-button type="primary" :loading="loading" @click="handleSubmit">确 定</el-button>
      </div>
      
    </template>
  </el-dialog>
</template>

<script setup>
import { ref, reactive, watch } from 'vue'
import ETable from '@/components/Table/ETable.vue'
import { ElMessage } from 'element-plus'
import { Delete, Warning } from '@element-plus/icons-vue'

const props = defineProps({
  visible: {
@@ -171,14 +76,28 @@
    default: () => ({})
  }
})

const dialogVisible = defineModel('visible', {
  type: Boolean,
  default: false
})
const emit = defineEmits(['update:visible', 'success'])

const dialogVisible = ref(false)
const dialogType = ref('add')
const loading = ref(false)
const formRef = ref(null)

const tableData = ref([])
const currentRow = ref(null)
const columns = [
  { label: '煤种', prop: 'category' },
  { label: '热值', prop: 'Calorific' },
  { label: '库存数量', prop: 'stock' },
  { label: '本次使用数量', prop: 'used' },
]
const handleRowClick = (row) => {
  currentRow.value = row
  console.log('当前行数据:', currentRow.value)
}
// 表单数据
const formData = reactive({
  category: '',
@@ -197,45 +116,37 @@
// 表单验证规则
const rules = {
  category: [{ required: true, message: '请选择煤种', trigger: 'change' }],
  unit: [{ required: true, message: '请选择单位', trigger: 'change' }],
  productionVolume: [{ required: true, message: '请输入生产数量', trigger: 'blur' }],
  laborCost: [{ required: true, message: '请输入人工成本', trigger: 'blur' }],
  materialCost: [{ required: true, message: '请输入原料成本', trigger: 'blur' }],
  equipmentCost: [{ required: true, message: '请输入设备费用', trigger: 'blur' }],
  totalPrice: [{ required: true, message: '请输入总价格', trigger: 'blur' }],
  reviewer: [{ required: true, message: '请输入复记人', trigger: 'blur' }],
  date: [{ required: true, message: '请选择日期', trigger: 'change' }]
}

// 监听visible变化
watch(() => props.visible, (val) => {
  dialogVisible.value = val
  if (val) {
    dialogType.value = props.type
    if (props.type === 'edit') {
      Object.assign(formData, props.rowData)
const search = () => {
  // 查询逻辑
  if (!formData.category) {
    return this.$message.error('请选择煤种')
    }
  }
})

// 监听dialogVisible变化
watch(() => dialogVisible.value, (val) => {
  emit('update:visible', val)
})

// 计算总成本
const calculateTotal = () => {
  formData.totalCost = (
    formData.laborCost +
    formData.materialCost +
    formData.equipmentCost
  )
  calculateProfit()
  loading.value = true
  // 模拟查询数据
  setTimeout(() => {
    // 假数据
    tableData.value = [
      { category: '炼焦', Calorific: '6000', stock: 100, used: 20 },
      { category: '气煤', Calorific: '5500', stock: 80, used: 15 },
      { category: '气煤', Calorific: '5500', stock: 80, used: 15 },
      { category: '气煤', Calorific: '5500', stock: 80, used: 15 },
      { category: '气煤', Calorific: '5500', stock: 80, used: 15 },
      { category: '气煤', Calorific: '5500', stock: 80, used: 15 },
      { category: '气煤', Calorific: '5500', stock: 80, used: 15 },
      { category: '无烟煤', Calorific: '7000', stock: 120, used: 30 }
    ]
    loading.value = false
  }, 1000)
}

// 计算利润
const calculateProfit = () => {
  formData.profit = formData.totalPrice - formData.totalCost
const reset = () => {
  // formRef
  formRef.value?.resetFields()
}

const selectChange = (value) => {
}

// 提交表单
@@ -271,28 +182,28 @@
    date: ''
  })
}

// 添加单元格编辑处理函数
const handleCellEdit = (row, prop, value) => {
  console.log('单元格编辑:',  prop)
  // console.log('单元格编辑完成:', row, prop, value)
  // 这里可以添加验证逻辑，例如检查使用量是否大于库存
  if (prop === 'used' && Number(value) > Number(row.stock)) {
    ElMessage.warning('使用数量不能大于库存数量！')
    // 可以在这里重置值
    row.used = row.stock
  }
}
</script>

<style scoped>
.production-form {
  padding: 20px;
<style scoped lang="scss"> 
.el-form{
  .el-row {
    padding-top: 20px;
    background: rgba($color: #F8FAFB, $alpha: 0.5) ;
}

.dialog-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

:deep(.el-form-item__label) {
  font-weight: bold;
}

:deep(.el-input-number) {
  width: 100%;
}

:deep(.el-select) {
  width: 100%;
.el-row>.el-col>h1{
  font-weight: bolder;
}
</style>