featr: 添加用户详情模块

.vscode/settings.json

@@ -7,7 +7,7 @@
   "editor.tabSize": 2,
   "editor.formatOnPaste": true,
   "editor.guides.bracketPairs": "active",
-  "files.autoSave": "onFocusChange",
+  "files.autoSave": "onWindowChange",
   "git.confirmSync": false,
   "workbench.startupEditor": "newUntitledFile",
   "editor.suggestSelection": "first",

src/api/basic.ts

@@ -44,6 +44,7 @@ interface IHistoricalData {
 export type HistoricalData = {
   count: number
   data: {
+    count: number
     list: Array<IHistoricalData>
   }
 }
@@ -73,118 +74,60 @@ export const getHistoricalData = (data?: object) => {
 
 /** 搜索用户 */
 export const getUserData = (data?: object) => {
+  console.log('getUserData:', data)
   return http.request<HistoricalData>('post', baseUrlApi('/cms/user/list'), {
     data
   })
 }
 
-// export type IGameInfo = {
-//   uid?: string
-//   play: string //总玩牌局数
-//   totalhands: string //总手数
-//   r_in: string //入池率
-//   r_win: string //入池胜率
-//   r_fc: string //翻牌前
-//   r_ds: string //3bet率
-//   r_jin: string //激进度
-//   r_sd: string //摊牌率
-//   r_100hands: string //百手盈利
-//   totalwin: string //总盈利
-// }
-export interface IGameInfo {
-  uid: number
-  cb: string
-  rDs: string
-  rD3b: string
-  rFbt: number
-  rFc: string
-  rRuwin: string
-  rSd: string
-  rSf: string
-  r100hands: number
-  rSdw: string
-  rRuTimes: number
-  '3b': string
-  play: number
-  rCh: string
-  rJin: string
-  totalwin: string
-  rRu: string
-  totalbuyin: number
-  utime: string
-  bmaxlose: number
-  hmaxwin: number
-  rWin: string
-  maxcard: string
-  bmaxwin: number
-  totalhands: number
-  rIn: string
-}
-
-export interface GameInfo {
-  ploFive: IGameInfo
-  ploSix: IGameInfo
-  omaha: IGameInfo
-  texas: IGameInfo
-}
-
-export type IUserInfo = {
-  data: {
-    base_info: {}
-    game_info: GameInfo
-    join_club_list?: any[]
-    create_club_list?: any[]
-  }
-}
-export interface BaseInfo {
-  lastName: string
-  uid: number
-  registerChannel: string
-  user_phone: string
-  street: string
-  postalCode: string
-  enterCount: number
-  gbgCheck: string
-  isHideFlag: number
-  city: string
-  firstName: string
-  houseNumber: string
-  enterTime: number
-  playTime: number
-  user_name: string
-  channel: string
-  scrapAmount: number
-  diamond: number
-  regTime: number
-  birthday: number
-  remarks: string
-  nationality: string
-  usersig: string
-  nickname: string
-  createGroupLimit: number
-  icon: string
-  regIp: string
-  identityCard: string
-  country: string
-  gender: number
-  userCategory: number
-  user_email: string
-}
-
-type Result = {
-  code: number
-  data?: {
-    /** 列表数据 */
-    base_info: BaseInfo
-    create_club_list: Array<any>
-    join_club_list: Array<any>
-    game_info: GameInfo
-  }
-}
 /** 搜索用户 基本信息 */
 export const getUserInfo = (data?: object) => {
-  console.log('_', data)
+  console.log('getUserInfo_', data)
-  return http.request<Result>('post', baseUrlApi('/cms/user/info'), {
+  return http.request<any>('post', baseUrlApi('/cms/user/info'), {
+    data
+  })
+}
+
+/** 搜索用户 - 游戏记录>牌局记录 */
+export const getGameRecord = (data?: object) => {
+  console.log('getGameRecord', data)
+  return http.request<any>('post', baseUrlApi('/cms/user/game_history'), {
+    data
+  })
+}
+
+/** 搜索用户 - 游戏记录>手牌历史 */
+export const getGameHandsRecord = (data?: object) => {
+  console.log('getGameHandsRecord', data)
+
+  return http.request<any>('post', baseUrlApi('/cms/user/hands_history'), {
+    data
+  })
+}
+
+/** 搜索用户 - 游戏记录>钻石记录 */
+export const getDiamondLog = (data?: object) => {
+  console.log('getGameHandsRecord', data)
+
+  return http.request<any>('post', baseUrlApi('/cms/user/diamond_logs'), {
+    data
+  })
+}
+
+/** 搜索用户 - 游戏记录>登录记录 */
+export const getLoginLog = (data?: object) => {
+  console.log('getGameHandsRecord', data)
+
+  return http.request<any>('post', baseUrlApi('/cms/user/login_logs'), {
+    data
+  })
+}
+
+/** 搜索用户 - 游戏记录>聊天记录 */
+export const getChatLog = (data?: object) => {
+  console.log('getGameHandsRecord', data)
+
+  return http.request<any>('post', baseUrlApi('/cms/user/chat_logs'), {
     data
   })
 }

src/api/tableData.ts

@@ -0,0 +1,13 @@
+/** module: 牌局数据 */
+
+import { http } from '@/utils/http'
+import { baseUrlApi } from './utils'
+
+/** 搜索用户 - 游戏记录>聊天记录 */
+export const getTableData = (data?: object) => {
+  console.log('getTableData', data)
+
+  return http.request<any>('post', baseUrlApi('/cms/poker/dataset'), {
+    data
+  })
+}

src/router/modules/basicData.ts

@@ -64,16 +64,16 @@ export default {
             title: '用户信息p',
             showLink: false
           }
-        },
-        {
-          path: '/basic/queryUser/users/:id/basicInfo',
-          name: 'UserBasicInfo',
-          component: () => import('@/views/basic/queryUser/user/basicInfo.vue'),
-          meta: {
-            title: '基础信息',
-            showLink: false
-          }
         }
+        // {
+        //   path: '/basic/queryUser/users/:id/basicInfo',
+        //   name: 'UserBasicInfo',
+        //   component: () => import('@/views/basic/queryUser/user/basicInfo.vue'),
+        //   meta: {
+        //     title: '基础信息',
+        //     showLink: false
+        //   }
+        // }
       ]
     },
     // {
@@ -88,7 +88,7 @@ export default {
     // {
     //   path: '/basic/queryUser/users/:id/basicInfo',
     //   name: 'UserBasicInfo',
-    //   component: () => import('@/views/basic/queryUser/user/basicInfo.vue'),
+    //   component: () => import('@/views/basic/queryUser/user/BasicInfo.vue'),
     //   meta: {
     //     title: '基础信息',
     //     showLink: false
@@ -97,7 +97,7 @@ export default {
     {
       path: '/basic/gameData',
       name: 'GameData',
-      component: () => import('@/views/basic/GameData.vue'),
+      component: () => import('@/views/basic/gameData.vue'),
       meta: {
         title: $t('menus.gameData')
       }

src/views/basic/GameData.vue

@@ -1,10 +1,154 @@
 <script setup lang="ts">
+import { useRenderIcon } from '@/components/ReIcon/src/hooks'
+import Search from '@iconify-icons/ep/search'
+
+import { ref, onMounted } from 'vue'
+import { getTableData } from '@/api/tableData'
+
 defineOptions({
   // name 作为一种规范最好必须写上并且和路由的name保持一致
   name: 'GameData'
 })
+const headerStyle = {
+  background: 'var(--el-table-row-hover-bg-color)',
+  color: 'var(--el-text-color-primary)'
+}
+
+const gamePlayColumns = [
+  { label: '时间', prop: 'date' },
+  { label: 'NLH', prop: 'nlh' },
+  { label: 'PLO4', prop: 'plo4' },
+  { label: 'PLO5', prop: 'plo5' },
+  { label: 'PLO6', prop: 'plo6' },
+  { label: '总计', prop: 'total' }
+]
+const blindLevelColumns = {
+  nlh: [
+    { label: 'NLH盲注', prop: 'blind' },
+    { label: '牌桌总数', prop: 'table_count' },
+    { label: '上桌总数', prop: 'player_count' }
+  ],
+  plo4: [
+    { label: 'PLO4盲注', prop: 'blind' },
+    { label: '牌桌总数', prop: 'table_count' },
+    { label: '上桌总数', prop: 'player_count' }
+  ],
+  plo5: [
+    { label: 'PLO5盲注', prop: 'blind' },
+    { label: '牌桌总数', prop: 'table_count' },
+    { label: '上桌总数', prop: 'player_count' }
+  ],
+  plo6: [
+    { label: 'PLO6盲注', prop: 'blind' },
+    { label: '牌桌总数', prop: 'table_count' },
+    { label: '上桌总数', prop: 'player_count' }
+  ]
+}
+
+const gamePlayTableData = ref([])
+const blindLevelTableData = ref({
+  nlh: [],
+  plo4: [],
+  plo5: [],
+  plo6: []
+})
+
+const form = ref({
+  dateRange: ''
+})
+const loading = ref(true)
+
+function onSearch() {
+  const params = { page: 2, per_page: 5 }
+  getTableData(params).then(res => {
+    console.log('getTableData', res)
+    loading.value = false
+    const { data } = res
+    gamePlayTableData.value = data.dates
+    blindLevelTableData.value = data.blinds
+  })
+}
+
+onMounted(() => {
+  onSearch()
+})
 </script>
 
 <template>
+  <el-card>
     <h1>牌局数据</h1>
+    <el-form
+      ref="formRef"
+      :inline="true"
+      :model="form"
+      class="bg-bg_color w-[99/100]"
+    >
+      <el-form-item prop="dateRange">
+        <el-date-picker
+          v-model="form.dateRange"
+          type="daterange"
+          range-separator="To"
+          start-placeholder="Start date"
+          end-placeholder="End date"
+          format="YYYY/MM/DD"
+          value-format="x"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          type="primary"
+          :icon="useRenderIcon(Search)"
+          :loading="loading"
+          @click="onSearch"
+        >
+          搜索
+        </el-button>
+      </el-form-item>
+    </el-form>
+
+    <h3>按玩法</h3>
+    <div class="w-3/4">
+      <pure-table
+        :data="gamePlayTableData"
+        :columns="gamePlayColumns"
+        :header-cell-style="headerStyle"
+        border
+        stripe
+      />
+    </div>
+
+    <el-divider />
+
+    <h3>按级别</h3>
+    <div class="grid grid-cols-4 gap-4">
+      <pure-table
+        :data="blindLevelTableData.nlh"
+        :columns="blindLevelColumns.nlh"
+        :header-cell-style="headerStyle"
+        border
+        stripe
+      />
+      <pure-table
+        :data="blindLevelTableData.plo4"
+        :columns="blindLevelColumns.plo4"
+        :header-cell-style="headerStyle"
+        border
+        stripe
+      />
+      <pure-table
+        :data="blindLevelTableData.plo5"
+        :columns="blindLevelColumns.plo5"
+        :header-cell-style="headerStyle"
+        border
+        stripe
+      />
+      <pure-table
+        :data="blindLevelTableData.plo6"
+        :columns="blindLevelColumns.plo6"
+        :header-cell-style="headerStyle"
+        border
+        stripe
+      />
+    </div>
+  </el-card>
 </template>

src/views/basic/queryUser/infoHook.ts

@@ -19,8 +19,8 @@ export function useDetail() {
         query: { id: String(index) },
         meta: {
           title: {
-            zh: `No.${index} - 详情信息`,
+            zh: `${index} - 详情信息`,
-            en: `No.${index} - DetailInfo`
+            en: `${index} - DetailInfo`
           },
           // 最大打开标签数
           dynamicLevel: 3

src/views/basic/queryUser/queryUser.vue

@@ -15,8 +15,17 @@ const { toDetail, router } = useDetail()
 console.log('router:', router)
 
 const formRef = ref()
-const { form, historicalData, historicalColumns, loading, onSearchUser } =
+const {
-  useUser()
+  form,
+  historicalData,
+  historicalColumns,
+  loading,
+  pagination_pure,
+  onSearchUser,
+  handleSizeChange,
+  handleCurrentChange
+  // handleClick
+} = useUser()
 </script>
 
 <template>
@@ -35,7 +44,7 @@ const { form, historicalData, historicalColumns, loading, onSearchUser } =
     >
       <el-form-item prop="username">
         <el-input
-          v-model="form.username"
+          v-model="form.user_name"
           placeholder="用户名"
           clearable
           class="!w-[160px]"
@@ -43,7 +52,7 @@ const { form, historicalData, historicalColumns, loading, onSearchUser } =
       </el-form-item>
       <el-form-item prop="mobile">
         <el-input
-          v-model="form.mobile"
+          v-model="form.user_phone"
           placeholder="手机号码"
           clearable
           class="!w-[160px]"
@@ -51,7 +60,7 @@ const { form, historicalData, historicalColumns, loading, onSearchUser } =
       </el-form-item>
       <el-form-item prop="email">
         <el-input
-          v-model="form.email"
+          v-model="form.user_email"
           placeholder="邮箱"
           clearable
           class="!w-[200px]"
@@ -65,7 +74,7 @@ const { form, historicalData, historicalColumns, loading, onSearchUser } =
           start-placeholder="Start date"
           end-placeholder="End date"
           format="YYYY/MM/DD"
-          value-format="YYYY-MM-DD"
+          value-format="x"
         />
       </el-form-item>
       <el-form-item>
@@ -80,29 +89,25 @@ const { form, historicalData, historicalColumns, loading, onSearchUser } =
       </el-form-item>
     </el-form>
 
-    <pure-table :data="historicalData" :columns="historicalColumns" border />
+    <pure-table
-
+      :data="historicalData"
-    <!-- <div class="flex flex-wrap items-center">
+      :columns="historicalColumns"
-      <p>params传参模式：</p>
+      :loading="loading"
-      <el-button
+      :pagination="pagination_pure"
-        class="m-2"
+      @size-change="handleSizeChange"
-        v-for="index in 6"
+      @current-change="handleCurrentChange"
-        :key="index"
+      border
-        @click="toDetail(index, 'params')"
     >
-        打开{{ index }}详情页
+      <template #operation="{ row }">
-      </el-button>
-    </div> -->
-    <div class="flex flex-wrap items-center">
-      <p>query传参模式：</p>
         <el-button
-        class="m-2"
+          link
-        v-for="index in 6"
+          type="primary"
-        :key="index"
+          size="small"
-        @click="toDetail(index, 'query')"
+          @click="toDetail(row.uid, 'query')"
         >
-        打开{{ index }}详情页
+          {{ row.uid }}
         </el-button>
-    </div>
+      </template>
+    </pure-table>
   </el-card>
 </template>

src/views/basic/queryUser/queryUserHook.ts

@@ -1,9 +1,15 @@
-import { ref, reactive, onMounted } from 'vue'
+import { ref, reactive, computed, nextTick, onMounted } from 'vue'
+import dayjs from 'dayjs'
 
 import { getUserData } from '@/api/basic'
 
 export function useUser() {
   const historicalColumns: TableColumnList = [
+    {
+      label: 'UID',
+      prop: 'uid',
+      slot: 'operation'
+    },
     {
       label: '用户名',
       prop: 'user_name'
@@ -26,7 +32,9 @@ export function useUser() {
     },
     {
       label: '最后登录',
-      prop: 'enter_time'
+      prop: 'enter_time',
+      formatter: ({ enter_time }) =>
+        dayjs(enter_time * 1000).format('YYYY-MM-DD HH:MM:ss')
     },
     {
       label: '最后登录IP及归属地',
@@ -35,28 +43,75 @@ export function useUser() {
   ]
 
   const form = reactive({
-    username: '',
+    user_name: '',
-    mobile: '',
+    user_phone: '',
-    email: '',
+    user_email: '',
     dateRange: ''
   })
 
   const historicalData = ref([])
   const loading = ref(true)
 
+  const pagination_pure = reactive({
+    currentPage: 1,
+    pageSize: 10,
+    total: 0,
+    background: true
+  })
+
+  const pagination = computed(() => {
+    return {
+      page: pagination_pure.currentPage,
+      per_page: pagination_pure.pageSize
+    }
+  })
+
   function onSearchUser() {
-    console.log(form.dateRange)
+    loading.value = true
-    console.log(form.dateRange[0])
+    console.log('form.dateRange:', form.dateRange)
-    getUserData({ date: form })
+    console.log('pagination', pagination)
+    const start_time = form.dateRange ? Number(form?.dateRange[0]) / 1000 : ''
+    const end_time = form.dateRange ? Number(form?.dateRange[1]) / 1000 : ''
+    getUserData({
+      ...form,
+      per_page: pagination_pure.pageSize,
+      page: pagination_pure.currentPage,
+      start_time,
+      end_time
+    })
       .then(res => {
         historicalData.value = res.data.list
         loading.value = false
+        pagination_pure.total = res.data.count
       })
       .catch(() => {
         loading.value = false
       })
   }
 
+  function handleSizeChange(val: number) {
+    console.log(`${val} items per page`)
+    nextTick(() => {
+      onSearchUser()
+    })
+  }
+
+  function handleCurrentChange(val: number) {
+    console.log(`current page: ${val}`)
+    console.log({ val })
+    nextTick(() => {
+      onSearchUser()
+    })
+  }
+
+  // function handleClick(row) {
+  //   console.log(
+  //     '%crow===>>>: ',
+  //     'color: MidnightBlue; background: Aquamarine; font-size: 20px;',
+  //     row
+  //   )
+  // }
+
   // const resetHistoryForm = formEl => {
   //   if (!formEl) return
   //   formEl.resetFields()
@@ -72,7 +127,11 @@ export function useUser() {
     historicalData,
     historicalColumns,
     loading,
-    onSearchUser
+    pagination_pure,
+    onSearchUser,
+    handleSizeChange,
+    handleCurrentChange
+    // handleClick
     // resetHistoryForm
   }
 }

src/views/basic/queryUser/user/BasicInfo.vue

@@ -1,27 +1,27 @@
 <template>
-  <div>基础信息-{{ id }}-{{ props.uid }}</div>
+  <div>基础信息-{{ uid }}-{{ props.uid }}</div>
   <el-divider />
   <div class="grid grid-cols-12">
     <div class="col-span-1 flex flex-col items-center justify-center">
-      <el-avatar :size="60" :src="pageData.base_info['icon']" />
+      <el-avatar :size="60" :src="base_info['icon']" />
       <el-button size="small" class="icon-avatar-change">修改</el-button>
     </div>
 
     <el-descriptions class="col-span-10">
       <el-descriptions-item label="用户名">{{
-        pageData.base_info['user_name']
+        base_info['user_name']
       }}</el-descriptions-item>
       <el-descriptions-item label="钻石">{{
-        pageData.base_info.diamond
+        base_info.diamond
       }}</el-descriptions-item>
       <el-descriptions-item label="国家">{{
-        pageData.base_info.country
+        base_info.country
       }}</el-descriptions-item>
       <el-descriptions-item label="绑定手机">{{
-        pageData.base_info.user_phone
+        base_info.user_phone
       }}</el-descriptions-item>
       <el-descriptions-item label="绑定邮箱">{{
-        pageData.base_info.user_email
+        base_info.user_email
       }}</el-descriptions-item>
       <el-descriptions-item>
         <el-button>封号</el-button>
@@ -37,7 +37,7 @@
         v-for="(item, i) in loginInfoMap"
         :key="i"
         :label="item.label"
-        >{{ pageData.base_info[item.prop] }}111</el-descriptions-item
+        >{{ base_info[item.prop] }}</el-descriptions-item
       >
     </el-descriptions>
 
@@ -46,7 +46,7 @@
         v-for="(item, i) in registerInfoMap"
         :key="i"
         :label="item.label"
-        >{{ pageData.base_info[item.prop] }}</el-descriptions-item
+        >{{ base_info[item.prop] }}</el-descriptions-item
       >
     </el-descriptions>
   </div>
@@ -54,16 +54,12 @@
   <el-descriptions title="俱乐部信息" border />
   <div class="grid grid-cols-2 gap-4">
     <pure-table
-      :data="pageData.create_club_list"
+      :data="create_club_list"
       :columns="created_club_columns"
       border
     />
 
-    <pure-table
+    <pure-table :data="join_club_list" :columns="joined_club_columns" border />
-      :data="pageData.join_club_list"
-      :columns="joined_club_columns"
-      border
-    />
   </div>
 
   <el-divider />
@@ -74,7 +70,7 @@
         v-for="(item, i) in gameMap"
         :key="i"
         :label="item.label"
-        >{{ pageData.game_info.omaha[item.prop] }}
+        >{{ game_info.omaha[item.prop] }}
       </el-descriptions-item>
     </el-descriptions>
 
@@ -83,7 +79,7 @@
         v-for="(item, i) in gameMap"
         :key="i"
         :label="item.label"
-        >{{ pageData.game_info.texas[item.prop] }}</el-descriptions-item
+        >{{ game_info.texas[item.prop] }}</el-descriptions-item
       >
     </el-descriptions>
     <el-descriptions :column="1" title="PLO5">
@@ -91,7 +87,7 @@
         v-for="(item, i) in gameMap"
         :key="i"
         :label="item.label"
-        >{{ pageData.game_info.plo_five[item.prop] }}</el-descriptions-item
+        >{{ game_info.plo_five[item.prop] }}</el-descriptions-item
       >
     </el-descriptions>
     <el-descriptions :column="1" title="PLO6">
@@ -99,17 +95,25 @@
         v-for="(item, i) in gameMap"
         :key="i"
         :label="item.label"
-        >{{ pageData.game_info.plo_six[item.prop] }}</el-descriptions-item
+        >{{ game_info.plo_six[item.prop] }}</el-descriptions-item
       >
     </el-descriptions>
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
+import { onMounted } from 'vue'
 import { useRoute } from 'vue-router'
 
 import { getUserInfo } from '@/api/basic'
+import {
+  created_club_columns,
+  joined_club_columns,
+  loginInfoMap,
+  registerInfoMap,
+  gameMap,
+  useBasic
+} from './basicInfoHook'
 
 defineOptions({
   // name 作为一种规范最好必须写上并且和路由的name保持一致
@@ -120,115 +124,24 @@ const props = defineProps(['uid'])
 
 const route = useRoute()
 // const router = useRouter()
-const id = route.query?.id ? route.query?.id : route.params?.id
+const uid = route.query?.id ? route.query?.id : route.params?.id
 
-const pageData = ref({
+let { base_info, create_club_list, game_info, join_club_list } = useBasic()
-  base_info: {},
-  create_club_list: [],
-  game_info: {
-    omaha: {},
-    texas: {},
-    plo_five: {},
-    plo_six: {}
-  },
-  join_club_list: []
-})
-
-// const base_info: any = ref({})
-// const create_club_list: any = ref([])
-// const join_club_list: any = ref([])
-// let game_info: {
-//   omaha: IGameInfo
-// } = reactive({ omaha: {} })
 // const { base_info, create_club_list, game_info, join_club_list } = pageData
-
-// getUserInfo({ uid: 20475 }).then(res => {
-//   console.log('res.data', res.data)
-//   // pageData = res.data
-// })
-
 function onSearch() {
   console.log('onSearch')
   // loading.value = true
-  getUserInfo({ uid: 20475 }).then(res => {
+  getUserInfo({ uid }).then(res => {
     const { data } = res
-    console.log('data-basic', data)
+    // const { base_info, create_club_list, game_info, join_club_list } = res.data
-    pageData.value = data
+
-    // pageData.base_info = data.base_info
+    base_info = data.base_info
-    // pageData.create_club_list = data.create_club_list
+    create_club_list = data.create_club_list
-    // pageData.join_club_list = data.join_club_list
+    game_info = data.game_info
-    // pageData.game_info = data.game_info
+    join_club_list = data.join_club_list
-    // const { base_info, create_club_list, join_club_list, game_info } =
-    //   toRef(pageData)
-    // console.log('game_info', game_info)
-    // console.log('game_info', game_info.omaha)
-    // const { omaha } = game_info
-    // console.log('uid', game_info.omaha.uid)
-    // setTimeout(() => {
-    //   loading.value = false
-    // }, 500)
   })
 }
 
-const created_club_columns: TableColumnList = [
-  {
-    label: '俱乐部名称（创建）',
-    prop: 'name'
-  },
-  {
-    label: '创建时间',
-    prop: 'date'
-  },
-  {
-    label: '俱乐部分积分',
-    prop: 'jifen'
-  }
-]
-const joined_club_columns: TableColumnList = [
-  {
-    label: '俱乐部名称（创建）',
-    prop: 'name'
-  },
-  {
-    label: '创建时间',
-    prop: 'date'
-  },
-  {
-    label: '俱乐部分积分',
-    prop: 'jifen'
-  }
-]
-
-const loginInfoMap = [
-  { label: '登录渠道', prop: 'channel' },
-  { label: '登录版本', prop: 'last_login_version' },
-  { label: '最近登录IP', prop: 'last_login_ip' },
-  { label: '最近登录IP位置', prop: 'last_login_country' },
-  { label: '最近登录时间', prop: 'enter_time' },
-  { label: '最近登录IP设备', prop: 'last_login_device' }
-]
-
-const registerInfoMap = [
-  { label: '注册渠道', prop: 'register_channel' },
-  { label: '注册版本', prop: '' }, // 先空着
-  { label: '注册时间', prop: 'reg_time' },
-  { label: '注册IP', prop: 'reg_ip' },
-  { label: '注册设备', prop: '' } // 先空着
-]
-
-const gameMap = [
-  { label: '总玩牌手数', prop: 'totalhands' },
-  { label: '总玩牌局数', prop: 'play' },
-  { label: '入池率', prop: 'r_in' },
-  { label: '入池胜率', prop: 'r_win' },
-  { label: '翻牌前入池率', prop: 'r_fc' },
-  { label: '3bet率', prop: 'r_ds' },
-  { label: '激进度', prop: 'r_jin' },
-  { label: '摊牌度', prop: 'r_sd' },
-  { label: '百手盈利', prop: 'r_100hands' },
-  { label: '盈利', prop: 'totalwin' }
-]
-
 onMounted(() => {
   onSearch()
 })

src/views/basic/queryUser/user/GameRecord.vue

@@ -1,6 +1,6 @@
 <template>
   <div>游戏记录-{{ id }}-{{ props.uid }}</div>
-  <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
+  <el-tabs v-model="activeName" class="demo-tabs" @tab-change="handleClick">
     <el-tab-pane label="牌局记录" name="first">
       <el-form
         ref="formRef"
@@ -16,7 +16,7 @@
             start-placeholder="Start date"
             end-placeholder="End date"
             format="YYYY/MM/DD"
-            value-format="YYYY-MM-DD"
+            value-format="x"
           />
         </el-form-item>
         <el-form-item>
@@ -24,7 +24,7 @@
             type="primary"
             :icon="useRenderIcon(Search)"
             :loading="loading"
-            @click="onSearchUser"
+            @click="onSearch({ type: 'table' })"
           >
             搜索
           </el-button>
@@ -34,51 +34,74 @@
             type="success"
             :icon="useRenderIcon(Search)"
             :loading="loading"
-            @click="onSearchUser"
+            @click="onSearch({ type: 'table' })"
           >
             导出
           </el-button>
         </el-form-item>
       </el-form>
 
-      <pure-table :data="tableData" :columns="tableRecordColumn" border />
+      <pure-table :data="pageData" :columns="tableRecordColumn" border />
     </el-tab-pane>
 
     <el-tab-pane label="手牌历史" name="second">
-      <el-table :data="handsData" style="width: 100%">
+      <el-form
-        <el-table-column type="expand">
+        ref="formRef"
-          <template #default="props">
+        :inline="true"
-            <div class="mb-4">
+        :model="form"
-              <p class="t-0 mb-2">State: {{ props.row.state }}</p>
+        class="bg-bg_color w-[99/100]"
-              <p class="t-0 mb-2">City: {{ props.row.city }}</p>
+      >
-              <p class="t-0 mb-2">Address: {{ props.row.address }}</p>
+        <el-form-item prop="dateRange">
-              <p class="t-0 mb-2">Zip: {{ props.row.zip }}</p>
+          <el-date-picker
+            v-model="form.dateRange"
+            type="daterange"
+            range-separator="To"
+            start-placeholder="Start date"
+            end-placeholder="End date"
+            format="YYYY/MM/DD"
+            value-format="x"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button
+            type="primary"
+            :icon="useRenderIcon(Search)"
+            :loading="loading"
+            @click="onSearch({ type: 'hands' })"
+          >
+            搜索
+          </el-button>
+        </el-form-item>
+      </el-form>
+
+      <pure-table :data="handsData" :columns="columns">
+        <template #expand="{ row }">
+          <div class="m-4">
+            <p class="mb-2">State: {{ row.state }}</p>
+            <p class="mb-2">City: {{ row.city }}</p>
+            <p class="mb-2">Address: {{ row.address }}</p>
+            <p class="mb-4">Zip: {{ row.zip }}</p>
             <h3 class="mt-3 mb-3">Family</h3>
-              <el-table :data="props.row.family">
+            <pure-table :data="row.family" :columns="childColumns" border />
-                <el-table-column label="Name" prop="name" />
-                <el-table-column label="State" prop="state" />
-                <el-table-column label="City" prop="city" />
-                <el-table-column label="Address" prop="address" />
-                <el-table-column label="Zip" prop="zip" />
-              </el-table>
           </div>
         </template>
-        </el-table-column>
+      </pure-table>
-        <el-table-column label="Date" prop="date" />
-        <el-table-column label="Name" prop="name" />
-      </el-table>
     </el-tab-pane>
   </el-tabs>
 </template>
 
 <script setup lang="ts">
+import dayjs from 'dayjs'
+
 import { useRenderIcon } from '@/components/ReIcon/src/hooks'
 import Search from '@iconify-icons/ep/search'
 
 import { useRoute } from 'vue-router'
 import { ref, onMounted } from 'vue'
-import type { TabsPaneContext } from 'element-plus'
+import type { TabPaneName } from 'element-plus'
-import handsData from './gameData'
+import { handsData } from './data'
+
+import { getGameRecord, getGameHandsRecord } from '@/api/basic'
 
 defineOptions({
   // name 作为一种规范最好必须写上并且和路由的name保持一致
@@ -92,81 +115,153 @@ const route = useRoute()
 const id = route.query?.id ? route.query?.id : route.params?.id
 
 const activeName = ref('first')
+// const activeName = ref('second')
 
-const handleClick = (tab: TabsPaneContext, event: Event) => {
+const handleClick = (name: TabPaneName) => {
-  console.log(tab, event)
+  console.log(123, name)
+  const type = name === 'first' ? 'table' : 'hands'
+  onSearch({ type })
 }
 
 const tableRecordColumn: TableColumnList = [
   {
-    label: '时间',
+    label: '开始时间',
-    prop: 'date'
+    prop: 'start_date',
+    formatter: ({ start_date }) =>
+      dayjs(start_date * 1000).format('YYYY-MM-DD HH:MM:ss')
   },
   {
-    label: '级别/玩法',
+    label: '结束时间',
-    prop: 'club_name'
+    prop: 'end_date',
+    formatter: ({ end_date }) =>
+      dayjs(end_date * 1000).format('YYYY-MM-DD HH:MM:ss')
+  },
+  {
+    label: '级别',
+    prop: 'blind'
+  },
+  {
+    label: '玩法',
+    prop: 'game_type_name'
   },
   {
     label: '牌局名称',
-    prop: 'club_integral'
+    prop: 'table_name'
   },
   {
     label: '创建者',
-    prop: 'club_integral'
+    prop: 'creator'
   },
   {
     label: '牌局ID',
-    prop: 'club_integral'
+    prop: 'round_id'
   },
   {
     label: '战绩',
-    prop: 'club_integral'
+    prop: 'earnings'
   },
   {
     label: '服务费贡献',
-    prop: 'club_integral'
+    prop: 'service_fee'
   },
   {
     label: '保险贡献',
-    prop: 'club_integral'
+    prop: 'insurance'
   }
 ]
 
-const tableData = [
+const columns: TableColumnList = [
   {
-    club_name: 'Tom-club',
+    type: 'expand',
-    date: '2016-05-03',
+    slot: 'expand'
-    club_integral: '299'
   },
   {
-    club_name: 'Tom-club',
+    label: '日期',
-    date: '2016-05-03',
+    prop: 'date'
-    club_integral: '299'
   },
   {
-    club_name: 'Tom-club',
+    label: '姓名',
-    date: '2016-05-03',
+    prop: 'name'
-    club_integral: '299'
   }
 ]
 
-const form = {
+const childColumns: TableColumnList = [
+  {
+    label: 'Name',
+    prop: 'name'
+  },
+  {
+    label: 'State',
+    prop: 'state'
+  },
+  {
+    label: 'City',
+    prop: 'city'
+  },
+  {
+    label: 'Address',
+    prop: 'address'
+  },
+  {
+    label: 'Zip',
+    prop: 'zip'
+  }
+]
+
+const form = ref({
   dateRange: ''
-}
+})
+const pageData = ref([])
+const record_count = ref(0)
 const loading = ref(true)
 
-function onSearchUser() {
+const pageParams = ref({
-  console.log(form.dateRange)
+  page: 1, //页码
-  console.log(form.dateRange[0])
+  per_page: 20 // 每页条数
+})
+
+function onSearch(query) {
+  // type: 1: tabl-record , 2: hands
+  const { type = 'table' } = query
+  console.log(form.value.dateRange)
+  console.log(form.value.dateRange[0])
   loading.value = false
-  // getUserData({ date: form }).then(res => {
+  const start_time = form.value.dateRange[0]
-  //   historicalData.value = res.data
+  const end_time = form.value.dateRange[1]
-  //   loading.value = false
+  const query_params = {
-  // })
+    uid: 20453,
+    start_time,
+    end_time,
+    ...pageParams.value
+  }
+  console.log('query_params ==>', query_params)
+  console.log('pageParams ==>', pageParams.value)
+  if (type === 'table') {
+    searchTable(query_params)
+  } else if (type === 'hands') {
+    searchHands(query_params)
+  }
+}
+
+function searchTable(params) {
+  getGameRecord({ ...params }).then(res => {
+    pageData.value = res.data.list
+    record_count.value = res.data.count
+    loading.value = false
+  })
+}
+
+function searchHands(params) {
+  getGameHandsRecord({ ...params }).then(res => {
+    console.log('getGameHandsRecord:', res)
+    pageData.value = res.data.list
+    record_count.value = res.data.count
+    loading.value = false
+  })
 }
 
 onMounted(() => {
-  onSearchUser()
+  onSearch({ type: 'table' })
 })
 </script>
 

src/views/basic/queryUser/user/basicInfoHook.ts

@@ -0,0 +1,69 @@
+import { toRefs, reactive } from 'vue'
+/** 俱乐部信息-创建 表格column */
+export const created_club_columns: TableColumnList = [
+  { label: '俱乐部名称（创建）', prop: 'name' },
+  { label: '创建时间', prop: 'date' },
+  { label: '俱乐部分积分', prop: 'jifen' }
+]
+
+/** 俱乐部信息-加入 表格column */
+export const joined_club_columns: TableColumnList = [
+  { label: '俱乐部名称（创建）', prop: 'name' },
+  { label: '创建时间', prop: 'date' },
+  { label: '俱乐部分积分', prop: 'jifen' }
+]
+
+/** 基本信息 - 登录相关 */
+export const loginInfoMap = [
+  { label: '登录渠道', prop: 'channel' },
+  { label: '登录版本', prop: 'last_login_version' },
+  { label: '最近登录IP', prop: 'last_login_ip' },
+  { label: '最近登录IP位置', prop: 'last_login_country' },
+  { label: '最近登录时间', prop: 'enter_time' },
+  { label: '最近登录IP设备', prop: 'last_login_device' }
+]
+
+/** 基本信息 - 注册相关 */
+export const registerInfoMap = [
+  { label: '注册渠道', prop: 'register_channel' },
+  { label: '注册版本', prop: '' }, // 先空着
+  { label: '注册时间', prop: 'reg_time' },
+  { label: '注册IP', prop: 'reg_ip' },
+  { label: '注册设备', prop: '' } // 先空着
+]
+
+/** 数据信息 - 游戏维度 */
+export const gameMap = [
+  { label: '总玩牌手数', prop: 'totalhands' },
+  { label: '总玩牌局数', prop: 'play' },
+  { label: '入池率', prop: 'r_in' },
+  { label: '入池胜率', prop: 'r_win' },
+  { label: '翻牌前入池率', prop: 'r_fc' },
+  { label: '3bet率', prop: 'r_ds' },
+  { label: '激进度', prop: 'r_jin' },
+  { label: '摊牌度', prop: 'r_sd' },
+  { label: '百手盈利', prop: 'r_100hands' },
+  { label: '盈利', prop: 'totalwin' }
+]
+export function useBasic() {
+  const pageData = reactive({
+    base_info: {
+      diamond: '',
+      country: '',
+      user_phone: '',
+      user_email: ''
+    },
+    create_club_list: [],
+    game_info: {
+      omaha: {},
+      texas: {},
+      plo_five: {},
+      plo_six: {}
+    },
+    join_club_list: []
+  })
+
+  return {
+    ...toRefs(pageData)
+  }
+}

src/views/basic/queryUser/user/chatRecord.vue

@@ -22,7 +22,7 @@
         type="primary"
         :icon="useRenderIcon(Search)"
         :loading="loading"
-        @click="onSearchUser"
+        @click="onSearch"
       >
         搜索
       </el-button>
@@ -32,25 +32,23 @@
         type="primary"
         :icon="useRenderIcon(Search)"
         :loading="loading"
-        @click="onSearchUser"
+        @click="onSearch"
       >
         导出
       </el-button>
     </el-form-item>
   </el-form>
 
-  <el-table :data="tableData" stripe border style="width: 100%">
+  <pure-table :data="chatTableData" :columns="columns" border stripe />
-    <el-table-column prop="date" label="Date" width="180" />
-    <el-table-column prop="name" label="Name" width="180" />
-    <el-table-column prop="address" label="Address" />
-  </el-table>
 </template>
 
 <script setup lang="ts">
 import { useRenderIcon } from '@/components/ReIcon/src/hooks'
 import Search from '@iconify-icons/ep/search'
 import { useRoute } from 'vue-router'
-import { ref, onMounted } from 'vue'
+
+import { useChatLog } from './userHook'
+// import { chatTableData } from './data'
 
 defineOptions({
   // name 作为一种规范最好必须写上并且和路由的name保持一致
@@ -63,46 +61,7 @@ const route = useRoute()
 // const router = useRouter()
 const id = route.query?.id ? route.query?.id : route.params?.id
 
-// page detail data
+const { columns, form, loading, chatTableData, onSearch } = useChatLog()
-const form = {
-  dateRange: ''
-}
-const loading = ref(true)
-const tableData = [
-  {
-    date: '2016-05-03',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  },
-  {
-    date: '2016-05-02',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  },
-  {
-    date: '2016-05-04',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  },
-  {
-    date: '2016-05-01',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  }
-]
-
-function onSearchUser() {
-  console.log(form.dateRange)
-  console.log(form.dateRange[0])
-  loading.value = false
-  // getUserData({ date: form }).then(res => {
-  //   historicalData.value = res.data
-  //   loading.value = false
-  // })
-}
-onMounted(() => {
-  onSearchUser()
-})
 </script>
 
 <style scoped></style>

src/views/basic/queryUser/user/data.ts

@@ -1,4 +1,52 @@
-export default [
+export const loginTableData = [
+  {
+    login_time: '1680576415096',
+    channel: 'H5',
+    ip_address: 'No. 189, Grove St, Los Angeles',
+    login_ip: '192.168.0.1',
+    device_code: 'Huawei P10'
+  },
+  {
+    login_time: '1680576415096',
+    channel: 'H5',
+    ip_address: 'No. 189, Grove St, Los Angeles',
+    login_ip: '192.168.0.1',
+    device_code: 'Huawei P10'
+  },
+  {
+    login_time: '1680576415096',
+    channel: 'H5',
+    ip_address: 'No. 189, Grove St, Los Angeles',
+    login_ip: '192.168.0.1',
+    device_code: 'Huawei P10'
+  }
+]
+
+export const diamondTableData = [
+  {
+    date: '1680576415096',
+    type: '看剩余牌',
+    count: 33,
+    remains: '189'
+  },
+  {
+    date: '1680576415096',
+    type: '官方赠送',
+    count: 33,
+    remains: '189'
+  }
+]
+
+export const chatTableData = [
+  {
+    creator: '俱乐部名称',
+    table_name: 'asd ads table',
+    send_time: '1680576415096',
+    content: 'lorem as world'
+  }
+]
+
+export const handsData = [
   {
     date: '2016-05-03',
     name: 'Tom',

src/views/basic/queryUser/user/diamondRecord.vue

@@ -14,7 +14,7 @@
         start-placeholder="Start date"
         end-placeholder="End date"
         format="YYYY/MM/DD"
-        value-format="YYYY-MM-DD"
+        value-format="x"
       />
     </el-form-item>
     <el-form-item>
@@ -22,77 +22,34 @@
         type="primary"
         :icon="useRenderIcon(Search)"
         :loading="loading"
-        @click="onSearchUser"
+        @click="onSearch"
       >
         搜索
       </el-button>
     </el-form-item>
   </el-form>
-
+  <pure-table :data="diamondTableData" :columns="columns" border stripe />
-  <el-table :data="tableData" stripe border style="width: 100%">
-    <el-table-column prop="date" label="Date" width="180" />
-    <el-table-column prop="name" label="Name" width="180" />
-    <el-table-column prop="address" label="Address" />
-  </el-table>
 </template>
 
 <script setup lang="ts">
 import { useRenderIcon } from '@/components/ReIcon/src/hooks'
 import Search from '@iconify-icons/ep/search'
 import { useRoute } from 'vue-router'
-import { ref, onMounted } from 'vue'
+
+// import { diamondTableData } from './data'
+import { useDiamondLog } from './userHook'
 
 defineOptions({
   // name 作为一种规范最好必须写上并且和路由的name保持一致
   name: 'DiamondRecord'
 })
 
-const props = defineProps(['uid'])
-
 const route = useRoute()
 // const router = useRouter()
 const id = route.query?.id ? route.query?.id : route.params?.id
 
-// page detail data
+const props = defineProps(['uid'])
-const form = {
+const { columns, form, loading, diamondTableData, onSearch } = useDiamondLog()
-  dateRange: ''
-}
-const loading = ref(true)
-const tableData = [
-  {
-    date: '2016-05-03',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  },
-  {
-    date: '2016-05-02',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  },
-  {
-    date: '2016-05-04',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  },
-  {
-    date: '2016-05-01',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  }
-]
-
-function onSearchUser() {
-  console.log(form.dateRange)
-  console.log(form.dateRange[0])
-  loading.value = false
-  // getUserData({ date: form }).then(res => {
-  //   historicalData.value = res.data
-  //   loading.value = false
-  // })
-}
-onMounted(() => {
-  onSearchUser()
-})
 </script>
 
 <style scoped></style>

src/views/basic/queryUser/user/index.vue

@@ -1,7 +1,5 @@
 <template>
   <el-card>
-    <div>用户信息 列表页面</div>
-    <div>{{ id }} - 详情页内容在此（params传参）</div>
     <el-tabs v-model="activeName" type="border-card">
       <el-tab-pane
         v-for="(_, tab) in tabsMap"

src/views/basic/queryUser/user/loginRecord.vue

@@ -22,25 +22,22 @@
         type="primary"
         :icon="useRenderIcon(Search)"
         :loading="loading"
-        @click="onSearchUser"
+        @click="onSearch"
       >
         搜索
       </el-button>
     </el-form-item>
   </el-form>
-
+  <pure-table :data="loginTableData" :columns="columns" border stripe />
-  <el-table :data="tableData" stripe border style="width: 100%">
-    <el-table-column prop="date" label="Date" width="180" />
-    <el-table-column prop="name" label="Name" width="180" />
-    <el-table-column prop="address" label="Address" />
-  </el-table>
 </template>
 
 <script setup lang="ts">
 import { useRenderIcon } from '@/components/ReIcon/src/hooks'
 import Search from '@iconify-icons/ep/search'
 import { useRoute } from 'vue-router'
-import { ref, onMounted } from 'vue'
+
+// import { loginTableData } from './data'
+import { useLoginLog } from './userHook'
 
 defineOptions({
   // name 作为一种规范最好必须写上并且和路由的name保持一致
@@ -53,46 +50,7 @@ const route = useRoute()
 // const router = useRouter()
 const id = route.query?.id ? route.query?.id : route.params?.id
 
-// page detail data
+const { columns, form, loading, loginTableData, onSearch } = useLoginLog()
-const form = {
-  dateRange: ''
-}
-const loading = ref(true)
-const tableData = [
-  {
-    date: '2016-05-03',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  },
-  {
-    date: '2016-05-02',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  },
-  {
-    date: '2016-05-04',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  },
-  {
-    date: '2016-05-01',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles'
-  }
-]
-
-function onSearchUser() {
-  console.log(form.dateRange)
-  console.log(form.dateRange[0])
-  loading.value = false
-  // getUserData({ date: form }).then(res => {
-  //   historicalData.value = res.data
-  //   loading.value = false
-  // })
-}
-onMounted(() => {
-  onSearchUser()
-})
 </script>
 
 <style scoped></style>

src/views/basic/queryUser/user/userHook.ts

@@ -0,0 +1,184 @@
+import { ref, reactive, toRaw, onMounted } from 'vue'
+// import { type PaginationProps } from '@pureadmin/table'
+// import { useRoute } from 'vue-router'
+
+import {
+  // getGameRecord,
+  // getGameHandsRecord,
+  getDiamondLog,
+  getLoginLog,
+  getChatLog
+} from '@/api/basic'
+
+/** router query 参数 */
+// const route = useRoute()
+// const router = useRouter()
+// const id = route.query?.id ? route.query?.id : route.params?.id
+
+/** 筛选日期区间 */
+const form = reactive({
+  dateRange: ''
+})
+
+/** 分页信息 */
+const paginationParams = reactive({
+  per_page: 20,
+  page: 1,
+  total: 10
+})
+// const pagination = reactive<PaginationProps>({
+//   total: 0,
+//   per_page: 10,
+//   page: 1,
+//   background: true
+// })
+
+/** loading */
+const loading = ref(true)
+
+/** 游戏记录 */
+export function useGameLog() {
+  function onSearch() {}
+
+  return {
+    form,
+    paginationParams,
+    onSearch
+  }
+}
+
+/** 钻石记录 */
+export function useDiamondLog() {
+  const columns = [
+    { label: '类型', prop: 'source' },
+    { label: '日期', prop: 'ctime' },
+    { label: '数量', prop: 'amount' },
+    { label: '余额', prop: 'remain' }
+  ]
+
+  const diamondTableData = ref([])
+
+  function onSearch() {
+    /** 查询参数 */
+    const start_time = form.dateRange ? form?.dateRange[0] : undefined
+    const end_time = form.dateRange ? form?.dateRange[1] : undefined
+    const queryParams = {
+      uid: '20473',
+      start_time,
+      end_time,
+      ...toRaw(paginationParams)
+    }
+    console.log('queryParams:', queryParams)
+
+    getDiamondLog(queryParams).then(res => {
+      const { data } = res
+      console.log('getDiamondLog=>', res)
+      diamondTableData.value = data.list
+      paginationParams.total = data.count
+      loading.value = false
+    })
+  }
+
+  onMounted(() => {
+    onSearch()
+  })
+
+  return {
+    columns,
+    form,
+    loading,
+    paginationParams,
+    diamondTableData,
+    onSearch
+  }
+}
+
+/** 登录记录 */
+export function useLoginLog() {
+  const columns = [
+    { label: '登录时间', prop: 'utime' },
+    { label: '登录渠道', prop: 'channel' },
+    { label: '登录IP', prop: 'ip' },
+    { label: 'IP位置', prop: 'country' },
+    { label: '设备码', prop: 'device' }
+  ]
+
+  const loginTableData = ref([])
+
+  function onSearch() {
+    /** 查询参数 */
+    const start_time = form.dateRange ? form?.dateRange[0] : undefined
+    const end_time = form.dateRange ? form?.dateRange[1] : undefined
+    const queryParams = {
+      uid: '20095',
+      start_time,
+      end_time,
+      ...toRaw(paginationParams)
+    }
+    console.log('queryParams:', queryParams)
+
+    getLoginLog(queryParams).then(res => {
+      const { data } = res
+      console.log('getLoginLog=>', res)
+      loginTableData.value = data.list
+      paginationParams.total = data.count
+      loading.value = false
+    })
+  }
+
+  onMounted(() => {
+    onSearch()
+  })
+
+  return {
+    columns,
+    form,
+    loading,
+    loginTableData,
+    paginationParams,
+    onSearch
+  }
+}
+
+/** 聊天记录 */
+export function useChatLog() {
+  const columns = [
+    { label: '创建者', prop: 'creator' },
+    { label: '牌局名称', prop: 'table_name' },
+    { label: '发送时间', prop: 'send_time' },
+    { label: '内容', prop: 'content' }
+  ]
+
+  const chatTableData = ref([])
+
+  function onSearch() {
+    /** 查询参数 */
+    const start_time = form.dateRange ? form?.dateRange[0] : undefined
+    const end_time = form.dateRange ? form?.dateRange[1] : undefined
+    const queryParams = {
+      uid: '20475',
+      start_time,
+      end_time,
+      ...toRaw(paginationParams)
+    }
+    console.log('queryParams:', queryParams)
+
+    getChatLog(queryParams).then(res => {
+      console.log('getChatLog=>', res)
+      loading.value = false
+    })
+  }
+
+  onMounted(() => {
+    onSearch()
+  })
+
+  return {
+    columns,
+    form,
+    loading,
+    paginationParams,
+    chatTableData,
+    onSearch
+  }
+}

vite.config.ts

@@ -46,7 +46,7 @@ export default ({ command, mode }: ConfigEnv): UserConfigExport => {
       proxy: {
         '^/dev-api/.*': {
           // 这里填写后端地址
-          target: 'http://192.168.100.71:8000',
+          target: 'http://192.168.100.98:8000',
           changeOrigin: true,
           rewrite: path => path.replace(/^\/dev-api/, '')
         }