smartpark_durable_front/src/views/secondOrder/components/inDialog.vue

<template>
  <div>
    <el-dialog
      :close-on-click-modal="false"
      :title="inDialogTiltle"
      :visible.sync="inDialogVisible"
      :append-to-body="true"
      width="70%"
      @close="handleCloseDetail"
      fullscreen
    >
      <!-- 基本信息 -->
      <el-form
        :model="sizeForm"
        ref="dynamicValidateForm"
        label-width="100px"
        class="demo-dynamic"
      >
        <div class="form-title">基本信息</div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="仓库名称">
              <el-input
                v-model="sizeForm.ldTwoPutStorage.warehouseName"
                :disabled="true"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="入库单号">
              <el-input
                v-model="sizeForm.ldTwoPutStorage.orderNo"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="入库时间">
              <el-date-picker
                v-model="sizeForm.ldTwoPutStorage.inDate"
                type="date"
                placeholder="选择日期"
                style="width: 100%"
                disabled
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="事由">
              <el-input
                v-model="sizeForm.ldTwoPutStorage.reason"
                :disabled="inDialogType != 'add'"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <div class="form-title">{{ inDate }}入库信息：</div>
        <el-table
          :data="sizeForm.ldTwoPutStorageDetails"
          border
          style="width: 100%"
        >
          <el-table-column prop="twoPutStorageNo" label="编码">
          </el-table-column>
          <el-table-column prop="materialName" label="名称"> </el-table-column>
          <el-table-column prop="model" label="规格/型号"> </el-table-column>
          <el-table-column prop="type" label="类别"> </el-table-column>
          <el-table-column prop="unit" label="单位"> </el-table-column>
          <el-table-column prop="demandQuantity" label="需求数量">
          </el-table-column>
          <el-table-column prop="inboundQuantity" label="入库数量">
          </el-table-column>

          <el-table-column prop="unitPrice" label="单价"> </el-table-column>
          <el-table-column prop="demandDepartment" label="需求部门">
          </el-table-column>
        </el-table>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="handleCloseDetail()">取 消</el-button>
          <el-button type="primary" @click="sumbit()">确 定</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script>
import { getDetails, submit } from "@/api/secondOrder/inbound";
export default {
  props: {
    repairVisible: {
      type: Boolean,
      default: false,
    },
    inDialogTiltle: {
      type: String,
      default: "",
    },
    inDialogType: {
      type: String,
      default: "",
    },
    type: {
      type: String,
      default: "",
    },
    inDialogData: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      inDialogVisible: false,
      sizeForm: {
        code: "", //入库单号
        applyNmae: "", //审批人
        submitName: "", //填报人
        waNmae: "", //仓库名称
        argument: "", //事由
        inTableData: [],
      },
    };
  },
  computed: {
    inDate() {
      const now = new Date();
      const year = now.getFullYear();
      const month = String(now.getMonth() + 1).padStart(2, "0");
      const day = String(now.getDate()).padStart(2, "0");
      return `${year}年${month}月${day}日`;
    },
  },
  mounted() {
    this.inDialogVisible = this.repairVisible;
    if (this.inDialogType == "add") {
      this.addInit();
    } else {
      this.inInit();
    }
  },
  methods: {
    inInit() {
      getDetails({ twoPutStorageId: this.inDialogData.id }).then((res) => {
        this.sizeForm = res.data.result;
      });
    },
    addInit() {
      // 生成入库单号
      const randomNum = Math.floor(Math.random() * 100000000) + 1;
      this.sizeForm.code = String(randomNum).padStart(8, "0"); //入库单号
      this.sizeForm.inDate = new Date(); //入库时间
      if (this.type == "一级库") {
        this.sizeForm.waNmae = "仓库一";
      }
    },
    handleCloseDetail() {
      this.inDialogVisible = false;
      this.$emit("handleCloseDetail");
    },

    // 采购单选择弹框关闭
    handleBatchClose() {
      this.inBatchDialogVisible = false;
    },
    // 提交
    sumbit() {
      let query = {
        ...this.sizeForm,
        userInfoVO: {
          userId: "87",
          name: "张迪",
          department:'部门一',
        },
      };
      submit(query).then((res) => {
        this.$message({
          type: "success",
          message: "提交成功",
        });
        this.handleCloseDetail(this.sizeForm.inTableData);
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.form-title {
  font-size: 16px;
  font-weight: 600;
  padding: 18px 0;
}
::v-deep.el-table th.el-table__cell {
    background: #F5F7FA;
    font-weight: 500;
}
</style>