155 lines
3.5 KiB
Vue
155 lines
3.5 KiB
Vue
<template>
|
|
<section class="AiLog">
|
|
<el-table :data="logList" border header-cell-class-name="table-head-cell" cell-class-name="table-cell">
|
|
<el-table-column width="186px" align="center" label="修改时间" prop="createTime"/>
|
|
<el-table-column width="90px" align="center" label="变更人" prop="userName"/>
|
|
<el-table-column label="操作类型" header-align="center" width="132px">
|
|
<template slot-scope="{row}">{{ row.typeLabel + row.fieldName }}</template>
|
|
</el-table-column>
|
|
<el-table-column label="变更内容">
|
|
<div slot-scope="{row}">
|
|
<p v-if="row.type!=3">
|
|
{{ row.fieldName }}从
|
|
<span style='color: #26f'>{{ row.beforeChangeValue || "空" }}</span>
|
|
{{ row.typeLabel }}为
|
|
<span style='color: #26f'>{{ row.afterChangeValue || "空" }}</span>
|
|
</p>
|
|
<p v-else>
|
|
对
|
|
<span style='color: #26f'>{{ row.afterChangeValue || "空" }}</span>
|
|
进行了修改
|
|
</p>
|
|
</div>
|
|
</el-table-column>
|
|
<div slot="append" class="table-footer">
|
|
<el-pagination :current-page.sync="page.current" layout="total,prev,pager,next,sizes,jumper" :total="page.total"
|
|
background @size-change="v=>{page.size=v;getLogs()}" @current-change="getLogs"/>
|
|
</div>
|
|
</el-table>
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "AiLog",
|
|
props: {
|
|
bid: String,
|
|
instance: Function,
|
|
},
|
|
data() {
|
|
return {
|
|
logList: [],
|
|
logType: {
|
|
0: "更新",
|
|
1: "删除",
|
|
2: "新增",
|
|
3: "更新"
|
|
},
|
|
page: {
|
|
current: 1,
|
|
size: 10,
|
|
total: 0
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
getLogs() {
|
|
this.instance.post("/app/appchangelog/list", null, {
|
|
params: {...this.page, objectId: this.bid}
|
|
}).then(res => {
|
|
if (res && res.data) {
|
|
this.page.total = res.data.total
|
|
res.data.records = res.data.records.map(e => {
|
|
return {...e, typeLabel: this.logType[e.type]}
|
|
})
|
|
this.logList = res.data.records
|
|
}
|
|
})
|
|
}
|
|
},
|
|
mounted() {
|
|
this.getLogs()
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.AiLog {
|
|
:deep(.table-head-cell ){
|
|
background-color: rgba(243, 246, 249, 1);
|
|
color: #333;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.table-footer {
|
|
padding: 10px 0;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
:deep(.table-cell ){
|
|
.cell {
|
|
padding-top: 13px;
|
|
padding-bottom: 13px;
|
|
|
|
div {
|
|
white-space: normal;
|
|
}
|
|
}
|
|
}
|
|
|
|
:deep(.el-pagination ){
|
|
text-align: center;
|
|
|
|
.btn-prev {
|
|
background-color: #fff;
|
|
border: solid 1px #d0d4dc;
|
|
margin-left: 8px;
|
|
border-radius: 4px;
|
|
|
|
&:disabled {
|
|
background-color: #F5F5F5;
|
|
}
|
|
}
|
|
|
|
.btn-next {
|
|
background: #fff;
|
|
border: 1px solid #D0D4DC;
|
|
border-radius: 4px;
|
|
|
|
&:disabled {
|
|
background-color: #F5F5F5;
|
|
}
|
|
}
|
|
}
|
|
|
|
:deep(.el-pagination__jump ){
|
|
margin-left: 0;
|
|
}
|
|
|
|
:deep(.el-pager li ){
|
|
background-color: #fff;
|
|
border: solid 1px #d0d4dc;
|
|
margin-left: 8px;
|
|
border-radius: 4px !important;
|
|
line-height: 26px !important;
|
|
|
|
&.active {
|
|
background-color: #fff !important;
|
|
color: #5088FF !important;
|
|
border-color: #5088FF;
|
|
|
|
& + li {
|
|
border-left: solid 1px #d0d4dc
|
|
}
|
|
}
|
|
|
|
&:nth-last-of-type(1) {
|
|
margin-right: 8px;
|
|
}
|
|
}
|
|
}
|
|
|
|
</style>
|