npm install gpc-ui#### 1. 配置本地webpack环境代理地址（防止跨域问题）
``
module.exports = {
devServer: {
proxy: {
'/openweb': {
target: 'https://openweb.gpskk.com:4005/', // 目标服务器地址
changeOrigin: true, // 是否改变请求的源头
pathRewrite: {
'^/openweb': '' // 重写路径，去掉前缀
},
secure: false, // 如果是 https 并且使用自签名证书，设置为 false
withCredentials: true // 允许发送凭证（如 cookies）
}
}
}
};
#### 2. 当前版本功能包括（车辆监控页面、 轨迹回放页面）
引入公共函数
`
import { getOpenWebUrl } from "@/utils/common";
- 车辆监控页面：显示当前车辆的位置、速度、状态、故障等信息。
【使用方法】
`
/**
* 获取车辆监控页面的URL
*
* 该函数根据提供的参数生成一个特定的URL，用于车辆监控页面这个URL可以根据不同的需求隐藏或显示页面上的特定元素
*
* @param {string} accessKeyId - 用户的访问密钥ID，用于身份验证
* @param {string} accessKeySecret - 用户的访问密钥秘密，用于身份验证
* @param {string} company - 公司名称，用于过滤监控的车辆所属公司
* @param {string} carbrand - 车牌号，用于指定需要获取监控的车辆
* @param {boolean} [hideCarTree=false] - 是否隐藏车辆树形结构，默认不隐藏
* @param {boolean} [hideBottom=false] - 是否隐藏页面底部信息，默认不隐藏
* @param {boolean} [hideTool=false] - 是否隐藏工具栏，默认不隐藏
* @param {boolean} [hideMyMap=false] - 是否隐藏自定义地图，默认不隐藏
* @returns {string} 返回生成的车辆监控页面URL
*/
getCarMonitorUrl('', '', '', '')
.then(mapUrl => {
console.log('车辆监控 Map --------------- URL:', mapUrl);
// 在这里处理 mapUrl
})
.catch(error => {
console.error('Error:', error);
// 处理错误
});
- 轨迹回放页面：显示当前车辆的历史轨迹，并可对轨迹进行播放、暂停、拖动、放大、缩小等操作。
`
/**
* 生成汽车监控视频的URL
*
* 本函数通过给定的访问密钥ID、访问密钥密钥、公司名称、汽车品牌以及时间范围，
* 生成一个用于访问汽车监控视频的URL该URL可以用于查看或下载指定时间范围内
* 指定汽车品牌的监控视频
*
* @param {string} accessKeyId - 访问密钥ID，用于身份验证
* @param {string} accessKeySecret - 访问密钥密钥，用于身份验证
* @param {string} company - 公司名称，用于确定监控视频的所属公司
* @param {string} carbrand - 车牌号，用于指定需要获取监控的车辆
* @param {string} startTime - 开始时间，指定监控视频的时间范围的开始时间
* @param {string} endTime - 结束时间，指定监控视频的时间范围的结束时间
* @returns {string} - 返回生成的汽车监控视频的URL
*/
getCarMogetCarTrackUrlnitorUrl('', '', '', '')
.then(mapUrl => {
console.log('车辆监控 Map --------------- URL:', mapUrl);
// 在这里处理 mapUrl
})
.catch(error => {
console.error('Error:', error);
// 处理错误
});