Merge remote-tracking branch 'origin/dev-cq' into dev
# Conflicts: # sgzb-ui/src/api/claimAndRefund/receive.js # sgzb-ui/src/views/claimAndRefund/receiveByCq/receiveApplyAddByCq.vue # sgzb-ui/src/views/claimAndRefund/receiveByCq/receiveExamineByCq.vue # sgzb-ui/src/views/claimAndRefund/receiveByCq/receiveManage.vue # sgzb-ui/src/views/claimAndRefund/return/returnApplyAddByCq.vue
This commit is contained in:
commit
8b433a699e
|
|
@ -6,8 +6,8 @@ var prodEnv = require('./prod.env')
|
|||
// var testUrl = '14.29.196.32:8802'
|
||||
// var testUrl = '10.14.16.165:8802'
|
||||
// var testUrl = '112.29.103.165:21624' //线上
|
||||
var testUrl = '192.168.0.14:21626' //线上
|
||||
// var testUrl = '192.168.0.166:8080'
|
||||
// var testUrl = '192.168.0.14:21626' //线上
|
||||
var testUrl = '10.40.92.8:8080'
|
||||
// var testUrl = '223.243.184.53:8480'
|
||||
// var testUrl = 'www.lingyangplat.com'
|
||||
// var testUrl = ''
|
||||
|
|
|
|||
|
|
@ -20,7 +20,9 @@ module.exports = {
|
|||
cssSourceMap: true,
|
||||
proxyTable: {
|
||||
'/screen': {
|
||||
target: 'http://112.29.103.165:21624',
|
||||
// target: 'http://112.29.103.165:21626',//重庆
|
||||
target: 'http://192.168.0.14:21624',//测试
|
||||
// target: 'http://10.40.92.74:8080',
|
||||
changeOrigin: true,
|
||||
// secure: true, //如果是https接口，需要配置这个参数
|
||||
pathRewrite: {
|
||||
|
|
|
|||
|
|
@ -22,4 +22,6 @@ export const getTotalOwnershipApi = params => POST(`/screen/base/largeScreen/hom
|
|||
export const getCarUseByMonthApi = params => POST(`/screen/base/largeScreen/home/getCarUseByMonth?maType=${params.maType}`,)
|
||||
// 当月使用车辆
|
||||
export const getMaintenanceWarningApi = params => POST(`/screen/base/largeScreen/home/getMaintenanceWarning`,)
|
||||
//各公司机具保有量
|
||||
export const getTotalOwnershipByCompany = params => POST(`/screen/base/largeScreen/home/getTotalOwnershipByCompany`)
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,471 @@
|
|||
<template>
|
||||
<div class="centerTopPage">
|
||||
<div class="mapBox">
|
||||
<div id="mapEcharts"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as echarts from 'echarts'
|
||||
let mapChinaJson = require('@/untils/china.json')
|
||||
let ningxiaJson = require('@/untils/ningxia.json')
|
||||
import { getEquipmentDisByMapApi } from "../../api/screen";
|
||||
|
||||
export default {
|
||||
name: 'centerTopPage',
|
||||
data() {
|
||||
return {
|
||||
type: 1,
|
||||
zoom: 1.39,
|
||||
zoom2: 1.2,
|
||||
mapEcharts: null,
|
||||
mapEcharts2: null,
|
||||
mapJson: null,
|
||||
pointArea: [],
|
||||
pointAll: [],
|
||||
companyList: [],
|
||||
companyAreaList: [],
|
||||
isCity: 0,
|
||||
cityCount: [],
|
||||
gozoom: 1
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// this.getCompanyList()
|
||||
// this.getCompanyAreaList()
|
||||
// this.getCityCount()
|
||||
},
|
||||
mounted() {
|
||||
// this.getEquipmentDisByMapApiPage()
|
||||
this.getInitData()
|
||||
},
|
||||
methods: {
|
||||
getEquipmentDisByMapApiPage() {
|
||||
getEquipmentDisByMapApi().then(res => {
|
||||
console.log('res=====', res);
|
||||
})
|
||||
},
|
||||
getCompanyList() {
|
||||
let params = {
|
||||
provinceId: ''
|
||||
}
|
||||
getCompanyListByProvinceId(params).then(res => {
|
||||
if (res.success && res.data) {
|
||||
this.companyList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
getCompanyAreaList() {
|
||||
let params = {
|
||||
areaId: ''
|
||||
}
|
||||
getCompanyListByAreaId(params).then(res => {
|
||||
if (res.success && res.data) {
|
||||
this.companyAreaList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
|
||||
getInitData() {
|
||||
this.mapEcharts = echarts.init(document.getElementById('mapEcharts'))
|
||||
this.mapJson = mapChinaJson
|
||||
echarts.registerMap('china', this.mapJson)
|
||||
this.setMapOption('china')
|
||||
// this.setMapOption2()
|
||||
},
|
||||
setMapOption(name) {
|
||||
var option = {
|
||||
backgroundColor: 'rgba(0,0,0,0)',
|
||||
|
||||
series: [
|
||||
{
|
||||
name: 'MAP',
|
||||
type: 'map3D',
|
||||
map: name,
|
||||
zlevel: -10,
|
||||
boxWidth: 150,
|
||||
boxHeight:60,
|
||||
boxDepth: 90,//地图倾斜度
|
||||
regionHeight: 5,//地图厚度
|
||||
label: {
|
||||
show: true,//是否显示市
|
||||
textStyle: {
|
||||
color: "#fff",//文字颜色
|
||||
fontSize: 14,//文字大小
|
||||
// fontFamily: '微软雅黑',
|
||||
backgroundColor: "rgba(0,0,0,0)",//透明度0清空文字背景
|
||||
},
|
||||
},
|
||||
//三维视觉属性
|
||||
itemStyle: {
|
||||
opacity:1,
|
||||
color: 'rgba(35, 72, 174,0.5)',//地图颜色
|
||||
borderWidth: 1.5,
|
||||
borderColor: 'rgb(125, 239, 250)'
|
||||
},
|
||||
// 鼠标hover高亮
|
||||
emphasis: {
|
||||
label: {
|
||||
show: true,//是否显示标签
|
||||
textStyle: {
|
||||
color: '#fff',//高亮文字颜色
|
||||
fontSize: 16,
|
||||
fontFamily: '微软雅黑'
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
areaColor: '#7BE7FC',
|
||||
borderColor:'#7BE7FC',
|
||||
borderWidth:3,
|
||||
}
|
||||
},
|
||||
shading: 'lambert', // 三维地理坐标系组件中三维图形的着色效果，echarts-gl 中支持下面三种着色方式:
|
||||
// 'color' 只显示颜色，不受光照等其它因素的影响。
|
||||
// 'lambert' 通过经典的 lambert 着色表现光照带来的明暗。
|
||||
// 'realistic' 真实感渲染，配合 light.ambientCubemap 和 postEffect 使用可以让展示的画面效果和质感有质的提升。ECharts GL 中使用了基于物理的渲染（PBR） 来表现真实感材质。
|
||||
// realisticMaterial: {} // 真实感材质相关的配置项，在 shading 为'realistic'时有效。
|
||||
// lambertMaterial: {} // lambert 材质相关的配置项，在 shading 为'lambert'时有效。
|
||||
// colorMaterial: {} // color 材质相关的配置项，在 shading 为'color'时有效。
|
||||
light: {
|
||||
// 光照相关的设置。在 shading 为 'color' 的时候无效。 光照的设置会影响到组件以及组件所在坐标系上的所有图表。合理的光照设置能够让整个场景的明暗变得更丰富，更有层次。
|
||||
main: {
|
||||
// 场景主光源的设置，在 globe 组件中就是太阳光。
|
||||
color: '#fff', // 主光源的颜色。[ default: #fff ]
|
||||
intensity: 1.2, // 主光源的强度。[ default: 1 ]
|
||||
shadow: false, // 主光源是否投射阴影。默认关闭。 开启阴影可以给场景带来更真实和有层次的光照效果。但是同时也会增加程序的运行开销。
|
||||
// shadowQuality: 'high', // 阴影的质量。可选'low', 'medium', 'high', 'ultra' [ default: 'medium' ]
|
||||
alpha: 55, // 主光源绕 x 轴，即上下旋转的角度。配合 beta 控制光源的方向。[ default: 40 ]
|
||||
beta: 10 // 主光源绕 y 轴，即左右旋转的角度。[ default: 40 ]
|
||||
},
|
||||
ambient: {
|
||||
// 全局的环境光设置。
|
||||
color: '#fff', // 环境光的颜色。[ default: #fff ]
|
||||
intensity: 0.5 // 环境光的强度。[ default: 0.2 ]
|
||||
}
|
||||
},
|
||||
groundplane: {
|
||||
show: false
|
||||
},
|
||||
viewControl: {
|
||||
//distance: 150,// 地图视角 控制初始大小
|
||||
//rotateSensitivity: 1,// 旋转
|
||||
//zoomSensitivity: 1,// 缩放
|
||||
projection: 'perspective',
|
||||
autoRotate: false,
|
||||
damping: 0,
|
||||
rotateSensitivity: 2,//旋转操作的灵敏度
|
||||
rotateMouseButton: 'left', //旋转操作使用的鼠标按键
|
||||
zoomSensitivity:2, //缩放操作的灵敏度
|
||||
panSensitivity:2, //平移操作的灵敏度
|
||||
panMouseButton: 'right', //平移操作使用的鼠标按键
|
||||
distance:40, //默认视角距离主体的距离
|
||||
minDistance: 100,
|
||||
maxDistance: 170,
|
||||
minAlpha:30,
|
||||
maxAlpha:80,
|
||||
minBeta:-25,
|
||||
maxBeta:45,
|
||||
center:[0,0,0],
|
||||
animation: true,
|
||||
animationDurationUpdate: 1000,
|
||||
animationEasingUpdate: 'cubicInOut'
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
this.mapEcharts.setOption(option);
|
||||
},
|
||||
setMapOption2(){
|
||||
var option = {
|
||||
geo: [
|
||||
{
|
||||
type: 'map',
|
||||
map: 'china',
|
||||
zlevel: 0,
|
||||
zoom: 1,
|
||||
aspectScale: 0.96,
|
||||
layoutCenter: ['50%', '50.2%'],
|
||||
layoutSize: '150%',
|
||||
roam: false,
|
||||
silent: true,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
borderColor: '#7BE7FC',
|
||||
shadowColor: '#244AAF',
|
||||
borderWidth: 2,
|
||||
shadowOffsetY: 0,
|
||||
shadowBlur: 50,
|
||||
areaColor: '#458FD6',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'map',
|
||||
map: 'china',
|
||||
zlevel: -1,
|
||||
zoom: 1,
|
||||
aspectScale: 0.96,
|
||||
layoutCenter: ['50%', '51.4%'],
|
||||
layoutSize: '150%',
|
||||
roam: false,
|
||||
silent: true,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
borderColor: 'rgba(44, 89, 199,1)',
|
||||
shadowColor: 'rgba(195,26,59,0.5)',
|
||||
shadowOffsetY: 0,
|
||||
shadowBlur: 25,
|
||||
areaColor: 'rgba(44, 89, 199,0.1)',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'map',
|
||||
map: 'china',
|
||||
zlevel: -2,
|
||||
zoom: 1,
|
||||
aspectScale: 0.96,
|
||||
layoutCenter: ['50%', '52.8%'],
|
||||
layoutSize: '150%',
|
||||
roam: false,
|
||||
silent: true,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
borderColor: 'rgba(123, 231, 252,1)',
|
||||
shadowColor: 'rgba(195,26,59,0.5)',
|
||||
shadowOffsetY: 0,
|
||||
shadowBlur: 20,
|
||||
areaColor: 'rgba(5,21,35,0.1)',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'map',
|
||||
map: 'china',
|
||||
zlevel: -3,
|
||||
zoom: 1,
|
||||
aspectScale: 0.96,
|
||||
layoutCenter: ['50%', '54.2%'],
|
||||
layoutSize: '150%',
|
||||
roam: false,
|
||||
silent: true,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
borderColor: 'rgba(123, 231, 252,1)',
|
||||
shadowColor: 'rgba(195,26,59,0.8)',
|
||||
shadowOffsetY: 0,
|
||||
shadowBlur: 15,
|
||||
areaColor: 'rgba(5,21,35,0.1)',
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
type: 'map',
|
||||
mapType: 'china',
|
||||
aspectScale: 0.96,
|
||||
layoutCenter: ['50%', '50%'],
|
||||
layoutSize: '150%',
|
||||
zoom: 1,
|
||||
roam: false,
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
},
|
||||
},
|
||||
emphasis: {
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
areaColor: '#2C59C7',
|
||||
borderColor: '#7BE7FC',
|
||||
borderWidth: 2,
|
||||
},
|
||||
emphasis: {
|
||||
areaColor: '#7BE7FC',
|
||||
// areaColor: {
|
||||
// type: 'linear',
|
||||
// x: 0,
|
||||
// y: 0,
|
||||
// x2: 0,
|
||||
// y2: 1,
|
||||
// colorStops: [
|
||||
// {
|
||||
// offset: 0,
|
||||
// color: '#0C1D75', // 0% 处的颜色
|
||||
// },
|
||||
// {
|
||||
// offset: 1,
|
||||
// color: '#7BE7FC', // 100% 处的颜色
|
||||
// },
|
||||
// ],
|
||||
// globalCoord: false, // 缺省为 false
|
||||
// },
|
||||
borderColor: '#7BE7FC',
|
||||
label: {
|
||||
show: true,
|
||||
color: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
this.mapEcharts.setOption(option);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.centerTopPage {
|
||||
width: 100%;
|
||||
height: 627px;
|
||||
// background:palegoldenrod;
|
||||
margin-bottom: 2%;
|
||||
padding: 0 10px;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
.iconMap {
|
||||
display: block !important;
|
||||
visibility: visible !important;
|
||||
opacity: 1;
|
||||
}
|
||||
.buttonTop {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.buttom1 {
|
||||
width: 110px;
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
border-radius: 4px;
|
||||
color: #55f3fb;
|
||||
// background: url(../../assets/img/checked.png) no-repeat center;
|
||||
background-size: 110px 32px;
|
||||
margin-right: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.buttom1.on {
|
||||
color: #0095ff;
|
||||
// background: url(../../assets/img/checked_on.png) no-repeat center;
|
||||
background-size: 110px 32px;
|
||||
}
|
||||
.mapBox {
|
||||
width: 100%;
|
||||
height: 97%;
|
||||
display: flex;
|
||||
position: relative;
|
||||
#mapEcharts {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#mapEcharts2 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
z-index: 1000;
|
||||
}
|
||||
.label-box {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 40px;
|
||||
// background: url('../../assets/img/home/labelBg.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
padding: 10px 15px;
|
||||
.item {
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
color: #fff;
|
||||
position: relative;
|
||||
padding-left: 15px;
|
||||
font-size: 16px;
|
||||
}
|
||||
.item:before {
|
||||
content: '';
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: #06bbf2;
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
left: 0px;
|
||||
}
|
||||
.itemColor1:before {
|
||||
background: #06bbf2;
|
||||
}
|
||||
.itemColor2:before {
|
||||
background: #2df0fe;
|
||||
}
|
||||
.itemColor3:before {
|
||||
background: #10e0a5;
|
||||
}
|
||||
.itemColor4:before {
|
||||
background: #dcef4e;
|
||||
}
|
||||
.itemColor5:before {
|
||||
background: #f48413;
|
||||
}
|
||||
.itemColor6:before {
|
||||
background: #fc5403;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style>
|
||||
.scrollTooltip::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
.scrollTooltip::-webkit-scrollbar-thumb {
|
||||
background-color: #1653a6;
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 #1653a6;
|
||||
}
|
||||
.itemColor {
|
||||
position: relative;
|
||||
padding-left: 15px;
|
||||
line-height: 22px;
|
||||
}
|
||||
.itemColor:before {
|
||||
content: '';
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: #06bbf2;
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
left: 0px;
|
||||
}
|
||||
.itemColor1:before {
|
||||
background: #06bbf2;
|
||||
}
|
||||
.itemColor2:before {
|
||||
background: #2df0fe;
|
||||
}
|
||||
.itemColor3:before {
|
||||
background: #10e0a5;
|
||||
}
|
||||
.itemColor4:before {
|
||||
background: #dcef4e;
|
||||
}
|
||||
.itemColor5:before {
|
||||
background: #f48413;
|
||||
}
|
||||
.itemColor6:before {
|
||||
background: #fc5403;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -42,7 +42,7 @@ export default {
|
|||
isCollapse: false,
|
||||
newArrOne: [
|
||||
{ name: '施工机具总保有量', value: 9999 },
|
||||
{ url: GROUP, name: '工器具总保有量', value: 9999 },
|
||||
// { url: GROUP, name: '工器具总保有量', value: 9999 },
|
||||
],
|
||||
newArr: [
|
||||
{ url: GROUP, name: '在库机具', value: 999 },
|
||||
|
|
@ -75,7 +75,7 @@ export default {
|
|||
getTotalOwnershipApi().then(res => {
|
||||
this.newArrOne.push(
|
||||
{ name: '施工机具总保有量', value: res.data[0].totalOwnershipNum },
|
||||
{ url: GROUP, name: '工器具总保有量', value: res.data[1].totalOwnershipNum },
|
||||
// { url: GROUP, name: '工器具总保有量', value: res.data[1].totalOwnershipNum },
|
||||
)
|
||||
this.newArr.push(
|
||||
{ url: GROUP, name: '在库机具', value: res.data[0].stockNum },
|
||||
|
|
@ -83,11 +83,11 @@ export default {
|
|||
{ url: GROUP, name: '在用机具', value: res.data[0].useNum },
|
||||
{ url: GROUP, name: '在修机具', value: res.data[0].repairNum },
|
||||
{ url: GROUP, name: '报废机具', value: res.data[0].scrapNum },
|
||||
{ url: GROUP, name: '在库工器具', value: res.data[1].stockNum },
|
||||
{ url: GROUP, name: '待入库工器具', value: res.data[1].storedNum },
|
||||
{ url: GROUP, name: '在用工器具', value: res.data[1].useNum },
|
||||
{ url: GROUP, name: '在修工器具', value: res.data[1].repairNum },
|
||||
{ url: GROUP, name: '报废工器具', value: res.data[1].scrapNum },
|
||||
// { url: GROUP, name: '在库工器具', value: res.data[1].stockNum },
|
||||
// { url: GROUP, name: '待入库工器具', value: res.data[1].storedNum },
|
||||
// { url: GROUP, name: '在用工器具', value: res.data[1].useNum },
|
||||
// { url: GROUP, name: '在修工器具', value: res.data[1].repairNum },
|
||||
// { url: GROUP, name: '报废工器具', value: res.data[1].scrapNum },
|
||||
)
|
||||
})
|
||||
},
|
||||
|
|
|
|||
|
|
@ -0,0 +1,209 @@
|
|||
<!-- 各公司机具保有量 -->
|
||||
<template>
|
||||
<div class="access-rate-page">
|
||||
<div class="access-rate-box">
|
||||
<div class="access-rate-box-title-bg">
|
||||
<h5 class="access-rate-box-title">各公司机具保有量</h5>
|
||||
</div>
|
||||
<div id="deviceInventory"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as echarts from 'echarts';
|
||||
import CountFlopOne from './countFlopOne.vue'
|
||||
import { getTotalOwnershipByCompany } from "../../api/screen";
|
||||
|
||||
export default {
|
||||
name: 'accessRatePage',
|
||||
components: {
|
||||
CountFlopOne
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
nameList: [],
|
||||
valueList2: [],
|
||||
valueList: [],
|
||||
maType: ''
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$eventBus.$on('maType', (maType) => {
|
||||
this.maType = maType
|
||||
this.getScrapAnalysisByMonthApiPage()
|
||||
});
|
||||
setInterval(() => {
|
||||
this.getScrapAnalysisByMonthApiPage()
|
||||
}, 60 * 1000);
|
||||
},
|
||||
destroyed() {
|
||||
this.$eventBus.$off('maType');
|
||||
},
|
||||
methods: {
|
||||
getScrapAnalysisByMonthApiPage() {
|
||||
// let params = {
|
||||
// maType: this.maType
|
||||
// }
|
||||
this.nameList = []
|
||||
this.valueList2 = []
|
||||
this.valueList = []
|
||||
getTotalOwnershipByCompany().then(res => {
|
||||
if (res.code == 200) {
|
||||
this.nameList = res.data.map(item => item.companyName)
|
||||
this.valueList = res.data.map(item => item.totalOwnershipNum)
|
||||
// this.nameList.push(item)
|
||||
// })
|
||||
// res.data.nameList.map(item => {
|
||||
// this.nameList.push(item)
|
||||
// })
|
||||
// res.data.valueList.map(item => {
|
||||
// this.valueList.push(item)
|
||||
// })
|
||||
// res.data.valueList2.map(item => {
|
||||
// this.valueList2.push(item)
|
||||
// })
|
||||
this.getInitData();
|
||||
}
|
||||
})
|
||||
},
|
||||
getInitData() {
|
||||
var echartOption = {
|
||||
grid: {
|
||||
left: "5%",
|
||||
right: "5%",
|
||||
bottom: "5%",
|
||||
top: "10%",
|
||||
containLabel: true,
|
||||
},
|
||||
// tooltip: {
|
||||
// trigger: "axis",
|
||||
// axisPointer: {
|
||||
// type: "none",
|
||||
// },
|
||||
// formatter: function (params) {
|
||||
// return (
|
||||
// params[0].name +
|
||||
// "<br/>" +
|
||||
// "<span style='display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:rgba(36,207,233,0.9)'></span>" +
|
||||
// params[0].seriesName +
|
||||
// " : " +
|
||||
// Number(
|
||||
// (params[0].value.toFixed(4) / 10000).toFixed(2)
|
||||
// ).toLocaleString() +
|
||||
// "<br/>"
|
||||
// );
|
||||
// },
|
||||
// },
|
||||
xAxis: {
|
||||
show: true,
|
||||
type: "value",
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
type: "category",
|
||||
inverse: true,
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
},
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
data: this.nameList,
|
||||
},
|
||||
{
|
||||
type: "category",
|
||||
inverse: true,
|
||||
axisTick: "none",
|
||||
axisLine: "none",
|
||||
show: true,
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: "#ffffff",
|
||||
fontSize: "12",
|
||||
},
|
||||
formatter: function (value) {
|
||||
if (value >= 10000) {
|
||||
return (value / 10000).toLocaleString() +'万';
|
||||
} else {
|
||||
return value.toLocaleString();
|
||||
}
|
||||
},
|
||||
},
|
||||
data: this.valueList,
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: "保有量",
|
||||
type: "bar",
|
||||
zlevel: 1,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
barBorderRadius: 0,
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "#133062",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#60CBF9",
|
||||
},
|
||||
]),
|
||||
},
|
||||
},
|
||||
barWidth: 20,
|
||||
data: this.valueList,
|
||||
},
|
||||
],
|
||||
};
|
||||
let myCharts = echarts.init(document.querySelector('#deviceInventory'));
|
||||
myCharts.setOption(echartOption)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.access-rate-page {
|
||||
margin-bottom: 31px;
|
||||
.access-rate-box {
|
||||
.access-rate-box-title-bg {
|
||||
width: 433px;
|
||||
height: 50px;
|
||||
background: url(../../assets/img/myImage/title_left.png) no-repeat center;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
.access-rate-box-title {
|
||||
position: absolute;
|
||||
left: 6%;
|
||||
top: 28%;
|
||||
font-size: 20px;
|
||||
font-family: Alibaba PuHuiTi, Alibaba PuHuiTi;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
line-height: 23px;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
}
|
||||
#deviceInventory {
|
||||
width: 433px;
|
||||
height: 500px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -4,10 +4,10 @@
|
|||
<div class="access-rate-box-title-bg">
|
||||
<h5 class="access-rate-box-title">领料数据</h5>
|
||||
</div>
|
||||
<CountFlopOne :val="num" sonTitle="施工工具今日出库"></CountFlopOne>
|
||||
<div class="access-rate-box-top">
|
||||
<CountFlopOne :val="num" sonTitle="施工机具今日出库"></CountFlopOne>
|
||||
<!-- <div class="access-rate-box-top">
|
||||
<CountFlopOne :val="num2" sonTitle="工器具今日出库"></CountFlopOne>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<div class="access-rate-box-title-bg">
|
||||
<h5 class="access-rate-box-title">退料数据</h5>
|
||||
</div>
|
||||
<CountFlopTwo :val="num" sonTitle="施工机具今日退库"></CountFlopTwo>
|
||||
<div class="access-rate-box-top">
|
||||
<CountFlopTwo :val="num" sonTitle="施工机具今日入库"></CountFlopTwo>
|
||||
<!-- <div class="access-rate-box-top">
|
||||
<CountFlopTwo :val="num2" sonTitle="工器具今日退料"></CountFlopTwo>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -8,7 +8,9 @@
|
|||
<div class="leftModuleBox">
|
||||
<LeftOne></LeftOne>
|
||||
<LeftTwo></LeftTwo>
|
||||
<LeftThree></LeftThree>
|
||||
<!-- <LeftThree></LeftThree> -->
|
||||
<LeftFour></LeftFour>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 中间3D效果展示 -->
|
||||
|
|
@ -17,12 +19,15 @@
|
|||
<CenterFold></CenterFold>
|
||||
</div>
|
||||
<div class="center-top">
|
||||
<CountryMap></CountryMap>
|
||||
<!-- 宁夏地图 -->
|
||||
<!-- <CountryMap></CountryMap> -->
|
||||
<!-- 重庆地图 -->
|
||||
<Center3DMap></Center3DMap>
|
||||
</div>
|
||||
<div class="center-bottom">
|
||||
<CenterBottom></CenterBottom>
|
||||
</div>
|
||||
<div class="buttom-box">
|
||||
<!-- <div class="buttom-box">
|
||||
<div class="buttonTop">
|
||||
<div
|
||||
:class="maType == 1 ? 'on' : ''"
|
||||
|
|
@ -39,14 +44,15 @@
|
|||
工器具
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<!-- 右侧数据模块列表 -->
|
||||
<div class="rightModuleBox">
|
||||
<RightOne></RightOne>
|
||||
<rightTwo></rightTwo>
|
||||
<rightThree></rightThree>
|
||||
<RightFour></RightFour>
|
||||
<LeftThree></LeftThree>
|
||||
<!-- <RightFour></RightFour> -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- 获取天气 -->
|
||||
|
|
@ -83,12 +89,14 @@
|
|||
import LeftOne from '../../components/home/leftOne.vue'
|
||||
import LeftTwo from '../../components/home/leftTwo.vue'
|
||||
import LeftThree from '../../components/home/leftThree.vue'
|
||||
import LeftFour from '../../components/home/leftFour.vue'
|
||||
import RightOne from '../../components/home/rightOne.vue'
|
||||
import rightTwo from '../../components/home/rightTwo.vue'
|
||||
import rightThree from '../../components/home/rightThree.vue'
|
||||
import RightFour from '../../components/home/rightFour.vue'
|
||||
import CenterBottom from '../../components/home/centerBottom.vue'
|
||||
import CenterTop from '../../components/home/centerTop.vue'
|
||||
import Center3DMap from '../../components/home/Center3DMap.vue'
|
||||
import CountryMap from '../../components/home/countryMap.vue'
|
||||
import CenterFold from '../../components/home/centerFold.vue'
|
||||
import { getMaintenanceWarningApi } from "../../api/screen";
|
||||
|
|
@ -97,11 +105,13 @@ export default {
|
|||
LeftOne,
|
||||
LeftTwo,
|
||||
LeftThree,
|
||||
LeftFour,
|
||||
RightOne,
|
||||
rightTwo,
|
||||
rightThree,
|
||||
RightFour,
|
||||
CenterBottom,
|
||||
Center3DMap,
|
||||
CenterTop,
|
||||
CountryMap,
|
||||
CenterFold
|
||||
|
|
|
|||
Loading…
Reference in New Issue