<template>
<ifbp-page>
  <ifbp-breadcrumb name="小贷客户管理"></ifbp-breadcrumb>
  <ifbp-button-area>
      <el-button class="fl" type="primary" @click="addEnterprise(0)">添加客户</el-button>
      <ifbp-search
       class="fr"
       :template-code="tplCode"
       @search="handleSearch">
      </ifbp-search>
  </ifbp-button-area>

  <ifbp-main-area>
    <el-template
        :sortable="true"
        :pkTemp="pkTemp"
        :template-value="currentValue"
        :showButton="showButton"
        :show-border="false"
        :hideTitle="true"
        :table-style="tableStyle"
        @edit-table-row="editTableRow"
        @delete-table-row="deleteTableRow"
        >
    </el-template>
    <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="page.index"
        :page-sizes="[5, 10, 20, 50]"
        :page-size="page.size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="page.total"
        v-if="page.total>0">
    </el-pagination>
  </ifbp-main-area>
  <el-dialog title="请选择客户类型" size="tiny" v-model="addEnterpriseVisible" style="text-align:center;">
    <el-button type="success" size="large" @click="addEnterprise(1)">个人客户</el-button>
    <el-button type="info" size="large" @click="addEnterprise(2)">企业客户</el-button>
  </el-dialog>
</ifbp-page>
</template>
<script>
export default {
  data() {
    return {
      filter: {
        keywords: '',
      },
      tplCode: 'XDKHCX',
      searchTemplate: '',
      addEnterpriseVisible: false,
      pkTemp: '12f3c031-4a21-4f50-8797-de42d5b251d2', // 客户列表_小贷
      currentValue: '',
      isHide: true,
      searchStr: {
        name: ''
      },
      page: {
        total: 0,
        index: 1,
        size: 10,
      },
      showButton: {
        width: 100,
        group: true,
        buttons: [
          {
            name: 'edit',
            text: '',
            icon: 'search',
            content: '查看',
          },
          {
            name: 'delete',
            text: '',
            icon: 'delete',
            content: '删除',
          }
        ]
      },
      tableStyle: {
        'max-height': '800px',
      }
    };
  },
  methods: {
    handleSearch(searchTemplate){
      this.searchTemplate = JSON.stringify(searchTemplate);
      this.getData();
    },
    getData() {
      const vm = this;
      const submitData = {
        pageSize: this.page.size,
        pageIndex: this.page.index-1,
      };
      submitData.qtAggVO=this.searchTemplate;
      $.ajax({
        url: '/ifbp-app-bd/ac/list',
        type: 'GET',
        dataType: "json",
        data: submitData,
        success: function(res) {
          if(res.success === true) {
            vm.currentValue = res.data.content;
            vm.setPage.call(vm, res.data);
            if (window.env === 'dev') {
              vm.$message('获取数据成功！');
            }
          } else {
            vm.$message('获取数据失败！');
          }
        },
        error: function() {
          vm.$message('请求出错！');
        }
      });
    },
    addEnterprise(type) {
      if(!type) {
        this.addEnterpriseVisible = true;
      } else {
        this.addEnterpriseVisible = false;
        this.$nextTick(() => {
          if(type === 1) {
          this.$router.push('/pettyloanCrm/personalInfo/add');
        } else if(type === 2) {
          this.$router.push('/pettyloanCrm/enterpriseInfo/add');
        }
        });
      }
    },
    //点击查询按钮触发
    search() {
      this.getData();
    },
    showSearch() {
      this.isHide = !this.isHide;
    },
    inputChange(keywords) {
      console.log('inputChange',keywords);
    },
    // 点击编辑
    editTableRow(row) {
      if(row.type === 1 || row.type === "1") { // 企业客户
        this.$router.push('/pettyloanCrm/enterpriseInfo/' + row.id);
      } else if(row.type === 2 || row.type === "2") { // 个人客户
        this.$router.push('/pettyloanCrm/personalInfo/' + row.id);
      } else {
        this.$message({type: 'info',message: '未找到ID！'});
      }
    },
    // 点击删除
    deleteTableRow(row, index) {
      const self = this;
      this.$confirm('是否删除当前记录?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var url = '';
        if(row.type === 1 || row.type === "1") {
          url = '/ifbp-app-bd/bd/customer/enterprise/'+row.id;
        } else if(row.type === 2 || row.type === "2") {
          url = '/ifbp-app-bd/bd/customer/personal/'+row.id;
        } else {
          self.$message({type: 'info',message: '未找到ID！'});
          return;
        }
        self.$http({
          url: url,
          method: 'DELETE',
        }).then((res) => {
          if(res.data.success === true){
            self.currentValue.splice(index, 1);
            self.$set(self.page, 'total', (self.page.total-1));
            if (window.env === 'dev') {
              self.$message({type: 'success',message: '删除成功!'});
            }
          } else {
            self.$message({type: 'error',message: '删除失败!'});
          }
        }).catch(() => {
          self.$message({type: 'error',message: '请求出错!'});
        });
      }).catch(() => {
        self.$message({type: 'info',message: '已取消删除'});
      });
    },
    // 分页
    handleSizeChange(val) {
      this.page.size = val;
      this.getData();
    },
    handleCurrentChange(val) {
      this.page.index = val;
      this.getData();
    },
    setPage(data) {
      this.page.total = data.totalElements;
      this.page.size = data.size;
    },
    backInfo() {
      this.$router.push('/appArea');
    },
  },
  created() {
    this.getData();
  },
  mounted() {

  },
};
</script>