物联网可视化大屏

1、项目描述

根据奔跑吧面条的**vue-big-screen**开源框架基础上进行修改。

• 项目需要全屏展示（按 F11）。

• 项目部分区域使用了全局注册方式，增加了打包体积，在实际运用中请使用 按需引入。

• 项目环境：Vue-cli、DataV、Echarts、Webpack、Npm、Node，axios,mock。

• 请拉取 master 分支的代码，其余分支是开发分支。

• 在项目public目录下存放地图数据合集，根据地市编存放。

友情链接：

1. Vue 官方文档
2. DataV 官方文档
3. echarts 实例，echarts API 文档
4. mock.js官网
5. axios官网

项目展示

项目预览地址

https://www.daidaibg.com/bigscreen

github地址

https://github.com/daidaibg/IofTV-Screen

Gitee地址

https://gitee.com/memeda520/IofTV-Screen

滚动配置

项目中可以进行滚动配置，内容是否滚动
点击右上角设置按钮

可以进行以下配置，可以自行代码中进行修改或增加配置

2、主要文件介绍

3、使用介绍

安装

npm install   

启动

npm start 

接下来跟面条的差不多还是看面条的文档吧

https://gitee.com/MTrun/big-screen-vue-datav/tree/master#%E4%B8%89%E4%BD%BF%E7%94%A8%E4%BB%8B%E7%BB%8D

4、公用组件

封装了除面条外个别用到的组件

4.1 message消息提示

因为刚开始没想着用第三方提示库，自己简单封装了一个。

注：组件内部目前只有warning，类型，如果需要其他类型自己组件内添加。

因在main.js注册全局可以直接使用，不需要引入

  this.$Message({
      text: res.msg,
      type: 'warning'
  })
//也可以这样
this.$Message.warning(res.msg)

4.2 外边框

因为我的项目外边框几乎一样，还有title,所以封装了此组件。

根据自己需求更改，更换外边框（srccomponentsitem-wrapitem-wrap.vue）下更换。

       
我是谁？

5、全局参数

5.1filter

监测数据项统一过滤，保留两位小数。

{{10.23123|montionFilter }}