<template>
    <!--存款产品列表-->
  <div class="finical" v-if="save">
<!--  <div class="finical" v-if="save" @click="into(item)">-->
      <container>
        <sessionHeader :cls="cls" :title="item.title?item.title:'存款产品'">
        </sessionHeader>
      </container>
      <container>
        <ul class="product-list flex flex_ac">
          <li class="product-list-item flex_one">
            <dl class="product-list-item-dl1">
              <dt class="product-list-item-rate font18">{{item.rate}}</dt>
              <dd class="product-list-item-rate-info font12">存款利率</dd>
            </dl>
          </li>
          <li class="product-list-item flex_one">
            <dl>
              <dt class="product-list-item-deadline">起购金额 <i class="deadline">{{item.startBuy}}</i> 元</dt>
              <dd class="product-list-item-rate-info font12">{{item.info}}</dd>
            </dl>
          </li>
        </ul>
      </container>
    </div>
    <!--理财产品列表-->
    <div class="finical" v-else>
        <container>
          <sessionHeader :cls="cls" :title="item.prdName?item.prdName:''">
            <span slot="tip" class="badge" :class="{mu:item.statusName=='募集期'||item.statusName=='开放期'||item.statusName=='发行成功',gray:item.statusName=='停止交易'||item.statusName=='发行失败'||item.statusName=='停止申购'||item.statusName=='停止赎回'||item.statusName=='产品封闭期'||item.statusName=='产品终止',yu:item.statusName=='权益登记'||item.statusName=='红利发放'||item.statusName=='预约认购期'}">{{item.statusName}}</span>
          </sessionHeader>
        </container>
        <container>
          <router-link :to="url">
            <ul class="product-list flex flex_ac">
              <li class="product-list-item flex_one">
                <dl>
                  <dt class="product-list-item-rate font18">{{item.modelComment}}</dt>
                  <dd class="product-list-item-rate-info font12">预计年化收益率</dd>
                </dl>
              </li>
              <li class="product-list-item flex_one">
                <dl>
                  <dt class="product-list-item-deadline">产品期限 <i class="deadline">{{item.interestDays}}</i> 天</dt>
                  <dd class="product-list-item-startBuy tc font12">起购金额{{item.pfirstAmt}}元</dd>
                </dl>
              </li>
              <i class="iconfont arrow-right"></i>
            </ul>
          </router-link>
        </container>
      </div>
</template>
<script>
    import container from './container'
    import sessionHeader from './session-header'
    export default {
        name: "finical",
        components:{
          container,
          sessionHeader
        },
        props:['item','save','url'],
        data(){
            return{
              statsStyle:{},
              cls:{
                fontSize: '.28rem',
                fontWeight: 'normal'
              }
            }
        },
        filters:{
          transTxt:function (code) {
            console.log(code)
            var txt;
            switch (code){
              case 0:
                txt = '募集中'
                break;
              case 1:
                txt = '开放期'
                break;
              case 2:
                txt = '预期认购中'
            }
            return txt
          },
        },
        methods:{
          transCls(code){
            console.log(code)
            var cls;
            switch (code){
              case 0:
                cls = 'mu'
                break;
              case 1:
                cls = 'kai'
                break;
              case 2:
                cls = 'yu'
            }
            return cls
          },

          // into(item){
          //   if(this.url=='depositTakingByInt'){ this.$router.push({
          //     path:'/'+this.url,
          //     query:{
          //       // info:item.info,
          //       content:item.linkTo
          //     }
          //   })}
          // }
        }
    }
</script>
<style scoped>
  @import "../../css/style.css";
  .container{
    border-bottom: 1px solid #ededed;
  }
  .product-list{
    padding-top: .14rem;
  }
  .product-list-item-rate-info{
    color: #adadad;
  }
  .product-list-item-rate{
    color: #fd7301;
    padding-bottom: .1rem;
  }
  .product-list-item-deadline{
    color: #777;
    padding-bottom: .1rem;
  }
  .deadline{
    color: #fd7301;
  }
  .product-list-item-startBuy{
    padding: .06rem .2rem;
    border-radius: .3rem;
    display: inline-block;
    background: #97c9f2;
    color: white;
  }
  .product-list-item-dl1{
    width:4rem;
  }
</style>
