Browse Source
Merge branch 'lihuilin/feature-20250718094329-25周年庆后台' of http://39.101.133.168:8807/lihuilin/AnniversaryBackstage into lihuilin/feature-20250718094329-25周年庆后台
lihuilin/feature-20250718094329-25周年庆后台
Merge branch 'lihuilin/feature-20250718094329-25周年庆后台' of http://39.101.133.168:8807/lihuilin/AnniversaryBackstage into lihuilin/feature-20250718094329-25周年庆后台
lihuilin/feature-20250718094329-25周年庆后台
39 changed files with 4456 additions and 0 deletions
-
12activitylink/.env.development
-
15activitylink/.env.production
-
24activitylink/.gitignore
-
3activitylink/.vscode/extensions.json
-
10activitylink/README.md
-
13activitylink/index.html
-
1459activitylink/package-lock.json
-
21activitylink/package.json
-
1activitylink/public/vite.svg
-
9activitylink/src/App.vue
-
4activitylink/src/api/API.js
-
40activitylink/src/api/manage/activity.js
-
101activitylink/src/api/manage/gift.js
-
60activitylink/src/api/manage/level.js
-
15activitylink/src/api/manage/login.js
-
9activitylink/src/api/manage/win.js
-
1activitylink/src/assets/vue.svg
-
0activitylink/src/global.d.ts
-
BINactivitylink/src/img/1.jpg
-
BINactivitylink/src/img/image.png
-
20activitylink/src/main.js
-
74activitylink/src/router/index.js
-
21activitylink/src/stone/activityStone.js
-
21activitylink/src/stone/counter.js
-
21activitylink/src/stone/giftFixedListStone.js
-
79activitylink/src/style.css
-
30activitylink/src/utils/request.js
-
116activitylink/src/views/homePage.vue
-
287activitylink/src/views/zhongchou/activity/detail/index.vue
-
322activitylink/src/views/zhongchou/activity/index.vue
-
179activitylink/src/views/zhongchou/activity/set/index.vue
-
146activitylink/src/views/zhongchou/gift/importFixedList/index.vue
-
233activitylink/src/views/zhongchou/gift/importuser/index.vue
-
416activitylink/src/views/zhongchou/gift/index.vue
-
101activitylink/src/views/zhongchou/index.vue
-
279activitylink/src/views/zhongchou/level/index.vue
-
35activitylink/src/views/zhongchou/mainImg/DefaultImage.vue
-
255activitylink/src/views/zhongchou/winning/index.vue
-
24activitylink/vite.config.js
@ -0,0 +1,12 @@ |
|||
# must start with VITE_ |
|||
VITE_ENV = 'development' |
|||
VITE_OUTPUT_DIR = 'dev' |
|||
# public path |
|||
VITE_PUBLIC_PATH = / |
|||
#新数据接口 |
|||
# VITE_APP_BASE_API = 'http://47.92.148.30:3003/mock/3267' |
|||
# VITE_APP_BASE_API = '/api' |
|||
|
|||
# Whether to open mock |
|||
VITE_USE_MOCK = true |
|||
|
@ -0,0 +1,15 @@ |
|||
# must start with VITE_ |
|||
VITE_ENV = 'production' |
|||
VITE_OUTPUT_DIR = 'dist' |
|||
# public path |
|||
VITE_PUBLIC_PATH = /aixiaocaishen |
|||
# VITE_PUBLIC_PATH = / |
|||
|
|||
# Whether to open mock |
|||
VITE_USE_MOCK = true |
|||
|
|||
#新数据接口 |
|||
# VITE_APP_API_BASE_URL = https://api.homilychart.com/link |
|||
VITE_BUILD_COMPRESS = 'none' |
|||
|
|||
VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE = false |
@ -0,0 +1,24 @@ |
|||
# Logs |
|||
logs |
|||
*.log |
|||
npm-debug.log* |
|||
yarn-debug.log* |
|||
yarn-error.log* |
|||
pnpm-debug.log* |
|||
lerna-debug.log* |
|||
|
|||
node_modules |
|||
dist |
|||
dist-ssr |
|||
*.local |
|||
|
|||
# Editor directories and files |
|||
.vscode/* |
|||
!.vscode/extensions.json |
|||
.idea |
|||
.DS_Store |
|||
*.suo |
|||
*.ntvs* |
|||
*.njsproj |
|||
*.sln |
|||
*.sw? |
@ -0,0 +1,3 @@ |
|||
{ |
|||
"recommendations": ["Vue.volar"] |
|||
} |
@ -0,0 +1,10 @@ |
|||
# Vue 3 + Vite |
|||
|
|||
This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more. |
|||
|
|||
Learn more about IDE Support for Vue in the [Vue Docs Scaling up Guide](https://vuejs.org/guide/scaling-up/tooling.html#ide-support). |
|||
|
|||
npm install |
|||
npm install vue-router |
|||
npm install axios |
|||
npm install element-plus --save |
@ -0,0 +1,13 @@ |
|||
<!doctype html> |
|||
<html lang="en"> |
|||
<head> |
|||
<meta charset="UTF-8" /> |
|||
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
|||
<title>周年庆后台 V1.0</title> |
|||
</head> |
|||
<body> |
|||
<div id="app"></div> |
|||
<script type="module" src="/src/main.js"></script> |
|||
</body> |
|||
</html> |
1459
activitylink/package-lock.json
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -0,0 +1,21 @@ |
|||
{ |
|||
"name": "activitylink", |
|||
"private": true, |
|||
"version": "0.0.0", |
|||
"type": "module", |
|||
"scripts": { |
|||
"dev": "vite --host", |
|||
"build": "vite build", |
|||
"preview": "vite preview" |
|||
}, |
|||
"dependencies": { |
|||
"@vitejs/plugin-vue": "^4.6.2", |
|||
"axios": "^1.10.0", |
|||
"element-plus": "^2.10.4", |
|||
"file-saver": "^2.0.5", |
|||
"pinia": "^3.0.3", |
|||
"vite": "^4.5.3", |
|||
"vue": "^3.5.17", |
|||
"vue-router": "^4.5.1" |
|||
} |
|||
} |
@ -0,0 +1 @@ |
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg> |
@ -0,0 +1,9 @@ |
|||
<script setup> |
|||
</script> |
|||
|
|||
<template> |
|||
<router-view></router-view> |
|||
</template> |
|||
|
|||
<style scoped> |
|||
</style> |
@ -0,0 +1,4 @@ |
|||
import request from "../utils/request"; |
|||
|
|||
const APIurl = import.meta.env.VITE_APP_API_BASE_URL; |
|||
|
@ -0,0 +1,40 @@ |
|||
import request from '@/utils/request' |
|||
|
|||
export function getActivityList() { |
|||
return request({ |
|||
url: '/admin/funding/getActivity', |
|||
method: 'get', |
|||
|
|||
}) |
|||
} |
|||
|
|||
export function changeStatusbyId(id,status) { |
|||
return request({ |
|||
url: '/admin/funding/updateActivityStatus', |
|||
method: 'post', |
|||
params: { id,status } |
|||
}) |
|||
} |
|||
/** |
|||
* 添加活动 |
|||
* @param {Object} data 活动数据对象 |
|||
* @returns Promise |
|||
*/ |
|||
export function addActivityandtime(data) { |
|||
return request({ |
|||
url: '/admin/funding/addActivity', |
|||
method: 'post', |
|||
data // 使用 data 字段发送请求体(JSON 格式)
|
|||
}) |
|||
} |
|||
|
|||
|
|||
|
|||
export function getDetailList() { |
|||
return request({ |
|||
url: '/admin/funding/getActivityDetail', |
|||
method: 'post', |
|||
|
|||
}) |
|||
|
|||
} |
@ -0,0 +1,101 @@ |
|||
import request from '@/utils/request' |
|||
|
|||
//奖品新增
|
|||
export function addPrize(data) { |
|||
return request({ |
|||
url: '/admin/prize/add', |
|||
method: 'post', |
|||
data: data, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 奖品删除
|
|||
export function deletePrize(id) { |
|||
return request({ |
|||
url: '/admin/prize/delete', |
|||
method: 'post', |
|||
params: { id } |
|||
}) |
|||
} |
|||
//奖品分页查询
|
|||
export function getPrizeList(params) { |
|||
return request({ |
|||
url: '/admin/prize/list', |
|||
method: 'post', |
|||
params: params |
|||
}) |
|||
} |
|||
// 根据id查询奖品
|
|||
export function getprizebyid(params) { |
|||
return request({ |
|||
url: '/admin/prize/detail', |
|||
method: 'post', |
|||
params: params |
|||
}) |
|||
} |
|||
// 修改奖品
|
|||
export function updatePrize(data) { |
|||
return request({ |
|||
url: '/admin/prize/update', |
|||
method: 'post', |
|||
data: data, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
// 查询普通用户
|
|||
export function getUserList(data) { |
|||
return request({ |
|||
url: '/admin/user/list', |
|||
method: 'post', |
|||
data: data, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
// 普通用户新增
|
|||
export function addUser(data) { |
|||
return request({ |
|||
url: '/admin/user/add', |
|||
method: 'post', |
|||
data: data, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
// 普通用户删除
|
|||
export function deleteUser(id) { |
|||
return request({ |
|||
url: '/admin/user/delete', |
|||
method: 'post', |
|||
params: { id }, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
// 普通用户批量删除
|
|||
export function deleteUsers(ids) { |
|||
return request({ |
|||
url: '/admin/user/delete/batch', |
|||
method: 'post', |
|||
params: { ids } |
|||
}) |
|||
} |
|||
// 内定用户查全部
|
|||
export function getFixUserList(data) { |
|||
return request({ |
|||
url: '/admin/user/list/fix', |
|||
method: 'get', |
|||
data: data, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
@ -0,0 +1,60 @@ |
|||
|
|||
import request from '@/utils/request' |
|||
// 等级查询
|
|||
export function getLevelList(params) { |
|||
return request({ |
|||
url: '/admin/grade/list', |
|||
method: 'post', |
|||
params: params |
|||
}) |
|||
} |
|||
// 等级新增
|
|||
export function addLevel(data) { |
|||
return request({ |
|||
url: '/admin/grade/add', |
|||
method: 'post', |
|||
data, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
// 删除等级
|
|||
export function deleteGrade(id) { |
|||
return request({ |
|||
url: '/admin/grade/delete', |
|||
method: 'post', |
|||
params: { id } |
|||
}) |
|||
} |
|||
// 根据id查询等级
|
|||
// export function getgradedetails(params) {
|
|||
// return request({
|
|||
// url: '/admin/grade/details',
|
|||
// method: 'post',
|
|||
// params: params
|
|||
// })
|
|||
// }
|
|||
// 修改等级
|
|||
export function updateGrade(data) { |
|||
return request({ |
|||
url: '/admin/grade/update', |
|||
method: 'post', |
|||
data, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
// 等级名下拉框,礼品新增那边
|
|||
export function getGradeNameList() { |
|||
return request({ |
|||
url: '/admin/grade/allGradeName', |
|||
method: 'post', |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
|
|||
|
@ -0,0 +1,15 @@ |
|||
// src/api/user.js
|
|||
import request from '@/utils/request' |
|||
|
|||
/** |
|||
* 用户登录 |
|||
* @param {Object} data 包含 username 和 password |
|||
* @returns Promise |
|||
*/ |
|||
export function adminlogin(data) { |
|||
return request({ |
|||
url: '/admin/user/login', // 替换为你的实际接口地址
|
|||
method: 'post', |
|||
data |
|||
}) |
|||
} |
@ -0,0 +1,9 @@ |
|||
import request from '@/utils/request' |
|||
|
|||
export function deleteUser(id) { |
|||
return request({ |
|||
url: '/admin/user/delete', |
|||
method: 'post', |
|||
params: { id } |
|||
}) |
|||
} |
@ -0,0 +1 @@ |
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg> |
After Width: 5244 | Height: 2950 | Size: 2.1 MiB |
After Width: 71 | Height: 70 | Size: 7.6 KiB |
@ -0,0 +1,20 @@ |
|||
import { createApp } from 'vue' |
|||
import ElementPlus from 'element-plus' |
|||
import 'element-plus/dist/index.css' |
|||
import './style.css' |
|||
import App from './App.vue' |
|||
import router from './router' |
|||
import { createPinia } from 'pinia' |
|||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs' |
|||
import axios from 'axios' |
|||
// createApp(App).use(router).mount('#app')
|
|||
const app = createApp(App) |
|||
const pinia = createPinia() |
|||
window.axios = axios |
|||
// axios.defaults.baseURL = 'http://47.92.148.30:3003/mock/3267'
|
|||
app.use(router) |
|||
app.use(pinia) |
|||
app.use(ElementPlus, { |
|||
locale: zhCn, |
|||
}) |
|||
app.mount('#app') |
@ -0,0 +1,74 @@ |
|||
import { createRouter, createWebHistory } from 'vue-router' |
|||
const routes = [ |
|||
{ |
|||
path: '/', |
|||
redirect: 'homePage' |
|||
}, |
|||
{ |
|||
path: '/homePage', |
|||
name: 'homePage', |
|||
component: () => import('../views/homePage.vue'), |
|||
// children: [
|
|||
// {name: 'AiEmotion', path: '/AiEmotion', component: () => import('@/views/AiEmotion.vue')}
|
|||
// ]
|
|||
}, |
|||
{ |
|||
path: '/zhongchou', |
|||
name: 'zhongchou', |
|||
component: () => import('../views/zhongchou/index.vue'), |
|||
children: [ |
|||
{ |
|||
path: 'levelManagement', // 注意这里不要加斜杠,表示相对路径
|
|||
name: 'zhongchoulevel', |
|||
component: () => import('../views/zhongchou/level/index.vue'), |
|||
}, |
|||
{ |
|||
path: 'giftManagement', // 注意这里不要加斜杠,表示相对路径
|
|||
name: 'zhongchougift', |
|||
component: () => import('../views/zhongchou/gift/index.vue'), |
|||
}, |
|||
{ |
|||
path: 'giftManagement/importUsers', // 注意这里不要加斜杠,表示相对路径
|
|||
name: 'importUsers', |
|||
component: () => import('../views/zhongchou/gift/importuser/index.vue'), |
|||
}, |
|||
{ |
|||
path: 'giftManagement/importFixedList', // 注意这里不要加斜杠,表示相对路径
|
|||
name: 'importFixedList', |
|||
component: () => import('../views/zhongchou/gift/importFixedList/index.vue'), |
|||
}, |
|||
{ |
|||
path: 'winningManagement', // 注意这里不要加斜杠,表示相对路径
|
|||
name: 'zhongchouwinning', |
|||
component: () => import('../views/zhongchou/winning/index.vue'), |
|||
}, |
|||
{ |
|||
path: 'activityManagement', // 注意这里不要加斜杠,表示相对路径
|
|||
name: 'zhongchouactivity', |
|||
component: () => import('../views/zhongchou/activity/index.vue'), |
|||
}, |
|||
{ |
|||
path: 'activityManagement/detail', // 注意这里不要加斜杠,表示相对路径
|
|||
name: 'activityDetail', |
|||
component: () => import('../views/zhongchou/activity/detail/index.vue'), |
|||
}, |
|||
{ |
|||
path: 'activityManagement/set', // 注意这里不要加斜杠,表示相对路径
|
|||
name: 'activitySet', |
|||
component: () => import('../views/zhongchou/activity/set/index.vue'), |
|||
}, |
|||
{ |
|||
path: 'mainimg', // 注意这里不要加斜杠,表示相对路径
|
|||
name: 'mainImg', |
|||
component: () => import('../views/zhongchou/mainImg/DefaultImage.vue'), |
|||
} |
|||
] |
|||
} |
|||
] |
|||
// 创建路由实例
|
|||
const router = createRouter({ |
|||
history: createWebHistory(import.meta.env.VITE_PUBLIC_PATH), |
|||
routes |
|||
}) |
|||
// 导出
|
|||
export default router |
@ -0,0 +1,21 @@ |
|||
// src/stone/giftFixedListStone.js
|
|||
import { defineStore } from "pinia"; |
|||
import { ref } from 'vue'; |
|||
|
|||
export const useactivitytone = defineStore('activityStone', () => { |
|||
// 响应式属性
|
|||
const selectactivityId = ref(0); |
|||
|
|||
// 方法
|
|||
const setselectedactivityId = (name) => { |
|||
selectactivityId.value = name; |
|||
}; |
|||
|
|||
|
|||
|
|||
// 暴露出去
|
|||
return { |
|||
selectactivityId, |
|||
setselectedactivityId, |
|||
}; |
|||
}); |
@ -0,0 +1,21 @@ |
|||
import {computed, ref} from 'vue' |
|||
import { defineStore } from 'pinia' |
|||
|
|||
export const UseCounterStore = defineStore('counter',()=>{ |
|||
const count = ref(0) |
|||
const add = () =>{ |
|||
count.value++ |
|||
} |
|||
const sub = () =>{ |
|||
count.value-- |
|||
} |
|||
|
|||
const double = computed(()=>{return count.value*2}) |
|||
|
|||
|
|||
const msg=ref('hello') |
|||
|
|||
return {count,add,sub,double,msg} |
|||
},{ |
|||
persist:true |
|||
}) |
@ -0,0 +1,21 @@ |
|||
// src/stone/giftFixedListStone.js
|
|||
import { defineStore } from "pinia"; |
|||
import { ref } from 'vue'; |
|||
|
|||
export const usegiftFixedListStone = defineStore('giftFixedListStone', () => { |
|||
// 响应式属性
|
|||
const fixedGiftName = ref('666666'); |
|||
|
|||
// 方法
|
|||
const setFixedGiftName = (name) => { |
|||
fixedGiftName.value = name; |
|||
}; |
|||
|
|||
|
|||
|
|||
// 暴露出去
|
|||
return { |
|||
fixedGiftName, |
|||
setFixedGiftName, |
|||
}; |
|||
}); |
@ -0,0 +1,79 @@ |
|||
:root { |
|||
font-family: system-ui, Avenir, Helvetica, Arial, sans-serif; |
|||
line-height: 1.5; |
|||
font-weight: 400; |
|||
|
|||
color-scheme: light dark; |
|||
color: rgba(255, 255, 255, 0.87); |
|||
background-color: #242424; |
|||
|
|||
font-synthesis: none; |
|||
text-rendering: optimizeLegibility; |
|||
-webkit-font-smoothing: antialiased; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
} |
|||
|
|||
a { |
|||
font-weight: 500; |
|||
color: #646cff; |
|||
text-decoration: inherit; |
|||
} |
|||
a:hover { |
|||
color: #535bf2; |
|||
} |
|||
|
|||
body { |
|||
margin: 0; |
|||
display: flex; |
|||
/* place-items: center; */ |
|||
min-width: 320px; |
|||
min-height: 100vh; |
|||
} |
|||
|
|||
h1 { |
|||
font-size: 3.2em; |
|||
line-height: 1.1; |
|||
} |
|||
|
|||
button { |
|||
border-radius: 8px; |
|||
border: 1px solid transparent; |
|||
padding: 0.6em 1.2em; |
|||
font-size: 1em; |
|||
font-weight: 500; |
|||
font-family: inherit; |
|||
background-color: #1a1a1a; |
|||
cursor: pointer; |
|||
transition: border-color 0.25s; |
|||
} |
|||
button:hover { |
|||
border-color: #646cff; |
|||
} |
|||
button:focus, |
|||
button:focus-visible { |
|||
outline: 4px auto -webkit-focus-ring-color; |
|||
} |
|||
|
|||
.card { |
|||
padding: 2em; |
|||
} |
|||
|
|||
#app { |
|||
/* max-width: 1280px; */ |
|||
/* margin: 0 auto; */ |
|||
/* padding: 2rem; */ |
|||
/* text-align: center; */ |
|||
} |
|||
|
|||
@media (prefers-color-scheme: light) { |
|||
:root { |
|||
color: #213547; |
|||
background-color: #ffffff; |
|||
} |
|||
a:hover { |
|||
color: #747bff; |
|||
} |
|||
button { |
|||
background-color: #f9f9f9; |
|||
} |
|||
} |
@ -0,0 +1,30 @@ |
|||
|
|||
import axios from 'axios' |
|||
import { ElMessage } from 'element-plus' |
|||
|
|||
// 创建基础实例
|
|||
const service = axios.create({ |
|||
baseURL: import.meta.env.VITE_APP_BASE_API, |
|||
timeout: 10000 |
|||
}) |
|||
|
|||
// 请求拦截器(简化版)
|
|||
service.interceptors.request.use(config => { |
|||
// 添加token逻辑(如果存在)
|
|||
const token = localStorage.getItem('token') |
|||
if (token) { |
|||
config.headers['Authorization'] = 'Bearer ' + token |
|||
} |
|||
return config |
|||
}) |
|||
|
|||
// 响应拦截器(简化版)
|
|||
service.interceptors.response.use( |
|||
response => response.data, |
|||
error => { |
|||
ElMessage.error(error.message || '请求错误') |
|||
return Promise.reject(error) |
|||
} |
|||
) |
|||
|
|||
export default service |
@ -0,0 +1,116 @@ |
|||
<template> |
|||
<div class="login-container"> |
|||
<div class="login-box"> |
|||
<h2>登录</h2> |
|||
<form @submit.prevent="login"> |
|||
<div class="input-group"> |
|||
<label for="username">用户名</label> |
|||
<input type="text" id="username" v-model="username" required> |
|||
</div> |
|||
<div class="input-group"> |
|||
<label for="password">密码</label> |
|||
<input type="password" id="password" v-model="password" required> |
|||
</div> |
|||
<button type="submit" @click="loginHandler">登录</button> |
|||
</form> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
<script setup> |
|||
import { ref } from "vue"; |
|||
import { useRouter } from "vue-router"; |
|||
import { ElMessage } from 'element-plus' |
|||
import { adminlogin } from '@/api/manage/login' |
|||
const router = useRouter(); |
|||
const username = ref(""); |
|||
const password = ref(""); |
|||
// username.value=='90038794' && password.value=='697522'写死的账号密码 |
|||
const loginHandler = async () => { |
|||
// try { |
|||
// const response = await adminlogin({ |
|||
// username: username.value, |
|||
// password: password.value |
|||
// }) |
|||
router.push('/zhongchou/mainimg') |
|||
// 假设后端返回 code == 200 表示成功 |
|||
// if (response.code ) { |
|||
// const token = response.code |
|||
|
|||
// // ✅ 保存 token 到 localStorage |
|||
// localStorage.setItem('token', token) |
|||
// ElMessage.success('登录成功,欢迎您使用本系统') |
|||
// router.push('/zhongchou/mainimg') |
|||
// } else { |
|||
// ElMessage.error(response.message || '登录失败,请检查用户名或密码') |
|||
// } |
|||
// } catch (error) { |
|||
// ElMessage.error('登录失败,请稍后再试') |
|||
// console.error('登录错误:', error) |
|||
// } |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
.login-container { |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: url('@/img/1.jpg') no-repeat center center fixed; |
|||
background-size: cover; |
|||
background-position: center; |
|||
z-index: 0; |
|||
|
|||
/* 使用 Flexbox 布局 */ |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.login-box { |
|||
background-color: rgba(255, 255, 255, 0.9); |
|||
padding: 2rem; |
|||
border-radius: 8px; |
|||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); |
|||
width: 100%; |
|||
max-width: 400px; |
|||
z-index: 1; /* 提高 z-index 确保覆盖背景 */ |
|||
} |
|||
|
|||
h2 { |
|||
text-align: center; |
|||
margin-bottom: 1.5rem; |
|||
} |
|||
|
|||
.input-group { |
|||
margin-bottom: 1rem; |
|||
} |
|||
|
|||
.input-group label { |
|||
display: block; |
|||
margin-bottom: 0.5rem; |
|||
} |
|||
|
|||
.input-group input { |
|||
width: 100%; |
|||
padding: 0.5rem; |
|||
border: 1px solid #ccc; |
|||
border-radius: 4px; |
|||
} |
|||
|
|||
button { |
|||
width: 100%; |
|||
padding: 0.75rem; |
|||
border: none; |
|||
border-radius: 4px; |
|||
background-color: #42b983; |
|||
color: white; |
|||
font-size: 1rem; |
|||
cursor: pointer; |
|||
transition: background-color 0.3s; |
|||
} |
|||
|
|||
button:hover { |
|||
background-color: #369d6e; |
|||
} |
|||
</style> |
@ -0,0 +1,287 @@ |
|||
<!-- 美股是0 港股是1 精网号现在用的是字符串类型--> |
|||
<template> |
|||
|
|||
<el-card style="margin-top:50px ; min-height: 90vh; max-height: 90vh;"> |
|||
<div class="gray-container"> |
|||
<el-button type="primary" @click="goBack"> |
|||
<i class="el-icon-back"></i> 返回 |
|||
</el-button> |
|||
|
|||
<!-- 顶部信息栏 --> |
|||
<div class="info-bar"> |
|||
当前总参与人数:{{ totalParticipants }}人 |
|||
参与美股总人数:{{ usParticipants }}人 美股助力总次数:{{ usAssists }}次 |
|||
参与港股总人数:{{ hkParticipants }}人 港股助力总次数:{{ hkAssists }}次 |
|||
</div> |
|||
|
|||
<!-- 搜索栏 --> |
|||
<el-form :inline="true" class="search-bar"> |
|||
<el-form-item label="姓名"> |
|||
<el-input v-model="searchdata.name" placeholder="请输入姓名"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="精网号"> |
|||
<el-input v-model="searchdata.jingwangId" placeholder="请输入精网号" @input="handleJingwangIdInput"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="市场" class="market-item"> |
|||
<el-select v-model="searchdata.market" placeholder="请选择" class="market-select"> |
|||
<el-option label="全部" value="0"></el-option> |
|||
<el-option label="美股" value="1"></el-option> |
|||
<el-option label="港股" value="2"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="handleSearch">搜索</el-button> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button @click="handleReset">重置</el-button> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="handleExport">导出数据</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
|
|||
<!-- 表格 --> |
|||
<div class="table-container"> |
|||
<el-table :data="currentPageData" style="width: 100%" :row-style="{ height: '55px' }"> |
|||
<el-table-column prop="id" label="ID" width="100" align="center"></el-table-column> |
|||
<el-table-column prop="name" label="姓名" width="300" align="center"></el-table-column> |
|||
<el-table-column prop="jingwangId" label="精网号" width="300" align="center"></el-table-column> |
|||
<el-table-column prop="market" label="参与市场" width="300" align="center"> |
|||
<template #default="scope"> |
|||
<span v-if="scope.row.market == '0' ">美股</span> |
|||
<span v-if="scope.row.market == '1' ">港股</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="participationTime" label="参与时间" align="center"></el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</div> |
|||
<!-- 返回按钮 --> |
|||
|
|||
|
|||
<!-- 分页 --> |
|||
<el-pagination |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page="currentPage" |
|||
:page-sizes="[10, 20, 50, 100]" |
|||
:page-size="pageSize" |
|||
layout="total, sizes, prev, pager, next, jumper" |
|||
:total="tableData.length" |
|||
> |
|||
</el-pagination> |
|||
|
|||
</el-card> |
|||
</template> |
|||
|
|||
|
|||
<script setup> |
|||
import { ref, computed } from 'vue' |
|||
import { useRouter } from 'vue-router' |
|||
|
|||
const router = useRouter() |
|||
|
|||
// 响应式数据 |
|||
const totalParticipants = ref(156) |
|||
const usParticipants = ref(78) |
|||
const usAssists = ref(345) |
|||
const hkParticipants = ref(78) |
|||
const hkAssists = ref(234) |
|||
|
|||
const searchdata = ref({ |
|||
name: '', |
|||
jingwangId: '', |
|||
market: '' |
|||
}) |
|||
|
|||
const tableData = ref([ |
|||
{ |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
market: '0', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: '张三', |
|||
jingwangId: '90047666', |
|||
market: '1', |
|||
participationTime: '2025年7月11日 09:46' |
|||
} |
|||
]) |
|||
|
|||
const currentPage = ref(1) |
|||
const pageSize = ref(10) |
|||
|
|||
// 当前页数据计算属性 |
|||
const currentPageData = computed(() => { |
|||
const start = (currentPage.value - 1) * pageSize.value |
|||
const end = start + pageSize.value |
|||
return tableData.value.slice(start, end) |
|||
}) |
|||
|
|||
// 返回上一页 |
|||
const goBack = () => { |
|||
router.back() |
|||
} |
|||
|
|||
// 搜索逻辑 |
|||
const handleSearch = () => { |
|||
console.log('Search:', searchdata.value) |
|||
} |
|||
|
|||
// 重置搜索条件 |
|||
const handleReset = () => { |
|||
searchdata.value = { |
|||
name: '', |
|||
jingwangId: '', |
|||
market: '' |
|||
} |
|||
} |
|||
|
|||
// 导出数据 |
|||
const handleExport = () => { |
|||
console.log('Export Data') |
|||
} |
|||
|
|||
// 分页 size 改变 |
|||
const handleSizeChange = (val) => { |
|||
pageSize.value = val |
|||
currentPage.value = 1 |
|||
} |
|||
|
|||
// 当前页改变 |
|||
const handleCurrentChange = (val) => { |
|||
currentPage.value = val |
|||
} |
|||
|
|||
// 输入精网号处理 |
|||
const handleJingwangIdInput = (value) => { |
|||
searchdata.value.jingwangId = value.replace(/\D/g, '') |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.info-bar { |
|||
margin: 10px 0; |
|||
font-size: 16px; |
|||
} |
|||
|
|||
.gray-container { |
|||
width: 100%; /* 宽度自适应 */ |
|||
background-color: #ffffff; /* 浅灰色背景 */ |
|||
padding: 20px; /* 内边距 */ |
|||
box-sizing: border-box; /* 包含内边距在总宽度内 */ |
|||
min-height: 80vh; /* 设置最小高度 */ |
|||
overflow-x: hidden; |
|||
} |
|||
|
|||
.search-bar { |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.market-item { |
|||
width: 200px; /* 根据需要调整宽度 */ |
|||
} |
|||
|
|||
.market-select { |
|||
width: 100%; /* 确保 select 宽度与 form-item 一致 */ |
|||
} |
|||
|
|||
.table-container { |
|||
height: 600px; /* 根据需要调整高度 */ |
|||
overflow-y: auto; /* 启用垂直滚动条 */ |
|||
} |
|||
</style> |
@ -0,0 +1,322 @@ |
|||
<template> |
|||
<!-- 1代表活动进行中 0代表活动已结束 --> |
|||
|
|||
<el-card style="margin-top:50px; ; min-height: 90vh; max-height: 90vh; "> |
|||
<!-- <div style="width: 100%;"> --> |
|||
<!-- 活动管理 --> |
|||
<!-- 这里可以添加等级管理的具体内容 --> |
|||
<div class="gray-container"> |
|||
<div class="activity-header"> |
|||
<div class="header-text">活动设置:</div> |
|||
<el-button type="primary" @click="addActivityShow">添加活动</el-button> |
|||
</div> |
|||
<!-- 其他内容区域 --> |
|||
<div class="content-area"> |
|||
<el-table :data="currentPageData" style="width: auto" :row-style="{ height: '60px' }"> |
|||
<el-table-column prop="activityName" label="活动名称"></el-table-column> |
|||
<el-table-column prop="marketOne" label="股票一"></el-table-column> |
|||
<el-table-column prop="marketTwo" label="股票二"></el-table-column> |
|||
|
|||
<!-- ✅ 新增两列 --> |
|||
<el-table-column prop="startTime" label="开始时间"></el-table-column> |
|||
<el-table-column prop="endTime" label="结束时间"></el-table-column> |
|||
|
|||
<el-table-column label="数据统计"> |
|||
<template #default="scope"> |
|||
<a href="#" style="color: red;" @click.prevent="goToDetail(scope.row)">查看详情</a> |
|||
</template> |
|||
</el-table-column> |
|||
|
|||
<el-table-column label="设置数据"> |
|||
<template #default="{ $index }"> |
|||
<a href="#" style="color: red;" @click.prevent="goToSet">设置</a> |
|||
</template> |
|||
</el-table-column> |
|||
|
|||
<el-table-column label="状态"> |
|||
<template #default="{ row }"> |
|||
<el-switch |
|||
v-model="row.status" |
|||
:active-value="1" |
|||
:inactive-value="0" |
|||
active-color="#13ce66" |
|||
inactive-color="#ff4949" |
|||
@change="() => updateStatus(row)" |
|||
/> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<el-dialog |
|||
v-model="centerDialogVisible" |
|||
title="添加活动" |
|||
width="500" |
|||
align-center |
|||
@closed="cancel" |
|||
> |
|||
<el-form ref="addForm" :model="activity" label-width="80px"> |
|||
<el-form-item label="活动名称" prop="activityName"> |
|||
<el-input v-model="activity.activityName" placeholder="请输入活动名称" /> |
|||
</el-form-item> |
|||
<el-form-item label="股票一" prop="marketOne"> |
|||
<el-input v-model="activity.marketOne" placeholder="请输入股票一" /> |
|||
</el-form-item> |
|||
<el-form-item label="股票二" prop="marketTwo"> |
|||
<el-input v-model="activity.marketTwo" placeholder="请输入股票二" /> |
|||
</el-form-item> |
|||
<el-form-item label="活动状态" prop="status"> |
|||
<el-select v-model="activity.status" placeholder="请选择活动状态"> |
|||
<el-option label="启用" value="1" /> |
|||
<el-option label="禁用" value="0" /> |
|||
</el-select> |
|||
</el-form-item> |
|||
|
|||
<!-- 新增:开始时间 --> |
|||
<el-form-item label="开始时间" prop="startTime"> |
|||
<el-date-picker |
|||
v-model="activity.startTime" |
|||
type="datetime" |
|||
placeholder="请选择开始时间" |
|||
value-format="YYYY-MM-DD" |
|||
format="YYYY-MM-DD" |
|||
style="width: 100%" |
|||
/> |
|||
</el-form-item> |
|||
|
|||
<!-- 新增:结束时间 --> |
|||
<el-form-item label="结束时间" prop="endTime"> |
|||
<el-date-picker |
|||
v-model="activity.endTime" |
|||
type="datetime" |
|||
placeholder="请选择结束时间" |
|||
value-format="YYYY-MM-DD" |
|||
format="YYYY-MM-DD" |
|||
style="width: 100%" |
|||
/> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<div class="dialog-footer"> |
|||
<el-button @click="cancel">取消</el-button> |
|||
<el-button type="primary" @click="addActivity"> |
|||
提交 |
|||
</el-button> |
|||
</div> |
|||
</template> |
|||
</el-dialog> |
|||
</div> |
|||
</div> |
|||
<!-- 分页控件:移动到这里 --> |
|||
<el-pagination |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page="currentPage" |
|||
:page-sizes="[10, 20, 30, 50]" |
|||
:page-size="pageSize" |
|||
layout="total, sizes, prev, pager, next, jumper" |
|||
:total="tableData.length" |
|||
style="margin-top: 20px; text-align: center;" |
|||
/> |
|||
<!-- </div> --> |
|||
</el-card> |
|||
<router-view></router-view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, computed, onMounted } from 'vue'; |
|||
import { useRouter } from 'vue-router'; |
|||
import { getActivityList , changeStatusbyId ,addActivityandtime} from '@/api/manage/activity'; |
|||
import { ElMessage } from 'element-plus'; |
|||
import { useactivitytone } from '@/stone/activityStone'; |
|||
const router = useRouter(); |
|||
const centerDialogVisible = ref(false); |
|||
|
|||
// 表格数据(使用响应式 ref) |
|||
const tableData = ref([]); |
|||
const activityStone = useactivitytone(); |
|||
// 取消添加 |
|||
const cancel = () => { |
|||
centerDialogVisible.value = false; |
|||
resetForm(); |
|||
}; |
|||
|
|||
const resetForm = () => { |
|||
activity.value = { |
|||
activityName: '', |
|||
marketOne: '', |
|||
marketTwo: '', |
|||
status: '', |
|||
startTime: '', |
|||
endTime: '' |
|||
}; |
|||
} |
|||
const addActivityShow = () => { |
|||
centerDialogVisible.value = true; |
|||
}; |
|||
|
|||
// 添加活动 |
|||
const addActivity = async () => { |
|||
try { |
|||
const activityData = { |
|||
activityName: activity.value.activityName, |
|||
marketOne: activity.value.marketOne, |
|||
marketTwo: activity.value.marketTwo, |
|||
status: Number(activity.value.status), // 确保是数字 |
|||
startTime: activity.value.startTime, |
|||
endTime: activity.value.endTime |
|||
} |
|||
|
|||
const response = await addActivityandtime(activityData) |
|||
|
|||
if (response.code === 200) { |
|||
ElMessage.success('活动添加成功') |
|||
centerDialogVisible.value = false |
|||
fetchActivityList() // 刷新列表 |
|||
} else { |
|||
ElMessage.error(response.message || '活动添加失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('添加活动失败:', error) |
|||
ElMessage.error('请求失败,请重试') |
|||
} |
|||
} |
|||
|
|||
const activity = ref({ |
|||
activityName: '', |
|||
marketOne: '', |
|||
marketTwo: '', |
|||
status: '', |
|||
startTime: '', |
|||
endTime: '' |
|||
}) |
|||
|
|||
// 分页配置 |
|||
const currentPage = ref(1); |
|||
const pageSize = ref(10); // 每页显示 10 条 |
|||
|
|||
// 当前页数据 |
|||
const currentPageData = computed(() => { |
|||
const start = (currentPage.value - 1) * pageSize.value; |
|||
const end = start + pageSize.value; |
|||
return tableData.value.slice(start, end); |
|||
}); |
|||
|
|||
// 分页事件处理 |
|||
const handleSizeChange = (val) => { |
|||
pageSize.value = val; |
|||
}; |
|||
|
|||
const handleCurrentChange = (val) => { |
|||
currentPage.value = val; |
|||
}; |
|||
|
|||
// 跳转详情页方法 |
|||
const goToDetail = (row) => { |
|||
activityStone.setselectedactivity(row.id); |
|||
router.push({ name: 'activityDetail' }); |
|||
}; |
|||
|
|||
const goToSet = () => { |
|||
router.push({ name: 'activitySet' }); |
|||
}; |
|||
|
|||
// 获取活动列表 |
|||
const fetchActivityList = async () => { |
|||
try { |
|||
const response = await getActivityList(); |
|||
if (response.code === 200) { |
|||
tableData.value = response.data.map(item => ({ |
|||
id: item.id, |
|||
activityName: item.activityName, |
|||
marketOne: item.marketOne, |
|||
marketTwo: item.marketTwo, |
|||
status: Number(item.status), // 确保是数字类型用于 el-switch |
|||
startTime: item.startTime, |
|||
endTime: item.endTime |
|||
})); |
|||
} else { |
|||
console.error('获取活动列表失败:', response.message); |
|||
} |
|||
} catch (error) { |
|||
console.error('获取活动列表失败:', error); |
|||
} |
|||
}; |
|||
const updateStatus = async (row) => { |
|||
try { |
|||
const response = await changeStatusbyId(row.id, row.status) |
|||
if (response.code === 200) { |
|||
ElMessage.success('操作成功:修改状态成功') |
|||
} else if (response.code === 400) { |
|||
ElMessage.error(response.message || '当前有活动正在启用,修改状态失败') |
|||
// 回滚状态 |
|||
row.status = row.status === 1 ? 0 : 1 |
|||
} else { |
|||
ElMessage.error('状态修改失败') |
|||
row.status = row.status === 1 ? 0 : 1 |
|||
} |
|||
} catch (error) { |
|||
console.error('请求失败:', error) |
|||
ElMessage.error('请求失败,请重试') |
|||
// 出现异常时也回滚状态 |
|||
row.status = row.status === 1 ? 0 : 1 |
|||
} |
|||
} |
|||
|
|||
// 在组件挂载时请求数据 |
|||
onMounted(() => { |
|||
fetchActivityList(); |
|||
}); |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.gray-container { |
|||
width: 100%; /* 宽度自适应 */ |
|||
background-color: #ffffff; /* 浅灰色背景 */ |
|||
padding: 20px; /* 内边距 */ |
|||
box-sizing: border-box; /* 包含内边距在总宽度内 */ |
|||
min-height: 80vh; /* 设置最小高度 */ |
|||
overflow-x: hidden; |
|||
} |
|||
|
|||
.activity-header { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
margin-bottom: 20px; /* 与下方内容的间距 */ |
|||
} |
|||
|
|||
.header-text { |
|||
font-size: 1.5rem; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
.marginTop { |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
table { |
|||
width: 100%; |
|||
border-collapse: collapse; |
|||
} |
|||
|
|||
th, |
|||
td { |
|||
border: 1px solid #ddd; |
|||
padding: 8px; |
|||
text-align: left; |
|||
} |
|||
|
|||
th { |
|||
background-color: #f2f2f2; |
|||
} |
|||
|
|||
/* 新增样式:让分页控件在 .content-area 内居中显示 */ |
|||
.content-area { |
|||
position: relative; |
|||
} |
|||
|
|||
.content-area .el-pagination { |
|||
margin-top: 20px; |
|||
text-align: center; |
|||
} |
|||
</style> |
@ -0,0 +1,179 @@ |
|||
<template> |
|||
|
|||
<el-card style="margin-top:50px; min-height: 90vh; max-height: 90vh;"> |
|||
<div class="data-settings"> |
|||
<!-- 返回按钮 --> |
|||
|
|||
<br><br><br><br><br> |
|||
<el-button type="primary" @click="goBack"> |
|||
<i class="el-icon-back"></i> 返回 |
|||
</el-button> |
|||
|
|||
<h3>数据设置:</h3> |
|||
|
|||
<div class="setting-item"> |
|||
<label>设置初始数据:</label> |
|||
<el-input-number :precision="0" :min="0" v-model="initialData" placeholder="分钟" size="large"></el-input-number> |
|||
分钟 |
|||
|
|||
<el-button type="primary" @click="openInitialConfirmDialog">确认</el-button> |
|||
</div> |
|||
|
|||
<div class="setting-item"> |
|||
<label>当前美股助力次数:{{ usStockBoostCount }} 次</label> |
|||
<el-input-number :precision="0" :min="0" v-model="usStockAddCount" placeholder="设置添加次数" size="large"></el-input-number> |
|||
|
|||
<el-button type="primary" @click="openConfirmDialog('us')">确认</el-button> |
|||
|
|||
<label>前端展示次数:{{ usStockDisplayCount }} 次</label> |
|||
</div> |
|||
|
|||
<div class="setting-item"> |
|||
<label>当前港股助力次数:{{ hkStockBoostCount }} 次</label> |
|||
<el-input-number :precision="0" :min="0" v-model="hkStockAddCount" placeholder="设置添加次数" size="large"></el-input-number> |
|||
|
|||
<el-button type="primary" @click="openConfirmDialog('hk')">确认</el-button> |
|||
|
|||
<label>前端展示次数:{{ hkStockDisplayCount }} 次</label> |
|||
</div> |
|||
|
|||
<!-- 确认对话框 --> |
|||
<el-dialog v-model="showConfirmDialog" title="确认添加" width="30%"> |
|||
<span>您确定要添加这些次数吗?</span> |
|||
<template #footer> |
|||
<span class="dialog-footer"> |
|||
<el-button @click="showConfirmDialog = false">取 消</el-button> |
|||
<el-button type="primary" @click="confirmAdd">确 定</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
|
|||
<!-- 初始数据确认对话框 --> |
|||
<el-dialog v-model="showInitialConfirmDialog" title="确认设置初始数据" width="30%"> |
|||
<span>您确定要设置初始数据为 {{ initialData }} 分钟吗?</span> |
|||
<template #footer> |
|||
<span class="dialog-footer"> |
|||
<el-button @click="showInitialConfirmDialog = false">取 消</el-button> |
|||
<el-button type="primary" @click="confirmInitialData">确 定</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
</div> |
|||
</el-card> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref } from 'vue'; |
|||
import { useRouter } from 'vue-router'; |
|||
|
|||
const router = useRouter(); |
|||
|
|||
// 数据定义 |
|||
const initialData = ref(null); |
|||
const usStockBoostCount = ref(234); |
|||
const usStockAddCount = ref(null); |
|||
const usStockDisplayCount = ref(345); |
|||
|
|||
const hkStockBoostCount = ref(164); |
|||
const hkStockAddCount = ref(null); |
|||
const hkStockDisplayCount = ref(355); |
|||
|
|||
// 弹窗控制 |
|||
const showConfirmDialog = ref(false); |
|||
|
|||
const showInitialConfirmDialog = ref(false); |
|||
const pendingInitialData = ref(''); |
|||
let pendingAction = ref(null); // 存储待执行的操作类型 ('us' or 'hk') |
|||
|
|||
// 打开确认弹窗 |
|||
const openConfirmDialog = (type) => { |
|||
if ((type === 'us' && usStockAddCount.value) || (type === 'hk' && hkStockAddCount.value)) { |
|||
pendingAction.value = type; |
|||
showConfirmDialog.value = true; |
|||
} |
|||
}; |
|||
|
|||
// 打开初始数据确认弹窗 |
|||
const openInitialConfirmDialog = () => { |
|||
if (initialData.value) { |
|||
pendingInitialData.value = initialData.value; |
|||
showInitialConfirmDialog.value = true; |
|||
} |
|||
}; |
|||
|
|||
// 确定设置初始数据 |
|||
const confirmInitialData = () => { |
|||
// 这里可以发送请求或保存数据 |
|||
console.log('已设置初始数据:', pendingInitialData.value); |
|||
|
|||
// 清空输入框并关闭弹窗 |
|||
initialData.value = null; |
|||
showInitialConfirmDialog.value = false; |
|||
}; |
|||
|
|||
// 确定添加 |
|||
const confirmAdd = () => { |
|||
const type = pendingAction.value; |
|||
if (type === 'us') { |
|||
usStockBoostCount.value += parseInt(usStockAddCount.value); |
|||
usStockDisplayCount.value = usStockBoostCount.value; |
|||
usStockAddCount.value = null; |
|||
} else if (type === 'hk') { |
|||
hkStockBoostCount.value += parseInt(hkStockAddCount.value); |
|||
hkStockDisplayCount.value = hkStockBoostCount.value; |
|||
hkStockAddCount.value = null; |
|||
} |
|||
|
|||
// 清空动作并关闭弹窗 |
|||
pendingAction.value = null; |
|||
showConfirmDialog.value = false; |
|||
}; |
|||
|
|||
// 返回上一页 |
|||
const goBack = () => { |
|||
router.back(); |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.data-settings { |
|||
background-color: #ffffff; |
|||
padding: 40px; |
|||
border-radius: 16px; |
|||
width: 100%; |
|||
max-width: 800px; |
|||
margin: 0 auto; |
|||
font-size: 1.2rem; |
|||
} |
|||
|
|||
.setting-item { |
|||
margin-bottom: 25px; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: flex-start; |
|||
} |
|||
|
|||
.setting-item label { |
|||
margin-right: 20px; |
|||
font-size: 1.1rem; |
|||
} |
|||
|
|||
.setting-item input { |
|||
width: 150px; |
|||
height: 40px; |
|||
font-size: 1.1rem; |
|||
text-align: center; |
|||
margin-right: 20px; |
|||
} |
|||
|
|||
.el-button { |
|||
height: 40px; |
|||
font-size: 1.1rem; |
|||
padding: 0 20px; |
|||
} |
|||
|
|||
h3 { |
|||
font-size: 1.8rem; |
|||
margin-bottom: 20px; |
|||
} |
|||
</style> |
@ -0,0 +1,146 @@ |
|||
<template> |
|||
<div style="margin-bottom:30px"> |
|||
<el-button type="primary" @click="goBack" style="margin-right:20px">返回</el-button> |
|||
<span style="font-size: 1.5em; font-weight: bold;">导入内定用户</span> |
|||
</div> |
|||
<el-card style="min-height: 90vh; max-height: 90vh;"> |
|||
<div style="margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center;"> |
|||
<div style="display: flex; gap: 10px; align-items: center;"> |
|||
<span style="white-space: nowrap;">姓名:</span> |
|||
<el-input v-model="searchObj.name" placeholder="请输入姓名" style="width: 150px;" clearable></el-input> |
|||
|
|||
<span style="white-space: nowrap; margin-left: 10px;">精网号:</span> |
|||
<el-input v-model="searchObj.jwcode" placeholder="请输入精网号" style="width: 180px;" clearable |
|||
@input="trimJwcode"></el-input> |
|||
<el-button type="primary" @click="" style="margin-left: 10px;">搜索</el-button> |
|||
</div> |
|||
<div style="display: flex; gap: 10px;"> |
|||
<el-button type="primary" @click="addUser">添加用户</el-button> |
|||
<el-button type="success" @click="importExcel">导入Excel</el-button> |
|||
</div> |
|||
</div> |
|||
<!-- 用户表格 --> |
|||
<el-table :data="tableData" style="width: 100%;" :row-style="{ height: '60px' }"> |
|||
<el-table-column type="selection" width="200" /> |
|||
<el-table-column prop="id" label="ID" width="250" /> |
|||
<el-table-column prop="name" label="姓名" width="250" /> |
|||
<el-table-column prop="jwcode" label="精网号" width="300" /> |
|||
<el-table-column label="操作"> |
|||
<template #default="scope"> |
|||
<el-button size="small" type="danger" @click="deleteUser(scope.row)">删除</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<!-- 底部操作区域 --> |
|||
<div style="margin-top: 20px; display: flex; justify-content: space-between; align-items: center;"> |
|||
<el-button type="danger" @click="batchDelete">批量删除</el-button> |
|||
<div style="display: flex; align-items: center;"> |
|||
<span style="margin-right: 15px;">共{{ total }}条</span> |
|||
<el-select v-model="pageSize" style="width: 120px; margin-right: 15px;"> |
|||
<el-option label="10条/页" :value="10" /> |
|||
<el-option label="20条/页" :value="20" /> |
|||
<el-option label="50条/页" :value="50" /> |
|||
</el-select> |
|||
<el-pagination layout="prev, pager, next" :total="total" :page-size="pageSize" |
|||
v-model:current-page="currentPage" /> |
|||
<el-input v-model="jumpPage" style="width: 80px; margin-left: 15px; margin-right: 10px;" placeholder="页码" /> |
|||
<el-button type="primary" @click="goToPage">前往</el-button> |
|||
</div> |
|||
</div> |
|||
</el-card> |
|||
|
|||
<el-dialog v-model="addVisible" title="添加用户" width="500" align-center> |
|||
<el-form ref="addForm" :model="winuser" label-width="80px"> |
|||
<el-form-item label="姓名" prop="name"> |
|||
<el-input v-model="winuser.name" placeholder="请输入用户姓名" /> |
|||
</el-form-item> |
|||
<el-form-item label="精网号" prop="jwcode"> |
|||
<el-input v-model="winuser.jwcode" placeholder="请输入精网号" @input="trimJwcode" /> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<div class="dialog-footer"> |
|||
<el-button @click="cancel">取消</el-button> |
|||
<el-button type="primary" @click="addwinUser"> |
|||
确定 |
|||
</el-button> |
|||
</div> |
|||
</template> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, computed, onMounted } from 'vue' |
|||
import { useRouter } from 'vue-router' |
|||
import { usegiftFixedListStone } from '@/stone/giftFixedListStone'; |
|||
import { getFixUserList } from '@/api/manage/gift' |
|||
const giftStore = usegiftFixedListStone(); |
|||
const router = useRouter() |
|||
|
|||
const addVisible = ref(false) |
|||
const tableData = ref([]) |
|||
const pagination = ref({ |
|||
pageNum: 1, |
|||
pageSize: 10, |
|||
total:0 |
|||
}) |
|||
// 搜索对象 |
|||
const searchObj = ref({ |
|||
username: '', |
|||
jwcode: '', |
|||
}) |
|||
// 查全部 |
|||
const getFixUsers = async () => { |
|||
try { |
|||
const res = await getFixUserList({ |
|||
username: searchObj.value.username, |
|||
password: searchObj.value.jwcode, |
|||
pageNum: pagination.value.pageNum, |
|||
pageSize: pagination.value.pageSize |
|||
}) |
|||
|
|||
if (res.code === 200) { |
|||
tableData.value = res.data.list |
|||
pagination.value.total = res.data.total |
|||
} else { |
|||
ElMessage.error(res.message || '获取数据失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('请求失败:', error) |
|||
ElMessage.error('请求失败,请重试') |
|||
} |
|||
} |
|||
// 跳转到指定页 |
|||
const goToPage = () => { |
|||
const page = parseInt(jumpPage.value) |
|||
if (!isNaN(page) && page > 0 && page <= Math.ceil(total.value / pageSize.value)) { |
|||
currentPage.value = page |
|||
} |
|||
jumpPage.value = '' |
|||
} |
|||
const trimJwcode = (value) => { |
|||
searchObj.value.jwcode = value.replace(/\D/g, '') |
|||
} |
|||
// 返回上一页 |
|||
const goBack = () => { |
|||
router.back() |
|||
} |
|||
onMounted(() => { |
|||
getFixUsers() |
|||
}) |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.el-card { |
|||
border-radius: 8px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
} |
|||
|
|||
.el-table { |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
.el-pagination { |
|||
margin: 0; |
|||
} |
|||
</style> |
@ -0,0 +1,233 @@ |
|||
<template> |
|||
<div style="margin-bottom:30px"> |
|||
<el-button type="primary" @click="goBack" style="margin-right:20px">返回</el-button> |
|||
<span style="font-size: 1.5em; font-weight: bold;">导入抽奖用户</span> |
|||
</div> |
|||
<el-card> |
|||
<div style="margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center;"> |
|||
<div> |
|||
姓名:<el-input v-model="searchObj.username" placeholder="请输入姓名" style="width: 150px;margin-right:10px" clearable></el-input> |
|||
精网号:<el-input v-model="searchObj.jwcode" placeholder="请输入精网号" style="width: 180px;" clearable @input="trimJwcode"></el-input> |
|||
<el-button type="primary" @click="getUsers" style="margin-left: 10px;">搜索</el-button> |
|||
</div> |
|||
<div style="display: flex; gap: 10px;" fixed:right> |
|||
<el-button type="primary" @click="openAdd">添加用户</el-button> |
|||
<el-button type="success" @click="importExcel">导入Excel</el-button> |
|||
</div> |
|||
</div> |
|||
<!-- 用户表格 --> |
|||
<el-table :data="tableData" style="width: 100%;" :row-style="{ height: '60px' }" @selection-change="handleSelectionChange"> |
|||
<el-table-column type="selection" width="70" /> |
|||
<el-table-column type="index" label="ID" width="200" /> |
|||
<el-table-column prop="username" label="姓名" width="200" /> |
|||
<el-table-column prop="jwcode" label="精网号" width="200" /> |
|||
<el-table-column label="操作" fixed="right"> |
|||
<template #default="scope"> |
|||
<el-button text type="danger" @click="delUser(scope.row)">删除</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<!-- 底部操作区域 --> |
|||
<div style="margin-top: 20px; display: flex; justify-content: space-between; align-items: center;"> |
|||
<el-button text type="danger" @click="batchDelete">批量删除</el-button> |
|||
<div style="display: flex; align-items: center;"> |
|||
<span style="margin-right: 15px;">共{{ pagination.total }}条</span> |
|||
<el-select v-model="pagination.pageSize" style="width: 120px; margin-right: 15px;"> |
|||
<el-option label="10条/页" :value="10" /> |
|||
<el-option label="20条/页" :value="20" /> |
|||
<el-option label="50条/页" :value="50" /> |
|||
</el-select> |
|||
<el-pagination layout="prev, pager, next" :total="pagination.total" :page-size="pagination.pageSize" v-model:current-page="currentPage" /> |
|||
<el-input v-model="jumpPage" style="width: 80px; margin-left: 15px; margin-right: 10px;" placeholder="页码" /> |
|||
<el-button type="primary" @click="goToPage">前往</el-button> |
|||
</div> |
|||
</div> |
|||
</el-card> |
|||
<el-dialog v-model="addVisible" title="添加用户" width="500" align-center> |
|||
<el-form ref="addForm" :model="addObj" label-width="80px"> |
|||
<el-form-item label="姓名" prop="username"> |
|||
<el-input v-model="addObj.username" placeholder="请输入用户姓名" /> |
|||
</el-form-item> |
|||
<el-form-item label="精网号" prop="jwcode"> |
|||
<el-input v-model="addObj.jwcode" placeholder="请输入用户精网号" @input="trimJwcode" /> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<div class="dialog-footer"> |
|||
<el-button @click="addVisible = false">取消</el-button> |
|||
<el-button type="primary" @click="submitAdd">确定</el-button> |
|||
</div> |
|||
</template> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, computed, onMounted } from 'vue' |
|||
import { useRouter } from 'vue-router' |
|||
import { getUserList, addUser, deleteUser, deleteUsers } from '@/api/manage/gift'; |
|||
import { ElMessage, ElMessageBox } from 'element-plus' |
|||
const router = useRouter() |
|||
const addVisible = ref(false) |
|||
const tableData = ref([]) |
|||
// 存批量删除的id们 |
|||
const selectedIds = ref([]) |
|||
// 搜索对象 |
|||
const searchObj = ref({ |
|||
username: '', |
|||
jwcode: '', |
|||
}) |
|||
const addObj = ref({ |
|||
username: '', |
|||
jwcode: '', |
|||
}) |
|||
const pagination = ref({ |
|||
pageNum: 1, |
|||
pageSize: 10, |
|||
total:0 |
|||
}) |
|||
const openAdd = () => { |
|||
addObj.value = {} |
|||
addVisible.value = true |
|||
} |
|||
// 查全部 |
|||
const getUsers = async () => { |
|||
try { |
|||
const res = await getUserList({ |
|||
username: searchObj.value.username, |
|||
jwcode: searchObj.value.jwcode, |
|||
pageNum: pagination.value.pageNum, |
|||
pageSize: pagination.value.pageSize |
|||
}) |
|||
|
|||
if (res.code === 200) { |
|||
tableData.value = res.data.list |
|||
pagination.value.total = res.data.total |
|||
} else { |
|||
ElMessage.error(res.message || '获取数据失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('请求失败:', error) |
|||
ElMessage.error('请求失败,请重试') |
|||
} |
|||
} |
|||
// 添加 |
|||
const submitAdd = async () => { |
|||
if (!addObj.value.username || addObj.value.jwcode === '') { |
|||
ElMessage.error('请填写完整信息') |
|||
return |
|||
} |
|||
try { |
|||
const data = { |
|||
username: addObj.value.username, |
|||
jwcode: addObj.value.jwcode |
|||
} |
|||
console.log('看看添加参数',data) |
|||
const response = await addUser(data) |
|||
if (response.code === 200) { |
|||
ElMessage.success('添加成功') |
|||
addVisible.value = false |
|||
getUsers() |
|||
} else { |
|||
ElMessage.error(response.message || '添加失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('添加等级失败:', error) |
|||
ElMessage.error('添加失败,请重试') |
|||
} |
|||
} |
|||
// 删除用户 |
|||
const delUser = (row) => { |
|||
ElMessageBox.confirm('确定要删除该用户吗?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(async () => { |
|||
try { |
|||
const id = String(row.id) |
|||
console.log('删除等级的id是:', id) |
|||
const response = await deleteUser(id) |
|||
if (response.code === 200) { |
|||
ElMessage.success('删除成功') |
|||
getUsers() |
|||
} else { |
|||
ElMessage.error(response.message || '删除失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('删除失败:', error) |
|||
ElMessage.error('删除失败,请重试') |
|||
} |
|||
}).catch(() => { |
|||
ElMessage.info('已取消删除') |
|||
}) |
|||
} |
|||
// 批量删除 |
|||
const batchDelete = async () => { |
|||
if (selectedIds.value.length === 0) { |
|||
ElMessage.warning('请先选择需要删除的用户') |
|||
return |
|||
} |
|||
|
|||
ElMessageBox.confirm(`确定要删除选中的${selectedIds.value.length}条数据吗?`,// 为啥是$?? |
|||
'删除确认', |
|||
{ |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
} |
|||
).then(async () => { |
|||
try { |
|||
const response = await deleteUsers(selectedIds.value.join(',')) |
|||
console.log(selectedIds.value.join(',')) |
|||
if (response.code === 200) { |
|||
ElMessage.success('批量删除成功') |
|||
getUsers() |
|||
selectedIds.value = [] |
|||
} else { |
|||
ElMessage.error(response.message || '批量删除失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('批量删除请求失败:', error) |
|||
ElMessage.error('网络错误,批量删除失败') |
|||
} |
|||
}).catch(() => { |
|||
ElMessage.info('已取消批量删除') |
|||
}) |
|||
} |
|||
const goBack = () => { |
|||
router.back() |
|||
} |
|||
// 跳转到指定页 |
|||
const goToPage = () => { |
|||
const page = parseInt(jumpPage.value) |
|||
if (!isNaN(page) && page > 0 && page <= Math.ceil(total.value / pageSize.value)) { |
|||
currentPage.value = page |
|||
} |
|||
jumpPage.value = '' |
|||
} |
|||
const handleSelectionChange = (selection) => { |
|||
// 提取选中行的id组成数组 |
|||
selectedIds.value = selection.map(row => row.id) |
|||
} |
|||
const trimJwcode = (value) => { |
|||
searchObj.value.jwcode = value.replace(/\D/g, '') |
|||
} |
|||
onMounted(() => { |
|||
getUsers() |
|||
}) |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.el-card { |
|||
border-radius: 8px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
} |
|||
|
|||
.el-table { |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
.el-pagination { |
|||
margin: 0; |
|||
} |
|||
</style> |
@ -0,0 +1,416 @@ |
|||
<template> |
|||
<h2>礼品管理</h2> |
|||
<el-card style="min-height: 90vh; max-height: 90vh; display: flex; flex-direction: column;"> |
|||
<div class="gift-management-container" style="flex: 1; overflow-y: auto;"> |
|||
<div class="action-buttons"> |
|||
<el-button type="primary" @click="showAdd">添加礼品</el-button> |
|||
<el-button type="primary" @click="goToimportUsers">导入抽奖用户</el-button> |
|||
</div> |
|||
<div class="table-container" style="flex: 1; overflow-y: auto;"> |
|||
<el-table :data="tableData" style="width: 100%" class="gift-table"> |
|||
<el-table-column type="index" label="ID" width="100" align="center"></el-table-column> |
|||
<el-table-column label="礼品图片" width="200" align="center"> |
|||
<template #default="scope"> |
|||
<img v-if="scope.row.imageUrl" :src="scope.row.imageUrl" |
|||
style="max-width: 100px; max-height: 30px;"> |
|||
<el-icon v-else :size="20" color="#67C23A"> |
|||
<Check /> |
|||
</el-icon> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="prizeName" label="名称" width="300" align="center"></el-table-column> |
|||
<el-table-column prop="gradeName" label="等级" width="200" align="center"></el-table-column> |
|||
<el-table-column label="操作" align="center"> |
|||
<template #default="scope"> |
|||
<el-button type="primary" text @click="goToimportFixedList(scope.row)">导入内定名单</el-button> |
|||
<el-button type="warning" text @click="editGift(scope.row)">编辑</el-button> |
|||
<el-button type="danger" text @click="deleteGift(scope.row)">删除</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</div> |
|||
<el-pagination class="pagination" v-model:current-page="pagination.pageNum" v-model:page-size="pagination.pageSize" |
|||
layout="total, sizes, prev, pager, next, jumper" :total="pagination.total" :page-sizes="[10, 20, 50, 100]" |
|||
@size-change="handleSizeChange" @current-change="handleCurrentChange"> |
|||
</el-pagination> |
|||
|
|||
<!-- 添加 --> |
|||
<el-dialog v-model="addVisible" :title="dialogTitle" width="40%"> |
|||
<el-form :model="addForm" label-width="100px" ref="formRef"> |
|||
<el-form-item label="礼品名称" :rules="{ required: true, message: '请输入礼品名称', trigger: 'blur' }"> |
|||
<el-input v-model="addForm.prizeName" placeholder="请输入礼品名称"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="礼品等级" :rules="{ required: true, message: '请选择礼品等级', trigger: 'change' }"> |
|||
<el-select v-model="addForm.gradeId" placeholder="请选择礼品等级"> |
|||
<el-option v-for="item in gradeNames" :key="item.id" :label="item.gradeName" :value="item.id"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="礼品图片" :rules="{ required: true, message: '请上传图片', trigger: 'change' }"> |
|||
<el-upload |
|||
ref="uploadRef" |
|||
:action="uploadUrl" |
|||
list-type="picture-card" |
|||
:auto-upload="false" |
|||
:on-change="handleImageChange" |
|||
:on-success="handleUploadSuccess" |
|||
:on-error="handleUploadError" |
|||
:before-upload="beforeUpload" |
|||
:show-file-list="false"> |
|||
<el-icon> |
|||
<Plus /> |
|||
</el-icon> |
|||
<template #tip> |
|||
<div class="el-upload__tip"> |
|||
只能上传jpg、png格式的图片,且不超过500KB |
|||
</div> |
|||
</template> |
|||
</el-upload> |
|||
<div v-if="addForm.imageUrl" class="upload-preview"> |
|||
<img :src="addForm.imageUrl" alt="预览图" style="max-width: 200px; margin-top: 10px; border-radius: 4px;"> |
|||
</div> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<span class="dialog-footer"> |
|||
<el-button @click="addVisible = false">取消</el-button> |
|||
<el-button type="primary" @click="submitAdd">确认</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
|
|||
<!-- 编辑 --> |
|||
<el-dialog v-model="editVisible" :title="dialogTitle" width="40%"> |
|||
<el-form :model="editForm" label-width="100px" ref="formRef"> |
|||
<el-form-item label="礼品名称" :rules="{ required: true, message: '请输入礼品名称', trigger: 'blur' }"> |
|||
<el-input v-model="editForm.prizeName" placeholder="请输入礼品名称"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="礼品等级" :rules="{ required: true, message: '请选择礼品等级', trigger: 'change' }"> |
|||
<el-select v-model="editForm.gradeId" placeholder="请选择礼品等级"> |
|||
<el-option v-for="item in gradeNames" :key="item.id" :label="item.gradeName" :value="item.id"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="礼品图片" :rules="{ required: true, message: '请上传图片', trigger: 'change' }"> |
|||
<el-upload |
|||
ref="uploadRef" |
|||
:action="uploadUrl" |
|||
list-type="picture-card" |
|||
:auto-upload="false" |
|||
:on-change="handleImageChange" |
|||
:on-success="handleUploadSuccess" |
|||
:on-error="handleUploadError" |
|||
:before-upload="beforeUpload" |
|||
:show-file-list="false"> |
|||
<el-icon> |
|||
<Plus /> |
|||
</el-icon> |
|||
<template #tip> |
|||
<div class="el-upload__tip"> |
|||
只能上传jpg、png格式的图片,且不超过500KB |
|||
</div> |
|||
</template> |
|||
</el-upload> |
|||
<div v-if="editForm.imageUrl" class="upload-preview"> |
|||
<img :src="editForm.imageUrl" alt="预览图" style="max-width: 200px; margin-top: 10px; border-radius: 4px;"> |
|||
</div> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<span class="dialog-footer"> |
|||
<el-button @click="editVisible = false">取消</el-button> |
|||
<el-button type="primary" @click="submitEdit">确认</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
</el-card> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, computed, onMounted } from 'vue' |
|||
import { Check, Plus } from '@element-plus/icons-vue' |
|||
import { ElMessage, ElMessageBox } from 'element-plus' |
|||
import { useRouter } from 'vue-router'; |
|||
import { usegiftFixedListStone } from '@/stone/giftFixedListStone'; |
|||
import { getPrizeList, addPrize, deletePrize, updatePrize } from '@/api/manage/gift'; |
|||
import { getGradeNameList } from '@/api/manage/level'; |
|||
|
|||
const router = useRouter(); |
|||
const gradeNames = ref([]) |
|||
const tableData = ref([]) |
|||
const giftStore = usegiftFixedListStone(); |
|||
const pagination = ref({ |
|||
pageNum: 1, |
|||
pageSize: 10, |
|||
total: 0 |
|||
}) |
|||
const addVisible = ref(false) |
|||
const editVisible = ref(false) |
|||
const dialogTitle = ref('添加礼品') |
|||
const addForm = ref({ |
|||
prizeName: '', |
|||
gradeId: '', |
|||
imageUrl: null |
|||
}) |
|||
const editForm = ref({ |
|||
prizeName: '', |
|||
gradeId: '', |
|||
imageUrl: null |
|||
}) |
|||
const uploadUrl = 'http://39.101.133.168:8828/hljw/api/aws/upload'; |
|||
const formRef = ref(null) |
|||
const uploadRef = ref(null) |
|||
|
|||
const showAdd = () => { |
|||
dialogTitle.value = '添加礼品' |
|||
addForm.value = { |
|||
prizeName: '', |
|||
gradeId: '', |
|||
imageUrl: null |
|||
} |
|||
addVisible.value = true |
|||
} |
|||
|
|||
const editGift = (row) => { |
|||
dialogTitle.value = '编辑礼品' |
|||
editForm.value = { |
|||
id: row.id, |
|||
prizeName: row.prizeName, |
|||
gradeId: row.gradeId, |
|||
imageUrl: row.imageUrl |
|||
} |
|||
editVisible.value = true |
|||
} |
|||
|
|||
// 查全部 |
|||
const getPrizes = async () => { |
|||
try { |
|||
const res = await getPrizeList({ |
|||
pageNum: pagination.value.pageNum, |
|||
pageSize: pagination.value.pageSize |
|||
}) |
|||
|
|||
if (res.code === 200) { |
|||
tableData.value = res.data.list |
|||
pagination.value.total = res.data.total |
|||
} else { |
|||
ElMessage.error(res.message || '获取数据失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('请求失败:', error) |
|||
ElMessage.error('请求失败,请重试') |
|||
} |
|||
} |
|||
|
|||
// 等级下拉框 |
|||
const getGradeNames = async () => { |
|||
try { |
|||
const res = await getGradeNameList() |
|||
|
|||
if (res.code === 200) { |
|||
gradeNames.value = res.data |
|||
} else { |
|||
ElMessage.error(res.message || '获取下拉框失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('获取下拉框失败:', error) |
|||
ElMessage.error('获取下拉框失败') |
|||
} |
|||
} |
|||
|
|||
// 添加 |
|||
const submitAdd = async () => { |
|||
formRef.value.validate((valid) => { |
|||
if (!valid) return false; |
|||
|
|||
if (!addForm.value.imageUrl) { |
|||
ElMessage.error('请上传图片'); |
|||
return; |
|||
} |
|||
try { |
|||
const data = { |
|||
prizeName: addForm.value.prizeName, |
|||
gradeId: String(addForm.value.gradeId), |
|||
imageUrl: addForm.value.imageUrl |
|||
} |
|||
console.log('添加参数:', data) |
|||
addPrize(data).then(response => { |
|||
if (response.code === 200) { |
|||
ElMessage.success('添加成功') |
|||
addVisible.value = false |
|||
getPrizes() |
|||
} else { |
|||
ElMessage.error(response.message || '添加失败') |
|||
} |
|||
}).catch(error => { |
|||
console.error('添加失败:', error) |
|||
ElMessage.error('添加失败,请重试') |
|||
}) |
|||
} catch (error) { |
|||
console.error('添加失败:', error) |
|||
ElMessage.error('添加失败,请重试') |
|||
} |
|||
}); |
|||
} |
|||
// 删除 |
|||
const deleteGift = (row) => { |
|||
ElMessageBox.confirm('确定要删除该等级吗?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(async () => { |
|||
try { |
|||
const id = String(row.id) |
|||
console.log('删除礼品的id是:', id) |
|||
const response = await deletePrize(id) |
|||
if (response.code === 200) { |
|||
ElMessage.success('删除成功') |
|||
getPrizes() |
|||
} else { |
|||
ElMessage.error(response.message || '删除失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('删除失败:', error) |
|||
ElMessage.error('删除失败,请重试') |
|||
} |
|||
}).catch(() => { |
|||
ElMessage.info('已取消删除') |
|||
}) |
|||
} |
|||
// 编辑 |
|||
const submitEdit = async () => { |
|||
formRef.value.validate((valid) => { |
|||
if (!valid) return false; |
|||
if (!editForm.value.imageUrl) { |
|||
ElMessage.error('请上传图片'); |
|||
return; |
|||
} |
|||
try { |
|||
const data = { |
|||
id: editForm.value.id, |
|||
prizeName: editForm.value.prizeName, |
|||
gradeId: String(editForm.value.gradeId), |
|||
imageUrl: editForm.value.imageUrl |
|||
} |
|||
console.log('添加参数:', data) |
|||
updatePrize(data).then(response => { |
|||
if (response.code === 200) { |
|||
ElMessage.success('编辑成功') |
|||
editVisible.value = false |
|||
getPrizes() |
|||
} else { |
|||
ElMessage.error(response.message || '编辑失败') |
|||
} |
|||
}) |
|||
} catch (error) { |
|||
console.error('编辑失败:', error) |
|||
ElMessage.error('编辑失败,请重试') |
|||
} |
|||
}); |
|||
} |
|||
const goToimportFixedList = (row) => { |
|||
giftStore.setFixedGiftName(row.name); |
|||
router.push({ name: 'importFixedList' }); |
|||
} |
|||
|
|||
const goToimportUsers = () => { |
|||
router.push({ name: 'importUsers' }); |
|||
} |
|||
|
|||
const handleImageChange = (file) => { |
|||
uploadRef.value.submit(); |
|||
} |
|||
const handleUploadSuccess = (response, file, fileList) => { |
|||
if (response.code === 200) { |
|||
if (addVisible.value) { |
|||
addForm.value.imageUrl = response.data.url; |
|||
} else if (editVisible.value) { |
|||
editForm.value.imageUrl = response.data.url; |
|||
} |
|||
ElMessage.success('图片上传成功'); |
|||
} else { |
|||
if (addVisible.value) { |
|||
addForm.value.imageUrl = null; |
|||
} else if (editVisible.value) { |
|||
editForm.value.imageUrl = null; |
|||
} |
|||
ElMessage.error(response.message || '图片上传失败'); |
|||
} |
|||
} |
|||
|
|||
const handleUploadError = (error) => { |
|||
console.error('上传失败:', error); |
|||
if (addVisible.value) { |
|||
addForm.value.imageUrl = null; |
|||
} else if (editVisible.value) { |
|||
editForm.value.imageUrl = null; |
|||
} |
|||
ElMessage.error('图片上传失败,请重试'); |
|||
} |
|||
|
|||
const beforeUpload = (file) => { |
|||
const isJPG = file.type === 'image/jpeg'; |
|||
const isPNG = file.type === 'image/png'; |
|||
const isLt500K = file.size / 1024 < 500; |
|||
|
|||
if (!isJPG && !isPNG) { |
|||
ElMessage.error('上传图片只能是 JPG 或 PNG 格式!'); |
|||
return false; |
|||
} |
|||
if (!isLt500K) { |
|||
ElMessage.error('上传图片大小不能超过 500KB!'); |
|||
return false; |
|||
} |
|||
return true; |
|||
} |
|||
|
|||
const handleSizeChange = (val) => { |
|||
pagination.value.pageSize = val |
|||
pagination.value.pageNum = 1 |
|||
} |
|||
|
|||
const handleCurrentChange = (val) => { |
|||
pagination.value.pageNum = val |
|||
} |
|||
|
|||
onMounted(() => { |
|||
getPrizes() |
|||
getGradeNames() |
|||
}) |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.gift-management-container { |
|||
padding: 20px; |
|||
width: 100%; |
|||
box-sizing: border-box; |
|||
min-height: 80vh; |
|||
} |
|||
|
|||
.pagination-container { |
|||
padding: 10px 20px; |
|||
background-color: #fff; |
|||
border-top: 1px solid #ebeef5; |
|||
display: flex; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.action-buttons { |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.table-container { |
|||
max-height: 600px; |
|||
overflow-y: auto; |
|||
} |
|||
|
|||
/* 添加图片样式 */ |
|||
img { |
|||
max-height: 80px; |
|||
object-fit: contain; |
|||
border-radius: 4px; |
|||
} |
|||
|
|||
.upload-preview { |
|||
margin-top: 10px; |
|||
} |
|||
</style> |
@ -0,0 +1,101 @@ |
|||
|
|||
<script setup> |
|||
import { |
|||
Promotion, |
|||
Location, |
|||
Menu as IconMenu, |
|||
Document, |
|||
Setting |
|||
} from '@element-plus/icons-vue' |
|||
import { useRouter } from 'vue-router' |
|||
const router = useRouter() |
|||
const handleOpen = (key, keyPath) => { |
|||
// console.log('菜单打开:', key, keyPath) |
|||
} |
|||
const handleClose = (key, keyPath) => { |
|||
// console.log('菜单关闭:', key, keyPath) |
|||
} |
|||
|
|||
|
|||
</script> |
|||
|
|||
<template> |
|||
<div class="common-layout"> |
|||
<el-container class="el-container"> |
|||
<!-- 左侧菜单 --> |
|||
<el-aside class="aside"> |
|||
<el-menu |
|||
active-text-color="#ffd04b" |
|||
background-color="#545c64" |
|||
class="el-menu-vertical-demo" |
|||
default-active="/index" |
|||
text-color="#fff" |
|||
@open="handleOpen" |
|||
@close="handleClose" |
|||
style="height: 100%;" |
|||
router |
|||
> |
|||
<el-menu-item index="/zhongchou/mainimg" > |
|||
<el-icon><Promotion /></el-icon> |
|||
<span>后台管理系统</span> |
|||
</el-menu-item> |
|||
|
|||
<el-menu-item index="/zhongchou/levelManagement" > |
|||
<el-icon><location /></el-icon> |
|||
<span>等级管理</span> |
|||
</el-menu-item> |
|||
|
|||
<el-menu-item index="/zhongchou/giftManagement" > |
|||
<el-icon><icon-menu /></el-icon> |
|||
<span>礼品管理</span> |
|||
</el-menu-item> |
|||
|
|||
<el-menu-item index="/zhongchou/winningManagement"> |
|||
<el-icon><document /></el-icon> |
|||
<span>中奖管理</span> |
|||
</el-menu-item> |
|||
|
|||
<el-menu-item index="/zhongchou/activityManagement"> |
|||
<el-icon><setting /></el-icon> |
|||
<span>众筹活动</span> |
|||
</el-menu-item> |
|||
</el-menu> |
|||
</el-aside> |
|||
|
|||
<el-main class="el-main"> |
|||
<router-view></router-view> |
|||
</el-main> |
|||
</el-container> |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped> |
|||
a { |
|||
color: white; |
|||
text-decoration: none; |
|||
} |
|||
|
|||
.aside { |
|||
width: 220px; |
|||
border-right: 1px solid #ccc; |
|||
min-height: 100vh; |
|||
} |
|||
|
|||
.common-layout { |
|||
height: 100vh; |
|||
overflow: hidden; |
|||
width: 100vw; |
|||
} |
|||
|
|||
.el-container { |
|||
display: flex; |
|||
flex-direction: row; |
|||
height: 100%; |
|||
} |
|||
|
|||
.el-main { |
|||
flex: 1; /* 关键:自动撑满剩余空间 */ |
|||
padding: 20px; |
|||
overflow: auto; |
|||
} |
|||
</style> |
@ -0,0 +1,279 @@ |
|||
<template> |
|||
<h2>等级管理</h2> |
|||
<el-card style="min-height: 90vh; max-height: 90vh; display: flex; flex-direction: column;"> |
|||
<div class="level-management-container" style="flex: 1; overflow-y: auto;"> |
|||
<!-- 添加等级按钮 --> |
|||
<div class="action-buttons"> |
|||
<el-button type="primary" @click="showAddDialog">添加等级</el-button> |
|||
</div> |
|||
|
|||
<!-- 等级表格 --> |
|||
<div class="table-container"> |
|||
<el-table :data="tableData" style="width: 100%" :row-style="{ height: '55px' }"> |
|||
<el-table-column type="index" label="ID" width="100px" fixed="left" /> |
|||
<el-table-column prop="gradeName" label="等级名称" width="200" align="center" /> |
|||
<el-table-column prop="amount" label="数量" width="250" align="center" /> |
|||
<el-table-column prop="perWin" label="每轮抽取人数" width="300" align="center" /> |
|||
<el-table-column prop="sort" label="排序" width="200" align="center" /> |
|||
<el-table-column prop="operation" fixed="right" label="操作" align="center"> |
|||
<template #default="scope"> |
|||
<div style="display: flex; gap: 10px; justify-content: center;"> |
|||
<el-button text type="warning" @click="editLevel(scope.row)">编辑</el-button> |
|||
<el-button text type="danger" @click="deleteLevel(scope.row)">删除</el-button> |
|||
</div> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</div> |
|||
|
|||
<!-- 分页 --> |
|||
<el-pagination class="pagination" v-model:current-page="pagination.pageNum" v-model:page-size="pagination.pageSize" |
|||
layout="total, sizes, prev, pager, next, jumper" :total="pagination.total" :page-sizes="[10, 20, 50, 100]" |
|||
@size-change="handleSizeChange" @current-change="handleCurrentChange" /> |
|||
|
|||
<!-- 添加 --> |
|||
<el-dialog v-model="addVisible" :title="dialogTitle" width=400px @closed="resetForm"> |
|||
<el-form :model="addForm" label-width="120px"> |
|||
<el-form-item label="等级名称" align="center"> |
|||
<el-input v-model="addForm.gradeName" placeholder="请输入等级名称"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="数量" align="center"> |
|||
<el-input v-model="addForm.amount" :precision="0" :min="0" placeholder="请输入数量" |
|||
style="width: 100%;"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="每轮抽取人数" align="center"> |
|||
<el-input v-model="addForm.perWin" :precision="0" :min="0" placeholder="请输入抽取人数" |
|||
style="width: 100%;"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="排序" align="center"> |
|||
<el-input v-model="addForm.sort" :precision="0" :min="0" placeholder="请输入排序等级" |
|||
style="width: 100%;"></el-input> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<span> |
|||
<el-button @click="addVisible = false">取消</el-button> |
|||
<el-button type="primary" @click="submitAdd">确认</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
<!-- 编辑 --> |
|||
<el-dialog v-model="editVisible" :title="dialogTitle" width=400px @closed="resetForm"> |
|||
<el-form :model="editForm" label-width="120px"> |
|||
<el-form-item label="等级名称" align="center"> |
|||
<el-input v-model="editForm.gradeName" placeholder="请输入等级名称"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="数量" align="center"> |
|||
<el-input v-model="editForm.amount" :precision="0" :min="0" placeholder="请输入数量" |
|||
style="width: 100%;"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="每轮抽取人数" align="center"> |
|||
<el-input v-model="editForm.perWin" :precision="0" :min="0" placeholder="请输入抽取人数" |
|||
style="width: 100%;"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="排序" align="center"> |
|||
<el-input v-model="editForm.sort" :precision="0" :min="0" placeholder="请输入排序等级" |
|||
style="width: 100%;"></el-input> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<span> |
|||
<el-button @click="editVisible = false">取消</el-button> |
|||
<el-button type="primary" @click="submitEdit">确认</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
|
|||
</el-card> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, computed, onMounted } from 'vue' |
|||
import { ElMessage, ElMessageBox } from 'element-plus' |
|||
import { getLevelList, addLevel, deleteGrade, updateGrade } from '@/api/manage/level' |
|||
const tableData = ref([]) |
|||
const pagination = ref({ |
|||
pageNum: 1, |
|||
pageSize: 10, |
|||
total:0 |
|||
}) |
|||
|
|||
const addVisible = ref(false) |
|||
const editVisible = ref(false) |
|||
const dialogTitle = ref('') |
|||
const addForm = ref({ |
|||
gradeName: '', |
|||
amount: '', |
|||
perWin: '', |
|||
sort: '' |
|||
}) |
|||
const editForm = ref({}) |
|||
// 显示添加对话框 |
|||
const showAddDialog = () => { |
|||
dialogTitle.value = '添加等级' |
|||
addVisible.value = true |
|||
} |
|||
|
|||
// 显示编辑对话框 |
|||
const editLevel = (row) => { |
|||
dialogTitle.value = '编辑等级' |
|||
editForm.value = { |
|||
id: row.id, |
|||
gradeName: row.gradeName, |
|||
amount: row.amount, |
|||
perWin: row.perWin, |
|||
sort: row.sort |
|||
} |
|||
editVisible.value = true |
|||
} |
|||
// 查全部 |
|||
const getLevels = async () => { |
|||
try { |
|||
const res = await getLevelList({ |
|||
pageNum: pagination.value.pageNum, |
|||
pageSize: pagination.value.pageSize |
|||
}) |
|||
|
|||
if (res.code === 200) { |
|||
tableData.value = res.data.list |
|||
pagination.value.total = res.data.total |
|||
} else { |
|||
ElMessage.error(res.message || '获取数据失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('请求失败:', error) |
|||
ElMessage.error('请求失败,请重试') |
|||
} |
|||
} |
|||
// 添加 |
|||
const submitAdd = async () => { |
|||
if (!addForm.value.gradeName || addForm.value.amount === '' || addForm.value.sort === '' || addForm.value.perWin === '') { |
|||
ElMessage.error('请填写完整信息') |
|||
return |
|||
} |
|||
try { |
|||
const data = { |
|||
gradeName: String(addForm.value.gradeName), |
|||
amount: String(addForm.value.amount), |
|||
sort: String(addForm.value.sort), |
|||
perWin: String(addForm.value.perWin) |
|||
} |
|||
console.log('看看添加参数',data) |
|||
const response = await addLevel(data) |
|||
if (response.code === 200) { |
|||
ElMessage.success('添加成功') |
|||
addVisible.value = false |
|||
getLevels() |
|||
} else { |
|||
ElMessage.error(response.message || '添加失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('添加等级失败:', error) |
|||
ElMessage.error('添加失败,请重试') |
|||
} |
|||
} |
|||
// 编辑 |
|||
const submitEdit = async () => { |
|||
|
|||
if (!editForm.value.id || !editForm.value.gradeName || !editForm.value.amount || !editForm.value.perWin || !editForm.value.sort) { |
|||
ElMessage.error('请填写完整信息') |
|||
return |
|||
} |
|||
try { |
|||
const editData = { |
|||
id: editForm.value.id, |
|||
gradeName: editForm.value.gradeName, |
|||
amount: editForm.value.amount, |
|||
perWin: editForm.value.perWin, |
|||
sort: editForm.value.sort |
|||
} |
|||
console.log('看看编辑参数',editData) |
|||
const response = await updateGrade(editData) |
|||
if (response.code === 200) { |
|||
ElMessage.success('修改成功') |
|||
editVisible.value = false |
|||
getLevels() |
|||
} else { |
|||
ElMessage.error(response.message || '修改失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('编辑等级失败:', error) |
|||
ElMessage.error('修改失败,请重试') |
|||
} |
|||
} |
|||
// 删除等级 |
|||
const deleteLevel = (row) => { |
|||
ElMessageBox.confirm('确定要删除该等级吗?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(async () => { |
|||
try { |
|||
const id = String(row.id) |
|||
console.log('删除等级的id是:', id) |
|||
const response = await deleteGrade(id) |
|||
if (response.code === 200) { |
|||
ElMessage.success('删除成功') |
|||
getLevels() |
|||
} else { |
|||
ElMessage.error(response.message || '删除失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('删除失败:', error) |
|||
ElMessage.error('删除失败,请重试') |
|||
} |
|||
}).catch(() => { |
|||
ElMessage.info('已取消删除') |
|||
}) |
|||
} |
|||
|
|||
//清空表单(关闭对话框时调用) |
|||
const resetForm = () => { |
|||
addForm.value = { |
|||
gradeName: '', |
|||
amount: '', |
|||
perWin: '', |
|||
sort: '' |
|||
} |
|||
} |
|||
const handleSizeChange = (val) => { |
|||
pagination.value.pageSize = val |
|||
pagination.value.pageNum = 1 |
|||
getLevels() |
|||
} |
|||
const handleCurrentChange = (val) => { |
|||
pagination.value.pageNum = val |
|||
getLevels() |
|||
} |
|||
onMounted(() => { |
|||
getLevels() |
|||
}) |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.level-management-container { |
|||
padding: 20px; |
|||
width: 100%; |
|||
box-sizing: border-box; |
|||
min-height: 80vh; |
|||
} |
|||
|
|||
.pagination { |
|||
padding: 10px 20px; |
|||
background-color: #fff; |
|||
border-top: 1px solid #ebeef5; |
|||
display: flex; |
|||
justify-content: flex-start; |
|||
/* 改为左对齐 */ |
|||
} |
|||
|
|||
.action-buttons { |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.table-container { |
|||
max-height: 600px; |
|||
overflow-y: auto; |
|||
} |
|||
</style> |
@ -0,0 +1,35 @@ |
|||
<template> |
|||
<div class="default-image-container"> |
|||
<div class="default-image"></div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script setup> |
|||
// 如果不需要逻辑,可以只保留模板和样式 |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.default-image-container { |
|||
position: fixed; |
|||
top: 0; |
|||
left: 0; |
|||
width: 100vw; |
|||
height: 100vh; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
z-index: -1; /* 放在其他内容之后 */ |
|||
} |
|||
|
|||
.default-image { |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: url('@/img/1.jpg') no-repeat center center fixed; |
|||
background-size: cover; |
|||
background-position: center; |
|||
z-index: -1; |
|||
} |
|||
</style> |
@ -0,0 +1,255 @@ |
|||
<!-- 0特等奖 1一等奖 以此类推 --> |
|||
<template> |
|||
<el-card style="margin-top: 50px ; min-height: 90vh; max-height: 90vh;"> |
|||
|
|||
<!-- 返回按钮 --> |
|||
|
|||
<!-- 搜索栏 --> |
|||
<div class="gray-container"> |
|||
<h2>中奖管理</h2> |
|||
<el-form :inline="true" class="search-bar"> |
|||
<el-form-item label="姓名"> |
|||
<el-input v-model="searchData.name" placeholder="请输入姓名"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="精网号"> |
|||
<el-input |
|||
v-model="searchData.jingwangId" |
|||
placeholder="请输入精网号" |
|||
@input="handleJingwangIdInput" |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="中奖等级"> |
|||
<el-select v-model="searchData.prizeLevel" placeholder="请选择" class="prize-level-select"> |
|||
<el-option label="全部" value=""></el-option> |
|||
<el-option label="特等奖" value="0"></el-option> |
|||
<el-option label="一等奖" value="1"></el-option> |
|||
<!-- 其他选项... --> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary">搜索</el-button> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button @click="handleReset">重置</el-button> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="handleExport">导出数据</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
|
|||
<!-- 表格 --> |
|||
<div class="table-container"> |
|||
<el-table :data="currentPageData" style="width: 100%" :row-style="{ height: '55px' }"> |
|||
<el-table-column prop="id" label="ID" width="100" align="center"></el-table-column> |
|||
<el-table-column prop="name" label="姓名" width="180" align="center"></el-table-column> |
|||
<el-table-column prop="jingwangId" label="精网号" width="250" align="center"></el-table-column> |
|||
<!-- <el-table-column prop="prizeLevel" label="中奖等级" width="200" align="center"></el-table-column> --> |
|||
<el-table-column label="中奖等级" width="200" align="center"> |
|||
<template #default="scope"> |
|||
<span v-if="scope.row.prizeLevel == '0' ">特等奖</span> |
|||
<span v-if="scope.row.prizeLevel == '1' ">一等奖</span> |
|||
<span v-if="scope.row.prizeLevel == '2' ">二等奖</span> |
|||
<span v-if="scope.row.prizeLevel == '3' ">三等奖</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="prizeItem" label="所中礼品" width="300" align="center"></el-table-column> |
|||
<el-table-column prop="prizeTime" label="中奖时间" align="center"></el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</div> |
|||
|
|||
|
|||
|
|||
<!-- 分页 --> |
|||
<el-pagination |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page="currentPage" |
|||
:page-sizes="[10, 20, 50, 100]" |
|||
:page-size="pageSize" |
|||
layout="total, sizes, prev, pager, next, jumper" |
|||
:total="tableData.length" |
|||
> |
|||
</el-pagination> |
|||
|
|||
</el-card> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, computed } from 'vue' |
|||
import { useRouter } from 'vue-router' |
|||
|
|||
const router = useRouter() |
|||
|
|||
// 响应式数据 |
|||
const searchData = ref({ |
|||
name: '', |
|||
jingwangId: '', |
|||
prizeLevel: '' |
|||
}) |
|||
|
|||
const tableData = ref([ |
|||
{ |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, { |
|||
id: 1, |
|||
name: '张家伟', |
|||
jingwangId: '90047666', |
|||
prizeLevel: '0', |
|||
prizeItem: 'zimomo', |
|||
prizeTime: '2025-07-12 14:05:30' |
|||
}, |
|||
// 可以继续添加更多数据... |
|||
]) |
|||
|
|||
const currentPage = ref(1) |
|||
const pageSize = ref(10) |
|||
|
|||
// 当前页数据计算属性 |
|||
const currentPageData = computed(() => { |
|||
const start = (currentPage.value - 1) * pageSize.value |
|||
const end = start + pageSize.value |
|||
return tableData.value.slice(start, end) |
|||
}) |
|||
|
|||
|
|||
// const currentPageData = computed(() => { |
|||
// const start = (currentPage.value - 1) * pageSize.value |
|||
// const end = start + pageSize.value |
|||
// return tableData.value.slice(start, end) |
|||
// }) |
|||
|
|||
|
|||
|
|||
// 返回上一页 |
|||
const goBack = () => { |
|||
router.back() |
|||
} |
|||
|
|||
// 导出数据 |
|||
const handleExport = () => { |
|||
console.log('Export Data') |
|||
} |
|||
|
|||
// 分页 size 改变 |
|||
const handleSizeChange = (val) => { |
|||
pageSize.value = val |
|||
currentPage.value = 1 |
|||
} |
|||
|
|||
// 当前页改变 |
|||
const handleCurrentChange = (val) => { |
|||
currentPage.value = val |
|||
} |
|||
|
|||
// 输入精网号处理 |
|||
const handleJingwangIdInput = (value) => { |
|||
searchData.value.jingwangId = value.replace(/\D/g, '') |
|||
} |
|||
|
|||
// 重置搜索条件 |
|||
const handleReset = () => { |
|||
searchData.value = { |
|||
name: '', |
|||
jingwangId: '', |
|||
prizeLevel: '' |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.info-bar { |
|||
margin: 10px 0; |
|||
font-size: 16px; |
|||
} |
|||
|
|||
.search-bar { |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.prize-level-select { |
|||
width: 200px; /* 调整中奖等级选择框的宽度 */ |
|||
} |
|||
|
|||
.table-container { |
|||
height: 600px; /* 根据需要调整高度 */ |
|||
overflow-y: auto; /* 启用垂直滚动条 */ |
|||
} |
|||
|
|||
.gray-container { |
|||
width: 100%; /* 宽度自适应 */ |
|||
background-color: #ffffff; /* 浅灰色背景 */ |
|||
padding: 20px; /* 内边距 */ |
|||
box-sizing: border-box; /* 包含内边距在总宽度内 */ |
|||
min-height: 80vh; /* 设置最小高度 */ |
|||
overflow-x: hidden; |
|||
} |
|||
</style> |
@ -0,0 +1,24 @@ |
|||
import { defineConfig } from 'vite' |
|||
import vue from '@vitejs/plugin-vue' |
|||
import path from 'path' |
|||
|
|||
export default defineConfig({ |
|||
plugins: [vue()], |
|||
resolve: { |
|||
alias: { |
|||
'@': path.resolve(__dirname, './src') |
|||
} |
|||
}, |
|||
server: { |
|||
proxy: { |
|||
'/admin': { |
|||
target: 'http://localhost:12699', // 后端基础地址https://dbqb.nfdxy.net/devLotApi
|
|||
changeOrigin: true, |
|||
rewrite: (path) => path |
|||
// 或者更精确的重写(根据后端路径调整):.replace(/^\/api/, '')
|
|||
// rewrite: (path) => path.replace(/^\/api\/admin/, '/admin'),
|
|||
}, |
|||
}, |
|||
}, |
|||
|
|||
}) |
Write
Preview
Loading…
Cancel
Save
Reference in new issue