import { Component } from 'react'; import PropTypes from 'prop-types'; import withWidth, { SMALL } from 'helpers/with-width'; import { Form } from 'components'; const schema = { "title": "Profile Configuration", "type": "object", "properties": { "title": { "type": "string", "title": "Title*", "required": true, "maxLength": 24 }, "msisdn": { "type": "array", "title": "", "maxItems": 2, "messages": { "maxItems": "2 MSISDN are supported" }, "items": { "type": "string", "title": "MSISDN", "maxLength": 15, "required": true, "pattern": "^\\d+$", "messages": { "pattern": "Only digits are allowed" } } }, "security": { "title": "", "type": "object", "properties": { "k": { "type": "string", "title": "Profile Key (K)*", "required": true, "pattern": "^[0-9a-fA-F\\s]+$", "messages": { "pattern": "Only hexadecimal digits are allowed" } }, "amf": { "type": "string", "title": "Authentication Management Field (AMF)*", "required": true, "pattern": "^[0-9a-fA-F\\s]+$", "messages": { "pattern": "Only hexadecimal digits are allowed" } }, "op_type": { "type": "number", "title": "USIM Type", "enum": [0, 1], "enumNames": ["OPc", "OP"], "default": 0, }, "op_value": { "type": "string", "title": "Operator Key (OPc/OP)*", "required": true, "pattern": "^[0-9a-fA-F\\s]+$", "messages": { "pattern": "Only hexadecimal digits are allowed" } }, } }, "ambr": { "type": "object", "title": "", "properties": { "downlink": { "type": "object", "title": "", "properties": { "value": { "type": "number", "title": "UE-AMBR Downlink*", "required": true, }, "unit": { "type": "number", "title": "Unit", "enum": [0, 1, 2, 3, 4], "enumNames": ["bps", "Kbps", "Mbps", "Gbps", "Tbps"], "default": 3, } } }, "uplink": { "type": "object", "title": "", "properties": { "value": { "type": "number", "title": "UE-AMBR Uplink*", "required": true, }, "unit": { "type": "number", "title": "Unit", "enum": [0, 1, 2, 3, 4], "enumNames": ["bps", "Kbps", "Mbps", "Gbps", "Tbps"], "default": 3, } } } } }, "slice": { "type": "array", "title": "Slice Configurations", "minItems": 1, "maxItems": 8, "messages": { "minItems": "At least 1 Slice is required", "maxItems": "8 Slices are supported" }, "items": { "type": "object", "properties": { "sst": { "type": "number", "title": "SST*", "enum": [ 1, 2, 3, 4 ], "required": true }, "sd": { "type": "string", "title": "SD", "pattern": "^[0-9a-fA-F]+$", "minLength": 6, "maxLength": 6, "messages": { "pattern": "Only hexadecimal digits are allowed" } }, "default_indicator": { "type": "boolean", "title": "Default S-NSSAI", }, "session": { "type": "array", "title": "Session Configurations", "minItems": 1, "maxItems": 4, "messages": { "minItems": "At least 1 Session is required", "maxItems": "4 Sessions are supported" }, "items": { "type": "object", "properties": { "name": { "type": "string", "title": "DNN/APN*", "required": true }, "type": { "type": "number", "title": "Type*", "enum": [1, 2, 3], "enumNames": ["IPv4", "IPv6", "IPv4v6"], "default": 3, }, "qos": { "type": "object", "title": "", "properties": { "index": { "type": "number", "title": "5QI/QCI*", "enum": [ 1, 2, 3, 4, 65, 66, 67, 75, 71, 72, 73, 74, 76, 5, 6, 7, 8, 9, 69, 70, 79, 80, 82, 83, 84, 85, 86 ], "default": 5, }, "arp" : { "type": "object", "title": "", "properties": { "priority_level": { "type": "number", "title": "ARP Priority Level (1-15)*", "enum": [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15], "default": 1, }, "pre_emption_capability": { "type": "number", "title": "Capability*", "enum": [1, 2], "enumNames": ["Disabled", "Enabled"], "default": 1 }, "pre_emption_vulnerability": { "type": "number", "title": "Vulnerability*", "enum": [1, 2], "enumNames": ["Disabled", "Enabled"], "default": 1 }, } } } }, "ambr": { "type": "object", "title": "", "properties": { "downlink": { "type": "object", "title": "", "properties": { "value": { "type": "number", "title": "Session-AMBR Downlink*", "default": 1, "required": true, }, "unit": { "type": "number", "title": "Unit", "enum": [0, 1, 2, 3, 4], "enumNames": ["bps", "Kbps", "Mbps", "Gbps", "Tbps"], "default": 3, } } }, "uplink": { "type": "object", "title": "", "properties": { "value": { "type": "number", "title": "Session-AMBR Uplink*", "default": 1, "required": true, }, "unit": { "type": "number", "title": "Unit", "enum": [0, 1, 2, 3, 4], "enumNames": ["bps", "Kbps", "Mbps", "Gbps", "Tbps"], "default": 3, } } } } }, "ue": { "type": "object", "title": "", "properties": { "addr": { "type": "string", "title": "UE IPv4 Address", "format" : "ipv4" }, "addr6": { "type": "string", "title": "UE IPv6 Address", "format" : "ipv6" }, } }, "smf": { "type": "object", "title": "", "properties": { "addr": { "type": "string", "title": "SMF IPv4 Address", "format" : "ipv4" }, "addr6": { "type": "string", "title": "SMF IPv6 Address", "format" : "ipv6" }, } }, "pcc_rule": { "type": "array", "title": "PCC Rules", "maxItems": 8, "messages": { "maxItems": "8 PCC Rules are supported" }, "items": { "type": "object", "properties": { "flow": { "type": "array", "title": "", "maxItems": 8, "messages": { "maxItems": "8 Flows are supported" }, "items": { "type": "object", "properties": { "direction": { "type": "number", "title": "Flow Direction*", "enum": [1, 2], "enumNames": ["Downlink", "Uplink"], "default": 1, }, "description": { "type": "string", "title": "Description*", "default": "permit out udp from any 1-65535 to 45.45.45.45", "required": true, "pattern": "^permit\\s+out", "messages": { "pattern": "Begin with reserved keyword 'permit out'." } } } } }, "qos": { "type": "object", "title": "", "properties": { "index": { "type": "number", "title": "5QI/QCI*", "enum": [ 1, 2, 3, 4, 65, 66, 67, 75, 71, 72, 73, 74, 76, 5, 6, 7, 8, 9, 69, 70, 79, 80, 82, 83, 84, 85, 86 ], "default": 1, }, "arp" : { "type": "object", "title": "", "properties": { "priority_level": { "type": "number", "title": "ARP Priority Level (1-15)*", "enum": [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15], "default": 2, }, "pre_emption_capability": { "type": "number", "title": "Capability*", "enum": [1, 2], "enumNames": ["Disabled", "Enabled"], "default": 2, }, "pre_emption_vulnerability": { "type": "number", "title": "Vulnerability*", "enum": [1, 2], "enumNames": ["Disabled", "Enabled"], "default": 2, }, } }, "mbr": { "type": "object", "title": "", "properties": { "downlink": { "type": "object", "title": "", "properties": { "value": { "type": "number", "title": "MBR Downlink", }, "unit": { "type": "number", "title": "Unit", "enum": [0, 1, 2, 3, 4], "enumNames": ["bps", "Kbps", "Mbps", "Gbps", "Tbps"], "default": 1, } } }, "uplink": { "type": "object", "title": "", "properties": { "value": { "type": "number", "title": "MBR Uplink", }, "unit": { "type": "number", "title": "Unit", "enum": [0, 1, 2, 3, 4], "enumNames": ["bps", "Kbps", "Mbps", "Gbps", "Tbps"], "default": 1, } } } } }, "gbr": { "type": "object", "title": "", "properties": { "downlink": { "type": "object", "title": "", "properties": { "value": { "type": "number", "title": "GBR Downlink", }, "unit": { "type": "number", "title": "Unit", "enum": [0, 1, 2, 3, 4], "enumNames": ["bps", "Kbps", "Mbps", "Gbps", "Tbps"], "default": 1, } } }, "uplink": { "type": "object", "title": "", "properties": { "value": { "type": "number", "title": "GBR Uplink", }, "unit": { "type": "number", "title": "Unit", "enum": [0, 1, 2, 3, 4], "enumNames": ["bps", "Kbps", "Mbps", "Gbps", "Tbps"], "default": 1, } } } } }, }, }, } } } } } } } } } } }; const uiSchema = { "title" : { classNames: "col-xs-12", }, "msisdn" : { classNames: "col-xs-7", }, "security" : { classNames: "col-xs-12", "k" : { classNames: "col-xs-7", }, "amf" : { classNames: "col-xs-5", }, "op_type" : { classNames: "col-xs-4", }, "op_value" : { classNames: "col-xs-8", }, }, "ambr" : { classNames: "col-xs-12", "downlink": { classNames: "col-xs-6", "value": { classNames: "col-xs-8", }, "unit": { classNames: "col-xs-4", }, }, "uplink": { classNames: "col-xs-6", "value": { classNames: "col-xs-8", }, "unit": { classNames: "col-xs-4", }, } }, "slice": { classNames: "col-xs-12", "items": { "sst": { classNames: "col-xs-3", "ui:widget": "radio", "ui:options": { "inline": true }, }, "sd": { classNames: "col-xs-6", }, "default_indicator": { classNames: "col-xs-3", }, "session": { classNames: "col-xs-12", "items": { "name": { classNames: "col-xs-8", }, "type": { classNames: "col-xs-4", }, "qos": { classNames: "col-xs-12", "index": { }, "arp": { "priority_level": { }, "pre_emption_capability": { classNames: "col-xs-6" }, "pre_emption_vulnerability": { classNames: "col-xs-6" } } }, "ambr" : { classNames: "col-xs-12", "downlink": { "value": { classNames: "col-xs-8" }, "unit": { classNames: "col-xs-4" }, }, "uplink": { "value": { classNames: "col-xs-8" }, "unit": { classNames: "col-xs-4" }, }, }, "ue" : { classNames: "col-xs-12", "addr" : { classNames: "col-xs-6" }, "addr6" : { classNames: "col-xs-6" }, }, "smf" : { classNames: "col-xs-12", "addr" : { classNames: "col-xs-6" }, "addr6" : { classNames: "col-xs-6" }, }, "pcc_rule": { classNames: "col-xs-12", "items": { "flow": { "items": { "direction": { }, "description": { "ui:help": "Hint: 5.4.2 Flow-Description in TS29.212", }, }, }, "qos": { "index": { }, "arp": { "priority_level": { classNames: "col-xs-12" }, "pre_emption_capability": { classNames: "col-xs-6" }, "pre_emption_vulnerability": { classNames: "col-xs-6" } }, "mbr": { "downlink": { "value": { classNames: "col-xs-8" }, "unit": { classNames: "col-xs-4" }, }, "uplink": { "value": { classNames: "col-xs-8" }, "unit": { classNames: "col-xs-4" }, } }, "gbr": { "downlink": { "value": { classNames: "col-xs-8" }, "unit": { classNames: "col-xs-4" }, }, "uplink": { "value": { classNames: "col-xs-8" }, "unit": { classNames: "col-xs-4" }, } } } } } } } } } } class Edit extends Component { static propTypes = { visible: PropTypes.bool, action: PropTypes.string, formData: PropTypes.object, isLoading: PropTypes.bool, validate: PropTypes.func, onHide: PropTypes.func, onSubmit: PropTypes.func, onError: PropTypes.func } constructor(props) { super(props); this.state = this.getStateFromProps(props); } componentWillReceiveProps(nextProps) { this.setState(this.getStateFromProps(nextProps)); } getStateFromProps(props) { const { action, width, } = props; let state = { schema, uiSchema }; if (action === 'update') { state = { ...state, uiSchema : { ...uiSchema, "title": { "ui:disabled": true } } } } else if (width !== SMALL) { state = { ...state, uiSchema : { ...uiSchema, "title": { "ui:autofocus": true } } } } return state; } render() { const { visible, action, formData, isLoading, validate, onHide, onSubmit, onError } = this.props; return (
) } } export default withWidth()(Edit);