forked from fanruan/fineui-start
Compare commits
4 Commits
Author | SHA1 | Date |
---|---|---|
dailer | 91f320b58e | 3 years ago |
zsmj | 20c922d2be | 3 years ago |
dailer | 622b19fb38 | 3 years ago |
dailer | 9b10c99f4b | 3 years ago |
199 changed files with 2367 additions and 2074 deletions
@ -0,0 +1,20 @@
|
||||
root = true |
||||
|
||||
[*] |
||||
charset = utf-8 |
||||
end_of_line = lf |
||||
indent_style = space |
||||
insert_final_newline = true |
||||
trim_trailing_whitespace = true |
||||
|
||||
[*.{js,ts,jsx,tsx}] |
||||
indent_size = 4 |
||||
|
||||
[*.{less,html,ejs}] |
||||
indent_size = 2 |
||||
|
||||
[*.json] |
||||
indent_size = 2 |
||||
|
||||
[tsconfig.json] |
||||
indent_size = 4 |
@ -1,171 +1,47 @@
|
||||
|
||||
{ |
||||
"extends": "eslint:recommended", |
||||
"env": { |
||||
"browser": true, |
||||
"node": true, |
||||
"es6": true, |
||||
"jest/globals": true |
||||
}, |
||||
"plugins": ["jest", "react"], |
||||
"extends": ["plugin:@fui/typescript", "plugin:@fui/prettier"], |
||||
"parserOptions": { |
||||
"ecmaFeatures": { |
||||
"legacyDecorators": true, |
||||
"jsx": true |
||||
} |
||||
}, |
||||
"rules": { |
||||
// 声明 |
||||
"no-use-before-define": "error", |
||||
//禁止定义前使用 |
||||
|
||||
// 对象 |
||||
"no-dupe-keys": "error", |
||||
// 禁止在对象字面量中出现重复的键 |
||||
"quote-props": [ |
||||
"error", |
||||
"as-needed" |
||||
], |
||||
// 对象属性只在需要的时候加引号 |
||||
|
||||
// 字符串 |
||||
"quotes": [ |
||||
// 由于prettier和eslint一起使用需要关闭一些规则,但是prettier没有以下规则的配置,统一写在这里 |
||||
// 对象字面量简写语法 |
||||
"object-shorthand": ["error", "always"], |
||||
// 函数体在必要的时候使用大括号 |
||||
"arrow-body-style": [ |
||||
"error", |
||||
"double", |
||||
"as-needed", |
||||
{ |
||||
"allowTemplateLiterals": true |
||||
"requireReturnForObjectLiteral": true |
||||
} |
||||
], |
||||
// 字符串开头和结束使用双引号 |
||||
"no-useless-concat": "error", |
||||
// 禁止没有必要的字符拼接 |
||||
"no-useless-escape": "error", |
||||
// 禁用不必要的转义 |
||||
|
||||
// 函数 |
||||
"no-dupe-args": "error", |
||||
// 禁止在 function 定义中出现重复的参数 |
||||
"space-before-function-paren": "error", |
||||
// 函数括号前必须要有空格 |
||||
|
||||
// 变量 |
||||
"no-undef": "error", |
||||
// 禁止使用未声明的变量 |
||||
|
||||
// 比较运算符 & 相等运算符 |
||||
"eqeqeq": "error", |
||||
// 使用 === 和 !== 代替 == 和 != |
||||
"no-unneeded-ternary": "error", |
||||
//禁止可以在有更简单的可替代的表达式时使用三元操作符 |
||||
|
||||
// 条件 |
||||
"default-case": "error", |
||||
// 要求 Switch 语句中有 Default 分支 |
||||
"no-else-return": "error", |
||||
// 回调使用用箭头函数 |
||||
"prefer-arrow-callback": "error", |
||||
// 如果 if 块中包含了一个 return 语句,else 块就成了多余的了。可以将其内容移至块外 |
||||
"no-else-return": "error", |
||||
"no-use-before-define": "off", |
||||
|
||||
// 代码块 |
||||
"brace-style": [ |
||||
"error", |
||||
"1tbs", |
||||
{ |
||||
"allowSingleLine": true |
||||
} |
||||
], |
||||
// 代码块左括号紧跟上一行结束 |
||||
"curly": [ |
||||
"error", |
||||
"multi-line" |
||||
], |
||||
// if、else if、else、for、while强制使用大括号,但允许在单行中省略大括号 |
||||
|
||||
// 注释 |
||||
"spaced-comment": "error", |
||||
// 注释前有空格 |
||||
|
||||
// 空白 |
||||
"indent": [ |
||||
"error", |
||||
4, |
||||
{ |
||||
"SwitchCase": 1 |
||||
} |
||||
], |
||||
// 缩进控制4空格 |
||||
"no-mixed-spaces-and-tabs": "error", |
||||
// 禁止使用 空格 和 tab 混合缩进 |
||||
"space-before-blocks": [ |
||||
"error", |
||||
"always" |
||||
], |
||||
// 语句块之前的需要有空格 |
||||
"space-infix-ops": [ |
||||
"error", |
||||
{ |
||||
"int32Hint": false |
||||
} |
||||
], |
||||
// 要求中缀操作符周围有空格,设置 int32Hint 选项为 true (默认 false) 允许 a|0 不带空格 |
||||
"no-trailing-spaces": [ |
||||
"error", |
||||
{ |
||||
"skipBlankLines": true |
||||
} |
||||
], |
||||
// 禁用行尾空格 |
||||
"key-spacing": [ |
||||
"error", |
||||
{ |
||||
"afterColon": true |
||||
} |
||||
], |
||||
// 要求在对象字面量的冒号和值之间存在至少有一个空格 |
||||
|
||||
|
||||
// 逗号 |
||||
"comma-style": "error", |
||||
// 逗号必须放在行末 |
||||
"comma-dangle": [ |
||||
"error", |
||||
"never" |
||||
], |
||||
// 多行对象字面量中要求不要拖尾逗号 |
||||
"comma-spacing": [ |
||||
"error", |
||||
{ |
||||
"before": false, |
||||
"after": true |
||||
} |
||||
], |
||||
//在变量声明、数组字面量、对象字面量、函数参数 和 序列中禁止在逗号前使用空格,要求在逗号后使用一个或多个空格 |
||||
|
||||
|
||||
// 分号 |
||||
"semi": "error", |
||||
//不得省略语句结束的分号 |
||||
"semi-spacing": [ |
||||
"error", |
||||
"react/jsx-uses-react": "error", |
||||
"react/jsx-uses-vars": "error" |
||||
}, |
||||
"overrides": [ |
||||
{ |
||||
"before": false, |
||||
"after": true |
||||
"files": ["*.ts", "*.tsx"], |
||||
"rules": { |
||||
"no-undef": "off", |
||||
"no-unused-vars": "off" |
||||
} |
||||
], |
||||
//禁止分号周围的空格 |
||||
"no-extra-semi": "error", |
||||
// 禁用不必要的分号 |
||||
|
||||
|
||||
// 类型转换 |
||||
"no-extra-boolean-cast": "error", |
||||
// 禁止不必要的布尔类型转换 |
||||
|
||||
|
||||
// 其他最佳实践或规范 |
||||
"no-unexpected-multiline": "error", |
||||
// 禁止使用令人困惑的多行表达式 |
||||
"no-unreachable": "error", |
||||
// 禁止在 return、throw、continue 和 break 语句后出现不可达代码 |
||||
"valid-typeof": "error", |
||||
// 强制 typeof 表达式与有效的字符串进行比较 |
||||
"no-new-wrappers": "error" |
||||
// 禁止通过 new 操作符使用 String、Number 和 Boolean |
||||
}, |
||||
"globals": { |
||||
"window": true, |
||||
"BI": true, |
||||
"BICst": true, |
||||
"Data": true, |
||||
"Fix": true, |
||||
"module": true, |
||||
"describe": true, |
||||
"it": true, |
||||
"expect": true, |
||||
"Dec": true |
||||
} |
||||
] |
||||
} |
@ -0,0 +1,2 @@
|
||||
registry=https://registry.npm.taobao.org |
||||
@fui:registry=https://npm.fineres.com/ |
@ -0,0 +1,5 @@
|
||||
{ |
||||
"singleQuote": true, |
||||
"arrowParens": "avoid", |
||||
"printWidth": 160 |
||||
} |
@ -0,0 +1,7 @@
|
||||
{ |
||||
"extends": ["stylelint-config-standard", "stylelint-prettier/recommended"], |
||||
"rules": { |
||||
"no-descending-specificity": null, |
||||
"selector-pseudo-element-colon-notation": "single" |
||||
} |
||||
} |
@ -1,121 +0,0 @@
|
||||
module.exports = function (grunt) { |
||||
// Project configuration.
|
||||
grunt.initConfig({ |
||||
pkg: grunt.file.readJSON("package.json"), |
||||
concat: { |
||||
options: { |
||||
separator: "" |
||||
}, |
||||
bundleJs: { |
||||
src: [ |
||||
"src/modules/**/*.js", |
||||
"src/index.js" |
||||
], |
||||
dest: "dist/bundle.js" |
||||
}, |
||||
bundleCss: { |
||||
src: ["src/css/**/*.css"], |
||||
dest: "dist/bundle.css" |
||||
} |
||||
}, |
||||
|
||||
less: { |
||||
main: { |
||||
expand: true, |
||||
cwd: "src/modules", |
||||
src: ["**/*.less"], |
||||
dest: "src/css/", |
||||
ext: ".css" |
||||
}, |
||||
dev: { |
||||
options: { |
||||
compress: true, |
||||
yuicompress: false |
||||
} |
||||
} |
||||
}, |
||||
|
||||
uglify: { |
||||
options: { |
||||
banner: |
||||
"/*! <%= pkg.name %> <%= grunt.template.today(\"dd-mm-yyyy\") %> */\n" |
||||
}, |
||||
dist: { |
||||
files: { |
||||
"dist/bundle.min.js": ["<%= concat.bundleJs.dest %>"] |
||||
} |
||||
} |
||||
}, |
||||
|
||||
cssmin: { |
||||
bundleCss: { |
||||
src: "<%= concat.bundleCss.dest %>", |
||||
|
||||
dest: "dist/bundle.min.css" |
||||
} |
||||
}, |
||||
|
||||
jshint: { |
||||
files: ["src/**/*.js"], |
||||
options: { |
||||
globals: { |
||||
$: true, |
||||
jQuery: true, |
||||
console: true, |
||||
module: true, |
||||
document: true |
||||
}, |
||||
browser: true, |
||||
expr: true |
||||
} |
||||
}, |
||||
watch: { |
||||
scripts: { |
||||
files: ["src/**/*.js", "src/**/*.less"], |
||||
tasks: ["less", "concat"], |
||||
options: { |
||||
spanw: true, |
||||
interrupt: true |
||||
} |
||||
}, |
||||
livereload: { |
||||
options: { |
||||
livereload: "<%= connect.options.livereload %>" |
||||
}, |
||||
files: ["src/**/*.js", "src/**/*.less"] |
||||
} |
||||
}, |
||||
connect: { |
||||
options: { |
||||
port: 9000, |
||||
open: true, |
||||
livereload: 35799, |
||||
// Change this to '0.0.0.0' to access the server from outside
|
||||
hostname: "localhost" |
||||
}, |
||||
server: { |
||||
options: { |
||||
port: 9009, |
||||
base: "./" |
||||
} |
||||
} |
||||
} |
||||
}); |
||||
|
||||
grunt.loadNpmTasks("grunt-contrib-uglify"); |
||||
grunt.loadNpmTasks("grunt-contrib-jshint"); |
||||
grunt.loadNpmTasks("grunt-contrib-less"); |
||||
grunt.loadNpmTasks("grunt-contrib-watch"); |
||||
grunt.loadNpmTasks("grunt-contrib-concat"); |
||||
grunt.loadNpmTasks("grunt-contrib-cssmin"); |
||||
grunt.loadNpmTasks("grunt-contrib-connect"); |
||||
|
||||
grunt.registerTask("default", [ |
||||
"jshint", |
||||
"less", |
||||
"concat", |
||||
"connect", |
||||
"watch" |
||||
]); |
||||
grunt.registerTask("min", ["less", "concat", "uglify", "cssmin"]); |
||||
}; |
@ -1,11 +1,63 @@
|
||||
# FineUI-Start |
||||
# README |
||||
|
||||
## 安装运行 |
||||
`git clone --recursive https://git.fanruan.com/dailer/FineUI-Start.git` |
||||
## 准备工作 |
||||
|
||||
`npm install` |
||||
### 克隆仓库 |
||||
|
||||
`npm run grunt` |
||||
```shell |
||||
git clone https://code.fineres.com/scm/fui/fineui-starter.git |
||||
``` |
||||
|
||||
## 示例效果 |
||||
![](./screenshorts/todolist.gif) |
||||
### 安装依赖 |
||||
|
||||
```shell |
||||
# 账户:public |
||||
# 密码:fr123456 |
||||
# 邮箱:任意 |
||||
npm adduser --registry https://npm.fineres.com |
||||
npm install |
||||
``` |
||||
|
||||
### 安装扩展 |
||||
|
||||
以 VSCode 为例,为保证代码规范和格式统一,请安装`ESLint`、`stylelint`、`Prettier`、`EditorConfig`扩展,以使相关配置文件生效。 |
||||
|
||||
## 开发工作 |
||||
|
||||
### 项目基础配置 |
||||
|
||||
布局配置请见`src/modules/app/layout/layout.constant.ts`。 |
||||
|
||||
样式配置请见`src/less/`,譬如`src/less/lib/constant`中的`@color-app-primary`表示项目的主色。 |
||||
|
||||
### 项目调试、打包与测试 |
||||
|
||||
```shell |
||||
# 调试 |
||||
npm run start |
||||
|
||||
# 打包 |
||||
npm run build |
||||
|
||||
# 测试 |
||||
npm run test |
||||
``` |
||||
|
||||
### 项目规范和格式检查 |
||||
|
||||
```shell |
||||
# 代码规范 |
||||
npm run eslint |
||||
npm run eslint:fix |
||||
|
||||
# 样式规范 |
||||
npm run stylelint |
||||
npm run stylelint:fix |
||||
|
||||
# 代码格式 |
||||
npm run prettier |
||||
``` |
||||
|
||||
## 效果预览 |
||||
|
||||
![页面截图](./screenshots/demo.jpeg) |
||||
|
@ -1,24 +0,0 @@
|
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<title></title> |
||||
<!--核心css文件,自带font、图片等,使用的是fineui资源--> |
||||
<link rel="stylesheet" type="text/css" href="node_modules/fineui/dist/core.css" /> |
||||
<!-- 下面是不包含normalize.css的css --> |
||||
<!-- <link rel="stylesheet" type="text/css" href="node_modules/fineui/dist/2.0/fineui_without_normalize.css" /> --> |
||||
<!-- 这里定义的是本地资源路径,如有需要修改可以复制出来替换其中路径,并在此处加载替换后的css --> |
||||
<link rel="stylesheet" type="text/css" href="node_modules/fineui/dist/resource.css" /> |
||||
<!--个人代码样式--> |
||||
<link rel="stylesheet" type="text/css" href="./dist/bundle.css"/> |
||||
</head> |
||||
<body> |
||||
<div id="wrapper"></div> |
||||
<!--核心js--> |
||||
<script src="node_modules/fineui/dist/core.js"></script> |
||||
<!-- 这里定义的是本地一些配置项,比如国际化,如有需要修改可以复制出来替换其中配置,并在此处加载替换后的js --> |
||||
<script src="node_modules/fineui/dist/resource.js"></script> |
||||
<!--个人代码js--> |
||||
<script src="./dist/bundle.js"></script> |
||||
</body> |
||||
</html> |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 5.7 KiB |
@ -0,0 +1 @@
|
||||
module.exports = require('@fui/babel-preset-fineui').configs.base; |
@ -1,36 +0,0 @@
|
||||
/** |
||||
列表项的less,其中用到了部分FineUI提供的字号,颜色常量,还有border-radius,box-shadow方法等.请选择性使用.不强制要求 |
||||
*/ |
||||
.my-todolist-header { |
||||
background-color: #3d4d66; |
||||
} |
||||
.my-todolist-header .my-todolist-title { |
||||
font-size: 22px; |
||||
color: #FFF; |
||||
} |
||||
.my-todolist-header .my-todolist-header-editor { |
||||
background-color: #FFF; |
||||
-webkit-border-radius: 5px; |
||||
-moz-border-radius: 5px; |
||||
border-radius: 5px; |
||||
} |
||||
/** |
||||
列表项的less,其中用到了部分FineUI提供的字号,颜色常量,还有border-radius方法等.请选择性使用.不强制要求 |
||||
*/ |
||||
.my-todolist-list .my-todolist-list-text { |
||||
font-size: 16px; |
||||
font-weight: bold; |
||||
} |
||||
.my-todolist-list .my-todolist-list-count-container { |
||||
-webkit-border-radius: 10px; |
||||
-moz-border-radius: 10px; |
||||
border-radius: 10px; |
||||
background-color: #3d4d66; |
||||
color: #ffffff; |
||||
} |
||||
/** |
||||
列表项的less,其中用到了部分FineUI提供的字号,颜色常量,还有border-radius,box-shadow方法等.请选择性使用.不强制要求 |
||||
*/ |
||||
.my-todolist-background { |
||||
background-color: #f7f8fa; |
||||
} |
@ -1,286 +0,0 @@
|
||||
!(function() { |
||||
/** |
||||
* 顶部组件,提供输入框添加todo项目 |
||||
* 布局: bi.horizontal_auto 实现水平居中. bi.left_right_vertical_adapt 实现标题是输入框的靠左靠右垂直居中 |
||||
*/ |
||||
var ToDoListHeader = BI.inherit(BI.Widget, { |
||||
|
||||
props: { |
||||
// 指定组件的className
|
||||
baseCls: "my-todolist-header" |
||||
}, |
||||
|
||||
render: function() { |
||||
var self = this, o = this.options; |
||||
return { |
||||
type: "bi.horizontal_auto", // 水平居中布局
|
||||
items: [ |
||||
{ |
||||
el: { |
||||
type: "bi.left_right_vertical_adapt", // 左右垂直居中布局
|
||||
width: 600, |
||||
height: o.height, |
||||
items: { |
||||
left: [ |
||||
{ |
||||
el: { |
||||
type: "bi.label", |
||||
cls: "my-todolist-title", |
||||
text: "FineUI ToDoList", |
||||
height: o.height |
||||
} |
||||
} |
||||
], |
||||
right: [ |
||||
{ |
||||
el: { |
||||
type: "bi.editor", |
||||
ref: function(_ref) { |
||||
self.editor = _ref; |
||||
}, |
||||
allowBlank: true, |
||||
cls: "my-todolist-header-editor", |
||||
watermark: "添加ToDo", |
||||
width: 300, |
||||
height: 24, |
||||
listeners: [ |
||||
{ // 监听bi.editor 组件的"EVENT_ENTER"事件(即敲回车),触发事件ToDoListHeader.EVENT_ADD事件并将输入框值置空
|
||||
eventName: "EVENT_ENTER", |
||||
action: function() { |
||||
// 注意:在这里this指向的是bi.editor的实例.通过bi.editor的getValue()方法获取输入框输入值.
|
||||
self.fireEvent(ToDoListHeader.EVENT_ADD, this.getValue()); |
||||
self.editor.setValue(""); |
||||
} |
||||
} |
||||
] |
||||
} |
||||
} |
||||
] |
||||
} |
||||
} |
||||
} |
||||
] |
||||
}; |
||||
} |
||||
}); |
||||
|
||||
ToDoListHeader.EVENT_ADD = "EVENT_ADD"; |
||||
|
||||
BI.shortcut("my.todolist.header", ToDoListHeader); |
||||
})();!(function() { |
||||
/** |
||||
* todo项列表 |
||||
* |
||||
*/ |
||||
var List = BI.inherit(BI.Widget, { |
||||
|
||||
props: { |
||||
// 指定组件的className
|
||||
baseCls: "my-todolist-list", |
||||
text: "正在进行" |
||||
}, |
||||
|
||||
render: function() { |
||||
var self = this, o = this.options; |
||||
return { |
||||
type: "bi.vertical", |
||||
items: [ |
||||
{ |
||||
el: { |
||||
type: "bi.vertical_adapt", |
||||
height: 40, |
||||
items: [ |
||||
{ |
||||
type: "bi.label", |
||||
cls: "my-todolist-list-text", |
||||
textAlign: "left", |
||||
text: o.text, |
||||
width: 580 |
||||
}, { |
||||
type: "bi.center_adapt", |
||||
cls: "my-todolist-list-count-container", |
||||
width: 20, |
||||
height: 20, |
||||
items: [ |
||||
{ |
||||
el: { |
||||
type: "bi.label", |
||||
ref: function(_ref) { |
||||
self.count = _ref; |
||||
}, |
||||
text: "0" |
||||
} |
||||
} |
||||
] |
||||
} |
||||
] |
||||
} |
||||
}, { // 用bi.vertical布局作为列表项的容器.
|
||||
type: "bi.vertical", |
||||
vgap: 10, |
||||
ref: function(_ref) { |
||||
self.list = _ref; |
||||
}, |
||||
items: this._createItems(o.items) |
||||
} |
||||
] |
||||
}; |
||||
}, |
||||
|
||||
_createItems: function(items) { |
||||
var self = this; |
||||
return BI.map(items, function(index, item) { |
||||
return BI.extend(item, { |
||||
type: "bi.multi_select_item", // 节点采用复选节点展示
|
||||
selected: item.done, // 已完成的todo项置为选中状态
|
||||
disabled: item.done, // 已完成的todo项置为灰化状态
|
||||
listeners: [ |
||||
{ // 为每个todo项添加"EVENT_CHANGE"事件监听,触发组件自身"EVENT_CHANGE"事件
|
||||
eventName: "EVENT_CHANGE", |
||||
action: function(v) { |
||||
self.fireEvent("EVENT_CHANGE", v); |
||||
} |
||||
} |
||||
] |
||||
}); |
||||
}); |
||||
}, |
||||
|
||||
_setCount: function(count) { |
||||
this.count.setText(count); |
||||
}, |
||||
|
||||
populate: function(items) { |
||||
this.list.populate(this._createItems(items)); |
||||
this._setCount(items.length); |
||||
} |
||||
}); |
||||
BI.shortcut("my.todolist.list", List); |
||||
})();!(function() { |
||||
/** |
||||
* todolist 组件 |
||||
*/ |
||||
var ToDoList = BI.inherit(BI.Widget, { |
||||
|
||||
props: { |
||||
baseCls: "fine-to-do-list" |
||||
}, |
||||
|
||||
// 生命周期函数,在组件创建前
|
||||
beforeCreate: function() { |
||||
// 初始化存储数据
|
||||
this.list = localStorage.getItem("fine-todolist") ? JSON.parse(localStorage.getItem("fine-todolist")) : []; |
||||
}, |
||||
|
||||
render: function() { |
||||
var self = this, o = this.options; |
||||
return { |
||||
type: "bi.vtape", // vtape布局,顶部高度固定,下部分列表占满高度
|
||||
items: [ |
||||
{ |
||||
el: { |
||||
type: "my.todolist.header", // 顶部组件
|
||||
listeners: [ |
||||
{ // 监听组件的EVENT_ADD事件,新建todo项
|
||||
eventName: "EVENT_ADD", |
||||
action: function(v) { |
||||
self.addToDo(v); |
||||
} |
||||
} |
||||
], |
||||
height: 40 |
||||
}, |
||||
height: 40 |
||||
}, { |
||||
type: "bi.horizontal_auto", // 水平居中布局
|
||||
cls: "my-todolist-background", // 添加className
|
||||
items: [ |
||||
{ |
||||
el: { |
||||
type: "my.todolist.list", // need todo项列表
|
||||
ref: function(_ref) { |
||||
self.todolist = _ref; |
||||
}, |
||||
items: this._getNeedTodoList(), |
||||
text: "正在进行", |
||||
listeners: [ |
||||
{ // 监听EVENT_CHANGE事件,完成某一项todo
|
||||
eventName: "EVENT_CHANGE", |
||||
action: function(v) { |
||||
self.finishTodo(v); |
||||
} |
||||
} |
||||
], |
||||
width: 600 |
||||
} |
||||
}, { |
||||
el: { |
||||
type: "my.todolist.list", // 已经完成的todo项列表
|
||||
text: "已经完成", |
||||
items: this._getAlreadyDoneList(), |
||||
ref: function(_ref) { |
||||
self.donelist = _ref; |
||||
}, |
||||
width: 600 |
||||
} |
||||
} |
||||
] |
||||
} |
||||
] |
||||
}; |
||||
}, |
||||
|
||||
_updateLocalStorage: function() { |
||||
localStorage.setItem("fine-todolist", JSON.stringify(this.list)); |
||||
}, |
||||
|
||||
_getNeedTodoList: function() { |
||||
return BI.filter(this.list, function(index, item) { |
||||
return !item.done; |
||||
}); |
||||
}, |
||||
|
||||
_getAlreadyDoneList: function() { |
||||
return BI.filter(this.list, function(index, item) { |
||||
return item.done; |
||||
}); |
||||
}, |
||||
|
||||
/** |
||||
* 添加todo项 |
||||
* @param text todo项的内容 |
||||
*/ |
||||
addToDo: function(text) { |
||||
this.list.push({ |
||||
value: BI.UUID(), |
||||
text: text, |
||||
done: false |
||||
}); |
||||
this.todolist.populate(this._getNeedTodoList()); |
||||
this._updateLocalStorage(); |
||||
}, |
||||
|
||||
/** |
||||
* 完成某一项todo |
||||
* @param v todo项的value |
||||
*/ |
||||
finishTodo: function(v) { |
||||
BI.some(this.list, function(index, item) { |
||||
if (item.value === v) { |
||||
item.done = true; |
||||
} |
||||
}); |
||||
this.todolist.populate(this._getNeedTodoList()); |
||||
this.donelist.populate(this._getAlreadyDoneList()); |
||||
this._updateLocalStorage(); |
||||
} |
||||
}); |
||||
BI.shortcut("my.todolist", ToDoList); |
||||
})(); |
||||
!(function () { |
||||
// 将todolist组件挂载到#wrapper上.
|
||||
BI.createWidget({ |
||||
type: "my.todolist", |
||||
element: "#wrapper" |
||||
}); |
||||
})(); |
Binary file not shown.
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue