YueCaiqi_wm/MallVue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

商品分类添加编辑功能

Browse Source
This commit is contained in:
zhh 2018-05-22 16:08:16 +08:00
parent 8a9004844d
commit d93e76cec6
8 changed files with 278 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/api/productCate.js
View File

@ -6,3 +6,32 @@ export function fetchList(parentId,params) {
params:params
})
}
export function deleteProductCate(id) {
return request({
url:'/productCategory/delete/'+id,
method:'get'
})
}
export function createProductCate(data) {
return request({
url:'/productCategory/create',
method:'post',
data:data
})
}
export function updateProductCate(id,data) {
return request({
url:'/productCategory/update/'+id,
method:'post',
data:data
})
}
export function getProductCate(id) {
return request({
url:'/productCategory/'+id,
method:'get',
})
}

14
src/router/index.js
View File

@ -68,6 +68,20 @@ export const constantRouterMap = [
component: () => import('@/views/pms/productCate/index'),
meta: {title: '商品分类', icon: 'product-cate'}
},
{
path: 'addProductCate',
name: 'addProductCate',
component: () => import('@/views/pms/productCate/add'),
meta: {title: '添加商品分类'},
hidden:true
},
{
path: 'updateProductCate',
name: 'updateProductCate',
component: () => import('@/views/pms/productCate/update'),
meta: {title: '修改商品分类'},
hidden:true
},
{
path: 'productAttr',
name: 'productAttr',

6
src/views/pms/brand/components/BrandDetail.vue
View File

@ -4,7 +4,7 @@
<el-form-item label="品牌名称：" prop="name">
<el-input v-model="brand.name"></el-input>
</el-form-item>
<el-form-item label="品牌首字母：" property="">
<el-form-item label="品牌首字母：">
<el-input v-model="brand.firstLetter"></el-input>
</el-form-item>
<el-form-item label="品牌LOGO：" prop="logo">
@ -66,7 +66,7 @@
},
data() {
return {
brand:null,
brand:Object.assign({}, defaultBrand),
rules: {
name: [
{required: true, message: '请输入品牌名称', trigger: 'blur'},
@ -107,7 +107,7 @@
type: 'success',
duration:1000
});
this.$router.push({path: '/pms/brand'});
this.$router.back();
});
} else {
createBrand(this.brand).then(response => {

2
src/views/pms/productAttr/components/ProductAttrDetail.vue
View File

@ -93,7 +93,7 @@
},
data() {
return {
productAttr: null,
productAttr: Object.assign({}, defaultProductAttr),
rules: {
name: [
{required: true, message: '请输入属性名称', trigger: 'blur'},

14
src/views/pms/productCate/add.vue Normal file
View File

@ -0,0 +1,14 @@
<template> 
<product-cate-detail :is-edit='false'></product-cate-detail>
</template>
<script>
import ProductCateDetail from './components/ProductCateDetail'
export default {
name: 'addProductCate',
components: { ProductCateDetail }
}
</script>
<style>
</style>

161
src/views/pms/productCate/components/ProductCateDetail.vue Normal file
View File

@ -0,0 +1,161 @@
<template>
<div class="form-container container-frame">
<el-form :model="productCate"
:rules="rules"
ref="productCateFrom"
label-width="150px">
<el-form-item label="分类名称：" prop="name">
<el-input v-model="productCate.name"></el-input>
</el-form-item>
<el-form-item label="上级分类：">
<el-select v-model="productCate.parentId"
placeholder="请选择分类">
<el-option
v-for="item in selectProductCateList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="数量单位：">
<el-input v-model="productCate.productUnit"></el-input>
</el-form-item>
<el-form-item label="排序：">
<el-input v-model="productCate.sort"></el-input>
</el-form-item>
<el-form-item label="是否显示：">
<el-radio-group v-model="productCate.showStatus">
<el-radio :label="1">是</el-radio>
<el-radio :label="0">否</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="是否显示在导航栏：">
<el-radio-group v-model="productCate.navStatus">
<el-radio :label="1">是</el-radio>
<el-radio :label="0">否</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="分类图标：">
<single-upload v-model="productCate.icon"></single-upload>
</el-form-item>
<el-form-item label="关键词：">
<el-input v-model="productCate.keywords"></el-input>
</el-form-item>
<el-form-item label="分类描述：">
<el-input type="textarea" :autosize="true" v-model="productCate.description"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('productCateFrom')">提交</el-button>
<el-button v-if="!isEdit" @click="resetForm('productCateFrom')">重置</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {fetchList, createProductCate, updateProductCate, getProductCate} from '@/api/productCate';
import SingleUpload from '@/components/Upload/singleUpload';
const defaultProductCate = {
description: '',
icon: '',
keywords: '',
name: '',
navStatus: 0,
parentId: 0,
productUnit: '',
showStatus: 0,
sort: 0
};
export default {
name: "ProductCateDetail",
components: {SingleUpload},
props: {
isEdit: {
type: Boolean,
default: false
}
},
data() {
return {
productCate: Object.assign({}, defaultProductCate),
selectProductCateList: [],
rules: {
name: [
{required: true, message: '请输入品牌名称', trigger: 'blur'},
{min: 2, max: 140, message: '长度在 2 到 140 个字符', trigger: 'blur'}
]
}
}
},
created() {
if (this.isEdit) {
getProductCate(this.$route.query.id).then(response => {
this.productCate = response.data;
});
} else {
this.productCate = Object.assign({}, defaultProductCate);
}
this.getSelectProductCateList();
},
methods: {
getSelectProductCateList() {
fetchList(0, {pageSize: 100, pageNum: 1}).then(response => {
this.selectProductCateList = response.data.list;
this.selectProductCateList.unshift({id: 0, name: '无上级分类'});
});
},
onSubmit(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.$confirm('是否提交数据', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
if (this.isEdit) {
updateProductCate(this.$route.query.id, this.productCate).then(response => {
this.$refs[formName].resetFields();
this.$message({
message: '修改成功',
type: 'success',
duration: 1000
});
this.$router.back();
});
} else {
createProductCate(this.productCate).then(response => {
this.$refs[formName].resetFields();
this.brand = Object.assign({}, defaultProductCate);
this.$message({
message: '提交成功',
type: 'success',
duration: 1000
});
});
}
});
} else {
this.$message({
message: '验证失败',
type: 'error',
duration: 1000
});
return false;
}
});
},
resetForm(formName) {
this.$refs[formName].resetFields();
this.productCate = Object.assign({}, defaultProductCate);
this.getSelectProductCateList();
}
}
}
</script>
<style scoped>
</style>

49
src/views/pms/productCate/index.vue
View File

@ -57,6 +57,7 @@
<template slot-scope="scope">
<el-button
size="mini"
:disabled="scope.row.level | disableNextLevel"
@click="handleShowNextLevel(scope.$index, scope.row)">查看下级
</el-button>
<el-button
@ -96,7 +97,7 @@
</template>
<script>
import {fetchList} from '@/api/productCate'
import {fetchList,deleteProductCate} from '@/api/productCate'
export default {
name: "productCateList",
@ -113,11 +114,25 @@
}
},
created() {
this.resetParentId();
this.getList();
},
watch: {
$route(route) {
this.resetParentId();
this.getList();
}
},
methods: {
resetParentId(){
if (this.$route.query.parentId != null) {
this.parentId = this.$route.query.parentId;
} else {
this.parentId = 0;
}
},
handleAddProductCate() {
console.log('handleAddProductCate');
this.$router.push('/pms/addProductCate');
},
getList() {
this.listLoading = true;
@ -137,22 +152,35 @@
this.getList();
},
handleNavStatusChange(index, row) {
console.log('handleAddProductCate');
console.log('handleNavStatusChange');
},
handleShowStatusChange(index, row) {
console.log('handleAddProductCate');
console.log('handleShowStatusChange');
},
handleShowNextLevel(index, row) {
console.log('handleAddProductCate');
this.$router.push({path: '/pms/productCate', query: {parentId: row.id}})
},
handleTransferProduct(index, row) {
console.log('handleAddProductCate');
},
handleUpdate(index, row) {
console.log('handleAddProductCate');
this.$router.push({path:'/pms/updateProductCate',query:{id:row.id}});
},
handleDelete(index, row) {
console.log('handleAddProductCate');
this.$confirm('是否要删除该品牌', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteProductCate(row.id).then(response => {
this.$message({
message: '删除成功',
type: 'success',
duration: 1000
});
this.getList();
});
});
}
},
filters: {
@ -162,6 +190,13 @@
} else if (value === 1) {
return '二级';
}
},
disableNextLevel(value) {
if (value === 0) {
return false;
} else {
return true;
}
}
}
}

14
src/views/pms/productCate/update.vue Normal file
View File

@ -0,0 +1,14 @@
<template> 
<product-cate-detail :is-edit='true'></product-cate-detail>
</template>
<script>
import ProductCateDetail from './components/ProductCateDetail'
export default {
name: 'updateProductCate',
components: { ProductCateDetail }
}
</script>
<style>
</style>