<template>
  <div>
    <el-card>
      <el-form :inline="true" :model="filterQuery" class="query-form" size="mini">
        <el-form-item class="query-form-item" label="单据类型:">
          <el-input
            v-model="filterQuery.name"
            placeholder="单据类型名称"
            clearable
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button-group style="margin-left: 10px;display:flex;">
            <el-button type="primary" icon="el-icon-refresh" @click="onReset">重置</el-button>
            <el-button type="primary" icon="el-icon-search" @click="getList">查询</el-button>
            <el-button type="primary" icon="el-icon-plus" @click="handleAddClick"
                       :disabled="!configParms.entrustAction"
            >新增
            </el-button
            >
          </el-button-group>

        </el-form-item>
      </el-form>

      <el-table v-loading="loading" :data="list" style="width: 100%" border>
        <el-table-column label="序号" type="index" width="60" ></el-table-column>
        <el-table-column label="扫码单据类型" prop="curName" ></el-table-column>
        <el-table-column label="当前仓库" prop="curInvName" ></el-table-column>
        <el-table-column label="委托验收仓库" prop="entrustInvName" ></el-table-column>
        <el-table-column label="委托验收人" prop="employeeName" >
        </el-table-column>
        <el-table-column label="操作" >
          <template slot-scope="scope">
            <el-button
              type="text"
              size="small"
              :disabled="!configParms.entrustAction"
              @click.native.stop="handleModifyClick(scope.row)"
            >编辑
            </el-button
            >
            <el-button
              type="text"
              size="small"
              :disabled="!configParms.entrustAction"
              @click.native.stop="deleteDialog(scope.row)"
            >删除
            </el-button
            >
          </template>

        </el-table-column>
      </el-table>

      <el-dialog
        title="新增委托验收"
        :visible.sync="addDialogVisible"
        width="60%"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        v-if="addDialogVisible"
      >
        <modifyDialog :inputQuery="inputQuery"></modifyDialog>
        <div style="text-align: center">
          <el-button type="primary" size="small" icon="search" @click="onAddSubmit"
          >提交
          </el-button
          >
          <el-button type="primary" size="small" icon="search" @click="cancelDialog"
          >取消
          </el-button
          >
        </div>
      </el-dialog>

      <el-dialog
        title="编辑委托验收"
        :visible.sync="modifyDialogVisible"
        width="70%"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        v-if="modifyDialogVisible"
      >
        <modifyDialog :inputQuery="inputQuery"></modifyDialog>
        <div style="text-align: center">
          <el-button type="primary" size="small" icon="search" @click="onModifySubmit" :loading="subLoading"
          >提交
          </el-button
          >
          <el-button type="primary" size="small" icon="search" @click="cancelDialog"
          >取消
          </el-button
          >
        </div>
      </el-dialog>
      <el-pagination
        :page-size="filterQuery.limit"
        @current-change="handleCurrentChange"
        layout="prev, pager, next"
        :total="total"
        :current-page="filterQuery.page"
      ></el-pagination>
    </el-card>
  </div>
</template>
<script>
import {
  getEntrustRece,
  deleteEntrustRece,
  updateEntrustRece,
  insertEntrustRece,
} from "@/api/system/param/EntrustRece";

import modifyDialog from "./BasicEntrutsReceModify";
import {findConfig} from "@/api/sync/spsSyncStatus";

export default {
  data() {
    return {
      filterQuery: {
        name: "",
        page: 1,
        limit: 20,
      },
      loading: false,
      addDialogVisible: false,
      modifyDialogVisible: false,
      list: [],
      inputQuery: {
        action: null,
        name: "",
        entrustInv: "",
        entrustUser: "",
        entrustAction: null,
        finishRece: false,
        curInv: "",
        userId: null,
      },
      enableMap: {
        true: "是",
        false: "否",
      },
      mainActionMap: {
        WareHouseIn: "入库",
        WareHouseOut: "出库"
      },
      fileList: [],
      total: 0,
      multipleSelection: [],
      uploadFileUrl: null,
      headers: {},
      configParms: {},
      subLoading: false,


    };
  },

  methods: {
    onReset() {
      this.$router.push({
        path: "",
      });
      this.filterQuery = {
        name: "",
        page: 1,
        limit: 20,
      };
      this.getList();
    },
    cancelDialog() {
      this.modifyDialogVisible = false;
      this.addDialogVisible = false;
    },
    handleCurrentChange(val) {
      this.filterQuery.page = val;
      this.getList();
    },
    getList() {
      this.loading = true;
      getEntrustRece(this.filterQuery)
        .then((response) => {
          this.loading = false;
          this.list = response.data.list || [];
          this.total = response.data.total || 0;
        })
        .catch(() => {
          this.loading = false;
          this.list = [];
          this.total = 0;
        });
    },


    onAddSubmit() {
      insertEntrustRece(this.inputQuery)
        .then((response) => {
          if (response.code == 20000) {
            this.loading = false;
            this.cancelDialog();
            this.getList();
          } else {
            this.$message.error(response.message);
          }
        })
        .catch(() => {
          this.loading = false;
          this.cancelDialog();
        });
    },

    onModifySubmit() {
      this.subLoading = true
      updateEntrustRece(this.inputQuery)
        .then((response) => {
          this.subLoading = false
          this.loading = false;
          this.cancelDialog();
          this.getList();
        })
        .catch(() => {
          this.subLoading = false
          this.loading = false;
          this.cancelDialog();
        });
    },

    handleAddClick() {
      this.inputQuery = {};
      this.addDialogVisible = true;
    },

    handleModifyClick(row) {
      this.inputQuery = row;
      this.modifyDialogVisible = true;
    },

    deleteDialog(rowId) {
      this.$confirm("此操作将永久删除该委托验收信息, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.deleteOrders(rowId);
        })
        .catch(() => {
        });
    },

    deleteOrders(data) {
      this.loading = true;
      let tquery = {
        id: data.id + "",
      };
      deleteEntrustRece(tquery)
        .then((response) => {
          this.getList();
          if (response.code == 20000) {
            this.$message({
              type: "success",
              message: "删除成功！",
            });
          } else {
            this.$message.error(response.message);
          }

        })
        .catch(() => {
        });
    },
    getSyncConfig() {
      findConfig()
        .then((response) => {
          if (response.code == 20000) {
            this.configParms = response.data;
          }
        })
        .catch(() => {
        });
    },
  },
  components: {
    modifyDialog,
  },
  mounted() {
  },
  created() {
    this.getSyncConfig();
    this.getList();
  },
};
</script>
