129 lines
3.0 KiB
Vue
129 lines
3.0 KiB
Vue
<template>
|
||
<div>
|
||
<uni-section title="审核记录" type="line"></uni-section>
|
||
<div class="cont">
|
||
<div class="list-cont" v-for="(item, index) in tableList" :key="index">
|
||
<div class="top-item">
|
||
<div class="left-item">
|
||
<div class="circle"></div>
|
||
<div class="date">{{ item.date }}</div>
|
||
</div>
|
||
|
||
<div class="time">
|
||
<u-icon name="clock" style="margin-right: 5px"></u-icon>
|
||
{{ item.time }}
|
||
</div>
|
||
</div>
|
||
<div class="item-cont">
|
||
<div><u-icon name="/static/images/user.png" size="36" style="margin-right: 5px"></u-icon></div>
|
||
<div>
|
||
<div style="margin-bottom: 15px;">
|
||
<span>{{ item.name }}</span>
|
||
<span style="margin-right: 10px">({{ item.phone }})</span>
|
||
<span style="color: #bbb;">{{ item.company }}</span>
|
||
</div>
|
||
<div style="margin-bottom: 6px;">{{ item.content }}</div>
|
||
<div>备注:{{ item.remark }}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
props: {
|
||
opt: {
|
||
type: Object,
|
||
default: () => {}
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
tableList: [
|
||
{
|
||
date: '08-01',
|
||
time: '2021-08-01 08:00',
|
||
content: '审核通过',
|
||
remark: '这是备注111',
|
||
name: '张三',
|
||
phone: '13888888888',
|
||
company: '机具公司'
|
||
},
|
||
{
|
||
date: '08-01',
|
||
time: '2021-08-01 08:00',
|
||
content: '审核通过',
|
||
remark: '这是备注222',
|
||
name: '李四',
|
||
phone: '13888888888',
|
||
company: '机具公司'
|
||
},
|
||
{
|
||
date: '08-01',
|
||
time: '2021-08-01 08:00',
|
||
content: '审核通过',
|
||
remark: '这是备注333',
|
||
name: '王五',
|
||
phone: '13888888888',
|
||
company: '机具公司'
|
||
},
|
||
{
|
||
date: '08-01',
|
||
time: '2021-08-01 08:00',
|
||
content: '审核通过',
|
||
remark: '这是备注444',
|
||
name: '赵六',
|
||
phone: '13888888888',
|
||
company: '机具公司'
|
||
}
|
||
]
|
||
}
|
||
},
|
||
mounted() {
|
||
console.log('🚀 ~ 详情 ~ this.opt', this.opt)
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.cont {
|
||
padding: 15px;
|
||
.top-item {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
color: #666;
|
||
|
||
.left-item {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.circle {
|
||
width: 8px;
|
||
height: 8px;
|
||
border: 3px solid #409eff;
|
||
border-radius: 50%;
|
||
margin-right: 15px;
|
||
}
|
||
|
||
.time {
|
||
margin-right: 15px;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
}
|
||
.item-cont {
|
||
margin: 20px 0 20px 50px;
|
||
padding: 10px;
|
||
background-color: #fff;
|
||
color: #666;
|
||
border-radius: 8px;
|
||
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
|
||
display: flex;
|
||
align-items: flex-start;
|
||
}
|
||
}
|
||
</style>
|