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

Merge branch 'hi-ucs-dev' into release

This commit is contained in:
wuhongjian 2022-07-06 18:45:20 +08:00
parent f8588795c4 9cc8accbde
commit 695aa6867d
75 changed files with 4999 additions and 4195 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

185
back/src/views/modules/ability/bsabilityai.vue
View File

@ -55,12 +55,16 @@
width="50"
></el-table-column>
<af-table-column
:show-overflow-tooltip="true"
width="280"
prop="name"
label="组件名称"
header-align="center"
align="center"
></af-table-column>
<af-table-column
:show-overflow-tooltip="true"
width="300"
v-for="(item, index) in dataList[0].infoList"
:key="index"
:label="item.attrType"
@ -126,32 +130,32 @@
</template>
<script>
import mixinViewModule from "@/mixins/view-module";
import AddOrUpdate from "./bsabilityai-add-or-update";
import dictionaries from "@/utils/dictionaries";
import qs from "qs";
import RelateApplication from "./bsabilityai-relate-application.vue"
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from './bsabilityai-add-or-update'
import dictionaries from '@/utils/dictionaries'
import qs from 'qs'
import RelateApplication from './bsabilityai-relate-application.vue'
export default {
mixins: [mixinViewModule],
data() {
data () {
return {
mixinViewModuleOptions: {
getDataListURL: "/resource/page",
getDataListURL: '/resource/page',
getDataListIsPage: true,
exportURL: "/ability/bsabilityai/export",
deleteURL: "/resource/delete",
deleteIsBatch: true,
exportURL: '/ability/bsabilityai/export',
deleteURL: '/resource/delete',
deleteIsBatch: true
},
disabled: false,
sceneArr: dictionaries.sceneArr,
fieldArr: dictionaries.fieldArr,
shareFormArr: dictionaries.shareFormArr,
dataForm: {
name: "",
creator: "",
name: '',
creator: '',
delFlag: 0,
selectType: 0,
type: "组件服务",
type: '组件服务'
},
qp: false,
// 关联应用弹窗
@ -161,190 +165,193 @@ export default {
responseData: {},
linkType: ''
}
};
}
},
watch: {},
components: {
AddOrUpdate,
RelateApplication
},
created() {
this.dataForm.name = "";
this.dataForm.type = "组件服务";
created () {
this.dataForm.name = ''
this.dataForm.type = '组件服务'
},
mounted() {
window.addEventListener("resize", this.a);
this.fullScreen();
mounted () {
window.addEventListener('resize', this.a)
this.fullScreen()
},
methods: {
reset() {
reset () {
this.$http
.get(
this.mixinViewModuleOptions.getDataListURL +
"?" +
'?' +
qs.stringify({
// order: this.order,
// orderField: this.orderField,
// type: '组件服务',
page: 1,
limit: 10,
creator: "",
creator: '',
selectType: 0,
delFlag: 0,
type: "组件服务",
name: "",
type: '组件服务',
name: ''
})
)
.then(({ data: res }) => {
this.dataForm.name = "";
this.dataForm.name = ''
if (res.code !== 0) {
this.dataList = [];
this.total = 0;
return this.$message.error(res.msg);
this.dataList = []
this.total = 0
return this.$message.error(res.msg)
}
this.dataList = this.mixinViewModuleOptions.getDataListIsPage
? res.data.list
: res.data;
: res.data
this.total = this.mixinViewModuleOptions.getDataListIsPage
? res.data.total
: 0;
: 0
if (this.mixinViewModuleOptions.requestCallback) {
this.mixinViewModuleOptions.requestCallback(res.data);
this.mixinViewModuleOptions.requestCallback(res.data)
}
this.dataListLoading = false;
this.dataListLoading = false
})
.catch(() => {
this.dataListLoading = false;
});
this.dataListLoading = false
})
},
findValue(list, type) {
const found = list.find((item) => item.attrType === type);
findValue (list, type) {
const found = list.find((item) => item.attrType === type)
if (found) {
return found.attrValue;
return found.attrValue
} else {
return "暂无数据";
return '暂无数据'
}
},
showDetail(val) {
showDetail (val) {
// this.addOrUpdateHandle(id)
this.addOrUpdateVisible = true;
this.disabled = false;
console.log("显示数据=============》", val);
this.addOrUpdateVisible = true
this.disabled = false
console.log('显示数据=============》', val)
this.$nextTick(() => {
this.$refs.addOrUpdate.UpdateState = false;
this.$refs.addOrUpdate.dataFormShowDetails = val;
this.$refs.addOrUpdate.init();
});
this.disabled = true;
this.$refs.addOrUpdate.UpdateState = false
this.$refs.addOrUpdate.dataFormShowDetails = val
this.$refs.addOrUpdate.init()
})
this.disabled = true
},
showDocument(val) {
console.log(val);
showDocument (val) {
console.log(val)
window.open(
window.SITE_CONFIG.frontUrl + "?id=" + val.id + "&&type=" + val.type,
"_blank"
);
window.SITE_CONFIG.frontUrl + '?id=' + val.id + '&&type=' + val.type,
'_blank'
)
},
getDataList2(names) {
getDataList2 (names) {
if (names != null) {
this.$http
.get(
this.mixinViewModuleOptions.getDataListURL +
"?" +
'?' +
qs.stringify({
// order: this.order,
// orderField: this.orderField,
// type: '组件服务',
pageNum: 1,
pageSize: this.limit,
type: "组件服务",
creator: "",
type: '组件服务',
creator: '',
selectType: 0,
delFlag: 0,
name: names,
name: names
})
)
.then(({ data: res }) => {
console.log("res", res);
console.log('res', res)
if (res.code !== 0) {
this.dataList = [];
this.total = 0;
return this.$message.error(res.msg);
this.dataList = []
this.total = 0
return this.$message.error(res.msg)
}
if (res.data.list.length !== 0) {
this.dataList = res.data.list;
this.dataList = res.data.list
this.total = this.mixinViewModuleOptions.getDataListIsPage
? res.data.total
: 0;
: 0
if (this.mixinViewModuleOptions.requestCallback) {
this.mixinViewModuleOptions.requestCallback(res.data);
this.mixinViewModuleOptions.requestCallback(res.data)
}
this.dataListLoading = false;
this.dataListLoading = false
} else {
this.$message.error("未查询到相关信息");
this.reset();
this.$message.error('未查询到相关信息')
this.reset()
}
})
.catch(() => {
this.dataListLoading = false;
});
this.dataListLoading = false
})
} else {
this.$message.error("查询信息不能为空");
this.$message.error('查询信息不能为空')
}
},
fullScreen() {
fullScreen () {
if (window.outerHeight === screen.availHeight) {
if (window.outerWidth === screen.availWidth) {
console.log(
"全屏1",
'全屏1',
window.outerHeight,
screen.availHeight,
window.outerWidth,
screen.availWidth
);
this.qp = false;
)
this.qp = false
} else {
console.log(
"不是全屏2",
'不是全屏2',
window.outerHeight,
screen.availHeight,
window.outerWidth,
screen.availWidth
);
this.qp = true;
)
this.qp = true
}
} else {
console.log(
"不是全屏3",
'不是全屏3',
window.outerHeight,
screen.availHeight,
window.outerWidth,
screen.availWidth
);
this.qp = true;
)
this.qp = true
}
},
// 点击关联应用按钮
showRelateApplication(row){
showRelateApplication (row) {
this.$http.get(`dataResourceRel/queryApplicationRelByResourceId?referenceId=${row.id}`).then(({ data: res }) => {
if( res && res.data ) {
this.relateApplicationVisible = true;
if (res && res.data) {
this.relateApplicationVisible = true
this.relateInfo = {
id: row.id,
responseData: res.data,
linkType: '2'
};
}
}
}).catch(() => { })
},
// 是否展示关联应用弹窗
handleIsShowRelatePopup(type) {
this.relateApplicationVisible = type;
handleIsShowRelatePopup (type) {
this.relateApplicationVisible = type
}
},
};
}
}
</script>
<style lang="scss" scoped>
.el-tooltip__popper {
max-width: 50%;
}
::v-deep .el-table .cell{
width: 200px;
}
</style>

6
back/src/views/modules/ability/bsdataresources.vue
View File

