From 7c0b7f8a6694e94048391c2d2c451bce6d872f0b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BF=AB=E4=B9=90=E6=A9=99?= <1760016317@qq.com>
Date: Sun, 20 Apr 2025 12:58:06 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E5=9B=9E=E6=94=B6?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/product/recycle.js                    | 204 +++++++++++
 .../recycle/club-brand/add-or-update.vue      | 206 +++++++++++
 .../product/recycle/club-brand/index.vue      | 235 ++++++++++++
 .../recycle/club-flaw/add-or-update.vue       | 210 +++++++++++
 .../product/recycle/club-flaw/index.vue       | 230 ++++++++++++
 .../recycle/club-series/add-or-update.vue     | 221 +++++++++++
 .../product/recycle/club-series/index.vue     | 271 ++++++++++++++
 .../recycle/club-type/add-or-update.vue       | 206 +++++++++++
 .../product/recycle/club-type/index.vue       | 234 ++++++++++++
 .../product/recycle/club/add-or-update.vue    | 323 ++++++++++++++++
 .../modules/product/recycle/club/index.vue    | 344 ++++++++++++++++++
 11 files changed, 2684 insertions(+)
 create mode 100644 src/api/product/recycle.js
 create mode 100644 src/views/modules/product/recycle/club-brand/add-or-update.vue
 create mode 100644 src/views/modules/product/recycle/club-brand/index.vue
 create mode 100644 src/views/modules/product/recycle/club-flaw/add-or-update.vue
 create mode 100644 src/views/modules/product/recycle/club-flaw/index.vue
 create mode 100644 src/views/modules/product/recycle/club-series/add-or-update.vue
 create mode 100644 src/views/modules/product/recycle/club-series/index.vue
 create mode 100644 src/views/modules/product/recycle/club-type/add-or-update.vue
 create mode 100644 src/views/modules/product/recycle/club-type/index.vue
 create mode 100644 src/views/modules/product/recycle/club/add-or-update.vue
 create mode 100644 src/views/modules/product/recycle/club/index.vue

