udiwms-vue-frame/src/views/drugInout/stat/DialogCreateCustom.vue

<template>
  <div>
    <el-card style="margin-top: -15px">
      <el-form :model="formData" :rules="formRules" ref="dataForm" label-width="100px">
        <el-row>
          <el-col :span="20">
            <el-form-item label="记录号:" prop="name">
              <el-input
                v-model="formData.name"
                auto-complete="off"
                :disabled="true"
                style="width: 90%"
              ></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="20">
            <el-form-item label="汇总仓库:" prop="invCode">
              <el-select v-model="formData.invCode" style="width: 90%" clearable
                         placeholder="请选择所属仓库">
                <el-option
                  v-for="item in invList"
                  :key="item.name"
                  :label="item.name"
                  :value="item.code">
                  <span style="float: left">{{ item.name }}</span>
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="20">
            <el-form-item label="汇总方式:" prop="statType">
              <el-select
                v-model="formData.statType"
                style="width: 90%"
              >
                <el-option label="按产品汇总" :value="1"></el-option>
                <el-option label="按批次号汇总" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>


          <el-col :span="20">
            <el-form-item label="汇总区间:" prop="actDateRange">
              <el-date-picker
                :picker-options="pickerOptions"
                v-model="formData.actDateRange"
                type="daterange"
                format="yyyy 年 MM 月 dd 日"
                style="width: 90%"
                value-format="yyyy-MM-dd"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>

          <el-col :span="20">
            <el-form-item label="备注:" prop="name">
              <el-input
                v-model="formData.remark"
                auto-complete="off"
                type="textarea"
                style="width: 90%"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <div style="display: flex;float: right;padding-bottom: 15px">
        <el-button type="primary" @click.native="formSubmit()" :loading="formLoading"
        >提交
        </el-button>
        <el-button @click.native="hideForm">取消</el-button>
      </div>
    </el-card>
  </div>
</template>

<script>
import {filterAll, getInvListByUser} from "@/api/system/invWarehouse";
import {systemParamConfigSave} from "@/api/system/param/systemParamConfig";
import {createCustom} from "@/api/inout/statData";

export default {
  name: "DialogCreateCustom",
  props: {
    closeDialog: {
      type: Function,
      required: true,
    },

  },
  data() {
    return {
      formData: {
        name: null,
        invCode: null,
        statType: null,
        actDateRange: [],
        startDate: null,
        endDate: null,
      },
      formRules: {
        invCode: [{required: true, message: "请选择仓库", trigger: "change"}]
        ,
        actDateRange: [
          {type: 'array', required: true, message: "请选择汇总区间", trigger: "change"}
        ],
        statType: [
          {required: true, message: "请选择汇总方式", trigger: "change"}
        ],

      },
      deptList: [],
      invList: [],
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },

      formLoading: false,
    }
  },
  methods: {
    getInvList() {
      getInvListByUser().then((res) => {
        this.invList = res.data || [];
      })
    },
    getDeptList() {
      filterAll().then((res) => {
        this.deptList = res.data || [];
        this.getInvList();
      });
    },
    hideForm() {
      this.closeDialog();
      return true;
    },
    formSubmit() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          this.formLoading = true;
          this.formData.startDate = this.formData.actDateRange[0];
          this.formData.endDate = this.formData.actDateRange[1];
          let data = Object.assign({}, this.formData);
          createCustom(data)
            .then((response) => {
              this.formLoading = false;
              if (response.code != 20000) {
                this.$message.error(response.message);
                return false;
              }
              this.$message.success("操作成功");
              this.closeDialog();
            })
            .catch(() => {
              this.formLoading = false;
            });
        }
      });
    },
  },

  created() {

    this.getInvList();
    this.getDeptList();
  },
}
</script>

<style scoped>

</style>