@ -84,7 +84,11 @@ export default {
methods: {
// 重置
resetDataList () {
this.dataForm = this.noDataForm
this.dataForm = {
orderId: '',
status: '',
userId: ''
},
this.page = 1 // 当前页码
this.query()
},

27
back/src/views/modules/abilityStatistics/applicationResources.vue
View File

@ -48,7 +48,7 @@
</div>
<div class='container-body8'>
<span style='font-size:18px;color;#000000;'>应用领域分布情况</span>
<div id="main8" style="width: 300px;height:200px;"></div>
<div id="main8" style="width: 300px;height:200px;margin-left:-20px;"></div>
</div>
<div class='container-body9'>
<span style='font-size:18px;color;#000000;'>应用状态分布情况</span>
@ -114,8 +114,9 @@ export default {
getDistributedList () {
this.$http.get('/census/center/v3/assemblerUseProjectInfo/' ,{
params : {
keyId:'1522550195034857476'
// this.tableId
id:
// '1522550195034857476'
this.tableId
}
}).then(res => {
let arry=[]
@ -147,8 +148,8 @@ export default {
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.useNum,
name:item.name
value:item.appNum,
name:item.attr_value
}
this.data3.push(single.name)
this.data4.push(single.value)
@ -377,7 +378,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
@ -599,7 +600,7 @@ export default {
},
series: [
{
data: [5, 5, 5, 5, 5, 5],
data: [1, 1, 1, 1, 1, 1],
type: 'bar',
barWidth: 14,
stack: '1',
@ -654,7 +655,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
@ -725,7 +726,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
@ -804,7 +805,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
@ -822,9 +823,9 @@ export default {
a: {
// 设置文字、数学、英语这一列的样式
width: 80,
color: "#000000",
color: "#666666",
fontSize: 12,
fontWeight: "bolder",
// fontWeight: "bolder",
},
b: {
// 设置10分、20分、30分这一列的样式
@ -899,7 +900,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}

12
back/src/views/modules/abilityStatistics/componentServices.vue
View File

@ -200,7 +200,7 @@ export default {
this.$http.get('/census/center/v3/assemblerCaredTopInfo' ,{
params : {
id:this.tableId,
resourceType:"应用资源"
resourceType:"组件服务"
// pageNo: pageNo || 1,
// pageSize: 20
}
@ -231,7 +231,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
@ -295,7 +295,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
@ -361,7 +361,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
@ -377,9 +377,9 @@ export default {
a: {
// 设置文字、数学、英语这一列的样式
width: 100,
color: "#000000",
color: "#666666",
fontSize: 12,
fontWeight: "bolder",
// fontWeight: "bolder",
},
b: {
// 设置10分、20分、30分这一列的样式

21
back/src/views/modules/abilityStatistics/componentUsed.vue
View File

@ -17,7 +17,7 @@
</div>
<div class='container-body3'>
<span style='font-size:18px;color;#000000;'>使用组件应用领域分布情况</span>
<div id="main8" style="width: 400px;height:200px;"></div>
<div id="main3" style="width: 400px;height:200px;"></div>
</div>
<div class='container-body4'>
<div style='margin-bottom:30px'>
@ -36,7 +36,7 @@
</div>
<div class='container-body5'>
<div style='margin-bottom:30px'>
<span style='font-size:18px;color;#000000;'>使用组件评分Top5</span>
<span style='font-size:18px;color;#000000;'>使用组件评分</span>
<img src="@/assets/img/TOP5.png" style='margin-left:10px'>
</div>
<div v-for="(item,index) in applicationList" :key='index' >
@ -174,9 +174,7 @@ export default {
value:item.total,
name:item.type
}
const newList=[]
this.data3.push(single)
// this.data2=newList
this.myEcharts3()
})
})
@ -231,7 +229,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
@ -295,7 +293,7 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
@ -361,13 +359,14 @@ export default {
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
total += Number(data[i].value);
if (data[i].name == name) {
tarValue = data[i].value;
}
}
var v = tarValue;
// var v = tarValue;
var p = Math.round(((tarValue / total) * 100));
console.log('@@@@', tarValue, total)
return `{a|${name}} {b|${p}%}`;
},
itemStyle:{},
@ -428,7 +427,7 @@ export default {
option && myChart.setOption(option);
},
backBtn(){
this.$emit('closeChild')
this.$emit('closeChild2')
}
}
}
@ -541,9 +540,13 @@ export default {
position:absolute;
display: flex;
margin-left:90px;
width:200px;
margin-top:5px;
color:#333333;
font-size: 16px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.count-style{
position:absolute;

12
back/src/views/modules/abilityStatistics/index.vue
View File

@ -96,7 +96,7 @@
min-width="100%">
</el-table-column>
<el-table-column v-if="this.departmentId===2"
prop="resourceCarNum"
prop="resourceCallNum"
label="申请总数"
min-width="100%">
</el-table-column>
@ -121,7 +121,7 @@
</div>
</el-card>
</div>
<component-used v-if='UsedIsShow' :tableId='tableId' :fatherId='fatherId' @closeChild='closeChild'></component-used>
<component-used v-if='UsedIsShow' :tableId='tableId' :fatherId='fatherId' @closeChild2='closeChild2'></component-used>
<component-services v-if='servicesIsShow' :tableId='tableId' :fatherId='fatherId' @closeChild='closeChild'></component-services>
<application-resources v-if='resourcesIsShow' :tableId='tableId' :fatherId='fatherId' @closeApplication='closeApplication'></application-resources>
</div>
@ -362,10 +362,18 @@ export default {
closeChild(){
this.homeIsShow=true
this.servicesIsShow=false
this. handleCurrentChange(1)
},
closeChild2(){
this.homeIsShow=true
this.UsedIsShow=false
this. handleCurrentChange(1)
},
closeApplication(){
this.homeIsShow=true
this.resourcesIsShow=false
this. handleCurrentChange(1)
}
},

3
back/src/views/modules/myAgent/demo/competency-application.vue
View File

@ -2,7 +2,7 @@
* @Author: hisense.liangjunhua
* @Date: 2022-06-29 15:59:51
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-07-01 09:29:57
* @LastEditTime: 2022-07-04 16:17:22
* @Description: 告诉大家这是什么
-->
<!-- 流程业务表单 -->
@ -157,6 +157,7 @@ export default {
})
},
downloadFile2 (url) {
console.log(window.SITE_CONFIG.previewUrl)
window.open(
window.SITE_CONFIG.previewUrl +
'hisense_office/onlinePreview?url=' +

4
front/package.json
View File

@ -1,5 +1,5 @@
{
"name": "HiIRS",
"name": "HiUCS",
"version": "0.8.0",
"private": true,
"scripts": {
@ -38,6 +38,7 @@
"pinyin-pro": "^3.8.3",
"postprocessing": "^5.3.2",
"remixicon": "^2.5.0",
"swiper": "^8.2.6",
"three": "^0.98.0",
"three.meshline": "^1.1.0",
"vue": "^3.1.4",
@ -70,6 +71,7 @@
"stylus": "^0.54.5",
"stylus-loader": "^3.0.2",
"svg-sprite-loader": "^6.0.9",
"swiper": "^8.0.0",
"vab-config": "0.0.8",
"webpackbar": "^5.0.0-3"
},

21
front/public/index.html
View File

@ -2,7 +2,7 @@
* @Author: hisense.wuhongjian
* @Date: 2022-03-29 16:45:25
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-07-04 11:57:44
* @LastEditTime: 2022-07-06 18:44:35
* @Description: 告诉大家这是什么
-->
<!DOCTYPE html>
@ -28,10 +28,11 @@
<!-- 站点配置 -->
<script>
window.SITE_CONFIG = {};
window.SITE_CONFIG['backUrl'] = 'http://15.72.183.90:8001';
window.SITE_CONFIG['previewUrl'] = 'http://15.72.183.90:7008/';
window.SITE_CONFIG['frontUrl'] = 'http://15.72.183.90:7008/document/#/devModelFile/';
window.SITE_CONFIG['apiURL'] = 'http://15.72.183.90:8000/renren-admin';
// window.SITE_CONFIG['backUrl'] = 'http://15.72.183.90:8001';
// window.SITE_CONFIG['previewUrl'] = 'http://15.72.183.90:7008/';
// window.SITE_CONFIG['frontUrl'] = 'http://15.72.183.90:7008/document/#/devModelFile/';
// window.SITE_CONFIG['apiURL'] = 'http://15.72.183.90:8000/renren-admin';
window.SITE_CONFIG['POI_URL'] = 'http://15.72.178.129:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address';
// 包头
// window.SITE_CONFIG['backUrl'] = 'http://10.110.205.1:8001';
// window.SITE_CONFIG['previewUrl'] = 'http://10.110.205.1:8002/';
@ -44,11 +45,11 @@
// window.SITE_CONFIG['frontUrl'] = 'http://10.134.135.9:9796/document/#/devModelFile/';
// window.SITE_CONFIG['apiURL'] = 'http://10.134.135.9:8888/renren-admin';
// 开发
// window.SITE_CONFIG['backUrl'] = 'http://15.2.21.238:9797';
// window.SITE_CONFIG['previewUrl'] = 'http://15.2.21.238:9796/';
// window.SITE_CONFIG['frontUrl'] = 'http://15.2.21.238:9796/document/#/devModelFile/';
// window.SITE_CONFIG['apiURL'] = 'http://15.2.21.238:8888/renren-admin';
window.SITE_CONFIG['POI_URL'] = 'http://15.72.178.129:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address';
window.SITE_CONFIG['backUrl'] = 'http://15.2.21.238:9797';
window.SITE_CONFIG['previewUrl'] = 'http://15.2.21.238:9796/';
window.SITE_CONFIG['frontUrl'] = 'http://15.2.21.238:9796/document/#/devModelFile/';
window.SITE_CONFIG['apiURL'] = 'http://15.2.21.238:8888/renren-admin';
// window.SITE_CONFIG['POI_URL'] = 'http://15.72.178.129:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address';
// 穿透版本
// window.SITE_CONFIG['backUrl'] = 'http://124.222.94.39:9797';
// window.SITE_CONFIG['previewUrl'] = 'http://124.222.94.39:9796/';

9
front/public/leaflet/ersi-leaflet.js
View File

File diff suppressed because one or more lines are too long

16
front/public/static/config/location.js
View File

@ -2,12 +2,12 @@
* @Author: hisense.wuhongjian
* @Date: 2020-07-07 16:03:23
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-07-04 11:56:58
* @LastEditTime: 2022-07-06 18:44:54
* @Description: 数据资源参数配置
*/
const newLocation = 'qingdao'
//const newLocation = 'qingdao'
// const newLocation = 'baotou'
// const newLocation = 'xihaian'
const newLocation = 'xihaian'
// 数据资源数据
const whoShow = {}
@ -61,12 +61,12 @@ if (newLocation === 'qingdao') {
{
name: '基础设施',
key: 'lsjcss',
num: '20135路',
num: '20135个',
},
{
name: '数据资源',
key: 'lsjcss',
num: '857条',
num: '857项',
},
{
name: '应用资源',
@ -78,12 +78,12 @@ if (newLocation === 'qingdao') {
{
name: '基础设施',
key: 'xhajcss',
num: '35282路',
num: '35282个',
},
{
name: '数据资源',
key: 'xhajcss',
num: '11类',
num: '11项',
},
{
name: '应用资源',
@ -162,7 +162,7 @@ else if (newLocation === 'xihaian') {
footerDataList.footerList = {
company: {
left: '青岛西海岸新区大数据发展促进局建设',
right: 'v0.81',
right: 'v0.8.1.5',
},
address: [
{

3
front/public/static/js/rem.js
View File

@ -2,7 +2,7 @@
* @Author: hisense.wuhongjian
* @Date: 2021-06-15 18:50:17
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-10 15:45:52
* @LastEditTime: 2022-07-06 10:54:11
* @Description: 告诉大家这是什么
*/
;(function (doc, win) {
@ -19,6 +19,7 @@
} */
clientWidth > 1920 ? (clientWidth = 1920) : clientWidth
docEl.style.fontSize = clientWidth / 19.2 + 'px'
docEl.style.overflowY = 'auto'
}
if (!doc.addEventListener) return
recalc()

2
front/src/App.vue
View File

@ -28,7 +28,7 @@
@import '~@/vab/styles/vab.less';
#vue-admin-beautiful{
max-width: 1920px;
max-height: 1080px;
// max-height: 1080px;
margin: auto;
height: 100%;
position: relative;

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

@ -199,7 +199,14 @@ export function updateVisits(params) {
params,
})
}
// 保存浏览记录
export function browsingInsert(data) {
return request({
url: '/resourceBrowse/insert',
method: 'post',
data,
})
}
// 最新能力
export function selectNewest(data) {
return request({

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

@ -215,3 +215,19 @@ export function selectResourceListByDept(params) {
params,
})
}
// 获取来源应用列表
export function queryApplicationRelByResourceId(params) {
return request({
url: '/dataResourceRel/queryApplicationRelByResourceId',
method: 'get',
params,
})
}
// 获取关联组件列表
export function queryResourceRelByKeyId(params) {
return request({
url: '/dataResourceRel/queryResourceRelByKeyId',
method: 'get',
params,
})
}

BIN
front/src/assets/newHome/newHome-title-bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 29 KiB

10
front/src/main.js
View File

@ -1,8 +1,8 @@
/*
* @Author: hisense.wuhongjian
* @Date: 2022-03-29 17:48:03
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-10 15:45:34
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-07-05 15:04:47
* @Description: 告诉大家这是什么
*/
import { createApp } from 'vue'
@ -45,3 +45,9 @@ app
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component)
}
router.beforeEach((to, from, next) => {
// console.log('跳转路由=========>', to, from, next)
document.documentElement.scrollTop = 0
document.body.scrollTop = 0
next()
})

142
front/src/views/assignCase/components/AssignCaseDetailPage.vue
View File

@ -2,7 +2,7 @@
* @Author: hisense.zhangfeihu
* @Date: 2022-06-13 10:22:27
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-06-20 18:58:40
* @LastEditTime: 2022-07-05 11:25:25
* @Description: 赋能案例-详情页
-->
<template>
@ -131,19 +131,16 @@
tabName.value = '案例背景'
selectOne(val).then((res) => {
res.data.data.infoList.map((item, index) => {
console.log('res.data.data.infoList', res.data.data.infoList)
if (item.attrType == '图片') {
res.data.data.infoList.splice(index, 1)
}
})
res.data.data.infoList.map((item, index) => {
console.log('res.data.data.infoList', res.data.data.infoList)
if (item.attrType == '应用领域') {
res.data.data.infoList.splice(index, 1)
}
})
dataFrom.value = res.data.data
console.log('dataFrom.value', dataFrom.value)
})
}
//其他案例
@ -165,84 +162,113 @@
}
})
dataList.value = res.data.data.records
console.log('dataList.value', dataList.value)
})
}
//监听路由发生变化
watch(
() => router.currentRoute.value.query.id,
() => {
if (router.currentRoute.value.name == 'AssignCaseDetailPage') {
init()
}
},
{ immediate: true }
)
//tab点击事件
const tabSwitch = (item, index) => {
tabName.value = item.attrType
if (index != 0 && index != 3) {
let top =
document.querySelector(
'#assign-case-detail-page-content-center-card' + index
).offsetTop -
document.querySelector(
'#assign-case-detail-page-content-center-card' + (index - 1)
).offsetHeight
let view = document.getElementById(
'assign-case-detail-page-content-left-border-id'
)
view.style.top =
document.querySelector(
'#assign-case-detail-page-content-center-card' + (index - 1)
).offsetHeight + 'px'
console.log('view.style.top', view.style.top)
330 -
60 * index
document.documentElement.scrollTop = top
document.body.scrollTop = top
} else if (index == 0) {
let top = 0
let view = document.getElementById(
'assign-case-detail-page-content-left-border-id'
)
document.documentElement.scrollTop = top
document.body.scrollTop = top
view.style.top = '490px'
} else if (index == 3) {
let top = document.querySelector(
'#assign-case-detail-page-content-center-card' + index
).offsetTop
let view = document.getElementById(
'assign-case-detail-page-content-left-border-id'
)
document.documentElement.scrollTop = top
document.body.scrollTop = top
view.style.top = '220px'
}
}
onMounted(() => {
init()
// init()
// console.clear()
window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll(
'.assign-case-detail-page-content-center-card'
)
scrollTop.value =
document.documentElement.scrollTop || document.body.scrollTop
for (let i = 0; i < domArr.value.length; i++) {
if (i === 0) {
if (scrollTop.value <= domArr.value[i + 1].offsetTop - 50) {
selectNow.value = domArr.value[i].id
}
} else if (i == domArr.value.length - 1) {
if (scrollTop.value >= domArr.value[i].offsetTop - 50) {
selectNow.value = domArr.value[i].id
}
} else {
let top = document.documentElement.scrollTop
if (
scrollTop.value >= domArr.value[i].offsetTop - 50 &&
scrollTop.value <= domArr.value[i + 1].offsetTop - 50
top <
100 +
document.querySelector(
'#assign-case-detail-page-content-center-card0'
).offsetHeight -
1
) {
selectNow.value = domArr.value[i].id
}
}
tabName.value = '案例背景'
} else if (
top >=
100 +
document.querySelector(
'#assign-case-detail-page-content-center-card0'
).offsetHeight &&
top <
100 +
document.querySelector(
'#assign-case-detail-page-content-center-card0'
).offsetHeight +
document.querySelector(
'#assign-case-detail-page-content-center-card1'
).offsetHeight -
1
) {
tabName.value = '业务挑战'
} else if (
top >=
100 +
document.querySelector(
'#assign-case-detail-page-content-center-card0'
).offsetHeight +
document.querySelector(
'#assign-case-detail-page-content-center-card1'
).offsetHeight &&
top <
100 +
document.querySelector(
'#assign-case-detail-page-content-center-card0'
).offsetHeight +
document.querySelector(
'#assign-case-detail-page-content-center-card1'
).offsetHeight +
document.querySelector(
'#assign-case-detail-page-content-center-card2'
).offsetHeight -
1
) {
tabName.value = '解决方案'
} else if (
top >=
100 +
document.querySelector(
'#assign-case-detail-page-content-center-card0'
).offsetHeight +
document.querySelector(
'#assign-case-detail-page-content-center-card1'
).offsetHeight +
document.querySelector(
'#assign-case-detail-page-content-center-card2'
).offsetHeight &&
top <
100 +
document.querySelector(
'#assign-case-detail-page-content-center-card0'
).offsetHeight +
document.querySelector(
'#assign-case-detail-page-content-center-card1'
).offsetHeight +
document.querySelector(
'#assign-case-detail-page-content-center-card2'
).offsetHeight +
document.querySelector(
'#assign-case-detail-page-content-center-card3'
).offsetHeight -
1
) {
tabName.value = '案例成效'
}
})
})
@ -325,7 +351,7 @@
padding-top: 5px;
padding-bottom: 5px;
position: fixed;
top: 4.9rem;
top: 3.9rem;
div {
height: 0.3rem;
padding-right: 0.7rem;

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

@ -53,7 +53,10 @@
v-for="(item, index) in contenBox"
:key="index"
>
<img :src="item.note1 || ''" alt="" />
<img
:src="item.note1"
alt=""
/>
<h3>{{ item.name }}</h3>
<p>
发布时间
@ -315,7 +318,6 @@
height: 20px;
background: url(../../../assets/assignCase/left.png) no-repeat
center;
margin-top: 30px;
transform: rotate(-90deg);
}
@ -343,6 +345,10 @@
color: #333333;
margin-right: 30px;
cursor: pointer;
display: inline-block;
line-height: 30px;
padding: 5px 10px;
border-radius: 0.16rem;
}
span:nth-of-type(8n) {
margin-right: 50px;
@ -376,9 +382,11 @@
border-radius: 6px;
box-shadow: 5px 5px 20px 0 #f2f3fb;
img {
// width: 370px;
width: 355px;
height: 200px;
border-radius: 6px;
object-fit: cover;
object-position: 50% 20%;
}
h3 {
margin: 30px 0 20px;

11
front/src/views/capabilityCloud/components/ApplicationResources.vue
View File

@ -1,8 +1,8 @@
<!--
* @Author: hisense.liangjunhua
* @Date: 2022-06-19 10:16:10
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-06-19 17:52:19
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-07-05 21:26:40
* @Description: 告诉大家这是什么
-->
<template>
@ -44,6 +44,7 @@
<div
:class="{ select: select == '区市应用资源排名' }"
@click="selectNav('区市应用资源排名')"
v-if="!whoShow1.itShowXiHaiAn"
>
区市应用资源排名
<i v-show="select == '区市应用资源排名'"></i>
@ -67,6 +68,8 @@
const num3 = ref(0)
const select = ref('区市应用资源排名')
let myChart = null
// eslint-disable-next-line no-undef
const whoShow1 = whoShow
const selectNav = (val) => {
select.value = val
switch (val) {
@ -259,6 +262,7 @@
}
onMounted(() => {
echarts.init(document.getElementById('echarts-box2')).dispose()
const chart = document.getElementById('echarts-box2')
if (chart) {
myChart = echarts.init(chart)
@ -365,11 +369,12 @@
position: relative;
.nav {
position: absolute;
width: 7.5rem;
z-index: 10;
top: 0.3rem;
left: 0;
display: flex;
justify-content: space-between;
justify-content: space-around;
padding: 0 1.5rem;
& > div {
cursor: pointer;

35
front/src/views/capabilityCloud/components/ComponentServices.vue
View File

@ -168,6 +168,7 @@
}
})
} else {
callTheTrendData.value.snum = ['0', '0', '0', '0', '0', '0', '0']
callTheTrend(callTheTrendData.value)
}
} else {
@ -202,6 +203,39 @@
}
})
} else {
callTheTrendData.value.snum = [
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
'0',
]
callTheTrend(callTheTrendData.value)
}
}
@ -253,6 +287,7 @@
],
yAxis: [
{
minInterval: 1,
name: '个',
type: 'value',
axisTick: {

7
front/src/views/capabilityCloud/components/PlatformOverview.vue
View File

@ -1,8 +1,8 @@
<!--
* @Author: hisense.liangjunhua
* @Date: 2022-06-19 10:15:33
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-06-19 17:52:04
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-07-05 21:25:47
* @Description: 告诉大家这是什么
-->
<template>
@ -134,7 +134,7 @@
},
grid: {
top: '14%',
left: '4%',
left: '6%',
right: '5%',
bottom: '12%',
containLabel: true,
@ -172,6 +172,7 @@
series: lineY,
}
onMounted(() => {
echarts.init(document.getElementById('echarts-box')).dispose()
trafficStatistics({
startDate: dateList[0],
endDate: dateList[dateList.length - 1],

13
front/src/views/capabilityCloud/index.vue
View File

@ -1,13 +1,15 @@
<!--
* @Author: hisense.liangjunhua
* @Date: 2022-06-19 10:11:03
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-19 17:57:14
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-07-05 19:47:07
* @Description: 告诉大家这是什么
-->
<template>
<div class="capability-cloud">
<div class="header"><span class="title">数字资源驾驶舱</span></div>
<div class="header">
<span class="title" @click="goHome">数字能力超市</span>
</div>
<div class="main">
<platform-overview></platform-overview>
<application-resources></application-resources>
@ -27,6 +29,11 @@
import Infrastructure from '@/views/capabilityCloud/components/Infrastructure.vue'
import DataResources from '@/views/capabilityCloud/components/DataResources.vue'
import KnowledgeBase from '@/views/capabilityCloud/components/KnowledgeBase.vue'
import { useRouter } from 'vue-router'
const router = useRouter()
const goHome = () => {
router.push('/home')
}
</script>
<style lang="less">
@font-face {

2
front/src/views/capacityOnTheShelf/Application.vue
View File

@ -391,7 +391,7 @@
}
.line {
margin-left: 10px;
width: 140px;
width: 280px;
height: 1px;
background: #999;
}

441
front/src/views/capacityOnTheShelf/components/PutOnTheShelf.vue
View File

@ -16,21 +16,14 @@
<template v-if="title.isConfigure">
<div class="bottom">
<div class="items" v-if="data[title.name].length > 0">
<div
class="item"
v-for="(val, index) in data[title.name]"
:key="'key1' + val.name + index"
>
<div class="item" v-for="(val, index) in data[title.name]" :key="'key1' + val.name + index">
<p>
<span>{{ title.name }}-{{ index + 1 }}</span>
<span></span>
</p>
<p
v-for="attr in props.configure.filter(
<p v-for="attr in props.configure.filter(
(item, index2) => item.name === title.name
)[0].list"
:key="'key2' + attr.name + index2"
>
)[0].list" :key="'key2' + attr.name + index2">
<span>{{ attr.name }}</span>
<span v-if="attr.type === 'image'">
<a-image :width="85" :height="60" :src="val.img" />
@ -44,51 +37,19 @@
</div>
</div>
<div class="add">添加更多{{ title.name }}</div>
<div
class="form"
v-for="(val, index) in props.configure.filter(
<div class="form" v-for="(val, index) in props.configure.filter(
(item) => item.name === title.name
)[0].list"
:key="'key3' + val.name + index"
>
)[0].list" :key="'key3' + val.name + index">
<span>{{ val.name }}</span>
<a-input
v-model:value="val.note1"
:maxlength="24"
:placeholder="'请填写' + val.name + ',不超过24个字符'"
v-if="val.type == 'input'"
/>
<a-textarea
v-model:value="val.note1"
:showCount="true"
:maxlength="200"
:placeholder="'请填写' + val.name"
v-else-if="val.type == 'textArea'"
/>
<a-input-number
v-model:value="val.note1"
:min="0"
:max="9999"
:step="0.01"
string-mode
:placeholder="'请填写' + val.name"
v-else-if="val.type == 'number'"
/>
<a-radio-group
v-model:value="val.note1"
:options="val.options"
v-else-if="val.type == 'radio'"
/>
<upload
:key="showKey"
type="图片"
btnName="上传图片"
:maxCount="1"
:data="val"
:list="[]"
tip="支持图片类型，大小不超过100M"
v-else-if="val.type == 'image'"
></upload>
<a-input v-model:value="val.note1" :maxlength="24" :placeholder="'请填写' + val.name + ',不超过24个字符'"
v-if="val.type == 'input'" />
<a-textarea v-model:value="val.note1" :showCount="true" :maxlength="200" :placeholder="'请填写' + val.name"
v-else-if="val.type == 'textArea'" />
<a-input-number v-model:value="val.note1" :min="0" :max="9999" :step="0.01" string-mode
:placeholder="'请填写' + val.name" v-else-if="val.type == 'number'" />
<a-radio-group v-model:value="val.note1" :options="val.options" v-else-if="val.type == 'radio'" />
<upload :key="showKey" type="图片" btnName="上传图片" :maxCount="1" :data="val" :list="[]" tip="支持图片类型，大小不超过100M"
v-else-if="val.type == 'image'"></upload>
</div>
<div class="submit">
<a-button type="primary" @click="add(title.name)">提交</a-button>
@ -99,126 +60,77 @@
<div class="bottom">
<div class="form" v-for="item in title.children" :key="item.id">
<span>{{ item.name }}</span>
<a-input
v-if="item.type == 'input'"
v-model:value="item.note1"
:placeholder="'请输入' + item.name"
/>
<a-radio-group
v-else-if="item.type == 'radio'"
v-model:value="item.note1"
:options="item.options"
/>
<a-input
v-else-if="item.type == 'text'"
v-model:value="item.note1"
:placeholder="'请输入' + item.name"
:disabled="true"
/>
<a-input
v-else-if="item.type == 'text2'"
v-model:value="item.note1"
:placeholder="'请输入' + item.name"
:disabled="true"
/>
<a-textarea
v-else-if="item.type == 'textArea'"
v-model:value="item.note1"
:showCount="true"
:maxlength="200"
:placeholder="'请输入' + item.name"
/>
<upload
v-else-if="item.type == 'image'"
type="图片"
btnName="上传图片"
:maxCount="1"
:data="item"
:list="props.imgList"
tip="支持图片类型，大小不超过100M"
></upload>
<upload
v-else-if="item.type == 'file' && item.name !== '使用手册'"
type="文件"
btnName="上传附件"
:maxCount="1"
:data="item"
:list="props.fileList"
tip="支持文件类型，大小不超过100M"
></upload>
<upload
v-else-if="item.name == '使用手册'"
type="文件"
btnName="上传附件"
:maxCount="1"
:data="item"
:busType="2"
:list="props.fileList2"
tip="支持文件类型，大小不超过100M"
></upload>
<upload
v-else-if="item.type == 'video'"
type="视频"
btnName="上传视频"
:maxCount="1"
:data="item"
:list="props.videoList"
tip="支持视频类型，大小不超过100M"
></upload>
<a-input v-if="item.type == 'input'" v-model:value="item.note1" :placeholder="'请输入' + item.name" />
<a-radio-group v-else-if="item.type == 'radio'" v-model:value="item.note1" :options="item.options" />
<a-input v-else-if="item.type == 'text'" v-model:value="item.note1" :placeholder="'请输入' + item.name"
:disabled="true" />
<a-input v-else-if="item.type == 'text2'" v-model:value="item.note1" :placeholder="'请输入' + item.name"
:disabled="true" />
<a-textarea v-else-if="item.type == 'textArea'" v-model:value="item.note1" :showCount="true"
:maxlength="200" :placeholder="'请输入' + item.name" />
<upload v-else-if="item.type == 'image'" type="图片" btnName="上传图片" :maxCount="1" :data="item"
:list="props.imgList" tip="支持图片类型，大小不超过100M"></upload>
<upload v-else-if="item.type == 'file' && item.name !== '使用手册'" type="文件" btnName="上传附件" :maxCount="1"
:data="item" :list="props.fileList" tip="支持文件类型，大小不超过100M"></upload>
<upload v-else-if="item.name == '使用手册'" type="文件" btnName="上传附件" :maxCount="1" :data="item" :busType="2"
:list="props.fileList2" tip="支持文件类型，大小不超过100M"></upload>
<upload v-else-if="item.type == 'video'" type="视频" btnName="上传视频" :maxCount="1" :data="item"
:list="props.videoList" tip="支持视频类型，大小不超过100M"></upload>
<a-button v-else-if="item.type == 'dialog'" @click="sourceClick">
请选择来源应用
</a-button>
<a-select
v-else-if="item.type == 'select'"
style="width: 240px"
v-model:value="item.note1"
:placeholder="'请选择' + item.name"
>
<a-select-option
v-for="(itemSelect, indexSelect) in item.options"
:key="indexSelect"
:value="itemSelect.dictLabel"
>
<a-button v-else-if="item.type == 'dialog2'" @click="componentsClick">
请选择关联组件
</a-button>
<a-select v-else-if="item.type == 'select'" style="width: 240px" v-model:value="item.note1"
:placeholder="'请选择' + item.name">
<a-select-option v-for="(itemSelect, indexSelect) in item.options" :key="indexSelect"
:value="itemSelect.dictLabel">
{{ itemSelect.dictLabel }}
</a-select-option>
</a-select>
<div
v-else-if="item.type == 'checkBox'"
class="application-Area"
id="application-Area"
:key="showKey"
>
<div
v-for="(itemson, indexson) in item.options"
:key="indexson"
class="application-Area-son"
@click="ApplicationArea(item, itemson)"
:class="
<div v-else-if="item.type == 'checkBox'" class="application-Area" id="application-Area" :key="showKey">
<div v-for="(itemson, indexson) in item.options" :key="indexson" class="application-Area-son"
@click="ApplicationArea(item, itemson)" :class="
item.note2.indexOf(itemson.dictLabel) != -1
? 'application-Area-down'
: ''
"
>
">
{{ itemson.dictLabel }}
</div>
</div>
</div>
<div class="AssociatedApplication">
<a-modal v-model:visible="visibleAssociatedApplication" :title="titleName" @ok="handleOk"
@cancel="handleCancel" style="width: 960px">
<div>
<a-transfer v-model:target-keys="targetKeys" v-model:selected-keys="selectedKeys"
:data-source="mockData" :titles="titles" :render="(item) => item.title" @change="handleChange"
@selectChange="handleSelectChange" />
</div>
</a-modal>
</div>
</div>
</template>
</div>
</div>
</template>
<script setup>
import { ref, defineProps, watch, onMounted } from 'vue'
import mybus from '@/myplugins/mybus'
import upload from '@/views/components/upload'
import { message } from 'ant-design-vue'
import { getCategoryTreePage } from '@/api/personalCenter'
import { useRouter } from 'vue-router'
const router = useRouter()
const abilityToType = router.currentRoute.value.query.abilityToType
const componentTypeValue = router.currentRoute.value.query.componentTypeValue
const props = defineProps({
import { ref, defineProps, watch, onMounted } from 'vue'
import mybus from '@/myplugins/mybus'
import upload from '@/views/components/upload'
import { message } from 'ant-design-vue'
import {
getCategoryTreePage,
queryApplicationRelByResourceId,
queryResourceRelByKeyId,
} from '@/api/personalCenter'
import { useRouter } from 'vue-router'
const router = useRouter()
const abilityToType = router.currentRoute.value.query.abilityToType
const componentTypeValue = router.currentRoute.value.query.componentTypeValue
const props = defineProps({
// 展示数据
refData: { type: Object, default: null },
// 表单数据
@ -276,13 +188,13 @@
// }
// ]
// }]
})
// console.log('props==========>', props)
const data = ref({
})
// console.log('props==========>', props)
const data = ref({
list: [],
})
const showKey = ref(0)
props.refData.children.map((item) => {
})
const showKey = ref(0)
props.refData.children.map((item) => {
if (item.name == '基本信息') {
item.children.map((val) => {
if (val.name == '能力类型') {
@ -302,8 +214,8 @@
} else {
item.isConfigure = false
}
})
let arr = props.refData.children.filter((item) => {
})
let arr = props.refData.children.filter((item) => {
if (props.configure) {
if (!item.isConfigure) {
return item
@ -311,10 +223,10 @@
} else {
return item
}
})
data.value.list = []
// 获取字典数据
arr.forEach((val) => {
})
data.value.list = []
// 获取字典数据
arr.forEach((val) => {
val.children.forEach((item) => {
if (item.isLinkToDic === 'true' && item.linkValue) {
getCategoryTreePage({
@ -339,8 +251,8 @@
data.value.list.push(item)
}
})
})
if (props.dataFrom) {
})
if (props.dataFrom) {
// console.log(props.dataFrom, data.value.list)
props.dataFrom.infoList.forEach((item) => {
if (
@ -362,8 +274,9 @@
// item.note1 = item.attrValue.split(';')
}
})
}
const add = (title) => {
}
const add = (title) => {
console.log(title, 'title')
let list = props.configure.filter((item) => item.name === title)[0].list
let flag = true
list.forEach((item) => {
@ -393,16 +306,16 @@
} else {
message.warning('请填写完整')
}
}
const del = (title, index) => {
}
const del = (title, index) => {
data.value[title].splice(index, 1)
mybus.emit('chageDataFrom', {
attrType: title,
attrValue: JSON.stringify(data.value[title]),
delFlag: 0,
})
}
const ApplicationArea = (item, itemson) => {
}
const ApplicationArea = (item, itemson) => {
// console.log(item, itemson)
if (item.note2.indexOf(itemson.dictLabel) === -1) {
item.note2.push(itemson.dictLabel)
@ -414,9 +327,80 @@
attrValue: item.note2.join(';'),
delFlag: 0,
})
}
// 来源应用
const visibleAssociatedApplication = ref(false)
const mockData = ref([])
const titles = ref(['未关联的应用名称', '已关联的应用名称'])
const titleName = ref('关联应用')
const sourceClick = () => {
visibleAssociatedApplication.value = true
queryApplicationRelByResourceId({
referenceId: 0,
}).then((res) => {
// console.log(res.data.data.notLinked)
res.data.data.notLinked.forEach((val, index) => {
// console.log(val, index)
mockData.value.push({
key: val.id,
title: val.name,
description: val.id,
})
})
})
}
// 关联组件
const componentsClick = () => {
titles.value = ['未关联的组件名称', '已关联的组件名称']
titleName.value = '关联组件'
visibleAssociatedApplication.value = true
queryResourceRelByKeyId({
keyId: 0,
type: '组件服务',
referenceName: '',
}).then((res) => {
// console.log(res.data.data.notLinked)
res.data.data.notLinked.forEach((val, index) => {
// console.log(val, index)
mockData.value.push({
key: val.id,
title: val.name,
description: val.id,
})
})
})
}
const targetKeys = ref([])
const selectedKeys = ref([])
const handleChange = (nextTargetKeys, direction, moveKeys) => {
console.log('targetKeys: ', nextTargetKeys)
console.log('direction: ', direction)
console.log('moveKeys: ', moveKeys)
}
const handleSelectChange = (sourceSelectedKeys, targetSelectedKeys) => {
console.log('targetSelectedKeys: ', targetSelectedKeys)
}
const handleOk = (e) => {
console.log(e)
visibleAssociatedApplication.value = false
// console.log('2222222222222', props.refData)
data.value.list.map((item) => {
if (item.name === '来源应用' || item.name === '关联组件信息') {
item.note1 = targetKeys.value + ''
}
const sourceClick = () => {}
watch(data.value.list, (newProps, oldProps) => {
})
}
const handleCancel = (e) => {
console.log(e)
visibleAssociatedApplication.value = false
}
watch(data.value.list, (newProps, oldProps) => {
// console.log(newProps, oldProps)
newProps.forEach((val) => {
// console.log('数据发生改变==========>', val)
@ -448,19 +432,21 @@
}
}
})
})
})
</script>
<style lang="less" scoped>
.put-on-the-shelf {
.put-on-the-shelf {
height: 680px;
overflow: scroll;
display: flex;
flex-direction: column;
align-items: center;
padding: 50px 100px 25px;
& > div {
&>div {
width: 100%;
margin-top: 60px;
.top {
color: #333333;
font-size: 22px;
@ -468,40 +454,50 @@
justify-content: center;
align-items: center;
margin-bottom: 25px;
div:first-child,
div:last-child {
width: 245px;
height: 1px;
background: #f0f0f0;
}
div:nth-child(2) {
margin: 0 30px;
}
}
.bottom {
margin-top: 25px;
.items {
background: #fafafa;
padding: 10px;
p {
display: flex;
justify-content: space-between;
span:nth-of-type(1) {
width: 200px;
}
span:nth-of-type(2) {
width: 100%;
font-weight: 600;
}
}
p:nth-of-type(1) > span:nth-of-type(1) {
p:nth-of-type(1)>span:nth-of-type(1) {
font-size: 18px;
font-weight: 600;
}
.del {
display: flex;
justify-content: flex-end;
align-items: center;
.delImg {
cursor: pointer;
display: inline-block;
@ -510,36 +506,45 @@
background: url(~@/assets/home/sf_del.png) no-repeat;
margin-right: 5px;
}
div {
cursor: pointer;
}
}
}
.add {
margin-top: 10px;
font-size: 16px;
color: #007efb;
}
.form {
margin-top: 20px;
display: flex;
justify-content: flex-start;
span:first-child {
width: 120px;
}
:deep(.ant-input-textarea) {
width: 570px;
}
:deep(.ant-radio-group) {
width: 570px;
}
:deep(.ant-input-number) {
width: 200px;
}
:deep(.ant-input) {
resize: none;
width: 570px;
}
.ant-btn {
width: 160px;
height: 32px;
@ -550,10 +555,12 @@
border-radius: 6px;
}
}
.submit {
margin-top: 40px;
display: flex;
justify-content: flex-end;
.ant-btn {
width: 80px;
height: 28px;
@ -566,15 +573,18 @@
}
}
}
& > div:nth-of-type(1) {
&>div:nth-of-type(1) {
margin-top: 0;
}
}
.application-Area {
}
.application-Area {
width: 570px;
display: grid;
margin-top: -5px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
.application-Area-son {
cursor: pointer;
font-size: 14px;
@ -590,14 +600,73 @@
margin-top: 10px;
font-weight: 500;
}
.application-Area-down {
background: #0087ff;
color: #fff;
}
}
:deep(.ant-image-img) {
}
:deep(.ant-image-img) {
width: 100%;
height: 100%;
object-fit: contain;
}
}
:deep(.ant-modal) {
width: 960px;
}
:deep(.ant-transfer-list) {
width: 39.5%;
height: 520px;
}
:deep(.ant-transfer-operation) {
flex-direction: row-reverse;
margin: 0 30px;
}
:deep(.ant-btn) {
width: 56px;
height: 40px;
border-radius: 4px;
}
:deep(.ant-btn:first-child) {
margin-left: 4px;
}
:deep(.ant-modal-footer) {
border: 0;
}
:deep(.ant-modal-header) {
border: 0;
}
:deep(.ant-modal-title) {
line-height: 24px;
font-size: 18px;
color: #303133;
}
:deep(.ant-transfer-list-header) {
background: #f5f7fa;
}
:deep(.ant-transfer-list-header-selected) {
display: flex;
width: 90%;
flex-direction: row-reverse;
justify-content: space-between;
align-items: center;
}
:deep(.ant-transfer-list-header-title) {
font-size: 16px;
color: #303133;
font-weight: 400;
text-align: left;
}
</style>

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

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

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

@ -8,105 +8,77 @@
<template>
<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"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></application-navigation>
<!-- 应用展示 视频 -->
<application-presentation
:dataList="dataList.data"
id="application-presentation"
class="scrollBox"
></application-presentation>
<!-- 关联组件 -->
<application-associated-components
:dataList="dataList.data"
id="application-associated-components"
class="scrollBox"
v-if="false"
></application-associated-components>
<application-navigation :dataList="dataList.data" :associatedComponents="associatedComponents"
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></application-navigation>
<!-- 关联能力 -->
<application-associated-ability
:associatedComponents="associatedComponentsFunction()"
id="application-associated-ability"
class="scrollBox"
></application-associated-ability>
<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-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"
class="scrollBox"
></application-owning-department-and-service-provider>
<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>
</template>
<script setup>
import ApplicationAbilityToise from '@/views/detailsAll/components/Application/ApplicationAbilityToise.vue'
import ApplicationAssociatedComponents from '@/views/detailsAll/components/Application/ApplicationAssociatedComponents.vue'
import ApplicationAssociatedAbility from '@/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue'
import ApplicationOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Application/ApplicationOwningDepartmentAndServiceProvider.vue'
import ApplicationFunctionIntorduction from '@/views/detailsAll/components/Application/ApplicationFunctionIntorduction.vue'
import ApplicationDeploymentAndSecurity from '@/views/detailsAll/components/Application/ApplicationDeploymentAndSecurity.vue'
import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue'
import ApplicationNavigation from '@/views/detailsAll/components/Application/ApplicationNavigation.vue'
import ApplicationPresentation from '@/views/detailsAll/components/Application/ApplicationPresentation.vue'
import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router'
import { updateVisits, selectOne, queryPartAppByKeyId } from '@/api/home'
import mybus from '@/myplugins/mybus'
const associatedComponents = ref([
{ type: '组件服务', dataList: [] },
{ type: '数据资源', dataList: [] },
{ type: '基础设施', dataList: [] },
])
const router = useRouter()
const scrollTop = ref(0)
const domArr = ref([])
const selectNow = ref('')
const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview'))
document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0
mybus.on('flyToView', (id) => {
import ApplicationAbilityToise from '@/views/detailsAll/components/Application/ApplicationAbilityToise.vue'
import ApplicationAssociatedComponents from '@/views/detailsAll/components/Application/ApplicationAssociatedComponents.vue'
import ApplicationAssociatedAbility from '@/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue'
import ApplicationOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Application/ApplicationOwningDepartmentAndServiceProvider.vue'
import ApplicationFunctionIntorduction from '@/views/detailsAll/components/Application/ApplicationFunctionIntorduction.vue'
import ApplicationDeploymentAndSecurity from '@/views/detailsAll/components/Application/ApplicationDeploymentAndSecurity.vue'
import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue'
import ApplicationNavigation from '@/views/detailsAll/components/Application/ApplicationNavigation.vue'
import ApplicationPresentation from '@/views/detailsAll/components/Application/ApplicationPresentation.vue'
import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router'
import {
updateVisits,
selectOne,
queryPartAppByKeyId,
browsingInsert,
} from '@/api/home'
import mybus from '@/myplugins/mybus'
const associatedComponents = ref([{ type: '组件服务', dataList: [] }])
let loading = ref(true)
const router = useRouter()
const scrollTop = ref(0)
const domArr = ref([])
const selectNow = ref('')
const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview'))
document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0
mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop-50)
document.documentElement.scrollTop = top
document.body.scrollTop = top
})
onMounted(() => {
})
onMounted(() => {
// console.clear()
window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox')
@ -131,9 +103,9 @@
}
}
})
})
})
const init = (id) => {
const init = (id) => {
if (id) {
selectOne(id).then((res) => {
// console.clear()
@ -157,6 +129,12 @@
)
})
}
// 浏览记录
browsingInsert({
resourceId: res.data.data.id,
}).then(() => {
console.log('浏览记录+1')
})
})
associatedComponents.value.map((item, index) => {
let queryPartAppByKeyIdParams = {
@ -164,15 +142,16 @@
type: item.type,
}
queryPartAppByKeyId(queryPartAppByKeyIdParams).then((res) => {
associatedComponents.value[index].dataList = res.data.data
associatedComponents.value[0].dataList = res.data.data
loading.value = false
})
})
} else if (obj) {
dataList.data = obj
console.log('预览==============', obj)
}
}
const associatedComponentsFunction = () => {
}
const associatedComponentsFunction = () => {
if (
associatedComponents.value[0].dataList.length > 0 ||
associatedComponents.value[1].dataList.length > 0 ||
@ -180,20 +159,21 @@
) {
return associatedComponents.value
}
}
init(id)
onBeforeUnmount(() => {
}
init(id)
onBeforeUnmount(() => {
mybus.off('flyToView')
})
})
</script>
<style lang="less" scoped>
.fixed {
.fixed {
position: fixed;
z-index: 2000;
top: 0;
left: 0;
}
.fixed2 > div:nth-of-type(3) {
}
.fixed2>div:nth-of-type(3) {
margin-top: 0.84rem;
}
}
</style>

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

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

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

@ -10,96 +10,73 @@
<!-- 头部基本信息 -->
<developer-top-details :dataList="dataList.data"></developer-top-details>
<!-- 导航 -->
<developer-navigation
:dataList="dataList.data"
:associatedComponents="associatedComponents"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></developer-navigation>
<!-- 组件展示 视频 -->
<Developer-presentation
:dataList="dataList.data"
id="eveloper-presentation"
class="scrollBox"
></Developer-presentation>
<developer-navigation :dataList="dataList.data" :associatedComponents="associatedComponentsFunction()"
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></developer-navigation>
<!-- 关联能力 -->
<developer-associated-ability
:associatedComponents="associatedComponents"
id="developer-associated-ability"
class="scrollBox"
></developer-associated-ability>
<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-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"
class="scrollBox"
></developer-owning-department-and-service-provider>
<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>
</template>
<script setup>
import DeveloperApplicationScenarios from '@/views/detailsAll/components/Developer/DeveloperApplicationScenarios.vue' //应用场景
import DeveloperAssociatedAbility from '@/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue'
import DeveloperOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Developer/DeveloperOwningDepartmentAndServiceProvider.vue' //使用方式
import DeveloperFunctionIntorduction from '@/views/detailsAll/components/Developer/DeveloperFunctionIntorduction.vue' //功能介绍
import DeveloperApplicationCase from '@/views/detailsAll/components/Developer/DeveloperApplicationCase' //应用案例
import DeveloperTopDetails from '@/views/detailsAll/components/Developer/DeveloperTopDetails.vue' //头部基本信息
import DeveloperNavigation from '@/views/detailsAll/components/Developer/DeveloperNavigation.vue'
import DeveloperPresentation from '@/views/detailsAll/components/Developer/DeveloperPresentation.vue' //组件展示
import DeveloperCommonProblem from '@/views/detailsAll/components/Developer/DeveloperCommonProblem' //常见问题
import DeveloperTrial from '@/views/detailsAll/components/Developer/DeveloperTrial' //组件试用
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router'
import { updateVisits, selectOne, queryPartAppByKeyId2 } from '@/api/home'
import mybus from '@/myplugins/mybus'
const router = useRouter()
const scrollTop = ref(0)
const domArr = ref([])
const selectNow = ref('')
const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0
mybus.on('flyToView', (id) => {
import DeveloperApplicationScenarios from '@/views/detailsAll/components/Developer/DeveloperApplicationScenarios.vue' //应用场景
import DeveloperAssociatedAbility from '@/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue'
import DeveloperOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Developer/DeveloperOwningDepartmentAndServiceProvider.vue' //使用方式
import DeveloperFunctionIntorduction from '@/views/detailsAll/components/Developer/DeveloperFunctionIntorduction.vue' //功能介绍
import DeveloperApplicationCase from '@/views/detailsAll/components/Developer/DeveloperApplicationCase' //应用案例
import DeveloperTopDetails from '@/views/detailsAll/components/Developer/DeveloperTopDetails.vue' //头部基本信息
import DeveloperNavigation from '@/views/detailsAll/components/Developer/DeveloperNavigation.vue'
import DeveloperPresentation from '@/views/detailsAll/components/Developer/DeveloperPresentation.vue' //组件展示
import DeveloperCommonProblem from '@/views/detailsAll/components/Developer/DeveloperCommonProblem' //常见问题
import DeveloperTrial from '@/views/detailsAll/components/Developer/DeveloperTrial' //组件试用
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router'
import {
updateVisits,
selectOne,
queryPartAppByKeyId2,
browsingInsert,
} from '@/api/home'
import mybus from '@/myplugins/mybus'
const router = useRouter()
const scrollTop = ref(0)
const domArr = ref([])
const selectNow = ref('')
const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
let loading = ref(true)
document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0
mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top
document.body.scrollTop = top
})
onMounted(() => {
})
onMounted(() => {
// console.clear()
window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox')
@ -124,10 +101,16 @@
}
}
})
})
const init = (id) => {
})
const init = (id) => {
if (id) {
let queryPartAppByKeyIdParams = {
keyId: id,
}
queryPartAppByKeyId2(queryPartAppByKeyIdParams).then((res) => {
associatedComponents.value[0].dataList = res.data.data
loading.value = false
})
selectOne(id).then((res) => {
// console.clear()
dataList.data = res.data.data
@ -146,33 +129,38 @@
)
})
}
})
associatedComponents.value.map((item, index) => {
let queryPartAppByKeyIdParams = {
keyId: id,
}
queryPartAppByKeyId2(queryPartAppByKeyIdParams).then((res) => {
associatedComponents.value[index].dataList = res.data.data
// 浏览记录
browsingInsert({
resourceId: res.data.data.id,
}).then(() => {
console.log('浏览记录+1')
})
})
associatedComponents.value.map((item, index) => { })
} else if (obj) {
dataList.data = obj
console.log('预览==============', obj)
}
}
init(id)
const associatedComponentsFunction = () => {
if (associatedComponents.value[0].dataList.length > 0) {
return associatedComponents.value
}
init(id)
onBeforeUnmount(() => {
}
onBeforeUnmount(() => {
mybus.off('flyToView')
})
})
</script>
<style lang="less" scoped>
.fixed {
.fixed {
position: fixed;
z-index: 2000;
top: 0;
left: 0;
}
.fixed2 > div:nth-of-type(3) {
}
.fixed2>div:nth-of-type(3) {
margin-top: 0.84rem;
}
}
</style>

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

