|
|
|
@ -1,12 +1,13 @@ |
|
|
|
<template> |
|
|
|
<el-drawer v-model="isShowDrawer" title="详情" direction="rtl" size="80%" v-loading="detailLoading" > |
|
|
|
<el-drawer v-model="isShowDrawer" title="详情" direction="rtl" size="80%" v-loading="detailLoading"> |
|
|
|
<template #header> |
|
|
|
<div class="font-size-18px"> |
|
|
|
{{ titleValueRef }} <span class="ml-20px font-size-16px">{{ titleNameRef }}</span> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<ContentWrap v-if="!isBasic"> |
|
|
|
<Descriptions :data="detailData" labelClassName="label-class-name" label-align="left" direction="vertical" :column="8" :schema="allSchemas.detailSchema" :columns="2" width="200px"/> |
|
|
|
<Descriptions :data="detailData" labelClassName="label-class-name" label-align="left" direction="vertical" |
|
|
|
:column="8" :schema="allSchemas.detailSchema" :columns="2" width="200px" /> |
|
|
|
</ContentWrap> |
|
|
|
<Tabs :tabsList="tabsList" :current="current" @change="change" /> |
|
|
|
<div class="flex" v-if="current == 0"> |
|
|
|
@ -18,20 +19,16 @@ |
|
|
|
<!-- 附件组件 --> |
|
|
|
<Annex :data="annexData" @handleImport="handleImport" @deleteAnnex="deleteAnnexSuccess" /> |
|
|
|
<!-- 备注组件 --> |
|
|
|
<Remarks :data="remarksData" class="mt-20px" @submitSucss="remarksSubmitSucss" /> |
|
|
|
<Remarks :remarksData="remarksData" class="mt-20px" |
|
|
|
@remarksSubmitScuess="remarksSubmitScuess" /> |
|
|
|
<!-- 变更记录组件 --> |
|
|
|
<ChangeRecord :data="changeRecordData" class="mt-20px" /> |
|
|
|
</ContentWrap> |
|
|
|
</div> |
|
|
|
<ContentWrap v-else> |
|
|
|
<Table |
|
|
|
:columns="allSchemas.tableColumns" |
|
|
|
:data="tableObject.tableList" |
|
|
|
:loading="tableObject.loading" |
|
|
|
:pagination="{total: tableObject.total}" |
|
|
|
v-model:pageSize="tableObject.pageSize" |
|
|
|
v-model:currentPage="tableObject.currentPage" |
|
|
|
/> |
|
|
|
<Table :columns="allSchemas.tableColumns" :data="tableObject.tableList" :loading="tableObject.loading" |
|
|
|
:pagination="{ total: tableObject.total }" v-model:pageSize="tableObject.pageSize" |
|
|
|
v-model:currentPage="tableObject.currentPage" /> |
|
|
|
</ContentWrap> |
|
|
|
</el-drawer> |
|
|
|
</template> |
|
|
|
@ -41,7 +38,8 @@ import Annex from '@/components/Annex/src/Annex.vue' |
|
|
|
import Remarks from '@/components/Remarks/src/Remarks.vue' |
|
|
|
import ChangeRecord from '@/components/ChangeRecord/src/ChangeRecord.vue' |
|
|
|
import Tabs from '@/components/Tabs/src/Tabs.vue' |
|
|
|
import * as ItembasicApi from '@/api/wms/itembasic' |
|
|
|
import * as DetailApi from '@/api/wms/detail' |
|
|
|
|
|
|
|
|
|
|
|
defineOptions({ name: 'Detail' }) |
|
|
|
|
|
|
|
@ -64,29 +62,15 @@ const props = defineProps({ |
|
|
|
required: true, |
|
|
|
default: null |
|
|
|
}, |
|
|
|
// // 可以导入的文件类型 |
|
|
|
// accept: { |
|
|
|
// type: String, |
|
|
|
// required: false, |
|
|
|
// default:'.xlsx,.xls' |
|
|
|
// }, |
|
|
|
// // 是否更新已经存在的用户数据.默认值是1 |
|
|
|
// mode: { |
|
|
|
// type: Number, |
|
|
|
// required: false, |
|
|
|
// default: 1 |
|
|
|
// }, |
|
|
|
// url:{ |
|
|
|
// type: String, |
|
|
|
// required: false, |
|
|
|
// } |
|
|
|
}) |
|
|
|
|
|
|
|
const isShowDrawer = ref(false) |
|
|
|
|
|
|
|
const tabsList = ref(JSON.parse(JSON.stringify(props.tabs?props.tabs:''))) |
|
|
|
const detailLoading = ref(false) |
|
|
|
|
|
|
|
const tabsList = ref(JSON.parse(JSON.stringify(props.tabs ? props.tabs : ''))) |
|
|
|
|
|
|
|
if (tabsList.value&& tabsList.value.length>0) { |
|
|
|
if (tabsList.value && tabsList.value.length > 0) { |
|
|
|
tabsList.value.unshift({ |
|
|
|
label: '详情', |
|
|
|
prop: 'Detail' |
|
|
|
@ -112,17 +96,11 @@ const annexData = reactive({ |
|
|
|
time: '2022年12月12日 17:16:00', |
|
|
|
}] |
|
|
|
}) |
|
|
|
// 备注默认数据 |
|
|
|
|
|
|
|
// 备注数据 |
|
|
|
const remarksData = reactive({ |
|
|
|
remarksList: [{ |
|
|
|
name: '诸葛亮', |
|
|
|
text: '转朱阁，低绮户，照无眠。不应有恨，何事长向别时圆？人有悲欢离合，月有阴晴圆缺，此事古难全。但愿人长久，千里共婵娟。', |
|
|
|
time: '2023年5月6日 17:16:00', |
|
|
|
}, { |
|
|
|
name: '刘备', |
|
|
|
text: '转朱阁，低绮户，照无眠。不应有恨，何事长向别时圆？人有悲欢离合，月有阴晴圆缺，此事古难全。但愿人长久，千里共婵娟。', |
|
|
|
time: '2022年12月12日 17:16:00', |
|
|
|
}] |
|
|
|
remarksList: [], |
|
|
|
data:{} |
|
|
|
}) |
|
|
|
|
|
|
|
// 变更记录默认数据 |
|
|
|
@ -151,13 +129,10 @@ const changeRecordData = reactive({ |
|
|
|
const detailData = ref("")//详情数据 |
|
|
|
|
|
|
|
// 导入成功之后 |
|
|
|
const importSuccess = () => { |
|
|
|
const importSuccess = () => {} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
/** 搜索按钮操作 */ |
|
|
|
const handleQuery = () => { |
|
|
|
|
|
|
|
importFormRef.value.open() |
|
|
|
} |
|
|
|
|
|
|
|
@ -176,64 +151,68 @@ const handleImport = () => { |
|
|
|
const deleteAnnexSuccess = async () => { |
|
|
|
console.log('删除成功'); |
|
|
|
} |
|
|
|
// 备注提交成功之后 |
|
|
|
const remarksSubmitSucss = () => { |
|
|
|
console.log('提交成功'); |
|
|
|
} |
|
|
|
// 供应商物品数据 |
|
|
|
// const supplierItems = reactive({ |
|
|
|
// supplierItemsList: [{ |
|
|
|
// code: '646456', |
|
|
|
// name: '978978' |
|
|
|
// }], |
|
|
|
// total: 20, |
|
|
|
// pageSize: 1, |
|
|
|
// currentPage: 2 |
|
|
|
// }) |
|
|
|
|
|
|
|
|
|
|
|
// Tabs当前选择 |
|
|
|
const current = ref(0) |
|
|
|
const detailLoading = ref(false) |
|
|
|
// 获取表格数据 |
|
|
|
const { tableObject, tableMethods } = useTable({ |
|
|
|
getListApi: ItembasicApi.getItembasicPage // 分页接口 |
|
|
|
}) |
|
|
|
const change = (item, index) => { |
|
|
|
current.value = index |
|
|
|
} |
|
|
|
|
|
|
|
// 获得表格的各种操作 |
|
|
|
const { getList } = tableMethods |
|
|
|
getList() |
|
|
|
|
|
|
|
|
|
|
|
/** 打开弹窗 */ |
|
|
|
const titleNameRef = ref() |
|
|
|
const titleValueRef = ref() |
|
|
|
const openDetail = async (row: any, titleName: any, titleValue: any) => { |
|
|
|
const openDetail = async (row: any, titleName: any, titleValue: any, tableName: any) => { |
|
|
|
titleNameRef.value = titleName |
|
|
|
titleValueRef.value = titleValue |
|
|
|
remarksData.data = { |
|
|
|
tableId: row.id, |
|
|
|
tableName: tableName, |
|
|
|
} |
|
|
|
isShowDrawer.value = true |
|
|
|
console.log(216, row) |
|
|
|
if (row) { |
|
|
|
detailLoading.value = true |
|
|
|
try { |
|
|
|
// detailData.value = await ItembasicApi.getItembasic(id) |
|
|
|
detailData.value = row |
|
|
|
console.log(detailData.value); |
|
|
|
getRemarkList() |
|
|
|
getChangeRecordList() |
|
|
|
|
|
|
|
} finally { |
|
|
|
detailLoading.value = false |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
defineExpose({ openDetail }) // 提供 open 方法，用于打开弹窗 |
|
|
|
|
|
|
|
// 获取备注列表 |
|
|
|
const getRemarkList = async () => { |
|
|
|
detailLoading.value = true |
|
|
|
try { |
|
|
|
remarksData.remarksList = await DetailApi.getRemarkPage(remarksData.data) |
|
|
|
} finally { |
|
|
|
detailLoading.value = false |
|
|
|
} |
|
|
|
} |
|
|
|
// 备注提交成功之后 |
|
|
|
const remarksSubmitScuess = async (remark) => { |
|
|
|
detailLoading.value = false |
|
|
|
getRemarkList() |
|
|
|
getChangeRecordList() |
|
|
|
} |
|
|
|
// 获取变更记录 |
|
|
|
const getChangeRecordList = async () => { |
|
|
|
remarksData.remarksList = await DetailApi.getChangeRecordPage(remarksData.data) |
|
|
|
} |
|
|
|
</script> |
|
|
|
<style lang="scss"> |
|
|
|
.el-drawer__body{ |
|
|
|
background: #f5f5f5!important; |
|
|
|
} |
|
|
|
::v-deep(.label-class-name){ |
|
|
|
color: #dedede; |
|
|
|
} |
|
|
|
</style> |
|
|
|
<style scoped lang="scss"> |
|
|
|
.el-drawer__body { |
|
|
|
background: #f5f5f5 !important; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep(.label-class-name) { |
|
|
|
color: #dedede; |
|
|
|
} |
|
|
|
</style> |
|
|
|
<style scoped lang="scss"></style> |
|
|
|
|
zhangli
1 year ago