czg_team
/
cashier-admin
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

新增商品库存

This commit is contained in:
gyq 2024-01-24 12:20:58 +08:00
parent 966ef627bb
commit 122b979045
8 changed files with 626 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/App.vue
View File

@ -14,4 +14,23 @@ export default {
.tips {
color: #999;
}
.img_error {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
.icon {
font-size: 20px;
color: #999;
}
}
.filter_wrap {
display: flex;
align-items: center;
gap: 10px;
}
</style>

75
src/api/invoicing.js Normal file
View File

@ -0,0 +1,75 @@
import request from '@/utils/request'
/**
* 商品列表
* @returns
*/
export function tbProductGet(params) {
return request({
url: '/api/tbProduct',
method: 'get',
params
})
}
/**
* 进销存类型字典
* @returns
*/
export function dictDetail(params) {
return request({
url: `/api/dictDetail`,
method: 'get',
params
})
}
/**
* 库存记录列表
* @returns
*/
export function tbProductStockDetail(data) {
return request({
url: `/api/tbProductStockDetail/stock`,
method: 'post',
data
})
}
/**
* 变动数量
* @returns
*/
export function tbProductStockDetailSum(params) {
return request({
url: `/api/tbProductStockDetail/sum`,
method: 'get',
params
})
}
/**
* 供应商列表
* @returns
*/
export function tbShopPurveyorGet(params) {
return request({
url: `/api/tbShopPurveyor`,
method: 'get',
params
})
}
/**
* 增加供应商
* @returns
*/
export function tbShopPurveyor(data, method = 'post') {
return request({
url: `/api/tbShopPurveyor`,
method: method,
data
})
}

93
src/views/invoicing/components/addSupplier.vue Normal file
View File

@ -0,0 +1,93 @@
<template>
<el-dialog :title="`${form.id ? '编辑' : '添加'}供应商`" :visible.sync="dialogVisible" @close="reset">
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
<el-form-item label="供应商" prop="purveyorName">
<el-input v-model="form.purveyorName" placeholder="请输入供应商名称"></el-input>
</el-form-item>
<el-form-item label="联系电话">
<el-input v-model="form.purveyorTelephone" placeholder="请输入联系电话"></el-input>
</el-form-item>
<el-form-item label="地址">
<el-input type="textarea" v-model="form.address" placeholder="请输入地址"></el-input>
</el-form-item>
<el-form-item label="标签">
<el-input v-model="form.tip" placeholder="请输入标签"></el-input>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="form.remark" placeholder="请输入备注"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="onSubmitHandle">确 定</el-button>
</span>
</el-dialog>
</template>
<script>
import { tbShopPurveyor } from '@/api/invoicing'
export default {
data() {
return {
dialogVisible: false,
form: {
id: '',
purveyorName: '',
purveyorTelephone: '',
address: '',
tip: '',
remark: '',
},
rules: {
purveyorName: [
{
required: true,
message: '请输入供应商名称',
trigger: 'blur'
}
]
}
}
},
methods: {
onSubmitHandle() {
this.$refs.form.validate(async valid => {
if (valid) {
try {
let res = await tbShopPurveyor({
...this.form,
shopId: localStorage.getItem('shopId')
}, this.form.id ? 'put' : 'post')
this.$emit('success', res)
this.close()
this.$notify({
title: '成功',
message: `${this.form.id ? '编辑' : '添加'}成功`,
type: 'success'
});
} catch (error) {
console.log(error)
}
}
})
},
show(obj) {
this.dialogVisible = true
if (obj && obj.id) {
this.form = JSON.parse(JSON.stringify(obj))
}
},
close() {
this.dialogVisible = false
},
reset() {
this.form.id = ''
this.form.purveyorName = ''
this.form.purveyorTelephone = ''
this.form.address = ''
this.form.tip = ''
this.form.remark = ''
}
}
}
</script>

178
src/views/invoicing/components/invoicingDetail.vue Normal file
View File

@ -0,0 +1,178 @@
<!-- 进销存详情记录 -->
<template>
<el-dialog title="详情记录" width="80%" :visible.sync="dialogVisible" @close="dialogVisible = false">
<div class="head-container">
<el-select v-model="query.type" placeholder="选择类型">
<el-option :label="item.label" :value="item.value" v-for="item in typeList" :key="item.id"></el-option>
</el-select>
<el-date-picker v-model="query.createdAt" type="daterange" range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期" value-format="yyyy-MM-dd HH:mm:ss">
</el-date-picker>
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</div>
<div class="head-container">
<div class="exchange_wrap">
<div class="item">
<span>{{ exchange || 0 }}</span>
<span>变动数量</span>
</div>
</div>
</div>
<div class="head-container">
<el-table :data="tableData.list" v-loading="tableData.loading">
<el-table-column label="变动数量" prop="stockNumber">
<template v-slot="scope">
<span class="num" :class="{ active: scope.row.stockNumber > 0 }">{{ scope.row.stockNumber }} {{
scope.row.unitName
}}</span>
</template>
</el-table-column>
<el-table-column label="类型">
<template v-slot="scope">
<el-tag type="info">{{ scope.row.tagName }}</el-tag>
</template>
</el-table-column>
<el-table-column label="剩余库存">
<template v-slot="scope">
{{ scope.row.leftNumber - scope.row.stockNumber }} {{ scope.row.unitName }}
</template>
</el-table-column>
<el-table-column label="操作时间" prop="updatedAt">
<template v-slot="scope">
{{ dayjs(scope.row.updatedAt).format('YYYY-MM-DD HH:mm:ss') }}
</template>
</el-table-column>
</el-table>
</div>
<el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
@current-change="paginationChange" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
</el-dialog>
</template>
<script>
import dayjs from 'dayjs'
import { dictDetail, tbProductStockDetail, tbProductStockDetailSum } from '@/api/invoicing'
export default {
data() {
return {
dayjs,
dialogVisible: false,
typeList: [],
query: {
type: '',
createdAt: []
},
goods: '',
tableData: {
page: 0,
size: 10,
total: 0,
sort: 'id',
loading: false,
list: []
},
exchange: 0
}
},
methods: {
async getTableData() {
this.tableData.loading = true
try {
const res = await tbProductStockDetail({
page: this.tableData.page,
size: this.tableData.size,
sort: this.tableData.sort,
shopId: localStorage.getItem('shopId'),
productId: this.goods.id,
type: this.query.type,
createdAt: this.query.createdAt
})
this.tableData.loading = false
this.tableData.list = res.content.map(item => {
item.tagName = this.typeList.find(val => val.value == item.type).label
return item
})
console.log(this.tableData.list)
this.tableData.total = res.totalElements
} catch (error) {
console.log(error);
}
},
// 分页回调
paginationChange(e) {
this.tableData.page = e - 1
this.getTableData()
},
// 重置查询
resetHandle() {
this.query.blurry = ''
this.tableData.page = 0
this.tableData.list = []
this.getTableData()
},
async show(obj) {
this.dialogVisible = true
this.goods = obj
this.tbProductStockDetailSum()
await this.dictDetail()
await this.getTableData()
},
async tbProductStockDetailSum() {
try {
const { exchange } = await tbProductStockDetailSum({
productId: this.goods.id
})
this.exchange = exchange
} catch (error) {
console.log(error);
}
},
async dictDetail() {
try {
const res = await dictDetail({
dictName: 'product_stock_type',
page: 0,
size: 100
})
this.typeList = res.content
} catch (error) {
console.log(error)
}
}
}
}
</script>
<style scoped lang="scss">
.head-container {
display: flex;
align-items: center;
gap: 10px;
}
.num {
color: #67C23A;
&.active {
color: #F56C6C;
}
}
.exchange_wrap {
display: flex;
padding: 20px 30px;
.item {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
span:nth-child(1) {
padding-bottom: 10px;
font-size: 24px;
}
}
}
</style>

150
src/views/invoicing/goods_stoks.vue Normal file
View File

@ -0,0 +1,150 @@
<template>
<div class="app-container">
<div class="head-container">
<el-row :gutter="20">
<el-col :span="6">
<el-input v-model="query.name" size="small" clearable placeholder="商品名称" style="width: 100%;"
class="filter-item" @keyup.enter.native="getTableData" />
</el-col>
<el-col :span="6">
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</el-col>
</el-row>
</div>
<div class="head-container">
<el-table :data="tableData.list" v-loading="tableData.loading">
<el-table-column label="商品信息">
<template v-slot="scope">
<div class="shop_info">
<el-image :src="scope.row.coverImg" class="cover">
<div class="img_error" slot="error">
<i class="icon el-icon-document-delete"></i>
</div>
</el-image>
<div class="info">
<span>{{ scope.row.name }}</span>
<div>
<el-tag type="primary">{{ scope.row.typeEnum | typeEnum }}</el-tag>
</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="库存" prop="stockNumber">
<template v-slot="scope">
{{ `${scope.row.stockNumber} ${scope.row.unitName}` }}
</template>
</el-table-column>
<el-table-column label="库存开关">
<template v-slot="scope">
<el-switch v-model="scope.row.isStock" :active-value="1" :inactive-value="0"></el-switch>
</template>
</el-table-column>
<el-table-column label="操作" width="100">
<template v-slot="scope">
<el-button type="text" size="mini" @click="$refs.invoicingDetail.show(scope.row)">库存记录</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="head-container">
<el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
@current-change="paginationChange" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
</div>
<invoicingDetail ref="invoicingDetail" />
</div>
</template>
<script>
import { tbProductGet } from '@/api/invoicing'
import settings from '@/settings'
import invoicingDetail from './components/invoicingDetail'
export default {
components: {
invoicingDetail
},
data() {
return {
query: {
name: ''
},
tableData: {
page: 0,
size: 10,
total: 0,
sort: 'id',
loading: false,
list: []
}
}
},
filters: {
typeEnum(m) {
return settings.typeEnum.find(item => item.typeEnum == m).label
}
},
mounted() {
this.getTableData()
},
methods: {
async getTableData() {
this.tableData.loading = true
try {
const res = await tbProductGet({
page: this.tableData.page,
size: this.tableData.size,
sort: this.tableData.sort,
name: this.query.name,
shopId: localStorage.getItem('shopId')
})
this.tableData.loading = false
this.tableData.list = res.content.map(item => {
let stockNumber = 0
for (let i of item.skuList) {
stockNumber += i.stockNumber
}
item.stockNumber = stockNumber
return item
})
this.tableData.total = res.totalElements
} catch (error) {
console.log(error);
}
},
// 分页回调
paginationChange(e) {
this.tableData.page = e - 1
this.getTableData()
},
// 重置查询
resetHandle() {
this.query.blurry = ''
this.tableData.page = 0;
this.getTableData()
}
}
}
</script>
<style scoped lang="scss">
.shop_info {
display: flex;
align-items: center;
.cover {
$size: 50px;
width: $size;
height: $size;
border-radius: 2px;
background-color: #efefef;
}
.info {
display: flex;
flex-direction: column;
padding-left: 10px;
justify-content: space-between;
}
}
</style>

110
src/views/invoicing/supplier_manage/supplier_list.vue Normal file
View File

@ -0,0 +1,110 @@
<template>
<div class="app-container">
<div class="head-container">
<div class="filter_wrap">
<el-input v-model="query.name" size="small" clearable placeholder="供应商" @keyup.enter.native="getTableData"
style="width: 200px;" />
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</div>
</div>
<div class="head-container">
<el-button type="primary" icon="el-icon-plus" @click="$refs.addSupplier.show()">添加供应商</el-button>
</div>
<div class="head-container">
<el-table :data="tableData.list" v-loading="tableData.loading">
<el-table-column label="供应商" prop="purveyorName"></el-table-column>
<el-table-column label="联系电话" prop="purveyorTelephone"></el-table-column>
<el-table-column label="地址" prop="address"></el-table-column>
<el-table-column label="标签" prop="tip"></el-table-column>
<el-table-column label="备注" prop="remark"></el-table-column>
<el-table-column label="操作" width="200">
<template v-slot="scope">
<el-button type="text" size="mini" round icon="el-icon-edit"
@click="$refs.addSupplier.show(scope.row)">编辑</el-button>
<el-popconfirm title="确定删除吗？" @confirm="delHandle([scope.row.id])">
<el-button type="text" size="mini" round icon="el-icon-delete" slot="reference">
删除
</el-button>
</el-popconfirm>
</template>
</el-table-column>
</el-table>
</div>
<el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
@current-change="paginationChange" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
<addSupplier ref="addSupplier" @success="getTableData" />
</div>
</template>
<script>
import { tbShopPurveyorGet, tbShopPurveyor } from '@/api/invoicing'
import addSupplier from '../components/addSupplier'
export default {
components: {
addSupplier
},
data() {
return {
query: {
name: ''
},
tableData: {
page: 0,
size: 10,
total: 0,
sort: 'id',
loading: false,
list: []
}
}
},
mounted() {
this.getTableData()
},
methods: {
// 删除
async delHandle(ids) {
try {
await tbShopPurveyor(ids, 'delete')
this.$notify({
title: '成功',
message: `删除成功`,
type: 'success'
});
this.getTableData()
} catch (error) {
console.log(error)
}
},
async getTableData() {
this.tableData.loading = true
try {
const res = await tbShopPurveyorGet({
page: this.tableData.page,
size: this.tableData.size,
sort: this.tableData.sort,
purveyorName: this.query.name,
shopId: localStorage.getItem('shopId')
})
this.tableData.loading = false
this.tableData.list = res.content
this.tableData.total = res.totalElements
} catch (error) {
console.log(error);
}
},
// 重置查询
resetHandle() {
this.query.name = ''
this.tableData.page = 0;
this.getTableData()
},
// 分页回调
paginationChange(e) {
this.tableData.page = e - 1
this.getTableData()
}
}
}
</script>

14
src/views/product/index.vue
View File

@ -159,20 +159,6 @@ export default {
}
</script>
<style>
.img_error {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
.icon {
font-size: 20px;
color: #999;
}
}
</style>
<style scoped lang="scss">
.shop_info {
display: flex;

2
src/views/product/specification.vue
View File

@ -81,7 +81,7 @@ export default {
},
// 分页回调
paginationChange(e) {
this.tableData.page = e
this.tableData.page = e - 1
this.getTableData()
},
// 删除