12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- <template>
- <div class="application-history">
- <div style="height:50px;line-height:50px">
- <span :class="informationsClass==1?'information2':'information1'" @click="getInformation(1)" class="cursor">{{$i18n.locale=='en'? 'My Project': '我的项目'}}</span>
- <span :class="informationsClass==2?'information2':'information1'" @click="getInformation(2)" class="cursor">{{$i18n.locale=='en'? 'My Project Intention': '项目意向'}}</span>
- <span :class="informationsClass==3?'information2':'information1'" @click="getInformation(3)" class="cursor">{{$i18n.locale=='en'? 'My Project Recommendation': '项目推荐'}}</span>
- </div>
- <userCenterMyProject v-if="informationsClass==1"></userCenterMyProject>
- <userCenterMyProjectIntention v-if="informationsClass==2"></userCenterMyProjectIntention>
- <userCenterMyProjectRecommendation v-if="informationsClass==3"></userCenterMyProjectRecommendation>
- </div>
- </template>
- <script>
- import Base from "@/views/base/Base";
- import userCenterMyProject from "./userCenterMyProject";
- import userCenterMyProjectIntention from "./userCenterMyProjectIntention";
- import userCenterMyProjectRecommendation from "./userCenterMyProjectRecommendation";
- export default {
- name: "userCenterProject",
- extends: Base,
- components:{ userCenterMyProject, userCenterMyProjectIntention,userCenterMyProjectRecommendation },
- data() {
- return {
- informationsClass:'1',
- lang: localStorage.getItem('local')
- }
- },
- created() {
- this.$bus.on('setLang', lang=>{
- this.lang = lang;
- })
- },
- methods: {
- getInformation(num){
- this.informationsClass=num
- },
- }
- }
- </script>
- <style scoped>
- .application-history{
- background: #fff;
- min-height: 700px;
- }
- .information1 {
- display: inline-block;
- min-width: 123px;
- padding: 0 20px;
- height: 100%;
- border:1px solid rgba(228, 228, 228, 1);
- text-align: center;
- background: #f9f9f9;
- color: #999;
- }
- .information2 {
- display: inline-block;
- min-width: 123px;
- padding: 0 20px;
- height: 100%;
- border-top:3px solid #2c5589;
- text-align: center;
- color: #2c5589;
- }
- .information1:hover {
- color: #FF0036;
- }
- </style>
|