fix 图书变更记录

src/components/CommonPage/SimpleTable.vue

@@ -42,16 +42,24 @@
       default() {
         return {};
       }
+    },
+    fetchPage: {
+      type: Function
+    },
+    formaterData: {
+      type: Function,
+      default(data) {
+        return data;
+      }
     }
   });
 
   const tableRef = ref(null);
 
   async function queryPage(params) {
-    if (!props.pageUrl) return Promise.reject(new Error('请配置pageUrl'));
-    const res = await request.get(props.pageUrl, { params });
+    const res = await props.fetchPage(params);
     if (res.data.code === 200) {
-      return res.data;
+      return props.formaterData(res.data);
     }
     return Promise.reject(new Error(res.data.msg));
   }

src/views/data/books/components/books-change-log.vue

@@ -1,7 +1,20 @@
 <!-- 编辑弹窗 -->
 <template>
   <ele-modal form :width="800" v-model="visible" title="变动记录">
-    <SimpleTable style="width: 100%" :columns="columns" pageUrl="/book/bookInfoLog/list" :otherParams="otherParams"></SimpleTable>
+    <SimpleTable
+      ref="tableRef"
+      style="width: 100%"
+      :columns="columns"
+      :fetchPage="fetchPage"
+      :formaterData="formaterData"
+    >
+      <template #changeValue="{ row }">
+        <div class="flex flex-col">
+          <el-text>变动前：{{ row.oldValue || '-' }}</el-text>
+          <el-text>变动后：{{ row.newValue || '-' }}</el-text>
+        </div>
+      </template>
+    </SimpleTable>
 
     <template #footer>
       <el-button @click="handleCancel">关闭</el-button>
@@ -13,6 +26,7 @@
   import { ref, reactive, nextTick } from 'vue';
   import { Flag, ChatDotSquare } from '@element-plus/icons-vue';
   import SimpleTable from '@/components/CommonPage/SimpleTable.vue';
+  import request from '@/utils/request';
 
   /** 弹窗是否打开 */
   const visible = defineModel({ type: Boolean });
@@ -23,18 +37,31 @@
   };
 
   /** 弹窗打开事件 */
-  const otherParams = ref({ });
+  let bookId = ref();
+  const tableRef = ref();
   const handleOpen = (row) => {
     visible.value = true;
-    otherParams.value.id = row.id;
-    nextTick(() => console.log('打开'));
+    bookId.value = row.id;
+    nextTick(() => {
+      tableRef.value?.reload();
+    });
   };
 
+  function formaterData(data) {
+    return { rows: data.data };
+  }
+
+  function fetchPage(params) {
+    return request.get('/book/bookInfo/getChangeLog/' + bookId.value, {
+      params
+    });
+  }
+
   // 表格数据
   const columns = reactive([
-    { label: '变动属性', prop: 'createBy', width: 100 },
-    { label: '变动值', prop: 'logDescription' },
-    { label: '操作员', prop: 'logDescription' },
+    { label: '变动属性', prop: 'changeAttribute', width: 100 },
+    { label: '变动值', prop: 'changeValue', slot: 'changeValue' },
+    { label: '操作员', prop: 'createName', width: 100 },
     { label: '变动时间', prop: 'createTime', width: 180 }
   ]);