对接媒体日志
This commit is contained in:
parent
20b69ec670
commit
32ec2167a0
|
@ -631,7 +631,7 @@ const handleCloseDetail = () => {
|
|||
const handleLogs = (row) => {
|
||||
showLogs.value = true
|
||||
nextTick(() => {
|
||||
// supplierLogsRef.value.initForm('编辑供应商', row)
|
||||
mediaLogsRef.value.initLog(row)
|
||||
})
|
||||
}
|
||||
// 关闭日志
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
<el-col :span="12" style="text-align: right;">
|
||||
<el-button-group>
|
||||
<el-button v-for="(item, index) in ToolOptions" :key="index"
|
||||
:type="activeIndex === index ? 'primary' : 'default'" @click="activeIndex = index">
|
||||
:type="activeIndex === index ? 'primary' : 'default'" @click="handleChoseType(index)">
|
||||
<img v-if="index == 0" :src="activeIndex === index ? item.activeIcon : item.defaultIcon" />
|
||||
<img v-if="index == 1" :src="activeIndex === index ? item.activeIcon : item.defaultIcon" />
|
||||
</el-button>
|
||||
|
@ -32,17 +32,17 @@
|
|||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-table v-if="activeIndex == 0" v-loading="loading" :data="activities" height="calc(100vh - 250px)">
|
||||
<el-table v-if="activeIndex == 0" v-loading="loading" :data="mediaLogList" height="calc(100vh - 310px)">
|
||||
<el-table-column label="序号" align="center" width="80">
|
||||
<template #default="scope">
|
||||
{{ scope.$index + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="供应商名称" align="left" prop="supplierName" width="230" :show-overflow-tooltip="true" />
|
||||
<!-- <el-table-column label="供应商名称" align="left" prop="supplierName" width="230" :show-overflow-tooltip="true" /> -->
|
||||
<el-table-column label="操作类型" align="left" prop="type" width="100" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="操作人" align="center" prop="user" width="160" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="操作时间" align="center" prop="timestamp" width="210" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="变更字段" align="left" prop="content" min-width="210" >
|
||||
<el-table-column label="操作人" align="center" prop="createBy" width="160" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="操作时间" align="center" prop="createTime" width="210" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="变更字段" align="left" prop="content" min-width="210">
|
||||
<template #default="scope">
|
||||
<el-popover popper-class="myUpdate_popover" placement="bottom-start">
|
||||
<el-table :data="detailTable" height="230px">
|
||||
|
@ -62,27 +62,44 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div v-if="activeIndex == 1">
|
||||
<el-timeline class="my-time-line" style="padding-left: 0;">
|
||||
<el-timeline-item v-for="(activity, index) in activities" :key="index" placement="top"
|
||||
:timestamp="activity.timestamp">
|
||||
<div class="logsTitle mb20"><span class="mr10">{{ activity.user }}</span><span>{{ activity.type
|
||||
}}</span>
|
||||
<pagination v-if="activeIndex == 0" :total="total" v-model:page="queryParams.pageIndex"
|
||||
v-model:limit="queryParams.pageSize" @pagination="getMediaPageList" />
|
||||
<div v-if="activeIndex == 1" v-loading="loading">
|
||||
<el-timeline v-if="mediaLogList.length > 0" class="my-time-line" style="padding-left: 0;">
|
||||
<el-timeline-item v-for="(activity, index) in mediaLogList" :key="index" placement="top"
|
||||
:timestamp="activity.createTime">
|
||||
<div class="logsTitle mb20">
|
||||
<span class="mr10"> {{ activity.createBy }}</span>
|
||||
<span span v-if="activity.operateType == 1">新增</span>
|
||||
<span span v-if="activity.operateType == 2">修改</span>
|
||||
<span span v-if="activity.operateType == 4">废除</span>
|
||||
</div>
|
||||
<ul class="defaultUL">
|
||||
<li>
|
||||
<span class="logsLable">变更字段:</span>
|
||||
<el-popover popper-class="myUpdate_popover" placement="bottom-start">
|
||||
<el-table :data="detailTable" height="230px">
|
||||
<el-table-column label="字段名称" align="left" prop="type" min-width="100"
|
||||
:show-overflow-tooltip="true" />
|
||||
<el-table-column label="变更前" align="left" prop="type" min-width="100"
|
||||
:show-overflow-tooltip="true" />
|
||||
<el-table-column label="变更后" align="left" prop="type" min-width="100"
|
||||
:show-overflow-tooltip="true" />
|
||||
<el-table :data="JSON.parse(activity.changeAfterDiffer)" height="230px">
|
||||
<el-table-column label="字段名称" align="left" prop="fieldDescribe" min-width="100"
|
||||
:show-overflow-tooltip="true">
|
||||
<template #default="scope">
|
||||
<span class="fieldDescribeLale">{{ scope.row.fieldDescribe }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="变更前" align="left" prop="firstVal" min-width="100"
|
||||
:show-overflow-tooltip="true">
|
||||
<template #default="scope">
|
||||
<span class="firstValLale">{{ scope.row.firstVal }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="变更后" align="left" prop="secondVal" min-width="100"
|
||||
:show-overflow-tooltip="true">
|
||||
<template #default="scope">
|
||||
<span class="secondValLale">{{ scope.row.secondVal }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<template #reference>
|
||||
<span class="updatefiter">{{ activity.content }}</span>
|
||||
<span class="updatefiter">{{ activity.changeAfter }}</span>
|
||||
</template>
|
||||
</el-popover>
|
||||
|
||||
|
@ -90,18 +107,19 @@
|
|||
</ul>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
<el-empty v-else :image-size="500" description="暂无数据" />
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
<script setup>
|
||||
import { onMounted, defineEmits, ref } from 'vue'
|
||||
import { Close, Grid, Calendar } from '@element-plus/icons-vue'
|
||||
import { defineEmits, ref } from 'vue'
|
||||
import { Close, Search } from '@element-plus/icons-vue'
|
||||
|
||||
import iconList from '@/assets/images/iconList.png'
|
||||
import iconTimeLine from '@/assets/images/iconTimeLine.png'
|
||||
import iconListChose from '@/assets/images/iconListChose.png'
|
||||
import iconTimeLineChose from '@/assets/images/iconTimeLineChose.png'
|
||||
import { getBusSupplier } from "@/api/supplier"
|
||||
import { mediaOptionLog } from "@/api/mediaLibrary"
|
||||
|
||||
const emit = defineEmits(['handleShowList']);
|
||||
const ToolOptions = ref([
|
||||
|
@ -109,52 +127,78 @@ const ToolOptions = ref([
|
|||
{ defaultIcon: iconTimeLine, activeIcon: iconTimeLineChose }
|
||||
])
|
||||
const activeIndex = ref(0)
|
||||
const supplierLogList = ref([])
|
||||
const detailTable = ref([])
|
||||
const mediaLogList = ref([])
|
||||
const loading = ref(false)
|
||||
const total = ref(0)
|
||||
const queryParams = ref({
|
||||
keyword: undefined
|
||||
pageIndex: 1,
|
||||
pageSize: 10,
|
||||
keyword: undefined,
|
||||
mediaId: undefined
|
||||
})
|
||||
|
||||
const activities = [{
|
||||
content: '其他: ; 年营收金额: ; 供应商所在城市: 山西/长治市/东湖区; 税点: ; 合作采购金额: 0.0; 联系人职务: ; 发票类型: ; 不良记录信息: ; 邮箱: ;其他: ; 年营收金额: ; 供应商所在城市: 山西/长治市/东湖区; 税点: ; 合作采购金额: 0.0; 联系人职务: ; 发票类型: ; 不良记录信息: ; 邮箱: ; ',
|
||||
content2: '其他: ; 年营收金额: 待定; 供应商所在城市: 山西/长治市; 税点: 待定; 合作采购金额: 0; 联系人职务: 待定; 发票类型: 暂定; 不良记录信息: ; 邮箱: ; ',
|
||||
timestamp: '2018-04-15',
|
||||
user: '优客传媒管理员',
|
||||
type: '修改'
|
||||
},
|
||||
{
|
||||
content: '其他: ; 年营收金额: ; 供应商所在城市: 山西/长治市/东湖区; 税点: ; 合作采购金额: 0.0; 联系人职务: ; 发票类型: ; 不良记录信息: ; 邮箱: ; ',
|
||||
content2: '其他: ; 年营收金额: 待定; 供应商所在城市: 山西/长治市; 税点: 待定; 合作采购金额: 0; 联系人职务: 待定; 发票类型: 暂定; 不良记录信息: ; 邮箱: ; ',
|
||||
timestamp: '2018-04-13',
|
||||
user: '优客传媒管理员',
|
||||
type: '修改'
|
||||
},
|
||||
{
|
||||
content: '其他: ; 年营收金额: ; 供应商所在城市: 山西/长治市/东湖区; 税点: ; 合作采购金额: 0.0; 联系人职务: ; 发票类型: ; 不良记录信息: ; 邮箱: ; ',
|
||||
content2: '其他: ; 年营收金额: 待定; 供应商所在城市: 山西/长治市; 税点: 待定; 合作采购金额: 0; 联系人职务: 待定; 发票类型: 暂定; 不良记录信息: ; 邮箱: ; ',
|
||||
timestamp: '2018-04-11',
|
||||
user: '优客传媒管理员',
|
||||
type: '新增'
|
||||
},
|
||||
]
|
||||
const handleChoseType = (index) => {
|
||||
activeIndex.value = index
|
||||
resetQuery()
|
||||
}
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
getSupplierPageList()
|
||||
if (activeIndex.value == 0) getMediaPageList()
|
||||
else getMediaList()
|
||||
}
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryParams.value = {
|
||||
keyword: undefined
|
||||
if (activeIndex.value == 0) {
|
||||
queryParams.value.pageIndex = 1
|
||||
queryParams.value.pageSize = 10
|
||||
}
|
||||
else {
|
||||
queryParams.value.pageIndex = undefined
|
||||
queryParams.value.pageSize = undefined
|
||||
}
|
||||
handleQuery()
|
||||
}
|
||||
// 获取分页日志记录
|
||||
const getMediaPageList = () => {
|
||||
// loading.value = true
|
||||
// busSupplierLogPage(queryParams.value).then(res => {
|
||||
// res.data.list.forEach(item => {
|
||||
// item.supplierName = supplierName.value
|
||||
// });
|
||||
// supplierLogList.value = res.data.list
|
||||
// total.value = res.data.total
|
||||
// loading.value = false
|
||||
// })
|
||||
}
|
||||
// 获取时间轴日志记录
|
||||
const getMediaList = () => {
|
||||
loading.value = true
|
||||
mediaOptionLog(queryParams.value).then(res => {
|
||||
// res.data.forEach(item => {
|
||||
// item.supplierName = supplierName.value
|
||||
// console.log(JSON.parse(item.updateContent))
|
||||
// });
|
||||
mediaLogList.value = res.data
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
// 关闭
|
||||
const handleClose = () => {
|
||||
emit('handleShowList')
|
||||
}
|
||||
// 初始化日志
|
||||
const initLog = (_row) => {
|
||||
queryParams.value.mediaId = _row.id
|
||||
// supplierName.value = _row.supplierName
|
||||
activeIndex.value = 0
|
||||
getMediaPageList()
|
||||
}
|
||||
|
||||
// 暴露方法\属性给父组件
|
||||
defineExpose({
|
||||
initLog
|
||||
});
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
.el-button,
|
||||
|
|
Loading…
Reference in New Issue
Block a user