lims_college/frontend_web/src/views/managingrooms/_opera/add.vue

<template>
  <el-dialog title="添加实验室信息"
             :visible.sync="dialogvisible"
             width="65%"
             :before-close="handleCloseAdd"
             @close="resetData">
    <el-form size="mini"
             :model="testlistform"
             :rules="rulestestlistform"
             label-width="100px"
             height="600px"
             ref="testlistform">
      <el-row :gutter="20"
              class="donorsaddformcss">
        <el-col :span="8">
          <el-form-item label="实验室号"
                        prop="RoomNum"
                        label-width="100px">
            <el-input v-model="testlistform.RoomNum"
                      placeholder="请输入实验室号"
                      style="width:100%"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="实验室名称"
                        prop="RoomName"
                        label-width="100px">
            <el-input v-model="testlistform.RoomName"
                      placeholder="请输入实验室名称"
                      style="width:100%"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="实验室类型"
                        prop="RoomType"
                        label-width="100px">
            <el-select v-model="testlistform.RoomType"
                       placeholder="请选择实验室类型"
                       style="width:100%">
              <el-option v-for="item in typeList"
                         :key="item.ItemValue"
                         :label="item.ItemName"
                         :value="item.ItemValue"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="楼宇"
                        prop="building"
                        label-width="100px">
            <el-select v-model="testlistform.Building"
                       placeholder="请选择楼宇"
                       style="width:100%">
              <el-option v-for="item in buildingList"
                         :key="item.ItemValue"
                         :label="item.ItemName"
                         :value="parseInt(item.ItemValue)"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="位置信息"
                        required
                        prop="PositionInformation"
                        label-width="100px">
            <el-input v-model="testlistform.PositionInformation"
                      placeholder="请输入实验室位置"
                      style="width:100%"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="实验室描述"
                        label-width="100px"
                        prop="RoomDescribe">
            <el-input v-model="testlistform.RoomDescribe"
                      type="textarea"
                      :rows=3
                      placeholder="请输入实验室描述"
                      style="width:100%"></el-input>
          </el-form-item>
        </el-col>

      </el-row>
    </el-form>
    <span slot="footer">
      <el-button size="mini"
                 type="primary"
                 @click="savedata('testlistform')">保存</el-button>
      <el-button size="mini"
                 @click="handleCloseAdd">关闭</el-button>
    </span>
  </el-dialog>

</template>

<script>
import {
  saveroomdata
} from '@/api/instrumentroom'

export default {
  name: 'instrumentadd',
  props: {
    typeList: Array,
    buildingList: Array
  },
  data () {
    return {
      dialogvisible: false,
      formtype: '1',
      disabledbarcode: false,
      testlistform: {
        RoomNum: '',
        RoomName: '',
        RoomType: '',
        RoomDescribe: '',
        PositionInformation: '',
        building: ''
      },
      classificationlist: [],

      rulestestlistform: {

        RoomName: [{
          required: true,
          message: '请输入实验室名称',
          trigger: 'blur'
        }],
        RoomNum: [{
          required: true,
          message: '请输入实验室号',
          trigger: 'blur'
        }],
        RoomType: [{
          required: true,
          message: '请选择实验室类型',
          trigger: 'blur'
        }],
        PositionInformation: [{
          required: true,
          message: '请填写位置信息',
          trigger: 'blur'
        }],
        building: [{
          required: true,
          message: '请选择楼宇',
          trigger: 'blur'
        }]

      }
    }
  },
  mounted () {
  },
  methods: {
    // 保存实验室信息
    savedata () {
      let _this = this
      saveroomdata(_this.testlistform)
        .then(res => {
          this.dialogvisible = false
          // 刷新
          this.$emit('initdata')
        })
        .catch(err => {
          // handle error
          console.error(err)
        })
    },
    deletedata (index) {
      let _this = this
      _this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '关闭',
        type: 'warning'
      })
        .then(() => {
          this.maintainlogattrlist.splice(index, 1)
        })
        .catch(() => { })
    },
    resetData () {
      this.$refs['testlistform'].resetFields()
    },
    handleCloseAdd () {
      this.$emit('closeAddDialog')
      this.testlistform.RoomNum = ''
      this.testlistform.RoomName = ''
      this.testlistform.RoomType = ''
      this.testlistform.PositionInformation = ''
      this.testlistform.RoomDescribe = ''
    }
  }
}

</script>

<style lang="scss">
.button {
  padding: 0;
  float: right;
}

.donorsaddformcss .el-col-8 {
  height: 58px;
}
</style>