<template>
    <div>
        <crumbs-u>
            <a>物资申请</a>
            <a>库存领用列表</a>
        </crumbs-u>
        <sa-panel>
            <form compact>
                <label>需求编号</label>
                <input type="text" v-model="searchObj.F_FormNo" placeholder="请输入OA表单号">
                <label>申请人</label>
                <sa-input searchable remote @search="keyword => getEmployeeFn(keyword,1)">
                    <sa-select v-model="searchObj.FApplyerId" :data="applyerList" value-key="id">
                        <template scope="item">
                            {{item.code}} {{item.text}}
                        </template>
                    </sa-select>
                </sa-input>
                <label>使用人</label>
                <sa-input searchable remote @search="keyword => getEmployeeFn(keyword,2)">
                    <sa-select v-model="searchObj.FUserId" :data="userList" value-key="id">
                        <template scope="item">
                            {{item.code}} {{item.text}}
                        </template>
                    </sa-select>
                </sa-input>
                <label>物料名称编码</label>
                <sa-input searchable remote @search="keyword => getMaterialFn(keyword)" @focus="keyword => getMaterialFn(keyword)">
                    <sa-select :data="materialList" v-model="searchObj.MATID" value-key="id"></sa-select>
                </sa-input>
                <label>需求时间</label>
                <sa-input range>
                    <sa-datepicker v-model="searchObj['FApplyTime>=']" slot="start" :end="searchObj['FApplyTime<=']"></sa-datepicker>
                    <sa-datepicker v-model="searchObj['FApplyTime<=']" slot="end" :start="searchObj['FApplyTime>=']"></sa-datepicker>
                </sa-input>
                <label>费用归属公司</label>
                <input type="text" v-model="searchObj['FUserCompanyName%']" placeholder="请输入费用归属公司">
                <label>公司体系</label>
                <sa-input>
                    <sa-select v-model="searchObj.CompanyType" :data="companyTypeList"></sa-select>
                </sa-input>
                <div class="grow tr">
                    <button type="button" secondary outline @click="resetFn">重置</button>
                    <button type="button" outline @click="searchFn(true)">查询</button>
                </div>
            </form>
        </sa-panel>
        <sa-panel class="pt-0">
            <div class="mv-10">
                <button @click="exportFn">导出表格</button>
                <button :disabled="!selectedList.length" @click="batchTake">批量库存领用</button>
            </div>
            <sf-table-shell :fix-right="1" :fix-left="1" class="mb-15">
                <template scope="props">
                    <table default class="nowrap">
                        <tr>
                            <th><sa-checkbox v-if="selectableList.length" :checked="selectableList.length && selectableList.length === selectedList.length" @change="selectAllFn"></sa-checkbox></th>
                            <th>领用结果</th>
                            <th>需求单号</th>
                            <th>EBS处理单号</th>
                            <th>需求类别</th>
                            <th>物料名称</th>
                            <th>物料编码</th>
                            <th>数量</th>
                            <th>承担部门</th>
                            <th>承担公司</th>
                            <th>申请时间</th>
                            <th>希望完成时间</th>
                            <th>申请人</th>
                            <th>使用人</th>
                            <th>操作</th>
                        </tr>
                        <template v-if="tableList.length">
                          <tr  v-for="(item, index) in tableList" :key="index">
                              <td>
                                <sa-checkbox v-if="item.FIsAllot !== 1" v-model="selectedList" :value="item"></sa-checkbox></td>
                              <td>
                                <span v-if="item.IsAllot !== '失败'" class="w-80 ellipsis inline-block" v-tooltip:right="item.FEBSMsg">{{item.IsAllot}}</span>
                                <span v-else class="w-80 ellipsis inline-block" v-tooltip:right="item.FEBSMsg" style="color:#ef6000">{{item.IsAllot}}</span>
                              </td>
                              <td>{{item.F_FormNo}}</td>
                              <td>{{item.DocIds}}</td>
                              <td>{{item.MATTypeName}}</td>
                              <td>{{item.FItemName}}</td>
                              <td>{{item.FItemCode}}</td>
                              <td>{{item.FQuantity}}</td>
                              <td>{{item.DepartmentName}}</td>
                              <td>{{item.FUserCompanyName}}</td>
                              <td>{{item.FApplyTime == "1900-01-01" ? "-" : item.FApplyTime}}</td>
                              <td>{{item.FExpectCompleteTime}}</td>
                              <td>{{item.FApplyerName}}</td>
                              <td>{{item.UserNameCode}}</td>
                              <td>
                                <button v-if="item.MATNeedFixCode==1" @click="showCode(item)">查看编码</button>
                                <button v-if="item.FIsAllot==2||item.FIsAllot==0" @click="take(item)">库存领用</button>
                                <button v-if="item.FIsAllot==0&&item.AllowReturn" @click="cancel(item)">撤销</button>
                              </td>
                          </tr>
                        </template>
                        <!-- <tr v-if="!tableList.length">
                            <td colspan="24">
                                <p class="no-result">未查询到相关数据，请尝试更换筛选条件后查询!</p>
                            </td>
                        </tr> -->
                    </table>
                </template>
            </sf-table-shell>
            <sa-pagination has-text :total="pageObj.pageTotal" :page="pageObj.page" @change="pageFn"></sa-pagination>
        </sa-panel>
         <sa-modal ref="codeModal" title="查看编码" :width="900">
            <table default="default" class="nowrap">
                <tr>
                    <th>固定编码</th>
                    <th>
                      <template v-if="materialObj.Status==2">
                        来源库存
                      </template>
                      <template v-else-if="materialObj.Status==1">
                        来源部门
                      </template>
                    </th>
                    <th>来源公司</th>
                </tr>
                <tr v-for="item in materialObj.dataList" >
                    <td>{{item.FFixCode}}</td>
                  <td>
                      <template v-if="materialObj.Status==2">
                       {{item.FSubStockName}}
                      </template>
                      <template v-else-if="materialObj.Status==1">
                         {{item.FDepartmentName }}
                      </template>
                  </td>
                <td>{{item.FCompanyName }}</td>
             </tr>
            </table>
        </sa-modal>
    </div>