@ -8,100 +8,75 @@
<template>
<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"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></layer-service-navigation>
<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"
class="scrollBox"
></layer-service-associated-ability>
<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>
</template>
<script setup>
import LayerServiceApplicationCase from '@/views/detailsAll/components/LayerService/LayerServiceApplicationCase' //应用案例
import LayerServiceAssociatedAbility from '@/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue'
import LayerServiceApplicationScenarios from '@/views/detailsAll/components/LayerService/LayerServiceApplicationScenarios.vue' //应用场景
import LayerServiceCommonProblem from '@/views/detailsAll/components/LayerService/LayerServiceCommonProblem' //常见问题
import LayerServiceInformation from '@/views/detailsAll/components/LayerService/LayerServiceInformation.vue' //图层信息
import LayerServiceNavigation from '@/views/detailsAll/components/LayerService/LayerServiceNavigation.vue' //导航
import LayerServicePresentation from '@/views/detailsAll/components/LayerService/LayerServicePresentation.vue' //图层展示
import LayerServicePreview from '@/views/detailsAll/components/LayerService/LayerServicePreview.vue' //图层预览
import LayerServiceTopDetails from '@/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue' //头部基本信息
import LayerServiceUsageMode from '@/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue' //使用方式
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router'
import { updateVisits, selectOne, queryPartAppByKeyId2 } from '@/api/home'
import mybus from '@/myplugins/mybus'
const router = useRouter()
const scrollTop = ref(0)
const domArr = ref([])
const selectNow = ref('')
const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0
mybus.on('flyToView', (id) => {
import LayerServiceApplicationCase from '@/views/detailsAll/components/LayerService/LayerServiceApplicationCase' //应用案例
import LayerServiceAssociatedAbility from '@/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue'
import LayerServiceApplicationScenarios from '@/views/detailsAll/components/LayerService/LayerServiceApplicationScenarios.vue' //应用场景
import LayerServiceCommonProblem from '@/views/detailsAll/components/LayerService/LayerServiceCommonProblem' //常见问题
import LayerServiceInformation from '@/views/detailsAll/components/LayerService/LayerServiceInformation.vue' //图层信息
import LayerServiceNavigation from '@/views/detailsAll/components/LayerService/LayerServiceNavigation.vue' //导航
import LayerServicePresentation from '@/views/detailsAll/components/LayerService/LayerServicePresentation.vue' //图层展示
import LayerServicePreview from '@/views/detailsAll/components/LayerService/LayerServicePreview.vue' //图层预览
import LayerServiceTopDetails from '@/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue' //头部基本信息
import LayerServiceUsageMode from '@/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue' //使用方式
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router'
import {
updateVisits,
selectOne,
queryPartAppByKeyId2,
browsingInsert,
} from '@/api/home'
import mybus from '@/myplugins/mybus'
const router = useRouter()
const scrollTop = ref(0)
const domArr = ref([])
const selectNow = ref('')
const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
let loading = ref(true)
document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0
mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top
document.body.scrollTop = top
})
onMounted(() => {
})
onMounted(() => {
// console.clear()
window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox')
@ -126,9 +101,9 @@
}
}
})
})
})
const init = (id) => {
const init = (id) => {
if (id) {
selectOne(id).then((res) => {
// console.clear()
@ -148,6 +123,12 @@
)
})
}
// 浏览记录
browsingInsert({
resourceId: res.data.data.id,
}).then(() => {
console.log('浏览记录+1')
})
})
associatedComponents.value.map((item, index) => {
let queryPartAppByKeyIdParams = {
@ -155,26 +136,28 @@
}
queryPartAppByKeyId2(queryPartAppByKeyIdParams).then((res) => {
associatedComponents.value[index].dataList = res.data.data
loading.value = false
})
})
} else if (obj) {
dataList.data = obj
console.log('预览==============', obj)
}
}
init(id)
onBeforeUnmount(() => {
}
init(id)
onBeforeUnmount(() => {
mybus.off('flyToView')
})
})
</script>
<style lang="less" scoped>
.fixed {
.fixed {
position: fixed;
z-index: 2000;
top: 0;
left: 0;
}
.fixed2 > div:nth-of-type(3) {
}
.fixed2>div:nth-of-type(3) {
margin-top: 0.84rem;
}
}
</style>

