<template>
|
<div style="width: 100%;">
|
<h2>虚拟工单详情</h2>
|
<el-descriptions direction="horizontal" :column="2" label-width="120px" border size="small">
|
<el-descriptions-item
|
label="标题"
|
label-align="right"
|
align="left"
|
width="38vw"
|
>
|
{{ state.formData?.title }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="产品名称"
|
label-align="right"
|
align="left"
|
width="38vw"
|
>
|
{{ state.formData?.productionName }}
|
</el-descriptions-item>
|
<el-descriptions-item label="当前版本" label-align="right" align="left" width="40vw" >
|
{{ state.formData?.versions }}
|
</el-descriptions-item>
|
<el-descriptions-item label="产品模块" label-align="right" align="left" width="40vw" >
|
{{ state.formData?.productModule }}
|
</el-descriptions-item>
|
<el-descriptions-item label="需求/问题截图" label-align="right" align="left" >
|
<div v-for="item in state.formData.imageList" :key="item.fileId">
|
<el-image
|
style="
|
position: relative;
|
width: 100px;
|
height: 100px;
|
cursor: pointer;
|
"
|
:src="item.fileUrl"
|
:preview-teleported="true"
|
:preview-src-list="[item.fileUrl]"
|
>
|
</el-image>
|
</div>
|
</el-descriptions-item>
|
<el-descriptions-item label="视频/其它附件" label-align="right" align="left" >
|
{{ state.formData?.ownershipName}}
|
</el-descriptions-item>
|
<el-descriptions-item label="问题详细描述" label-align="right" align="left" >
|
{{ state.formData?.statusName}}
|
</el-descriptions-item>
|
</el-descriptions>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import productApi from '@/api/zhongjian/productApi'
|
const state = reactive<any>({
|
formData: {
|
name: '', // 方案名称
|
describe: '', // 方案描述
|
scopeId: '', //
|
industrialChainId: '', // 行业领域id
|
industrialChainName: '', // 行业领域
|
industrialChainIdList: [], // 行业领域idList
|
industrialChainNameList: [], // 行业领域nameList
|
importantAreaId: '', // 单位工程id
|
importantAreaName: '', // 单位工程
|
importantAreaIdList: [], // 单位工程idList
|
importantAreaNameList: [], // 单位工程nameList
|
businessProcessId: '', // 产业阶段id
|
businessProcessName: '', // 产业阶段name
|
sceneId: '', // 场景方向Id
|
probationType: '', // 软件类型
|
probationMedia: '', // 文件ID或试用地址URL
|
probationTypeId: '', // 软件类型id
|
typeName: '', // 产品父类类型name
|
typeId: '', // 产品父类类型id
|
typeChildName: '', // 产品类型子类name
|
typeChildId: '', // 产品类型子类id
|
lookName: '', // 查看方式name
|
lookId: '', // 查看方式id
|
homeImage: '', // 宣传图id
|
quotationSystemId: '', //上传文件
|
},
|
})
|
|
const getDetailInfo = (id:string) => {
|
productApi
|
.getProductDetail({
|
id:id,
|
})
|
.then((res: any) => {
|
if (res.code == 200) {
|
state.formData = res.data
|
}
|
})
|
}
|
defineExpose({
|
getDetailInfo
|
});
|
</script>
|
<style scoped lang="scss">
|
.viewbox-cont {
|
margin-bottom: 10px;
|
margin-top: 10px;
|
h2 {
|
padding: 5px 15px;
|
background-color: #dce6f4;
|
color: #656d9a;
|
font-size: 14px;
|
}
|
}
|
</style>
|
|
