import React from 'react';
import ReactDom from 'react-dom';
import ajax from 'jquery/src/ajax/xhr.js';
import $ from 'jquery/src/ajax';
import moment from 'moment';
import { Form,Radio, Icon, Button, Input, Select, Spin, Table, Switch, message, DatePicker, Modal, Upload,Popconfirm,TimePicker } from 'antd';
import {categoryState} from '@/dataDic.js';
import {getCategoryState,splitUrl} from '@/tools.js';
//图片组件
const PicturesWall = React.createClass({
getInitialState() {
return {
previewVisible: false,
previewImage: '',
fileList: [],
tags: []
};
},
handleCancel() {
this.setState({ previewVisible: false });
},
handlePreview(file) {
this.setState({
previewImage: file.url || file.thumbUrl,
previewVisible: true
});
},
handleChange(info) {
let fileList = info.fileList;
this.setState({ fileList });
this.props.fileList(fileList);
},
componentWillReceiveProps(nextProps) {
this.state.fileList = nextProps.pictureUrl;
},
render() {
const { previewVisible, previewImage, fileList } = this.state;
const uploadButton = (
);
return (
{fileList.length >=1 ? null : uploadButton}
);
}
});
const BusinessCategory=Form.create()(React.createClass({
loadData(pageNo) {
this.state.data = [];
this.setState({
loading: true,
page:pageNo,
});
$.ajax({
method: "get",
dataType: "json",
crossDomain: false,
url: globalConfig.context + '/api/admin/jtBusiness/category/list',
data: {
pageNo: pageNo || 1,
pageSize: this.state.pagination.pageSize,
name:this.state.nameSearch, //品类名称
layer:this.state.layerSearch,//组织层级
},
success: function (data) {
let theArr = [];
if (!data.data || !data.data.list) {
if (data.error && data.error.length) {
message.warning(data.error[0].message);
};
} else {
for (let i = 0; i < data.data.list.length; i++) {
let thisdata = data.data.list[i];
theArr.push({
key: i,
id: thisdata.id,//品类ID
sort:thisdata.sort,//品类序号
number: thisdata.number,//品类编号
module:thisdata.module?String(thisdata.module):undefined,
name: thisdata.name,//品类名称
layer:thisdata.layer,
superId:thisdata.superId,
layerName: thisdata.layerName,//品类层级
superName: thisdata.superName,//上级品类
});
};
this.state.pagination.current = data.data.pageNo;
this.state.pagination.total = data.data.totalCount;
};
this.setState({
dataSource: theArr,
pagination: this.state.pagination
});
}.bind(this),
}).always(function () {
this.setState({
loading: false
});
}.bind(this));
},
getInitialState() {
return {
searchMore: true,
selectedRowKeys: [],
pictureUrl: [],
selectedRows: [],
loading: false,
pagination: {
defaultCurrent: 1,
defaultPageSize: 10,
showQuickJumper: true,
pageSize: 10,
onChange: function (page) {
this.loadData(page);
this.setState({
selectedRowKeys: [],
})
}.bind(this),
showTotal: function (total) {
return '共' + total + '条数据';
}
},
columns: [
{
title: '品类编号',
dataIndex: 'number',
key: 'number',
}, {
title: '品类名称',
dataIndex: 'name',
key: 'name',
}, {
title: '品类层级',
dataIndex: 'layerName',
key: 'layerName'
}, {
title: '上级品类',
dataIndex: 'superName',
key: 'superName',
},{
title:'操作',
dataIndex: 'superName1',
key: 'superName1',
render:(text,recard)=>{
return (
{recard.layer=='1'&&}
)
}
}
],
dataSource: [],
};
},
componentWillMount() {
this.loadData();
},
//新建下级
nextAdd(recard){
this.setState({
recrdAdd:recard,
visible: true,
name:'',
addFirst:1,
superId:recard.id,
module:recard.module
});
},
//编辑保存
edithandleSubmit(e){
e.preventDefault();
let thePictureUrl = [];
if (this.state.pictureUrl.length) {
let picArr = [];
this.state.pictureUrl.map(function (item) {
if ( item.response && item.response.data && item.response.data.length ){
picArr.push(item.response.data);
}
});
thePictureUrl = picArr.join(",");
};
$.ajax({
method: "post",
dataType: "json",
crossDomain: false,
url: globalConfig.context + "/api/admin/jtBusiness/category/update",
data: {
id: this.state.id,
name:this.state.name,
summary:this.state.summary,
imgUrl:thePictureUrl
}
}).done(function (data) {
if (!data.error.length) {
message.success('保存成功!');
this.setState({
loading: false,
editvisible:false
});
} else {
message.warning(data.error[0].message);
};
this.loadData(this.state.page)
}.bind(this));
},
//整行删除
delectRow() {
let deletedIds = '';
for (let idx = 0; idx < this.state.selectedRows.length; idx++) {
let rowItem = this.state.selectedRows[idx];
if (rowItem.id) {
deletedIds=rowItem.id;
};
};
this.setState({
selectedRowKeys: [],
loading: deletedIds.length > 0
});
$.ajax({
method: "post",
dataType: "json",
crossDomain: false,
url: globalConfig.context + "/api/admin/jtBusiness/category/delete",
data: {
id: deletedIds
}
}).done(function (data) {
if (!data.error.length) {
message.success('删除成功!');
this.setState({
loading: false,
});
} else {
message.warning(data.error[0].message);
};
this.loadData(this.state.page)
}.bind(this));
},
addClick() {
this.state.RowData = {};
this.setState({
visible: true,
addFirst:0,
name:'',
superId:'',
module:'0'
});
},
//新增保存
addhandleSubmit(e){
e.preventDefault();
this.setState({
loading:true
})
$.ajax({
method: "post",
dataType: "json",
crossDomain: false,
url: globalConfig.context + "/api/admin/jtBusiness/category/apply",
data: {
name:this.state.name,
superId:this.state.superId,
layer:this.state.addFirst?'2':'1',
module:this.state.module
}
}).done(function (data) {
if (!data.error.length) {
message.success('新增成功!');
this.setState({
loading: false,
visible:false
});
} else {
message.warning(data.error[0].message);
};
this.loadData(this.state.page)
}.bind(this));
},
editClick() {
this.state.RowData = {};
this.setState({
editvisible: true
});
},
detailes(recard){
this.setState({
loading: true,
});
$.ajax({
method: "get",
dataType: "json",
crossDomain: false,
url: globalConfig.context + '/api/admin/jtBusiness/category/detail',
data: {
id:recard.id
},
success: function (data) {
if (!data.data) {
if (data.error && data.error.length) {
message.warning(data.error[0].message);
};
} else {
let thisdata=data.data;
this.setState({
id:thisdata.id,//品类id
name:thisdata.name,//品类名称
createTime:thisdata.createTime?(new Date(thisdata.createTime)).toLocaleString():'',
superId:thisdata.superId,//父类id
pictureUrl: thisdata.imgUrl ? splitUrl(thisdata.imgUrl, ',', globalConfig.avatarHost + '/upload') : [],
})
};
}.bind(this),
}).always(function () {
this.setState({
loading: false
});
}.bind(this));
},
handleCancel() {
this.setState({ visible: false })
},
edithandleCancel() {
this.setState({ editvisible: false })
},
search() {
this.loadData();
},
reset() {
this.state.nameSearch = '';//品类名称清零
this.state.layerSearch = undefined;//品类层级清零
this.loadData();
},
searchSwitch() {
this.setState({
searchMore: !this.state.searchMore
});
},
getPictureUrl(e) {
this.setState({ pictureUrl: e });
},
tableRowClick(record, index) {
this.setState({
editvisible: true,
visible:false,
theData:record
});
this.detailes(record)
},
render() {
const FormItem = Form.Item
const rowSelection = {
selectedRowKeys: this.state.selectedRowKeys,
onChange: (selectedRowKeys, selectedRows) => {
this.setState({
selectedRows: selectedRows.slice(-1),
selectedRowKeys: selectedRowKeys.slice(-1)
});
}
};
const hasSelected = this.state.selectedRowKeys.length > 0;
const theData =this.state.theData ||{};
const recrdAdd = this.state.recrdAdd ||{};
return (
);
}
}));
export default BusinessCategory;