eln_web/src/views/business/storageLocation/comps/Xz.vue

<template>
  <div>
    <!-- 编辑弹窗 -->
    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body :close-on-click-modal="false">
      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('page.system.storageLocation.fzdd')" prop="location">
              <el-input v-model="form.location" :placeholder="$t('form.placeholderInput')" maxlength="50" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="$t('page.system.storageLocation.sbmc')" prop="name">
              <el-input v-model="form.name" :placeholder="$t('form.placeholderInput')" maxlength="50" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('page.system.storageLocation.fzhj')" prop="shelfPlacement">
              <el-input v-model="form.shelfPlacement" :placeholder="$t('form.placeholderInput')" maxlength="50" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="$t('page.system.storageLocation.wc')" prop="compartment">
              <BusinessSelect v-model="form.compartment" dictType="business_cctj" :multiple="true"></BusinessSelect>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('page.system.storageLocation.ssbm')" prop="deptId">
              <SelectDept v-model="form.deptId" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="$t('page.system.storageLocation.zt')" prop="status">
              <el-select v-model="form.status" :placeholder="$t('form.placeholderSelect')" style="width: 100%;">
                <el-option key="1" :label="$t('page.system.storageLocation.no')" :value="1" />
                <el-option key="10" :label="$t('page.system.storageLocation.yes')" :value="10" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('form.qmyy')" prop="qmyy">
              <el-input v-model="form.qmyy" disabled :placeholder="$t('form.placeholderInput')" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="$t('form.signer')" prop="qmrmc">
              <el-input v-model="nickName" disabled :placeholder="$t('form.placeholderInput')" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('form.signerPsw')" prop="qmrmm">
              <div class="sbzdtcma"> <input type="text"></div>
              <el-input v-model="form.qmrmm" show-password :placeholder="$t('form.placeholderInput')" type="password" @contextmenu.native.prevent @copy.native.prevent @cut.native.prevent
                maxlength="20" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">{{ $t('form.saveConfirm') }}</el-button>
        <el-button @click="cancel">{{ $t('form.cancel') }}</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>

import {  storageLocation_add, storageLocation_edit, storageLocation_info } from '@/api/business/storageLocation/storageLocation'

import { mapGetters } from 'vuex'
import BusinessSelect from '@/views/business/comps/select/BusinessSelect';
import SelectDept from '@/views/business/comps/select/SelectDept';
export default {
  name: "StorageLocationBj",
  components: { BusinessSelect, SelectDept },
  data() {
    return {
      ids: [],
      open: false,
      form: {},
      title: '',
      // 表单校验
      rules: {
        location: [
          { required: true, message: this.$t('form.notEmpty'), trigger: "change" },
          { min: 0, max: 50, message: this.$t('form.lengthLimit') + '50', trigger: 'blur' }
        ],
        name: [
          { required: true, message: this.$t('form.notEmpty'), trigger: "change" },
          { min: 0, max: 50, message: this.$t('form.lengthLimit') + '50', trigger: 'blur' }
        ],
        shelfPlacement: [
          { required: true, message: this.$t('form.notEmpty'), trigger: "change" },
          { min: 0, max: 50, message: this.$t('form.lengthLimit') + '50', trigger: 'blur' }
        ],
        compartment: [
          { required: true, message: this.$t('form.notEmpty'), trigger: "blur" }
        ],
        deptId: [
          { required: true, message: this.$t('form.notEmpty'), trigger: "change" },
        ],
        status: [
          { required: true, message: this.$t('form.notEmpty'), trigger: "change" },
        ],
        qmrmm: [
          { required: true, message: this.$t('form.signerPsw') + this.$t('form.notEmpty'), trigger: "change" },
          { min: 0, max: 20, message: this.$t('form.signerPsw') + this.$t('form.lengthLimit') + '20', trigger: 'blur' }
        ]
      }
    }
  },
  computed: {
    ...mapGetters([
      'nickName','name'
    ]),
  },
  created() {
  },
  methods: {
    cancel() {
      this.reset()
      this.open = false
    },
    reset() {
      this.form = {
        compartment: null,
        deptId: null,
        deptName: null,
        location: null,
        name: null,
        status: null,
        shelfPlacement: null,
        wc: null,
        qmrmm: null,
      }
      this.resetForm("form")
    },
    showEdit(row) {
      this.reset()
      storageLocation_info({id: row.id}).then(response => {
        this.form = response.data
        this.form.qmyy = this.$t('page.system.storageLocation.editStroageLocation'),
        this.title = this.$t('form.edit')
        this.open = true
      })
    },
    showAdd() {
      this.reset()
      this.title = this.$t('form.add')
      this.form.qmyy = this.$t('page.system.storageLocation.addStroageLocation'),
      this.open = true
    },
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id) {
            storageLocation_edit(this.form).then((response) => {
              this.$modal.msgSuccess(this.$t('form.operationSuccess'))
              this.open = false
              this.$emit('callback')
            })
          } else {
            storageLocation_add(this.form).then((response) => {
              this.$modal.msgSuccess(this.$t('form.operationSuccess'))
              this.open = false
              this.$emit('callback')
            })
          }
        }
      })
    },
    onChangeCcwz(val) {
      this.form.cctj = val.wc
    }
  }
}
</script>