门户:融合服务列表+详情+我的收藏

This commit is contained in:
guoyue 2022-07-07 13:34:29 +08:00
parent 82b72fd5f6
commit 4aef24c734
12 changed files with 3149 additions and 2645 deletions

View File

@ -36,6 +36,7 @@ if (newLocation === 'qingdao') {
{ name: '区市站点', key: 'mapTest' },
// { name: '', key: 'houtaiguanli' },
{ name: '赋能案例', key: 'assignCase' },
{ name: '融合服务', key: 'integrationServices' },
]
footerDataList.footerList = {
company: {

View File

@ -329,3 +329,23 @@ export function getApplyCameraList(id) {
method: 'get',
})
}
// --start
// --
export function getIntegrationServicesList(params) {
return request({
url: '/fuse/page',
method: 'get',
params
})
}
// --
export function getIntegrationDetail(id) {
return request({
url: '/fuse/' + id,
method: 'get',
})
}
// --end

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

View File

@ -444,6 +444,24 @@ export const constantRoutes = [
icon: 'error-warning-line',
},
},
{
path: '/integrationServicesDetails',
name: 'integrationServicesDetails',
component: () => import('@/views/home/integrationServicesDetails'),
meta: {
title: '详情',
icon: 'error-warning-line',
},
},
{
path: '/integrationServices',
name: 'integrationServices',
component: () => import('@/views/home/integrationServices'),
meta: {
title: '列表',
icon: 'error-warning-line',
},
},
]
export const asyncRoutes = [
{

View File

@ -4,7 +4,7 @@
<div class="title">
<DetalsTitle title="常见问题" type="Q&A"></DetalsTitle>
</div>
<div class="content">
<div class="content" v-if="dataFrom.length > 0">
<div v-for="(item, index) in dataFrom" :key="index" class="content-son">
<div class="content-top">
<div class="top-img"></div>
@ -16,6 +16,9 @@
</div>
</div>
</div>
<div v-else class="no-data">
暂无数据
</div>
</div>
</template>
@ -120,4 +123,12 @@
}
}
}
.no-data {
background: transparent !important;
color: #212121;
text-align: center;
padding: 0.5rem 0;
font-size: 0.2rem;
}
</style>

File diff suppressed because it is too large Load Diff

View File

@ -205,6 +205,15 @@
path: '/assignCase',
})
break
case '融合服务':
router.push({
path: '/integrationServices',
// path: '/DetailsPageconetent',
query: {
select: '融合服务',
},
})
break
default:
router.push('/home')
break

View File

