新增退货进账模块

This commit is contained in:
gyq 2024-01-29 14:03:25 +08:00
parent 122b979045
commit 640e3bb941
7 changed files with 720 additions and 2 deletions

View File

@ -72,4 +72,63 @@ export function tbShopPurveyor(data, method = 'post') {
})
}
/**
* 进货/退货账目
* @returns
*/
export function tbShopPurveyorTransactGet(params) {
return request({
url: `/api/tbShopPurveyorTransact`,
method: 'get',
params
})
}
/**
* 进货账目详情
* @returns
*/
export function tbShopPurveyorTransactInfo(data) {
return request({
url: `/api/tbShopPurveyorTransact/info`,
method: 'post',
data
})
}
/**
* 进货账目汇总单一供应商
* @returns
*/
export function tbShopPurveyorTransactSum(params) {
return request({
url: `/api/tbShopPurveyorTransact/sum`,
method: 'get',
params
})
}
/**
* 操作记录
* @returns
*/
export function tbProductStockOperateList(data) {
return request({
url: `/api/tbProductStockOperate/list`,
method: 'post',
data
})
}
/**
* 操作记录详情
* @returns
*/
export function tbProductStockOperateDetail(id) {
return request({
url: `/api/tbProductStockOperate/${id}`,
method: 'get'
})
}

View File

