import React from 'react';
import $ from 'jquery/src/ajax';
import { Form, Icon, Radio, Button, Input, Select, Spin, Table, message, Modal, Upload, Popconfirm } from 'antd';
import { typeModule } from '@/dataDic.js';
import { splitUrl, getTypeModule } 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, //组织层级
module: this.state.moduleSearch
},
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 ? thisdata.module.toString() : undefined,
name: thisdata.name, //品类名称
layer: thisdata.layer,
superId: thisdata.superId,
layerName: thisdata.layerName, //品类层级
superNameId: thisdata.superId, //上级品类
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)
);
},
loadMenu() {
this.state.data = [];
$.ajax({
method: 'get',
dataType: 'json',
crossDomain: false,
url: globalConfig.context + '/api/admin/jtBusiness/category/list',
data: {
pageNo: 1,
pageSize: 9999,
layer: 1 //组织层级
},
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
name: thisdata.name //品类名称
});
}
}
this.setState({
dataMenu: theArr
});
}.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: 'sort',
key: 'sort'
},
{
title: '所属模块',
dataIndex: 'module',
key: 'module',
render: (text) => {
return getTypeModule(text);
}
},
{
title: '上级品类',
dataIndex: 'superName',
key: 'superName',
render: (text) => {
return text ? text : '超级品类';
}
},
{
title: '操作',
dataIndex: 'superName1',
key: 'superName1',
render: (text, recard) => {
return (
{recard.layer < 2 && (
)}
);
}
}
],
dataSource: []
};
},
//上移动
movePre(recard) {
this.setState({
loading: false
});
$.ajax({
method: 'POST',
url: globalConfig.context + '/api/admin/jtBusiness/project/moveUp',
data: {
id: recard.id
}
}).done((data) => {
if (data && data.error.length) {
message.error(data.error[0].message);
}
this.setState({ loading: false });
this.loadData(this.state.page);
});
},
//置顶
moveTop(recard) {
this.setState({
loading: false
});
$.ajax({
method: 'POST',
url: globalConfig.context + '/api/admin/jtBusiness/project/setTop',
data: {
id: recard.id
}
}).done((data) => {
if (data && data.error.length) {
message.error(data.error[0].message);
}
this.setState({ loading: false });
this.loadData(this.state.page);
});
},
componentWillMount() {
this.loadData();
this.loadMenu();
},
//新建下级
nextAdd(recard) {
this.setState({
recrdAdd: recard,
visible: true,
name: '',
addFirst: 1,
index: undefined,
appIndex: undefined,
homeIndex: undefined,
superId: recard.id,
module: recard.module ? recard.module.toString() : 'undefined'
});
},
//编辑保存
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(',');
}
let dataList = {};
if (this.state.layer == '1') {
dataList.id = this.state.id;
dataList.name = this.state.name;
dataList.summary = this.state.summary;
dataList.imgUrl = thePictureUrl.length ? thePictureUrl : '';
dataList.module = this.state.moduleNumber ? this.state.moduleNumber : '0';
dataList.nextModule = this.state.modules;
} else {
dataList.id = this.state.id;
dataList.name = this.state.name;
dataList.summary = this.state.summary;
dataList.imgUrl = thePictureUrl.length ? thePictureUrl : '';
dataList.oldSuperId = this.state.superId;
dataList.superId = this.state.superNameId;
dataList.pcIndex =this.state.index;
dataList.appIndex=this.state.appIndex;
dataList.homeIndex=this.state.homeIndex;
}
$.ajax({
method: 'post',
dataType: 'json',
crossDomain: false,
url: globalConfig.context + '/api/admin/jtBusiness/category/update',
data: dataList
}).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 = [];
let rowItem = this.state.selectedRowKeys[0];
let data = this.state.dataSource || [];
if (data.length) {
deletedIds.push(data[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[0]
}
}).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);
this.loadMenu();
}.bind(this)
);
},
addClick() {
this.state.RowData = {};
this.setState({
visible: true,
addFirst: 0,
name: '',
superId: '',
module: '1',
index: undefined,
appIndex: undefined,
homeIndex: undefined,
});
},
//新增保存
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 ? this.state.recrdAdd.layer + 1 : '1',
module: this.state.module,
pcIndex : this.state.index,
appIndex: this.state.appIndex,
homeIndex: this.state.homeIndex
}
}).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);
this.loadMenu();
}.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
modules: thisdata.module ? thisdata.module.toString() : undefined,
pictureUrl: thisdata.imgUrl
? splitUrl(thisdata.imgUrl, ',', globalConfig.avatarHost + '/upload')
: [],
number: thisdata.number,
layer: thisdata.layer,
superNameId: thisdata.superId,
index:thisdata.pcIndex ,
homeIndex:thisdata.homeIndex ,
appIndex:thisdata.appIndex,
moduleNumber: thisdata.module ? thisdata.module.toString() : undefined
});
}
}.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.moduleSearch = undefined;
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 || {};
const dataMenu = this.state.dataMenu || {};
return (
);
}
})
);
export default BusinessCategory;