From cb3627ebcaea5aac95775a39ba76f2b607202b46 Mon Sep 17 00:00:00 2001
From: kaeery <3491123437@qq.com>
Date: Wed, 26 Feb 2025 15:59:43 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E6=8B=9B=E7=94=9F=E4=B8=BB=E6=8E=A7?=
 =?UTF-8?q?=E7=AB=AF=E3=80=91=20=E6=96=B0=E5=A2=9E#=20=E5=AF=B9=E6=8E=A5?=
 =?UTF-8?q?=E8=B4=A6=E5=8F=B7=E4=B8=AD=E5=BF=83=E6=8E=A5=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/account_center.ts          | 12 ++--
 src/enums/index.ts                 |  6 +-
 src/views/account_center/edit.vue  | 89 +++++++++++++++++++++++-------
 src/views/account_center/index.vue | 36 ++++++++----
 4 files changed, 105 insertions(+), 38 deletions(-)

diff --git a/src/api/account_center.ts b/src/api/account_center.ts
index b3992d2..92925ad 100644
--- a/src/api/account_center.ts
+++ b/src/api/account_center.ts
@@ -2,17 +2,21 @@ import request from '@/utils/request'
 
 // 添加账号
 export function accountAdd(params: Record<string, any>) {
-    return request.post({ url: 'api/client/add', params })
+    return request.post({ url: '/client/add', params })
 }
 // 编辑账号
 export function accountEdit(params: Record<string, any>) {
-    return request.post({ url: 'api/client/edit', params })
+    return request.post({ url: '/client/edit', params })
 }
 // 账号详情
 export function accountDetail(params: Record<string, any>) {
-    return request.post({ url: 'api/client/detail', params })
+    return request.get({ url: '/client/detail', params })
 }
 // 账号列表
 export function accountList(params: Record<string, any>) {
-    return request.post({ url: 'api/client/list', params })
+    return request.get({ url: '/client/list', params })
+}
+// 账号状态
+export function accountStatus(params: Record<string, any>) {
+    return request.post({ url: '/client/updateStatus', params })
 }
diff --git a/src/enums/index.ts b/src/enums/index.ts
index bc87d98..2671c95 100644
--- a/src/enums/index.ts
+++ b/src/enums/index.ts
@@ -1,5 +1,5 @@
 export enum StatusEnum {
-    Normal = 1,
-    Stop = 2,
-    Expired = 3
+    Normal = 0,
+    Stop = 1,
+    Expired = 2
 }
diff --git a/src/views/account_center/edit.vue b/src/views/account_center/edit.vue
index 40a1332..24fe61a 100644
--- a/src/views/account_center/edit.vue
+++ b/src/views/account_center/edit.vue
@@ -1,14 +1,20 @@
 <template>
     <div class="edit-popup">
-        <popup ref="popupRef" :title="popupTitle" :async="true" width="400px" @confirm="handleSubmit" @close="handleClose">
+        <popup ref="popupRef" :title="popupTitle" :async="true" width="480px" @confirm="handleSubmit" @close="handleClose">
             <el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules">
-                <el-form-item label="账号名称" prop="accountName">
-                    <el-input v-model="formData.accountName" placeholder="请输入账号名称" clearable :maxlength="20" show-word-limit />
+                <el-form-item label="账号名称" prop="account">
+                    <el-input v-model="formData.account" placeholder="请输入账号名称" clearable :maxlength="20" show-word-limit />
                 </el-form-item>
-                <el-form-item label="账号名额" prop="accountNumber">
-                    <el-input-number v-model="formData.accountNumber" :min="1" :max="9999" style="width: 100%" />
+                <el-form-item v-if="formData.id == ''" label="账号密码" prop="password">
+                    <el-input v-model="formData.password" placeholder="请输入账号密码" clearable :maxlength="20" show-word-limit />
                 </el-form-item>
-                <el-form-item label="有效期" prop="range">
+                <el-form-item label="客户名称" prop="clientName">
+                    <el-input v-model="formData.clientName" placeholder="请输入客户名称" clearable :maxlength="20" show-word-limit />
+                </el-form-item>
+                <el-form-item label="账号名额" prop="quota">
+                    <el-input-number v-model="formData.quota" :min="1" :max="99999" style="width: 100%" />
+                </el-form-item>
+                <el-form-item label="有效期" prop="range" class="range">
                     <daterange-picker
                         type="datetimerange"
                         format="YYYY-MM-DD HH:mm:ss"
