hi-ucs/front/src/views/personalCenter/components/OtherApplications .vue

230 lines
6.2 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!--
* @Author: hisense.liangjunhua
* @Date: 2022-07-12 09:42:44
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-07-14 14:50:30
* @Description:我的申请 能力申请 查看详情
-->
<template>
<div class="top">
<!-- <div class="title">基本信息</div>
<div class="main">
<div>
<p class="item">
<span>申请标题{{ title }}</span>
<span>申请单号{{ applyNumber || '--' }}</span>
<span>应用系统{{ applicationSystem }}</span>
</p>
<p class="item">
<span>申请人信息{{ user }}</span>
<span>电话{{ phone }}</span>
<span>单位{{ unit }}</span>
</p>
<p>
<span>应用场景{{}}</span>
</p>
<p>
<span>应用背景{{ applicationBackground }}</span>
</p>
<p>
<span>期望效果{{ effectWish }}</span>
</p>
<p v-if="props.refObj.enclosure">
<span>
申请单附件
<span class="enclosure">
{{ enclosureName || '--' }}
<span class="btn">预览</span>
</span>
</span>
</p>
</div>
</div> -->
</div>
</template>
<script setup>
import { ref, defineProps } from 'vue'
const props = defineProps({
refObj: { type: Object, default: null },
})
console.log(props.refObj, '=====================================')
// if (props.refObj.resourceApplication) {
// showArr.value = []
// for (const key in props.refObj.resourceApplication) {
// if (props.refObj.resourceApplication[key].length > 0) {
// let obj = { name: '', instanceId: '', list: [], list2: [] }
// obj.name = key
// props.refObj.resourceApplication[key].map((item) => {
// obj.instanceId = item.instanceId
// if (item.resources.length > 0) {
// item.resources.map((val) => {
// obj.list.push(val)
// })
// } else {
// item.camera.map((val) => {
// obj.list2.push(val)
// })
// }
// })
// showArr.value.push(obj)
// }
// }
// }
</script>
<style lang="less" scoped>
.title {
font-size: 0.18rem;
color: #000;
font-weight: bold;
margin-bottom: 0.2rem;
padding-left: 0.1rem;
border-left: 0.06rem #0058e1 solid;
}
.top {
margin-bottom: 0.1rem;
.main {
background: #eee;
padding: 0.2rem 0.2rem 0.1rem;
p {
display: flex;
justify-content: space-between;
& > span {
width: 100%;
}
.enclosure {
width: 95%;
padding: 0.05rem 0.1rem;
background: #ddd;
display: flex;
justify-content: space-between;
margin-top: 0.05rem;
}
.btn:hover {
color: #0058e1;
cursor: pointer;
}
}
.item {
span {
width: 2.5rem;
}
}
}
}
.bottom {
.main {
.item {
border-top: 1px #eee solid;
.deptName {
color: #0058e1;
font-size: 0.16rem;
margin-top: 0.1rem;
display: flex;
align-items: center;
.img {
width: 0.05rem;
height: 0.05rem;
border-radius: 0.05rem;
background: #0058e1;
margin-right: 0.1rem;
}
}
.oddNumbers {
margin: 0.1rem 0 0 0.15rem;
}
.box {
margin-left: 0.1rem;
.ability {
height: 1.3rem;
display: flex;
border-bottom: 1px #eee solid;
padding: 0.1rem 0;
.left {
display: inline-block;
width: 1.1rem;
height: 1.1rem;
margin-left: 0.1rem;
background: url('~@/assets/home/sxt_square.png') no-repeat;
background-size: 100%;
}
.sxt {
background: url('~@/assets/home/sxt_square.png') no-repeat;
background-size: 100%;
}
.yyzy {
background: url('~@/assets/home/yyzy_square.png') no-repeat;
background-size: 100%;
}
.znsf {
background: url('~@/assets/home/znsf_square.png') no-repeat;
background-size: 100%;
}
.tcfw {
background: url('~@/assets/home/tcfw_square.png') no-repeat;
background-size: 100%;
}
.kfzj {
background: url('~@/assets/home/kfzj_square.png') no-repeat;
background-size: 100%;
}
.ywzj {
background: url('~@/assets/home/ywzj_square.png') no-repeat;
background-size: 100%;
}
.btn {
cursor: pointer;
color: #0087ff;
align-self: flex-end;
padding: 5px 10px;
border: 1px #0087ff solid;
border-radius: 0.2rem;
}
.right {
flex: 1;
margin-left: 0.15rem;
.ability-top {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
.name {
.type {
background: #0087ff;
color: #fff;
padding: 2px 10px;
border-radius: 10px;
margin-left: 0.1rem;
}
}
}
.ability-bottom {
margin-top: 0.15rem;
// display: flex;
// justify-content: space-between;
.dec {
width: 7rem;
height: 0.44rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.result:hover {
color: #0058e1;
cursor: pointer;
}
}
}
}
}
}
}
}
</style>