bonus
/
BigScreenUI
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

接口联调

This commit is contained in:
binbin_pan 2024-03-19 18:07:19 +08:00
parent 9279653332
commit e19eddb1f9
10 changed files with 231 additions and 172 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
index.html
View File

@ -11,8 +11,8 @@
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=cClgLBaLgGUdQDilX9dGvieL"></script>
<script src="http://mapopen.bj.bcebos.com/github/BMapGLLib/TrackAnimation/src/TrackAnimation.min.js"></script>
<script src="http://api.map.baidu.com/api?type=webgl&v=2.0&ak=cClgLBaLgGUdQDilX9dGvieL"></script>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=cClgLBaLgGUdQDilX9dGvieL"></script>
<script src="https://mapopen.bj.bcebos.com/github/BMapGLLib/TrackAnimation/src/TrackAnimation.min.js"></script>
<script src="https://api.map.baidu.com/api?type=webgl&v=2.0&ak=cClgLBaLgGUdQDilX9dGvieL"></script>
</html>

57
src/components/customCom/equipmentDialog.vue
View File

@ -123,36 +123,37 @@ const open = (maId:any) => {
})
}
const initApiBmCompanyInfoTimeListTime = async (val: any) => {
// console.log("val-->",val)
try {
// const res: any = await apiBmCompanyInfoTimeListTime(val)
const res: any = await apiBmCompanyInfoTimeListTime(val)
// 假数据
const res = [
{
"id": 1,
"lat": 31.22,
"lon": 121.48,
"time": "2022-12-10 10:10:10"
},
{
"id": 2,
"lat": 29.588885,
"lon": 106.621131,
"time": "2023-12-19 10:10:10"
},
{
"id": 3,
"lat": 39.904989,
"lon": 116.405285,
"time": "2023-12-19 10:10:10"
},
{
"id": 4,
"lat": 31.820587,
"lon": 117.227219,
"time": "2023-12-19 10:10:10"
}
]
// const res = [
// {
// "id": 1,
// "lat": 31.22,
// "lon": 121.48,
// "time": "2022-12-10 10:10:10"
// },
// // {
// // "id": 2,
// // "lat": 29.588885,
// // "lon": 106.621131,
// // "time": "2023-12-19 10:10:10"
// // },
// // {
// // "id": 3,
// // "lat": 39.904989,
// // "lon": 116.405285,
// // "time": "2023-12-19 10:10:10"
// // },
// {
// "id": 4,
// "lat": 31.820587,
// "lon": 117.227219,
// "time": "2023-12-19 10:10:10"
// }
// ]
console.log("res-apiBmCompanyInfoTimeListTime",res)
// domShow.value = true
// console.log("apiBmCompanyInfoTimeListTime", res)
@ -169,7 +170,7 @@ const initApiBmCompanyInfoTimeListTime = async (val: any) => {
// })
} catch (error) {
console.log('err-->>>', error)
}
}

109
src/components/customCom/equipmentLeasing.vue
View File

@ -65,6 +65,7 @@ import gdJSON from './mapData/gd.json'
import gzJSON from './mapData/gz.json'
import ynJSON from './mapData/yn.json'
import hnJSON from './mapData/hn.json'
import szJSON from './mapData/sz.json'
import { apiBmCompanyInfoColtdList } from "http/api/echartApi"
const mapEchartsRef = ref()
const equipmentDialogRef = ref()
@ -107,7 +108,8 @@ const navInfo = reactive({
},
{
text: "深圳供电局",
navId: "7"
navId: "7",
// jsonData: szJSON
},
{
text: "超高压公司",
@ -181,7 +183,7 @@ const mapProps = reactive({
return fromatStr
},
itemColorFormat: (params: any) => {
console.log("params001", params)
// console.log("params001", params)
if (params.value[2] ==2) {
return '#00ff31';
} else if (params.value[2] ==1) {
@ -191,56 +193,56 @@ const mapProps = reactive({
}
},
effectScatterCallBack: (params: any) => {
console.log("equipmentDialogRef999", params.data.name)
console.log("equipmentDialogRef999", params)
equipmentDialogRef.value.open(params.data.name)
},
// seriesData:[]
seriesData: [
//地图上的点
{ name: '肇庆市', value: [112.48461, 23.05196, 1] },
{ name: '佛山市', value: [110.130214, 23.018978, 1] },
{ name: '广州', value: [115.261081, 23.139856, 1] },
{ name: '南宁', value: [107.45, 22.139856, 1] },
{ name: '贵阳', value: [106.7, 26.36, 1] },
{ name: '昆明', value: [102.33, 24.23, 1] },
{ name: '海口', value: [110.33,19.823, 1] }
// { name: 240314000002, value: [112.48461, 23.05196, 1] },
// { name: 240314000003, value: [110.130214, 23.018978, 1] },
// { name: 240314000004, value: [115.261081, 23.139856, 1] },
// { name: 240314000005, value: [107.45, 22.139856, 1] },
// { name: 240314000006, value: [106.7, 26.36, 1] },
// { name: 240314000007, value: [102.33, 24.23, 1] },
// { name: 240314000001, value: [110.33,19.823, 1] }
]
})
let listData: any = []
const mapDataByProvice = (provinceName: String) => {
let listData = [
// 设备租赁分布图的数据
{
name: "广东省",
selfCount: 123,
toCount: 300,
inCount: 987
},
{
name: "广西壮族自治区",
selfCount: 23,
toCount: 55,
inCount: 278
},
{
name: "云南省",
selfCount: 256,
toCount: 2456,
inCount: 745
},
{
name: "贵州省",
selfCount: 963,
toCount: 4521,
inCount: 963
},
{
name: "海南省",
selfCount: 123,
toCount: 300,
inCount: 987
}
]
// let listData = [
// // 设备租赁分布图的数据
// {
// name: "广东省",
// selfCount: 123,
// toCount: 300,
// inCount: 987
// },
// {
// name: "广西壮族自治区",
// selfCount: 23,
// toCount: 55,
// inCount: 278
// },
// {
// name: "云南省",
// selfCount: 256,
// toCount: 2456,
// inCount: 745
// },
// {
// name: "贵州省",
// selfCount: 963,
// toCount: 4521,
// inCount: 963
// },
// {
// name: "海南省",
// selfCount: 123,
// toCount: 300,
// inCount: 987
// }
// ]
const curItem: any = listData.find((ele: any) => ele.name.slice(0, 2) == provinceName)
return curItem
}
@ -271,24 +273,23 @@ const iniTapibmCompanyInfoColtdList = async () => {
let item: any = {}
item.name = ele.companyName
ele.coltdVo.forEach((eleS: any) => {
console.log()
if (eleS.status == "在租") {
if (eleS.status == "110") {
item.selfCount = eleS.count
}
eleS.list.forEach((subEle: any) => {
if (!uniqueInfo[subEle.maId]) {
seriresData.push({
name: subEle.maId,
value: [Number(subEle.lon), Number(subEle.lat),eleS.count,3]
value: [Number(subEle.lon), Number(subEle.lat),eleS.count,3]// 参数1:经度, 参数2:纬度, 参数3:数量, 参数4:状态
})
uniqueInfo[subEle.maId] = true
}
})
})
item.toCount = ele.coltdVo.forEach((eleS: any) => {
if (eleS.status == "待租") {
item.toCount = ele.count
ele.coltdVo.forEach((eleS: any) => {
if (eleS.status == "20") {
item.toCount = eleS.count
}
eleS.list.forEach((subEle: any) => {
@ -301,9 +302,9 @@ const iniTapibmCompanyInfoColtdList = async () => {
}
})
})
item.inCount = ele.coltdVo.forEach((eleS: any) => {
if (eleS.status == "自有") {
item.inCount = ele.count
ele.coltdVo.forEach((eleS: any) => {
if (eleS.status == "10") {
item.inCount = eleS.count
}
eleS.list.forEach((subEle: any) => {
@ -318,9 +319,11 @@ const iniTapibmCompanyInfoColtdList = async () => {
})
console.log("itemitem", item)
listData.push(item)
// console.log("listData", listData)
})
mapProps.seriesData = seriresData
console.log("listData", res, listData, seriresData)
// console.log("listData", res, listData, seriresData)
console.log('mapProps--->', mapProps.seriesData)
} catch (error) {
console.log(error)

68
src/components/customCom/hotProvider.vue
View File

@ -23,7 +23,7 @@
<img v-else src="/src/assets/img/index4.png" alt="">
</div>
<div class="pro_item_title overflow">
{{ item.ownCo }}
{{ item.organizeName }}
</div>
</div>
<div class="device_count">
@ -32,7 +32,7 @@
</div>
</div>
<div class="cloud_words_out" v-else>
<CloudWords></CloudWords>
<CloudWords :data="data"></CloudWords>
</div>
</div>
</template>
@ -41,37 +41,37 @@ import CloudWords from "components/echartsCom/CloudWords.vue"
import { apiMaDevInfoHotList } from "http/api/echartApi"
const data: any = ref([])
const providerInfo: any = reactive({
list: [
{
ownCo: "中铁一局",
count: 1
},
{
ownCo: "中铁二局",
count: 2
},
{
ownCo: "中铁三局",
count: 3
},
{
ownCo: "中铁四局",
count: 4
},
{
ownCo: "中铁五局",
count: 5
},
{
ownCo: "中铁十一局",
count: 10
},
{
ownCo: "中铁十一局",
count: 10
},
// {
// ownCo: "中铁一局",
// count: 1
// },
// {
// ownCo: "中铁二局",
// count: 2
// },
// {
// ownCo: "中铁三局",
// count: 3
// },
// {
// ownCo: "中铁四局",
// count: 4
// },
// {
// ownCo: "中铁五局",
// count: 5
// },
// {
// ownCo: "中铁十一局",
// count: 10
// },
// {
// ownCo: "中铁十一局",
// count: 10
// },
]
})
@ -87,6 +87,12 @@ const InitApiMaDevInfoHotList = async () => {
const res: any = await apiMaDevInfoHotList()
console.log("apiMaDevInfoHotList", res)
providerInfo.list = res
res[0].itemNames.map((item: any) => {
data.value.push({
name: item,
value: Math.floor(Math.random() * (519 - 199 + 1) + 169)
})
})
} catch (error) {
console.log(error)
}

0
src/components/customCom/mapData/sz.json Normal file
View File

100
src/components/echartsCom/CloudWords.vue
View File

@ -5,10 +5,20 @@
<script setup lang="ts">
import * as echarts from 'echarts'
import jsonData from "./jsonData/china.json"
import { defineProps } from 'vue'
// 接收父组件传递的参数
const props = defineProps({
data: {
type: Array,
default: () => []
}
})
console.log("props--->", props.data)
let myChart: any = null
const randomData = () => {
var a = Math.random();
let a = Math.random();
if (a > 0 && a <= 0.333)
return 0;
if (a > 0.333 && a <= 0.666)
@ -39,42 +49,70 @@ const colorData = (value: any) => {
}
//110 35 14/18
var geoCoordMap: any = {
"挖掘机": [108.99, 36.04],
"洒水车": [113.53, 44.3],
"牵引车": [106.21, 27.35],
"平地机": [95.61, 44.57],
"应用支撑": [104.58, 39.69],
"掘地机": [101.39, 47.5],
"自卸车": [97.53, 31.89],
"叉车": [112.46, 31.65],
"开钩机": [92.65, 36.0],
"数据基础": [122.15, 32.99],
"其他设备": [123.89, 40.34],
// let geoCoordMap: any = {
// "挖掘机": [108.99, 36.04],
// "洒水车": [113.53, 44.3],
// "牵引车": [106.21, 27.35],
// "平地机": [95.61, 44.57],
// "应用支撑": [104.58, 39.69],
// "掘地机": [101.39, 47.5],
// "自卸车": [97.53, 31.89],
// "叉车": [112.46, 31.65],
// "开钩机": [92.65, 36.0],
// "数据基础": [122.15, 32.99],
// "其他设备": [123.89, 40.34],
};
// };
//0-500
var data = [
{ name: "挖掘机", value: 501 },
{ name: "洒水车", value: 400 },
{ name: "牵引车", value: 460 },
{ name: "平地机", value: 300 },
{ name: "应用支撑", value: 360 },
{ name: "掘地机", value: 460 },
{ name: "自卸车", value: 330 },
{ name: "叉车", value: 210 },
{ name: "开钩机", value: 200 },
{ name: "数据基础", value: 440 },
{ name: "其他设备", value: 240 },
// let data = [
// { name: "挖掘机", value: 501 },
// { name: "洒水车", value: 400 },
// { name: "牵引车", value: 460 },
// { name: "平地机", value: 300 },
// { name: "应用支撑", value: 360 },
// { name: "掘地机", value: 460 },
// { name: "自卸车", value: 330 },
// { name: "叉车", value: 210 },
// { name: "开钩机", value: 200 },
// { name: "数据基础", value: 440 },
// { name: "其他设备", value: 240 },
// ];
// 先过滤name相同的, 然后再截取11个
const data: any = props.data.filter((item: any, index: any, self: any) => {
return self.findIndex((s: any) => s.name === item.name) === index
}).slice(0, 11)
// console.log("data--->", data)
const coordinates = [
[108.99, 36.04],
[113.53, 44.3],
[106.21, 27.35],
[95.61, 44.57],
[104.58, 39.69],
[101.39, 47.5],
[97.53, 31.89],
[112.46, 31.65],
[92.65, 36.0],
[122.15, 32.99],
[123.89, 40.34],
];
const geoCoordMap: any = {}
for (let i = 0; i < data.length; i++) {
geoCoordMap[data[i].name] = coordinates[i]
}
// console.log("geoCoordMap--->", geoCoordMap)
var convertData = function (data: any) {
var res = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap[data[i].name];
const convertData = function (data: any) {
let res = [];
for (let i = 0; i < data.length; i++) {
let geoCoord = geoCoordMap[data[i].name];
if (geoCoord) {
res.push({
label: {
@ -110,7 +148,7 @@ const option: any = {
min: 0,
max: 500,
inRange: {
color: ['#0e2a3f'],
color: ['#3773FF', '#FF8F00', '#FB6716']
}
},

13
src/components/mapBaidu/mapLine.vue
View File

@ -29,20 +29,20 @@ let linePointList: any = []
const initMap = () => {
map = new BMapGL.Map("equipmentIdMap" + domId.value);
map.centerAndZoom(new BMapGL.Point(116.3944, 39.9063), 18);
map.centerAndZoom(new BMapGL.Point(centerPoint), 18);
console.log("map", map)
map.enableScrollWheelZoom();
setTimeout(() => {
// initCustomDot()
const startIcon = {
imgUrl: '/src/assets/img/mapStart.png',
position: [116.3964, 39.9093],
position: [linePointList[0].lng, linePointList[0].lat],
size: [60, 60]
}
const endIcon = {
imgUrl: '/src/assets/img/mapEnd.png',
position: [116.3964, 39.9093],
position: [linePointList[linePointList.length - 1].lng, linePointList[linePointList.length - 1].lat],
size: [60, 60]
}
@ -56,10 +56,10 @@ const initMap = () => {
const initCustomDot = (centerPoint: any) => {
function ComplexCustomOverlay(centerPoint) {
function ComplexCustomOverlay(centerPoint: any) {
}
ComplexCustomOverlay.prototype = new BMapGL.Overlay();
ComplexCustomOverlay.prototype.initialize = function (map) {
ComplexCustomOverlay.prototype.initialize = function (map: any) {
const div = this._div = document.createElement("div");
div.style.position = "absolute";
div.style.width = "30px";
@ -110,7 +110,8 @@ const initPolylineAnimation = () => {
}
const initIcon = (imgUrl: any, position: any, size: any) => {
var myIcon = new BMapGL.Icon("https://api.map.baidu.com/img/markers.png", new BMapGL.Size(60, 60));
// var myIcon = new BMapGL.Icon("https://api.map.baidu.com/img/markers.png", new BMapGL.Size(60, 60));
var myIcon = new BMapGL.Icon(imgUrl, new BMapGL.Size(60, 60));
// 创建Marker标注，使用小车图标
var pt = new BMapGL.Point(...position);
var marker = new BMapGL.Marker(pt, {

8
src/http/api/echartApi.ts
View File

@ -31,7 +31,7 @@ export function apiBmMachinistInfoList() {
}
// 根据企业类型查询对应数量以及总数量:
export function apiBmCompanyInfoTypeList() {
return get('bmCompanyInfo/type-list', {})
return get('user-service/bmCompanyInfo/type-list', {})
}
@ -41,11 +41,11 @@ export function apiMaDevInfoMaList() {
// ======
// 根据求出租信息查询对应的数量:
export function apiMaLeaseInfoInfoTypeList() {
return get('maLeaseInfo/type-list', {})
return get('order/maOrderInfo/type-list', {})
}
// 查询公司对应的热门设备数量:
export function apiMaDevInfoHotList() {
return get('maDevInfo/hot-list', {})
return get('order/maOrderInfo/hot-list', {})
}
@ -53,7 +53,7 @@ export function apiMaDevInfoHotList() {
// ===
// 设备租赁分布图
export function apiBmCompanyInfoColtdList() {
return get('bmCompanyInfo/coltd-list', {})
return get('user-service/bmCompanyInfo/coltd-list', {})
}
// 根据设备id查询设备详情相关信息
export function apiBmaDevInfoList(maId:any) {

2
src/http/index.ts
View File

@ -42,7 +42,7 @@ export function get(url: string, params: any) {
.get(url, { params })
.then((res: any) => {
NProgress.done()
console.log("res-get",res)
// console.log("res-get",res)
if (res.code == '0') {
resolve(res.data)
} else {

40
src/views/screen/sharePlatform.vue
View File

@ -89,10 +89,10 @@
<div class="self_img">{{ platFormInfo.enterpriseCount }}</div>
<div class="third_title">南网集体企业</div>
</div>
<div class="self_shelf_count">
<!-- <div class="self_shelf_count">
<div class="self_img">{{ platFormInfo.holdingCount }}</div>
<div class="third_title">南网控股企业</div>
</div>
</div> -->
</div>
</div>
<div class="enterprise_device">
@ -170,7 +170,7 @@ import {
const equipmentCountInfo: any = reactive({
// 平台入驻设备总数
listCount: [
// "0", "0", "0", "1" // 默认假数据
"0", "0", "0", "0"
],
selfCount: 0,
shelfCount: 0
@ -203,21 +203,21 @@ const middleCountList = reactive({
const rentWantRent:any=reactive({
// 出租信息
rent:[
"1", "0", "0", "0" // 默认假数据
"0", "0", "0", "0"
],
// 求租信息
wantRent:[
"0", "0", "0", "0" // 默认假数据
"0", "0", "0", "0"
]
})
const platFormInfo: any = reactive({
// 平台入驻单位
listCount: [
"0", "0", "0", "0" // 默认假数据
"0", "0", "0", "0"
],
socailCount: "0",
enterpriseCount: "0",
holdingCount: '0'
// holdingCount: '0'
})
const barComProps = reactive({
@ -505,7 +505,7 @@ const iniTapiBmCompanyInfoTypeLis = async () => {
platFormInfo.listCount = (res.total + '').padStart(4,'0').split("")
platFormInfo.socailCount = res.social.count
platFormInfo.enterpriseCount = res.grid.count
platFormInfo.holdingCount = res.corporation.count
// platFormInfo.holdingCount = res.corporation.count
} catch (error) {
console.log(error)
@ -568,9 +568,9 @@ setInterval(() => {
margin: 0 auto;
display: flex;
flex-direction: column;
height: 100%;
min-width: 1920px;
// width: 1920px;
// height: 1080px;
min-height: 1080px;
background-image: url("../../assets/img/background-bg.png");
background-size: cover;
background-repeat: no-repeat;
@ -790,15 +790,25 @@ setInterval(() => {
}
.more_count {
margin-left: -13px;
margin: 30px auto;
display: flex;
justify-content: center;
.self_shelf_count {
width: 100px;
width: 138px;
height: 61px;
.self_img {
font-size: 33px;
width: 75px;
height: 50px;
width: 92px;
height: 61px;
background-image: url("../../assets/img/compnay_bg.png");
background-size: cover;
background-repeat: no-repeat;
margin: 0px auto;
line-height: 66px;
text-align: center;
color: #66E0FF;
font-size: 38px;
}
}