feate:添加拼单类型接口
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
<div class="group-buy-container">
|
||||
<el-card class="header-card">
|
||||
<div class="header-actions">
|
||||
<el-button type="primary" icon="Plus" @click="showCreateDialog = true">
|
||||
<el-button type="primary" icon="Plus" @click="openCreateDialog">
|
||||
创建随机队伍
|
||||
</el-button>
|
||||
<el-button type="success" icon="Download" @click="handleExport" :loading="exportLoading">
|
||||
@@ -18,13 +18,13 @@
|
||||
<el-table :data="groupList" v-loading="loading" stripe border>
|
||||
<el-table-column prop="id" label="队伍ID" />
|
||||
<el-table-column prop="name" label="队伍名称" min-width="150" />
|
||||
<el-table-column label="队伍类型" width="120">
|
||||
<!-- <el-table-column label="队伍类型" width="120">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.type === 0 ? 'primary' : 'success'">
|
||||
{{ row.type === 0 ? '5人队' : '10人队' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table-column> -->
|
||||
<el-table-column prop="currentMembers" label="当前人数" width="100" align="center" />
|
||||
<el-table-column prop="maxMembers" label="需要人数" width="100" align="center" />
|
||||
<el-table-column label="状态" width="120">
|
||||
@@ -77,11 +77,15 @@
|
||||
<el-form-item label="队伍名称" prop="name">
|
||||
<el-input v-model="createForm.name" placeholder="请输入队伍名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="队伍类型" prop="groupBuyType">
|
||||
<el-radio-group v-model="createForm.groupBuyType">
|
||||
<el-radio :label="0">5人队</el-radio>
|
||||
<el-radio :label="1">10人队</el-radio>
|
||||
</el-radio-group>
|
||||
<el-form-item label="标签" prop="tag">
|
||||
<el-select v-model="createForm.tag" placeholder="请选择标签" style="width: 100%" @change="handleTagChange">
|
||||
<el-option v-for="tag in tagList" :key="tag" :label="tag" :value="tag" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="拼团类型" prop="groupBuyTypeId">
|
||||
<el-select v-model="createForm.groupBuyTypeId" placeholder="请先选择标签" :disabled="!createForm.tag" style="width: 100%">
|
||||
<el-option v-for="item in typeList" :key="item.id" :label="`${item.name} (${item.maxPerson}人)`" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
@@ -116,8 +120,8 @@
|
||||
<el-tag v-if="row.teamLeader" type="warning" size="small">队长</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="idcUid" label="IDC UID" width="120" />
|
||||
<el-table-column prop="idcPhone" label="IDC手机号" width="130" />
|
||||
<!-- <el-table-column prop="idcUid" label="IDC UID" width="120" />
|
||||
<el-table-column prop="idcPhone" label="IDC手机号" width="130" /> -->
|
||||
</el-table>
|
||||
</el-dialog>
|
||||
</div>
|
||||
@@ -134,6 +138,7 @@ import {
|
||||
exportIdcInfo,
|
||||
setOrder
|
||||
} from '@/api/admin/activity'
|
||||
import { getGroupBuyTypeList,getGroupBuyTypeTags } from '@/api/groupBuy'
|
||||
|
||||
// 数据状态
|
||||
const loading = ref(false)
|
||||
@@ -150,18 +155,67 @@ const currentMembers = ref([])
|
||||
const createFormRef = ref(null)
|
||||
const createForm = reactive({
|
||||
name: '',
|
||||
groupBuyType: 0
|
||||
tag: '',
|
||||
groupBuyTypeId: ''
|
||||
})
|
||||
const typeList = ref([])
|
||||
const tagList = ref([])
|
||||
|
||||
const createRules = {
|
||||
name: [
|
||||
{ required: true, message: '请输入队伍名称', trigger: 'blur' }
|
||||
],
|
||||
groupBuyType: [
|
||||
{ required: true, message: '请选择队伍类型', trigger: 'change' }
|
||||
tag: [
|
||||
{ required: true, message: '请选择标签', trigger: 'change' }
|
||||
],
|
||||
groupBuyTypeId: [
|
||||
{ required: true, message: '请选择拼团类型', trigger: 'change' }
|
||||
]
|
||||
}
|
||||
|
||||
// 获取标签列表
|
||||
const fetchTags = async () => {
|
||||
try {
|
||||
const res = await getGroupBuyTypeTags()
|
||||
if (res.code === 200) {
|
||||
tagList.value = res.data || []
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取标签失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 根据 tag 获取拼团类型列表
|
||||
const fetchTypeListByTag = async (tag) => {
|
||||
try {
|
||||
const res = await getGroupBuyTypeList({ page: 1, count: 100, tag })
|
||||
if (res.code === 200) {
|
||||
typeList.value = res.data?.data || []
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取拼团类型失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// tag 变化时获取对应的拼团类型
|
||||
const handleTagChange = (tag) => {
|
||||
createForm.groupBuyTypeId = ''
|
||||
typeList.value = []
|
||||
if (tag) {
|
||||
fetchTypeListByTag(tag)
|
||||
}
|
||||
}
|
||||
|
||||
// 打开创建对话框
|
||||
const openCreateDialog = () => {
|
||||
createForm.name = ''
|
||||
createForm.tag = ''
|
||||
createForm.groupBuyTypeId = ''
|
||||
typeList.value = []
|
||||
fetchTags()
|
||||
showCreateDialog.value = true
|
||||
}
|
||||
|
||||
// 获取队伍列表
|
||||
const fetchGroupList = async () => {
|
||||
loading.value = true
|
||||
@@ -239,25 +293,14 @@ const handleCreate = async () => {
|
||||
if (valid) {
|
||||
createLoading.value = true
|
||||
try {
|
||||
const res = await addRandomGroup(createForm.name, createForm.groupBuyType)
|
||||
const res = await addRandomGroup({ name: createForm.name, group_buy_type_id: String(createForm.groupBuyTypeId) })
|
||||
console.log('创建队伍响应:', res)
|
||||
|
||||
if (res.data.code === 200) {
|
||||
// API 返回的数据结构:
|
||||
// {
|
||||
// group_buy_id: "17670733070-5",
|
||||
// name: "发士大夫",
|
||||
// maxPerson: 5,
|
||||
// createTime: "2025-12-30T13:41:47.216888773+08:00",
|
||||
// users: [{...}]
|
||||
// }
|
||||
|
||||
ElMessage.success(`创建成功!队伍ID: ${res.data.group_buy_id}`)
|
||||
showCreateDialog.value = false
|
||||
createForm.name = ''
|
||||
createForm.groupBuyType = 0
|
||||
|
||||
// 刷新列表
|
||||
createForm.groupBuyTypeId = ''
|
||||
fetchGroupList()
|
||||
} else {
|
||||
ElMessage.error(res.message || '创建失败')
|
||||
|
||||
@@ -0,0 +1,226 @@
|
||||
<template>
|
||||
<div class="group-buy-type-container">
|
||||
<el-card class="header-card">
|
||||
<div class="header-actions">
|
||||
<el-button type="primary" icon="Plus" @click="handleAdd">新增类型</el-button>
|
||||
<el-select v-model="searchTag" placeholder="请选择标签" style="width: 180px; margin-left: 12px" @change="handleTagChange">
|
||||
<el-option v-for="tag in tagList" :key="tag" :label="tag" :value="tag" />
|
||||
</el-select>
|
||||
<el-input v-model="searchKey" placeholder="关键词搜索" style="width: 200px; margin-left: 12px" clearable :disabled="!searchTag" @keyup.enter="fetchList" />
|
||||
<el-button type="info" icon="Refresh" @click="fetchList" :loading="loading" :disabled="!searchTag" style="margin-left: 12px">刷新</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<el-card class="table-card">
|
||||
<el-empty v-if="!searchTag" description="请先选择标签" />
|
||||
<template v-else>
|
||||
<el-table :data="tableData" v-loading="loading" stripe border>
|
||||
<el-table-column prop="id" label="ID" width="80" />
|
||||
<el-table-column prop="name" label="名称" min-width="120" />
|
||||
<el-table-column label="价格" width="120">
|
||||
<template #default="{ row }">¥{{ (row.price / 100).toFixed(2) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="续费价格" width="120">
|
||||
<template #default="{ row }">¥{{ (row.renewPrice / 100).toFixed(2) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="maxPerson" label="拼团人数" width="100" align="center" />
|
||||
<el-table-column prop="tag" label="标签" width="120">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.tag" type="info">{{ row.tag }}</el-tag>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="过期时间" width="180">
|
||||
<template #default="{ row }">{{ row.expireTime ? formatTime(row.expireTime) : '永久' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="note" label="备注" min-width="150" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="160" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button type="primary" size="small" @click="handleEdit(row)">编辑</el-button>
|
||||
<el-button type="danger" size="small" @click="handleDelete(row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination-wrapper">
|
||||
<el-pagination v-model:current-page="page" v-model:page-size="pageSize" :total="total" :page-sizes="[10, 20, 50]" layout="total, sizes, prev, pager, next" @size-change="fetchList" @current-change="fetchList" />
|
||||
</div>
|
||||
</template>
|
||||
</el-card>
|
||||
|
||||
<el-dialog v-model="dialogVisible" :title="isEdit ? '编辑拼团类型' : '新增拼团类型'" width="500px" :close-on-click-modal="false">
|
||||
<el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="价格(分)" prop="price">
|
||||
<el-input-number v-model="form.price" :min="0" style="width: 100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="续费价格(分)" prop="renewPrice">
|
||||
<el-input-number v-model="form.renewPrice" :min="0" style="width: 100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="拼团人数" prop="maxPerson">
|
||||
<el-input-number v-model="form.maxPerson" :min="2" :max="100" style="width: 100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="tag">
|
||||
<el-select v-model="form.tag" placeholder="选择标签" filterable allow-create style="width: 100%">
|
||||
<el-option v-for="tag in tagList" :key="tag" :label="tag" :value="tag" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="过期时间" prop="expireTime">
|
||||
<el-date-picker v-model="form.expireTime" type="datetime" placeholder="选择过期时间" style="width: 100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="note">
|
||||
<el-input v-model="form.note" type="textarea" :rows="3" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="handleSubmit" :loading="submitLoading">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import { getGroupBuyTypeList, getGroupBuyTypeTags, addGroupBuyType, updateGroupBuyType, deleteGroupBuyType } from '@/api/groupBuy'
|
||||
|
||||
const loading = ref(false)
|
||||
const tableData = ref([])
|
||||
const total = ref(0)
|
||||
const page = ref(1)
|
||||
const pageSize = ref(10)
|
||||
const searchKey = ref('')
|
||||
const searchTag = ref('')
|
||||
const tagList = ref([])
|
||||
const dialogVisible = ref(false)
|
||||
const isEdit = ref(false)
|
||||
const submitLoading = ref(false)
|
||||
const formRef = ref(null)
|
||||
|
||||
const form = reactive({ id: '', name: '', price: 0, renewPrice: 0, maxPerson: 5, tag: '', expireTime: null, note: '' })
|
||||
const rules = {
|
||||
name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
|
||||
price: [{ required: true, message: '请输入价格', trigger: 'blur' }],
|
||||
renewPrice: [{ required: true, message: '请输入续费价格', trigger: 'blur' }],
|
||||
maxPerson: [{ required: true, message: '请输入拼团人数', trigger: 'blur' }],
|
||||
tag: [{ required: true, message: '请选择标签', trigger: 'change' }],
|
||||
expireTime: [{ required: true, message: '请选择过期时间', trigger: 'change' }],
|
||||
note: [{ required: true, message: '请输入备注', trigger: 'blur' }]
|
||||
}
|
||||
|
||||
const formatTime = (timeStr) => {
|
||||
if (!timeStr) return '-'
|
||||
return new Date(timeStr).toLocaleString('zh-CN')
|
||||
}
|
||||
|
||||
const fetchList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await getGroupBuyTypeList({ page: page.value, count: pageSize.value, key: searchKey.value || undefined, tag: searchTag.value || undefined })
|
||||
console.log("获取拼团类型列表数据:",res)
|
||||
if (res.code === 200) {
|
||||
tableData.value = res.data?.data || []
|
||||
total.value = res.data?.all_count || 0
|
||||
} else {
|
||||
ElMessage.error(res.data.message || '获取列表失败')
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取列表失败:', error)
|
||||
ElMessage.error('网络错误')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const fetchTags = async () => {
|
||||
try {
|
||||
const res = await getGroupBuyTypeTags()
|
||||
if (res.code === 200) tagList.value = res.data || []
|
||||
} catch (error) {
|
||||
console.error('获取标签失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 标签变化时重新获取列表
|
||||
const handleTagChange = (tag) => {
|
||||
page.value = 1
|
||||
searchKey.value = ''
|
||||
tableData.value = []
|
||||
total.value = 0
|
||||
if (tag) {
|
||||
fetchList()
|
||||
}
|
||||
}
|
||||
|
||||
const handleAdd = () => {
|
||||
isEdit.value = false
|
||||
Object.assign(form, { id: '', name: '', price: 0, renewPrice: 0, maxPerson: 5, tag: '', expireTime: null, note: '' })
|
||||
dialogVisible.value = true
|
||||
}
|
||||
|
||||
const handleEdit = (row) => {
|
||||
isEdit.value = true
|
||||
Object.assign(form, { id: row.id, name: row.name, price: row.price, renewPrice: row.renewPrice, maxPerson: row.maxPerson, tag: row.tag || '', expireTime: row.expireTime || null, note: row.note || '' })
|
||||
dialogVisible.value = true
|
||||
}
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!formRef.value) return
|
||||
await formRef.value.validate(async (valid) => {
|
||||
if (!valid) return
|
||||
submitLoading.value = true
|
||||
try {
|
||||
const data = {
|
||||
name: form.name,
|
||||
price: String(form.price),
|
||||
renew_price: String(form.renewPrice),
|
||||
max_person: String(form.maxPerson),
|
||||
tag: form.tag,
|
||||
expire_time: form.expireTime ? Math.floor(new Date(form.expireTime).getTime() / 1000) : 0,
|
||||
note: form.note
|
||||
}
|
||||
if (isEdit.value) data.id = String(form.id)
|
||||
const res = isEdit.value ? await updateGroupBuyType(data) : await addGroupBuyType(data)
|
||||
if (res.code === 200) {
|
||||
ElMessage.success(isEdit.value ? '修改成功' : '新增成功')
|
||||
dialogVisible.value = false
|
||||
fetchList()
|
||||
fetchTags()
|
||||
} else {
|
||||
ElMessage.error(res.message || '操作失败')
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('提交失败:', error)
|
||||
ElMessage.error('网络错误')
|
||||
} finally {
|
||||
submitLoading.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const handleDelete = async (row) => {
|
||||
try {
|
||||
await ElMessageBox.confirm('确定要删除该拼团类型吗?', '确认删除', { type: 'warning' })
|
||||
const res = await deleteGroupBuyType(row.id)
|
||||
if (res.code === 200) {
|
||||
ElMessage.success('删除成功')
|
||||
fetchList()
|
||||
fetchTags()
|
||||
} else {
|
||||
ElMessage.error(res.data.message || '删除失败')
|
||||
}
|
||||
} catch { /* 取消 */ }
|
||||
}
|
||||
|
||||
onMounted(() => { fetchTags() })
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.group-buy-type-container { padding: 20px; }
|
||||
.header-card { margin-bottom: 20px; }
|
||||
.header-actions { display: flex; align-items: center; }
|
||||
.table-card { box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); }
|
||||
.pagination-wrapper { margin-top: 20px; display: flex; justify-content: flex-end; }
|
||||
</style>
|
||||
Reference in New Issue
Block a user