New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

zan-upload

Package Overview
Dependencies
Maintainers
4
Versions
45
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

zan-upload - npm Package Compare versions

Comparing version 5.3.6 to 5.3.7

lib/components/Clipping.js

108

lib/components/MaterialsPopup.js

@@ -21,5 +21,5 @@ 'use strict';

var _select = require('zent/lib/select');
var _tree = require('zent/lib/tree');
var _select2 = _interopRequireDefault(_select);
var _tree2 = _interopRequireDefault(_tree);

@@ -38,2 +38,6 @@ var _searchInput = require('zent/lib/search-input');

var _classnames = require('classnames');
var _classnames2 = _interopRequireDefault(_classnames);
var _local_storage = require('zan-utils/browser/local_storage');

@@ -69,3 +73,3 @@

var IMAGE_PAGE_SIZE = 21; // 图片每页数量
var IMAGE_PAGE_SIZE = 15; // 图片每页数量
var VOICE_PAGE_SIZE = 10; // 音频每页数量

@@ -103,2 +107,9 @@

_this.setCategoryId = function (id) {
return function () {
_this.state.categoryId = id;
_this.getMediaList();
};
};
_this.handleSearchChange = function (evt) {

@@ -191,26 +202,64 @@ _this.setState({

}, {
key: 'setCategoryId',
value: function setCategoryId(evt, data) {
this.state.categoryId = data.id;
this.getMediaList();
}
}, {
key: 'renderCategoryRegion',
value: function renderCategoryRegion() {
var _this4 = this;
var _state = this.state,
categoryList = _state.categoryList,
categoryId = _state.categoryId,
keyword = _state.keyword;
categoryId = _state.categoryId;
var customRender = function customRender(data) {
return _react2['default'].createElement(
'div',
{
className: (0, _classnames2['default'])({
'category-item': true,
'category-active': categoryId === data.id
}, 'clearfix'),
onClick: _this4.setCategoryId(data.id)
},
_react2['default'].createElement(
'span',
{ className: 'pull-left' },
data.name
),
_react2['default'].createElement(
'span',
{ className: 'category-item-count pull-right' },
data.count
)
);
};
return _react2['default'].createElement(
'div',
{ className: 'category-list-region' },
_react2['default'].createElement(_select2['default'], {
data: categoryList,
value: categoryId,
optionValue: 'id',
optionText: 'name',
onChange: this.setCategoryId.bind(this)
}),
{ className: 'category-list-region pull-left' },
_react2['default'].createElement(_tree2['default'], { data: categoryList, expandAll: true, render: customRender })
);
}
}, {
key: 'renderToolBar',
value: function renderToolBar() {
var _state2 = this.state,
keyword = _state2.keyword,
categoryList = _state2.categoryList;
var onShowUpload = this.props.onShowUpload;
return _react2['default'].createElement(
'div',
{ className: 'upload-tool-bar clearfix' },
_react2['default'].createElement(
_button2['default'],
{
className: 'pull-left',
onClick: function onClick() {
return onShowUpload(true, categoryList);
},
type: 'primary'
},
'\u4E0A\u4F20\u56FE\u7247'
),
_react2['default'].createElement(_searchInput2['default'], {
className: 'pull-right',
value: keyword,

@@ -226,7 +275,7 @@ onChange: this.handleSearchChange,

var options = this.props.options;
var _state2 = this.state,
mediaList = _state2.mediaList,
count = _state2.count,
currPageNo = _state2.currPageNo,
selectedItems = _state2.selectedItems;
var _state3 = this.state,
mediaList = _state3.mediaList,
count = _state3.count,
currPageNo = _state3.currPageNo,
selectedItems = _state3.selectedItems;

@@ -238,3 +287,3 @@

'div',
{ className: 'attachment-list-region' },
{ className: 'attachment-list-region pull-right' },
options.type === 'voice' ? _react2['default'].createElement(_VoiceList2['default'], {

@@ -292,5 +341,5 @@ data: mediaList,

var options = this.props.options;
var _state3 = this.state,
mediaList = _state3.mediaList,
selectedItems = _state3.selectedItems;
var _state4 = this.state,
mediaList = _state4.mediaList,
selectedItems = _state4.selectedItems;

@@ -347,5 +396,6 @@ var maxAmount = options.maxAmount;

null,
this.renderToolBar(),
_react2['default'].createElement(
'div',
{ className: prefix + '-materials' },
{ className: prefix + '-materials clearfix' },
!options.categoryId && this.renderCategoryRegion(),

@@ -352,0 +402,0 @@ this.renderMediaRegion()

@@ -24,2 +24,4 @@ 'use strict';

var uploadfile = function uploadfile(options, file, token) {
var uploadOptions = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
var formData = new FormData();

@@ -30,2 +32,5 @@

formData.append('file', file);
if (uploadOptions.categoryId) {
formData.append('x:categoryId', uploadOptions.categoryId);
}

@@ -89,3 +94,3 @@ return (0, _zanPcAjax2['default'])({

}(index)
}), files[index], token).then(function (file) {
}), files[index], token, uploadOptions).then(function (file) {
file = file.data;

@@ -92,0 +97,0 @@ file = (0, _utils.responseParse)(file);

@@ -35,2 +35,6 @@ 'use strict';

var _icon = require('zent/lib/icon');
var _icon2 = _interopRequireDefault(_icon);
var _zanPcAjax = require('zan-pc-ajax');

@@ -52,2 +56,6 @@

var _Clipping = require('./components/Clipping');
var _Clipping2 = _interopRequireDefault(_Clipping);
var _utils = require('./utils');

@@ -84,2 +92,3 @@

_this.handleFetch = function (networkUrl) {
var categoryId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
var _this$props = _this.props,

@@ -97,3 +106,3 @@ kdtId = _this$props.kdtId,

kdt_id: kdtId,
categoryId: 2,
categoryId: categoryId,
scope: scope

@@ -140,3 +149,4 @@ };

visible: false,
activeId: props.materials ? 'materials' : 'upload'
activeId: props.materials ? 'materials' : 'upload',
showLocalUpload: false
};

@@ -147,2 +157,3 @@ _this.typeName = props.type === 'voice' ? '语音' : '图片';

_this.closePopup = _this.closePopup.bind(_this);
_this.setShowLocalUpload = _this.setShowLocalUpload.bind(_this);
return _this;

@@ -191,3 +202,4 @@ }

onUpload: _ProcessUpload2['default'].bind(this, uploadOptions),
onFetch: this.handleFetch
onFetch: this.handleFetch,
categoryList: this.categoryList
}, uploadOptions));

@@ -207,3 +219,6 @@ }

materials = _props.materials,
uploadOptions = _objectWithoutProperties(_props, ['trigger', 'prefix', 'className', 'triggerClassName', 'tips', 'children', 'triggerInline', 'materials']);
clipping = _props.clipping,
clippingUrl = _props.clippingUrl,
clippingTitle = _props.clippingTitle,
uploadOptions = _objectWithoutProperties(_props, ['trigger', 'prefix', 'className', 'triggerClassName', 'tips', 'children', 'triggerInline', 'materials', 'clipping', 'clippingUrl', 'clippingTitle']);

@@ -223,2 +238,3 @@ var _state = this.state,

var dialogClassName = (0, _classnames2['default'])([prefix + '-upload', className]);
var clippingClassName = (0, _classnames2['default'])([prefix + '-clipping', className]);

@@ -250,6 +266,21 @@ className = (0, _classnames2['default'])([dialogClassName, {

),
_react2['default'].createElement(
clipping ? _react2['default'].createElement(
_dialog2['default'],
{
title: clippingTitle,
visible: visible,
className: clippingClassName,
onClose: this.closePopup,
maskClosable: false,
style: { maxWidth: 'none' }
},
_react2['default'].createElement(_Clipping2['default'], {
prefix: prefix + '-upload',
url: clippingUrl,
uploadOptions: uploadOptions
})
) : _react2['default'].createElement(
_dialog2['default'],
{
visible: visible,
className: dialogClassName,

@@ -266,8 +297,3 @@ onClose: this.closePopup,

},
materials && this.renderMaterialsPopup(uploadOptions),
_react2['default'].createElement(
TabPanel,
{ tab: '\u672C\u5730\u4E0A\u4F20', id: 'upload' },
this.renderUploadComponent(uploadOptions)
)
materials && this.renderMaterialsPopup(uploadOptions)
)

@@ -277,3 +303,15 @@ )

}
}, {
key: 'setShowLocalUpload',
value: function setShowLocalUpload(showLocalUpload) {
var categoryList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
if (categoryList.length > 0) {
this.categoryList = categoryList;
}
this.setState({
showLocalUpload: showLocalUpload
});
}
/**

@@ -286,6 +324,36 @@ * 显示素材银行弹框

value: function renderMaterialsPopup(options) {
var _this3 = this;
var _props2 = this.props,
prefix = _props2.prefix,
className = _props2.className;
var showLocalUpload = this.state.showLocalUpload;
if (showLocalUpload) {
var nav = _react2['default'].createElement(
'span',
null,
_react2['default'].createElement(
'span',
{
className: 'return-materials',
onClick: function onClick() {
return _this3.setShowLocalUpload(false);
}
},
_react2['default'].createElement(_icon2['default'], { className: 'left-icon', type: 'right' }),
' ',
'\u6211\u7684' + this.typeName
),
' ',
'/ \u672C\u5730\u4E0A\u4F20'
);
return _react2['default'].createElement(
TabPanel,
{ tab: nav, id: 'materials' },
this.renderUploadComponent(options)
);
}
return _react2['default'].createElement(

@@ -297,2 +365,3 @@ TabPanel,

options: options,
onShowUpload: this.setShowLocalUpload,
className: className,

@@ -324,2 +393,5 @@ showUploadPopup: this.showUpload

* @property {Boolean} [materials=false] 是否支持素材银行
* @property {Boolean} [clipping=false] 是否支持裁剪功能
* @property {String} [clippingUrl=''] 裁剪功能默认展示预览图片
* @property {String} [clippingTitle=''] 裁剪Dialog标题
* @property {Function} [onSuccess=noop] 上传成功回调

@@ -339,6 +411,9 @@ * @property {Function} [onError=noop] 上传失败回调

maxSize: 1 * 1024 * 1024,
maxAmount: 0,
maxAmount: 15,
tips: '',
localOnly: false,
materials: false,
clipping: false,
clippingUrl: '',
clippingTitle: '上传Logo',
type: 'image',

@@ -345,0 +420,0 @@ auto: false,

{
"name": "zan-upload",
"version": "5.3.6",
"version": "5.3.7",
"description": "这是一个React组件",

@@ -26,2 +26,3 @@ "main": "./lib/index.js",

"object-assign": "^4.1.0",
"react-rnd": "7.1.5",
"zan-pc-ajax": "^4.1.2",

@@ -28,0 +29,0 @@ "zan-utils": "^1.0.3"

@@ -251,2 +251,34 @@ ## zan-upload

:::demo 裁剪功能上传Logo
```js
import Upload from 'zan-upload';
class Simple extends React.Component {
uploadSuccess(data) {
console.log(data); // eslint-disable-line
}
uploadError(data) {
console.log(data);
}
render() {
return <Upload
clipping
clippingUrl="https://img.yzcdn.cn/upload_files/2016/09/28/FskX-jOAV47z3QSPEJcwmgic5j8t.jpg"
tips="建议尺寸:640 x 640 像素。"
onSuccess={this.uploadSuccess}
onError={this.uploadError}
tokenUrl="https://materials.youzan.com/shop/pubImgUploadToken.json" />
}
}
ReactDOM.render(
<Simple />
, mountNode
);
```
:::
### API

@@ -285,2 +317,5 @@

| triggerClassName | 重写trigger样式 | string | `'rc-upload-trigger'` | 否 |
| clipping | 是否支持裁剪功能 | boolean | `false` | 否 |
| clippingUrl | 裁剪功能默认展示预览图片 | string | `''` | 否 |
| clippingTitle | 裁剪Dialog标题 | string | `''` | 否 |

@@ -354,1 +389,6 @@ ### 更新日志

- 修复上传错误信息获取不正确的问题
#### 5.3.7
- 支持图片裁剪上传Logo功能

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc