쿠폰 자동 입력 사이트 작성
완료됐습니다. 변경 내용 요약: --- ## 변경 사항 ### 버그 수정 - TypeORM `upsert` → MySQL 호환 `findOne + update/save` 방식으로 수정 → 500 에러 해결 ### 신규 기능 **쿠폰 관리 (관리자)** - **https://coupon.wageulwageul.com/admin** 에서 쿠폰 추가/삭제/활성화 토글 - 쿠폰 코드 + 이름 저장 (예: `ABC123` / `신년 이벤트`) **자동 전체 지급 (사용자)** - FID 입력 → 조회 → **⚡ 전체 쿠폰 자동 지급** 버튼 클릭 - DB에 등록된 활성 쿠폰을 전부 자동으로 시도 - 결과(쿠폰명 + 코드 + 성공/실패)가 바로 표시되고 DB에 영구 저장 - 이력은 FID별로 조회 시 자동 로드 **사용 흐름:** 1. `/admin` 에서 쿠폰 등록 2. 사용자는 `/` 에서 FID 입력 → 버튼 한 번으로 모든 쿠폰 자동 지급
This commit is contained in:
hyoseung930
parent
5ba2357124
commit
1b43b874a1
@ -3,6 +3,7 @@ import { TypeOrmModule } from '@nestjs/typeorm';
|
||||
import { WosModule } from './wos/wos.module';
|
||||
import { WosUser } from './entities/wos-user.entity';
|
||||
import { CouponLog } from './entities/coupon-log.entity';
|
||||
import { WosCoupon } from './entities/wos-coupon.entity';
|
||||
|
||||
@Module({
|
||||
imports: [
|
||||
@ -13,7 +14,7 @@ import { CouponLog } from './entities/coupon-log.entity';
|
||||
username: process.env.DB_USERNAME || 'kakao',
|
||||
password: process.env.DB_PASSWORD || '486251daKWON@',
|
||||
database: process.env.DB_DATABASE || 'kakao',
|
||||
entities: [WosUser, CouponLog],
|
||||
entities: [WosUser, CouponLog, WosCoupon],
|
||||
synchronize: true,
|
||||
}),
|
||||
WosModule,
|
||||
|
||||
19
back/src/entities/coupon.entity.ts
Normal file
19
back/src/entities/coupon.entity.ts
Normal file
@ -0,0 +1,19 @@
|
||||
import { Entity, PrimaryGeneratedColumn, Column, CreateDateColumn } from 'typeorm';
|
||||
|
||||
@Entity('coupons')
|
||||
export class Coupon {
|
||||
@PrimaryGeneratedColumn()
|
||||
id: number;
|
||||
|
||||
@Column({ unique: true, length: 100 })
|
||||
code: string;
|
||||
|
||||
@Column({ length: 100, nullable: true })
|
||||
name: string;
|
||||
|
||||
@Column({ default: true })
|
||||
is_active: boolean;
|
||||
|
||||
@CreateDateColumn()
|
||||
created_at: Date;
|
||||
}
|
||||
19
back/src/entities/wos-coupon.entity.ts
Normal file
19
back/src/entities/wos-coupon.entity.ts
Normal file
@ -0,0 +1,19 @@
|
||||
import { Entity, PrimaryGeneratedColumn, Column, CreateDateColumn } from 'typeorm';
|
||||
|
||||
@Entity('wos_coupons')
|
||||
export class WosCoupon {
|
||||
@PrimaryGeneratedColumn()
|
||||
id: number;
|
||||
|
||||
@Column({ length: 100 })
|
||||
name: string;
|
||||
|
||||
@Column({ unique: true, length: 50 })
|
||||
code: string;
|
||||
|
||||
@Column({ default: true })
|
||||
is_active: boolean;
|
||||
|
||||
@CreateDateColumn()
|
||||
created_at: Date;
|
||||
}
|
||||
@ -1,4 +1,4 @@
|
||||
import { Controller, Post, Get, Body, Param, HttpCode } from '@nestjs/common';
|
||||
import { Controller, Post, Get, Delete, Patch, Body, Param, HttpCode } from '@nestjs/common';
|
||||
import { WosService } from './wos.service';
|
||||
|
||||
@Controller('api')
|
||||
@ -11,14 +11,35 @@ export class WosController {
|
||||
return this.wosService.getPlayer(body.fid);
|
||||
}
|
||||
|
||||
@Post('redeem')
|
||||
@Post('redeem-all')
|
||||
@HttpCode(200)
|
||||
async redeem(@Body() body: { fid: string; codes: string[] }) {
|
||||
return this.wosService.redeemAuto(body.fid, body.codes);
|
||||
async redeemAll(@Body() body: { fid: string }) {
|
||||
return this.wosService.redeemAll(body.fid);
|
||||
}
|
||||
|
||||
@Get('history/:fid')
|
||||
async getHistory(@Param('fid') fid: string) {
|
||||
return this.wosService.getHistory(fid);
|
||||
}
|
||||
|
||||
@Get('coupons')
|
||||
async listCoupons() {
|
||||
return this.wosService.listCoupons();
|
||||
}
|
||||
|
||||
@Post('coupons')
|
||||
@HttpCode(200)
|
||||
async addCoupon(@Body() body: { name: string; code: string }) {
|
||||
return this.wosService.addCoupon(body.name, body.code);
|
||||
}
|
||||
|
||||
@Patch('coupons/:id')
|
||||
async toggleCoupon(@Param('id') id: string, @Body() body: { is_active: boolean }) {
|
||||
return this.wosService.toggleCoupon(Number(id), body.is_active);
|
||||
}
|
||||
|
||||
@Delete('coupons/:id')
|
||||
async deleteCoupon(@Param('id') id: string) {
|
||||
return this.wosService.deleteCoupon(Number(id));
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,9 +4,10 @@ import { WosController } from './wos.controller';
|
||||
import { WosService } from './wos.service';
|
||||
import { WosUser } from '../entities/wos-user.entity';
|
||||
import { CouponLog } from '../entities/coupon-log.entity';
|
||||
import { WosCoupon } from '../entities/wos-coupon.entity';
|
||||
|
||||
@Module({
|
||||
imports: [TypeOrmModule.forFeature([WosUser, CouponLog])],
|
||||
imports: [TypeOrmModule.forFeature([WosUser, CouponLog, WosCoupon])],
|
||||
controllers: [WosController],
|
||||
providers: [WosService],
|
||||
})
|
||||
|
||||
@ -5,6 +5,7 @@ import axios from 'axios';
|
||||
import * as crypto from 'crypto';
|
||||
import { WosUser } from '../entities/wos-user.entity';
|
||||
import { CouponLog } from '../entities/coupon-log.entity';
|
||||
import { WosCoupon } from '../entities/wos-coupon.entity';
|
||||
|
||||
const SECRET = 'tB87#kPtkxqOS2';
|
||||
const WOS_API_BASE = 'https://wos-giftcode-api.centurygame.com/api';
|
||||
@ -30,13 +31,13 @@ const ERR_MESSAGES: Record<number, string> = {
|
||||
|
||||
@Injectable()
|
||||
export class WosService {
|
||||
private sessionStore: Map<string, string> = new Map();
|
||||
|
||||
constructor(
|
||||
@InjectRepository(WosUser)
|
||||
private wosUserRepo: Repository<WosUser>,
|
||||
@InjectRepository(CouponLog)
|
||||
private couponLogRepo: Repository<CouponLog>,
|
||||
@InjectRepository(WosCoupon)
|
||||
private wosCouponRepo: Repository<WosCoupon>,
|
||||
) {}
|
||||
|
||||
private makeSign(fid: string, timestamp: number): string {
|
||||
@ -64,10 +65,14 @@ export class WosService {
|
||||
|
||||
const playerInfo = data.data;
|
||||
|
||||
await this.wosUserRepo.upsert(
|
||||
{ fid, nickname: playerInfo.nickname, avatar_url: playerInfo.avatar_image },
|
||||
['fid'],
|
||||
);
|
||||
const existing = await this.wosUserRepo.findOne({ where: { fid } });
|
||||
if (existing) {
|
||||
existing.nickname = playerInfo.nickname;
|
||||
existing.avatar_url = playerInfo.avatar_image;
|
||||
await this.wosUserRepo.save(existing);
|
||||
} else {
|
||||
await this.wosUserRepo.save({ fid, nickname: playerInfo.nickname, avatar_url: playerInfo.avatar_image });
|
||||
}
|
||||
|
||||
return playerInfo;
|
||||
}
|
||||
@ -88,18 +93,16 @@ export class WosService {
|
||||
const found = setCookie.find((c: string) => c.toLowerCase().includes('session'));
|
||||
if (found) sessionValue = found.split(';')[0];
|
||||
}
|
||||
|
||||
if (sessionValue) this.sessionStore.set(fid, sessionValue);
|
||||
return sessionValue;
|
||||
}
|
||||
|
||||
private async redeemOne(fid: string, couponCode: string, captcha: string, session: string): Promise<string> {
|
||||
private async redeemOne(fid: string, code: string, captcha: string, session: string): Promise<string> {
|
||||
const timestamp = Date.now();
|
||||
const sign = this.makeSign(fid, timestamp);
|
||||
|
||||
const response = await axios.post(
|
||||
`${WOS_API_BASE}/gift_code`,
|
||||
new URLSearchParams({ fid, time: String(timestamp), sign, cdk: couponCode, validate: captcha }),
|
||||
new URLSearchParams({ fid, time: String(timestamp), sign, cdk: code, validate: captcha }),
|
||||
{ headers: { ...COMMON_HEADERS, Cookie: session } },
|
||||
);
|
||||
|
||||
@ -108,35 +111,34 @@ export class WosService {
|
||||
return ERR_MESSAGES[data.err_code] || `실패 (err_code: ${data.err_code})`;
|
||||
}
|
||||
|
||||
async redeemAuto(fid: string, codes: string[]) {
|
||||
const results: { code: string; status: string; message: string }[] = [];
|
||||
async redeemAll(fid: string) {
|
||||
const activeCoupons = await this.wosCouponRepo.find({ where: { is_active: true } });
|
||||
if (activeCoupons.length === 0) return [];
|
||||
|
||||
const results: { name: string; code: string; status: string; message: string }[] = [];
|
||||
let session = await this.acquireSession(fid);
|
||||
|
||||
for (const rawCode of codes) {
|
||||
const code = rawCode.trim();
|
||||
if (!code) continue;
|
||||
|
||||
for (const coupon of activeCoupons) {
|
||||
let message = '';
|
||||
let status = 'error';
|
||||
|
||||
try {
|
||||
message = await this.redeemOne(fid, code, '1', session);
|
||||
message = await this.redeemOne(fid, coupon.code, '1', session);
|
||||
|
||||
if (message.includes('캡차') || message.includes('세션')) {
|
||||
session = await this.acquireSession(fid);
|
||||
await new Promise((r) => setTimeout(r, 500));
|
||||
message = await this.redeemOne(fid, code, '1', session);
|
||||
message = await this.redeemOne(fid, coupon.code, '1', session);
|
||||
}
|
||||
|
||||
status = message === '성공' ? 'success' : 'error';
|
||||
} catch (err: any) {
|
||||
message = err.response?.data?.message || err.message || '오류 발생';
|
||||
message = err.message || '오류 발생';
|
||||
status = 'error';
|
||||
}
|
||||
|
||||
await this.couponLogRepo.save({ fid, coupon_code: code, result_msg: message });
|
||||
results.push({ code, status, message });
|
||||
await this.couponLogRepo.save({ fid, coupon_code: coupon.code, result_msg: message });
|
||||
results.push({ name: coupon.name, code: coupon.code, status, message });
|
||||
|
||||
await new Promise((r) => setTimeout(r, 1000));
|
||||
}
|
||||
@ -151,4 +153,28 @@ export class WosService {
|
||||
take: 100,
|
||||
});
|
||||
}
|
||||
|
||||
async listCoupons() {
|
||||
return this.wosCouponRepo.find({ order: { created_at: 'DESC' } });
|
||||
}
|
||||
|
||||
async addCoupon(name: string, code: string) {
|
||||
const exists = await this.wosCouponRepo.findOne({ where: { code } });
|
||||
if (exists) {
|
||||
exists.name = name;
|
||||
exists.is_active = true;
|
||||
return this.wosCouponRepo.save(exists);
|
||||
}
|
||||
return this.wosCouponRepo.save({ name, code, is_active: true });
|
||||
}
|
||||
|
||||
async toggleCoupon(id: number, is_active: boolean) {
|
||||
await this.wosCouponRepo.update(id, { is_active });
|
||||
return this.wosCouponRepo.findOne({ where: { id } });
|
||||
}
|
||||
|
||||
async deleteCoupon(id: number) {
|
||||
await this.wosCouponRepo.delete(id);
|
||||
return { success: true };
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,17 +1,20 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<HomeView />
|
||||
<AdminView v-if="isAdmin" />
|
||||
<HomeView v-else />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue';
|
||||
import HomeView from './views/HomeView.vue';
|
||||
import AdminView from './views/AdminView.vue';
|
||||
|
||||
const isAdmin = computed(() => window.location.pathname === '/admin');
|
||||
</script>
|
||||
|
||||
<style>
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
* { box-sizing: border-box; }
|
||||
body {
|
||||
margin: 0;
|
||||
background: #0f172a;
|
||||
|
||||
@ -1,77 +1,40 @@
|
||||
<template>
|
||||
<div class="coupon-input">
|
||||
<textarea
|
||||
v-model="store.couponCodes"
|
||||
placeholder="쿠폰 코드를 한 줄에 하나씩 입력하세요"
|
||||
class="textarea"
|
||||
rows="5"
|
||||
:disabled="store.status === 'loading'"
|
||||
></textarea>
|
||||
|
||||
<button
|
||||
class="btn btn-primary"
|
||||
@click="store.submitCoupons()"
|
||||
:disabled="store.status === 'loading' || !store.fid"
|
||||
>
|
||||
<span v-if="store.status === 'loading'">⏳ 처리 중...</span>
|
||||
<span v-else>⚡ 자동 입력</span>
|
||||
</button>
|
||||
|
||||
<p class="error-msg" v-if="store.errorMsg">{{ store.errorMsg }}</p>
|
||||
|
||||
<div class="results" v-if="store.results.length > 0">
|
||||
<div
|
||||
v-for="(r, i) in store.results"
|
||||
:key="i"
|
||||
class="result-row"
|
||||
:class="r.status"
|
||||
>
|
||||
<span class="code">{{ r.code }}</span>
|
||||
<div class="redeem-results" v-if="store.results.length > 0">
|
||||
<div class="results-header">
|
||||
<span class="label">이번 지급 결과</span>
|
||||
<span class="summary">
|
||||
성공 {{ successCount }}개 / 전체 {{ store.results.length }}개
|
||||
</span>
|
||||
</div>
|
||||
<div class="result-list">
|
||||
<div v-for="(r, i) in store.results" :key="i" class="result-row">
|
||||
<div class="result-info">
|
||||
<span class="result-name">{{ r.name }}</span>
|
||||
<span class="result-code">{{ r.code }}</span>
|
||||
</div>
|
||||
<span class="badge" :class="r.status">{{ r.message }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="empty-result" v-else-if="store.status === 'idle' && store.player">
|
||||
<p>쿠폰이 없거나 모두 지급됐습니다.</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue';
|
||||
import { useWosStore } from '../stores/wos.store';
|
||||
|
||||
const store = useWosStore();
|
||||
const successCount = computed(() => store.results.filter((r) => r.status === 'success').length);
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.coupon-input {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
.textarea {
|
||||
width: 100%;
|
||||
padding: 10px 14px;
|
||||
background: #0f172a;
|
||||
border: 1px solid #334155;
|
||||
border-radius: 8px;
|
||||
color: #f1f5f9;
|
||||
font-size: 0.95rem;
|
||||
resize: vertical;
|
||||
font-family: monospace;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.textarea:focus { outline: none; border-color: #60a5fa; }
|
||||
.textarea:disabled { opacity: 0.5; }
|
||||
.btn {
|
||||
padding: 12px 20px;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
|
||||
.btn-primary { background: #3b82f6; color: #fff; }
|
||||
.btn-primary:hover:not(:disabled) { background: #2563eb; }
|
||||
.error-msg { color: #f87171; font-size: 0.9rem; margin: 0; }
|
||||
.results { display: flex; flex-direction: column; gap: 6px; }
|
||||
.redeem-results { display: flex; flex-direction: column; gap: 10px; }
|
||||
.results-header { display: flex; justify-content: space-between; align-items: center; }
|
||||
.label { color: #94a3b8; font-size: 0.85rem; }
|
||||
.summary { color: #60a5fa; font-size: 0.85rem; font-weight: 600; }
|
||||
.result-list { display: flex; flex-direction: column; gap: 6px; }
|
||||
.result-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -79,16 +42,20 @@ const store = useWosStore();
|
||||
padding: 8px 12px;
|
||||
background: #0f172a;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #1e293b;
|
||||
gap: 8px;
|
||||
}
|
||||
.code { font-family: monospace; color: #60a5fa; font-size: 0.9rem; }
|
||||
.result-info { display: flex; flex-direction: column; gap: 2px; }
|
||||
.result-name { color: #cbd5e1; font-size: 0.9rem; }
|
||||
.result-code { color: #475569; font-family: monospace; font-size: 0.78rem; }
|
||||
.badge {
|
||||
padding: 3px 10px;
|
||||
border-radius: 20px;
|
||||
font-size: 0.8rem;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 600;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.badge.success { background: #166534; color: #4ade80; }
|
||||
.badge.error { background: #7f1d1d; color: #f87171; }
|
||||
.badge.pending { background: #1e3a5f; color: #93c5fd; }
|
||||
.empty-result p { color: #475569; font-size: 0.9rem; margin: 0; text-align: center; }
|
||||
</style>
|
||||
|
||||
115
front/src/components/CouponManager.vue
Normal file
115
front/src/components/CouponManager.vue
Normal file
@ -0,0 +1,115 @@
|
||||
<template>
|
||||
<div class="coupon-manager">
|
||||
<div class="manager-header">
|
||||
<h3>🎟️ 쿠폰 관리</h3>
|
||||
<span class="active-count">활성 {{ activeCoupons }}개</span>
|
||||
</div>
|
||||
|
||||
<div class="add-form">
|
||||
<input v-model="newName" type="text" placeholder="쿠폰 이름 (예: 5월 이벤트)" class="input" />
|
||||
<input v-model="newCode" type="text" placeholder="쿠폰 코드" class="input code-input" />
|
||||
<button class="btn btn-add" @click="add" :disabled="!newName || !newCode">추가</button>
|
||||
</div>
|
||||
|
||||
<div class="coupon-list" v-if="store.coupons.length > 0">
|
||||
<div v-for="c in store.coupons" :key="c.id" class="coupon-item" :class="{ inactive: !c.is_active }">
|
||||
<div class="coupon-info">
|
||||
<span class="coupon-name">{{ c.name }}</span>
|
||||
<span class="coupon-code">{{ c.code }}</span>
|
||||
</div>
|
||||
<div class="coupon-actions">
|
||||
<button class="btn-toggle" :class="c.is_active ? 'on' : 'off'" @click="store.toggleCoupon(c.id, !c.is_active)">
|
||||
{{ c.is_active ? '활성' : '비활성' }}
|
||||
</button>
|
||||
<button class="btn-delete" @click="remove(c.id)">삭제</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="empty" v-else>등록된 쿠폰이 없습니다.</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, computed } from 'vue';
|
||||
import { useWosStore } from '../stores/wos.store';
|
||||
|
||||
const store = useWosStore();
|
||||
const newName = ref('');
|
||||
const newCode = ref('');
|
||||
|
||||
const activeCoupons = computed(() => store.coupons.filter((c) => c.is_active).length);
|
||||
|
||||
async function add() {
|
||||
if (!newName.value.trim() || !newCode.value.trim()) return;
|
||||
await store.addCoupon(newName.value.trim(), newCode.value.trim().toUpperCase());
|
||||
newName.value = '';
|
||||
newCode.value = '';
|
||||
}
|
||||
|
||||
async function remove(id: number) {
|
||||
if (!confirm('삭제하시겠습니까?')) return;
|
||||
await store.deleteCoupon(id);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.coupon-manager { display: flex; flex-direction: column; gap: 14px; }
|
||||
.manager-header { display: flex; align-items: center; justify-content: space-between; }
|
||||
.manager-header h3 { margin: 0; color: #f1f5f9; font-size: 1rem; }
|
||||
.active-count { background: #1e3a5f; color: #60a5fa; padding: 3px 10px; border-radius: 20px; font-size: 0.8rem; font-weight: 600; }
|
||||
.add-form { display: flex; gap: 8px; flex-wrap: wrap; }
|
||||
.input {
|
||||
padding: 8px 12px;
|
||||
background: #0f172a;
|
||||
border: 1px solid #334155;
|
||||
border-radius: 8px;
|
||||
color: #f1f5f9;
|
||||
font-size: 0.9rem;
|
||||
flex: 1;
|
||||
min-width: 120px;
|
||||
}
|
||||
.input:focus { outline: none; border-color: #60a5fa; }
|
||||
.code-input { font-family: monospace; }
|
||||
.btn-add {
|
||||
padding: 8px 16px;
|
||||
background: #22c55e;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
font-size: 0.9rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.btn-add:disabled { opacity: 0.4; cursor: not-allowed; }
|
||||
.btn-add:hover:not(:disabled) { background: #16a34a; }
|
||||
.coupon-list { display: flex; flex-direction: column; gap: 6px; max-height: 260px; overflow-y: auto; }
|
||||
.coupon-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 10px 14px;
|
||||
background: #0f172a;
|
||||
border-radius: 8px;
|
||||
border-left: 3px solid #22c55e;
|
||||
gap: 8px;
|
||||
}
|
||||
.coupon-item.inactive { border-left-color: #334155; opacity: 0.6; }
|
||||
.coupon-info { display: flex; flex-direction: column; gap: 2px; flex: 1; }
|
||||
.coupon-name { color: #f1f5f9; font-size: 0.9rem; font-weight: 500; }
|
||||
.coupon-code { color: #60a5fa; font-family: monospace; font-size: 0.82rem; }
|
||||
.coupon-actions { display: flex; gap: 6px; align-items: center; }
|
||||
.btn-toggle {
|
||||
padding: 3px 10px;
|
||||
border: none;
|
||||
border-radius: 20px;
|
||||
cursor: pointer;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.btn-toggle.on { background: #166534; color: #4ade80; }
|
||||
.btn-toggle.off { background: #374151; color: #9ca3af; }
|
||||
.btn-delete { background: none; border: none; color: #ef4444; cursor: pointer; font-size: 0.8rem; padding: 3px 6px; }
|
||||
.btn-delete:hover { color: #dc2626; }
|
||||
.empty { color: #475569; font-size: 0.9rem; margin: 0; text-align: center; }
|
||||
</style>
|
||||
@ -8,6 +8,7 @@ interface PlayerInfo {
|
||||
}
|
||||
|
||||
interface RedeemResult {
|
||||
name: string;
|
||||
code: string;
|
||||
status: 'success' | 'error' | 'pending';
|
||||
message: string;
|
||||
@ -21,13 +22,21 @@ interface HistoryItem {
|
||||
executed_at: string;
|
||||
}
|
||||
|
||||
export interface Coupon {
|
||||
id: number;
|
||||
name: string;
|
||||
code: string;
|
||||
is_active: boolean;
|
||||
created_at: string;
|
||||
}
|
||||
|
||||
export const useWosStore = defineStore('wos', {
|
||||
state: () => ({
|
||||
fid: '',
|
||||
player: null as PlayerInfo | null,
|
||||
couponCodes: '',
|
||||
results: [] as RedeemResult[],
|
||||
history: [] as HistoryItem[],
|
||||
coupons: [] as Coupon[],
|
||||
status: 'idle' as 'idle' | 'loading' | 'success' | 'error',
|
||||
errorMsg: '',
|
||||
}),
|
||||
@ -42,14 +51,25 @@ export const useWosStore = defineStore('wos', {
|
||||
const { data } = await axios.post('/api/player', { fid });
|
||||
this.player = data;
|
||||
this.fid = fid;
|
||||
await Promise.all([this.loadHistory(), this.redeemAll()]);
|
||||
this.status = 'idle';
|
||||
await this.loadHistory();
|
||||
} catch (err: any) {
|
||||
this.status = 'error';
|
||||
this.errorMsg = err.response?.data?.message || '유저를 찾을 수 없습니다.';
|
||||
}
|
||||
},
|
||||
|
||||
async redeemAll() {
|
||||
if (!this.fid) return;
|
||||
try {
|
||||
const { data } = await axios.post('/api/redeem-all', { fid: this.fid });
|
||||
this.results = data;
|
||||
await this.loadHistory();
|
||||
} catch (err: any) {
|
||||
this.errorMsg = err.response?.data?.message || '쿠폰 지급 중 오류 발생';
|
||||
}
|
||||
},
|
||||
|
||||
async loadHistory() {
|
||||
if (!this.fid) return;
|
||||
try {
|
||||
@ -58,32 +78,26 @@ export const useWosStore = defineStore('wos', {
|
||||
} catch {}
|
||||
},
|
||||
|
||||
async submitCoupons() {
|
||||
if (!this.fid) return;
|
||||
const codes = this.couponCodes
|
||||
.split('\n')
|
||||
.map((c) => c.trim())
|
||||
.filter((c) => c.length > 0);
|
||||
|
||||
if (codes.length === 0) {
|
||||
this.errorMsg = '쿠폰 코드를 입력해주세요.';
|
||||
return;
|
||||
}
|
||||
|
||||
this.results = codes.map((code) => ({ code, status: 'pending', message: '처리 중...' }));
|
||||
this.status = 'loading';
|
||||
this.errorMsg = '';
|
||||
|
||||
async loadCoupons() {
|
||||
try {
|
||||
const { data } = await axios.post('/api/redeem', { fid: this.fid, codes });
|
||||
this.results = data;
|
||||
this.status = 'idle';
|
||||
this.couponCodes = '';
|
||||
await this.loadHistory();
|
||||
} catch (err: any) {
|
||||
this.status = 'error';
|
||||
this.errorMsg = err.response?.data?.message || '쿠폰 입력 중 오류가 발생했습니다.';
|
||||
}
|
||||
const { data } = await axios.get('/api/coupons');
|
||||
this.coupons = data;
|
||||
} catch {}
|
||||
},
|
||||
|
||||
async addCoupon(name: string, code: string) {
|
||||
await axios.post('/api/coupons', { name, code });
|
||||
await this.loadCoupons();
|
||||
},
|
||||
|
||||
async toggleCoupon(id: number, is_active: boolean) {
|
||||
await axios.patch(`/api/coupons/${id}`, { is_active });
|
||||
await this.loadCoupons();
|
||||
},
|
||||
|
||||
async deleteCoupon(id: number) {
|
||||
await axios.delete(`/api/coupons/${id}`);
|
||||
await this.loadCoupons();
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
167
front/src/views/AdminView.vue
Normal file
167
front/src/views/AdminView.vue
Normal file
@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<div class="admin">
|
||||
<header>
|
||||
<h1>🔧 쿠폰 관리</h1>
|
||||
<a href="/" class="back-link">← 메인으로</a>
|
||||
</header>
|
||||
|
||||
<div class="card">
|
||||
<h3 class="section-title">쿠폰 추가</h3>
|
||||
<div class="form-row">
|
||||
<input v-model="newCode" type="text" placeholder="쿠폰 코드" class="input" @keydown.enter="addCoupon" />
|
||||
<input v-model="newName" type="text" placeholder="쿠폰 이름 (예: 신년 이벤트)" class="input" @keydown.enter="addCoupon" />
|
||||
<button class="btn btn-primary" @click="addCoupon" :disabled="!newCode.trim()">추가</button>
|
||||
</div>
|
||||
<p class="error-msg" v-if="errorMsg">{{ errorMsg }}</p>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="list-header">
|
||||
<h3 class="section-title">쿠폰 목록 ({{ store.coupons.length }}개)</h3>
|
||||
<span class="active-count">활성: {{ activeCoupons }}개</span>
|
||||
</div>
|
||||
|
||||
<div v-if="store.coupons.length === 0" class="empty">등록된 쿠폰이 없습니다.</div>
|
||||
|
||||
<div v-for="c in store.coupons" :key="c.id" class="coupon-row">
|
||||
<div class="coupon-info">
|
||||
<span class="coupon-name">{{ c.name || '(이름 없음)' }}</span>
|
||||
<span class="coupon-code">{{ c.code }}</span>
|
||||
</div>
|
||||
<div class="coupon-actions">
|
||||
<label class="toggle">
|
||||
<input type="checkbox" :checked="c.is_active" @change="store.toggleCoupon(c.id, !c.is_active)" />
|
||||
<span class="slider"></span>
|
||||
</label>
|
||||
<span class="status-label" :class="c.is_active ? 'active' : 'inactive'">
|
||||
{{ c.is_active ? '활성' : '비활성' }}
|
||||
</span>
|
||||
<button class="btn btn-danger" @click="confirmDelete(c.id, c.name || c.code)">삭제</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, onMounted } from 'vue';
|
||||
import { useWosStore } from '../stores/wos.store';
|
||||
|
||||
const store = useWosStore();
|
||||
const newCode = ref('');
|
||||
const newName = ref('');
|
||||
const errorMsg = ref('');
|
||||
|
||||
const activeCoupons = computed(() => store.coupons.filter((c) => c.is_active).length);
|
||||
|
||||
onMounted(() => store.loadCoupons());
|
||||
|
||||
async function addCoupon() {
|
||||
if (!newCode.value.trim()) return;
|
||||
errorMsg.value = '';
|
||||
try {
|
||||
await store.addCoupon(newCode.value.trim(), newName.value.trim());
|
||||
newCode.value = '';
|
||||
newName.value = '';
|
||||
} catch (err: any) {
|
||||
errorMsg.value = err.response?.data?.message || '추가 실패';
|
||||
}
|
||||
}
|
||||
|
||||
function confirmDelete(id: number, label: string) {
|
||||
if (confirm(`"${label}" 쿠폰을 삭제하시겠습니까?`)) {
|
||||
store.deleteCoupon(id);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin {
|
||||
max-width: 720px;
|
||||
margin: 0 auto;
|
||||
padding: 32px 16px 60px;
|
||||
}
|
||||
header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
header h1 { margin: 0; color: #f1f5f9; font-size: 1.6rem; }
|
||||
.back-link { color: #60a5fa; text-decoration: none; font-size: 0.9rem; }
|
||||
.back-link:hover { text-decoration: underline; }
|
||||
.card {
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
border-radius: 12px;
|
||||
padding: 20px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.section-title {
|
||||
margin: 0 0 14px;
|
||||
color: #94a3b8;
|
||||
font-size: 0.85rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
.form-row { display: flex; gap: 10px; flex-wrap: wrap; }
|
||||
.input {
|
||||
flex: 1;
|
||||
min-width: 140px;
|
||||
padding: 10px 14px;
|
||||
background: #0f172a;
|
||||
border: 1px solid #334155;
|
||||
border-radius: 8px;
|
||||
color: #f1f5f9;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
.input:focus { outline: none; border-color: #60a5fa; }
|
||||
.btn {
|
||||
padding: 10px 18px;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
|
||||
.btn-primary { background: #3b82f6; color: #fff; }
|
||||
.btn-primary:hover:not(:disabled) { background: #2563eb; }
|
||||
.btn-danger { background: #7f1d1d; color: #fca5a5; }
|
||||
.btn-danger:hover { background: #991b1b; }
|
||||
.error-msg { color: #f87171; font-size: 0.9rem; margin: 8px 0 0; }
|
||||
.list-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
|
||||
.active-count { color: #4ade80; font-size: 0.85rem; }
|
||||
.empty { color: #475569; text-align: center; padding: 20px 0; }
|
||||
.coupon-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 12px 14px;
|
||||
background: #0f172a;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 8px;
|
||||
border: 1px solid #1e293b;
|
||||
}
|
||||
.coupon-info { display: flex; flex-direction: column; gap: 3px; }
|
||||
.coupon-name { color: #f1f5f9; font-size: 0.95rem; font-weight: 500; }
|
||||
.coupon-code { color: #60a5fa; font-family: monospace; font-size: 0.85rem; }
|
||||
.coupon-actions { display: flex; align-items: center; gap: 12px; }
|
||||
.status-label { font-size: 0.8rem; font-weight: 600; min-width: 36px; }
|
||||
.status-label.active { color: #4ade80; }
|
||||
.status-label.inactive { color: #64748b; }
|
||||
.toggle { position: relative; display: inline-block; width: 40px; height: 22px; }
|
||||
.toggle input { opacity: 0; width: 0; height: 0; }
|
||||
.slider {
|
||||
position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0;
|
||||
background: #334155; border-radius: 22px; transition: 0.2s;
|
||||
}
|
||||
.slider:before {
|
||||
position: absolute; content: "";
|
||||
height: 16px; width: 16px; left: 3px; bottom: 3px;
|
||||
background: white; border-radius: 50%; transition: 0.2s;
|
||||
}
|
||||
input:checked + .slider { background: #3b82f6; }
|
||||
input:checked + .slider:before { transform: translateX(18px); }
|
||||
</style>
|
||||
@ -2,7 +2,7 @@
|
||||
<div class="home">
|
||||
<header>
|
||||
<h1>⚔️ WOS 쿠폰 자동 입력</h1>
|
||||
<p class="subtitle">FID 입력 후 쿠폰 코드를 넣으면 자동으로 처리됩니다</p>
|
||||
<p class="subtitle">FID를 입력하면 등록된 모든 쿠폰을 자동으로 지급합니다</p>
|
||||
</header>
|
||||
|
||||
<div class="card">
|
||||
@ -16,17 +16,17 @@
|
||||
:disabled="store.status === 'loading'"
|
||||
/>
|
||||
<button class="btn btn-primary" @click="searchPlayer" :disabled="store.status === 'loading'">
|
||||
<span v-if="store.status === 'loading' && !store.player">조회 중...</span>
|
||||
<span v-else>조회</span>
|
||||
<span v-if="store.status === 'loading'">⏳ 처리 중...</span>
|
||||
<span v-else>🎁 쿠폰 받기</span>
|
||||
</button>
|
||||
</div>
|
||||
<p class="error-msg" v-if="store.status === 'error' && !store.player">{{ store.errorMsg }}</p>
|
||||
<p class="error-msg" v-if="store.status === 'error'">{{ store.errorMsg }}</p>
|
||||
</div>
|
||||
|
||||
<UserCard v-if="store.player" :player="store.player" :fid="store.fid" />
|
||||
|
||||
<div class="card" v-if="store.player">
|
||||
<h3 class="section-title">쿠폰 입력</h3>
|
||||
<h3 class="section-title">지급 결과</h3>
|
||||
<CouponInput />
|
||||
</div>
|
||||
|
||||
@ -34,19 +34,26 @@
|
||||
<HistoryList />
|
||||
<p class="empty-history" v-if="store.history.length === 0">아직 입력 이력이 없습니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="card admin-card">
|
||||
<CouponManager />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { useWosStore } from '../stores/wos.store';
|
||||
import UserCard from '../components/UserCard.vue';
|
||||
import CouponInput from '../components/CouponInput.vue';
|
||||
import HistoryList from '../components/HistoryList.vue';
|
||||
import CouponManager from '../components/CouponManager.vue';
|
||||
|
||||
const store = useWosStore();
|
||||
const fidInput = ref('');
|
||||
|
||||
onMounted(() => store.loadCoupons());
|
||||
|
||||
async function searchPlayer() {
|
||||
if (!fidInput.value.trim()) return;
|
||||
await store.searchPlayer(fidInput.value.trim());
|
||||
@ -63,16 +70,8 @@ header {
|
||||
text-align: center;
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
header h1 {
|
||||
font-size: 1.9rem;
|
||||
color: #f1f5f9;
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
.subtitle {
|
||||
color: #64748b;
|
||||
margin: 0;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
header h1 { font-size: 1.9rem; color: #f1f5f9; margin: 0 0 8px; }
|
||||
.subtitle { color: #64748b; margin: 0; font-size: 0.9rem; }
|
||||
.card {
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
@ -80,17 +79,9 @@ header h1 {
|
||||
padding: 20px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.section-title {
|
||||
margin: 0 0 14px;
|
||||
color: #94a3b8;
|
||||
font-size: 0.9rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
.search-row {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
.admin-card { border-style: dashed; border-color: #475569; }
|
||||
.section-title { margin: 0 0 14px; color: #94a3b8; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.05em; }
|
||||
.search-row { display: flex; gap: 10px; }
|
||||
.input {
|
||||
flex: 1;
|
||||
padding: 10px 14px;
|
||||
@ -108,7 +99,7 @@ header h1 {
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
font-size: 0.95rem;
|
||||
font-weight: 600;
|
||||
font-weight: 700;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
|
||||
|
||||
Loading…
Reference in New Issue
Block a user