This commit is contained in:
2024-07-08 16:21:32 +08:00
35 changed files with 3601 additions and 121 deletions

View File

@@ -5,7 +5,12 @@
<div class="row">
<el-input v-model="query.name" size="small" clearable placeholder="商品名称"
@keyup.enter.native="getTableData" />
<el-input v-model="query.num" placeholder="库存数量少于多少xx" />
<!-- <el-input v-model="query.num" placeholder="库存数量少于多少xx" /> -->
<div style="width: 300px;">
<el-select v-model="query.categoryId" placeholder="商品分类" style="width: 100%;">
<el-option :label="item.name" :value="item.id" v-for="item in categorys" :key="item.id" />
</el-select>
</div>
<div style="width: 300px;">
<el-select v-model="query.isStock" placeholder="库存开关" style="width: 100%;">
<el-option label="开" :value="1"></el-option>
@@ -14,6 +19,7 @@
</div>
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
<el-button @click="Uppop()">库存预警:{{ warnLine }}</el-button>
</div>
<div class="row">
<el-button icon="el-icon-download" :loading="downloadLoading" @click="protHandle">导出库存</el-button>
@@ -23,18 +29,25 @@
</div>
</div>
<div class="head-container">
<el-table :data="tableData.list" v-loading="tableData.loading">
<el-table-column label="商品信息">
<el-table :data="tableData.list" v-loading="tableData.loading" row-key="id" lazy :load="load"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table-column width="30">
<template v-slot="scope">
<i class="" v-if="scope.row.hasChildren == false"></i>
<!-- <div v-if="scope.row.iskaiguans == 1" style="padding-left: 20px;"></div> -->
</template>
</el-table-column>
<el-table-column label="商品信息" width="200px">
<template v-slot="scope">
<div class="shop_info">
<el-image :src="scope.row.img" class="cover">
<el-image :src="scope.row.img" class="cover" v-if="scope.row.iskaiguans != 1">
<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>
<div v-if="scope.row.iskaiguans != 1">
<el-tag type="primary">{{ scope.row.type }}</el-tag>
</div>
</div>
@@ -43,62 +56,106 @@
</el-table-column>
<el-table-column label="规格" prop="number">
<template v-slot="scope">
{{scope.row.specSnap }}
<div v-if="scope.row.iskaiguans">
{{ scope.row.specSnap }}
</div>
</template>
</el-table-column>
<el-table-column label="库存" prop="number">
<template v-slot="scope">
{{ `${scope.row.number} ${scope.row.unitName}` }}
<span :class="[scope.row.stockNumber <= warnLine ? 'colorStyle' : '']">
{{ `${scope.row.stockNumber} ${scope.row.unitName}` }}
</span>
</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"
v-if="scope.row.hasChildren || scope.row.hasChildren == false"
@change="showChange($event, scope.row)"></el-switch>
</template>
</el-table-column>
<el-table-column label="操作" width="100">
<el-table-column label="共享库存">
<template v-slot="scope">
<el-switch v-model="scope.row.isDistribute" :active-value="1" :inactive-value="0"
v-if="scope.row.hasChildren || scope.row.hasChildren == false"
@change="showChanges($event, scope.row, 'proId', 'distribute')"></el-switch>
</template>
</el-table-column> <el-table-column label="售罄">
<template v-slot="scope">
<el-switch v-model="scope.row.isPauseSale" :active-value="1" :inactive-value="0"
@change="showChangess($event, scope.row)"></el-switch>
</template>
</el-table-column>
<el-table-column label="操作" width="240px">
<template v-slot="scope">
<el-button type="text" size="mini"
@click="$refs.invoicingDetail.show(scope.row)">库存记录</el-button>
<template v-if="!scope.row.hasChildren">
<el-button type="text" size="mini" style="margin-left: 10px !important;"
@click="$refs.AddStockTakin.show(scope.row)">库存盘点</el-button>
</template>
</template>
</el-table-column>
</el-table>
</div>
<div class="head-container">
<el-pagination @size-change="paginationSizeChange" :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-pagination @size-change="paginationSizeChange" :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" />
<!-- 导入库存弹窗 -->
<el-dialog title="导入库存" :visible.sync="dialogVisible">
<UploadExcel :beforeUpload="excelSuccessUpload" />
</el-dialog>
<!-- 预存弹窗组件 -->
<el-dialog title="" :visible.sync="dialogTableVisible" width="350px">
<el-form>
<el-form-item label="库存预存设置" label-width="120px">
<el-input v-model="montey" type="number" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogTableVisible = false; montey = ''"> </el-button>
<el-button type="primary" @click="sumbit()"> </el-button>
</div>
</el-dialog>
<!-- 新增库存盘点 -->
<AddStockTakin ref="AddStockTakin" @success="resetHandle" />
</div>
</template>
<script>
import { stock, stockdownload, stockdoImport, stockStateChange } from '@/api/invoicing'
import { stock, stockdownload, stockdoImport, stockStatewarnLine, stockStateChanges, stocks } from '@/api/invoicing'
import { tbShopCategoryGet } from '@/api/shop'
import settings from '@/settings'
import invoicingDetail from './components/invoicingDetail'
import AddStockTakin from './components/addStockTakin'
import UploadExcel from '@/components/UploadExcel/'
import { downloadFile } from "@/utils/index";
export default {
components: {
invoicingDetail,
UploadExcel
UploadExcel,
AddStockTakin
},
data() {
return {
dialogVisible: false,
dialogTableVisible: false,
montey: "",
categorys: [],
query: {
name: '',
isStock: '',
num: ''
num: '',
categoryId: ''
},
downloadLoading: false,
uploadLoading: false,
warnLine: null, // 警戒线
tableData: {
page: 0,
size: 10,
@@ -110,9 +167,40 @@ export default {
}
},
mounted() {
this.tbShopCategoryGet()
this.getTableData()
},
methods: {
Uppop() {
this.dialogTableVisible = true
},
async sumbit() {
try {
const res = await stockStatewarnLine({
shopId: localStorage.getItem("shopId"),
warnLine: this.montey
})
this.$message({ type: 'success', message: '修改成功!' });
setTimeout(() => {
this.dialogTableVisible = false
this.montey = ''
this.getTableData()
}, 500);
} catch (error) {
console.log(error);
}
},
async load(tree, treeNode, resolve) {
const res = await stocks({
productId: tree.proId,
})
res.forEach(ele => ele.iskaiguans = 1)
setTimeout(() => {
resolve(res)
}, 50);
},
async excelSuccessUpload(file) {
console.log(file);
try {
@@ -121,6 +209,7 @@ export default {
const res = await stockdoImport(file)
this.uploadLoading = false
this.$notify.success('导入成功')
this.tableData.list = []
this.getTableData()
} catch (error) {
this.dialogVisible = false
@@ -146,15 +235,48 @@ export default {
},
// 状态切换
async showChange(e, row) {
try {
await stockStateChange({
proId: row.proId,
isStock: row.isStock
await stockStateChanges({
"updateKey": 'stock',
"updateValue": row.isStock,
"targetId": row.proId,
shopId: localStorage.getItem('shopId')
})
},
// 共享库存
async showChanges(e, row, name, value) {
await stockStateChanges({
"updateKey": value,
"updateValue": row.isDistribute,
"targetId": row[name],
shopId: localStorage.getItem('shopId')
})
this.tableData.list = []
this.getTableData()
},
// 售罄
async showChangess(e, row) {
if (row.hasChildren || row.hasChildren == false) {
await stockStateChanges({
"updateKey": 'pauseSale',
"updateValue": row.isPauseSale,
"targetId": row.proId,
shopId: localStorage.getItem('shopId')
})
} else {
await stockStateChanges({
"updateKey": 'pauseSaleSku',
"updateValue": row.isPauseSale,
"targetId": row.skuId,
shopId: localStorage.getItem('shopId')
})
this.getTableData()
} catch (error) {
console.error(error);
}
},
async getTableData() {
this.tableData.loading = true
@@ -165,24 +287,67 @@ export default {
name: this.query.name,
isStock: this.query.isStock,
num: this.query.num,
categoryId: this.query.categoryId,
shopId: localStorage.getItem('shopId')
})
this.tableData.loading = false
this.tableData.list = res.content
this.tableData.total = res.totalElements
// 多规格数据处理
res.content.forEach(element => {
if (element.type == '多规格' && element.isDistribute == 0) {
element.hasChildren = true
} else {
element.hasChildren = false
}
});
this.warnLine = res.warnLine
this.tableData.list = res.content
console.log(this.tableData.list);
} catch (error) {
console.log(error);
}
},
// 获取商品分类列表
async tbShopCategoryGet() {
try {
const res = await tbShopCategoryGet({
shopId: localStorage.getItem('shopId'),
page: 0,
size: 100,
sort: 'id'
})
let categorys = []
for (let item of res.content) {
categorys.push({
name: `|----${item.name}`,
id: item.id
})
if (item.childrenList.length) {
for (let val of item.childrenList) {
categorys.push({
name: `|----|----${val.name}`,
id: val.id
})
}
}
}
this.categorys = categorys
} catch (error) {
console.log(error)
}
},
// 每页条数改变是回调
paginationSizeChange(e){
paginationSizeChange(e) {
console.log(e);
this.tableData.size = e
this.tableData.page = 0
this.getTableData()
},
// 分页回调
paginationChange(e) {
console.log(e)
this.tableData.page = e - 1
this.tableData.list = []
this.getTableData()
},
// 重置查询
@@ -191,6 +356,7 @@ export default {
this.query.num = ''
this.query.isStock = ''
this.tableData.page = 0;
this.tableData.list = []
this.getTableData()
}
}
@@ -228,4 +394,16 @@ export default {
gap: 10px;
}
}
.colorStyle {
color: rgb(231, 42, 42);
font-weight: 700;
}
</style>
<style>
.cell {
display: flex;
align-items: center;
/* flex-direction: row-reverse; */
}
</style>