Merge remote-tracking branch 'origin/dev_ai' into ywx

yaowanxin

2025-08-12 a0dd2bd1be4e97a93443a48b86c719930d0a268a

 src/views/energyManagement/waterManagement/components/formDia.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,221 @@
<template>
  <div>
    <el-dialog
        v-model="dialogFormVisible"
        title="用水设备"
        width="70%"
        @close="closeDia"
    >
         <el-form
            :model="form"
            label-width="140px"
            label-position="top"
            :rules="rules"
            ref="formRef"
         >
            <el-row :gutter="30">
               <el-col :span="12">
                  <el-form-item label="设备：" prop="deviceModel">
                     <el-select
                        v-model="form.deviceModel"
                        placeholder="请选择"
                        clearable
                        @change="setName"
                        :disabled="operationType !== 'add'"
                     >
                        <el-option
                           v-for="item in codeList"
                           :key="item.deviceModel"
                           :label="item.deviceName"
                           :value="item.deviceModel"
                        >
                           {{item.deviceName + '--' + item.deviceModel}}
                        </el-option>
                     </el-select>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="每日限制水量：" prop="waterDayLimit">
                     <el-input
                        v-model="form.waterDayLimit"
                        placeholder="请输入"
                        clearable
                     />
                  </el-form-item>
               </el-col>
            </el-row>
            <el-row :gutter="30">
               <el-col :span="12">
                  <el-form-item label="额定流量：" prop="ratedRate">
                     <el-input
                        v-model="form.ratedRate"
                        placeholder="请输入"
                        clearable
                     />
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="实际流量：" prop="actualTraffic">
                     <el-input
                        v-model="form.actualTraffic"
                        placeholder="请输入"
                        clearable
                     />
                  </el-form-item>
               </el-col>
            </el-row>
            <el-row :gutter="30">
               <el-col :span="12">
                  <el-form-item label="运行时间：" prop="runTime">
                     <el-date-picker
                        style="width: 100%"
                        v-model="form.runTime"
                        value-format="YYYY-MM-DD"
                        format="YYYY-MM-DD"
                        type="date"
                        placeholder="请选择"
                        clearable
                     />
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="当日用水量：" prop="waterDay">
                     <el-input
                        v-model="form.waterDay"
                        placeholder="请输入"
                        clearable
                     />
                  </el-form-item>
               </el-col>
            </el-row>
            <el-row :gutter="30">
               <el-col :span="12">
                  <el-form-item label="水费单价：" prop="waterPrice">
                     <el-input
                        v-model="form.waterPrice"
                        placeholder="请输入"
                        clearable
                     />
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="用水类型：" prop="type">
                     <el-select
                        v-model="form.type"
                        placeholder="请选择"
                        clearable
                     >
                        <el-option label="工业用水" value="industrial" />
                        <el-option label="生活用水" value="domestic" />
                        <el-option label="消防用水" value="fire" />
                        <el-option label="绿化用水" value="greening" />
                     </el-select>
                  </el-form-item>
               </el-col>
            </el-row>
         </el-form>
         <template #footer>
            <div class="dialog-footer">
               <el-button type="primary" @click="submitForm">确认</el-button>
               <el-button @click="closeDia">取消</el-button>
            </div>
         </template>
    </el-dialog>
  </div>
</template>

<script setup>
import {ref, reactive, nextTick} from "vue";
import useUserStore from "@/store/modules/user.js";
import {waterDeviceList, waterEquipmentAdd, waterEquipmentUpdate} from "@/api/energyManagement/waterManagement.js";
const { proxy } = getCurrentInstance()
const emit = defineEmits(['close'])
const dialogFormVisible = ref(false);
const operationType = ref('')
const userStore = useUserStore();

const data = reactive({
   form: {
    deviceName: "",
    deviceModel: "",
    waterDayLimit: "",
    ratedRate: "",
    actualTraffic: "",
    runTime: "",
    waterDay: "",
      waterPrice: "",
    type: "",
   },
   rules: {
    deviceModel: [{ required: true, message: "请选择", trigger: "change" }],
      runTime: [{ required: true, message: "请选择", trigger: "change" }],
    waterDayLimit: [{ required: true, message: "请输入", trigger: "blur" }],
    ratedRate: [{ required: true, message: "请输入", trigger: "blur" }],
    actualTraffic: [{ required: true, message: "请输入", trigger: "blur" }],
    waterDay: [{ required: true, message: "请输入", trigger: "blur" }],
      waterPrice: [{ required: true, message: "请输入", trigger: "blur" }],
    type: [{ required: true, message: "请选择", trigger: "change" }],
   },
})
const { form, rules } = toRefs(data);
const codeList = ref([])

// æ‰“开弹框
const openDialog = (type, row) => {
  operationType.value = type;
  dialogFormVisible.value = true;
   form.value = {}
   proxy.resetForm("formRef");
   waterDeviceList({size: -1}).then((res) => {
      codeList.value = res.data.records;
   });
   if (type === "edit") {
      form.value = {...row}
   }
}
const setName = (code) => {
   const index = codeList.value.findIndex(item => item.deviceModel === code);
   if (index > -1) {
      console.log(codeList)
      form.value.name = codeList.value[index].deviceName;
   }
}
const submitForm = () => {
   proxy.$refs["formRef"].validate(valid => {
      if (valid) {
         if (operationType.value === "add") {
            waterEquipmentAdd(form.value).then(response => {
               proxy.$modal.msgSuccess("新增成功")
               closeDia()
            })
         } else {
            waterEquipmentUpdate(form.value).then(response => {
               proxy.$modal.msgSuccess("修改成功")
               closeDia()
            })
         }
      }
   })
}
// å…³é—­å¼¹æ¡†
const closeDia = () => {
   proxy.resetForm("formRef");
  dialogFormVisible.value = false;
  emit('close')
};
// èŽ·å–当前日期并格式化为 YYYY-MM-DD
function getCurrentDate() {
   const today = new Date();
   const year = today.getFullYear();
   const month = String(today.getMonth() + 1).padStart(2, "0"); // æœˆä»½ä»Ž0开始
   const day = String(today.getDate()).padStart(2, "0");
   return `${year}-${month}-${day}`;
}
defineExpose({
  openDialog,
});
</script>

<style scoped>

</style>