feat:卡密列表调整

This commit is contained in:
Ygb 2025-08-07 14:08:00 +08:00
parent 43c2467346
commit d10532006d
2 changed files with 547 additions and 509 deletions

View File

@ -4,14 +4,14 @@
<div class="search-area"> <div class="search-area">
<el-form :inline="true" :model="searchForm"> <el-form :inline="true" :model="searchForm">
<el-form-item label="卡密账号"> <el-form-item label="卡密账号">
<el-input v-model="searchForm.cardId" placeholder="请输入卡密账号" clearable /> <el-input v-model="searchForm.cardId" placeholder="请输入卡密账号" clearable/>
</el-form-item> </el-form-item>
<el-form-item label="卡密密码"> <el-form-item label="卡密密码">
<el-input v-model="searchForm.cardSecret" placeholder="请输入卡密密码" clearable /> <el-input v-model="searchForm.cardSecret" placeholder="请输入卡密密码" clearable/>
</el-form-item> </el-form-item>
<el-form-item label="有效期"> <el-form-item label="有效期">
<el-input-number v-model="searchForm.effectiveDays" placeholder="请输入有效期天数" :min="0" clearable /> <el-input-number v-model="searchForm.effectiveDays" placeholder="请输入有效期天数" :min="0" clearable/>
</el-form-item> </el-form-item>
<el-form-item label="激活时间"> <el-form-item label="激活时间">
<el-date-picker <el-date-picker
@ -37,13 +37,28 @@
</el-form-item> </el-form-item>
<el-form-item label="状态"> <el-form-item label="状态">
<el-select v-model="searchForm.status" placeholder="请选择状态" clearable style="min-width: 100px;"> <el-select v-model="searchForm.status" placeholder="请选择状态" clearable style="min-width: 100px;">
<el-option label="未激活" :value="0" /> <el-option label="未激活" :value="0"/>
<el-option label="未使用" :value="1" /> <el-option label="未使用" :value="1"/>
<el-option label="已使用" :value="2" /> <el-option label="已使用" :value="2"/>
<el-option label="已冻结" :value="3" /> <el-option label="已冻结" :value="3"/>
<el-option label="已过期" :value="4" /> <el-option label="已过期" :value="4"/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="卡密类型">
<el-select v-model="searchForm.cardType" placeholder="请选择卡密类型" clearable style="min-width: 100px;">
<el-option
label="使用核价凭证"
value="verifyPriceCredential"
/>
<el-option
label="使用克隆凭证"
value="cloneCredential"
/>
</el-select>
</el-form-item>
<el-form-item label="备注">
<el-input v-model="searchForm.memo" placeholder="请输入备注关键词" clearable/>
</el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="handleSearch">搜索</el-button> <el-button type="primary" @click="handleSearch">搜索</el-button>
<el-button @click="resetSearch">重置</el-button> <el-button @click="resetSearch">重置</el-button>
@ -67,9 +82,9 @@
style="width: 100%;" style="width: 100%;"
v-loading="loading" v-loading="loading"
> >
<el-table-column type="selection" align="center" width="55" /> <el-table-column type="selection" align="center" width="55"/>
<el-table-column prop="cardId" label="卡密账号" min-width="180" /> <el-table-column prop="cardId" label="卡密账号" min-width="180"/>
<el-table-column prop="cardSecret" label="卡密密码" min-width="180" /> <el-table-column prop="cardSecret" label="卡密密码" min-width="180"/>
<el-table-column prop="cardType" label="卡密类型" min-width="120"> <el-table-column prop="cardType" label="卡密类型" min-width="120">
<template #default="{ row }"> <template #default="{ row }">
{{ getCardTypeText(row.cardType) }} {{ getCardTypeText(row.cardType) }}
@ -110,7 +125,7 @@
{{ formatDateTime(row.useTime) }} {{ formatDateTime(row.useTime) }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="memo" label="备注" min-width="120" /> <el-table-column prop="note" label="备注" min-width="120"/>
<el-table-column label="操作" fixed="right" width="180"> <el-table-column label="操作" fixed="right" width="180">
<template #default="{ row }"> <template #default="{ row }">
<el-button <el-button
@ -118,20 +133,23 @@
type="danger" type="danger"
@click="handleDelete(row.id)" @click="handleDelete(row.id)"
:disabled="row.status === 3 || row.status === 4" :disabled="row.status === 3 || row.status === 4"
>删除</el-button> >删除
</el-button>
<el-button <el-button
v-if="row.status !== 3" v-if="row.status !== 3"
size="small" size="small"
type="warning" type="warning"
@click="handleDisable(row.id)" @click="handleDisable(row.id)"
:disabled="row.status === 4 || row.status === 0" :disabled="row.status === 4 || row.status === 0"
>停用</el-button> >停用
</el-button>
<el-button <el-button
v-else v-else
size="small" size="small"
type="success" type="success"
@click="handleEnable(row.id)" @click="handleEnable(row.id)"
>启用</el-button> >启用
</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -182,12 +200,24 @@
> >
<div class="card-params-content"> <div class="card-params-content">
<el-form :model="cardParams" label-width="80px"> <el-form :model="cardParams" label-width="80px">
<el-form-item label="卡密类型">
<el-select v-model="cardParams.cardType" placeholder="请选择卡密类型">
<el-option
label="使用核价凭证"
value="verifyPriceCredential"
/>
<el-option
label="使用克隆凭证"
value="cloneCredential"
/>
</el-select>
</el-form-item>
<el-form-item label="有效期"> <el-form-item label="有效期">
<el-input-number v-model="cardParams.effectiveDays" :min="1" :max="365" /> <el-input-number v-model="cardParams.effectiveDays" :min="1" :max="365"/>
<span class="unit-label"></span> <span class="unit-label"></span>
</el-form-item> </el-form-item>
<el-form-item label="备注"> <el-form-item label="备注">
<el-input v-model="cardParams.memo" type="textarea" :rows="3" placeholder="请输入备注信息" /> <el-input v-model="cardParams.memo" type="textarea" :rows="3" placeholder="请输入备注信息"/>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
@ -202,9 +232,9 @@
</template> </template>
<script setup> <script setup>
import { ref, reactive, onMounted } from 'vue' import {ref, reactive, onMounted} from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus' import {ElMessage, ElMessageBox} from 'element-plus'
import { cardsApi } from '@/api/modules/cards' import {cardsApi} from '@/api/modules/cards'
import RefreshButton from '@/components/RefreshButton.vue' import RefreshButton from '@/components/RefreshButton.vue'
import ActionBar from '@/components/ActionBar.vue' import ActionBar from '@/components/ActionBar.vue'
@ -220,7 +250,9 @@ const searchForm = reactive({
status: '', status: '',
effectiveDays: 0, effectiveDays: 0,
activateTimeRange: [], activateTimeRange: [],
expireTimeRange: [] expireTimeRange: [],
memo: '',
cardType: '',
}) })
// //
@ -237,6 +269,7 @@ const cardSecretValue = ref('')
// //
const cardParamsDialogVisible = ref(false) const cardParamsDialogVisible = ref(false)
const cardParams = reactive({ const cardParams = reactive({
cardType: 'verifyPriceCredential', //
effectiveDays: 30, effectiveDays: 30,
memo: '' memo: ''
}) })
@ -306,7 +339,9 @@ const fetchData = async () => {
cardId: searchForm.cardId || undefined, cardId: searchForm.cardId || undefined,
cardSecret: searchForm.cardSecret || undefined, cardSecret: searchForm.cardSecret || undefined,
status: searchForm.status !== null ? searchForm.status : undefined, status: searchForm.status !== null ? searchForm.status : undefined,
effectiveDays: searchForm.effectiveDays || undefined effectiveDays: searchForm.effectiveDays || undefined,
cardType: searchForm.cardType || undefined,
memo: searchForm.memo || undefined
} }
// //
@ -362,13 +397,14 @@ const handleGetCardSecret = () => {
const submitCardSecretRequest = async () => { const submitCardSecretRequest = async () => {
try { try {
const cardData = { const cardData = {
cardType: "verifyPriceCredential", cardType: cardParams.cardType,
effectiveDays: cardParams.effectiveDays, effectiveDays: cardParams.effectiveDays,
memo: cardParams.memo memo: cardParams.memo
}; };
console.log("cardData", cardData)
const res = await cardsApi.createCardSecret(cardData) const res = await cardsApi.createCardSecret(cardData)
// createCardSecret使res // createCardSecret使res
console.log("res",res) console.log("res", res)
if (res.code === 200) { if (res.code === 200) {
cardSecretValue.value = res.data cardSecretValue.value = res.data
@ -397,7 +433,7 @@ const handleCopyCardSecret = () => {
textarea.style.opacity = '0' textarea.style.opacity = '0'
document.body.appendChild(textarea) document.body.appendChild(textarea)
textarea.select() textarea.select()
console.log("textarea",textarea) console.log("textarea", textarea)
// //
const successful = document.execCommand('copy') const successful = document.execCommand('copy')
@ -434,6 +470,7 @@ const resetSearch = () => {
searchForm.effectiveDays = 0 searchForm.effectiveDays = 0
searchForm.activateTimeRange = [] searchForm.activateTimeRange = []
searchForm.expireTimeRange = [] searchForm.expireTimeRange = []
searchForm.memo = ''
pagination.current = 1 pagination.current = 1
fetchData() fetchData()
} }
@ -571,7 +608,8 @@ const getStatusText = (status) => {
// //
const getCardTypeText = (type) => { const getCardTypeText = (type) => {
const map = { const map = {
'verifyPriceCredential': '使用核价凭证' 'verifyPriceCredential': '使用核价凭证',
'cloneCredential': '使用克隆凭证'
} }
return map[type] || type return map[type] || type
} }

View File

@ -45,8 +45,8 @@ export default defineConfig({
server: { server: {
proxy: { proxy: {
'/api': { '/api': {
target: 'http://127.0.0.1:8089', // target: 'http://127.0.0.1:8089',
// target: 'http://146.56.227.42:8089', target: 'http://146.56.227.42:8089',
changeOrigin: true, changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/,''), rewrite: (path) => path.replace(/^\/api/,''),
// 如需处理WebSocket // 如需处理WebSocket