You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
554 lines
18 KiB
554 lines
18 KiB
<template>
|
|
<el-drawer
|
|
v-loading="DrawerLoading"
|
|
v-if="drawer"
|
|
:visible="true"
|
|
:close-on-press-escape="false"
|
|
:wrapperClosable="false"
|
|
:with-header="false"
|
|
:modal="false"
|
|
size="100%"
|
|
>
|
|
<div class="drawer-heder">
|
|
<div class="heder-left">
|
|
<!-- <div class="heder-img">
|
|
<img
|
|
src="@/assets/img/drawerHeader.png"
|
|
alt=""
|
|
style="width: 100%; height: 100%"
|
|
/>
|
|
</div> -->
|
|
<div class="header-text">
|
|
<span>{{ propsData[title[0].prop] }}</span>
|
|
<span>{{ title[0].label }}</span>
|
|
</div>
|
|
</div>
|
|
<div class="heder-right">
|
|
<curren-Button
|
|
:Butttondata="Butttondata"
|
|
@tableButtonClick="tableButtonClick"
|
|
>
|
|
<template>
|
|
<el-dropdown
|
|
trigger="click"
|
|
@command="handleCommand"
|
|
v-if="JSON.stringify(dropdownData) != '{}'"
|
|
>
|
|
<el-button size="mini" icon="el-icon-more"></el-button>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<el-dropdown-item
|
|
v-for="(item, index) in dropdownData"
|
|
:key="index"
|
|
:command="item.command"
|
|
>{{ item.label }}</el-dropdown-item
|
|
>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</template>
|
|
</curren-Button>
|
|
</div>
|
|
</div>
|
|
<div class="drawer-main">
|
|
<curren-tabs
|
|
:tabsData="dropdownTabs"
|
|
:activeName="firstTabs"
|
|
type="border-card"
|
|
@handleClick="handleClick"
|
|
>
|
|
<template slot-scope="scope">
|
|
<curren-descriptions
|
|
border
|
|
v-if="scope.value == 'xq'"
|
|
:column="column"
|
|
:direction="direction"
|
|
:colon="false"
|
|
:tabsDesTions="tabsDesTions"
|
|
:propsData="propsData"
|
|
>
|
|
</curren-descriptions>
|
|
<!-- currenTableDetails 组件 明细中带分页功能 -->
|
|
<umyTable
|
|
v-if="scope.value == 'mx'"
|
|
:tableBorder="true"
|
|
:tableData="propsData.details"
|
|
:propsData="propsData"
|
|
:tableColumns="tableColumns"
|
|
:selectionTable="selectionTable"
|
|
:requiredRules="false"
|
|
:setUTableHeight="260"
|
|
@sortChange="sortChange"
|
|
@handleSelectionChange="handleSelectionChange"
|
|
@inlineDialog="inlineDialog"
|
|
@buttonClick="buttonClick"
|
|
>
|
|
<template>
|
|
<slot></slot>
|
|
</template>
|
|
</umyTable>
|
|
<!-- 明细页码 -->
|
|
<pagination
|
|
v-if="scope.value == 'mx'"
|
|
:totalCount="totalCount"
|
|
:pagesizeProps="MaxResultCount"
|
|
@SizeChange="alterResultCountDetails"
|
|
@CurrentChange="alertoldSkipCountDetails"
|
|
></pagination>
|
|
<!-- 新增汇总 表头 区分明细表头使用 summaryTableColumns -->
|
|
<umyTable
|
|
v-if="scope.value == 'hz'"
|
|
:tableBorder="true"
|
|
:tableData="propsData.summaryDetails"
|
|
:tableColumns="summaryTableColumns.length == 0 ? tableColumns : summaryTableColumns"
|
|
:selectionTable="selectionTable"
|
|
:requiredRules="false"
|
|
@sortChange="sortChange"
|
|
@handleSelectionChange="handleSelectionChange"
|
|
@inlineDialog="inlineDialog"
|
|
@buttonClick="buttonClick"
|
|
:setUTableHeight="210"
|
|
>
|
|
<template>
|
|
<slot></slot>
|
|
</template>
|
|
</umyTable>
|
|
<!-- 自定义扩展 -->
|
|
<umyTable
|
|
v-if="
|
|
scope.value == zdyValue &&
|
|
scope.value != 'xq' &&
|
|
scope.value != 'mx' &&
|
|
scope.value != 'hz' &&
|
|
scope.value != 'zwlcj'
|
|
"
|
|
:tableBorder="true"
|
|
:tableLoading="tableLoading"
|
|
:tableData="otherData"
|
|
:tableColumns="zdyTableColumns"
|
|
:selectionTable="selectionTable"
|
|
:requiredRules="false"
|
|
@sortChange="sortChange"
|
|
@handleSelectionChange="handleSelectionChange"
|
|
@inlineDialog="inlineDialog"
|
|
@buttonClick="buttonClick"
|
|
:setUTableHeight="210"
|
|
>
|
|
<template>
|
|
<slot></slot>
|
|
</template>
|
|
</umyTable>
|
|
<!-- 自定义扩展（tree）的形式 目前使用位置：物品清单信息-子物品层级 todo:待优化-->
|
|
<currenTable
|
|
v-if="
|
|
scope.value == zdyValue &&
|
|
scope.value == 'zwlcj'
|
|
"
|
|
:tableLoading="tableLoading"
|
|
:tableData="otherData"
|
|
:tableColumns="zdyTableColumns"
|
|
:selectionTable="selectionTable"
|
|
:requiredRules="false"
|
|
@sortChange="sortChange"
|
|
@handleSelectionChange="handleSelectionChange"
|
|
@inlineDialog="inlineDialog"
|
|
:treeProps="{children: 'children', hasChildren: 'hasChildren'}"
|
|
@buttonClick="buttonClick"
|
|
>
|
|
<template>
|
|
<slot></slot>
|
|
</template>
|
|
</currenTable>
|
|
</template>
|
|
</curren-tabs>
|
|
</div>
|
|
<div class="drawer-Shut" @click="drawerShut">
|
|
<el-button type="danger" size="mini">关闭</el-button>
|
|
</div>
|
|
</el-drawer>
|
|
</template>
|
|
<script>
|
|
import { getListByItemcode,byItem,byProduct,byComponent,bySupplierCode,byLocation,byLocationCode,
|
|
relationByLocationCode,byComponentCJ,purRecNoteCustomInfo,EnumPurchaseReceiptInspect
|
|
} from "@/api/wms-api"
|
|
import currenButton from "@/components/currenButton"
|
|
import currenDescriptions from "@/components/currenDescriptions"
|
|
import currenTabs from "@/components/currenTabs"
|
|
import currenTable from "@/components/currenTable"
|
|
import pagination from "@/components/Pagination"
|
|
export default {
|
|
name: 'currenTabel-drawer',
|
|
components: {
|
|
pagination,
|
|
currenButton,
|
|
currenDescriptions,
|
|
currenTabs,
|
|
currenTable,
|
|
},
|
|
props: {
|
|
title: {
|
|
type: Array,
|
|
default: () => {
|
|
return []
|
|
}
|
|
},
|
|
DrawerLoading: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
drawer: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
dropdownData: {
|
|
type: Object,
|
|
default: () => {
|
|
return {}
|
|
}
|
|
},
|
|
propsData: {
|
|
type: Object,
|
|
default: () => {
|
|
return {}
|
|
}
|
|
},
|
|
tabsDesTions: {
|
|
type: Array,
|
|
default: () => {
|
|
return []
|
|
}
|
|
},
|
|
dropdownTabsData: {
|
|
type: Array,
|
|
default: () => {
|
|
return []
|
|
}
|
|
},
|
|
tableLoading: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
tableColumns: {
|
|
type: Array,
|
|
default: () => {
|
|
return []
|
|
}
|
|
},
|
|
summaryTableColumns: {
|
|
type: Array,
|
|
default: () => {
|
|
return []
|
|
}
|
|
},
|
|
Butttondata: {
|
|
type: Array,
|
|
default: () => {
|
|
return [{
|
|
type: 'warning',
|
|
icon: 'el-icon-edit',
|
|
label: '编辑',
|
|
name: 'edit',
|
|
size: 'mini'
|
|
}]
|
|
}
|
|
},
|
|
selectionTable: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
MaxResultCount: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
totalCount: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
// 详情展现列数，默认为2列展现
|
|
column: {
|
|
type: Number,
|
|
default: 2
|
|
},
|
|
// 详情展示方式，默认水平分布
|
|
direction: {
|
|
type: String,
|
|
default: 'horizontal'
|
|
},
|
|
// 详情tabs排序默认
|
|
firstTabs: {
|
|
type: String,
|
|
default: 'xq'
|
|
}
|
|
|
|
},
|
|
computed: {
|
|
dropdownTabs () {
|
|
// 带有特殊扩展tabs页的
|
|
if (this.dropdownTabsData.length !== 0) {
|
|
return this.dropdownTabsData
|
|
} else {
|
|
// 正常普通 详情，明细，汇总
|
|
if (Object.keys(this.propsData).length != 0) {
|
|
this.initDropdownTabsData = [{
|
|
label: "详情",
|
|
name: 'xq'
|
|
},
|
|
{
|
|
label: "明细",
|
|
name: 'mx'
|
|
},
|
|
{
|
|
label: "汇总",
|
|
name: 'hz'
|
|
}]
|
|
if (this.propsData.details == undefined || !this.propsData.details.length) {
|
|
this.initDropdownTabsData = [{
|
|
label: "详情",
|
|
name: 'xq'
|
|
}]
|
|
return this.initDropdownTabsData
|
|
}
|
|
if (this.propsData.summaryDetails == undefined || !this.propsData.summaryDetails.length ) {
|
|
this.initDropdownTabsData = [{
|
|
label: "详情",
|
|
name: 'xq'
|
|
},
|
|
{
|
|
label: "明细",
|
|
name: 'mx'
|
|
}]
|
|
return this.initDropdownTabsData
|
|
}
|
|
}
|
|
return this.initDropdownTabsData
|
|
}
|
|
},
|
|
},
|
|
mounted () {
|
|
},
|
|
data () {
|
|
return {
|
|
otherData:[], // 切换tabs页赋值
|
|
zdyTableColumns:[], // 自定义表头
|
|
zdyValue:'', // 自定义展现值
|
|
// firstTabs:'xq',
|
|
initDropdownTabsData:[
|
|
{
|
|
label: "详情",
|
|
name: 'xq'
|
|
},
|
|
{
|
|
label: "明细",
|
|
name: 'mx'
|
|
},
|
|
{
|
|
label: "汇总",
|
|
name: 'hz'
|
|
}
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
|
|
handleCommand (command) {
|
|
this.$emit('handleCommand', command)
|
|
},
|
|
drawerShut () {
|
|
this.$emit('drawerShut', false)
|
|
},
|
|
tableButtonClick (val) {
|
|
this.$emit('drawerbutton', val)
|
|
},
|
|
//排序
|
|
sortChange (data) {
|
|
this.$emit('sortChange', data)
|
|
},
|
|
//点击selection框
|
|
handleSelectionChange (val) {
|
|
this.$emit("handleSelectionChange", val)
|
|
},
|
|
//点击name提交emit打开编辑页面
|
|
inlineDialog (row) {
|
|
this.$emit("inlineDialog", row)
|
|
},
|
|
//接收分页组件emit改变每页最大页数
|
|
alterResultCountDetails (val) {
|
|
this.$emit('alterResultCountDetails', val)
|
|
},
|
|
//接收分页组件emit改变当前页
|
|
alertoldSkipCountDetails (val) {
|
|
this.$emit('alertoldSkipCountDetails', val)
|
|
},
|
|
buttonClick(row) {
|
|
this.$emit("buttonClick", row);
|
|
},
|
|
// tabs 切换页
|
|
handleClick (val) {
|
|
this.$emit("currenTabsChange", val);//父级获取当前的tab内容
|
|
this.zdyValue = val.name
|
|
this.dropdownTabsData.forEach( item => {
|
|
if (item.name == val.name) {
|
|
let parent = this.$parent
|
|
parent.tableLoading = true
|
|
// 详情 明细 汇总
|
|
parent.firstTabs = val.name
|
|
if (val.name == 'xq' || val.name == 'mx' || val.name == 'hz') {
|
|
this.zdyTableColumns = []
|
|
this.otherData = []
|
|
parent.tableLoading = false
|
|
} else {
|
|
this.zdyTableColumns = []
|
|
this.otherData = []
|
|
// this.firstTabs = val.name
|
|
// 其他自定义tab页
|
|
if (item.functionName == 'getListByItemcode') {
|
|
let params = {
|
|
itemCode: this.propsData.code
|
|
}
|
|
getListByItemcode(params, item.url).then(res => {
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = res
|
|
parent.tableLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.tableLoading = false
|
|
})
|
|
} else if (item.functionName == 'byItem') {
|
|
byItem(this.propsData.code, item.url).then(res => {
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = res
|
|
parent.tableLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.tableLoading = false
|
|
})
|
|
} else if (item.functionName == 'byProduct') {
|
|
byProduct({product:this.propsData.product}, item.url).then(res => {
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = res
|
|
parent.tableLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.tableLoading = false
|
|
})
|
|
} else if (item.functionName == 'byComponent') {
|
|
byComponent({component:this.propsData.component}, item.url).then(res => {
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = res
|
|
parent.tableLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.tableLoading = false
|
|
})
|
|
}
|
|
// 基础数据管理-物品清单维护-物品清单信息-详情-子物品层级
|
|
else if (item.functionName == 'byComponentCJ') {
|
|
this.otherData = []
|
|
byComponentCJ({component:this.propsData.component}, item.url).then(res => {
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = res
|
|
this.recursion(this.otherData)
|
|
parent.tableLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.tableLoading = false
|
|
})
|
|
} else if (item.functionName == 'bySupplierCode') {
|
|
bySupplierCode({supplierCode:this.propsData.code}, item.url).then(res => {
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = res
|
|
parent.tableLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.tableLoading = false
|
|
})
|
|
} else if (item.functionName == 'byLocation') {
|
|
byLocation(this.propsData.code==null?this.propsData.locationCode:this.propsData.code, item.url).then(res => {
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = res
|
|
this.o
|
|
parent.tableLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.tableLoading = false
|
|
})
|
|
} else if (item.functionName == 'byLocationCode') {
|
|
byLocationCode({locationCode: this.propsData.code}, item.url).then(res => {
|
|
let itemData = []
|
|
itemData.push(res)
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = itemData
|
|
parent.tableLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.tableLoading = false
|
|
})
|
|
}
|
|
// 基础数据管理-库位信息-详情-库位零件关系
|
|
else if (item.functionName == 'relationByLocationCode') {
|
|
relationByLocationCode({locationCode: this.propsData.code}, item.url).then(res => {
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = res
|
|
parent.tableLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.tableLoading = false
|
|
})
|
|
}
|
|
// 采购收货记录-合格品收货明细, 不合格品收货明细, 收货缺料明细
|
|
else if(item.functionName == "purRecNoteCustomInfo"){
|
|
parent.Loading.DrawerLoading = true
|
|
purRecNoteCustomInfo( item.url,this.propsData.id).then(res => {
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = res
|
|
parent.Loading.DrawerLoading = false
|
|
}).catch(err => {
|
|
console.log(err)
|
|
parent.Loading.DrawerLoading = false
|
|
})
|
|
}
|
|
// 客户退拆记录-详情页TAB-回冲记录
|
|
else if(item.functionName == "customerDismantleBackFlushNote"){
|
|
let zdyTableColumnsJSON = JSON.parse(JSON.stringify(this.$isTableColumns[item.tableColumns]));
|
|
delete zdyTableColumnsJSON[0].type
|
|
this.zdyTableColumns = zdyTableColumnsJSON
|
|
this.otherData = this.propsData.noteAndBackFlushDetails
|
|
}
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 递归 物品子级层级
|
|
recursion(val){
|
|
val.forEach(item => {
|
|
if(item.componentDTOs) {
|
|
item.children = item.componentDTOs
|
|
this.recursion(item.componentDTOs)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
// el-drawer
|
|
@import "./style/index.scss";
|
|
</style>
|