</template>
<script>
import uniq from "lodash/uniq";
export default {
  name: "MaterialTakeList",
  data() {
    return {
      applyerList: [],
      userList: [],
      b_applyerList: [],
      b_userList: [],
      materialList: [],
      typeList: [
        {
          Value: "",
          text: "所有"
        },
        {
          Value: "0",
          text: "否"
        },
        {
          Value: "1",
          text: "是"
        }
      ],
      defaultSearchObj: {},
      searchObj: {
        F_FormNo: "",
        FApplyerId: "",
        FUserId: "",
        MATID: "",
        "FApplyTime>=": "",
        "FApplyTime<=": "",
        "FUserCompanyName%": "",
        CompanyType: "ALL"
      },
      tableList: [],
      pageObj: {
        pageSize: 10,
        pageTotal: 0,
        page: 1
      },
      selectedList: [],
      sortingSelectedList: [],
      batchEditObj: {},
      editObj: {},
      companyTypeList: [],
      materialObj: {}
    };
  },
  computed: {
    selectableList() {
      return this.tableList.filter(item => {
        return !(item.MMPIsTurn == 1 || item.MMPIsValid == 0);
      });
    }
  },
  methods: {
    async initList() {
      var res = await this.$axios.get(
        this.$rootUrl + "/MaterialConfig/GetCompanyTypeJson"
      );
      this.companyTypeList = res.data;
    },
    getMaterialFn(keyword) {
      this.$axios
        .get(this.$rootUrl + "/Form065/GetMaterialDataJson", {
          params: {
            keyword: keyword,
            type: 0
          }
        })
        .then(res => {
          if (res.data.Success && res.data.Success === false) {
            this.$alert(res.data.Message);
            return;
          }
          this.materialList = res.data;
        });
    },
    searchFn(init = false) {
      this.selectedList = [];
      if (init) this.pageObj.page = this.searchObj.pageIndex = 1;
      this.$startWaiting();
      this.$axios
        .get(this.$rootUrl + "/MaterialTake/GetForm065SubListJson", {
          params: this.searchObj
        })
        .then(res => {
          this.$stopWaiting();
          if (res.data.Success && res.data.Success === false) {
            this.$alert(res.data.Message);
            return;
          }
          this.tableList = res.data.ReturnList;
          this.pageObj.pageTotal = res.data.TotalCount;
        });
    },
    resetFn() {
      $.extend(this.searchObj, this.defaultSearchObj);
      this.searchFn(true);
    },
    pageFn(page) {
      this.pageObj.page = this.searchObj.pageIndex = page;
      this.searchFn();
    },
    exportFn() {
      let url = `${this
        .$rootUrl}/MaterialTake/SubListExport?${this.$Qs.stringify(
        this.searchObj
      )}`;
      window.open(url, "_self");
    },
    selectAllFn() {
      if (this.selectableList.length === this.selectedList.length) {
        this.selectedList = [];
      } else {
        this.selectedList = [...this.selectableList];
      }
    },
    async getEmployeeFn(keyword, flag) {
      //1-申请人 2-使用人 3-实际申请人 4-收货人 5-批量-实际申请人 6-批量收货人
      if (!keyword) return;
      let list = await this.$axios
        .get(`${this.$rootUrl}/Form058/QueryEmployee`, {
          params: {
            keyword
          }
        })
        .then(res => {
          if (res.data.Success && res.data.Success === false) {
            this.$alert(res.data.Message);
            return [];
          }
          return res.data.map(item => {
            item.id = parseInt(item.id);
            return item;
          });
        });
      switch (flag) {
        case 1:
          this.applyerList = list;
          break;
        case 2:
          this.userList = list;
          break;
        case 3:
          this.editObj.employeesList = list;
          break;
        case 4:
          this.editObj.recipientList = list;
          break;
        case 5:
          this.b_applyerList = list;
          break;
        case 6:
          this.b_userList = list;
          break;
      }
    },
    // 撤销
    cancel(item) {
      this.$confirm("确认要撤销吗？").then(r => {
        if (r) {
          this.$startWaiting();
          this.$axios
            .post(
              this.$rootUrl + "/MaterialTake/ReturnTake",
              this.$Qs.stringify({
                subId: item.FormSubID,
                lineNo: item.FLineNo
              })
            )
            .then(res => {
              this.$stopWaiting();
              if (res.data.Success) {
                this.$toast("撤销成功！");
                if (res.data.Source && res.data.Source.length > 0) {
                  let cacheKey = item.FormID + "-" + item.FItemCode;
                  let cacheString = window.localStorage.getItem(cacheKey);
                  if (cacheString && cacheString.length > 0) {
                    let array = JSON.parse(cacheString);
                    for (var i in res.data.Source) {
                      array.shift(res.data.Source[i]);
                    }
                    if (array.length == 0) {
                      window.localStorage.setItem(cacheKey, "[]"); //不清除，防止别处调用报错
                    } else {
                      window.localStorage.setItem(
                        cacheKey,
                        JSON.stringify(array)
                      );
                    }
                  }
                }
                this.searchFn();
              } else {
                this.$alert(res.data.Message);
              }
            })
            .catch(e => {
              this.$toast("操作失败，服务器错误");
            });
        }
      });
    },
    // 库存领用
    async take(item) {
      this.$startWaiting();
      try {
        var res = await this.$axios.post(
          this.$rootUrl + "/MaterialTake/TakeMaterial",
          this.$Qs.stringify({ subIds: item.FormSubID })
        );
        if (res.data.Success) {
          this.$alert("已提交EBS，请查看领用结果");
          this.searchFn();
        } else {
          this.$alert(res.data.Message);
        }
      } catch (e) {
        this.$stopWaiting();
      }
    },
    async batchTake() {
      this.$startWaiting();
      var subIds = this.selectedList.map(item => item.FormSubID).join(",");
      try {
        var res = await this.$axios.post(
          this.$rootUrl + "/MaterialTake/TakeMaterial",
          this.$Qs.stringify({ subIds: subIds })
        );
        if (res.data.Success) {
          this.$alert("已提交EBS，请查看领用结果");
          this.searchFn();
        } else {
          this.$alert(res.data.Message);
        }
      } catch (e) {
        this.$stopWaiting();
      }
    },
    showCode(item) {
      this.$startWaiting();
      this.$axios
        .post(this.$rootUrl + "/Form065/GetMaterialInfoList", {
          subid: item.FormSubID
        })
        .then(res => {
          this.$stopWaiting();
          let mobj = {};
          mobj.Status = 2;
          mobj.dataList = res.data;
          this.materialObj = mobj;
          console.log(this.materialObj);
          this.$refs.codeModal.open();
        });
    }
  },
  created() {
    this.searchFn();
    this.initList();
    $.extend(this.defaultSearchObj, this.searchObj);
  }
};
</script>