增加续杯激活
This commit is contained in:
parent
c6b97f79f2
commit
8ea225d819
@ -1 +0,0 @@
|
|||||||
Subproject commit e776179c72c44ecd4e6e197f0c88253e8ab71bae
|
|
||||||
106
src/api/cursorActivationCode.ts
Normal file
106
src/api/cursorActivationCode.ts
Normal file
@ -0,0 +1,106 @@
|
|||||||
|
// @ts-ignore request 封装是 JS 文件,项目未提供 TS 声明
|
||||||
|
import request from '@/utils/request';
|
||||||
|
|
||||||
|
const baseUrl = '/platform/cursor/activationcode';
|
||||||
|
|
||||||
|
export interface CursorActivationCodeQuery {
|
||||||
|
page?: number;
|
||||||
|
pageSize?: number;
|
||||||
|
keyword?: string;
|
||||||
|
status?: number | string;
|
||||||
|
type?: number | string;
|
||||||
|
bindStatus?: number | string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface CursorActivationCodePayload {
|
||||||
|
id?: number | string;
|
||||||
|
code?: string;
|
||||||
|
type?: number;
|
||||||
|
status?: number;
|
||||||
|
durationDays?: number;
|
||||||
|
bindAccount?: string;
|
||||||
|
bindDeviceId?: number | string;
|
||||||
|
ownerUserId?: number | string;
|
||||||
|
ownerUserName?: string;
|
||||||
|
activatedAt?: string;
|
||||||
|
expiredAt?: string;
|
||||||
|
remark?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface GenerateActivationCodePayload {
|
||||||
|
count: number;
|
||||||
|
type?: number;
|
||||||
|
durationDays?: number;
|
||||||
|
ownerUserId?: number | string;
|
||||||
|
ownerUserName?: string;
|
||||||
|
remark?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getCursorActivationCodeList(params: CursorActivationCodeQuery) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/list`,
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getCursorActivationCodeDetail(id: number | string) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/detail/${id}`,
|
||||||
|
method: 'get',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function addCursorActivationCode(data: CursorActivationCodePayload) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/add`,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function updateCursorActivationCode(data: CursorActivationCodePayload) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/update`,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function deleteCursorActivationCode(id: number | string) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/delete/${id}`,
|
||||||
|
method: 'post',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function generateCursorActivationCode(data: GenerateActivationCodePayload) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/generate`,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function enableCursorActivationCode(id: number | string) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/enable/${id}`,
|
||||||
|
method: 'post',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function disableCursorActivationCode(id: number | string) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/disable/${id}`,
|
||||||
|
method: 'post',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function exportCursorActivationCode(params: CursorActivationCodeQuery) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/export`,
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
responseType: 'blob',
|
||||||
|
});
|
||||||
|
}
|
||||||
90
src/api/cursorEquipment.ts
Normal file
90
src/api/cursorEquipment.ts
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
// @ts-ignore request 封装是 JS 文件,项目未提供 TS 声明
|
||||||
|
import request from '@/utils/request';
|
||||||
|
|
||||||
|
const baseUrl = '/platform/cursor/equipment';
|
||||||
|
|
||||||
|
export interface CursorEquipmentQuery {
|
||||||
|
page?: number;
|
||||||
|
pageSize?: number;
|
||||||
|
keyword?: string;
|
||||||
|
status?: number | string;
|
||||||
|
system?: string;
|
||||||
|
os?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface CursorEquipmentPayload {
|
||||||
|
id?: number;
|
||||||
|
deviceInfo?: string;
|
||||||
|
machineCode?: string;
|
||||||
|
status?: number;
|
||||||
|
system?: string;
|
||||||
|
version?: string;
|
||||||
|
bindAccount?: string;
|
||||||
|
ownerUserId?: number;
|
||||||
|
ownerUserName?: string;
|
||||||
|
activationTime?: string;
|
||||||
|
expireTime?: string;
|
||||||
|
remark?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getCursorEquipmentList(params: CursorEquipmentQuery) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/list`,
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getCursorEquipmentDetail(id: number | string) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/detail/${id}`,
|
||||||
|
method: 'get',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function addCursorEquipment(data: CursorEquipmentPayload) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/add`,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function updateCursorEquipment(data: CursorEquipmentPayload) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/update`,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function deleteCursorEquipment(id: number | string) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/delete/${id}`,
|
||||||
|
method: 'post',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function activateCursorEquipment(data: { id: number | string }) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/activate`,
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getCursorEquipmentActivationRecords(params: Record<string, any>) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/activationRecords`,
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getCursorEquipmentExtractRecords(params: Record<string, any>) {
|
||||||
|
return request({
|
||||||
|
url: `${baseUrl}/extractRecords`,
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
@ -615,11 +615,20 @@ function copyCardInfo(row) {
|
|||||||
const CURSOR_PRO_LIMIT_TEXT = 'Get Cursor Pro for more Agent usage, unlimited Tab, and more.';
|
const CURSOR_PRO_LIMIT_TEXT = 'Get Cursor Pro for more Agent usage, unlimited Tab, and more.';
|
||||||
|
|
||||||
function formatCursorProbeDialogText(d) {
|
function formatCursorProbeDialogText(d) {
|
||||||
|
// 1. 优先以新版后端的 ok 字段(也就是底层探针的交叉判定结论)为核心准则
|
||||||
|
if (d && typeof d.ok === 'boolean') {
|
||||||
|
return d.ok ? '该TOKEN可用' : `该TOKEN已用完 (${d.detail || '额度枯竭'})`;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 2. 兼容旧数据的兜底检测
|
||||||
|
const CURSOR_PRO_LIMIT_TEXT = 'Get Cursor Pro for more Agent usage, unlimited Tab, and more.';
|
||||||
const detail = String(d?.detail || '');
|
const detail = String(d?.detail || '');
|
||||||
const rawPreview = String(d?.rawPreview || '');
|
const rawPreview = String(d?.rawPreview || '');
|
||||||
|
|
||||||
if (detail.includes(CURSOR_PRO_LIMIT_TEXT) || rawPreview.includes(CURSOR_PRO_LIMIT_TEXT)) {
|
if (detail.includes(CURSOR_PRO_LIMIT_TEXT) || rawPreview.includes(CURSOR_PRO_LIMIT_TEXT)) {
|
||||||
return '该TOKEN已用完';
|
return '该TOKEN已用完';
|
||||||
}
|
}
|
||||||
|
|
||||||
return '该TOKEN可用';
|
return '该TOKEN可用';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
959
src/views/cursor/activationcode/index.vue
Normal file
959
src/views/cursor/activationcode/index.vue
Normal file
@ -0,0 +1,959 @@
|
|||||||
|
<script lang="ts" setup>
|
||||||
|
import { computed, onMounted, onUnmounted, reactive, ref, watch } from 'vue';
|
||||||
|
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus';
|
||||||
|
import {
|
||||||
|
addCursorActivationCode,
|
||||||
|
deleteCursorActivationCode,
|
||||||
|
disableCursorActivationCode,
|
||||||
|
enableCursorActivationCode,
|
||||||
|
exportCursorActivationCode,
|
||||||
|
generateCursorActivationCode,
|
||||||
|
getCursorActivationCodeDetail,
|
||||||
|
getCursorActivationCodeList,
|
||||||
|
updateCursorActivationCode,
|
||||||
|
} from '../../../api/cursorActivationCode';
|
||||||
|
|
||||||
|
type ActivationCodeRow = Record<string, any>;
|
||||||
|
|
||||||
|
const loading = ref(false);
|
||||||
|
const actionLoading = ref(false);
|
||||||
|
const editVisible = ref(false);
|
||||||
|
const generateVisible = ref(false);
|
||||||
|
const detailVisible = ref(false);
|
||||||
|
const isMobile = ref(false);
|
||||||
|
const currentRow = ref<ActivationCodeRow | null>(null);
|
||||||
|
const selectedRows = ref<ActivationCodeRow[]>([]);
|
||||||
|
const tableData = ref<ActivationCodeRow[]>([]);
|
||||||
|
const total = ref(0);
|
||||||
|
const formRef = ref<FormInstance>();
|
||||||
|
const generateFormRef = ref<FormInstance>();
|
||||||
|
|
||||||
|
const query = reactive({
|
||||||
|
keyword: '',
|
||||||
|
status: '',
|
||||||
|
type: '',
|
||||||
|
bindStatus: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
const pagination = reactive({
|
||||||
|
page: 1,
|
||||||
|
pageSize: 20,
|
||||||
|
});
|
||||||
|
|
||||||
|
const form = reactive({
|
||||||
|
id: '',
|
||||||
|
code: '',
|
||||||
|
type: 30,
|
||||||
|
status: 0,
|
||||||
|
durationDays: 30,
|
||||||
|
bindAccount: '',
|
||||||
|
bindDeviceId: '',
|
||||||
|
ownerUserId: '',
|
||||||
|
ownerUserName: '',
|
||||||
|
activatedAt: '',
|
||||||
|
expiredAt: '',
|
||||||
|
remark: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
const generateForm = reactive({
|
||||||
|
count: 10,
|
||||||
|
type: 30,
|
||||||
|
durationDays: 30,
|
||||||
|
ownerUserId: '',
|
||||||
|
ownerUserName: '',
|
||||||
|
remark: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
const statusOptions = [
|
||||||
|
{ label: '未使用', value: 0 },
|
||||||
|
{ label: '已使用', value: 1 },
|
||||||
|
{ label: '已过期', value: 2 },
|
||||||
|
{ label: '已禁用', value: 3 },
|
||||||
|
];
|
||||||
|
|
||||||
|
const typeOptions = [
|
||||||
|
{ label: '天卡', value: 1, days: 1 },
|
||||||
|
{ label: '周卡', value: 7, days: 7 },
|
||||||
|
{ label: '月卡', value: 30, days: 30 },
|
||||||
|
{ label: '季卡', value: 90, days: 90 },
|
||||||
|
{ label: '年卡', value: 365, days: 365 },
|
||||||
|
{ label: '自定义', value: 0, days: 0 },
|
||||||
|
];
|
||||||
|
|
||||||
|
const bindStatusOptions = [
|
||||||
|
{ label: '未绑定', value: 0 },
|
||||||
|
{ label: '已绑定', value: 1 },
|
||||||
|
];
|
||||||
|
|
||||||
|
const statusMap: Record<string, { label: string; type: string }> = {
|
||||||
|
'0': { label: '未使用', type: 'info' },
|
||||||
|
'1': { label: '已使用', type: 'success' },
|
||||||
|
'2': { label: '已过期', type: 'warning' },
|
||||||
|
'3': { label: '已禁用', type: 'danger' },
|
||||||
|
};
|
||||||
|
|
||||||
|
const rules: FormRules = {
|
||||||
|
code: [{ required: true, message: '请输入激活码', trigger: 'blur' }],
|
||||||
|
type: [{ required: true, message: '请选择卡密类型', trigger: 'change' }],
|
||||||
|
durationDays: [{ required: true, message: '请输入有效天数', trigger: 'blur' }],
|
||||||
|
status: [{ required: true, message: '请选择状态', trigger: 'change' }],
|
||||||
|
};
|
||||||
|
|
||||||
|
const generateRules: FormRules = {
|
||||||
|
count: [{ required: true, message: '请输入生成数量', trigger: 'blur' }],
|
||||||
|
type: [{ required: true, message: '请选择卡密类型', trigger: 'change' }],
|
||||||
|
durationDays: [{ required: true, message: '请输入有效天数', trigger: 'blur' }],
|
||||||
|
};
|
||||||
|
|
||||||
|
const summary = computed(() => {
|
||||||
|
const unused = tableData.value.filter((item) => Number(item.status) === 0).length;
|
||||||
|
const used = tableData.value.filter((item) => Number(item.status) === 1).length;
|
||||||
|
const expired = tableData.value.filter((item) => Number(item.status) === 2).length;
|
||||||
|
const disabled = tableData.value.filter((item) => Number(item.status) === 3).length;
|
||||||
|
|
||||||
|
return [
|
||||||
|
{ label: '当前页激活码', value: tableData.value.length, type: 'primary' },
|
||||||
|
{ label: '未使用', value: unused, type: 'info' },
|
||||||
|
{ label: '已使用', value: used, type: 'success' },
|
||||||
|
{ label: '过期/禁用', value: expired + disabled, type: 'danger' },
|
||||||
|
];
|
||||||
|
});
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => [query.keyword, query.status, query.type, query.bindStatus],
|
||||||
|
() => {
|
||||||
|
pagination.page = 1;
|
||||||
|
fetchList();
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => [pagination.page, pagination.pageSize],
|
||||||
|
() => {
|
||||||
|
fetchList();
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
function pick(raw: any, ...keys: string[]) {
|
||||||
|
for (const key of keys) {
|
||||||
|
if (raw?.[key] !== undefined && raw?.[key] !== null) return raw[key];
|
||||||
|
}
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatTime(value: any) {
|
||||||
|
if (!value) return '';
|
||||||
|
const d = new Date(value);
|
||||||
|
if (Number.isNaN(d.getTime())) return String(value);
|
||||||
|
const p = (v: number) => String(v).padStart(2, '0');
|
||||||
|
return `${d.getFullYear()}-${p(d.getMonth() + 1)}-${p(d.getDate())} ${p(d.getHours())}:${p(d.getMinutes())}:${p(d.getSeconds())}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeRow(raw: any): ActivationCodeRow {
|
||||||
|
const status = Number(pick(raw, 'status', 'Status') || 0);
|
||||||
|
const type = Number(pick(raw, 'type', 'Type', 'card_type', 'cardType') || 0);
|
||||||
|
const bindAccount = pick(raw, 'bind_account', 'bindAccount', 'BindAccount', 'account', 'Account', 'email', 'Email');
|
||||||
|
const bindDeviceId = pick(raw, 'bind_device_id', 'bindDeviceId', 'BindDeviceID', 'device_id', 'deviceId');
|
||||||
|
|
||||||
|
return {
|
||||||
|
id: pick(raw, 'id', 'ID', 'Id'),
|
||||||
|
code: pick(raw, 'code', 'Code', 'activation_code', 'activationCode', 'card_no', 'cardNo'),
|
||||||
|
type,
|
||||||
|
typeName: typeLabel(type),
|
||||||
|
status,
|
||||||
|
durationDays: Number(pick(raw, 'duration_days', 'durationDays', 'DurationDays', 'days', 'Days') || 0),
|
||||||
|
bindAccount,
|
||||||
|
bindDeviceId,
|
||||||
|
bindStatus: bindAccount || bindDeviceId ? 1 : 0,
|
||||||
|
deviceInfo: pick(raw, 'device_info', 'deviceInfo', 'DeviceInfo'),
|
||||||
|
machineCode: pick(raw, 'machine_code', 'machineCode', 'MachineCode'),
|
||||||
|
ownerUserId: pick(raw, 'owner_user_id', 'ownerUserId', 'OwnerUserID'),
|
||||||
|
ownerUserName: pick(raw, 'owner_user_name', 'ownerUserName', 'OwnerUserName', 'owner', 'Owner', 'user_name', 'userName'),
|
||||||
|
activatedAt: formatTime(pick(raw, 'activated_at', 'activatedAt', 'activation_time', 'activationTime')),
|
||||||
|
expiredAt: formatTime(pick(raw, 'expired_at', 'expiredAt', 'expire_time', 'expireTime')),
|
||||||
|
createdAt: formatTime(pick(raw, 'created_at', 'createdAt', 'create_time', 'createTime', 'CreatedAt')),
|
||||||
|
updatedAt: formatTime(pick(raw, 'updated_at', 'updatedAt', 'update_time', 'updateTime', 'UpdatedAt')),
|
||||||
|
remark: pick(raw, 'remark', 'Remark'),
|
||||||
|
raw,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function statusLabel(status: string | number) {
|
||||||
|
const key = String(status ?? '');
|
||||||
|
return statusMap[key]?.label || key || '-';
|
||||||
|
}
|
||||||
|
|
||||||
|
function statusTagType(status: string | number) {
|
||||||
|
return statusMap[String(status ?? '')]?.type || 'info';
|
||||||
|
}
|
||||||
|
|
||||||
|
function typeLabel(type: string | number) {
|
||||||
|
const item = typeOptions.find((option) => Number(option.value) === Number(type));
|
||||||
|
return item?.label || (type ? `${type}天` : '自定义');
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetQuery() {
|
||||||
|
query.keyword = '';
|
||||||
|
query.status = '';
|
||||||
|
query.type = '';
|
||||||
|
query.bindStatus = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetForm() {
|
||||||
|
form.id = '';
|
||||||
|
form.code = '';
|
||||||
|
form.type = 30;
|
||||||
|
form.status = 0;
|
||||||
|
form.durationDays = 30;
|
||||||
|
form.bindAccount = '';
|
||||||
|
form.bindDeviceId = '';
|
||||||
|
form.ownerUserId = '';
|
||||||
|
form.ownerUserName = '';
|
||||||
|
form.activatedAt = '';
|
||||||
|
form.expiredAt = '';
|
||||||
|
form.remark = '';
|
||||||
|
formRef.value?.clearValidate();
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetGenerateForm() {
|
||||||
|
generateForm.count = 10;
|
||||||
|
generateForm.type = 30;
|
||||||
|
generateForm.durationDays = 30;
|
||||||
|
generateForm.ownerUserId = '';
|
||||||
|
generateForm.ownerUserName = '';
|
||||||
|
generateForm.remark = '';
|
||||||
|
generateFormRef.value?.clearValidate();
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSelectionChange(rows: ActivationCodeRow[]) {
|
||||||
|
selectedRows.value = rows;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleTypeChange(type: number) {
|
||||||
|
const item = typeOptions.find((option) => Number(option.value) === Number(type));
|
||||||
|
if (item && item.days > 0) form.durationDays = item.days;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleGenerateTypeChange(type: number) {
|
||||||
|
const item = typeOptions.find((option) => Number(option.value) === Number(type));
|
||||||
|
if (item && item.days > 0) generateForm.durationDays = item.days;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function fetchList() {
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
const res = await getCursorActivationCodeList({
|
||||||
|
page: pagination.page,
|
||||||
|
pageSize: pagination.pageSize,
|
||||||
|
keyword: query.keyword || undefined,
|
||||||
|
status: query.status === '' ? undefined : query.status,
|
||||||
|
type: query.type === '' ? undefined : query.type,
|
||||||
|
bindStatus: query.bindStatus === '' ? undefined : query.bindStatus,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (res?.code !== 200) {
|
||||||
|
ElMessage.error(res?.msg || '获取激活码列表失败');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const list = Array.isArray(res?.data?.list) ? res.data.list : Array.isArray(res?.data) ? res.data : [];
|
||||||
|
tableData.value = list.map(normalizeRow);
|
||||||
|
total.value = Number(res?.data?.total || list.length || 0);
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function openAdd() {
|
||||||
|
currentRow.value = null;
|
||||||
|
resetForm();
|
||||||
|
editVisible.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function openEdit(row: ActivationCodeRow) {
|
||||||
|
currentRow.value = row;
|
||||||
|
resetForm();
|
||||||
|
form.id = String(row.id || '');
|
||||||
|
form.code = row.code || '';
|
||||||
|
form.type = Number(row.type || 0);
|
||||||
|
form.status = Number(row.status || 0);
|
||||||
|
form.durationDays = Number(row.durationDays || 0);
|
||||||
|
form.bindAccount = row.bindAccount || '';
|
||||||
|
form.bindDeviceId = row.bindDeviceId ? String(row.bindDeviceId) : '';
|
||||||
|
form.ownerUserId = row.ownerUserId ? String(row.ownerUserId) : '';
|
||||||
|
form.ownerUserName = row.ownerUserName || '';
|
||||||
|
form.activatedAt = row.activatedAt || '';
|
||||||
|
form.expiredAt = row.expiredAt || '';
|
||||||
|
form.remark = row.remark || '';
|
||||||
|
editVisible.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function openGenerate() {
|
||||||
|
resetGenerateForm();
|
||||||
|
generateVisible.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function openDetail(row: ActivationCodeRow) {
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
const res = await getCursorActivationCodeDetail(row.id);
|
||||||
|
if (res?.code === 200) {
|
||||||
|
currentRow.value = normalizeRow(res.data || row.raw || row);
|
||||||
|
} else {
|
||||||
|
currentRow.value = row;
|
||||||
|
ElMessage.warning(res?.msg || '详情接口异常,已展示列表数据');
|
||||||
|
}
|
||||||
|
detailVisible.value = true;
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleSave() {
|
||||||
|
await formRef.value?.validate();
|
||||||
|
|
||||||
|
actionLoading.value = true;
|
||||||
|
try {
|
||||||
|
const data = {
|
||||||
|
id: form.id || undefined,
|
||||||
|
code: form.code,
|
||||||
|
type: Number(form.type),
|
||||||
|
status: Number(form.status),
|
||||||
|
durationDays: Number(form.durationDays || 0),
|
||||||
|
bindAccount: form.bindAccount || undefined,
|
||||||
|
bindDeviceId: form.bindDeviceId || undefined,
|
||||||
|
ownerUserId: form.ownerUserId || undefined,
|
||||||
|
ownerUserName: form.ownerUserName || undefined,
|
||||||
|
activatedAt: form.activatedAt || undefined,
|
||||||
|
expiredAt: form.expiredAt || undefined,
|
||||||
|
remark: form.remark || undefined,
|
||||||
|
};
|
||||||
|
|
||||||
|
const api = form.id ? updateCursorActivationCode : addCursorActivationCode;
|
||||||
|
const res = await api(data);
|
||||||
|
|
||||||
|
if (res?.code !== 200) {
|
||||||
|
ElMessage.error(res?.msg || '保存失败');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ElMessage.success(form.id ? '激活码已更新' : '激活码已新增');
|
||||||
|
editVisible.value = false;
|
||||||
|
await fetchList();
|
||||||
|
} finally {
|
||||||
|
actionLoading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleGenerate() {
|
||||||
|
await generateFormRef.value?.validate();
|
||||||
|
|
||||||
|
actionLoading.value = true;
|
||||||
|
try {
|
||||||
|
const res = await generateCursorActivationCode({
|
||||||
|
count: Number(generateForm.count || 1),
|
||||||
|
type: Number(generateForm.type),
|
||||||
|
durationDays: Number(generateForm.durationDays || 0),
|
||||||
|
ownerUserId: generateForm.ownerUserId || undefined,
|
||||||
|
ownerUserName: generateForm.ownerUserName || undefined,
|
||||||
|
remark: generateForm.remark || undefined,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (res?.code !== 200) {
|
||||||
|
ElMessage.error(res?.msg || '生成失败');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ElMessage.success('激活码已生成');
|
||||||
|
generateVisible.value = false;
|
||||||
|
await fetchList();
|
||||||
|
} finally {
|
||||||
|
actionLoading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleDelete(row: ActivationCodeRow) {
|
||||||
|
try {
|
||||||
|
await ElMessageBox.confirm(`确认删除激活码「${row.code || row.id}」?`, '删除激活码', {
|
||||||
|
type: 'warning',
|
||||||
|
confirmButtonText: '确认删除',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
});
|
||||||
|
} catch {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
const res = await deleteCursorActivationCode(row.id);
|
||||||
|
if (res?.code !== 200) {
|
||||||
|
ElMessage.error(res?.msg || '删除失败');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ElMessage.success('激活码已删除');
|
||||||
|
await fetchList();
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleBatchDelete() {
|
||||||
|
if (!selectedRows.value.length) {
|
||||||
|
ElMessage.warning('请选择需要删除的激活码');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
await ElMessageBox.confirm(`确认删除选中的 ${selectedRows.value.length} 个激活码?`, '批量删除', {
|
||||||
|
type: 'warning',
|
||||||
|
confirmButtonText: '确认删除',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
});
|
||||||
|
} catch {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
for (const row of selectedRows.value) {
|
||||||
|
const res = await deleteCursorActivationCode(row.id);
|
||||||
|
if (res?.code !== 200) {
|
||||||
|
ElMessage.error(res?.msg || `删除「${row.code || row.id}」失败`);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ElMessage.success('选中激活码已删除');
|
||||||
|
selectedRows.value = [];
|
||||||
|
await fetchList();
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleToggleStatus(row: ActivationCodeRow) {
|
||||||
|
const isDisabled = Number(row.status) === 3;
|
||||||
|
const title = isDisabled ? '启用激活码' : '禁用激活码';
|
||||||
|
const text = isDisabled ? '确认启用该激活码?' : '确认禁用该激活码?';
|
||||||
|
|
||||||
|
try {
|
||||||
|
await ElMessageBox.confirm(text, title, {
|
||||||
|
type: 'info',
|
||||||
|
confirmButtonText: isDisabled ? '确认启用' : '确认禁用',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
});
|
||||||
|
} catch {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
const api = isDisabled ? enableCursorActivationCode : disableCursorActivationCode;
|
||||||
|
const res = await api(row.id);
|
||||||
|
|
||||||
|
if (res?.code !== 200) {
|
||||||
|
ElMessage.error(res?.msg || '操作失败');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ElMessage.success(isDisabled ? '激活码已启用' : '激活码已禁用');
|
||||||
|
await fetchList();
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyCode(code: unknown) {
|
||||||
|
const text = String(code || '').trim();
|
||||||
|
if (!text) {
|
||||||
|
ElMessage.warning('暂无激活码可复制');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
navigator.clipboard.writeText(text).then(() => {
|
||||||
|
ElMessage.success('激活码已复制');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleExport() {
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
const res = await exportCursorActivationCode({
|
||||||
|
keyword: query.keyword || undefined,
|
||||||
|
status: query.status === '' ? undefined : query.status,
|
||||||
|
type: query.type === '' ? undefined : query.type,
|
||||||
|
bindStatus: query.bindStatus === '' ? undefined : query.bindStatus,
|
||||||
|
});
|
||||||
|
|
||||||
|
const blob = res instanceof Blob ? res : res?.data instanceof Blob ? res.data : null;
|
||||||
|
if (!blob) {
|
||||||
|
ElMessage.success('导出请求已提交');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const url = window.URL.createObjectURL(blob);
|
||||||
|
const link = document.createElement('a');
|
||||||
|
link.href = url;
|
||||||
|
link.download = `cursor-activation-code-${Date.now()}.xlsx`;
|
||||||
|
link.click();
|
||||||
|
window.URL.revokeObjectURL(url);
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateDeviceType() {
|
||||||
|
isMobile.value = window.innerWidth <= 768;
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
updateDeviceType();
|
||||||
|
window.addEventListener('resize', updateDeviceType);
|
||||||
|
fetchList();
|
||||||
|
});
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
window.removeEventListener('resize', updateDeviceType);
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="cursor-activation-code-page">
|
||||||
|
<el-card shadow="never">
|
||||||
|
<template #header>
|
||||||
|
<div class="card-header">
|
||||||
|
<span>激活码管理(Cursor)</span>
|
||||||
|
<div class="header-actions">
|
||||||
|
<el-button type="success" @click="openGenerate">批量生成</el-button>
|
||||||
|
<el-button type="primary" @click="openAdd">新增激活码</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<div class="summary-grid">
|
||||||
|
<div v-for="item in summary" :key="item.label" class="summary-card">
|
||||||
|
<div class="summary-label">{{ item.label }}</div>
|
||||||
|
<div class="summary-value" :class="`is-${item.type}`">{{ item.value }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="toolbar">
|
||||||
|
<div class="toolbar-left">
|
||||||
|
<el-input v-model="query.keyword" placeholder="搜索激活码 / 账号 / 设备 / 归属用户" clearable class="w-320" />
|
||||||
|
<el-select v-model="query.status" placeholder="使用状态" clearable class="w-140">
|
||||||
|
<el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
<el-select v-model="query.type" placeholder="卡密类型" clearable class="w-140">
|
||||||
|
<el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
<el-select v-model="query.bindStatus" placeholder="绑定状态" clearable class="w-140">
|
||||||
|
<el-option v-for="item in bindStatusOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
<el-button @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="toolbar-right">
|
||||||
|
<el-button :disabled="!selectedRows.length" type="danger" plain @click="handleBatchDelete">批量删除</el-button>
|
||||||
|
<el-button @click="handleExport">导出</el-button>
|
||||||
|
<el-button :loading="loading" @click="fetchList">刷新</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="table-scroll">
|
||||||
|
<el-table
|
||||||
|
v-loading="loading"
|
||||||
|
class="activation-code-table"
|
||||||
|
:data="tableData"
|
||||||
|
border
|
||||||
|
stripe
|
||||||
|
style="width: 100%"
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
|
>
|
||||||
|
<el-table-column type="selection" width="52" />
|
||||||
|
<el-table-column prop="id" label="ID" width="80" />
|
||||||
|
<el-table-column label="激活码" min-width="260" show-overflow-tooltip>
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div class="code-cell">
|
||||||
|
<span class="code-text">{{ row.code || '-' }}</span>
|
||||||
|
<el-button v-if="row.code" link type="primary" @click="copyCode(row.code)">复制</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="类型" width="100" align="center">
|
||||||
|
<template #default="{ row }">{{ row.typeName || typeLabel(row.type) }}</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="有效天数" width="100" align="center">
|
||||||
|
<template #default="{ row }">{{ row.durationDays || '-' }}</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="状态" width="100" align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-tag :type="statusTagType(row.status)">
|
||||||
|
{{ statusLabel(row.status) }}
|
||||||
|
</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="绑定信息" min-width="220" show-overflow-tooltip>
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div>{{ row.bindAccount || '-' }}</div>
|
||||||
|
<div class="muted">设备:{{ row.machineCode || row.bindDeviceId || '-' }}</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="ownerUserName" label="归属用户" min-width="130" show-overflow-tooltip />
|
||||||
|
<el-table-column prop="activatedAt" label="激活时间" width="180">
|
||||||
|
<template #default="{ row }">{{ row.activatedAt || '-' }}</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="expiredAt" label="过期时间" width="180">
|
||||||
|
<template #default="{ row }">{{ row.expiredAt || '-' }}</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="createdAt" label="创建时间" width="180">
|
||||||
|
<template #default="{ row }">{{ row.createdAt || '-' }}</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="remark" label="备注" min-width="160" show-overflow-tooltip />
|
||||||
|
<el-table-column label="操作" width="250" fixed="right" align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-button link type="primary" @click="openDetail(row)">详情</el-button>
|
||||||
|
<el-button link type="warning" @click="openEdit(row)">编辑</el-button>
|
||||||
|
<el-button link :type="Number(row.status) === 3 ? 'success' : 'info'" @click="handleToggleStatus(row)">
|
||||||
|
{{ Number(row.status) === 3 ? '启用' : '禁用' }}
|
||||||
|
</el-button>
|
||||||
|
<el-button link type="danger" @click="handleDelete(row)">删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="pager">
|
||||||
|
<el-pagination
|
||||||
|
v-model:current-page="pagination.page"
|
||||||
|
v-model:page-size="pagination.pageSize"
|
||||||
|
background
|
||||||
|
:layout="isMobile ? 'prev, pager, next' : 'total, sizes, prev, pager, next, jumper'"
|
||||||
|
:page-sizes="[20, 50, 100]"
|
||||||
|
:total="total"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<el-dialog
|
||||||
|
v-model="editVisible"
|
||||||
|
:title="form.id ? '编辑激活码' : '新增激活码'"
|
||||||
|
width="720px"
|
||||||
|
class="activation-code-edit-dialog"
|
||||||
|
>
|
||||||
|
<el-form ref="formRef" :model="form" :rules="rules" label-width="110px">
|
||||||
|
<el-form-item label="激活码" prop="code">
|
||||||
|
<el-input v-model="form.code" placeholder="请输入激活码" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
<el-row :gutter="12">
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="卡密类型" prop="type">
|
||||||
|
<el-select v-model="form.type" placeholder="请选择卡密类型" class="full" @change="handleTypeChange">
|
||||||
|
<el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="有效天数" prop="durationDays">
|
||||||
|
<el-input-number v-model="form.durationDays" :min="0" :max="9999" class="full" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row :gutter="12">
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select v-model="form.status" placeholder="请选择状态" class="full">
|
||||||
|
<el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="归属用户ID">
|
||||||
|
<el-input v-model="form.ownerUserId" placeholder="请输入归属用户ID" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-form-item label="归属用户">
|
||||||
|
<el-input v-model="form.ownerUserName" placeholder="请输入归属用户名称" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
<el-row :gutter="12">
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="绑定账号">
|
||||||
|
<el-input v-model="form.bindAccount" placeholder="请输入绑定账号" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="绑定设备ID">
|
||||||
|
<el-input v-model="form.bindDeviceId" placeholder="请输入绑定设备ID" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row :gutter="12">
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="激活时间">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="form.activatedAt"
|
||||||
|
type="datetime"
|
||||||
|
value-format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
placeholder="请选择激活时间"
|
||||||
|
class="full"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="过期时间">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="form.expiredAt"
|
||||||
|
type="datetime"
|
||||||
|
value-format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
placeholder="请选择过期时间"
|
||||||
|
class="full"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-form-item label="备注">
|
||||||
|
<el-input v-model="form.remark" type="textarea" :rows="3" placeholder="请输入备注" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<el-button @click="editVisible = false">取消</el-button>
|
||||||
|
<el-button type="primary" :loading="actionLoading" @click="handleSave">保存</el-button>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<el-dialog v-model="generateVisible" title="批量生成激活码" width="620px" class="activation-code-generate-dialog">
|
||||||
|
<el-form ref="generateFormRef" :model="generateForm" :rules="generateRules" label-width="110px">
|
||||||
|
<el-row :gutter="12">
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="生成数量" prop="count">
|
||||||
|
<el-input-number v-model="generateForm.count" :min="1" :max="10000" class="full" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="卡密类型" prop="type">
|
||||||
|
<el-select
|
||||||
|
v-model="generateForm.type"
|
||||||
|
placeholder="请选择卡密类型"
|
||||||
|
class="full"
|
||||||
|
@change="handleGenerateTypeChange"
|
||||||
|
>
|
||||||
|
<el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-form-item label="有效天数" prop="durationDays">
|
||||||
|
<el-input-number v-model="generateForm.durationDays" :min="0" :max="9999" class="full" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-row :gutter="12">
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="归属用户ID">
|
||||||
|
<el-input v-model="generateForm.ownerUserId" placeholder="请输入归属用户ID" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="12">
|
||||||
|
<el-form-item label="归属用户">
|
||||||
|
<el-input v-model="generateForm.ownerUserName" placeholder="请输入归属用户名称" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-form-item label="备注">
|
||||||
|
<el-input v-model="generateForm.remark" type="textarea" :rows="3" placeholder="请输入备注" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<el-button @click="generateVisible = false">取消</el-button>
|
||||||
|
<el-button type="primary" :loading="actionLoading" @click="handleGenerate">确认生成</el-button>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<el-drawer v-model="detailVisible" title="激活码详情" size="640px" direction="rtl" class="activation-code-detail-drawer">
|
||||||
|
<el-descriptions v-if="currentRow" :column="1" border>
|
||||||
|
<el-descriptions-item label="ID">{{ currentRow.id || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="激活码">
|
||||||
|
<span class="code-text">{{ currentRow.code || '-' }}</span>
|
||||||
|
<el-button v-if="currentRow.code" link type="primary" @click="copyCode(currentRow.code)">复制</el-button>
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="卡密类型">{{ currentRow.typeName || typeLabel(currentRow.type) }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="有效天数">{{ currentRow.durationDays || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="状态">
|
||||||
|
<el-tag :type="statusTagType(currentRow.status)">
|
||||||
|
{{ statusLabel(currentRow.status) }}
|
||||||
|
</el-tag>
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="绑定账号">{{ currentRow.bindAccount || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="绑定设备">{{ currentRow.machineCode || currentRow.bindDeviceId || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="设备信息">{{ currentRow.deviceInfo || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="归属用户">{{ currentRow.ownerUserName || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="归属用户ID">{{ currentRow.ownerUserId || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="激活时间">{{ currentRow.activatedAt || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="过期时间">{{ currentRow.expiredAt || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="创建时间">{{ currentRow.createdAt || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="更新时间">{{ currentRow.updatedAt || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="备注">{{ currentRow.remark || '-' }}</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
</el-drawer>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.cursor-activation-code-page {
|
||||||
|
padding: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-header,
|
||||||
|
.header-actions,
|
||||||
|
.toolbar,
|
||||||
|
.toolbar-left,
|
||||||
|
.toolbar-right,
|
||||||
|
.code-cell {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-header {
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-actions,
|
||||||
|
.toolbar-left,
|
||||||
|
.toolbar-right,
|
||||||
|
.code-cell {
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, minmax(120px, 1fr));
|
||||||
|
gap: 12px;
|
||||||
|
margin-bottom: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-card {
|
||||||
|
padding: 14px 16px;
|
||||||
|
border: 1px solid #ebeef5;
|
||||||
|
border-radius: 8px;
|
||||||
|
background: #fbfcff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-label {
|
||||||
|
color: #909399;
|
||||||
|
font-size: 13px;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-value {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #409eff;
|
||||||
|
|
||||||
|
&.is-success {
|
||||||
|
color: #67c23a;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-info {
|
||||||
|
color: #909399;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-danger {
|
||||||
|
color: #f56c6c;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar {
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 12px;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-left,
|
||||||
|
.toolbar-right {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-320 {
|
||||||
|
width: 320px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-140 {
|
||||||
|
width: 140px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-scroll {
|
||||||
|
width: 100%;
|
||||||
|
overflow-x: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.activation-code-table {
|
||||||
|
min-width: 1360px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.code-text {
|
||||||
|
font-family: Consolas, Monaco, 'Courier New', monospace;
|
||||||
|
font-weight: 600;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
|
||||||
|
.muted {
|
||||||
|
color: #909399;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.full {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pager {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
margin-top: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.activation-code-edit-dialog),
|
||||||
|
:deep(.activation-code-generate-dialog) {
|
||||||
|
max-width: calc(100vw - 24px);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.cursor-activation-code-page {
|
||||||
|
padding: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-header,
|
||||||
|
.header-actions {
|
||||||
|
align-items: stretch;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-grid {
|
||||||
|
grid-template-columns: repeat(2, minmax(120px, 1fr));
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-left,
|
||||||
|
.toolbar-right,
|
||||||
|
.w-320,
|
||||||
|
.w-140 {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-right .el-button,
|
||||||
|
.header-actions .el-button {
|
||||||
|
width: 100%;
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pager {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.activation-code-detail-drawer) {
|
||||||
|
width: 100vw !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -27,6 +27,7 @@ export default defineConfig({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
server: {
|
server: {
|
||||||
|
host: "127.0.0.1",
|
||||||
port: 5000,
|
port: 5000,
|
||||||
// 开发时前端在 5000,接口走相对路径 /platform/*、/backend/*,转发到本地 Go(当前 httpport=8081)
|
// 开发时前端在 5000,接口走相对路径 /platform/*、/backend/*,转发到本地 Go(当前 httpport=8081)
|
||||||
proxy: {
|
proxy: {
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user