小程序开发日记-03新增合同

今天把写好的3篇日记搬到了随笔，copy paste了一下。

这样经验可以分享了，写的不好多包涵，有用的就权当做个参考。

今日计划开发新增合同部分，工作包括：

做新增的页面布局wxml
灌注据（基础类型类的数据），在页面上可以选择。
开发表单的校验规则rules
页面逻辑：增加删除合同类型及金额
页面逻辑：选择合同评审自动填充
页面逻辑：日期控件找一下
页面逻辑：选择客户功能，是否需要弹框，如果弹框，则需要和以前的公用。重构？
组合json数据，以及提交请求request
改造服务器端的rest 接口，包括能用rest client能够提交成功测试。
提交成功后，显示弹框，告诉客户的修改时限。

2天搞不搞的定？玄！，走着看。这还不包括页面的美观，样式的调整！

下午把页面布局搞了个7788，但发现有些基础数据和常用的功能需要重复代码，不好。想办法重构使之重用。

1 基础数->全部放到app.globalData中，这些基础数据等程序一加载就load进来。

2 常用的功能->需要调用wx.request，归置到一个公用的js中，用Promise进行封装。

-------------------------------------------------------------------------------------------------------------------------------------------

说说Javascript同步调用调用的事儿：


function sync1(value, callback){
  console.log('sync1:' + value)
  if(callback != null) callback();
}


function sync2(value, callback){
  console.log('sync2:' + value)
  if(callback != null) callback();
}


function sync3(value, callback){
  console.log('sync3:' + value)
  if(callback != null) callback();
}

//javascript 方法本身就是同步调用，这样写即可
sync1(1)
sync2(2)
sync3(3)
console.log('Hello BJfarmer!');

setTimeout(function(){
  console.log('timeout call happended.');
},1000);

//用callback嵌套的经典写法！
sync1(1, function(){
  sync2(1, function(){
    sync3(1, function(){
      console.log('Last call is invoked!');
    })
  })
});
console.log('Hello BJfarmer!');

//利用Promise then，调用链是同步的。
new Promise(function(reslove,reject){
  console.log('start executing ...');
}).then(new Promise(function(reslove,reject){
  sync1(1,function(){});
})).then(new Promise(function(reslove,reject){
  sync2(1,function(){});
})).then(new Promise(function(reslove,reject){
  sync3(1,function(){});
})).then(new Promise(function(reslove,reject){
  console.log('start executing ...done!');
}));
console.log('Hello BJfarmer!');

分割-------------------------------------------------------------------------------------------------------------------------------------------

晚上一直致力于新的Request框架，将wx.request进行封装，减少重复的代码。引入了新的class Request, 下面是调用的代码：

var requestHandler = require('../utils/request.js')


requestHandler.requestDepts().then(res => {
      that.setData({
        depts: res.data
      })
      }, error => {
        that.setData({
          error: error.msg
        })
      }
    )

这样一个rest调用就能减少10行代码，更加精简；
重复的代码可以归置到一个地方去，减少复制粘贴代码；
封装的类统一将request的log输出；

感觉不错，但重构代码真心繁琐，需要将以前的代码一起修改，重新测试。

今天的任务，完成了15%：

做新增的页面布局wxml （基本完成）
灌注据（基础类型类的数据），在页面上可以选择。（进行中。。。）

2020-12-19