<el-card shadow="hover" style="height:calc(100vh - 360px);">
<div slot="header" style=" display: flex;justify-content: space-between;align-items: center;">
<span style=" font-weight: bold; color: #1e9fff; padding: 15px 0;">工作台</span>
<el-button style="float: right; padding: 3px 0; color: #cf9236;font-size: 20px" class="el-icon-s-platform"
type="text" @click="gotolink"></el-button>
</div>
<el-tabs v-model="activeName" @tab-click="handleClick " stretch>
<el-tab-pane name="tabs0"><span slot="label">待审核<el-badge :value="num.tab1"></el-badge></span>
<div v-for="(item,index) in showList.filter(m=>m.status==0)" style="width: 100%;clear: both;padding: 10px 0">
<el-tooltip effect="dark" :content="item.projectTitle" placement="top-start">
<el-tag class="tagClass" size="small" :key="item.projectTitle">{{item.projectTitle}}</el-tag>
</el-tooltip>
<div class="linkClass">
<el-tooltip effect="dark" :content="item.assignmentTitle" placement="top-start">
<el-link :underline="false" class="link" @click="showassignmentDetail(item)">
<div>{{ item.assignmentTitle}}</div>
</el-link>
</el-tooltip>
</div>
<el-button style="float: right;padding: 5px" type="text" @click="openEdit(item,index)">
审核
</el-button>
</div>
</el-tab-pane>
========================================================================================
<el-tab-pane name="tabs1"><span slot="label">已完成<el-badge :value="num.tab2"></el-badge></span>
<div v-for="(item,index) in showList.filter(m=>m.status==1)" style="width: 100%;clear: both;padding: 10px 0">
-----------------------------------------------------------------
<el-tooltip effect="dark" :content="item.projectTitle" placement="top-start">
<el-tag class="tagClass" size="small" :key="item.projectTitle">{{item.projectTitle}}</el-tag>
</el-tooltip>
---------------------------------------------------------------------
<div class="linkClass">
<el-tooltip effect="dark" :content="item.assignmentTitle" placement="top-start">
<el-link :underline="false" class="link" @click="showassignmentDetail(item)">
<div>{{ item.assignmentTitle}}</div>
</el-link>
</el-tooltip>
</div>
------------------------------------------------------------------------
<span :class="[item.approvalResult=='0'?'green':'red']" style="float: right;padding: 5px;font-size: 13px" >
{{ item.approvalResult==0?'同意':'拒绝'}}
</span>
</div>
</el-tab-pane>
</el-tabs>
<div>
</div>
.tagClass {
float: left;
margin:0 0 0 10px;
width: 80px;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
text-align: center;
}
.linkClass {
float: left;
margin:0 0 0 10px;
max-width: 320px;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
}
工作台卡片v-for列表
于 2022-08-18 17:42:56 首次发布
![](https://img-home.csdnimg.cn/images/20240711042549.png)