wuhongjian
/
hi-ucs
1
0
Fork 0
Code Issues Pull Requests Projects Releases 10 Wiki Activity

eslint问题修复

This commit is contained in:
wuhongjian 2022-07-15 21:35:22 +08:00
parent 09518566c7
commit 6c10a4bb29
36 changed files with 4649 additions and 4036 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
front/.eslintrc.js
View File

@ -1,3 +1,10 @@
/*
* @Author: hisense.wuhongjian
* @Date: 2022-06-14 09:31:29
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-07-15 16:33:55
* @Description: 告诉大家这是什么
*/
module.exports = { module.exports = {
root: true, root: true,
env: { env: {
@ -15,6 +22,7 @@ module.exports = {
ignorePatterns: [ ignorePatterns: [
'src/supermap', 'src/supermap',
'src/views/home/videoSurveillance', 'src/views/home/videoSurveillance',
'src/views/vab/*',
'src/utils/coordinateSystemTransform.js', 'src/utils/coordinateSystemTransform.js',
], ],
} }

4
front/package.json
View File

@ -5,7 +5,9 @@
"scripts": { "scripts": {
"serve": "vue-cli-service serve", "serve": "vue-cli-service serve",
"build": "vue-cli-service build", "build": "vue-cli-service build",
"lint": "vue-cli-service lint", "lint": "eslint --ext .js --ext .jsx --ext .vue src/",
"lint:fix": "eslint --fix --ext .js,.vue .",
"fix": "eslint src/**/*.* --fix",
"clear": "rimraf node_modules&&npm install --registry=https://registry.npm.taobao.org", "clear": "rimraf node_modules&&npm install --registry=https://registry.npm.taobao.org",
"use:npm": "nrm use npm", "use:npm": "nrm use npm",
"use:taobao": "nrm use taobao", "use:taobao": "nrm use taobao",

2
front/src/App.vue
View File

@ -26,7 +26,7 @@
</script> </script>
<style lang="less"> <style lang="less">
@import '~@/vab/styles/vab.less'; @import '~@/vab/styles/vab.less';
#vue-admin-beautiful{ #vue-admin-beautiful {
max-width: 1920px; max-width: 1920px;
// max-height: 1080px; // max-height: 1080px;
margin: auto; margin: auto;

12
front/src/api/capabilityCloud.js
View File

@ -83,14 +83,22 @@ export function dataResourceInfo(params) {
//能力云图-调用趋势 //能力云图-调用趋势
export function callTheTrendPort(start, end, params) { export function callTheTrendPort(start, end, params) {
return request({ return request({
url: '/metrics/api/v1/query_range?query=sum(increase(apigateway_http_status%5B1d%5D))&start=' + start + '&end=' + end + '&step=' + params, url:
'/metrics/api/v1/query_range?query=sum(increase(apigateway_http_status%5B1d%5D))&start=' +
start +
'&end=' +
end +
'&step=' +
params,
method: 'get', method: 'get',
}) })
} }
//能力云图-调用次数 //能力云图-调用次数
export function totalCallsSnum(params) { export function totalCallsSnum(params) {
return request({ return request({
url: '/metrics/api/v1/query?query=sum(apigateway_http_status)&time=1655793262.495' + params, url:
'/metrics/api/v1/query?query=sum(apigateway_http_status)&time=1655793262.495' +
params,
method: 'get', method: 'get',
}) })
} }

4
front/src/api/home.js
View File

@ -342,7 +342,7 @@ export function getIntegrationServicesList(params) {
return request({ return request({
url: '/fuse/page', url: '/fuse/page',
method: 'get', method: 'get',
params params,
}) })
} }
@ -359,6 +359,6 @@ export function getDevelopDocTree(params) {
return request({ return request({
url: '/resource/selectDevelopDoc', url: '/resource/selectDevelopDoc',
method: 'get', method: 'get',
params params,
}) })
} }

2
front/src/api/personalCenter.js
View File

@ -199,7 +199,7 @@ export function getMyComment(params) {
} }
export function demandComment(params) { export function demandComment(params) {
return request({ return request({
url: '/demandComment/'+ params, url: '/demandComment/' + params,
method: 'get', method: 'get',
params, params,
}) })

9
front/src/config/default/setting.config.js
View File

@ -50,7 +50,14 @@ const setting = {
//路由模式，可选值为 history 或 hash //路由模式，可选值为 history 或 hash
routerMode: 'hash', routerMode: 'hash',
//不经过token校验的路由 //不经过token校验的路由
routesWhiteList: ['/login', '/register', '/callback', '/404', '/403', '/capabilityCloud'], // 新增统计云图白名单 routesWhiteList: [
'/login',
'/register',
'/callback',
'/404',
'/403',
'/capabilityCloud',
], // 新增统计云图白名单
//加载时显示文字 //加载时显示文字
loadingText: '正在加载中...', loadingText: '正在加载中...',
//token名称 //token名称

30
front/src/store/modules/user.js
View File

@ -2,30 +2,30 @@
* @author chuzhixin 1204505056@qq.com * @author chuzhixin 1204505056@qq.com
* @description 登录、获取用户信息、退出登录、清除accessToken逻辑，不建议修改 * @description 登录、获取用户信息、退出登录、清除accessToken逻辑，不建议修改
*/ */
import { getUserInfo, login, logout } from '@/api/user' import { getUserInfo, login, logout } from '@/api/user'
import { import {
getAccessToken, getAccessToken,
removeAccessToken, removeAccessToken,
setAccessToken, setAccessToken,
} from '@/utils/accessToken' } from '@/utils/accessToken'
import { title, tokenName } from '@/config' import { title, tokenName } from '@/config'
import { message, notification } from 'ant-design-vue' import { message, notification } from 'ant-design-vue'
const state = () => ({ const state = () => ({
accessToken: getAccessToken(), accessToken: getAccessToken(),
username: '', username: '',
userId: '', userId: '',
avatar: '', avatar: '',
role: 0, // 用户管理员权限 role: 0, // 用户管理员权限
}) })
const getters = { const getters = {
accessToken: (state) => state.accessToken, accessToken: (state) => state.accessToken,
username: (state) => state.username, username: (state) => state.username,
avatar: (state) => state.avatar, avatar: (state) => state.avatar,
role: (state) => state.role, role: (state) => state.role,
userId: (state) => state.userId, userId: (state) => state.userId,
} }
const mutations = { const mutations = {
/** /**
* @author chuzhixin 1204505056@qq.com * @author chuzhixin 1204505056@qq.com
* @description 设置accessToken * @description 设置accessToken
@ -62,8 +62,8 @@
setAvatar(state, avatar) { setAvatar(state, avatar) {
state.avatar = avatar state.avatar = avatar
}, },
} }
const actions = { const actions = {
/** /**
* @author chuzhixin 1204505056@qq.com * @author chuzhixin 1204505056@qq.com
* @description 登录拦截放行时，设置虚拟角色 * @description 登录拦截放行时，设置虚拟角色
@ -174,10 +174,10 @@
setAccessToken({ commit }, accessToken) { setAccessToken({ commit }, accessToken) {
commit('setAccessToken', accessToken) commit('setAccessToken', accessToken)
}, },
} }
export default { export default {
state, state,
getters, getters,
mutations, mutations,
actions, actions,
} }

9
front/src/utils/request.js
View File

@ -22,7 +22,7 @@ let loadingInstance
* @param {*} code * @param {*} code
* @param {*} msg * @param {*} msg
*/ */
const handleCode = (code, msg, res) => { const handleCode = (code, msg) => {
debugger debugger
switch (code) { switch (code) {
case 401: case 401:
@ -49,7 +49,7 @@ const handleCode = (code, msg, res) => {
message.error(msg || '接口异常') message.error(msg || '接口异常')
break break
case 302: case 302:
window.location.href = redirect // window.location.href = redirect
break break
} }
} }
@ -74,8 +74,7 @@ instance.interceptors.request.use(
(config) => { (config) => {
debugger debugger
const token = getAccessToken() const token = getAccessToken()
if (token) if (token) config.headers[tokenName] = token
config.headers[tokenName] = token
if ( if (
config.data && config.data &&
config.headers['Content-Type'] === config.headers['Content-Type'] ===
@ -105,7 +104,7 @@ instance.interceptors.response.use(
response['Access-Control-Expose-Headers'] = 'redirect' response['Access-Control-Expose-Headers'] = 'redirect'
const { code, message } = response.data const { code, message } = response.data
debugger debugger
if (code=='0' && response.headers.token) { if (code == '0' && response.headers.token) {
setAccessToken(response.headers.token) setAccessToken(response.headers.token)
} else { } else {
const token = getAccessToken() const token = getAccessToken()

26
front/src/vab/plugins/permissions.js
View File

@ -2,25 +2,25 @@
* @Author: hisense.wuhongjian * @Author: hisense.wuhongjian
* @Date: 2022-04-01 17:23:11 * @Date: 2022-04-01 17:23:11
* @LastEditors: hisense.wuhongjian * @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-07-11 16:39:36 * @LastEditTime: 2022-07-15 16:36:53
* @Description: 告诉大家这是什么 * @Description: 告诉大家这是什么
*/ */
/** /**
* @author chuzhixin 1204505056@qq.com * @author chuzhixin 1204505056@qq.com
* @description 路由守卫，目前两种模式：all模式与intelligence模式 * @description 路由守卫，目前两种模式：all模式与intelligence模式
*/ */
import router from '@/router' import router from '@/router'
import store from '@/store' import store from '@/store'
import getPageTitle from '@/utils/pageTitle' import getPageTitle from '@/utils/pageTitle'
import { getUserInfo } from '@/api/user' import { getUserInfo } from '@/api/user'
import { import {
// authentication, // authentication,
loginInterception, loginInterception,
// recordRoute, // recordRoute,
routesWhiteList, routesWhiteList,
} from '@/config' } from '@/config'
import { setAccessToken, getAccessToken } from '@/utils/accessToken' import { getAccessToken } from '@/utils/accessToken'
router.beforeEach(async (to, from, next) => { router.beforeEach(async (to, from, next) => {
// debugger // debugger
// const SSOTOKEN = to.query.SSOToken // const SSOTOKEN = to.query.SSOToken
// if (SSOTOKEN) { // if (SSOTOKEN) {
@ -47,7 +47,7 @@
next() next()
} else { } else {
// 这里是一个单点登录的入口 // 这里是一个单点登录的入口
getUserInfo().then(res=>{ getUserInfo().then((res) => {
console.log(res) console.log(res)
router.replace('/home') router.replace('/home')
}) })
@ -60,7 +60,7 @@
// window.open('http://www.baidu.com', '_self') // window.open('http://www.baidu.com', '_self')
} }
} }
}) })
router.afterEach((to) => { router.afterEach((to) => {
document.title = getPageTitle(to.meta.title) document.title = getPageTitle(to.meta.title)
}) })

5
front/src/views/assignCase/components/queryPage.vue
View File

@ -53,10 +53,7 @@
v-for="(item, index) in contenBox" v-for="(item, index) in contenBox"
:key="index" :key="index"
> >
<img <img :src="item.note1" alt="" />
:src="item.note1"
alt=""
/>
<h3>{{ item.name }}</h3> <h3>{{ item.name }}</h3>
<p> <p>
发布时间 发布时间

151
front/src/views/detailsAll/AlgorithmDetails.vue
View File

@ -10,77 +10,112 @@
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<algorithm-top-details :dataList="dataList.data"></algorithm-top-details> <algorithm-top-details :dataList="dataList.data"></algorithm-top-details>
<!-- 导航 --> <!-- 导航 -->
<algorithm-navigation :dataList="dataList.data" :class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"> <algorithm-navigation
</algorithm-navigation> :dataList="dataList.data"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></algorithm-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<algorithm-associated-ability v-if="!loading" :associatedComponents="associatedComponents" <algorithm-associated-ability
id="algorithm-associated-ability" class="scrollBox"></algorithm-associated-ability> v-if="!loading"
:associatedComponents="associatedComponents"
id="algorithm-associated-ability"
class="scrollBox"
></algorithm-associated-ability>
<!-- 算法展示 视频 --> <!-- 算法展示 视频 -->
<algorithm-display :dataList="dataList.data" id="algorithm-display" class="scrollBox"></algorithm-display> <algorithm-display
:dataList="dataList.data"
id="algorithm-display"
class="scrollBox"
></algorithm-display>
<!-- 算法优势 --> <!-- 算法优势 -->
<algorithm-advantage :dataList="dataList.data" id="algorithm-advantage" class="scrollBox"></algorithm-advantage> <algorithm-advantage
:dataList="dataList.data"
id="algorithm-advantage"
class="scrollBox"
></algorithm-advantage>
<!-- 应用场景和应用案例 --> <!-- 应用场景和应用案例 -->
<!-- <application-scenarios-and-case <!-- <application-scenarios-and-case
id="application-scenarios-and-case" id="application-scenarios-and-case"
class="scrollBox" class="scrollBox"
></application-scenarios-and-case> --> ></application-scenarios-and-case> -->
<algorithm-application-scenarios :dataList="dataList.data" id="application-scenarios" class="scrollBox"> <algorithm-application-scenarios
</algorithm-application-scenarios> :dataList="dataList.data"
<algorithm-application-case :dataList="dataList.data" id="application-case" class="scrollBox"> id="application-scenarios"
</algorithm-application-case> class="scrollBox"
></algorithm-application-scenarios>
<algorithm-application-case
:dataList="dataList.data"
id="application-case"
class="scrollBox"
></algorithm-application-case>
<!-- 算法试用 --> <!-- 算法试用 -->
<algorithm-on-trial :dataList="dataList.data" id="algorithm-on-trial" class="scrollBox"></algorithm-on-trial> <algorithm-on-trial
:dataList="dataList.data"
id="algorithm-on-trial"
class="scrollBox"
></algorithm-on-trial>
<!-- 计费标准 --> <!-- 计费标准 -->
<algorithm-charging-standard :dataList="dataList.data" id="charging-standard" class="scrollBox"> <algorithm-charging-standard
</algorithm-charging-standard> :dataList="dataList.data"
id="charging-standard"
class="scrollBox"
></algorithm-charging-standard>
<!-- 使用方式 --> <!-- 使用方式 -->
<algorithm-usage-mode :dataList="dataList.data" id="usage-mode" class="scrollBox"></algorithm-usage-mode> <algorithm-usage-mode
:dataList="dataList.data"
id="usage-mode"
class="scrollBox"
></algorithm-usage-mode>
<!-- 常见问题--> <!-- 常见问题-->
<algorithm-common-problem :dataList="dataList.data" id="common-problem" class="scrollBox"> <algorithm-common-problem
</algorithm-common-problem> :dataList="dataList.data"
id="common-problem"
class="scrollBox"
></algorithm-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import AlgorithmTopDetails from '@/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue' import AlgorithmTopDetails from '@/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue'
import AlgorithmAssociatedAbility from '@/views/detailsAll/components/Algorithm/AlgorithmAssociatedAbility.vue' import AlgorithmAssociatedAbility from '@/views/detailsAll/components/Algorithm/AlgorithmAssociatedAbility.vue'
import AlgorithmNavigation from '@/views/detailsAll/components/Algorithm/AlgorithmNavigation.vue' import AlgorithmNavigation from '@/views/detailsAll/components/Algorithm/AlgorithmNavigation.vue'
import AlgorithmDisplay from '@/views/detailsAll/components/Algorithm/AlgorithmDisplay.vue' import AlgorithmDisplay from '@/views/detailsAll/components/Algorithm/AlgorithmDisplay.vue'
import AlgorithmAdvantage from '@/views/detailsAll/components/Algorithm/AlgorithmAdvantage.vue' import AlgorithmAdvantage from '@/views/detailsAll/components/Algorithm/AlgorithmAdvantage.vue'
import AlgorithmOnTrial from '@/views/detailsAll/components/Algorithm/AlgorithmOnTrial.vue' import AlgorithmOnTrial from '@/views/detailsAll/components/Algorithm/AlgorithmOnTrial.vue'
import AlgorithmApplicationScenarios from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationScenarios' import AlgorithmApplicationScenarios from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationScenarios'
import AlgorithmApplicationCase from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationCase' import AlgorithmApplicationCase from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationCase'
import AlgorithmUsageMode from '@/views/detailsAll/components/Algorithm/AlgorithmUsageMode' //使用方式 import AlgorithmUsageMode from '@/views/detailsAll/components/Algorithm/AlgorithmUsageMode' //使用方式
import AlgorithmChargingStandard from '@/views/detailsAll/components/Algorithm/AlgorithmChargingStandard' //计费标准 import AlgorithmChargingStandard from '@/views/detailsAll/components/Algorithm/AlgorithmChargingStandard' //计费标准
import AlgorithmCommonProblem from '@/views/detailsAll/components/Algorithm/AlgorithmCommonProblem' //常见问题 import AlgorithmCommonProblem from '@/views/detailsAll/components/Algorithm/AlgorithmCommonProblem' //常见问题
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId2, queryPartAppByKeyId2,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const loading = ref(true) const loading = ref(true)
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }]) const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop) // console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -105,9 +140,9 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
console.log(id, '-------------------------------------------------') console.log(id, '-------------------------------------------------')
if (id) { if (id) {
selectOne(id).then((res) => { selectOne(id).then((res) => {
@ -148,21 +183,21 @@ const init = (id) => {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
} }
init(id) init(id)
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 0;
} }
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>

174
front/src/views/detailsAll/ApplicationDetails.vue
View File

@ -1,84 +1,116 @@
<!-- <!--
* @Author: hisense.liangjunhua * @Author: hisense.liangjunhua
* @Date: 2022-06-08 11:32:22 * @Date: 2022-06-08 11:32:22
* @LastEditors: hisense.liangjunhua * @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-30 10:22:31 * @LastEditTime: 2022-07-15 16:37:23
* @Description: 应用详情页 * @Description: 应用详情页
--> -->
<template> <template>
<div class="application-details" :class="{ fixed2: scrollTop >= 600 }"> <div class="application-details" :class="{ fixed2: scrollTop >= 600 }">
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<application-top-details :dataList="dataList.data"></application-top-details> <application-top-details
:dataList="dataList.data"
></application-top-details>
<!-- 导航 --> <!-- 导航 -->
<application-navigation :dataList="dataList.data" :associatedComponents="associatedComponents" <application-navigation
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></application-navigation> :dataList="dataList.data"
:associatedComponents="associatedComponents"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></application-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<application-associated-ability v-if="!loading" :associatedComponents="associatedComponents" <application-associated-ability
id="application-associated-ability" class="scrollBox"></application-associated-ability> v-if="!loading"
:associatedComponents="associatedComponents"
id="application-associated-ability"
class="scrollBox"
></application-associated-ability>
<!-- 应用展示 视频 --> <!-- 应用展示 视频 -->
<application-presentation :dataList="dataList.data" id="application-presentation" class="scrollBox"> <application-presentation
</application-presentation> :dataList="dataList.data"
id="application-presentation"
class="scrollBox"
></application-presentation>
<!-- 关联组件 --> <!-- 关联组件 -->
<application-associated-components :dataList="dataList.data" id="application-associated-components" <application-associated-components
class="scrollBox" v-if="false"></application-associated-components> :dataList="dataList.data"
id="application-associated-components"
class="scrollBox"
v-if="false"
></application-associated-components>
<!-- 功能介绍--> <!-- 功能介绍-->
<application-function-intorduction :dataList="dataList.data" id="function-introduction" class="scrollBox"> <application-function-intorduction
</application-function-intorduction> :dataList="dataList.data"
id="function-introduction"
class="scrollBox"
></application-function-intorduction>
<!-- 使用能力 --> <!-- 使用能力 -->
<application-ability-toise :dataList="dataList.data" id="ability-to-use" class="scrollBox"> <application-ability-toise
</application-ability-toise> :dataList="dataList.data"
id="ability-to-use"
class="scrollBox"
></application-ability-toise>
<!-- 部署与安全--> <!-- 部署与安全-->
<application-deployment-and-security :dataList="dataList.data" id="deployment-and-security" class="scrollBox"> <application-deployment-and-security
</application-deployment-and-security> :dataList="dataList.data"
id="deployment-and-security"
class="scrollBox"
></application-deployment-and-security>
<!-- 归属部门与服务商--> <!-- 归属部门与服务商-->
<application-owning-department-and-service-provider :dataList="dataList.data" id="department-and-service-provider" <application-owning-department-and-service-provider
class="scrollBox"></application-owning-department-and-service-provider> :dataList="dataList.data"
id="department-and-service-provider"
class="scrollBox"
></application-owning-department-and-service-provider>
<!-- 常见问题--> <!-- 常见问题-->
<application-common-problem :dataList="dataList.data" id="common-problem" class="scrollBox"> <application-common-problem
</application-common-problem> :dataList="dataList.data"
id="common-problem"
class="scrollBox"
></application-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import ApplicationAbilityToise from '@/views/detailsAll/components/Application/ApplicationAbilityToise.vue' import ApplicationAbilityToise from '@/views/detailsAll/components/Application/ApplicationAbilityToise.vue'
import ApplicationAssociatedComponents from '@/views/detailsAll/components/Application/ApplicationAssociatedComponents.vue' import ApplicationAssociatedComponents from '@/views/detailsAll/components/Application/ApplicationAssociatedComponents.vue'
import ApplicationAssociatedAbility from '@/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue' import ApplicationAssociatedAbility from '@/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue'
import ApplicationOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Application/ApplicationOwningDepartmentAndServiceProvider.vue' import ApplicationOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Application/ApplicationOwningDepartmentAndServiceProvider.vue'
import ApplicationFunctionIntorduction from '@/views/detailsAll/components/Application/ApplicationFunctionIntorduction.vue' import ApplicationFunctionIntorduction from '@/views/detailsAll/components/Application/ApplicationFunctionIntorduction.vue'
import ApplicationDeploymentAndSecurity from '@/views/detailsAll/components/Application/ApplicationDeploymentAndSecurity.vue' import ApplicationDeploymentAndSecurity from '@/views/detailsAll/components/Application/ApplicationDeploymentAndSecurity.vue'
import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue' import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue'
import ApplicationNavigation from '@/views/detailsAll/components/Application/ApplicationNavigation.vue' import ApplicationNavigation from '@/views/detailsAll/components/Application/ApplicationNavigation.vue'
import ApplicationPresentation from '@/views/detailsAll/components/Application/ApplicationPresentation.vue' import ApplicationPresentation from '@/views/detailsAll/components/Application/ApplicationPresentation.vue'
import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题 import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId, queryPartAppByKeyId,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const associatedComponents = ref([{ type: '组件服务', dataList: [] }]) const associatedComponents = ref([{ type: '组件服务', dataList: [] }])
let loading = ref(true) let loading = ref(true)
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop-50) // console.log(top, document.querySelector('#' + id).offsetTop-50)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -103,9 +135,9 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
if (id) { if (id) {
selectOne(id).then((res) => { selectOne(id).then((res) => {
// console.clear() // console.clear()
@ -136,7 +168,7 @@ const init = (id) => {
console.log('浏览记录+1') console.log('浏览记录+1')
}) })
}) })
associatedComponents.value.map((item, index) => { associatedComponents.value.map((item) => {
let queryPartAppByKeyIdParams = { let queryPartAppByKeyIdParams = {
keyId: id, keyId: id,
type: item.type, type: item.type,
@ -150,30 +182,30 @@ const init = (id) => {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
}
const associatedComponentsFunction = () => {
if (
associatedComponents.value[0].dataList.length > 0 ||
associatedComponents.value[1].dataList.length > 0 ||
associatedComponents.value[2].dataList.length > 0
) {
return associatedComponents.value
} }
} // const associatedComponentsFunction = () => {
init(id) // if (
onBeforeUnmount(() => { // associatedComponents.value[0].dataList.length > 0 ||
// associatedComponents.value[1].dataList.length > 0 ||
// associatedComponents.value[2].dataList.length > 0
// ) {
// return associatedComponents.value
// }
// }
init(id)
onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 0;
} }
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>

136
front/src/views/detailsAll/BusinessDetails.vue
View File

@ -10,68 +10,96 @@
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<business-top-details :dataList="dataList.data"></business-top-details> <business-top-details :dataList="dataList.data"></business-top-details>
<!-- 导航 --> <!-- 导航 -->
<business-navigation :dataList="dataList.data" :associatedComponents="associatedComponents" <business-navigation
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></business-navigation> :dataList="dataList.data"
:associatedComponents="associatedComponents"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></business-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<business-associated-ability v-if="!loading" :associatedComponents="associatedComponents" <business-associated-ability
id="business-associated-ability" class="scrollBox"></business-associated-ability> v-if="!loading"
:associatedComponents="associatedComponents"
id="business-associated-ability"
class="scrollBox"
></business-associated-ability>
<!-- 组件展示 --> <!-- 组件展示 -->
<business-presentation :dataList="dataList.data" id="business-presentation" class="scrollBox"> <business-presentation
</business-presentation> :dataList="dataList.data"
id="business-presentation"
class="scrollBox"
></business-presentation>
<!-- 功能介绍--> <!-- 功能介绍-->
<business-function-intorduction :dataList="dataList.data" id="function-introduction" class="scrollBox"> <business-function-intorduction
</business-function-intorduction> :dataList="dataList.data"
id="function-introduction"
class="scrollBox"
></business-function-intorduction>
<!-- 应用场景 --> <!-- 应用场景 -->
<business-application-scenarios :dataList="dataList.data" id="application-scenarios" class="scrollBox"> <business-application-scenarios
</business-application-scenarios> :dataList="dataList.data"
id="application-scenarios"
class="scrollBox"
></business-application-scenarios>
<!-- 应用案例 --> <!-- 应用案例 -->
<business-application-case :dataList="dataList.data" id="application-case" class="scrollBox"> <business-application-case
</business-application-case> :dataList="dataList.data"
id="application-case"
class="scrollBox"
></business-application-case>
<!-- 使用方式 --> <!-- 使用方式 -->
<business-usage-mode :dataList="dataList.data" id="business-usage-mode" class="scrollBox"></business-usage-mode> <business-usage-mode
:dataList="dataList.data"
id="business-usage-mode"
class="scrollBox"
></business-usage-mode>
<!-- 常见问题--> <!-- 常见问题-->
<business-common-problem :dataList="dataList.data" id="common-problem" class="scrollBox"></business-common-problem> <business-common-problem
:dataList="dataList.data"
id="common-problem"
class="scrollBox"
></business-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import BusinessApplicationCase from '@/views/detailsAll/components/Business/BusinessApplicationCase.vue' // 应用案例 import BusinessApplicationCase from '@/views/detailsAll/components/Business/BusinessApplicationCase.vue' // 应用案例
import BusinessAssociatedAbility from '@/views/detailsAll/components/Business/BusinessAssociatedAbility.vue' import BusinessAssociatedAbility from '@/views/detailsAll/components/Business/BusinessAssociatedAbility.vue'
import BusinessApplicationScenarios from '@/views/detailsAll/components/Business/BusinessApplicationScenarios.vue' // 应用场景 import BusinessApplicationScenarios from '@/views/detailsAll/components/Business/BusinessApplicationScenarios.vue' // 应用场景
import BusinessFunctionIntorduction from '@/views/detailsAll/components/Business/BusinessFunctionIntorduction.vue' // 功能介绍 import BusinessFunctionIntorduction from '@/views/detailsAll/components/Business/BusinessFunctionIntorduction.vue' // 功能介绍
import BusinessTopDetails from '@/views/detailsAll/components/Business/BusinessTopDetails.vue' // 头部基本信息 import BusinessTopDetails from '@/views/detailsAll/components/Business/BusinessTopDetails.vue' // 头部基本信息
import BusinessNavigation from '@/views/detailsAll/components/Business/BusinessNavigation.vue' //导航条 import BusinessNavigation from '@/views/detailsAll/components/Business/BusinessNavigation.vue' //导航条
import BusinessPresentation from '@/views/detailsAll/components/Business/BusinessPresentation.vue' //组件展示 import BusinessPresentation from '@/views/detailsAll/components/Business/BusinessPresentation.vue' //组件展示
import BusinessUsageMode from '@/views/detailsAll/components/Business/BusinessUsageMode.vue' //使用方式 import BusinessUsageMode from '@/views/detailsAll/components/Business/BusinessUsageMode.vue' //使用方式
import BusinessCommonProblem from '@/views/detailsAll/components/Business/BusinessCommonProblem' //常见问题 import BusinessCommonProblem from '@/views/detailsAll/components/Business/BusinessCommonProblem' //常见问题
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId2, queryPartAppByKeyId2,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }]) const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
let loading = ref(true) let loading = ref(true)
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop) // console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -96,9 +124,9 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
if (id) { if (id) {
selectOne(id).then((res) => { selectOne(id).then((res) => {
// console.clear() // console.clear()
@ -138,21 +166,21 @@ const init = (id) => {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
} }
init(id) init(id)
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 0;
} }
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>

156
front/src/views/detailsAll/DeveloperComponents.vue
View File

@ -1,8 +1,8 @@
<!-- <!--
* @Author: hisense.liangjunhua * @Author: hisense.liangjunhua
* @Date: 2022-06-08 11:32:22 * @Date: 2022-06-08 11:32:22
* @LastEditors: hisense.liangjunhua * @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-20 18:59:01 * @LastEditTime: 2022-07-15 16:38:44
* @Description: 开发组件详情页 * @Description: 开发组件详情页
--> -->
<template> <template>
@ -10,73 +10,103 @@
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<developer-top-details :dataList="dataList.data"></developer-top-details> <developer-top-details :dataList="dataList.data"></developer-top-details>
<!-- 导航 --> <!-- 导航 -->
<developer-navigation :dataList="dataList.data" :associatedComponents="associatedComponentsFunction()" <developer-navigation
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></developer-navigation> :dataList="dataList.data"
:associatedComponents="associatedComponentsFunction()"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></developer-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<developer-associated-ability v-if="!loading" :associatedComponents="associatedComponents" <developer-associated-ability
id="developer-associated-ability" class="scrollBox"></developer-associated-ability> v-if="!loading"
:associatedComponents="associatedComponents"
id="developer-associated-ability"
class="scrollBox"
></developer-associated-ability>
<!-- 组件展示 视频 --> <!-- 组件展示 视频 -->
<Developer-presentation :dataList="dataList.data" id="eveloper-presentation" class="scrollBox"> <Developer-presentation
</Developer-presentation> :dataList="dataList.data"
id="eveloper-presentation"
class="scrollBox"
></Developer-presentation>
<!-- 功能介绍--> <!-- 功能介绍-->
<developer-function-intorduction :dataList="dataList.data" id="function-introduction" class="scrollBox"> <developer-function-intorduction
</developer-function-intorduction> :dataList="dataList.data"
id="function-introduction"
class="scrollBox"
></developer-function-intorduction>
<!-- 应用场景 --> <!-- 应用场景 -->
<developer-application-scenarios :dataList="dataList.data" id="application-scenarios" class="scrollBox"> <developer-application-scenarios
</developer-application-scenarios> :dataList="dataList.data"
id="application-scenarios"
class="scrollBox"
></developer-application-scenarios>
<!-- 应用案例 --> <!-- 应用案例 -->
<developer-application-case :dataList="dataList.data" id="application-case" class="scrollBox"> <developer-application-case
</developer-application-case> :dataList="dataList.data"
id="application-case"
class="scrollBox"
></developer-application-case>
<!-- 组件试用 --> <!-- 组件试用 -->
<developer-trial :dataList="dataList.data" id="developer-trial" class="scrollBox"></developer-trial> <developer-trial
:dataList="dataList.data"
id="developer-trial"
class="scrollBox"
></developer-trial>
<!-- 归属部门与服务商--> <!-- 归属部门与服务商-->
<developer-owning-department-and-service-provider :dataList="dataList.data" id="department-and-service-provider" <developer-owning-department-and-service-provider
class="scrollBox"></developer-owning-department-and-service-provider> :dataList="dataList.data"
id="department-and-service-provider"
class="scrollBox"
></developer-owning-department-and-service-provider>
<!-- 常见问题--> <!-- 常见问题-->
<developer-common-problem :dataList="dataList.data" id="common-problem" class="scrollBox"> <developer-common-problem
</developer-common-problem> :dataList="dataList.data"
id="common-problem"
class="scrollBox"
></developer-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import DeveloperApplicationScenarios from '@/views/detailsAll/components/Developer/DeveloperApplicationScenarios.vue' //应用场景 import DeveloperApplicationScenarios from '@/views/detailsAll/components/Developer/DeveloperApplicationScenarios.vue' //应用场景
import DeveloperAssociatedAbility from '@/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue' import DeveloperAssociatedAbility from '@/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue'
import DeveloperOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Developer/DeveloperOwningDepartmentAndServiceProvider.vue' //使用方式 import DeveloperOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Developer/DeveloperOwningDepartmentAndServiceProvider.vue' //使用方式
import DeveloperFunctionIntorduction from '@/views/detailsAll/components/Developer/DeveloperFunctionIntorduction.vue' //功能介绍 import DeveloperFunctionIntorduction from '@/views/detailsAll/components/Developer/DeveloperFunctionIntorduction.vue' //功能介绍
import DeveloperApplicationCase from '@/views/detailsAll/components/Developer/DeveloperApplicationCase' //应用案例 import DeveloperApplicationCase from '@/views/detailsAll/components/Developer/DeveloperApplicationCase' //应用案例
import DeveloperTopDetails from '@/views/detailsAll/components/Developer/DeveloperTopDetails.vue' //头部基本信息 import DeveloperTopDetails from '@/views/detailsAll/components/Developer/DeveloperTopDetails.vue' //头部基本信息
import DeveloperNavigation from '@/views/detailsAll/components/Developer/DeveloperNavigation.vue' import DeveloperNavigation from '@/views/detailsAll/components/Developer/DeveloperNavigation.vue'
import DeveloperPresentation from '@/views/detailsAll/components/Developer/DeveloperPresentation.vue' //组件展示 import DeveloperPresentation from '@/views/detailsAll/components/Developer/DeveloperPresentation.vue' //组件展示
import DeveloperCommonProblem from '@/views/detailsAll/components/Developer/DeveloperCommonProblem' //常见问题 import DeveloperCommonProblem from '@/views/detailsAll/components/Developer/DeveloperCommonProblem' //常见问题
import DeveloperTrial from '@/views/detailsAll/components/Developer/DeveloperTrial' //组件试用 import DeveloperTrial from '@/views/detailsAll/components/Developer/DeveloperTrial' //组件试用
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId2, queryPartAppByKeyId2,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }]) const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
let loading = ref(true) let loading = ref(true)
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop) // console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -101,8 +131,8 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
if (id) { if (id) {
let queryPartAppByKeyIdParams = { let queryPartAppByKeyIdParams = {
keyId: id, keyId: id,
@ -136,31 +166,31 @@ const init = (id) => {
console.log('浏览记录+1') console.log('浏览记录+1')
}) })
}) })
associatedComponents.value.map((item, index) => { }) associatedComponents.value.map(() => {})
} else if (obj) { } else if (obj) {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
} }
init(id) init(id)
const associatedComponentsFunction = () => { const associatedComponentsFunction = () => {
if (associatedComponents.value[0].dataList.length > 0) { if (associatedComponents.value[0].dataList.length > 0) {
return associatedComponents.value return associatedComponents.value
} }
} }
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 0;
} }
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>

150
front/src/views/detailsAll/LayerService.vue
View File

@ -8,75 +8,107 @@
<template> <template>
<div class="application-details" :class="{ fixed2: scrollTop >= 600 }"> <div class="application-details" :class="{ fixed2: scrollTop >= 600 }">
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<layer-service-top-details :dataList="dataList.data"></layer-service-top-details> <layer-service-top-details
:dataList="dataList.data"
></layer-service-top-details>
<!-- 导航 --> <!-- 导航 -->
<layer-service-navigation :dataList="dataList.data" :associatedComponents="associatedComponents" <layer-service-navigation
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></layer-service-navigation> :dataList="dataList.data"
:associatedComponents="associatedComponents"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></layer-service-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<layer-service-associated-ability :associatedComponents="associatedComponents" id="layer-service-associated-ability" <layer-service-associated-ability
class="scrollBox" v-if="!loading"></layer-service-associated-ability> :associatedComponents="associatedComponents"
id="layer-service-associated-ability"
class="scrollBox"
v-if="!loading"
></layer-service-associated-ability>
<!-- 图层展示 视频 --> <!-- 图层展示 视频 -->
<layer-service-presentation :dataList="dataList.data" id="service-presentation" class="scrollBox"> <layer-service-presentation
</layer-service-presentation> :dataList="dataList.data"
id="service-presentation"
class="scrollBox"
></layer-service-presentation>
<!-- 图层信息--> <!-- 图层信息-->
<layer-service-information :dataList="dataList.data" id="service-information" class="scrollBox"> <layer-service-information
</layer-service-information> :dataList="dataList.data"
id="service-information"
class="scrollBox"
></layer-service-information>
<!-- 应用场景 --> <!-- 应用场景 -->
<layer-service-application-scenarios :dataList="dataList.data" id="service-application-scenarios" class="scrollBox"> <layer-service-application-scenarios
</layer-service-application-scenarios> :dataList="dataList.data"
id="service-application-scenarios"
class="scrollBox"
></layer-service-application-scenarios>
<!-- 应用案例 --> <!-- 应用案例 -->
<layer-service-application-case :dataList="dataList.data" id="service-application-case" class="scrollBox"> <layer-service-application-case
</layer-service-application-case> :dataList="dataList.data"
id="service-application-case"
class="scrollBox"
></layer-service-application-case>
<!-- 图层预览 --> <!-- 图层预览 -->
<layer-service-preview :dataList="dataList.data" id="service-preview" class="scrollBox"></layer-service-preview> <layer-service-preview
:dataList="dataList.data"
id="service-preview"
class="scrollBox"
></layer-service-preview>
<!-- 使用方式--> <!-- 使用方式-->
<layer-service-usage-mode :dataList="dataList.data" id="service-usage-mode" class="scrollBox"> <layer-service-usage-mode
</layer-service-usage-mode> :dataList="dataList.data"
id="service-usage-mode"
class="scrollBox"
></layer-service-usage-mode>
<!-- 常见问题--> <!-- 常见问题-->
<layer-service-common-problem :dataList="dataList.data" id="service-common-problem" class="scrollBox"> <layer-service-common-problem
</layer-service-common-problem> :dataList="dataList.data"
id="service-common-problem"
class="scrollBox"
></layer-service-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import LayerServiceApplicationCase from '@/views/detailsAll/components/LayerService/LayerServiceApplicationCase' //应用案例 import LayerServiceApplicationCase from '@/views/detailsAll/components/LayerService/LayerServiceApplicationCase' //应用案例
import LayerServiceAssociatedAbility from '@/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue' import LayerServiceAssociatedAbility from '@/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue'
import LayerServiceApplicationScenarios from '@/views/detailsAll/components/LayerService/LayerServiceApplicationScenarios.vue' //应用场景 import LayerServiceApplicationScenarios from '@/views/detailsAll/components/LayerService/LayerServiceApplicationScenarios.vue' //应用场景
import LayerServiceCommonProblem from '@/views/detailsAll/components/LayerService/LayerServiceCommonProblem' //常见问题 import LayerServiceCommonProblem from '@/views/detailsAll/components/LayerService/LayerServiceCommonProblem' //常见问题
import LayerServiceInformation from '@/views/detailsAll/components/LayerService/LayerServiceInformation.vue' //图层信息 import LayerServiceInformation from '@/views/detailsAll/components/LayerService/LayerServiceInformation.vue' //图层信息
import LayerServiceNavigation from '@/views/detailsAll/components/LayerService/LayerServiceNavigation.vue' //导航 import LayerServiceNavigation from '@/views/detailsAll/components/LayerService/LayerServiceNavigation.vue' //导航
import LayerServicePresentation from '@/views/detailsAll/components/LayerService/LayerServicePresentation.vue' //图层展示 import LayerServicePresentation from '@/views/detailsAll/components/LayerService/LayerServicePresentation.vue' //图层展示
import LayerServicePreview from '@/views/detailsAll/components/LayerService/LayerServicePreview.vue' //图层预览 import LayerServicePreview from '@/views/detailsAll/components/LayerService/LayerServicePreview.vue' //图层预览
import LayerServiceTopDetails from '@/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue' //头部基本信息 import LayerServiceTopDetails from '@/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue' //头部基本信息
import LayerServiceUsageMode from '@/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue' //使用方式 import LayerServiceUsageMode from '@/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue' //使用方式
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId2, queryPartAppByKeyId2,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }]) const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
let loading = ref(true) let loading = ref(true)
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop) // console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -101,9 +133,9 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
if (id) { if (id) {
selectOne(id).then((res) => { selectOne(id).then((res) => {
// console.clear() // console.clear()
@ -143,21 +175,21 @@ const init = (id) => {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
} }
init(id) init(id)
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 0;
} }
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>

2
front/src/views/detailsAll/components/Algorithm/AlgorithmAdvantage.vue
View File

@ -92,7 +92,7 @@
align-items: center; align-items: center;
.item { .item {
width: 424px; width: 424px;
height:306px; height: 306px;
padding: 35px; padding: 35px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;

4
front/src/views/detailsAll/components/Algorithm/AlgorithmOnTrial.vue
View File

@ -38,7 +38,9 @@
() => props.dataList, () => props.dataList,
(val) => { (val) => {
if (val) { if (val) {
let obj = val.infoList.filter((item) => item.attrType === '试用地址' && item.attrValue)[0] let obj = val.infoList.filter(
(item) => item.attrType === '试用地址' && item.attrValue
)[0]
if (!obj) { if (!obj) {
flag.value = false flag.value = false
} else { } else {

10
front/src/views/detailsAll/components/Algorithm/PictureCharacterRecognition.vue
View File

@ -73,7 +73,7 @@
</template> </template>
<script setup> <script setup>
import { ref, onMounted } from 'vue' import { ref, onMounted } from 'vue'
import { paddleocr,algo } from '@/api/file' import { algo } from '@/api/file'
import { message } from 'ant-design-vue' import { message } from 'ant-design-vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
const router = useRouter() const router = useRouter()
@ -85,10 +85,12 @@
const imageResult1 = ref('') const imageResult1 = ref('')
const menuOpenKeys2 = ref(['全文还原']) const menuOpenKeys2 = ref(['全文还原'])
// 图片初始化 // 图片初始化
let responseUrl = ref('static/image/' + router.currentRoute.value.query.exampleImg) let responseUrl = ref(
'static/image/' + router.currentRoute.value.query.exampleImg
)
const imgType = router.currentRoute.value.query.exampleImg.split('.')[1] const imgType = router.currentRoute.value.query.exampleImg.split('.')[1]
const handleChange = (info) => { const handleChange = (info) => {
debugger; debugger
if (info.file.status !== 'uploading') { if (info.file.status !== 'uploading') {
console.log(info.file, info.fileList) console.log(info.file, info.fileList)
} }
@ -111,7 +113,7 @@
company: router.currentRoute.value.query.company, company: router.currentRoute.value.query.company,
algorithmName: router.currentRoute.value.query.algorithmName, algorithmName: router.currentRoute.value.query.algorithmName,
data: base64.split('base64,')[1], data: base64.split('base64,')[1],
type: router.currentRoute.value.query.type type: router.currentRoute.value.query.type,
} }
algo(param).then((res) => { algo(param).then((res) => {
// wordValue.value = res.data // wordValue.value = res.data

6
front/src/views/detailsAll/components/Algorithm/TestOfWords.vue
View File

@ -43,7 +43,7 @@
</template> </template>
<script setup> <script setup>
import { ref } from 'vue' import { ref } from 'vue'
import { correct,algo } from '@/api/file' import { algo } from '@/api/file'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
const router = useRouter() const router = useRouter()
// const keyId = router.currentRoute.value.query.id // const keyId = router.currentRoute.value.query.id
@ -58,7 +58,7 @@
company: router.currentRoute.value.query.company, company: router.currentRoute.value.query.company,
algorithmName: router.currentRoute.value.query.algorithmName, algorithmName: router.currentRoute.value.query.algorithmName,
data: wordValue.value, data: wordValue.value,
type: router.currentRoute.value.query.type type: router.currentRoute.value.query.type,
} }
// correct(param).then((res) => { // correct(param).then((res) => {
// // wordContent.value = res.data.data // // wordContent.value = res.data.data
@ -72,7 +72,7 @@
// errorWordContent.value = val.value // errorWordContent.value = val.value
// }) // })
// }) // })
algo(param).then(res=>{ algo(param).then((res) => {
errorWord.value = res.data.data.text_data errorWord.value = res.data.data.text_data
}) })
} }

28
front/src/views/detailsAll/components/Application/ApplicationCommonProblem.vue
View File

@ -16,21 +16,19 @@
</div> </div>
</div> </div>
</div> </div>
<div v-else class="no-data"> <div v-else class="no-data">暂无数据</div>
暂无数据
</div>
</div> </div>
</template> </template>
<script setup> <script setup>
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle' import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue' import { ref, defineProps, watch } from 'vue'
const flag = ref(true) const flag = ref(true)
let dataFrom = ref([]) let dataFrom = ref([])
const props = defineProps({ const props = defineProps({
dataList: { type: Object, default: null }, dataList: { type: Object, default: null },
}) })
if (props.dataList.infoList) { if (props.dataList.infoList) {
let obj = props.dataList.infoList.filter( let obj = props.dataList.infoList.filter(
(item) => item.attrType === '常见问题' (item) => item.attrType === '常见问题'
)[0] )[0]
@ -46,8 +44,8 @@ if (props.dataList.infoList) {
dataFrom.value.push(params) dataFrom.value.push(params)
}) })
} }
} }
watch( watch(
() => props.dataList, () => props.dataList,
(val) => { (val) => {
if (val) { if (val) {
@ -66,11 +64,11 @@ watch(
} }
} }
} }
) )
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.cpmmon-problem { .cpmmon-problem {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
@ -138,5 +136,5 @@ watch(
padding: 0.5rem 0; padding: 0.5rem 0;
font-size: 0.2rem; font-size: 0.2rem;
} }
} }
</style> </style>

78
front/src/views/detailsAll/components/Application/ApplicationFunctionIntorduction.vue
View File

@ -7,26 +7,42 @@
<DetalsTitle :title="dataFrom.attrType" type="INTRODUCE"></DetalsTitle> <DetalsTitle :title="dataFrom.attrType" type="INTRODUCE"></DetalsTitle>
</div> </div>
<div class="tab"> <div class="tab">
<div v-for="(itemSonTitle, indexSonTitle) in dataFrom.attrValue" :key="itemSonTitle.name" <div
@click="tabSwitch(itemSonTitle.name)" class="tab-son" :class=" v-for="(itemSonTitle, indexSonTitle) in dataFrom.attrValue"
:key="itemSonTitle.name"
@click="tabSwitch(itemSonTitle.name)"
class="tab-son"
:class="
tabIndexClass(indexSonTitle, dataFrom.name, dataFrom.attrValue) tabIndexClass(indexSonTitle, dataFrom.name, dataFrom.attrValue)
"> "
>
<a-tooltip> <a-tooltip>
<template #title>{{ itemSonTitle.name }}</template> <template #title>{{ itemSonTitle.name }}</template>
<div class="tab-top" :class=" <div
class="tab-top"
:class="
tabInitialize() == itemSonTitle.name ? 'tab-top-down' : '' tabInitialize() == itemSonTitle.name ? 'tab-top-down' : ''
"> "
>
{{ itemSonTitle.name }} {{ itemSonTitle.name }}
</div> </div>
</a-tooltip> </a-tooltip>
<div class="tab-bottom" v-if="tabInitialize() == itemSonTitle.name"></div> <div
class="tab-bottom"
v-if="tabInitialize() == itemSonTitle.name"
></div>
</div> </div>
</div> </div>
<template v-for="itemSonTitle in dataFrom.attrValue" :key="itemSonTitle"> <template v-for="itemSonTitle in dataFrom.attrValue" :key="itemSonTitle">
<div class="content" v-if="tabindex == itemSonTitle.name"> <div class="content" v-if="tabindex == itemSonTitle.name">
<div class="content-left"> <div class="content-left">
<div class="content-left-scene" v-if="!itemSonTitle.img"></div> <div class="content-left-scene" v-if="!itemSonTitle.img"></div>
<a-image :width="635" :height="340" :src="itemSonTitle.img" v-if="itemSonTitle.img"></a-image> <a-image
:width="635"
:height="340"
:src="itemSonTitle.img"
v-if="itemSonTitle.img"
></a-image>
</div> </div>
<div class="content-right"> <div class="content-right">
<div class="content-right-scene"> <div class="content-right-scene">
@ -44,17 +60,17 @@
</template> </template>
<script setup> <script setup>
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle' import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue' import { ref, defineProps, watch } from 'vue'
const flag = ref(true) const flag = ref(true)
let dataFrom = ref([]) let dataFrom = ref([])
// tab切换方法 // tab切换方法
let tabindex = ref('场景说明一') let tabindex = ref('场景说明一')
//数据初始化 //数据初始化
const props = defineProps({ const props = defineProps({
dataList: { type: Object, default: null }, dataList: { type: Object, default: null },
}) })
if (props.dataList.infoList) { if (props.dataList.infoList) {
let obj = props.dataList.infoList.filter( let obj = props.dataList.infoList.filter(
(item) => item.attrType === '功能介绍' (item) => item.attrType === '功能介绍'
)[0] )[0]
@ -65,8 +81,8 @@ if (props.dataList.infoList) {
dataFrom.value = obj dataFrom.value = obj
tabindex.value = dataFrom.value.attrValue[0].name tabindex.value = dataFrom.value.attrValue[0].name
} }
} }
watch( watch(
() => props.dataList, () => props.dataList,
(val) => { (val) => {
if (val) { if (val) {
@ -80,26 +96,26 @@ watch(
} }
} }
} }
) )
//滚动条样式 //滚动条样式
function tabIndexClass(index, title, content) { function tabIndexClass(index, title, content) {
if (title == '功能介绍' && index == 0 && content.length > 6) { if (title == '功能介绍' && index == 0 && content.length > 6) {
return 'tab-son-class' return 'tab-son-class'
} }
} }
//初始化tab切换（判断标题不同，点击事件的判断变量不同） //初始化tab切换（判断标题不同，点击事件的判断变量不同）
function tabInitialize() { function tabInitialize() {
return tabindex.value return tabindex.value
} }
//tab切换点击事件 //tab切换点击事件
function tabSwitch(name) { function tabSwitch(name) {
tabindex.value = name tabindex.value = name
return tabindex.value return tabindex.value
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.function-intorduction { .function-intorduction {
width: 100%; width: 100%;
background: #f7f8fa; background: #f7f8fa;
display: flex; display: flex;
@ -254,5 +270,5 @@ function tabSwitch(name) {
.application-scenarios-and-case-son:first-child { .application-scenarios-and-case-son:first-child {
padding-top: 1rem; padding-top: 1rem;
} }
} }
</style> </style>

48
front/src/views/detailsAll/components/Application/ApplicationPresentation.vue
View File

@ -8,10 +8,18 @@
<template> <template>
<div class="application-presentation" v-if="flag"> <div class="application-presentation" v-if="flag">
<detals-title title="应用展示" type="IMAGE&VIDEO"></detals-title> <detals-title title="应用展示" type="IMAGE&VIDEO"></detals-title>
<div class="main" :style="`${img}background-position:center;background-size:cover;`"> <div
class="main"
:style="`${img}background-position:center;background-size:cover;`"
>
<div class="play" @click="showModal"></div> <div class="play" @click="showModal"></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> <template #footer></template>
<div style="width: 100%; display: flex; justify-content: center"> <div style="width: 100%; display: flex; justify-content: center">
<div style="width: 100%; height: 100%"> <div style="width: 100%; height: 100%">
@ -22,10 +30,10 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref, reactive, defineProps, watch } from 'vue' import { ref, reactive, defineProps, watch } from 'vue'
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue' import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
const visible = ref(false) const visible = ref(false)
const options = reactive({ const options = reactive({
width: '7.00rem', //播放器宽度 width: '7.00rem', //播放器宽度
height: '4.00rem', //播放器高度 height: '4.00rem', //播放器高度
color: '#409eff', //主题色 color: '#409eff', //主题色
@ -50,17 +58,17 @@ const options = reactive({
'pageFullScreen', 'pageFullScreen',
'fullScreen', 'fullScreen',
], //显示所有按钮, ], //显示所有按钮,
}) })
const showModal = () => { const showModal = () => {
visible.value = true visible.value = true
} }
const props = defineProps({ const props = defineProps({
dataList: { type: Object, default: null }, dataList: { type: Object, default: null },
}) })
const flag = ref(true) const flag = ref(true)
const img = ref({}) const img = ref({})
console.log('111111111111111111111,', props.dataList) console.log('111111111111111111111,', props.dataList)
if (props.dataList.infoList) { if (props.dataList.infoList) {
let obj = props.dataList.infoList.filter( let obj = props.dataList.infoList.filter(
(item) => item.attrType === '应用展示视频' (item) => item.attrType === '应用展示视频'
)[0] )[0]
@ -76,8 +84,8 @@ if (props.dataList.infoList) {
img.value = 'background:' + 'url(' + imgindex.attrValue + ') no-repeat;' img.value = 'background:' + 'url(' + imgindex.attrValue + ') no-repeat;'
} }
} }
} }
watch( watch(
() => props.dataList, () => props.dataList,
(val) => { (val) => {
if (val) { if (val) {
@ -99,10 +107,10 @@ watch(
} }
} }
} }
) )
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.application-presentation { .application-presentation {
padding: 0.8rem 3rem 0; padding: 0.8rem 3rem 0;
.main { .main {
@ -123,5 +131,5 @@ watch(
cursor: pointer; cursor: pointer;
} }
} }
} }
</style> </style>

