Commit ec845b65 by wangyalan-git

库存管理,供应商管理,用户管理

parent 5fef1d4b
......@@ -245,7 +245,7 @@
<div class="loader-section section-left"></div>
<div class="loader-section section-right"></div>
<div class="load_title">
正在加载 权星 请耐心等待
正在加载 万科物资管理平台 请耐心等待
</div>
</div>
</div>
......
......@@ -35,6 +35,43 @@ export const constantRouterMap = [
}]
export const asyncRouterMap = [
// 库存模块
{
path: '/inv',
component: Layout,
redirect: '/inv/stockAdmin',
name: 'inv',
meta: { title: '库存管理', icon: 'sms-subject' },
children: [{
path: 'stockAdmin',
name: 'stockAdmin',
component: () => import('@/views/inv/stockAdmin'),
meta: { title: '入库管理', icon: 'product-list' },
},
{
path: 'warehouseAdmin',
name: 'warehouseAdmin',
component: () => import('@/views/inv/warehouseAdmin'),
meta: { title: '出库管理', icon: 'product-list' },
},
{
path: 'storeList',
name: 'storeList',
component: () => import('@/views/inv/StoreList'),
meta: { title: '库存清单', icon: 'product-cate' }
},
{
path: 'goodsCategory',
name: 'goodsCategory',
component: () => import('@/views/inv/GoodsCateogory'),
meta: { title: '物品类别', icon: 'product-cate' }
},{
path: 'depotAdmin',
name: 'depotAdmin',
component: () => import('@/views/inv/DepotAdmin'),
meta: { title: '库房管理', icon: 'product-cate' }
}]
},
// 供应商模块
{
path: '/ssm',
......@@ -47,183 +84,49 @@ export const asyncRouterMap = [
name: 'supplierList',
component: () => import('@/views/ssm/SupplierList'),
meta: { title: '供应商列表', icon: 'product-list' },
},
{
path: 'supplierAudit',
name: 'supplierAudit',
component: () => import('@/views/ssm/SupplierAudit'),
meta: { title: '供应商审核', icon: 'product-list' },
}, {
path: 'supplier',
name: 'supplier',
component: () => import('@/views/ssm/Supplier'),
meta: { title: '供应商', icon: 'product-cate' },
hidden: true
}]
}]
},
// 分销商
// 报表管理
{
path: '/dis',
path: '/sta',
component: Layout,
redirect: '/dis/distributorList',
name: 'dis',
meta: { title: '分销商', icon: 'sms-subject' },
redirect: '/sta/inventoryChart',
name: 'sta',
meta: { title: '报表管理', icon: 'sms-subject' },
children: [{
path: 'distributorList',
name: 'distributorList',
component: () => import('@/views/dis/distributorList'),
meta: { title: '分销商列表', icon: 'product-list' },
path: 'inventoryChart',
name: 'inventoryChart',
component: () => import('@/views/sta/InventoryChart'),
meta: { title: '库存情况', icon: 'product-list' },
},
{
path: 'addDistributor',
name: 'addDistributor',
component: () => import('@/views/dis/modules/AddDistributor'),
meta: { title: '添加分销商', icon: 'product-add' },
hidden: true
}, {
path: 'distributorDetail',
name: 'distributorDetail',
component: () => import('@/views/dis/DistributorDetail'),
meta: { title: '查看分销商', icon: 'product-cate' },
hidden: true
{
path: 'recipients',
name: 'recipients',
component: () => import('@/views/sta/Recipients'),
meta: { title: '领用情况', icon: 'product-list' },
}]
},
// 管理员
{
path: '/adm',
path: '/use',
component: Layout,
redirect: '/adm/adminList',
name: 'adm',
meta: { title: '管理员', icon: 'product-list' },
redirect: '/use/adminList',
name: 'use',
meta: { title: '用户管理', icon: 'product-list' },
children: [{
path: 'adminList',
name: 'adminList',
component: () => import('@/views/adm/AdminList'),
component: () => import('@/views/use/AdminList'),
meta: { title: '管理员列表', icon: 'product-list' },
},
{
path: 'addAdmin',
name: 'addAdmin',
component: () => import('@/views/adm/modules/AddAdmin'),
meta: { title: '添加管理员', icon: 'product-add' },
hidden: true
}, {
path: 'adminDetail',
name: 'adminDetail',
component: () => import('@/views/adm/AdminDetail'),
meta: { title: '查看管理员', icon: 'product-cate' },
hidden: true
}]
},
// 商品模块
{
path: '/pms',
component: Layout,
redirect: '/pms/product',
name: 'pms',
meta: { title: '商品', icon: 'product' },
children: [{
path: 'product',
name: 'product',
component: () => import('@/views/pms/product/index'),
meta: { title: '在售商品', icon: 'product-list' }
},
{
path: 'productAudit',
name: 'productAudit',
component: () => import('@/views/pms/productAudit/index'),
meta: { title: '待审核仓库', icon: 'product-list' }
},
{
path: 'addProduct',
name: 'addProduct',
component: () => import('@/views/pms/product/add'),
meta: { title: '添加商品', icon: 'product-add' }
},
{
path: 'updateProduct',
name: 'updateProduct',
component: () => import('@/views/pms/product/update'),
meta: { title: '修改商品', icon: 'product-add' },
path: 'userList',
name: 'userList',
component: () => import('@/views/use/UserList'),
meta: { title: '用户列表', icon: 'product-cate' },
hidden: true
}]
},
// 分类模块
{
path: '/ppc',
component: Layout,
redirect: '/ppc/classifyList',
name: 'ppc',
meta: { title: '分类', icon: 'table' },
children: [{
path: 'attributeClassifyList',
name: 'attributeClassifyList',
component: () => import('@/views/ppc/AttributeClassifyList'),
meta: { title: '分类列表', icon: 'product-list' }
}, {
path: 'attributeTypeList',
name: 'attributeTypeList',
component: () => import('@/views/ppc/AttributeTypeList'),
meta: { title: '属性类型', icon: 'product-list' }
}, {
path: 'attributeGroupList',
name: 'attributeGroupList',
component: () => import('@/views/ppc/AttributeGroupList'),
meta: { title: '属性分组', icon: 'product-list' }
}
// }, {
// // path: 'attributeList',
// // name: 'attributeList',
// // component: () => import('@/views/ppc/AttributeList'),
// // meta: { title: '属性管理', icon: 'product-list' }
// // }, {
// // path: 'classifyList',
// // name: 'classifyList',
// // component: () => import('@/views/ppc/ClassifyList'),
// // meta: { title: '分类设定', icon: 'product-cate' },
// // hidden: true
// // }, {
// // path: 'classifyAttributeList',
// // name: 'classifyAttributeList',
// // component: () => import('@/views/ppc/ClassifyAttributeList'),
// // meta: { title: '分类属性', icon: 'product-cate' },
// // hidden: true
// //
// // }, {
// // path: 'ownClassifyList',
// // name: 'ownClassifyList',
// // component: () => import('@/views/ppc/OwnClassifyList'),
// // meta: { title: '自有分类', icon: 'tree' },
// // hidden: true
// //
// // }, {
// // path: 'brand',
// // name: 'brand',
// // component: () => import('@/views/pms/brand/index'),
// // meta: { title: '品牌管理', icon: 'product-brand' },
// // hidden: true
// //
// // }, {
// // path: 'addBrand',
// // name: 'addBrand',
// // component: () => import('@/views/pms/brand/add'),
// // meta: { title: '添加品牌' },
// // hidden: true
// // }, {
// // path: 'updateBrand',
// // name: 'updateBrand',
// // component: () => import('@/views/pms/brand/update'),
// // meta: { title: '编辑品牌' },
// // hidden: true
// // }, {
// // path: 'brandView',
// // name: 'brandView',
// // component: () => import('@/views/pms/brand/components/BrandView'),
// // meta: { title: '查看品牌' },
// // hidden: true
// // }
]
},
// 设置模块
// {
// path: '/psm',
......
<template>
<el-dialog :visible.sync="visible"
:title="title"
center
width="720px">
<!-- start -->
<el-form :model="model"
ref="myForm"
v-loading="loading"
label-width="200px">
<div class="scroll-container"
ref="scrollContainer">
<el-form-item label="分销商名称:"
:rules="[{required: true, trigger: 'blur', message: '分销商名称不能为空'}]"
prop="name">
<el-input size="small"
class="input-width"
v-model="model.name"></el-input>
</el-form-item>
<el-form-item label="分销商账号:"
:rules="[{required: true, trigger: 'blur', message: '分销商账号不能为空'}]"
prop="username">
<el-input size="small"
class="input-width"
v-model="model.username"></el-input>
</el-form-item>
<el-form-item label="手机号:"
:rules="[ {
required: true,
validator: validatePhone,
trigger: 'blur'
}]"
prop="phone">
<el-input size="small"
class="input-width"
v-model="model.phone"></el-input>
</el-form-item>
<el-form-item
v-if="!this.id"
label="密码:"
prop="password"
:rules="[{ required: true, trigger: 'blur', message: '密码不能为空' }]">
<el-input size="small"
class="input-width"
v-model="model.password"
show-password
auto-complete="new-password"></el-input>
</el-form-item>
<el-form-item label="邮箱:"
:rules="[
{ required: true, message: '请输入邮箱地址', trigger: 'blur' },
{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }
]"
prop="email">
<el-input size="small"
class="input-width"
v-model="model.email"></el-input>
</el-form-item>
<el-form-item label="说明:"
prop="personalizedSignature">
<el-input size="small"
type="textarea"
class="input-width"
v-model="model.personalizedSignature"></el-input>
</el-form-item>
<!-- <el-form-item label="结算方式:"-->
<!-- prop="payType">-->
<!-- <el-select size="small"-->
<!-- class="input-width"-->
<!-- v-model="model.payType">-->
<!-- <el-option-->
<!-- v-for="item in payOptions"-->
<!-- :key="item.value"-->
<!-- :label="item.label"-->
<!-- :value="item.value">-->
<!-- </el-option>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="结算周期:"-->
<!-- prop="cycleType">-->
<!-- <el-select size="small"-->
<!-- class="input-width"-->
<!-- v-model="model.cycleType">-->
<!-- <el-option-->
<!-- v-for="item in cycleOptions"-->
<!-- :key="item.value"-->
<!-- :label="item.label"-->
<!-- :value="item.value">-->
<!-- </el-option>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
</div>
</el-form>
<div slot="footer">
<el-button type="primary"
@click="submit">确认
</el-button>
<el-button @click="close">取消</el-button>
</div>
<!-- end -->
</el-dialog>
</template>
<script>
import { addMember, getSupplierDetail,updateMcht } from '@/api/audit'
// 添加编辑属性
export default {
name: 'AddDistributor',
data () {
const validatePhone = (rule, value, callback) => {
if (value === '') {
callback(new Error('请填写手机号码'))
} else {
if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(value))) {
callback(new Error('手机号码格式有误'))
} else {
callback()
}
}
}
return {
visible: false,
title: null,
loading: false,
id: null,
model: {},
validatePhone: validatePhone,
cycleOptions: [{ value: 1, label: '7天' }, { value: 2, label: '15天' }, { value: 3, label: '30天' }],
payOptions: [{ value: 1, label: '指定账期1' }, { value: 2, label: '指定账期2' }, { value: 3, label: '指定账期3' }]
}
},
methods: {
init () {
this.model = {
phone: null,
username: null,
name: null,
password:null,
accouuntType: 2,
personalizedSignature: null,
email: null
}
this.$nextTick(() => {
this.$refs.myForm.clearValidate()
this.$refs.scrollContainer.scrollTop = 0
})
},
add () {
this.id = null
this.init()
this.visible = true
this.title = '添加分销商'
},
detail (id) {
this.id = id
this.init()
this.visible = true
this.title = '编辑分销商'
this.loading = true
getSupplierDetail({ id: id }).then(res => {
this.model = res.data
this.loading = false
}).catch(err => {
this.loading = false
this.close()
})
},
// 提交保存
submit () {
this.$refs.myForm.validate((valid) => {
if (valid) {
// 验证通过
if (this.id) {
// 修改属性
this.loading = true
updateMcht(this.model).then(res => {
this.loading = false
this.visible = false
this.$emit('ok')
}).catch(err => {
this.loading = false
})
} else {
// 添加属性
this.loading = true
addMember(this.model).then(res => {
this.loading = false
this.visible = false
this.$emit('ok')
}).catch(err => {
this.loading = false
})
}
}
})
},
close () {
this.$emit('close')
this.visible = false
}
}
}
</script>
<style scoped>
.scroll-container {
max-height: 50vh;
overflow: hidden;
overflow-y: auto;
}
.input-width {
width: 300px;
}
.tip {
color: #999;
font-size: 12px;
}
</style>
<template> 
<div class="app-container">
<!-- 表格栏 -->
<el-card class="filter-container mt15"
shadow="never">
<el-row type="flex" class="btn-groups">
<el-button type="primary" @click="handleAdd">新增</el-button>
</el-row>
<div class="table-container">
<el-table :data="list"
v-loading="listLoading"
@selection-change="handleSelectionChange"
border>
<el-table-column type="selection"
align="center"
width="50"></el-table-column>
<el-table-column label="库房名称"
align="center">
<template slot-scope="scope">{{scope.row.username}}</template>
</el-table-column>
<el-table-column label="管理员"
align="center">
<template slot-scope="scope">{{scope.row.username}}</template>
</el-table-column>
<el-table-column label="创建时间"
align="center">
<template slot-scope="scope">{{scope.row.email || '--'}}</template>
</el-table-column>
<el-table-column label="操作"
align="center">
<template slot-scope="scope">
<el-button size="mini"
type="primary"
@click="editDetail(scope.row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 分页栏 -->
<div class="pagination-container">
<el-pagination background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
layout="total, sizes, prev, pager, next, jumper"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
</el-card>
<!-- 弹窗-->
<add-depot ref="addCategory" @ok="getList"></add-depot>
</div>
</template>
<script>
import moment from 'moment'
import { getSupplier, getAuditDetail, updateMcht } from '@/api/audit'
import AddDepot from './modules/addDepot'
// 列表查询参数默认值
const defaultListQuery = {
pageNum: 1,
pageSize: 10,
accouuntType: 1,
name: '',
phone: '',
status: ''
}
export default {
name: 'DepotAdmin',
components: {AddDepot},
data() {
return {
statusOptions: [{
label: '启用',
value: 1
},
{
label: '禁用',
value: 0
}],
listQuery: Object.assign({}, defaultListQuery),
list: [],
total: 0,
listLoading: false,
multipleSelection: [],
}
},
created() {
this.getList()
},
filters: {
formatTime(time) {
if (!time) {
return '--'
}
return moment(time).format('YYYY-MM-DD HH:mm:ss')
}
},
methods: {
handleResetSearch() {
this.listQuery = Object.assign({}, defaultListQuery)
this.getList()
},
handleSearchList() {
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
handleSelectionChange(vals) {
this.multipleSelection = vals
},
//请求数据
getList() {
this.listLoading = true
//请求数据
console.log('listQuery', this.listQuery)
getSupplier(this.listQuery).then(res => {
this.listLoading = false
this.list = res.data.list
this.total = res.data.total
}).catch(err => {
this.listLoading = false
})
},
handleAdd(){
this.$refs.addCategory.init()
}
}
}
</script>
<style scoped>
.app-container {
font-size: 14px;
color: #606266;
padding: 0 15px;
margin-top: 0;
}
.mt15 {
margin-top: 15px;
}
.input-width {
width: 180px;
}
.btn-groups button{
width: 100px;
}
</style>
<template> 
<div class="app-container">
<!-- 表格栏 -->
<el-card class="filter-container mt15"
shadow="never">
<el-row type="flex" class="btn-groups">
<el-button type="primary" @click="handleAdd">新增</el-button>
</el-row>
<div class="table-container">
<el-table :data="list"
v-loading="listLoading"
@selection-change="handleSelectionChange"
border>
<el-table-column type="selection"
align="center"
width="50"></el-table-column>
<el-table-column label="物品类别"
align="center">
<template slot-scope="scope">{{scope.row.username}}</template>
</el-table-column>
<el-table-column label="创建时间"
align="center">
<template slot-scope="scope">{{scope.row.email || '--'}}</template>
</el-table-column>
<el-table-column label="操作"
align="center">
<template slot-scope="scope">
<el-button size="mini"
type="primary"
@click="editDetail(scope.row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 分页栏 -->
<div class="pagination-container">
<el-pagination background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
layout="total, sizes, prev, pager, next, jumper"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
</el-card>
<!-- 弹窗-->
<add-category ref="addCategory" @ok="getList"></add-category>
</div>
</template>
<script>
import moment from 'moment'
import { getSupplier, getAuditDetail, updateMcht } from '@/api/audit'
import AddCategory from './modules/addCategory'
// 列表查询参数默认值
const defaultListQuery = {
pageNum: 1,
pageSize: 10,
accouuntType: 1,
name: '',
phone: '',
status: ''
}
export default {
name: 'goodsCategory',
components: {AddCategory},
data() {
return {
statusOptions: [{
label: '启用',
value: 1
},
{
label: '禁用',
value: 0
}],
listQuery: Object.assign({}, defaultListQuery),
list: [],
total: 0,
listLoading: false,
multipleSelection: [],
}
},
created() {
this.getList()
},
filters: {
formatTime(time) {
if (!time) {
return '--'
}
return moment(time).format('YYYY-MM-DD HH:mm:ss')
}
},
methods: {
handleResetSearch() {
this.listQuery = Object.assign({}, defaultListQuery)
this.getList()
},
handleSearchList() {
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
handleSelectionChange(vals) {
this.multipleSelection = vals
},
//请求数据
getList() {
this.listLoading = true
//请求数据
console.log('listQuery', this.listQuery)
getSupplier(this.listQuery).then(res => {
this.listLoading = false
this.list = res.data.list
this.total = res.data.total
}).catch(err => {
this.listLoading = false
})
},
handleAdd(){
this.$refs.addCategory.init()
}
}
}
</script>
<style scoped>
.app-container {
font-size: 14px;
color: #606266;
padding: 0 15px;
margin-top: 0;
}
.mt15 {
margin-top: 15px;
}
.input-width {
width: 180px;
}
.btn-groups button{
width: 100px;
}
</style>
......@@ -6,20 +6,10 @@
<el-form :inline="true"
:model="listQuery"
size="small">
<el-form-item label="供应商名称:"
prop="name">
<el-input placeholder="请输入供应商名称"
size="small"
auto-complete="new-password"
v-model="listQuery.name"></el-input>
</el-form-item>
<el-form-item label="手机号码:"
prop="phone">
<el-input placeholder="请输入手机号码"
size="small"
maxlength="11"
auto-complete="new-password"
v-model="listQuery.phone"></el-input>
<el-form-item label="物品名称:">
<el-input v-model="listQuery.name"
class="input-width"
placeholder="请输入物品名称"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary"
......@@ -43,45 +33,37 @@
<el-table-column type="selection"
align="center"
width="50"></el-table-column>
<el-table-column label="编号"
align="center">
<template slot-scope="scope">{{scope.row.id}}</template>
</el-table-column>
<el-table-column label="供应商名称"
<el-table-column label="物品名称"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="营业执照"
<el-table-column label="总数量"
align="center">
<template slot-scope="scope">
<el-image style="width: 80px;"
:src="scope.row.business"
:preview-src-list="[scope.row.business]"
fit="contain"></el-image>
</template>
<template slot-scope="scope">{{scope.row.username}}</template>
</el-table-column>
<el-table-column label="手机号"
<el-table-column label="入库人"
align="center">
<template slot-scope="scope">{{scope.row.phone}}</template>
<template slot-scope="scope">{{scope.row.phone || '--'}}</template>
</el-table-column>
<el-table-column label="申请时间"
<el-table-column label="入库日期"
align="center">
<template slot-scope="scope">{{scope.row.createtime | formatTime}}</template>
<template slot-scope="scope">{{scope.row.email || '--'}}</template>
</el-table-column>
<el-table-column label="账号状态"
<el-table-column label="所属库房"
align="center">
<template slot-scope="scope">{{scope.row.status | formatStatus}}</template>
<template slot-scope="scope">{{scope.row.email || '--'}}</template>
</el-table-column>
<el-table-column label="操作"
width="220"
align="center">
<template slot-scope="scope">
<el-button size="mini"
type="success"
@click="lookDetail(scope.row)">查看</el-button>
@click="lookDetail(scope.row)">查看详情</el-button>
<el-button size="mini"
type="warning"
@click="handleAudio(scope.row)">审核</el-button>
type="primary"
@click="editDetail(scope.row.id)">生成入库单</el-button>
</template>
</el-table-column>
</el-table>
......@@ -92,38 +74,43 @@
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
layout="total, sizes, prev, pager, next, jumper"
:current-page.sync="listQuery.page"
:page-size="listQuery.size"
:page-sizes="[2,10,30,50]"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
</el-card>
<!-- end -->
<!-- 弹窗 -->
<inventory-details-modal ref="detail"
@ok="getList"></inventory-details-modal>
<!-- end -->
</div>
</template>
<script>
import moment from 'moment'
import { getSupAuditList, getAuditDetail, setAccount } from '@/api/audit'
import { getSupplier, getAuditDetail, updateMcht } from '@/api/audit'
import inventoryDetailsModal from './modules/inventoryDetailsModal'
// 列表查询参数默认值
const defaultListQuery = {
page: 1,
size: 2,
status: 0,
pageNum: 1,
pageSize: 10,
accouuntType: 1,
name: '',
phone: ''
phone: '',
status: ''
}
export default {
name: 'SupplierAudit',
components: {},
name: 'StockAdmin',
components: {inventoryDetailsModal},
data() {
return {
listQuery: Object.assign({}, defaultListQuery),
list: [],
total: 0,
listLoading: false,
exportLoading: false,
multipleSelection: [],
}
},
......@@ -136,15 +123,6 @@ export default {
return '--'
}
return moment(time).format('YYYY-MM-DD HH:mm:ss')
},
formatStatus(audit) {
if (audit == 1) {
return '审核通过'
} else if (audit == 2) {
return '审核不通过'
} else {
return '待审核'
}
}
},
methods: {
......@@ -153,16 +131,16 @@ export default {
this.getList()
},
handleSearchList() {
this.listQuery.page = 1
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.page = 1
this.listQuery.size = val
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.page = val
this.listQuery.pageNum = val
this.getList()
},
handleSelectionChange(vals) {
......@@ -172,7 +150,8 @@ export default {
getList() {
this.listLoading = true
//请求数据
getSupAuditList(this.listQuery).then(res => {
console.log('listQuery',this.listQuery)
getSupplier(this.listQuery).then(res => {
this.listLoading = false
this.list = res.data.list
this.total = res.data.total
......@@ -180,41 +159,25 @@ export default {
this.listLoading = false
})
},
handleAudio(row) {
// 入驻审核
row.audit = true
this.$router.push({ name: 'supplier', params: row })
},
// 查看
lookDetail(row) {
// 查看入驻信息
row.audit = false
this.$router.push({ name: 'supplier', params: row })
},
this.$refs.detail.init()
}
}
}
</script>
<style scoped>
.app-container {
font-size: 14px;
color: #606266;
padding: 0 15px;
margin-top: 0;
}
.el-row {
margin-bottom: 20px;
}
.mt15 {
margin-top: 15px;
}
.el-input {
width: 200px;
}
.app-container {
font-size: 14px;
color: #606266;
padding: 0 15px;
margin-top: 0;
}
.mt15 {
margin-top: 15px;
}
.input-width {
width: 180px;
}
.input-width {
width: 180px;
}
</style>
<template> 
<div class="app-container">
<!-- 搜索栏 -->
<el-card class="filter-container"
shadow="never">
<el-form :inline="true"
:model="listQuery"
size="small">
<el-form-item label="物品名称:">
<el-input v-model="listQuery.name"
class="input-width"
placeholder="请输入物品名称"></el-input>
</el-form-item>
<el-form-item label="物品类别:">
<el-select v-model="listQuery.status"
class="input-width"
clearable
placeholder="请选择物品类别">
<el-option v-for="item in statusOptions"
:key="item.value"
:label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="供应商:">
<el-select v-model="listQuery.status"
class="input-width"
clearable
placeholder="请选择供应商">
<el-option v-for="item in statusOptions"
:key="item.value"
:label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<!-- 超级管理员可见-->
<el-form-item label="库房:">
<el-select v-model="listQuery.status"
class="input-width"
clearable
placeholder="请选择库房">
<el-option v-for="item in statusOptions"
:key="item.value"
:label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary"
@click="handleSearchList"
icon="el-icon-search"
size="small">搜索
</el-button>
<el-button @click="handleResetSearch"
icon="el-icon-refresh"
size="small">重置
</el-button>
</el-form-item>
</el-form>
</el-card>
<!-- 表格栏 -->
<el-card class="filter-container mt15"
shadow="never">
<el-row type="flex" class="btn-groups" justify="end">
<el-button type="primary" @click="handleAdd">新增</el-button>
<el-button type="success" @click="handleAdd">扫码入库</el-button>
<el-button type="info" @click="handleAdd">扫码出库</el-button>
<el-button type="warning" @click="handleAdd">导入</el-button>
</el-row>
<div class="table-container">
<el-table :data="list"
v-loading="listLoading"
@selection-change="handleSelectionChange"
border>
<el-table-column type="selection"
align="center"
width="50"></el-table-column>
<el-table-column label="物品名称"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="型号"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="物品类别"
align="center">
<template slot-scope="scope">{{scope.row.username}}</template>
</el-table-column>
<el-table-column label="数量"
align="center">
<template slot-scope="scope">{{scope.row.username}}</template>
</el-table-column>
<el-table-column label="价格"
align="center">
<template slot-scope="scope">{{scope.row.phone || '--'}}</template>
</el-table-column>
<el-table-column label="供应商"
align="center">
<template slot-scope="scope">{{scope.row.phone || '--'}}</template>
</el-table-column>
<el-table-column label="所属库房"
align="center">
<template slot-scope="scope">{{scope.row.email || '--'}}</template>
</el-table-column>
</el-table>
</div>
<!-- 分页栏 -->
<div class="pagination-container">
<el-pagination background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
layout="total, sizes, prev, pager, next, jumper"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
</el-card>
<!-- 弹窗-->
<add-goods ref="addGoods" @ok="getList"></add-goods>
</div>
</template>
<script>
import moment from 'moment'
import { getSupplier, getAuditDetail, updateMcht } from '@/api/audit'
import AddGoods from './modules/addGoodsModal'
// 列表查询参数默认值
const defaultListQuery = {
pageNum: 1,
pageSize: 10,
accouuntType: 1,
name: '',
phone: '',
status: ''
}
export default {
name: 'StoreList',
components: {AddGoods},
data() {
return {
statusOptions: [{
label: '启用',
value: 1
},
{
label: '禁用',
value: 0
}],
listQuery: Object.assign({}, defaultListQuery),
list: [],
total: 0,
listLoading: false,
multipleSelection: [],
}
},
created() {
this.getList()
},
filters: {
formatTime(time) {
if (!time) {
return '--'
}
return moment(time).format('YYYY-MM-DD HH:mm:ss')
}
},
methods: {
handleResetSearch() {
this.listQuery = Object.assign({}, defaultListQuery)
this.getList()
},
handleSearchList() {
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
handleSelectionChange(vals) {
this.multipleSelection = vals
},
//请求数据
getList() {
this.listLoading = true
//请求数据
console.log('listQuery', this.listQuery)
getSupplier(this.listQuery).then(res => {
this.listLoading = false
this.list = res.data.list
this.total = res.data.total
}).catch(err => {
this.listLoading = false
})
},
handleAdd(){
this.$refs.addGoods.add()
}
}
}
</script>
<style scoped>
.app-container {
font-size: 14px;
color: #606266;
padding: 0 15px;
margin-top: 0;
}
.mt15 {
margin-top: 15px;
}
.input-width {
width: 180px;
}
.btn-groups button{
width: 100px;
}
</style>
<template> 
<div class="app-container">
<!-- 搜索栏 -->
<el-card class="filter-container"
shadow="never">
<el-form :inline="true"
:model="listQuery"
size="small">
<el-form-item label="物品名称:">
<el-input v-model="listQuery.name"
class="input-width"
placeholder="请输入物品名称"></el-input>
</el-form-item>
<el-form-item label="物品类别:">
<el-select v-model="listQuery.status"
class="input-width"
clearable
placeholder="请选择物品类别">
<el-option v-for="item in statusOptions"
:key="item.value"
:label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="部门:">
<el-select v-model="listQuery.status"
class="input-width"
clearable
placeholder="请选择部门">
<el-option v-for="item in statusOptions"
:key="item.value"
:label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<!-- 超级管理员可见-->
<el-form-item label="库房:">
<el-select v-model="listQuery.status"
class="input-width"
clearable
placeholder="请选择库房">
<el-option v-for="item in statusOptions"
:key="item.value"
:label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary"
@click="handleSearchList"
icon="el-icon-search"
size="small">搜索</el-button>
<el-button @click="handleResetSearch"
icon="el-icon-refresh"
size="small">重置</el-button>
</el-form-item>
</el-form>
</el-card>
<!-- 表格栏 -->
<el-card class="filter-container mt15"
shadow="never">
<div class="table-container">
<el-table :data="list"
v-loading="listLoading"
@selection-change="handleSelectionChange"
border>
<el-table-column type="selection"
align="center"
width="50"></el-table-column>
<el-table-column label="物品名称"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="型号"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="物品类别"
align="center">
<template slot-scope="scope">{{scope.row.username}}</template>
</el-table-column>
<el-table-column label="数量"
align="center">
<template slot-scope="scope">{{scope.row.username}}</template>
</el-table-column>
<el-table-column label="申领人"
align="center">
<template slot-scope="scope">{{scope.row.phone || '--'}}</template>
</el-table-column>
<el-table-column label="所属部门"
align="center">
<template slot-scope="scope">{{scope.row.phone || '--'}}</template>
</el-table-column>
<el-table-column label="所属库房"
align="center">
<template slot-scope="scope">{{scope.row.email || '--'}}</template>
</el-table-column>
<el-table-column label="出库日期"
align="center">
<template slot-scope="scope">{{scope.row.email || '--'}}</template>
</el-table-column>
</el-table>
</div>
<!-- 分页栏 -->
<div class="pagination-container">
<el-pagination background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
layout="total, sizes, prev, pager, next, jumper"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
</el-card>
</div>
</template>
<script>
import moment from 'moment'
import { getSupplier, getAuditDetail, updateMcht } from '@/api/audit'
// 列表查询参数默认值
const defaultListQuery = {
pageNum: 1,
pageSize: 10,
accouuntType: 1,
name: '',
phone: '',
status: ''
}
export default {
name: 'WarehouseAdmin',
components: {},
data() {
return {
statusOptions: [ {
label: '启用',
value: 1
},
{
label: '禁用',
value: 0
}],
listQuery: Object.assign({}, defaultListQuery),
list: [],
total: 0,
listLoading: false,
multipleSelection: [],
}
},
created() {
this.getList()
},
filters: {
formatTime(time) {
if (!time) {
return '--'
}
return moment(time).format('YYYY-MM-DD HH:mm:ss')
}
},
methods: {
handleResetSearch() {
this.listQuery = Object.assign({}, defaultListQuery)
this.getList()
},
handleSearchList() {
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
handleSelectionChange(vals) {
this.multipleSelection = vals
},
//请求数据
getList() {
this.listLoading = true
//请求数据
console.log('listQuery',this.listQuery)
getSupplier(this.listQuery).then(res => {
this.listLoading = false
this.list = res.data.list
this.total = res.data.total
}).catch(err => {
this.listLoading = false
})
}
}
}
</script>
<style scoped>
.app-container {
font-size: 14px;
color: #606266;
padding: 0 15px;
margin-top: 0;
}
.mt15 {
margin-top: 15px;
}
.input-width {
width: 180px;
}
</style>
......@@ -8,42 +8,14 @@
ref="attributeForm"
v-loading="loading"
label-width="150px">
<el-form-item label="属性名称:"
:rules="[{required: true, trigger: 'blur', message: '属性名称不能为空'}]"
<el-form-item label="物品类别:"
:rules="[{required: true, trigger: 'blur', message: '请输入物品类别名称'}]"
prop="name">
<el-input size="small"
class="input-width"
disabled
placeholder="请输入属性名称"
placeholder="请输入物品类别名称"
v-model="model.name"></el-input>
</el-form-item>
<el-form-item label="属性类型:"
:rules="[{required: true, trigger: 'blur', message: '属性类型不能为空'}]"
prop="attributeTypeId">
<el-select size="small"
class="input-width"
placeholder="请选择属性类型"
@change="changeAttributeType"
v-model="model.attributeTypeId">
<el-option v-for="item in typeOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="属性分组:"
:rules="[{required: true, trigger: 'blur', message: '属性分组不能为空'}]"
prop="attributeGroupId">
<el-select size="small"
class="input-width"
placeholder="请选择属性分组"
v-model="model.attributeGroupId">
<el-option v-for="item in groupOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer">
<el-button type="primary"
......@@ -60,7 +32,7 @@ import { fetchAttributeGroupList } from '@/api/attributeGroup'
// 移动属性
export default {
name: 'AttributeChangeModal',
name: 'addCategory',
data () {
return {
visible: false,
......@@ -77,39 +49,15 @@ export default {
},
methods: {
init () {
this.title="新增物品类别"
this.model = {
attributeTypeId: null,
attributeGroupId: null
}
this.visible= true
this.$nextTick(() => {
this.$refs.attributeForm.clearValidate()
})
this.getTypeList()
this.getGroupList()
},
getTypeList () {
fetchAttributeTypeList({
pageSize: 100,
pageNum: 1,
attributeCategoryId: 0
}).then(res => {
this.typeOptions = res.data.list
})
},
getGroupList () {
fetchAttributeGroupList({
pageSize: 100,
pageNum: 1,
cid: this.model.attributeTypeId
}).then(res => {
this.groupOptions = res.data.list
})
},
changeAttributeType () {
this.groupOptions = []
this.model.attributeGroupId = null
this.model = Object.assign({}, this.model)
this.getGroupList()
},
detail (id) {
this.id = id
......@@ -153,7 +101,7 @@ export default {
}
</script>
<style scoped>
.input-width {
width: 200px;
}
</style>
\ No newline at end of file
.input-width {
width: 200px;
}
</style>
......@@ -2,92 +2,90 @@
<el-dialog :visible.sync="visible"
:title="title"
center
width="620px">
width="500px">
<!-- start -->
<el-form :model="model"
ref="myForm"
ref="attributeForm"
v-loading="loading"
label-width="100px">
<div class="scroll-container"
ref="scrollContainer">
<el-form-item label="审核意见:"
prop="status"
:rules="[{ required: true, trigger: 'change', message: '审核意见不能为空' }]">
<el-radio-group v-model="model.status">
<el-radio :label="1">通过</el-radio>
<el-radio :label="2">不通过</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="审核备注:" prop="remarks"
:rules="[{ required: true, trigger: 'change', message: '审核备注不能为空' }]">
<el-input size="small"
type="textarea"
:rows="5"
v-model="model.remarks"
placeholder="1000字以内"
maxlength="1000"
show-word-limit></el-input>
</el-form-item>
</div>
label-width="150px">
<el-form-item label="库房名称:"
:rules="[{required: true, trigger: 'blur', message: '请输入库房名称'}]"
prop="name">
<el-input size="small"
class="input-width"
placeholder="请输入库房名称"
v-model="model.name"></el-input>
</el-form-item>
</el-form>
<div slot="footer">
<el-button type="primary"
@click="submit">确认
</el-button>
@click="submit">确认</el-button>
<el-button @click="close">取消</el-button>
</div>
<!-- end -->
</el-dialog>
</template>
<script>
import { updateProduct } from '@/api/product'
import { getAttribute, changeAttribute } from '@/api/attribute'
import { fetchAttributeTypeList } from '@/api/attributeType'
import { fetchAttributeGroupList } from '@/api/attributeGroup'
// 添加编辑属性
// 移动属性
export default {
name: 'AuditProduct',
data() {
name: 'addDepot',
data () {
return {
visible: false,
title: null,
loading: false,
id: null,
model: {},
model: {
attributeTypeId: null,
attributeGroupId: null
},
typeOptions: [],
groupOptions: []
}
},
methods: {
init() {
init () {
this.title="新增库房"
this.model = {
status: null,
remarks: null
attributeTypeId: null,
attributeGroupId: null
}
this.visible= true
this.$nextTick(() => {
this.$refs.myForm.clearValidate()
this.$refs.scrollContainer.scrollTop = 0
this.$refs.attributeForm.clearValidate()
})
},
add(id) {
detail (id) {
this.id = id
this.init()
this.visible = true
this.title = '审核'
this.title = '移动属性'
this.loading = true
getAttribute(id).then(res => {
this.model = res.data
this.loading = false
}).catch(err => {
this.loading = false
this.close()
})
},
// 提交保存
submit() {
this.$refs.myForm.validate((valid) => {
submit () {
this.$refs.attributeForm.validate((valid) => {
if (valid) {
// 验证通过
this.loading = true
let params = {
pmsProduct: {
id: this.id,
verifyStatus: this.model.status,
remarks: this.model.remarks
}
id: this.id,
attributeTypeId: this.model.attributeTypeId,
attributeGroupId: this.model.attributeGroupId
}
updateProduct(params).then(res => {
changeAttribute(params).then(res => {
this.loading = false
this.visible = false
this.$message.success('审核成功')
this.$emit('ok')
}).catch(err => {
this.loading = false
......@@ -95,7 +93,7 @@ export default {
}
})
},
close() {
close () {
this.$emit('close')
this.visible = false
}
......@@ -103,18 +101,7 @@ export default {
}
</script>
<style scoped>
.scroll-container {
max-height: 50vh;
overflow: hidden;
overflow-y: auto;
}
.input-width {
width: 300px;
}
.tip {
color: #999;
font-size: 12px;
width: 200px;
}
</style>
<template>
<el-dialog :visible.sync="visible"
:title="title"
center
width="900px">
<!-- start -->
<el-row style="padding: 10px 0;text-align: left;">
<el-button type="primary" size="medium" @click="handleAdd">新增</el-button>
</el-row>
<div class="scroll-container"
ref="scrollContainer">
<el-table
:data="tableData"
style="width: 100%"
@row-dblclick="dbclick">
<el-table-column prop="name" label="物品名称">
<template slot-scope="scope">
<el-form :model="scope.row">
<el-form-item size="mini" >
<el-input v-if="scope.row.isOK" v-model="scope.row.name" class="input-width" placeholder="请输入物品名称"></el-input>
<span v-else>{{scope.row.name}}</span>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column prop="name" label="型号">
<template slot-scope="scope">
<el-form :model="scope.row">
<el-form-item size="mini" >
<el-input v-if="scope.row.isOK" v-model="scope.row.model" class="input-width" placeholder="请输入型号"></el-input>
<span v-else>{{scope.row.model}}</span>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column prop="name" label="物品类别">
<template slot-scope="scope">
<el-form :model="scope.row">
<el-form-item size="mini" >
<el-select v-if="scope.row.isOK" v-model="scope.row.cate"
class="input-width"
clearable
placeholder="请选择物品类型">
<el-option v-for="item in statusOptions"
:key="item.value"
:label="item.label"
:value="item.value"></el-option>
</el-select>
<span v-else>{{scope.row.mcht}}</span>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column prop="name" label="数量">
<template slot-scope="scope">
<el-form :model="scope.row">
<el-form-item size="mini" >
<el-input v-if="scope.row.isOK" v-model="scope.row.num" class="input-width" placeholder="请输入数量"></el-input>
<span v-else>{{scope.row.num}}</span>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column prop="name" label="价格(元)">
<template slot-scope="scope">
<el-form :model="scope.row">
<el-form-item size="mini" >
<el-input v-if="scope.row.isOK" v-model="scope.row.price" class="input-width" placeholder="请输入价格"></el-input>
<span v-else>{{scope.row.price}}</span>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column prop="name" label="供应商">
<template slot-scope="scope">
<el-form :model="scope.row">
<el-form-item size="mini" >
<el-select v-if="scope.row.isOK" v-model="scope.row.mcht"
class="input-width"
clearable
placeholder="请选择供应商">
<el-option v-for="item in statusOptions"
:key="item.value"
:label="item.label"
:value="item.value"></el-option>
</el-select>
<span v-else>{{scope.row.mcht}}</span>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column label="操作"
align="center">
<template slot-scope="scope">
<el-button type="danger" icon="el-icon-delete" circle></el-button>
</template>
</el-table-column>
</el-table>
</div>
<div slot="footer">
<el-button type="primary"
@click="close">确认
</el-button>
<el-button
@click="close">返回
</el-button>
</div>
<!-- end -->
</el-dialog>
</template>
<script>
import { addMember, updateMcht } from '@/api/audit'
// 添加编辑属性
export default {
name: 'addGoodsModal',
data() {
return {
statusOptions: [{label: '物品',value: 1}],
visible: false,
title: null,
loading: false,
tableData: []
}
},
methods: {
init() {
this.$nextTick(() => {
this.$refs.scrollContainer.scrollTop = 0
})
},
add(){
this.visible = true
this.title="新增物品"
this.init()
},
close() {
this.visible = false
},
handleAdd(){
this.tableData.push({
name: '',
num: '',
cate: '',
model: '',
price: '',
mcht:'',
isOK: true
},)
},
dbclick(row, event, column){
console.log(row, event, column)
row.isOK =!row.isOK
}
}
}
</script>
<style scoped>
.scroll-container {
max-height: 50vh;
overflow: hidden;
overflow-y: auto;
}
.input-width {
width: 100px;
}
</style>
<template>
<el-dialog :visible.sync="visible"
title="物品详情"
center
width="720px">
<!-- start -->
<div class="scroll-container"
ref="scrollContainer">
<el-table
:data="tableData"
style="width: 100%">
<el-table-column
prop="date"
label="物品名称">
</el-table-column>
<el-table-column
prop="name"
label="型号">
</el-table-column>
<el-table-column
prop="address"
label="物品类别">
</el-table-column>
<el-table-column
prop="address"
label="数量">
</el-table-column>
<el-table-column
prop="address"
label="价格(元)">
</el-table-column>
<el-table-column
prop="address"
label="供应商">
</el-table-column>
</el-table>
</div>
<div slot="footer">
<el-button type="primary"
@click="close">返回
</el-button>
</div>
<!-- end -->
</el-dialog>
</template>
<script>
import { addMember,updateMcht } from '@/api/audit'
// 添加编辑属性
export default {
name: 'inventoryDetailsModal',
data() {
return {
visible: false,
title: null,
loading: false,
tableData: new Array(10).fill({
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
})
// tableData: [{
// date: '2016-05-02',
// name: '王小虎',
// address: '上海市普陀区金沙江路 1518 弄'
// }, {
// date: '2016-05-04',
// name: '王小虎',
// address: '上海市普陀区金沙江路 1517 弄'
// }, {
// date: '2016-05-01',
// name: '王小虎',
// address: '上海市普陀区金沙江路 1519 弄'
// }, {
// date: '2016-05-03',
// name: '王小虎',
// address: '上海市普陀区金沙江路 1516 弄'
// }]
}
},
methods: {
init() {
this.visible = true
this.$nextTick(() => {
this.$refs.scrollContainer.scrollTop = 0
})
},
close() {
this.visible = false
}
}
}
</script>
<style scoped>
.scroll-container {
max-height: 50vh;
overflow: hidden;
overflow-y: auto;
}
</style>
<template>
<div>
</div>
</template>
<script>
export default {
name: 'index',
components: {},
data() {
return {}
},
mounted() {
},
methods: {}
}
</script>
<style lang='scss' scoped>
</style>
<template> 
<brand-detail :is-edit='false'></brand-detail>
</template>
<script>
import BrandDetail from './components/BrandDetail'
export default {
name: 'addBrand',
components: { BrandDetail }
}
</script>
<style>
</style>
<template>
<el-card class="form-container"
shadow="never">
<el-form :model="brand"
:rules="rules"
v-loading="loading"
ref="brandFrom"
label-width="120px">
<el-form-item label="品牌名称:"
prop="name">
<el-input placeholder="品牌名称"
v-model="brand.name"></el-input>
<!-- <el-input placeholder="英文名称"
v-model="brand.name"></el-input>
<el-input placeholder="数字名称"
v-model="brand.name"></el-input> -->
<div class="remark">
<div>1. 纯中文/英文/数字品牌,填写其中相应的品牌名称即可;</div>
<div>2. 同时有中文和英文的品牌,需要分别填写相应的品牌名称;</div>
<div>3. 品牌名称严格采用该品牌官方描述名称,包括品牌中的中文描述、英文字符的大小写以及字符之间的符号(如两个单词间的空格有且仅有一个);</div>
<div>4. 对于没有明确官方描述的英文名称,品牌采用每个单词首字母大写,单词的其他字母小写方式录入;</div>
<div>5. 英文品牌所有字符(含非字母字符)皆须是在英文半角状态下输入的字符,不能出现在中文状态下或全角字符状态下输入的字符,中文与英文品牌的分隔符“(”和“)”在中文状态下除外;</div>
<div>6. 同一品牌有且只有一个品牌名称,即官方发布的品牌;不能使用别称、简称;</div>
<div>7. 品牌应录入其全称,不得录入简称;</div>
<div>8. 对于没有明确品牌的商品(如生鲜食品类商品)品牌定为“其他”。</div>
</div>
</el-form-item>
<el-form-item label="品牌首字母:">
<el-input v-model="brand.firstLetter"></el-input>
<div class="remark">
<div>1. 品牌名称为中英文或中文时,为中文的第一个首字母;</div>
<div>2. 品牌名称为纯英文时,为英文第一个首字母;</div>
<div>3. 数字品牌 为第一个数字的拼音首字母。</div>
</div>
</el-form-item>
<el-form-item label="品牌LOGO:"
prop="logo">
<single-upload v-model="brand.logo"></single-upload>
<div class="remark">
<div class="uploadRemark">图片不能超过50K,图片格式为jpg/png</div>
</div>
</el-form-item>
<el-form-item label="是否显示:">
<el-radio-group v-model="brand.showStatus">
<el-radio :label="1"></el-radio>
<el-radio :label="0"></el-radio>
</el-radio-group>
<div class="detailsShown">当品牌下还没有商品的时候,分类页的品牌区将不会显示该品牌。</div>
</el-form-item>
<el-form-item label="品牌描述:">
<el-input placeholder="请输入内容"
type="textarea"
v-model="brand.brandStory"></el-input>
</el-form-item>
<!-- 审核 -->
<div v-if="isEdit">
<el-divider></el-divider>
<el-form-item label="审核日志:">
<div v-for="item in logList"
:key="item.id">{{getShowStatus(item.auditStatus)}} / {{item.auditRemark || '备注无'}} / {{item.createDate}}</div>
<div v-if="!logList || logList.length == 0">暂无日志</div>
</el-form-item>
<el-form-item label="审核状态:">
<!-- 审核状态 0待审核 1审核通过 2 审核失败 3驳回 -->
<el-radio-group v-model="brand.auditStatus">
<el-radio v-for="item in statusOptions"
:key="item.value"
:label="item.value">{{item.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="审核备注:">
<el-input placeholder="请输入内容"
type="textarea"
v-model="brand.auditRemark"></el-input>
</el-form-item>
</div>
<el-form-item>
<el-button type="primary"
size="medium"
@click="onSubmit('brandFrom')">提交</el-button>
<el-button @click="cancel"
size="medium">取消</el-button>
</el-form-item>
</el-form>
</el-card>
</template>
<script>
import { createBrand, getBrand, updateBrand, auditLog } from '@/api/brand'
import SingleUpload from '@/components/Upload/singleUpload'
const defaultBrand = {
bigPic: '',
brandStory: '',
factoryStatus: 0,
firstLetter: '',
logo: '',
name: '',
showStatus: 0,
type: 2,
sort: 0
}
const defaultStatus = [
{
value: 0,
label: '待审核'
}, {
value: 1,
label: '审核通过'
}, {
value: 2,
label: '退回修改'
}, {
value: 3,
label: '驳回'
}
]
export default {
name: 'BrandDetail',
components: { SingleUpload },
props: {
isEdit: {
type: Boolean,
default: false
}
},
data() {
return {
loading: false,
brand: Object.assign({}, defaultBrand),
statusOptions: Object.assign([], defaultStatus),
logList: [],
rules: {
name: [
{ required: true, message: '请输入品牌名称', trigger: 'blur' },
{ min: 2, max: 140, message: '长度在 2 到 140 个字符', trigger: 'blur' }
],
logo: [
{ required: true, message: '请输入品牌logo', trigger: 'blur' }
],
sort: [
{ type: 'number', message: '排序必须为数字' }
],
}
}
},
created() {
if (this.isEdit) {
let brandId = this.$route.query.id
this.loading = true
getBrand(brandId).then(response => {
this.loading = false
this.brand = response.data
this.brand.type = 2
}).catch(err => {
this.loading = false
})
auditLog({ brandId: brandId, pageSize: 1000, pageNum: 1 }).then(res => {
this.logList = res.data.list
})
} else {
this.brand = Object.assign({}, defaultBrand)
}
},
methods: {
getShowStatus(status) {
let arr = this.statusOptions.filter(item => item.value == status)
return arr && arr.length > 0 ? arr[0].label : '状态无'
},
onSubmit(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
if (this.isEdit) {
this.loading = true
updateBrand(this.$route.query.id, this.brand).then(response => {
this.loading = false
this.$refs[formName].resetFields();
this.$message({
message: '修改成功',
type: 'success',
duration: 1000
})
this.$router.back()
}).catch(err => {
this.loading = false
})
} else {
createBrand(this.brand).then(response => {
this.$refs[formName].resetFields();
this.brand = Object.assign({}, defaultBrand)
this.$message({
message: '提交成功',
type: 'success',
duration: 1000
})
})
}
}
})
},
cancel() {
this.$router.go(-1)
}
}
}
</script>
<style scoped>
.form-container {
width: 800px;
}
.el-form-item__content {
display: flex;
flex-direction: row;
align-items: center;
}
.remark {
display: flex;
flex-direction: column;
font-family: "微软雅黑";
font-size: 12px;
color: #999999;
margin-top: 10px;
}
.remark div {
line-height: 1.8;
}
.uploadRemark {
font-family: "微软雅黑";
font-size: 12px;
color: #999999;
}
.detailsShown {
font-family: "微软雅黑";
font-size: 12px;
color: #999999;
}
.el-textarea__inner {
height: 150px;
}
</style>
<template>
<div class="my-table">
<el-row class="title">
<el-col>品牌ID: {{brandData.id}}</el-col>
</el-row>
<el-row type="flex"
justify="space-between"
align="center"
class="align-center name">
<el-col :span="6"
:offset="6">中文名称</el-col>
<el-col :span="6">英文名称</el-col>
<el-col :span="6">数字名称</el-col>
</el-row>
<el-row type="flex"
justify="space-between"
align="center"
class="align-center">
<el-col :span="6">品牌名称</el-col>
<el-col :span="6">{{brandData.name}}</el-col>
<el-col :span="6">{{brandData.nameEn}}</el-col>
<el-col :span="6">{{brandData.nameNum}}</el-col>
</el-row>
<el-row type="flex"
justify="space-between"
align="center"
class="align-center">
<el-col>品牌首字母</el-col>
<el-col>品牌logo</el-col>
<el-col>品牌排序</el-col>
<el-col>是否显示</el-col>
<el-col>品牌描述</el-col>
</el-row>
<el-row type="flex"
justify="space-between"
align="center"
class="align-center">
<el-col class="flex">{{brandData.firstLetter}}</el-col>
<el-col class="flex">
<img style="width: 80px;"
:src="brandData.logo"
alt=""></el-col>
<el-col class="flex">{{brandData.sort}}</el-col>
<el-col class="flex">{{brandData | showStatus}}</el-col>
<el-col class="flex"
style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"
:title="brandData.brandStory">
{{brandData.brandStory}}
</el-col>
</el-row>
<el-row class="title">
<el-col>统计信息</el-col>
</el-row>
<el-row type="flex"
align="center">
<el-col :span="4"
style="padding-left: 20px;">关联商品数</el-col>
<el-col :span="4"
v-if="brandData.productCount">{{brandData.productCount}}</el-col>
<el-col :span="4"
v-else>0</el-col>
<el-col :span="3"
v-if="brandData.productCount">
<router-link class="color-main"
:to="{path: '/pms/product', query: {brandId: brandData.id}}">查看商品列表</router-link>
</el-col>
</el-row>
</div>
</template>
<script>
import { viewBrand } from '@/api/brand'
export default {
name: 'BrandView',
data() {
return {
brandData: {}
}
},
created() {
this.viewBrand()
},
methods: {
viewBrand() {
viewBrand({ id: this.$route.query.id }).then(res => {
console.log('品牌信息', res.data)
this.brandData = res.data
})
}
},
filters: {
showStatus(value) {
if (value) {
return '否'
} else {
return '是'
}
}
}
}
</script>
<style lang="scss" scoped>
.my-table {
width: 1000px;
margin: 30px auto;
& > div {
line-height: 40px;
border: 1px solid #f5f5f5;
}
.title {
background: #f5f5f5;
padding-left: 20px;
}
}
.align-center {
text-align: center;
& > div {
border-right: 1px solid #f5f5f5;
}
}
.name {
border-top: 1px solid #ffffff !important;
background: #f5f5f5;
}
.flex {
display: flex;
justify-content: center;
align-items: center;
}
</style>
<template> 
<brand-detail :is-edit='true'></brand-detail>
</template>
<script>
import BrandDetail from './components/BrandDetail'
export default {
name: 'updateBrand',
components: { BrandDetail }
}
</script>
<style>
</style>
<template>
<!-- 批量修改标签操作-->
<el-dialog :visible.sync="modal.addPhotoVisible"
:title="title"
width="820px"
center
@open="openModal">
<el-form :model="data"
size="small">
<el-form-item label="请选择相册:">
<el-select v-model="albumId"
placeholder="请选择"
@change="selectalbum">
<el-option v-for="item in photoOptions"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="checkedPhotos">
<el-checkbox-group v-model="checkedPhotos"
@change="handleCheckedChange">
<!-- 图片列表 -->
<div class="photo-list">
<div class="photo-item"
v-for="(item, index) in dataList"
:key="item.id">
<div class="my-checkbox">
<el-checkbox :label="index"><i></i></el-checkbox>
</div>
<div class="show-img">
<el-image v-if="picType == 2"
fit="contain"
:src="item.pic + '?x-oss-process=video/snapshot,t_1,f_jpg,m_fast,ar_auto'"
:preview-src-list="[item.pic + '?x-oss-process=video/snapshot,t_1,f_jpg,m_fast,ar_auto']">
</el-image>
<el-image v-else
fit="contain"
:src="item.pic"
:preview-src-list="[item.pic]">
</el-image>
</div>
</div>
</div>
</el-checkbox-group>
</el-form-item>
</el-form>
<!-- 分页 -->
<el-row type="flex"
justify="end">
<el-pagination background
@current-change="handleCurrentChange"
layout="total, sizes,prev, pager, next, jumper"
@size-change="handleSizeChange"
:page-sizes="[10, 20, 30]"
:page-size="listQuery.pageSize"
:current-page.sync="listQuery.pageNum"
:total="listQuery.total">
</el-pagination>
</el-row>
<div slot="footer"
class="dialog-footer">
<el-button size="medium"
@click="modal.addPhotoVisible = false">取 消</el-button>
<el-button size="medium"
type="primary"
@click="handleConfirm">确 认</el-button>
</div>
</el-dialog>
</template>
<script>
import { mapGetters } from 'vuex'
import { getAlbumList, getAlbumPicAll } from '@/api/productAlbum'
export default {
name: "AddPhotoModal",
props: {
modal: Object
},
data () {
return {
title: '选择图片',
photoOptions: [],
data: {},
albumId: null,
checkedPhotos: [],
dataList: [],
picType: 1,
listQuery: {
pageSize: 10,
pageNum: 1,
total: 0
}
}
},
methods: {
// 获取相册列表
getAlbumList () {
getAlbumList({
userId: this.modal.mchtId || this.userId,
pageSize: 1000,
pageNum: 1
}).then(res => {
this.photoOptions = res.data.list
})
},
// 打开弹窗回调
openModal () {
this.checkedPhotos = []
},
// 处理是否为多选
handleCheckedChange (value) {
if (value.length > 1 && this.modal.flag != 2) {
this.checkedPhotos.splice(0, 1)
}
},
// 查询图片列表
getAlbumPicAll (value) {
let params = {
albumId: value,
userId: this.modal.mchtId || this.userId,
pageSize: this.listQuery.pageSize,
pageNum: this.listQuery.pageNum,
pciType: this.picType || 1
}
getAlbumPicAll(params).then(res => {
this.dataList = res.data.list
this.listQuery.total = res.data.total
})
},
// 选择相册
selectalbum (value) {
this.listQuery.pageNum = 1
this.getAlbumPicAll(value)
},
// 确认
handleConfirm () {
let picUrls = []
this.checkedPhotos.forEach(item => {
picUrls.push(this.dataList[item].pic)
})
this.$emit('handlePhoto', picUrls, this.modal, this.picType)
},
handleSizeChange (val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getAlbumPicAll(this.albumId)
},
handleCurrentChange (val) {
this.listQuery.pageNum = val
this.getAlbumPicAll(this.albumId)
},
},
watch: {
modal: {
handler (newValue) {
this.photoOptions = []
this.albumId = null
this.checkedPhotos = []
this.dataList = []
this.listQuery = {
pageNum: 1,
pageSize: 10,
total: 0
}
this.modal = newValue
if (this.modal.needVideo) {
this.title = '选择视频'
this.picType = 2
} else {
this.title = '选择图片'
this.picType = 1
}
this.getAlbumList()
},
deep: true
}
},
computed: {
...mapGetters([
'userId'
])
}
}
</script>
<style lang="scss" scoped>
/*图片列表*/
.photo-list {
font-size: 14px;
padding: 15px 0;
display: flex;
align-items: center;
flex-wrap: wrap;
max-height: 30vh;
overflow-y: auto;
.photo-item {
text-align: center;
position: relative;
width: 120px;
margin: 15px;
.show-img {
.el-image {
height: 168px;
}
height: 168px;
background: whitesmoke;
}
.my-checkbox {
position: absolute;
top: 5px;
left: 5px;
}
}
}
.my-checkbox {
position: absolute;
top: 5px;
left: 5px;
}
</style>
<template>
<el-dialog :visible.sync="visible"
:title="title"
center
width="650px">
<el-form :model="model"
ref="auditForm"
v-loading="loading"
label-width="180px">
<el-form-item label="商品名称:">
{{model.name}}
</el-form-item>
<el-form-item label="商品审核:"
prop="verifyStatus">
<el-radio-group v-model="model.verifyStatus">
<el-radio :label="1">通过</el-radio>
<el-radio :label="2">驳回</el-radio>
<el-radio :label="3">退回修改</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="审核备注:"
prop="detail">
<el-input class="input-width"
size="small"
v-model="model.detail"></el-input>
</el-form-item>
</el-form>
<div slot="footer">
<el-button type="primary"
:loading="loading"
@click="submit">确认</el-button>
<el-button @click="close">取消</el-button>
</div>
</el-dialog>
</template>
<script>
import { updateVerifyStatus } from '@/api/product'
const defaultModel = {
ids: null,
name: null,
verifyStatus: 1,
detail: null
}
// 商品审核
export default {
name: 'productAudit',
components: {},
data() {
return {
visible: false,
title: null,
loading: false,
model: Object.assign({}, defaultModel)
}
},
methods: {
init() {
this.model = Object.assign({}, defaultModel)
this.$nextTick(() => {
this.$refs.auditForm.clearValidate()
})
},
audit(data) {
this.init()
this.model.ids = [data.id]
this.model.name = data.name
this.visible = true
this.title = '商品审核'
},
submit() {
// 提交保存
this.$refs.auditForm.validate((valid) => {
if (valid) {
// 验证通过
this.loading = true
updateVerifyStatus(this.model).then(res => {
this.loading = false
this.visible = false
this.$emit('ok')
}).catch(err => {
this.loading = false
})
}
})
},
close() {
this.$emit('close')
this.visible = false
}
}
}
</script>
<style scoped>
.input-width {
width: 300px;
}
</style>
\ No newline at end of file
<template>
<!-- 批量修改分类操作-->
<el-dialog :visible.sync="modal.classifyVisible"
width="650px"
center>
<el-form :model="listQuery"
size="small"
label-width="250px">
<el-form-item label="请选择要修改的分类:">
<el-cascader v-model="productCategoryValue"
placeholder="请选择分类"
:props="optionProps"
@change="handleCategoryChange"></el-cascader>
</el-form-item>
</el-form>
<div slot="footer"
class="dialog-footer">
<el-button size="small"
@click="modal.classifyVisible = false">取 消</el-button>
<el-button size="small"
type="primary"
@click="handleConfirm">确 认</el-button>
</div>
</el-dialog>
</template>
<script>
import { getProductCategory } from '@/api/productCate'
export default {
name: "UpdateClassify",
props: {
modal: Object
},
data() {
return {
// 级联面板定制
optionProps: {
expandTrigger: 'hover',
lazy: true,
lazyLoad(row, resolve) {
if (row.level == 0) {
row.value = 0
}
getProductCategory({
parentId: row.value
}).then(res => {
let list = res.data
list.map(item => {
item.value = item.id
item.label = item.name
item.leaf = item.level >= 3
})
resolve(list)
})
}
},
data: {
classify: null,
radio: null
},
productCategoryValue: [],
listQuery: {
categoryIdI: null,
categoryIdIi: null,
categoryIdIii: null
}
}
},
methods: {
// 监听级联面板value
handleCategoryChange() {
this.listQuery.categoryIdI = this.productCategoryValue[0]
this.listQuery.categoryIdIi = this.productCategoryValue[1]
this.listQuery.categoryIdIii = this.productCategoryValue[2]
},
handleConfirm() {
this.$emit('handleClassify', this.listQuery)
}
}
}
</script>
<style scoped>
.notice {
margin: 0 0 0 172px;
color: #999999;
}
</style>
<template>
<!-- 批量修改标签操作-->
<el-dialog
:visible.sync="modal.inventoryVisible"
width="500px"
custom-class="dialog-center"
>
<el-form :model="data">
<el-form-item label="请输入库存数量:" :label-width="formLabelWidth">
<el-input v-model="data.num" auto-complete="off"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="modal.inventoryVisible = false">取 消</el-button>
<el-button type="primary" @click="handleConfirm">确 认</el-button>
</div>
</el-dialog>
</template>
<script>
export default {
name: "UpdateInventory",
props: {
modal: Object
},
data() {
return {
formLabelWidth: '130px',
data: {
num: null,
}
}
},
methods: {
handleConfirm() {
console.log('data', this.data)
this.$emit('handleInventory', this.data)
}
}
}
</script>
<style lang="scss" scoped>
</style>
<template>
<!-- 批量修改标签操作-->
<el-dialog title="请选择要修改的标签"
:visible.sync="modal.labelVisible"
width="600px"
center
custom-class="dialog-center">
<el-form label-width="150px">
<el-form-item v-for="(item,index) in plantLabelList"
:key="'p'+index"
:label="item.labelGroupName+':'">
<el-checkbox-group value-key="id"
v-model="item.checkPlantLabelList">
<el-checkbox v-for="(it,ind) in item.pmsProductLabels"
:key="it.id"
:label="it">{{it.name}}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item v-for="(item,index) in merchLabelList"
:key="index"
:label="item.labelGroupName+':'">
<el-checkbox-group value-key="id"
v-model="item.checkMerchLabelList">
<el-checkbox v-for="(it,ind) in item.pmsProductLabels"
:key="it.id"
:label="it">{{it.name}}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
<div slot="footer"
class="dialog-footer">
<el-button size="small"
@click="modal.labelVisible = false">取 消</el-button>
<el-button size="small"
type="primary"
@click="handleConfirm">确 认</el-button>
</div>
</el-dialog>
</template>
<script>
import { mapGetters } from 'vuex'
import { getLabelList } from '@/api/newProduct'
export default {
name: "UpdateLabel",
props: {
modal: Object
},
data() {
return {
labelOptions: [
{
label: '热卖',
value: 0
},
{
label: '推荐',
value: 1
},
{
label: '新品',
value: 0
}],
plantLabelList: [],
merchLabelList: []
}
},
created() {
this.getLabelList()
},
methods: {
getLabelList() {
// 1平台标签 2商家标签
getLabelList({ type: 1, mchtId: this.userId }).then(res => {
for (var i of res.data) {
i.checkPlantLabelList = []
}
this.plantLabelList = res.data
})
getLabelList({ type: 2, mchtId: this.userId }).then(res => {
for (var i of res.data) {
i.checkMerchLabelList = []
}
this.merchLabelList = res.data
})
},
handleConfirm() {
const AllLabelList = []
for (var i of this.plantLabelList) {
for (var j of i.checkPlantLabelList) {
AllLabelList.push({
labelId: j.id,
labelName: j.name
})
}
}
for (var m of this.merchLabelList) {
for (var mj of m.checkMerchLabelList) {
AllLabelList.push({
labelId: mj.id,
labelName: mj.name
})
}
}
this.$emit('handleLabel', AllLabelList)
}
},
computed: {
...mapGetters([
'userId'
])
}
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
<template>
<!-- 批量修改标签操作-->
<el-dialog title="视频播放"
:visible.sync="visible"
width="720px"
center>
<div class="content">
<video :src="url"
controls
autoplay></video>
</div>
<div slot="footer"
class="dialog-footer">
<el-button size="small"
type="success"
@click="visible = false">关闭</el-button>
</div>
</el-dialog>
</template>
<script>
export default {
name: "VideoDialog",
data() {
return {
visible: false,
url: null
}
},
methods: {
show(url) {
this.url = url
this.visible = true
}
}
}
</script>
<style lang="scss" scoped>
.content {
text-align: center;
}
.content video {
max-height: 50vh;
}
</style>
\ No newline at end of file
export { default as UpdateClassifyModal } from './UpdateClassify'
export { default as UpdateLabelModal } from './UpdateLabel'
export { default as UpdateInventoryModal } from './UpdateInventory'
export { default as AddPhotoModal } from './AddPhotoModal'
export { default as VideoDialog } from './VideoDialog'
export { default as AuditProduct } from './AuditProduct'
<template> 
<product-detail :is-edit='false'
@showTip='handleTip(true)'
@hideTip="handleTip(false)"></product-detail>
</template>
<script>
import ProductDetail from './components/ProductDetail'
export default {
name: 'addProduct',
components: { ProductDetail },
data () {
return {
needTip: false
}
},
beforeRouteLeave (to, from, next) {
if (!this.needTip) {
next()
} else {
this.$confirm('你还未提交数据,离开后数据将丢失', '您确定要离开吗?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
center: true,
type: 'warning'
}).then(res => {
next()
}).catch(err => {
next(false)
})
}
},
methods: {
handleTip (val) {
this.needTip = val
}
}
}
</script>
<style>
</style>
<template>
<div style="margin-top: 50px">
<el-form :model="value"
v-loading="loading"
ref="productAttrForm"
label-width="120px"
size="small">
<!-- 0.规格 -->
<div class="attr-item">
<p class="title">商品规格</p>
<el-form-item label="商品规格:">
<div v-for="(item, index) in attributeList"
:key="index">
<div class="single-attr"
v-for="(citem, cindex) in item.attributes"
:key="citem.id">
<div class="attr-title">
<span>{{citem.name}}</span>
</div>
<el-checkbox-group class="row"
v-model="citem.values"
:key="citem.id">
<div class="item"
v-for="(ccitem, ccindex) in citem.pmsProductAttributeGroupList"
:key="ccindex">
<el-checkbox :label="ccitem.name">{{ccitem.name}}</el-checkbox>
</div>
</el-checkbox-group>
</div>
</div>
<el-button type="primary"
style="margin-top: 10px;"
@click="getAttrGroup">确认并修改参数
</el-button>
<!-- sku数据 -->
<div class="attr-list">
<el-table v-if="tableData.length >=1"
:data="tableData">
<el-table-column prop="info"
label="规格组合"
width="120">
</el-table-column>
<el-table-column label="平台成本价格">
<template slot-scope="scope">
<el-input v-model="scope.row.promotionPrice"></el-input>
</template>
</el-table-column>
<el-table-column label="销售价">
<template slot-scope="scope">
<el-input v-model="scope.row.price"></el-input>
</template>
</el-table-column>
<el-table-column label="库存">
<template slot-scope="scope">
<el-input v-model="scope.row.stock"></el-input>
</template>
</el-table-column>
<el-table-column label="货号">
<template slot-scope="scope">
<el-input v-model="scope.row.skuSn"></el-input>
</template>
</el-table-column>
<el-table-column prop="img"
label="图片"
width="120">
<template slot-scope="scope">
<div style="text-align: center;">
<el-image v-if="scope.row.pic"
fit="contain"
style="width:50px;"
:src="scope.row.pic"
:preview-src-list="[scope.row.pic]">
</el-image>
<single-upload v-model="scope.row.pic"
:showList="false"
style="width: 100px;display: inline-block;"></single-upload>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-form-item>
</div>
<!-- 底部操作栏 -->
<el-form-item style="text-align: center;margin: 50px 0 0 0;">
<el-button size="medium"
@click="handlePrev">上一步,设置商品基本信息
</el-button>
<el-button type="primary"
size="medium"
@click="handleNext">下一步,设置商品详情
</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import { getAttributeParams} from '@/api/newProduct'
import SingleUpload from '@/components/Upload/singleUpload'
export default {
name: 'ProductAttrDetail',
props: {
value: Object,
isEdit: {
type: Boolean,
default: false
}
},
components: {
SingleUpload
},
data() {
return {
loading: false,
attributeList: [], // 0.规格
tableData: [], // 生成的规格组合列表
}
},
methods: {
init() {
// 获取规格及参数
var cid = null
if (this.value.pmsProduct.productCategoryIdIii) {
cid = this.value.pmsProduct.productCategoryIdIii
} else if (this.value.pmsProduct.productCategoryId) {
cid = this.value.pmsProduct.productCategoryId
} else {
cid = this.value.pmsProduct.productCategoryIdI
}
// 选中的规格
const selectSkus = this.value.pmsProductSkuValueList
// 规格列表
this.tableData = this.value.pmsSkuStockList.map(item => {
item.info = item.sp1 + (item.sp2 ? ',' + item.sp2 : '') + (item.sp3 ? ',' + item.sp3 : '')
return item
})
// 进行规格属性数据的请求获取
this.loading = true
// 获取规格 0->规格
getAttributeParams({ productAttributeTypeId: cid }).then(res => {
var data = [{ attributes: res.data }]
this.loading = false
this.attributeList = data.map(item => {
item.attributes.map(citem => {
citem.attValues = []
citem.values = []
if (selectSkus && selectSkus.length > 0) {
selectSkus.forEach(sitem => {
if (citem.id == sitem.productAttributeId) {
citem.values.push(sitem.value)
}
})
}
return citem
})
return item
})
}).catch(err => {
this.loading = false
})
},
// 获取组合后的规格
getAttrGroup() {
let result = []
this.attributeList.forEach(item => {
item.attributes.forEach(att => {
let attValues = []
att.values.forEach(va => {
let str = att.pmsProductAttributeGroupList.filter(pms => pms.name == va)[0]
console.log('str',str)
attValues.push(str)
})
att.attValues = attValues
})
console.log('item', item)
result = item.attributes.reduce((ary, { name, attValues }) => {
console.log('value', attValues)
if (!attValues || attValues.length == 0) {
return ary
}
return ary.length ?
[].concat(...attValues.map(v => ary.map(res => ({ skuDesc: { ...res.skuDesc, [v.id]: v.name } })))) :
attValues.map(v => ({ skuDesc: { [v.id]: v.name } }))
}, result)
})
console.log('result', result)
for (var i of result) {
const values = []
const itemIds = []
for (var j in i.skuDesc) {
values.push(i.skuDesc[j])
itemIds.push(j)
}
i.info = values.join(',')
i.itemIds = itemIds.join(',')
}
result.forEach(item => {
item.price = '',
item.promotionPrice = '',
item.stock = '',
item.skuSn = '',
item.pic = ''
})
this.tableData = result
this.handleSkuValue()
},
// 处理sku值数据
handleSkuValue() {
// 商品规格值列表
let skuValueList = []
// 选中的规格
this.attributeList.forEach(item => {
item.attributes.forEach(citem => {
if (citem.attValues && citem.attValues.length > 0) {
citem.attValues.forEach(vitem => {
console.log('citem', citem)
skuValueList.push({
attributeGroupId: vitem.id,
productAttributeId: citem.id,
value: vitem.name
})
})
}
})
})
// 确定生成的选中规格才是有效规格
this.value.pmsProductSkuValueList = skuValueList
console.log('规格', this.value.pmsProductSkuValueList)
},
handlePrev() {
this.$emit('prevStep')
},
handleNext() {
// 商品规格列表
let pmsSkuStockList = []
// 填写的规格数据
this.tableData.forEach(item => {
let values = item.info.split(',')
if (values && values.length > 0) {
pmsSkuStockList.push({
id: item.id,
itemIds: item.itemIds,
price: item.price,
promotionPrice: item.promotionPrice,
stock: item.stock,
skuSn: item.skuSn,
sp1: values[0],
sp2: values[1],
sp3: values[2],
pic: item.pic
})
}
})
this.value.pmsSkuStockList = pmsSkuStockList
console.log('pmsSkuStockList', this.value.pmsSkuStockList)
this.$emit('nextStep')
}
}
}
</script>
<style lang="scss" scoped>
/*属性列表*/
.input-width {
width: 600px;
}
.row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 10px;
.item {
margin-right: 30px;
}
}
.attr-item {
padding: 0 25px;
.title {
padding: 15px;
background: #f5f5f5;
}
}
.single-attr {
width: 600px;
padding: 10px;
border: 1px solid #ebeef5;
.attr-title {
background: #f5f5f5;
padding: 5px 10px;
margin-bottom: 10px;
.my-btn {
float: right;
}
}
.el-row {
margin-top: 10px;
}
}
.attr-list {
margin-left: -100px;
margin-right: 20px;
margin-top: 15px;
border: 1px solid #f5f5f5;
}
</style>
<template>
<div class="cate">
<el-form :model="value"
:rules="rules"
ref="productCateForm"
label-width="160px"
size="small"
style="margin-top:30px;">
<el-form-item label="当前所选分类:"
prop="productCategoryName">
<el-input class="my-input"
v-model="value.productCategoryName"
readonly></el-input>
</el-form-item>
<!-- 选择分类 -->
<div class="my-cascader">
<el-cascader-panel
ref="category"
:props="props"
@change="handleCategoryChange"></el-cascader-panel>
</div>
<el-form-item style="margin-top: 30px;text-align: center">
<el-button type="primary"
size="medium"
@click="handleNext('productCateForm')">下一步,填写基本信息
</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import { getAttributeCategoryList } from '@/api/newProduct'
export default {
name: 'ProductCateDetail',
props: {
value: Object,
isEdit: {
type: Boolean,
default: false
}
},
data() {
const that = this
return {
rules: {
productCategoryName: [{ required: true, message: '请选择商品分类', trigger: 'change' }]
},
hasEditCreated: false,
props: {
expandTrigger: 'hover',
lazy: true,
lazyLoad(row, resolve) {
if (row.level == 0) {
row.value = 0
}
getAttributeCategoryList({
parentId: row.value,
page: '',
size: ''
}).then(res => {
let list = res.data
list.map(item => {
item.value = item.id
item.label = item.name
item.leaf = item.level >= 3
})
resolve(list)
})
}
}
}
},
created() {
},
computed: {
//商品的编号
productId() {
return this.value.id
}
},
methods: {
// 监听级联面板value
handleCategoryChange(values) {
let labels = this.$refs.category.getCheckedNodes()[0].pathLabels
this.value.productCategoryIdI = values[0]
this.value.productCategoryId = values[1]
this.value.productCategoryIdIii = values[2]
this.value.productCategoryName = labels.join(' - ')
},
//处理编辑逻辑
handleEditCreated() {
this.hasEditCreated = true
},
handleNext(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.$emit('nextStep')
}
})
}
},
watch: {
productId: function (newValue) {
if (!this.isEdit) return
if (this.hasEditCreated) return
if (newValue === undefined || newValue == null || newValue === 0) return
this.handleEditCreated()
}
}
}
</script>
<style lang="scss" scoped>
.cate {
font-size: 14px;
width: 800px;
margin: 50px auto;
}
/*级联面板*/
.my-cascader {
width: 700px;
margin: 50px auto;
}
/*当前所选分类*/
.my-input {
width: 300px;
/deep/ .el-input__inner {
padding: 0;
border: none;
color: #f56c6c;
}
}
</style>
<template> 
<el-card class="form-container"
shadow="never"
v-loading="loading">
<!-- 步骤栏 -->
<el-steps :active="active"
finish-status="success"
align-center>
<el-step title="1、商品分类"></el-step>
<el-step title="2、基本信息"></el-step>
<el-step title="3、属性规格"></el-step>
<el-step title="4、详情信息"></el-step>
</el-steps>
<!-- 商品分类 -->
<product-cate-detail v-show="active == 0"
v-model="productParam.pmsProduct"
:is-edit="isEdit"
ref="category"
@nextStep="nextStep">
</product-cate-detail>
<!-- 基本信息 -->
<product-info-detail v-show="active == 1"
v-model="productParam.pmsProduct"
:is-edit="isEdit"
ref="info"
@prevStep="prevStep"
@nextStep="nextStep">
</product-info-detail>
<!-- 属性规格 -->
<product-attr-detail v-show="active == 2"
v-model="productParam"
:is-edit="isEdit"
ref="attribute"
@nextStep="nextStep"
@prevStep="prevStep">
</product-attr-detail>
<!-- 详细信息 -->
<product-write-detail v-show="active == 3"
v-model="productParam.pmsProduct"
:is-edit="isEdit"
ref="detail"
@prevStep="prevStep"
@finishCommit="finishCommit">
</product-write-detail>
<!-- 审核弹窗 -->
<audit-dialog ref="auditDialog"
@ok="$router.back()"></audit-dialog>
</el-card>
</template>
<script>
import ProductCateDetail from './ProductCateDetail'
import ProductInfoDetail from './ProductInfoDetail'
import ProductAttrDetail from './ProductAttrDetail'
import ProductWriteDetail from './ProductWriteDetail'
import AuditDialog from '@/views/pms/components/AuditDialog'
import { createProduct, getProduct, updateProduct } from '@/api/product'
// 默认的商品参数
const defaultProductParam = {
pmsProductSkuValueList: [],
pmsProduct: {
newStatus:1,
albumPics: null,
productCategoryName: null,
productCategoryIdI: null,
productCategoryId: null,
productCategoryIdIii: null,
name: null,
detailHtml: null,
productPic: null,
freightTempletId: null,
brandId: null,
mchtId: null,
subscribeFlag: 0, // 是否需要预约0否 1是
subscribeDate: null,
saleDate: null,
agencyCommission: null,
anchorCommision: null,
anchorShareCommision: null,
publishStatus: 0,
shopCommision: null,
secondCommission: null,
explainId: null,
bannerPic: null,
productSn: null,
unit: null,
weight: null,
virtualSales: null
},
pmsSkuStockList:[],
}
// 商品详情
export default {
name: 'ProductDetail',
components: {
ProductCateDetail,
ProductInfoDetail,
ProductAttrDetail,
ProductWriteDetail,
AuditDialog
},
props: {
isEdit: {
type: Boolean,
default: false
}
},
data () {
return {
loading: false,
active: 0,
productParam: Object.assign({}, defaultProductParam)
}
},
created () {
if (this.isEdit) {
getProduct({id:this.$route.query.id}).then(response => {
this.productParam = response.data
})
}
},
methods: {
prevStep () {
// 上一步
if (this.active > 0) {
this.active--
}
},
nextStep () {
// 下一步
this.active++
// 基本信息根据供应商获取对应品牌
if (this.active === 1) {
this.$refs.info.init()
}
// 获取平台规格参数属性
if (this.active === 2) {
this.$refs.attribute.init()
}
// 友情提示处理,判断是否真的要离开
if (this.active > 1) {
this.$emit('showTip')
}
},
finishCommit (isEdit) {
this.$confirm('是否要提交该产品', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
center: true,
type: 'warning'
}).then(() => {
if (isEdit) {
this.loading = true
updateProduct(this.productParam).then(res => {
this.loading = false
this.$message({
type: 'success',
message: '提交成功',
duration: 1000
})
if (this.$route.query.isAudit) {
this.handleAudit()
} else {
this.$router.back()
}
}).catch(err => {
this.loading = false
})
} else {
this.loading = true
createProduct(this.productParam).then(res => {
this.$emit('hideTip')
this.loading = false
this.$message({
type: 'success',
message: '提交成功',
duration: 1000
})
this.$router.push('productAudit')
}).catch(err => {
this.loading = false
})
}
})
},
// 审核
handleAudit () {
this.$refs.auditDialog.audit({ id: this.$route.query.id, name: this.productParam.name })
}
}
}
</script>
<style>
.form-container {
width: 960px;
padding: 30px 0;
}
</style>
<template>
<div style="margin-top: 50px">
<el-form :model="value"
ref="productForm"
label-width="150px"
style="padding: 0 30px;"
size="small">
<el-form-item :rules="[{required: true, trigger: 'blur', message: '详情内容不能为空'}]"
prop="detailHtml"
label="电脑端详情内容:">
<tinymce v-model="value.detailHtml"
:mchtId="value.mchtId"></tinymce>
<!-- <span class="notice">图片不超过10张,文字不超过500字</span> -->
<span class="notice">建议:所有图片都是本宝贝相关的图片</span>
<span class="notice">图片大小建议使用宽度480 ~ 750、高度小于等于960像素的图片</span>
<!-- <span class="notice">请手动输入文字,不要复制粘贴网页上的文字,防止出现乱码</span> -->
</el-form-item>
<el-form-item style="text-align: center;margin: 50px 0 0 0;">
<el-button size="medium"
@click="handlePrev">上一步,填写商品促销</el-button>
<el-button type="primary"
size="medium"
@click="handleFinishCommit('productForm')">完成,发布商品</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import Tinymce from '@/components/Tinymce'
export default {
name: "ProductWriteDetail",
components: { Tinymce },
props: {
value: Object,
isEdit: {
type: Boolean,
default: false
}
},
data() {
return {
//编辑模式时是否初始化成功
hasEditCreated: false
}
},
computed: {
//商品的编号
productId() {
return this.value.id
}
},
watch: {
productId: function (newValue) {
if (!this.isEdit) return;
if (this.hasEditCreated) return;
if (newValue === undefined || newValue == null || newValue === 0) return;
this.handleEditCreated();
}
},
methods: {
handleEditCreated() {
this.hasEditCreated = true;
},
handlePrev() {
this.$emit('prevStep')
},
handleFinishCommit (formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.$emit('finishCommit', this.isEdit)
} else {
this.$message({
message: '验证失败',
type: 'error',
duration: 1000
})
return false
}
})
},
// handleNext() {
// this.$refs.productForm.validate((valid) => {
// if (valid) {
// this.$emit('nextStep')
// }
// })
// }
}
}
</script>
<style scoped>
.littleMarginLeft {
margin-left: 10px;
}
.littleMarginTop {
margin-top: 10px;
}
.paramInput {
width: 250px;
}
.paramInputLabel {
display: inline-block;
width: 100px;
text-align: right;
padding-right: 10px;
}
.cardBg {
background: #f8f9fc;
}
</style>
<template> 
<product-detail :is-edit='true'></product-detail>
</template>
<script>
import ProductDetail from './components/ProductDetail'
export default {
name: 'updateProduct',
components: { ProductDetail }
}
</script>
<style>
</style>
<template> 
<div class="app-container">
<!-- 操作栏 -->
<el-card class="operate-container"
shadow="never">
<div class="row-item">
<el-steps :active="3"
align-center>
<el-step title="创建分类"></el-step>
<el-step title="创建类型"></el-step>
<el-step title="创建分组"></el-step>
<!-- <el-step title="添加属性"></el-step>-->
</el-steps>
<el-button size="small"
type="primary"
@click="handleAdd()">添加属性分类</el-button>
</div>
</el-card>
<!-- 表格栏 -->
<div class="table-container">
<el-table :data="list"
ref="table"
row-key="id"
lazy
:load="loadChildren"
:tree-props="{children: 'children'}"
v-loading="listLoading"
border>
<el-table-column label="分类层级"
align="center">
<template slot-scope="scope">{{scope.row.level | formatLevel}}</template>
</el-table-column>
<el-table-column label="编号"
align="center">
<template slot-scope="scope">{{scope.row.id}}</template>
</el-table-column>
<el-table-column label="分类名称"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="类型数量"
align="center">
<template slot-scope="scope">{{scope.row.paramCount || 0}}</template>
</el-table-column>
<el-table-column label="排序"
align="center">
<template slot-scope="scope">{{scope.row.sort || '-'}}</template>
</el-table-column>
<el-table-column label="操作"
width="320"
align="center">
<template slot-scope="scope">
<el-button v-if="scope.row.level < 3"
size="mini"
type="primary"
@click="handleAdd(scope.row)">添加下级</el-button>
<el-button size="mini"
type="success"
@click="lookDetail(scope.row)">查看</el-button>
<el-button size="mini"
type="warning"
@click="handleUpdate(scope.row)">编辑</el-button>
<el-button size="mini"
type="danger"
@click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 弹窗 -->
<attribute-classify-modal ref="detailModal"
@ok="refresh"></attribute-classify-modal>
<!-- end -->
</div>
</template>
<script>
import { fetchAttributeClassifyList, deleteAttributeClassify } from '@/api/attributeClassify'
import AttributeClassifyModal from './modules/AttributeClassifyModal'
// 属性分类列表
export default {
name: 'AttributeClassifyList',
components: {
AttributeClassifyModal
},
data() {
return {
list: [],
listLoading: false
}
},
mounted() {
this.getList()
},
filters: {
formatLevel(level) {
if (level == 3) {
return '三级'
} else if (level == 2) {
return '二级'
} else {
return '一级'
}
}
},
methods: {
// 添加下级
handleAdd(row) {
this.$refs.detailModal.add(row)
},
// 编辑
handleUpdate(row) {
this.$refs.detailModal.detail(row.id)
},
// 删除
handleDelete(row) {
this.$confirm('删除该分类前请确保相关联的数据已经解除关联', '您确定要删除' + row.name + '分类吗?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
center: true
}).then(() => {
// 请求删除
this.listLoading = true
deleteAttributeClassify(row.id).then(res => {
this.listLoading = false
this.refresh(row.parentId)
}).catch(err => {
this.listLoading = false
})
})
},
// 查看
lookDetail(row) {
this.$router.push({ name: 'attributeTypeList', params: row })
},
//请求数据
getList() {
this.listLoading = true
fetchAttributeClassifyList({
pageSize: 100,
pageNum: 1,
parentId: 0
}).then(res => {
this.listLoading = false
let list = res.data.list
list.map(item => {
item.hasChildren = item.level < 3
})
this.list = list
})
},
//加载子节点数据
loadChildren(row, treeNode, resolve) {
fetchAttributeClassifyList({
pageSize: 100,
pageNum: 1,
parentId: row.id
}).then(res => {
let list = res.data.list
list.map(item => {
item.hasChildren = item.level < 3
})
resolve(list)
})
},
//刷新节点
refresh(id) {
if (id == 0) {
this.getList()
} else {
fetchAttributeClassifyList({
pageSize: 100,
pageNum: 1,
parentId: id
}).then(res => {
let list = res.data.list
list.map(item => {
item.hasChildren = item.level < 3
})
this.$set(this.$refs.table.store.states.lazyTreeNodeMap, id, list)
})
}
}
}
}
</script>
<style scoped>
.row-item {
display: flex;
flex-direction: row;
align-items: center;
}
.row-item .el-steps {
flex: 1;
}
</style>
<template> 
<div class="app-container">
<!-- 搜索栏 -->
<el-card class="filter-container"
shadow="never">
<el-form :inline="true"
:model="listQuery"
size="small">
<el-form-item label="属性分类:">
<el-cascader v-model="classifyIds"
size="small"
class="input-width"
expand-trigger="hover"
clearable
:props="props"></el-cascader>
</el-form-item>
<el-form-item label="属性类型:">
<el-select size="small"
clearable
placeholder="属性类型"
v-model="listQuery.cid">
<el-option v-for="item in typeOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<!-- 筛选操作 -->
<el-form-item>
<el-button type="primary"
@click="handleSearchList"
size="small">筛选</el-button>
</el-form-item>
<el-button class="btn-add"
size="small"
type="primary"
@click="handleAdd">添加属性分组</el-button>
</el-form>
</el-card>
<!-- 表格栏 -->
<div class="table-container">
<el-table :data="list"
row-key="id"
:tree-props="{children: 'children'}"
v-loading="listLoading"
border>
<el-table-column label="序号"
width="100"
align="center">
<template slot-scope="scope">{{scope.$index + 1}}</template>
</el-table-column>
<el-table-column label="编号"
align="center">
<template slot-scope="scope">{{scope.row.id}}</template>
</el-table-column>
<el-table-column label="属性分组名"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="所属类型"
align="center">
<template slot-scope="scope">{{scope.row.attributeTypeName}}</template>
</el-table-column>
<el-table-column label="属性个数"
align="center">
<template slot-scope="scope">{{scope.row.paramCount || 0}}</template>
</el-table-column>
<el-table-column label="属性"
align="center">
<template slot-scope="scope">{{scope.row.attributeName}}</template>
</el-table-column>
<el-table-column label="操作"
width="220"
align="center">
<template slot-scope="scope">
<el-button size="mini"
type="success"
@click="lookDetail(scope.row)">查看</el-button>
<el-button size="mini"
type="warning"
@click="handleUpdate(scope.row)">编辑</el-button>
<el-button size="mini"
type="danger"
@click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 分页栏 -->
<div class="pagination-container">
<el-pagination background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
layout="total, sizes, prev, pager, next, jumper"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[5,10,15]"
:total="total">
</el-pagination>
</div>
<!-- 弹窗 -->
<attribute-group-modal ref="detailModal"
@ok="getList"></attribute-group-modal>
<!-- end -->
</div>
</template>
<script>
import { fetchAttributeGroupList, deleteAttributeGroup } from '@/api/attributeGroup'
import { fetchAttributeClassifyList } from '@/api/attributeClassify'
import { fetchAttributeTypeList } from '@/api/attributeType'
import AttributeGroupModal from './modules/AttributeGroupModal'
// 属性类型列表
export default {
name: 'AttributeGroupList',
components: {
AttributeGroupModal
},
data() {
return {
listQuery: {
pageSize: 10,
pageNum: 1,
attributeCategoryId: null,
cid: null
},
classifyIds: [],
total: 0,
list: [],
listLoading: false,
props: {
lazy: true,
checkStrictly: true,
lazyLoad(row, resolve) {
if (row.level == 0) {
row.value = 0
}
fetchAttributeClassifyList({
pageSize: 100,
pageNum: 1,
parentId: row.value
}).then(res => {
let list = res.data.list
list.map(item => {
item.value = item.id
item.label = item.name
item.leaf = item.level >= 3
})
resolve(list)
})
}
},
typeOptions: []
}
},
mounted() {
if (this.$route.params.id) {
this.listQuery.cid = this.$route.params.id
}
this.getList()
},
methods: {
handleSearchList() {
if (this.classifyIds && this.classifyIds.length > 0) {
this.listQuery.attributeCategoryId = this.classifyIds[this.classifyIds.length - 1]
} else {
this.listQuery.attributeCategoryId = null
}
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
// 添加下级
handleAdd(row) {
this.$refs.detailModal.add()
},
// 编辑
handleUpdate(row) {
this.$refs.detailModal.detail(row.id)
},
// 删除
handleDelete(row) {
this.$confirm('删除该分组前请确保相关联的数据已经解除关联', '您确定要删除' + row.name + '分组吗?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
center: true
}).then(() => {
// 请求删除
this.listLoading = true
deleteAttributeGroup([row.id]).then(res => {
this.listLoading = false
this.getList()
}).catch(err => {
this.listLoading = false
})
})
},
// 查看
lookDetail(row) {
this.$router.push({ name: 'attributeList', params: row })
},
//请求数据
getList() {
this.listLoading = true
fetchAttributeGroupList(this.listQuery).then(res => {
this.listLoading = false
let list = res.data.list
this.list = list
this.total = Number(res.data.total)
}).catch(err => {
this.listLoading = false
})
if (!this.typeOptions || this.typeOptions.length == 0) {
this.getTypeList()
}
},
//获取类型数据
getTypeList() {
fetchAttributeTypeList({
pageSize: 100,
pageNum: 1,
attributeCategoryId: 0
}).then(res => {
this.typeOptions = res.data.list
})
}
}
}
</script>
<style scoped>
.input-width {
width: 300px;
}
.row-item {
display: flex;
flex-direction: row;
align-items: center;
}
.row-item .el-steps {
flex: 1;
}
</style>
\ No newline at end of file
<template> 
<div class="app-container">
<!-- 搜索栏 -->
<el-card class="filter-container"
shadow="never">
<el-form :inline="true"
:model="listQuery"
size="small">
<el-form-item label="属性类型:">
<el-select size="small"
clearable
placeholder="属性类型"
v-model="listQuery.attributeTypeId">
<el-option v-for="item in typeOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="属性分组:">
<el-select size="small"
clearable
placeholder="属性组"
v-model="listQuery.cid">
<el-option v-for="item in groupOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary"
@click="handleSearchList"
size="small">筛选</el-button>
</el-form-item>
<el-button class="btn-add"
size="small"
type="primary"
@click="handleAdd">添加新属性</el-button>
</el-form>
</el-card>
<!-- 表格栏 -->
<div class="table-container">
<el-table :data="list"
row-key="id"
:tree-props="{children: 'children'}"
v-loading="listLoading"
border>
<el-table-column label="序号"
width="100"
align="center">
<template slot-scope="scope">{{scope.$index + 1}}</template>
</el-table-column>
<el-table-column label="编号"
align="center">
<template slot-scope="scope">{{scope.row.id}}</template>
</el-table-column>
<el-table-column label="商家名称"
align="center">
<template slot-scope="scope">{{scope.row.shopName || '--'}}</template>
</el-table-column>
<el-table-column label="属性名称"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="属性分组"
align="center">
<template slot-scope="scope">{{scope.row.attributeGroupName}}</template>
</el-table-column>
<el-table-column label="属性类型"
align="center">
<template slot-scope="scope">{{scope.row.attributeTypeName || '--'}}</template>
</el-table-column>
<el-table-column label="可否检索"
align="center">
<template slot-scope="scope">{{scope.row.searchType | formatSearchType}}</template>
</el-table-column>
<el-table-column label="是否关联"
align="center">
<template slot-scope="scope">{{scope.row.relatedStatus | formatRelatedStatus}}</template>
</el-table-column>
<el-table-column label="是否可选"
align="center">
<template slot-scope="scope">{{scope.row.selectType | formatSelectType}}</template>
</el-table-column>
<el-table-column label="操作"
width="220"
align="center">
<template slot-scope="scope">
<el-button size="mini"
type="warning"
@click="handleUpdate(scope.row)">编辑</el-button>
<el-button size="mini"
type="danger"
@click="handleDelete(scope.row)">删除</el-button>
<el-button size="mini"
type="primary"
@click="handleChange(scope.row)">移动</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 分页栏 -->
<div class="pagination-container">
<el-pagination background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
layout="total, sizes, prev, pager, next, jumper"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
<!-- 弹窗 -->
<attribute-modal ref="detailModal"
@ok="getList"></attribute-modal>
<attribute-change-modal ref="changeModal"
@ok="getList"></attribute-change-modal>
<!-- end -->
</div>
</template>
<script>
import { fetchAttributeList, deleteAttribute } from '@/api/attribute'
import { fetchAttributeTypeList } from '@/api/attributeType'
import { fetchAttributeGroupList } from '@/api/attributeGroup'
import AttributeModal from './modules/AttributeModal'
import AttributeChangeModal from './modules/AttributeChangeModal'
// 属性类型列表
export default {
name: 'AttributeList',
components: {
AttributeModal,
AttributeChangeModal
},
data() {
return {
listQuery: {
pageNum: 1,
pageSize: 10,
cid: null,
attributeTypeId: null
},
total: 0,
list: [],
listLoading: false,
typeOptions: [],
groupOptions: []
}
},
mounted() {
if (this.$route.params.id) {
this.listQuery.cid = this.$route.params.id
}
this.getList()
},
filters: {
formatSearchType(searchType) {
if (searchType == 2) {
return '范围检索'
} else if (searchType == 1) {
return '关键字检索'
} else {
return '不需要检索'
}
},
formatSelectType(selectType) {
if (selectType == 2) {
return '复选属性'
} else if (selectType == 1) {
return '单选属性'
} else {
return '唯一属性'
}
},
formatRelatedStatus(relatedStatus) {
if (relatedStatus == 1) {
return '关联'
} else {
return '不关联'
}
}
},
methods: {
handleSearchList() {
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
// 添加下级
handleAdd(row) {
this.$refs.detailModal.add()
},
// 编辑
handleUpdate(row) {
this.$refs.detailModal.detail(row.id)
},
// 删除
handleDelete(row) {
this.$confirm('删除该条数据前请确保相关联的数据已经解除关联', '您确定要删除所选类型吗?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
center: true
}).then(() => {
// 请求删除
this.listLoading = true
deleteAttribute(row.id).then(res => {
this.listLoading = false
this.getList()
}).catch(err => {
this.listLoading = false
})
})
},
// 移动
handleChange(row) {
this.$refs.changeModal.detail(row.id)
},
// 请求数据
getList() {
this.listLoading = true
fetchAttributeList(this.listQuery).then(res => {
this.listLoading = false
let list = res.data.list
this.list = list
this.total = Number(res.data.total)
}).catch(err => {
this.listLoading = false
})
if (!this.typeOptions || this.typeOptions.length == 0) {
this.getTypeList()
}
if (!this.groupOptions || this.groupOptions.length == 0) {
this.getGroupList()
}
},
// 获取类型数据
getTypeList() {
fetchAttributeTypeList({
pageSize: 100,
pageNum: 1,
attributeCategoryId: 0
}).then(res => {
this.typeOptions = res.data.list
})
},
// 获取分组数据
getGroupList() {
fetchAttributeGroupList({
pageSize: 100,
pageNum: 1
}).then(res => {
this.groupOptions = res.data.list
})
}
}
}
</script>
<style scoped>
.row-item {
display: flex;
flex-direction: row;
align-items: center;
}
.row-item .el-steps {
flex: 1;
}
</style>
\ No newline at end of file
<template> 
<div class="app-container">
<!-- 搜索栏 -->
<el-card class="filter-container"
shadow="never">
<el-form :inline="true"
:model="listQuery"
size="small">
<el-form-item label="属性分类:">
<el-cascader v-model="classifyIds"
size="small"
class="input-width"
clearable
expand-trigger="hover"
:props="props"></el-cascader>
</el-form-item>
<!-- 筛选操作 -->
<el-form-item>
<el-button type="primary"
@click="handleSearchList"
size="small">筛选</el-button>
</el-form-item>
<el-button class="btn-add"
size="small"
type="primary"
@click="handleAdd">添加属性类型</el-button>
</el-form>
</el-card>
<!-- 表格栏 -->
<div class="table-container">
<el-table :data="list"
row-key="id"
:tree-props="{children: 'children'}"
v-loading="listLoading"
border>
<el-table-column label="序号"
width="100"
align="center">
<template slot-scope="scope">{{scope.$index + 1}}</template>
</el-table-column>
<el-table-column label="编号"
align="center">
<template slot-scope="scope">{{scope.row.id}}</template>
</el-table-column>
<el-table-column label="类型名称"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="属性分组"
align="center">
<template slot-scope="scope">{{scope.row.attributeGroupName || '-'}}</template>
</el-table-column>
<el-table-column label="属性分类"
align="center">
<template slot-scope="scope">{{scope.row.categoryName}}</template>
</el-table-column>
<el-table-column label="属性个数"
align="center">
<template slot-scope="scope">{{scope.row.paramCount}}</template>
</el-table-column>
<el-table-column label="操作"
width="220"
align="center">
<template slot-scope="scope">
<el-button size="mini"
type="success"
@click="lookDetail(scope.row)">查看</el-button>
<el-button size="mini"
type="warning"
@click="handleUpdate(scope.row)">编辑</el-button>
<el-button size="mini"
type="danger"
@click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 分页栏 -->
<div class="pagination-container">
<el-pagination background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
layout="total, sizes, prev, pager, next, jumper"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
<!-- 弹窗 -->
<attribute-type-modal ref="detailModal"
@ok="getList"></attribute-type-modal>
<!-- end -->
</div>
</template>
<script>
import { fetchAttributeTypeList, deleteAttributeType } from '@/api/attributeType'
import { fetchAttributeClassifyList, getAttributeClassify } from '@/api/attributeClassify'
import AttributeTypeModal from './modules/AttributeTypeModal'
// 属性类型列表
export default {
name: 'AttributeTypeList',
components: {
AttributeTypeModal
},
data() {
return {
listQuery: {
pageSize: 10,
pageNum: 1,
attributeCategoryId: 0
},
classifyIds: [],
total: 0,
list: [],
listLoading: false,
props: {
lazy: true,
checkStrictly: true,
lazyLoad(row, resolve) {
if (row.level == 0) {
row.value = 0
}
fetchAttributeClassifyList({
pageSize: 100,
pageNum: 1,
parentId: row.value
}).then(res => {
let list = res.data.list
list.map(item => {
item.value = item.id
item.label = item.name
item.leaf = item.level >= 3
})
resolve(list)
})
}
}
}
},
mounted() {
this.init()
},
methods: {
init() {
if (this.$route.params.id) {
let classify = this.$route.params
this.listQuery.attributeCategoryId = classify.id
if (classify.parentId == 0) {
this.classifyIds.push(classify.id)
this.getList()
} else if (classify.hasChildren) {
this.classifyIds.push(classify.parentId)
this.classifyIds.push(classify.id)
this.getList()
} else {
getAttributeClassify(classify.parentId).then(res => {
this.$nextTick(() => {
this.classifyIds.push(res.data.parentId)
this.classifyIds.push(classify.parentId)
this.classifyIds.push(classify.id)
this.getList()
})
})
}
} else {
this.getList()
}
},
handleSearchList() {
if (this.classifyIds && this.classifyIds.length > 0) {
this.listQuery.attributeCategoryId = this.classifyIds[this.classifyIds.length - 1]
} else {
this.listQuery.attributeCategoryId = 0
}
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
// 添加下级
handleAdd(row) {
this.$refs.detailModal.add()
},
// 编辑
handleUpdate(row) {
this.$refs.detailModal.detail(row.id)
},
// 删除
handleDelete(row) {
this.$confirm('删除该条数据前请确保相关联的数据已经解除关联', '您确定要删除所选类型吗?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
center: true
}).then(() => {
// 请求删除
this.listLoading = true
deleteAttributeType([row.id]).then(res => {
this.listLoading = false
this.getList()
}).catch(err => {
this.listLoading = false
})
})
},
// 查看
lookDetail(row) {
this.$router.push({ name: 'attributeGroupList', params: row })
},
//请求数据
getList() {
this.listLoading = true
fetchAttributeTypeList(this.listQuery).then(res => {
this.listLoading = false
let list = res.data.list
this.list = list
this.total = Number(res.data.total)
})
}
}
}
</script>
<style scoped>
.input-width {
width: 300px;
}
.row-item {
display: flex;
flex-direction: row;
align-items: center;
}
.row-item .el-steps {
flex: 1;
}
</style>
\ No newline at end of file
<template> 
<div class="app-container">
<!-- 表格栏 -->
<div class="table-container">
<el-table :data="list"
ref="table"
row-key="id"
lazy
:load="loadChildren"
:tree-props="{children: 'children'}"
v-loading="listLoading"
border>
<el-table-column label="分类层级"
align="center">
<template slot-scope="scope">{{scope.row.level | formatLevel}}</template>
</el-table-column>
<el-table-column label="类目名称"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="商品数量"
align="center">
<template slot-scope="scope">{{scope.row.productCount || 0}}</template>
</el-table-column>
<el-table-column label="分类税率(%)"
align="center">
<template slot-scope="scope">{{scope.row.categoryRate || '--'}}%</template>
</el-table-column>
<el-table-column label="平台佣金比例(%)"
align="center">
<template slot-scope="scope">{{scope.row.commissionRate || '--'}}%</template>
</el-table-column>
<el-table-column label="数量单位"
align="center">
<template slot-scope="scope">{{scope.row.productUnit || '-'}}</template>
</el-table-column>
<el-table-column label="排序"
align="center">
<template slot-scope="scope">{{scope.row.sort || '-'}}</template>
</el-table-column>
<el-table-column label="是否显示"
align="center">
<template slot-scope="scope">
<el-switch v-model="scope.row.showStatus"
@change="changeShowStatus(scope.row)"
:inactive-value="0"
:active-value="1"></el-switch>
</template>
</el-table-column>
<el-table-column label="操作"
width="280"
align="center">
<template slot-scope="scope">
<el-button size="mini"
type="warning"
@click="handleUpdate(scope.row)">编辑设定</el-button>
<el-button size="mini"
type="primary"
@click="handleChange(scope.row)">转移商品</el-button>
<el-button size="mini"
type="danger"
@click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 弹窗 -->
<classify-modal ref="detailModal"
@ok="refresh"></classify-modal>
<!-- 转移分类商品弹窗 -->
<classify-change-modal ref="changeModal"
@ok="getList"></classify-change-modal>
<!-- end -->
</div>
</template>
<script>
import { getClassifyList, deleteClassify, changeShow } from '@/api/classify'
import ClassifyModal from './modules/ClassifyModal'
import ClassifyChangeModal from './modules/ClassifyChangeModal'
// 属性分类列表
export default {
name: 'AttributeClassifyList',
components: {
ClassifyModal,
ClassifyChangeModal
},
data() {
return {
list: [],
listLoading: false
}
},
mounted() {
this.getList()
},
filters: {
formatLevel(level) {
if (level == 3) {
return '三级'
} else if (level == 2) {
return '二级'
} else {
return '一级'
}
}
},
methods: {
// 编辑设定
handleUpdate(row) {
this.$refs.detailModal.detail(row.id)
},
// 删除
handleDelete(row) {
this.$confirm('删除该条数据前请确保相关联的数据已经解除关联', '您确定要删除所选分类吗?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
center: true
}).then(() => {
// 请求删除
this.listLoading = true
deleteClassify(row.id).then(res => {
this.listLoading = false
this.refresh(row.parentId)
}).catch(res => {
this.listLoading = false
})
})
},
changeShowStatus(row) {
changeShow({ ids: row.id, showStatus: row.showStatus }).then(res => {
this.$message.success('切换成功')
}).catch(err => {
row.showStatus = 1 - row.showStatus
})
},
// 转移商品
handleChange(row) {
this.$refs.changeModal.detail(row)
},
// 请求数据
getList() {
this.listLoading = true
getClassifyList(0, { pageSize: 100, pageNum: 1 }).then(res => {
this.listLoading = false
let list = res.data.list
list.map(item => {
item.hasChildren = item.level < 3
})
this.list = list
})
},
// 加载子节点数据
loadChildren(row, treeNode, resolve) {
getClassifyList(row.id, { pageSize: 100, pageNum: 1 }).then(res => {
let list = res.data.list
list.map(item => {
item.hasChildren = item.level < 3
})
resolve(list)
})
},
// 刷新节点
refresh(id) {
if (id == 0) {
this.getList()
} else {
getClassifyList(id, { pageSize: 100, pageNum: 1 }).then(res => {
let list = res.data.list
list.map(item => {
item.hasChildren = item.level < 3
})
this.$set(this.$refs.table.store.states.lazyTreeNodeMap, id, list)
})
}
}
}
}
</script>
<style scoped>
.row-item {
display: flex;
flex-direction: row;
align-items: center;
}
.row-item .el-steps {
flex: 1;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment