Merge branch 'hi-ucs-dev' of http://192.168.124.50:3000/wuhongjian/hi-ucs into hi-ucs-dev
# Conflicts: # back/public/index.html
This commit is contained in:
a0049873
commit
ce5d587c35
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2022-04-11 10:11:40
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-07-28 20:10:28
|
||||
* @LastEditTime: 2022-08-01 09:23:52
|
||||
* @Description: 告诉大家这是什么
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
|
|
@ -45,9 +45,9 @@
|
|||
// window.SITE_CONFIG['apiURL'] = 'http://15.2.21.166:8888/renren-admin';
|
||||
// window.SITE_CONFIG['apiURL'] = 'http://124.222.94.39:8888/renren-admin';
|
||||
// window.SITE_CONFIG['apiURL'] = 'http://10.16.5.35:8888/renren-admin';
|
||||
window.SITE_CONFIG['apiURL'] = 'http://15.2.21.236:8888/renren-admin';
|
||||
// window.SITE_CONFIG['apiURL'] = 'http://15.2.21.236:8888/renren-admin';
|
||||
window.SITE_CONFIG['previewUrl'] = 'http://localhost:8080/';
|
||||
// window.SITE_CONFIG['apiURL'] = 'http://15.2.23.141:8000/renren-admin';
|
||||
window.SITE_CONFIG['apiURL'] = 'http://10.134.135.9:8888/renren-admin';
|
||||
// WebSocket地址
|
||||
window.SITE_CONFIG['socketURL'] ='ws://localhost:8080/renren-admin/websocket';
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -40,6 +40,9 @@
|
|||
<el-button type="primary" style="margin-left:10px;margin-top:4px" size="small" @click="getData">
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button type="primary" style="margin-left:10px;margin-top:4px" size="small" @click="clear">
|
||||
重置
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -252,6 +255,8 @@ export default {
|
|||
} else {
|
||||
this.checkList.push(item.labelCode)
|
||||
}
|
||||
console.log('this.checkList------------>', this.checkList);
|
||||
this.getData()
|
||||
},
|
||||
// 获取列表
|
||||
getData(parentId = '') {
|
||||
|
|
@ -265,7 +270,7 @@ export default {
|
|||
gpsX: '',
|
||||
gpsY: '',
|
||||
radius: '',
|
||||
labelCodes: '',
|
||||
labelCodes: this.checkList.join(),
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$http.get('/api/project/selectByParentIdNew', { params: postData }).then(res => {
|
||||
|
|
@ -283,6 +288,7 @@ export default {
|
|||
|
||||
},
|
||||
changeParentId(parentId) {
|
||||
console.log('parentId------------>', parentId);
|
||||
this.getData(parentId)
|
||||
},
|
||||
confirmSubmitHandle() {
|
||||
|
|
@ -312,6 +318,11 @@ export default {
|
|||
this.transferData = [];
|
||||
this.$emit('closeModal');
|
||||
},
|
||||
clear() {
|
||||
this.cameraName = ''
|
||||
this.selectedArray = [];
|
||||
this.getData()
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@ export default {
|
|||
})
|
||||
},
|
||||
onSelect(item, val, child) {
|
||||
// mybus.emit('getListByParentId', val.id)
|
||||
this.$emit('changeParentId', val.id)
|
||||
this.getCameraAllOrgan({ parentId: val.id }).then((res) => {
|
||||
if (res.data.code !== 1) {
|
||||
return this.$message.error(res.msg);
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<div class="Ability-to-take-off-the-shelf-approval-title">能力下架审批</div>
|
||||
<div class="basic-information">
|
||||
<div class="basic-information-title">
|
||||
<span></span><span>基本1111信息</span>
|
||||
<span></span><span>基本信息</span>
|
||||
</div>
|
||||
<div class="basic-information-content">
|
||||
<p>
|
||||
|
|
@ -429,7 +429,7 @@ export default {
|
|||
.data-list-left {
|
||||
width: 80px;
|
||||
height: 110px;
|
||||
background: url('~@/assets/img/Capabilitydiagram.png') no-repeat;
|
||||
background: url("~@/assets/img/Capabilitydiagram.png") no-repeat;
|
||||
background-size: 80px 80px;
|
||||
background-position: center;
|
||||
margin-left: 10px;
|
||||
|
|
|
|||
|
|
@ -40,29 +40,48 @@
|
|||
v-for="multipleAdditionsItem in itemsonson.note1"
|
||||
:key="multipleAdditionsItem"
|
||||
>
|
||||
<div>
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content"> {{
|
||||
multipleAdditionsItem.question ||
|
||||
multipleAdditionsItem.type ||
|
||||
multipleAdditionsItem.name
|
||||
}}</div>
|
||||
<div>
|
||||
{{
|
||||
multipleAdditionsItem.question ||
|
||||
multipleAdditionsItem.type ||
|
||||
multipleAdditionsItem.name
|
||||
}}
|
||||
</div>
|
||||
<div>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">{{
|
||||
multipleAdditionsItem.answer ||
|
||||
multipleAdditionsItem.price ||
|
||||
multipleAdditionsItem.img
|
||||
}}</div>
|
||||
<div>
|
||||
{{
|
||||
multipleAdditionsItem.answer ||
|
||||
multipleAdditionsItem.price ||
|
||||
multipleAdditionsItem.img
|
||||
}}
|
||||
</div>
|
||||
<div>{{ multipleAdditionsItem.desc }}</div>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">{{ multipleAdditionsItem.desc }}</div>
|
||||
<div>{{ multipleAdditionsItem.desc }}</div>
|
||||
</el-tooltip>
|
||||
<!-- <div>{{ multipleAdditionsItem }}</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<el-tooltip v-else placement="top">
|
||||
<div slot="content">{{ itemsonson.note1 }}</div>
|
||||
<el-input
|
||||
v-else
|
||||
v-model="itemsonson.note1"
|
||||
disabled="disabled"
|
||||
></el-input>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-for="itemsonson in itemson.children"
|
||||
|
|
@ -94,7 +113,10 @@
|
|||
style="border: 1px solid #3c9bcd;margin"
|
||||
>
|
||||
<div>{{ itemDataFormValue.name }}</div>
|
||||
<div>{{ itemDataFormValue.desc }}</div>
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">{{ itemDataFormValue.desc }}</div>
|
||||
<div>{{ itemDataFormValue.desc }}</div>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -115,7 +137,10 @@
|
|||
style="border: 1px solid #3c9bcd;margin"
|
||||
>
|
||||
<div>{{ itemDataFormValue.name }}</div>
|
||||
<div>{{ itemDataFormValue.desc }}</div>
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">{{ itemDataFormValue.desc }}</div>
|
||||
<div>{{ itemDataFormValue.desc }}</div>
|
||||
</el-tooltip>
|
||||
<div @click="videoAndImg(itemDataFormValue.img)">浏览</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -137,7 +162,10 @@
|
|||
style="border: 1px solid #3c9bcd;margin"
|
||||
>
|
||||
<div>{{ itemDataFormValue.name }}</div>
|
||||
<div>{{ itemDataFormValue.desc }}</div>
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">{{ itemDataFormValue.desc }}</div>
|
||||
<div>{{ itemDataFormValue.desc }}</div>
|
||||
</el-tooltip>
|
||||
<div @click="videoAndImg(itemDataFormValue.img)">浏览</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -207,6 +235,10 @@ export default {
|
|||
this.dataView.children[indexView].children[indexViewSon].children[
|
||||
indexSon
|
||||
].note1 = this.dataForm.type
|
||||
} else if (itemSon.name.indexOf('共享条件') != -1) {
|
||||
this.dataView.children[indexView].children[indexViewSon].children[
|
||||
indexSon
|
||||
].note1 = this.dataForm.shareCondition
|
||||
} else if (itemSon.name === '部门联系人') {
|
||||
console.log('itemSon.name', itemSon.name)
|
||||
this.dataView.children[indexView].children[indexViewSon].children[
|
||||
|
|
@ -432,6 +464,11 @@ export default {
|
|||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.el-tooltip__popper {
|
||||
max-width: 300px;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.wrapper {
|
||||
.dataTitle {
|
||||
|
|
@ -464,6 +501,28 @@ export default {
|
|||
margin-bottom: 10px;
|
||||
font-weight: bold;
|
||||
line-height: 14px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
& > div:nth-child(2) {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 6;
|
||||
line-height: initial;
|
||||
}
|
||||
& > div:nth-child(3) {
|
||||
width: 90%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 6;
|
||||
line-height: initial;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -503,7 +562,7 @@ export default {
|
|||
& > div:nth-child(3) {
|
||||
margin-top: 10px;
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
bottom: 8px;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
border: 1px solid #3c9bcd;
|
||||
|
|
|
|||
|
|
@ -42,6 +42,12 @@
|
|||
{{ dataForm.content.applicationSceneStr || '--' }}</span
|
||||
></span>
|
||||
</p>
|
||||
<p>
|
||||
<span>
|
||||
应用背景：<span>
|
||||
{{ dataForm.content.applicationBackground || '--' }}</span
|
||||
></span>
|
||||
</p>
|
||||
<p>
|
||||
<span>
|
||||
能力应用期望效果：<span>
|
||||
|
|
@ -573,7 +579,7 @@ export default {
|
|||
}
|
||||
.clearfix:after {
|
||||
display: block;
|
||||
content: '';
|
||||
content: "";
|
||||
clear: both;
|
||||
}
|
||||
.title {
|
||||
|
|
@ -583,7 +589,7 @@ export default {
|
|||
border-bottom: 0;
|
||||
}
|
||||
.title:before {
|
||||
content: '';
|
||||
content: "";
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
display: inline-block;
|
||||
|
|
|
|||
|
|
@ -1,32 +1,129 @@
|
|||
<template>
|
||||
<div class="risk">
|
||||
<contentTitle title="部门能力风险TOP5"></contentTitle>
|
||||
<div class="no-data">暂无数据</div>
|
||||
|
||||
<div class="risk">
|
||||
<contentTitle title="部门能力风险TOP5"></contentTitle>
|
||||
<div class="no-data" v-if="topData.length > 0">
|
||||
<div
|
||||
class="data-card"
|
||||
v-for="(item, index) in topData"
|
||||
:key="`data${index}`"
|
||||
>
|
||||
<div class="data-index">{{ index + 1 }}</div>
|
||||
<div class="data-name-And-progress">
|
||||
<div class="data-title">{{ item.name }}</div>
|
||||
<div class="data-progress-And-value">
|
||||
<div class="data-progress">
|
||||
<div :style="widthFunction(item.count)"></div>
|
||||
</div>
|
||||
<div class="data-count">
|
||||
{{ item.count }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="no-data"
|
||||
v-else
|
||||
style="display: flex; align-items: center; justify-content: center"
|
||||
>
|
||||
暂无数据
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import contentTitle from './content-title.vue'
|
||||
export default {
|
||||
components: { contentTitle }
|
||||
components: { contentTitle },
|
||||
data () {
|
||||
return {
|
||||
oneData: 100,
|
||||
topData: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 判断值域范围
|
||||
widthFunction (value) {
|
||||
value = (value / this.oneData) * 100
|
||||
if (value >= 80) {
|
||||
return `height:10px;width: ${value}%;background: linear-gradient(to right,#ee8a08,#ffcb64)`
|
||||
} else if (value >= 60 && value < 80) {
|
||||
return `height:10px;width: ${value}%;background: linear-gradient(to right,#788da5,#d4dbe4)`
|
||||
} else if (value >= 40 && value < 60) {
|
||||
return `height:10px;width: ${value}%;background: linear-gradient(to right,#d29c62,#e8c5a2)`
|
||||
} else if (value < 40) {
|
||||
return `height:10px;width: ${value}%;background: linear-gradient(to right,#6fa1ef,#9bbef8)`
|
||||
}
|
||||
},
|
||||
queryGroupByDepartment () {
|
||||
this.$http
|
||||
.get(
|
||||
'/gateway-monitor/queryGroupByDepartment?query=topk(5, sum(label_replace(apigateway_http_status{code!="200"}, "deptInfo", "$1", "matched_uri", "/juapi/(.*?)/(.*?)/.*")) by (deptInfo))&time=1659058871'
|
||||
)
|
||||
.then((res) => {
|
||||
console.log(res.data.data)
|
||||
if (res.data.data) {
|
||||
this.topData = res.data.data
|
||||
this.oneData = this.topData[0].count
|
||||
} else {
|
||||
this.topData = []
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.queryGroupByDepartment()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.risk {
|
||||
width: 540px;
|
||||
height: 335px;
|
||||
background: #fff;
|
||||
padding: 0 16px;
|
||||
box-sizing: border-box;
|
||||
width: 540px;
|
||||
height: 335px;
|
||||
background: #fff;
|
||||
padding: 0 16px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.no-data {
|
||||
width: 520px;
|
||||
height: 287px;
|
||||
background: #fff;
|
||||
line-height: 232px;
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
text-align: center;
|
||||
width: 520px;
|
||||
height: 287px;
|
||||
background: #fff;
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
text-align: center;
|
||||
.data-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
.data-index {
|
||||
font-size: 16px;
|
||||
line-height: 16px;
|
||||
color: #515151;
|
||||
margin-right: 13px;
|
||||
}
|
||||
.data-name-And-progress {
|
||||
.data-title {
|
||||
font-size: 16px;
|
||||
line-height: 16px;
|
||||
color: #515151;
|
||||
margin-bottom: 8px;
|
||||
text-align: left;
|
||||
}
|
||||
.data-progress-And-value {
|
||||
display: flex;
|
||||
.data-progress {
|
||||
width: 422px;
|
||||
height: 10px;
|
||||
background: #eeeeee;
|
||||
}
|
||||
.data-count {
|
||||
margin-left: 20px;
|
||||
font-size: 14px;
|
||||
line-height: 14px;
|
||||
color: #2b2b2b;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -97,7 +97,7 @@ export function callTheTrendPort(start, end, params) {
|
|||
export function totalCallsSnum(params) {
|
||||
return request({
|
||||
url:
|
||||
`metrics/api/v1/query?query=sum(increase(apigateway_http_status))&time=${params}`,
|
||||
`/metrics/api/v1/query?time=${params}&query=sum(apigateway_http_status)`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
|
@ -105,7 +105,7 @@ export function totalCallsSnum(params) {
|
|||
export function totalCallsSnum2(params) {
|
||||
return request({
|
||||
url:
|
||||
`metrics/api/v1/query?query=sum(increase(apigateway_http_status{code=~"^2.."}))&time=${params}`,
|
||||
`metrics/api/v1/query?query=sum(apigateway_http_status{code=~"^2.."})&time=${params}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 128 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 137 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 177 KiB |
|
|
@ -240,7 +240,7 @@
|
|||
type: 'pie',
|
||||
selectedMode: 'single',
|
||||
radius: ['50%', '30%'],
|
||||
color: ['#fe845e', '#6cc95a', '#02d1b0', '#1772ff', '#fe8455'],
|
||||
color: ['#fe845e', '#6cc95a', '#02d1b0', '#1772ff', '#FAC858'],
|
||||
top: '0',
|
||||
label: {
|
||||
normal: {
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@
|
|||
import * as moment from 'moment'
|
||||
import * as echarts from 'echarts'
|
||||
import { applyAmount, trafficStatistics } from '@/api/abilityStatistics'
|
||||
const quarter = ref(['近七天', '近14天', '月度'])
|
||||
const quarter = ref(['近七天', '近十四天', '月度'])
|
||||
let startDate = ref('')
|
||||
let endDate = ref('')
|
||||
|
||||
|
|
@ -128,7 +128,7 @@
|
|||
hebdomad()
|
||||
swtichname.value = '日'
|
||||
break
|
||||
case '近14天':
|
||||
case '近十四天':
|
||||
fortnight()
|
||||
swtichname.value = '14日'
|
||||
break
|
||||
|
|
|
|||
|
|
@ -408,18 +408,14 @@
|
|||
//总调用次数接口
|
||||
const TotalCallsAPI = () => {
|
||||
const end = Date.parse(new Date()) / 1000
|
||||
if (!xinhaianIsShow) {
|
||||
totalCallsSnum(end).then((res) => {
|
||||
snum.value[1].num = res.data.data.result[0].value[1]
|
||||
totalCallsSnum2(end).then((resSon) => {
|
||||
snum.value[2].num =
|
||||
((snum.value[1].num - resSon.data.data.result[0].value[1]) /
|
||||
snum.value[1].num) *
|
||||
100 +
|
||||
'%'
|
||||
})
|
||||
totalCallsSnum(end).then((res) => {
|
||||
debugger
|
||||
snum.value[1].num = res.data.data.result[0].value[1]
|
||||
totalCallsSnum2(end).then((resSon) => {
|
||||
snum.value[2].num =
|
||||
(resSon.data.data.result[0].value[1] / snum.value[1].num) * 100 + '%'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
const init = () => {
|
||||
timeSwitch(timeSwitchindex.value)
|
||||
|
|
|
|||
|
|
@ -47,10 +47,7 @@
|
|||
<div :class="contentLocation(1, dataFrom.attrType)">
|
||||
<div class="content-right-scene" :class="'content-right-case'">
|
||||
<div class="content-top">{{ itemSonTitle.name }}</div>
|
||||
<a-tooltip>
|
||||
<template #title>{{ itemSonTitle.desc }}</template>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</a-tooltip>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -170,10 +167,10 @@
|
|||
.tab-top {
|
||||
min-width: 120px;
|
||||
font-size: 24px;
|
||||
line-height: 24px;
|
||||
line-height: 26px;
|
||||
margin-bottom: 20px;
|
||||
max-width: 200px;
|
||||
height: 24px;
|
||||
height: 26px;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 1;
|
||||
|
|
|
|||
|
|
@ -85,7 +85,9 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
line-height: 20px;
|
||||
div:last-child {
|
||||
line-height: 34px;
|
||||
}
|
||||
}
|
||||
.content-bottom {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -258,7 +258,7 @@
|
|||
// white-space: nowrap;
|
||||
font-size: 40px;
|
||||
margin-right: 20px;
|
||||
max-width: 7rem;
|
||||
max-width: 6rem;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
|
|||
|
|
@ -402,7 +402,7 @@
|
|||
.content-right-left {
|
||||
border-right: 0.01rem solid #707fe0;
|
||||
padding-right: 0.1rem;
|
||||
margin-right: 0.1rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
|
||||
.content-right-title {
|
||||
|
|
@ -424,12 +424,12 @@
|
|||
flex-direction: column;
|
||||
|
||||
p {
|
||||
// width: 1.60rem;
|
||||
width: 2.3rem;
|
||||
height: 0.2rem;
|
||||
display: -webkit-box;
|
||||
// overflow: hidden;
|
||||
overflow: hidden;
|
||||
margin-bottom: 0.08rem;
|
||||
white-space: nowrap;
|
||||
// white-space: nowrap;
|
||||
-webkit-line-clamp: 1;
|
||||
word-break: break-all;
|
||||
-webkit-box-orient: vertical;
|
||||
|
|
|
|||
|
|
@ -89,7 +89,9 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
line-height: 20px;
|
||||
div:last-child {
|
||||
line-height: 34px;
|
||||
}
|
||||
}
|
||||
|
||||
.content-bottom {
|
||||
|
|
|
|||
|
|
@ -47,10 +47,7 @@
|
|||
<div class="content-right">
|
||||
<div class="content-right-scene">
|
||||
<div class="content-top">{{ itemSonTitle.name }}</div>
|
||||
<a-tooltip>
|
||||
<template #title>{{ itemSonTitle.desc }}</template>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</a-tooltip>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -153,10 +150,10 @@
|
|||
.tab-top {
|
||||
min-width: 1.2rem;
|
||||
font-size: 0.24rem;
|
||||
line-height: 0.24rem;
|
||||
line-height: 0.26rem;
|
||||
margin-bottom: 0.2rem;
|
||||
max-width: 2rem;
|
||||
height: 0.24rem;
|
||||
height: 0.26rem;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 1;
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
<div class="card-title">{{ item.childrenTitle }}</div>
|
||||
<div class="card-content">
|
||||
<div v-for="carditem in item.childrenContent" :key="carditem">
|
||||
<div>
|
||||
<div style="display: flex">
|
||||
<span>{{ carditem.attrType }}：</span>
|
||||
<a-tooltip>
|
||||
<template #title>{{ carditem.attrValue }}</template>
|
||||
|
|
@ -220,11 +220,21 @@
|
|||
|
||||
div {
|
||||
max-width: 2.8rem;
|
||||
display: flex;
|
||||
// overflow: hidden;
|
||||
// text-overflow: ellipsis;
|
||||
// display: -webkit-box;
|
||||
// -webkit-box-orient: vertical;
|
||||
// -webkit-line-clamp: 1;
|
||||
span:last-child {
|
||||
display: block;
|
||||
width: 2.3rem;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -44,14 +44,6 @@
|
|||
</a-tooltip>
|
||||
</div>
|
||||
<div class="bottom" v-if="props.dataList.id">
|
||||
<a-button type="primary" @click="toView()">
|
||||
<template #icon><form-outlined /></template>
|
||||
申请使用
|
||||
</a-button>
|
||||
<a-button type="primary" @click="addShoppingCart()">
|
||||
<template #icon><shopping-cart-outlined /></template>
|
||||
加入购物车
|
||||
</a-button>
|
||||
<!-- 融合服务 存在fuseResourceList -->
|
||||
<a-button
|
||||
type="primary"
|
||||
|
|
@ -63,6 +55,18 @@
|
|||
</template>
|
||||
申请使用
|
||||
</a-button>
|
||||
<a-button v-else type="primary" @click="toView()">
|
||||
<template #icon><form-outlined /></template>
|
||||
申请使用
|
||||
</a-button>
|
||||
<a-button
|
||||
v-if="!dataList.fuseResourceList"
|
||||
type="primary"
|
||||
@click="addShoppingCart()"
|
||||
>
|
||||
<template #icon><shopping-cart-outlined /></template>
|
||||
加入购物车
|
||||
</a-button>
|
||||
<a-button type="primary" @click="goTOCollection()">
|
||||
{{ props.dataList.isCollect == 'true' ? '已' : '' }}收藏
|
||||
</a-button>
|
||||
|
|
@ -257,7 +261,7 @@
|
|||
margin-right: 0.2rem;
|
||||
font-size: 0.4rem;
|
||||
margin-right: 0.2rem;
|
||||
max-width: 7rem;
|
||||
max-width: 6rem;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
|
|||
|
|
@ -47,10 +47,7 @@
|
|||
<div :class="contentLocation(1, dataFrom.attrType)">
|
||||
<div class="content-right-scene" :class="'content-right-case'">
|
||||
<div class="content-top">{{ itemSonTitle.name }}</div>
|
||||
<a-tooltip>
|
||||
<template #title>{{ itemSonTitle.desc }}</template>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</a-tooltip>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -170,10 +167,10 @@
|
|||
.tab-top {
|
||||
min-width: 120px;
|
||||
font-size: 24px;
|
||||
line-height: 24px;
|
||||
line-height: 26px;
|
||||
margin-bottom: 20px;
|
||||
max-width: 200px;
|
||||
height: 24px;
|
||||
height: 26px;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 1;
|
||||
|
|
|
|||
|
|
@ -85,7 +85,9 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0.2rem;
|
||||
line-height: 0.2rem;
|
||||
div:last-child {
|
||||
line-height: 0.34rem;
|
||||
}
|
||||
}
|
||||
.content-bottom {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -47,10 +47,7 @@
|
|||
<div class="content-right">
|
||||
<div class="content-right-scene">
|
||||
<!-- <div class="content-top">{{ itemSonTitle.name }}</div>-->
|
||||
<a-tooltip>
|
||||
<template #title>{{ itemSonTitle.desc }}</template>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</a-tooltip>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -150,10 +147,10 @@
|
|||
.tab-top {
|
||||
min-width: 1.2rem;
|
||||
font-size: 0.24rem;
|
||||
line-height: 0.24rem;
|
||||
line-height: 0.26rem;
|
||||
margin-bottom: 0.2rem;
|
||||
max-width: 2rem;
|
||||
height: 0.24rem;
|
||||
height: 0.26rem;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 1;
|
||||
|
|
|
|||
|
|
@ -243,7 +243,7 @@
|
|||
// white-space: nowrap;
|
||||
font-size: 0.4rem;
|
||||
margin-right: 0.2rem;
|
||||
max-width: 7rem;
|
||||
max-width: 6rem;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
|
|||
|
|
@ -322,7 +322,7 @@
|
|||
.content-right-left {
|
||||
border-right: 0.01rem solid #707fe0;
|
||||
padding-right: 0.1rem;
|
||||
margin-right: 0.1rem;
|
||||
margin-right: 0.3rem;
|
||||
}
|
||||
|
||||
.content-right-title {
|
||||
|
|
@ -344,12 +344,11 @@
|
|||
word-break: break-all;
|
||||
|
||||
p {
|
||||
// width: 1.60rem;
|
||||
min-width: 2.2rem;
|
||||
height: 0.2rem;
|
||||
display: -webkit-box;
|
||||
// overflow: hidden;
|
||||
overflow: hidden;
|
||||
margin-bottom: 0.08rem;
|
||||
white-space: nowrap;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
margin-right: 0.15rem;
|
||||
|
|
|
|||
|
|
@ -47,10 +47,7 @@
|
|||
<div :class="contentLocation(1, dataFrom.attrType)">
|
||||
<div class="content-right-scene" :class="'content-right-case'">
|
||||
<div class="content-top">{{ itemSonTitle.name }}</div>
|
||||
<a-tooltip>
|
||||
<template #title>{{ itemSonTitle.desc }}</template>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</a-tooltip>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -170,10 +167,10 @@
|
|||
.tab-top {
|
||||
min-width: 120px;
|
||||
font-size: 24px;
|
||||
line-height: 24px;
|
||||
line-height: 26px;
|
||||
margin-bottom: 20px;
|
||||
max-width: 200px;
|
||||
height: 24px;
|
||||
height: 26px;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 1;
|
||||
|
|
|
|||
|
|
@ -85,7 +85,9 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
line-height: 20px;
|
||||
div:last-child {
|
||||
line-height: 34px;
|
||||
}
|
||||
}
|
||||
.content-bottom {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -47,10 +47,7 @@
|
|||
<div class="content-right">
|
||||
<div class="content-right-scene">
|
||||
<div class="content-top">{{ itemSonTitle.name }}</div>
|
||||
<a-tooltip>
|
||||
<template #title>{{ itemSonTitle.desc }}</template>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</a-tooltip>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -149,11 +146,11 @@
|
|||
.tab-top {
|
||||
min-width: 1.2rem;
|
||||
font-size: 0.24rem;
|
||||
line-height: 0.24rem;
|
||||
line-height: 0.26rem;
|
||||
margin-bottom: 0.2rem;
|
||||
text-align: center;
|
||||
max-width: 2rem;
|
||||
height: 0.24rem;
|
||||
height: 0.26rem;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 1;
|
||||
|
|
|
|||
|
|
@ -265,7 +265,7 @@
|
|||
// -webkit-line-clamp: 1;
|
||||
& > span:last-child {
|
||||
display: inline-block;
|
||||
width: 1.49rem;
|
||||
width: 2rem;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
|
|
|
|||
|
|
@ -246,7 +246,7 @@
|
|||
// white-space: nowrap;
|
||||
font-size: 0.4rem;
|
||||
margin-right: 0.2rem;
|
||||
max-width: 7rem;
|
||||
max-width: 6rem;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
|
|||
|
|
@ -47,10 +47,7 @@
|
|||
<div :class="contentLocation(1, dataFrom.attrType)">
|
||||
<div class="content-right-scene" :class="'content-right-case'">
|
||||
<div class="content-top">{{ itemSonTitle.name }}</div>
|
||||
<a-tooltip>
|
||||
<template #title>{{ itemSonTitle.desc }}</template>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</a-tooltip>
|
||||
<div class="content-bottom">{{ itemSonTitle.desc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -170,10 +167,10 @@
|
|||
.tab-top {
|
||||
min-width: 120px;
|
||||
font-size: 24px;
|
||||
line-height: 24px;
|
||||
line-height: 26px;
|
||||
margin-bottom: 20px;
|
||||
max-width: 200px;
|
||||
height: 24px;
|
||||
height: 26px;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 1;
|
||||
|
|
|
|||
|
|
@ -85,7 +85,9 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0.2rem;
|
||||
line-height: 0.2rem;
|
||||
div:last-child {
|
||||
line-height: 34px;
|
||||
}
|
||||
}
|
||||
.content-bottom {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -239,7 +239,7 @@
|
|||
// white-space: nowrap;
|
||||
font-size: 0.4rem;
|
||||
margin-right: 0.2rem;
|
||||
max-width: 7rem;
|
||||
max-width: 6rem;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
|
|||
|
|
@ -345,8 +345,8 @@
|
|||
word-break: break-all;
|
||||
|
||||
p {
|
||||
// width: 1.60rem;
|
||||
height: 0.2rem;
|
||||
width: 2.6rem;
|
||||
// height: 0.2rem;
|
||||
margin-right: 0.15rem;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
|
|||
|
|
@ -151,6 +151,8 @@
|
|||
|
||||
// eslint-disable-next-line no-undef
|
||||
const navList = ref(navListManagement.navList)
|
||||
console.log('navList------------>', navList)
|
||||
|
||||
const props = defineProps({
|
||||
showView: { type: String, default: '' },
|
||||
})
|
||||
|
|
@ -420,6 +422,9 @@
|
|||
padding: 0 0.04rem 0 0.1rem;
|
||||
border-left: 0.01rem solid #666;
|
||||
}
|
||||
.icon {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.white {
|
||||
|
|
@ -428,6 +433,9 @@
|
|||
.name {
|
||||
color: #0058e1;
|
||||
}
|
||||
.icon {
|
||||
cursor: pointer;
|
||||
}
|
||||
.nav {
|
||||
color: #000;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,64 @@
|
|||
<template>
|
||||
<div class="box flex-row-start">
|
||||
<div class="img" :style="{ 'background-image': `url(${abilityInfo.bgImg || ''})` }"></div>
|
||||
<div class="list-box" v-if="abilityInfo.list.length">
|
||||
<div class="list-item" v-for="(item, i) in abilityInfo.list" :key="i" :class="i % 2 == 0 ? 'one' : ''">
|
||||
{{ item }}</div>
|
||||
</div>
|
||||
<div class="no-data" v-else>
|
||||
<a-empty description="暂无数据" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
abilityInfo: { type: Object, default: () => { } },
|
||||
})
|
||||
|
||||
console.log('abilityInfo------------>', props.abilityInfo);
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 0.3rem;
|
||||
padding-bottom: 0.3rem;
|
||||
border-bottom: 2px solid #f0f0f0;
|
||||
|
||||
.img {
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
background-image: url('../../../assets/home/integration/jcssDetail.png');
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.no-data {
|
||||
flex: 1;
|
||||
height: 3rem;
|
||||
line-height: 3rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.list-box {
|
||||
flex: 1;
|
||||
margin-left: 0.5rem;
|
||||
height: 3rem;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.list-item {
|
||||
padding: 0.1rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.one {
|
||||
background: rgb(246, 247, 249);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,6 +1,7 @@
|
|||
<!-- 融合服务详情 -->
|
||||
<template>
|
||||
<div class="IntegrationServicesDetails" :class="{ fixed2: scrollTop >= 600 }">
|
||||
<home-header></home-header>
|
||||
<!-- 头部基本信息 -->
|
||||
<application-top-details
|
||||
:dataList="detailInfoObj"
|
||||
|
|
@ -56,22 +57,43 @@
|
|||
|
||||
<!-- 使用能力 -->
|
||||
<div
|
||||
id="integration-combination-ability"
|
||||
class="combination-ability scrollBox"
|
||||
id="integration-ability"
|
||||
class="ability scrollBox"
|
||||
>
|
||||
<div class="title-1">
|
||||
<DetalsTitle title="使用能力" type="COMBINATION ABILITY"></DetalsTitle>
|
||||
<DetalsTitle title="使用能力" type="ABILITY"></DetalsTitle>
|
||||
</div>
|
||||
<div class="flex-row-center combine-content">
|
||||
<div class="combine-item" v-for="(item, i) in combineList" :key="i">
|
||||
<div class="title">{{ item.title }}</div>
|
||||
<div class="name-box">
|
||||
<div class="name-text" v-for="(name, j) in item.list" :key="j">
|
||||
{{ name }}
|
||||
</div>
|
||||
<template v-for="(item, i) in combineList" :key="i">
|
||||
<div class="flex-row-center combine-content" v-if="item.list.length>0">
|
||||
<div class="title">{{item.title}}</div>
|
||||
<div>
|
||||
<el-table
|
||||
:data="item.list"
|
||||
stripe
|
||||
style="width: 100%"
|
||||
:header-cell-style="{'text-align': 'center'}"
|
||||
@row-click="openResourceDetail">
|
||||
<el-table-column
|
||||
prop="name"
|
||||
label="数据"
|
||||
align="center"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="dept"
|
||||
label="能力来源"
|
||||
align="center"
|
||||
width="180">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="platform"
|
||||
label="申请平台"
|
||||
align="center">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<!-- 构建步骤 -->
|
||||
|
|
@ -82,7 +104,7 @@
|
|||
<div class="title-1">
|
||||
<DetalsTitle title="构建步骤" type="STEP"></DetalsTitle>
|
||||
</div>
|
||||
<div class="flex-row-center">
|
||||
<div class="flex-row-center step-content">
|
||||
<div style="height: 300px;">
|
||||
<el-steps direction="vertical" :active="step.length">
|
||||
<el-step v-for="(item, i) in step" :key="i" :title="item.question" :description="item.answer"></el-step>
|
||||
|
|
@ -100,6 +122,7 @@
|
|||
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
|
||||
import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题
|
||||
import HomeFooter from '@/views/newHome/components/Footer'
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { getIntegrationDetail } from '@/api/home'
|
||||
|
|
@ -135,7 +158,7 @@
|
|||
},
|
||||
{
|
||||
name: '使用能力',
|
||||
key: 'integration-combination-ability',
|
||||
key: 'integration-ability',
|
||||
},
|
||||
{
|
||||
name: '构建步骤',
|
||||
|
|
@ -234,14 +257,25 @@
|
|||
attrType: '应用领域',
|
||||
attrValue: fuseAttrList.find((v) => v.attrType === '应用领域').attrValue,
|
||||
}
|
||||
combineList.value.map((item) => {
|
||||
let arr = (
|
||||
fuseResourceList.filter(
|
||||
(v) => v.resource && v.resource.type == item.title
|
||||
) || []
|
||||
).map((d) => d.resource.name)
|
||||
combineList.value.forEach((item) => {
|
||||
let arr = []
|
||||
let resource=fuseResourceList.filter((v)=>v.resource && v.type == item.title)
|
||||
if(resource.length>0){
|
||||
if(item.title==='基础设施'){
|
||||
arr=resource.map(res=>({
|
||||
id: res.resource.idtCameraChannel, name: res.resource.channelName, dept: res.resource.nodeName, platform: 'UCS'
|
||||
}))
|
||||
}else if(item.title==='组件服务'){
|
||||
arr=resource.map(res=>({
|
||||
id: res.resource.id, name: res.resource.name, dept: res.resource.deptName, platform: 'UCS'
|
||||
}))
|
||||
}else if(item.title==='数据资源'){
|
||||
arr=resource.map(res=>({
|
||||
id: res.resource.zycode, name: res.resource.zyname, dept: res.resource.TGBM, platform: 'UCS'
|
||||
}))
|
||||
}
|
||||
}
|
||||
item.list = arr
|
||||
return item
|
||||
})
|
||||
detailInfoObj.value.infoList = []
|
||||
detailInfoObj.value.infoList.push(questionObj)
|
||||
|
|
@ -254,6 +288,10 @@
|
|||
}
|
||||
getIntegrationServicesDeatil(id)
|
||||
|
||||
function openResourceDetail(row, column, event){
|
||||
console.log(row)
|
||||
}
|
||||
|
||||
function handleOpenUrl(type) {
|
||||
let obj =
|
||||
(detailInfoObj.value.fuseAttrList || []).find(
|
||||
|
|
@ -459,10 +497,12 @@
|
|||
.step {
|
||||
padding: 0.8rem 0;
|
||||
background: rgb(247, 248, 250);
|
||||
|
||||
.step-content {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.combination-ability {
|
||||
.ability {
|
||||
padding: 0.8rem 0;
|
||||
background: rgb(247, 248, 250);
|
||||
|
||||
|
|
@ -471,34 +511,14 @@
|
|||
}
|
||||
|
||||
.combine-content {
|
||||
width: 13rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.combine-item {
|
||||
margin: 0 0.1rem;
|
||||
width: 4.28rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
border: 1px solid #e4e6f5;
|
||||
border-radius: 0.1rem;
|
||||
padding: 0.1rem 0;
|
||||
cursor: pointer;
|
||||
height: 2.5rem;
|
||||
|
||||
&:hover {
|
||||
border-radius: 0.02rem;
|
||||
border: 0.01rem solid #0058e1;
|
||||
box-shadow: 0rem 0.08rem 0.2rem rgb(0 88 225 / 30%);
|
||||
}
|
||||
|
||||
margin-top: 0.3rem;
|
||||
align-items: flex-start;
|
||||
.title {
|
||||
color: #212121;
|
||||
text-align: center;
|
||||
padding: 0.2rem 0;
|
||||
font-size: 0.22rem;
|
||||
text-align: center;
|
||||
height: 2rem;
|
||||
width: 2rem;
|
||||
margin-right: 0.5rem;
|
||||
background: url('~@/assets/home/rhfw_square.png') no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,152 +2,241 @@
|
|||
<!-- 青岛 -->
|
||||
<div class="details-pageconetent">
|
||||
<home-header></home-header>
|
||||
<div></div>
|
||||
<div class="content-box" v-loading="loadingPage">
|
||||
<div class="package-title">打包模式</div>
|
||||
<div class="basic-info">
|
||||
<div class="title-box">
|
||||
<div class="bar"></div>
|
||||
<span class="title-text">基本信息</span>
|
||||
</div>
|
||||
<div class="flex-row-start info-box">
|
||||
<a-image class="img" style="width:4rem;height:3rem" :preview="false" :src="imgUrl" />
|
||||
<div class="right">
|
||||
<div class="name">名称：{{ detailInfoObj.name || '--' }}</div>
|
||||
<div class="flex-row-start area">
|
||||
<div class="name">应用领域：</div>
|
||||
<div class="flex-row-start tag" v-if="detailInfoObj.applicationArea">
|
||||
{{ detailInfoObj.applicationArea }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-row-start desc">
|
||||
<div class="desc">描述：{{ detailInfoObj.description || '--' }}</div>
|
||||
</div>
|
||||
<div class="btn-box">
|
||||
<a-button size="big" class="btn-text" type="primary" @click="toView()">
|
||||
<template #icon>
|
||||
<form-outlined />
|
||||
</template>
|
||||
申请使用
|
||||
</a-button>
|
||||
<a-button size="big" class="btn-text" type="primary" @click="toView()">
|
||||
<template #icon>
|
||||
<form-outlined />
|
||||
</template>
|
||||
收藏
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ability-list-box" style="margin-top: 30px">
|
||||
<div class="title-box">
|
||||
<div class="bar"></div>
|
||||
<span class="title-text">服务使用能力列表</span>
|
||||
</div>
|
||||
<div class="list-box">
|
||||
<packageAbilityList style="margin-bottom:20px" v-for="(item, i) in abilityList" :abilityInfo="item"
|
||||
:key="i" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<home-footer></home-footer>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import HomeFooter from '@/views/newHome/components/Footer'
|
||||
import mybus from '@/myplugins/mybus'
|
||||
import { defineComponent, reactive, ref, toRefs, onMounted, watch } from 'vue'
|
||||
|
||||
import { getIntegrationServicesList } from '@/api/home.js'
|
||||
import { useRouter } from 'vue-router'
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
import searchResultList from '@/views/home/components/searchResultList.vue'
|
||||
import packageAbilityList from '@/views/home/components/packageAbilityList.vue'
|
||||
import { message } from 'ant-design-vue'
|
||||
import { getIntegrationDetail } from '@/api/home'
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
|
||||
const router = useRouter()
|
||||
const id = router.currentRoute.value.query.id
|
||||
const loadingPage = ref(false)
|
||||
|
||||
const detailInfoObj = ref({})
|
||||
const abilityList = ref([
|
||||
{
|
||||
name: '数据资源',
|
||||
bgImg: require('../../assets/home/integration/sjzyDetail.png'),
|
||||
list: []
|
||||
},
|
||||
{
|
||||
name: '组件服务',
|
||||
bgImg: require('../../assets/home/integration/zjfwDetail.png'),
|
||||
list: []
|
||||
},
|
||||
{
|
||||
name: '基础设施',
|
||||
bgImg: require('../../assets/home/integration/jcssDetail.png'),
|
||||
list: []
|
||||
},
|
||||
])
|
||||
const imgUrl = ref('')
|
||||
|
||||
// 融合服务--详情
|
||||
const getIntegrationServicesDeatil = (id) => {
|
||||
loadingPage.value = true
|
||||
getIntegrationDetail(id).then(
|
||||
(res) => {
|
||||
loadingPage.value = false
|
||||
if (res.data.code !== 0) {
|
||||
return message.error(res.data.msg)
|
||||
}
|
||||
detailInfoObj.value = res.data.data || {}
|
||||
let fuseResourceList = detailInfoObj.value.fuseResourceList || []
|
||||
abilityList.value.map(v => {
|
||||
let list = fuseResourceList.filter(x => x.type == v.name) || [];
|
||||
v.list = list.map(v => v.resource && v.resource.channelName) || []
|
||||
})
|
||||
let imgList = detailInfoObj.value.fuseAttrList.filter((val) => val.attrType == '服务图片') || []
|
||||
imgUrl.value = imgList[0] && imgList[0].attrValue || ''
|
||||
},
|
||||
(err) => {
|
||||
loadingPage.value = false
|
||||
message.error(err)
|
||||
}
|
||||
)
|
||||
}
|
||||
getIntegrationServicesDeatil(id)
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.resultListSearchInput-father {
|
||||
background: #f3f5f9;
|
||||
padding: 0.2rem;
|
||||
|
||||
// padding-left: 0.2rem;
|
||||
// padding-top: 0.2rem;
|
||||
.resultListSearchInput-son {
|
||||
background: #fff;
|
||||
padding: 0.2rem 0.2rem 0rem 0.3rem;
|
||||
|
||||
.hengxian {
|
||||
width: 100%;
|
||||
height: 0.01rem;
|
||||
background: rgba(150, 144, 144, 0.3);
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
}
|
||||
.flex-row-start {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.resultListSearchInput {
|
||||
margin-left: 0.1rem;
|
||||
|
||||
:deep(.ant-input) {
|
||||
width: 4rem;
|
||||
height: 0.36rem;
|
||||
background: #fff;
|
||||
border-radius: 0.04rem;
|
||||
}
|
||||
|
||||
:deep(.ant-input-search-button) {
|
||||
width: 0.8rem;
|
||||
height: 0.36rem;
|
||||
background: #0087ff;
|
||||
border-radius: 0.04rem !important;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
line-height: 0.34rem;
|
||||
margin-left: 0.1rem;
|
||||
}
|
||||
|
||||
:deep(.ant-input-group-addon) {
|
||||
left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.button-reset {
|
||||
border: 0;
|
||||
outline: none;
|
||||
width: 0.8rem;
|
||||
height: 0.36rem;
|
||||
background: #e1edfa;
|
||||
border-radius: 0.04rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 400;
|
||||
color: #0087ff;
|
||||
line-height: 0.34rem;
|
||||
margin-left: 2.5rem;
|
||||
cursor: pointer;
|
||||
.flex-row-center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.details-pageconetent {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 0.67rem;
|
||||
position: relative;
|
||||
background: rgba(245, 243, 243, 0.3);
|
||||
background: rgb(247, 247, 250);
|
||||
}
|
||||
|
||||
.details-pageconetent-left {
|
||||
max-height: 6.9rem;
|
||||
position: absolute;
|
||||
width: 2.5rem;
|
||||
top: 0.17rem;
|
||||
left: 2.5rem;
|
||||
margin-right: 0.17rem;
|
||||
overflow: auto;
|
||||
.content-box {
|
||||
width: 14rem;
|
||||
background: #fff;
|
||||
margin: 0 auto;
|
||||
padding: 0.84rem 0.4rem 0.4rem 0.4rem;
|
||||
}
|
||||
|
||||
.package-title {
|
||||
padding: 10px 0;
|
||||
color: #000;
|
||||
font-size: 0.18rem;
|
||||
}
|
||||
|
||||
.title-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
padding: 10px 0;
|
||||
border-bottom: 2px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.bar {
|
||||
height: 26px;
|
||||
width: 6px;
|
||||
background: #0058e1;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
.title-text {
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
|
||||
.info-box {
|
||||
padding: 0.2rem;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.img {
|
||||
height: 3rem;
|
||||
width: 4rem;
|
||||
// background-image: url('../../assets/home/integration/jcssDetail.png');
|
||||
// background-size: 100%;
|
||||
}
|
||||
|
||||
.ant-image-img {
|
||||
height: 3rem;
|
||||
width: 4rem;
|
||||
}
|
||||
|
||||
.right {
|
||||
padding: 0 0.2rem;
|
||||
flex: 1;
|
||||
position: relative;
|
||||
height: 3rem;
|
||||
box-sizing: border-box;
|
||||
|
||||
.name {
|
||||
font-size: 0.16rem;
|
||||
margin-bottom: 0.2rem;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
|
||||
.top {
|
||||
min-height: 7.2rem;
|
||||
position: relative;
|
||||
width: 11.5rem;
|
||||
display: flex;
|
||||
padding-top: 0.2rem;
|
||||
flex-direction: column;
|
||||
.area {
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
.desc {
|
||||
font-size: 0.16rem;
|
||||
justify-content: left;
|
||||
background: #f3f5f9;
|
||||
|
||||
.pagination {
|
||||
background: #f3f5f9;
|
||||
padding-bottom: 0.6rem;
|
||||
}
|
||||
|
||||
.top-title {
|
||||
padding: 0.2rem;
|
||||
display: flex;
|
||||
font-size: 18px;
|
||||
|
||||
.tabAll {
|
||||
font-size: 18px;
|
||||
color: #000000;
|
||||
margin-right: 35px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tabAll:nth-child(1) {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.sel {
|
||||
font-weight: 600;
|
||||
color: #0087ff;
|
||||
border-bottom: 0.02rem solid #0087ff;
|
||||
}
|
||||
}
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 6;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-card-grid) {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 1;
|
||||
word-break: break-all;
|
||||
.btn-box {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0.2rem;
|
||||
|
||||
.btn-text {
|
||||
bottom: 0.2rem;
|
||||
height: 0.4rem;
|
||||
width: 1.2rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.tag {
|
||||
padding: 4px 10px;
|
||||
background: #40a9ff;
|
||||
color: #fff;
|
||||
font-size: 0.12rem;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
.list-box {
|
||||
padding: 0.4rem;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -521,7 +521,7 @@
|
|||
#contain {
|
||||
.searchPoint {
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
z-index: 800;
|
||||
top: 0.1rem;
|
||||
right: 0.1rem;
|
||||
border-radius: 4px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,17 @@
|
|||
<template>
|
||||
<div class="menu-box">
|
||||
<home-header></home-header>
|
||||
<div></div>
|
||||
<home-footer></home-footer>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
import HomeFooter from '@/views/newHome/components/Footer'
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.menu-box {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -384,7 +384,6 @@
|
|||
height: 2.2rem;
|
||||
padding-top: 0.49rem;
|
||||
}
|
||||
background: #f3f5f9;
|
||||
border: #eaedf2 0.01rem solid;
|
||||
}
|
||||
|
||||
|
|
@ -516,7 +515,8 @@
|
|||
.content > div {
|
||||
height: 4.8rem;
|
||||
width: 3.1rem;
|
||||
margin-right: 0.2rem;
|
||||
margin-right: 0.1rem;
|
||||
background: #f3f5f9;
|
||||
}
|
||||
|
||||
.fixedmount {
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@
|
|||
/>
|
||||
</div>
|
||||
<a-popconfirm
|
||||
v-if="checkedListAbility.length != 0"
|
||||
title="是否进行批量删除?"
|
||||
ok-text="是"
|
||||
cancel-text="否"
|
||||
|
|
@ -37,10 +38,26 @@
|
|||
background: #fff;
|
||||
color: #0558e1;
|
||||
"
|
||||
@click="ceshiFunction()"
|
||||
>
|
||||
批量删除
|
||||
</a-button>
|
||||
</a-popconfirm>
|
||||
<a-button
|
||||
v-else
|
||||
type="primary"
|
||||
style="
|
||||
width: 1rem;
|
||||
height: 0.36rem;
|
||||
margin-right: 0.12rem;
|
||||
border-radius: 2px;
|
||||
background: #fff;
|
||||
color: #0558e1;
|
||||
"
|
||||
@click="ceshiFunction()"
|
||||
>
|
||||
批量删除
|
||||
</a-button>
|
||||
<a-button
|
||||
type="primary"
|
||||
style="
|
||||
|
|
@ -767,7 +784,13 @@
|
|||
})
|
||||
}
|
||||
}
|
||||
|
||||
//ceshiFunction
|
||||
const ceshiFunction = () => {
|
||||
debugger
|
||||
if (checkedListAbility.value.length == 0) {
|
||||
message.warning('请先选择需要操作的数据！')
|
||||
}
|
||||
}
|
||||
const delOne = (item, index) => {
|
||||
// console.log(item)
|
||||
sgcDel({
|
||||
|
|
|
|||
Loading…
Reference in New Issue