72
front/src/views/detailsAll/components/Algorithm/AlgorithmAssociatedAbility.vue
View File

@ -1,30 +1,79 @@
<template>
<div class="application-associated-ability" v-if="flag">
<detals-title title="关联应用" type="ASSOCIATED"></detals-title>
<div class="application-associated-ability-main">
<div
class="application-associated-ability-main"
v-if="dataFrom[0].dataList.length < 4"
>
<div
class="associated-ability-card"
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
@click="switchFunction(dataListitem.id)"
>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description }}
</div>
</a-tooltip>
</div>
</div>
</div>
<div class="application-associated-ability-main" v-else>
<swiper
:slidesPerView="3"
:spaceBetween="30"
:pagination="{ clickable: true }"
:modules="modules"
class="mySwiper"
@swiper="onSwiper"
@slideChange="onSlideChange"
>
<swiper-slide
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
>
<div
class="associated-ability-card"
@click="switchFunction(dataListitem.id)"
>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description }}
</div>
</a-tooltip>
</div>
</div>
</swiper-slide>
</swiper>
</div>
</div>
</template>
<script setup>
import { ref, defineProps, watch } from 'vue'
import { useRouter } from 'vue-router'
import { Navigation, Pagination, Scrollbar, A11y } from 'swiper'
import { Swiper, SwiperSlide } from 'swiper/vue/swiper-vue.js'
import 'swiper/swiper-bundle.min.css'
const router = useRouter()
const modules = ref([Pagination])
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
const props = defineProps({
associatedComponents: { type: Array, default: null },
@ -40,7 +89,7 @@
// id: id,
// },
// })
window.open(window.SITE_CONFIG.previewUrl+ '#/details?id=' + id)
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + id)
// alert(id)
}
console.log('这个是空值', props.associatedComponents[0])
@ -78,7 +127,7 @@
<style lang="less" scoped>
.application-associated-ability {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
padding-bottom: 0.6rem;
display: flex;
flex-direction: column;
align-items: center;
@ -86,20 +135,31 @@
margin-top: 0.4rem;
width: 13.3rem;
display: flex;
justify-content: space-around;
justify-content: space-around !important;
:deep(.swiper) {
padding-bottom: 0.6rem;
}
.associated-ability-card {
width: 3.2rem;
height: 2.78rem;
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid #e4e6f5;
border-radius: 0.1rem;
padding-bottom: 0.3rem;
margin-right: 0.2rem;
margin-top: 0.2rem;
cursor: pointer;
.associated-ability-card-title {
width: 2.2rem;
padding-top: 0.3rem;
font-size: 0.22rem;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.associated-ability-card-content {
width: 100%;
@ -111,6 +171,10 @@
margin-right: 0.15rem;
margin-top: 0.15rem;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
}
}

14
front/src/views/detailsAll/components/Algorithm/AlgorithmNavigation.vue
View File

@ -2,7 +2,7 @@
* @Author: hisense.liangjunhua
* @Date: 2022-06-08 14:54:01
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-30 17:09:40
* @LastEditTime: 2022-07-05 19:38:06
* @Description: 算法详情页导航
-->
<template>
@ -65,6 +65,7 @@
])
const list = ref([])
// 根据能力id查询是否存在关联应用
if (keyId) {
queryPartAppByKeyId2({ keyId: keyId }).then((res) => {
console.log('ressssssss', res)
if (res.data.data.length > 0) {
@ -78,12 +79,13 @@
console.log('navList', navList)
}
})
}
const props = defineProps({
selectNow: { type: String, default: '' },
dataList: { type: Object, default: null },
})
const select = ref('algorithm-display')
const select = ref('algorithm-associated-ability')
const selectNav = (key) => {
select.value = key
@ -101,7 +103,7 @@
list.value.push(item.attrType)
} else if (item.attrType === '算法介绍视频') {
list.value.push('算法展示')
} else if (item.attrType === '试用地址') {
} else if (item.attrType === '试用地址' && item.attrValue) {
list.value.push('算法试用')
} else if (item.attrType === '计费标准信息') {
list.value.push('计费标准')
@ -126,7 +128,7 @@
)
if (navList.value.filter((item) => item.name === list.value[0])[0]) {
select.value = navList.value.filter(
(item) => item.name === list.value[0]
(item) => (item.name === '关联应用') | (item.name === list.value[0])
)[0].key
}
console.log('11111111111111111111111111', list.value, navList.value)
@ -152,7 +154,7 @@
list.value.push(item.attrType)
} else if (item.attrType === '算法介绍视频') {
list.value.push('算法展示')
} else if (item.attrType === '试用地址') {
} else if (item.attrType === '试用地址' && item.attrValue) {
list.value.push('算法试用')
} else if (item.attrType === '计费标准信息') {
list.value.push('计费标准')
@ -165,7 +167,7 @@
list.value.push('使用方式')
}
})
list.value.push('关联应用')
list.value.unshift('关联应用')
navList.value.forEach((item) => {
console.log(item)
if (list.value.indexOf(item.name) > -1) {

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

@ -1,8 +1,8 @@
<!--
* @Author: hisense.liangjunhua
* @Date: 2022-06-09 09:29:29
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-06-13 15:21:26
* @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-07-05 20:25:49
* @Description: 算法详情 算法试用
-->
<template>
@ -25,7 +25,7 @@
const onTrial = ref('')
if (props.dataList.infoList) {
let obj = props.dataList.infoList.filter(
(item) => item.attrType === '试用地址'
(item) => item.attrType === '试用地址' && item.attrValue
)[0]
if (!obj) {
flag.value = false
@ -37,7 +37,7 @@
() => props.dataList,
(val) => {
if (val) {
let obj = val.infoList.filter((item) => item.attrType === '试用地址')[0]
let obj = val.infoList.filter((item) => item.attrType === '试用地址' && item.attrValue)[0]
if (!obj) {
flag.value = false
} else {

3
front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue
View File

@ -2,7 +2,7 @@
* @Author: hisense.liangjunhua
* @Date: 2022-06-08 11:56:28
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-07-01 14:16:18
* @LastEditTime: 2022-07-05 11:41:52
* @Description: 算法详情页头部
-->
<template>
@ -96,6 +96,7 @@
resourceName: props.dataList.name,
time: props.dataList.createDate,
type: props.dataList.type,
componentType: '智能算法',
},
],
deptId: props.dataList.deptId,

21
front/src/views/detailsAll/components/Algorithm/AlgorithmUsageMode.vue
View File

@ -17,7 +17,10 @@
<div class="content-left-content">
<p>
<span>{{ item.link.name }}</span>
<a-tooltip>
<template #title>{{ item.link.value }}</template>
<span>{{ item.link.value }}</span>
</a-tooltip>
</p>
<p>
<span>{{ item.postMethod.name }}</span>
@ -72,7 +75,7 @@
title: '技术对接',
titleSon: '调用接口',
link: {
name: '接口地址：',
name: '服务接口：',
value: '',
},
postMethod: {
@ -225,10 +228,9 @@
color: rgba(33, 41, 86, 0.8);
line-height: 20px;
p {
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
white-space: nowrap;
margin-bottom: 10px;
}
}
@ -283,13 +285,16 @@
p {
// width: 160px;
height: 20px;
display: -webkit-box;
// overflow: hidden;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
margin-right: 15px;
span {
display: inline-block;
max-width: 1.2rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
}
}

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

@ -6,11 +6,7 @@
<div>
<div class="title">图片识别</div>
<div class="box">
<a-image
:width="510"
:height="340"
:src="responseUrl"
/>
<a-image :width="510" :height="340" :src="responseUrl" />
<a-upload
v-model:file-list="fileList"
name="file"
@ -88,7 +84,6 @@
const menuOpenKeys2 = ref(['全文还原'])
let responseUrl = ref('static/image/test.jpg')
const handleChange = (info) => {
debugger;
if (info.file.status !== 'uploading') {
console.log(info.file, info.fileList)
}

156
front/src/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue
View File

@ -1,82 +1,121 @@
<template>
<div class="application-associated-ability" v-if="flag">
<detals-title title="关联组件" type="RELEVANCE"></detals-title>
<div class="application-associated-ability-main">
<detals-title title="关联组件" type="ASSOCIATED"></detals-title>
<div
class="application-associated-ability-main"
v-if="dataFrom[0].dataList.length < 4"
>
<div
class="associated-ability-card"
v-for="(item, index) in dataFrom"
:key="item.type"
>
<div class="associated-ability-card-title">
{{ item.type }}
</div>
<div class="associated-ability-card-content">
<div
class="associated-ability-card-content-font"
v-for="(dataListitem, dataListindex) in item.dataList"
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
@click="switchFunction(dataListitem.id)"
:class="cardFunction(dataFrom[0].dataList)"
>
<span>{{ dataListindex + 1 }}、</span>
<div class="icon"></div>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description || '' }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description || '' }}
</div>
</a-tooltip>
</div>
</div>
</div>
<div class="application-associated-ability-main" v-else>
<swiper
:slidesPerView="3"
:spaceBetween="30"
:pagination="{ clickable: true }"
:modules="modules"
class="mySwiper"
@swiper="onSwiper"
@slideChange="onSlideChange"
>
<swiper-slide
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
>
<div
class="associated-ability-card"
@click="switchFunction(dataListitem.id)"
:class="cardFunction(dataFrom[0].dataList)"
>
<div class="icon"></div>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description || '' }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description || '' }}
</div>
</a-tooltip>
</div>
</div>
</swiper-slide>
</swiper>
</div>
</div>
</template>
<script setup>
import { ref, defineProps, watch } from 'vue'
import { Navigation, Pagination, Scrollbar, A11y } from 'swiper'
import { Swiper, SwiperSlide } from 'swiper/vue/swiper-vue.js'
import 'swiper/swiper-bundle.min.css'
import { useRouter } from 'vue-router'
const router = useRouter()
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
const props = defineProps({
associatedComponents: { type: Array, default: null },
})
const modules = ref([Pagination])
const dataFrom = ref([])
const flag = ref(true)
const oldid = router.currentRoute.value.query.id
//点击查看详情
const switchFunction = (id) => {
router.push({
path: '/details',
query: {
id: id,
},
})
// router.push({
// path: '/details',
// query: {
// id: id,
// },
// })
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + id)
// alert(id)
}
if (props.associatedComponents) {
if (
props.associatedComponents[0].dataList.length > 0 ||
props.associatedComponents[1].dataList.length > 0 ||
props.associatedComponents[2].dataList.length > 0
) {
if (props.associatedComponents[0].dataList.length != 0) {
console.log('这个是空值', props.associatedComponents)
flag.value = true
dataFrom.value = props.associatedComponents
console.log('dataFrom.value', dataFrom.value)
} else {
flag.value = false
}
} else {
flag.value = false
//根据数据多少决定对齐方式
const cardFunction = (item) => {
if (item.length < 5) {
return 'card-function-class'
}
}
watch(
() => props.associatedComponents,
(val) => {
if (props.associatedComponents) {
if (
val[0].dataList.length > 0 ||
val[1].dataList.length > 0 ||
val[2].dataList.length > 0
) {
if (val[0].length != 0) {
flag.value = true
dataFrom.value = props.associatedComponents
// console.log('dataFrom.value', dataFrom.value)
} else {
flag.value = false
}
console.log('dataFrom.value', dataFrom.value)
} else {
flag.value = false
}
@ -96,28 +135,47 @@
<style lang="less" scoped>
.application-associated-ability {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
padding-bottom: 0.6rem;
display: flex;
flex-direction: column;
align-items: center;
.application-associated-ability-main {
margin-top: 0.4rem;
width: 13.14rem;
width: 13.3rem;
display: flex;
justify-content: space-between;
justify-content: space-around;
position: relative;
:deep(.swiper) {
padding-bottom: 0.6rem;
}
.associated-ability-card {
width: 4.28rem;
width: 3.2rem;
height: 2.78rem;
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid #e4e6f5;
border-radius: 0.1rem;
padding-bottom: 0.3rem;
margin-right: 0.2rem;
margin-top: 0.2rem;
padding-top: 0.3rem;
cursor: pointer;
.icon {
width: 82px;
height: 82px;
background: url('~@/assets/detailsAll/sf_icon1.png') no-repeat;
background-size: 100%;
}
.associated-ability-card-title {
width: 2.2rem;
padding-top: 0.3rem;
font-size: 0.22rem;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.associated-ability-card-content {
width: 100%;
@ -128,12 +186,18 @@
color: #999;
margin-right: 0.15rem;
margin-top: 0.15rem;
}
.associated-ability-card-content-font:hover {
color: #0058e1;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
}
}
.card-function-class {
display: flex;
justify-content: center;
}
.associated-ability-card:hover {
border-radius: 0.02rem;
border: 0.01rem solid #0058e1;

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

@ -20,14 +20,14 @@
</template>
<script setup>
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue'
const flag = ref(true)
let dataFrom = ref([])
const props = defineProps({
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue'
const flag = ref(true)
let dataFrom = ref([])
const props = defineProps({
dataList: { type: Object, default: null },
})
if (props.dataList.infoList) {
})
if (props.dataList.infoList) {
let obj = props.dataList.infoList.filter(
(item) => item.attrType === '常见问题'
)[0]
@ -43,8 +43,8 @@
dataFrom.value.push(params)
})
}
}
watch(
}
watch(
() => props.dataList,
(val) => {
if (val) {
@ -63,41 +63,47 @@
}
}
}
)
)
</script>
<style lang="less" scoped>
.cpmmon-problem {
.cpmmon-problem {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 80px;
padding-top: 160px;
background: #f7f8fa;
.content {
width: 1300px;
margin: 20px 0px;
background: #ffffff;
padding: 40px;
.content-son {
font-size: 20px;
margin-bottom: 60px;
.content-top {
display: flex;
align-items: center;
margin-bottom: 20px;
line-height: 20px;
}
.content-bottom {
display: flex;
line-height: 34px;
color: #666666;
}
.content-top,
.content-bottom {
div:last-child {
width: calc(100% - 54px);
}
}
.top-img {
width: 34px;
height: 30px;
@ -106,6 +112,7 @@
background-size: cover;
margin-right: 20px;
}
.bottom-img {
width: 34px;
height: 30px;
@ -115,9 +122,10 @@
margin-right: 20px;
}
}
.content-son:last-child {
margin-bottom: 0px;
}
}
}
}
</style>

89
front/src/views/detailsAll/components/Application/ApplicationDeploymentAndSecurity.vue
View File

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

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

@ -7,42 +7,26 @@
<DetalsTitle :title="dataFrom.attrType" type="INTRODUCE"></DetalsTitle>
</div>
<div class="tab">
<div
v-for="(itemSonTitle, indexSonTitle) in dataFrom.attrValue"
:key="itemSonTitle.name"
@click="tabSwitch(itemSonTitle.name)"
class="tab-son"
:class="
<div v-for="(itemSonTitle, indexSonTitle) in dataFrom.attrValue" :key="itemSonTitle.name"
@click="tabSwitch(itemSonTitle.name)" class="tab-son" :class="
tabIndexClass(indexSonTitle, dataFrom.name, dataFrom.attrValue)
"
>
">
<a-tooltip>
<template #title>{{ itemSonTitle.name }}</template>
<div
class="tab-top"
:class="
<div class="tab-top" :class="
tabInitialize() == itemSonTitle.name ? 'tab-top-down' : ''
"
>
">
{{ itemSonTitle.name }}
</div>
</a-tooltip>
<div
class="tab-bottom"
v-if="tabInitialize() == itemSonTitle.name"
></div>
<div class="tab-bottom" v-if="tabInitialize() == itemSonTitle.name"></div>
</div>
</div>
<template v-for="itemSonTitle in dataFrom.attrValue" :key="itemSonTitle">
<div class="content" v-if="tabindex == itemSonTitle.name">
<div class="content-left">
<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 class="content-right">
<div class="content-right-scene">
@ -60,17 +44,17 @@
</template>
<script setup>
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue'
const flag = ref(true)
let dataFrom = ref([])
// tab切换方法
let tabindex = ref('场景说明一')
//数据初始化
const props = defineProps({
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue'
const flag = ref(true)
let dataFrom = ref([])
// tab切换方法
let tabindex = ref('场景说明一')
//数据初始化
const props = defineProps({
dataList: { type: Object, default: null },
})
if (props.dataList.infoList) {
})
if (props.dataList.infoList) {
let obj = props.dataList.infoList.filter(
(item) => item.attrType === '功能介绍'
)[0]
@ -81,8 +65,8 @@
dataFrom.value = obj
tabindex.value = dataFrom.value.attrValue[0].name
}
}
watch(
}
watch(
() => props.dataList,
(val) => {
if (val) {
@ -96,32 +80,33 @@
}
}
}
)
//滚动条样式
function tabIndexClass(index, title, content) {
)
//滚动条样式
function tabIndexClass(index, title, content) {
if (title == '功能介绍' && index == 0 && content.length > 6) {
return 'tab-son-class'
}
}
//初始化tab切换（判断标题不同，点击事件的判断变量不同）
function tabInitialize() {
}
//初始化tab切换（判断标题不同，点击事件的判断变量不同）
function tabInitialize() {
return tabindex.value
}
//tab切换点击事件
function tabSwitch(name) {
}
//tab切换点击事件
function tabSwitch(name) {
tabindex.value = name
return tabindex.value
}
}
</script>
<style lang="less" scoped>
.function-intorduction {
.function-intorduction {
width: 100%;
background: #f7f8fa;
display: flex;
flex-direction: column;
align-items: center;
overflow-x: unset;
.application-scenarios-and-case-son {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
@ -129,6 +114,7 @@
flex-direction: column;
align-items: center;
overflow: unset;
.tab {
max-width: 13rem;
overflow-x: auto;
@ -141,11 +127,13 @@
cursor: pointer;
padding-left: 0.4rem;
padding-right: 0.4rem;
.tab-son {
display: flex;
flex-direction: column;
align-items: center;
margin-right: 1rem;
.tab-top {
min-width: 1.2rem;
font-size: 0.24rem;
@ -157,53 +145,65 @@
overflow: hidden;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
text-align: center;
}
.tab-top-down {
min-width: 1.2rem;
color: #526aff;
margin-bottom: 0.16rem;
}
.tab-bottom {
height: 0.04rem;
width: 0.6rem;
background: #526aff;
}
}
.tab-son-class {
margin-left: 4.3rem;
margin-bottom: 0.02rem;
}
.tab-son-class-two {
margin-left: 2.3rem;
margin-bottom: 0.02rem;
}
.tab-son:last-child {
margin-right: 0rem;
}
}
.tab::-webkit-scrollbar-thumb {
background: rgba(82, 106, 255, 0.4);
}
.content {
display: flex;
position: relative;
width: 100%;
min-width: 13rem;
height: 3.4rem;
.content-left {
position: absolute;
left: 0;
min-width: 6.2rem;
:deep(.ant-image-img) {
width: 100%;
height: 100%;
object-fit: contain;
}
// text-align: center;
.content-top {
text-align: left;
}
}
.content-right {
width: 6.2rem;
height: 3.4rem;
@ -212,6 +212,7 @@
display: flex;
justify-content: center;
}
.content-right-scene,
.content-right-case {
width: 6.2rem;
@ -220,6 +221,7 @@
flex-direction: column;
justify-content: center;
}
.content-left-scene,
.content-left-case {
height: 3.4rem;
@ -229,12 +231,14 @@
background-position: center;
background-size: 6.35rem 3.4rem;
}
.content-top {
font-size: 0.22rem;
line-height: 0.22rem;
color: #000000;
margin-bottom: 0.35rem;
}
.content-bottom {
font-size: 0.18rem;
color: #999999;
@ -246,8 +250,9 @@
}
}
}
.application-scenarios-and-case-son:first-child {
padding-top: 1rem;
}
}
}
</style>

116
front/src/views/detailsAll/components/Application/ApplicationNavigation.vue
View File

@ -8,12 +8,7 @@
<template>
<div class="application-navigation" v-if="navList.length > 0">
<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 }}
<span class="line"></span>
</div>
@ -21,9 +16,14 @@
</div>
</template>
<script setup>
import { ref, defineProps, watch } from 'vue'
import mybus from '@/myplugins/mybus'
const navList = ref([
import { ref, defineProps, watch } from 'vue'
import mybus from '@/myplugins/mybus'
import { useRouter } from 'vue-router'
import { queryPartAppByKeyId } from '@/api/home'
// 获取当前路由地址
const router = useRouter()
const keyId = router.currentRoute.value.query.id
const navList = ref([
{
name: '应用展示',
key: 'application-presentation',
@ -32,14 +32,6 @@
name: '功能介绍',
key: 'function-introduction',
},
// {
// name: '关联组件',
// key: 'application-associated-components',
// },
{
name: '关联组件',
key: 'application-associated-ability',
},
{
name: '使用能力',
key: 'ability-to-use',
@ -56,23 +48,42 @@
name: '常见问题',
key: 'common-problem',
},
])
const props = defineProps({
])
const props = defineProps({
selectNow: { type: String, default: '' },
dataList: { type: Object, default: null },
associatedComponents: { type: Array, default: null },
})
const select = ref('application-associated-ability')
const list = ref([])
// 根据能力id查询是否存在关联应用
if (keyId) {
let params = {
keyId: keyId,
type: '组件服务',
}
queryPartAppByKeyId(params).then((res) => {
console.log('ressssssss', res)
if (res.data.data.length != 0) {
// 存在关联应用时在导航栏加入关联应用
navList.value.unshift({
name: '关联组件',
key: 'application-associated-ability',
show: true,
})
const select = ref('algorithm-display')
const list = ref([])
const selectNav = (key) => {
list.value.unshift('关联组件')
}
})
}
const selectNav = (key) => {
select.value = key
mybus.emit('flyToView', select.value)
}
if (props.dataList.infoList) {
}
if (props.dataList.infoList) {
list.value = []
props.dataList.infoList.map((item) => {
if (
item.attrType === '算法优势' ||
item.attrType === '功能介绍' ||
item.attrType === '常见问题' ||
item.attrType === '使用能力' ||
item.attrType === '关联组件'
@ -82,35 +93,31 @@
list.value.push('应用展示')
}
})
list.value.push('关联组件')
list.value.unshift('关联组件')
list.value.push('部署与安全')
list.value.push('归属部门与服务商')
navList.value.forEach((item) => {
console.log(item)
if (list.value.indexOf(item.name) > -1) {
if (item.name == '关联组件') {
if (
props.associatedComponents[0].dataList.length != 0 ||
props.associatedComponents[1].dataList.length != 0 ||
props.associatedComponents[2].dataList.length != 0
) {
item.show = true
}
} else {
item.show = true
}
}
})
if (list.value.length > 0) {
if (navList.value.filter((item) => item.name === list.value[0])[0]) {
select.value = navList.value.filter(
(item) => item.name === list.value[0]
(item) => (item.name === '关联组件') | (item.name === list.value[0])
)[0].key
console.log('11111111111111111111111111', list.value, navList.value)
}
watch(
}
console.log('11111111111111111111111111', list.value, navList.value)
}
watch(
() => props.selectNow,
(newValue) => {
select.value = newValue
}
)
watch(
)
watch(
() => props.dataList,
(val) => {
if (val) {
@ -127,37 +134,30 @@
list.value.push('应用展示')
}
})
list.value.push('关联组件')
list.value.unshift('关联组件')
list.value.push('部署与安全')
list.value.push('归属部门与服务商')
navList.value.forEach((item) => {
console.log(item)
if (list.value.indexOf(item.name) > -1) {
if (item.name == '关联组件') {
if (
props.associatedComponents[0].dataList.length != 0 ||
props.associatedComponents[1].dataList.length != 0 ||
props.associatedComponents[2].dataList.length != 0
) {
item.show = true
}
} else {
item.show = true
}
}
})
if (list.value.length > 0) {
if (navList.value.filter((item) => item.name === list.value[0])[0]) {
select.value = navList.value.filter(
(item) => item.name === list.value[0]
(item) =>
(item.name === '关联组件') | (item.name === list.value[0])
)[0].key
}
}
console.log('11111111111111111111111111', list.value, navList.value)
}
}
)
)
</script>
<style lang="less" scoped>
.application-navigation {
.application-navigation {
width: 19.12rem;
height: 0.84rem;
line-height: 0.8rem;
@ -169,22 +169,26 @@
padding: 0 3rem;
box-shadow: 0rem 0.05rem 0.1rem #f2f3fb;
position: relative;
.nav {
cursor: pointer;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
.line {
width: 0.4rem;
height: 0.04rem;
}
}
.select {
color: #526aff;
.line {
background: #526aff;
}
}
}
}
</style>

70
front/src/views/detailsAll/components/Application/ApplicationOwningDepartmentAndServiceProvider.vue
View File

@ -2,17 +2,10 @@
<template>
<div class="application-deployment-and-security">
<div class="title">
<DetalsTitle
:title="dataFrom.title"
:type="dataFrom.englishTitle"
></DetalsTitle>
<DetalsTitle :title="dataFrom.title" :type="dataFrom.englishTitle"></DetalsTitle>
</div>
<div class="content">
<div
v-for="(item, index) in dataFrom.content"
:key="index"
class="content-card"
>
<div v-for="(item, index) in dataFrom.content" :key="index" class="content-card">
<div class="card-title">{{ item.childrenTitle }}</div>
<div class="card-content">
<div v-for="carditem in item.childrenContent" :key="carditem">
@ -31,9 +24,9 @@
</template>
<script setup>
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue'
let dataFrom = ref({
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { ref, defineProps, watch } from 'vue'
let dataFrom = ref({
title: '归属部门与服务商',
englishTitle: 'DEPARTMENT&ERVICE',
content: [
@ -46,13 +39,13 @@
childrenContent: [],
},
],
})
console.log(dataFrom.value)
//数据初始化
const props = defineProps({
})
console.log(dataFrom.value)
//数据初始化
const props = defineProps({
dataList: { type: Object, default: null },
})
if (props.dataList.infoList) {
})
if (props.dataList.infoList) {
let obj = {
attrType: '部门名称',
attrValue: props.dataList.deptName || '------',
@ -60,12 +53,12 @@
dataFrom.value.content[0].childrenContent[0] = obj
let deptContacts = {
attrType: '部门联系人',
attrValue: props.dataList.deptContacts || '------',
attrValue: '',
}
dataFrom.value.content[0].childrenContent[1] = deptContacts
let deptPhone = {
attrType: '部门联系人',
attrValue: props.dataList.deptPhone || '------',
attrType: '部门联系电话',
attrValue: '',
}
dataFrom.value.content[0].childrenContent[2] = deptPhone
props.dataList.infoList.map((item) => {
@ -94,11 +87,16 @@
dataFrom.value.content[1].childrenContent[2].attrValue = '------'
}
}
} else if (item.attrType === '部门联系人') {
deptContacts.attrValue = item.attrValue || '------'
} else if (item.attrType === '部门联系人电话') {
deptPhone.attrValue = item.attrValue || '------'
}
})
console.log('obj', dataFrom.value)
}
watch(
}
watch(
() => props.dataList,
(val) => {
if (val) {
@ -115,7 +113,7 @@
}
dataFrom.value.content[0].childrenContent[1] = deptContacts
let deptPhone = {
attrType: '部门联系人',
attrType: '部门联系电话',
attrValue: props.dataList.deptPhone || '------',
}
dataFrom.value.content[0].childrenContent[2] = deptPhone
@ -154,54 +152,63 @@
'------'
}
}
} else if (item.attrType === '部门联系人') {
deptContacts.attrValue = item.attrValue || '------'
} else if (item.attrType === '部门联系人电话') {
deptPhone.attrValue = item.attrValue || '------'
}
})
console.log('obj', dataFrom.value)
}
}
)
)
</script>
<style lang="less" scoped>
.application-deployment-and-security {
.application-deployment-and-security {
padding: 0.8rem 0;
display: flex;
flex-direction: column;
align-items: center;
.title {
margin-bottom: 0.3rem;
}
.content {
display: flex;
width: 13rem;
justify-content: space-between;
.content-card {
height: 1.5rem;
width: 6.2rem;
border-radius: 0.2rem;
background: linear-gradient(
to right,
background: linear-gradient(to right,
rgba(113, 132, 252, 0.4),
rgba(148, 163, 252, 0.4)
);
rgba(148, 163, 252, 0.4));
padding: 0 0.3rem;
display: flex;
flex-direction: column;
justify-content: center;
.card-title {
font-size: 0.26rem;
color: #212956;
margin-bottom: 0.2rem;
line-height: 0.26rem;
}
.card-content {
white-space: nowrap;
div {
display: inline-block;
margin-right: 0.2rem;
color: rgba(33, 41, 86, 0.8);
font-size: 0.2rem;
max-width: 2.8rem;
div {
max-width: 2.8rem;
overflow: hidden;
@ -211,11 +218,12 @@
-webkit-line-clamp: 1;
}
}
div:first-child {
display: block;
}
}
}
}
}
}
</style>

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

