小牛钱罐子PC版

修改npm镜像源

npm config set registry "http://registry.npm.taobao.org/"

安装

  1. 下载安装node

  2. 安装fis3 npm install -g fis3

  3. 安装fis3常用组件 npm install -g

         fis3-hook-module  
                              
         fis3-hook-commonjs
                             
         fis3-postpackager-loader
                              
         fis3-deploy-replace
    

调试方法

在应用程序根目录运行以下命令
1. fis3 release -wL
2. fis3 server start

技术选型

jquery1.9.1   
json2.js (主要实现json和string之间转换, 底版浏览器)  
Underscore.js 1.8.2 (去掉了atrTemplate, 采用Underscore工具类, 扩展string, array, obejct, 以及模版引擎)  

json2.js Github: https://github.com/douglascrockford/JSON-js    
underscore官网: http://www.css88.com/doc/underscore/

目录结构

./
    libs                       --外部的js库,如avalon、jQuery, artTemp等
        mod.js
        avalon.js
        ...

    modules/    ---业务源码
        common/                 --公共业务
            api/                --api接口
                user.js
                product.js
                ...
            base/                       --基础对象, 对于不支持ES5特性的浏览器进行了扩展
                global.js
                array.js
                string.js
                ...                
            utils/              --常用工具
                regexp.js
                extend_fn.js
                ...
            web/ --页面级别公共业务, 例如:产品基类, 登录注册, 利率计算器等等
                register_views.js
                register_model.js
                product_model.js
                ...
         
        widgets/            --共用的UI组件(如右则浮动的二维码)
            dialog
                dialog.js
                style.css
        pages/      --页面级业务
            includes/        --全局对象, 处理全局业务,例如:头部,尾部,侧边导航栏
                header.js
                footer.js
                sidebar.js 
                ...
            login/          --按业务划分模块
                login.js
                style.css 
                img.png 
            register/ 
                    ... 
    views/                      --视图部分
        css/        
        img/ 
        pages/ 
            includes/           --页面公共部分
                header.html 
                footer.html 
                navbar.html 
                ...

            user/ 
                login.html 
                register.html 
                ... 

fis-conf.js                     --fis配置文件   

全局对象

base/global/global.js       --存放一些通用的常量或者公共属性,变量

源码:
;(function (win, doc) {
    //全局静态变量
    win.xn_global = {
        //客服400电话
        tel400: "400-9989-090",
        //静态文件服务器路径
        staticFileServerUrl : "https://static.xiaoniuapp.com/4cd17b"
    };
})(window, document);

使用方法:
function show400() {
    console.log(window.xn_global.tel400);
}

base/global/date.js     --扩展原生Date函数
Date.format("yyyy-MM-dd hh:mm:ss")          --格式化当前日期
Date.addDate(2)                             --在当前日期上加上指定天数

使用方法:
var date = new Date();

console.log(date.format("yyyy-MM-dd hh:mm:ss"));
//output: 2016-08-30 15:29:22
console.log(date.addDate(5).format("yyyy-MM-dd hh:mm:ss"));
//output: 2016-09-04 15:29:22

base/global/number.js     --扩展原生Number函数
Number.plus                     --加法, 解决小数计算精度问题, 
Number.sub                      --减法, 解决小数计算精度问题
Number.mul                      --乘法, 解决小数计算精度问题
Number.div                      --除法, 解决小数计算精度问题
Number.toYuan                   --将毫转换为元
Number.toHao                    --将元转换为毫
Number.toFixed                  --重写系统toFixed函数,直接截取,避免四舍五入
Number.toUnit                   --将数字转换为带单位的金额,例如10000, 转换后 1万
Number.toConvert                --将数字用逗号间隔,每三位数字间隔一个逗号

使用方法:
var num = 20000.25

var num1 = num.plus(1001.25)                    //output: 21001.50
var num2 = num.sub(1001.11)                     //output: 18999.14
var num3 = Number(20000).mul(2.2)               //output: 44000
var num4 = Number(20000).div(2)                 //output: 10000
var num5 = Number(200).div(2).mul(3).plus(10)   //output: 310 = 200 / 2 * 3 + 10;

将毫转换为元,默认保留两位小数,返回为Number对象, 如果返回值是整数, 则省略小数位
var num6 = Number(21234).toYuan(3)              //output: 2.123 
var num7 = Number(20000).toYuan(2)              //output: 2

将元转换为毫, 返回Number对象
var num8 = Number(2.12).toHao()                 //output: 21200

截取指定位数小数位, 返回string类型, 重写系统方法,将不在四舍五入,直接截取
var num9  = Number(2.16858).toFixed(2)           //output: "2.16"
var num10 = Number(20000).toYuan().toFixed(2)    //output: "2.00"

将指定number转换带单位的金额,如果小于1万, 则返回自身, 否则返回string类型
var num11 = Number(1005670).toUnit(2)               //output: "100.56万"
var num12 = Number(1005670000).toYuan().toUnit(2)   //output: "10.05万"
var num13 = Number(70000).toYuan().toUnit(2)        //output: 7
var num14 = Number(1270000).toConvert(2)            //output: 1,270,000.00

base/global/string.js     --扩展原生String函数
String.trim()                   --删除字符串首尾空格
String.format()                 --字符串格式化
String.toDate()                 --字符串转换为Date

使用方法:
var str1 = " aa ".trim()                        //output: "aa"
var str2 = "{0}1122{1}44".format("00", 33)      //output: "0011223344"
var str3 = "2016-08-30 15:21:36".toDate()       //output: Date()

base/global/array.js     --扩展原生Array函数
Array.isEmpty                   --判断数组是否为空
Array.clone                     --克隆当前数组,返回一个新实例
Array.indexOf                   --查找指定元素在当前数组第一个匹配的位置,若没找到,返回-1
Array.lastIndexOf               --查找指定元素在当前数组最后一个匹配的位置,若没找到,返回-1
Array.remove                    --在当前数组中删除指定元素
Array.filter                    --过滤当前数组中指定条件的元素项, 返回符合条件的元素一个新实例
Array.map                       --迭代器

组件列表

01. 翻页组件                --高路       (已完成)
02. 轮播组件                --廖俊波     (已完成)  
03. svg统计图组件           --高路       (已完成)  
04. dialog                  --金锐       (已完成)
05. 常规提示组件            --金锐       (已完成)   
06. 遮罩层                  --金锐       (已完成)
07. 按钮加载中              --金锐       (已完成)
08. 日历组件                --廖俊波     (已完成)   
09. vip信息                 --金锐       (已完成)   
10. 银行卡信息              --廖俊波     (已完成)

你可能感兴趣的:(小牛钱罐子PC版)