vue-irrigation-tiny-tools
v0.4.42
Published
水利小工具 :)
Readme
vue-irrigation-tiny-tools
水利小工具 :)
此项目新增功能模块规范
步骤
1.在/src/components 下新创建文件夹(小驼峰),文件夹下新建同名vue组件(大驼峰) 2.修改index.js与main.js 将自己的组件引入
规范
1.组件传参,需要考虑用户不传参的默认值,根据具体情况,可以在prop中写入default或者在代码中写入判断
LegendDynamic 图例
参数
如非特殊标明,均可非必填
| 属性 | 类型 |描述|备注| | ---- | ---- |----|----| |expendAll|boolean(true)|是否需要全部展开按钮| |checkbox|object|内置折叠面板是否有复选框|{rainStation: true,Reservoirs: true,smallReservoirs: true,hydrometricStation: true,waterLevelStation: true,riskLevel: true,isosurface: true,} | legendAbbr | boolean(true) |是否需要缩略图标|非必填 | imgAbbr | string |缩略图标图片路径| | legendWidth | number |整个图例宽度| | liWidth | number |每项图例的宽度|通过调节 legendWidth 与 liWidth 可控制每行多少个图例 | legendBorder | boolean(true) |是否需要图例外部的边框样式 | legendTool | boolean(true) |是否需要标题栏 | legendTitle | string |标题名称 | closeBtn | boolean(true) |是否需要关闭按钮 |commonList|Object(默认全部展示非选中)|下方多选折叠面板|详细格式见下方,不传展示全部面板,传空对象则为空 |commonLegendShow|boolean(true)|是否展示下方折叠面板| | legendList | array |自定义图标数组|详细格式如下 | collapseList | array |折叠面板图标数组|(绑定方式为v-model:collapseList="collapseList")每新增一个折叠面板,数组中多一个对象,collapseList每个对象中的legendList同下
数据格式:
collapseList:[{
title: "风险等级",
key:"riskLevel",
checked: false,
checkbox:true,//是否需要复选框
indeterminate:true,//是否部分选中状态(为true时,优先级在checked上)
legendList: [],//写法同legendList
},
{
title: "风险等级",
key:"riskLevel",
checked: false,
checkbox:false,
legendList: [],//写法同legendList
}],其中legendList格式如下:
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- |----|----| |src| string |每项图例左侧是图片|src/colorCircular/colorBlock/value此四个属性可单独或同时使用 |colorCircular| string |每项图例左侧是圆形色块|同上 |colorBlock| string |每项图例左侧是方形色块|同上 |value| string |每项图例左侧是文字|同上 |unchecked|boolean(true)|是否选中图片|当以上src/colorCircular/colorBlock属性存在时,额外提供此参数实现点击图例置灰及显示的功能(true:图片路径为 src,false:图片路径为unCheckedSrc) |uncheckedSrc|string|非选中的图片路径|当同时存在src及unchecked参数时,需要此属性展示未选择展示图片 |change|boolean|是否需要切换图例图片|参数为false时,点击图例图片不会切换,默认可以不传
其中commonList格式如下:
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- |----|----| |rainStation| Array |雨量站|共六项,图例是否选中默认值,[false,true,true,false,true,false],true为未选中灰色,true为选中彩色,若数组数量不对,则全置为灰色 |Reservoirs| Array |大中型水库|共四项 |smallReservoirs| Array |小型水库|共四项 |hydrometricStation| Array |水文站|共三项 |waterLevelStation| Array |水位站|共三项 |riskLevel| Array |风险等级|共三项 |isosurface| Array |等值面|共六项
插槽
left //在图例外层提供插槽
content //在图例标题栏与内容直接提供插槽事件
closeLegend //关闭图标点击事件
legendAbbrClick //缩略图图标点击事件
liClick //单项图例点击事件
checkItem //折叠面板多选按钮点击事件雨量过程图组件-AccumulatedRainfall
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |rainData| Object| 雨量过程数据| 其中对象包含的属性为下表字段 对象中的属性除了时间(tm)若不需要可以不传 | |searchShow| Boolean| 是否展示查询框| 用于外层div较小时 | |commonlyTM| Boolean| 是否展示常用时间| | |beginTime| String| 开始时间| 无数据是传''空字符串 | |endTime| String| 结束时间| 无数据是传''空字符串 | |isPart| Boolean| 是否部分展示| 为true时 默认展示前六条数据 |
rainData属性详情
| rainData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |drp| Array| 降雨量| 无数据时请传[]空数组 | |totalDrp| Array| 累计降雨量| 无数据时请传[]空数组 | |drpForecast| Array| 预报降雨量| 无数据时请传[]空数组 | |totalDrpForecast| Array| 预报累计降雨量| 无数据时请传[]空数组 | |tm| Array| 时间| 无数据时请传[]空数组 数组内格式为['yyyy-mm-dd HH:mm:ss','yyyy-mm-dd HH:mm:ss'] | |tmCurrent| String| 当前时间| 格式为'yyyy-mm-dd HH:mm:ss'(无数据时请传''空字符串) |
事件
timeChange // 时间选择事件,必需声明,返回数据格式为 ['开始时间','结束时间']雨量过程图组件-AccumulatedRainfallV2
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |rainData| Object| 雨量过程数据| 其中对象包含的属性为下表字段 对象中的属性除了时间(tm)若不需要可以不传 | |searchShow| Boolean| 是否展示查询框| 用于外层div较小时 | |query| Object| 查询条件| | |shortcuts| String| 结束时间| 无数据是传''空字符串 | |isPart| Boolean/Number| 是否部分展示| 为数字时 默认展示前n条数据 | |shotcutParse2Range| Function| shortcut选中后转化为时间范围的换算方法,默认为当前时刻向前推算选中的时长| function(value: Number): [beginTime, endDate] {} | |beforeRender| Function| 该方法在调用 echart.setOption 之前调用,接受到的参数是组装好的echarts options数据,返回的数据会被传入到 echart.setOption 中,支持返回一个 Promise ,resolve的参数会被传入到 echart.setOption 中。| 用来对echarts配置进行修改,从而实现组件的特殊化定制; |
query属性 | 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |query.beginTime| String| 结束时间| 无数据是传''空字符串 | |query.endTime| String| 结束时间| 无数据是传''空字符串 |
shortcuts属性 | 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |value| String| 值| | |label| String| 显示文字| |
rainData属性详情
| rainData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |drp| Array| 降雨量| 无数据时请传[]空数组 | |totalDrp| Array| 累计降雨量| 无数据时请传[]空数组 | |drpForecast| Array| 预报降雨量| 无数据时请传[]空数组 | |totalDrpForecast| Array| 预报累计降雨量| 无数据时请传[]空数组 | |tm| Array| 时间| 无数据时请传[]空数组 数组内格式为['yyyy-mm-dd HH:mm:ss','yyyy-mm-dd HH:mm:ss'] | |tmCurrent| String| 当前时间| 格式为'yyyy-mm-dd HH:mm:ss'(无数据时请传''空字符串) |
slot插槽 | 插槽名 | 说明 | | ---- | ----------- | |query| 自定义筛选的条件,作用域回传 query, shortcuts|
事件
timeChange // 时间选择事件,必需声明,返回数据格式为 ['开始时间','结束时间']水位流量过程线组件-StageDischargeLine
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |stageDischargeData| Object| 水位流量过程数据| 其中对象包含的属性为下表字段 对象中的属性除了时间(tm)若不需要可以不传 | |searchShow| Boolean| 是否展示查询框| 用于外层div较小时 | |commonlyTM| Boolean| 是否展示常用时间| | |isFacing| Boolean| 是否贴到Y轴| | |beginTime| String| 开始时间| 无数据是传''空字符串 | |endTime| String| 结束时间| 无数据是传''空字符串 | |selectLegend| Object| 图例选中状态| 自定义图例选中状态格式{'api预报水位': false, '预报水位': true} 默认为全部选中状态 | |precision| Number| 水位线y轴在取整时舍进位的精度,非必传默认值为5| 比如最高水位xMax传入211.36,会根据精度换算到215 | |beforeRender| Function| 该方法在调用 echart.setOption 之前调用,接受到的参数是组装好的echarts options数据,返回的数据会被传入到 echart.setOption 中,支持返回一个 Promise ,resolve的参数会被传入到 echart.setOption 中。| 用来对echarts配置进行修改,从而实现组件的特殊化定制; | |validProps| Function| 该方法在接收到stageDischargeData和其发生改变时执行,接收参数是 stageDischargeData。 | 组件内增加了对 保证水位 和 警戒水位的验证,未传入用 ElMessage 给出警告提示(该方法为了快速支持已引用部分的快速验证)。为了实现组件默认支持全部验证又允许部分组件对某一项进行验证。 | |markPointInfo| Object| 水位流量气泡展示状态 | {z: false,q: false} |
stageDischargeData属性详情
| stageDischargeData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |drp| Array| 降雨量| 无数据时请传[]空数组 | |drpForecast| Array| 预报降雨量| 无数据时请传[]空数组 | |z| Array| 监测水位| 无数据时请传[]空数组 | |q| Array| 监测流量| 无数据时请传[]空数组 | |zForecast| Array| 预报水位| 无数据时请传[]空数组 | |zForecastAPI| Array| api预报水位| 无数据时请传[]空数组 | |zForecastXAJ| Array| 新安江预报水位| 无数据时请传[]空数组 | |zForecastSKBY| Array| 时空变源预报水位| 无数据时请传[]空数组 | |qForecast| Array| 预报流量| 无数据时请传[]空数组 | |qForecastAPI| Array| api预报流量| 无数据时请传[]空数组 | |qForecastXAJ| Array| 新安江预报流量| 无数据时请传[]空数组 | |qForecastSKBY| Array| 时空变源预报流量| 无数据时请传[]空数组 | |tm| Array| 时间| 无数据时请传[]空数组 数组内格式为['yyyy-mm-dd HH:mm:ss','yyyy-mm-dd HH:mm:ss'] | |tmCurrent| String| 当前时间| 格式为'yyyy-mm-dd HH:mm:ss'(无数据时请传''空字符串) | |zWarn| String| 警戒水位| 无数据时请传''空字符串 | |zGuarantee| String| 保证水位| 无数据时请传''空字符串 | |zMax| String| 水位轴最大水位| 无数据时请传''空字符串 | |zMin| String| 水位轴最小水位| 无数据时请传''空字符串 |
事件
timeChange // 时间选择事件,必需声明,返回数据格式为 ['开始时间','结束时间']水库水位流量过程线组件-StageDischargeLineReservoir
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |stageDischargeData| Object| 水位流量过程数据| 其中对象包含的属性为下表字段 对象中的属性除了时间(tm)若不需要可以不传 | |searchShow| Boolean| 是否展示查询框| 用于外层div较小时 | |commonlyTM| Boolean| 是否展示常用时间| | |isFacing| Boolean| 是否贴到Y轴| | |beginTime| String| 开始时间| 无数据是传''空字符串 | |endTime| String| 结束时间| 无数据是传''空字符串 | |selectLegend| Object| 图例选中状态| 自定义图例选中状态格式{'api预报水位': false, '预报水位': true} 默认为全部选中状态 | |axleInfo| Array| y轴位置信息| [{ type: 'z',position: 'left',offset: 0 },{ type: 'q',position: 'right',offset: 0 },{ type: 'rain',position: 'right',offset: 45,nameLocation: 'start' }], | |precision| Number| 水位线y轴在取整时舍进位的精度,非必传默认值为5| 比如最高水位xMax传入211.36,会根据精度换算到215 | |beforeRender| Function| 该方法在调用 echart.setOption 之前调用,接受到的参数是组装好的echarts options数据,返回的数据会被传入到 echart.setOption 中,支持返回一个 Promise ,resolve的参数会被传入到 echart.setOption 中。| 用来对echarts配置进行修改,从而实现组件的特殊化定制; | |validProps| Function| 该方法在接收到stageDischargeData和其发生改变时执行,接收参数是 stageDischargeData。 | 组件内增加了对 汛限水位、允许壅高水位 和 警戒水位的验证,未传入用 ElMessage 给出警告提示(该方法为了快速支持已引用部分的快速验证)。为了实现组件默认支持全部验证又允许部分组件对某一项进行验证。 | |markPointInfo| Object| 水位流量气泡展示状态 | {z: false,qIn: false,qOut: false } |
stageDischargeData属性详情
| stageDischargeData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |drp| Array| 面降雨量| 无数据时请传[]空数组 | |z| Array| 库水位| 无数据时请传[]空数组 | |qIn| Array| 入库流量| 无数据时请传[]空数组 | |qOut| Array| 出库流量| 无数据时请传[]空数组 | |zForecast| Array| 预报库水位| 无数据时请传[]空数组 | |qInForecast| Array| 预报入库流量| 无数据时请传[]空数组 | |qOutForecast| Array| 预报出库流量| 无数据时请传[]空数组 | |tm| Array| 时间| 无数据时请传[]空数组 数组内格式为['yyyy-mm-dd HH:mm:ss','yyyy-mm-dd HH:mm:ss'] | |tmCurrent| String| 当前时间| 格式为'yyyy-mm-dd HH:mm:ss'(无数据时请传''空字符串) | |zLimit| String| 汛限水位| 无数据时请传''空字符串 | |zDesign / allRaiseLev| String| 允许壅高水位| 无数据时请传''空字符串 | |zCheck / warningStag| String| 警戒水位| 无数据时请传''空字符串 | |allMaxLev| String| 允许最高水位| 无数据时请传''空字符串 | |zMax| String| 水位轴最大水位| 无数据时请传''空字符串 | |zMin| String| 水位轴最小水位| 无数据时请传''空字符串 |
axleInfo属性详情
| axleInfo属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |type| String| y轴类型| z: 水位 q: 流量 rain: 雨量 必填 | |position| String| y轴位置| left: 左边 right: 右边 必填 | |offset| Number| 偏移距离 | 默认0 非必填 | |nameLocation| String| 标签位置 | start: 轴开始位置 end: 轴结束位置 |
事件
timeChange // 时间选择事件,必需声明,返回数据格式为 ['开始时间','结束时间']断面横剖面组件-CrossSection
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |crossSectionData| Object| 断面横剖面数据| 其中对象包含的属性为下表字段 | |showLabel| Boolean| 是否显示label标签| | |zoomShow| Boolean| 是否显示dataZomm| |
crossSectionData属性详情
| crossSectionData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |stageInfo| Array| 水位信息| 格式为[{name: '水位流量关系曲线', z: ['113.000', '113.500',...]}] 其中 name为曲线名称 z为水位数据| |z| String| 当前水位| 无数据时请传''空字符串| |q| String| 当前流量| 无数据时请传''空字符串| |zWarn| String| 警戒水位| 无数据时请传''空字符串 | |zGuarantee| String| 保证水位| 无数据时请传''空字符串 | |section| Array| 断面数据| 无数据时请传[]空数组 格式为[{ elevation: 175.882, startingDistance: 0.0, remark: '起点' },{ elevation: 175.892, startingDistance: 4.078, remark: null }] |
section数组中对象属性详情
| 属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |startingDistance| Number | 起点距| | |elevation| Number| 高程| | |remark| String| 备注| 无数据时请传''空字符串|
水位流量关系曲线组件-StageDischargeRelation
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |stageDischargeData| Object| 水位流量关系曲线数据| 其中对象包含的属性为下表字段 |
stageDischargeData属性详情
| stageDischargeData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |stageInfo| Array| 水位信息| 格式为[{name: '水位流量关系曲线', z: ['113.000', '113.500',...]}] 其中 name为曲线名称 z为水位数据| |q| Array| 流量| 无数据时请传[]空数组 | |zWarn| String| 警戒水位| 无数据时请传''空字符串 | |zGuarantee| String| 保证水位| 无数据时请传''空字符串 |
水位库容曲线组件-StorageCurve
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |storageCurveData| Object| 水位库容曲线数据| 其中对象包含的属性为下表字段 |
storageCurveData属性详情
| storageCurveData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |z| Array| 水位|无数据时请传[]空数组| |capacity| Array| 库容|无数据时请传[]空数组| |unit| Object | 水位库容单位 |默认: { z: "m", capacity: "万m³" } | |currentZ| String | 当前水位 | | |currentCapacity| String | 当前库容 | |
水位水面积曲线组件-WaterSurfaceArea
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |waterSurfaceAreaData| Object| 水位水面积曲线数据| 其中对象包含的属性为下表字段 |
waterSurfaceAreaData属性详情
| waterSurfaceAreaData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |z| Array| 水位|无数据时请传[]空数组| |capacity| Array| 水面积|无数据时请传[]空数组| |unit| Object | 水位水面积单位 |默认: { z: "m", capacity: "万m³" } | |currentZ| String | 当前水位 | | |currentCapacity| String | 当前水面积 | |
水库剖面图组件-ReservoirProfile
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |profileData| Object| 水库剖面数据| 其中对象包含的属性为下表字段 | |titleShow| Boolean| 是否展示标题| |
profileData属性详情
| profileData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |z| Number| 当前水位|无数据时请传0| |zForecast| Number| 预报最高水位|无数据时请传0| |maxZ| Number| 最高水位|无数据时请传0| |zCheck| Number| 警戒水位|无数据时请传0| |zDesign| Number| 允许壅高水位|无数据时请传0| |crestElevation| Number| 坝顶高程|无数据时请传0| |zLimit| Number| 汛限水位|无数据时请传0| |zDead| Number| 死水位|无数据时请传0| |zNormal| Number| 正常蓄水位|无数据时请传0| |zXunqianLimit| Number| 汛前水位|无数据时请传0| |zXunzhongLimit| Number| 汛中水位|无数据时请传0| |zXunmoLimit| Number| 汛末水位|无数据时请传0| |timeForecast| String| 预报最高水位时间| 格式为'yyyy-mm-dd HH:mm:ss' 无数据时请传''| |color| String| 标题字体颜色|格式为'#ffffff' 无数据时请传''或者null|
水库剖面图组件-ReservoirCrossSection
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |profileData| Object| 水库剖面数据| 其中对象包含的属性为下表字段 | |titleShow| Boolean| 是否展示标题| |
profileData属性详情
| profileData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |z| Number| 当前水位|无数据时请传0| |zForecast| Number| 预报最高水位|无数据时请传0| |zCheck| Number| 警戒水位|无数据时请传0| |zDesign| Number| 允许壅高水位|无数据时请传0| |crestElevation| Number| 坝顶高程|无数据时请传0| |zLimit| Number| 汛限水位|无数据时请传0| |timeForecast| String| 预报最高水位时间| 格式为'yyyy-mm-dd HH:mm:ss' 无数据时请传''| |color| String| 标题字体颜色|格式为'#ffffff' 无数据时请传''或者null|
水库剖面图组件-ReservoirCrossSectionImg
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |profileData| Object| 水库剖面数据| 其中对象包含的属性为下表字段 | |titleShow| Boolean| 是否展示标题| |
profileData属性详情
| profileData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |z| Number| 当前水位|无数据时请传0| |zForecast| Number| 预报最高水位|无数据时请传0| |zCheck| Number| 警戒水位|无数据时请传0| |zDesign| Number| 允许壅高水位|无数据时请传0| |crestElevation| Number| 坝顶高程|无数据时请传0| |zLimit| Number| 汛限水位|无数据时请传0| |zAllow| Number| 允许最高水位|无数据时请传0| |pondage| Number| 蓄水量|无数据时请传0| |control| Number| 防洪库容|无数据时请传0| |retention| Number| 拦洪库容|无数据时请传0| |regulation| Number| 调洪库容|无数据时请传0| |timeForecast| String| 预报最高水位时间| 格式为'yyyy-mm-dd HH:mm:ss' 无数据时请传''| |color| String| 标题字体颜色|格式为'#ffffff' 无数据时请传''或者null|
雨量同期对比组件-RainfallSynchronization
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |rainData| Object| 雨量同期数据| 其中对象包含的属性为下表字段 对象中的属性除了时间(tm)若不需要可以不传 | |searchShow| Boolean| 是否展示查询框| 用于外层div较小时 | |commonlyTM| Boolean| 是否展示常用时间| | |beginTime| String| 开始时间| 无数据是传''空字符串 | |endTime| String| 结束时间| 无数据是传''空字符串 |
rainData属性详情
| rainData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |historyMax| Array| 历史同期降雨| 无数据时请传[]空数组 | |lastSamePeriod| Array| 去年同期降雨| 无数据时请传[]空数组 | |currentValue| Array| 当前降雨| 无数据时请传[]空数组 | |tm| Array| 时间| 无数据时请传[]空数组 数组内格式为['yyyy-mm-dd HH:mm:ss','yyyy-mm-dd HH:mm:ss'] |
闸门状态组件-SluiceStatus
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |sluiceData| Array| 闸门状态数据| | |sluiceTitle| String| 站点名称| |
sluiceData属性详情
| sluiceData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |Height| String| 闸门开度| 10为100% | |STCD| String| 站点编码| | |TM| String| 时间| |
河道纵剖面组件-RiverLongitudinalProfile
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |riverData| Object| 河道纵剖面数据| |
riverData属性详情
| riverData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |name| String| 断面点名称| | |elevation| Array| 河底高程 | | |leftElevation| Array| 左岸高程 | | |rightElevation| Array| 右岸高程 | | |waterLever| Array| 水位信息 | | |markPoint| Array| 河道站点位样式信息 | [{ name:'',value:'',xAxis:6,yAxis:254.469,itemStyle:{color:'#00effe'} }] |
河道纵剖面组件(动态水位)-RiverLongitudinalProfileDynamic
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |riverData| Object| 河道纵剖面数据| |
riverData属性详情
| riverData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |name| String| 断面点名称| | |elevation| Array| 河底高程 | | |leftElevation| Array| 左岸高程 | | |rightElevation| Array| 右岸高程 | | |waterLever| Array| 水位信息 | {tm: '2021-07-18 08:00:00',z: [] tm:时间 z:当前时间对应的各个站点的水位信息 | |markPoint| Array| 河道站点位样式信息 | [{ name:'',value:'',xAxis:6,yAxis:254.469,itemStyle:{color:'#00effe'} }] |
行政区站点状态统计组件-DistrictStatistics
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |districtData| Array| 行政区站点状态数据| [ {highRisk:2,mediumRisk:2,name:'济南市',lowRisk:12,noRisk:8,adcd:'370100'} ] | |styleInfo| Array| 行政区统计状态类别数据| [ {name: '超警戒',key: 'highRisk',color: '#FF0000',}] |
districtData属性详情
| districtData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |highRisk| Number| 超警戒| 可自定义属性名称 | |mediumRisk| Number| 超允许壅高 | 可自定义属性名称 | |lowRisk| Number| 超汛限 | 可自定义属性名称 | |noRisk| Number| 正常 | 可自定义属性名称 | |name| String| 行政区名称 | | |adcd| String| 行政区编码 | |
styleInfo属性详情
| styleInfo属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |name| String| 属性名称 | | |key| String| 属于key值 | 对应districtData中自定义的属于名称 | |color| String| 系列颜色 | | |fontColor| String| 系列label文字颜色 | |
事件
distClick // 行政区点击事件,必需声明,返回数据格式为 {adnm: 行政区名称,adcd: 行政区编码}水库纳雨能力统计组件-RainfallCapacityStatistics
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |rainfallCapacityData| Array| 水库纳雨能力数据| [{ limitLevel1:2,limitLevel2:2,name:'济南市',limitLevel3:12,designLevel1:8,designLevel2:8,designLevel3:2,adcd:'370100' }] |
rainfallCapacityData属性详情
| rainfallCapacityData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |limitLevel1| Number| 距汛限水位小于100mm| | |limitLevel2| Number| 距汛限水位100mm~200mm | | |limitLevel3| Number| 距汛限水位大于200mm | | |designLevel1| Number| 距允许壅高水位小于100mm| | |designLevel2| Number| 距允许壅高水位100mm~200mm | | |designLevel3| Number| 距允许壅高水位大于200mm | | |name| String| 行政区名称 | | |adcd| String| 行政区编码 | |
事件
distClick // 行政区点击事件,必需声明,返回数据格式为 {adnm: 行政区名称,adcd: 行政区编码}调度对比组件-CompareLineCustom
参数
| 属性 | 类型(默认值) |描述|备注| | ---- | ---- | ---- | ---- | |currentDispatchList| Array| 调度数据| | |compareLineData| Array| 过程线数据| | |pmt| Number| 过程线类型| 1 水库 2 河道站| |lengendWidth| Number| 水库图例宽度| | |lengendWidthRiver| Number| 河道站图例宽度| | |panelWidth| Number| 面板宽度| | |offsetLeft2| Number| 水库图例左边距| | |offsetLeft2River| Number| 河道站图例左边距| | |drpLeft| Number| 面降雨量图例左边距| | |isOther| Boolean| 是否自定义其他图例位置| 例如:汛限水位 允许壅高水位 警戒水位 允许最高水位(水库) 警戒水位 保证水位(河道)| |otherPos| Array| 自定义其他图例位置| [{ legendLeft: 800, legendTop: 15 } | |drpHeight| Number| 雨量图层高度| | |zHeight| Number| 水位流量图层高度| | |drpTop| Number| 雨量图层距顶部距离| | |legStatus| Array| 水库图例展示状态| [{name: '库水位',status: false},{name: '入库流量',status: false},{name: '出库流量',status: true}] | |legStatusNum| Number| 水库图例按照状态展示行数| | |markPointInfo| Object| 水位流量气泡展示状态 | {z: false,q: false,qIn: false,qOut: false } |
currentDispatchList 属性详情 | currentDispatchList属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |dispatchName| String| 调度名称| |
compareLineData 属性详情 | compareLineData属性 | 类型(默认值) |描述|备注| | ---- | ----------- | ---- | ---- | |tm| Array| 时间| | |zLimit| Number| 汛限水位| | |all_raise_lev| Number| 允许壅高水位| | |warning_stag| Number| 警戒水位| | |all_max_lev| Number| 允许最高水位| | |zDesign| Number| 设计水位| | |zCheck| Number| 校核水位| | |ddz| Number| 死水位| | |damel| Number| 坝顶高程| | |zWarn| Number| 警戒水位| | |zGuarantee| Number| 保证水位| | |qWarn| Number| 警戒流量| | |qGuarantee| Number| 保证流量| | |drp| Array| 降雨量| | |z| Array| 实测水位| 现因需求改动,所有调度方案都一致,因此只绘制一次 | |q| Array| 实测流量| 现因需求改动,所有调度方案都一致,因此只绘制一次 | |qIn| Array| 实测入库流量| 现因需求改动,所有调度方案都一致,因此只绘制一次 | |qOut| Array| 实测出库流量| 现因需求改动,所有调度方案都一致,因此只绘制一次 | |zForecast| Array| 预报水位| | |qForecast| Array| 预报流量| | |qInForecast| Array| 预报入库流量| | |qOutForecast| Array| 预报入库流量| | |tmCurrent| String| 预报时间| | |maxZTm| String| 洪峰水位时间| | |maxQTm| String| 洪峰流量时间| | |maxQInTm| String| 洪峰入库流量时间| | |maxQOutTm| String| 洪峰出库流量时间| |
Project setup
npm installCompiles and hot-reloads for development
npm run serveCompiles and minifies for production
npm run buildLints and fixes files
npm run lint