9 changed files with 1077 additions and 313 deletions
@ -0,0 +1,720 @@ |
|||
<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> |
|||
<!-- 明细头部按钮 --> |
|||
<div |
|||
class="currenTabel-drawer-mx-header" |
|||
v-if="scope.value == 'mx' && detailHeaderButton" |
|||
> |
|||
<curren-Button |
|||
:Butttondata="detailHeaderButton" |
|||
@tableButtonClick="detailHeaderClick" |
|||
></curren-Button> |
|||
</div> |
|||
<!-- 字段设置弹窗 --> |
|||
<rowDrop |
|||
@radio="rowDrop" |
|||
:tableColumns="tableColumns" |
|||
:visible="rowDropVisible" |
|||
@closeRowDrop="closeRowDrop" |
|||
:source="'detail_api'" |
|||
:innerMaxHeight="'calc(90vh - 400px)'" |
|||
></rowDrop> |
|||
<!-- 全面搜索（普通+高级整合） --> |
|||
<searchOverall |
|||
ref="searchOverallRef" |
|||
class="detailFiltersPopPage" |
|||
:showSearchOverall="detailFiltersVisible" |
|||
@getShowSearchOverall="getShowSearchOverall" |
|||
:showMoreSearch="true" |
|||
:tableColumns="tableColumns" |
|||
@overallSearchFormClick="detailFiltersSearch" |
|||
:filterActionOptions="filterActionOptions" |
|||
:httpOverallSearchData="detailSearchDataFE" |
|||
:disabledAction="true" |
|||
:disabledLogic="true" |
|||
> |
|||
<!-- 插槽预留 --> |
|||
<slot name="searchPrimarySlot"></slot> |
|||
</searchOverall> |
|||
<!-- currenTableDetails 组件 明细中带分页功能 --> |
|||
<umyTable |
|||
v-if="scope.value == 'mx'" |
|||
:isUpdate="isUpdate" |
|||
:tableBorder="true" |
|||
:tableData="propsData.details" |
|||
:propsData="propsData" |
|||
:tableColumns="tableColumns" |
|||
:selectionTable="selectionTable" |
|||
:requiredRules="false" |
|||
:setUTableHeight="showDetailColumnsSet ? 300 : 260" |
|||
@sortChange="sortChange" |
|||
@handleSelectionChange="handleSelectionChange" |
|||
@inlineDialog="inlineDialog" |
|||
@buttonClick="buttonClick" |
|||
:buttonOperationList="buttonOperationList" |
|||
@buttonOperationClick="buttonOperationClick" |
|||
> |
|||
<template> |
|||
<slot></slot> |
|||
</template> |
|||
</umyTable> |
|||
<!-- 明细页码 --> |
|||
<pagination |
|||
v-if="scope.value == 'mx'" |
|||
:totalCount="totalCount" |
|||
:pagesizeProps="MaxResultCount" |
|||
@SizeChange="alterResultCountDetails" |
|||
@CurrentChange="alertoldSkipCountDetails" |
|||
:currentPageProps="currentPage" |
|||
></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-dialog |
|||
width="90%" |
|||
:modal-append-to-body="false" |
|||
:append-to-body="false" |
|||
:title="detailInfoTitle" |
|||
:visible.sync="displayDialog.detailInfoDialog" |
|||
:show-close="true" |
|||
> |
|||
<div> |
|||
<curren-descriptions |
|||
v-if="detailInfoTableData" |
|||
border |
|||
:column="column" |
|||
:direction="direction" |
|||
:colon="false" |
|||
:tabsDesTions="tableColumns" |
|||
:propsData="detailInfoTableData" |
|||
style="padding-bottom: 20px;" |
|||
></curren-descriptions> |
|||
</div> |
|||
</el-dialog> |
|||
</el-drawer> |
|||
</template> |
|||
<script> |
|||
import { getListByItemcode,byItem,byProduct,byComponent,bySupplierCode,byLocation,byLocationCode, |
|||
relationByLocationCode,byComponentCJ,purRecNoteCustomInfo,EnumPurchaseReceiptInspect |
|||
} from "@/api/wms-api" |
|||
import searchOverall from "@/components/searchOverall" |
|||
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" |
|||
import rowDrop from "@/components/rowDrop/index.vue" |
|||
import { getParentNode } from '@/utils' |
|||
import * as allUrlOption from '@/utils/baseData/urlOption' |
|||
import { LoadingMixins } from "@/mixins/LoadingMixins"; |
|||
export default { |
|||
name: 'currenTabel-drawer', |
|||
components: { |
|||
pagination, |
|||
currenButton, |
|||
currenDescriptions, |
|||
currenTabs, |
|||
currenTable, |
|||
searchOverall, |
|||
rowDrop |
|||
}, |
|||
mixins: [ |
|||
LoadingMixins, |
|||
], |
|||
props: { |
|||
// 操作列按钮 |
|||
buttonOperationList:{ |
|||
type: Array, |
|||
default: null, |
|||
}, |
|||
// 是否显示明细-字段设置 |
|||
showDetailColumnsSet:{ |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
// 是否显示明细-筛选 |
|||
showDetailFilters:{ |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
// 明细-筛选-当前接口中的筛选数据（用于同步全面筛选的数据） |
|||
detailSearchDataFE:{ |
|||
type: Object, |
|||
default: null |
|||
}, |
|||
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 |
|||
}, |
|||
currentPage: { |
|||
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) { |
|||
if (Object.keys(this.propsData)) { |
|||
this.initDropdownTabsData = [{ |
|||
label: "详情", |
|||
name: 'xq' |
|||
}] |
|||
// 明细可以为空数组，前端分页使用 |
|||
if(this.propsData.details){ |
|||
this.initDropdownTabsData.push({ |
|||
label: "明细", |
|||
name: 'mx' |
|||
}) |
|||
} |
|||
if(this.propsData.summaryDetails && this.propsData.summaryDetails.length > 0){ |
|||
this.initDropdownTabsData.push({ |
|||
label: "汇总", |
|||
name: 'hz' |
|||
}) |
|||
} |
|||
} |
|||
return this.initDropdownTabsData |
|||
} |
|||
}, |
|||
}, |
|||
mounted () { |
|||
this.initDetailHeaderButton() |
|||
// 点击外部，字段设置弹窗隐藏 |
|||
document.addEventListener('click',(e)=>{ |
|||
if(!this.rowDropVisible)return |
|||
let _class = "rowDropNotHideItem" |
|||
let _hasParent = getParentNode(e.target,_class) |
|||
let _current_class = e.target._prevClass || e.target.className |
|||
let _hasCurrent = _current_class ? String(_current_class).includes(_class) : false |
|||
if(!_hasParent && !_hasCurrent){ |
|||
this.closeRowDrop() |
|||
} |
|||
}) |
|||
}, |
|||
data () { |
|||
return { |
|||
detailHeaderButton:null,//明细-上方按钮 |
|||
detailInfoTableData:null,//明细-查看详情弹窗数据 |
|||
detailInfoTitle:null,//明细-查看详情弹窗title |
|||
// table 重新渲染所需key |
|||
isUpdate: false, |
|||
// 明细-字段设置是否显示 |
|||
rowDropVisible: false, |
|||
otherData:[], // 切换tabs页赋值 |
|||
zdyTableColumns:[], // 自定义表头 |
|||
zdyValue:'', // 自定义展现值 |
|||
// firstTabs:'xq', |
|||
initDropdownTabsData:[ |
|||
{ |
|||
label: "详情", |
|||
name: 'xq' |
|||
}, |
|||
{ |
|||
label: "明细", |
|||
name: 'mx' |
|||
}, |
|||
{ |
|||
label: "汇总", |
|||
name: 'hz' |
|||
} |
|||
], |
|||
detailFiltersVisible:false,//筛选显示 |
|||
filterActionOptions:[{ |
|||
value: '==', |
|||
label: '等于' |
|||
}, { |
|||
value: '!=', |
|||
label: '不等于' |
|||
}], |
|||
} |
|||
}, |
|||
methods: { |
|||
// 初始化明细-上方按钮 |
|||
initDetailHeaderButton(){ |
|||
this.detailHeaderButton = [] |
|||
if(this.showDetailColumnsSet){this.detailHeaderButton.push(this.defaultFieldSettingBtn())} |
|||
if(this.showDetailFilters){this.detailHeaderButton.push(this.defaultFilterBtn())} |
|||
}, |
|||
detailHeaderClick(val,item){ |
|||
// 字段设置 |
|||
if(val == 'field'){ |
|||
this.columnsSettingHandle() |
|||
} |
|||
// 筛选 |
|||
if(val == 'filter'){ |
|||
this.detailFiltersHandle() |
|||
} |
|||
}, |
|||
// 关闭明细-详情弹窗 |
|||
closeDetailInfo(val){ |
|||
this.displayDialog.detailInfoDialog = val || false |
|||
}, |
|||
// 明细-操作列事件 |
|||
buttonOperationClick(row, item, index){ |
|||
// 查看详情 |
|||
if(item.name == "info"){ |
|||
this.displayDialog.detailInfoDialog = true |
|||
this.detailInfoTableData = row |
|||
let _name = allUrlOption[this.$route.name].detailInfoName |
|||
this.detailInfoTitle = _name ? row[_name] + ' 详情' : '详情' |
|||
} |
|||
this.$emit('buttonOperationClick',row, item, index) |
|||
}, |
|||
rowDrop(data,type) { |
|||
this.$emit('rowDrop',data,type) |
|||
this.isUpdate = !this.isUpdate |
|||
}, |
|||
// 明细-字段设置 |
|||
columnsSettingHandle(){ |
|||
this.rowDropVisible = !this.rowDropVisible |
|||
}, |
|||
// 明细-筛选 |
|||
detailFiltersHandle(){ |
|||
this.detailFiltersVisible = !this.detailFiltersVisible |
|||
}, |
|||
// 明细-全面筛选组件内部显示/隐藏更改触发，同步当前的showSearchOverall值 |
|||
getShowSearchOverall(val){ |
|||
this.detailFiltersVisible = val || false |
|||
}, |
|||
// 明细-全面筛选所有按钮操作集 |
|||
detailFiltersSearch(options){ |
|||
this.$emit('detailFiltersSearch', options) |
|||
}, |
|||
// 明细-关闭字段设置 |
|||
closeRowDrop() { |
|||
this.rowDropVisible = false |
|||
}, |
|||
handleCommand (command) { |
|||
this.$emit('handleCommand', command) |
|||
}, |
|||
drawerShut () { |
|||
this.closeDetailInfo(false) |
|||
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> |
|||
@ -0,0 +1,137 @@ |
|||
.el-drawer__wrapper { |
|||
z-index: 10 !important; |
|||
position: absolute; |
|||
left: 32%; |
|||
overflow: visible; |
|||
// height:calc(100% - 28px); |
|||
// top: 14px; |
|||
// right:14px |
|||
|
|||
::v-deep .el-drawer { |
|||
height: 100%; |
|||
overflow: visible; |
|||
box-shadow: 0 8px 10px -5px rgb(0 0 0 / 15%), 0 16px 24px 2px rgb(0 0 0 / 9%), 0 6px 30px 5px rgb(0 0 0 / 7%); |
|||
|
|||
.el-drawer__body { |
|||
width: 100%; |
|||
height: 100%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
.drawer-heder { |
|||
display: flex; |
|||
padding: 15px 10px; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
|
|||
.heder-left { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
|
|||
.heder-img { |
|||
width: 40px; |
|||
height: 40px; |
|||
margin-right: 10px; |
|||
} |
|||
|
|||
.header-text { |
|||
padding:0 20px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: space-between; |
|||
|
|||
span:nth-child(1) { |
|||
color: #333; |
|||
font-size: 22px; |
|||
} |
|||
|
|||
span:nth-child(2) { |
|||
color: #999; |
|||
font-size: 16px; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.Descriptions { |
|||
padding: 0 10px; |
|||
} |
|||
|
|||
.drawer-main { |
|||
// padding-top: 20px; |
|||
flex: 1; |
|||
overflow: hidden; |
|||
// background-color: #efefef; |
|||
padding: 10px 20px 20px 30px; |
|||
border-top: solid 5px #f6f6f6; |
|||
|
|||
.el-tabs { |
|||
height: 100%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
.el-tabs__header{ |
|||
// padding-bottom: 5px ; |
|||
.el-tabs__nav{ |
|||
z-index: auto !important; |
|||
} |
|||
} |
|||
|
|||
.el-tabs__content { |
|||
flex: 1; |
|||
|
|||
.el-tab-pane { |
|||
width: 100%; |
|||
height: 100%; |
|||
overflow-y: auto; |
|||
} |
|||
|
|||
.el-descriptions-item__label { |
|||
padding-right: 40px; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.drawer-Shut { |
|||
width: 35px; |
|||
height: 100px; |
|||
position: absolute; |
|||
top: 200px; |
|||
left: -35px; |
|||
|
|||
.el-button { |
|||
width: 100%; |
|||
height: 100%; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
|
|||
::v-deep span { |
|||
font-size: 12px; |
|||
letter-spacing: 10px; |
|||
writing-mode: tb-rl; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
::v-deep .el-tabs__nav-wrap::after{ |
|||
content: unset !important; |
|||
} |
|||
|
|||
.currenTabel-drawer-mx-header{ |
|||
text-align: right; |
|||
padding: 0 10px 10px 0; |
|||
} |
|||
|
|||
.detailFiltersPopPage{ |
|||
position: absolute; |
|||
right: 0; |
|||
left: 0; |
|||
height: 240px; |
|||
.fullPageCover{ |
|||
height: calc(100vh - 300px) !important; |
|||
} |
|||
} |
|||
Loading…
Reference in new issue