|
@ -28,7 +28,16 @@ |
|
|
<Tabs ref="tabRef" :tabsList="tabsList" :current="current" @change="change" /> |
|
|
<Tabs ref="tabRef" :tabsList="tabsList" :current="current" @change="change" /> |
|
|
<div class="flex"> |
|
|
<div class="flex"> |
|
|
<!-- 详情 --> |
|
|
<!-- 详情 --> |
|
|
<ContentWrap class="w-[100%]" v-show="tabsList[current].label!=annexAliasLabel&&tabsList[current].label!='备注'&&tabsList[current].label!='变更记录'&&!annexTableData.some(item=>item.label==tabsList[current].label)"> <!-- 列表头部 --> |
|
|
<ContentWrap |
|
|
|
|
|
class="w-[100%]" |
|
|
|
|
|
v-show=" |
|
|
|
|
|
tabsList[current].label != annexAliasLabel && |
|
|
|
|
|
tabsList[current].label != '备注' && |
|
|
|
|
|
tabsList[current].label != '变更记录' && |
|
|
|
|
|
!annexTableData.some((item) => item.label == tabsList[current].label) |
|
|
|
|
|
" |
|
|
|
|
|
> |
|
|
|
|
|
<!-- 列表头部 --> |
|
|
<TableHead |
|
|
<TableHead |
|
|
v-if="!isBasic" |
|
|
v-if="!isBasic" |
|
|
:HeadButttondata="HeadButttondata" |
|
|
:HeadButttondata="HeadButttondata" |
|
@ -72,7 +81,14 @@ |
|
|
v-model:currentPage="tableObjectRef.currentPage" |
|
|
v-model:currentPage="tableObjectRef.currentPage" |
|
|
> |
|
|
> |
|
|
<template #photos="{ row }"> |
|
|
<template #photos="{ row }"> |
|
|
<div v-for="(item,index) in row.photos.split(',')" :key="index" style="color:#409eff ; cursor: pointer;" @click="openImage(item)">{{ item }}</div> </template> |
|
|
<div |
|
|
|
|
|
v-for="(item, index) in row.photos.split(',')" |
|
|
|
|
|
:key="index" |
|
|
|
|
|
style="color: #409eff; cursor: pointer" |
|
|
|
|
|
@click="openImage(item)" |
|
|
|
|
|
>{{ item }}</div |
|
|
|
|
|
> |
|
|
|
|
|
</template> |
|
|
<template #action="{ row }"> |
|
|
<template #action="{ row }"> |
|
|
<ButtonBase |
|
|
<ButtonBase |
|
|
:Butttondata="buttondata" |
|
|
:Butttondata="buttondata" |
|
@ -97,10 +113,20 @@ |
|
|
</DetailTable> |
|
|
</DetailTable> |
|
|
</ContentWrap> |
|
|
</ContentWrap> |
|
|
<!-- other附件组件:如质检明细 --> |
|
|
<!-- other附件组件:如质检明细 --> |
|
|
<div v-for="(annexItem ,index) in annexTableData" :key="index" v-show="annexItem.label==tabsList[current].label" class="w-[100%]" :style="{height:annexItem.hasSubDetail?'100%':remarkHeight+'px'}"> |
|
|
<div |
|
|
|
|
|
v-for="(annexItem, index) in annexTableData" |
|
|
|
|
|
:key="index" |
|
|
|
|
|
v-show="annexItem.label == tabsList[current].label" |
|
|
|
|
|
class="w-[100%]" |
|
|
|
|
|
:style="{ height: annexItem.hasSubDetail ? '100%' : remarkHeight + 'px' }" |
|
|
|
|
|
> |
|
|
<ContentWrap class="w-[100%]"> |
|
|
<ContentWrap class="w-[100%]"> |
|
|
<ElScrollbar ref="scrollbar" :style="{height:annexItem.hasSubDetail?'100%':(remarkHeight-40)+'px'}"> |
|
|
<ElScrollbar |
|
|
<Annex v-show="tabsList[current].label==annexItem.label" |
|
|
ref="scrollbar" |
|
|
|
|
|
:style="{ height: annexItem.hasSubDetail ? '100%' : remarkHeight - 40 + 'px' }" |
|
|
|
|
|
> |
|
|
|
|
|
<Annex |
|
|
|
|
|
v-show="tabsList[current].label == annexItem.label" |
|
|
:annexData="annexItem" |
|
|
:annexData="annexItem" |
|
|
@handleAnnexSuccess="updateAnnexTableHandle" |
|
|
@handleAnnexSuccess="updateAnnexTableHandle" |
|
|
@deleteAnnexSuccess="updateAnnexTableHandle" |
|
|
@deleteAnnexSuccess="updateAnnexTableHandle" |
|
@ -120,13 +146,21 @@ |
|
|
v-model:currentPage="tableObjectRef.currentPage" |
|
|
v-model:currentPage="tableObjectRef.currentPage" |
|
|
/> |
|
|
/> |
|
|
</ContentWrap> |
|
|
</ContentWrap> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
<!-- 附件/备注/变更记录 --> |
|
|
<!-- 附件/备注/变更记录 --> |
|
|
<ContentWrap class="w-[100%]" v-show="tabsList[current].label==annexAliasLabel||tabsList[current].label=='备注'||tabsList[current].label=='变更记录'" :style="{height:remarkHeight+'px'}"> |
|
|
<ContentWrap |
|
|
|
|
|
class="w-[100%]" |
|
|
|
|
|
v-show=" |
|
|
|
|
|
tabsList[current].label == annexAliasLabel || |
|
|
|
|
|
tabsList[current].label == '备注' || |
|
|
|
|
|
tabsList[current].label == '变更记录' |
|
|
|
|
|
" |
|
|
|
|
|
:style="{ height: remarkHeight + 'px' }" |
|
|
|
|
|
> |
|
|
<!-- 附件组件 --> |
|
|
<!-- 附件组件 --> |
|
|
<ElScrollbar ref="scrollbar" :style="{height:(remarkHeight-40)+'px'}"> |
|
|
<ElScrollbar ref="scrollbar" :style="{ height: remarkHeight - 40 + 'px' }"> |
|
|
<Annex v-show="tabsList[current].label==annexAliasLabel" |
|
|
<Annex |
|
|
|
|
|
v-show="tabsList[current].label == annexAliasLabel" |
|
|
:annexData="annexData" |
|
|
:annexData="annexData" |
|
|
@handleAnnexSuccess="handleAnnexSuccess" |
|
|
@handleAnnexSuccess="handleAnnexSuccess" |
|
|
@deleteAnnexSuccess="deleteAnnexSuccess" |
|
|
@deleteAnnexSuccess="deleteAnnexSuccess" |
|
@ -134,14 +168,20 @@ |
|
|
:key="count" |
|
|
:key="count" |
|
|
/> |
|
|
/> |
|
|
<!-- 备注组件 --> |
|
|
<!-- 备注组件 --> |
|
|
<Remarks v-show="tabsList[current].label=='备注'" |
|
|
<Remarks |
|
|
|
|
|
v-show="tabsList[current].label == '备注'" |
|
|
:remarksData="remarksData" |
|
|
:remarksData="remarksData" |
|
|
class="mt-20px" |
|
|
class="mt-20px" |
|
|
@remarksSubmitScuess="remarksSubmitScuess" |
|
|
@remarksSubmitScuess="remarksSubmitScuess" |
|
|
:key="count" |
|
|
:key="count" |
|
|
/> |
|
|
/> |
|
|
<!-- 变更记录组件 --> |
|
|
<!-- 变更记录组件 --> |
|
|
<ChangeRecord v-show="tabsList[current].label=='变更记录'" :changeRecordData="changeRecordData" class="mt-20px" :key="count"/> |
|
|
<ChangeRecord |
|
|
|
|
|
v-show="tabsList[current].label == '变更记录'" |
|
|
|
|
|
:changeRecordData="changeRecordData" |
|
|
|
|
|
class="mt-20px" |
|
|
|
|
|
:key="count" |
|
|
|
|
|
/> |
|
|
</ElScrollbar> |
|
|
</ElScrollbar> |
|
|
</ContentWrap> |
|
|
</ContentWrap> |
|
|
</div> |
|
|
</div> |
|
@ -173,7 +213,6 @@ |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script lang="ts" setup> |
|
|
<script lang="ts" setup> |
|
|
|
|
|
|
|
|
import Annex from '@/components/Annex/src/Annex.vue' |
|
|
import Annex from '@/components/Annex/src/Annex.vue' |
|
|
import Remarks from '@/components/Remarks/src/Remarks.vue' |
|
|
import Remarks from '@/components/Remarks/src/Remarks.vue' |
|
|
import ChangeRecord from '@/components/ChangeRecord/src/ChangeRecord.vue' |
|
|
import ChangeRecord from '@/components/ChangeRecord/src/ChangeRecord.vue' |
|
@ -185,7 +224,7 @@ import BasicForm from '@/components/BasicForm/src/BasicForm.vue' |
|
|
import TableHead from '@/components/TableHead/src/TableHead.vue' |
|
|
import TableHead from '@/components/TableHead/src/TableHead.vue' |
|
|
import DetailTable from '@/components/DetailTable/src/DetailTable.vue' |
|
|
import DetailTable from '@/components/DetailTable/src/DetailTable.vue' |
|
|
import { SearchTable } from '@/components/SearchTable' |
|
|
import { SearchTable } from '@/components/SearchTable' |
|
|
import {defaultFreshBtn} from "@/utils/disposition/defaultButtons"; |
|
|
import { defaultFreshBtn } from '@/utils/disposition/defaultButtons' |
|
|
|
|
|
|
|
|
defineOptions({ name: 'Detail' }) |
|
|
defineOptions({ name: 'Detail' }) |
|
|
|
|
|
|
|
@ -331,19 +370,19 @@ const props = defineProps({ |
|
|
detailButtonIsShowAdd: { |
|
|
detailButtonIsShowAdd: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
required: false, |
|
|
required: false, |
|
|
default: true |
|
|
default: false |
|
|
}, |
|
|
}, |
|
|
// 子列表 编辑 展示与隐藏 ,默认展示 |
|
|
// 子列表 编辑 展示与隐藏 ,默认展示 |
|
|
detailButtonIsShowEdit: { |
|
|
detailButtonIsShowEdit: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
required: false, |
|
|
required: false, |
|
|
default: true |
|
|
default: false |
|
|
}, |
|
|
}, |
|
|
// 子列表 删除 展示与隐藏 ,默认展示 |
|
|
// 子列表 删除 展示与隐藏 ,默认展示 |
|
|
detailButtonIsShowDelete: { |
|
|
detailButtonIsShowDelete: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
required: false, |
|
|
required: false, |
|
|
default: true |
|
|
default: false |
|
|
}, |
|
|
}, |
|
|
//是否直接展示搜索表单 |
|
|
//是否直接展示搜索表单 |
|
|
isOpenSearchTable: { |
|
|
isOpenSearchTable: { |
|
@ -381,19 +420,24 @@ if (props.isBasic == true) { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
const otherList = [...props.annexTable,{ |
|
|
const otherList = [ |
|
|
|
|
|
...props.annexTable, |
|
|
|
|
|
{ |
|
|
label: props.annexAliasLabel, |
|
|
label: props.annexAliasLabel, |
|
|
prop: 'Annex' |
|
|
prop: 'Annex' |
|
|
},{ |
|
|
}, |
|
|
|
|
|
{ |
|
|
label: '备注', |
|
|
label: '备注', |
|
|
prop: 'Remarks' |
|
|
prop: 'Remarks' |
|
|
},{ |
|
|
}, |
|
|
|
|
|
{ |
|
|
label: '变更记录', |
|
|
label: '变更记录', |
|
|
prop: 'ChangeRecord' |
|
|
prop: 'ChangeRecord' |
|
|
}] |
|
|
} |
|
|
|
|
|
] |
|
|
tabsList.value = [...tabsList?.value, ...otherList] |
|
|
tabsList.value = [...tabsList?.value, ...otherList] |
|
|
|
|
|
|
|
|
if (!tabsList.value || tabsList.value && tabsList.value.length == otherList.length) { |
|
|
if (!tabsList.value || (tabsList.value && tabsList.value.length == otherList.length)) { |
|
|
tabsList.value.unshift({ |
|
|
tabsList.value.unshift({ |
|
|
label: '明细', |
|
|
label: '明细', |
|
|
prop: 'Detail' |
|
|
prop: 'Detail' |
|
@ -409,11 +453,10 @@ const remarkHeight = computed(() => { |
|
|
const tab = unref(tabRef) |
|
|
const tab = unref(tabRef) |
|
|
const tabTop = tab?.$el.getBoundingClientRect().top |
|
|
const tabTop = tab?.$el.getBoundingClientRect().top |
|
|
const tabHeight = tab?.$el.getBoundingClientRect().height |
|
|
const tabHeight = tab?.$el.getBoundingClientRect().height |
|
|
const height = window.innerHeight - (tabTop) - (tabHeight) - 60 |
|
|
const height = window.innerHeight - tabTop - tabHeight - 60 |
|
|
return height |
|
|
return height |
|
|
}) |
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 附件默认数据 |
|
|
// 附件默认数据 |
|
|
const annexData = reactive({ |
|
|
const annexData = reactive({ |
|
|
annexList: [] |
|
|
annexList: [] |
|
@ -446,7 +489,7 @@ const getAnnexFileList = async (row:id) => { |
|
|
props.annexTable?.forEach(async (item) => { |
|
|
props.annexTable?.forEach(async (item) => { |
|
|
let requstData = { ...remarksData.data, tableName: item?.tableName } |
|
|
let requstData = { ...remarksData.data, tableName: item?.tableName } |
|
|
const annexList = await FileApi.getFileList(requstData) |
|
|
const annexList = await FileApi.getFileList(requstData) |
|
|
const annexData = annexTableData.value.find(annex=>annex.label === item.label) |
|
|
const annexData = annexTableData.value.find((annex) => annex.label === item.label) |
|
|
if (annexData) { |
|
|
if (annexData) { |
|
|
annexData.annexList = annexList |
|
|
annexData.annexList = annexList |
|
|
} else { |
|
|
} else { |
|
@ -464,9 +507,9 @@ const getAnnexFileList = async (row:id) => { |
|
|
}) |
|
|
}) |
|
|
const { getList: getSubList } = subTableMethods |
|
|
const { getList: getSubList } = subTableMethods |
|
|
subTableObject.params = {} |
|
|
subTableObject.params = {} |
|
|
item.subDetailTableData.queryParams.forEach(queryItem => { |
|
|
item.subDetailTableData.queryParams.forEach((queryItem) => { |
|
|
subTableObject.params[queryItem.queryField] = row[queryItem.rowField] |
|
|
subTableObject.params[queryItem.queryField] = row[queryItem.rowField] |
|
|
}); |
|
|
}) |
|
|
await getSubList() |
|
|
await getSubList() |
|
|
item.subDetailTableData.tableList = subTableObject.tableList |
|
|
item.subDetailTableData.tableList = subTableObject.tableList |
|
|
annexItem.subDetailTableData.tableList |
|
|
annexItem.subDetailTableData.tableList |
|
@ -495,11 +538,10 @@ const current = ref(0) |
|
|
const change = (item, index) => { |
|
|
const change = (item, index) => { |
|
|
current.value = index |
|
|
current.value = index |
|
|
emit('changeTabs', item) |
|
|
emit('changeTabs', item) |
|
|
if(otherList.find(other=>other.label==item.label)){ |
|
|
if (otherList.find((other) => other.label == item.label)) { |
|
|
// 附件/备注/变更记录 -- 点击回到顶部 |
|
|
// 附件/备注/变更记录 -- 点击回到顶部 |
|
|
scrollbar.value.scrollTo({ top: 0}); |
|
|
scrollbar.value.scrollTo({ top: 0 }) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
//主表所需的参数 |
|
|
//主表所需的参数 |
|
@ -533,7 +575,10 @@ const searchTableRef = ref() |
|
|
// 如果需要直接打开表格数据表单数据 |
|
|
// 如果需要直接打开表格数据表单数据 |
|
|
const searchTableFormModel = ref<Recordable>({}) |
|
|
const searchTableFormModel = ref<Recordable>({}) |
|
|
if (props.isOpenSearchTable) { |
|
|
if (props.isOpenSearchTable) { |
|
|
searchTableFormModel.value = initModel(props.detailAllSchemas.formSchema, unref(searchTableFormModel)) |
|
|
searchTableFormModel.value = initModel( |
|
|
|
|
|
props.detailAllSchemas.formSchema, |
|
|
|
|
|
unref(searchTableFormModel) |
|
|
|
|
|
) |
|
|
} |
|
|
} |
|
|
const searchTableFormType = ref('') // 表单的类型:create - 新增;update - 修改 |
|
|
const searchTableFormType = ref('') // 表单的类型:create - 新增;update - 修改 |
|
|
|
|
|
|
|
@ -576,9 +621,7 @@ const openDetail = async (row: any, titleName: any, titleValue: any, tableName: |
|
|
let detailButtonAdd: any = [] |
|
|
let detailButtonAdd: any = [] |
|
|
if (props.detailButtonIsShowFilter) { |
|
|
if (props.detailButtonIsShowFilter) { |
|
|
// 筛选 |
|
|
// 筛选 |
|
|
detailButtonFilter = [ |
|
|
detailButtonFilter = [defaultButtons.defaultFilterBtn(null)] |
|
|
defaultButtons.defaultFilterBtn(null) |
|
|
|
|
|
] |
|
|
|
|
|
} |
|
|
} |
|
|
if (props.detailButtonIsShowAdd) { |
|
|
if (props.detailButtonIsShowAdd) { |
|
|
// 新增 |
|
|
// 新增 |
|
@ -588,9 +631,7 @@ const openDetail = async (row: any, titleName: any, titleValue: any, tableName: |
|
|
}) |
|
|
}) |
|
|
] |
|
|
] |
|
|
} |
|
|
} |
|
|
let detailButtonRefresh = [ |
|
|
let detailButtonRefresh = [defaultButtons.defaultFreshBtn(null)] |
|
|
defaultButtons.defaultFreshBtn(null) |
|
|
|
|
|
] |
|
|
|
|
|
HeadButttondata.value = [...detailButtonFilter, ...detailButtonAdd, ...detailButtonRefresh] |
|
|
HeadButttondata.value = [...detailButtonFilter, ...detailButtonAdd, ...detailButtonRefresh] |
|
|
|
|
|
|
|
|
// 针对特殊处理 当业务是任务的 只显示筛选 正常情况下应在业务页面设置 后期再作优化 |
|
|
// 针对特殊处理 当业务是任务的 只显示筛选 正常情况下应在业务页面设置 后期再作优化 |
|
@ -619,7 +660,6 @@ const openDetail = async (row: any, titleName: any, titleValue: any, tableName: |
|
|
] |
|
|
] |
|
|
} |
|
|
} |
|
|
buttondata.value = [...detailButtonEdit, ...detailButtonDelete, ...props.buttondataTable] |
|
|
buttondata.value = [...detailButtonEdit, ...detailButtonDelete, ...props.buttondataTable] |
|
|
|
|
|
|
|
|
} finally { |
|
|
} finally { |
|
|
detailLoading.value = false |
|
|
detailLoading.value = false |
|
|
} |
|
|
} |
|
@ -684,13 +724,15 @@ const buttonBaseClick = (val, item) => { |
|
|
}) |
|
|
}) |
|
|
const item = props.detailAllSchemas.formSchema[0] |
|
|
const item = props.detailAllSchemas.formSchema[0] |
|
|
opensearchTable( |
|
|
opensearchTable( |
|
|
item.field, item?.componentProps?.searchField, |
|
|
item.field, |
|
|
|
|
|
item?.componentProps?.searchField, |
|
|
item?.componentProps?.searchTitle, |
|
|
item?.componentProps?.searchTitle, |
|
|
item?.componentProps?.searchAllSchemas, |
|
|
item?.componentProps?.searchAllSchemas, |
|
|
item?.componentProps?.searchPage, |
|
|
item?.componentProps?.searchPage, |
|
|
item?.componentProps?.searchCondition, |
|
|
item?.componentProps?.searchCondition, |
|
|
item?.componentProps?.multiple, |
|
|
item?.componentProps?.multiple, |
|
|
undefined,undefined |
|
|
undefined, |
|
|
|
|
|
undefined |
|
|
) |
|
|
) |
|
|
} else { |
|
|
} else { |
|
|
openForm('create') |
|
|
openForm('create') |
|
@ -769,13 +811,15 @@ const buttonTableClick = async (val, row) => { |
|
|
} |
|
|
} |
|
|
const item = props.detailAllSchemas.formSchema[0] |
|
|
const item = props.detailAllSchemas.formSchema[0] |
|
|
opensearchTable( |
|
|
opensearchTable( |
|
|
item.field, item?.componentProps?.searchField, |
|
|
item.field, |
|
|
|
|
|
item?.componentProps?.searchField, |
|
|
item?.componentProps?.searchTitle, |
|
|
item?.componentProps?.searchTitle, |
|
|
item?.componentProps?.searchAllSchemas, |
|
|
item?.componentProps?.searchAllSchemas, |
|
|
item?.componentProps?.searchPage, |
|
|
item?.componentProps?.searchPage, |
|
|
item?.componentProps?.searchCondition, |
|
|
item?.componentProps?.searchCondition, |
|
|
item?.componentProps?.multiple, |
|
|
item?.componentProps?.multiple, |
|
|
undefined,undefined |
|
|
undefined, |
|
|
|
|
|
undefined |
|
|
) |
|
|
) |
|
|
} else { |
|
|
} else { |
|
|
openForm('update', row) |
|
|
openForm('update', row) |
|
@ -815,9 +859,8 @@ const submitForm = async (formType, data) => { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const searchTableSuccess1 = (formField, searchField, val, formRef) => { |
|
|
const searchTableSuccess1 = (formField, searchField, val, formRef) => { |
|
|
searchTableFormModel.value[formField] = val.map(item=>item[searchField]).join(',') |
|
|
searchTableFormModel.value[formField] = val.map((item) => item[searchField]).join(',') |
|
|
submitForm(searchTableFormType.value, searchTableFormModel.value) |
|
|
submitForm(searchTableFormType.value, searchTableFormModel.value) |
|
|
emit('searchTableSuccessDetail', formField, searchField, val, formRef) |
|
|
emit('searchTableSuccessDetail', formField, searchField, val, formRef) |
|
|
} |
|
|
} |
|
@ -920,7 +963,7 @@ watch( |
|
|
tableObject.params.schedulingCode = masterParmas.value.schedulingCode |
|
|
tableObject.params.schedulingCode = masterParmas.value.schedulingCode |
|
|
detailAllSchemasRef.value = props.detailAllSchemas |
|
|
detailAllSchemasRef.value = props.detailAllSchemas |
|
|
if (props.tableObjectExtend) { |
|
|
if (props.tableObjectExtend) { |
|
|
props.tableObjectExtend.forEach(item => { |
|
|
props.tableObjectExtend.forEach((item) => { |
|
|
tableObject.params[item.key] = item.value |
|
|
tableObject.params[item.key] = item.value |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|