海康前端实习日记-2022.12---2023.3（持续更新）
背景：我是10.21入职的，刚开始安排了一些缺陷单，然后陆续参与了集成测试，缺陷验证（这些可以快速熟悉项目），后面就会分一些需求了。我是第一天装环境，第二天就开始解决缺陷了，然后到了第三周，开始给我分配了几个需求，开发加调试了大概一个半月的时间，过年回来又分了两个需求，难度都不大，基本都会有代码可以参考，看懂会用，多学习前辈的代码思路是提升最快的方法，不懂就问，不要怕打扰前辈们，厚着脸问就完事了，学到就是自己的，hhhhh。
截止2023.2.18日，实习马上4个月啦，收获还是比较大的。
目录
2022.12.6
2022.12.7
2022.12.8
2022.12.9
2022.12.12
2022.12.13
2022.12.14
2022.12.19
2022.12.20
2022.12.21
2022.12.26
2022.12.27
2022.12.28
2022.12.29
2022.12.30
2023.1.4
2023.1.5
2023.1.6
2023.1.8
2023.1.9
2023.1.10
2023.1.11
2023.1.12
2023.1.13
2023.1.14
2023.1.16
2023.1.17
2023.2.1
2023.2.2
2023.2.6
2023.2.7
2023.2.8
2023.2.9
2023.2.10
2023.2.13
2023.2.14
2023.2.15
2023.2.16
2023.2.17
2023.2.18
2022.12.6
接口 ：获取云存储某个通道开通信息
进行云存储套餐新更新接口开发
当点击设备进入查询云存储套餐时，发送请求获取当前设定的套餐，进行默认显示
原：仅显示7天和30天云存储
新：显示7天,30天,90天,180天，360天 事件云存储或全天云存储
fetchCloudStorageOpenList(flag) {
httpService.fetchCloudStorageOpenListV2(this.id, flag, {
success: res => {
console.log(res, '返回的数据');
// 有套餐且未过期 todo
if (res.packageType !== 0 && res.status !== 2) {
//可用套餐设为true
this.haveAvailablePackages = true;
this.selectedPackageId = res.packageId ? res.packageId : -1;
// 通过id查询到套餐的具体信息
this.selectCloudStorageItem = this.findNodeFromTreeById(this.cloudStoreMealData, this.selectedPackageId);
// 通过packageType返回套餐属于7,30,90,18,360
this.selectCloudStorageItem.type = this.judgeOpenCloudDay(res.packageType);
} else {
// 无套餐或过期就默认显示为None
this.haveAvailablePackages = false;
this.selectedPackageId = "-1";
this.selectCloudStorageItem = this.findNodeFromTreeById(this.cloudStoreMealData, '-1');
console.log(this.selectCloudStorageItem, "选中的云存储套餐");
if (this.enableCloudStorageActive) {
httpService.getEzvizCloudStorageType(
{
cameraId: this.id,
boxFlag: flag
},
{
success: ezvizData => {
this.ezvizCompatibleServTypes = ezvizData.compatibleServTypes;
}
}
);
}
}
}
});
},2022.12.7
进行前后端联调
设备迁移联调
1. 授权登录时，错误码为VMS021510的特殊处理，不进行错误弹窗，仅提示导入
listFetch(url, pageSize = 10, currentPage = 1) {
const params = {
limit: pageSize, // 每页的设备数
offset: currentPage, //当前页
identifier: this.identifier
};
// 拿到请求数据后，根据errorCode进行判断是否拿到设备列表
devicesAPI.getHcAuthorizableDevice(params, {
success: (resp)=>{
this.clearTimer();
// 打开设备窗口
this.notAuthority = false;
this.isAuthority = true;
// 拿到了设备数据
this.deviceDataList = resp.devices;
return resp;
},
errorResponse: (resp)=> {
if ((resp.errorCode === 'VMS021510')) {
// 当返回错误码是'VMS021510'时，不进行错误弹窗，进行导入提示
this.$message(this.$t('hcc_devices_importing'));
return false;
}
}
});
}2. 进行测试域名的适配，测试时有自己独有的域名，和上线的正式域名不同
云存储套餐联调
1. 后端返回字段少了个cloudStorageInfo，字段适配后，可正常显示
2022.12.8
1. APP扫码授权联调，授权正常，后端持续返回错误码，需要后端处理
2. 错误码VMS000007，VMS021510特殊处理，不需要弹窗，其余情况停止发送请求
3. 云存储套餐联调 等待服务端配置盒子存储数据，没有盒子数据，没办法保存套餐，无法进行需求3的验证
2022.12.9
1. 后端翻页逻辑 offset(偏移量)和limit，第一次：（0，10）； 第二次：（11,10）；左为数据下表右为每页显示的条数，这种写法很少见，且不宜理解，已沟通后端整改成平台统一写法，第一页 pageIndex: 1, pagSize:10, 第n页 pageIndex:n, pageSize:10
2. 接口devices/trust/hc/query 查询获取HC端授权迁移设备： 联调正常
3.接口devices/trust/hc/authorize 获取HC端授权迁移设备taskID：联调正常
4.接口devices/trust/hc/authorize/status 查询获取HC端授权迁移设备导入进度：联调正常，但由于HC端的设备不兼容HCC端，导入结果显示全部失败，且结果是一次性全部返回，进度由0-100。
后端服务器没有压力，不分段返回，直接一次性返回全部结果。
5. 云存储套餐联调测试：后端一直无法提供盒子存储，无法测试保存套餐后的默认套餐显示
6. 对导入进度请求方法，增加遇到异常情况停止请求
// 导入进度请求
importProgress(taskId) {
let params = {
taskId
};
devicesAPI.getImportProgress(params, {
success: (resp)=>{
this.importData = resp.details;
this.pageTotal = resp.totalCount;
this.failedTotal = resp.failedCount;
this.successTotal = resp.succeedCount;
this.$nextTick(() => {
if (this.pageTotal === this.failedTotal + this.successTotal) {
this.clearTimer();
}
});
},
errorResponse: ()=> {
this.clearTimer();
}
});
},7. 解决重复点击授权按钮，会叠加定时器的bug
if (!this.interval) {
// 只有当前没有开启定时器才能发送请求
this.getSetTimer();
}2022.12.12
1. 导入设备结束后，执行一次刷新列表，采用事件总线实现。注意在销毁时关闭监听，防止内存泄漏
mounted() {
eventBus.$on('refresh-import', this.onTableRefresh);
},
destroyed() {
eventBus.$off('refresh-import');
},devicesAPI.getImportProgress(params, {
success: (resp)=>{
this.importData = resp.details;
this.pageTotal = resp.totalCount;
this.failedTotal = resp.failedCount;
this.successTotal = resp.succeedCount;
this.$nextTick(() => {
if (this.pageTotal === this.failedTotal + this.successTotal) {
this.clearTimer();
// 导入结束，刷新一次编码列表
eventBus.$emit('refresh-import');
}
});
},
errorResponse: ()=> {
this.clearTimer();
}
});2. h-paged-table 组件，获取不到页码总数，只有数据显示。
解决办法: 需要封装成promise对象返回，不能仅return data
3. 云存储交互变更：套餐显示模块，区分显示事件云存储还是全天云存储
2022.12.13
1. 请求场景优化
原：点击授权，开始轮巡发起请求，待在拉起的窗口上登录授权后，后端返回授权成功时停止
现：点击授权，打开拉起窗口，拉起窗口关闭，开始轮巡发起请求，后端返回授权成功时停止或请求5次后停止
2. 点击继续导入后，需要轮巡获取设备列表，不能仅发送一次请求，轮巡不做显示直到获取到数据
3. 点击继续导入后，设备列表需要显示loading加载中，防止用户误操作
2022.12.14
缺陷单解决
1. 系统日志-资源日志-录像状态，过滤条件中-录像保存天数和录像完整率输入框，当结束条件大于开始条件时，无提示
原因：
解决： 删掉:show-message="false"
同时 发现附带缺陷，当在前一个输入框校验通过时，第二个输入框的提示信息不消失，以及当第一个输入框和第二个输入框同时不满足校验时，会显示双份提示
解决：在每次校验时，同时对另外输入框的值进行再次校验，可使另外一个输入框的校验提示消失
this.$refs.form2.resetValidate("inteRateMin");
var validateinteRateMax = (rule, value, callback) => {
if (!Number.isInteger(Number(value)) || Number(value) < 0 || Number(value) > 100 || value === '') {
this.$refs.form2.resetValidate("inteRateMin");
return callback(new Error(i18n.t('device_bandwidth_rang').replace('{0}', 0).replace('{1}', 100)));
} else if (value && this.record.filter.inteRateMin !== "" && Number(value) < Number(this.record.filter.inteRateMin)) {
this.$refs.form2.resetValidate("inteRateMin");
return callback(new Error(i18n.t('hint_start_can_not_large_than_end')));
}
this.$refs.form2.resetValidate("inteRateMin");
callback();
};2. 检索日志时，切换不在线的站点点击搜索，再切换回正常的站点，搜索按钮依旧是置灰不可点击的
原因：点击搜索时，:btn-disable="!totalNumState" 不满足搜索要求时绑定的totalNumState会禁用
解决：在切换站点时，绑定change方法，将totalNumState的值变为true
3. 选择多个站点时，流媒体服务器、存储服务器、智能分析服务器的异常和警告悬浮时缺少可点击的手型
问题1：选择多个站点时，流媒体服务器、存储服务器、智能分析服务器的异常和警告悬浮时缺少可点击的手型
问题2： 资源概况页面，需去掉饼状图上悬浮时出现的可点击的手型（饼状图点击是不可跳转的）
问题3： 拓扑图页面，需要去掉图中所标记的三个悬浮时可点击的手型
原因：没有在合适的地方禁用手型
解决办法： 在各自的位置使用cursor: 'default'禁用掉不应该出现的手型
2022.12.19
1. 缺陷解决
[J01运维-配置] 资源概况，切换远端站点，再切换回来时，四个服务器位置发生异位
原因： 服务器的宽度采用了固定宽度
解决办法： 宽度采用百分比显示
采用了百分比显示后，在只有两个服务器显示时，显示宽度无法撑满屏幕跨怒道、
解决：采用动态类，根据服务器数目不同，将服务器父类的宽度百分比设成60%,75%和100%
2. 测试用例编写
DS2022110900390 DS2022110400027 DS2022110300001
三个需求，编写测试用例 16条
2022.12.20
缺陷解决：
1. [B09_CS _回放] 运维-存储服务器，录像状态的第一个监控点名称状态不在同一行
原因：父元素加了固定宽度，且overflow:hidden会影响布局
解决办法： 去掉div标签的固定宽度，并添加overflow: inherit;清除浮动影响
2. 【交互】【CS端】【运维】资源状态列表适配问题
原因：按钮组没有给固定宽度，导致异位
解决办法：给父元素类名，然后deep修改子组件的样式
3. 【交互】【CS端】【运维】资源状态编码设备、报警设备、门禁设备列表顶部按钮位置未更改
原因： 这两个模块和右面模块放在了一起，且设置了margin-left:auto
解决办法：创建left div，将两个应该浮动在左侧的元素放进去即可
4。 导出为CSV时，实际导出仍为Excel
原因： 下面写法，无论data.fileType取何值，ExportType都为1
// ExportType: parseInt(data.fileType, 10) || 1,
解决办法：更改为ExportType: parseInt(data.fileType, 10) || 0，可以根据选择导出类型变化了，但
是调用的工具类中，未发现有根据类型导出分类 ，待俄工反馈
2022.12.21
1. 需求Bug解决：点击继续导入，列表数据刷新但是页面不刷新
原因：点击继续导入后，h-paged-table在接到新的数据后，不会进行全局重载，只会刷新列表数据
解决办法：将点击继续导入后轮巡发送接口请求改为轮巡调用重载方法，重载时会自动发起请求
this.$refs.deviceTable.reload();
2. 云存储套餐联调
盒子今天刚部署好，测试保存套餐后，默认显示云存储套餐的功能
但是 video/v1/cloudstorage/package/active 这条接口的报参数错误
原因在于 ccfvas/v1/hcc/info/cloudstorage/detail/search这条接口返回的套餐id 在数据库中实际不存在。
通过前端手动设置默认显示的id和套餐类型进行测试
无套餐或过期就默认显示为None 测试通过
有套餐默认显示套餐具体信息 测试通过
缺陷解决：
3. 导出为CSV时，实际导出仍为Excel
原因：选择excel 时 参数设为0 ，选择csv时参数设为1
解决办法 选择excel 时 参数设为1 ，选择csv时参数设为2，即可
2022.12.26
缺陷解决： 处理一些上周验收后需要完善的问题
1. 无数据样式不对 参考其他模块的样式 应该是一个盒子
url不应该是base64格式，更改为svg图片，复制事件报警的svg到Maintenance里
2. 运维-存储服务器，录像状态的第一个监控点名称状态不在同一行
修复高度，增加 height: 36px;
3. 【运维】资源状态列表适配问题”缺陷
图标不能超过列表最右侧，给父元素加内边距
4. 促销日客流趋势显示与交互有较多设计不一致
（1）.进店客流、店外客流、进店转化率三个指标和对应环比数据显示位置和分割与交互不一致；
解决办法：分别对进店客流，店外客流，进店转化率三个指标的显示位置进行调整，以及添加分割线
缺陷单结单：10个（含上周） 剩余缺陷：2个
2022.12.27
1. 协助验证缺陷单13个
2. 缺陷解决：人员模块，点击×号，没有对输入表单进行清空
原因：没有设置关闭抽屉的回调函数
解决办法：添加关闭抽屉的回调，触发方法同取消按钮；
3.促销日客流趋势显示与交互有较多设计不一致
纵轴两边标题位置距离纵轴偏远；门店促销日报表的客流趋势部分标题同样显示较远，统一修改
解决办法：在echarts配置里添加padding进行位置调整
2022.12.28
1. 资源概况，切换远端站点，再切换回来时，四个服务器位置发生异位
原因：:style="{width: isAc?'100%':item.width + 'px'}width是定死的
解决办法：改为:style="{width: isAc?'100%':auto} 自适应
2. [设备资源]表格标题样式不符合交互稿
原因：没有对表头样式进行修改
解决办法：el-table 添加 header-cell-class-name="table_header"
/deep/ .table_header{
font-weight: 700;
font-family: MicrosoftYaHeiUI-Bold; }
3. [设备资源]抽屉标题样式不符合交互稿
解决办法：添加class="hik-connect-import"
.hik-connect-import{
/deep/ .drawer-head{
font-family: MicrosoftYaHeiUI-Bold;
} }
4. [设备资源]150dpi 打开抽屉，显示的小窗口错位
原因：left: 640px !important; 定死了左定位
解决办法：删掉left: 640px !important;，el-dropdown标签里 添加placement="bottom-start"
2022.12.29
1. [设备资源] 150dpi 下导入按钮和下拉icon 重叠
原因：抽屉按钮min-width = 24px 过小
解决办法： min-width改为 50px
2. [设备资源] 关闭授权登录窗口后，响应提示过慢，有2s左右的空挡期，用户体验不好
解决办法：关闭授权登录窗口后，立即发送一次服务器请求，然后再开始轮巡
3. [设备资源] 设备导入进度弹窗中文字和模块间距不对
解决办法： 修改各自的间距为margin-bottom:3px 4px
4. [设备资源]导入进度条样式不符合交互稿
原因：进度条的高度，宽度不对，以及百分比数字的fontSize不符合
解决办法：
/deep/ .el-progress-bar__outer{
width: 460px;
}
/deep/ .el-progress__text{
font-size: 12px !important;
margin-left: 76px;
width: 30px;
}
5. [设备资源]设备导入进度表格标题样式不对
解决办法：更改样式：font-family: MicrosoftYaHeiUI;
2022.12.30
1. [设备资源]英文环境下，功能描述出现滚动条，不美观
原因： 设置了固定高度，高度不够时出现滚动条
解决办法: 鉴于下面还有很多空白，取消到固定高度，采取高度自适应、
2. [设备资源]导入进度文案不对
原文案：总导入设备_个，成功_个，失败_个
更改后文案：设备导入完成，成功_个，失败_个
3. [设备资源]设备导入进度标题样式不对
原因：没有设置字体样式
解决办法：
/deep/ .table_header{
font-weight: 700;
font-family: MicrosoftYaHeiUI-Bold;
}
4. 适配uat-9测试环境
uat-9环境下的测试域名https://hc-sgp-uat.hik-connect.com，分条件进行域名适配
拼接后的域名字符串https://hc-sgp-uat.hik-connect.com/hc-uat-9/index.html#/authLogin?authLoginFlag=fc1c3152-7ed7-4c15-8e15-a997c65798e6&telephoneCode=65&productionType=0
缺陷单提交数：7 (含昨日)
2023.1.4
- HCC1.2.1代码合并master分支
- 缺陷解决：
框架接入设备 账号安全-角色-权限设置 中 用户权限，查看运维状态 WEB多语言翻译有问题
原因：缺少多语言Key值翻译
解决办法：添加多语言
"guidancemanager_show_health":"诱导管理器设备",
"firealarmdevice_show_health":"消防设备",
"hcp_focsign_interactive_tablet_device_control":"交互平板设备",
- 需求开发：
【DS】[WEB] 1.4.0-健康监测模块中，三方资源反控名称稍长时的优化显示（完成）
问题：当三方资源反控名称稍长，健康监测模块展示布局分成两行
解决办法：/deep/ .el-dropdown-menu{
width: 240px !important;
li{ text-overflow :ellipsis;
white-space :nowrap;
overflow : hidden; }}
[WEB] 1.4.0-三方资源状态在HCP中的展示优化
问题：解决点击查看状态类型，只有一个状态，以及状态类型换行显示
// 修复只显示一个状态的问题，换行符用来状态列表自动换行
// statusValue = item.StatusList.Status[0].Result;
status.forEach(item => {
statusValue = statusValue + '\r\n' + item.Result;
});
// 修改状态类型样式,状态值自动换行等
.state_type {
.el-form-item__content {
.form-item-div {
white-space: pre-line;
label {
display: block;
margin-top: -58px;
padding-left: 15px !important;
}}
}
}
2023.1.5
1.解决缺陷：交互提交之前缺陷单未提及的额外缺陷，切换码流也需要居左显示
原因：切换码流模块放在了right_1下，样式统一会居右显示
解决办法：将切换码流代码放到left_1模块内，在客户端下即可显示居左
2. 【DS】[WEB] 1.4.0-三方资源状态在HCP中的展示优化 （完成100%）
3. 【DS】[WEB] 1.4.0-健康监测模块，三方资源反控名称的优化显示 （完成100%）
2023.1.6
- 缺陷单验证：43个
- 人员删除进度框修改 （完成20%）
2023.1.8
周日加班一天
- 人员删除进度框修改 （完成100%）
2023.1.9
- 解决在uat-9下测试 设备迁移完成后，列表没有自动刷新的问题
原因：合并到master分支后，eventBus.$on('reload-import', this.onTableRefresh);代码被注释掉了，之前在1.2.1的时候没有注释。另外不能只刷新EncoderList的列表，当在其他种类设备下进行设备迁移时，也要对应刷新
解决办法：AccessList,cloudboxList,EncoderList,PanalamList,vehicleDevice,VideoIntercomList
六个组件下都要创建全局事件监听，触发分页列表的reload方法
2. 人员删除进度框修改需求的验收：没有大问题，代码已提交
2023.1.10
- 设备迁移：问题：dev-3下拉起HC授权登录的域名是uat-9
原因：测试环境切换到uat-9，没有对两个测试环境做逻辑适配
解决办法：在域名拼接逻辑上对dev-3 和 uat-9 进行判断，分别拼接不同的域名
2. 缺陷解决： 设备迁移：用户拉起多个授权登录窗口时，会创建多个监听器，轮巡查询不会停止
解决办法：当拉起授权登录窗口时，对按钮进行禁用，当关闭授权登录窗口以及关闭抽屉时再打开按钮
避免同时监听多个窗口，导致clearInterval方法失效
3.缺陷解决：[门禁资源(主机明眸)] isup协议添加的主机添加明眸页面显示与ui不一致，下方应该没有协议可选
原因：当为海康ISUP协议时，按钮没有默认选中
解决办法：在allOptions过滤方法内，进行海康ISUP协议的判断，当为可用时，对默认选中的按钮进行修改
缺陷单已结
剩余需求：曾工需求 和 李工的需求交互变更
2023.1.11
1. 李工的需求交互变更 (完成60%)
2. 曾工需求 （完成0%）
2023.1.12
- 李工需求交互變更(完成90%) 剩余删除失败的逻辑
- 曾工缺陷：设备远程配置，添加设备时，数据未初始化（完成100%）
- 曾工需求 （完成0%）明日开始
2023.1.13
- 李工需求交互變更(完成90%) 剩余删除失败的逻辑
- 曾工缺陷：设备远程配置，添加设备时，数据未初始化（完成100%）
- 曾工需求 （完成100%)
2023.1.14
- 李工需求交互变更(完成100%)
- 曾工缺陷：设备远程配置，添加设备时，数据未初始化（完成100%）
- 曾工需求 （完成100%)
已验收，代码已提，缺陷单已结
2023.1.16
1.缺陷修复：删除IPC的时候，web会重新计算一遍id
解决办法：删除设备需要按序重排的逻辑
2.缺陷修复：[J01运维-配置] 英文环境下，拓扑图-显示路径，显示...与....的路径描述语，与确定按钮（OK）重叠
解决办法: 给模块加最大宽度，和交互沟通，采取换行显示解决办法
3. 李工【账户与安全】冒烟测试，测试结果已反馈
缺陷单已结，代码已提
2023.1.17
1. 缺陷修复： 运维界面，英文下，异常诱导管理器显示为中文，包括web和cs
解决办法: 修改多语言
2. [E03消防] 快捷菜单和最近访问，无法跳转至运维-资源实时状态-消防设备页面
定位原因：
name = this.getRouteName(getNavData, name); // 如果跳转过来的路由名称无权限则默认跳转到第一个有权限的路由
对动态新增的路由组件，会更改路由名称，导致一致默认跳转第一个组件
需要公共方法，协调配合解决
2023.2.1
今日验证缺陷：52个 （李工，王工，栗工，自己的）
栗工发现问题1个，修复后在本地验证
2023.2.2
缺陷验证：15个 发现问题2个 已沟通解决
缺陷解决：1 个 已结单解决
云存储套餐 环境验证通过
设备迁移 重新打包后，验证
2023.2.6
缺陷解决：3个
3. F03可视对讲资源]门资源关联监控点异常_门资源关联两个其它监控点，区域添加门自身监控点后会呈现3个 解决办法：服务端返回问题，转交服务端
2023.2.7
缺陷解决：4
3. 人员筛选按钮被覆盖 解决办法：
:style="item.title=='Card Number' ? 'margin-right:30px':''"
5. 缺陷排查：[账户管理] 用户列表，用户状态列表项的排序功能不正确 原因：存在中文干扰排序，正常情况下不存在中文
2023.2.8
1. [电视墙解码]从解码设备运维巡检页面点击跳转配置页面，页面顶部设备名称显示错误 原因/解决办法：显示的是中文编码后的值，传值不需要采用编码，直接取值即可
2023.2.9
1.验证 设备资源 APP健康监测 俄工缺陷
缺陷验证：5个 ，剩余5个
缺陷提交：2个 ， 新缺陷导致了无法验证，待新提缺陷解决后验证
2. 曾工，李工需求澄清，下周开始开发。
2023.2.10
1. 缺陷验证：栗工、李工、王工 发现问题：2个 1个已解决，1个待树包打好再验证
2023.2.13
1. 缺陷验证：4个，均通过
2. 设备迁移协议更改：完成，已提交代码
2023.2.14
缺陷解决:2个 已结单 hcc1.2.1缺陷剩余一个：明日解决
曾工需求：完成(90%) 李工需求（0%）
2023.2.15
1.2.1缺陷解决：4个 已结单
曾工需求（100%） 李工需求（0%）
2023.2.16
1. 缺陷验证（40个）：张工：10/10 曾工: 7/7 李工： 1/1 张凯工: 12/12 栗工：8/8 俄工2/2 全部通过
2. 门禁设备新增提示文案：完成，代码已提
3. 曾工需求：完成,已验收
李工需求(0%)
2023.2.17
1. 缺陷解决：1个 已结单
2. 缺陷验证：6 发现问题：1 已沟通
3. 李工需求：完成（30%）
2023.2.18
1. 李工需求：(完成 65%)