<template>
|
<div class="rightContent">
|
<div class="top">
|
<SearchCommonView
|
:add-title="'新建'"
|
:placeholder="'请输入产品类型'"
|
:amount-view="false"
|
@addCommonClick="addBtnClick"
|
@searchClick="getList"
|
/>
|
</div>
|
<div class="list-view">
|
<div class="table">
|
<TableCommonView
|
ref="tableListRef"
|
:table-list="tableList"
|
:show-checkcol="false"
|
:selectClassRow="selectRow"
|
@tableRowClick="clickRow"
|
>
|
<template slot="tableButton">
|
<el-table-column label="操作" width="120" align="center">
|
<template slot-scope="scope">
|
<span @click.stop="showDetail(scope.row)" class="cursor_pointer" style="margin-right: 10px">
|
<span style="color: #2a78fb">查看</span>
|
</span>
|
<span @click.stop="editRow(scope.row)" class="cursor_pointer">
|
<span style="color: #2a78fb">编辑</span>
|
</span>
|
<span @click.stop="deleteRow(scope.row)" class="cursor_pointer">
|
<span style="color: #2a78fb;margin-left: 10px">删除</span>
|
</span>
|
</template>
|
</el-table-column>
|
</template>
|
</TableCommonView>
|
</div>
|
<div class="btn-pager">
|
<PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
|
</div>
|
</div>
|
<!-- 新建/编辑 -->
|
<AddProductCategoryDialog ref="addProductCategory1" v-if="editConfig.visible" :productCategoryList="categoryList" @refresh="refresh" :edit-common-config="editConfig" />
|
</div>
|
</template>
|
|
<script>
|
import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
|
import { getProductCategoryList,deleteProductCategory } from "@/api/product/productCategory"
|
import AddProductCategoryDialog from "@/views/productManage/productCategory/AddProductCategoryDialog"
|
import {getTreeData} from '@/common/untils/index.js';
|
export default {
|
name: "ProductCategory",
|
props: {},
|
components: { AddProductCategoryDialog },
|
mixins: [pageMixin],
|
computed: {},
|
data() {
|
return {
|
selectRow:{},
|
tableList: {},
|
categoryList:[],
|
searchOptions: [],
|
editConfig: {
|
visible: false,
|
title: "新建",
|
infomation: {parentId:0},
|
autoEdit: false
|
}
|
}
|
},
|
created() {
|
this.setTable()
|
this.getData()
|
},
|
methods: {
|
clickRow(row){
|
if(row.id===this.selectRow.id){
|
this.selectRow={};
|
}else{
|
this.selectRow={...row};
|
}
|
},
|
setTable() {
|
this.tableList = {
|
key:"id",
|
tableInfomation: [],
|
selectBox: false,
|
selectIndex: true,
|
tableColumn: [
|
{
|
label: "产品类型",
|
prop: "name",
|
isShowColumn: true,
|
default: true
|
}
|
]
|
}
|
},
|
// 请求数据
|
async getData() {
|
await getProductCategoryList({
|
keyword: this.keyword,
|
page: this.pagerOptions.currPage,
|
pageSize: this.pagerOptions.pageSize
|
}).then((res) => {
|
if (res.code === 200) {
|
const list = res.data?res.data:[];
|
this.categoryList=list;
|
this.tableList.tableInfomation = getTreeData(list,'child');
|
this.pagerOptions.totalCount = res.total;
|
}
|
})
|
},
|
refresh(){
|
this.pagerOptions.currPage=1
|
this.getData()
|
},
|
// 搜索
|
getList(val) {
|
this.keyword=val;
|
this.pagerOptions.currPage=1
|
this.getData()
|
},
|
// 查看
|
showDetail(row) {
|
this.editConfig.autoEdit = false
|
this.editConfig.title = "编辑"
|
this.editConfig.infomation = { ...row }
|
this.editConfig.visible = true
|
},
|
// 编辑
|
editRow(row){
|
this.editConfig.autoEdit = true
|
this.editConfig.title = "编辑"
|
this.editConfig.infomation = { ...row };
|
this.editConfig.visible = true
|
},
|
// 新建
|
addBtnClick() {
|
this.editConfig.title = "新建"
|
this.editConfig.infomation={
|
costingMethod:null,
|
forceRemovalStrategy:null,
|
inventoryValuation:null,
|
name:'',
|
parentId:this.selectRow.id||0,
|
}
|
this.editConfig.visible = true
|
},
|
|
//删除
|
deleteRow(row){
|
this.$confirm('此操作将永久删除该产品类型, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
.then(() => {
|
deleteProductCategory({
|
id: row.id,
|
}).then((res) => {
|
if (res.code == 200) {
|
this.$message({
|
type: 'success',
|
message: '删除成功!',
|
})
|
this.getData()
|
}else{
|
this.$message.error('删除时出错,请稍后重试或联系管理员...');
|
|
}
|
})
|
})
|
.catch(() => {})
|
}
|
}
|
}
|
</script>
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<style lang="scss" scoped>
|
// .rightContent {
|
// height: 100%;
|
// background: #e6ecf2;
|
// padding: 10px;
|
// .top {
|
// margin-bottom: 20px;
|
// height: 60px;
|
// background: #fff;
|
// border-radius: 8px;
|
// }
|
// .list-view {
|
// height: calc(100% - 120px);
|
// }
|
// }
|
</style>
|