<!--退保证金委托函列表-->
<template>
  <div class="content-main">
    <div class="search-bm-boder">
      <el-row>
        <el-col :span="14">
          <el-form :inline="true" :model="searchForm" ref="searchForm" class="demo-form-inline">
            <el-form-item label="合同号:" prop="htbh">
              <el-input
                v-model="searchForm.htbh"
                clearable
                class="input-w-220"
                placeholder="请输入合同号"
              ></el-input>
            </el-form-item>
            <el-form-item label="状 态:" prop="zt">
              <el-select v-model="searchForm.zt" placeholder="请选择状态" clearable class="input-w-220">
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :span="10">
          <div class="search-button">
            <span class="search-line"></span>
            <!--          <div class="search-select" @click="searchShowMore">更多条件 <i class="el-icon-arrow-up" v-show="searchShowMoreBool"></i><i class="el-icon-arrow-down" v-show="!searchShowMoreBool"></i></div>-->
            <el-button type="primary" @click="btnSearch" size="small" class="iconfont iconchaxun">查询</el-button>
            <el-button
              type="primary"
              @click="btnReset('searchForm')"
              size="small"
              class="iconfont iconzhongzhi"
            >重置</el-button>
          </div>
        </el-col>
      </el-row>
    </div>
    <el-row
      style="background: rgb(237, 245, 253); line-height: 50px;margin-bottom: 10px;padding-left: 10px;"
    >
      <el-button type="primary" @click="jumpPage()" size="small" class="iconfont iconxinzeng">委托函编制</el-button>
    </el-row>
    <el-row>
      <el-table
        :data="tableData"
        border
        stripe
        v-loading="pageInfo.loading"
        tooltip-effect="dark"
        style="width: 100%"
      >
        <!--<el-table-column type="selection" label="全选" width="55" align="center"></el-table-column>-->
        <el-table-column type="index" label="序号" align="center" width="60"></el-table-column>
        <el-table-column prop="apcc" label="场次" align="center" show-overflow-tooltip></el-table-column>
        <el-table-column prop="htbh" label="合同号" align="center" show-overflow-tooltip></el-table-column>
        <el-table-column prop="jylx" label="交易性质" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ scope.row.jylx ? '采购' : '销售' }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="wtlx" label="退款类型" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{['退还','抵扣粮款','部分扣除','全部扣除'][scope.row.wtlx]}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="lspz" label="粮食品种" align="center" show-overflow-tooltip></el-table-column>
        <el-table-column prop="ztmc" label="状态" align="center" show-overflow-tooltip>
          <template
            slot-scope="scope"
          >{{scope.row.zt == '91000050' ? '待委托' : scope.row.zt == '91000051'?'已委托':scope.row.zt == '91000056'?'待退款':'成交退款'}}</template>
        </el-table-column>
        <el-table-column fixed="right" align="center" label="操作">
          <template slot-scope="scope">
            <el-tooltip class="item" effect="light" content="查看" placement="top">
              <el-button
                type="primary"
                size="small"
                class="iconfont iconchakan2 operate_show_btn"
                @click="jumpPage(scope.row.wthbm, 1)"
              ></el-button>
            </el-tooltip>
            <el-tooltip
              class="item"
              effect="light"
              content="编辑"
              placement="top"
              v-if="buttonNameList.indexOf('编辑') > -1"
            >
              <el-button
                v-if="getStatus(scope.row.zt)"
                type="primary"
                @click="jumpPage(scope.row.wthbm, 2)"
                class="iconfont iconxiugai1 operate_edit_btn"
                size="small"
              ></el-button>
            </el-tooltip>
            <!-- <el-tooltip
              class="item"
              effect="light"
              content="发送"
              placement="top"
              v-if="buttonNameList.indexOf('发送') > -1"
            >
              <el-button
                v-if="getStatus(scope.row.zt)"
                type="primary"
                @click="updateStatus(scope.row.wthbm, scope.row.apcc)"
                class="iconfont operate_edit_btn icontijiao"
                size="small"
              ></el-button>
            </el-tooltip>-->
          </template>
        </el-table-column>
      </el-table>
    </el-row>

    <el-row class="pagination-wrap">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageInfo.pageIndex"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="pageInfo.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="pageInfo.total"
      ></el-pagination>
    </el-row>
  </div>
