From 32ec2167a0ba365db02865c7ceaee346983ea7cc Mon Sep 17 00:00:00 2001
From: wangchengming <15110151257@163.com>
Date: Wed, 10 Sep 2025 23:53:11 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AF=B9=E6=8E=A5=E5=AA=92=E4=BD=93=E6=97=A5?=
 =?UTF-8?q?=E5=BF=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/mediaLibrary/index.vue     |   4 +-
 src/views/mediaLibrary/mediaLogs.vue | 150 +++++++++++++++++----------
 2 files changed, 99 insertions(+), 55 deletions(-)

diff --git a/src/views/mediaLibrary/index.vue b/src/views/mediaLibrary/index.vue
index 21aa2f6..e6d255c 100644
--- a/src/views/mediaLibrary/index.vue
+++ b/src/views/mediaLibrary/index.vue
@@ -164,7 +164,7 @@
                                 <template #reference>
                                     <span class="mediaNameLabel" @click="handleOpenDetail(scope.row)">{{
                                         scope.row.mediaName
-                                    }}</span>
+                                        }}</span>
                                 </template>
                             </el-popover>
 
@@ -631,7 +631,7 @@ const handleCloseDetail = () => {
 const handleLogs = (row) => {
     showLogs.value = true
     nextTick(() => {
-        // supplierLogsRef.value.initForm('编辑供应商', row)
+        mediaLogsRef.value.initLog(row)
     })
 }
 // 关闭日志
diff --git a/src/views/mediaLibrary/mediaLogs.vue b/src/views/mediaLibrary/mediaLogs.vue
index 7133668..3afa5da 100644
--- a/src/views/mediaLibrary/mediaLogs.vue
+++ b/src/views/mediaLibrary/mediaLogs.vue
@@ -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">
@@ -56,33 +56,50 @@
                         <template #reference>
                             <span class="updatefiter" @click="handleOpenDetail(scope.row.supplierId)">{{
                                 scope.row.content
-                                }}</span>
+                            }}</span>
                         </template>
                     </el-popover>
                 </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,