源文件
This commit is contained in:
93
src/views/invoicing/components/addSupplier.vue
Normal file
93
src/views/invoicing/components/addSupplier.vue
Normal 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
178
src/views/invoicing/components/invoicingDetail.vue
Normal 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>
|
||||
66
src/views/invoicing/components/operatingDetail.vue
Normal file
66
src/views/invoicing/components/operatingDetail.vue
Normal file
@@ -0,0 +1,66 @@
|
||||
<template>
|
||||
<el-dialog title="详情" width="80%" :visible.sync="dialogVisible" @close="dialogVisible = false">
|
||||
<div class="head-container">
|
||||
<span>【{{ tableData.detail.type == 'reject' ? '退货出库' : '供应商入库' }}】</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>
|
||||
Reference in New Issue
Block a user