parent
63cf4da610
commit
3b448d4f61
4 changed files with 419 additions and 63 deletions
@ -0,0 +1,262 @@ |
|||||||
|
<template> |
||||||
|
<el-dialog :close-on-click-modal="false" :title="categoryDialogTitle" :visible.sync="categoryVisible" |
||||||
|
:append-to-body="true" width="70%" @close="handleCloseDetail" fullscreen> |
||||||
|
<el-tabs v-model="transactionType" @tab-click="handleTabClick"> |
||||||
|
<el-tab-pane label="易耗品" name="YH"></el-tab-pane> |
||||||
|
<el-tab-pane label="耐用品" name="NY"></el-tab-pane> |
||||||
|
</el-tabs> |
||||||
|
<avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form" :page.sync="page" |
||||||
|
:permission="permissionList" @row-del="rowDel" @search-change="searchChange" @search-reset="searchReset" |
||||||
|
@selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange" |
||||||
|
@refresh-change="refreshChange" @on-load="onLoad" @row-change="handleRowChange"> |
||||||
|
</avue-crud> |
||||||
|
<div slot="footer" class="dialog-footer"> |
||||||
|
<el-button @click="handleCancel">取消</el-button> |
||||||
|
<el-button type="primary" @click="handleConfirm">确定</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { getList } from "@/api/secondOrder/list.js"; |
||||||
|
import { getList as fetchDurableApi } from "@/api/materials/expend"; |
||||||
|
|
||||||
|
export default { |
||||||
|
props: { |
||||||
|
categoryVisible: { |
||||||
|
type: Boolean, |
||||||
|
default: false |
||||||
|
}, |
||||||
|
categoryDialogTitle: { |
||||||
|
type: String, |
||||||
|
default: '' |
||||||
|
}, |
||||||
|
departmentId: { |
||||||
|
type: String, |
||||||
|
default: '' |
||||||
|
}, |
||||||
|
selectionData: { |
||||||
|
type: Object, |
||||||
|
default: [] |
||||||
|
} |
||||||
|
}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
form: {}, |
||||||
|
selectionList: [], |
||||||
|
newselection: [], |
||||||
|
query: {}, |
||||||
|
loading: true, |
||||||
|
page: { |
||||||
|
pageSize: 10, |
||||||
|
currentPage: 1, |
||||||
|
total: 0, |
||||||
|
}, |
||||||
|
option: { |
||||||
|
reserveSelection: true, |
||||||
|
calcHeight: 30, |
||||||
|
tip: false, |
||||||
|
searchShow: true, |
||||||
|
searchMenuSpan: 18, |
||||||
|
border: true, |
||||||
|
index: true, |
||||||
|
selection: true, |
||||||
|
viewBtn: true, |
||||||
|
dialogClickModal: false, |
||||||
|
menu: false, |
||||||
|
addBtn: false, |
||||||
|
printBtn: false, |
||||||
|
refreshBtn: false, |
||||||
|
gridBtn: false, |
||||||
|
gridBackgroundImage: false, |
||||||
|
gridSpan: false, |
||||||
|
filterBtn: false, |
||||||
|
columnBtn: false, |
||||||
|
menuAlign: "left", |
||||||
|
searchMenuPosition: "right", |
||||||
|
menuWidth: 80, |
||||||
|
selectable: (row, index) => row.num !== 0, |
||||||
|
column: [ |
||||||
|
{ |
||||||
|
label: "存货编号", |
||||||
|
prop: "materialCode", |
||||||
|
headerAlign: "center", |
||||||
|
align: "center", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "存货名称", |
||||||
|
prop: "materialName", |
||||||
|
search: true, |
||||||
|
headerAlign: "center", |
||||||
|
align: "left", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "规格型号", |
||||||
|
prop: "model", |
||||||
|
headerAlign: "center", |
||||||
|
align: "left", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "类别", |
||||||
|
prop: "type", |
||||||
|
search: false, |
||||||
|
type: "select", |
||||||
|
headerAlign: "center", |
||||||
|
align: "center", |
||||||
|
value: "NY", |
||||||
|
disabled: true, |
||||||
|
dicData: [ |
||||||
|
{ |
||||||
|
label: "易耗品", |
||||||
|
value: "YH", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "耐用品", |
||||||
|
value: "NY", |
||||||
|
}, |
||||||
|
], |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "计量单位", |
||||||
|
prop: "unit", |
||||||
|
headerAlign: "center", |
||||||
|
align: "center", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "数量", |
||||||
|
prop: "num", |
||||||
|
headerAlign: "center", |
||||||
|
align: "center", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "单价", |
||||||
|
prop: "unitPrice", |
||||||
|
headerAlign: "center", |
||||||
|
align: "center", |
||||||
|
formatter: (row, column) => { |
||||||
|
const value = row.unitPrice; |
||||||
|
if (value === null || value === undefined || value === "") { |
||||||
|
return "-"; |
||||||
|
} |
||||||
|
return value; |
||||||
|
} |
||||||
|
}, |
||||||
|
], |
||||||
|
}, |
||||||
|
data: [], |
||||||
|
dialogLogVisible: false, |
||||||
|
transactionType: "YH", |
||||||
|
tableData: [], |
||||||
|
ckTable: [], |
||||||
|
rkTable: [], |
||||||
|
currentRow: null, |
||||||
|
allSelectedList: [], |
||||||
|
isUpdatingSelection: false, |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
this.onLoad(this.page); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//清空搜索 |
||||||
|
searchReset() { |
||||||
|
this.query = {}; |
||||||
|
this.onLoad(this.page); |
||||||
|
}, |
||||||
|
searchChange(params, done) { |
||||||
|
this.query = params; |
||||||
|
this.page.currentPage = 1; |
||||||
|
this.onLoad(this.page, params); |
||||||
|
done(); |
||||||
|
}, |
||||||
|
|
||||||
|
//勾选选中 |
||||||
|
selectionChange(selection) { |
||||||
|
console.log(this.selectionData, '---selectionData') |
||||||
|
const currentPageIds = this.selectionData.map(item => item.id) |
||||||
|
let arr = selection.filter(item => !currentPageIds.includes(item.id)) //未选择的数据 |
||||||
|
const selectionWithTwoInventoryId = arr.map(item => ({ |
||||||
|
...item, |
||||||
|
twoInventoryId: item.id |
||||||
|
})) |
||||||
|
this.allSelectedList.push(...selectionWithTwoInventoryId); |
||||||
|
this.allSelectedList = this.uniqueById(this.allSelectedList); |
||||||
|
}, |
||||||
|
//去重 |
||||||
|
uniqueById(arr) { |
||||||
|
const uniqueObj = {}; |
||||||
|
arr.forEach(item => { |
||||||
|
if (item.id && !uniqueObj[item.id]) { |
||||||
|
uniqueObj[item.id] = item; |
||||||
|
} |
||||||
|
}); |
||||||
|
return Object.values(uniqueObj); |
||||||
|
}, |
||||||
|
//点击确定 |
||||||
|
handleConfirm() { |
||||||
|
const uniqueList = this.uniqueById(this.allSelectedList); |
||||||
|
this.$emit("confirm", uniqueList); |
||||||
|
}, |
||||||
|
handleCloseDetail() { |
||||||
|
this.$emit('handleCloseDetail') |
||||||
|
}, |
||||||
|
selectionClear() { |
||||||
|
this.allSelectedList = [] |
||||||
|
if (this.$refs.crud) { |
||||||
|
this.$refs.crud.toggleSelection() |
||||||
|
} |
||||||
|
}, |
||||||
|
currentChange(currentPage) { |
||||||
|
this.page.currentPage = currentPage; |
||||||
|
this.onLoad(this.page, this.query); |
||||||
|
}, |
||||||
|
|
||||||
|
sizeChange(pageSize) { |
||||||
|
this.page.pageSize = pageSize; |
||||||
|
this.onLoad(this.page, this.query); |
||||||
|
}, |
||||||
|
refreshChange() { |
||||||
|
this.onLoad(this.page, this.query); |
||||||
|
}, |
||||||
|
handleTabClick() { |
||||||
|
this.page.currentPage = 1; |
||||||
|
this.onLoad(this.page); |
||||||
|
}, |
||||||
|
|
||||||
|
onLoad(page, params = {}) { |
||||||
|
this.loading = true; |
||||||
|
const requestParams = Object.assign({}, params, this.query, { |
||||||
|
num: 0, |
||||||
|
departmentId: this.departmentId |
||||||
|
}); |
||||||
|
const apiPromise = this.transactionType === "YH" |
||||||
|
? getList(page.currentPage, page.pageSize, requestParams) |
||||||
|
: fetchDurableApi(page.currentPage, page.pageSize, requestParams); |
||||||
|
apiPromise.then((res) => { |
||||||
|
this.data = res.data.result.list; |
||||||
|
this.page.total = res.data.result.total; |
||||||
|
}).catch(error => { |
||||||
|
this.$message.error('加载数据失败: ' + error.message); |
||||||
|
}).finally(() => { |
||||||
|
this.loading = false; |
||||||
|
}); |
||||||
|
}, |
||||||
|
handleCancel() { |
||||||
|
this.categoryVisible = false |
||||||
|
} |
||||||
|
}, |
||||||
|
} |
||||||
|
</script> |
||||||
|
<style lang="scss" scoped> |
||||||
|
::v-deep.el-dialog__footer { |
||||||
|
position: fixed !important; |
||||||
|
bottom: 0 !important; |
||||||
|
right: 0 !important; |
||||||
|
} |
||||||
|
|
||||||
|
::v-deep.dialog-content { |
||||||
|
max-height: calc(100vh - 200px); |
||||||
|
overflow-y: auto; |
||||||
|
padding-right: 10px; |
||||||
|
overflow-x: hidden; |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue