接口联调

This commit is contained in:
binbin_pan 2024-03-21 17:33:54 +08:00
parent 5cb95b07ed
commit 9e23127ce3
5 changed files with 62 additions and 44 deletions

View File

@ -6,19 +6,25 @@
</div> </div>
<div class="sub_title"> <div class="sub_title">
<span class="title_text">{{detailsInfo.maName}}</span> <span class="title_text">{{detailsInfo.maName}}</span>
<span class="sub_status">({{detailsInfo.maStatus}})</span> <!-- <span class="sub_status">({{detailsInfo.maStatus}})</span> -->
<span class="sub_status" v-if="detailsInfo.maStatus === '20'">(待租)</span>
<span class="sub_status" v-else-if="detailsInfo.maStatus === '110'">(租赁中)</span>
<span class="sub_status" v-else-if="detailsInfo.maStatus === '10'">(自有)</span>
</div> </div>
<div class="more_info"> <div class="more_info">
<!-- <span style="padding-left: 0;">操作重量7 </span> --> <!-- <span style="padding-left: 0;">操作重量7 </span> -->
<!-- <span> <!-- <span>
铲斗容量2立方米 铲斗容量2立方米
</span> --> </span> -->
<span> <span v-if="detailsInfo.maStatus === '110'">
租赁方{{detailsInfo.needCompany}} 租赁方{{detailsInfo.receiverName || '暂无'}}
</span> </span>
<span> <span v-if="detailsInfo.maStatus === '110'">
租赁日期{{ detailsInfo.planStartTime }}&nbsp;{{ detailsInfo.duration }} 租赁日期{{ detailsInfo.planStartTime || '暂无' }}
</span> </span>
<span v-if="detailsInfo.maStatus === '110'">租赁时长{{ detailsInfo.duration }}{{
detailsInfo.leasingMethod === null ? '暂无' : detailsInfo.leasingMethod === 0 ? '天' : '月'
}}</span>
</div> </div>
<div class="time_select"> <div class="time_select">
<el-date-picker v-model="timeRange" size="default" type="datetimerange" :unlink-panels="true" <el-date-picker v-model="timeRange" size="default" type="datetimerange" :unlink-panels="true"
@ -47,8 +53,9 @@ const detailsInfo = reactive({
duration: '', duration: '',
maName: '', maName: '',
maStatus: '', maStatus: '',
needCompany: '', receiverName: '',
planStartTime: '' planStartTime: '',
leasingMethod: null
}) })
// const shortcuts = [ // const shortcuts = [
// { // {
@ -87,7 +94,7 @@ const initApiBmaDevInfoList = async (maId:any) => {
detailsInfo.duration = res.duration detailsInfo.duration = res.duration
detailsInfo.maName = res.maName detailsInfo.maName = res.maName
detailsInfo.maStatus = res.maStatus detailsInfo.maStatus = res.maStatus
detailsInfo.needCompany = res.needCompany detailsInfo.receiverName = res.receiverName
detailsInfo.planStartTime = res.planStartTime detailsInfo.planStartTime = res.planStartTime
} catch (error) { } catch (error) {
@ -113,6 +120,8 @@ let startLonLat: any = reactive([
} }
]) ])
const open = (data:any) => { const open = (data:any) => {
// console.log("data",data)
if (!data) return
// data.value // data.value
startLonLat[0].lon = data.value[0] startLonLat[0].lon = data.value[0]
startLonLat[0].lat = data.value[1] startLonLat[0].lat = data.value[1]

View File

@ -5,9 +5,6 @@
</div> </div>
<div class="e_content"> <div class="e_content">
<div class="left_nav_list"> <div class="left_nav_list">
<!--
移入后的样式 小手
-->
<div class="nav_item" v-for="(item, index) in navInfo.list" :key="index" <div class="nav_item" v-for="(item, index) in navInfo.list" :key="index"
:class="{ 'activeNav': mapProps.idType == item.navId }" @click="toNavItem(item)"> :class="{ 'activeNav': mapProps.idType == item.navId }" @click="toNavItem(item)">
{{ item.text }} {{ item.text }}
@ -15,7 +12,8 @@
</div> </div>
<!-- <h1>{{ mapProps.seriesData }}</h1> --> <!-- <h1>{{ mapProps.seriesData }}</h1> -->
<div class="right_map_container"> <div class="right_map_container">
<mapEcharts v-if="mapProps.seriesData.length > 0" ref="mapEchartsRef" :jsonData="mapProps.jsonData" <mapEcharts v-if="mapProps.seriesData.length > 0" ref="mapEchartsRef"
:idType="mapProps.idType" :jsonData="mapProps.jsonData"
:itemStyle="mapProps.itemStyle" :emphasisLabelStyle="mapProps.emphasisLabelStyle" :itemStyle="mapProps.itemStyle" :emphasisLabelStyle="mapProps.emphasisLabelStyle"
:emphasisItemStyle="mapProps.emphasisItemStyle" :labelInfo="mapProps.labelInfo" :emphasisItemStyle="mapProps.emphasisItemStyle" :labelInfo="mapProps.labelInfo"
:rippleEffect="mapProps.rippleEffect" :tooltipProps="mapProps.tooltipProps" :rippleEffect="mapProps.rippleEffect" :tooltipProps="mapProps.tooltipProps"
@ -80,44 +78,45 @@ const navInfo = reactive({
navId: "0", navId: "0",
jsonData: xnallJSON, jsonData: xnallJSON,
}, },
{
text: "广西电网",
navId: "1",
jsonData: gxJSON
},
{ {
text: "广东电网", text: "广东电网",
navId: "2", navId: "2",
jsonData: gdJSON jsonData: gdJSON
}, },
{ {
text: "贵州电网", text: "广西电网",
navId: "3", navId: "1",
jsonData: gzJSON jsonData: gxJSON
}, },
{ {
text: "云南电网", text: "云南电网",
navId: "4", navId: "4",
jsonData: ynJSON jsonData: ynJSON
}, },
{
text: "贵州电网",
navId: "3",
jsonData: gzJSON
},
{ {
text: "海南电网", text: "海南电网",
navId: "5", navId: "5",
jsonData: hnJSON jsonData: hnJSON
}, },
{ // {
text: "储能公司", // text: "",
navId: "6", // navId: "6",
}, // },
{ {
text: "深圳供电局", text: "深圳供电局",
navId: "7", navId: "7",
jsonData: szJSON jsonData: szJSON
}, },
{ // {
text: "超高压公司", // text: "",
navId: "8" // navId: "8"
} // }
] ]
}) })

