addHeaderDialog.vue 5.01 KB
<template>
  <el-dialog
    title="添加盘点单主"
    :visible.sync="visible"
    :show="show"
    width="500px"
    append-to-body
    @close="$emit('update:show', false)"
    @open="diaOpen"
  >
    <el-form
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="130px"
    >
      <el-form-item label="盘点类型" prop="countType">
        <el-select
          v-model="ruleForm.countType"
          placeholder="请选择"
          style="width: 100%"
        >
          <el-option
                  v-for="dict in typeOptions"
                 :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"
                ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="盘点方式" prop="preferenceCode">
        <el-select
          v-model="ruleForm.preferenceCode"
          placeholder="请选择"
          style="width: 100%"
        >
          <el-option
                  v-for="item in preferOptions"
                 :key="item.id"
                :label="item.name"
                :value="item.code"
                ></el-option>
        </el-select>
      </el-form-item>
     <el-form-item label="货主" prop="companyCode">
            <el-select
              v-model="ruleForm.companyCode"
              placeholder="请选择"
              style="width: 100%"
            >
              <el-option
                v-for="item in companyOptions"
                :key="item.id"
                :label="item.name"
                :value="item.code"
              />
            </el-select>
          </el-form-item>
      <el-form-item label="原始盘点内部号" prop="countOrderId">
        <el-input
          v-model="ruleForm.countOrderId"
          placeholder="请输入原始盘点内部号"
        ></el-input>
      </el-form-item>
      <el-form-item label="源盘点单号" prop="sourceCode">
        <el-input
          v-model="ruleForm.sourceCode"
          placeholder="请输入源盘点单号"
        ></el-input>
      </el-form-item>
      <el-form-item label="备注" prop="remark">
        <el-input v-model="ruleForm.remark" placeholder="请输入备注"></el-input>
      </el-form-item>
      <el-form-item label="抽盘范围(单位 %)" prop="range">
        <el-input
          v-model="ruleForm.range"
          placeholder="请输入抽盘范围"
        ></el-input>
      </el-form-item>
    </el-form>
     <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm">确 定</el-button>
      <el-button @click="cancel">取 消</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { addCycleCountHeader } from "@/api/cycle/cycleCountHeader/header";
import { getCompaniesByToken } from "@/api/system/company";
export default {
  props: {
    show: {
      type: Boolean,
      default: false,
    },
    countTypeOptions: {
      type: Array,
      default: () => []
    },
    preferenceOptions : {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      visible: this.show,
      typeOptions: this.countTypeOptions,
      preferOptions: this.preferenceOptions,
      companyOptions: [],
      ruleForm: {
        countType: "",
        preferenceCode: "",
        countOrderId: "",
        sourceCode: "",
        remark: "",
        range: "",
        companyCode:""
      },
      rules: {
         countType:[{ required: true, message: '盘点类型不能为空', trigger: ['blur','change'] }],
         preferenceCode:[{ required: true, message: '盘点方式不能为空', trigger: ['blur','change'] }],
         companyCode:[{ required: true, message: '货主不能为空', trigger: ['blur','change'] }],
         range:[{ pattern: /^([1-9]?\d|100)$/, message: '抽取范围格式不对', trigger: ['blur','change'] }]
      },
    };
  },
  watch: {
    show() {
      this.visible = this.show;
      this.ruleForm = {
        countType: "",
        preferenceCode: "",
        countOrderId: "",
        sourceCode: "",
        remark: "",
        range: "",
        companyCode:""
      };
    },
    countTypeOptions(newVlaue) {
     this.typeOptions = newVlaue
    },
     preferenceOptions(newVlaue) {
     this.preferOptions = newVlaue
    }
  },
  created() {
    getCompaniesByToken().then((response) => {
      this.companyOptions = response;
    });
  },
  methods: {
     diaOpen() {
      this.resetForm("ruleForm");
    },
    submitForm() {
      this.$refs["ruleForm"].validate((valid) => {
        if (valid) {
          addCycleCountHeader(this.ruleForm).then((response) => {
            if (response.code == 200) {
              this.msgSuccess(response.msg);
              this.$parent.getHeaderList();
              this.visible = false;
              
            } else {
              this.msgError(response.msg);
            }
          });
        } else {
          return false;
        }
      });
    },
  cancel() {
      this.resetForm("ruleForm");
      this.visible = false;
    },
  },
};
</script>

<style lang="scss" scoped>
</style>