123 lines
2.9 KiB
Vue
123 lines
2.9 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.supName }}</span>
|
||
</div>
|
||
<div style="margin-bottom: 6px">{{ item.content }}</div>
|
||
<div>备注:{{ item.remark }}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 空状态 -->
|
||
<u-empty v-if="tableList.length == 0" mode="data"></u-empty>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { getAuditDetails } from '@/api/carManage'
|
||
|
||
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: '机具公司'
|
||
// },
|
||
]
|
||
}
|
||
},
|
||
mounted() {
|
||
console.log('🚀 ~ 详情 ~ this.opt', this.opt)
|
||
this.getAuditDetails()
|
||
},
|
||
methods: {
|
||
// 获取审核记录
|
||
async getAuditDetails() {
|
||
try {
|
||
const params = {
|
||
encryptedData: JSON.stringify({ id: this.opt.planId })
|
||
}
|
||
const res = await getAuditDetails(params)
|
||
console.log('🚀 ~ 审核记录 ~ res', res)
|
||
this.tableList = res.data
|
||
} catch (error) {
|
||
console.log('🚀 ~ 审核记录 ~ error', error)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</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>
|