</template>

<script>
import {
  getRefundDelegationList,
  updateRefundDelegationStatus,
  enumStatus
} from "@/api/transaction/ensureManage";
import { authorityControl } from "@/api/menuList";
export default {
  name: "refundDelegationList",
  data() {
    return {
      searchForm: {
        htbh: "",
        zt: ""
      },
      options: [
        {
          value: "91000050",
          label: "待委托"
        },
        {
          value: "91000051",
          label: "已委托"
        },
        {
          value: "91000056",
          label: "待退款"
        },
        {
          value: "91000055",
          label: "成交退款"
        }
      ],
      tableData: [],
      pageInfo: {
        loading: true,
        pageIndex: 1,
        pageSize: 10,
        total: 0
      },
      buttonNameList: []
    };
  },
  mounted() {
    this.getresourceCode();
  },
  methods: {
    getresourceCode() {
      let codeData = {
        resourceCode: sessionStorage.getItem("resourceCode"),
        userId: sessionStorage.getItem("userCode")
      };
      authorityControl(codeData).then(res => {
        this.buttonNameList = [];
        res.data.forEach(item => {
          this.buttonNameList.push(item.resourceName);
        });
        this.renderPage("start");
      });
    },
    btnSearch() {
      this.renderPage();
    },
    renderPage(type) {
      this.getList(type);
    },
    btnReset(formName) {
      this.$refs[formName].resetFields();
      this.renderPage();
    },
    jumpPage(code, type) {
      this.$router.push({
        name: "refundDelegationDetail",
        query: {
          wthbm: code,
          type: type
        }
      });
    },
    handleSizeChange(val) {
      this.pageInfo.pageIndex = 1;
      this.pageInfo.pageSize = val;
      this.renderPage();
    },
    handleCurrentChange(val) {
      this.pageInfo.pageIndex = val;
      this.renderPage();
    },
    getStatus(code) {
      return code == enumStatus[0].value;
    },
    getList(type) {
      if (type != "start") {
        //非初始化调用：查询、分页
        sessionStorage.setItem("searchData", JSON.stringify(this.searchForm));
        sessionStorage.setItem("pageData", JSON.stringify(this.pageInfo));
      } else {
        //初始化分两种情况，详情页等返回后的初始化，以及第一次进入此菜单的初始化
        if (JSON.parse(sessionStorage.getItem("searchData"))) {
          //详情页返回后，将对应查询条件和分页的字段赋值，页面回显参数
          this.searchForm = JSON.parse(sessionStorage.getItem("searchData"));
          this.pageInfo = JSON.parse(sessionStorage.getItem("pageData"));
        } else {
          //第一次进去此菜单时，保存上方默认的data
          sessionStorage.setItem("searchData", JSON.stringify(this.searchForm));
          sessionStorage.setItem("pageData", JSON.stringify(this.pageInfo));
        }
      }
      let params = {
        pageIndex: this.pageInfo.pageIndex,
        pageSize: this.pageInfo.pageSize,
        htbh: this.searchForm.htbh,
        zt: this.searchForm.zt
      };
      this.pageInfo.loading = true;
      getRefundDelegationList(params).then(response => {
        this.pageInfo.loading = false;
        if (response.infoCode == 200) {
          this.tableData = response.data.items;
          this.pageInfo.total = response.data.total;
        }
      });
    },
    updateStatus(code, apcc) {
      let self = this,
        params = {
          wthbm: code,
          zt: enumStatus[1].value,
          ztmc: enumStatus[1].label,
          apcc: apcc
        };
      updateRefundDelegationStatus(params)
        .then(actionMethod)
        .catch(actionMethod);
      function actionMethod(response) {
        if (response && response.infoCode === 200) {
          self.$message.success("发送成功");
          self.renderPage();
        } else {
          self.$message.success(response.msg);
        }
      }
    }
  }
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.input-w-220 {
  width: 100%;
}
</style>
