<template>
|
<div class="rightContent">
|
<div class="top">
|
<SearchCommonView :add-title="addTitle" :show-discard="showDiscard" :show-apply="false" :placeholder="'请输入位置/产品'"
|
:amount-view="false" @addCommonClick="addProductClick" @searchClick="getList"
|
@discardBtnClick="discardBtnClick" />
|
</div>
|
<div class="content_wrap">
|
<div class="con_left">
|
<p>位置</p>
|
<div class="stash">
|
<template>
|
<el-tree :data="datas" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
|
</template>
|
</div>
|
</div>
|
<div class="list-view">
|
<div class="table">
|
<CommonFormTableView ref="tablelistRef" :isReorder="true" :product-table-list="tableList"
|
@inputContent="inputContent" @selLocationClick="selLocationClick" @selProductClick="selProductClick"
|
@tableRowClick="tableRowClick" @selRouteClick="selRouteClick">
|
<template slot="tableButton">
|
<el-table-column label="操作" width="180" align="center">
|
<template slot-scope="scope">
|
<span v-if="scope.row.isEdit && scope.row.isView" @click.stop="handleOrderOnceClick(scope.row)"
|
class="yes-cursor">
|
<i class="el-icon-truck"></i>
|
<span>订购一次</span>
|
</span>
|
</template>
|
</el-table-column>
|
</template>
|
</CommonFormTableView>
|
</div>
|
<div class="btn-pager">
|
<PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import CommonFormTableView from "@/components/makepager/CommonFormTableView"
|
import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
|
import { getReorderRuleList, addReorderRule, updateReorderRule, orderAgain,getLocationList } from "@/api/product/reorderRules"
|
import { currentTime } from "@/common/config/index"
|
export default {
|
name: "ReorderRules",
|
props: {},
|
components: { CommonFormTableView },
|
mixins: [pageMixin],
|
computed: {},
|
data() {
|
return {
|
datas:[],
|
// datas: [{
|
// label: '一级 1',
|
// children: [{
|
// label: '二级 1-1',
|
// children: [{
|
// label: '三级 1-1-1'
|
// }]
|
// }]
|
// }, {
|
// label: '一级 2',
|
// children: [{
|
// label: '二级 2-1',
|
// children: [{
|
// label: '三级 2-1-1'
|
// }]
|
// }, {
|
// label: '二级 2-2',
|
// children: [{
|
// label: '三级 2-2-1'
|
// }]
|
// }]
|
// }, {
|
// label: '一级 3',
|
// children: [{
|
// label: '二级 3-1',
|
// children: [{
|
// label: '三级 3-1-1'
|
// }]
|
// }, {
|
// label: '二级 3-2',
|
// children: [{
|
// label: '三级 3-2-1'
|
// }]
|
// }]
|
// }],
|
defaultProps: {
|
children: 'children',
|
label: 'jointName'
|
},
|
addTitle: "新建",
|
showDiscard: false,
|
tableList: {},
|
tableData: [],
|
searchOptions: [],
|
countId: 0,
|
isNoProduct: true, // 添加明细行时是否有产品未选择
|
isRowClick: false,
|
locationId: 0,
|
productId: 0,
|
amount: 0,
|
operationId: 0,
|
minInventory: 0,
|
maxInventory: 0,
|
orderNumber: 0,
|
unit: "",
|
reorderId: 0
|
}
|
},
|
created() {
|
this.setTable()
|
this.getData()
|
this.getLocationList()
|
},
|
methods: {
|
setTable() {
|
this.tableList = {
|
tableData: this.tableData,
|
selectBox: false,
|
selectIndex: true,
|
tableColumn: [
|
{ label: "产品", prop: "productName", product: true },
|
{ label: "位置", prop: "locationName", defaultLocation: true },
|
{ label: "在库数量", prop: "amount" },
|
{ label: "预测数量", prop: "prediction" },
|
{ label: "首选路线", prop: "route", route: true },
|
{ label: "最小数量", prop: "minInventory", inputFloat: true },
|
{ label: "最大数量", prop: "maxInventory", inputFloat: true },
|
{ label: "订购数量", prop: "orderNumber", inputFloat: true },
|
{ label: "计量单位", prop: "unit" }
|
]
|
}
|
},
|
// 请求数据
|
async getData() {
|
await getReorderRuleList({
|
page: this.pagerOptions.currPage,
|
pageSize: this.pagerOptions.pageSize
|
}).then((res) => {
|
if (res.code === 200) {
|
console.log(res)
|
const list = res.data.map((item) => {
|
let orderNum = 0
|
if (parseFloat(item.minInventory) - parseFloat(item.prediction) > 0) {
|
orderNum = this.caculateOrderNumber(
|
parseFloat(item.minInventory),
|
parseFloat(item.maxInventory),
|
parseFloat(item.prediction)
|
)
|
}
|
return {
|
...item,
|
productName: item.product.name,
|
locationName: item.location.name,
|
isSet: false,
|
isEdit: true,
|
editable: true,
|
isOrder: true,
|
isView: item?.minInventory - item?.prediction > 0 ? true : false,
|
orderNumber: orderNum
|
}
|
})
|
this.tableList.tableData = list || []
|
this.tableData = list || []
|
this.pagerOptions.totalCount = res.total
|
}
|
})
|
},
|
// 技术订购数量
|
caculateOrderNumber(minInventory, maxInventory, prediction) {
|
return maxInventory > minInventory ? maxInventory - prediction : minInventory - prediction
|
},
|
// 操作输入
|
inputContent(val, prop, row) {
|
console.log(val, prop, row)
|
if (prop === "minInventory") {
|
this.minInventory = val
|
if (parseFloat(this.minInventory) - parseFloat(this.prediction) > 0) {
|
this.orderNumber = this.caculateOrderNumber(
|
parseFloat(this.minInventory),
|
parseFloat(this.maxInventory),
|
parseFloat(this.prediction)
|
)
|
}
|
} else if (prop === "maxInventory") {
|
this.maxInventory = val
|
if (parseFloat(this.minInventory) - parseFloat(this.prediction) > 0) {
|
this.orderNumber = this.caculateOrderNumber(
|
parseFloat(this.minInventory),
|
parseFloat(this.maxInventory),
|
parseFloat(this.prediction)
|
)
|
}
|
} else if (prop === "orderNumber") {
|
this.orderNumber = val
|
}
|
},
|
// 新增
|
addProductClick() {
|
console.log(this.addTitle)
|
this.isSel()
|
if (this.isNoProduct && this.addTitle === "新建") {
|
this.$refs.tablelistRef.getProductList()
|
this.$refs.tablelistRef.getLocationList()
|
this.addTitle = "保存"
|
this.showDiscard = true
|
this.isRowClick = false
|
this.operationId = 0
|
this.currentRowId = 0
|
this.countId++
|
this.tableData.unshift({
|
countId: this.countId,
|
amount: 0,
|
minInventory: 0,
|
productId: "",
|
maxInventory: 0,
|
orderNumber: 0,
|
prediction: 0,
|
locationId: 0,
|
createDate: this.currentTime(),
|
isSet: true,
|
isEdit: false,
|
editable: false,
|
isOrder: true
|
})
|
this.locationId = 0
|
this.productId = 0
|
} else {
|
this.addTitle = "新建"
|
this.showDiscard = false
|
let requestUrl = this.currentRowId === 0 ? addReorderRule : updateReorderRule
|
let params = this.saveParams()
|
requestUrl(params)
|
.then((res) => {
|
console.log(res)
|
if (res.code === 200) {
|
let tipStr = this.currentRowId === 0 ? "添加成功" : "修改成功"
|
this.$message.success(tipStr)
|
this.getData()
|
}
|
})
|
.catch((err) => {
|
console.log(err)
|
this.getData()
|
})
|
// }
|
}
|
},
|
saveParams() {
|
return {
|
id: this.reorderId,
|
amount: this.amount,
|
locationId: this.locationId,
|
maxInventory: this.maxInventory,
|
minInventory: this.minInventory,
|
orderNumber: this.orderNumber,
|
prediction: this.prediction,
|
operationId: this.operationId,
|
productId: this.productId,
|
route: this.route,
|
unit: this.unit
|
}
|
},
|
// 是否选择产品
|
isSel() {
|
for (let i = 0; i < this.tableData.length; i++) {
|
if (this.tableData[i].productName?.length === 0) {
|
this.isNoProduct = false
|
break
|
} else {
|
this.isNoProduct = true
|
}
|
}
|
},
|
// 取消
|
discardBtnClick() {
|
this.getData()
|
this.addTitle = "新建"
|
this.showDiscard = false
|
},
|
// 订购一次
|
handleOrderOnceClick(row) {
|
let params = {
|
...row
|
}
|
orderAgain(params).then((res) => {
|
if (res.code === 200) {
|
this.$message.success("订购成功")
|
this.getData()
|
}
|
})
|
},
|
// 行点击
|
tableRowClick(row, rowIndex) {
|
this.locationId = row.locationId
|
this.rowIndex = rowIndex
|
this.reorderId = row.id
|
this.isSel()
|
if (!this.isNoProduct && this.currentRowId === 0) {
|
this.$message.error("请完成当前新建或取消新建")
|
} else {
|
this.currentRowId = row.id
|
this.addTitle = "保存"
|
this.showDiscard = true
|
this.isRowClick = true
|
if (!this.isNoProduct) {
|
this.tableData.splice(this.tableData.length - 1, 1)
|
}
|
this.tableData.map((item, index) => {
|
if (index === rowIndex) {
|
item.isEdit = false
|
item.editable = true
|
item.isOrder = true
|
} else {
|
item.isEdit = true
|
}
|
})
|
this.minInventory = row.minInventory
|
this.amount = row.amount
|
this.productId = row.productId
|
this.maxInventory = row.maxInventory
|
this.orderNumber = row.orderNumber
|
this.prediction = row.prediction
|
this.locationId = row.locationId
|
}
|
},
|
// 搜索
|
getList(val) {
|
this.keyword = val
|
this.pagerOptions.currPage = 1
|
this.getData()
|
},
|
// 选中位置方法
|
selLocationClick(item, prop) {
|
console.log(item, prop)
|
this.locationId = item?.value ?? item?.id
|
},
|
// 选中产品方法
|
selProductClick(item) {
|
this.productId = item.value
|
this.unit = item.unit
|
},
|
// 选中路线方法
|
selRouteClick(item, prop) {
|
console.log(item, prop)
|
this.route = item.label
|
},
|
// 获取当前时间
|
currentTime() {
|
return currentTime()
|
},
|
//树点击
|
handleNodeClick(data) {
|
console.log(data,"sss");
|
getReorderRuleList({
|
locationId:data.id,
|
page:1,
|
pageSize:15,
|
type:"",
|
keyWord:data.jointName,
|
}).then((res)=>{
|
console.log(res,"res999")
|
if (res.code === 200) {
|
console.log(res)
|
const list = res.data.map((item) => {
|
let orderNum = 0
|
if (parseFloat(item.minInventory) - parseFloat(item.prediction) > 0) {
|
orderNum = this.caculateOrderNumber(
|
parseFloat(item.minInventory),
|
parseFloat(item.maxInventory),
|
parseFloat(item.prediction)
|
)
|
}
|
return {
|
...item,
|
productName: item.product.name,
|
locationName: item.location.name,
|
isSet: false,
|
isEdit: true,
|
editable: true,
|
isOrder: true,
|
isView: item?.minInventory - item?.prediction > 0 ? true : false,
|
orderNumber: orderNum
|
}
|
})
|
this.tableList.tableData = list || []
|
this.tableData = list || []
|
this.pagerOptions.totalCount = res.total
|
}
|
})
|
},
|
async getLocationList(){
|
await getLocationList({
|
categoryId:"",
|
keyWord:"",
|
// page:1,
|
// pageSize:,
|
}).then((res)=>{
|
this.datas=res.data
|
console.log(res,"res666")
|
})
|
}
|
}
|
}
|
</script>
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<style lang="scss" scoped>
|
::v-deep {
|
.el-table {
|
border-top-left-radius: 12px;
|
border-top-right-radius: 12px;
|
overflow: auto;
|
}
|
.content_wrap {
|
height: calc(100% - 0px);
|
display: flex;
|
justify-content: space-between;
|
.con_left {
|
width: 200px;
|
.el-checkbox-group {
|
width:100%;
|
display: flex;
|
flex-direction: column;
|
}
|
.stash {
|
display: flex;
|
flex-direction: column;
|
.el-tree{
|
background-color: #E6ECF2;
|
}
|
}
|
}
|
.list-view {
|
flex: 1;
|
}
|
}
|
|
}
|
</style>
|
