<template>
  <div class="body d-page" style="background-color: #f5f2f0">
    <div class="rarle">
      <tatle-bar :tatle="tatleName"></tatle-bar>
    </div>
    <scroller-view>
        <div v-for="count in 3" :key="count" class="imag-card" @click="pushProduct">
          <img :src="require('@/assets/svg/licai.svg')" style="width: 100%;"/>
          <div>
            <div style="margin-top: 10px;margin-left: 10px;font-size: smaller"><span>黑龙江农信理财-月月增利1号</span><br/></div>
            <div style="margin-top: 6px;margin-left: 10px"><span style="font-size: larger;color: #e85014">4.46%</span><span style="font-size: small;color: black;position: absolute;margin-left: 90px;margin-top: 6px">最短持有180天</span><br/></div>
            <div style="margin-top: 6px;margin-left: 10px;font-size: smaller"><span>近三个月年化</span><span style="position: absolute;margin-left: 68px">一万起购较低风险<span style="color: #e85014;">当日开发</span></span><br/></div>
          </div>
        </div>
    </scroller-view>
  </div>
</template>

<script lang="ts">
import {Component, Vue} from "vue-property-decorator";
@Component({
  name:"ManageMoneyProduct",
})
export default class ManageMoneyProduct extends Vue {
  tatleName="理财产品";
  pushProduct() {
    this.$router.push({
      name: "ManageProductDetail",
    })
  }
}
</script>

<style scoped lang="scss">
.imag-card{
  width: 96%;
  margin: 4% auto;
  background-color: #FFFFFF;
}
</style>