View File

@ -88,10 +88,15 @@ const propsVal: any = defineProps({
}, },
}) })
const initEcharts = () => { const initEcharts = () => {
echarts.registerMap('guangdong', propsVal.jsonData) // console.log("propsval__>>>", propsVal.idType, propsVal)
const name = propsVal.jsonData.features[0].properties.name
echarts.registerMap(name, propsVal.jsonData)
nextTick(() => { nextTick(() => {
const domitem = document.getElementById("mapEcharts" + propsVal.idType) const domitem: any = document.getElementById("mapEcharts" + propsVal.idType)
const map = echarts.init(domitem, null, { if (echarts.getInstanceByDom(domitem)) {// echarts
echarts.dispose(domitem);
}
const map = echarts.init(domitem, null, {// echarts
renderer: 'canvas', renderer: 'canvas',
}) })
const option = { const option = {
@ -101,9 +106,14 @@ const initEcharts = () => {
trigger: 'item',// trigger: 'item',//
}, },
geo: { geo: {
map: 'guangdong', map: name,
zoom: 1, zoom: 1,
roam: true, roam: true,
//
scaleLimit: {
min: 0.5,
max: 99
},
label: propsVal.labelInfo, label: propsVal.labelInfo,
// //
itemStyle: propsVal.itemStyle, itemStyle: propsVal.itemStyle,
@ -120,7 +130,7 @@ const initEcharts = () => {
}, },
series: [ series: [
{ {
name: 'Top 5', name,
type: 'effectScatter', type: 'effectScatter',
colorBy: 'series', colorBy: 'series',
effectType: 'ripple', effectType: 'ripple',
@ -164,8 +174,7 @@ const chartClickEventListener = (mychart: any) => {
const chagneJSON = (item: any) => { const chagneJSON = (item: any) => {
console.log("propsval", propsVal) // propsVal.idType = item.navId
propsVal.idType = item.navId
setTimeout(() => { setTimeout(() => {
initEcharts() initEcharts()
}) })

View File

@ -35,13 +35,13 @@ const initMap = () => {
const startIcon = { const startIcon = {
imgUrl: new URL('/src/assets/img/mapStart.png', import.meta.url).href, imgUrl: new URL('/src/assets/img/mapStart.png', import.meta.url).href,
position: [linePointList[0].lng, linePointList[0].lat], position: [linePointList[0].lng, linePointList[0].lat],
size: [60, 60] size: [50, 50]
} }
const endIcon = { const endIcon = {
imgUrl: new URL('/src/assets/img/mapEnd.png', import.meta.url).href, imgUrl: new URL('/src/assets/img/mapEnd.png', import.meta.url).href,
position: [linePointList[linePointList.length - 1].lng, linePointList[linePointList.length - 1].lat], position: [linePointList[linePointList.length - 1].lng, linePointList[linePointList.length - 1].lat],
size: [60, 60] size: [50, 50]
} }
initIcon(startIcon.imgUrl, startIcon.position, startIcon.size) initIcon(startIcon.imgUrl, startIcon.position, startIcon.size)
@ -108,8 +108,8 @@ const initPolylineAnimation = () => {
} }
const initIcon = (imgUrl: any, position: any, size: any) => { 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(50, 50));
var myIcon = new BMapGL.Icon(imgUrl, new BMapGL.Size(60, 60)); var myIcon = new BMapGL.Icon(imgUrl, new BMapGL.Size(50, 50));
// Marker使 // Marker使
var pt = new BMapGL.Point(...position); var pt = new BMapGL.Point(...position);
var marker = new BMapGL.Marker(pt, { var marker = new BMapGL.Marker(pt, {

View File

@ -379,11 +379,11 @@ const barComPropsHorizontal = reactive({
const pie3DList = reactive({ const pie3DList = reactive({
list: [ list: [
// //
{name: 'Chrome', y: 61.41}, // ['Chrome', 1],
{name: 'Internet Explorer', y: 11.84}, // ['Internet Explorer', 2],
{name: 'Firefox', y: 10.85}, // ['Firefox', 3],
{name: 'Edge', y: 4.67}, // ['Edge', 4],
{name: 'Safari', y: 4.18}, // ['Safari', 5]
] ]
}) })
onMounted(() => { onMounted(() => {
@ -440,6 +440,7 @@ const iniTapiMaDevInfoCompanyList = async () => {
resultList.push(item) resultList.push(item)
}) })
pie3DList.list = resultList pie3DList.list = resultList
// console.log("pie3DList", pie3DList.list)
} catch (error) { } catch (error) {
console.log(error) console.log(error)
} }