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

算法广场，GIS广场接口里联调

This commit is contained in:
guoyue 2022-10-25 17:51:39 +08:00
parent 79ee811854
commit 7ff2d13afe
4 changed files with 119 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -500,3 +500,12 @@ export function getMaxApplyNum(number) {
method: 'get', method: 'get',
}) })
} }
// 市局-能力广场-算法广场和GIS广场根据区域查询列表
export function getGisByArea(data) {
return request({
url: '/resource/getSquareList',
method: 'post',
data
})
}

99
front/src/views/capacitySquare/components/algorithm.vue
View File

@ -9,10 +9,10 @@
</div> </div>
<div class="bottom" v-show="selectFlag"> <div class="bottom" v-show="selectFlag">
<span class="light"></span> <span class="light"></span>
<div @click="getList('全市')">全市</div> <div @click="changeDeptType('全市')">全市</div>
<div @click="getList('市级')">市级</div> <div @click="changeDeptType('市级')">市级</div>
<div @click="getList('区级')">区级</div> <div @click="changeDeptType('区级')">区级</div>
<div @click="getList('企业')">企业</div> <div @click="changeDeptType('企业')">企业</div>
</div> </div>
</div> </div>
<div class="select"> <div class="select">
@ -22,7 +22,7 @@
</div> </div>
<div class="bottom" v-show="selectFlag2"> <div class="bottom" v-show="selectFlag2">
<span class="light"></span> <span class="light"></span>
<div v-for="val in dictList" :key="val" @click="getList2(val)"> <div v-for="val in dictList" :key="val" @click="changeAreaFunction(val)">
{{ val }} {{ val }}
</div> </div>
</div> </div>
@ -47,11 +47,11 @@
</template> </template>
<script setup> <script setup>
import { getCategoryTreePage } from '@/api/personalCenter' import { getCategoryTreePage } from '@/api/personalCenter'
import { pageWithAttrs } from '@/api/abilityStatistics' import { getGisByArea } from '@/api/home'
import { ref, onMounted, onBeforeUnmount } from 'vue' import { ref, onMounted, onBeforeUnmount, nextTick } from 'vue'
const type = ref(null) const deptType = ref(null)
const typeName = ref('全市') const typeName = ref('全市')
const typeName2 = ref('全部') const typeName2 = ref('全部')
const dictList = ref([]) const dictList = ref([])
@ -71,25 +71,16 @@ getCategoryTreePage({
}) })
}) })
const params = { const params = {
deptIds: [],
districtId: '',
infoList: [{ attrType: '组件类型', attrValue: '智能算法' }],
orderField: 'pin_top',
orderType: 'DESC',
pageNum: 1, pageNum: 1,
pageSize: 9, type: '智能算法',
type: '组件服务', area: typeName2.value == '全部' ? '' : typeName2.value,
pageSize: 9 // 固定9
} }
const getList2 = (val) => {
// 切换领域
const changeAreaFunction = (val) => {
typeName2.value = val typeName2.value = val
if (val == '全部') { params.area = typeName2.value == '全部' ? '' : typeName2.value;
params.infoList = [{ attrType: '组件类型', attrValue: '智能算法' }]
} else {
params.infoList = [
{ attrType: '组件类型', attrValue: '智能算法' },
{ attrType: '应用领域', attrValue: val },
]
}
selectFlag2.value = false selectFlag2.value = false
pageWithAttrsFunction() pageWithAttrsFunction()
} }
@ -99,24 +90,20 @@ const dataLength = ref(true)
const isNoMore = ref(false) const isNoMore = ref(false)
let url = ref('') let url = ref('')
const pageWithAttrsFunction = () => { const pageWithAttrsFunction = () => {
pageWithAttrs(params).then((res) => { getGisByArea(params).then((res) => {
dataList.value = res.data.data.records dataList.value = res.data.data.list
if (res.data.data.records.length < 9) { if (res.data.data.list.length < 9) {
dataLength.value = false dataLength.value = false
} }
}) })
} }
pageWithAttrsFunction() pageWithAttrsFunction()
//图片显示 //图片显示
const algorithmCardPhoto = (List, item) => { const algorithmCardPhoto = (List, item) => {
let obj = List.filter((item) => item.attrType === '应用场景')[0] let _arr = List && item && List.filter((item) => item.attrType === '应用场景') || []
let obj = _arr[0]
if (obj && obj.attrValue != '') { if (obj && obj.attrValue != '') {
console.log(
item.name,
item.id,
obj.attrValue,
'----------------------------'
)
obj = JSON.parse(obj.attrValue)[0].img obj = JSON.parse(obj.attrValue)[0].img
} }
return obj || '' return obj || ''
@ -137,9 +124,9 @@ const algorithmFunction = (e) => {
// 当前滚动条已经触底 // 当前滚动条已经触底
isNoMore.value = true isNoMore.value = true
params.pageNum++ params.pageNum++
pageWithAttrs(params).then((res) => { getGisByArea(params).then((res) => {
dataList.value.push(...res.data.data.records) dataList.value.push(...res.data.data.list)
if (res.data.data.records.length < 9) { if (res.data.data.list.length < 9) {
dataLength.value = false dataLength.value = false
} }
}) })
@ -148,32 +135,52 @@ const algorithmFunction = (e) => {
} }
} }
const getList = (str) => { // 切换区市
const changeDeptType = (str) => {
if (str) { if (str) {
algorithmclassDom.scrollTop = 0 if (algorithmclassDom) {
algorithmclassDom.scrollTop = 0;
}
switch (str) { switch (str) {
case '全市': case '全市':
type.value = null deptType.value = null
typeName.value = '全 市' typeName.value = '全 市'
break break
case '市级': case '市级':
type.value = 2 deptType.value = 2
typeName.value = '市 级' typeName.value = '市 级'
break break
case '区级': case '区级':
type.value = 3 deptType.value = 3
typeName.value = '区 级' typeName.value = '区 级'
break break
case '企业': case '企业':
type.value = 4 deptType.value = 4
typeName.value = '企 业' typeName.value = '企 业'
break break
} }
params.pageNum = 1 params.pageNum = 1;
params.deptType = deptType.value;
} }
selectFlag.value = false selectFlag.value = false
alert('调取接口') getData(str)
// getData(str) }
const getData = (str) => {
getGisByArea(params).then((res) => {
const resData = res.data.data || {}
if (resData.list.length > 0 && resData.list.length < 9) {
algorithmclassDom.removeEventListener('scroll', algorithmFunction, true)
}
dataList.value = resData.list || []
nextTick(() => {
algorithmclassDom = document.querySelector('.algorithm-box')
if (str && algorithmclassDom) {
algorithmclassDom.removeEventListener('scroll', algorithmFunction, true)
algorithmclassDom.addEventListener('scroll', algorithmFunction, true)
}
})
})
} }
onMounted(() => { onMounted(() => {

9
front/src/views/capacitySquare/components/application.vue
View File

@ -121,16 +121,19 @@
type: type.value, type: type.value,
area: area.value, area: area.value,
}).then((res) => { }).then((res) => {
if (res.data.data.length < 9) { console.log('res---应用广场--------->', res);
if (res.data.data.total.length < 9) {
dom.removeEventListener('scroll', viewMonitor, true) dom.removeEventListener('scroll', viewMonitor, true)
} }
res.data.data.map((val) => { // appList
res.data.data.appList.map((val) => {
if (!val.pic) { if (!val.pic) {
val.pic = require('@/assets/capacitySquare/yyzy.jpg') val.pic = require('@/assets/capacitySquare/yyzy.jpg')
} }
val.pic2 = require('@/assets/capacitySquare/yyzy.jpg') val.pic2 = require('@/assets/capacitySquare/yyzy.jpg')
}) })
data.list.push(...res.data.data) data.list.push(...res.data.data.appList)
selectFlag.value = false selectFlag.value = false
nextTick(() => { nextTick(() => {
dom = document.querySelector('.item-box') dom = document.querySelector('.item-box')

89
front/src/views/capacitySquare/components/layer.vue
View File

@ -9,10 +9,10 @@
</div> </div>
<div class="bottom" v-show="selectFlag"> <div class="bottom" v-show="selectFlag">
<span class="light"></span> <span class="light"></span>
<div @click="getList('全市')">全市</div> <div @click="changeDeptType('全市')">全市</div>
<div @click="getList('市级')">市级</div> <div @click="changeDeptType('市级')">市级</div>
<div @click="getList('区级')">区级</div> <div @click="changeDeptType('区级')">区级</div>
<div @click="getList('企业')">企业</div> <div @click="changeDeptType('企业')">企业</div>
</div> </div>
</div> </div>
<div class="select"> <div class="select">
@ -22,7 +22,7 @@
</div> </div>
<div class="bottom" v-show="selectFlag2"> <div class="bottom" v-show="selectFlag2">
<span class="light"></span> <span class="light"></span>
<div v-for="val in dictList" :key="val" @click="getList2(val)"> <div v-for="val in dictList" :key="val" @click="changeAreaFunction(val)">
{{ val }} {{ val }}
</div> </div>
</div> </div>
@ -46,10 +46,10 @@
</template> </template>
<script setup> <script setup>
import { getCategoryTreePage } from '@/api/personalCenter' import { getCategoryTreePage } from '@/api/personalCenter'
import { pageWithAttrs } from '@/api/abilityStatistics' import { getGisByArea } from '@/api/home'
import { ref, onMounted, onBeforeUnmount } from 'vue' import { ref, onMounted, onBeforeUnmount, nextTick } from 'vue'
const type = ref(null) const deptType = ref(null)
const typeName = ref('全市') const typeName = ref('全市')
const typeName2 = ref('全部') const typeName2 = ref('全部')
const dictList = ref([]) const dictList = ref([])
@ -69,43 +69,35 @@ getCategoryTreePage({
}) })
}) })
const params = { const params = {
deptIds: [],
districtId: '',
infoList: [{ attrType: '组件类型', attrValue: '图层服务' }],
orderField: 'deptSort',
orderType: 'DESC',
pageNum: 1, pageNum: 1,
pageSize: 9, type: '图层服务',
type: '组件服务', area: typeName2.value == '全部' ? '' : typeName2.value,
pageSize: 9 // 固定9
} }
const getList2 = (val) => {
// 切换领域
const changeAreaFunction = (val) => {
typeName2.value = val typeName2.value = val
if (val == '全部') { params.area = typeName2.value == '全部' ? '' : typeName2.value;
params.infoList = [{ attrType: '组件类型', attrValue: '图层服务' }]
} else {
params.infoList = [
{ attrType: '组件类型', attrValue: '图层服务' },
{ attrType: '应用领域', attrValue: val },
]
}
selectFlag2.value = false selectFlag2.value = false
pageWithAttrsFunction() pageWithAttrsFunction()
} }
let algorithmclassDom = null let algorithmclassDom = null
const imgSrc = ref(require('@/assets/capacitySquare/algorithm-photo2.jpg')) const imgSrc = ref(require('@/assets/capacitySquare/algorithm-photo2.jpg'))
const dataLength = ref(true) const dataLength = ref(true)
const isNoMore = ref(false) const isNoMore = ref(false)
const pageWithAttrsFunction = () => { const pageWithAttrsFunction = () => {
pageWithAttrs(params).then((res) => { getGisByArea(params).then((res) => {
dataList.value = res.data.data.records dataList.value = res.data.data.list
if (res.data.data.records.length < 9) { if (res.data.data.list.length < 9) {
dataLength.value = false dataLength.value = false
} }
}) })
} }
pageWithAttrsFunction() pageWithAttrsFunction()
//图片显示 //图片显示
const algorithmCardPhoto = (List) => { const algorithmCardPhoto = (List = []) => {
let url = '' let url = ''
List.map((item) => { List.map((item) => {
if (item.attrType === '图层缩略图') { if (item.attrType === '图层缩略图') {
@ -119,32 +111,51 @@ const detailFunction = (id) => {
window.open(window.SITE_CONFIG.previewUrl + `#/details?id=${id}`) window.open(window.SITE_CONFIG.previewUrl + `#/details?id=${id}`)
} }
const getList = (str) => { const changeDeptType = (str) => {
if (str) { if (str) {
if(algorithmclassDom) {
algorithmclassDom.scrollTop = 0 algorithmclassDom.scrollTop = 0
}
switch (str) { switch (str) {
case '全市': case '全市':
type.value = null deptType.value = null
typeName.value = '全 市' typeName.value = '全 市'
break break
case '市级': case '市级':
type.value = 2 deptType.value = 2
typeName.value = '市 级' typeName.value = '市 级'
break break
case '区级': case '区级':
type.value = 3 deptType.value = 3
typeName.value = '区 级' typeName.value = '区 级'
break break
case '企业': case '企业':
type.value = 4 deptType.value = 4
typeName.value = '企 业' typeName.value = '企 业'
break break
} }
params.pageNum = 1 params.pageNum = 1;
params.deptType = deptType.value;
} }
selectFlag.value = false selectFlag.value = false
alert('调取接口') getData(str)
// getData(str) }
const getData = (str) => {
getGisByArea(params).then((res) => {
const resData = res.data.data || {}
if (resData.list.length > 0 && resData.list.length < 9) {
algorithmclassDom.removeEventListener('scroll', algorithmFunction, true)
}
dataList.value = resData.list || []
nextTick(() => {
algorithmclassDom = document.querySelector('.algorithm-box')
if (str && algorithmclassDom) {
algorithmclassDom.removeEventListener('scroll', algorithmFunction, true)
algorithmclassDom.addEventListener('scroll', algorithmFunction, true)
}
})
})
} }
const layerFunction = (e) => { const layerFunction = (e) => {
@ -159,9 +170,9 @@ const layerFunction = (e) => {
// 当前滚动条已经触底 // 当前滚动条已经触底
isNoMore.value = true isNoMore.value = true
params.pageNum++ params.pageNum++
pageWithAttrs(params).then((res) => { getGisByArea(params).then((res) => {
dataList.value.push(...res.data.data.records) dataList.value.push(...res.data.data.list)
if (res.data.data.records.length < 9) { if (res.data.data.list.length < 9) {
dataLength.value = false dataLength.value = false
} }
}) })