@ -10,31 +10,23 @@
}}
</div>
<div class="condition" :key="showKey">
<ul>
<li
v-for="item in selList"
:key="item.value"
@click="changeCondition(item.value)"
v-show="item.show"
>
<ul v-if="selectCardsname == '融合服务'">
<li v-for="(item, i) in orderList" :key="item.value" @click="changeOrder(i, item.value, item.orderType)">
{{ item.name }}
<span
class="arrow"
:class="item.value == selData ? 'down' : ''"
></span>
<span class="arrow" :class="item.orderType == 'ASC' ? 'down' : ''"></span>
</li>
</ul>
<ul v-else>
<li v-for="item in selList" :key="item.value" @click="changeCondition(item.value)" v-show="item.show">
{{ item.name }}
<span class="arrow" :class="item.value == selData ? 'down' : ''"></span>
</li>
</ul>
</div>
</div>
<div
class="result-list"
v-for="(item, index) in resourceList.data"
:key="item.index"
>
<div class="result-list" v-for="(item, index) in resourceList.data" :key="item.index">
<div class="item" :key="showKey">
<div
class="left"
:class="
<div class="left" :class="
item.type == '应用资源'
? 'yyzy'
: item.type == '数据资源'
@ -56,41 +48,25 @@
.attrValue == '业务组件'
? 'ywzj'
: ''
"
v-if="selectCardsname !== '基础设施'"
></div>
<div class="left jcss" v-else></div>
" v-if="selectCardsname !== '基础设施' && selectCardsname !== '融合服务'"></div>
<div class="left jcss" v-else-if="selectCardsname === '基础设施'"></div>
<div class="left rhfw" v-else-if="selectCardsname === '融合服务'"></div>
<div class="right">
<div class="header">
<span style="display: flex; align-items: center; width: 680px">
{{ item.name }}
<svg
t="1652322568870"
class="icon"
viewBox="0 0 3072 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="3062"
width="40"
height="40"
v-if="item.applyState == '通过'"
style="margin-left: 10px"
>
<svg t="1652322568870" class="icon" viewBox="0 0 3072 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="3062" width="40" height="40" v-if="item.applyState == '通过'"
style="margin-left: 10px">
<path
d="M2958.222222 0a113.777778 113.777778 0 0 1 113.777778 113.777778v796.444444a113.777778 113.777778 0 0 1-113.777778 113.777778H500.053333a113.777778 113.777778 0 0 1-85.617777-38.798222L32.824889 549.432889a56.888889 56.888889 0 0 1 0-74.922667L414.435556 38.798222A113.777778 113.777778 0 0 1 499.996444 0H2958.222222z m0 56.888889H500.053333a56.888889 56.888889 0 0 0-42.837333 19.399111L75.605333 512l381.610667 435.712a56.888889 56.888889 0 0 0 42.780444 19.399111H2958.222222a56.888889 56.888889 0 0 0 56.888889-56.888889V113.777778a56.888889 56.888889 0 0 0-56.888889-56.888889z"
fill="#d81e06"
p-id="3063"
></path>
fill="#d81e06" p-id="3063"></path>
<path
d="M398.222222 398.222222a113.777778 113.777778 0 1 1 0 227.555556 113.777778 113.777778 0 0 1 0-227.555556z m0 56.888889a56.888889 56.888889 0 1 0 0 113.777778 56.888889 56.888889 0 0 0 0-113.777778z"
fill="#d81e06"
p-id="3064"
></path>
fill="#d81e06" p-id="3064"></path>
<path
d="M1309.582222 491.064889v-273.066667h-505.173333v47.786667h455.338667v178.176h-378.88V342.926222h-49.152v358.4c0 55.978667 27.306667 84.650667 82.602666 84.650667h370.005334c28.672-1.365333 51.2-8.874667 66.218666-23.210667 16.384-17.749333 27.989333-68.266667 34.816-152.917333l-47.786666-15.018667-1.706667 26.737778c-4.664889 58.766222-12.970667 93.582222-24.917333 104.334222-10.24 8.192-23.893333 12.288-40.277334 12.288h-342.698666c-31.402667 0-47.104-15.701333-47.104-45.738666v-201.386667h428.714666z m430.08-307.2v102.4h-219.136v386.389333h48.469334v-46.421333h170.666666v178.858667h50.517334v-178.858667h167.936v41.642667h48.469333V286.264889h-216.405333v-102.4h-50.517334z m-170.666666 395.946667v-102.4h170.666666v102.4h-170.666666z m221.184 0v-102.4h167.936v102.4h-167.936z m-221.184-146.773334V332.003556h170.666666v101.034666h-170.666666z m221.184 0V332.003556h167.936v101.034666h-167.936z m733.866666-251.221333v44.373333h-165.205333v40.277334h165.205333v45.738666h-137.898666v39.594667h137.898666V398.222222h-184.32v40.96h417.792V398.222222h-186.368v-46.421333h144.725334v-39.594667h-144.725334v-45.738666h169.301334v-40.277334h-169.301334v-44.373333h-47.104z m-85.333333 429.397333h220.501333v49.834667h-220.501333v-49.834667z m220.501333-38.229333h-220.501333v-50.517333h220.501333v50.517333z m-220.501333 126.293333h220.501333v38.912c0 15.701333-8.874667 23.893333-25.258666 23.893334l-54.613334-2.048 11.605334 43.690666h57.344c38.229333 0 58.026667-18.432 58.026666-55.296v-266.24H2391.608889V807.822222h47.104v-108.544z m-222.549333-509.952l-34.816 33.450667c49.152 36.864 88.064 71.68 116.736 104.448l33.450666-34.133333a795.079111 795.079111 0 0 0-115.370666-103.765334z m-82.602667 201.386667h144.725333v299.690667c20.48-19.114667 41.642667-40.277333 64.853334-64.170667l12.970666 51.882667a923.932444 923.932444 0 0 1-121.514666 105.813333l-19.114667-43.690667c10.24-9.557333 15.701333-19.797333 15.701333-31.402666V437.816889h-97.621333v-47.104z"
fill="#d81e06"
p-id="3065"
></path>
fill="#d81e06" p-id="3065"></path>
</svg>
</span>
<div class="header-right">
@ -103,30 +79,23 @@
<span>{{ item.createDate.substring(11, 19) }}</span>
</template>
<template v-else>--</template>
<!-- <span>{{ item.createDate || '--' }}</span> -->
</div>
<!-- <div>
更新时间
<span>{{ item.updateDate || '--' }}</span> -->
<!-- </div> -->
</div>
</div>
<div class="dec">
<div
v-if="
selectCardsname !== '基础设施' && selectCardsname !== '数据资源'
"
>
<div v-if="
selectCardsname !== '基础设施' && selectCardsname !== '数据资源' && selectCardsname !== '融合服务'
">
<span>{{ item.shareType || '--' }}</span>
</div>
<div>
<div v-if="selectCardsname !== '融合服务'">
<span>{{ item.deptName || '--' }}</span>
</div>
<div v-if="selectCardsname !== '基础设施'">
{{ item.description || '--' }}
</div>
</div>
<div class="bottom" v-if="selectCardsname !== '基础设施'">
<div class="bottom" v-if="selectCardsname !== '基础设施' && selectCardsname !== '融合服务'">
<div>
<div v-if="selectCardsname !== '数据资源'">
浏览量{{ item.visits || 0 }}
@ -141,14 +110,7 @@
</div>
<div class="pingfen">
<a-tooltip placement="top" mouseEnterDelay="1">
<!-- <template #title>
<span>{{ item.score || 0 }}</span>
</template> -->
<a-rate
:value="item.score || 0"
disabled
v-if="item.score != 0"
/>
<a-rate :value="item.score || 0" disabled v-if="item.score != 0" />
</a-tooltip>
</div>
</div>
@ -156,58 +118,27 @@
<div class="right" v-if="selectCardsname !== '基础设施'">
<div class="shopping" :key="shoppingKey">
<template v-if="selectCardsname == '组件服务'">
<span
class="shopping-down"
v-if="item.isInShoppingCart"
></span>
<span
class="shopping-on"
v-else
@click="addShoppingCart(item, index)"
></span>
<span class="shopping-down" v-if="item.isInShoppingCart"></span>
<span class="shopping-on" v-else @click="addShoppingCart(item, index)"></span>
</template>
</div>
<div class="sc">
<span
class="sc-down"
v-if="item.isCollect == 'false'"
@click="addCollect(item)"
></span>
<span
class="sc-on"
v-if="item.isCollect == 'true'"
@click="addCollect(item)"
></span>
<span class="sc-down" v-if="item.isCollect == 'false'" @click="addCollect(item)"></span>
<span class="sc-on" v-if="item.isCollect == 'true'" @click="addCollect(item)"></span>
</div>
<div
class="shopping pk"
:key="pk"
v-show="
<div class="shopping pk" :key="pk" v-show="
cardType == '组件服务' && findComponentName(item, '智能算法')
"
>
">
<span class="pk-on" @click="goComparePk(item, index)"></span>
</div>
<a-button
type="primary"
@click="toView('details', item)"
v-if="whoShow1.itShowQingDao"
>
<a-button type="primary" @click="toView('details', item)" v-if="whoShow1.itShowQingDao">
查看详情
</a-button>
<!-- <a-button
style="margin-left: 10px"
v-show="
cardType == '组件服务' && findComponentName(item, '智能算法')
"
>
免费试用
</a-button> -->
<a-button
type="primary"
@click="toView('apply', item)"
v-show="cardType == '组件服务'"
>
<a-button style="margin-left: 10px" v-show="selectCardsname === '融合服务'"
@click="handleAKeyApplication(item)">
一键申请
</a-button>
<a-button type="primary" @click="toView('apply', item)" v-show="cardType == '组件服务'">
{{
item.shareCondition == '免批申请' ? '免批申请' : '立即申请'
}}
@ -222,12 +153,7 @@
</div>
</div>
</div>
<a-modal
v-model:visible="visible"
title="视频预览"
:width="750"
destroyOnClose
>
<a-modal v-model:visible="visible" title="视频预览" :width="750" destroyOnClose>
<template #footer></template>
<div style="width: 100%; display: flex; justify-content: center">
<div style="width: 100%; height: 100%">
@ -247,7 +173,6 @@
import { getHls } from '@/api/home.js'
export default {
name: '',
// props: ['resourceList', 'resourceTotal', 'selectCardsname'],
props: {
resourceList: {
type: Object,
@ -347,10 +272,22 @@
},
components: {},
setup(props) {
// eslint-disable-next-line no-undef
const whoShow1 = whoShow
const showKey = ref(0)
let shoppingKey = ref(1)
//
const orderList = ref([
{
value: 'create_date',
name: '发布时间',
orderType: 'DESC'
},
{
value: 'update_date',
name: '更新时间',
orderType: 'DESC'
},
])
// id
const selList = ref([
{ name: '发布时间', value: 'tdr.create_date', show: true },
@ -416,15 +353,24 @@
console.log('use value', searchValue)
console.log('or use this.value', searchValue.value)
}
function toView(type, item) {
if (props.selectCardsname == '数据资源') {
window.open(
'http://15.72.158.81/web/ZWXXSQ/bm/MuluDetail.aspx?zyguid=' +
item.guid
)
} else {
}
else if (props.selectCardsname == '融合服务') {
router.push({
path: '/integrationServicesDetails',
query: {
id: item.id,
},
})
}
else {
if (type === 'apply') {
console.log('一键申请===================>', item)
localStorage.setItem(
'applyList',
JSON.stringify([
@ -448,11 +394,6 @@
path: '/apply',
})
} else {
console.log(
'111111111111111111===========>',
router,
props.selectCardsname
)
router.push({
path: '/details',
query: {
@ -514,16 +455,53 @@
}
}
}
//
const changeCondition = (val) => {
selData.value = selData.value == val ? 'total' : val
const orderType = selData.value == val ? 'ASC' : 'DESC'
let orderType = selData.value == val ? 'ASC' : 'DESC'
mybus.emit('changeCondition', {
orderField: val,
orderType: orderType,
})
console.log('选择===========》', val, selData.value)
}
// --
const changeOrder = (i, val, type) => {
let newType = type === 'DESC' ? 'ASC' : 'DESC'
orderList.value[i].orderType = newType
mybus.emit('changeCondition', {
orderField: val,
orderType: newType,
})
}
// --
const handleAKeyApplication = (item) => {
localStorage.setItem(
'applyList',
JSON.stringify([
{
arr: [
{
delFlag: item.delFlag,
description: item.description,
resourceId: item.id,
resourceName: item.name,
time: item.createDate,
type: item.type,
},
],
deptId: item.deptId,
deptName: item.deptName,
},
])
)
router.push({
path: '/apply',
})
}
mybus.on('chongzhi', () => {
selData.value = 'total'
})
@ -597,6 +575,9 @@
goComparePk,
whoShow1,
showKey,
orderList,
changeOrder,
handleAKeyApplication,
}
},
beforeUnmount() {
@ -607,7 +588,7 @@
</script>
<style scoped lang="less">
#search-result-list-container {
width: 1088px;
width: 100%;
padding: 0 20px;
background: #f3f5f9;
@ -621,11 +602,7 @@
}
.shai-xuan {
width: 1047px;
height: 36px;
// margin: 11px 0 20px;
// background: #e5f2ff;
// padding-left: 20px;
display: flex;
align-items: center;
position: relative;
@ -691,13 +668,14 @@
}
.result-list {
width: 1048px;
width: 100%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
border-bottom: 1px rgba(150, 144, 144, 0.3) solid;
border-top: 1px rgba(150, 144, 144, 0.3) solid;
padding: 10px 0;
padding: 10px 20px;
box-sizing: border-box;
.item {
width: 100%;
@ -725,23 +703,33 @@
background: url('~@/assets/home/sjzy_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%;
}
.rhfw {
background: url('~@/assets/home/rhfw_square.png') no-repeat;
background-size: 100%;
}
.header {
display: flex;
justify-content: space-between;
@ -779,7 +767,6 @@
.dec {
overflow: hidden;
text-overflow: ellipsis;
// white-space: nowrap;
color: #0058e1;
display: flex;
margin-top: 10px;
@ -811,19 +798,6 @@
font-size: 14px;
margin: 5px 0;
// .left {
// width: 600px;
// display: flex;
// justify-content: space-between;
// flex-wrap: wrap;
// & > div {
// width: 300px;
// & > span {
// color: #0087ff;
// font-weight: 600;
// }
// }
// }
.right {
flex: 1;
display: flex;
@ -862,7 +836,6 @@
}
.sc {
// margin-top: 4px;
cursor: pointer;
display: flex;
align-items: center;

View File

@ -0,0 +1,68 @@
export const titleNameArray = [
{
photo: require('@/assets/newHome/banner-zj.png'),
name: '组件服务',
},
{
photo: require('@/assets/newHome/banner-yy.png'),
name: '应用资源',
},
{
photo: require('@/assets/newHome/banner-jc.png'),
name: '基础设施',
},
{
photo: require('@/assets/newHome/banner-sj.png'),
name: '数据资源',
},
{
photo: require('@/assets/newHome/banner-zs.png'),
name: '知识库',
},
]
//
export const keyongziyuanqingkaungArray = [
{
name: 'CPU/核:',
value: 2102,
},
{
name: '内存/T',
value: 6.68,
},
{
name: '存储/T',
value: 2102,
},
{
name: 'RDS for Mysql/G',
value: 982.82,
},
{
name: 'RDS for SqlServer/G',
value: 997.17,
},
]
export const shujuziyuanqingkuangArray = [
{
name: '已上线目录:',
value: 10372,
danwei: '条',
},
{
name: '已发布服务:',
value: 1080,
danwei: '条',
},
{
name: '已发布接口:',
value: 976,
danwei: '条',
},
{
name: '更新时间:',
value: '2022-05-06',
},
]

View File

@ -0,0 +1,317 @@
<template>
<!-- 青岛 -->
<div class="details-pageconetent">
<home-header></home-header>
<div class="top">
<div class="resultListSearchInput-father">
<div class="resultListSearchInput-son">
模糊搜索
<a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large"
@search="getAppResources" @change="onSearch" class="resultListSearchInput" />
<button class="button-reset" @click="chongzhi()">重置</button>
<div class="hengxian"></div>
</div>
</div>
<searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2"
:resourceList="resourceList" :resourceTotal="resourceTotal" selectCardsname="融合服务" />
<div class="pagination">
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage"
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper
:total="resourceTotal" :page-size-options="pageSizeOptions" @change="pageChange"
@showSizeChange="onShowSizeChange" />
</div>
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem">
<a-empty />
</div>
</div>
</div>
<home-footer></home-footer>
</template>
<script>
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 { message } from 'ant-design-vue'
export default defineComponent({
setup() {
//
const loading = ref(true)
const currentPage = ref(1)
const currentPageSize = ref(5)
const pageSizeOptions = ref(['5', '10', '20', '50'])
const router = useRouter()
const select = router.currentRoute.value.query.select
const searchValue = ref('')
const Cardsname = ref(select)
const resourceList = reactive({ data: [] })
const resourceTotal = ref(0)
const current = ref(1)
//
let listKey = ref(0)
//
const listKey2 = ref(0)
//
const paramsGetResources = {
pageNum: 1,
pageSize: currentPageSize.value,
type: Cardsname.value,
name: '',
orderField: 'create_date', // total visits 访 applyCount score collectCount
orderType: 'DESC', // ASC DESC
}
//
const onSearch = () => {
loading.value = true
currentPage.value = 1
}
//
const chongzhi = () => {
loading.value = true
//
searchValue.value = ''
//
currentPage.value = 1
currentPageSize.value = 5
//
paramsGetResources.pageNum = 1
paramsGetResources.pageSize = 5
paramsGetResources.orderField = 'create_date'
paramsGetResources.orderType = 'DESC'
mybus.emit('chongzhi')
getAppResources()
}
const getAppResources = () => {
getIntegrationList()
}
//
const getIntegrationList = () => {
let postData = {
limit: currentPageSize.value,
page: currentPage.value,
orderField: paramsGetResources.orderField,
orderType: paramsGetResources.orderType,
name: searchValue.value
}
getIntegrationServicesList(postData).then(res => {
if (res.data.code !== 0) {
return message.error(res.data.msg)
}
resourceList.data = res.data.data.list || []
resourceTotal.value = res.data.data.total || 0
}, err => {
message.error(err)
})
}
mybus.on('paramsGetResources', (ids) => {
if (ids && ids.length > 0) {
paramsGetResources.deptIds = ids
} else {
delete paramsGetResources.deptIds
}
getAppResources()
console.log('paramsGetResources', paramsGetResources)
})
mybus.on('changePage', (page) => {
paramsGetResources.pageNum = page
getAppResources('分页查询')
})
mybus.on('changeSelcted', () => {
getAppResources()
})
mybus.on('refresh', () => {
paramsGetResources.pageNum = 1
currentPage.value = 1
getAppResources()
})
mybus.on('changeCondition', (condition) => {
paramsGetResources.orderField = condition.orderField
paramsGetResources.orderType = condition.orderType
getAppResources()
})
const pageChange = (val) => {
console.log(val)
loading.value = true
currentPage.value = val
paramsGetResources.pageNum = val
let params = '分页查询' //
getAppResources(params)
}
onMounted(() => {
listKey2.value++;
getAppResources()
})
//
const onShowSizeChange = (current, pageSize) => {
currentPage.value = current
currentPageSize.value = pageSize
paramsGetResources.pageNum = current
paramsGetResources.pageSize = pageSize
getAppResources()
}
watch(currentPageSize, () => {
console.log('pageSize', currentPageSize.value)
})
return {
listKey,
searchValue,
currentPage,
resourceList,
resourceTotal,
pageChange,
listKey2,
Cardsname,
getAppResources,
chongzhi,
onSearch,
currentPageSize,
pageSizeOptions,
current,
loading,
}
},
components: {
HomeHeader,
HomeFooter,
searchResultList,
},
beforeUnmount() {
mybus.off('paramsGetResources')
mybus.off('changeCondition')
mybus.off('refresh')
mybus.off('changePage')
},
})
</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;
}
}
}
.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;
}
.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);
.details-pageconetent-left {
max-height: 6.9rem;
position: absolute;
width: 2.5rem;
top: 0.17rem;
left: 2.5rem;
margin-right: 0.17rem;
overflow: auto;
}
.top {
min-height: 7.2rem;
position: relative;
width: 11.5rem;
display: flex;
padding-top: 0.2rem;
flex-direction: column;
font-size: 0.16rem;
justify-content: left;
background: #f3f5f9;
.pagination {
background: #f3f5f9;
padding-bottom: 0.6rem;
}
}
}
:deep(.ant-card-grid) {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
-webkit-line-clamp: 1;
}
</style>

View File

@ -0,0 +1,452 @@
<!-- 融合服务详情 -->
<template>
<div class="IntegrationServicesDetails" :class="{ fixed2: scrollTop >= 600 }">
<!-- 头部基本信息 -->
<application-top-details :dataList="detailInfoObj" :navList="navList"></application-top-details>
<!-- 导航 -->
<div :class="{ fixed: scrollTop >= 600 }">
<div class="application-navigation">
<template v-for="nav in navList" :key="nav.key">
<div class="nav" :class="{ selectNow: nav.key == selectNow }" @click="selectNav(nav.key)">
{{ nav.name }}
<span class="line"></span>
</div>
</template>
</div>
</div>
<!-- 组合能力 -->
<div id="integration-combination-ability" class="combination-ability scrollBox">
<div class="title-1">
<DetalsTitle title="组合能力" type="COMBINATION 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>
</div>
</div>
</div>
</div>
<!-- 使用方式 -->
<div id="integration-use-way" class="use-way scrollBox">
<div class="title-1">
<DetalsTitle title="使用方式" type="USE WAY"></DetalsTitle>
</div>
<div class="content">
<div class="content-card flex-row-between left word-bg">
<div class="content-card-item left-item">
<div class="card-title">文档</div>
<!-- <div class="card-text">文档描述文档描述文档描述文档描述</div> -->
</div>
<div class="content-card-item btn-box">
<div class="btn" @click="handleOpenUrl('技术文档')">技术文档</div>
<div class="btn" @click="handleOpenUrl('使用手册')">使用手册</div>
</div>
</div>
<div class="content-card flex-row-start">
<div class="right-item content-card-item" v-for="(use, i) in useWayShowList" :key="i">
<div class="card-title title">{{ use.title }}</div>
<div class="card-text" v-for="(d, k) in Object.keys(use.info)" :key="k">
{{ use.info[d] }}:{{ detailInfoObj[d] || '--' }}
</div>
</div>
</div>
</div>
</div>
<!-- 常见问题-->
<application-common-problem :dataList="detailInfoObj" id="common-problem" class="scrollBox">
</application-common-problem>
<home-footer></home-footer>
</div>
</template>
<script setup>
import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue'
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //
import HomeFooter from '@/views/newHome/components/Footer'
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router'
import { getIntegrationDetail } from '@/api/home'
import mybus from '@/myplugins/mybus'
const router = useRouter()
const scrollTop = ref(0)
const domArr = ref([])
const id = router.currentRoute.value.query.id
document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0
mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id) && document.querySelector('#' + id).offsetTop - 50;
document.documentElement.scrollTop = top
document.body.scrollTop = top
})
const navList = ref([
{
name: '组合能力',
key: 'integration-combination-ability',
},
{
name: '使用方式',
key: 'integration-use-way',
},
{
name: '常见问题',
key: 'common-problem',
},
])
const selectNow = ref('integration-combination-ability')
const useWayShowList = ref([
{
title: '归属部门',
info: {
deptUser: '部门联系人',
mobile: '联系人电话',
},
},
{
title: '服务商',
info: {
providerUser: '服务商联系人',
providerMobile: '联系人电话',
},
},
])
const combineList = ref([
{
title: '基础设施',
list: []
},
{
title: '组件服务',
list: []
},
{
title: '数据资源',
list: []
},
])
const detailInfoObj = ref({})
onMounted(() => {
window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox')
scrollTop.value =
document.documentElement.scrollTop || document.body.scrollTop
for (let i = 0; i < domArr.value.length; i++) {
if (i === 0) {
if (scrollTop.value <= domArr.value[i + 1].offsetTop - 50) {
selectNow.value = domArr.value[i].id
}
} else if (i == domArr.value.length - 1) {
if (scrollTop.value >= domArr.value[i].offsetTop - 50) {
selectNow.value = domArr.value[i].id
}
} else {
if (
scrollTop.value >= domArr.value[i].offsetTop - 50 &&
scrollTop.value <= domArr.value[i + 1].offsetTop - 50
) {
selectNow.value = domArr.value[i].id
}
}
}
})
})
const selectNav = (key) => {
selectNow.value = key
mybus.emit('flyToView', selectNow.value)
}
// --
const getIntegrationServicesDeatil = (id) => {
getIntegrationDetail(id).then(res => {
if (res.data.code !== 0) {
return message.error(res.data.msg)
}
detailInfoObj.value = res.data.data || {}
//
let fuseAttrList = res.data.data.fuseAttrList || []
//
let fuseResourceList = res.data.data.fuseResourceList || []
let questionValue = fuseAttrList.find(v => v.attrType === '常见问题') || {}
let questionObj = {
attrType: '常见问题',
attrValue: JSON.stringify(questionValue.attrValue || [])
}
let areaObj = {
attrType: '应用领域',
attrValue: detailInfoObj.value.applicationArea
}
console.log('areaObj------------>', areaObj);
combineList.value.map(item => {
let arr = (fuseResourceList.filter(v => v.resource && v.resource.type == item.title) || []).map(d => d.resource.name)
item.list = arr;
return item
})
detailInfoObj.value.infoList = []
detailInfoObj.value.infoList.push(questionObj)
detailInfoObj.value.infoList.push(areaObj)
}, err => {
message.error(err)
})
}
getIntegrationServicesDeatil(id)
function handleOpenUrl(type) {
let obj = (detailInfoObj.value.fuseAttrList || []).find(v => v.attrType == type) || {};
let url = obj.attrValue || '';
if (!obj.attrValue) {
return message.error('错误的文档链接地址!')
}
window.open(
window.SITE_CONFIG.previewUrl +
'hisense_office/onlinePreview?url=' +
btoa(encodeURI(url))
)
}
onBeforeUnmount(() => {
mybus.off('flyToView')
})
</script>
<style lang="less" scoped>
.flex-row-between {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.flex-row-start {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.flex-row-center {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.IntegrationServicesDetails {
.fixed {
position: fixed !important;
z-index: 2000;
top: 0;
left: 0;
}
.fixed2>div:nth-of-type(3) {
margin-top: 0.84rem;
}
.application-navigation {
width: 19.12rem;
height: 0.84rem;
line-height: 0.8rem;
display: flex;
justify-content: space-around;
font-size: 0.24rem;
color: #666;
background: #fff;
padding: 0 3rem;
box-shadow: 0rem 0.05rem 0.1rem #f2f3fb;
position: relative;
.nav {
cursor: pointer;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
.line {
width: 0.4rem;
height: 0.04rem;
}
}
.selectNow {
color: #526aff;
.line {
background: #526aff;
}
}
}
}
.use-way {
padding: 0.8rem 0;
display: flex;
flex-direction: column;
align-items: center;
.title-1 {
margin-bottom: 0.3rem;
}
.left {
.btn {
padding: 10px 20px;
color: #526aff;
background: #fff;
border-radius: 50px;
margin: 10px;
font-size: 0.2rem;
width: 150px;
text-align: center;
cursor: pointer;
}
.btn-box {
display: flex;
flex-direction: column;
align-items: flex-end;
}
}
.content {
display: flex;
width: 13rem;
justify-content: space-between;
.word-bg {
background: linear-gradient(90deg, #7184fc, #94a3fc) !important;
}
.content-card {
height: 1.5rem;
width: 6.2rem;
border-radius: 0.2rem;
background: linear-gradient(to right,
rgba(113, 132, 252, 0.4),
rgba(148, 163, 252, 0.4));
padding: 0 0.3rem;
display: flex;
justify-content: center;
.card-title {
font-size: 0.26rem;
color: #212956;
margin-bottom: 0.2rem;
line-height: 0.26rem;
}
.content-card-item {
width: 50%;
.card-text {
margin-right: 0.2rem;
color: rgba(33, 41, 86, 0.8);
font-size: 0.2rem;
max-width: 2.8rem;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
div:first-child {
display: block;
}
}
}
}
}
.combination-ability {
padding: 0.8rem 0;
background: rgb(247, 248, 250);
.title-1 {
margin-bottom: 0.3rem;
}
.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%);
}
.title {
color: #212121;
text-align: center;
padding: 0.2rem 0;
font-size: .22rem;
text-align: center;
}
}
.name-box {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
width: 100%;
}
.no-data {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: center;
font-size: 0.16rem;
color: #666;
text-align: center;
}
.name-text {
font-size: 0.16rem;
color: #212121;
line-height: 0.3rem;
height: 0.3rem;
text-align: center;
width: 50%;
box-sizing: border-box;
}
}
</style>

View File

@ -1,117 +1,58 @@
<template>
<div class="title">我的收藏</div>
<div class="sousuokuang">
<a-input-search
v-model:value="name"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@change="onSearch"
@search="getList"
/>
<a-button
type="primary"
style="width: 80px; height: 36px; margin-left: 10px"
@click="clean"
>
<a-input-search v-model:value="name" placeholder="请输入关键词" enter-button="搜索" size="large" @change="onSearch"
@search="getList" />
<a-button type="primary" style="width: 80px; height: 36px; margin-left: 10px" @click="clean">
重置
</a-button>
</div>
<div class="tab">
<span>筛选</span>
<div
:class="tabIndex == index ? 'tabclass' : ' '"
@click="changeTab(index)"
v-for="(item, index) in tabList"
:key="index"
>
<div :class="tabIndex == index ? 'tabclass' : ' '" @click="changeTab(index)" v-for="(item, index) in tabList"
:key="index">
{{ item }}
</div>
</div>
<a-list
class="demo-loadmore-list"
:loading="initLoading"
item-layout="horizontal"
:data-source="list"
:key="showKey"
>
<a-list class="demo-loadmore-list" :loading="initLoading" item-layout="horizontal" :data-source="list" :key="showKey">
<template #renderItem="{ item }">
<a-list-item>
<a-skeleton avatar :title="false" :loading="!!item.loading" active>
<a-list-item-meta
:description="item.description || '--'"
style="position: relative"
>
<a-list-item-meta :description="item.description || '--'" style="position: relative">
<template #title>
<span
@click="showItem(item.resourceId, item.type, item.delFlag)"
style="cursor: pointer"
class="name"
>
<span @click="showItem(item, item.type, item.delFlag)" style="cursor: pointer" class="name">
{{ item.name }}
</span>
<span class="time">收藏时间{{ item.createDate }}</span>
<svg
t="1652233950228"
class="icon"
viewBox="0 0 1024 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="5970"
data-spm-anchor-id="a313x.7781069.0.i8"
width="50"
height="50"
v-if="item.delFlag == 4 || item.delFlag == 5"
style="position: absolute; top: 0; left: 100px"
>
<svg t="1652233950228" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="5970" data-spm-anchor-id="a313x.7781069.0.i8" width="50"
height="50" v-if="item.delFlag == 4 || item.delFlag == 5"
style="position: absolute; top: 0; left: 100px">
<path
d="M955.22053 256C813.82053 11.2 500.72053-72.6 255.92053 68.8S-72.67947 523.2 68.72053 768 523.22053 1096.6 768.02053 955.2c244.7-141.2 328.6-454.1 187.4-698.8 0-0.1-0.1-0.3-0.2-0.4zM762.02053 944.7c-239 138.1-544.8 56.2-682.9-182.8S22.92053 217.1 261.92053 79.1s544.8-56.2 682.9 182.8c137.9 239 56.1 544.6-182.8 682.8z"
fill="#515151"
opacity=".5"
p-id="5971"
></path>
fill="#515151" opacity=".5" p-id="5971"></path>
<path
d="M898.12053 289.2C775.02053 76 502.42053 2.9 289.22053 126 76.02053 249.1 3.02053 521.6 126.02053 734.8 249.12053 948 521.62053 1021.1 734.82053 898 947.92053 774.9 1021.02053 502.4 898.12053 289.2zM731.62053 892.8C521.32053 1014.3 252.42053 942.2 131.02053 731.9 9.52053 521.6 81.62053 252.7 291.92053 131.3 502.12053 9.9 771.02053 81.8 892.42053 292c121.5 210.3 49.5 479.3-160.8 600.8z"
fill="#515151"
opacity=".5"
p-id="5972"
></path>
fill="#515151" opacity=".5" p-id="5972"></path>
<path
d="M323.62053 176.8c3.6-2 6 0.8 8.8 2.8 6 4.4 12.4 8.8 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 13.6-5.6 20.8 4.8 6 10 11.6 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.4 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.4-1.9-3.9-4.7-4.4-7.7l-7.2-20.5-25.2-6.4c-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 4-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.7-0.8-0.3-1.6 0.6-2zM200.72053 289.2c3.6-2 6 0.8 8.8 2.8 6.4 4.4 12.4 8.4 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 13.6-5.6 20.8 4.8 6 10 11.6 14.8 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.4-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.8 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.2-2-3.8-4.7-4.4-7.7l-7.2-20.5c-8.4-2-16.8-4.4-25.2-6.4-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 3.6-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.4-1.2 0-1.6 0.8-2.4l0.2 0.4z m276.6-159.6c3.6-2 6 0.8 8.8 2.8 6.4 4.4 12.4 8.4 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 14-5.6 20.8 4.8 6 10 12 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.8 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.2-2-3.8-4.7-4.4-7.7l-7.2-20.5-25.2-6.4c-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 4-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.8-1.2-0.4-1.6 0.4-2.4l0.2 0.4z m141.9 29.6c3.6-2 6 0.8 8.8 2.8l18.8 12.8c7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 14-5.6 20.8 4.8 6 10 12 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4-7.7 0.4-15.2 0.8-22.4 0.8-4.4 6.8-8.4 13.2-12.8 20-1.6 2.4-4 5.1-7.2 4-2.4-1.9-3.9-4.7-4.4-7.7l-7.2-20.5c-8.4-2-16.8-4.4-25.2-6.4-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 4-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.5-1.2 0.2-1.6 0.6-2zM150.02053 430c3.6-2 6 0.8 8.8 2.8 6.4 4.4 12.4 8.4 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-4 14-5.6 20.8 4.8 6 10 11.6 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.8 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.2-2-3.8-4.7-4.4-7.7l-7.2-20.5-25.2-6.4c-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 3.6-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.7-0.8-0.3-1.5 0.6-2z m558.9 414.4c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-2-14-3.6-20.8-5.6-2.8-7.2-5.1-14.4-7.7-21.6-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.1 4.4-0.7 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.5-1.1 0.8-1.1 1.6-1.1h0.1z m-158.8 50c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.1-3.7-5.6-3.6-7.7-4-6.8-1.6-14-3.6-20.8-5.6l-7.7-22c-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.3 4.3-0.9 6.4-1.6l14.4-4.8c2-1 4.2-1.7 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.4-0.8 0.8-0.8 1.7-0.7z m276.5-159.6c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-2-14-3.6-20.8-5.6-2.8-7.2-5.1-14.4-7.7-21.6-1.2-3.6-2.8-6.4-5.6-6.8s-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.2 4.4-0.7 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0-0.8 0.8-1.2 1.6-1.2l0.1 0.1z m45.6-137.6c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-1.6-14-3.6-20.8-5.6l-7.7-22c-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.3 4.3-0.9 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.2-0.7 0.6-0.7 1.4-0.7h0.3zM402.72053 868c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-2-14-3.6-20.8-5.6-2.8-7.2-5.1-14.4-7.7-21.6-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.3 4.3-0.9 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.5-0.8 1-1.1 1.7-1.1z"
fill="#515151"
opacity=".5"
p-id="5973"
></path>
fill="#515151" opacity=".5" p-id="5973"></path>
<path
d="M386.42053 590.4l-43.8-75.9L207.02053 592.7l10.2 17.7L334.02053 543l23.4 40.4-90.5 52.2-13.5-23.4-18.7 10.8 53.1 92c9.1 15.8 21.2 19.5 36.4 10.7l98.8-57c6.2-3.6 11-9.3 13.4-16.1-1.4-15.9-6.2-31.2-14.2-45l-21.4 4.8c6.7 10.3 11 21.9 12.8 34-1 3.3-3.2 6-6.1 7.8l-88.3 51c-6.2 3.6-11.1 2.1-14.8-4.3l-27.3-47.4 109.3-63.1z m2.9-103.2l10.4 18.1 65.6-37.9 79.9 138.4 18.6-10.8-55.9-96.9c18.8-0.9 43.2-0.6 73 0.7l1.5-23.1c-29.8-0.3-58.4 0.4-86 2.6l-12.5-21.6 74.9-43.2-10.4-18.1-159.1 91.8zM669.52053 329l38.2 66.2 61.4-35.4-38.1-66.1-61.5 35.3z m72.4 24.2l-26.3 15.2-19-33 26.3-15.2 19 33zM599.02053 356.7l7.9 13.7-23.3 13.5 9.8 17 21.8-12.6c7.5 18.7 6.6 39.6-2.5 57.6l20.7 4.4c10.3-23.1 10.3-49.4 0-72.5l18.8-10.9c6 9.2 10.7 19.2 14.2 29.7 0.3 5-2.6 9.7-7.2 11.7-2.9 1.2-6.4 2.8-10.9 4.9l14.1 14.1c3.7-1.3 7.3-2.9 10.7-4.8 8.6-3.9 14.4-12.2 15.2-21.6-5.4-22.1-14.6-43-27.4-61.8l-36.1 20.8-7.9-13.7-17.9 10.5z m29.9 108.1l10 17.4 53.2-30.7c-7.8 23.7-20.6 45.4-37.5 63.6l20.6 11.1c18.6-24.2 30-53.1 33-83.4l29.8 51.5 18.4-10.7-29.8-51.5c27.4 11.5 57.2 16.3 86.9 14.1l3.5-23.5c-24.7 5.1-50.1 5-74.8-0.1l53.5-30.9-10-17.3-69.3 40-7.3-12.6-18.4 10.7L698.02053 425l-69.1 39.8z"
fill="#515151"
opacity=".5"
p-id="5974"
></path>
fill="#515151" opacity=".5" p-id="5974"></path>
</svg>
</template>
<template #avatar>
<a-checkbox
:checked="item.checked"
@click.stop="checkedItem(item)"
@change="checkedItem(item)"
></a-checkbox>
<a-checkbox :checked="item.checked" @click.stop="checkedItem(item)" @change="checkedItem(item)">
</a-checkbox>
</template>
</a-list-item-meta>
</a-skeleton>
</a-list-item>
</template>
</a-list>
<a-pagination
v-model:current="pageNum"
v-model:page-size="pageSize"
:page-size-options="pageSizeOptions"
:total="total"
show-size-changer
@showSizeChange="onShowSizeChange"
@change="pageChange"
:key="showKey"
>
<a-pagination v-model:current="pageNum" v-model:page-size="pageSize" :page-size-options="pageSizeOptions"
:total="total" show-size-changer @showSizeChange="onShowSizeChange" @change="pageChange" :key="showKey">
<template #buildOptionText="props">
<span>{{ props.value }}/</span>
</template>
@ -121,17 +62,9 @@
<a-checkbox v-model:checked="checkAll" @change="onCheckAllChange">
全选
</a-checkbox>
<a-popconfirm
:title="'是否批量删除已选中的' + checkedList.length + '条数据?'"
ok-text="是"
cancel-text="否"
@confirm="delList"
@cancel="cancel"
>
<a-button
type="primary"
style="width: 70px; height: 32px; margin-left: 10px"
>
<a-popconfirm :title="'是否批量删除已选中的' + checkedList.length + '条数据?'" ok-text="" cancel-text="" @confirm="delList"
@cancel="cancel">
<a-button type="primary" style="width: 70px; height: 32px; margin-left: 10px">
删除
</a-button>
</a-popconfirm>
@ -144,6 +77,7 @@
import { message } from 'ant-design-vue'
import mybus from '@/myplugins/mybus'
import { getScList, scDel, getTopCategory } from '@/api/personalCenter'
import { getType } from '@turf/invariant'
const router = useRouter()
//
const pageNum = ref('1')
@ -224,22 +158,22 @@
name: name.value,
type: type.value,
}).then((res) => {
if (res.data.code !== 0) {
return message.error(res.data.msg)
}
initLoading.value = false
checkAll.value = true
console.log('申购车列表================>', res.data.data.records)
initLoading.value = false
list.value = []
total.value = res.data.data.total
res.data.data.records.forEach((val) => {
const obj = {
loading: false,
name: val.resourceDTO.name,
id: val.id,
checked: false,
type: val.resourceDTO.type,
resourceId: val.resourceId,
createDate: val.createDate,
description: val.resourceDTO.description,
delFlag: val.resourceDTO.delFlag,
...getObj(val, val.resourceDTO ? 'resourceDTO' : 'fuseDTO')
}
if (checkedList.value.indexOf(val.resourceId) == -1) {
checkAll.value = false
@ -248,8 +182,22 @@
}
list.value.push(obj)
})
}).catch(err => {
message.error(err)
})
}
function getObj(val, typeStr) {
let typeObj = val[typeStr] || {};
console.log('typeObj------------>', typeObj);
return {
name: typeObj.name,
type: typeObj.type,
description: typeObj.description,
delFlag: typeObj.delFlag,
}
}
const onShowSizeChange = (current, pageSize) => {
console.log(current, pageSize)
// pageNum.value = current
@ -337,14 +285,23 @@
console.log(e)
}
//
const showItem = (id, type, delFlag) => {
const showItem = (item, type, delFlag) => {
if (delFlag == 0) {
console.log('进入详情')
mybus.emit('tabsChange', { flag: id })
mybus.emit('tabsChange', { flag: item.resourceId })
router.push({
path: '/details',
path: `/details`,
query: {
id: id,
id: item.resourceId,
},
})
} else if (delFlag === undefined) {
//
mybus.emit('tabsChange', { flag: item.resourceId })
router.push({
path: `/integrationServicesDetails`,
query: {
id: item.resourceId,
},
})
}
@ -354,17 +311,21 @@
.ant-list {
height: 540px;
overflow-y: scroll;
.ant-list-item-meta {
align-items: center;
:deep(.ant-list-item-meta-avatar) {
padding-left: 20px;
margin-right: 30px;
}
.time {
margin-left: 30px;
font-size: 12px;
color: #ccc;
}
:deep(.ant-list-item-meta-description) {
max-height: 44px;
overflow: hidden;
@ -372,25 +333,31 @@
}
}
}
:deep(.ant-list-item-meta-title) {
display: flex;
justify-content: space-between;
span {
margin-right: 0.3rem;
}
}
.ant-list::-webkit-scrollbar {
width: 0 !important;
}
.bottom {
margin: 10px;
display: flex;
justify-content: space-between;
align-items: center;
.left span {
margin-left: 10px;
}
}
.title {
font-size: 20px;
color: #000000;
@ -399,11 +366,14 @@
margin-top: 20px;
margin-left: 20px;
}
.sousuokuang {
margin: 10px 0px 21px 20px;
.ant-input-search {
max-width: 490px;
}
:deep(.ant-input) {
width: 400px;
height: 36px;
@ -411,9 +381,11 @@
color: #b2b2b2;
background: #f5f5f5;
}
:deep(.ant-input-group-addon) {
display: inline-block;
margin-left: 10px;
.ant-input-search-button {
width: 80px;
height: 36px;
@ -422,6 +394,7 @@
}
}
}
.tab {
margin-top: 10px;
margin-left: 20px;
@ -429,6 +402,7 @@
display: flex;
font-size: 14px;
color: #999999;
div {
width: 70px;
height: 24px;
@ -439,11 +413,13 @@
color: #666666;
cursor: pointer;
}
.tabclass {
border: 1px solid #0087ff;
color: #0087ff;
}
}
.name:hover {
color: #0087ff;
}