src/router/white.js

@@ -35,6 +35,12 @@ export const whiteList = [
     full_path: 'views/commodity/cost.vue',
     component: () => import('views/commodity/cost')
   },
+  {
+    path: '/commodity/skucodelogs',
+    name: 'skucodelogs',
+    full_path: 'views/commodity/skucodelogs.vue',
+    component: () => import('views/commodity/skucodelogs')
+  },
   {
     path: '/purchase/index',
     name: 'purchaselist',
@@ -116,6 +122,7 @@ export const constantRouterComponents = {
   'combination': () => import('views/commodity/combination'),
   'commodityBrand': () => import('views/commodity/brand'),
   'commoditycost': () => import('views/commodity/cost'),
+  'skucodelogs': () => import('views/commodity/skucodelogs'),
   'purchaselist': () => import('views/purchase/index'),
   'warehouse': () => import('views/warehouse/index'),
   'warehouseIO': () => import('views/warehouse/io'),

src/views/commodity/skucodelogs.vue

@@ -0,0 +1,130 @@
+<template>
+  <div class="pageBox">
+    <div class="searchBox">
+      <div class="row">
+        <span class="span">规格编码：</span>
+        <div class="right">
+          <el-input v-model="sku_code" class="wid100" clearable></el-input>
+        </div>
+      </div>
+      <div class="row">
+        <el-button type="primary" @click="handleSearch"><el-icon><Search /></el-icon>&nbsp;筛选</el-button>
+      </div>
+    </div>
+
+    <el-card shadow="never">
+      <el-table :data="goodsList" style="width: 100%" border v-loading="loading">
+        <el-table-column prop="id" label="ID" width="80" align="center" />
+        <el-table-column prop="old_value" label="更改前" align="center" />
+        <el-table-column prop="new_value" label="更改后" align="center" />
+        <el-table-column prop="table_chinese_name" label="表名称" align="center" />
+        <el-table-column prop="field_chinese_name" label="字段名称" align="center" />
+        <el-table-column prop="goods_info.title" label="商品名称" align="center" />
+        <el-table-column prop="admin_user.username" label="操作人" align="center" />
+        <el-table-column prop="created_at" label="时间" align="center" />
+      </el-table>
+      <div class="page-pagination">
+        <el-pagination
+          :current-page="page"
+          background
+          layout="prev, pager, next, sizes, total"
+          :total="total"
+          :page-sizes="[10, 50, 100]"
+          :page-size="pageSize"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"></el-pagination>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { onMounted, reactive, toRefs } from "vue"
+import { get } from "@/api/request"
+import { Search, Plus, Edit, ZoomIn, Delete } from '@element-plus/icons'
+import dayjs from 'dayjs'
+
+export default {
+  components: {
+    Search, Plus, Edit, ZoomIn, Delete
+  },
+  setup() {
+    const data = reactive({
+      sku_code: '',
+      goodsList: [],
+      page: 1,
+      pageSize: 10,
+      total: 0,
+      loading: false
+    })
+
+    function handleSearch() {
+      data.page = 1
+      fetchData()
+    }
+
+    const fetchData = () => {
+      data.loading = true
+      let params = {
+        page: data.page,
+        pageSize: data.pageSize,
+        sku_code: data.sku_code
+      }
+      get(`/api/audit-logs`, params).then((res) => {
+        data.goodsList = res.data
+        data.total = res.meta.total
+        data.loading = false
+      }).catch(() => {
+        data.loading = false
+      })
+    }
+
+    function handleCurrentChange(e) {
+      data.page = e
+      fetchData()
+    }
+
+    function handleSizeChange(e) {
+      data.page = 1
+      data.pageSize = e
+      fetchData()
+    }
+
+    onMounted(() => {
+      fetchData()
+    })
+
+    return {
+      ...toRefs(data),
+      handleSearch,
+      handleCurrentChange,
+      handleSizeChange,
+      fetchData
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .searchBox{
+    display: flex;
+    flex-wrap: wrap;
+    background-color: #fff;
+    padding: 15px 0 0 0;
+    border-radius: 4px;
+    margin-bottom: 15px;
+    .row{
+      display: flex;
+      align-items: center;
+      box-sizing: border-box;
+      margin: 0 15px 15px 0;
+      .span{
+        display: block;
+        width: 80px;
+        font-size: 14px;
+        text-align: right;
+        box-sizing: border-box;
+      }
+    }
+  }
+</style>