index.vue 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <template>
  2. <div class='flex flex-center full-width'>
  3. <div class='ml-10 mr-10 mt-10 flex flex-align-start full-width'>
  4. <basic-container style='flex: 1;padding: 0'>
  5. <left/>
  6. </basic-container>
  7. <div class='full-width ml-5' style='flex:4;'>
  8. <basic-container class='full-width'>
  9. <div>
  10. <years @change='change'/>
  11. </div>
  12. </basic-container>
  13. <basic-container>
  14. <div class='flex'>
  15. <div class='flex-child-average'>
  16. chart
  17. </div>
  18. <div class='flex-child-average'>
  19. <amount :type='yearType'/>
  20. </div>
  21. </div>
  22. </basic-container>
  23. </div>
  24. </div>
  25. </div>
  26. </template>
  27. <script>
  28. import BasicContainer from '@/components/basic-container/main.vue'
  29. import left from './components/left.vue'
  30. import years from '@/views/invest/components/years.vue'
  31. import amount from '@/views/invest/components/amount.vue'
  32. export default {
  33. name: 'index',
  34. components: { BasicContainer, left, years, amount },
  35. data () {
  36. return {
  37. yearType: 0
  38. }
  39. },
  40. methods: {
  41. change (index) {
  42. console.log(index)
  43. this.yearType = index
  44. }
  45. }
  46. }
  47. </script>
  48. <style scoped>
  49. </style>