123
front/src/views/detailsAll/components/Application/ApplicationTopDetails.vue
View File

@ -53,7 +53,11 @@
加入购物车 加入购物车
</a-button> --> </a-button> -->
<!-- 融合服务 存在fuseResourceList --> <!-- 融合服务 存在fuseResourceList -->
<a-button type="primary" @click="handleAKeyApplication()" v-if="dataList.fuseResourceList"> <a-button
type="primary"
@click="handleAKeyApplication()"
v-if="dataList.fuseResourceList"
>
<template #icon> <template #icon>
<form-outlined /> <form-outlined />
</template> </template>
@ -66,53 +70,53 @@
</div> </div>
</template> </template>
<script setup> <script setup>
// import { ShoppingCartOutlined } from '@ant-design/icons-vue' // import { ShoppingCartOutlined } from '@ant-design/icons-vue'
import { defineProps, ref, watch } from 'vue' import { defineProps, ref, watch } from 'vue'
import { scInsert } from '@/api/personalCenter' import { scInsert } from '@/api/personalCenter'
// import { sgcInsert } from '@/api/home' // import { sgcInsert } from '@/api/home'
// import { useRouter } from 'vue-router' // import { useRouter } from 'vue-router'
// import mybus from '@/myplugins/mybus' // import mybus from '@/myplugins/mybus'
import { message } from 'ant-design-vue' import { message } from 'ant-design-vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
// 获取当前路由地址 // 获取当前路由地址
const router = useRouter() const router = useRouter()
const props = defineProps({ const props = defineProps({
dataList: { type: Object, default: null }, dataList: { type: Object, default: null },
}) })
console.log('dataList------------>', props.dataList); console.log('dataList------------>', props.dataList)
// const router = useRouter() // const router = useRouter()
const applicationArea = ref('') const applicationArea = ref('')
// // 加入申购车 // // 加入申购车
// const addShoppingCart = () => { // const addShoppingCart = () => {
// console.log('加入申购车==================>', props.dataList) // console.log('加入申购车==================>', props.dataList)
// sgcInsert({ // sgcInsert({
// delFlag: '0', // delFlag: '0',
// resourceId: props.dataList.id, // resourceId: props.dataList.id,
// // userId: userId.value, // // userId: userId.value,
// }).then((res) => { // }).then((res) => {
// console.log(res) // console.log(res)
// message.success('添加申购车成功！') // message.success('添加申购车成功！')
// mybus.emit('getSgcNum') // mybus.emit('getSgcNum')
// }) // })
// } // }
// // 立即申请 // // 立即申请
// function toView() { // function toView() {
// // window.open(newpage.href, '_blank') // // window.open(newpage.href, '_blank')
// router.push({ // router.push({
// path: '/apply', // path: '/apply',
// query: { // query: {
// name: props.dataList.name, // name: props.dataList.name,
// resourceId: [props.dataList.id], // resourceId: [props.dataList.id],
// }, // },
// }) // })
// } // }
// 融合服务--一键申请 // 融合服务--一键申请
const handleAKeyApplication = () => { const handleAKeyApplication = () => {
let _applyList = []; let _applyList = []
(props.dataList.fuseResourceList || []).map(v => { ;(props.dataList.fuseResourceList || []).map((v) => {
let resource = v.resource || {} let resource = v.resource || {}
let obj = { let obj = {
arr: [ arr: [
@ -131,43 +135,40 @@ const handleAKeyApplication = () => {
_applyList.push(obj) _applyList.push(obj)
}) })
localStorage.setItem( localStorage.setItem('applyList', JSON.stringify(_applyList))
'applyList',
JSON.stringify(_applyList)
)
router.push({ router.push({
path: '/apply', path: '/apply',
}) })
} }
// 收藏 // 收藏
const goTOCollection = () => { const goTOCollection = () => {
console.log('收藏===================》', props.dataList) console.log('收藏===================》', props.dataList)
scInsert([{ resourceId: props.dataList.id }]).then((res) => { scInsert([{ resourceId: props.dataList.id }]).then((res) => {
console.log(res) console.log(res)
message.success('收藏成功') message.success('收藏成功')
}) })
} }
if (props.dataList.infoList) { if (props.dataList.infoList) {
applicationArea.value = props.dataList.infoList.filter( applicationArea.value = props.dataList.infoList.filter(
(val) => val.attrType === '应用领域' (val) => val.attrType === '应用领域'
)[0].attrValue )[0].attrValue
} }
watch( watch(
() => props.dataList, () => props.dataList,
(val) => { (val) => {
if (val) { if (val) {
console.log('props.dataList-----watch------->', val); console.log('props.dataList-----watch------->', val)
applicationArea.value = props.dataList.infoList.filter( applicationArea.value = props.dataList.infoList.filter(
(val) => val.attrType === '应用领域' (val) => val.attrType === '应用领域'
)[0].attrValue )[0].attrValue
} }
} }
) )
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.algorithm-top-details { .algorithm-top-details {
height: 6rem; height: 6rem;
padding: 1.8rem 0 0; padding: 1.8rem 0 0;
background: url('~@/assets/detailsAll/sf_top_bg.png') no-repeat; background: url('~@/assets/detailsAll/sf_top_bg.png') no-repeat;
@ -230,13 +231,13 @@ watch(
font-size: 0.18rem; font-size: 0.18rem;
line-height: 0.34rem; line-height: 0.34rem;
&>div:nth-of-type(1) { & > div:nth-of-type(1) {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
&>div:nth-of-type(2) { & > div:nth-of-type(2) {
max-height: 1rem; max-height: 1rem;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -284,5 +285,5 @@ watch(
background-size: 100%; background-size: 100%;
margin-top: -0.4rem; margin-top: -0.4rem;
} }
} }
</style> </style>

59
front/src/views/detailsAll/components/Business/BusinessNavigation.vue
View File

@ -8,7 +8,12 @@
<template> <template>
<div class="business-navigation" v-if="navList.length > 0"> <div class="business-navigation" v-if="navList.length > 0">
<template v-for="nav in navList" :key="nav.key"> <template v-for="nav in navList" :key="nav.key">
<div class="nav" :class="{ select: nav.key == select }" v-if="nav.show" @click="selectNav(nav.key)"> <div
class="nav"
:class="{ select: nav.key == select }"
v-if="nav.show"
@click="selectNav(nav.key)"
>
{{ nav.name }} {{ nav.name }}
<span class="line"></span> <span class="line"></span>
</div> </div>
@ -16,14 +21,14 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref, defineProps, watch, getCurrentInstance } from 'vue' import { ref, defineProps, watch, getCurrentInstance } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
import { queryPartAppByKeyId2 } from '@/api/home' import { queryPartAppByKeyId2 } from '@/api/home'
// 获取当前路由地址 // 获取当前路由地址
const router = useRouter() const router = useRouter()
const keyId = router.currentRoute.value.query.id const keyId = router.currentRoute.value.query.id
const navList = ref([ const navList = ref([
{ {
name: '组件展示', name: '组件展示',
key: 'business-presentation', key: 'business-presentation',
@ -49,16 +54,16 @@ const navList = ref([
name: '常见问题', name: '常见问题',
key: 'common-problem', key: 'common-problem',
}, },
]) ])
const props = defineProps({ const props = defineProps({
associatedComponents: { type: Array, default: null }, associatedComponents: { type: Array, default: null },
selectNow: { type: String, default: '' }, selectNow: { type: String, default: '' },
dataList: { type: Object, default: null }, dataList: { type: Object, default: null },
}) })
const select = ref('business-associated-ability') const select = ref('business-associated-ability')
const list = ref([]) const list = ref([])
// 根据能力id查询是否存在关联应用 // 根据能力id查询是否存在关联应用
if (keyId) { if (keyId) {
queryPartAppByKeyId2({ keyId: keyId }).then((res) => { queryPartAppByKeyId2({ keyId: keyId }).then((res) => {
console.log('ressssssss', res) console.log('ressssssss', res)
if (res.data.data.length > 0) { if (res.data.data.length > 0) {
@ -72,13 +77,13 @@ if (keyId) {
console.log('navList', navList) console.log('navList', navList)
} }
}) })
} }
const selectNav = (key) => { const selectNav = (key) => {
select.value = key select.value = key
console.log(key, select.value) console.log(key, select.value)
mybus.emit('flyToView', select.value) mybus.emit('flyToView', select.value)
} }
if (props.dataList.infoList) { if (props.dataList.infoList) {
list.value = [] list.value = []
let arr = [ let arr = [
'关联应用', '关联应用',
@ -128,14 +133,14 @@ if (props.dataList.infoList) {
} }
} }
console.log('11111111111111111111111111', list.value, navList.value) console.log('11111111111111111111111111', list.value, navList.value)
} }
watch( watch(
() => props.selectNow, () => props.selectNow,
(newValue) => { (newValue) => {
select.value = newValue select.value = newValue
} }
) )
watch( watch(
() => props.dataList, () => props.dataList,
(val) => { (val) => {
if (val) { if (val) {
@ -192,10 +197,10 @@ watch(
console.log('11111111111111111111111111', list.value, navList.value) console.log('11111111111111111111111111', list.value, navList.value)
} }
} }
) )
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.business-navigation { .business-navigation {
width: 19.12rem; width: 19.12rem;
height: 0.84rem; height: 0.84rem;
line-height: 0.8rem; line-height: 0.8rem;
@ -228,5 +233,5 @@ watch(
background: #526aff; background: #526aff;
} }
} }
} }
</style> </style>

584
front/src/views/home/DetailsPageconetent.vue
View File

@ -10,57 +10,100 @@
</div> </div>
<div class="top" v-if="Cardsname != '知识库' && Cardsname != '基础设施'"> <div class="top" v-if="Cardsname != '知识库' && Cardsname != '基础设施'">
<div class="top-title"> <div class="top-title">
<div v-for="item in titleName" :key="item.name" :class="item.name === Cardsname ? 'sel' : ''" <div
@click="changeCards(item.name)"> v-for="item in titleName"
<span class="photo" :style="{ :key="item.name"
:class="item.name === Cardsname ? 'sel' : ''"
@click="changeCards(item.name)"
>
<span
class="photo"
:style="{
backgroundImage: `url(${item.photo}) `, backgroundImage: `url(${item.photo}) `,
backgroundSize: 'cover', backgroundSize: 'cover',
}"></span> }"
></span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</div> </div>
<div class="resultListSearchInput-father"> <div class="resultListSearchInput-father">
<div class="resultListSearchInput-son"> <div class="resultListSearchInput-son">
模糊搜索 模糊搜索
<a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large" <a-input-search
@search="getAppResources" @change="onSearch" class="resultListSearchInput" /> v-model:value="searchValue"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@search="getAppResources"
@change="onSearch"
class="resultListSearchInput"
/>
<button class="button-reset" @click="chongzhi()">重置</button> <button class="button-reset" @click="chongzhi()">重置</button>
<div class="hengxian"></div> <div class="hengxian"></div>
</div> </div>
</div> </div>
<div class="top-content-father" :key="listKey"> <div class="top-content-father" :key="listKey">
<template v-if=" <template
v-if="
Cardsname == '组件服务' || Cardsname == '组件服务' ||
Cardsname == '应用资源' || Cardsname == '应用资源' ||
Cardsname == '' Cardsname == ''
"> "
>
<div class="top-content-son"> <div class="top-content-son">
<div v-for="(item, index) in ListContent.records" :key="index" class="top-content"> <div
v-for="(item, index) in ListContent.records"
:key="index"
class="top-content"
>
<span class="top-content-title"> <span class="top-content-title">
{{ item.name }} {{ item.name }}
</span> </span>
<div class="leixingsumfather" :class="!item.shrinkFlag ? 'shrink' : ''"> <div
<div v-for="(item2, index2) in item.typeList" :key="index2" class="leixingsum"> class="leixingsumfather"
<a-checkable-tag :checked=" :class="!item.shrinkFlag ? 'shrink' : ''"
>
<div
v-for="(item2, index2) in item.typeList"
:key="index2"
class="leixingsum"
>
<a-checkable-tag
:checked="
item.selectedTags && item.selectedTags &&
item.selectedTags.indexOf(item2.dict_label) !== -1 item.selectedTags.indexOf(item2.dict_label) !== -1
" @change=" "
@change="
(checked) => handleChange(item2, checked, item.name) (checked) => handleChange(item2, checked, item.name)
"> "
>
{{ item2.dict_label }} {{ item2.dict_label }}
</a-checkable-tag> </a-checkable-tag>
</div> </div>
</div> </div>
<div class="shrinkTag" v-if="item.showShrink" :key="item.shrinkFlag"> <div
<up-outlined v-show="!item.shrinkFlag" @click="changeShrink(item.name)" /> class="shrinkTag"
<down-outlined v-show="item.shrinkFlag" @click="changeShrink(item.name)" /> v-if="item.showShrink"
:key="item.shrinkFlag"
>
<up-outlined
v-show="!item.shrinkFlag"
@click="changeShrink(item.name)"
/>
<down-outlined
v-show="item.shrinkFlag"
@click="changeShrink(item.name)"
/>
</div> </div>
</div> </div>
<div class="top-content" v-if="Cardsname == '组件服务'"> <div class="top-content" v-if="Cardsname == '组件服务'">
<span class="top-content-title">共享条件</span> <span class="top-content-title">共享条件</span>
<div class="leixingsumfather"> <div class="leixingsumfather">
<div class="leixingsum"> <div class="leixingsum">
<a-checkable-tag :checked="tagFlag == '申请'" @change="() => chagneTag('申请')"> <a-checkable-tag
:checked="tagFlag == '申请'"
@change="() => chagneTag('申请')"
>
申请 申请
</a-checkable-tag> </a-checkable-tag>
</div> </div>
@ -77,25 +120,49 @@
</div> </div>
</template> </template>
</div> </div>
<searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2" <searchResultList
:resourceList="resourceList" :resourceTotal="resourceTotal" :select-cardsname="Cardsname" /> v-show="resourceList.data && resourceList.data.length > 0"
:key="listKey2"
:resourceList="resourceList"
:resourceTotal="resourceTotal"
:select-cardsname="Cardsname"
/>
<div class="pagination"> <div class="pagination">
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage" <a-pagination
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper :total="resourceTotal" v-if="resourceList.data && resourceList.data.length > 0"
:page-size-options="pageSizeOptions" @change="pageChange" @showSizeChange="onShowSizeChange" /> 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>
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem"> <div
v-if="resourceList.data && resourceList.data.length <= 0"
style="margin-top: 2rem"
>
<a-empty /> <a-empty />
</div> </div>
</div> </div>
<div class="top" v-else-if="Cardsname === '基础设施'"> <div class="top" v-else-if="Cardsname === '基础设施'">
<div class="top-title"> <div class="top-title">
<div v-for="item in titleName" :key="item.name" :class="item.name === Cardsname ? 'sel' : ''" <div
@click="changeCards(item.name)"> v-for="item in titleName"
<span class="photo" :style="{ :key="item.name"
:class="item.name === Cardsname ? 'sel' : ''"
@click="changeCards(item.name)"
>
<span
class="photo"
:style="{
backgroundImage: `url(${item.photo}) `, backgroundImage: `url(${item.photo}) `,
backgroundSize: 'cover', backgroundSize: 'cover',
}"></span> }"
></span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</div> </div>
@ -105,24 +172,41 @@
</div> </div>
<div class="top" v-else> <div class="top" v-else>
<div class="top-title"> <div class="top-title">
<div v-for="item in titleName" :key="item.name" :class="item.name === Cardsname ? 'sel' : ''" <div
@click="changeCards(item.name)"> v-for="item in titleName"
<span class="photo" :style="{ :key="item.name"
:class="item.name === Cardsname ? 'sel' : ''"
@click="changeCards(item.name)"
>
<span
class="photo"
:style="{
backgroundImage: `url(${item.photo}) `, backgroundImage: `url(${item.photo}) `,
backgroundSize: 'cover', backgroundSize: 'cover',
}"></span> }"
></span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</div> </div>
<div class="resultListSearchInput-father" style="background: unset"> <div class="resultListSearchInput-father" style="background: unset">
<div class="resultListSearchInput-son"> <div class="resultListSearchInput-son">
模糊搜索 模糊搜索
<a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large" <a-input-search
@search="getAppResources" @change="onSearch" class="resultListSearchInput" /> v-model:value="searchValue"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@search="getAppResources"
@change="onSearch"
class="resultListSearchInput"
/>
<button class="button-reset" @click="chongzhi()">重置</button> <button class="button-reset" @click="chongzhi()">重置</button>
</div> </div>
</div> </div>
<KnowledgeBase :resourceList="resourceList" :resourceTotal="resourceTotal"></KnowledgeBase> <KnowledgeBase
:resourceList="resourceList"
:resourceTotal="resourceTotal"
></KnowledgeBase>
</div> </div>
<div class="talk-monitor" @click="openMonitor"> <div class="talk-monitor" @click="openMonitor">
<a-tooltip> <a-tooltip>
@ -132,18 +216,28 @@
</div> </div>
</div> </div>
<!-- 西海岸 --> <!-- 西海岸 -->
<div class="details-pageconetent" v-else-if="whoShow1 && whoShow1.itShowXiHaiAn"> <div
class="details-pageconetent"
v-else-if="whoShow1 && whoShow1.itShowXiHaiAn"
>
<home-header></home-header> <home-header></home-header>
<div class="details-pageconetent-left"> <div class="details-pageconetent-left">
<detailsPageconetentTree /> <detailsPageconetentTree />
</div> </div>
<div class="top" v-if="Cardsname != '知识库'"> <div class="top" v-if="Cardsname != '知识库'">
<div class="top-title"> <div class="top-title">
<div v-for="item in titleName" :key="item.name" :class="item.name === Cardsname ? 'sel' : ''" <div
@click="changeCards(item.name)"> v-for="item in titleName"
<span class="photo" :style="{ :key="item.name"
:class="item.name === Cardsname ? 'sel' : ''"
@click="changeCards(item.name)"
>
<span
class="photo"
:style="{
backgroundImage: `url(${item.photo}) `, backgroundImage: `url(${item.photo}) `,
}"></span> }"
></span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</div> </div>
@ -151,46 +245,82 @@
<div class="resultListSearchInput-father"> <div class="resultListSearchInput-father">
<div class="resultListSearchInput-son"> <div class="resultListSearchInput-son">
模糊搜索 模糊搜索
<a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large" <a-input-search
@search="getAppResources" @change="onSearch" class="resultListSearchInput" /> v-model:value="searchValue"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@search="getAppResources"
@change="onSearch"
class="resultListSearchInput"
/>
<button class="button-reset" @click="chongzhi()">重置</button> <button class="button-reset" @click="chongzhi()">重置</button>
<div class="hengxian"></div> <div class="hengxian"></div>
</div> </div>
</div> </div>
<!-- 分类 --> <!-- 分类 -->
<div class="top-content-father" :key="listKey"> <div class="top-content-father" :key="listKey">
<template v-if=" <template
v-if="
Cardsname == '组件服务' || Cardsname == '组件服务' ||
Cardsname == '应用资源' || Cardsname == '应用资源' ||
Cardsname == '' Cardsname == ''
"> "
>
<div class="top-content-son"> <div class="top-content-son">
<div v-for="(item, index) in ListContent.records" :key="index" class="top-content"> <div
v-for="(item, index) in ListContent.records"
:key="index"
class="top-content"
>
<span class="top-content-title"> <span class="top-content-title">
{{ item.name }} {{ item.name }}
</span> </span>
<div class="leixingsumfather" :class="!item.shrinkFlag ? 'shrink' : ''"> <div
<div v-for="(item2, index2) in item.typeList" :key="index2" class="leixingsum"> class="leixingsumfather"
<a-checkable-tag :checked=" :class="!item.shrinkFlag ? 'shrink' : ''"
>
<div
v-for="(item2, index2) in item.typeList"
:key="index2"
class="leixingsum"
>
<a-checkable-tag
:checked="
item.selectedTags && item.selectedTags &&
item.selectedTags.indexOf(item2.dict_label) !== -1 item.selectedTags.indexOf(item2.dict_label) !== -1
" @change=" "
@change="
(checked) => handleChange(item2, checked, item.name) (checked) => handleChange(item2, checked, item.name)
"> "
>
{{ item2.dict_label }} {{ item2.dict_label }}
</a-checkable-tag> </a-checkable-tag>
</div> </div>
</div> </div>
<div class="shrinkTag" v-if="item.showShrink" :key="item.shrinkFlag"> <div
<up-outlined v-show="!item.shrinkFlag" @click="changeShrink(item.name)" /> class="shrinkTag"
<down-outlined v-show="item.shrinkFlag" @click="changeShrink(item.name)" /> v-if="item.showShrink"
:key="item.shrinkFlag"
>
<up-outlined
v-show="!item.shrinkFlag"
@click="changeShrink(item.name)"
/>
<down-outlined
v-show="item.shrinkFlag"
@click="changeShrink(item.name)"
/>
</div> </div>
</div> </div>
<div class="top-content" v-if="Cardsname == '组件服务'"> <div class="top-content" v-if="Cardsname == '组件服务'">
<span class="top-content-title">共享条件</span> <span class="top-content-title">共享条件</span>
<div class="leixingsumfather"> <div class="leixingsumfather">
<div class="leixingsum"> <div class="leixingsum">
<a-checkable-tag :checked="tagFlag == '申请'" @change="() => chagneTag('申请')"> <a-checkable-tag
:checked="tagFlag == '申请'"
@change="() => chagneTag('申请')"
>
申请 申请
</a-checkable-tag> </a-checkable-tag>
</div> </div>
@ -208,37 +338,71 @@
</template> </template>
</div> </div>
<!-- 中心内容 --> <!-- 中心内容 -->
<searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2" <searchResultList
:resourceList="resourceList" :resourceTotal="resourceTotal" :select-cardsname="Cardsname" /> v-show="resourceList.data && resourceList.data.length > 0"
:key="listKey2"
:resourceList="resourceList"
:resourceTotal="resourceTotal"
:select-cardsname="Cardsname"
/>
<!-- 分页 --> <!-- 分页 -->
<div class="pagination"> <div class="pagination">
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage" <a-pagination
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper :total="resourceTotal" v-if="resourceList.data && resourceList.data.length > 0"
:page-size-options="pageSizeOptions" @change="pageChange" @showSizeChange="onShowSizeChange" /> 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>
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 200px"> <div
v-if="resourceList.data && resourceList.data.length <= 0"
style="margin-top: 200px"
>
<a-empty /> <a-empty />
</div> </div>
</div> </div>
<div class="top" v-else> <div class="top" v-else>
<div class="top-title"> <div class="top-title">
<div v-for="item in titleName" :key="item.name" :class="item.name === Cardsname ? 'sel' : ''" <div
@click="changeCards(item.name)"> v-for="item in titleName"
<span class="photo" :style="{ :key="item.name"
:class="item.name === Cardsname ? 'sel' : ''"
@click="changeCards(item.name)"
>
<span
class="photo"
:style="{
backgroundImage: `url(${item.photo}) `, backgroundImage: `url(${item.photo}) `,
}"></span> }"
></span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</div> </div>
<div class="resultListSearchInput-father" style="background: unset"> <div class="resultListSearchInput-father" style="background: unset">
<div class="resultListSearchInput-son"> <div class="resultListSearchInput-son">
模糊搜索 模糊搜索
<a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large" <a-input-search
@search="getAppResources" @change="onSearch" class="resultListSearchInput" /> v-model:value="searchValue"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@search="getAppResources"
@change="onSearch"
class="resultListSearchInput"
/>
<button class="button-reset" @click="chongzhi()">重置</button> <button class="button-reset" @click="chongzhi()">重置</button>
</div> </div>
</div> </div>
<KnowledgeBase :resourceList="resourceList" :resourceTotal="resourceTotal"></KnowledgeBase> <KnowledgeBase
:resourceList="resourceList"
:resourceTotal="resourceTotal"
></KnowledgeBase>
</div> </div>
<div class="talk-monitor" @click="openMonitor"> <div class="talk-monitor" @click="openMonitor">
<a-tooltip> <a-tooltip>
@ -248,64 +412,113 @@
</div> </div>
</div> </div>
<!-- 包头 --> <!-- 包头 -->
<div class="details-pageconetent" v-else-if="whoShow1 && whoShow1.itShowBaoTou"> <div
class="details-pageconetent"
v-else-if="whoShow1 && whoShow1.itShowBaoTou"
>
<home-header></home-header> <home-header></home-header>
<div class="details-pageconetent-left"> <div class="details-pageconetent-left">
<detailsPageconetentTree /> <detailsPageconetentTree />
</div> </div>
<div class="top" v-if="Cardsname != '知识库' && Cardsname != '数据资源'"> <div class="top" v-if="Cardsname != '知识库' && Cardsname != '数据资源'">
<div class="top-title"> <div class="top-title">
<div v-for="item in titleName" :key="item.name" :class="item.name === Cardsname ? 'sel' : ''" <div
@click="changeCards(item.name)"> v-for="item in titleName"
<span class="photo" :style="{ :key="item.name"
:class="item.name === Cardsname ? 'sel' : ''"
@click="changeCards(item.name)"
>
<span
class="photo"
:style="{
backgroundImage: `url(${item.photo}) `, backgroundImage: `url(${item.photo}) `,
backgroundSize: 'cover', backgroundSize: 'cover',
}"></span> }"
></span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</div> </div>
<div v-show="Cardsname !== '数据资源'" class="resultListSearchInput-father"> <div
v-show="Cardsname !== '数据资源'"
class="resultListSearchInput-father"
>
<div class="resultListSearchInput-son"> <div class="resultListSearchInput-son">
模糊搜索 模糊搜索
<a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large" <a-input-search
@search="getAppResources" @change="onSearch" class="resultListSearchInput" /> v-model:value="searchValue"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@search="getAppResources"
@change="onSearch"
class="resultListSearchInput"
/>
<button class="button-reset" @click="chongzhi()">重置</button> <button class="button-reset" @click="chongzhi()">重置</button>
<div class="hengxian"></div> <div class="hengxian"></div>
</div> </div>
</div> </div>
<div class="top-content-father" :key="listKey"> <div class="top-content-father" :key="listKey">
<template v-if=" <template
v-if="
Cardsname == '组件服务' || Cardsname == '组件服务' ||
Cardsname == '应用资源' || Cardsname == '应用资源' ||
Cardsname == '' Cardsname == ''
"> "
>
<div class="top-content-son"> <div class="top-content-son">
<div v-for="(item, index) in ListContent.records" :key="index" class="top-content"> <div
v-for="(item, index) in ListContent.records"
:key="index"
class="top-content"
>
<span class="top-content-title"> <span class="top-content-title">
{{ item.name }} {{ item.name }}
</span> </span>
<div class="leixingsumfather" :class="!item.shrinkFlag ? 'shrink' : ''"> <div
<div v-for="(item2, index2) in item.typeList" :key="index2" class="leixingsum"> class="leixingsumfather"
<a-checkable-tag :checked=" :class="!item.shrinkFlag ? 'shrink' : ''"
>
<div
v-for="(item2, index2) in item.typeList"
:key="index2"
class="leixingsum"
>
<a-checkable-tag
:checked="
item.selectedTags && item.selectedTags &&
item.selectedTags.indexOf(item2.dict_label) !== -1 item.selectedTags.indexOf(item2.dict_label) !== -1
" @change=" "
@change="
(checked) => handleChange(item2, checked, item.name) (checked) => handleChange(item2, checked, item.name)
"> "
>
{{ item2.dict_label }} {{ item2.dict_label }}
</a-checkable-tag> </a-checkable-tag>
</div> </div>
</div> </div>
<div class="shrinkTag" v-if="item.showShrink" :key="item.shrinkFlag"> <div
<up-outlined v-show="!item.shrinkFlag" @click="changeShrink(item.name)" /> class="shrinkTag"
<down-outlined v-show="item.shrinkFlag" @click="changeShrink(item.name)" /> v-if="item.showShrink"
:key="item.shrinkFlag"
>
<up-outlined
v-show="!item.shrinkFlag"
@click="changeShrink(item.name)"
/>
<down-outlined
v-show="item.shrinkFlag"
@click="changeShrink(item.name)"
/>
</div> </div>
</div> </div>
<div class="top-content" v-if="Cardsname == '组件服务'"> <div class="top-content" v-if="Cardsname == '组件服务'">
<span class="top-content-title">共享条件</span> <span class="top-content-title">共享条件</span>
<div class="leixingsumfather"> <div class="leixingsumfather">
<div class="leixingsum"> <div class="leixingsum">
<a-checkable-tag :checked="tagFlag == '申请'" @change="() => chagneTag('申请')"> <a-checkable-tag
:checked="tagFlag == '申请'"
@change="() => chagneTag('申请')"
>
申请 申请
</a-checkable-tag> </a-checkable-tag>
</div> </div>
@ -322,18 +535,35 @@
</div> </div>
</template> </template>
</div> </div>
<searchResultList v-show="resourceList.data && resourceList.data.length" :key="listKey2" <searchResultList
:resourceList="resourceList" :resourceTotal="resourceTotal" :select-cardsname="Cardsname" /> v-show="resourceList.data && resourceList.data.length"
:key="listKey2"
:resourceList="resourceList"
:resourceTotal="resourceTotal"
:select-cardsname="Cardsname"
/>
<div class="pagination"> <div class="pagination">
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage" <a-pagination
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper :total="resourceTotal" v-if="resourceList.data && resourceList.data.length > 0"
:page-size-options="pageSizeOptions" @change="pageChange" @showSizeChange="onShowSizeChange" /> 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>
<div class="shujuziyuan" v-if="Cardsname == '数据资源'"> <div class="shujuziyuan" v-if="Cardsname == '数据资源'">
<div class="yunziyuan"> <div class="yunziyuan">
<div class="yunziyuan-title"> <div class="yunziyuan-title">
<div class="tupian"></div> <div class="tupian"></div>
<div class="title" @click="dianjitiaozhaun('青岛市政务资源管理平台')"> <div
class="title"
@click="dianjitiaozhaun('青岛市政务资源管理平台')"
>
青岛市政务资源管理平台{{ dataShowdev }} 青岛市政务资源管理平台{{ dataShowdev }}
</div> </div>
</div> </div>
@ -349,18 +579,28 @@
</div> </div>
</div> </div>
</div> </div>
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem"> <div
v-if="resourceList.data && resourceList.data.length <= 0"
style="margin-top: 2rem"
>
<a-empty v-if="!(Cardsname == '数据资源')" /> <a-empty v-if="!(Cardsname == '数据资源')" />
</div> </div>
</div> </div>
<div class="top" v-else-if="Cardsname == '数据资源'"> <div class="top" v-else-if="Cardsname == '数据资源'">
<div class="top-title"> <div class="top-title">
<div v-for="item in titleName" :key="item.name" :class="item.name === Cardsname ? 'sel' : ''" <div
@click="changeCards(item.name)"> v-for="item in titleName"
<span class="photo" :style="{ :key="item.name"
:class="item.name === Cardsname ? 'sel' : ''"
@click="changeCards(item.name)"
>
<span
class="photo"
:style="{
backgroundImage: `url(${item.photo}) `, backgroundImage: `url(${item.photo}) `,
backgroundSize: 'cover', backgroundSize: 'cover',
}"></span> }"
></span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</div> </div>
@ -368,24 +608,41 @@
</div> </div>
<div class="top" v-else> <div class="top" v-else>
<div class="top-title"> <div class="top-title">
<div v-for="item in titleName" :key="item.name" :class="item.name === Cardsname ? 'sel' : ''" <div
@click="changeCards(item.name)"> v-for="item in titleName"
<span class="photo" :style="{ :key="item.name"
:class="item.name === Cardsname ? 'sel' : ''"
@click="changeCards(item.name)"
>
<span
class="photo"
:style="{
backgroundImage: `url(${item.photo}) `, backgroundImage: `url(${item.photo}) `,
backgroundSize: 'cover', backgroundSize: 'cover',
}"></span> }"
></span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</div> </div>
<div class="resultListSearchInput-father" style="background: unset"> <div class="resultListSearchInput-father" style="background: unset">
<div class="resultListSearchInput-son"> <div class="resultListSearchInput-son">
模糊搜索 模糊搜索
<a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large" <a-input-search
@search="getAppResources" @change="onSearch" class="resultListSearchInput" /> v-model:value="searchValue"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@search="getAppResources"
@change="onSearch"
class="resultListSearchInput"
/>
<button class="button-reset" @click="chongzhi()">重置</button> <button class="button-reset" @click="chongzhi()">重置</button>
</div> </div>
</div> </div>
<KnowledgeBase :resourceList="resourceList" :resourceTotal="resourceTotal"></KnowledgeBase> <KnowledgeBase
:resourceList="resourceList"
:resourceTotal="resourceTotal"
></KnowledgeBase>
</div> </div>
<!--<div class="talk-monitor" @click="openMonitor"> <!--<div class="talk-monitor" @click="openMonitor">
<a-tooltip> <a-tooltip>
@ -397,41 +654,34 @@
<home-footer></home-footer> <home-footer></home-footer>
</template> </template>
<script> <script>
import HomeFooter from '@/views/newHome/components/Footer' import HomeFooter from '@/views/newHome/components/Footer'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
import { import { defineComponent, reactive, ref, toRefs, onMounted, watch } from 'vue'
defineComponent, import { UpOutlined, DownOutlined } from '@ant-design/icons-vue'
reactive, import {
ref,
toRefs,
onMounted,
watch,
} from 'vue'
import {
UpOutlined,
DownOutlined,
} from '@ant-design/icons-vue'
import {
selectDicStoreAll, selectDicStoreAll,
pageWithAttrs, pageWithAttrs,
getDataResource, getDataResource,
getIntegrationServicesList, } from '@/api/home.js'
} from '@/api/home.js' import { getSgcList } from '@/api/personalCenter'
import { getSgcList } from '@/api/personalCenter' import { useRouter } from 'vue-router'
import { useRouter } from 'vue-router' import HomeHeader from '@/views/home/components/header'
import HomeHeader from '@/views/home/components/header' import detailsPageconetentTree from '@/views/home/detailsPageconetentTree.vue'
import detailsPageconetentTree from '@/views/home/detailsPageconetentTree.vue' import searchResultList from '@/views/home/components/searchResultList.vue'
import searchResultList from '@/views/home/components/searchResultList.vue' import KnowledgeBase from '@/views/home/components/KnowledgeBase.vue'
import KnowledgeBase from '@/views/home/components/KnowledgeBase.vue' // 数据资源引用
// 数据资源引用 import DetailsPageResource from '@/views/home/components/DetailsPageResource.vue'
import DetailsPageResource from '@/views/home/components/DetailsPageResource.vue' // 基础设施引用
// 基础设施引用 import infrastructurePage from '@/views/home/infrastructurePage.vue'
import infrastructurePage from '@/views/home/infrastructurePage.vue' import detailsPageInfrastructureTree from '@/views/home/detailsPageInfrastructureTree.vue'
import detailsPageInfrastructureTree from '@/views/home/detailsPageInfrastructureTree.vue' // import { message } from 'ant-design-vue'
import { message } from 'ant-design-vue' import {
import { titleNameArray, keyongziyuanqingkaungArray, shujuziyuanqingkuangArray } from './constantData/showData.js' titleNameArray,
keyongziyuanqingkaungArray,
shujuziyuanqingkuangArray,
} from './constantData/showData.js'
export default defineComponent({ export default defineComponent({
setup() { setup() {
const titleName = ref(titleNameArray) const titleName = ref(titleNameArray)
@ -738,8 +988,7 @@ export default defineComponent({
loading.value = false loading.value = false
} }
}) })
} } else if (paramsGetResources.type !== '数据资源') {
else if (paramsGetResources.type !== '数据资源') {
if (switchIndex != '分页查询') { if (switchIndex != '分页查询') {
paramsGetResources.pageNum = 1 paramsGetResources.pageNum = 1
} }
@ -833,7 +1082,7 @@ export default defineComponent({
} }
onMounted(() => { onMounted(() => {
listKey2.value++; listKey2.value++
// 获取筛选条件 // 获取筛选条件
getNewList() getNewList()
@ -964,10 +1213,10 @@ export default defineComponent({
mybus.off('changePage') mybus.off('changePage')
mybus.off('changeInfo') mybus.off('changeInfo')
}, },
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.resultListSearchInput-father { .resultListSearchInput-father {
background: #f3f5f9; background: #f3f5f9;
padding: 0.2rem; padding: 0.2rem;
@ -984,9 +1233,9 @@ export default defineComponent({
margin-top: 0.2rem; margin-top: 0.2rem;
} }
} }
} }
.resultListSearchInput { .resultListSearchInput {
margin-left: 0.1rem; margin-left: 0.1rem;
:deep(.ant-input) { :deep(.ant-input) {
@ -1011,9 +1260,9 @@ export default defineComponent({
:deep(.ant-input-group-addon) { :deep(.ant-input-group-addon) {
left: 0 !important; left: 0 !important;
} }
} }
.button-reset { .button-reset {
border: 0; border: 0;
outline: none; outline: none;
width: 0.8rem; width: 0.8rem;
@ -1026,9 +1275,9 @@ export default defineComponent({
line-height: 0.34rem; line-height: 0.34rem;
margin-left: 2.5rem; margin-left: 2.5rem;
cursor: pointer; cursor: pointer;
} }
.details-pageconetent { .details-pageconetent {
height: 100%; height: 100%;
width: 100%; width: 100%;
display: flex; display: flex;
@ -1083,7 +1332,8 @@ export default defineComponent({
display: flex; display: flex;
align-items: center; align-items: center;
.tupian {} .tupian {
}
.title { .title {
margin-left: 0.1rem; margin-left: 0.1rem;
@ -1116,7 +1366,7 @@ export default defineComponent({
} }
} }
.yunziyuan>div { .yunziyuan > div {
margin-bottom: 0.1rem; margin-bottom: 0.1rem;
} }
@ -1127,7 +1377,8 @@ export default defineComponent({
display: flex; display: flex;
align-items: center; align-items: center;
.tupian {} .tupian {
}
.title { .title {
margin-left: 0.1rem; margin-left: 0.1rem;
@ -1151,12 +1402,12 @@ export default defineComponent({
} }
} }
.shipin>div { .shipin > div {
margin-bottom: 0.1rem; margin-bottom: 0.1rem;
} }
} }
.jichusheshi>div { .jichusheshi > div {
padding-top: 0.1rem; padding-top: 0.1rem;
border-radius: 0.04rem; border-radius: 0.04rem;
margin-bottom: 0.2rem; margin-bottom: 0.2rem;
@ -1185,7 +1436,8 @@ export default defineComponent({
align-items: center; align-items: center;
margin-left: 0.2rem; margin-left: 0.2rem;
.tupian {} .tupian {
}
.title { .title {
margin-left: 0.1rem; margin-left: 0.1rem;
@ -1218,12 +1470,12 @@ export default defineComponent({
} }
} }
.yunziyuan>div { .yunziyuan > div {
margin-bottom: 0.1rem; margin-bottom: 0.1rem;
} }
} }
.shujuziyuan>div { .shujuziyuan > div {
background: #eaf4ff; background: #eaf4ff;
padding-top: 0.1rem; padding-top: 0.1rem;
border-radius: 0.04rem; border-radius: 0.04rem;
@ -1355,9 +1607,9 @@ export default defineComponent({
} }
} }
} }
} }
.shrinkTag { .shrinkTag {
width: 0.5rem; width: 0.5rem;
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -1367,14 +1619,14 @@ export default defineComponent({
span { span {
cursor: pointer; cursor: pointer;
} }
} }
.shrink { .shrink {
height: unset !important; height: unset !important;
overflow: unset !important; overflow: unset !important;
} }
.talk-monitor { .talk-monitor {
position: fixed; position: fixed;
bottom: 0.5rem; bottom: 0.5rem;
right: 0.1rem; right: 0.1rem;
@ -1388,9 +1640,9 @@ export default defineComponent({
background: url('~@/assets/home/icon-talk.png'); background: url('~@/assets/home/icon-talk.png');
background-size: cover; background-size: cover;
} }
} }
.top-content-father { .top-content-father {
width: 10.87rem; width: 10.87rem;
padding-left: 0.2rem; padding-left: 0.2rem;
@ -1477,12 +1729,12 @@ export default defineComponent({
.top-content:nth-child(1) { .top-content:nth-child(1) {
margin-top: 0.41rem !important; margin-top: 0.41rem !important;
} }
} }
:deep(.ant-card-grid) { :deep(.ant-card-grid) {
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
-webkit-line-clamp: 1; -webkit-line-clamp: 1;
} }
</style> </style>

66
front/src/views/home/components/CompareGroupView.vue
View File

@ -2,11 +2,17 @@
<div> <div>
<div v-if="groupArray.length > 0"> <div v-if="groupArray.length > 0">
<div class="group-box" v-for="(data, i) in groupArray" :key="i"> <div class="group-box" v-for="(data, i) in groupArray" :key="i">
<div class="flex-row-start row-tr" v-for="(item, j) in Object.keys(data)" :key="j" <div
:class="j == Object.keys(data).length - 1 ? 'border-bottom' : ''"> class="flex-row-start row-tr"
v-for="(item, j) in Object.keys(data)"
:key="j"
:class="j == Object.keys(data).length - 1 ? 'border-bottom' : ''"
>
<div class="td-name">{{ item }}</div> <div class="td-name">{{ item }}</div>
<div class="flex-row-start"> <div class="flex-row-start">
<div class="td" v-for="(d, k) in data[item]" :key="k">{{ d || '--' }}</div> <div class="td" v-for="(d, k) in data[item]" :key="k">
{{ d || '--' }}
</div>
</div> </div>
</div> </div>
</div> </div>
@ -14,13 +20,12 @@
{{ '哈啊哈哈哈哈' + groupArray.length }} {{ '哈啊哈哈哈哈' + groupArray.length }}
<div v-if="groupArray.length == 0" class="no-data">暂无数据</div> <div v-if="groupArray.length == 0" class="no-data">暂无数据</div>
</div> </div>
</template> </template>
<script> <script>
import { defineComponent, ref, onMounted, getCurrentInstance, computed, watch, nextTick } from 'vue' import { ref, watch, nextTick } from 'vue'
export default { export default {
props: ["dataList"], props: ['dataList'],
setup(props) { setup(props) {
let groupArray = ref([]) let groupArray = ref([])
watch( watch(
@ -28,27 +33,27 @@ export default {
return props.dataList return props.dataList
}, },
(newVal) => { (newVal) => {
console.log('newVal------------>', newVal); console.log('newVal------------>', newVal)
groupArray = ref([]) groupArray = ref([])
newVal.map(v => { newVal.map((v) => {
groupArray.value.push(v) groupArray.value.push(v)
}) })
groupArray.value = groupArray.value.splice(0) groupArray.value = groupArray.value.splice(0)
nextTick(() => { nextTick(() => {
console.log('groupArray---子组件--------->', groupArray.value); console.log('groupArray---子组件--------->', groupArray.value)
}) })
}, },
{ {
deep: true, deep: true,
immediate: true immediate: true,
} }
) )
return { return {
groupArray, groupArray,
} }
},
} }
}
</script> </script>
<!-- <script setup> <!-- <script setup>
@ -79,44 +84,43 @@ nextTick(() => {
</script> --> </script> -->
<style lang="less" scoped> <style lang="less" scoped>
.group-box { .group-box {
margin-bottom: 20px; margin-bottom: 20px;
} }
.border { .border {
border: 1px solid #dddee1; border: 1px solid #dddee1;
border-bottom: none; border-bottom: none;
border-right: none; border-right: none;
} }
.row-tr {
.row-tr {
border: 1px solid #dddee1; border: 1px solid #dddee1;
border-right: none; border-right: none;
border-bottom: none; border-bottom: none;
} }
.no-border-right { .no-border-right {
border: 1px solid #dddee1; border: 1px solid #dddee1;
border-right: none; border-right: none;
} }
.flex-row-start { .flex-row-start {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
} }
.td-name { .td-name {
border-right: 1px solid #dddee1; border-right: 1px solid #dddee1;
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
text-align: center; text-align: center;
width: 200px; width: 200px;
font-size: 14px; font-size: 14px;
} }
.td { .td {
border-right: 1px solid #dddee1; border-right: 1px solid #dddee1;
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
@ -128,18 +132,18 @@ nextTick(() => {
word-wrap: break-all; word-wrap: break-all;
word-break: normal; word-break: normal;
overflow: hidden; overflow: hidden;
} }
.border-bottom { .border-bottom {
border-bottom: 1px solid #dddee1; border-bottom: 1px solid #dddee1;
} }
.no-data { .no-data {
height: 100px; height: 100px;
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border: 1px solid #dddee1; border: 1px solid #dddee1;
} }
</style> </style>

107
front/src/views/home/integrationServices.vue
View File

@ -6,21 +6,44 @@
<div class="resultListSearchInput-father"> <div class="resultListSearchInput-father">
<div class="resultListSearchInput-son"> <div class="resultListSearchInput-son">
模糊搜索 模糊搜索
<a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large" <a-input-search
@search="getAppResources" @change="onSearch" class="resultListSearchInput" /> v-model:value="searchValue"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@search="getAppResources"
@change="onSearch"
class="resultListSearchInput"
/>
<button class="button-reset" @click="chongzhi()">重置</button> <button class="button-reset" @click="chongzhi()">重置</button>
<div class="hengxian"></div> <div class="hengxian"></div>
</div> </div>
</div> </div>
<searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2" <searchResultList
:resourceList="resourceList" :resourceTotal="resourceTotal" selectCardsname="融合服务" /> v-show="resourceList.data && resourceList.data.length > 0"
:key="listKey2"
:resourceList="resourceList"
:resourceTotal="resourceTotal"
selectCardsname="融合服务"
/>
<div class="pagination"> <div class="pagination">
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage" <a-pagination
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper v-if="resourceList.data && resourceList.data.length > 0"
:total="resourceTotal" :page-size-options="pageSizeOptions" @change="pageChange" v-model:current="currentPage"
@showSizeChange="onShowSizeChange" /> 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>
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem"> <div
v-if="resourceList.data && resourceList.data.length <= 0"
style="margin-top: 2rem"
>
<a-empty /> <a-empty />
</div> </div>
</div> </div>
@ -28,26 +51,17 @@
<home-footer></home-footer> <home-footer></home-footer>
</template> </template>
<script> <script>
import HomeFooter from '@/views/newHome/components/Footer' import HomeFooter from '@/views/newHome/components/Footer'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
import { import { defineComponent, reactive, ref, onMounted, watch } from 'vue'
defineComponent,
reactive,
ref,
toRefs,
onMounted,
watch,
} from 'vue'
import { import { getIntegrationServicesList } from '@/api/home.js'
getIntegrationServicesList, import { useRouter } from 'vue-router'
} from '@/api/home.js' import HomeHeader from '@/views/home/components/header'
import { useRouter } from 'vue-router' import searchResultList from '@/views/home/components/searchResultList.vue'
import HomeHeader from '@/views/home/components/header' import { message } from 'ant-design-vue'
import searchResultList from '@/views/home/components/searchResultList.vue'
import { message } from 'ant-design-vue'
export default defineComponent({ export default defineComponent({
setup() { setup() {
// 分页 // 分页
const loading = ref(true) const loading = ref(true)
@ -95,12 +109,11 @@ export default defineComponent({
paramsGetResources.orderField = 'create_date' paramsGetResources.orderField = 'create_date'
paramsGetResources.orderType = 'DESC' paramsGetResources.orderType = 'DESC'
mybus.emit('chongzhi', { mybus.emit('chongzhi', {
type: '融合服务' type: '融合服务',
}) })
getAppResources() getAppResources()
} }
const getAppResources = () => { const getAppResources = () => {
getIntegrationList() getIntegrationList()
} }
@ -112,17 +125,20 @@ export default defineComponent({
page: currentPage.value, page: currentPage.value,
orderField: paramsGetResources.orderField, orderField: paramsGetResources.orderField,
orderType: paramsGetResources.orderType, orderType: paramsGetResources.orderType,
name: searchValue.value name: searchValue.value,
} }
getIntegrationServicesList(postData).then(res => { getIntegrationServicesList(postData).then(
(res) => {
if (res.data.code !== 0) { if (res.data.code !== 0) {
return message.error(res.data.msg) return message.error(res.data.msg)
} }
resourceList.data = res.data.data.list || [] resourceList.data = res.data.data.list || []
resourceTotal.value = res.data.data.total || 0 resourceTotal.value = res.data.data.total || 0
}, err => { },
(err) => {
message.error(err) message.error(err)
}) }
)
} }
mybus.on('paramsGetResources', (ids) => { mybus.on('paramsGetResources', (ids) => {
@ -163,7 +179,7 @@ export default defineComponent({
} }
onMounted(() => { onMounted(() => {
listKey2.value++; listKey2.value++
getAppResources() getAppResources()
}) })
@ -195,6 +211,7 @@ export default defineComponent({
pageSizeOptions, pageSizeOptions,
current, current,
loading, loading,
onShowSizeChange,
} }
}, },
components: { components: {
@ -208,10 +225,10 @@ export default defineComponent({
mybus.off('refresh') mybus.off('refresh')
mybus.off('changePage') mybus.off('changePage')
}, },
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.resultListSearchInput-father { .resultListSearchInput-father {
background: #f3f5f9; background: #f3f5f9;
padding: 0.2rem; padding: 0.2rem;
@ -228,9 +245,9 @@ export default defineComponent({
margin-top: 0.2rem; margin-top: 0.2rem;
} }
} }
} }
.resultListSearchInput { .resultListSearchInput {
margin-left: 0.1rem; margin-left: 0.1rem;
:deep(.ant-input) { :deep(.ant-input) {
@ -255,9 +272,9 @@ export default defineComponent({
:deep(.ant-input-group-addon) { :deep(.ant-input-group-addon) {
left: 0 !important; left: 0 !important;
} }
} }
.button-reset { .button-reset {
border: 0; border: 0;
outline: none; outline: none;
width: 0.8rem; width: 0.8rem;
@ -270,9 +287,9 @@ export default defineComponent({
line-height: 0.34rem; line-height: 0.34rem;
margin-left: 2.5rem; margin-left: 2.5rem;
cursor: pointer; cursor: pointer;
} }
.details-pageconetent { .details-pageconetent {
height: 100%; height: 100%;
width: 100%; width: 100%;
display: flex; display: flex;
@ -308,12 +325,12 @@ export default defineComponent({
padding-bottom: 0.6rem; padding-bottom: 0.6rem;
} }
} }
} }
:deep(.ant-card-grid) { :deep(.ant-card-grid) {
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
-webkit-line-clamp: 1; -webkit-line-clamp: 1;
} }
</style> </style>

195
front/src/views/home/integrationServicesDetails.vue
View File

@ -2,13 +2,20 @@
<template> <template>
<div class="IntegrationServicesDetails" :class="{ fixed2: scrollTop >= 600 }"> <div class="IntegrationServicesDetails" :class="{ fixed2: scrollTop >= 600 }">
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<application-top-details :dataList="detailInfoObj" :navList="navList"></application-top-details> <application-top-details
:dataList="detailInfoObj"
:navList="navList"
></application-top-details>
<!-- 导航 --> <!-- 导航 -->
<div :class="{ fixed: scrollTop >= 600 }"> <div :class="{ fixed: scrollTop >= 600 }">
<div class="application-navigation"> <div class="application-navigation">
<template v-for="nav in navList" :key="nav.key"> <template v-for="nav in navList" :key="nav.key">
<div class="nav" :class="{ selectNow: nav.key == selectNow }" @click="selectNav(nav.key)"> <div
class="nav"
:class="{ selectNow: nav.key == selectNow }"
@click="selectNav(nav.key)"
>
{{ nav.name }} {{ nav.name }}
<span class="line"></span> <span class="line"></span>
</div> </div>
@ -17,7 +24,10 @@
</div> </div>
<!-- 组合能力 --> <!-- 组合能力 -->
<div id="integration-combination-ability" class="combination-ability scrollBox"> <div
id="integration-combination-ability"
class="combination-ability scrollBox"
>
<div class="title-1"> <div class="title-1">
<DetalsTitle title="组合能力" type="COMBINATION ABILITY"></DetalsTitle> <DetalsTitle title="组合能力" type="COMBINATION ABILITY"></DetalsTitle>
</div> </div>
@ -50,9 +60,17 @@
</div> </div>
</div> </div>
<div class="content-card flex-row-start"> <div class="content-card flex-row-start">
<div class="right-item content-card-item" v-for="(use, i) in useWayShowList" :key="i"> <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-title title">{{ use.title }}</div>
<div class="card-text" v-for="(d, k) in Object.keys(use.info)" :key="k"> <div
class="card-text"
v-for="(d, k) in Object.keys(use.info)"
:key="k"
>
{{ use.info[d] }}:{{ detailInfoObj[d] || '--' }} {{ use.info[d] }}:{{ detailInfoObj[d] || '--' }}
</div> </div>
</div> </div>
@ -61,38 +79,43 @@
</div> </div>
<!-- 常见问题--> <!-- 常见问题-->
<application-common-problem :dataList="detailInfoObj" id="common-problem" class="scrollBox"> <application-common-problem
</application-common-problem> :dataList="detailInfoObj"
id="common-problem"
class="scrollBox"
></application-common-problem>
<home-footer></home-footer> <home-footer></home-footer>
</div> </div>
</template> </template>
<script setup> <script setup>
import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue' import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue'
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle' import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题 import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题
import HomeFooter from '@/views/newHome/components/Footer' import HomeFooter from '@/views/newHome/components/Footer'
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { getIntegrationDetail } from '@/api/home' import { getIntegrationDetail } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
import { message } from 'ant-design-vue'
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id) && document.querySelector('#' + id).offsetTop - 50; let top =
document.querySelector('#' + id) &&
document.querySelector('#' + id).offsetTop - 50
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
const navList = ref([ const navList = ref([
{ {
name: '组合能力', name: '组合能力',
key: 'integration-combination-ability', key: 'integration-combination-ability',
@ -105,11 +128,11 @@ const navList = ref([
name: '常见问题', name: '常见问题',
key: 'common-problem', key: 'common-problem',
}, },
]) ])
const selectNow = ref('integration-combination-ability') const selectNow = ref('integration-combination-ability')
const useWayShowList = ref([ const useWayShowList = ref([
{ {
title: '归属部门', title: '归属部门',
info: { info: {
@ -124,25 +147,25 @@ const useWayShowList = ref([
providerMobile: '联系人电话', providerMobile: '联系人电话',
}, },
}, },
]) ])
const combineList = ref([ const combineList = ref([
{ {
title: '基础设施', title: '基础设施',
list: [] list: [],
}, },
{ {
title: '组件服务', title: '组件服务',
list: [] list: [],
}, },
{ {
title: '数据资源', title: '数据资源',
list: [] list: [],
}, },
]) ])
const detailInfoObj = ref({}) const detailInfoObj = ref({})
onMounted(() => { onMounted(() => {
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
scrollTop.value = scrollTop.value =
@ -166,16 +189,17 @@ onMounted(() => {
} }
} }
}) })
}) })
const selectNav = (key) => { const selectNav = (key) => {
selectNow.value = key selectNow.value = key
mybus.emit('flyToView', selectNow.value) mybus.emit('flyToView', selectNow.value)
} }
// 融合服务--详情 // 融合服务--详情
const getIntegrationServicesDeatil = (id) => { const getIntegrationServicesDeatil = (id) => {
getIntegrationDetail(id).then(res => { getIntegrationDetail(id).then(
(res) => {
if (res.data.code !== 0) { if (res.data.code !== 0) {
return message.error(res.data.msg) return message.error(res.data.msg)
} }
@ -184,32 +208,42 @@ const getIntegrationServicesDeatil = (id) => {
let fuseAttrList = res.data.data.fuseAttrList || [] let fuseAttrList = res.data.data.fuseAttrList || []
// 融合关系 // 融合关系
let fuseResourceList = res.data.data.fuseResourceList || [] let fuseResourceList = res.data.data.fuseResourceList || []
let questionValue = fuseAttrList.find(v => v.attrType === '常见问题') || {} let questionValue =
fuseAttrList.find((v) => v.attrType === '常见问题') || {}
let questionObj = { let questionObj = {
attrType: '常见问题', attrType: '常见问题',
attrValue: questionValue.attrValue || "[]" attrValue: questionValue.attrValue || '[]',
} }
let areaObj = { let areaObj = {
attrType: '应用领域', attrType: '应用领域',
attrValue: detailInfoObj.value.applicationArea attrValue: detailInfoObj.value.applicationArea,
} }
combineList.value.map(item => { combineList.value.map((item) => {
let arr = (fuseResourceList.filter(v => v.resource && v.resource.type == item.title) || []).map(d => d.resource.name) let arr = (
item.list = arr; fuseResourceList.filter(
(v) => v.resource && v.resource.type == item.title
) || []
).map((d) => d.resource.name)
item.list = arr
return item return item
}) })
detailInfoObj.value.infoList = [] detailInfoObj.value.infoList = []
detailInfoObj.value.infoList.push(questionObj) detailInfoObj.value.infoList.push(questionObj)
detailInfoObj.value.infoList.push(areaObj) detailInfoObj.value.infoList.push(areaObj)
}, err => { },
(err) => {
message.error(err) message.error(err)
}) }
} )
getIntegrationServicesDeatil(id) }
getIntegrationServicesDeatil(id)
function handleOpenUrl(type) { function handleOpenUrl(type) {
let obj = (detailInfoObj.value.fuseAttrList || []).find(v => v.attrType == type) || {}; let obj =
let url = obj.attrValue || ''; (detailInfoObj.value.fuseAttrList || []).find(
(v) => v.attrType == type
) || {}
let url = obj.attrValue || ''
if (!obj.attrValue) { if (!obj.attrValue) {
return message.error('错误的文档链接地址！') return message.error('错误的文档链接地址！')
} }
@ -218,37 +252,36 @@ function handleOpenUrl(type) {
'hisense_office/onlinePreview?url=' + 'hisense_office/onlinePreview?url=' +
btoa(encodeURI(url)) btoa(encodeURI(url))
) )
} }
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.flex-row-between { .flex-row-between {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
} }
.flex-row-start { .flex-row-start {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
} }
.flex-row-center { .flex-row-center {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.IntegrationServicesDetails {
.IntegrationServicesDetails {
.fixed { .fixed {
position: fixed !important; position: fixed !important;
z-index: 2000; z-index: 2000;
@ -256,7 +289,7 @@ onBeforeUnmount(() => {
left: 0; left: 0;
} }
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
@ -294,9 +327,9 @@ onBeforeUnmount(() => {
} }
} }
} }
} }
.use-way { .use-way {
padding: 0.8rem 0; padding: 0.8rem 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -306,8 +339,6 @@ onBeforeUnmount(() => {
margin-bottom: 0.3rem; margin-bottom: 0.3rem;
} }
.left { .left {
.btn { .btn {
padding: 10px 20px; padding: 10px 20px;
@ -341,9 +372,11 @@ onBeforeUnmount(() => {
height: 1.5rem; height: 1.5rem;
width: 6.2rem; width: 6.2rem;
border-radius: 0.2rem; border-radius: 0.2rem;
background: linear-gradient(to right, background: linear-gradient(
to right,
rgba(113, 132, 252, 0.4), rgba(113, 132, 252, 0.4),
rgba(148, 163, 252, 0.4)); rgba(148, 163, 252, 0.4)
);
padding: 0 0.3rem; padding: 0 0.3rem;
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -374,9 +407,9 @@ onBeforeUnmount(() => {
} }
} }
} }
} }
.combination-ability { .combination-ability {
padding: 0.8rem 0; padding: 0.8rem 0;
background: rgb(247, 248, 250); background: rgb(247, 248, 250);
@ -411,10 +444,9 @@ onBeforeUnmount(() => {
color: #212121; color: #212121;
text-align: center; text-align: center;
padding: 0.2rem 0; padding: 0.2rem 0;
font-size: .22rem; font-size: 0.22rem;
text-align: center; text-align: center;
} }
} }
.name-box { .name-box {
@ -445,6 +477,5 @@ onBeforeUnmount(() => {
width: 50%; width: 50%;
box-sizing: border-box; box-sizing: border-box;
} }
}
}
</style> </style>

2
front/src/views/instructionManual/components/abilityDocTree.vue
View File

@ -56,7 +56,7 @@
clickData: { clickData: {
type: Object, type: Object,
default: () => { default: () => {
title: '' ''
}, },
}, },
}) })

133
front/src/views/instructionManual/index.vue
View File

@ -4,21 +4,40 @@
<div id="container" class="content-menu"> <div id="container" class="content-menu">
<div class="rela"> <div class="rela">
<div class="left"> <div class="left">
<div class="first-title-text" v-for="(data, i) in titleList" :key="i" @click="changeName(data)" <div
:style="{ color: data.name === titleData.name ? '#0058e1' : '' }"> class="first-title-text"
v-for="(data, i) in titleList"
:key="i"
@click="changeName(data)"
:style="{ color: data.name === titleData.name ? '#0058e1' : '' }"
>
<div class="img" :class="data.className"></div> <div class="img" :class="data.className"></div>
{{ data.name }} {{ data.name }}
</div> </div>
<abilityDocTree :dataList="treeArray" @treeClick="treeClick" :clickData="clickData"></abilityDocTree> <abilityDocTree
:dataList="treeArray"
@treeClick="treeClick"
:clickData="clickData"
></abilityDocTree>
</div> </div>
<div class="right"> <div class="right">
<div class="new-menu-box" style="height: 100%" v-if="titleData.name === '新手指引'"> <div
class="new-menu-box"
style="height: 100%"
v-if="titleData.name === '新手指引'"
>
<!-- 新手指引 --> <!-- 新手指引 -->
<a-empty description="新手指引" /> <a-empty description="新手指引" />
</div> </div>
<div v-else style="height:100%"> <div v-else style="height: 100%">
<iframe name="iframeName" width="1000" height="100%" id="iframeId" :frameborder="0" <iframe
:src="doc_base_url + clickData.doc"></iframe> name="iframeName"
width="1000"
height="100%"
id="iframeId"
:frameborder="0"
:src="doc_base_url + clickData.doc"
></iframe>
</div> </div>
</div> </div>
</div> </div>
@ -26,14 +45,14 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import HomeHeader from '@/views/home/components/header' import HomeHeader from '@/views/home/components/header'
import abilityDocTree from './components/abilityDocTree' import abilityDocTree from './components/abilityDocTree'
import { ref, reactive, onMounted, nextTick, watch } from 'vue' import { ref, onMounted } from 'vue'
import { Empty, message } from 'ant-design-vue' import { message } from 'ant-design-vue'
import { getDevelopDocTree } from '@/api/home' import { getDevelopDocTree } from '@/api/home'
import flatten from '@turf/flatten' // import flatten from '@turf/flatten'
const titleList = ref([ const titleList = ref([
{ {
name: '新手指引', name: '新手指引',
className: 'newGuide', className: 'newGuide',
@ -42,21 +61,21 @@ const titleList = ref([
name: '技术文档', name: '技术文档',
className: 'doc', className: 'doc',
}, },
]) ])
const titleData = ref(titleList.value[0]) const titleData = ref(titleList.value[0])
const clickData = ref({}) const clickData = ref({})
const treeArray = ref([]) const treeArray = ref([])
const treeArrayCopy = ref([]) const treeArrayCopy = ref([])
let typeList = ['组件服务', '应用资源', '基础设施', '数据资源', '知识库'] let typeList = ['组件服务', '应用资源', '基础设施', '数据资源', '知识库']
let doc_base_url = ref(window.SITE_CONFIG['frontUrl']) let doc_base_url = ref(window.SITE_CONFIG['frontUrl'])
const treeClick = (item) => { const treeClick = (item) => {
clickData.value = item clickData.value = item
console.log('clickData------------>', item) console.log('clickData------------>', item)
titleData.value = titleList.value[1] titleData.value = titleList.value[1]
} }
const getTreeData = () => { const getTreeData = () => {
getDevelopDocTree({}) getDevelopDocTree({})
.then((res) => { .then((res) => {
console.log('res------文档树------>', res) console.log('res------文档树------>', res)
@ -69,9 +88,9 @@ const getTreeData = () => {
.catch((err) => { .catch((err) => {
message.error(err) message.error(err)
}) })
} }
const changeName = (item) => { const changeName = (item) => {
titleData.value = item titleData.value = item
if (item.name == '新手指引') { if (item.name == '新手指引') {
clickData.value = {} clickData.value = {}
@ -96,9 +115,9 @@ const changeName = (item) => {
getFirstData(treeArrayCopy.value[0] || {}) getFirstData(treeArrayCopy.value[0] || {})
} }
} }
} }
const formData = (children = [], dataItem) => { const formData = (children = [], dataItem) => {
children.map((item, index) => { children.map((item, index) => {
let _obj = Object.assign({}, item, { let _obj = Object.assign({}, item, {
title: item.title, title: item.title,
@ -114,28 +133,28 @@ const formData = (children = [], dataItem) => {
} }
dataItem.children.push(_obj) dataItem.children.push(_obj)
}) })
} }
const getFirstData = (firstObj = {}) => { const getFirstData = (firstObj = {}) => {
if (firstObj && firstObj.children && firstObj.children.length > 0) { if (firstObj && firstObj.children && firstObj.children.length > 0) {
getFirstData(firstObj.children[0]) getFirstData(firstObj.children[0])
} else { } else {
clickData.value = firstObj clickData.value = firstObj
} }
} }
onMounted(() => { onMounted(() => {
getTreeData() getTreeData()
}) })
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.menu-box { .menu-box {
// overflow: hidden; // overflow: hidden;
height: 100%; height: 100%;
} }
.first-title-text { .first-title-text {
cursor: pointer; cursor: pointer;
font-size: 18px; font-size: 18px;
color: #333; color: #333;
@ -146,9 +165,9 @@ onMounted(() => {
&:hover { &:hover {
color: #0058e1; color: #0058e1;
} }
} }
.content-menu { .content-menu {
width: 1240px; width: 1240px;
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
@ -161,9 +180,9 @@ onMounted(() => {
transform: translateX(-50%); transform: translateX(-50%);
top: 0.6rem; top: 0.6rem;
top: 0; top: 0;
} }
.left { .left {
width: 240px; width: 240px;
padding: 20px; padding: 20px;
height: 600px; height: 600px;
@ -173,52 +192,52 @@ onMounted(() => {
position: absolute; position: absolute;
top: 10px; top: 10px;
left: 0; left: 0;
} }
.right { .right {
width: 870px; width: 870px;
height: calc(100% - 20px); height: calc(100% - 20px);
position: absolute; position: absolute;
top: 10px; top: 10px;
left: 260px; left: 260px;
} }
.sidebar { .sidebar {
right: 0 !important; right: 0 !important;
} }
.content { .content {
right: 16rem !important; right: 16rem !important;
left: 0 !important; left: 0 !important;
} }
.img { .img {
height: 20px; height: 20px;
width: 20px; width: 20px;
margin-right: 8px; margin-right: 8px;
} }
.doc { .doc {
background: url('~@/assets/capabilityCloud/doc.png') no-repeat; background: url('~@/assets/capabilityCloud/doc.png') no-repeat;
background-size: 100%; background-size: 100%;
} }
.newGuide { .newGuide {
background: url('~@/assets/capabilityCloud/newGuide.png') no-repeat; background: url('~@/assets/capabilityCloud/newGuide.png') no-repeat;
background-size: 100%; background-size: 100%;
} }
.new-menu-box { .new-menu-box {
height: 100%; height: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.rela { .rela {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
} }
</style> </style>

2
front/src/views/newHome/components/Navigation2.vue
View File

@ -100,7 +100,7 @@
query: { query: {
select: type, select: type,
tecHnosphere: '', tecHnosphere: '',
appLiCation: '' appLiCation: '',
}, },
}) })
} }

4
front/src/views/newHome/components/PopularAbility.vue
View File

@ -153,7 +153,7 @@
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.popular-ability { .popular-ability {
height: 6.8rem; height: 6.8rem;
background: url('~@/assets/newHome/popular-bg.png') no-repeat; background: url('~@/assets/newHome/popular-bg.png') no-repeat;
background-size: 100%; background-size: 100%;
@ -343,5 +343,5 @@
background: rgba(0, 88, 225, 0.1); background: rgba(0, 88, 225, 0.1);
} }
} }
} }
</style> </style>

6
front/src/views/personalCenter/components/Collection.vue
View File

@ -237,7 +237,7 @@
resourceId: val.resourceId, resourceId: val.resourceId,
createDate: val.createDate, createDate: val.createDate,
updateDate: val.updateDate, updateDate: val.updateDate,
...getObj(val, val.resourceDTO ? 'resourceDTO' : 'fuseDTO') ...getObj(val, val.resourceDTO ? 'resourceDTO' : 'fuseDTO'),
} }
if (checkedList.value.indexOf(val.resourceId) == -1) { if (checkedList.value.indexOf(val.resourceId) == -1) {
checkAll.value = false checkAll.value = false
@ -250,8 +250,8 @@
} }
function getObj(val, typeStr) { function getObj(val, typeStr) {
let typeObj = val[typeStr] || {}; let typeObj = val[typeStr] || {}
console.log('typeObj------------>', typeObj); console.log('typeObj------------>', typeObj)
return { return {
name: typeObj.name, name: typeObj.name,
type: typeObj.type, type: typeObj.type,

174
front/src/views/personalCenter/components/addApplication.vue
View File

@ -9,38 +9,83 @@
<div class="form-container"> <div class="form-container">
<div v-if="applySuccess"> <div v-if="applySuccess">
<div class="title">申请人信息</div> <div class="title">申请人信息</div>
<a-form ref="formRef" :model="formName" name="basic" :label-col="{ style: { width: '106px' } }" <a-form
:wrapper-col="{ style: { width: '230px' } }" labelAlign="left" autocomplete="off"> ref="formRef"
:model="formName"
name="basic"
:label-col="{ style: { width: '106px' } }"
:wrapper-col="{ style: { width: '230px' } }"
labelAlign="left"
autocomplete="off"
>
<div class="base-info"> <div class="base-info">
<a-form-item label="申请人" name="applyUserName" :rules="[{ required: true, message: '请输入申请人' }]"> <a-form-item
<a-input placeholder="请输入申请人" v-model:value="formName.applyUserName" /> label="申请人"
name="applyUserName"
:rules="[{ required: true, message: '请输入申请人' }]"
>
<a-input
placeholder="请输入申请人"
v-model:value="formName.applyUserName"
/>
</a-form-item> </a-form-item>
<a-form-item style="margin: 0 22px" label="申请人电话" name="applyUserPhone" :rules="[ <a-form-item
style="margin: 0 22px"
label="申请人电话"
name="applyUserPhone"
:rules="[
{ {
required: true, required: true,
pattern: /^1[3456789]\d{9}$/, pattern: /^1[3456789]\d{9}$/,
message: '请输入正确的电话号码', message: '请输入正确的电话号码',
}, },
]"> ]"
<a-input placeholder="请输入申请人电话" v-model:value="formName.applyUserPhone" /> >
<a-input
placeholder="请输入申请人电话"
v-model:value="formName.applyUserPhone"
/>
</a-form-item> </a-form-item>
<a-form-item label="申请单位" name="applyUserDeptName" :rules="[{ required: true, message: '请输入申请单位' }]"> <a-form-item
<a-input placeholder="请输入申请单位" v-model:value="formName.applyUserDeptName" /> label="申请单位"
name="applyUserDeptName"
:rules="[{ required: true, message: '请输入申请单位' }]"
>
<a-input
placeholder="请输入申请单位"
v-model:value="formName.applyUserDeptName"
/>
</a-form-item> </a-form-item>
</div> </div>
<div class="title">需求信息</div> <div class="title">需求信息</div>
<a-form-item style="margin-bottom: 10px" label="需求标题" name="demandSubject" <a-form-item
:rules="[{ required: true, message: '请输入需求标题' }]"> style="margin-bottom: 10px"
<a-input style="width: 350px" v-model:value="formName.demandSubject" /> label="需求标题"
name="demandSubject"
:rules="[{ required: true, message: '请输入需求标题' }]"
>
<a-input
style="width: 350px"
v-model:value="formName.demandSubject"
/>
</a-form-item> </a-form-item>
<a-form-item style="margin-bottom: 10px" label="需求类型" name="detailsType" <a-form-item
:rules="[{ required: true, message: '请选择需求类型' }]"> style="margin-bottom: 10px"
<a-select ref="select" v-model:value="formName.detailsType" @focus="focus" style="width: 200px"> label="需求类型"
name="detailsType"
:rules="[{ required: true, message: '请选择需求类型' }]"
>
<a-select
ref="select"
v-model:value="formName.detailsType"
@focus="focus"
style="width: 200px"
>
<a-select-option value="基础设施">基础设施</a-select-option> <a-select-option value="基础设施">基础设施</a-select-option>
<a-select-option value="数据资源">数据资源</a-select-option> <a-select-option value="数据资源">数据资源</a-select-option>
<a-select-option value="组件服务">组件服务</a-select-option> <a-select-option value="组件服务">组件服务</a-select-option>
@ -49,14 +94,26 @@
</a-select> </a-select>
</a-form-item> </a-form-item>
<a-form-item label="应用领域" name="detailsField" style="width: 350px" <a-form-item
:rules="[{ required: true, message: '请输入应用领域' }]"> label="应用领域"
<a-input placeholder="请输入应用领域" v-model:value="formName.detailsField" /> name="detailsField"
style="width: 350px"
:rules="[{ required: true, message: '请输入应用领域' }]"
>
<a-input
placeholder="请输入应用领域"
v-model:value="formName.detailsField"
/>
</a-form-item> </a-form-item>
<a-form-item style="margin-bottom: 10px" label="需求描述" name="demandDetails" <a-form-item
:rules="[{ required: true, message: '请输入需求描述' }]"> style="margin-bottom: 10px"
<a-textarea style=" label="需求描述"
name="demandDetails"
:rules="[{ required: true, message: '请输入需求描述' }]"
>
<a-textarea
style="
width: 500px; width: 500px;
height: 150px; height: 150px;
font-size: 16px; font-size: 16px;
@ -66,12 +123,24 @@
border-radius: 6px; border-radius: 6px;
padding: 10px; padding: 10px;
resize: none; resize: none;
" v-model:value="formName.demandDetails" /> "
v-model:value="formName.demandDetails"
/>
</a-form-item> </a-form-item>
<a-form-item style="color: #666; font-size: 16px" label="附件上传" name="applyDoc"> <a-form-item
<a-upload v-model:file-list="fileList" name="file" :action="upLoadUrl" :headers="headers" style="color: #666; font-size: 16px"
@change="handleChange"> label="附件上传"
<a-button style=" name="applyDoc"
>
<a-upload
v-model:file-list="fileList"
name="file"
:action="upLoadUrl"
:headers="headers"
@change="handleChange"
>
<a-button
style="
width: 100px; width: 100px;
height: 30px; height: 30px;
margin-right: 10px; margin-right: 10px;
@ -82,7 +151,8 @@
border: 1px solid #bbd3ef; border: 1px solid #bbd3ef;
padding: 0; padding: 0;
text-align: center; text-align: center;
"> "
>
<upload-outlined></upload-outlined> <upload-outlined></upload-outlined>
文件上传 文件上传
</a-button> </a-button>
@ -93,7 +163,8 @@
</a-form-item> </a-form-item>
<a-form-item :wrapper-col="{ offset: 8, span: 16 }"> <a-form-item :wrapper-col="{ offset: 8, span: 16 }">
<a-button style=" <a-button
style="
width: 80px; width: 80px;
height: 38px; height: 38px;
margin-right: 20px; margin-right: 20px;
@ -104,10 +175,15 @@
border: none; border: none;
padding: 0; padding: 0;
text-align: center; text-align: center;
" type="primary" html-type="cancle" @click="signOut"> "
type="primary"
html-type="cancle"
@click="signOut"
>
退出申请 退出申请
</a-button> </a-button>
<a-button style=" <a-button
style="
width: 80px; width: 80px;
height: 38px; height: 38px;
background: #0087ff; background: #0087ff;
@ -117,7 +193,11 @@
border: none; border: none;
padding: 0; padding: 0;
text-align: center; text-align: center;
" type="primary" html-type="submit" @click="processStartHandle()"> "
type="primary"
html-type="submit"
@click="processStartHandle()"
>
提交申请 提交申请
</a-button> </a-button>
</a-form-item> </a-form-item>
@ -140,20 +220,20 @@
</template> </template>
<script> <script>
import HomeHeader from '@/views/home/components/header' import HomeHeader from '@/views/home/components/header'
import { reactive, ref } from 'vue' import { reactive, ref } from 'vue'
import { message } from 'ant-design-vue' import { message } from 'ant-design-vue'
// import { UploadOutlined } from '@ant-design/icons-vue' // import { UploadOutlined } from '@ant-design/icons-vue'
import { getUser, getUserInfo, relaunch } from '@/api/home' import { getUser, getUserInfo, relaunch } from '@/api/home'
import { import {
demandApply, demandApply,
getDemandForm, getDemandForm,
updateDemandForm, updateDemandForm,
} from '@/api/personalCenter' } from '@/api/personalCenter'
// import { baseURL } from '@/config' // import { baseURL } from '@/config'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
export default { export default {
name: '', name: '',
props: {}, props: {},
components: { components: {
@ -271,11 +351,11 @@ export default {
// baseURL, // baseURL,
} }
}, },
} }
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
#apply-container { #apply-container {
background-color: #f5f8fc; background-color: #f5f8fc;
height: 100%; height: 100%;
width: 100%; width: 100%;
@ -348,11 +428,11 @@ export default {
font-weight: bold; font-weight: bold;
color: #000; color: #000;
} }
} }
</style> </style>
<style> <style>
body, body,
html { html {
height: unset; height: unset;
} }
</style> </style>