<template>
|
<div class="rightContent">
|
<div class="label-fixed-element">
|
<span>{{ params.name }}</span>
|
</div>
|
<div class="top">
|
<SearchCommonView
|
:add-title="'新建'"
|
:placeholder="'请输入单号/来源单据'"
|
:amount-view="false"
|
@addCommonClick="addBtnClick"
|
@searchClick="getList"
|
/>
|
</div>
|
<div class="list-view">
|
<div class="table">
|
<TableCommonView ref="tableListRef" :table-list="tableList" @selTableCol="selTableCol">
|
<template slot="tableButton">
|
<el-table-column label="操作" width="100">
|
<template slot-scope="scope">
|
<el-button @click="tableRowClick(scope.row, '查看')" type="text" size="small">查看</el-button>
|
<el-button
|
v-if="scope.row.status !== 4"
|
@click="tableRowClick(scope.row, '编辑')"
|
type="text"
|
size="small"
|
>编辑</el-button
|
>
|
</template>
|
</el-table-column>
|
</template>
|
</TableCommonView>
|
</div>
|
<div class="btn-pager">
|
<PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
|
</div>
|
</div>
|
<!-- 新建/编辑 -->
|
<AddOverviewDialog
|
v-if="editConfig.visible"
|
:work-type="workType"
|
:edit-common-config="editConfig"
|
:add-name="this.$route.params.name"
|
:display-edit="displayEdit"
|
/>
|
</div>
|
</template>
|
|
<script>
|
import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
|
import { getOperation } from "@/api/overview/overview"
|
// import DetailProduct from "@/views/productManage/product/DetailProduct"
|
import AddOverviewDialog from "@/views/overview/AddOverviewDialog"
|
|
export default {
|
name: "OverviewListView",
|
props: {},
|
components: { AddOverviewDialog },
|
mixins: [pageMixin],
|
computed: {},
|
data() {
|
return {
|
tableList: {},
|
showcol: ["仓库位置", "调出位置", "调入位置", "联系人", "日期", "来源单据", "状态"],
|
searchOptions: [],
|
commonDetail: {
|
visible: false,
|
title: "新建",
|
infomation: {}
|
},
|
editConfig: {
|
visible: false,
|
title: "新建",
|
infomation: {}
|
},
|
workType: this.$route.params.workType,
|
keyword: "",
|
params: {},
|
displayEdit: false,
|
formLabel: "",
|
toLabel: ""
|
}
|
},
|
created() {
|
console.log(this.workType)
|
this.setFormToLabel()
|
this.setTable()
|
var paramsData = sessionStorage.getItem("paramsData")
|
let params = {}
|
if (paramsData) {
|
params = JSON.parse(sessionStorage.getItem("paramsData"))
|
} else {
|
params = this.$route.params
|
sessionStorage.setItem("paramsData", JSON.stringify(params))
|
}
|
this.params = params
|
this.getData()
|
// console.log(this.$route.params.workType)
|
},
|
// 页面销毁之前
|
beforeDestroy() {
|
sessionStorage.removeItem("paramsData")
|
},
|
methods: {
|
setFormToLabel() {
|
if (this.workType === 1) {
|
this.formLabel = "供应商位置"
|
this.toLabel = "仓库位置"
|
} else if (this.workType === 2) {
|
this.formLabel = "仓库位置"
|
this.toLabel = "客户位置"
|
} else {
|
this.formLabel = "调出位置"
|
this.toLabel = "调入位置"
|
}
|
},
|
setTable() {
|
this.tableList = {
|
tableInfomation: [],
|
selectBox: false,
|
selectIndex: true,
|
showcol: this.showcol,
|
allcol: [],
|
tableColumn: this.setTableColumn(this.showcol)
|
}
|
let allcol = []
|
for (let i = 0; i < this.tableList.tableColumn.length; i++) {
|
if (!this.tableList.tableColumn[i].default) {
|
const label = this.tableList.tableColumn[i].label
|
allcol.push(label)
|
}
|
}
|
this.tableList.allcol = allcol
|
},
|
setTableColumn(showcol) {
|
let tableColumn = [
|
{
|
label: "单号",
|
prop: "number",
|
isShowColumn: true,
|
default: true
|
},
|
{
|
label: this.formLabel,
|
prop: "from",
|
isShowColumn: showcol.includes(this.formLabel),
|
default: false
|
},
|
{
|
label: this.toLabel,
|
prop: "to",
|
isShowColumn: showcol.includes(this.toLabel),
|
default: false
|
},
|
{
|
label: "联系人",
|
prop: "companyName",
|
isShowColumn: showcol.includes("联系人"),
|
default: false
|
},
|
{
|
label: "负责人",
|
prop: "contacterName",
|
isShowColumn: showcol.includes("负责人"),
|
default: false
|
},
|
{
|
label: "日期",
|
prop: "operationDate",
|
isShowColumn: showcol.includes("日期"),
|
default: false,
|
date: true
|
},
|
// {
|
// label: "产品可用性",
|
// prop: "status",
|
// isShowColumn: showcol.includes("产品可用性"),
|
// default: false
|
// },
|
// {
|
// label: "截止日期",
|
// prop: "faultTime",
|
// isShowColumn: showcol.includes("截止日期"),
|
// default: false
|
// },
|
// {
|
// label: "实际日期",
|
// prop: "shopName",
|
// isShowColumn: showcol.includes("实际日期"),
|
// default: false
|
// },
|
{
|
label: "来源单据",
|
prop: "sourceNumber",
|
isShowColumn: showcol.includes("来源单据"),
|
default: false
|
},
|
// {
|
// label: "欠单",
|
// prop: "status",
|
// isShowColumn: showcol.includes("欠单"),
|
// default: false
|
// },
|
{
|
label: "入库类型",
|
prop: "operationTypeName",
|
isShowColumn: showcol.includes("入库类型"),
|
default: false
|
},
|
{
|
label: "状态",
|
prop: "status",
|
width: 120,
|
isShowColumn: showcol.includes("状态"),
|
default: false,
|
status: true,
|
isCallMethod: true,
|
getCallMethod: this.getStatus
|
}
|
]
|
return tableColumn
|
},
|
selTableCol(val) {
|
this.showcol = val
|
this.tableList.tableColumn = this.setTableColumn(val)
|
},
|
// 请求数据
|
async getData() {
|
await getOperation({
|
number: this.keyword,
|
operationTypeId: this.params.id,
|
page: this.pagerOptions.currPage,
|
pageSize: this.pagerOptions.pageSize
|
}).then((res) => {
|
console.log(res.data)
|
if (res.code === 200) {
|
const list = res.data.map((item) => {
|
return {
|
...item,
|
from: item.fromLocation.name,
|
to: item.toLocation.name
|
}
|
})
|
this.tableList.tableInfomation = list || []
|
this.pagerOptions.totalCount = res.total
|
}
|
})
|
},
|
// 搜索
|
getList(val) {
|
console.log(val)
|
this.keyword = val
|
this.pagerOptions.currPage = 1
|
this.getData()
|
},
|
// 查看 编辑
|
tableRowClick(row, val) {
|
console.log(row)
|
this.editConfig.visible = true
|
this.editConfig.title = val
|
this.editConfig.operationTypeId = this.$route.params.id
|
this.editConfig.infomation = { ...row }
|
},
|
// 新建
|
addBtnClick() {
|
this.editConfig.visible = true
|
this.editConfig.title = "新建"
|
this.editConfig.operationTypeId = this.$route.params.id
|
this.editConfig.infomation = {}
|
},
|
// 状态
|
getStatus(val) {
|
return val === 1 ? "草稿" : val === 3 ? "就绪" : "完成"
|
}
|
}
|
}
|
</script>
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<style lang="scss" scoped>
|
.label-fixed-element {
|
background: #e6ecf2;
|
position: fixed;
|
font-size: 14px;
|
width: calc(100% - 530px);
|
height: 45px;
|
line-height: 45px;
|
font-size: 18px;
|
font-weight: 700;
|
color: #171718;
|
margin-top: -60px;
|
margin-left: -5px;
|
}
|
</style>
|
