<template>
  <div id="manageMoneyIndex">
    <el-col :span="24" class="debt">
      <el-col :span="24" class="top">
        <topInfo :topTitle="topTitle" :display="display" @addfinclaim="addManagMoney"></topInfo>
      </el-col>
      <el-col :span="24" class="search">
        <manageMoneyIndexInfo @clickBtn="clickBtn"></manageMoneyIndexInfo>
      </el-col>
      <el-col :span="24" class="main">
        <manageMoneyList :debtTable="debtTable" :total="total" @pagechange="pagechange" @ljdelete="ljdelete"></manageMoneyList>
      </el-col>
    </el-col>
  </div>
</template>

<script>
import topInfo from '@/layout/common/topInfo.vue';
import manageMoneyIndexInfo from '@/layout/financeclaims/financeClaimInfo.vue';
import manageMoneyList from '@/layout/financeclaims/manageMoneyList.vue';
import { createNamespacedHelpers, mapGetters, mapState } from 'vuex';
const { mapActions: managemoney } = createNamespacedHelpers('managemoney');
export default {
  name: 'manageMoneyIndex',
  props: {},
  components: {
    topInfo, //头部导航
    manageMoneyIndexInfo, //搜素
    manageMoneyList, //理财列表
  },
  data: () => ({
    topTitle: '理财产品列表',
    display: 'block',
    debtTable: [],
    total: '',
    cpname: '',
    jgname: '',
  }),
  created() {
    this.managmoneyList();
  },
  computed: {
    ...mapState(['user']),
  },
  methods: {
    ...managemoney(['update', 'fetch', 'mmoneyList', 'orUpdate']),
    async managmoneyList({ skip = 1, limit = 10, uid = this.user.userid, type = 1 } = {}) {
      const res = await this.mmoneyList({ skip, limit, uid, type });
      this.$set(this, `debtTable`, res.res);
      this.$set(this, `total`, res.total);
    },
    //添加
    addManagMoney() {
      this.$router.push({ path: '/financeclaims/manageMoneyDetail' });
    },
    async pagechange(data) {
      var skip = data.skip;
      var limit = 10;
      var innewname = this.jgname;
      var title = this.cpname;
      var uid = this.user.userid;
      var type = 1;
      const res = await this.mmoneyList({ skip, limit, uid, type, innewname, title });
      this.$set(this, `debtTable`, res.res);
      this.$set(this, `total`, res.total);
    },
    //查询
    async clickBtn(data) {
      var innewname = data.innewname; //机构名称
      var title = data.name; //产品名称
      this.cpname = data.name;
      this.jgname = data.innewname;
      var skip = 0;
      var limit = 10;
      var uid = this.user.userid;
      var type = 1;
      const res = await this.mmoneyList({ skip, limit, uid, type, innewname, title });
      this.$set(this, `debtTable`, res.res);
      this.$set(this, `total`, res.total);
    },

    async ljdelete(data) {
      var finid = data.delid;
      let finalres;
      let res = await this.fetch(finid);
      finalres = res.data;
      finalres.status = '2';
      var delres = await this.update(finalres);
      if (delres.errcode === 0) {
        this.$message({
          message: '删除信息成功',
          type: 'success',
        });
      } else {
        this.$message({
          message: '删除信息失败',
          type: 'error',
        });
      }
      this.managmoneyList();
    },
  },
};
</script>

<style lang="less" scoped>
.debt {
  padding: 20px;
}
.top {
  border-bottom: 1px solid #ccc;
}
.search {
  width: 97%;
  height: 35px;
  margin: 20px;
}
</style>