@ -1,5 +1,5 @@
.head-container {
padding-bottom: 10px;
padding-bottom: 20px;
.filter-item {
display: inline-block;
vertical-align: middle;

View File

@ -6,7 +6,7 @@ const state = {
withoutAnimation: false
},
device: 'desktop',
size: Cookies.get('size') || 'small'
size: Cookies.get('size') || 'Default'
}
const mutations = {

View File

@ -0,0 +1,66 @@
<template>
<el-dialog title="详情" width="80%" :visible.sync="dialogVisible" @close="dialogVisible = false">
<div class="head-container">
<span>退货出库</span>
</div>
<div class="head-container">
<el-table :data="tableData.detail.stockSnap" v-loading="tableData.loading" height="400px">
<el-table-column :label="`商品名称${tableData.detail.stockSnap.length}`" prop="name"></el-table-column>
<el-table-column label="变动数量" prop="number">
<template v-slot="scope">
{{ scope.row.number }}{{ scope.row.unitName }}
</template>
</el-table-column>
</el-table>
</div>
<div class="head-container">
<div class="row">备注{{ tableData.detail.remark }}</div>
<div class="row">操作人{{ tableData.detail.operatorSnap.name }}</div>
<div class="row">创建时间{{ tableData.detail.createdAt }}</div>
</div>
</el-dialog>
</template>
<script>
import dayjs from 'dayjs'
import { tbProductStockOperateDetail } from '@/api/invoicing'
export default {
data() {
return {
dayjs,
dialogVisible: false,
tableData: {
loading: false,
detail: {
stockSnap: [],
operatorSnap: {
name: ''
}
}
}
}
},
methods: {
show(id) {
this.dialogVisible = true
this.getTableData(id)
},
async getTableData(id) {
this.tableData.loading = true
try {
const res = await tbProductStockOperateDetail(id)
this.tableData.loading = false
this.tableData.detail = res
} catch (error) {
console.log(error);
}
}
}
}
</script>
<style scoped lang="scss">
.row {
padding-bottom: 10px;
}
</style>

View File

@ -0,0 +1,107 @@
<template>
<div class="app-container">
<div class="head-container">
<div class="filter_wrap">
<el-date-picker v-model="query.createdAt" type="daterange" range-separator="" start-placeholder="开始日期"
end-placeholder="结束日期" value-format="yyyy-MM-dd HH:mm:ss" @change="getTableData">
</el-date-picker>
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</div>
</div>
<div class="head-container">
<el-table :data="tableData.list" v-loading="tableData.loading">
<el-table-column label="类型" prop="type">
<template v-slot="scope">
{{ scope.row.type == 'reject' ? '退货出库' : '供应商入库' }}
</template>
</el-table-column>
<el-table-column label="商品数量" prop="totalAmount">
<template v-slot="scope">
{{ scope.row.stockSnap.length }}
</template>
</el-table-column>
<el-table-column label="备注" prop="remark"></el-table-column>
<el-table-column label="操作人" prop="status">
<template v-slot="scope">
{{ scope.row.operatorSnap.name }}
</template>
</el-table-column>
<el-table-column label="创建时间" prop="updatedAt">
<template v-slot="scope">
{{ dayjs(scope.row.stockTime).format('YYYY-MM-DD HH:mm:ss') }}
</template>
</el-table-column>
<el-table-column label="操作" width="80">
<template v-slot="scope">
<el-button type="text" size="mini" @click="$refs.operatingDetail.show(scope.row.id)">
查看详情
</el-button>
</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>
<operatingDetail ref="operatingDetail" />
</div>
</template>
<script>
import dayjs from 'dayjs'
import { tbProductStockOperateList } from '@/api/invoicing'
import operatingDetail from './components/operatingDetail'
export default {
components: {
operatingDetail
},
data() {
return {
dayjs,
query: {
createdAt: []
},
tableData: {
page: 0,
size: 10,
total: 0,
sort: 'id',
loading: false,
list: []
}
}
},
mounted() {
this.getTableData()
},
methods: {
async getTableData() {
this.tableData.loading = true
try {
const res = await tbProductStockOperateList({
page: this.tableData.page,
size: this.tableData.size,
shopId: localStorage.getItem('shopId'),
createdAt: this.query.createdAt
})
this.tableData.loading = false
this.tableData.list = res.content
this.tableData.total = res.totalElements
} catch (error) {
console.log(error);
}
},
//
resetHandle() {
this.query.createdAt = []
this.tableData.page = 0;
this.getTableData()
},
//
paginationChange(e) {
this.tableData.page = e - 1
this.getTableData()
}
}
}
</script>

View File

@ -0,0 +1,136 @@
<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-select v-model="query.type" placeholder="付款状态">
<el-option :label="item.label" :value="item.value" v-for="item in types" :key="item.id"></el-option>
</el-select>
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</div>
</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="waitAmount">
<template v-slot="scope">
<span class="num" v-if="scope.row.waitAmount > 0">{{ scope.row.waitAmount }}</span>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column label="待付款笔数" prop="waitCount">
<template v-slot="scope">
<template v-if="scope.row.waitCount > 0">
<span class="count">{{ scope.row.waitCount }}</span>未付
</template>
<template v-else>-</template>
</template>
</el-table-column>
<el-table-column label="状态" prop="type">
<template v-slot="scope">
<el-tag :type="scope.row.type == 0 ? 'warning' : 'success'">
{{ scope.row.type == 0 ? '待支付' : '已完结' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="上笔进货日期" prop="lastTransactAt">
<template v-slot="scope">
{{ dayjs(scope.row.lastTransactAt).format('YYYY-MM-DD HH:mm:ss') }}
</template>
</el-table-column>
<el-table-column label="操作" width="80">
<template v-slot="scope">
<router-link :to="{ name: 'purchase_detail', query: { purveyorId: scope.row.purveyorId } }">
<el-button type="text" size="mini">查看详情</el-button>
</router-link>
</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>
</div>
</template>
<script>
import dayjs from 'dayjs'
import { tbShopPurveyorTransactGet, dictDetail } from '@/api/invoicing'
export default {
data() {
return {
dayjs,
types: [],
query: {
name: '',
type: ''
},
tableData: {
page: 0,
size: 10,
total: 0,
sort: 'id',
loading: false,
list: []
}
}
},
mounted() {
this.dictDetail()
this.getTableData()
},
methods: {
async getTableData() {
this.tableData.loading = true
try {
const res = await tbShopPurveyorTransactGet({
page: this.tableData.page,
size: this.tableData.size,
sort: this.tableData.sort,
purveyorName: this.query.name,
status: this.query.type,
type: 'purveyor',
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.query.type = ''
this.tableData.page = 0;
this.getTableData()
},
//
paginationChange(e) {
this.tableData.page = e - 1
this.getTableData()
},
async dictDetail() {
const { content } = await dictDetail({
dictName: 'purveyor_transact_status',
size: 100,
page: 0
})
this.types = content
}
}
}
</script>
<style scoped lang="scss">
.num {
color: #F56C6C;
font-weight: bold;
}
.count {
color: #409EFF;
}
</style>

View File

@ -0,0 +1,350 @@
<template>
<div class="app-container">
<div class="head-container">
<el-radio-group v-model="query.time" @change="timeChange">
<el-radio-button :label="item.value" v-for="item in timeList" :key="item.label">{{ item.label
}}</el-radio-button>
</el-radio-group>
</div>
<div class="head-container" v-if="query.time == 'custom'">
<el-date-picker v-model="query.createdAt" type="daterange" range-separator="" start-placeholder="开始日期"
end-placeholder="结束日期" value-format="yyyy-MM-dd HH:mm:ss" @change="getTableData">
</el-date-picker>
</div>
<div class="head-container">
<div class="filter_wrap">
<el-select v-model="query.type" placeholder="付款状态">
<el-option :label="item.label" :value="item.value" v-for="item in types" :key="item.id"></el-option>
</el-select>
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</div>
</div>
<div class="head-container">
<div class="info_list">
<div class="item">
<div class="icon_wrap" style="background-color: #F2D7FF;">
<i class="icon el-icon-info" style="color:#C978EE;"></i>
</div>
<div class="info">
<div class="n">{{ info.totalAmount }}</div>
<div class="intro">总交易{{ info.waitCount }}</div>
</div>
</div>
<div class="item">
<div class="icon_wrap" style="background-color: #DFFECC;">
<i class="icon el-icon-success" style="color:#47B505;"></i>
</div>
<div class="info">
<div class="n">{{ info.paidAmount }}</div>
<div class="intro">已支付金额</div>
</div>
</div>
<div class="item">
<div class="icon_wrap" style="background-color: #FFE7D6;">
<i class="icon el-icon-circle-plus" style="color: #FF6B00;"></i>
</div>
<div class="info">
<div class="n">{{ info.waitAmount }}</div>
<div class="intro">待支付金额</div>
</div>
</div>
<div class="item">
<div class="icon_wrap" style="background-color: #FFF1D5;">
<i class="icon el-icon-warning" style="color: #FEB420;"></i>
</div>
<div class="info">
<div class="n">{{ info.waitNumber }}</div>
<div class="intro">待支付笔数</div>
</div>
</div>
</div>
</div>
<div class="head-container">
<div class="select_count_wrap">
<div class="select_count">
<i class="icon el-icon-warning"></i>
已选中
<span class="n">{{ selectCount }}</span>
</div>
<el-button>批量付款</el-button>
</div>
</div>
<div class="head-container">
<el-table :data="tableData.list" v-loading="tableData.loading" @select="selectHandle"
@select-all="selectHandle">
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column label="创建日期" prop="createdAt">
<template v-slot="scope">
{{ dayjs(scope.row.createdAt).format('YYYY-MM-DD HH:mm:ss') }}
</template>
</el-table-column>
<el-table-column label="类型" prop="type">
<template v-slot="scope">
进货单
</template>
</el-table-column>
<el-table-column label="总金额" prop="totalAmount">
<template v-slot="scope">
{{ scope.row.totalAmount }}
</template>
</el-table-column>
<el-table-column label="待付款金额" prop="waitAmount">
<template v-slot="scope">
<span class="num" v-if="scope.row.waitAmount > 0">{{ scope.row.waitAmount }}</span>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column label="状态" prop="status">
<template v-slot="scope">
<el-tag type="info">{{ types.find(item => item.value == scope.row.status).label }}</el-tag>
</template>
</el-table-column>
<el-table-column label="备注" prop="remark"></el-table-column>
<el-table-column label="付款时间" prop="updatedAt">
<template v-slot="scope">
{{ dayjs(scope.row.paidAt).format('YYYY-MM-DD HH:mm:ss') }}
</template>
</el-table-column>
<el-table-column label="操作" width="80">
<template v-slot="scope">
<router-link :to="{ name: 'purchase_detail', query: { purveyorId: scope.row.purveyorId } }">
<el-button type="text" size="mini">查看详情</el-button>
</router-link>
</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>
</div>
</template>
<script>
import dayjs from 'dayjs'
import { tbShopPurveyorTransactInfo, dictDetail, tbShopPurveyorTransactSum } from '@/api/invoicing'
export default {
data() {
return {
dayjs,
timeList: [
{
label: '全部',
value: 'all'
},
{
label: '今天',
value: '0'
},
{
label: '昨天',
value: '-1'
},
{
label: '最近7天',
value: '-7'
},
{
label: '最近30天',
value: '-30'
},
{
label: '本周',
value: 'week'
},
{
label: '本月',
value: 'moth'
},
{
label: '自定义',
value: 'custom'
}
],
types: [],
selectCount: 0,
query: {
type: '',
time: 'all',
createdAt: []
},
tableData: {
page: 0,
size: 10,
total: 0,
sort: 'id',
loading: false,
list: []
},
info: ''
}
},
mounted() {
this.dictDetail()
this.getTableData()
this.tbShopPurveyorTransactSum()
},
methods: {
async getTableData() {
this.tableData.loading = true
try {
const res = await tbShopPurveyorTransactInfo({
page: this.tableData.page,
size: this.tableData.size,
sort: this.tableData.sort,
purveyorId: this.$route.query.purveyorId,
status: this.query.type,
type: 'purveyor',
createdAt: this.query.createdAt
})
this.tableData.loading = false
this.tableData.list = res.content
this.tableData.total = res.totalElements
} catch (error) {
console.log(error);
}
},
//
resetHandle() {
this.query.time = 'all'
this.query.createdAt = []
this.tableData.page = 0;
this.getTableData()
},
//
paginationChange(e) {
this.tableData.page = e - 1
this.getTableData()
},
async dictDetail() {
const { content } = await dictDetail({
dictName: 'purveyor_transact_status',
size: 100,
page: 0
})
this.types = content
},
//
timeChange(e) {
this.query.createdAt = []
const format0 = 'YYYY-MM-DD 00:00:00'
const format1 = 'YYYY-MM-DD 23:59:59'
switch (e) {
case '0':
this.query.createdAt = [dayjs().format(format0), dayjs().format(format1)]
break;
case '-1':
this.query.createdAt = [dayjs().add(-1, 'day').format(format0), dayjs().add(-1, 'day').format(format1)]
break;
case '-7':
this.query.createdAt = [dayjs().add(-7, 'day').format(format0), dayjs().format(format1)]
break;
case '-30':
this.query.createdAt = [dayjs().add(-30, 'day').format(format0), dayjs().format(format1)]
break;
case 'week':
this.query.createdAt = [dayjs().startOf('week').format(format0), dayjs().endOf('week').format(format1)]
break;
case 'moth':
this.query.createdAt = [dayjs().startOf('month').format(format0), dayjs().endOf('month').format(format1)]
break;
default:
break;
}
this.getTableData()
},
selectHandle(selection, row) {
this.selectCount = 0
this.selectCount = selection.length
},
async tbShopPurveyorTransactSum() {
this.info = await tbShopPurveyorTransactSum({ purveyorId: this.$route.query.purveyorId, type: 'purveyor' })
}
}
}
</script>
<style scoped lang="scss">
.select_count_wrap {
display: flex;
align-items: center;
.select_count {
display: flex;
align-items: center;
justify-content: center;
background-color: #e7f3ff;
width: 120px;
height: 40px;
font-size: 14px;
margin-right: 10px;
border-radius: 4px;
.icon {
margin-right: 4px;
}
.n {
margin: 0 4px;
}
.icon,
.n {
color: #409EFF;
}
}
}
.num {
color: #F56C6C;
font-weight: bold;
}
.count {
color: #409EFF;
}
.info_list {
display: flex;
gap: 20px;
.item {
flex: 1;
background-color: #fff;
padding: 20px;
display: flex;
align-items: center;
background-color: #f5f5f5;
.icon_wrap {
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
padding: 2px;
.icon {
font-size: 40px;
}
}
.info {
flex: 1;
display: flex;
flex-direction: column;
padding-left: 20px;
.n {
font-size: 28px;
text-indent: -6px;
}
.intro {
font-size: 12px;
color: #999;
}
}
}
}
</style>