xt_vue/src/xt_pages/management/components/PlanForm.vue

<template>
  <div id="plan-form">
    <el-dialog
      title="新增计划"
      :visible.sync="dialogVisible"
      width="55%"
      center
    >
      <el-form ref="form" :model="form">
        <el-row>
          <el-col :span="10">
            <el-form-item label="设备型号:">
              <el-select style="width:135px" v-model="form.device_type">
                <el-option
                  v-for="item in this.DeviceType"
                  :key="item.id"
                  :label="item.equitment_name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="消毒时长:">
              <el-input
                style="width:135px"
                v-model="form.disinfec_time"
              ></el-input>
              <span>分钟</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10">
            <el-form-item label="时间:">
              <el-select
                v-model="form.time"
                multiple
                filterable
                allow-create
                default-first-option
                placeholder="请选择时间"
                style="width: 140px;"
              >
                <el-option
                  v-for="item in this.timeType"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="班次:">
              <el-select
                v-model="form.class_time"
                multiple
                filterable
                allow-create
                default-first-option
                placeholder="请选择时间"
                style="width: 140px;"
              >
                <el-option
                  v-for="item in this.classType"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10">
            <el-form-item label="机表消毒方式:">
              <el-select style="width:135px" v-model="form.way">
                <el-option
                  v-for="item in this.disinfectType"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="机表消毒液:">
              <el-select
                style="width:135px"
                v-model="form.machine_disinfectant"
              >
                <el-option
                  v-for="item in this.disinfectantType"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10">
            <el-form-item label="液路消毒方式:">
              <el-select style="width:135px" v-model="form.disinfectant_way">
                <el-option
                  v-for="item in this.sterilizeType"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="液路消毒液:">
              <el-select style="width:135px" v-model="form.disinfectant">
                <el-option
                  v-for="item in this.fluidPathType"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="savePlan('form')">保存</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { getAllEquimentName, savePlan, getAllEquitType } from '@/api/manage'
export default {
  name: 'PlanForm',
  props: {
    equimentid: Number
  },
  data() {
    return {
      dialogVisible: false,
      form: {
        device_type: '',
        disinfec_time: '',
        time: [],
        class_time: [],
        way: 0,
        machine_disinfectant: 0,
        disinfectant_way: 0,
        disinfectant: 0
      },
      value: [],
      timeType: [
        { id: 1, name: '周一' },
        { id: 2, name: '周二' },
        { id: 3, name: '周三' },
        { id: 4, name: '周四' },
        { id: 5, name: '周五' },
        { id: 6, name: '周六' },
        { id: 7, name: '周日' }
      ],
      classType: [
        { id: 1, name: '上午' },
        { id: 2, name: '下午' },
        { id: 3, name: '晚上' }
      ],
      // 机表消毒方式
      disinfectType: [
        { id: 0, name: '/' },
        { id: 1, name: '擦拭' },
        { id: 2, name: '化学消毒' }
      ],
      // 基表消毒液
      disinfectantType: [
        { id: 0, name: '/' },
        { id: 1, name: '0.22%季铵盐' },
        { id: 2, name: '500mg/l含氯消毒剂' },
        { id: 3, name: '1000mg/l含氯消毒剂' },
        { id: 4, name: '1500mg/l含氯消毒剂' }
      ],
      // 夜路消毒方式
      sterilizeType: [
        { id: 0, name: '/' },
        { id: 1, name: '热化学消毒' },
        { id: 2, name: '化学消毒 + 除钙' },
        { id: 3, name: '热化学消毒 + 除钙' },
        { id: 4, name: '热消毒' },
        { id: 5, name: '化学消毒' },
        { id: 6, name: '除钙' },
        { id: 7, name: '清洗' }
      ],
      // 夜路消毒液
      fluidPathType: [
        { id: 0, name: '/' },
        { id: 1, name: '20%柠檬酸' },
        { id: 2, name: '25%柠檬酸' },
        { id: 3, name: '50%柠檬酸' },
        { id: 4, name: '50%柠檬酸 + 5%次氯酸钠' },
        { id: 5, name: '20%柠檬酸 + 10%冰醋酸' },
        { id: 6, name: '0.2%过氧化乙酸' },
        { id: 7, name: '10%冰醋酸' },
        { id: 8, name: '50%冰醋酸' },
        { id: 9, name: '5%次氯酸钠' }
      ],
      DeviceType: [],
      planid: 0,
      plandata: 0
    }
  },
  methods: {
    open: function() {
      this.dialogVisible = true
    },
    getAllEquimentName() {
      getAllEquimentName().then(response => {
        if (response.data.state === 1) {
          var equit = response.data.data.equit
          // console.log('equit', equit);
          // this.DeviceType = equit;
        }
      })
    },
    savePlan(formName) {
      var equimentid = this.equimentid
      // console.log('equimentid', equimentid);
      var devicetype = this.form.device_type
      var devicetypes = parseInt(devicetype)
      this.form.device_type = devicetypes

      var ways = this.form.way
      var way = parseInt(ways)
      this.form.way = way

      var machinedisinfectant = this.form.machine_disinfectant
      var machinedisinfectants = parseInt(machinedisinfectant)
      this.form.machine_disinfectant = machinedisinfectants

      var disinfectantways = this.form.disinfectant_way
      var disinfectantway = parseInt(disinfectantways)
      this.form.disinfectant_way = disinfectantway

      var disinfectants = this.form.disinfectant
      var disinfectant = parseInt(disinfectants)
      this.form.disinfectant = disinfectant
      savePlan(this.form, this.equimentid).then(response => {
        if (response.data.state === 1) {
          var msg = response.data.data.msg
          // console.log('msg', msg);
          this.$message.success('保存成功')
          this.dialogVisible = false
          this.$emit('getAllPlan')
          this.$emit('getAllPlanDetail')
          // 如果保存成功通过状态值改变父组键表格的值
          this.plandata = 1
          this.$emit('func', this.plandata)
        } else {
          this.$message.error('该消毒计划已存在')
        }
      })
    },
    getAllEquitType() {
      getAllEquitType().then(response => {
        if (response.data.state === 1) {
          var equitname = response.data.data.equitname
          // console.log('equitname=============', equitname)
          this.DeviceType = equitname
        }
      })
    }
  },
  created() {
    this.getAllEquimentName()
    this.getAllEquitType()
  }
}
</script>

<style scoped></style>