yudao-dev/src/views/energy/monitoring/energyLimit/components/energyLimitAdd.vue

<template>
  <el-form ref="form" :rules="rules" label-width="100px" :model="form">
    <el-form-item label="监控对象" prop="objectId">
      <el-input v-model="form.objectId"></el-input>
    </el-form-item>
    <el-form-item label="能源类型" prop="energyTypeId">
      <el-select v-model="form.energyTypeId" placeholder="请选择" style="width: 100%;">
        <el-option
          v-for="item in this.energyTypeList"
          :key="item.id"
          :label="item.name"
          :value="item.id">
        </el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="监控模式" prop="type">
      <el-select v-model="form.type" placeholder="请选择" style="width: 100%;" @change="typeChange">
        <el-option label="合并" value= "1" ></el-option>
        <el-option label="详细" value= "2" ></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="监控详细参数" prop="plcParamId" v-if="form.type === '2'">
      <el-select v-model="form.plcParamId" placeholder="请选择" style="width: 100%;">
        <el-option
          v-for="item in getDictDatas(DICT_TYPE.ENERGY_UNIT)"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="消耗量阈值" prop="code">
      <el-input v-model="form.code"></el-input>
    </el-form-item>
  </el-form>
</template>
<script>
import { getEnergyParamList, getEnergyType, updateEnergyType, createEnergyType } from '@/api/monitoring/energyLimit'
export default {
  name: 'energyLimitAdd',
  props: {
    energyTypeList: {
      type: Array,
      required: true,
      default: () => {
        return []
      }
    }
  },
  data() {
    return {
      form: {
        id: '',
        name: '',
        code: '',
        nuit: '',
        pricingMethod: 1,
        leaderName: ''
      },
      isEdit: false, //是否是编辑
      rules: {
        name: [{ required: true, message: '能源类型不能为空', trigger: 'blur' }]
      }
    }
  },
  methods: {
    init(id) {
      // getEnergyParamList().then((res) => {
      //   console.log(res)
      // })
      if (id) {
        this.isEdit = true
        this.form.id = id
        getEnergyType( id ).then((res) => {
          if (res.code === 0) {
            this.form = res.data
          }
        })
      } else {
        this.isEdit = false
        this.form.id = ''
      }
    },
    typeChange() {
      // if (this.form.type === '2') {

      // } else  {

      // }
    },
    submitForm() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          switch(this.form.pricingMethod) {
            case 0:// 时间段
              if (this.tableData1.length === 0) {
                this.$modal.msgError('时间段表格数据不能为空')
                return false
              } else {
                this.tableData1.map(item => {
                  if (item.price <= 0) {
                    this.$modal.msgError('单价有误请检查，请检查')
                    return false
                  }
                })
              }
              break;
            case 1:// 使用量
              if (this.tableData2.length === 0) {
                this.$modal.msgError('使用量表格数据不能为空')
                return false
              } else {
                this.tableData1.map(item => {
                  if (item.price <= 0) {
                    this.$modal.msgError('单价有误请检查，请检查')
                    return false
                  }
                })
              }
              break;
            default:// 固定单价
              if (!this.form.singlePrice) {
                this.$modal.msgError('单价有误请检查1，请检查')
                  return false
              }
          }
          if (this.isEdit) {
            // 编辑
            updateEnergyType({
              id: this.form.id,
              code: this.form.code,
              name: this.form.name,
              unit: this.form.unit,
              pricingMethod: this.form.pricingMethod,
              description: this.form.description,
              singlePrice: this.form.pricingMethod === 2 ? this.form.singlePrice : '',
              segPriceList: this.form.pricingMethod === 0 ? this.tableData1: [],
              usedPriceList: this.form.pricingMethod === 1 ? this.tableData2: []
            }).then((res) => {
              if (res.code === 0) {
                this.$modal.msgSuccess("操作成功");
                this.$emit('successSubmit')
              }
            })
          } else {
            createEnergyType({
              code: this.form.code,
              name: this.form.name,
              unit: this.form.unit,
              pricingMethod: this.form.pricingMethod,
              description: this.form.description,
              singlePrice: this.form.pricingMethod === 2 ? this.form.singlePrice : '',
              segPriceList: this.form.pricingMethod === 0 ? this.tableData1: [],
              usedPriceList: this.form.pricingMethod === 1 ? this.tableData2: []
            }).then((res) => {
              if (res.code === 0) {
                this.$modal.msgSuccess("操作成功");
                this.$emit('successSubmit')
              }
            })
          }
        } else {
          return false
        }
      })
    },
    formClear() {
      this.$refs.form.resetFields()
      this.isEdit = false
    }
  }
}
</script>