共计 2063 个字符,预计需要花费 6 分钟才能阅读完成。
1. 新增
<Form.Item
label="会议室指引图名称"
className="panel-li-title"
labelCol={{span: 7,}}
wrapperCol={{span: 17,}}
>
{getFieldDecorator("name", {
initialValue: data.name,
rules: [
{
required: true,
message: "会议室指引图名称不为空",
},
],
})(<Input placeholder="请输出会议室指引图名称" />)}
</Form.Item>
<Form.Item
label="大厦"
className="panel-li-title"
labelCol={{span: 6,}}
wrapperCol={{span: 18,}}
>
{/* build_floor_ids 是一个数组外面蕴含着大厦 id 和楼层 id */}
{getFieldDecorator("build_floor_ids", {
initialValue: data.build_floor_ids,
rules: [
{
type: "array",
required: true,
message: "大厦不为空",
},
{validator: (rule, value, callback) => {let record = getFieldValue("build_floor_obj");
// console.error("-11--", value, record);
if (record.type === "b") {callback("未配置楼层");
}
callback();},
},
],
})(
// 新增编辑 - 大厦下拉框列表
<SearchInput
disabled={type === "edit"}
style={{width: "100%"}}
placeholder="请抉择大厦"
showSearch
// 大厦展现的 id 和名称
fieldNames={{
label: "cn_name",
value: "id",
children: "children",
}}
onChange={(value, selectedOptions) => {
// 把抉择完的大厦 - 楼层的楼层 id 给了 record,selectedOptions.length - 1 减一代表只传一个楼层 id
let record = selectedOptions[selectedOptions.length - 1];
// == b 代表 代表曾经选了楼层
if (record.type !== "b") {// console.error(record, record?.id);
// 申请接口的时候把楼层 id 给了 original_id record?.id 这种是高级写法,代表着从 record 中拿到 id
FloorguideAction.floorGuideList({original_id: record?.id,}).then((results) => {if (!results.success) {message.error(results.err_msg || "接口谬误", 0.5);
return;
}
// 最初判断有图片就展现图片没有就持续展现默认 icon
this.props.toggleBackUrl &&
this.props.toggleBackUrl(results?.data?.photo_url);
});
}
setFieldsValue({
build_floor_obj: record,
build_floor_id: record?.id,
});
}}
/>
)}
</Form.Item>
2. 编辑
state = {data: {} };
componentDidMount() {this.init();
}
init = () => {let { location = {} } = this.props;
let {query = {} } = location;
let {id} = query;
if (id) {
FloorguideAction.floorGuideMeetingFindById({id,}).then((results) => {if (!results.success) {message.error(results.err_msg || "接口谬误", 0.5);
return;
}
let {data = {} } = results;
if (_.isEmpty(data)) {return;}
this.setState({
data: {
// id,
...data,
// 这是回显的两个联动的下拉框组建的数据 大厦 id 楼层 id
build_floor_ids: [
data.build_id, // 接口获取的大厦 id
data.build_floor_id, // 接口获取的楼层 id build_floor_id
],
},
});
});
}
};
render() {let { data = {} } = this.state;
return <Add location={this.props.location} type="edit" data={data} />;
}
正文完
发表至: javascript
2021-09-06