<template>
    <div id="financeLookClaimDetail">
        <el-row>
            <el-col :span="24" class="debt">
                <el-col :span="24" class="top">
                    <topInfo :topTitle="topTitle" :display="display"></topInfo>
                </el-col>
                <el-col :span="24" class="main">
                    <el-col :span="24" class="back">
                        <detailTop @goBack="goBack"></detailTop>
                    </el-col>
                    <el-col :span="24" class="info">
                        <financeClaimsForm :ruleForm="ruleForm" :dbList="dbList" :hkList="hkList" @toTop="toTop" @changStatus="changStatus"></financeClaimsForm>
                    </el-col>
                </el-col>
            </el-col>
        </el-row>
    </div>
</template>

<script>
  import topInfo from '@/layout/common/detailTopInfo.vue';
  import detailTop from '@/layout/common/detailTop.vue';
  import financeClaimsForm from '@/layout/financeclaims/financeLookClaimsForm.vue';
  import { createNamespacedHelpers, mapGetters,mapState } from 'vuex';
  const { mapActions: financeclaims } = createNamespacedHelpers('financeclaim');
  export default {
    name: 'financeLookClaimDetail',
    props: {},
    components: {
      topInfo, //头部导航
      detailTop, //头部返回
      financeClaimsForm, //债权产品详情
    },
    data: () => ({
      display: 'none',
      topTitle: '债权产品信息',
      ruleForm: {
        news: [
          {
            news_name: '',
            news_info: '',
          },
        ],
      },
      dbList: [
        { name: '抵押', code: '2201' },
        { name: '质押', code: '2202' },
        { name: '信用', code: '2203' },
        { name: '保证', code: '2204'},
      ],
      hkList: [
        { name: '等额本息', code: '2301' },
        { name: '等额本金', code: '2302' },
        { name: '一次性利随本清', code: '2303' },
      ],
    }),
    created() {
      this.searchInfo();
    },
    computed: {
      id() {
        return this.$route.query.id;
      },
      ...mapState(['user']),
    },
    methods: {
      ...financeclaims(['fclaimsList', 'orUpdate', 'dupdate', 'create','fetch','update','publish']),
      async searchInfo() {
        if (this.id) {
          const res = await this.fetch(this.id);
          this.$set(this, `ruleForm`, res.data);
        }
      },
      async toTop({data}) {
        let res;
        let finaldata;
        if(data.top==0){
          finaldata=data;
          finaldata.top=1;
          res = await this.update(finaldata);
          if (res.errcode === 0) {
            this.$message({
              message: '信息推荐成功',
              type: 'success',
            });
          }else{
            this.$message({
              message: '信息推荐失败',
              type: 'error',
            });
          }
        }else{
          finaldata=data;
          finaldata.top=0;
          res = await this.update(finaldata);
          if (res.errcode === 0) {
            this.$message({
              message: '信息取消推荐成功',
              type: 'success',
            });
          }else{
            this.$message({
              message: '信息取消推荐失败',
              type: 'error',
            });
          }
        }
        this.searchInfo();
      },
      async changStatus({data}){
            let finaldata={};
            let res;
            finaldata.finid = data.id;
            finaldata.userid=this.user.userid;
            if(data.status=='0'){
              finaldata.publish='1';
            }else{
              finaldata.publish='0';
            }
            res = await this.publish(finaldata);
            if(res.data.status=='SUCCESS'){
              this.$message({
                message: '审核相关操作成功',
                type: 'success',
              });
            }else{
              this.$message({
                message: '审核相关操作失败',
                type: 'error',
              });
            }
        this.searchInfo();
      },
      // 返回
      goBack() {
        this.$router.go(-1);
      },
    },
  };
</script>

<style lang="less" scoped>
    .debt {
        padding: 20px;
    }
    .top {
        border-bottom: 1px solid #ccc;
    }
    .main {
        border-radius: 10px;
        margin: 20px 0 0 0;
        box-shadow: 0 0 3px #666;
    }
    .main .back {
        padding: 10px 0 10px 15px;
    }
</style>
