free-sun
/
BorderGateway
9
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

插件

master
wenlele 2 years ago
parent
bb3a4042ca
commit
e704f80708
7 changed files with 101 additions and 49 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 37
      code/web/client/src/sections/edition/actions/index.js
  2. 4
      code/web/client/src/sections/edition/components/addModel.jsx
  3. 41
      code/web/client/src/sections/edition/components/plugInModel.jsx
  4. 12
      code/web/client/src/sections/edition/containers/administer.jsx
  5. 19
      code/web/client/src/sections/edition/containers/gateway.jsx
  6. 23
      code/web/client/src/sections/edition/containers/plugIn.jsx
  7. 6
      code/web/client/src/utils/webapi.js

37
code/web/client/src/sections/edition/actions/index.js
View File

@ -159,22 +159,46 @@ export function postAddPlugIn (id, query) {
dispatch: dispatch, dispatch: dispatch,
actionType: 'POST_ADD_PLUGIN', actionType: 'POST_ADD_PLUGIN',
url: ApiTable.postAddPlugIn.replace('{id}', id), url: ApiTable.postAddPlugIn.replace('{id}', id),
msg: { option: '获取网关插件列表' }, msg: { option: '新增网关插件' },
}); });
} }
export function delPlugIn (edgeId, id) { export function delPlugIn (edgeId, id) {
let data = ApiTable.delPlugIn.replace('{edgeId}', edgeId)
return dispatch => basicAction({ return dispatch => basicAction({
type: 'delete', type: 'delete',
dispatch: dispatch, dispatch: dispatch,
actionType: 'DELETE_GATEWAY', actionType: 'DELETE_PLUGIN',
url: ApiTable.delPlugIn.replace('{id}', id), url: data.replace('{id}', id),
msg: { option: '删除网关' }, msg: { option: '删除网关插件' },
reducer: { name: '' } reducer: { name: '' }
}); });
} }
export function getPlugInSet (edgeId, id) {
let data = ApiTable.getPlugInSet.replace('{edgeId}', edgeId)
return dispatch => basicAction({
type: 'get',
dispatch: dispatch,
actionType: 'GET_PLUGIN_SET',
url: data.replace('{id}', id),
msg: { option: '获取网关插件信息' },
});
}
export function postAlterPlugIn (edgeId, id,query) {
let data = ApiTable.postAlterPlugIn.replace('{edgeId}', edgeId)
return dispatch => basicAction({
type: 'post',
query,
dispatch: dispatch,
actionType: 'POST_ALTER_PLUGIN',
url: data.replace('{id}', id),
msg: { option: '修改网关插件' },
});
}
export default { export default {
getGateways, getGateways,
getGatewayStatus, getGatewayStatus,
@ -190,4 +214,7 @@ export default {
putedge, putedge,
getPlugInList, getPlugInList,
postAddPlugIn, postAddPlugIn,
delPlugIn,
getPlugInSet,
postAlterPlugIn,
}; };

4
code/web/client/src/sections/edition/components/addModel.jsx
View File

@ -7,7 +7,7 @@ import { IconSearch, IconHelpCircle, IconAlertCircle, IconMinusCircle, IconPlusC
import { SkeletonScreen } from "$components"; import { SkeletonScreen } from "$components";
const AddModel = props => { const AddModel = props => {
const { dispatch, user, error, actions, close, dataToModal, editionData } = props const { dispatch, user, error, actions, close, dataToModal, editionData,cancel } = props
const { edition } = actions const { edition } = actions
const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息 const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息
const [limits, setLimits] = useState()//每页实际条数 const [limits, setLimits] = useState()//每页实际条数
@ -65,7 +65,7 @@ const AddModel = props => {
}) })
}} }}
width={500} width={500}
onCancel={() => close()} onCancel={() => cancel()}
> >
<Form <Form
getFormApi={(formApi) => (api.current = formApi)} getFormApi={(formApi) => (api.current = formApi)}

41
code/web/client/src/sections/edition/components/plugInModel.jsx
View File