@ -8,15 +8,10 @@
<template>
<div class="application-presentation" v-if="flag">
<detals-title title="应用展示" type="IMAGE&VIDEO"></detals-title>
<div class="main">
<div class="main" :style="`${img}background-position:center;background-size:cover;`">
<div class="play" @click="showModal"></div>
</div>
<a-modal
v-model:visible="visible"
title="视频预览"
:width="750"
destroyOnClose
>
<a-modal v-model:visible="visible" title="视频预览" :width="750" destroyOnClose>
<template #footer></template>
<div style="width: 100%; display: flex; justify-content: center">
<div style="width: 100%; height: 100%">
@ -27,10 +22,10 @@
</div>
</template>
<script setup>
import { ref, reactive, defineProps, watch } from 'vue'
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
const visible = ref(false)
const options = reactive({
import { ref, reactive, defineProps, watch } from 'vue'
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
const visible = ref(false)
const options = reactive({
width: '7.00rem', //播放器宽度
height: '4.00rem', //播放器高度
color: '#409eff', //主题色
@ -55,16 +50,17 @@
'pageFullScreen',
'fullScreen',
], //显示所有按钮,
})
const showModal = () => {
})
const showModal = () => {
visible.value = true
}
const props = defineProps({
}
const props = defineProps({
dataList: { type: Object, default: null },
})
const flag = ref(true)
console.log('111111111111111111111,', props.dataList)
if (props.dataList.infoList) {
})
const flag = ref(true)
const img = ref({})
console.log('111111111111111111111,', props.dataList)
if (props.dataList.infoList) {
let obj = props.dataList.infoList.filter(
(item) => item.attrType === '应用展示视频'
)[0]
@ -72,10 +68,16 @@
if (!obj) {
flag.value = false
} else {
let imgindex = props.dataList.infoList.filter(
(item) => item.attrType === '应用图片'
)[0]
options.src = obj.attrValue
if (imgindex) {
img.value = 'background:' + 'url(' + imgindex.attrValue + ') no-repeat;'
}
}
watch(
}
watch(
() => props.dataList,
(val) => {
if (val) {
@ -86,15 +88,23 @@
if (!obj) {
flag.value = false
} else {
let imgindex = props.dataList.infoList.filter(
(item) => item.attrType === '应用图片'
)[0]
options.src = obj.attrValue
if (imgindex) {
img.value =
'background:' + 'url(' + imgindex.attrValue + ') no-repeat;'
}
}
}
)
}
)
</script>
<style lang="less" scoped>
.application-presentation {
.application-presentation {
padding: 0.8rem 3rem 0;
.main {
height: 3.4rem;
border-radius: 0.1rem;
@ -104,6 +114,7 @@
display: flex;
justify-content: center;
align-items: center;
.play {
width: 0.96rem;
height: 0.96rem;
@ -112,5 +123,5 @@
cursor: pointer;
}
}
}
}
</style>

31
front/src/views/detailsAll/components/Application/style.css Normal file
View File

@ -0,0 +1,31 @@
.swiper {
width: 100%;
height: 100%;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.swiper-slide img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}

92
front/src/views/detailsAll/components/Business/BusinessAssociatedAbility.vue
View File

@ -1,30 +1,79 @@
<template>
<div class="application-associated-ability" v-if="flag">
<detals-title title="关联应用" type="RELEVANCE"></detals-title>
<div class="application-associated-ability-main">
<detals-title title="关联应用" type="ASSOCIATED"></detals-title>
<div
class="application-associated-ability-main"
v-if="dataFrom[0].dataList.length < 4"
>
<div
class="associated-ability-card"
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
@click="switchFunction(dataListitem.id)"
>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description }}
</div>
</a-tooltip>
</div>
</div>
</div>
<div class="application-associated-ability-main" v-else>
<swiper
:slidesPerView="3"
:spaceBetween="30"
:pagination="{ clickable: true }"
:modules="modules"
class="mySwiper"
@swiper="onSwiper"
@slideChange="onSlideChange"
>
<swiper-slide
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
>
<div
class="associated-ability-card"
@click="switchFunction(dataListitem.id)"
>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description }}
</div>
</a-tooltip>
</div>
</div>
</swiper-slide>
</swiper>
</div>
</div>
</template>
<script setup>
import { ref, defineProps, watch } from 'vue'
import { useRouter } from 'vue-router'
import { Navigation, Pagination, Scrollbar, A11y } from 'swiper'
import { Swiper, SwiperSlide } from 'swiper/vue/swiper-vue.js'
import 'swiper/swiper-bundle.min.css'
const router = useRouter()
const modules = ref([Pagination])
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
const props = defineProps({
associatedComponents: { type: Array, default: null },
@ -34,17 +83,20 @@
const oldid = router.currentRoute.value.query.id
//点击查看详情
const switchFunction = (id) => {
router.push({
path: '/details',
query: {
id: id,
},
})
// router.push({
// path: '/details',
// query: {
// id: id,
// },
// })
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + id)
// alert(id)
}
if (props.associatedComponents[0].dataList.length != 0) {
console.log('这个是空值', props.associatedComponents[0])
if (props.associatedComponents[0].dataList.length > 0) {
console.log('这个是空值', props.associatedComponents)
flag.value = true
dataFrom.value = props.associatedComponents
debugger
console.log('dataFrom.value', dataFrom.value)
} else {
flag.value = false
@ -75,7 +127,7 @@
<style lang="less" scoped>
.application-associated-ability {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
padding-bottom: 0.6rem;
display: flex;
flex-direction: column;
align-items: center;
@ -83,20 +135,31 @@
margin-top: 0.4rem;
width: 13.3rem;
display: flex;
justify-content: space-between;
justify-content: space-around;
:deep(.swiper) {
padding-bottom: 0.6rem;
}
.associated-ability-card {
width: 3.2rem;
height: 2.78rem;
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid #e4e6f5;
border-radius: 0.1rem;
padding-bottom: 0.3rem;
margin-right: 0.2rem;
margin-top: 0.2rem;
cursor: pointer;
.associated-ability-card-title {
width: 2.2rem;
padding-top: 0.3rem;
font-size: 0.22rem;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.associated-ability-card-content {
width: 100%;
@ -107,6 +170,11 @@
color: #999;
margin-right: 0.15rem;
margin-top: 0.15rem;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
}
}

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

@ -8,12 +8,7 @@
<template>
<div class="business-navigation" v-if="navList.length > 0">
<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 }}
<span class="line"></span>
</div>
@ -21,17 +16,18 @@
</div>
</template>
<script setup>
import { ref, defineProps, watch } from 'vue'
import mybus from '@/myplugins/mybus'
const navList = ref([
import { ref, defineProps, watch, getCurrentInstance } from 'vue'
import { useRouter } from 'vue-router'
import mybus from '@/myplugins/mybus'
import { queryPartAppByKeyId2 } from '@/api/home'
// 获取当前路由地址
const router = useRouter()
const keyId = router.currentRoute.value.query.id
const navList = ref([
{
name: '组件展示',
key: 'business-presentation',
},
{
name: '关联应用',
key: 'business-associated-ability',
},
{
name: '功能介绍',
key: 'function-introduction',
@ -53,24 +49,40 @@
name: '常见问题',
key: 'common-problem',
},
])
const props = defineProps({
])
const props = defineProps({
associatedComponents: { type: Array, default: null },
selectNow: { type: String, default: '' },
dataList: { type: Object, default: null },
})
const select = ref('business-associated-ability')
const list = ref([])
// 根据能力id查询是否存在关联应用
if (keyId) {
queryPartAppByKeyId2({ keyId: keyId }).then((res) => {
console.log('ressssssss', res)
if (res.data.data.length > 0) {
// 存在关联应用时在导航栏加入关联应用
navList.value.unshift({
name: '关联应用',
key: 'business-associated-ability',
show: true,
})
const select = ref('business-presentation')
const list = ref([])
const selectNav = (key) => {
// list.value.push('关联应用')
console.log('navList', navList)
}
})
}
const selectNav = (key) => {
select.value = key
console.log(key, select.value)
mybus.emit('flyToView', select.value)
}
if (props.dataList.infoList) {
}
if (props.dataList.infoList) {
list.value = []
let arr = [
'组件视频介绍',
'关联应用',
'组件视频介绍',
'功能介绍',
'应用场景',
'应用案例',
@ -94,7 +106,7 @@
list.value.push('组件展示')
}
})
list.value.push('关联应用')
list.value.unshift('关联应用')
list.value.push('使用方式')
navList.value.forEach((item) => {
console.log(item)
@ -108,25 +120,29 @@
}
}
})
if (list.value.length > 0) {
if (navList.value.filter((item) => item.name === list.value[0])[0]) {
select.value = navList.value.filter(
(item) => item.name === list.value[0]
(item) => (item.name === '关联应用') | (item.name === list.value[0])
)[0].key
console.log('11111111111111111111111111', list.value, navList.value)
}
watch(
}
console.log('11111111111111111111111111', list.value, navList.value)
}
watch(
() => props.selectNow,
(newValue) => {
select.value = newValue
}
)
watch(
)
watch(
() => props.dataList,
(val) => {
if (val) {
list.value = []
let arr = [
'组件视频介绍',
'关联应用',
'组件视频介绍',
'功能介绍',
'应用场景',
'应用案例',
@ -151,7 +167,7 @@
list.value.push('组件展示')
}
})
list.value.push('关联应用')
list.value.unshift('关联应用')
list.value.push('使用方式')
navList.value.forEach((item) => {
console.log(item)
@ -166,17 +182,20 @@
}
})
if (list.value.length > 0) {
if (navList.value.filter((item) => item.name === list.value[0])[0]) {
select.value = navList.value.filter(
(item) => item.name === list.value[0]
(item) =>
(item.name === '关联应用') | (item.name === list.value[0])
)[0].key
}
}
console.log('11111111111111111111111111', list.value, navList.value)
}
}
)
)
</script>
<style lang="less" scoped>
.business-navigation {
.business-navigation {
width: 19.12rem;
height: 0.84rem;
line-height: 0.8rem;
@ -188,22 +207,26 @@
padding: 0 3rem;
box-shadow: 0rem 0.05rem 0.1rem #f2f3fb;
position: relative;
.nav {
cursor: pointer;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
.line {
width: 0.4rem;
height: 0.04rem;
}
}
.select {
color: #526aff;
.line {
background: #526aff;
}
}
}
}
</style>

92
front/src/views/detailsAll/components/Business/BusinessTopDetails.vue
View File

