1.3.5 • Published 6 years ago
timepack-album v1.3.5
timepack-album
timepack相簿组件包和工具类
Build Setup
# install dependencies
npm install 'timepack-album' --save
组件API
AlbumGlobal
相簿全局预览组件
使用
import {AlbumGlobal} from 'timepack-album'
入参
名称 | 类型 | 含义 |
---|---|---|
product | Object | 产品参数(包含产品类型:相簿/台历) |
layout | Array | 容器数据 |
photoList | Array | 相簿数据 |
方法
名称 | 参数 | 含义 |
---|---|---|
change | (photoList,layout) | 数据结构变更,反馈变更数据,供父组件处理 |
upload | 无 | 触发上传事件 |
AlbumGallery
照片库组件,提供图片的修改删除上传和选择操作
使用
import {AlbumGallery} from 'timepack-album'
入参
名称 | 类型 | 含义 |
---|---|---|
layout | Array | 容器数据 |
photoList | Array | 相簿数据 |
mode | String | 上传模式,有group ,single |
方法
名称 | 参数 | 含义 |
---|---|---|
load | 无 | 懒加载图片列表的请求 |
pageChange | 无 | 懒加载图片列表页数变更 |
delete | (ids,groupIndex,imageIndex) | 删除图片 |
upload | 无 | 安卓端图片上传 |
save | data源图片信息数据 | 图片上传保存到服务端 |
confirm | data相簿图片信息数据 | 点击确认按钮,同步图片数据结构 |
afterImageLoaded | (page,data) | 由父组件触发,图片加载完成后调用 |
afterTokenCreated | uptoken | 由父组件触发,获取到七牛token后调用 |
afterImageDeleted | (groupIndex,imageIndex) | 由父组件触发,图片删除后调用 |
afterImageSaved | data源图片信息数据 | 由父组件触发,图片保存完成后调用 |
工具API
TimepackQiniu
使用
import {TimepackQiniu} from 'timepack-album'
TimepackUtil
使用
import {TimepackUtil} from 'timepack-album'
方法
method | return | description |
---|---|---|
getQueryByName(str) | String or Null | get url query-value by query-key |
isTelephone(str) | Boolean | judge string is telephone or not |
dateFormat(date,fmt) | String | format date |
removeArrayItem(array,index) | String | remove item from an array |
browser().isIE() | Boolean | judge current browser is ie or not |
browser().isFirefox() | Boolean | judge current browser is firefox or not |
browser().isChrome() | Boolean | judge current browser is chrome or not |
browser().isAndroid() | Boolean | judge current browser is android or not |
browser().isIOS() | Boolean | judge current browser is ios or not |
browser().isWeixin() | Boolean | judge current browser is wechat or not |
string().trim(str) | String | trim string |
string().isEmpty(str) | String | judge the input string is empty |
string().isNotEmpty(str) | String | judge the input string is not empty |
string().isBlank(str) | String | judge the input string is blank |
string().isNotBlank(str) | String | judge the input string is blank |
fileUploader(param,callback) | No Return | upload a file to server through qiniu |
fileUploader
method statement
param | default | required |
---|---|---|
fileType | jpg,png,jpeg | false |
buttonId | null | true |
uptoken | null | true |
domain | https://images.cache.timepack.cn/ | true |
size | 4mb | false |
callback | description | required |
---|---|---|
added | trigger when files have been added | false |
progress | trigger when a file were uploading | false |
complete | trigger when a file uploading event completed | false |
uploaded | trigger when a file uploading successfully | true |
error | trigger when a file uploading event came across an error | false |
AlbumCanvas
相簿图片自动合成,拖拽,旋转,删除核心模块
render(photo,layout,temp)
init()
初始化相簿数据
compatable()
跨设备分享,数据兼容处理
getter()
template(index)
:模板图片photo(pageIndex,imageIndex)
:radio(index)
:获取容器的长宽比rest()
:获取整页剩余的未填充数量pageRest(index)
:获取指定页数空区域的数量(即未填充的数量)
setter()
editPageStyle(pageIndex,imageIndex,editWidth,editable)
:单页容器模板样式photoStyle(pageIndex,imageIndex)
:单页图片样式groupImage($list)
: 用jquery对象列表批量填充图片listImage(list)
:用图片数据列表填充图片fillImageByPage($list,page)
:根据页数填充图片indexImage($list, page, index)
:单页内根据下标填充图片
operate()
exchange(pageIndex,lastIndex,currentIndex)
:更换图片间顺序rotate(pageIndex,imageIndex)
:顺时针旋转图片90度zoomImage(pageIndex,index,type)
:放大或缩小图片,type-1放大,type-2缩小convert($list)
:图片jquery对象转换为可用的数据结构changeLayout(index)
:修改容器模板
delete()
deleteImageByIndex(pageIndex,imageIndex)
:删除指定页内指定图片
event
touchstart(e,target)
:touchmove(e, startPosition, position, target)
:touchend(e, page, index, position, target)
:
1.3.5
6 years ago
1.3.4
6 years ago
1.3.3
6 years ago
1.3.2
6 years ago
1.3.1
6 years ago
1.3.0
6 years ago
1.2.9
6 years ago
1.2.8
6 years ago
1.2.7
6 years ago
1.2.6
6 years ago
1.2.5
6 years ago
1.2.4
6 years ago
1.2.3
6 years ago
1.2.2
6 years ago
1.2.1
6 years ago
1.2.0
6 years ago
1.1.30
6 years ago
1.1.29
6 years ago
1.1.28
6 years ago
1.1.27
6 years ago
1.1.26
6 years ago
1.1.25
6 years ago
1.1.24
6 years ago
1.1.23
6 years ago
1.1.22
6 years ago
1.1.21
6 years ago
1.1.20
6 years ago
1.1.19
6 years ago
1.1.18
6 years ago
1.1.17
6 years ago
1.1.16
6 years ago
1.1.15
6 years ago
1.1.14
6 years ago
1.1.13
6 years ago
1.1.12
6 years ago
1.1.11
6 years ago
1.1.10
6 years ago
1.1.9
6 years ago
1.1.8
6 years ago
1.1.7
6 years ago
1.1.6
6 years ago
1.1.5
6 years ago
1.1.4
6 years ago
1.1.3
6 years ago
1.1.2
6 years ago
1.1.1
6 years ago
1.1.0
6 years ago