diff --git a/src/api/product/recycle.js b/src/api/product/recycle.js
new file mode 100644
index 0000000..6303a51
--- /dev/null
+++ b/src/api/product/recycle.js
@@ -0,0 +1,204 @@
+import request from '@/utils/request'
+// 获取球杆列表
+export function getStickList (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueProduct/page',
+    method: 'get',
+    params
+  })
+};
+// 根据id获取球杆详情
+export function getStickDetail (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueProduct',
+    method: 'get',
+    params
+  })
+};
+// 新增球杆
+export function addStick (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueProduct',
+    method: 'post',
+    data
+  })
+};
+// 修改球杆
+export function updateStick (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueProduct',
+    method: 'put',
+    data
+  })
+};
+// 删除球杆
+export function deleteStick (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueProduct',
+    method: 'delete',
+    params
+  })
+};
+// 获取球杆品牌
+export function getStickBrand (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueBrand/page',
+    method: 'get',
+    params
+  })
+};
+// 获取球杆品牌详情
+export function getStickBrandDetail (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueBrand',
+    method: 'get',
+    params
+  })
+}
+
+// 新增球杆品牌
+export function addStickBrand (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueBrand',
+    method: 'post',
+    data
+  })
+};
+// 修改球杆品牌
+export function updateStickBrand (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueBrand',
+    method: 'put',
+    data
+  })
+}
+
+// 删除球杆品牌
+export function deleteStickBrand (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueBrand',
+    method: 'delete',
+    params
+  })
+}
+// 获取球杆类型
+export function getStickType (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueType/page',
+    method: 'get',
+    params
+  })
+}
+// 获取球杆类型详情
+export function getStickTypeDetail (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueType',
+    method: 'get',
+    params
+  })
+}
+// 新增球杆类型
+export function addStickType (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueType',
+    method: 'post',
+    data
+  })
+};
+// 修改球杆类型
+export function updateStickType (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueType',
+    method: 'put',
+    data
+  })
+};
+// 删除球杆类型
+export function deleteStickType (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueType',
+    method: 'delete',
+    params
+  })
+}
+
+// 获取球杆系列
+export function getStickSeries (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueSeries/page',
+    method: 'get',
+    params
+  })
+}
+// 获取球杆xi'lie详情
+export function getStickSeriesDetail (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueSeries',
+    method: 'get',
+    params
+  })
+}
+// 新增球杆系列
+export function addStickSeries (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueSeries',
+    method: 'post',
+    data
+  })
+};
+// 修改球杆系列
+export function updateStickSeries (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueSeries',
+    method: 'put',
+    data
+  })
+};
+// 删除球杆系列
+export function deleteStickSeries (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueSeries',
+    method: 'delete',
+    params
+  })
+}
+// 获取球杆缺陷
+export function getStickDefect (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueFlaw/page',
+    method: 'get',
+    params
+  })
+}
+// 获取球杆缺陷详情
+export function getStickDefectDetail (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueFlaw',
+    method: 'get',
+    params
+  })
+}
+// 新增球杆缺陷
+export function addStickDefect (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueFlaw',
+    method: 'post',
+    data
+  })
+};
+// 修改球杆缺陷
+export function updateStickDefect (data) {
+  return request({
+    url: '/tmerclub_local/admin/cueFlaw',
+    method: 'put',
+    data
+  })
+};
+// 删除球杆缺陷
+export function deleteStickDefect (params) {
+  return request({
+    url: '/tmerclub_local/admin/cueFlaw',
+    method: 'delete',
+    params
+  })
+}
diff --git a/src/views/modules/product/recycle/club-brand/add-or-update.vue b/src/views/modules/product/recycle/club-brand/add-or-update.vue
new file mode 100644
index 0000000..124a092
--- /dev/null
+++ b/src/views/modules/product/recycle/club-brand/add-or-update.vue
@@ -0,0 +1,206 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:53:04
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 21:50:06
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\add-or-update.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div>
+    <div class="club-brand-manage">
+      <el-dialog
+        v-model="visible"
+        :title="dataForm.brandId ? $t('table.edit') : $t('table.create')"
+        :close-on-click-modal="false"
+        width="600px"
+        :destroy-on-close="true"
+        top="5vh"
+        class="el-dialog-bodyt"
+        @close="closeDialog"
+      >
+        <el-form
+          ref="dataFormRef"
+          :rules="rules"
+          :model="dataForm"
+          label-position="right"
+          label-width="110px"
+          style="width: 500px; margin-left: 35px"
+          @submit.prevent
+        >
+          <!-- 品牌名称 -->
+          <el-form-item
+            label="品牌名称:"
+            prop="brandName"
+          >
+            <el-input
+              v-model="dataForm.brandName"
+              type="text"
+              maxlength="10"
+              placeholder="品牌名称"
+            />
+          </el-form-item>
+          <!-- 品牌图片 -->
+          <el-form-item
+            label="品牌图片:"
+            prop="brandLogo"
+          >
+            <img-upload
+              v-model="dataForm.brandLogo"
+              @input="onPropChange('brandLogo')"
+            />
+            <div
+              class=""
+              style="width: 100%"
+            >
+              建议图片尺寸为1920*45 0
+            </div>
+          </el-form-item>
+          <!-- 排序 -->
+          <el-form-item
+            label="排序:"
+            prop="brandSeq"
+          >
+            <el-input
+              v-model="dataForm.brandSeq"
+              type="text"
+              maxlength="10"
+              placeholder="排序"
+            />
+          </el-form-item>
+          <!-- 状态 -->
+          <el-form-item
+            label="状态:"
+            prop="brandStatus"
+          >
+            <el-radio-group v-model="dataForm.brandStatus">
+              <el-radio :label="1">
+                启用
+              </el-radio>
+              <el-radio :label="0">
+                禁用
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-form>
+        <template #footer>
+          <div class="dialog-footer">
+            <el-button @click="visible = false">
+              {{ $t("table.cancel") }}
+            </el-button>
+            <el-button
+              type="primary"
+              :loading="btnLoading"
+              @click="onSubmit()"
+            >
+              {{ $t("table.confirm") }}
+            </el-button>
+          </div>
+        </template>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { getStickBrandDetail, addStickBrand, updateStickBrand } from '@/api/product/recycle'
+import { ElMessage, ElMessageBox } from 'element-plus'
+const emit = defineEmits(['refresh-data-list'])
+const dataFormRef = ref(null)
+const visible = ref(false)
+const btnLoading = ref(false)
+const dataForm = ref({
+  brandId: null,
+  brandName: '',
+  brandLogo: '',
+  brandSeq: '',
+  brandStatus: 1
+})
+const rules = reactive({
+  brandName: [{ required: true, message: '请输入品牌名称', trigger: 'blur' }],
+  brandLogo: [
+    { required: true, message: '请选择品牌图片', trigger: 'blur' }
+  ],
+  brandSeq: [
+    { required: true, message: '请输入品牌排序', trigger: 'blur' },
+    {
+      pattern: /^\d+$/,
+      message: '排序必须为数字值且不能小于0',
+      trigger: 'blur'
+    }
+  ],
+  brandStatus: [
+    { required: true, message: '请选择品牌状态', trigger: 'blur' }
+  ]
+})
+const init = (brandId) => {
+  console.log('init', brandId)
+  visible.value = true
+  dataForm.value.brandId = brandId || null
+  dataFormRef.value?.clearValidate()
+  if (brandId) {
+    getClubInfo()
+  }
+}
+const closeDialog = () => {
+  visible.value = false
+  dataForm.value = {
+    brandId: null,
+    brandName: '',
+    brandLogo: '',
+    brandSeq: '',
+    brandStatus: 1
+  }
+}
+const getClubInfo = () => {
+  getStickBrandDetail({ brandId: dataForm.value.brandId }).then((res) => {
+    Object.keys(dataForm.value).forEach((key) => {
+      dataForm.value[key] = res[key]
+    })
+  })
+}
+const onPropChange = (prop) => {
+  dataFormRef.value?.validateField(prop)
+}
+
+const onSubmit = () => {
+  console.log(dataForm.value)
+
+  dataFormRef.value?.validate((valid) => {
+    if (valid) {
+      btnLoading.value = true
+      if (!dataForm.value.brandId) {
+        addStickBrand(dataForm.value).then(() => {
+          ElMessage.success('新增成功')
+          emit('refresh-data-list')
+          btnLoading.value = false
+          closeDialog()
+        }).catch((err) => {
+          btnLoading.value = false
+          console.log(err)
+        })
+      } else {
+        updateStickBrand(dataForm.value).then(() => {
+          ElMessage.success('修改成功')
+          emit('refresh-data-list')
+          btnLoading.value = false
+          closeDialog()
+        }).catch((err) => {
+          btnLoading.value = false
+          console.log(err)
+        })
+      }
+      visible.value = false
+    } else {
+      console.log('error submit!!')
+      return false
+    }
+  })
+}
+
+defineExpose({
+  init
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/product/recycle/club-brand/index.vue b/src/views/modules/product/recycle/club-brand/index.vue
new file mode 100644
index 0000000..8c60f2c
--- /dev/null
+++ b/src/views/modules/product/recycle/club-brand/index.vue
@@ -0,0 +1,235 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 21:52:11
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-14 22:25:43
+ * @FilePath: \tmerclub-platform\src\views\modules\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div class="app-container club-brand-home">
+    <!-- 搜索相关区域 -->
+    <div class="search-bar">
+      <!-- native modifier has been removed, please confirm whether the function has been affected  -->
+      <el-form
+        ref="searchRef"
+        :inline="true"
+        :model="pageQuery"
+        class="demo-form-inline"
+        @submit.prevent
+      >
+        <div class="input-row">
+          <el-form-item
+            label="品牌名称："
+            prop="brandName"
+          >
+            <el-input
+              v-model="pageQuery.brandName"
+              placeholder="品牌名称"
+              maxlength="20"
+              clearable
+            />
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              type="primary"
+              @click="onGetPage(true)"
+            >
+              {{ $t("table.search") }}
+            </el-button>
+            <el-button @click="onClearSearchInfo()">
+              {{ $t("table.reset") }}
+            </el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+    <div class="main-content">
+      <div class="operation-bar">
+        <el-button
+          v-permission="['product:attr:save']"
+          type="primary"
+          class="filter-item"
+          @click="onAddOrUpdate()"
+        >
+          {{ $t("table.create") }}
+        </el-button>
+      </div>
+      <div class="table-con">
+        <!-- 列表相关区域 -->
+        <el-table
+          v-loading="pageLoading"
+          :data="pageVO.list"
+          header-cell-class-name="table-header"
+          row-class-name="table-row-low"
+          highlight-current-row
+          style="width: 100%"
+        >
+          <!-- 排序 -->
+          <el-table-column
+            label="排序"
+            prop="brandSeq"
+            align="left"
+          />
+          <!-- 品牌名称 -->
+          <el-table-column
+            label="品牌名称"
+            prop="brandName"
+            align="left"
+          />
+          <!-- 品牌图片 -->
+          <el-table-column
+            label="品牌图片"
+            prop="brandLogo"
+            align="left"
+          >
+            <template #default="{ row }">
+              <img-show :src="row.brandLogo" />
+            </template>
+          </el-table-column>
+          <!-- 创建时间 -->
+          <el-table-column
+            :label="$t('table.createTime')"
+            prop="createTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.createTime }}</span>
+            </template>
+          </el-table-column>
+          <!-- 更新时间 -->
+          <el-table-column
+            :label="$t('table.updateTime')"
+            prop="updateTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.updateTime }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('table.actions')"
+            align="center"
+            width="230"
+            class-name="small-padding fixed-width"
+          >
+            <template #default="{ row }">
+              <div class="table-btn-con">
+                <el-button
+                  v-permission="['product:attr:update']"
+                  type="primary"
+                  link
+                  @click="onAddOrUpdate(row.brandId)"
+                >
+                  {{ $t("table.edit") }}
+                </el-button>
+                <el-button
+                  v-permission="['product:attr:delete']"
+                  type="primary"
+                  link
+                  @click="onDelete(row.brandId)"
+                >
+                  {{ $t("table.delete") }}
+                </el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <!-- 分页条 -->
+    <pagination
+      v-show="pageVO.total > 0"
+      v-model:page="pageQuery.pageNum"
+      v-model:limit="pageQuery.pageSize"
+      :total="pageVO.total"
+      @pagination="onGetPage()"
+    />
+    <add-or-update
+      ref="addOrUpdateRef"
+
+      @refresh-data-list="onGetPage()"
+    />
+  </div>
+</template>
+
+<script setup>
+import {
+  getStickBrand,
+  deleteStickBrand
+} from '@/api/product/recycle'
+import AddOrUpdate from './add-or-update.vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+const addOrUpdateRef = ref(null)
+const searchRef = ref(null)
+const pageLoading = ref(false)
+const addOrUpdateVisible = ref(false)
+const pageQuery = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  brandName: null
+})
+const pageVO = reactive({
+  total: 0,
+  list: []
+})
+
+const stickBrandList = ref([]) // 获取品牌列表
+const stickTypeList = ref([]) // 获取球杆品牌列表
+const stickSeriesList = ref([]) // 获取球杆系列列表
+const onGetPage = () => {
+  pageLoading.value = true
+  getStickBrand(pageQuery)
+    .then((res) => {
+      console.log(res)
+      pageVO.list = res.list
+      pageVO.total = res.total
+    })
+    .finally(() => {
+      pageLoading.value = false
+    })
+}
+// 清空搜索内容
+const onClearSearchInfo = () => {
+  searchRef.value.resetFields()
+  onGetPage()
+}
+
+const onAddOrUpdate = (id) => {
+  addOrUpdateVisible.value = true
+  nextTick(() => {
+    addOrUpdateRef.value.init(id)
+  })
+}
+
+// 删除球杆
+const onDelete = (brandId) => {
+  ElMessageBox.confirm('确定删除该球杆吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  })
+    .then(() => {
+      deleteStickBrand({ brandId }).then(() => {
+        ElMessage.success('删除成功')
+        onGetPage()
+      })
+    })
+    .catch(() => {})
+}
+onMounted(() => {
+  onGetPage()
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/product/recycle/club-flaw/add-or-update.vue b/src/views/modules/product/recycle/club-flaw/add-or-update.vue
new file mode 100644
index 0000000..215fa02
--- /dev/null
+++ b/src/views/modules/product/recycle/club-flaw/add-or-update.vue
@@ -0,0 +1,210 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:53:04
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 22:42:41
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\add-or-update.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div>
+    <div class="club-flaw-manage">
+      <el-dialog
+        v-model="visible"
+        :title="dataForm.flawId ? $t('table.edit') : $t('table.create')"
+        :close-on-click-modal="false"
+        width="600px"
+        :destroy-on-close="true"
+        top="5vh"
+        class="el-dialog-bodyt"
+        @close="closeDialog"
+      >
+        <el-form
+          ref="dataFormRef"
+          :rules="rules"
+          :model="dataForm"
+          label-position="right"
+          label-width="110px"
+          style="width: 500px; margin-left: 35px"
+          @submit.prevent
+        >
+          <!-- 缺陷名称 -->
+          <el-form-item
+            label="缺陷名称:"
+            prop="flawName"
+          >
+            <el-input
+              v-model="dataForm.flawName"
+              type="text"
+              maxlength="10"
+              placeholder="缺陷名称"
+            />
+          </el-form-item>
+          <el-form-item
+            label="缺陷价格:"
+            prop="flawPrice"
+          >
+            <el-input
+              v-model="dataForm.flawPrice"
+              type="text"
+              maxlength="10"
+              placeholder="缺陷价格"
+            />
+          </el-form-item>
+
+          <!-- 排序 -->
+          <el-form-item
+            label="排序:"
+            prop="flawSeq"
+          >
+            <el-input
+              v-model="dataForm.flawSeq"
+              type="text"
+              maxlength="10"
+              placeholder="排序"
+            />
+          </el-form-item>
+          <!-- 状态 -->
+          <el-form-item
+            label="状态:"
+            prop="flawStatus"
+          >
+            <el-radio-group v-model="dataForm.flawStatus">
+              <el-radio :label="1">
+                启用
+              </el-radio>
+              <el-radio :label="0">
+                禁用
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-form>
+        <template #footer>
+          <div class="dialog-footer">
+            <el-button @click="visible = false">
+              {{ $t("table.cancel") }}
+            </el-button>
+            <el-button
+              type="primary"
+              :loading="btnLoading"
+              @click="onSubmit()"
+            >
+              {{ $t("table.confirm") }}
+            </el-button>
+          </div>
+        </template>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { getStickDefectDetail, addStickDefect, updateStickDefect } from '@/api/product/recycle'
+import { ElMessage } from 'element-plus'
+const emit = defineEmits(['refresh-data-list'])
+const dataFormRef = ref(null)
+const visible = ref(false)
+const btnLoading = ref(false)
+const dataForm = ref({
+  flawId: null,
+  flawName: '',
+  flawPrice: '',
+  flawSeq: '',
+  flawStatus: 1
+})
+const rules = reactive({
+  flawName: [{ required: true, message: '请输入缺陷名称', trigger: 'blur' }],
+  typeImage: [
+    { required: true, message: '请选择缺陷图片', trigger: 'blur' }
+  ],
+  flawPrice: [
+    { required: true, message: '请输入缺陷价格', trigger: 'blur' },
+    {
+      pattern: /^\d+$/,
+      message: '价格必须为数字值',
+      trigger: 'blur'
+    }
+  ],
+  flawSeq: [
+    { required: true, message: '请输入缺陷排序', trigger: 'blur' },
+    {
+      pattern: /^\d+$/,
+      message: '排序必须为数字值',
+      trigger: 'blur'
+    }
+  ],
+  flawStatus: [
+    { required: true, message: '请选择缺陷状态', trigger: 'blur' }
+  ]
+})
+const init = (flawId) => {
+  console.log('init', flawId)
+  visible.value = true
+  dataForm.value.flawId = flawId || null
+  dataFormRef.value?.clearValidate()
+  if (flawId) {
+    getClubInfo()
+  }
+}
+const closeDialog = () => {
+  visible.value = false
+  dataForm.value = {
+    flawId: null,
+    flawName: '',
+    flawPrice: '',
+    flawSeq: '',
+    flawStatus: 1
+  }
+}
+const getClubInfo = () => {
+  getStickDefectDetail({ flawId: dataForm.value.flawId }).then((res) => {
+    Object.keys(dataForm.value).forEach((key) => {
+      dataForm.value[key] = res[key]
+    })
+  })
+}
+const onPropChange = (prop) => {
+  dataFormRef.value?.validateField(prop)
+}
+
+const onSubmit = () => {
+  console.log(dataForm.value)
+
+  dataFormRef.value?.validate((valid) => {
+    if (valid) {
+      btnLoading.value = true
+      if (!dataForm.value.flawId) {
+        addStickDefect(dataForm.value).then(() => {
+          ElMessage.success('新增成功')
+          emit('refresh-data-list')
+          btnLoading.value = false
+          closeDialog()
+        }).catch((err) => {
+          btnLoading.value = false
+          console.log(err)
+        })
+      } else {
+        updateStickDefect(dataForm.value).then(() => {
+          ElMessage.success('修改成功')
+          emit('refresh-data-list')
+          btnLoading.value = false
+          closeDialog()
+        }).catch((err) => {
+          btnLoading.value = false
+          console.log(err)
+        })
+      }
+      visible.value = false
+    } else {
+      console.log('error submit!!')
+      return false
+    }
+  })
+}
+
+defineExpose({
+  init
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/product/recycle/club-flaw/index.vue b/src/views/modules/product/recycle/club-flaw/index.vue
new file mode 100644
index 0000000..654ea8b
--- /dev/null
+++ b/src/views/modules/product/recycle/club-flaw/index.vue
@@ -0,0 +1,230 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 22:37:38
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-14 22:25:43
+ * @FilePath: \tmerclub-platform\src\views\modules\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div class="app-container club-flaw-home">
+    <!-- 搜索相关区域 -->
+    <div class="search-bar">
+      <!-- native modifier has been removed, please confirm whether the function has been affected  -->
+      <el-form
+        ref="searchRef"
+        :inline="true"
+        :model="pageQuery"
+        class="demo-form-inline"
+        @submit.prevent
+      >
+        <div class="input-row">
+          <el-form-item
+            label="缺陷名称："
+            prop="flawName"
+          >
+            <el-input
+              v-model="pageQuery.flawName"
+              placeholder="缺陷名称"
+              maxlength="20"
+              clearable
+            />
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              type="primary"
+              @click="onGetPage(true)"
+            >
+              {{ $t("table.search") }}
+            </el-button>
+            <el-button @click="onClearSearchInfo()">
+              {{ $t("table.reset") }}
+            </el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+    <div class="main-content">
+      <div class="operation-bar">
+        <el-button
+          v-permission="['product:attr:save']"
+          type="primary"
+          class="filter-item"
+          @click="onAddOrUpdate()"
+        >
+          {{ $t("table.create") }}
+        </el-button>
+      </div>
+      <div class="table-con">
+        <!-- 列表相关区域 -->
+        <el-table
+          v-loading="pageLoading"
+          :data="pageVO.list"
+          header-cell-class-name="table-header"
+          row-class-name="table-row-low"
+          highlight-current-row
+          style="width: 100%"
+        >
+          <!-- 排序 -->
+          <el-table-column
+            label="排序"
+            prop="flawSeq"
+            align="left"
+          />
+          <!-- 缺陷名称 -->
+          <el-table-column
+            label="缺陷名称"
+            prop="flawName"
+            align="left"
+          />
+          <!-- 缺陷价格 -->
+          <el-table-column
+            label="缺陷价格"
+            prop="flawPrice"
+            align="left"
+          />
+          <!-- 创建时间 -->
+          <el-table-column
+            :label="$t('table.createTime')"
+            prop="createTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.createTime }}</span>
+            </template>
+          </el-table-column>
+          <!-- 更新时间 -->
+          <el-table-column
+            :label="$t('table.updateTime')"
+            prop="updateTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.updateTime }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('table.actions')"
+            align="center"
+            width="230"
+            class-name="small-padding fixed-width"
+          >
+            <template #default="{ row }">
+              <div class="table-btn-con">
+                <el-button
+                  v-permission="['product:attr:update']"
+                  type="primary"
+                  link
+                  @click="onAddOrUpdate(row.flawId)"
+                >
+                  {{ $t("table.edit") }}
+                </el-button>
+                <el-button
+                  v-permission="['product:attr:delete']"
+                  type="primary"
+                  link
+                  @click="onDelete(row.flawId)"
+                >
+                  {{ $t("table.delete") }}
+                </el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <!-- 分页条 -->
+    <pagination
+      v-show="pageVO.total > 0"
+      v-model:page="pageQuery.pageNum"
+      v-model:limit="pageQuery.pageSize"
+      :total="pageVO.total"
+      @pagination="onGetPage()"
+    />
+    <add-or-update
+      ref="addOrUpdateRef"
+      @refresh-data-list="onGetPage()"
+    />
+  </div>
+</template>
+
+<script setup>
+import {
+  getStickDefect,
+  deleteStickDefect
+} from '@/api/product/recycle'
+import AddOrUpdate from './add-or-update.vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+const addOrUpdateRef = ref(null)
+const searchRef = ref(null)
+const pageLoading = ref(false)
+const addOrUpdateVisible = ref(false)
+const pageQuery = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  flawName: null
+})
+const pageVO = reactive({
+  total: 0,
+  list: []
+})
+
+const stickBrandList = ref([]) // 获取品牌列表
+const stickTypeList = ref([]) // 获取球杆缺陷列表
+const stickSeriesList = ref([]) // 获取球杆系列列表
+const onGetPage = () => {
+  pageLoading.value = true
+  getStickDefect(pageQuery)
+    .then((res) => {
+      console.log(res)
+      pageVO.list = res.list
+      pageVO.total = res.total
+    })
+    .finally(() => {
+      pageLoading.value = false
+    })
+}
+// 清空搜索内容
+const onClearSearchInfo = () => {
+  searchRef.value.resetFields()
+  onGetPage()
+}
+
+const onAddOrUpdate = (id) => {
+  addOrUpdateVisible.value = true
+  nextTick(() => {
+    addOrUpdateRef.value.init(id)
+  })
+}
+
+// 删除球杆
+const onDelete = (flawId) => {
+  ElMessageBox.confirm('确定删除该球杆吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  })
+    .then(() => {
+      deleteStickDefect({ flawId }).then(() => {
+        ElMessage.success('删除成功')
+        onGetPage()
+      })
+    })
+    .catch(() => { })
+}
+onMounted(() => {
+  onGetPage()
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/product/recycle/club-series/add-or-update.vue b/src/views/modules/product/recycle/club-series/add-or-update.vue
new file mode 100644
index 0000000..bb728f4
--- /dev/null
+++ b/src/views/modules/product/recycle/club-series/add-or-update.vue
@@ -0,0 +1,221 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:53:04
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 22:41:30
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\add-or-update.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div>
+    <div class="club-series-manage">
+      <el-dialog
+        v-model="visible"
+        :title="dataForm.seriesId ? $t('table.edit') : $t('table.create')"
+        :close-on-click-modal="false"
+        width="600px"
+        :destroy-on-close="true"
+        top="5vh"
+        class="el-dialog-bodyt"
+        @close="closeDialog"
+      >
+        <el-form
+          ref="dataFormRef"
+          :rules="rules"
+          :model="dataForm"
+          label-position="right"
+          label-width="110px"
+          style="width: 500px; margin-left: 35px"
+          @submit.prevent
+        >
+          <!-- 系列称 -->
+          <el-form-item
+            label="系列称:"
+            prop="seriesName"
+          >
+            <el-input
+              v-model="dataForm.seriesName"
+              type="text"
+              maxlength="10"
+              placeholder="系列称"
+            />
+          </el-form-item>
+          <!-- 系列选择 -->
+          <el-form-item
+            label="系列选择:"
+            prop="seriesId"
+          >
+            <el-select
+              v-model="dataForm.brandId"
+              placeholder="请选择系列"
+              :empty-values="[null, undefined]"
+              value-key="seriesId"
+            >
+              <el-option
+                v-for="item in stickBrandList"
+                :key="item.brandId"
+                :disabled="item.brandStatus == 0"
+                :label="item.brandName"
+                :value="item.brandId"
+              />
+            </el-select>
+          </el-form-item>
+          <!-- 排序 -->
+          <el-form-item
+            label="排序:"
+            prop="seriesSeq"
+          >
+            <el-input
+              v-model="dataForm.seriesSeq"
+              type="text"
+              maxlength="10"
+              placeholder="排序"
+            />
+          </el-form-item>
+          <!-- 状态 -->
+          <el-form-item
+            label="状态:"
+            prop="seriesStatus"
+          >
+            <el-radio-group v-model="dataForm.seriesStatus">
+              <el-radio :label="1">
+                启用
+              </el-radio>
+              <el-radio :label="0">
+                禁用
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-form>
+        <template #footer>
+          <div class="dialog-footer">
+            <el-button @click="visible = false">
+              {{ $t("table.cancel") }}
+            </el-button>
+            <el-button
+              type="primary"
+              :loading="btnLoading"
+              @click="onSubmit()"
+            >
+              {{ $t("table.confirm") }}
+            </el-button>
+          </div>
+        </template>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import {
+  getStickSeriesDetail,
+  addStickSeries,
+  updateStickSeries
+} from '@/api/product/recycle'
+import { ElMessage, ElMessageBox } from 'element-plus'
+const emit = defineEmits(['refresh-data-list'])
+const dataFormRef = ref(null)
+const visible = ref(false)
+const btnLoading = ref(false)
+const props = defineProps({
+  stickBrandList: {
+    type: Array,
+    default: () => []
+  }
+})
+const dataForm = ref({
+  seriesId: null,
+  seriesName: '',
+  brandId: '',
+  seriesSeq: '',
+  seriesStatus: 1
+})
+const rules = reactive({
+  seriesName: [{ required: true, message: '请输入系列称', trigger: 'blur' }],
+  seriesSeq: [
+    { required: true, message: '请输入系列排序', trigger: 'blur' },
+    {
+      pattern: /^\d+$/,
+      message: '排序必须为数字值且不能小于0',
+      trigger: 'blur'
+    }
+  ],
+  seriesStatus: [
+    { required: true, message: '请选择系列状态', trigger: 'blur' }
+  ]
+})
+const init = (seriesId) => {
+  console.log('init', seriesId)
+  visible.value = true
+  dataForm.value.seriesId = seriesId || null
+  dataFormRef.value?.clearValidate()
+  if (seriesId) {
+    getClubInfo()
+  }
+}
+const closeDialog = () => {
+  visible.value = false
+  dataForm.value = {
+    seriesId: null,
+    seriesName: '',
+    brandId: '',
+    seriesSeq: '',
+    seriesStatus: 1
+  }
+}
+const getClubInfo = () => {
+  getStickSeriesDetail({ seriesId: dataForm.value.seriesId }).then((res) => {
+    Object.keys(dataForm.value).forEach((key) => {
+      dataForm.value[key] = res[key]
+    })
+  })
+}
+const onPropChange = (prop) => {
+  dataFormRef.value?.validateField(prop)
+}
+
+const onSubmit = () => {
+  console.log(dataForm.value)
+
+  dataFormRef.value?.validate((valid) => {
+    if (valid) {
+      btnLoading.value = true
+      if (!dataForm.value.seriesId) {
+        addStickSeries(dataForm.value)
+          .then(() => {
+            ElMessage.success('新增成功')
+            emit('refresh-data-list')
+            btnLoading.value = false
+            closeDialog()
+          })
+          .catch((err) => {
+            btnLoading.value = false
+            console.log(err)
+          })
+      } else {
+        updateStickSeries(dataForm.value)
+          .then(() => {
+            ElMessage.success('修改成功')
+            emit('refresh-data-list')
+            btnLoading.value = false
+            closeDialog()
+          })
+          .catch((err) => {
+            btnLoading.value = false
+            console.log(err)
+          })
+      }
+      visible.value = false
+    } else {
+      console.log('error submit!!')
+      return false
+    }
+  })
+}
+
+defineExpose({
+  init
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/product/recycle/club-series/index.vue b/src/views/modules/product/recycle/club-series/index.vue
new file mode 100644
index 0000000..5bf5d37
--- /dev/null
+++ b/src/views/modules/product/recycle/club-series/index.vue
@@ -0,0 +1,271 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 22:44:24
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-14 22:25:43
+ * @FilePath: \tmerclub-platform\src\views\modules\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div class="app-container club-series-home">
+    <!-- 搜索相关区域 -->
+    <div class="search-bar">
+      <!-- native modifier has been removed, please confirm whether the function has been affected  -->
+      <el-form
+        ref="searchRef"
+        :inline="true"
+        :model="pageQuery"
+        class="demo-form-inline"
+        @submit.prevent
+      >
+        <div class="input-row">
+          <el-form-item
+            label="系列名称："
+            prop="seriesName"
+          >
+            <el-input
+              v-model="pageQuery.seriesName"
+              placeholder="系列名称"
+              maxlength="20"
+              clearable
+            />
+          </el-form-item>
+          <!-- 品牌选择 -->
+          <el-form-item
+            label="品牌选择:"
+            prop="brandId"
+          >
+            <el-select
+              v-model="pageQuery.brandId"
+              placeholder="请选择品牌"
+              :empty-values="[null, undefined]"
+              value-key="brandId"
+            >
+              <el-option
+                v-for="item in stickBrandList"
+                :key="item.brandId"
+                :disabled="item.brandStatus == 0"
+                :label="item.brandName"
+                :value="item.brandId"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              type="primary"
+              @click="onGetPage(true)"
+            >
+              {{ $t("table.search") }}
+            </el-button>
+            <el-button @click="onClearSearchInfo()">
+              {{ $t("table.reset") }}
+            </el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+    <div class="main-content">
+      <div class="operation-bar">
+        <el-button
+          v-permission="['product:attr:save']"
+          type="primary"
+          class="filter-item"
+          @click="onAddOrUpdate()"
+        >
+          {{ $t("table.create") }}
+        </el-button>
+      </div>
+      <div class="table-con">
+        <!-- 列表相关区域 -->
+        <el-table
+          v-loading="pageLoading"
+          :data="pageVO.list"
+          header-cell-class-name="table-header"
+          row-class-name="table-row-low"
+          highlight-current-row
+          style="width: 100%"
+        >
+          <!-- 排序 -->
+          <el-table-column
+            label="排序"
+            prop="seriesSeq"
+            align="left"
+          />
+          <!-- 系列名称 -->
+          <el-table-column
+            label="系列名称"
+            prop="seriesName"
+            align="left"
+          />
+          <el-table-column
+            label="品牌名称"
+            prop="brandId"
+            align="left"
+          >
+            <template #default="{ row }">
+              <span>{{ stickBrandList.find((item) => item.brandId === row.brandId)?.brandName }}</span>
+            </template>
+          </el-table-column>
+
+          <!-- 创建时间 -->
+          <el-table-column
+            :label="$t('table.createTime')"
+            prop="createTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.createTime }}</span>
+            </template>
+          </el-table-column>
+          <!-- 更新时间 -->
+          <el-table-column
+            :label="$t('table.updateTime')"
+            prop="updateTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.updateTime }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('table.actions')"
+            align="center"
+            width="230"
+            class-name="small-padding fixed-width"
+          >
+            <template #default="{ row }">
+              <div class="table-btn-con">
+                <el-button
+                  v-permission="['product:attr:update']"
+                  type="primary"
+                  link
+                  @click="onAddOrUpdate(row.seriesId)"
+                >
+                  {{ $t("table.edit") }}
+                </el-button>
+                <el-button
+                  v-permission="['product:attr:delete']"
+                  type="primary"
+                  link
+                  @click="onDelete(row.seriesId)"
+                >
+                  {{ $t("table.delete") }}
+                </el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <!-- 分页条 -->
+    <pagination
+      v-show="pageVO.total > 0"
+      v-model:page="pageQuery.pageNum"
+      v-model:limit="pageQuery.pageSize"
+      :total="pageVO.total"
+      @pagination="onGetPage()"
+    />
+    <add-or-update
+      ref="addOrUpdateRef"
+      :stick-brand-list="stickBrandList"
+      @refresh-data-list="onGetPage()"
+    />
+  </div>
+</template>
+
+<script setup>
+import {
+  getStickSeries,
+  deleteStickSeries,
+  getStickBrand
+} from '@/api/product/recycle'
+import AddOrUpdate from './add-or-update.vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+const addOrUpdateRef = ref(null)
+const searchRef = ref(null)
+const pageLoading = ref(false)
+const addOrUpdateVisible = ref(false)
+const pageQuery = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  seriesName: null,
+  seriesId: null
+})
+const pageVO = reactive({
+  total: 0,
+  list: []
+})
+
+const stickBrandList = ref([]) // 获取球杆品牌列表
+const onGetPage = () => {
+  pageLoading.value = true
+  getStickSeries(pageQuery)
+    .then((res) => {
+      console.log(res)
+      pageVO.list = res.list
+      pageVO.total = res.total
+    })
+    .finally(() => {
+      pageLoading.value = false
+    })
+}
+const getStickBrandList = (val) => {
+  getStickBrand({
+    pageNum: 1,
+    pageSize: 10000
+  }).then((res) => {
+    stickBrandList.value = res.list
+  })
+}
+const findBrandName = (seriesId) => {
+  console.log(stickBrandList.value)
+
+  const brand = stickBrandList.value.find((item) => item.seriesId == seriesId)
+  return brand ? brand.seriesName : ''
+}
+
+// 清空搜索内容
+const onClearSearchInfo = () => {
+  searchRef.value.resetFields()
+  onGetPage()
+}
+
+const onAddOrUpdate = (id) => {
+  addOrUpdateVisible.value = true
+  nextTick(() => {
+    addOrUpdateRef.value.init(id)
+  })
+}
+
+// 删除球杆
+const onDelete = (seriesId) => {
+  ElMessageBox.confirm('确定删除该球杆吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  })
+    .then(() => {
+      deleteStickSeries({ seriesId }).then(() => {
+        ElMessage.success('删除成功')
+        onGetPage()
+      })
+    })
+    .catch(() => {})
+}
+onMounted(() => {
+  onGetPage()
+  getStickBrandList()
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/product/recycle/club-type/add-or-update.vue b/src/views/modules/product/recycle/club-type/add-or-update.vue
new file mode 100644
index 0000000..cc2475f
--- /dev/null
+++ b/src/views/modules/product/recycle/club-type/add-or-update.vue
@@ -0,0 +1,206 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:53:04
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 21:32:05
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\add-or-update.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div>
+    <div class="club-type-manage">
+      <el-dialog
+        v-model="visible"
+        :title="dataForm.typeId ? $t('table.edit') : $t('table.create')"
+        :close-on-click-modal="false"
+        width="600px"
+        :destroy-on-close="true"
+        top="5vh"
+        class="el-dialog-bodyt"
+        @close="closeDialog"
+      >
+        <el-form
+          ref="dataFormRef"
+          :rules="rules"
+          :model="dataForm"
+          label-position="right"
+          label-width="110px"
+          style="width: 500px; margin-left: 35px"
+          @submit.prevent
+        >
+          <!-- 类型名称 -->
+          <el-form-item
+            label="类型名称:"
+            prop="typeName"
+          >
+            <el-input
+              v-model="dataForm.typeName"
+              type="text"
+              maxlength="10"
+              placeholder="类型名称"
+            />
+          </el-form-item>
+          <!-- 类型图片 -->
+          <el-form-item
+            label="类型图片:"
+            prop="typeImage"
+          >
+            <img-upload
+              v-model="dataForm.typeImage"
+              @input="onPropChange('typeImage')"
+            />
+            <div
+              class=""
+              style="width: 100%"
+            >
+              建议图片尺寸为1920*45 0
+            </div>
+          </el-form-item>
+          <!-- 排序 -->
+          <el-form-item
+            label="排序:"
+            prop="typeSeq"
+          >
+            <el-input
+              v-model="dataForm.typeSeq"
+              type="text"
+              maxlength="10"
+              placeholder="排序"
+            />
+          </el-form-item>
+          <!-- 状态 -->
+          <el-form-item
+            label="状态:"
+            prop="typeStatus"
+          >
+            <el-radio-group v-model="dataForm.typeStatus">
+              <el-radio :label="1">
+                启用
+              </el-radio>
+              <el-radio :label="0">
+                禁用
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-form>
+        <template #footer>
+          <div class="dialog-footer">
+            <el-button @click="visible = false">
+              {{ $t("table.cancel") }}
+            </el-button>
+            <el-button
+              type="primary"
+              :loading="btnLoading"
+              @click="onSubmit()"
+            >
+              {{ $t("table.confirm") }}
+            </el-button>
+          </div>
+        </template>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { getStickTypeDetail, addStickType, updateStickType } from '@/api/product/recycle'
+import { ElMessage, ElMessageBox } from 'element-plus'
+const emit = defineEmits(['refresh-data-list'])
+const dataFormRef = ref(null)
+const visible = ref(false)
+const btnLoading = ref(false)
+const dataForm = ref({
+  typeId: null,
+  typeName: '',
+  typeImage: '',
+  typeSeq: '',
+  typeStatus: 1
+})
+const rules = reactive({
+  typeName: [{ required: true, message: '请输入类型名称', trigger: 'blur' }],
+  typeImage: [
+    { required: true, message: '请选择类型图片', trigger: 'blur' }
+  ],
+  typeSeq: [
+    { required: true, message: '请输入类型排序', trigger: 'blur' },
+    {
+      pattern: /^\d+$/,
+      message: '排序必须为数字值且不能小于0',
+      trigger: 'blur'
+    }
+  ],
+  typeStatus: [
+    { required: true, message: '请选择类型状态', trigger: 'blur' }
+  ]
+})
+const init = (typeId) => {
+  console.log('init', typeId)
+  visible.value = true
+  dataForm.value.typeId = typeId || null
+  dataFormRef.value?.clearValidate()
+  if (typeId) {
+    getClubInfo()
+  }
+}
+const closeDialog = () => {
+  visible.value = false
+  dataForm.value = {
+    typeId: null,
+    typeName: '',
+    typeImage: '',
+    typeSeq: '',
+    typeStatus: 1
+  }
+}
+const getClubInfo = () => {
+  getStickTypeDetail({ typeId: dataForm.value.typeId }).then((res) => {
+    Object.keys(dataForm.value).forEach((key) => {
+      dataForm.value[key] = res[key]
+    })
+  })
+}
+const onPropChange = (prop) => {
+  dataFormRef.value?.validateField(prop)
+}
+
+const onSubmit = () => {
+  console.log(dataForm.value)
+
+  dataFormRef.value?.validate((valid) => {
+    if (valid) {
+      btnLoading.value = true
+      if (!dataForm.value.typeId) {
+        addStickType(dataForm.value).then(() => {
+          ElMessage.success('新增成功')
+          emit('refresh-data-list')
+          btnLoading.value = false
+          closeDialog()
+        }).catch((err) => {
+          btnLoading.value = false
+          console.log(err)
+        })
+      } else {
+        updateStickType(dataForm.value).then(() => {
+          ElMessage.success('修改成功')
+          emit('refresh-data-list')
+          btnLoading.value = false
+          closeDialog()
+        }).catch((err) => {
+          btnLoading.value = false
+          console.log(err)
+        })
+      }
+      visible.value = false
+    } else {
+      console.log('error submit!!')
+      return false
+    }
+  })
+}
+
+defineExpose({
+  init
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/product/recycle/club-type/index.vue b/src/views/modules/product/recycle/club-type/index.vue
new file mode 100644
index 0000000..4a3bead
--- /dev/null
+++ b/src/views/modules/product/recycle/club-type/index.vue
@@ -0,0 +1,234 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 22:44:45
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-14 22:25:43
+ * @FilePath: \tmerclub-platform\src\views\modules\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div class="app-container club-type-home">
+    <!-- 搜索相关区域 -->
+    <div class="search-bar">
+      <!-- native modifier has been removed, please confirm whether the function has been affected  -->
+      <el-form
+        ref="searchRef"
+        :inline="true"
+        :model="pageQuery"
+        class="demo-form-inline"
+        @submit.prevent
+      >
+        <div class="input-row">
+          <el-form-item
+            label="类型名称："
+            prop="typeName"
+          >
+            <el-input
+              v-model="pageQuery.typeName"
+              placeholder="类型名称"
+              maxlength="20"
+              clearable
+            />
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              type="primary"
+              @click="onGetPage(true)"
+            >
+              {{ $t("table.search") }}
+            </el-button>
+            <el-button @click="onClearSearchInfo()">
+              {{ $t("table.reset") }}
+            </el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+    <div class="main-content">
+      <div class="operation-bar">
+        <el-button
+          v-permission="['product:attr:save']"
+          type="primary"
+          class="filter-item"
+          @click="onAddOrUpdate()"
+        >
+          {{ $t("table.create") }}
+        </el-button>
+      </div>
+      <div class="table-con">
+        <!-- 列表相关区域 -->
+        <el-table
+          v-loading="pageLoading"
+          :data="pageVO.list"
+          header-cell-class-name="table-header"
+          row-class-name="table-row-low"
+          highlight-current-row
+          style="width: 100%"
+        >
+          <el-table-column
+            label="排序"
+            prop="typeSeq"
+            align="left"
+          />
+          <!-- 类型名称 -->
+          <el-table-column
+            label="类型名称"
+            prop="typeName"
+            align="left"
+          />
+          <!-- 类型图片 -->
+          <el-table-column
+            label="类型图片"
+            prop="typeImage"
+            align="left"
+          >
+            <template #default="{ row }">
+              <img-show :src="row.typeImage" />
+            </template>
+          </el-table-column>
+          <!-- 创建时间 -->
+          <el-table-column
+            :label="$t('table.createTime')"
+            prop="createTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.createTime }}</span>
+            </template>
+          </el-table-column>
+          <!-- 更新时间 -->
+          <el-table-column
+            :label="$t('table.updateTime')"
+            prop="updateTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.updateTime }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('table.actions')"
+            align="center"
+            width="230"
+            class-name="small-padding fixed-width"
+          >
+            <template #default="{ row }">
+              <div class="table-btn-con">
+                <el-button
+                  v-permission="['product:attr:update']"
+                  type="primary"
+                  link
+                  @click="onAddOrUpdate(row.typeId)"
+                >
+                  {{ $t("table.edit") }}
+                </el-button>
+                <el-button
+                  v-permission="['product:attr:delete']"
+                  type="primary"
+                  link
+                  @click="onDelete(row.typeId)"
+                >
+                  {{ $t("table.delete") }}
+                </el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <!-- 分页条 -->
+    <pagination
+      v-show="pageVO.total > 0"
+      v-model:page="pageQuery.pageNum"
+      v-model:limit="pageQuery.pageSize"
+      :total="pageVO.total"
+      @pagination="onGetPage()"
+    />
+    <add-or-update
+      ref="addOrUpdateRef"
+
+      @refresh-data-list="onGetPage()"
+    />
+  </div>
+</template>
+
+<script setup>
+import {
+  getStickType,
+  deleteStickType
+} from '@/api/product/recycle'
+import AddOrUpdate from './add-or-update.vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+const addOrUpdateRef = ref(null)
+const searchRef = ref(null)
+const pageLoading = ref(false)
+const addOrUpdateVisible = ref(false)
+const pageQuery = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  typeName: null
+})
+const pageVO = reactive({
+  total: 0,
+  list: []
+})
+
+const stickBrandList = ref([]) // 获取品牌列表
+const stickTypeList = ref([]) // 获取球杆类型列表
+const stickSeriesList = ref([]) // 获取球杆系列列表
+const onGetPage = () => {
+  pageLoading.value = true
+  getStickType(pageQuery)
+    .then((res) => {
+      console.log(res)
+      pageVO.list = res.list
+      pageVO.total = res.total
+    })
+    .finally(() => {
+      pageLoading.value = false
+    })
+}
+// 清空搜索内容
+const onClearSearchInfo = () => {
+  searchRef.value.resetFields()
+  onGetPage()
+}
+
+const onAddOrUpdate = (id) => {
+  addOrUpdateVisible.value = true
+  nextTick(() => {
+    addOrUpdateRef.value.init(id)
+  })
+}
+
+// 删除球杆
+const onDelete = (typeId) => {
+  ElMessageBox.confirm('确定删除该球杆吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  })
+    .then(() => {
+      deleteStickType({ typeId }).then(() => {
+        ElMessage.success('删除成功')
+        onGetPage()
+      })
+    })
+    .catch(() => {})
+}
+onMounted(() => {
+  onGetPage()
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/product/recycle/club/add-or-update.vue b/src/views/modules/product/recycle/club/add-or-update.vue
new file mode 100644
index 0000000..ec72e08
--- /dev/null
+++ b/src/views/modules/product/recycle/club/add-or-update.vue
@@ -0,0 +1,323 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:53:04
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 20:09:31
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\add-or-update.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div>
+    <div class="club-manage">
+      <el-dialog
+        v-model="visible"
+        :title="dataForm.productId ? $t('table.edit') : $t('table.create')"
+        :close-on-click-modal="false"
+        width="600px"
+        :destroy-on-close="true"
+        top="5vh"
+        class="el-dialog-bodyt"
+        @close="closeDialog"
+      >
+        <el-form
+          ref="dataFormRef"
+          :rules="rules"
+          :model="dataForm"
+          label-position="right"
+          label-width="110px"
+          style="width: 500px; margin-left: 35px"
+          @submit.prevent
+        >
+          <!-- 商品名称 -->
+          <el-form-item
+            label="商品名称:"
+            prop="productName"
+          >
+            <el-input
+              v-model="dataForm.productName"
+              type="text"
+              maxlength="10"
+              placeholder="商品名称"
+            />
+          </el-form-item>
+          <!-- 商品图片 -->
+          <el-form-item
+            label="商品图片:"
+            prop="productImages"
+          >
+            <img-upload
+              v-model="dataForm.productImages"
+              @input="onPropChange('productImages')"
+            />
+            <div
+              class=""
+              style="width: 100%"
+            >
+              建议图片尺寸为1920*45 0
+            </div>
+          </el-form-item>
+          <!-- 商品价格 -->
+          <el-form-item
+            label="商品价格:"
+            prop="productPrice"
+          >
+            <el-input
+              v-model="dataForm.productPrice"
+              type="text"
+              maxlength="10"
+              placeholder="商品价格"
+            />
+          </el-form-item>
+          <!-- 品牌选择 -->
+          <el-form-item
+            label="品牌选择:"
+            prop="brandId"
+          >
+            <el-select
+              v-model="dataForm.brandId"
+              placeholder="请选择品牌"
+              :empty-values="[null, undefined]"
+              value-key="brandId"
+            >
+              <el-option
+                v-for="item in stickBrandList"
+                :key="item.brandId"
+                :disabled="item.brandStatus == 0"
+                :label="item.brandName"
+                :value="item.brandId"
+              />
+            </el-select>
+          </el-form-item>
+          <!-- 类型选择 -->
+          <el-form-item
+            label="类型选择:"
+            prop="typeId"
+          >
+            <el-select
+              v-model="dataForm.typeId"
+              placeholder="请选择类型"
+            >
+              <el-option
+                v-for="item in stickTypeList"
+                :key="item.typeId"
+                :disabled="item.typeStatus == 0"
+                :label="item.typeName"
+                :value="item.typeId"
+              />
+            </el-select>
+          </el-form-item>
+          <!-- 获取系列 -->
+          <el-form-item
+            label="系列选择:"
+            prop="seriesId"
+          >
+            <el-select
+              v-model="dataForm.seriesId"
+              placeholder="请选择系列"
+            >
+              <el-option
+                v-for="item in stickSeriesList"
+                :key="item.seriesId"
+                :disabled="item.seriesStatus == 0"
+                :label="item.seriesName"
+                :value="item.seriesId"
+              />
+            </el-select>
+          </el-form-item>
+          <!-- 排序 -->
+          <el-form-item
+            label="排序:"
+            prop="productSeq"
+          >
+            <el-input
+              v-model="dataForm.productSeq"
+              type="text"
+              maxlength="10"
+              placeholder="排序"
+            />
+          </el-form-item>
+          <!-- 状态 -->
+          <el-form-item
+            label="状态:"
+            prop="productStatus"
+          >
+            <el-radio-group v-model="dataForm.productStatus">
+              <el-radio :label="1">
+                上架
+              </el-radio>
+              <el-radio :label="0">
+                下架
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-form>
+        <template #footer>
+          <div class="dialog-footer">
+            <el-button @click="visible = false">
+              取消
+            </el-button>
+            <el-button
+              type="primary"
+              :loading="btnLoading"
+              @click="onSubmit()"
+            >
+              确认
+            </el-button>
+          </div>
+        </template>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { getStickDetail, addStick, updateStick } from '@/api/product/recycle'
+import { ElMessage, ElMessageBox } from 'element-plus'
+const props = defineProps({
+  stickBrandList: {
+    type: Array,
+    default: () => []
+  },
+  stickTypeList: {
+    type: Array,
+    default: () => []
+  },
+  stickSeriesList: {
+    type: Array,
+    default: () => []
+  }
+})
+const emit = defineEmits(['refresh-data-list'])
+const { proxy } = getCurrentInstance()
+const dataFormRef = ref(null)
+const route = useRoute()
+const router = useRouter()
+const visible = ref(false)
+const title = ref('')
+const type = ref('')
+const clubList = ref([])
+const attrValue = ref('')
+const btnLoading = ref(false)
+const dataForm = ref({
+  productId: null,
+  productName: '',
+  productDescription: '',
+  productImages: '',
+  productPrice: '',
+  productSeq: '',
+  productStatus: 1,
+  typeId: null,
+  brandId: null,
+  seriesId: null
+})
+const rules = reactive({
+  productName: [{ required: true, message: '请输入商品名称', trigger: 'blur' }],
+  productPrice: [
+    { required: true, message: '请输入商品价格', trigger: 'blur' },
+    // 价格必须为数字值 且不能小于0
+    {
+      pattern: /^\d+$/,
+      message: '价格必须为数字值且不能小于0',
+      trigger: 'blur'
+    }
+  ],
+  productImages: [
+    { required: true, message: '请选择商品图片', trigger: 'blur' }
+  ],
+  productSeq: [
+    { required: true, message: '请输入商品排序', trigger: 'blur' },
+    {
+      pattern: /^\d+$/,
+      message: '排序必须为数字值且不能小于0',
+      trigger: 'blur'
+    }
+  ],
+  productStatus: [
+    { required: true, message: '请选择商品状态', trigger: 'blur' }
+  ],
+  typeId: [{ required: true, message: '请选择球杆类型', trigger: 'blur' }],
+  brandId: [{ required: true, message: '请选择球杆品牌', trigger: 'blur' }],
+  seriesId: [{ required: true, message: '请选择球杆系列', trigger: 'blur' }]
+})
+const init = (productId) => {
+  console.log('init', productId)
+  visible.value = true
+  dataForm.value.productId = productId || null
+
+  dataFormRef.value?.clearValidate()
+  if (productId) {
+    getClubInfo()
+  }
+}
+const closeDialog = () => {
+  visible.value = false
+  dataForm.value = {
+    productId: null,
+    productName: '',
+    productDescription: '',
+    productImages: '',
+    productPrice: '',
+    productSeq: '',
+    productStatus: 1,
+    typeId: null,
+    brandId: null,
+    seriesId: null
+  }
+}
+const getClubInfo = () => {
+  getStickDetail({ productId: dataForm.value.productId }).then((res) => {
+    Object.keys(dataForm.value).forEach((key) => {
+      dataForm.value[key] = res[key]
+    })
+    console.log(props.stickBrandList)
+    nextTick(() => {
+      dataFormRef.value?.forceUpdate()
+    })
+    console.log(dataForm.value)
+  })
+}
+const onPropChange = (prop) => {
+  dataFormRef.value?.validateField(prop)
+}
+
+const onSubmit = () => {
+  console.log(dataForm.value)
+
+  dataFormRef.value?.validate((valid) => {
+    if (valid) {
+      btnLoading.value = true
+      if (!dataForm.value.productId) {
+        addStick(dataForm.value).then(() => {
+          ElMessage.success('新增成功')
+          emit('refresh-data-list')
+          btnLoading.value = false
+          closeDialog()
+        }).catch((err) => {
+          btnLoading.value = false
+          console.log(err)
+        })
+      } else {
+        updateStick(dataForm.value).then(() => {
+          ElMessage.success('修改成功')
+          emit('refresh-data-list')
+          btnLoading.value = false
+          closeDialog()
+        }).catch((err) => {
+          btnLoading.value = false
+          console.log(err)
+        })
+      }
+      visible.value = false
+    } else {
+      console.log('error submit!!')
+      return false
+    }
+  })
+}
+
+defineExpose({
+  init
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/product/recycle/club/index.vue b/src/views/modules/product/recycle/club/index.vue
new file mode 100644
index 0000000..377f953
--- /dev/null
+++ b/src/views/modules/product/recycle/club/index.vue
@@ -0,0 +1,344 @@
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-15 20:15:09
+ * @FilePath: \tmerclub-platform\src\views\modules\product\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<!--
+ * @Author: 快乐橙 1760016317@qq.com
+ * @Date: 2025-04-14 21:19:35
+ * @LastEditors: 快乐橙 1760016317@qq.com
+ * @LastEditTime: 2025-04-14 22:25:43
+ * @FilePath: \tmerclub-platform\src\views\modules\recycle\club\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div class="app-container club-home">
+    <!-- 搜索相关区域 -->
+    <div class="search-bar">
+      <!-- native modifier has been removed, please confirm whether the function has been affected  -->
+      <el-form
+        ref="searchRef"
+        :inline="true"
+        :model="pageQuery"
+        class="demo-form-inline"
+        @submit.prevent
+      >
+        <div class="input-row">
+          <el-form-item
+            label="商品名称："
+            prop="productName"
+          >
+            <el-input
+              v-model="pageQuery.productName"
+              placeholder="商品名称"
+              maxlength="20"
+              clearable
+            />
+          </el-form-item>
+          <!-- 品牌选择 -->
+          <el-form-item
+            label="品牌选择:"
+            prop="brandId"
+          >
+            <el-select
+              v-model="pageQuery.brandId"
+              placeholder="请选择品牌"
+              :empty-values="[null, undefined]"
+              value-key="brandId"
+            >
+              <el-option
+                v-for="item in stickBrandList"
+                :key="item.brandId"
+                :disabled="item.brandStatus == 0"
+                :label="item.brandName"
+                :value="item.brandId"
+              />
+            </el-select>
+          </el-form-item>
+          <!-- 类型选择 -->
+          <el-form-item
+            label="类型选择:"
+            prop="typeId"
+          >
+            <el-select
+              v-model="pageQuery.typeId"
+              placeholder="请选择类型"
+            >
+              <el-option
+                v-for="item in stickTypeList"
+                :key="item.typeId"
+                :disabled="item.typeStatus == 0"
+                :label="item.typeName"
+                :value="item.typeId"
+              />
+            </el-select>
+          </el-form-item>
+          <!-- 获取系列 -->
+          <el-form-item
+            label="系列选择:"
+            prop="seriesId"
+          >
+            <el-select
+              v-model="pageQuery.seriesId"
+              placeholder="请选择系列"
+            >
+              <el-option
+                v-for="item in stickSeriesList"
+                :key="item.seriesId"
+                :disabled="item.seriesStatus == 0"
+                :label="item.seriesName"
+                :value="item.seriesId"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              type="primary"
+              @click="onGetPage(true)"
+            >
+              {{ $t("table.search") }}
+            </el-button>
+            <el-button @click="onClearSearchInfo()">
+              {{ $t("table.reset") }}
+            </el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+    <div class="main-content">
+      <div class="operation-bar">
+        <el-button
+          v-permission="['product:attr:save']"
+          type="primary"
+          class="filter-item"
+          @click="onAddOrUpdate()"
+        >
+          {{ $t("table.create") }}
+        </el-button>
+      </div>
+      <div class="table-con">
+        <!-- 列表相关区域 -->
+        <el-table
+          v-loading="pageLoading"
+          :data="pageVO.list"
+          header-cell-class-name="table-header"
+          row-class-name="table-row-low"
+          highlight-current-row
+          style="width: 100%"
+        >
+          <!-- 商品名称 -->
+          <el-table-column
+            label="商品名称"
+            prop="productName"
+            align="left"
+          />
+          <!-- 商品图片 -->
+          <el-table-column
+            label="商品图片"
+            prop="productImages"
+            align="left"
+          >
+            <template #default="{ row }">
+              <img-show :src="row.productImages" />
+            </template>
+          </el-table-column>
+          <!-- 商品价格 -->
+          <el-table-column
+            label="价格"
+            prop="productPrice"
+            align="left"
+          />
+          <el-table-column
+            label="品牌"
+            prop="brandName"
+            align="left"
+          />
+          <el-table-column
+            label="系列"
+            prop="seriesName"
+            align="left"
+          />
+          <el-table-column
+            label="类型"
+            prop="typeName"
+            align="left"
+          />
+          <!-- 创建时间 -->
+          <el-table-column
+            :label="$t('table.createTime')"
+            prop="createTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.createTime }}</span>
+            </template>
+          </el-table-column>
+          <!-- 更新时间 -->
+          <el-table-column
+            :label="$t('table.updateTime')"
+            prop="updateTime"
+            align="center"
+            min-width="180"
+          >
+            <template #default="{ row }">
+              <span>{{ row.updateTime }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('table.actions')"
+            align="center"
+            width="230"
+            class-name="small-padding fixed-width"
+          >
+            <template #default="{ row }">
+              <div class="table-btn-con">
+                <el-button
+                  v-permission="['product:attr:update']"
+                  type="primary"
+                  link
+                  @click="onAddOrUpdate(row.productId)"
+                >
+                  {{ $t("table.edit") }}
+                </el-button>
+                <el-button
+                  v-permission="['product:attr:delete']"
+                  type="primary"
+                  link
+                  @click="onDelete(row.productId)"
+                >
+                  {{ $t("table.delete") }}
+                </el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <!-- 分页条 -->
+    <pagination
+      v-show="pageVO.total > 0"
+      v-model:page="pageQuery.pageNum"
+      v-model:limit="pageQuery.pageSize"
+      :total="pageVO.total"
+      @pagination="onGetPage()"
+    />
+    <add-or-update
+      ref="addOrUpdateRef"
+      :stick-brand-list="stickBrandList"
+      :stick-type-list="stickTypeList"
+      :stick-series-list="stickSeriesList"
+      @refresh-data-list="onGetPage()"
+    />
+  </div>
+</template>
+
+<script setup>
+import {
+  getStickList,
+  getStickBrand,
+  getStickType,
+  getStickSeries,
+  deleteStick
+} from '@/api/product/recycle'
+import AddOrUpdate from './add-or-update.vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+const addOrUpdateRef = ref(null)
+const searchRef = ref(null)
+const pageLoading = ref(false)
+const addOrUpdateVisible = ref(false)
+const pageQuery = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  productName: null,
+  brandId: null,
+  typeId: null,
+  seriesId: null
+})
+const pageVO = reactive({
+  total: 0,
+  list: []
+})
+
+const stickBrandList = ref([]) // 获取品牌列表
+const stickTypeList = ref([]) // 获取球杆类型列表
+const stickSeriesList = ref([]) // 获取球杆系列列表
+const onGetPage = () => {
+  pageLoading.value = true
+  getStickList(pageQuery)
+    .then((res) => {
+      console.log(res)
+      pageVO.list = res.list
+      pageVO.total = res.total
+    })
+    .finally(() => {
+      pageLoading.value = false
+    })
+}
+// 清空搜索内容
+const onClearSearchInfo = () => {
+  searchRef.value.resetFields()
+  onGetPage()
+}
+
+const onAddOrUpdate = (id) => {
+  addOrUpdateVisible.value = true
+  nextTick(() => {
+    addOrUpdateRef.value.init(id)
+  })
+}
+// 获取品牌列表
+const getStickBrandList = (val) => {
+  getStickBrand({
+    pageNum: 1,
+    pageSize: 10000
+  }).then((res) => {
+    stickBrandList.value = res.list
+  })
+}
+// 获取球杆类型列表
+const getStickTypeList = (val) => {
+  getStickType({
+    pageNum: 1,
+    pageSize: 10000
+  }).then((res) => {
+    stickTypeList.value = res.list
+  })
+}
+// 获取球杆系列列表
+const getStickSeriesList = (val) => {
+  getStickSeries({
+    pageNum: 1,
+    pageSize: 10000
+  }).then((res) => {
+    stickSeriesList.value = res.list
+  })
+}
+
+// 删除球杆
+const onDelete = (productId) => {
+  ElMessageBox.confirm('确定删除该球杆吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  })
+    .then(() => {
+      deleteStick({ productId }).then(() => {
+        ElMessage.success('删除成功')
+        onGetPage()
+      })
+    })
+    .catch(() => {})
+}
+onMounted(() => {
+  onGetPage()
+  getStickBrandList()
+  getStickTypeList()
+  getStickSeriesList()
+})
+</script>
+
+<style lang="scss" scoped></style>