Browse Source

增加商品的品牌管理

master
sj 2 years ago
parent
commit
2bf312d793
  1. 2
      src/api/bxg/storeProductRule.js
  2. 27
      src/api/bxg/yxStoreBrand.js
  3. 2
      src/components/Crud/crud.js
  4. 5
      src/mixins/crud.js
  5. 37
      src/views/bxg/shop/goods/form.vue
  6. 1
      src/views/bxg/shop/goods/index.vue
  7. 134
      src/views/bxg/shop/storeBrand/index.vue
  8. 2
      src/views/bxg/shop/storeProductRule/form.vue

2
src/api/bxg/storeProductRule.js

@ -2,7 +2,7 @@ import request from '@/utils/request'
export function add(data, id) {
return request({
url: `/api/yxStoreProductRule/save/${id}`,
url: `/bxg/api/yxStoreProductRule/save/${id}`,
method: 'post',
data
})

27
src/api/bxg/yxStoreBrand.js

@ -0,0 +1,27 @@
import request from '@/utils/request'
export function add(data) {
return request({
url: 'bxg/api/yxStoreBrand',
method: 'post',
data
})
}
export function del(ids) {
return request({
url: 'bxg/api/yxStoreBrand/',
method: 'delete',
data: ids
})
}
export function edit(data) {
return request({
url: 'bxg/api/yxStoreBrand',
method: 'put',
data
})
}
export default { add, edit, del }

2
src/components/Crud/crud.js

@ -122,12 +122,14 @@ function CRUD(options) {
},
// 刷新
refresh() {
console.log('调这里',crud);
if (!callVmHook(crud, CRUD.HOOK.beforeRefresh)) {
return
}
return new Promise((resolve, reject) => {
crud.loading = true
// 请求数据
// return
initData(crud.url, crud.getQueryParams()).then(data => {
crud.page.total = data.totalElements
crud.data = data.content

5
src/mixins/crud.js

@ -53,7 +53,9 @@ export default {
parseTime,
downloadFile,
checkPermission,
//通用的搜索方法
async init() {
console.log('回调这个搜索方法吗?');
if (!await this.beforeInit()) {
return
}
@ -61,8 +63,11 @@ export default {
this.loading = true
// 请求数据
initData(this.url, this.getQueryParame()).then(data => {
console.log('data',data)
//商品分类
this.cateList = data.cateList
this.total = data.totalElements
//商品
this.data = data.content
// time 毫秒后显示表格
setTimeout(() => {

37
src/views/bxg/shop/goods/form.vue

@ -9,6 +9,11 @@
<el-input v-model="formValidate.store_name" placeholder="请输入商品名称" />
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="商品关键字:" prop="">
<el-input v-model="formValidate.keyword" placeholder="请输入商品关键字" />
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="商品分类:" prop="cate_id">
<el-select v-model="formValidate.cate_id" filterable :filter-method="dataFilter" clearable>
@ -18,10 +23,14 @@
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="商品关键字:" prop="">
<el-input v-model="formValidate.keyword" placeholder="请输入商品关键字" />
<el-form-item label="商品品牌:" prop="brand_id">
<el-select v-model="formValidate.brand_id" filterable :filter-method="dataFilter" clearable>
<el-option v-for="item in brandList"
:value="item.value" :key="item.id" :label="item.label" ></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="单位:" prop="unit_name">
<el-input v-model="formValidate.unit_name" placeholder="请输入单位" />
@ -361,6 +370,8 @@ export default {
components: { editor, picUpload, mulpicUpload, Treeselect, MaterialList, UeditorWrap, singlePic },
data() {
return {
//
brandList:[],
spinShow: false,
grid2: {
xl: 10,
@ -504,15 +515,15 @@ export default {
store_info: [
{ required: true, message: '请输入商品简介', trigger: 'blur' }
],
spec_type: [
{ required: true, message: '请选择商品规格', trigger: 'change' }
],
selectRule: [
{ required: true, message: '请选择商品规格属性', trigger: 'change' }
],
temp_id: [
{ required: true, message: '请选择运费模板', trigger: 'change', type: 'number' }
]
// spec_type: [
// { required: true, message: '', trigger: 'change' }
// ],
// selectRule: [
// { required: true, message: '', trigger: 'change' }
// ],
// temp_id: [
// { required: true, message: '', trigger: 'change', type: 'number' }
// ]
},
attrs: []
}
@ -569,6 +580,7 @@ export default {
//
addBtn () {
console.log('确定添加?');
this.clearAttr();
this.createBnt = false;
this.showIput = true;
@ -731,12 +743,13 @@ export default {
return this.$message.warning('请点击生成规格!');
}
add(this.formValidate).then(async res => {
//Status Code201
this.$message({
message:'操作成功',
type: 'success'
});
setTimeout(() => {
this.$router.push({ path: '/bxg/goods' });
this.$router.push({ path: '/bxg/shop/goods' });
}, 500);
}).catch(res => {
// this.$message({

1
src/views/bxg/shop/goods/index.vue

@ -45,6 +45,7 @@
</el-table-column>
<el-table-column prop="storeName" label="商品名称" />
<el-table-column prop="storeCategory.cateName" label="分类名称" />
<el-table-column prop="storeCategory.brandName" label="品牌名称" />
<el-table-column prop="price" label="商品价格" />
<el-table-column prop="sales" label="销量" />
<el-table-column prop="stock" label="库存" />

134
src/views/bxg/shop/storeBrand/index.vue

@ -0,0 +1,134 @@
<template>
<div class="app-container">
<!--工具栏-->
<div class="head-container">
<!--如果想在工具栏加入更多按钮可以使用插槽方式 slot = 'left' or 'right'-->
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<el-input v-model="query.cateName" clearable size="small" placeholder="输入品牌名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<rrOperation :crud="crud" />
</div>
<crudOperation :permission="permission" />
<!--表单组件-->
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="500px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="品牌ID">
<el-input v-model="form.id" style="width: 370px;" />
</el-form-item>
<el-form-item label="品牌名称" prop="brandName">
<el-input v-model="form.brandName" style="width: 370px;" />
</el-form-item>
<el-form-item label="排序">
<el-input v-model="form.sort" style="width: 370px;" />
</el-form-item>
<el-form-item label="图标">
<!-- <el-input v-model="form.pic" style="width: 370px;" />-->
<MaterialList v-model="picArr" type="image" :num="1" :width="150" :height="150" />
</el-form-item>
<el-form-item label="是否推荐">
<el-input v-model="form.isShow" style="width: 370px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</el-dialog>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column v-if="columns.visible('id')" prop="id" label="品牌ID" />
<el-table-column v-if="columns.visible('brandName')" prop="brandName" label="品牌名称" />
<el-table-column v-if="columns.visible('sort')" prop="sort" label="排序" />
<el-table-column v-if="columns.visible('pic')" prop="pic" label="图标" />
<el-table-column v-if="columns.visible('isShow')" prop="isShow" label="是否推荐" />
<el-table-column v-if="columns.visible('createTime')" prop="createTime" label="添加时间">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('updateTime')" prop="updateTime" label="更新时间">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime) }}</span>
</template>
</el-table-column>
<el-table-column v-permission="['admin','yxStoreBrand:edit','yxStoreBrand:del']" label="操作" width="150px" align="center">
<template slot-scope="scope">
<udOperation
:data="scope.row"
:permission="permission"
/>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
</div>
</div>
</template>
<script>
import crudYxStoreBrand from '@/api/bxg/yxStoreBrand'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import MaterialList from "@/components/material";
// crudpresenter
const defaultCrud = CRUD({ title: 'brand', url: '/bxg/api/yxStoreBrand', sort: 'id,desc', crudMethod: { ...crudYxStoreBrand }})
const defaultForm = { id: null, brandName: null, sort: null, pic: null, isShow: null, createTime: null, updateTime: null, isDel: null, tenantId: null }
export default {
name: 'YxStoreBrand',
components: { pagination, crudOperation, rrOperation, udOperation ,MaterialList},
mixins: [presenter(defaultCrud), header(), form(defaultForm), crud()],
data() {
return {
picArr: [],
permission: {
add: ['admin', 'yxStoreBrand:add'],
edit: ['admin', 'yxStoreBrand:edit'],
del: ['admin', 'yxStoreBrand:del']
},
rules: {
brandName: [
{ required: true, message: '品牌名称不能为空', trigger: 'blur' }
]
} }
},
watch: {
picArr: function(val) {
console.log();
this.form.pic = val.join(',')
}
},
methods: {
//
[CRUD.HOOK.beforeRefresh]() {
return true
}, //
[CRUD.HOOK.afterToCU](crud, form) {
},
}
}
</script>
<style scoped>
.table-img {
display: inline-block;
text-align: center;
background: #ccc;
color: #fff;
white-space: nowrap;
position: relative;
overflow: hidden;
vertical-align: middle;
width: 32px;
height: 32px;
line-height: 32px;
}
</style>

2
src/views/bxg/shop/storeProductRule/form.vue

@ -6,7 +6,7 @@
<el-row :gutter="24">
<el-col :span="24">
<el-col :span="9" class="mb15">
<el-form-item label="标题名称:" prop="ruleName">
<el-form-item label="标题名称:" prop="ruleName" label-width="100px">
<el-input placeholder="请输入标题名称" v-model="formData.ruleName"/>
</el-form-item>
</el-col>

Loading…
Cancel
Save