@ -2,7 +2,7 @@
* @Author: hisense.liangjunhua
* @Date: 2022-06-08 11:56:28
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-07-01 14:20:52
* @LastEditTime: 2022-07-05 11:42:27
* @Description: 算法详情页头部
-->
<template>
@ -29,8 +29,8 @@
</div>
<div class="main">
<a-tooltip placement="top">
<template #title>应用领域：{{ applicationArea }}</template>
<div>应用领域：{{ applicationArea }}</div>
<template #title>应用领域：{{ businessArea }}</template>
<div>应用领域：{{ businessArea }}</div>
</a-tooltip>
<a-tooltip placement="top">
<template #title>{{ props.dataList.description }}</template>
@ -41,11 +41,15 @@
</div>
<div class="bottom" v-if="props.dataList.id">
<a-button type="primary" @click="toView()">
<template #icon><form-outlined /></template>
<template #icon>
<form-outlined />
</template>
申请使用
</a-button>
<a-button type="primary" @click="addShoppingCart()">
<template #icon><shopping-cart-outlined /></template>
<template #icon>
<shopping-cart-outlined />
</template>
加入申购车
</a-button>
<a-button type="primary" @click="goTOCollection()">收藏</a-button>
@ -55,20 +59,20 @@
</div>
</template>
<script setup>
import { ShoppingCartOutlined } from '@ant-design/icons-vue'
import { defineProps, ref, watch } from 'vue'
import { scInsert } from '@/api/personalCenter'
import { sgcInsert } from '@/api/home'
import { useRouter } from 'vue-router'
import mybus from '@/myplugins/mybus'
import { message } from 'ant-design-vue'
const props = defineProps({
import { ShoppingCartOutlined } from '@ant-design/icons-vue'
import { defineProps, ref, watch } from 'vue'
import { scInsert } from '@/api/personalCenter'
import { sgcInsert } from '@/api/home'
import { useRouter } from 'vue-router'
import mybus from '@/myplugins/mybus'
import { message } from 'ant-design-vue'
const props = defineProps({
dataList: { type: Object, default: null },
})
const router = useRouter()
const businessArea = ref('')
// // 加入申购车
const addShoppingCart = () => {
})
const router = useRouter()
const businessArea = ref('')
// // 加入申购车
const addShoppingCart = () => {
console.log('加入申购车==================>', props.dataList)
sgcInsert({
delFlag: '0',
@ -79,9 +83,9 @@
message.success('添加申购车成功！')
mybus.emit('getSgcNum')
})
}
// // 立即申请
function toView() {
}
// // 立即申请
function toView() {
// window.open(newpage.href, '_blank')
console.log('一键申请===================>', props.dataList)
localStorage.setItem(
@ -96,6 +100,7 @@
resourceName: props.dataList.name,
time: props.dataList.createDate,
type: props.dataList.type,
componentType: '业务组件',
},
],
deptId: props.dataList.deptId,
@ -106,17 +111,17 @@
router.push({
path: '/apply',
})
}
// 收藏
const goTOCollection = () => {
}
// 收藏
const goTOCollection = () => {
console.log('收藏===================》', props.dataList)
scInsert([{ resourceId: props.dataList.id }]).then((res) => {
console.log(res)
message.success('收藏成功')
})
}
const componentType = ref('')
if (props.dataList.infoList) {
}
const componentType = ref('')
if (props.dataList.infoList) {
businessArea.value = props.dataList.infoList.filter(
(val) => val.attrType === '应用领域'
)[0].attrValue
@ -126,8 +131,8 @@
if (obj) {
componentType.value = obj.attrValue
}
}
watch(
}
watch(
() => props.dataList,
(val) => {
if (val) {
@ -142,16 +147,17 @@
}
}
}
)
)
</script>
<style lang="less" scoped>
.algorithm-top-details {
.algorithm-top-details {
height: 6rem;
padding: 1.8rem 0 0;
background: url('~@/assets/detailsAll/sf_top_bg.png') no-repeat;
background-size: 100%;
display: flex;
justify-content: center;
.left {
max-width: 7.2rem;
color: #fff;
@ -160,9 +166,11 @@
.top {
display: flex;
align-items: center;
span {
font-size: 0.14rem;
}
.name {
// max-width: 3.3rem;
// overflow: hidden;
@ -178,15 +186,18 @@
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.label-content {
position: relative;
}
.lable-father {
position: absolute;
min-width: 3.5rem;
right: -3.5rem;
top: 0;
}
.label {
padding: 0.01rem 0.1rem;
margin-right: 0.1rem;
@ -194,16 +205,19 @@
background: rgba(255, 255, 255, 0.4);
}
}
.main {
margin-top: 0.2rem;
font-size: 0.18rem;
line-height: 0.34rem;
& > div:nth-of-type(1) {
&>div:nth-of-type(1) {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
& > div:nth-of-type(2) {
&>div:nth-of-type(2) {
max-height: 1rem;
overflow: hidden;
text-overflow: ellipsis;
@ -212,9 +226,11 @@
-webkit-box-orient: vertical;
}
}
.bottom {
margin-top: 0.4rem;
display: flex;
.ant-btn {
height: 0.5rem;
margin-right: 0.2rem;
@ -225,15 +241,19 @@
justify-content: center;
align-items: center;
}
.ant-btn-primary {
color: #1890ff;
}
.ant-btn:nth-of-type(1) {
width: 1.8rem;
}
.ant-btn:nth-of-type(2) {
width: 2.2rem;
}
.ant-btn:nth-of-type(3) {
width: 1.45rem;
background: #fff;
@ -241,13 +261,13 @@
}
}
}
.right {
width: 5.8rem;
height: 4rem;
background: url('~@/assets/detailsAll/business/business_right_bg.png')
no-repeat;
background: url('~@/assets/detailsAll/business/business_right_bg.png') no-repeat;
background-size: 100%;
margin-top: -0.4rem;
}
}
}
</style>

77
front/src/views/detailsAll/components/Business/BusinessUsageMode.vue
View File

@ -2,10 +2,7 @@
<!-- 使用方式 -->
<div class="usage-mode" v-if="flag">
<div class="tltle">
<DetalsTitle
:title="dataFrom.title"
:type="dataFrom.englishTitle"
></DetalsTitle>
<DetalsTitle :title="dataFrom.title" :type="dataFrom.englishTitle"></DetalsTitle>
</div>
<div class="content" v-for="item in dataFrom.content" :key="item.title">
<div class="content-left">
@ -16,7 +13,10 @@
<div class="content-left-content">
<p>
<span>{{ item.link.name }}</span>
<a-tooltip>
<template #title>{{ item.linkValue }}</template>
<span>{{ item.linkValue }}</span>
</a-tooltip>
</p>
</div>
</div>
@ -30,7 +30,7 @@
<div class="content-right-title">{{ item.contact }}</div>
<div class="content-right-content">
<p>
<span>{{ item.contact }}</span>
<span>{{ item.facilitator.name }}</span>
<a-tooltip>
<template #title>{{ item.facilitator.value }}</template>
<span>{{ item.facilitator.value }}</span>
@ -56,7 +56,7 @@
<div class="content-right-title">{{ item.contact2 }}</div>
<div class="content-right-content">
<p>
<span>{{ item.contact2 }}</span>
<span>{{ item.facilitator2.name }}</span>
<a-tooltip>
<template #title>{{ item.facilitator2.value }}</template>
<span>{{ item.facilitator2.value }}</span>
@ -84,10 +84,10 @@
</template>
<script setup>
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { pinyin } from 'pinyin-pro'
import { ref, defineProps, watch } from 'vue'
let dataFrom = ref({
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
import { pinyin } from 'pinyin-pro'
import { ref, defineProps, watch } from 'vue'
let dataFrom = ref({
title: '使用方式',
englishTitle: 'USAGE',
content: [
@ -113,13 +113,13 @@
},
},
],
})
//数据初始化
const props = defineProps({
})
//数据初始化
const props = defineProps({
dataList: { type: Object, default: null },
})
const flag = ref(true)
if (props.dataList.infoList) {
})
const flag = ref(true)
if (props.dataList.infoList) {
let obj = props.dataList.infoList.filter(
(item) =>
item.attrType === '技术文档' ||
@ -151,8 +151,8 @@
}
})
}
}
watch(
}
watch(
() => props.dataList,
(val) => {
if (val) {
@ -189,8 +189,8 @@
}
}
}
)
function technical() {
)
function technical() {
// 拼接路径
// const type = pinyin(props.dataList.type, {
// pattern: 'initial',
@ -208,8 +208,8 @@
'hisense_office/onlinePreview?url=' +
btoa(encodeURI(obj.attrValue))
)
}
function technicalNew() {
}
function technicalNew() {
// 拼接路径
// const type = pinyin(props.dataList.type, {
// pattern: 'initial',
@ -226,23 +226,24 @@
'hisense_office/onlinePreview?url=' +
btoa(encodeURI(obj.attrValue))
)
}
}
</script>
<style lang="less" scoped>
.usage-mode {
.usage-mode {
display: flex;
flex-direction: column;
align-items: center;
padding: 0.8rem 0;
.content {
margin-top: 0.3rem;
display: flex;
.content-left {
height: 1.5rem;
width: 6.2rem;
background: url('~@/assets/detailsAll/business/business_usage_mode_bg.png')
no-repeat;
background: url('~@/assets/detailsAll/business/business_usage_mode_bg.png') no-repeat;
background-position: center;
background-size: 100% 100%;
border-radius: 0.1rem;
@ -251,30 +252,40 @@
display: flex;
align-items: center;
padding: 0 0.35rem;
.left {
.content-left-title {
font-size: 0.26rem;
line-height: 0.26rem;
color: #212956;
margin-bottom: 0.2rem;
span:first-child {
margin-right: 0.1rem;
}
}
.content-left-content {
width: 4.2rem;
font-size: 0.2rem;
color: rgba(33, 41, 86, 0.8);
line-height: 0.2rem;
p {
display: -webkit-box;
margin-bottom: 0.1rem;
span:last-of-type {
width: 298px;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
margin-bottom: 0.1rem;
}
}
}
}
.right {
div {
height: 0.4rem;
@ -288,16 +299,17 @@
align-items: center;
cursor: pointer;
}
div:first-child {
margin-bottom: 0.2rem;
}
}
}
.content-right {
height: 1.5rem;
width: 6.2rem;
background: url('~@/assets/detailsAll/business/business_usage_mode_bg.png')
no-repeat;
background: url('~@/assets/detailsAll/business/business_usage_mode_bg.png') no-repeat;
background-position: center;
background-size: 100% 100%;
border-radius: 0.1rem;
@ -306,17 +318,20 @@
justify-content: space-around;
align-items: center;
padding: 0 0.3rem;
.content-right-left {
border-right: 0.01rem solid #707fe0;
padding-right: 0.1rem;
margin-right: 0.1rem;
}
.content-right-title {
font-size: 0.26rem;
line-height: 0.26rem;
color: #212956;
margin-bottom: 0.15rem;
}
.content-right-content {
display: flex;
font-size: 0.16rem;
@ -326,6 +341,7 @@
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
flex-direction: column;
p {
// width: 1.60rem;
height: 0.2rem;
@ -336,6 +352,7 @@
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
margin-right: 0.15rem;
span {
cursor: pointer;
}
@ -343,5 +360,5 @@
}
}
}
}
}
</style>

2
front/src/views/detailsAll/components/Developer/DeveloperApplicationScenarios.vue
View File

@ -71,7 +71,6 @@
dataList: { type: Object, default: null },
})
if (props.dataList.infoList) {
debugger
let obj = props.dataList.infoList.filter(
(item) => item.attrType === '应用场景'
)[0]
@ -79,7 +78,6 @@
flag.value = false
} else {
obj.attrValue = JSON.parse(obj.attrValue)
debugger
dataFrom.value = obj
tabindex.value = dataFrom.value.attrValue[0].name
}

96
front/src/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue
View File

@ -1,30 +1,79 @@
<template>
<div class="application-associated-ability" v-if="flag">
<detals-title title="关联应用" type="RELEVANCE"></detals-title>
<div class="application-associated-ability-main">
<detals-title title="关联应用" type="ASSOCIATED"></detals-title>
<div
class="application-associated-ability-main"
v-if="dataFrom[0].dataList.length < 4"
>
<div
class="associated-ability-card"
v-for="dataListitem in dataFrom[0].dataList"
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
@click="switchFunction(dataListitem.id)"
>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description }}
</div>
</a-tooltip>
</div>
</div>
</div>
<div class="application-associated-ability-main" v-else>
<swiper
:slidesPerView="3"
:spaceBetween="30"
:pagination="{ clickable: true }"
:modules="modules"
class="mySwiper"
@swiper="onSwiper"
@slideChange="onSlideChange"
>
<swiper-slide
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
>
<div
class="associated-ability-card"
@click="switchFunction(dataListitem.id)"
>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description }}
</div>
</a-tooltip>
</div>
</div>
</swiper-slide>
</swiper>
</div>
</div>
</template>
<script setup>
import { ref, defineProps, watch } from 'vue'
import { useRouter } from 'vue-router'
import { Navigation, Pagination, Scrollbar, A11y } from 'swiper'
import { Swiper, SwiperSlide } from 'swiper/vue/swiper-vue.js'
import 'swiper/swiper-bundle.min.css'
const router = useRouter()
const modules = ref([Pagination])
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
const props = defineProps({
associatedComponents: { type: Array, default: null },
@ -34,17 +83,20 @@
const oldid = router.currentRoute.value.query.id
//点击查看详情
const switchFunction = (id) => {
router.push({
path: '/details',
query: {
id: id,
},
})
// router.push({
// path: '/details',
// query: {
// id: id,
// },
// })
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + id)
// alert(id)
}
if (props.associatedComponents[0].dataList.length != 0) {
console.log('这个是空值', props.associatedComponents[0])
if (props.associatedComponents[0].dataList.length > 0) {
console.log('这个是空值', props.associatedComponents)
flag.value = true
dataFrom.value = props.associatedComponents
debugger
console.log('dataFrom.value', dataFrom.value)
} else {
flag.value = false
@ -63,7 +115,7 @@
)
watch(
() => router.currentRoute.value.query.id,
() => {
(newValue, oldValue) => {
if (oldid != router.currentRoute.value.query.id) {
window.location.reload()
}
@ -75,7 +127,7 @@
<style lang="less" scoped>
.application-associated-ability {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
padding-bottom: 0.6rem;
display: flex;
flex-direction: column;
align-items: center;
@ -83,20 +135,31 @@
margin-top: 0.4rem;
width: 13.3rem;
display: flex;
justify-content: space-between;
justify-content: space-around;
:deep(.swiper) {
padding-bottom: 0.6rem;
}
.associated-ability-card {
width: 3.2rem;
height: 2.78rem;
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid #e4e6f5;
border-radius: 0.1rem;
padding-bottom: 0.3rem;
margin-right: 0.2rem;
margin-top: 0.2rem;
cursor: pointer;
.associated-ability-card-title {
width: 2.2rem;
padding-top: 0.3rem;
font-size: 0.22rem;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.associated-ability-card-content {
width: 100%;
@ -107,6 +170,11 @@
color: #999;
margin-right: 0.15rem;
margin-top: 0.15rem;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
}
}

64
front/src/views/detailsAll/components/Developer/DeveloperNavigation.vue
View File

@ -21,17 +21,18 @@
</div>
</template>
<script setup>
import { ref, defineProps, watch } from 'vue'
import { ref, defineProps, watch, getCurrentInstance } from 'vue'
import { useRouter } from 'vue-router'
import mybus from '@/myplugins/mybus'
import { queryPartAppByKeyId2 } from '@/api/home'
// 获取当前路由地址
const router = useRouter()
const keyId = router.currentRoute.value.query.id
const navList = ref([
{
name: '组件展示',
key: 'eveloper-presentation',
},
{
name: '关联应用',
key: 'developer-associated-ability',
},
{
name: '功能介绍',
key: 'function-introduction',
@ -60,10 +61,26 @@
const props = defineProps({
selectNow: { type: String, default: '' },
dataList: { type: Object, default: null },
associatedComponents: { type: Array, default: null },
associatedComponents: { type: Object, default: null },
})
const select = ref('algorithm-display')
const select = ref('developer-associated-ability')
const list = ref([])
// 根据能力id查询是否存在关联应用
if (keyId) {
queryPartAppByKeyId2({ keyId: keyId }).then((res) => {
console.log('ressssssss', res)
if (res.data.data.length > 0) {
// 存在关联应用时在导航栏加入关联应用
navList.value.unshift({
name: '关联应用',
key: 'developer-associated-ability',
show: true,
})
// list.value.push('关联应用')
console.log('navList', navList)
}
})
}
const selectNav = (key) => {
select.value = key
mybus.emit('flyToView', select.value)
@ -81,17 +98,17 @@
list.value.push('组件展示')
}
})
list.value.push('关联应用')
list.value.unshift('关联应用')
navList.value.forEach((item) => {
console.log(item)
if (list.value.indexOf(item.name) > -1) {
if (item.name == '关联应用') {
if (props.associatedComponents[0].dataList.length != 0) {
// if (item.name == '关联应用') {
// if (props.associatedComponents[0].dataList.length != 0) {
// item.show = true
// }
// } else {
item.show = true
}
} else {
item.show = true
}
// }
}
})
select.value = navList.value.filter(
@ -122,26 +139,29 @@
list.value.push('组件展示')
}
})
list.value.push('关联应用')
list.value.unshift('关联应用')
list.value.push('组件试用')
list.value.push('使用方式')
navList.value.forEach((item) => {
console.log(item)
if (list.value.indexOf(item.name) > -1) {
if (item.name == '关联应用') {
if (props.associatedComponents[0].dataList.length != 0) {
// if (item.name == '关联应用') {
// if (props.associatedComponents[0].dataList.length != 0) {
// item.show = true
// }
// } else {
item.show = true
}
} else {
item.show = true
}
// }
}
})
if (list.value.length > 0) {
if (navList.value.filter((item) => item.name === list.value[0])[0]) {
select.value = navList.value.filter(
(item) => item.name === list.value[0]
(item) =>
(item.name === '关联应用') | (item.name === list.value[0])
)[0].key
}
}
console.log('11111111111111111111111111', list.value, navList.value)
}
}

25
front/src/views/detailsAll/components/Developer/DeveloperOwningDepartmentAndServiceProvider.vue
View File

@ -57,6 +57,10 @@
{
childrenTitle: '归属部门',
childrenContent: [
{
attrType: '归属部门名称',
attrValue: '------',
},
{
attrType: '部门联系人',
attrValue: '------',
@ -65,15 +69,15 @@
attrType: '联系人电话',
attrValue: '------',
},
{
attrType: '归属部门名称',
attrValue: '------',
},
],
},
{
childrenTitle: '服务商信息',
childrenContent: [
{
attrType: '服务商名称',
attrValue: '------',
},
{
attrType: '服务商联系人',
attrValue: '------',
@ -82,10 +86,6 @@
attrType: '联系人电话',
attrValue: '------',
},
{
attrType: '服务商名称',
attrValue: '------',
},
],
},
],
@ -117,6 +117,9 @@
} else if (item.attrType == '服务商联系电话') {
dataFrom.value.content[1].childrenContent[1].attrValue =
item.attrValue
} else if (item.attrType == '服务商' || item.attrType == '服务商名') {
dataFrom.value.content[1].childrenContent[2].attrValue =
item.attrValue
}
})
}
@ -176,6 +179,12 @@
} else if (item.attrType == '服务商联系电话') {
dataFrom.value.content[1].childrenContent[1].attrValue =
item.attrValue
} else if (
item.attrType == '服务商' ||
item.attrType == '服务商名'
) {
dataFrom.value.content[1].childrenContent[2].attrValue =
item.attrValue
}
})
}

3
front/src/views/detailsAll/components/Developer/DeveloperTopDetails.vue
View File

@ -2,7 +2,7 @@
* @Author: hisense.liangjunhua
* @Date: 2022-06-08 11:56:28
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-07-01 14:21:04
* @LastEditTime: 2022-07-05 11:42:59
* @Description: 开发组件详情页头部
-->
<template>
@ -96,6 +96,7 @@
resourceName: props.dataList.name,
time: props.dataList.createDate,
type: props.dataList.type,
componentType: '开发组件',
},
],
deptId: props.dataList.deptId,

7
front/src/views/detailsAll/components/Developer/DeveloperTrial.vue
View File

@ -130,6 +130,13 @@
border-right: 0.01rem #ffffff solid;
padding-left: 0.7rem;
padding-right: 1rem;
& > p {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
}
.main-center {
padding-left: 1rem;

92
front/src/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue
View File

@ -1,30 +1,79 @@
<template>
<div class="application-associated-ability" v-if="flag">
<detals-title title="关联应用" type="RELEVANCE"></detals-title>
<div class="application-associated-ability-main">
<detals-title title="关联应用" type="ASSOCIATED"></detals-title>
<div
class="application-associated-ability-main"
v-if="dataFrom[0].dataList.length < 4"
>
<div
class="associated-ability-card"
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
@click="switchFunction(dataListitem.id)"
>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description }}
</div>
</a-tooltip>
</div>
</div>
</div>
<div class="application-associated-ability-main" v-else>
<swiper
:slidesPerView="3"
:spaceBetween="30"
:pagination="{ clickable: true }"
:modules="modules"
class="mySwiper"
@swiper="onSwiper"
@slideChange="onSlideChange"
>
<swiper-slide
v-for="(dataListitem, dataListindex) in dataFrom[0].dataList"
:key="dataListitem.id"
>
<div
class="associated-ability-card"
@click="switchFunction(dataListitem.id)"
>
<a-tooltip>
<template #title>{{ dataListitem.name }}</template>
<div class="associated-ability-card-title">
{{ dataListitem.name }}
</div>
</a-tooltip>
<div class="associated-ability-card-content">
<a-tooltip>
<template #title>{{ dataListitem.description }}</template>
<div class="associated-ability-card-content-font">
{{ dataListitem.description }}
</div>
</a-tooltip>
</div>
</div>
</swiper-slide>
</swiper>
</div>
</div>
</template>
<script setup>
import { ref, defineProps, watch } from 'vue'
import { useRouter } from 'vue-router'
import { Navigation, Pagination, Scrollbar, A11y } from 'swiper'
import { Swiper, SwiperSlide } from 'swiper/vue/swiper-vue.js'
import 'swiper/swiper-bundle.min.css'
const router = useRouter()
const modules = ref([Pagination])
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
const props = defineProps({
associatedComponents: { type: Array, default: null },
@ -34,17 +83,20 @@
const oldid = router.currentRoute.value.query.id
//点击查看详情
const switchFunction = (id) => {
router.push({
path: '/details',
query: {
id: id,
},
})
// router.push({
// path: '/details',
// query: {
// id: id,
// },
// })
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + id)
// alert(id)
}
if (props.associatedComponents[0].dataList.length != 0) {
console.log('这个是空值', props.associatedComponents[0])
if (props.associatedComponents[0].dataList.length > 0) {
console.log('这个是空值', props.associatedComponents)
flag.value = true
dataFrom.value = props.associatedComponents
debugger
console.log('dataFrom.value', dataFrom.value)
} else {
flag.value = false
@ -75,7 +127,7 @@
<style lang="less" scoped>
.application-associated-ability {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
padding-bottom: 0.6rem;
display: flex;
flex-direction: column;
align-items: center;
@ -83,20 +135,31 @@
margin-top: 0.4rem;
width: 13.3rem;
display: flex;
justify-content: space-between;
justify-content: space-around;
:deep(.swiper) {
padding-bottom: 0.6rem;
}
.associated-ability-card {
width: 3.2rem;
height: 2.78rem;
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid #e4e6f5;
border-radius: 0.1rem;
padding-bottom: 0.3rem;
margin-right: 0.2rem;
margin-top: 0.2rem;
cursor: pointer;
.associated-ability-card-title {
width: 2.2rem;
padding-top: 0.3rem;
font-size: 0.22rem;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.associated-ability-card-content {
width: 100%;
@ -107,6 +170,11 @@
color: #999;
margin-right: 0.15rem;
margin-top: 0.15rem;
text-align: center;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
}
}

89
front/src/views/detailsAll/components/LayerService/LayerServiceNavigation.vue
View File

@ -8,12 +8,7 @@
<template>
<div class="business-navigation" v-if="navList.length > 0">
<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 }}
<span class="line"></span>
</div>
@ -21,13 +16,14 @@
</div>
</template>
<script setup>
import { ref, defineProps, watch } from 'vue'
import mybus from '@/myplugins/mybus'
const navList = ref([
{
name: '关联应用',
key: 'layer-service-associated-ability',
},
import { ref, defineProps, watch, getCurrentInstance } from 'vue'
import { useRouter } from 'vue-router'
import mybus from '@/myplugins/mybus'
import { queryPartAppByKeyId2 } from '@/api/home'
// 获取当前路由地址
const router = useRouter()
const keyId = router.currentRoute.value.query.id
const navList = ref([
{
name: '图层展示',
key: 'service-presentation',
@ -56,20 +52,35 @@
name: '常见问题',
key: 'service-common-problem',
},
])
const props = defineProps({
])
const props = defineProps({
selectNow: { type: String, default: '' },
dataList: { type: Object, default: null },
associatedComponents: { type: Array, default: null },
})
const list = ref([])
// 根据能力id查询是否存在关联应用
if (keyId) {
queryPartAppByKeyId2({ keyId: keyId }).then((res) => {
console.log('ressssssss', res)
if (res.data.data.length > 0) {
// 存在关联应用时在导航栏加入关联应用
navList.value.unshift({
name: '关联应用',
key: 'layer-service-associated-ability',
show: true,
})
const select = ref('service-presentation')
const list = ref([])
const selectNav = (key) => {
list.value.unshift('关联应用')
}
})
}
const select = ref('layer-service-associated-ability')
const selectNav = (key) => {
select.value = key
console.log(key, select.value)
mybus.emit('flyToView', select.value)
}
if (props.dataList.infoList) {
}
if (props.dataList.infoList) {
list.value = []
let arr = [
'图层缩略图',
@ -122,31 +133,25 @@
list.value.push('使用方式')
}
})
list.value.push('关联应用')
list.value.unshift('关联应用')
navList.value.forEach((item) => {
console.log(item)
if (list.value.indexOf(item.name) > -1) {
if (item.name == '关联应用') {
if (props.associatedComponents[0].dataList.length != 0) {
item.show = true
}
} else {
item.show = true
}
}
})
select.value = navList.value.filter(
(item) => item.name === '图层展示'
(item) => item.name === list.value[0]
)[0].key
console.log('11111111111111111111111111', list.value, navList.value)
}
watch(
}
watch(
() => props.selectNow,
(newValue) => {
select.value = newValue
}
)
watch(
)
watch(
() => props.dataList,
(val) => {
if (val) {
@ -203,31 +208,25 @@
list.value.push('使用方式')
}
})
list.value.push('关联应用')
list.value.unshift('关联应用')
navList.value.forEach((item) => {
console.log(item)
if (list.value.indexOf(item.name) > -1) {
if (item.name == '关联应用') {
if (props.associatedComponents[0].dataList.length != 0) {
item.show = true
}
} else {
item.show = true
}
}
})
if (list.value.length > 0) {
select.value = navList.value.filter(
(item) => item.name === '图层展示'
(item) => item.name === list.value[0]
)[0].key
}
console.log('11111111111111111111111111', list.value, navList.value)
}
}
)
)
</script>
<style lang="less" scoped>
.business-navigation {
.business-navigation {
width: 19.12rem;
height: 0.84rem;
line-height: 0.8rem;
@ -239,22 +238,26 @@
padding: 0 3rem;
box-shadow: 0rem 0.05rem 0.1rem #f2f3fb;
position: relative;
.nav {
cursor: pointer;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
.line {
width: 0.4rem;
height: 0.04rem;
}
}
.select {
color: #526aff;
.line {
background: #526aff;
}
}
}
}
</style>

