import React, { useEffect, useState } from "react";
import {
Modal,
Form,
Select,
Input,
Row,
Col,
Upload,
Transfer,
TimePicker,
DatePicker,
Checkbox,
message,
Radio,
Cascader,
} from "antd";
import ajax from "@/services";
import moment from "moment";
import { PlusOutlined } from "@ant-design/icons";
import { ImgUpload, TreeSelectGroup, SelectLntLat } from "@/components";
function AddParking(props) {
const [form] = Form.useForm();
const {
visible = false,
close = () => {},
record = {},
status = "add",
search = () => {},
} = props;
//区域的下拉数据
const [areaList, setAreaList] = useState([]);
const [fileList, setFileList] = useState(() => {
if (status === "add") return [];
else {
return [
{
uid: "-1",
name: "image.png",
status: "done",
url: record.img,
},
];
}
});
const [lngLatVisible, setLngLatVisible] = useState(false);
const [lngLat, setLngLat] = useState(() => {
if (status === "add") return [];
else {
return record.lng_lat.split(",");
}
});
//所属商户
const [getOperationName, setGetOperationName] = useState([]);
//所属商圈
const [tradingArea, setTradingArea] = useState([]);
//选择的商圈
const [targetKeys, setTargetKeys] = useState([]);
//上级路段下拉菜单
const [parentRoadList, setParentRoadList] = useState([]);
//父车场数据
const [parentRoad, setParentRoad] = useState([]);
//选择关联车场后不可选择
const [disabled, setDisabled] = useState(false);
const uploadButton = (
);
function getAreaList() {
ajax
.getAreaTree()
.then((res) => {
if (res.status === 20000) {
setAreaList(res.data);
}
})
.catch((err) => {
console.error(err);
});
}
//getParentRoadList 获取上级路段下拉
const getParentRoadList = (type) => {
ajax.getParentRoadList({ road_type: type }).then((res) => {
if (res.status === 20000) {
setParentRoadList(res.data);
}
});
};
const handleChange = ({ fileList: newFileList }) => setFileList(newFileList);
const transferChange = (nextTargetKeys) => {
setTargetKeys(nextTargetKeys);
};
function cascaderChange(value, options) {
let last = options[options.length - 1];
let res = [];
if (last.children) {
addChild(last, res);
}
res.push(last.id);
// setAreaId(res);
}
//获取所属商户
const operationName = () => {
ajax.getAllOperator().then((res) => {
if (res.status === 20000) {
setGetOperationName(res.data);
}
});
};
//获取商圈数据
const getTradingArea = () => {
ajax.getTradingArea().then((res) => {
if (res.status === 20000) {
setTradingArea(
res.data.map((item) => {
item.key = item.value;
return item;
})
);
}
});
};
const addChild = (child, res) => {
if (child.children) {
child.children.forEach((item) => {
addChild(item, res);
});
} else {
res.push(child.id);
}
};
//获取父级路段信息
const getParentRoadDetail = (id) => {
ajax.getOrpRoadInfo({ id }).then((res) => {
if (res.status === 20000) {
setParentRoad(res.data);
const {
trading_area,
operator_id,
poi,
address,
is_business,
cooperate_type,
access_type,
lng_lat,
} = res.data;
form.setFieldsValue({
trading_area,
operator_id,
poi,
address,
is_business,
cooperate_type,
access_type,
});
setLngLat(lng_lat.split(","));
}
});
};
//处理提交图片的函数
function processImgData(value) {
let data = [];
value.forEach((item) => {
if (item.response) {
data.push(item.response.data);
} else {
data.push(item.url);
}
});
return data;
}
//新增配置信息接口
function addOutSegmentRoad(params) {
ajax.addOutSegmentRoad(params).then((res) => {
if (res.status === 20000) {
message.success("添加成功");
close();
} else {
message.error(res.message);
}
});
}
//编辑配置信息接口
function editOutSegmentRoad(params) {
ajax.editOutSegmentRoad(params).then((res) => {
if (res.status === 20000) {
message.success("编辑成功");
close();
} else {
message.error(res.message);
}
});
}
//提交接口
function submit() {
form
.validateFields()
.then((values) => {
console.log(11111111,values.filings_time,values.filings_time.format('YYYY-MM-DD'),record);
let arrStr =values.area_id
let arr = arrStr[arrStr.length-1]
const params = {
...values,
img: processImgData(fileList),
lng_lat: lngLat.join(","),
open_time: [
moment(values.open_begin_time).format("HH:mm:ss"),
moment(values.open_end_time ).format("HH:mm:ss"),
// record.open_begin_time,
// record.open_end_time
],
filings_time:moment(values.filings_time).format("YY-MM-DD"),
area_id:arr
};
console.log(values);
if (status === "add") {
addOutSegmentRoad(params);
} else {
editOutSegmentRoad(params);
}
})
.catch((err) => console.error(err));
}
useEffect(() => {
getAreaList();
operationName();
getTradingArea();
}, []);
return (
);
}
export default AddParking;