diff --git a/code/web/client/src/sections/edition/actions/index.js b/code/web/client/src/sections/edition/actions/index.js
index de91fa9..4d6bf5c 100644
--- a/code/web/client/src/sections/edition/actions/index.js
+++ b/code/web/client/src/sections/edition/actions/index.js
@@ -71,6 +71,17 @@ export function postVersion(data) {
         });
 }
 
+export function delGateway(id) {
+    return dispatch => basicAction({
+        type: 'delete',
+        dispatch: dispatch,
+        actionType: 'DELETE_GATEWAY',
+        url: ApiTable.delGateway.replace('{id}', id),
+        msg: { option: '删除网关' },
+        reducer: { name: '' }
+    });
+}
+
 export function gatewaySsh(id) {
     return dispatch => basicAction({
         type: 'post',
@@ -109,6 +120,7 @@ export default {
     getGateways,
     getGatewayStatus,
     ableGateway,
+    delGateway,
     gatewaySsh,
     rebootGateway,
     restartGateway,
diff --git a/code/web/client/src/sections/edition/containers/gateway.jsx b/code/web/client/src/sections/edition/containers/gateway.jsx
index 51626ab..2e58e79 100644
--- a/code/web/client/src/sections/edition/containers/gateway.jsx
+++ b/code/web/client/src/sections/edition/containers/gateway.jsx
@@ -5,7 +5,7 @@ import { push } from 'react-router-redux';
 import { Popconfirm, Button, Popover, Skeleton, Table, Tag } from '@douyinfe/semi-ui';
 import { SkeletonScreen } from "$components";
 import GatewayStatusModal from './gatewayStatusModal'
-import GatewayEditModal from './gatewayEditModal'
+import GatewayModal from './gatewayModal'
 
 const GatewayManage = props => {
     const { dispatch, user, error, actions } = props
@@ -14,8 +14,9 @@ const GatewayManage = props => {
     const [tableData, setTableData] = useState([]);
     const [limits, setLimits] = useState()//每页实际条数
     const [detailV, setDetailV] = useState(false)
-    const [editV, setEditV] = useState(false)
     const [dataToModal, setDataToModal] = useState(null)
+    const [deviceModalV, setDeviceModalV] = useState(false)
+
     useEffect(() => {
         getTableData(query)
     }, [])
@@ -100,12 +101,23 @@ const GatewayManage = props => {
                     </Popconfirm>
 
                     <a style={{ ...aStyle, marginLeft: 15 }} onClick={() => {
-                        setEditV(true)
+                        setDeviceModalV(true)
                         setDataToModal(record)
                     }}>编辑</a>
-                    <a style={{ ...aStyle, marginLeft: 15 }} onClick={() => {
 
-                    }}>删除</a>
+                    <Popconfirm
+                        title="提示"
+                        content={`确认删除该网关？`}
+                        onConfirm={() => {
+                            dispatch(edition.delGateway(record.id)).then(r => {
+                                if (r.success) {
+                                    getTableData(query)
+                                }
+                            })
+                        }}>
+                        <a style={{ ...aStyle, marginLeft: 15 }}>删除</a>
+                    </Popconfirm>
+
                     <Popover key={Math.random()} content={renderPopover(record)} trigger='click' position='right'>
                         <a style={{ ...aStyle, marginLeft: 15 }}>更多...</a>
                     </Popover>
@@ -158,103 +170,105 @@ const GatewayManage = props => {
     }
 
     return (
-      <>
-       <div>
-            <video
-               id="gatewayBanner"
-               autoPlay
-               loop
-               muted
-               style={{ width: "100%", objectFit: "cover", height: 171 }}
-               src="/assets/videos/gateway_banner.mp4"
-               type="video/mp4"
-            />
-            <div style={{ position: "absolute", top: 12 }}>
-               <div
-                  style={{
-                     fontSize: 22,
-                     paddingTop: 15,
-                     marginLeft: 21,
-                  }}
-               >
-                  设备管理
-               </div>
-               <div
-                  style={{
-                     fontSize: 14,
-                     paddingTop: 18,
-                     marginLeft: 20,
-                  }}
-               >
-                  对NVR（网络硬盘录像机）设备节点的管理
-               </div>
-               <div
-                  style={{
-                     fontSize: 14,
-                     marginTop: 28,
-                     marginLeft: 21,
-                     width: 89,
-                     height: 32,
-                     lineHeight: "32px",
-                     textAlign: "center",
-                     backgroundColor: "#D9EAFF",
-                     color: "#1859C1",
-                     cursor: "pointer",
-                  }}
-                  onClick={() => {
-                     
-                  }}
-               >
-                新增设备
-               </div>
-            </div>
-         </div>
-       <div style={{ width: "100%",
-               background: "#FFFFFF",
-               borderRadius: 3,
-               padding: "8px 20px",
-               marginTop: 20,}}>
-            <Skeleton
-                loading={false}
-                active={true}
-                placeholder={SkeletonScreen()}
-            >
-                <Table
-                    columns={columns}
-                    dataSource={tableData}
-                    bordered={false}
-                    empty="暂无数据"
-                    style={{
-                        padding: "0px 20px",
-                    }}
-                    pagination={{
-                        current: query.page + 1,
-                        total: limits,
-                        showSizeChanger: true,
-                        showQuickJumper: true,
-                        showTotal: (total) => {
-                            return <span style={{ fontSize: 15 }}>{`共${Math.ceil(total / limits)}页，${total}项`}</span>
-                        },
-                        onChange: (page, pageSize) => {
-                            setQuery({ limit: pageSize, page: page - 1 });
-                            getTableData({ limit: pageSize, page: page - 1 });
-                        }
-                    }}
+        <>
+            <div>
+                <video
+                    id="gatewayBanner"
+                    autoPlay
+                    loop
+                    muted
+                    style={{ width: "100%", objectFit: "cover", height: 171 }}
+                    src="/assets/videos/gateway_banner.mp4"
+                    type="video/mp4"
                 />
-            </Skeleton>
-            {
-                detailV ? <GatewayStatusModal
-                    onCancel={() => setDetailV(false)}
-                    dataToModal={dataToModal} /> : ''
-            }
-            {
-                editV ? <GatewayEditModal
-                    onCancel={() => setEditV(false)}
-                    dataToModal={dataToModal} /> : ''
-            }
-        </div>
-      </>
-        
+                <div style={{ position: "absolute", top: 12 }}>
+                    <div
+                        style={{
+                            fontSize: 22,
+                            paddingTop: 15,
+                            marginLeft: 21,
+                        }}
+                    >
+                        设备列表
+                    </div>
+                    <div
+                        style={{
+                            fontSize: 14,
+                            paddingTop: 18,
+                            marginLeft: 20,
+                        }}
+                    >
+                        对网关设备添加、编辑、删除以及远程控制等的管理页面
+                    </div>
+                    <div
+                        style={{
+                            fontSize: 14,
+                            marginTop: 28,
+                            marginLeft: 21,
+                            width: 89,
+                            height: 32,
+                            lineHeight: "32px",
+                            textAlign: "center",
+                            backgroundColor: "#D9EAFF",
+                            color: "#1859C1",
+                            cursor: "pointer",
+                        }}
+                        onClick={() => {
+                            setDeviceModalV(true)
+                        }}
+                    >
+                        新增网关
+                    </div>
+                </div>
+            </div>
+            <div style={{
+                width: "100%",
+                background: "#FFFFFF",
+                borderRadius: 3,
+                padding: "8px 20px",
+                marginTop: 20,
+            }}>
+                <Skeleton
+                    loading={false}
+                    active={true}
+                    placeholder={SkeletonScreen()}
+                >
+                    <Table
+                        columns={columns}
+                        dataSource={tableData}
+                        bordered={false}
+                        empty="暂无数据"
+                        style={{
+                            padding: "0px 20px",
+                        }}
+                        pagination={{
+                            current: query.page + 1,
+                            total: limits,
+                            showSizeChanger: true,
+                            showQuickJumper: true,
+                            showTotal: (total) => {
+                                return <span style={{ fontSize: 15 }}>{`共${Math.ceil(total / limits)}页，${total}项`}</span>
+                            },
+                            onChange: (page, pageSize) => {
+                                setQuery({ limit: pageSize, page: page - 1 });
+                                getTableData({ limit: pageSize, page: page - 1 });
+                            }
+                        }}
+                    />
+                </Skeleton>
+                {
+                    detailV ? <GatewayStatusModal
+                        onCancel={() => setDetailV(false)}
+                        dataToModal={dataToModal} /> : ''
+                }
+                {
+                    deviceModalV ? <GatewayModal
+                        onCancel={() => setDeviceModalV(false)}
+                        dataToModal={dataToModal} /> : ''
+                }
+            </div>
+        </>
+
     );
 }
 
diff --git a/code/web/client/src/sections/edition/containers/gatewayEditModal.jsx b/code/web/client/src/sections/edition/containers/gatewayEditModal.jsx
deleted file mode 100644
index 6bd0051..0000000
--- a/code/web/client/src/sections/edition/containers/gatewayEditModal.jsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import moment from 'moment';
-import { connect } from "react-redux";
-import { Select, Modal, Form, Button } from "@douyinfe/semi-ui";
-
-const GatewayEditModal = (props) => {
-    const { dispatch, actions, user, onCancel, dataToModal } = props;
-    const { edition } = actions;
-
-    //初始化
-    useEffect(() => {
-
-    }, []);
-
-    return (
-        <Modal title={dataToModal.name}
-            visible={true} destroyOnClose onCancel={onCancel}
-            footer={[<Button onClick={onCancel}>关闭</Button>]}>
-            <div></div>
-        </Modal>
-    )
-}
-
-function mapStateToProps(state) {
-    const { auth, global } = state;
-    return {
-        user: auth.user,
-        error: auth.error,
-        actions: global.actions,
-    };
-}
-
-export default connect(mapStateToProps)(GatewayEditModal);
\ No newline at end of file
diff --git a/code/web/client/src/sections/edition/containers/gatewayModal.jsx b/code/web/client/src/sections/edition/containers/gatewayModal.jsx
new file mode 100644
index 0000000..790de5b
--- /dev/null
+++ b/code/web/client/src/sections/edition/containers/gatewayModal.jsx
@@ -0,0 +1,130 @@
+import React, { useEffect, useRef, useState } from 'react';
+import moment from 'moment';
+import { connect } from "react-redux";
+import { Select, Modal, Form, Button } from "@douyinfe/semi-ui";
+
+const GatewayModal = (props) => {
+    const { dispatch, actions, user, onCancel, dataToModal } = props;
+    const { edition } = actions;
+    const api = useRef()
+    //初始化
+    useEffect(() => {
+
+    }, []);
+
+    return (
+        <Modal
+            title={`${dataToModal ? '修改' : '新增'}网关`}
+            destroyOnClose visible={true}
+            onOk={() => {
+                api.current.validate().then(r => {
+                    // for (let key in r) {
+                    //     if (['major', 'minor', 'patch', 'build'].includes(key)) {
+                    //         r[key] = Number(r[key])
+                    //     }
+                    // }
+                    // dispatch(edition.postVersion({ ...r, createdAt: moment().format("YYYY-MM-DD HH:MM:SS") })).then(res => {
+                    //     if (res.success) {
+                    //         requestData()
+                    //         setaddVersion(false)
+                    //     }
+                    // })
+                })
+            }}
+            width={610}
+            onCancel={() => onCancel(0)}
+        >
+            {/* <Form
+                getFormApi={(formApi) => (api.current = formApi)}
+                layout="horizontal"
+                labelAlign="right"
+                labelWidth="114px"
+                style={{ display: 'flex', flexDirection: 'column' }}
+            >
+                <Form.Input
+                    field='serialNo'
+                    label='序列号'
+                    labelPosition="left"
+                    hideButtons={true}
+                    placeholder='请输入序列号'
+                    style={{ width: 200, marginBottom: 10 }}
+                    rules={[{ required: true, message: "请输入序列号" }]}
+                />
+                <Form.Input
+                    field='name'
+                    label='名称'
+                    labelPosition="left"
+                    hideButtons={true}
+                    placeholder='请输入名称'
+                    style={{ width: 200, marginBottom: 10 }}
+                    rules={[{ required: true, message: "请输入名称" }]}
+                />
+                <Form.Input
+                    field='patch'
+                    label='属性'
+                    labelPosition="left"
+                    hideButtons={true}
+                    placeholder='请输入网关属性'
+                    style={{ width: 200, marginBottom: 10 }}
+                    rules={[{ required: true, message: "请输入网关属性" }]}
+                />
+                <Form.Input
+                    field='build' label='构建号:'
+                    labelPosition="left"
+                    hideButtons={true}
+                    placeholder='请输入构建号'
+                    style={{ width: 200, marginBottom: 10 }}
+                    rules={[{ required: true, message: "请输入构建号" }, { pattern: "^[0-9]+$", message: "只能输入数字" },]}
+                />
+                <Form.Select
+                    field="type"
+                    label='Type:'
+                    labelPosition="left"
+                    placeholder='请选择类型'
+                    style={{ width: 200, marginBottom: 10 }}
+                    rules={[{ required: true, message: "请选择类型" }]}
+                >
+                    <Form.Select.Option value="beta">beta</Form.Select.Option>
+                    <Form.Select.Option value="alpha">alpha</Form.Select.Option>
+                    <Form.Select.Option value="release">release</Form.Select.Option>
+                    <Form.Select.Option value="LTS">LTS</Form.Select.Option>
+                </Form.Select>
+                <Form.Input
+                    field='imageBase'
+                    label='基础镜像地址:'
+                    labelPosition="left"
+                    placeholder='请输入基础镜像地址'
+                    style={{ width: 440, marginBottom: 10 }}
+                    rules={[{ required: true, message: "请输入基础镜像地址" }]}
+                />
+                <Form.Input
+                    field='imageVersion'
+                    label='镜像版本:'
+                    labelPosition="left"
+                    placeholder='请输入镜像版本'
+                    style={{ width: 200, marginBottom: 10 }}
+                    rules={[{ required: true, message: "请输入镜像版本" }]}
+                />
+                <Form.TextArea
+                    field='desc'
+                    label='描述:'
+                    labelPosition="left"
+                    placeholder='请输入描述'
+                    style={{ width: 440 }}
+                />
+
+            </Form> */}
+        </Modal>
+    )
+}
+
+function mapStateToProps(state) {
+    const { auth, global } = state;
+    return {
+        user: auth.user,
+        error: auth.error,
+        actions: global.actions,
+    };
+}
+
+export default connect(mapStateToProps)(GatewayModal);
\ No newline at end of file
diff --git a/code/web/client/src/utils/webapi.js b/code/web/client/src/utils/webapi.js
index 34a6fe8..c946129 100644
--- a/code/web/client/src/utils/webapi.js
+++ b/code/web/client/src/utils/webapi.js
@@ -8,6 +8,8 @@ export const ApiTable = {
     getGateways: 'v1/edges',
     ableGateway: 'v1/edge/{id}/enable',
     getGatewayStatus: 'v1/edge/{id}/metrics',
+    delGateway: 'v1/edge/{id}',
+
     gatewaySsh: 'v1/edge/{id}/ssh',
     rebootGateway: 'v1/edge/{id}/reboot',
     restartGateway: 'v1/edge/{id}/restart',