<template>
|
<div class="my-main content-main">
|
<div class="my-info">
|
<div class="tips">
|
<span />
|
<div>基本信息</div>
|
</div>
|
<el-table
|
ref="infoTable"
|
:header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5'}"
|
:data="infoTable"
|
style="width: 100%"
|
>
|
<el-table-column
|
prop="username"
|
label="用户名"
|
width="200"
|
/>
|
<el-table-column
|
prop="name"
|
label="姓名"
|
width="460"
|
>
|
<template slot-scope="scope">
|
<el-tag type="info"><i class="el-icon-info" :style="{marginRight:'4px'}" />{{ scope.row.name }}</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="cellPhone"
|
label="电话号码"
|
width="400"
|
/>
|
<el-table-column
|
prop="email"
|
label="邮箱"
|
width="300"
|
/>
|
<el-table-column
|
prop="signature"
|
label="签名"
|
width="120"
|
:filters="[{ text: 0, value: 0 }, { text: 1, value: 1 }]"
|
:filter-method="filterTag"
|
filter-placement="bottom-end"
|
/>
|
<el-table-column
|
label="操作"
|
width="120"
|
>
|
<template slot-scope="scope">
|
<el-button @click="handleClick(scope.row)" type="text" size="small">编辑</el-button>
|
<!-- <el-button type="text" size="small">编辑</el-button> -->
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="my-business">
|
<div class="tips">
|
<span />
|
<div>企业信息</div>
|
</div>
|
<el-table
|
ref="businessTable"
|
:header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5'}"
|
:data="businessTable"
|
style="width: 100%"
|
>
|
<el-table-column
|
prop="businessSmallName"
|
label="企业简称"
|
width="200"
|
/>
|
<el-table-column
|
prop="businessBigName"
|
label="企业名称"
|
width="460"
|
/>
|
<el-table-column
|
label="企业联系人"
|
width="400"
|
>
|
<template slot-scope="scope">
|
<el-tag type="info"><i class="el-icon-info" :style="{marginRight:'4px'}"/>{{ scope.row.businessContact }}</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="businessPhone"
|
label="企业联系号码"
|
width="300"
|
/>
|
<el-table-column
|
prop="businessStatus"
|
label="加入状态"
|
width="120"
|
:filters="[{ text: 0, value: 0 }, { text: 1, value: 1 }]"
|
:filter-method="filterTag"
|
filter-placement="bottom-end"
|
>
|
<template slot-scope="scope">
|
<el-tag
|
:type="scope.row.businessStatus === 0 ? 'primary' : 'success'"
|
disable-transitions
|
>{{ scope.row.businessStatus === 0 ? '未同意' : '已同意' }}</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column
|
label="操作"
|
width="120"
|
>
|
<template slot-scope="scope">
|
<el-button @click="handleClick(scope.row)" type="text" size="small">退出</el-button>
|
<!-- <el-button type="text" size="small">编辑</el-button> -->
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
infoTable: [
|
{
|
username: 'jack',
|
name: '张三',
|
cellPhone: '138888888',
|
email: '138888888@qq.com',
|
signature: '我是法外狂徒'
|
}
|
|
],
|
businessTable: [
|
{
|
businessSmallName: '中天',
|
businessBigName: '中天科技',
|
businessContact: 'jack',
|
businessPhone: '1388888888',
|
businessStatus: 1
|
}
|
]
|
}
|
},
|
created() {
|
},
|
methods: {
|
clearFilter() {
|
// 清除所有过滤器
|
this.$refs.businessTable.clearFilter()
|
},
|
filterTag(value, row) {
|
console.log(value, row)
|
return row.businessStatus === value
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.my-main{
|
.my-info,.my-business{
|
background: #fff;
|
padding: 20px 20px 10px 20px;
|
margin: 0;
|
margin-bottom: 12px;
|
.tips{
|
display: flex;
|
height: 24px;
|
align-items: center;
|
font-size: 16px;
|
margin-bottom: 12px;
|
span{
|
display: inline-block;
|
margin-right: 10px;
|
width: 4px;
|
height: 16px;
|
background: #0077DB;
|
}
|
div{
|
height: 100%;
|
line-height: 26px;
|
}
|
|
}
|
}
|
.my-info{
|
|
}
|
.my-business{
|
|
}
|
}
|
</style>
|