@ -7,22 +7,18 @@ import { IconSearch, IconHelpCircle, IconAlertCircle, IconMinusCircle, IconPlusC
import { SkeletonScreen } from "$components"; import { SkeletonScreen } from "$components";
const AddModel = props => { const AddModel = props => {
const { dispatch, user, error, actions, close, editionData, searchValue } = props const { dispatch, user, error, actions, close, editionData, searchValue, dataToModal } = props
const { edition } = actions const { edition } = actions
const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息 const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息
const [limits, setLimits] = useState()//每页实际条数 const [limits, setLimits] = useState()//每页实际条数
const [detailV, setDetailV] = useState(false) const [detailV, setDetailV] = useState(false)
const [property, setProperty] = useState([{ key: 'hb', value: 'ture' }]) const [property, setProperty] = useState([{ key: 'hb', value: 'ture' }])
const [attributeValue, setattributeValue] = useState({}) const [type, setType] = useState('group') //类型的判断
const [type, setType] = useState('groups') //类型的判断
const [isEditor, setIsEditor] = useState(false) const [isEditor, setIsEditor] = useState(false)
const [appearType, setAppearType] = useState('mqtt') const [appearType, setAppearType] = useState('mqtt')
const api = useRef() const api = useRef()
useEffect(() => { useEffect(() => {
if(editionData){
}
}, []) }, [])
@ -39,17 +35,18 @@ const AddModel = props => {
console.log(r); console.log(r);
r.ctx_res = JSON.parse(r.ctx_res) r.ctx_res = JSON.parse(r.ctx_res)
// delete r.type // delete r.type
if (dataToModal?.id) { if (editionData) {
dispatch(edition.putedge(dataToModal?.id, r)).then(res => { dispatch(edition.postAlterPlugIn(searchValue, editionData, r)).then(res => {
console.log(res) console.log(res)
if (res.success) { if (res.success) {
close() // close()
} }
}) })
} else { } else {
dispatch(edition.postAddPlugIn(searchValue, r)).then(res => {//查询网关列表 dispatch(edition.postAddPlugIn(searchValue, r)).then(res => {
if (res.success) { if (res.success) {
console.log(res); console.log(res);
close()
} }
}) })
} }
@ -83,7 +80,7 @@ const AddModel = props => {
labelPosition="left" labelPosition="left"
placeholder='请输入名称' placeholder='请输入名称'
style={{ width: 240, marginBottom: 12 }} style={{ width: 240, marginBottom: 12 }}
initValue={dataToModal?.name || ''} initValue={dataToModal?.Plugin?.name || ''}
rules={[{ required: true, message: "请输入设备名称" }]} rules={[{ required: true, message: "请输入设备名称" }]}
/> />
<Form.Select <Form.Select
@ -92,10 +89,10 @@ const AddModel = props => {
labelPosition="left" labelPosition="left"
placeholder='请选择类型' placeholder='请选择类型'
style={{ width: 240, marginBottom: 12 }} style={{ width: 240, marginBottom: 12 }}
initValue={dataToModal?.softwareVer || type} initValue={dataToModal?.Plugin?.type || type}
rules={[{ required: true, message: "请选择类型" }]} rules={[{ required: true, message: "请选择类型" }]}
> >
{[{ name: '上报', value: 'groups' }, { name: '计算', value: 'antenna' }].map(v => <Form.Select.Option key={v.value} value={v.value}>{v.name}</Form.Select.Option>)} {[{ name: '上报', value: 'group' }, { name: '计算', value: 'antenna' }].map(v => <Form.Select.Option key={v.value} value={v.value}>{v.name}</Form.Select.Option>)}
</Form.Select> </Form.Select>
<Form.TextArea <Form.TextArea
field='description' field='description'
@ -103,7 +100,7 @@ const AddModel = props => {
labelPosition="left" labelPosition="left"
placeholder='' placeholder=''
style={{ width: 300, marginBottom: 12 }} style={{ width: 300, marginBottom: 12 }}
initValue={dataToModal?.name || ''} initValue={dataToModal?.Plugin?.description || ''}
autosize autosize
rows={1} rows={1}
/> />
@ -112,9 +109,9 @@ const AddModel = props => {
label='是否启动:' label='是否启动:'
labelPosition="left" labelPosition="left"
style={{ marginBottom: 12 }} style={{ marginBottom: 12 }}
initValue={dataToModal?.name || true} initValue={dataToModal?.Plugin?.enable || true}
/> />
{type == 'groups' ? {type == 'group' ?
<> <>
<Form.Select <Form.Select
field="ctx_type" field="ctx_type"
@ -122,7 +119,7 @@ const AddModel = props => {
labelPosition="left" labelPosition="left"
placeholder='请选择上报类型' placeholder='请选择上报类型'
style={{ width: 240, marginBottom: 12 }} style={{ width: 240, marginBottom: 12 }}
initValue={'' || 'mqtt'} initValue={dataToModal?.AntennaCtx?.type || 'mqtt'}
rules={[{ required: true, message: "请选择上报类型" }]} rules={[{ required: true, message: "请选择上报类型" }]}
> >
{[{ name: 'mqtt', value: 'mqtt' }, { name: 'http', value: 'http' }, { name: 'db', value: 'db' }].map(v => <Form.Select.Option key={v.value} value={v.value}>{v.name}</Form.Select.Option>)} {[{ name: 'mqtt', value: 'mqtt' }, { name: 'http', value: 'http' }, { name: 'db', value: 'db' }].map(v => <Form.Select.Option key={v.value} value={v.value}>{v.name}</Form.Select.Option>)}
@ -133,7 +130,7 @@ const AddModel = props => {
labelPosition="left" labelPosition="left"
placeholder='请选择脚本语言' placeholder='请选择脚本语言'
style={{ width: 240, marginBottom: 12 }} style={{ width: 240, marginBottom: 12 }}
initValue={'' || 'Lua'} initValue={dataToModal?.AntennaCtx?.res_lang || 'Lua'}
rules={[{ required: true, message: "请选择脚本语言" }]} rules={[{ required: true, message: "请选择脚本语言" }]}
> >
{[{ name: 'Lua', value: 'Lua' },].map(v => <Form.Select.Option key={v.value} value={v.value}>{v.name}</Form.Select.Option>)} {[{ name: 'Lua', value: 'Lua' },].map(v => <Form.Select.Option key={v.value} value={v.value}>{v.name}</Form.Select.Option>)}
@ -144,7 +141,7 @@ const AddModel = props => {
labelPosition="left" labelPosition="left"
placeholder='请选择脚本类型' placeholder='请选择脚本类型'
style={{ width: 240, marginBottom: 12 }} style={{ width: 240, marginBottom: 12 }}
initValue={'' || 'INLINE'} initValue={dataToModal?.AntennaCtx?.res_type || 'INLINE'}
rules={[{ required: true, message: "请选择脚本类型" }]} rules={[{ required: true, message: "请选择脚本类型" }]}
> >
{[{ name: 'INLINE', value: 'INLINE' }].map(v => <Form.Select.Option key={v.value} value={v.value}>{v.name}</Form.Select.Option>)} {[{ name: 'INLINE', value: 'INLINE' }].map(v => <Form.Select.Option key={v.value} value={v.value}>{v.name}</Form.Select.Option>)}
@ -203,7 +200,7 @@ const AddModel = props => {
label={<>脚本<Button theme='borderless' type='secondary' style={{ width: 46, height: 32 }} onClick={() => setIsEditor(!isEditor)}>{isEditor ? '完成' : '编辑'}</Button></>} label={<>脚本<Button theme='borderless' type='secondary' style={{ width: 46, height: 32 }} onClick={() => setIsEditor(!isEditor)}>{isEditor ? '完成' : '编辑'}</Button></>}
labelPosition="left" labelPosition="left"
style={{ width: 300, marginBottom: 12 }} style={{ width: 300, marginBottom: 12 }}
initValue={dataToModal?.name || JSON.stringify([])} initValue={dataToModal?.AntennaCtx?.res || JSON.stringify([])}
autosize autosize
disabled={!isEditor} disabled={!isEditor}
/> />
@ -212,7 +209,7 @@ const AddModel = props => {
label='定时任务:' label='定时任务:'
labelPosition="left" labelPosition="left"
style={{ width: 180, marginBottom: 12 }} style={{ width: 180, marginBottom: 12 }}
initValue={dataToModal?.name || ''} initValue={dataToModal?.AntennaCtx?.cron || ''}
/> />
</> </>
: <> : <>
@ -223,7 +220,7 @@ const AddModel = props => {
labelPosition="left" labelPosition="left"
placeholder='' placeholder=''
style={{ width: 300, marginBottom: 12 }} style={{ width: 300, marginBottom: 12 }}
initValue={dataToModal?.name || JSON.stringify([])} initValue={JSON.stringify(dataToModal?.GroupCtx?.groups) || JSON.stringify([])}
autosize autosize
rules={[{ required: true, message: "请输入计算配置" }]} rules={[{ required: true, message: "请输入计算配置" }]}
/> />

12
code/web/client/src/sections/edition/containers/administer.jsx
View File

@ -172,7 +172,7 @@ const EditionManage = props => {
}} }}
> >
<span style={{ lineHeight: "30px" }}> <span style={{ lineHeight: "30px" }}>
共{versionList.length}个设备 共{versionList.length}个版本
</span> </span>
<Pagination <Pagination
total={versionList.length} total={versionList.length}
@ -200,7 +200,7 @@ const EditionManage = props => {
dispatch(edition.postVersion({ ...r, createdAt: moment().format("YYYY-MM-DD HH:MM:SS") })).then(res => { dispatch(edition.postVersion({ ...r, createdAt: moment().format("YYYY-MM-DD HH:MM:SS") })).then(res => {
if (res.success) { if (res.success) {
requestData() requestData()
setQuery({ limit: 10, page: 1 }) setQuery({ pageSize: 10, page: 1 })
setaddVersion(false) setaddVersion(false)
} }
}) })
@ -223,7 +223,7 @@ const EditionManage = props => {
hideButtons={true} hideButtons={true}
placeholder='请输入主版本号' placeholder='请输入主版本号'
style={{ width: 200, marginBottom: 10 }} style={{ width: 200, marginBottom: 10 }}
rules={[{ required: true, message: "请输入主版本号" }, { pattern: "^[0-9]+$", message: "只能输入数字" },]} // rules={[{ required: true, message: "请输入主版本号" }, { pattern: "^[0-9]+$", message: "只能输入数字" },]}
/> />
<Form.Input <Form.Input
field='minor' field='minor'
@ -232,7 +232,7 @@ const EditionManage = props => {
hideButtons={true} hideButtons={true}
placeholder='请输入次版本号' placeholder='请输入次版本号'
style={{ width: 200, marginBottom: 10 }} style={{ width: 200, marginBottom: 10 }}
rules={[{ required: true, message: "请输入次版本号" }, { pattern: "^[0-9]+$", message: "只能输入数字" },]} // rules={[{ required: true, message: "请输入次版本号" }, { pattern: "^[0-9]+$", message: "只能输入数字" },]}
/> />
<Form.Input <Form.Input
field='patch' field='patch'
@ -241,7 +241,7 @@ const EditionManage = props => {
hideButtons={true} hideButtons={true}
placeholder='请输入补丁版本号' placeholder='请输入补丁版本号'
style={{ width: 200, marginBottom: 10 }} style={{ width: 200, marginBottom: 10 }}
rules={[{ required: true, message: "请输入补丁版本号" }, { pattern: "^[0-9]+$", message: "只能输入数字" },]} // rules={[{ required: true, message: "请输入补丁版本号" }, { pattern: "^[0-9]+$", message: "只能输入数字" },]}
/> />
<Form.Input <Form.Input
field='build' label='构建号:' field='build' label='构建号:'
@ -249,7 +249,7 @@ const EditionManage = props => {
hideButtons={true} hideButtons={true}
placeholder='请输入构建号' placeholder='请输入构建号'
style={{ width: 200, marginBottom: 10 }} style={{ width: 200, marginBottom: 10 }}
rules={[{ required: true, message: "请输入构建号" }, { pattern: "^[0-9]+$", message: "只能输入数字" },]} // rules={[{ required: true, message: "请输入构建号" }, { pattern: "^[0-9]+$", message: "只能输入数字" },]}
/> />
<Form.Select <Form.Select
field="type" field="type"

19
code/web/client/src/sections/edition/containers/gateway.jsx
View File

@ -9,7 +9,7 @@ import GatewayStatusModal from './gatewayStatusModal'
import AddModel from '../components/addModel' import AddModel from '../components/addModel'
const GatewayManage = props => { const GatewayManage = props => {
const { dispatch, user, error, actions } = props const { dispatch, user, error, actions, history } = props
const { edition } = actions; const { edition } = actions;
const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息 const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息
const [tableData, setTableData] = useState([]); const [tableData, setTableData] = useState([]);
@ -110,7 +110,15 @@ const GatewayManage = props => {
}}> }}>
<a style={aStyle}>{record.enabled ? '禁用' : '启用'}</a> <a style={aStyle}>{record.enabled ? '禁用' : '启用'}</a>
</Popconfirm> </Popconfirm>
<a style={{ ...aStyle, marginLeft: 15 }} onClick={() => {
history.push({
pathname: '/edgeGateway/plugIn',
query: {
id: record?.id,
}
})
}}>插件</a>
<a style={{ ...aStyle, marginLeft: 15 }} onClick={() => { <a style={{ ...aStyle, marginLeft: 15 }} onClick={() => {
setAddModel(true) setAddModel(true)
setDataToModal(record || {}) setDataToModal(record || {})
@ -322,7 +330,10 @@ const GatewayManage = props => {
</div> : ""} </div> : ""}
{ {
detailV ? <GatewayStatusModal detailV ? <GatewayStatusModal
onCancel={() => setDetailV(false)} onCancel={() => {
setDetailV(false)
setDataToModal({})
}}
dataToModal={dataToModal} /> : '' dataToModal={dataToModal} /> : ''
} }
</div> </div>
@ -336,6 +347,10 @@ const GatewayManage = props => {
getTableData({ limit: 10, page: 0, name: searchValue }); getTableData({ limit: 10, page: 0, name: searchValue });
setQuery({ limit: 10, page: 0 }) setQuery({ limit: 10, page: 0 })
}} }}
cancel={() => {
setAddModel(false);
setDataToModal({})
}}
/> />
: "" : ""
} }

23
code/web/client/src/sections/edition/containers/plugIn.jsx
View File

@ -13,17 +13,19 @@ import moment from 'moment'
const PlugIn = props => { const PlugIn = props => {
console.log(props);
const { dispatch, user, error, actions } = props const { dispatch, user, error, actions } = props
const { edition } = actions; const { edition } = actions;
const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息 const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息
const [tableData, setTableData] = useState([]); const [tableData, setTableData] = useState([]);
const [limits, setLimits] = useState(0)//每页实际条数 const [limits, setLimits] = useState(0)//每页实际条数
const [detailV, setDetailV] = useState(false) const [detailV, setDetailV] = useState(false)
const [dataToModal, setDataToModal] = useState(null)
const [addModel, setAddModel] = useState(false) const [addModel, setAddModel] = useState(false)
const [editionData, setEditionData] = useState() const [editionData, setEditionData] = useState()
const [searchValue, setSearchValue] = useState('') //选择的序列号 const [searchValue, setSearchValue] = useState('') //选择的序列号
const [selectData, setSelectData] = useState([]) //序列号 const [selectData, setSelectData] = useState([]) //序列号
const [dataToModal, setDataToModal] = useState({})
const [instance, setInstance] = useState(null); const [instance, setInstance] = useState(null);
@ -41,6 +43,9 @@ const PlugIn = props => {
getTableData({ id: data[0]?.value, limit: 10, page: 0 }) getTableData({ id: data[0]?.value, limit: 10, page: 0 })
} }
}) })
if(props){
}
}, []) }, [])
@ -104,18 +109,22 @@ const PlugIn = props => {
render: (text, r) => { render: (text, r) => {
return <div style={{ width: 90 }}> return <div style={{ width: 90 }}>
<a style={{ ...aStyle, marginLeft: 15, marginRight: 15 }} onClick={() => { <a style={{ ...aStyle, marginLeft: 15, marginRight: 15 }} onClick={() => {
dispatch(edition.getPlugInSet(searchValue, r.ID)).then(res => {//查询网关列表
if (res.success) {
setDataToModal(res.payload.data)
setAddModel(true) setAddModel(true)
setEditionData(r.ID) setEditionData(r.ID)
}
})
}}>编辑</a> }}>编辑</a>
<Popconfirm <Popconfirm
title="提示" title="提示"
position='leftBottom' position='leftBottom'
content={<div style={{ width: 150 }}>确认删除该网关插件吗？</div>} content={<div style={{ width: 150 }}>确认删除该网关插件吗？</div>}
onConfirm={() => { onConfirm={() => {
dispatch(edition.getPlugInList(id, { limit, offset: limit * page })).then(res => { dispatch(edition.delPlugIn(searchValue, r.ID)).then(res => {
if (res.success) { if (res.success) {
setTableData(res.payload.data.data); getTableData({ limit: 10, page: 0, id: searchValue });
setLimits(res.payload.data.total);
} }
}) })
}}> }}>
@ -205,14 +214,14 @@ const PlugIn = props => {
> >
{selectData?.map(r => <Select.Option value={r.value} key={r.value}>{r.name}</Select.Option>)} {selectData?.map(r => <Select.Option value={r.value} key={r.value}>{r.name}</Select.Option>)}
</Select> </Select>
<Button {/* <Button
style={{ marginLeft: 20, width: 60, height: 32, borderRadius: 3, backgroundColor: '#0b57dcb3' }} style={{ marginLeft: 20, width: 60, height: 32, borderRadius: 3, backgroundColor: '#0b57dcb3' }}
theme="solid" theme="solid"
type="primary" type="primary"
onClick={() => { onClick={() => {
getTableData({ limit: 10, page: 0, name: searchValue }) getTableData({ limit: 10, page: 0, name: searchValue })
setQuery({ limit: 10, page: 0 }) setQuery({ limit: 10, page: 0 })
}}>查询</Button> }}>查询</Button> */}
</div> </div>
<Table <Table
@ -255,9 +264,11 @@ const PlugIn = props => {
<PlugInModel <PlugInModel
editionData={editionData} editionData={editionData}
searchValue={searchValue} searchValue={searchValue}
dataToModal={dataToModal}
close={() => { close={() => {
setAddModel(false); setAddModel(false);
setEditionData('') setEditionData('')
setDataToModal({})
getTableData({ limit: 10, page: 0, id: searchValue }); getTableData({ limit: 10, page: 0, id: searchValue });
setQuery({ limit: 10, page: 0 }) setQuery({ limit: 10, page: 0 })
}} }}

6
code/web/client/src/utils/webapi.js
View File

@ -20,8 +20,10 @@ export const ApiTable = {
deleteVersion: 'v1/version/{versionId}', //删除网关版本 deleteVersion: 'v1/version/{versionId}', //删除网关版本
postVersion: 'v1/version', //新增网关版本 postVersion: 'v1/version', //新增网关版本
getPlugInList: 'v1/edge/{id}/plugins', //插件列表 getPlugInList: 'v1/edge/{id}/plugins', //插件列表
postAddPlugIn:'v1/edge/{id}/plugin/new' postAddPlugIn: 'v1/edge/{id}/plugin/new', //新增插件
postAlterPlugIn:'v1/edge/{edgeId}/plugin/{id}', //修改差插件
delPlugIn: 'v1/edge/{edgeId}/plugin/{id}', //删除网关插件
getPlugInSet:'v1/edge/{edgeId}/plugin/{id}', //获取网关插件信息
}; };
export const RouteTable = { export const RouteTable = {

Write Preview
Loading…
Cancel
Save