|
|
|
@ -28,47 +28,63 @@ |
|
|
|
|
</div> |
|
|
|
|
</el-card> --> |
|
|
|
|
<el-card :bordered="false" shadow="never" class="ivu-mt-16"> |
|
|
|
|
<el-button type="primary" class="bnt" @click="addClass">添加分类</el-button> |
|
|
|
|
<el-table class="mt14" :loading="loading" :data="tableData"> |
|
|
|
|
<el-table-column field="id" label="ID" tooltip width="80"></el-table-column> |
|
|
|
|
<el-table-column field="cate_name" tree-node label="分类名称" min-width="250"></el-table-column> |
|
|
|
|
<el-table-column field="pic" label="分类图标" min-width="100"> |
|
|
|
|
<template v-slot="{ row }"> |
|
|
|
|
<div class="tabBox_img" v-viewer v-if="row.pic"> |
|
|
|
|
<img v-lazy="row.pic" /> |
|
|
|
|
</div> |
|
|
|
|
<el-button type="primary" class="bnt" @click="addClass(null)">添加分类</el-button> |
|
|
|
|
<el-table row-key="id" class="mt14" v-loading="loading" :tree-props="{ children: 'children' }" :data="tableData"> |
|
|
|
|
<el-table-column prop="categoryNum" label="编号"></el-table-column> |
|
|
|
|
<el-table-column prop="categoryName" label="分类名称"></el-table-column> |
|
|
|
|
<el-table-column prop="level" label="级别"></el-table-column> |
|
|
|
|
<el-table-column prop="icon" label="分类图标" min-width="100"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<el-image style="width: 50px; height: 50px" :src="scope.row.icon" :preview-src-list="[scope.row.icon]"> |
|
|
|
|
</el-image> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column field="sort" label="排序" min-width="100" tooltip="true"></el-table-column> |
|
|
|
|
<el-table-column field="is_show" label="状态" min-width="120"> |
|
|
|
|
<template v-slot="{ row }"> |
|
|
|
|
<el-switch class="defineSwitch" :active-value="1" :inactive-value="0" v-model="row.is_show" |
|
|
|
|
:value="row.is_show" @change="onchangeIsShow(row)" size="large" active-text="开启" inactive-text="关闭"> |
|
|
|
|
<el-table-column prop="showFlag" label="是否显示"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<el-switch active-value="1" inactive-value="0" v-model="scope.row.showFlag" active-color="#13ce66" |
|
|
|
|
inactive-color="#ff4949"> |
|
|
|
|
</el-switch> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column field="date" label="操作" width="120" fixed="right"> |
|
|
|
|
<template v-slot="{ row, index }"> |
|
|
|
|
<a @click="edit(row)">编辑</a> |
|
|
|
|
<el-divider direction="vertical"></el-divider> |
|
|
|
|
<a @click="del(row, '删除商品分类', index)">删除</a> |
|
|
|
|
<el-table-column prop="sort" label="排序" min-width="100" tooltip="true"></el-table-column> |
|
|
|
|
<el-table-column prop="date" label="操作" width="120" fixed="right"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<el-dropdown> |
|
|
|
|
<el-button type=text>设置<i class="el-icon-arrow-down el-icon--right"></i></el-button> |
|
|
|
|
<el-dropdown-menu slot="dropdown"> |
|
|
|
|
<el-dropdown-item @click="edit(scope.row)">编辑</el-dropdown-item> |
|
|
|
|
<el-dropdown-item v-if="scope.row.level == 1"> |
|
|
|
|
<span @click="addClass(scope.row)">新增下级</span> |
|
|
|
|
</el-dropdown-item> |
|
|
|
|
<el-dropdown-item v-if="scope.row.level == 1">查看下级 </el-dropdown-item> |
|
|
|
|
</el-dropdown-menu> |
|
|
|
|
</el-dropdown> |
|
|
|
|
<el-button type=text> |
|
|
|
|
</el-button> |
|
|
|
|
<el-button @click="del(scope.row, scope)" type=text>删除</el-button> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
</el-table> |
|
|
|
|
</el-card> |
|
|
|
|
<div class="acea-row row-right page"> |
|
|
|
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" |
|
|
|
|
:current-page="page.currentPage" :page-sizes="[10, 15, 20, 30]" :page-size="page.pageSize" |
|
|
|
|
layout="total, sizes, prev, pager, next, jumper" :total="page.totalCount" /> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<!-- 添加 编辑表单--> |
|
|
|
|
<edit-from ref="edits" :FromData="FromData" @submitFail="userSearchs"></edit-from> |
|
|
|
|
<el-dialog title="添加分类" :visible.sync="editDialogConfig.visible" destroy-on-close :close-on-click-modal="false"> |
|
|
|
|
<edit /> |
|
|
|
|
<edit ref="edit" :parentOptions="tableData" /> |
|
|
|
|
</el-dialog> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import edit from '@/components/Category/edit' |
|
|
|
|
import edit from '@/components/Category/edit' |
|
|
|
|
import editFrom from '../../../components/from/from'; |
|
|
|
|
import productApi from '@/api/product/productAttr.js'; |
|
|
|
|
import {loadingFn} from "@/utils/validate" |
|
|
|
|
import productApi from '@/api/product/productAttr.js'; |
|
|
|
|
import { loadingFn } from "@/utils/validate" |
|
|
|
|
export default { |
|
|
|
|
name: 'product_productClassify', |
|
|
|
|
components: { |
|
|
|
@ -99,47 +115,60 @@ export default { |
|
|
|
|
total: 0, |
|
|
|
|
tableData: [], |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
mounted() { |
|
|
|
|
// this.goodsCategory(); |
|
|
|
|
// this.getList(); |
|
|
|
|
this.getList(); |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
handleCommand(e) { |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
handleSizeChange(val) { |
|
|
|
|
this.page.pageSize = val |
|
|
|
|
this.getList() |
|
|
|
|
}, |
|
|
|
|
handleCurrentChange(val) { |
|
|
|
|
this.page.currentPage = val |
|
|
|
|
this.getList() |
|
|
|
|
}, |
|
|
|
|
// 商品分类; |
|
|
|
|
goodsCategory() { |
|
|
|
|
goodsCategory() { |
|
|
|
|
}, |
|
|
|
|
// 列表 |
|
|
|
|
getList() { |
|
|
|
|
this.loading = true; |
|
|
|
|
// console.log(,'loadingFn') |
|
|
|
|
// loadingFn(this.loading,productApi.classifyGetByPage(this.page)) |
|
|
|
|
// this.artFrom.is_show = this.artFrom.is_show || ''; |
|
|
|
|
// this.artFrom.pid = this.artFrom.pid || ''; |
|
|
|
|
// productListApi(this.artFrom) |
|
|
|
|
// .then(async (res) => { |
|
|
|
|
// let data = res.data; |
|
|
|
|
// this.tableData = data.list; |
|
|
|
|
// this.total = data.count; |
|
|
|
|
// this.loading = false; |
|
|
|
|
// }) |
|
|
|
|
// .catch((res) => { |
|
|
|
|
// this.loading = false; |
|
|
|
|
// this.$message.error(res.msg); |
|
|
|
|
// }); |
|
|
|
|
// productApi.classifyGetByPage() |
|
|
|
|
loadingFn.call(this, "loading", productApi.classifyGetByPage(this.page).then(res => { |
|
|
|
|
if (res.code = 20000) ({ list: this.tableData = [], totalCount: this.page.totalCount = 0 } = res.data); |
|
|
|
|
})); |
|
|
|
|
}, |
|
|
|
|
pageChange(index) { |
|
|
|
|
this.artFrom.page = index; |
|
|
|
|
this.getList(); |
|
|
|
|
}, |
|
|
|
|
// 添加 |
|
|
|
|
addClass() { |
|
|
|
|
this.editDialogConfig.visible = true |
|
|
|
|
// this.$modalForm(productCreateApi()).then(() => this.getList()); |
|
|
|
|
addClass(parent = null) { |
|
|
|
|
this.editDialogConfig.visible = true; |
|
|
|
|
// this.$nextTick(()=>{ |
|
|
|
|
// this.$refs.edit.parent = parent; |
|
|
|
|
// }); |
|
|
|
|
if (parent) { |
|
|
|
|
let { categoryName, id } = parent; |
|
|
|
|
this.$nextTick(() => { |
|
|
|
|
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { parentCategoryName: categoryName, parentId: id, level: 2 }); |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
// 编辑 |
|
|
|
|
edit(row) { |
|
|
|
|
// this.$modalForm(productEditApi(row.id)).then(() => this.getList()); |
|
|
|
|
console.log(row.level); |
|
|
|
|
this.editDialogConfig.visible = true; |
|
|
|
|
this.$nextTick(()=>{ |
|
|
|
|
let { level, icon, showFlag, categoryName, sort, parentId } = row; |
|
|
|
|
if (row.level == 1) { |
|
|
|
|
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { level, icon, showFlag, categoryName, sort, parentId }) |
|
|
|
|
} else { |
|
|
|
|
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { level, icon, showFlag,parentCategoryName:this.tableData.find(item=>item==parentId).categoryName, categoryName, sort, parentId }) |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
// 修改状态 |
|
|
|
|
onchangeIsShow(row) { |
|
|
|
@ -175,22 +204,21 @@ export default { |
|
|
|
|
this.getList(); |
|
|
|
|
}, |
|
|
|
|
// 删除 |
|
|
|
|
del(row, tit, num) { |
|
|
|
|
let delfromData = { |
|
|
|
|
title: tit, |
|
|
|
|
num: num, |
|
|
|
|
url: `product/category/${row.id}`, |
|
|
|
|
method: 'DELETE', |
|
|
|
|
ids: '', |
|
|
|
|
}; |
|
|
|
|
this.$modalSure(delfromData) |
|
|
|
|
.then((res) => { |
|
|
|
|
this.$message.success(res.msg); |
|
|
|
|
this.getList(); |
|
|
|
|
}) |
|
|
|
|
.catch((res) => { |
|
|
|
|
this.$message.error(res.msg); |
|
|
|
|
}); |
|
|
|
|
del(row, scope) { |
|
|
|
|
console.log(scope) |
|
|
|
|
this.$alert('请确定删除!', '提示', { |
|
|
|
|
confirmButtonText: '确定', |
|
|
|
|
callback: action => { |
|
|
|
|
if (action == "confirm") { |
|
|
|
|
loadingFn.call(this, "loading", productApi.classifyDelete(row).then(res => { |
|
|
|
|
if (res.code = 20000) { |
|
|
|
|
this.$message.success("操作成功!") |
|
|
|
|
this.handleCurrentChange() |
|
|
|
|
} |
|
|
|
|
})); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
// 表格搜索 |
|
|
|
|
userSearchs() { |
|
|
|
|