@@ -19,9 +25,6 @@
                         v-model:endTime="formData.range.endTime"
                     />
                 </el-form-item>
-                <el-form-item label="账号状态" prop="status">
-                    <el-switch v-model="formData.status" :active-value="StatusEnum.Normal" :inactive-value="StatusEnum.Stop" />
-                </el-form-item>
             </el-form>
         </popup>
     </div>
@@ -31,7 +34,7 @@ import type { FormInstance } from 'element-plus'
 import Popup from '@/components/popup/index.vue'
 import { accountAdd, accountDetail, accountEdit } from '@/api/account_center'
 import feedback from '@/utils/feedback'
-import { StatusEnum } from '@/enums'
+import { omit } from 'lodash-es'
 
 const emit = defineEmits(['success', 'close'])
 
@@ -43,13 +46,14 @@ const popupTitle = computed(() => {
 })
 const formData = reactive({
     id: '',
-    accountName: '',
-    accountNumber: '',
+    account: '',
+    password: '',
+    clientName: '',
+    quota: 1,
     range: {
         startTime: '',
         endTime: ''
-    },
-    status: 1
+    }
 })
 const validaeRange = (rule: any, value: any, callback: any) => {
     if (value.startTime == '' || value.endTime == '') {
@@ -59,29 +63,44 @@ const validaeRange = (rule: any, value: any, callback: any) => {
     }
 }
 const formRules = {
-    accountName: [
+    account: [
         {
             required: true,
             message: '请输入账号名称',
             trigger: ['blur']
         }
     ],
-    accountNumber: [
+    password: [
+        {
+            required: true,
+            message: '请输入账号密码',
+            trigger: ['blur']
+        }
+    ],
+    clientName: [
+        {
+            required: true,
+            message: '请输入客户名称',
+            trigger: ['blur']
+        }
+    ],
+    quota: [
         {
             required: true,
             message: '请输入账号名额',
             trigger: ['blur']
         }
     ],
-    range: [{ validator: validaeRange, trigger: 'change' }],
-    status: { required: true, message: '请选择账号状态', trigger: 'change' }
+    range: [{ validator: validaeRange, trigger: 'change' }]
 }
 const shortcuts = [
     {
         text: '今天',
         value: () => {
-            const end = new Date()
             const start = new Date()
+            const end = new Date()
+            start.setHours(0, 0, 0, 0)
+            end.setHours(23, 59, 59, 999)
             return [start, end]
         }
     },
@@ -91,6 +110,8 @@ const shortcuts = [
             const start = new Date()
             const end = new Date()
             end.setDate(end.getDate() + 7)
+            start.setHours(0, 0, 0, 0)
+            end.setHours(23, 59, 59, 999)
             return [start, end]
         }
     },
@@ -100,6 +121,8 @@ const shortcuts = [
             const start = new Date()
             const end = new Date()
             end.setMonth(end.getMonth() + 1)
+            start.setHours(0, 0, 0, 0)
+            end.setHours(23, 59, 59, 999)
             return [start, end]
         }
     },
@@ -109,6 +132,8 @@ const shortcuts = [
             const start = new Date()
             const end = new Date()
             end.setMonth(end.getMonth() + 3)
+            start.setHours(0, 0, 0, 0)
+            end.setHours(23, 59, 59, 999)
             return [start, end]
         }
     },
@@ -118,6 +143,8 @@ const shortcuts = [
             const start = new Date()
             const end = new Date()
             end.setMonth(end.getMonth() + 6)
+            start.setHours(0, 0, 0, 0)
+            end.setHours(23, 59, 59, 999)
             return [start, end]
         }
     },
@@ -127,13 +154,21 @@ const shortcuts = [
             const start = new Date()
             const end = new Date()
             end.setFullYear(end.getFullYear() + 1)
+            start.setHours(0, 0, 0, 0)
+            end.setHours(23, 59, 59, 999)
             return [start, end]
         }
     }
 ]
 const handleSubmit = async () => {
     await formRef.value?.validate()
-    mode.value == 'edit' ? await accountEdit(formData) : await accountAdd(formData)
+    const { startTime, endTime } = formData.range
+    Object.assign(formData, {
+        startTime: startTime,
+        expirationTime: endTime
+    })
+    const newFormData = omit(formData, ['range'])
+    mode.value == 'edit' ? await accountEdit(newFormData) : await accountAdd(newFormData)
     feedback.msgSuccess('操作成功')
     popupRef.value?.close()
     emit('success')
@@ -150,6 +185,8 @@ const setFormData = (data: Record<any, any>) => {
             //@ts-ignore
             formData[key] = data[key]
         }
+        formData.range.startTime = data['startTime']
+        formData.range.endTime = data['expirationTime']
     }
 }
 