3
front/src/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue
View File

@ -2,7 +2,7 @@
* @Author: hisense.liangjunhua
* @Date: 2022-06-08 11:56:28
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-07-01 18:52:34
* @LastEditTime: 2022-07-05 11:43:18
* @Description: 算法详情页头部
-->
<template>
@ -96,6 +96,7 @@
resourceName: props.dataList.name,
time: props.dataList.createDate,
type: props.dataList.type,
componentType: '图层服务',
},
],
deptId: props.dataList.deptId,

63
front/src/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue
View File

@ -10,16 +10,20 @@
<div class="content" v-for="item in dataFrom.content" :key="item.title">
<div class="content-left">
<div class="left">
<div class="content-left-content">
<a-tooltip>
<template #title>{{ item.linkValue }}</template>
<p>
<span>服务地址：</span>
<span>{{ item.linkValue }}</span>
服务地址：
{{ item.linkValue }}
</p>
</a-tooltip>
<a-tooltip>
<template #title>{{ item.csslinkValue }}</template>
<p>
<span>样式服务地址：</span>
<span>{{ item.csslnkValue }}</span>
样式服务地址：
{{ item.csslinkValue }}
</p>
</div>
</a-tooltip>
</div>
<div class="right">
<div @click="technical()">接口文档</div>
@ -31,7 +35,7 @@
<div class="content-right-title">{{ item.contact }}</div>
<div class="content-right-content">
<p>
<span>{{ item.contact }}</span>
<span>{{ item.facilitator.name }}</span>
<a-tooltip>
<template #title>{{ item.facilitator.value }}</template>
<span>{{ item.facilitator.value }}</span>
@ -57,7 +61,7 @@
<div class="content-right-title">{{ item.contact2 }}</div>
<div class="content-right-content">
<p>
<span>{{ item.contact2 }}</span>
<span>{{ item.facilitator2.name }}</span>
<a-tooltip>
<template #title>{{ item.facilitator2.value }}</template>
<span>{{ item.facilitator2.value }}</span>
@ -99,6 +103,7 @@
name: '接口地址：',
},
linkValue: '',
csslinkValue: '',
contact: '归属部门',
facilitator: { name: '归属部门：', value: '' },
people: { name: '部门联系人：', value: '' },
@ -142,7 +147,7 @@
dataFrom.value.content[0].phone.value = props.dataList.deptPhone
console.log('dataList', props.dataList)
props.dataList.infoList.map((item) => {
if (item.attrType === '组件地址') {
if (item.attrType === '服务地址') {
dataFrom.value.content[0].linkValue = item.attrValue || '--'
} else if (item.attrType === '服务商') {
dataFrom.value.content[0].facilitator2.value = item.attrValue || '--'
@ -150,6 +155,8 @@
dataFrom.value.content[0].people2.value = item.attrValue || '--'
} else if (item.attrType === '服务商联系电话') {
dataFrom.value.content[0].phone2.value = item.attrValue || '--'
} else if (item.attrType === '样式服务地址') {
dataFrom.value.content[0].csslinkValue = item.attrValue || '--'
}
})
}
@ -177,7 +184,7 @@
dataFrom.value.content[0].phone.value = val.deptPhone
console.log('dataList', val)
val.infoList.map((item) => {
if (item.attrType === '组件地址') {
if (item.attrType === '服务地址') {
dataFrom.value.content[0].linkValue = item.attrValue || '--'
} else if (item.attrType === '服务商') {
dataFrom.value.content[0].facilitator2.value =
@ -186,6 +193,8 @@
dataFrom.value.content[0].people2.value = item.attrValue || '--'
} else if (item.attrType === '服务商联系电话') {
dataFrom.value.content[0].phone2.value = item.attrValue || '--'
} else if (item.attrType === '样式服务地址') {
dataFrom.value.content[0].csslinkValue = item.attrValue || '--'
}
})
}
@ -237,9 +246,11 @@
flex-direction: column;
align-items: center;
padding: 0.8rem 0;
.content {
margin-top: 0.3rem;
display: flex;
.content-left {
height: 1.8rem;
width: 6.2rem;
@ -254,36 +265,35 @@
display: flex;
align-items: center;
padding: 0 0.35rem;
.left {
.content-left-title {
font-size: 0.26rem;
line-height: 0.26rem;
color: #212956;
margin-bottom: 0.2rem;
span:first-child {
margin-right: 0.1rem;
}
}
.content-left-content {
width: 4.2rem;
font-size: 0.2rem;
color: rgba(33, 41, 86, 0.8);
line-height: 0.2rem;
p {
display: -webkit-box;
display: block;
color: rgba(33, 41, 86, 0.8);
width: 4.2rem;
overflow: hidden;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
// margin-bottom: 0.1rem;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 20px;
color: #212956;
line-height: 26px;
margin-top: 0.3rem;
}
p:last-of-type {
margin-top: 20px;
}
p:first-child {
margin-top: 0.2rem;
}
}
.right {
div {
height: 0.4rem;
@ -297,11 +307,13 @@
align-items: center;
cursor: pointer;
}
div:first-child {
margin-bottom: 0.2rem;
}
}
}
.content-right {
height: 1.8rem;
width: 6.2rem;
@ -316,17 +328,20 @@
justify-content: space-around;
align-items: center;
padding: 0 0.3rem;
.content-right-left {
border-right: 0.01rem solid #b0b9f1;
// border-right: 0.01rem solid #b0b9f1;
padding-right: 0.1rem;
margin-right: 0.1rem;
}
.content-right-title {
font-size: 0.26rem;
line-height: 0.26rem;
color: #212956;
margin-bottom: 0.15rem;
}
.content-right-content {
display: flex;
font-size: 0.16rem;
@ -336,6 +351,7 @@
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
flex-direction: column;
p {
// width: 1.60rem;
height: 0.2rem;
@ -345,6 +361,7 @@
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
margin-right: 0.15rem;
span {
cursor: pointer;
font-size: 20px;

112
front/src/views/home/AbilityToApplyFor.vue
View File

@ -1,6 +1,10 @@
<template>
<div class="ability-to-apply-for">
<div class="title">申请能力</div>
<div class="ability-to-apply-for" :class="{ all: falg }">
<div class="title">
<span>申请能力</span>
<span class="btn" @click="falg = !falg" v-show="!falg">展开</span>
<span class="btn" @click="falg = !falg" v-show="falg">收起</span>
</div>
<div
v-for="(item, index) in dataForm"
:key="index"
@ -12,6 +16,23 @@
</div>
<template v-for="val in item.arr" :key="val.resourceId">
<div class="item">
<div
class="tx"
:class="
val.type == '基础设施'
? 'sxt'
: val.componentType == '智能算法'
? 'znsf'
: val.componentType == '图层服务'
? 'tcfw'
: val.componentType == '开发组件'
? 'kfzj'
: val.componentType == '业务组件'
? 'ywzj'
: ''
"
></div>
<div class="text">
<div class="name">
<span>{{ val.resourceName }}</span>
<span>{{ val.type }}</span>
@ -27,6 +48,7 @@
'--'
}}
</div>
</div>
<div class="remove" @click="removeFunction(val)"></div>
</div>
</template>
@ -35,27 +57,29 @@
</template>
<script setup>
import { useRouter } from 'vue-router'
// import { useRouter } from 'vue-router'
import { message } from 'ant-design-vue'
import { ref, defineProps } from 'vue'
import mybus from '@/myplugins/mybus'
// import mybus from '@/myplugins/mybus'
const props = defineProps({
dataList: { type: Array, default: null },
})
const falg = ref(false)
let dataForm = ref([])
// eslint-disable-next-line vue/no-setup-props-destructure
dataForm.value = props.dataList
const router = useRouter()
const arr =
router.currentRoute.value.query.name instanceof Array
? router.currentRoute.value.query.name
: [router.currentRoute.value.query.name]
const dataResourceId = router.currentRoute.value.query.resourceId
console.log(dataForm.value)
// const router = useRouter()
// const arr =
// router.currentRoute.value.query.name instanceof Array
// ? router.currentRoute.value.query.name
// : [router.currentRoute.value.query.name]
// const dataResourceId = router.currentRoute.value.query.resourceId
const depList = ref({
Name: [],
depID: [],
})
// const depList = ref({
// Name: [],
// depID: [],
// })
//移除方法
const removeFunction = (data) => {
dataForm.value.map((val) => {
@ -71,25 +95,26 @@
<style scoped lang="less">
.ability-to-apply-for {
height: 2.9rem;
overflow: hidden;
.title {
font-size: 0.16rem;
color: #212121;
border-bottom: 0.01rem #dddee1 solid;
padding-bottom: 0.1rem;
margin-bottom: 0.2rem;
display: flex;
justify-content: space-between;
}
.ability-to-apply-for-content {
// margin-bottom: 0.3rem;
// border-bottom: 0.01rem #dddee1 solid;
// padding-bottom: 0.3rem;
padding-right: 0.5rem;
position: relative;
.dep-name {
color: #0558e1;
font-size: 0.18rem;
font-size: 0.22rem;
display: flex;
align-items: center;
line-height: 0.18rem;
line-height: 0.22rem;
margin-bottom: 0.2rem;
span {
display: inline-block;
@ -104,14 +129,19 @@
padding-bottom: 0.1rem;
margin-bottom: 0.1rem;
border-bottom: 1px solid #dddee1;
position: relative;
display: flex;
align-items: center;
.text {
margin-left: 0.2rem;
width: 8.8rem;
}
}
.name {
margin-bottom: 0.2rem;
span:first-child {
display: inline-block;
margin-right: 0.08rem;
font-size: 0.2rem;
font-size: 0.18rem;
color: #000000;
}
span:last-child {
@ -122,16 +152,13 @@
}
}
.description {
width: 10rem;
width: 8.8rem;
color: rgba(0, 0, 0, 0.45);
}
.remove {
margin-left: 0.1rem;
width: 0.32rem;
height: 0.32rem;
position: absolute;
right: 0;
top: 50%;
margin-top: -0.16rem;
background: url('~@/assets/home/remove.png') no-repeat;
background-size: cover;
cursor: pointer;
@ -142,4 +169,37 @@
}
}
}
.all {
height: unset;
min-height: 2.9rem;
}
.btn {
cursor: pointer;
}
.tx {
display: inline-block;
width: 0.8rem;
height: 0.8rem;
margin-left: 0.1rem;
}
.sxt {
background: url('~@/assets/home/sxt_square.png') no-repeat;
background-size: 100%;
}
.znsf {
background: url('~@/assets/home/znsf_square.png') no-repeat;
background-size: 100%;
}
.tcfw {
background: url('~@/assets/home/tcfw_square.png') no-repeat;
background-size: 100%;
}
.kfzj {
background: url('~@/assets/home/kfzj_square.png') no-repeat;
background-size: 100%;
}
.ywzj {
background: url('~@/assets/home/ywzj_square.png') no-repeat;
background-size: 100%;
}
</style>

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

@ -1053,7 +1053,7 @@
paramsGetResources.pageNum = 1
}
let dataResourceParams = {
serviceName: paramsGetResources.name, //资源名称
serviceName: paramsGetResources.name || '', //资源名称
orderField: whoShow1.value.itShowQingDao
? paramsGetResources.orderField == 'applyCount'
? 'syqk'

109
front/src/views/home/apply.vue
View File

@ -118,9 +118,10 @@
name="applicationBackground"
:rules="[{ required: true, message: '请输入应用背景' }]"
>
<a-input
<a-textarea
placeholder="请输入应用背景"
v-model:value="formName.applicationBackground"
:rows="4"
/>
</a-form-item>
</div>
@ -130,9 +131,10 @@
name="effectWish"
:rules="[{ required: true, message: '请输入期望效果' }]"
>
<a-input
<a-textarea
placeholder="请输入期望效果"
v-model:value="formName.effectWish"
:rows="4"
/>
</a-form-item>
</div>
@ -173,7 +175,7 @@
</a-upload>
</a-form-item>
<a-form-item :wrapper-col="{ offset: 8, span: 16 }">
<div class="bottom-btn">
<a-button
style="
width: 80px;
@ -211,7 +213,7 @@
>
提交申请
</a-button>
</a-form-item>
</div>
</a-form>
</div>
<div class="success" v-else>
@ -265,11 +267,34 @@
setup() {
const router = useRouter()
const disabled = ref(false)
const list = ref(JSON.parse(localStorage.getItem('applyList')))
const num = ref(0)
list.value.map((item) => {
if (item.checkedList) {
console.log(item)
num.value += Number(item.checkedList.length)
}
})
console.log(
'list',
list.value
// list.value[0].children.filter(
// (val) => val.id == list.value[0].checkedList[0]
// )[0].resourceName
)
const baseURL = window.SITE_CONFIG.apiURL
let record = ref('1')
const text = ref('')
const formName = reactive({
title: '', // 标题
title: list.value[0].children
? list.value[0].children
.filter((val) => val.id == list.value[0].checkedList[0])[0]
.resourceName.concat(
list.value[0].checkedList.length > 0
? '等能力申请' + num.value + '个'
: '能力申请'
)
: list.value[0].arr[0].resourceName.concat('能力申请'), // 标题
applicationSystem: [], // 应用系统
applicationScene: [], // 应用场景
applicationBackground: '', // 应用背景
@ -292,7 +317,6 @@
formName.unit = res.data.data.deptName
})
})
const list = ref(JSON.parse(localStorage.getItem('applyList')))
// console.log('本地存储====================》', list.value)
const businessKey = ref(router.currentRoute.value.query.id)
const taskId = ref(router.currentRoute.value.query.taskId)
@ -423,7 +447,7 @@
applySuccess.value = false
message.success('操作成功！')
console.log('能力申请================>', res)
if (ids && ids.length>0) {
if (ids && ids.length > 0) {
sgcDel({ ids: ids }).then((res) => {
if (res.data.msg === 'success') {
mybus.emit('getSgcNum')
@ -504,6 +528,7 @@
},
])
const systemOptions = ref([])
const systemOptions2 = ref([])
const handleChange = (info) => {
if (info.file.status !== 'uploading') {
@ -536,49 +561,22 @@
return isPNG || Upload.LIST_IGNORE
}
const fileList = ref([])
//删除改变arr
// mybus.on('reomveOldData', (item) => {
// debugger
// arr = []
// formName.system = []
// record.value = record.value + '1'
// arr = item.Name
// // dataResourceId = item.depID
// if (arr && arr.length !== 0) {
// disabled.value = true
// let str = ''
// arr.forEach((val, index) => {
// str += val
// if (index < arr.length - 1) {
// str += '、'
// }
// })
// formName.formNameSystem = str
// }
// arr.forEach((val, index) => {
// formName.system.push({
// resourceName: val,
// // resourceId: dataResourceId[index],
// })
// })
// })
// 应用系统下拉
const flag = ref(true)
const systemHandleChange = (value) => {
console.log(`selected ${value}`)
}
const systemHandleSearch = (value) => {
console.log(`search ${value}`)
text.value = value
systemOptions.value = []
window.setTimeout(() => {
if (flag.value && text.value == value && text.value !== '') {
console.log('1秒未输入~~~~~~~~~~~~~~~~~~~~~~~~~~')
systemOptions.value = systemOptions2.value.filter(
(item) => item.label.search(text.value) > -1
)
}
pageWithAttrs({
pageNum: 99999,
pageSize: 5,
pageNum: 1,
pageSize: 99999,
type: '应用资源',
name: text.value,
name: '',
infoList: [],
}).then((res) => {
if (res.data.code == 0) {
@ -586,33 +584,27 @@
message.warning('该关键词，暂无应用资源！')
} else {
res.data.data.records.map((val) => {
systemOptions.value.push({
systemOptions2.value.push({
value: val.name,
label: val.name,
})
})
console.log(
'第一次获取===================>',
systemOptions.value
)
// console.log('第一次获取===================>', systemOptions2.value)
}
} else {
message.error('获取数据失败!')
message.error('应用系统获取数据失败!')
}
})
}
}, 2000)
}
const handleBlur = () => {
console.log('blur')
flag.value = false
}
const handleFocus = () => {
console.log('focus')
flag.value = true
systemOptions.value = []
// console.log(formName.applicationSystem)
// formName.applicationSystem = []
systemOptions.value = systemOptions2.value
// systemOptions.value = []
}
// const filterOption = (input, option) => {
@ -727,4 +719,13 @@
flex-wrap: nowrap;
}
}
textarea {
resize: none;
font-size: 14px;
}
.bottom-btn {
display: flex;
justify-content: center;
// position: fixed;
}
</style>

21
front/src/views/home/components/header.vue
View File

@ -6,7 +6,10 @@
props.showView === 'algorithm-details' ? 'blue' : '',
]"
>
<div class="name">城市云脑能力管理中心</div>
<div class="name">
<div class="name-bg"></div>
城市云脑通用能力服务平台
</div>
<div
v-for="item in navList"
:key="item.key"
@ -17,6 +20,7 @@
{{ item.name }}
</div>
<a-badge :count="sgcNum">
<!-- 购物车 -->
<svg
t="1650455446850"
class="icon"
@ -37,6 +41,7 @@
<!-- <a-avatar shape="square" size="large" /> -->
</a-badge>
<a-badge :count="mynoticeNum" style="margin-left: 0.2rem">
<!-- 消息提醒 -->
<svg
t="1654051054113"
class="icon2"
@ -256,12 +261,13 @@
sgcNum.value = res.data.data.count
})
getMynotice()
// 解决
const mynoticeDom = document.querySelector('.icon2')
const mynotice = document.querySelector('.mynotice')
if (mynoticeDom) {
mynoticeDom.addEventListener('mouseover', () => {
mynoticeFlag.value = true
document.documentElement.style.overflowY = 'hidden'
// document.documentElement.style.overflowY = 'hidden'
})
mynoticeDom.addEventListener('mouseout', () => {
mynoticeFlag.value = false
@ -271,7 +277,7 @@
if (mynotice) {
mynotice.addEventListener('mouseover', () => {
mynoticeFlag.value = true
document.documentElement.style.overflowY = 'hidden'
// document.documentElement.style.overflowY = 'hidden'
})
mynotice.addEventListener('mouseout', () => {
mynoticeFlag.value = false
@ -318,6 +324,15 @@
font-size: 0.22rem;
font-family: header-typeface;
margin-right: 0.2rem;
display: flex;
align-items: center;
.name-bg {
height: 0.6rem;
width: 0.6rem;
background: url('~@/assets/newHome/newHome-title-bg.png') no-repeat;
background-size: 100%;
margin-right: 0.15rem;
}
}
.nav {
width: 1.2rem;

24
front/src/views/home/components/searchResultList.vue
View File

@ -37,8 +37,11 @@
:class="
item.type == '应用资源'
? 'yyzy'
: item.type == '数据资源'
: !item.type
? 'sjzy'
: !item.infoList ||
!item.infoList.filter((val) => val.attrType == '组件类型')[0]
? 'znsf'
: item.infoList &&
item.infoList.filter((val) => val.attrType == '组件类型')[0]
.attrValue == '智能算法'
@ -123,7 +126,10 @@
<span>{{ item.deptName || '--' }}</span>
</div>
<div v-if="selectCardsname !== '基础设施'">
<a-tooltip>
<template #title>{{ item.description }}</template>
{{ item.description || '--' }}
</a-tooltip>
</div>
</div>
<div class="bottom" v-if="selectCardsname !== '基础设施'">
@ -131,7 +137,7 @@
<div v-if="selectCardsname !== '数据资源'">
浏览量：{{ item.visits || 0 }}次
</div>
<div>申请量：{{ item.applyCount || 0 }}次</div>
<div>申购量：{{ item.applyCount || 0 }}次</div>
<div v-if="selectCardsname === '数据资源'">
数据量：{{ item.sjlCount || 0 }}
</div>
@ -191,7 +197,7 @@
<a-button
type="primary"
@click="toView('details', item)"
v-if="whoShow1.itShowQingDao"
v-if="!whoShow1.itShowBaoTou"
>
查看详情
</a-button>
@ -418,10 +424,15 @@
}
function toView(type, item) {
if (props.selectCardsname == '数据资源') {
if (whoShow1.itShowQingDao) {
window.open(
'http://15.72.158.81/web/ZWXXSQ/bm/MuluDetail.aspx?zyguid=' +
item.guid
)
} else {
window.open(
'http://10.134.135.24:30090/#/home')
}
} else {
if (type === 'apply') {
console.log('一键申请===================>', item)
@ -437,6 +448,9 @@
resourceName: item.name,
time: item.createDate,
type: item.type,
componentType: item.infoList.filter(
(val) => val.attrType == '组件类型'
)[0].attrValue,
},
],
deptId: item.deptId,
@ -606,7 +620,7 @@
}
</script>
<style scoped lang="less">
#search-result-list-container {
#search-result-list-container {
width: 1088px;
padding: 0 20px;
background: #f3f5f9;
@ -941,5 +955,5 @@
margin-top: 0;
}
}
}
}
</style>

2
front/src/views/home/details.vue
View File

@ -91,7 +91,7 @@
const router = useRouter()
const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview'))
let showView = ref('details-view')
let showView = ref('')
const init = () => {
if (id) {
selectOne(id).then((res) => {

10
front/src/views/home/infrastructurePage.vue
View File

@ -61,9 +61,9 @@
</a-button>
</div>
<i class="boundary"></i>
<!-- 添加至购物车 -->
<!-- 添加至申购车 -->
<a-button type="primary" @click="addShoppingCart" class="buttonAdd">
添加至购物车
添加至申购车
</a-button>
<!-- 一键申请 -->
<a-button type="primary" @click="apply" class="buttonAdd">
@ -253,6 +253,8 @@
let tableHeight = ref('600')
//tab切换点击事件
const tabClick = (indexFather, name) => {
selectedRowKeys.value = []
selectedList.value = []
if (clickList.value[indexFather].content.indexOf(name) != -1) {
if (name == '视频资源') {
tableHeight.value = 330
@ -404,6 +406,7 @@
}
//加入申购车
const addShoppingCart = () => {
if (selectedList.value.length > 0) {
sgcInsert({
delFlag: '0',
resourceId: '8888888880000000001',
@ -414,6 +417,9 @@
message.success('添加申购车成功！')
mybus.emit('getSgcNum')
})
} else {
message.error('请选择需要添加申购车的数据')
}
}
// 表格
const dataSource = ref([])

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

@ -119,7 +119,7 @@
paramsGetResources.type = type
if (type === '数据资源' && !whoShow1.value.itShowBaoTou) {
getDataResource({
serviceName: paramsGetResources.name, //资源名称
serviceName: paramsGetResources.name || '', //资源名称
orderField: whoShow1.value.itShowQingDao ? 'fbrq' : 'createTime', //排序字段
orderType: paramsGetResources.orderType.toLowerCase(), //排序方式：desc，asc
pageNum: paramsGetResources.pageNum, //页码

14
front/src/views/newHome/components/Header.vue
View File

@ -1,6 +1,9 @@
<template>
<div class="home-header" :class="scrollTop > 500 ? 'white' : ''">
<div class="name">城市云脑能力管理中心</div>
<div class="name">
<div class="name-bg"></div>
城市云脑通用能力服务平台
</div>
<div
v-for="item in navList"
:key="item.key"
@ -133,6 +136,15 @@
font-size: 0.22rem;
font-family: header-typeface;
margin-right: 0.2rem;
display: flex;
align-items: center;
.name-bg {
height: 0.6rem;
width: 0.6rem;
background: url('~@/assets/newHome/newHome-title-bg.png') no-repeat;
background-size: 100%;
margin-right: 0.15rem;
}
}
.nav {
width: 1.44rem;

28
front/src/views/newHome/components/Navigation.vue
View File

@ -80,26 +80,32 @@
<a-select
ref="select"
style="width: 1.4rem; height: 0.4rem"
v-for="item in fabubumen"
:key="item"
v-model="item.value"
placeholder="请选择省份"
@change="qushijiedao"
:key="fabubumen"
>
<a-select-option
:value="item.name"
v-model="item.value"
v-for="item in fabubumen"
:key="item"
>
<a-select-option :value="item.name">
{{ item.name }}
</a-select-option>
</a-select>
<a-select
ref="select"
style="width: 1.4rem; height: 0.4rem"
v-for="item in shi"
:key="item"
v-model:value="item.value"
@change="qushijiedao"
placeholder="请选择市"
:key="shi"
>
<a-select-option
:value="item.name"
v-model:value="item.value"
v-for="item in shi"
:key="item"
>
<a-select-option :value="item.name">
{{ item.name }}
</a-select-option>
</a-select>
@ -167,9 +173,9 @@
id: '100001',
},
])
let shi = ref(['请先选择省份'])
let qu = ref(['请先选择市'])
let jiedao = ref(['请先选择区'])
let shi = ref([])
let qu = ref([])
let jiedao = ref([])
function qushijiedao(value) {
let danwei = value.substr(-1)
// name.substr(-1)

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

@ -99,6 +99,8 @@
path: '/DetailsPageconetent',
query: {
select: type,
tecHnosphere: '',
appLiCation: ''
},
})
}

12
front/src/views/newHome/index.vue
View File

@ -1,3 +1,10 @@
<!--
* @Author: hisense.liangjunhua
* @Date: 2022-06-23 16:41:49
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-07-04 17:53:27
* @Description: 告诉大家这是什么
-->
<template>
<div class="newHome">
<new-home-header></new-home-header>
@ -6,6 +13,7 @@
<capability-convergence></capability-convergence>
<popular-ability></popular-ability>
<latest-capabilities></latest-capabilities>
<resource-aggregation></resource-aggregation>
<recommendation-ability></recommendation-ability>
<work-dynamics></work-dynamics>
<home-footer></home-footer>
@ -18,6 +26,7 @@
import CapabilityConvergence from '@/views/newHome/components/CapabilityConvergence'
import PopularAbility from '@/views/newHome/components/PopularAbility'
import LatestCapabilities from '@/views/newHome/components/LatestCapabilities'
import ResourceAggregation from '@/views/abilityStatistics/components/ResourceAggregation.vue'
import RecommendationAbility from '@/views/newHome/components/RecommendationAbility'
import WorkDynamics from '@/views/newHome/components/WorkDynamics'
import HomeFooter from '@/views/newHome/components/Footer'
@ -37,4 +46,7 @@
font-family: num-typeface;
}
}
.resource-aggregation {
background: #fff;
}
</style>

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

@ -50,7 +50,7 @@
>
{{ item.name }}
</span>
<span class="time">收藏时间：{{ item.createDate }}</span>
<span class="time">收藏时间：{{ item.updateDate }}</span>
<svg
t="1652233950228"
class="icon"
@ -238,6 +238,7 @@
type: val.resourceDTO.type,
resourceId: val.resourceId,
createDate: val.createDate,
updateDate: val.updateDate,
description: val.resourceDTO.description,
delFlag: val.resourceDTO.delFlag,
}

2
front/src/views/personalCenter/components/MyApply.vue
View File

@ -49,7 +49,7 @@
<template #title>{{ item.name }}</template>
<div class="content-body-title">
<span
v-if="item.name === '申请摄像头列表'"
v-if="item.name === '申请摄像头列表' && item.ended"
@click="showVideoList(item)"
>
名称：{{ item.name }}

95
front/src/views/personalCenter/components/PurchaseVehicle.vue
View File

@ -97,7 +97,8 @@
<a-list-item-meta
:description="
item.description ||
(item.note1 &&
(JSON.parse(item.note1) &&
JSON.parse(item.note1)[0] &&
JSON.parse(item.note1)[0].channelName +
'等' +
JSON.parse(item.note1).length +
@ -107,14 +108,48 @@
style="position: relative"
>
<template #title>
<div>
<span
@click="showItem(item.id, item.type, item.delFlag)"
@click="
showItem(
item.resourceId,
item.type,
item.delFlag,
item.note1
)
"
style="cursor: pointer"
class="name"
>
{{ item.resourceName }}
</span>
<span class="type">{{ item.type }}</span>
</div>
<span class="time">
加购时间:{{ item.time }}
<a-popconfirm
title="是否删除该记录?"
ok-text="是"
cancel-text="否"
@confirm="delOne(item)"
@cancel="cancel"
>
<a-button
type="primary"
style="
width: 0.7rem;
height: 0.3rem;
margin-left: 0.12rem;
border-radius: 2px;
background: #fff;
color: #0558e1;
"
@click="del"
>
删除
</a-button>
</a-popconfirm>
</span>
<svg
t="1652233950228"
class="icon"
@ -192,6 +227,24 @@
</div>
</div>
</div>
<a-modal
v-model:visible="videoVisible"
title="已申请摄像头列表"
@ok="videoVisible = false"
>
<a-table
:columns="columns"
:data-source="xVideoList"
bordered
:pagination="{ defaultPageSize: 6 }"
>
<template #bodyCell="{ column, text }">
<!-- <template>
<a>{{ text }}</a>
</template> -->
</template>
</a-table>
</a-modal>
<!-- <a-pagination
v-model:current="pageNum"
v-model:page-size="pageSize"
@ -223,6 +276,8 @@
const pageNum = ref('1')
const pageSize = ref('99999')
// const pageSizeOptions = ref(['5', '10', '20'])
const videoVisible = ref(false)
const xVideoList = ref([])
const total = ref(0)
const load = ref(0)
// 多选框
@ -232,6 +287,12 @@
const checkAll = ref(false)
const checkNum = ref(0)
const showKey = ref(0)
const columns = ref([
{
title: '摄像头名称',
dataIndex: 'name',
},
])
// 筛选条件
const name = ref('')
const type = ref('')
@ -672,11 +733,34 @@
})
}
}
const delOne = (item) => {
// console.log(item)
sgcDel({
ids: [item.id],
}).then((res) => {
if (res.data.msg === 'success') {
message.success('删除成功')
// console.log('删除申购车列表================>', res)
mybus.emit('getSgcNum')
clean()
}
})
}
const cancel = (e) => {
// console.log(e)
}
// 详情
const showItem = (id, type, delFlag) => {
const showItem = (id, type, delFlag, note1) => {
if (type == '基础设施') {
// console.log()
let arr = JSON.parse(note1)
xVideoList.value = []
arr.map((val) => {
xVideoList.value.push({ name: val.channelName, key: val.channelId })
})
videoVisible.value = true
} else {
if (delFlag == 0) {
window.sessionStorage.setItem('type', JSON.stringify('PurchaseVehicle'))
mybus.emit('tabsChange', { flag: id })
@ -688,6 +772,7 @@
})
}
}
}
// 一键申请
const apply = () => {
// list.value.forEach((val) => {
@ -919,4 +1004,8 @@
background: url('~@/assets/home/ywzj_square.png') no-repeat;
background-size: 100%;
}
:deep(.ant-list-item-meta-title) {
display: flex;
justify-content: space-between;
}
</style>

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

@ -9,83 +9,38 @@
<div class="form-container">
<div v-if="applySuccess">
<div class="title">申请人信息</div>
<a-form
ref="formRef"
:model="formName"
name="basic"
:label-col="{ style: { width: '106px' } }"
:wrapper-col="{ style: { width: '230px' } }"
labelAlign="left"
autocomplete="off"
>
<a-form ref="formRef" :model="formName" name="basic" :label-col="{ style: { width: '106px' } }"
:wrapper-col="{ style: { width: '230px' } }" labelAlign="left" autocomplete="off">
<div class="base-info">
<a-form-item
label="申请人"
name="applyUserName"
:rules="[{ required: true, message: '请输入申请人' }]"
>
<a-input
placeholder="请输入申请人"
v-model:value="formName.applyUserName"
/>
<a-form-item label="申请人" name="applyUserName" :rules="[{ required: true, message: '请输入申请人' }]">
<a-input placeholder="请输入申请人" v-model:value="formName.applyUserName" />
</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,
pattern: /^1[3456789]\d{9}$/,
message: '请输入正确的电话号码',
},
]"
>
<a-input
placeholder="请输入申请人电话"
v-model:value="formName.applyUserPhone"
/>
]">
<a-input placeholder="请输入申请人电话" v-model:value="formName.applyUserPhone" />
</a-form-item>
<a-form-item
label="申请单位"
name="applyUserDeptName"
:rules="[{ required: true, message: '请输入申请单位' }]"
>
<a-input
placeholder="请输入申请单位"
v-model:value="formName.applyUserDeptName"
/>
<a-form-item label="申请单位" name="applyUserDeptName" :rules="[{ required: true, message: '请输入申请单位' }]">
<a-input placeholder="请输入申请单位" v-model:value="formName.applyUserDeptName" />
</a-form-item>
</div>
<div class="title">需求信息</div>
<a-form-item
style="margin-bottom: 10px"
label="需求标题"
name="demandSubject"
:rules="[{ required: true, message: '请输入需求标题' }]"
>
<a-input
style="width: 350px"
v-model:value="formName.demandSubject"
/>
<a-form-item style="margin-bottom: 10px" label="需求标题" name="demandSubject"
:rules="[{ required: true, message: '请输入需求标题' }]">
<a-input style="width: 350px" v-model:value="formName.demandSubject" />
</a-form-item>
<a-form-item
style="margin-bottom: 10px"
label="需求类型"
name="detailsType"
:rules="[{ required: true, message: '请选择需求类型' }]"
>
<a-select
ref="select"
v-model:value="formName.detailsType"
@focus="focus"
style="width: 200px"
>
<a-form-item style="margin-bottom: 10px" 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>
@ -94,26 +49,14 @@
</a-select>
</a-form-item>
<a-form-item
label="应用领域"
name="detailsField"
style="width: 350px"
:rules="[{ required: true, message: '请输入应用领域' }]"
>
<a-input
placeholder="请输入应用领域"
v-model:value="formName.detailsField"
/>
<a-form-item label="应用领域" name="detailsField" style="width: 350px"
:rules="[{ required: true, message: '请输入应用领域' }]">
<a-input placeholder="请输入应用领域" v-model:value="formName.detailsField" />
</a-form-item>
<a-form-item
style="margin-bottom: 10px"
label="需求描述"
name="demandDetails"
:rules="[{ required: true, message: '请输入需求描述' }]"
>
<a-textarea
style="
<a-form-item style="margin-bottom: 10px" label="需求描述" name="demandDetails"
:rules="[{ required: true, message: '请输入需求描述' }]">
<a-textarea style="
width: 500px;
height: 150px;
font-size: 16px;
@ -123,24 +66,12 @@
border-radius: 6px;
padding: 10px;
resize: none;
"
v-model:value="formName.demandDetails"
/>
" v-model:value="formName.demandDetails" />
</a-form-item>
<a-form-item
style="color: #666; font-size: 16px"
label="附件上传"
name="applyDoc"
>
<a-upload
v-model:file-list="fileList"
name="file"
:action="upLoadUrl"
:headers="headers"
@change="handleChange"
>
<a-button
style="
<a-form-item style="color: #666; font-size: 16px" label="附件上传" name="applyDoc">
<a-upload v-model:file-list="fileList" name="file" :action="upLoadUrl" :headers="headers"
@change="handleChange">
<a-button style="
width: 100px;
height: 30px;
margin-right: 10px;
@ -151,8 +82,7 @@
border: 1px solid #bbd3ef;
padding: 0;
text-align: center;
"
>
">
<upload-outlined></upload-outlined>
文件上传
</a-button>
@ -163,8 +93,7 @@
</a-form-item>
<a-form-item :wrapper-col="{ offset: 8, span: 16 }">
<a-button
style="
<a-button style="
width: 80px;
height: 38px;
margin-right: 20px;
@ -175,15 +104,10 @@
border: none;
padding: 0;
text-align: center;
"
type="primary"
html-type="cancle"
@click="signOut"
>
" type="primary" html-type="cancle" @click="signOut">
退出申请
</a-button>
<a-button
style="
<a-button style="
width: 80px;
height: 38px;
background: #0087ff;
@ -193,11 +117,7 @@
border: none;
padding: 0;
text-align: center;
"
type="primary"
html-type="submit"
@click="processStartHandle()"
>
" type="primary" html-type="submit" @click="processStartHandle()">
提交申请
</a-button>
</a-form-item>
@ -220,20 +140,20 @@
</template>
<script>
import HomeHeader from '@/views/home/components/header'
import { reactive, ref } from 'vue'
import { message } from 'ant-design-vue'
// import { UploadOutlined } from '@ant-design/icons-vue'
import { getUser, getUserInfo, relaunch } from '@/api/home'
import {
import HomeHeader from '@/views/home/components/header'
import { reactive, ref } from 'vue'
import { message } from 'ant-design-vue'
// import { UploadOutlined } from '@ant-design/icons-vue'
import { getUser, getUserInfo, relaunch } from '@/api/home'
import {
demandApply,
getDemandForm,
updateDemandForm,
} from '@/api/personalCenter'
// import { baseURL } from '@/config'
import { useRouter } from 'vue-router'
} from '@/api/personalCenter'
// import { baseURL } from '@/config'
import { useRouter } from 'vue-router'
export default {
export default {
name: '',
props: {},
components: {
@ -296,10 +216,10 @@
}
if (info.file.status === 'done') {
message.success(`${info.file.name} file uploaded successfully`)
message.success(`${info.file.name} 文件上传成功`)
formName.enclosure = info.file.response.data
} else if (info.file.status === 'error') {
message.error(`${info.file.name} file upload failed.`)
message.error(`${info.file.name} 文件上传失败`)
}
}
@ -351,17 +271,18 @@
// baseURL,
}
},
}
}
</script>
<style scoped lang="less">
#apply-container {
#apply-container {
background-color: #f5f8fc;
height: 100%;
width: 100%;
margin: 90px auto 0;
display: flex;
justify-content: space-between;
aside {
width: 282px;
height: 96%;
@ -369,6 +290,7 @@
background-color: #fff;
margin: 1% 0 3%;
}
article {
width: 1090px;
height: 99%;
@ -376,8 +298,10 @@
background-color: #fff;
margin: 5% auto;
}
.form-container {
padding: 20px 20px 30px 20px;
.title {
font-size: 20px;
color: #000;
@ -385,18 +309,22 @@
margin-bottom: 20px;
}
}
.base-info {
display: flex;
}
:deep(.ant-form-item-label) {
label {
color: #666;
font-size: 16px;
&::after {
content: '';
}
}
}
:deep(.ant-form-item-required) {
&::before {
font-size: 8px;
@ -408,21 +336,23 @@
border: 1px solid #e0e0e0;
border-radius: 6px;
}
.success {
div {
width: 100px;
margin: 80px auto 40px;
}
text-align: center;
font-size: 20px;
font-weight: bold;
color: #000;
}
}
}
</style>
<style>
body,
html {
body,
html {
height: unset;
}
}
</style>

1
node_modules/.package_versions.json generated vendored Normal file
View File

@ -0,0 +1 @@
{}