# dsp_frontend **Repository Path**: hzf520/dsp_frontend ## Basic Information - **Project Name**: dsp_frontend - **Description**: 广告页面 DSP系统后台管理 - **Primary Language**: JavaScript - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 3 - **Forks**: 1 - **Created**: 2020-04-29 - **Last Updated**: 2023-11-11 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 核心项目目录结构 ## 项目结构 --- ``` ├─node_modules ├─dist // 打包压缩后 ├─public // 公共资源文件夹 └─src // 源码 ├─api // [api配置] ├─assets // 静态资源：css、公用函数、公用数据、图片 │ ├─css // 全局公共样式及覆盖样式和黑白模式样式 │ │ ├─basic.less // 网站基础样式 │ │ ├─color.less // 网站颜色计算取值 │ │ ├─colors.less // 定义全局颜色变量 │ │ └─overwrite.less // 覆盖网站样式(加强css权重) │ ├─iconfont // 全局字体图标 │ ├─JSdata // 前端静态数据 │ │ ├─campaigOptions.js // 广告模块下拉框静态数据 | | ├─index.js // 地区&投标下拉静态数据 │ │ └─request.js // 接口响应code码 中英会议 │ └─JSfunction // 公用函数 ├─components // [组件]： │ └─common // 自定义封装组件如:Header, Footer, 图表等 | ├─echarts // 封装图表组件库 │ └─custom │ ├─imgClip.vue // dsp二次封装图片剪辑组件 │ ├─imgClipNative.vue // 原始图片剪辑插件 │ ├─imgVoModal.vue // 操作指南 │ ├─lookHtml.vue // 渲染并显示编辑后html页面组件 │ ├─ModelAddAlert.vue // 智能监控新增组件 │ ├─NumberGrow.vue // 数字滚动组件 │ └─ReportList.vue // 表报页图表转列表显示 ├─i18n // [国际化] │ └─ChEn // 中英繁 文本信息 ├─config // [全局配置] │ ├─buind // 配置按需加载组件 │ ├─index // 配置axios接口路径及超时时间地图等...（配置代理） │ └─time // 配置全局时间 ├─crypto // [文本加密插件] ├─filters // [全局过滤器] ├─router // [路由配置] ├─store // [Vuex] │ └─modules ├─utils // [工具类] │ ├─arr.js // 操作数组相关工具函数 │ ├─download.js // 下载文件函数 │ ├─index.js // 封装axios请求 │ ├─publicStatus.js // 全局下拉框状态 │ ├─time.js // 转义日期时间函数库 │ ├─tool.js // 日常常用工具函数 │ ├─validate.js // 表单字段验证 └─views // [视图]：多数路由的匹配页面 ├─account // 登录 & 注册 & 修改密码 & 找回密码 ├─admin // 管理员用户页面组 │ ├─sitesettings // 管理员文档编辑如: 服务协议、发票、自定义付款... │ └─ssp // 管理投标地区及SSP管理 ├─bidder // 广告模块 │ └─modules ├─billing // 财务模块 ├─reports // 表报模块 └─error-page // [错误页面]: 404、500等页面 ``` ## 项目技术栈 --- * vue ^2.6.6      **用于构建用户界面的 MVVM 框架** * axios ^0.18.0      **用来请求网络请求后端** * vue-router ^3.0.2     **为单页面应用提供的路由系统** * vuex ^3.1.0      **项目数据状态管理** * ant-design-vue ^1.4.11     **vue版UI框架 搭建页面视图** * jquery ^3.4.1      **用于用户自定义页面提供Jquery服务** * echarts ^4.2.1     **搭建图形化工具** * vue-i18n ^8.9.0     **项目国际化** * vue-simple-uploader ^0.7.0 **功能强大的文件上传插件** ## 项目当前前端进度 --- ### 功能篇： - [x] 登录&注册&修改密码 -- 完成 - [x] 仪表板数据查询 -- 完成 - [x] 广告模块功能 -- 完成 - [x] 表报模块功能 -- 完成 - [x] 财务模块功能 -- 完成 - [x] 用户模块功能 -- 完成 - [x] 管理员模块功能 -- 完成 - [x] 系统模板文件编辑 -- 完成 - [x] 修改主题颜色&实时刷新 -- 完成 ### 测试篇： - [x] 登录模块用例测试 -- 完成 - [x] 仪表盘模块用例测试 -- 完成 - [ ] 广告模块测试用例 -- 未完成 - [ ] 财务模块测试用例 -- 未完成 - [ ] 表报模块测试用例 -- 未完成 - [ ] 用户模块测试用例 -- 未完成 - [ ] 管理员模块测试用例 -- 未完成 - [ ] 系统模板文件编辑测试 -- 未完成 - [ ] 主题样式模块测试用例 -- 未完成 ## 项目注意事项 --- 本项目中高德地图KEY问题 * 在地图使用的key是个人申请 如需更换请 在项目目录 dsp_frontend\src\config\index.js 配置文件中设置 * [如何申请高德地图key?](https://jingyan.baidu.com/article/bea41d43c78831b4c51be68b.html) ## 使用方式 --- ### 项目初始化安装依赖 ```js npm install ``` ### 项目运行启动 ``` npm run serve ``` ### 项目打包压缩 ``` npm run build ```