uniapp使用elementui表格
安装element-ui
npm i element-ui -S
引入Element
直接使用组件
<el-table :data="list" style="width: 100%" size="small" border >
<el-table-column prop="status" label="签约日期" width="90">
<template slot-scope="scope">
<text>{{scope.row.sign_year}}-{{scope.row.sign_month}}-{{scope.row.sign_date}}</text>
</template>
</el-table-column>
<el-table-column prop="type_name" label="合同类型" width="90"> </el-table-column>
<el-table-column prop="contranct_title" label="合同名称" width="100"> </el-table-column>
<el-table-column prop="purchaser" label="乙方" width="130"> </el-table-column>
<el-table-column prop="real_name" label="经办人" width="100"> </el-table-column>
<el-table-column prop="status" label="状态" width="60">
<template slot-scope="scope">
<!-- 0=待确认;1=待签署;2=已完成 -->
<text v-if="scope.row.status==0" class="st" style="">待确认</text>
<text v-if="scope.row.status==1" class="st" style="">待签署</text>
<text v-if="scope.row.status==2" class="st" style="">已完成</text>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="160">
<template slot-scope="scope">
<el-button @click="down(scope.row.id)" type="text" size="small"
style="color: #A8810B;" v-if="scope.row.status==2">
下载
</el-button>
<el-button @click="look(scope.row)" type="text" size="small" style="color: #A8810B;" >
查看
</el-button>
<el-button @click="add(scope.row.id)" type="text" size="small" style="color: #A8810B;" v-if="user_role==1">
编辑
</el-button>
<el-button @click="del(scope.row.id)" type="text" size="small" style="color: #A8810B;" v-if="user_role==1">
删除
</el-button>
</template>
</el-table-column>
</el-table>