# 三区综合分析系统[sis_zhfx] * 注：需创建自己的 GIT 分支进行代码开发，开发完调试完毕后再自行合并至主干分支。 ## 项目运行 ``` npm install npm run serve ``` ## 项目打包 ``` npm run build ``` # 查看 vue cli webpack配置 ``` vue inspect > webpack.config.js ``` # 开发文档 ## 文件目录结构 ``` -src --- assets -- 静态文件 --- icon -- 图标 --- svg -- svg图标 --- style -- 公共样式 --- font -- 字体 --- component -- 自定义组件 --- chart -- 图表组件 --- bar -- 柱状体 --- line -- 折线图 --- pie -- 饼状图 --- coms -- 自定义UI组件 --- table -- 表格组件 --- panel -- panel组件 --- card -- 自定义卡片 --- ... -- 更多自定义组件 --- helper -- 小工具 --- partten -- js端全局常量,引入即可使用目前只有颜色 --- router -- 路由 --- index.js --- store -- 状态管理可使用vuex --- views -- 页面 - 有路由管理跳转 --- layout -- 页面布局 --- Home -- 领导驾驶舱 --- Agc -- AGC页面 --- ... -- 其他页面 ``` ## 样式项目中使用Less语言处理样式 ### 公共样式在assets/styles文件夹中为公共样式其中包含**样式变量**及**公共样式** #### 样式变量 * 参见 assets/styles/common 文件夹中的文件 ``` less @green: #05bb4c; @yellow: #f8de5b; @blue: #597ef7; ``` * 使用方式：在项目中可直接`@green`即可使用 ``` \less color:@green; ``` ### 公共样式 `assets/styles`除common的文件为公共样式，采用原子性方式设计样式class，可直接在HTML中使用 1. color：通用颜色 2. font：通用字体字号 3. svg：svg相关样式 ## 布局栅格化布局采用element ui 源码直接引入，可直接参考element ui https://element.faas.ele.me/#/zh-CN/component/layout * 注意: 修改布局组件名称直接为 Row 和 Col即可 ```vue ``` ## svg-icon使用 1. 将SVG图标添加至 `assets/icon/svg` 文件夹中,svg图片由webpack统一打包,放置到对应文件夹即可 2. 在组件中引入`svg-icon`组件 ```vue import SvgIcon from "@/components/coms/icon/svg-icon.vue"; ``` 3. 使用svg ```html

``` ## 版本更新