From 6b9dd0a1b0c259a02c086f7834467e1fa2c2a5ea Mon Sep 17 00:00:00 2001 From: 张诺 <zhang_12370@163.com> Date: 星期五, 30 五月 2025 17:58:54 +0800 Subject: [PATCH] 调整基础信息供应商模块,客户信息模块并新增联动查询省市区联动,修改table表格方法 --- src/views/production/components/ProductionDialog.vue | 298 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 298 insertions(+), 0 deletions(-) diff --git a/src/views/production/components/ProductionDialog.vue b/src/views/production/components/ProductionDialog.vue new file mode 100644 index 0000000..2787bb2 --- /dev/null +++ b/src/views/production/components/ProductionDialog.vue @@ -0,0 +1,298 @@ +<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-form-item label="鐓ょ" prop="category"> + <el-select v-model="formData.category" placeholder="璇烽�夋嫨鐓ょ" clearable style="width: 100%"> + <el-option label="鐐肩劍" value="鐐肩劍" /> + <el-option label="姘旂叅" value="姘旂叅" /> + <el-option label="鏃犵儫鐓�" value="鏃犵儫鐓�" /> + <el-option label="闀跨劙鐓�" value="闀跨劙鐓�" /> + <el-option label="璐叅" value="璐叅" /> + </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-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> + </el-row> + </el-form> + + <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 { ElMessage } from 'element-plus' + +const props = defineProps({ + visible: { + type: Boolean, + default: false + }, + type: { + type: String, + default: 'add' // 'add' 鎴� 'edit' + }, + rowData: { + type: Object, + default: () => ({}) + } +}) + +const emit = defineEmits(['update:visible', 'success']) + +const dialogVisible = ref(false) +const dialogType = ref('add') +const loading = ref(false) +const formRef = ref(null) + +// 琛ㄥ崟鏁版嵁 +const formData = reactive({ + category: '', + unit: '', + productionVolume: 0, + laborCost: 0, + materialCost: 0, + equipmentCost: 0, + totalCost: 0, + totalPrice: 0, + profit: 0, + reviewer: '', + date: '' +}) + +// 琛ㄥ崟楠岃瘉瑙勫垯 +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) + } + } +}) + +// 鐩戝惉dialogVisible鍙樺寲 +watch(() => dialogVisible.value, (val) => { + emit('update:visible', val) +}) + +// 璁$畻鎬绘垚鏈� +const calculateTotal = () => { + formData.totalCost = ( + formData.laborCost + + formData.materialCost + + formData.equipmentCost + ) + calculateProfit() +} + +// 璁$畻鍒╂鼎 +const calculateProfit = () => { + formData.profit = formData.totalPrice - formData.totalCost +} + +// 鎻愪氦琛ㄥ崟 +const handleSubmit = async () => { + if (!formRef.value) return + + await formRef.value.validate((valid) => { + if (valid) { + loading.value = true + // 瑙﹀彂鎴愬姛浜嬩欢锛屼紶閫掕〃鍗曟暟鎹� + emit('success', { ...formData }) + loading.value = false + handleClose() + } + }) +} + +// 鍏抽棴寮圭獥 +const handleClose = () => { + dialogVisible.value = false + formRef.value?.resetFields() + Object.assign(formData, { + category: '', + unit: '', + productionVolume: 0, + laborCost: 0, + materialCost: 0, + equipmentCost: 0, + totalCost: 0, + totalPrice: 0, + profit: 0, + reviewer: '', + date: '' + }) +} +</script> + +<style scoped> +.production-form { + padding: 20px; +} + +.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%; +} +</style> \ No newline at end of file -- Gitblit v1.9.3