应用资源

This commit is contained in:
gaoyuanwei 2022-07-06 13:07:12 +08:00
parent 8a686cfca6
commit 5035cc074a
2 changed files with 160 additions and 147 deletions

View File

@ -2,17 +2,10 @@
<template>
<div class="application-deployment-and-security">
<div class="title">
<DetalsTitle
:title="dataFrom.title"
:type="dataFrom.englishTitle"
></DetalsTitle>
<DetalsTitle :title="dataFrom.title" :type="dataFrom.englishTitle"></DetalsTitle>
</div>
<div class="content">
<div
v-for="(item, index) in dataFrom.content"
:key="index"
class="content-card"
>
<div v-for="(item, index) in dataFrom.content" :key="index" class="content-card">
<div class="card-title">{{ item.childrenTitle }}</div>
<div class="card-content">
<div v-for="carditem in item.childrenContent" :key="carditem">
@ -29,10 +22,10 @@
</template>
<script setup>
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue'
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue'
let dataFrom = ref({
let dataFrom = ref({
title: '部署与安全',
englishTitle: 'DEPLOY&SAFE',
content: [
@ -45,12 +38,17 @@
childrenContent: [],
},
],
})
//
const props = defineProps({
})
let objUrl = {
attrType: '访问地址',
attrValue: '' || '------',
}
dataFrom.value.content[0].childrenContent.push(objUrl)
//
const props = defineProps({
dataList: { type: Object, default: null },
})
if (props.dataList.infoList) {
})
if (props.dataList.infoList) {
props.dataList.infoList.map((item) => {
if (
item.attrType === '部署区域' ||
@ -63,6 +61,8 @@
item.attrType === '等保定级'
) {
dataFrom.value.content[1].childrenContent.push(item)
} else if (item.attrType === '访问地址') {
objUrl.value = item.value
}
})
if (dataFrom.value.content[1].childrenContent.length <= 0) {
@ -80,17 +80,16 @@
dataFrom.value.content[1].childrenContent.push(itemContent)
})
}
}
watch(
() => props.dataList,
(val) => {
if (val) {
let obj = {
attrType: '访问地址',
attrValue: props.dataList.link || '------',
}
dataFrom.value.content[0].childrenContent.push(obj)
}
watch(
() => props.dataList,
(val) => {
if (val) {
dataFrom.value.content[0].childrenContent = []
dataFrom.value.content[1].childrenContent = []
props.dataList.infoList.map((item) => {
@ -105,6 +104,8 @@
item.attrType === '等保定级'
) {
dataFrom.value.content[1].childrenContent.push(item)
} else if (item.attrType === '访问地址') {
objUrl.value = item.value
}
})
if (dataFrom.value.content[1].childrenContent.length <= 0) {
@ -122,48 +123,46 @@
dataFrom.value.content[1].childrenContent.push(itemContent)
})
}
let obj = {
attrType: '访问地址',
attrValue: props.dataList.link || '------',
}
dataFrom.value.content[0].childrenContent.push(obj)
}
}
)
)
</script>
<style lang="less" scoped>
.application-deployment-and-security {
.application-deployment-and-security {
padding: 0.8rem 0;
display: flex;
flex-direction: column;
align-items: center;
.title {
margin-bottom: 0.3rem;
}
.content {
display: flex;
width: 13rem;
justify-content: space-between;
.content-card {
height: 1.5rem;
width: 6.2rem;
border-radius: 0.2rem;
background: linear-gradient(
to right,
background: linear-gradient(to right,
rgba(113, 132, 252, 0.4),
rgba(148, 163, 252, 0.4)
);
rgba(148, 163, 252, 0.4));
padding: 0 0.3rem;
display: flex;
flex-direction: column;
justify-content: center;
.card-title {
font-size: 0.26rem;
line-height: 0.26rem;
color: #212956;
margin-bottom: 0.2rem;
}
.card-content {
div {
display: inline-block;
@ -172,19 +171,24 @@
font-size: 0.2rem;
line-height: 0.2rem;
max-width: 5.84rem;
overflow: hidden; /*超出的隐藏*/
overflow: hidden;
/*超出的隐藏*/
white-space: nowrap;
text-overflow: ellipsis; /*超出的设置为省略号*/
text-overflow: ellipsis;
/*超出的设置为省略号*/
span {
display: inline-block;
max-width: 4rem;
overflow: hidden; /*超出的隐藏*/
overflow: hidden;
/*超出的隐藏*/
white-space: nowrap;
text-overflow: ellipsis; /*超出的设置为省略号*/
}
text-overflow: ellipsis;
/*超出的设置为省略号*/
}
}
}
}
}
}
</style>

View File

@ -53,12 +53,12 @@ if (props.dataList.infoList) {
dataFrom.value.content[0].childrenContent[0] = obj
let deptContacts = {
attrType: '部门联系人',
attrValue: props.dataList.deptContacts || '------',
attrValue: '',
}
dataFrom.value.content[0].childrenContent[1] = deptContacts
let deptPhone = {
attrType: '部门联系电话',
attrValue: props.dataList.deptPhone || '------',
attrValue: '',
}
dataFrom.value.content[0].childrenContent[2] = deptPhone
props.dataList.infoList.map((item) => {
@ -87,8 +87,13 @@ if (props.dataList.infoList) {
dataFrom.value.content[1].childrenContent[2].attrValue = '------'
}
}
} else if (item.attrType === '部门联系人') {
deptContacts.attrValue = item.attrValue || '------'
} else if (item.attrType === '部门联系人电话') {
deptPhone.attrValue = item.attrValue || '------'
}
})
console.log('obj', dataFrom.value)
}
watch(
@ -147,6 +152,10 @@ watch(
'------'
}
}
} else if (item.attrType === '部门联系人') {
deptContacts.attrValue = item.attrValue || '------'
} else if (item.attrType === '部门联系人电话') {
deptPhone.attrValue = item.attrValue || '------'
}
})
console.log('obj', dataFrom.value)