dev

src/views/settings/log.vue

@@ -1,6 +1,26 @@
 <template>
   <div class="container-wrapper" style="padding: 24px">
-    <div class="title">操作日志</div>
+    <div class="title">
+      <div class="left">
+        <el-form :inline="true" :model="searchModel">
+          <el-date-picker
+              v-model="selectedDate"
+              type="daterange"
+              range-separator="-"
+              @change="handleDateChange"
+              start-placeholder="开始时间"
+              end-placeholder="结束时间"
+          />
+          <el-input placeholder="请输入内容" v-model="searchModel.managerName" style="width: 180px;"></el-input>
+          <el-input placeholder="请输入内容" v-model="searchModel.message" style="width: 180px;"></el-input>
+          <el-button type="primary" @click="getData">查询</el-button>
+        </el-form>
+
+      </div>
+      <div class="right">
+
+      </div>
+    </div>
     <div class="content">
       <el-table
           :data="tableData"
@@ -34,21 +54,14 @@
 <script setup lang="ts">
 import {onMounted, ref} from 'vue'
 import {post} from '@/utils/request.ts'
-const tableData = ref<any>([
+import {formatDateArray, getEndOfDay} from "@/utils/dateUtils.ts";
-])
+
-onMounted(()=>{
+const tableData = ref<any>([])
+onMounted(() => {
   init()
   getData()
 })
-const init=()=>{
+const init = () => {
-  const params = {
-    currentPage: currentPage.value,
-    pageSize: pageSize.value,
-  }
-
-  // post("",{params:params}).then((res:any)=>{
-  //   tableData.value=res
-  // })
 }
 const currentPage = ref(1)
 const pageSize = ref(20)
@@ -58,35 +71,57 @@ const handleCurrentChange = (val: any) => {
   getData()
 
 }
-const getData=()=>{
+const getData = () => {
   const params = {
     pageNum: currentPage.value,
     pageSize: pageSize.value,
+    ...searchModel.value,
+    beginTime: selectedDate.value?selectedDate.value[0]:null,
+    endTime: selectedDate.value?selectedDate.value[1]:null
   }
-  post("common/log/page",{query:params}).then((res:any)=>{
+  post("common/log/page", {query: params}).then((res: any) => {
-    tableData.value=res.list
+    tableData.value = res.list
-    total.value=res.total_count
+    total.value = res.total_count
-    console.log(tableData.value)
   })
 }
+const searchModel = ref<any>({})
+const selectedDate = ref<any>([])
+const handleDateChange = (date: any[]) => {
+  if (selectedDate.value){
+    selectedDate.value = formatDateArray(date)
+    selectedDate.value[1] = getEndOfDay(selectedDate.value[1]); // 输出今天 23:59
+  }
+}
+
 
 </script>
 <style scoped lang="scss">
-.container-wrapper{
+.container-wrapper {
   display: flex;
   flex-direction: column;
-  .title{
+
+  .title {
     font-size: 20px;
     height: 60px;
     line-height: 60px;
     background: #fff;
     font-weight: 500;
+
+    .left {
+      flex: 1;
+      display: flex;
+      justify-content: space-between;
+      margin-right: 24px;
+
     }
-  .content{
+  }
+
+  .content {
     flex: 1;
     background: #fff;
   }
-  .pagination{
+
+  .pagination {
     height: 60px;
     background: #fff;
     border-top: 1px solid #ebeef5;