以下记录的是今年3月份笔者在公司进行web前端工作的每日工作内容，其中隐去了项目的具体名称、人名、公司名等。
2019.3.12
今天完成任务：安装好了编码环境，将野牛期货客户端源代码拉取到了本地，初步实现设置功能中的“红涨绿跌”“绿涨红跌”功能
遇到的问题：在实现设置的“红涨绿跌” “绿涨红跌”功能是没有思路无从下手
采取的措施：通过询问成哥解决
明天的规划：继续实现野牛期货客户端中的其他设置功能
2019.3.13
今天完成任务：基本完成设置功能中的“红涨绿跌”“绿涨红跌”功能
遇到的问题：在将页面从交易页面切换到其他页面后再点击“红涨绿跌”“绿涨红跌”切换屏幕显示之后再切换回交易页面发现K线图无法显示
采取的措施：仔细分析了K线图更新的代码InitTheme和renderChart方法发现K线图的更新是通过setOption接口实时更新的，因此在将页面从交易页面切换到其他页面之后不能再重绘K线图从而导致报错
明天的规划：完成交易设置中的交易确认功能
2019.3.14
今天完成的任务：修复了昨天切换到其他页面后再点击“红涨绿跌”“绿涨红跌”切换屏幕显示之后再切换回交易页面发现K线图无法显示的bug，完成了基本设置中的操作确认功能；完成了交易设置中的交易确认功能
遇到的问题：对于git的许多常用命令以及git flow流程不熟悉，不知道如何将代码推送到远程服务器
解决的措施：通过在互联网上查询各种资料和询问成哥慢慢理解了这些过程
明天的规划：继续完善野牛期货客户端中的其他功能
2019.3.15
今天完成的任务：在修复了昨天切换到其他页面后再点击“红涨绿跌”“绿涨红跌”切换屏幕显示之后再切换回交易页面发现K线图无法显示的bug的基础之上为切换回交易页面时页面是否进行重绘添加了判断，若切换为交易页面之前用户没有改变涨跌颜色则不需要重绘K线图；学习了解了stockcharts这个demo，进一步了解了K线图的绘制 遇到的问题：sublime点击Package Control命令的install package无法打开，也就无法安装插件
解决的措施：通过互联网查询资料找到了解决的办法并把问题记录了下来https://blog.csdn.net/a715167986/article/details/88574975
明天的规划：在桌面版应用中增加K线图项目DEMO中展示的划线功能、技术指标功能和图形类型切换功能
2019.3.18
今天完成的任务：初步完成了野牛期货客户端图表导航栏上的划线功能，技术指标功能和图形类型切换功能。
遇到的问题：（1）在js中值传递和引用传递的问题。在平时的练习中可以很好的解决这个问题但是没想到在今天开发的时候还是犯了这个错误。如图，如果将语句改写成this.current = item一样可以实现这个函数的功能而且还更简洁，但是这里会涉及到一个问题，由于item和current都是引用类型如果按照前文来写这个函数的话意味着如果接下来有其他函数去修改this.current中的值的话那么将会改变item对象中的属性的值造成一些难以理解的bug；
（2） elemet组件库中的el-dropdown组件的下拉列表使用click事件监听无效，后经过网络查询资料才知道要再click之后加.native才行
解决的措施:通过互联网查询资料，还有就是再仔细考虑过js的传递流程之后解决了这个问题
明天的规划：继续完善导航栏上的功能，加入图标
2019.3.19
今天完成的任务：向野牛期货客户端的图表导航栏上的切换图表类型，划线，切换鼠标类型等功能加入了图标显示；进一步了解了React StockChart开源组件库，svg矢量图等
遇到的问题：在下拉菜单上的文字前加入图标没有对齐；对svg类型图的了解不足
解决的措施：加入vertical-align: middle属性可实现元素相对于其父元素的垂直居中；通过互联网查询相关资料，成哥的讲解等
明天的规划：进一步学习React StockChart的相关资料，完善野牛期货的PC客户端
2019.3.20
今天完成的任务：完成了一小部分maestros项目中的交易现场模块页面中的功能
遇到的问题：在去编写一个完整的vue页面时熟练度不高，经常出错拖慢开发进度，对非常有用的Flex布局不熟悉，在前端布局时出现问题；封装vue组件的熟练度不高
解决的措施：通过互联网查询关于Flex布局的相关资料，成哥和嘉威的指导
明天的规划：将交易现场页面基本完成
2019.3.21
今天完成的任务： 完成部分maestros项目中的交易现场模块页面
遇到的问题：在将一些具有共性的子标签封装成公共的vue组件时经常会出现错误，诸如在data函数中忘记写逗号，在将一个div的边框改成圆角时出现了圆角已经出现但是背景还是方角的现象
解决的措施:原因是因为要修改边框样式的div中嵌套了两个子div，所以当父div的边框样式改变之后子div的边框样式没有改变所以在视觉上就觉得明明div的边框样式已经改掉了为什么还会有方角存在的疑惑（通过和嘉威的一波交流发现了这个问题）
明天的规划：基本完成maestros项目中的交易现场模块页面的hardcode
2019.3.22
今天完成的任务：完成maestros项目中的交易现场模块页面中的大部分
遇到的问题：在编写vue子组件的时候CSS代码出现了许多冗余
解决的措施：由于之前对SCSS的了解较少，故在编写CSS代码时没有利用到SCSS的一些特性比如&符号等，还是使用最基础的CSS写法，这在一定程度上浪费了SCSS的许多优秀特性。解决的办法就是加强对SCSS的学习，提交封装vue组件的能力
明天的规划：完成maestros项目中的交易现场模块页面的hardcode；开始数据对接
2019.3.25
今天完成的任务：初步完成maestros项目中的交易现场模块的页面显示
遇到的问题：主要遇到了一些细节上面的问题，很多是因为粗心或者对vue组件的结构不熟悉造成的，这一类的问题其实更加棘手，主要是因为出现这一类的问题之后控制台的报错结果会很奇怪，难以发现问题所在，比如，笔者习惯在写一个新的vue组件时直接从已经写好的vue组件中直接复制结构内容过来再做相应修改，于是在今天就出现了在新的vue组件中忘记修改vue组件的name的情况，name的值是之前已经存在的页面的名字，于是就导致了页面大量报错却迟迟无法发现问题的情况出现； 另外，也出现了对js的API使用不够熟练的问题，比如对于map函数的使用，map函数一般是作用于数组的，不能作用于string类型。
解决的措施：多练多写多总结，那么这一类低级错误就会少犯了，从而提高编程效率
明天的规划：开始对Trading页面进行前后台数据的对接
2019.3.26
今天完成的任务：开始对Trading页面进行前后台数据的对接，完成部分数据对接
遇到的问题：今天在数据对接的时候主要遇到的问题是接收不到来自后台的数据，在仔细排查了代码后发现是变量名写错了导致的；另一个问题是关于给数字每隔三位加上逗号的，在页面的数据显示中需要给数字每隔千分位加上逗号
解决的措施：关于如何给数字每隔三位加上逗号有很多种做法，笔者自己也想到好几种，包括将其转换为数组，string类型再进一步操作，在网上查资料后发现解决的方法更多，比如用正则表达式，但正则表达式却不是时间复杂度最低的方法，却是最简洁的方法.
明天的规划：继续对Trading页面进行前后台数据的对接
2019.03.27
今天完成的任务：开始进行训练场（Training）页面的编写
遇到的问题：今天遇到的问题主要来自于之前写的）交易现场（Training）页面,今天成哥检查代码的时候发现了我的代码有很多问题，主要有：1. 代码结构不够清晰，编码风格不够规范，在vue的data函数中大量出现了CSS的代码，造成了样式和数据的耦合
2.很多变量和样式命名不够规范，有些命名过长影响编程和阅读，还有一些命名意义不清晰
3.对SASS不够熟悉，在CSS代码中几乎没有利用SASS中的许多优秀特性，比如它的嵌套选择器书写方式
4. HTML代码标签编写语义化不够，许多地方的使用的标签虽然也能实现类似的效果但是并不是最合适的标签，比如该用button标签的地方用了div标签，使用table标签应该加入tbody和thead标签等
5.抽象公共组件的思路出现了问题，首先一些比较简单的标签组成的元素可以考虑不做公共组件，再就是不应该把CSS样式当作data传入公共组件中，这样同样会造成样式和数据的耦合
解决的措施：在成哥的指导下笔者已经幡然醒悟，编写html代码应该注重语义化，css代码最好不要大规模掺入data中，多看好的源码和一些基础知识
明天的规划：初步完成（训练场）Training页面
2019.03.28
今天完成的任务：完成了一部分训练场（Training）页面的编写
遇到的问题：今天遇到的一个主要的问题就是是否要封装公共组件的问题。笔者在发现交易积木这个项目中的许多双层按钮具有相同的特性之后打算将这种类型的按钮封装起来，但是却发现这些按钮的具体样式是很不一样的，如果不通过传：style属性进行动态的样式改变的话那么这个公共组件封装起来还是不合适的，另一方面该组件也不是非常复杂，最终还是没有封装这个组件
解决的措施：笔者在参考了之前写的野牛期货客户端那个项目之后没有发现很多普适的公共组件，所以后面也是放弃了想要封装双层按钮的想法。另一个问题就是关于从ECharts中引入合适的图表的问题还在解决中
明天的规划：基本完成训练场（Training）的静态页面显示
2019.3.29
今天完成的任务: 将训训练场页面（Training）大部分完成
遇到的问题： 如何使用echarts插件进行图表的编写 echarts是一款非常强大的图表js库，由于训练场页面大量的用到了一些图表所以用echarts自带的图表来解决非常合适，但是关于如何在vue中使用官方文档里面没有教程
解决的措施：在网上查询了很多资料慢慢的使出了在vue中如何使用echarts了，方法还挺多的，比如有vue-charts这样一个包，最终笔者采用的是echarts这个包来映入echarts模板库按需引入需要用到的图表类型
明天的规划：进一步完成训练场（Training）页面，空闲时间读完vue的风格指南
