taozi
4 months ago
parent
b1743f4619
commit
14efd9eebb
8 changed files with 1053 additions and 492 deletions
@ -0,0 +1,269 @@ |
||||
<template> |
||||
<el-dialog :close-on-click-modal="false" :title="demandDialogTitle" :visible.sync="consumableVisible" |
||||
:append-to-body="true" width="70%" @close="handleCloseDetail" fullscreen> |
||||
<basic-container> |
||||
<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"> |
||||
<!-- <template slot-scope="scope" slot="menu"> |
||||
<el-button type="text" size="small" @click.stop="handleLog(scope.row)">记录 |
||||
</el-button> |
||||
</template> --> |
||||
</avue-crud> |
||||
</basic-container> |
||||
</el-dialog> |
||||
</template> |
||||
<script> |
||||
import { getList, recordList } from "@/api/firstOrder/list"; |
||||
export default { |
||||
props: { |
||||
consumableVisible: { |
||||
type: Boolean, |
||||
default: false |
||||
}, |
||||
demandDialogTitle: { |
||||
type: String, |
||||
default: '' |
||||
}, |
||||
}, |
||||
data() { |
||||
return { |
||||
form: {}, |
||||
selectionList: [], |
||||
query: {}, |
||||
loading: true, |
||||
page: { |
||||
pageSize: 10, |
||||
currentPage: 1, |
||||
total: 0, |
||||
}, |
||||
option: { |
||||
height: "auto", |
||||
calcHeight: 30, |
||||
tip: false, |
||||
searchShow: true, |
||||
searchMenuSpan: 12, |
||||
border: true, |
||||
index: true, |
||||
selection: true, |
||||
viewBtn: true, |
||||
dialogClickModal: false, |
||||
menu: true, |
||||
printBtn: false, |
||||
refreshBtn: false, |
||||
gridBtn: false, |
||||
gridBackgroundImage: false, |
||||
gridSpan: false, |
||||
filterBtn: false, |
||||
columnBtn: false, |
||||
menuAlign: "left", |
||||
searchMenuPosition: "right", |
||||
menuWidth: 80, |
||||
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: true, |
||||
type: "select", |
||||
headerAlign: "center", |
||||
align: "center", |
||||
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", |
||||
}, |
||||
{ |
||||
label: "金额", |
||||
prop: "amount", |
||||
headerAlign: "center", |
||||
align: "center", |
||||
}, |
||||
{ |
||||
label: "描述", |
||||
prop: "remark", |
||||
headerAlign: "center", |
||||
align: "center", |
||||
formatter: (row, column) => { |
||||
const value = row.remark; |
||||
if (value === null || value === undefined || value === "") { |
||||
return "无"; |
||||
} |
||||
return value; |
||||
} |
||||
}, |
||||
], |
||||
}, |
||||
data: [], |
||||
dialogLogVisible: false, |
||||
transactionType: "1", |
||||
tableData: [], |
||||
ckTable: [], |
||||
rkTable: [], |
||||
currentRow: null, |
||||
}; |
||||
}, |
||||
computed: { |
||||
permissionList() { |
||||
return { |
||||
addBtn: false, |
||||
viewBtn: false, |
||||
delBtn: false, |
||||
editBtn: false, |
||||
}; |
||||
}, |
||||
ids() { |
||||
let ids = []; |
||||
this.selectionList.forEach((ele) => { |
||||
ids.push(ele.id); |
||||
}); |
||||
return ids.join(","); |
||||
}, |
||||
}, |
||||
mounted() { |
||||
this.consumableVisible = this.consumableVisible |
||||
}, |
||||
methods: { |
||||
formatTime(row, column, cellValue) { |
||||
if (!cellValue) return ''; |
||||
const date = new Date(cellValue); |
||||
const year = date.getFullYear(); |
||||
const month = String(date.getMonth() + 1).padStart(2, '0'); |
||||
const day = String(date.getDate()).padStart(2, '0'); |
||||
const hours = String(date.getHours()).padStart(2, '0'); |
||||
const minutes = String(date.getMinutes()).padStart(2, '0'); |
||||
const seconds = String(date.getSeconds()).padStart(2, '0'); |
||||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; |
||||
}, |
||||
async handleLog(row) { |
||||
this.dialogLogVisible = true; |
||||
this.currentRow = row; |
||||
this.loadTransactionData(); |
||||
}, |
||||
|
||||
handleTabClick() { |
||||
this.loadTransactionData(); |
||||
|
||||
}, |
||||
async loadTransactionData() { |
||||
if (!this.currentRow) return; |
||||
const params = { |
||||
oneFromId: this.currentRow.id, |
||||
transactionType: this.transactionType |
||||
}; |
||||
const pageNum = this.page.currentPage; |
||||
const pageSize = this.page.pageSize; |
||||
this.loading = true; |
||||
try { |
||||
const res = await recordList( |
||||
pageNum, |
||||
pageSize, |
||||
Object.assign({}, this.query, params) |
||||
); |
||||
if (this.transactionType === "1") { |
||||
this.ckTable = res.data.result.list; |
||||
} else { |
||||
this.rkTable = res.data.result.list; |
||||
} |
||||
this.tableData = res.data.result.list; |
||||
} catch (error) { |
||||
this.$message.error(error.message); |
||||
} finally { |
||||
this.loading = false; |
||||
} |
||||
}, |
||||
searchReset() { |
||||
this.query = {}; |
||||
this.onLoad(this.page); |
||||
}, |
||||
searchChange(params, done) { |
||||
this.query = params; |
||||
this.page.currentPage = 1; |
||||
this.onLoad(this.page, params); |
||||
done(); |
||||
}, |
||||
//勾选当前 |
||||
selectionChange(list) { |
||||
this.selectionList = list; |
||||
}, |
||||
selectionClear() { |
||||
this.selectionList = []; |
||||
this.$refs.crud.toggleSelection(); |
||||
}, |
||||
handleRowChange(row, index, data) { |
||||
console.log('Selected data:', data); |
||||
}, |
||||
currentChange(currentPage) { |
||||
this.handleRowChange() |
||||
this.page.currentPage = currentPage; |
||||
}, |
||||
sizeChange(pageSize) { |
||||
this.page.pageSize = pageSize; |
||||
}, |
||||
refreshChange() { |
||||
this.onLoad(this.page, this.query); |
||||
}, |
||||
onLoad(page, params = {}) { |
||||
this.loading = true; |
||||
getList( |
||||
page.currentPage, |
||||
page.pageSize, |
||||
Object.assign(params, this.query) |
||||
).then((res) => { |
||||
// const data = res.data.data; |
||||
this.data = res.data.result.list; |
||||
this.loading = false; |
||||
this.page.total = res.data.result.total; |
||||
// this.selectionClear(); |
||||
}); |
||||
this.loading = false; |
||||
}, |
||||
}, |
||||
} |
||||
|
||||
|
||||
</script> |
||||
Loading…
Reference in new issue