<template>
  <div class="mine">
    <h5 class="my-5 text-lg text-center text-white font-medium">我的提案</h5>
    <div class="tab flex justify-center items-center">
      <div class="px-3 text-sm" :class="{ 'active': tab === 1 }" @click="tab = 1">我发起的</div>
      <div class="px-3 text-sm" :class="{ 'active': tab === 2 }" @click="tab = 2">我参与的</div>
    </div>
    <attend />
  </div>
</template>

<script lang="ts">
import Attend from '@/components/mine/Attend.vue'
import Vue from 'vue'
export default Vue.extend({
  components: {
    Attend
  },
  data() {
    return {
      tab: 1
    }
  }
})
</script>

<style scoped>
  .mine {
    background-image: url(../../assets/home/banner.png);
    background-size: 100%;
    background-position-x: 50%;
    background-position-y: top;
    background-repeat: no-repeat;
  }
  .active {
    color: #FFBB00
  }


</style>