@@ -170,3 +207,15 @@ defineExpose({
     getDetail
 })
 </script>
+
+<style lang="scss" scoped>
+:deep(.range) {
+    .el-form-item__label {
+        &::before {
+            content: '* ';
+            margin-right: 2px;
+            color: #f5222d;
+        }
+    }
+}
+</style>
diff --git a/src/views/account_center/index.vue b/src/views/account_center/index.vue
index dc30bc4..2c2b9de 100644
--- a/src/views/account_center/index.vue
+++ b/src/views/account_center/index.vue
@@ -2,7 +2,7 @@
     <div class="post-lists">
         <el-card class="!border-none" shadow="never">
             <el-form ref="formRef" class="mb-[-16px]" :model="queryParams" :inline="true">
-                <el-form-item label="账号名称">
+                <el-form-item label="客户名称">
                     <el-input class="w-[280px]" v-model="queryParams.name" clearable placeholder="请输入" @keyup.enter="resetPage" />
                 </el-form-item>
                 <el-form-item label="账号状态">
@@ -28,22 +28,32 @@
                 </el-button>
             </div>
             <el-table class="mt-4" size="large" v-loading="pager.loading" :data="pager.lists">
-                <el-table-column label="账号名称" prop="accountName" min-width="100" />
-                <el-table-column label="账号名额" prop="accountNumber" min-width="100">
+                <el-table-column label="客户名称" prop="account" min-width="100" />
+                <el-table-column label="账号名额" prop="quota" min-width="100">
                     <template #default="{ row }">
-                        <span class="text-primary">{{ row.accountNumber }}</span>
+                        <span class="text-primary">{{ row.quota }}</span>
                     </template>
                 </el-table-column>
-                <el-table-column label="已使用" prop="useNumber" min-width="100" />
-                <el-table-column label="未使用" prop="unuseNumber" min-width="100" />
-                <el-table-column label="账号状态" prop="status" min-width="100">
+                <el-table-column label="已使用" prop="quantity" />
+                <el-table-column label="未使用" prop="">
+                    <template #default="{ row }">
+                        <span>{{ row.quota - row.quantity }}</span>
+                    </template>
+                </el-table-column>
+                <el-table-column label="账号状态" prop="status" width="180">
                     <template #default="{ row }">
                         <el-tag class="ml-2" :type="tagType(row.status)">
                             {{ parseStatusText(row.status) }}
                         </el-tag>
                     </template>
                 </el-table-column>
-                <el-table-column label="账号有效期" prop="expiresDate" min-width="100" />
+                <el-table-column label="账号有效期" prop="" width="250">
+                    <template #default="{ row }">
+                        <span>{{ formatDate(row.startTime, 'YYYY-MM-DD') }}</span>
+                        至
+                        <span>{{ formatDate(row.expirationTime, 'YYYY-MM-DD') }}</span>
+                    </template>
+                </el-table-column>
                 <el-table-column label="操作" width="180" fixed="right">
                     <template #default="{ row }">
                         <el-button type="primary" link @click="handleEdit(row)">编辑</el-button>
@@ -63,9 +73,10 @@
 <script lang="ts" setup name="post">
 import EditPopup from './edit.vue'
 import { usePaging } from '@/hooks/usePaging'
-import { accountList } from '@/api/account_center'
+import { accountList, accountStatus } from '@/api/account_center'
 import { StatusEnum } from '@/enums'
 import feedback from '@/utils/feedback'
+import dayjs from 'dayjs'
 
 const statusMap: Record<StatusEnum, string> = {
     [StatusEnum.Normal]: '启用',
@@ -105,11 +116,14 @@ const handleEdit = async (data: any) => {
 const handleChangeStatus = async row => {
     const { id, status } = row
     const msg = status == StatusEnum.Normal ? '停用' : '启用'
+    const statusVal = status == StatusEnum.Normal ? StatusEnum.Stop : StatusEnum.Normal
     await feedback.confirm(`确定要${msg}该账号？`)
-    // await postDelete({ id })
+    await accountStatus({ id, status: statusVal })
     feedback.msgSuccess(`${msg}成功`)
     getLists()
 }
-
+const formatDate = (value: string, format = 'YYYY-MM-DD HH:mm:ss') => {
+    return dayjs(value).format(format)
+}
 getLists()
 </script>