源文件
This commit is contained in:
109
src/views/product/group/index.vue
Normal file
109
src/views/product/group/index.vue
Normal file
@@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="head-container">
|
||||
<el-button type="primary" icon="el-icon-plus" @click="$refs.addGroupRef.show()">
|
||||
添加分组
|
||||
</el-button>
|
||||
<addGroup ref="addGroupRef" @success="resetHandle" />
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-table :data="tableData.list" v-loading="tableData.loading">
|
||||
<el-table-column label="排序" sortable prop="sort"></el-table-column>
|
||||
<el-table-column label="分组名称" prop="name"></el-table-column>
|
||||
<el-table-column label="状态">
|
||||
<template v-slot="scope">
|
||||
<el-switch v-model="scope.row.isShow" :active-value="1" :inactive-value="0"
|
||||
@change="showChange($event, scope.row)"></el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="200">
|
||||
<template v-slot="scope">
|
||||
<el-button type="text" size="mini" round icon="el-icon-edit"
|
||||
@click="$refs.addGroupRef.show(scope.row)">编辑</el-button>
|
||||
<el-popconfirm title="确定删除吗?" @confirm="delHandle([scope.row.id])">
|
||||
<el-button type="text" size="mini" round icon="el-icon-delete" slot="reference">
|
||||
删除
|
||||
</el-button>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
|
||||
@current-change="paginationChange" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import addGroup from '../components/addGroup'
|
||||
import { tbProductGroupGet, tbProductGroupDelete, tbProductGroupPut } from '@/api/shop'
|
||||
export default {
|
||||
components: {
|
||||
addGroup
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableData: {
|
||||
page: 0,
|
||||
size: 10,
|
||||
total: 0,
|
||||
loading: false,
|
||||
list: []
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getTableData()
|
||||
},
|
||||
methods: {
|
||||
// 状态切换
|
||||
async showChange(e, row) {
|
||||
try {
|
||||
await tbProductGroupPut(row)
|
||||
this.getTableData()
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
// 重置查询
|
||||
resetHandle() {
|
||||
this.tableData.page = 0;
|
||||
this.getTableData()
|
||||
},
|
||||
// 分页回调
|
||||
paginationChange(e) {
|
||||
this.tableData.page = e - 1
|
||||
this.getTableData()
|
||||
},
|
||||
// 删除
|
||||
async delHandle(ids) {
|
||||
try {
|
||||
await tbProductGroupDelete(ids)
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: `删除成功`,
|
||||
type: 'success'
|
||||
});
|
||||
this.getTableData()
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
// 获取商品列表
|
||||
async getTableData() {
|
||||
this.tableData.loading = true
|
||||
try {
|
||||
const res = await tbProductGroupGet({
|
||||
page: this.tableData.page,
|
||||
size: this.tableData.size,
|
||||
sort: 'id',
|
||||
shopId: localStorage.getItem('shopId')
|
||||
})
|
||||
this.tableData.loading = false
|
||||
this.tableData.list = res.content
|
||||
this.tableData.total = res.totalElements
|
||||
} catch (error) { }
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user