feat: 添加回收管理
This commit is contained in:
快乐橙
parent
d6ae718c8f
commit
7c0b7f8a66
204
src/api/product/recycle.js
Normal file
204
src/api/product/recycle.js
Normal file
@ -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
|
||||
})
|
||||
}
|
||||
206
src/views/modules/product/recycle/club-brand/add-or-update.vue
Normal file
206
src/views/modules/product/recycle/club-brand/add-or-update.vue
Normal file
@ -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>
|
||||
235
src/views/modules/product/recycle/club-brand/index.vue
Normal file
235
src/views/modules/product/recycle/club-brand/index.vue
Normal file
@ -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>
|
||||
210
src/views/modules/product/recycle/club-flaw/add-or-update.vue
Normal file
210
src/views/modules/product/recycle/club-flaw/add-or-update.vue
Normal file
@ -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>
|
||||
230
src/views/modules/product/recycle/club-flaw/index.vue
Normal file
230
src/views/modules/product/recycle/club-flaw/index.vue
Normal file
@ -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>
|
||||
221
src/views/modules/product/recycle/club-series/add-or-update.vue
Normal file
221
src/views/modules/product/recycle/club-series/add-or-update.vue
Normal file
@ -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>
|
||||
271
src/views/modules/product/recycle/club-series/index.vue
Normal file
271
src/views/modules/product/recycle/club-series/index.vue
Normal file
@ -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>
|
||||
206
src/views/modules/product/recycle/club-type/add-or-update.vue
Normal file
206
src/views/modules/product/recycle/club-type/add-or-update.vue
Normal file
@ -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>
|
||||
234
src/views/modules/product/recycle/club-type/index.vue
Normal file
234
src/views/modules/product/recycle/club-type/index.vue
Normal file
@ -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>
|
||||
323
src/views/modules/product/recycle/club/add-or-update.vue
Normal file
323
src/views/modules/product/recycle/club/add-or-update.vue
Normal file
@ -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>
|
||||
344
src/views/modules/product/recycle/club/index.vue
Normal file
344
src/views/modules/product/recycle/club/index.vue
Normal file
@ -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>
|
||||
Loading…
x
Reference in New Issue
Block a user