69 lines
2.6 KiB
Vue
69 lines
2.6 KiB
Vue
<template>
|
|
<el-card style="border-radius: 15px;margin-top: 10px">
|
|
<div style="cursor: pointer;display: flex;flex-direction: row;flex-wrap: nowrap">
|
|
<!-- <div style="display: flex;align-items: center">-->
|
|
<!-- <span style="font-size: 16px;font-weight: bold">●</span>-->
|
|
<!-- </div>-->
|
|
<div @click="toProjectDetail" class="userProjects" style=";margin-left:10px;display: flex;flex-direction: column;flex-wrap: nowrap">
|
|
<div style="margin-left: 10px;display: flex;flex-direction: row;justify-content: flex-start">
|
|
<span style="font-size: 16px;font-weight: bold">{{project.projectName}}</span>
|
|
</div>
|
|
<div style="margin-top: 10px;margin-left: 10px;">
|
|
<span style="display: flex;flex-direction: row;justify-content:flex-start;text-align: left;font-size: 16px;color: #9ca3af">{{brief}}</span>
|
|
</div>
|
|
<div style=" margin-left: 10px;;margin-top: 10px;display: flex;flex-direction: row;flex-wrap: nowrap;align-items: center">
|
|
<div style="width: 10px;height: 10px;background-color: #42b983;border-radius: 50px"></div>
|
|
<el-tag size="mini" style="margin-left: 5px;border-radius: 10px">
|
|
{{project.categoryName}}
|
|
</el-tag>
|
|
<span style="margin-left: 5px;font-size: 14px;color: #9ca3af">●</span>
|
|
<span style="margin-left: 5px;font-size: 14px;color: #9ca3af">{{ formatNumber(project.lookCount) }}</span>
|
|
<span style="margin-left: 5px;font-size: 14px;color: #9ca3af">●</span>
|
|
<span style="margin-left: 5px;font-size: 14px;color: #9ca3af">{{project.submitTime}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "UserProjects",
|
|
props:{
|
|
project:Object
|
|
},
|
|
|
|
|
|
data(){
|
|
return{
|
|
|
|
}
|
|
},
|
|
computed:{
|
|
brief:function(){
|
|
return this.project.projectDescription.substr(0, 43) + '...';
|
|
},
|
|
},
|
|
methods:{
|
|
formatNumber(num) {
|
|
return num >= 1e3 && num < 1e4 ? (num / 1e3).toFixed(1) + 'k' : num >= 1e4 ? (num / 1e4).toFixed(1) + 'w' : num
|
|
},
|
|
toProjectDetail(){
|
|
this.$router.push({
|
|
path:'/ProjectDetail',
|
|
query: {
|
|
id: this.project.projectId, refresh: true
|
|
}})
|
|
}
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.userProjects:hover{
|
|
background-color: #eeeeee;
|
|
border-radius: 10px;
|
|
border: #9ca3af;
|
|
}
|
|
</style> |