update: 运维管理、数据采集替换组件
This commit is contained in:
jackhoo_98
parent
9212cd6a7f
commit
573ae35353
|
|
@ -1,11 +1,11 @@
|
|||
<template lang="">
|
||||
<a-modal
|
||||
<j-modal
|
||||
:title="data.id ? '编辑' : '新增'"
|
||||
:visible="true"
|
||||
width="700px"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<a-form
|
||||
<j-form
|
||||
class="form"
|
||||
layout="vertical"
|
||||
:model="formData"
|
||||
|
|
@ -14,14 +14,14 @@
|
|||
:rules="FormValidate"
|
||||
ref="formRef"
|
||||
>
|
||||
<a-form-item label="通道名称" name="name">
|
||||
<a-input
|
||||
<j-form-item label="通道名称" name="name">
|
||||
<j-input
|
||||
placeholder="请输入通道名称"
|
||||
v-model:value="formData.name"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="通讯协议" name="provider">
|
||||
<a-select
|
||||
</j-form-item>
|
||||
<j-form-item label="通讯协议" name="provider">
|
||||
<j-select
|
||||
style="width: 100%"
|
||||
v-model:value="formData.provider"
|
||||
:options="providersList"
|
||||
|
|
@ -31,8 +31,8 @@
|
|||
:filter-option="filterOption"
|
||||
:disabled="!!id"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
v-if="formData.provider === 'MODBUS_TCP'"
|
||||
:name="['configuration', 'host']"
|
||||
:rules="FormValidate.host"
|
||||
|
|
@ -40,50 +40,50 @@
|
|||
<div class="form-label">
|
||||
Modbus主机IP
|
||||
<span class="form-label-required">*</span>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>支持ipv4、ipv6、域名</p>
|
||||
</template>
|
||||
<AIcon type="QuestionCircleOutlined" />
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入Modbus主机IP"
|
||||
v-model:value="formData.configuration.host"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
v-if="formData.provider === 'MODBUS_TCP'"
|
||||
label="端口"
|
||||
:name="['configuration', 'port']"
|
||||
:rules="FormValidate.port"
|
||||
>
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
placeholder="请输入端口"
|
||||
v-model:value="formData.configuration.port"
|
||||
:min="1"
|
||||
:max="65535"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
v-if="formData.provider === 'OPC_UA'"
|
||||
label="端点url"
|
||||
:name="['configuration', 'endpoint']"
|
||||
:rules="FormValidate.endpoint"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入端点url"
|
||||
v-model:value="formData.configuration.endpoint"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
v-if="formData.provider === 'OPC_UA'"
|
||||
label="安全策略"
|
||||
:name="['configuration.securityPolicy']"
|
||||
:rules="FormValidate.securityPolicy"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
style="width: 100%"
|
||||
v-model:value="formData.configuration.securityPolicy"
|
||||
:options="Options['security-policies']"
|
||||
|
|
@ -92,14 +92,14 @@
|
|||
show-search
|
||||
:filter-option="filterOption"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
v-if="formData.provider === 'OPC_UA'"
|
||||
label="安全模式"
|
||||
:name="['configuration.securityMode']"
|
||||
:rules="FormValidate.securityMode"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
style="width: 100%"
|
||||
v-model:value="formData.configuration.securityMode"
|
||||
:options="Options['security-modes']"
|
||||
|
|
@ -108,8 +108,8 @@
|
|||
show-search
|
||||
:filter-option="filterOption"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
v-if="
|
||||
formData.configuration.securityMode === 'SignAndEncrypt' ||
|
||||
formData.configuration.securityMode === 'Sign'
|
||||
|
|
@ -118,7 +118,7 @@
|
|||
:name="['configuration.certificate']"
|
||||
:rules="FormValidate.certificate"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
style="width: 100%"
|
||||
v-model:value="formData.configuration.certificate"
|
||||
:options="certificateList"
|
||||
|
|
@ -127,8 +127,8 @@
|
|||
show-search
|
||||
:filter-option="filterOption"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
v-if="formData.provider === 'OPC_UA'"
|
||||
label="权限认证"
|
||||
:name="['configuration.authType']"
|
||||
|
|
@ -140,41 +140,41 @@
|
|||
:options="Options['auth-types']"
|
||||
v-model="formData.configuration.authType"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
v-if="formData.configuration.authType === 'username'"
|
||||
label="用户名"
|
||||
:name="['configuration.username']"
|
||||
:rules="FormValidate.username"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入用户名"
|
||||
v-model:value="formData.configuration.username"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
v-if="formData.configuration.authType === 'username'"
|
||||
label="密码"
|
||||
:name="['configuration.password']"
|
||||
:rules="FormValidate.password"
|
||||
>
|
||||
<a-input-password
|
||||
<j-input-password
|
||||
placeholder="请输入密码"
|
||||
v-model:value="formData.configuration.password"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="说明" name="description">
|
||||
<a-textarea
|
||||
</j-form-item>
|
||||
<j-form-item label="说明" name="description">
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
v-model:value="formData.description"
|
||||
:maxlength="200"
|
||||
:rows="3"
|
||||
showCount
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
<template #footer>
|
||||
<a-button key="back" @click="handleCancel">取消</a-button>
|
||||
<j-button key="back" @click="handleCancel">取消</j-button>
|
||||
<PermissionButton
|
||||
key="submit"
|
||||
type="primary"
|
||||
|
|
@ -186,7 +186,7 @@
|
|||
确认
|
||||
</PermissionButton>
|
||||
</template>
|
||||
</a-modal>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import {
|
||||
|
|
|
|||
|
|
@ -50,26 +50,26 @@
|
|||
{{ slotProps.name }}
|
||||
</PermissionButton>
|
||||
|
||||
<a-row class="card-item-content-box">
|
||||
<a-col :span="12">
|
||||
<j-row class="card-item-content-box">
|
||||
<j-col :span="12">
|
||||
<div class="card-item-content-text">
|
||||
协议
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.provider
|
||||
}}</template>
|
||||
{{ slotProps.provider }}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="card-item-content-text">
|
||||
地址
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.configuration
|
||||
.host ||
|
||||
|
|
@ -82,10 +82,10 @@
|
|||
slotProps.configuration
|
||||
.endpoint
|
||||
}}</span>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</template>
|
||||
<template #actions="item">
|
||||
|
|
|
|||
|
|
@ -1,24 +1,24 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<j-spin :spinning="loading">
|
||||
<div class="dash-board">
|
||||
<div class="header">
|
||||
<div class="left">
|
||||
<h3 style="width: 100px">点位数据量</h3>
|
||||
</div>
|
||||
<div class="right">
|
||||
<a-radio-group
|
||||
<j-radio-group
|
||||
default-value="a"
|
||||
button-style="solid"
|
||||
style="margin-right: 10px"
|
||||
v-model:value="data.time.type"
|
||||
>
|
||||
<a-radio-button value="hour">
|
||||
<j-radio-button value="hour">
|
||||
最近1小时
|
||||
</a-radio-button>
|
||||
<a-radio-button value="today"> 今日 </a-radio-button>
|
||||
<a-radio-button value="week"> 近一周 </a-radio-button>
|
||||
</a-radio-group>
|
||||
<a-range-picker
|
||||
</j-radio-button>
|
||||
<j-radio-button value="today"> 今日 </j-radio-button>
|
||||
<j-radio-button value="week"> 近一周 </j-radio-button>
|
||||
</j-radio-group>
|
||||
<j-range-picker
|
||||
:allowClear="false"
|
||||
:show-time="{ format: 'HH:mm:ss' }"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
|
|
@ -28,14 +28,14 @@
|
|||
<template #suffixIcon
|
||||
><AIcon type="CalendarOutlined"
|
||||
/></template>
|
||||
</a-range-picker>
|
||||
</j-range-picker>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div ref="chartRef" style="width: 100%; height: 350px"></div>
|
||||
</div>
|
||||
</div>
|
||||
</a-spin>
|
||||
</j-spin>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
|
|
|||
|
|
@ -4,12 +4,12 @@
|
|||
<div class="content-left">
|
||||
<div class="content-left-title">
|
||||
<span>{{ title }}</span>
|
||||
<a-tooltip placement="top" v-if="tooltip">
|
||||
<j-tooltip placement="top" v-if="tooltip">
|
||||
<template #title>
|
||||
<span>{{ tooltip }}</span>
|
||||
</template>
|
||||
<AIcon type="QuestionCircleOutlined" />
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<div class="content-left-value">{{ value }}</div>
|
||||
</div>
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
<div class="top-card-footer">
|
||||
<template v-for="(item, index) in footer" :key="index">
|
||||
<span v-if="!item.status">{{ item.title }}</span>
|
||||
<a-badge v-else :text="item.title" :status="item.status" />
|
||||
<j-badge v-else :text="item.title" :status="item.status" />
|
||||
<div class="footer-item-value">{{ item.value }}</div>
|
||||
</template>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<page-container>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="8" v-for="item in statusData" :key="item[0].type">
|
||||
<j-row :gutter="24">
|
||||
<j-col :span="8" v-for="item in statusData" :key="item[0].type">
|
||||
<TopCard
|
||||
:title="item[0].label"
|
||||
:img="
|
||||
|
|
@ -10,13 +10,13 @@
|
|||
:footer="item"
|
||||
:value="item[0].total"
|
||||
/>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="24">
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-row :gutter="24">
|
||||
<j-col :span="24">
|
||||
<Card />
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div>
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
model="TABLE"
|
||||
:columns="columns"
|
||||
|
|
@ -17,102 +17,102 @@
|
|||
}}
|
||||
</template>
|
||||
<template #responseTime="slotProps">
|
||||
<a-tag color="purple">
|
||||
<j-tag color="purple">
|
||||
{{ slotProps.responseTime - slotProps.requestTime }} ms
|
||||
</a-tag>
|
||||
</j-tag>
|
||||
</template>
|
||||
<template #username="slotProps">
|
||||
<a-tag color="geekblue">
|
||||
<j-tag color="geekblue">
|
||||
{{ slotProps.context.userName }}
|
||||
</a-tag>
|
||||
</j-tag>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<a-space :size="16">
|
||||
<a-tooltip
|
||||
<j-space :size="16">
|
||||
<j-tooltip
|
||||
v-for="i in getActions(slotProps)"
|
||||
:key="i.key"
|
||||
v-bind="i.tooltip"
|
||||
>
|
||||
<a-popconfirm v-if="i.popConfirm" v-bind="i.popConfirm">
|
||||
<a-button
|
||||
<j-popconfirm v-if="i.popConfirm" v-bind="i.popConfirm">
|
||||
<j-button
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></a-button>
|
||||
</a-popconfirm>
|
||||
<a-button
|
||||
/></j-button>
|
||||
</j-popconfirm>
|
||||
<j-button
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
v-else
|
||||
@click="i.onClick && i.onClick(slotProps)"
|
||||
>
|
||||
<a-button
|
||||
<j-button
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></a-button>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-space>
|
||||
/></j-button>
|
||||
</j-button>
|
||||
</j-tooltip>
|
||||
</j-space>
|
||||
</template>
|
||||
</JTable>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
<a-modal
|
||||
<j-modal
|
||||
:width="1100"
|
||||
v-model:visible="visible"
|
||||
title="详情"
|
||||
@ok="handleOk"
|
||||
>
|
||||
<a-descriptions :data="descriptionsData" title="" bordered :column="2">
|
||||
<a-descriptions-item label="URL">
|
||||
<j-descriptions :data="descriptionsData" title="" bordered :column="2">
|
||||
<j-descriptions-item label="URL">
|
||||
{{ descriptionsData?.url }}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="请求方法">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="请求方法">
|
||||
{{ descriptionsData?.httpMethod }}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="动作">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="动作">
|
||||
{{ descriptionsData?.action }}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="类名">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="类名">
|
||||
{{ descriptionsData?.target }}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="方法名">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="方法名">
|
||||
{{ descriptionsData?.method }}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="IP">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="IP">
|
||||
{{ descriptionsData?.ip }}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="请求时间">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="请求时间">
|
||||
{{
|
||||
moment(descriptionsData?.requestTime).format(
|
||||
'YYYY-MM-DD HH:mm:ss',
|
||||
)
|
||||
}}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="请求耗时">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="请求耗时">
|
||||
{{
|
||||
descriptionsData?.responseTime -
|
||||
descriptionsData?.requestTime +
|
||||
'ms'
|
||||
}}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="请求头" :span="2">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="请求头" :span="2">
|
||||
{{ descriptionsData?.httpHeaders }}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="请求参数" :span="2">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="请求参数" :span="2">
|
||||
{{ descriptionsData?.parameters }}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="异常信息" :span="2">
|
||||
<a-textarea
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="异常信息" :span="2">
|
||||
<j-textarea
|
||||
v-model:value="descriptionsData.exception"
|
||||
placeholder="暂无数据"
|
||||
:auto-size="{ minRows: 3, maxRows: 20 }"
|
||||
/>
|
||||
</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-modal>
|
||||
</j-descriptions-item>
|
||||
</j-descriptions>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script lang="ts" setup name="AccessLog">
|
||||
import type { ActionsType } from '@/components/Table/index.vue';
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div>
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
model="TABLE"
|
||||
:columns="columns"
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
:params="params"
|
||||
>
|
||||
<template #level="slotProps">
|
||||
<a-tag
|
||||
<j-tag
|
||||
:color="
|
||||
slotProps.level === 'WARN'
|
||||
? 'orange'
|
||||
|
|
@ -24,7 +24,7 @@
|
|||
"
|
||||
>
|
||||
{{ slotProps.level }}
|
||||
</a-tag>
|
||||
</j-tag>
|
||||
</template>
|
||||
<template #createTime="slotProps">
|
||||
{{ moment(slotProps.createTime).format('YYYY-MM-DD HH:mm:ss') }}
|
||||
|
|
@ -34,39 +34,39 @@
|
|||
</template>
|
||||
|
||||
<template #action="slotProps">
|
||||
<a-space :size="16">
|
||||
<a-tooltip
|
||||
<j-space :size="16">
|
||||
<j-tooltip
|
||||
v-for="i in getActions(slotProps)"
|
||||
:key="i.key"
|
||||
v-bind="i.tooltip"
|
||||
>
|
||||
<a-popconfirm v-if="i.popConfirm" v-bind="i.popConfirm">
|
||||
<a-button
|
||||
<j-popconfirm v-if="i.popConfirm" v-bind="i.popConfirm">
|
||||
<j-button
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></a-button>
|
||||
</a-popconfirm>
|
||||
<a-button
|
||||
/></j-button>
|
||||
</j-popconfirm>
|
||||
<j-button
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
v-else
|
||||
@click="i.onClick && i.onClick(slotProps)"
|
||||
>
|
||||
<a-button
|
||||
<j-button
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></a-button>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-space>
|
||||
/></j-button>
|
||||
</j-button>
|
||||
</j-tooltip>
|
||||
</j-space>
|
||||
</template>
|
||||
</JTable>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
<a-modal
|
||||
<j-modal
|
||||
:width="1100"
|
||||
v-model:visible="visible"
|
||||
title="详情"
|
||||
|
|
@ -82,7 +82,7 @@
|
|||
<span>{{ descriptionsData?.className }}</span>
|
||||
</div>
|
||||
<div class="mb-10">
|
||||
<a-tag
|
||||
<j-tag
|
||||
:color="
|
||||
descriptionsData?.level === 'WARN'
|
||||
? 'orange'
|
||||
|
|
@ -94,15 +94,15 @@
|
|||
"
|
||||
>
|
||||
{{ descriptionsData?.level }}
|
||||
</a-tag>
|
||||
</j-tag>
|
||||
<span>{{ descriptionsData?.message }}</span>
|
||||
</div>
|
||||
<a-textarea
|
||||
<j-textarea
|
||||
v-model:value="descriptionsData.exceptionStack"
|
||||
placeholder="暂无数据"
|
||||
:auto-size="{ minRows: 24, maxRows: 28 }"
|
||||
/>
|
||||
</a-modal>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script lang="ts" setup name="SystemLog">
|
||||
import type { ActionsType } from '@/components/Table/index.vue';
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<a-input
|
||||
<j-spin :spinning="loading">
|
||||
<j-input
|
||||
placeholder="请上传文件"
|
||||
v-model:value="fileValue"
|
||||
style="width: calc(100% - 110px)"
|
||||
:disabled="true"
|
||||
/>
|
||||
<a-upload
|
||||
<j-upload
|
||||
name="file"
|
||||
:multiple="true"
|
||||
:action="FIRMWARE_UPLOAD"
|
||||
|
|
@ -17,15 +17,15 @@
|
|||
:showUploadList="false"
|
||||
class="upload-box"
|
||||
>
|
||||
<a-button type="primary">
|
||||
<j-button type="primary">
|
||||
<div>
|
||||
<AIcon type="UploadOutlined" /><span class="upload-text"
|
||||
>上传文件</span
|
||||
>
|
||||
</div>
|
||||
</a-button>
|
||||
</a-upload>
|
||||
</a-spin>
|
||||
</j-button>
|
||||
</j-upload>
|
||||
</j-spin>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="FileUpload">
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template lang="">
|
||||
<a-modal
|
||||
<j-modal
|
||||
:title="data.id ? '编辑' : '新增'"
|
||||
ok-text="确认"
|
||||
cancel-text="取消"
|
||||
|
|
@ -9,61 +9,61 @@
|
|||
@cancel="handleCancel"
|
||||
@ok="handleOk"
|
||||
>
|
||||
<a-form
|
||||
<j-form
|
||||
class="form"
|
||||
layout="vertical"
|
||||
:model="formData"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
>
|
||||
<a-row :gutter="[24, 0]">
|
||||
<a-col :span="24">
|
||||
<a-form-item label="名称" v-bind="validateInfos.name">
|
||||
<a-input
|
||||
<j-row :gutter="[24, 0]">
|
||||
<j-col :span="24">
|
||||
<j-form-item label="名称" v-bind="validateInfos.name">
|
||||
<j-input
|
||||
placeholder="请输入名称"
|
||||
v-model:value="formData.name"
|
||||
/></a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24"
|
||||
><a-form-item
|
||||
/></j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="24"
|
||||
><j-form-item
|
||||
label="所属产品"
|
||||
v-bind="validateInfos.productId"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="formData.productId"
|
||||
:options="productOptions"
|
||||
placeholder="请选择所属产品"
|
||||
allowClear
|
||||
show-search
|
||||
:filter-option="filterOption"
|
||||
/> </a-form-item
|
||||
></a-col>
|
||||
<a-col :span="12"
|
||||
><a-form-item label="版本号" v-bind="validateInfos.version">
|
||||
<a-input
|
||||
/> </j-form-item
|
||||
></j-col>
|
||||
<j-col :span="12"
|
||||
><j-form-item label="版本号" v-bind="validateInfos.version">
|
||||
<j-input
|
||||
placeholder="请输入版本号"
|
||||
v-model:value="formData.version" /></a-form-item
|
||||
></a-col>
|
||||
<a-col :span="12"
|
||||
><a-form-item
|
||||
v-model:value="formData.version" /></j-form-item
|
||||
></j-col>
|
||||
<j-col :span="12"
|
||||
><j-form-item
|
||||
label="版本序号"
|
||||
v-bind="validateInfos.versionOrder"
|
||||
>
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
placeholder="请输入版本序号"
|
||||
style="width: 100%"
|
||||
:min="1"
|
||||
:max="99999"
|
||||
v-model:value="
|
||||
formData.versionOrder
|
||||
" /></a-form-item
|
||||
></a-col>
|
||||
<a-col :span="12"
|
||||
><a-form-item
|
||||
" /></j-form-item
|
||||
></j-col>
|
||||
<j-col :span="12"
|
||||
><j-form-item
|
||||
label="签名方式"
|
||||
v-bind="validateInfos.signMethod"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="formData.signMethod"
|
||||
:options="[
|
||||
{ label: 'MD5', value: 'md5' },
|
||||
|
|
@ -75,27 +75,27 @@
|
|||
:filter-option="filterOption"
|
||||
@change="changeSignMethod"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12"
|
||||
><a-form-item label="签名" v-bind="validateInfos.sign">
|
||||
<a-input
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="12"
|
||||
><j-form-item label="签名" v-bind="validateInfos.sign">
|
||||
<j-input
|
||||
placeholder="请输入签名"
|
||||
v-model:value="formData.sign" /></a-form-item
|
||||
></a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="固件上传" v-bind="validateInfos.url">
|
||||
v-model:value="formData.sign" /></j-form-item
|
||||
></j-col>
|
||||
<j-col :span="24">
|
||||
<j-form-item label="固件上传" v-bind="validateInfos.url">
|
||||
<FileUpload
|
||||
v-model:modelValue="formData.url"
|
||||
v-model:extraValue="extraValue"
|
||||
/> </a-form-item
|
||||
></a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item
|
||||
/> </j-form-item
|
||||
></j-col>
|
||||
<j-col :span="24">
|
||||
<j-form-item
|
||||
label="其他配置"
|
||||
v-bind="validateInfos.properties"
|
||||
>
|
||||
<a-form
|
||||
<j-form
|
||||
:class="
|
||||
dynamicValidateForm.properties.length !== 0 &&
|
||||
'formRef'
|
||||
|
|
@ -111,7 +111,7 @@
|
|||
) in dynamicValidateForm.properties"
|
||||
:key="propertie.keyid"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:label="index === 0 && 'Key'"
|
||||
class="formRef-form-item"
|
||||
:name="['properties', index, 'id']"
|
||||
|
|
@ -120,12 +120,12 @@
|
|||
message: '请输入KEY',
|
||||
}"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="propertie.id"
|
||||
placeholder="请输入KEY"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
:label="index === 0 && 'Value'"
|
||||
class="formRef-form-item"
|
||||
:name="['properties', index, 'value']"
|
||||
|
|
@ -134,51 +134,51 @@
|
|||
message: '请输入VALUE',
|
||||
}"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="propertie.value"
|
||||
placeholder="请输入VALUE"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
:label="index === 0 && '操作'"
|
||||
class="formRef-form-item"
|
||||
style="width: 10%"
|
||||
>
|
||||
<a-popconfirm
|
||||
<j-popconfirm
|
||||
title="确认删除吗？"
|
||||
ok-text="确认"
|
||||
cancel-text="取消"
|
||||
@confirm="removeUser(propertie)"
|
||||
>
|
||||
<AIcon type="DeleteOutlined" />
|
||||
</a-popconfirm>
|
||||
</a-form-item>
|
||||
</j-popconfirm>
|
||||
</j-form-item>
|
||||
</div>
|
||||
<a-form-item class="formRef-form-item-add">
|
||||
<a-button type="dashed" block @click="addUser">
|
||||
<j-form-item class="formRef-form-item-add">
|
||||
<j-button type="dashed" block @click="addUser">
|
||||
<AIcon type="PlusOutlined" />
|
||||
添加
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-form-item></a-col
|
||||
</j-button>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</j-form-item></j-col
|
||||
>
|
||||
<a-col :span="24">
|
||||
<a-form-item
|
||||
<j-col :span="24">
|
||||
<j-form-item
|
||||
label="说明"
|
||||
v-bind="validateInfos.description"
|
||||
>
|
||||
<a-textarea
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
v-model:value="formData.description"
|
||||
:maxlength="200"
|
||||
:rows="3"
|
||||
showCount
|
||||
/> </a-form-item
|
||||
></a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-modal>
|
||||
/> </j-form-item
|
||||
></j-col>
|
||||
</j-row>
|
||||
</j-form>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { message, Form } from 'ant-design-vue';
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template lang="">
|
||||
<a-modal
|
||||
<j-modal
|
||||
title="查看"
|
||||
ok-text="确认"
|
||||
cancel-text="取消"
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
@ok="handleOk"
|
||||
>
|
||||
<span>失败原因：{{ data }}</span>
|
||||
</a-modal>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script lang="ts" setup name="TaskDetailSavePage">
|
||||
const props = defineProps({
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<div class="state-content">
|
||||
<div class="state-header">
|
||||
<div class="state-title">
|
||||
<a-badge
|
||||
<j-badge
|
||||
:text="item.name"
|
||||
:color="colorMap.get(item.key)"
|
||||
/>
|
||||
|
|
@ -56,7 +56,7 @@
|
|||
</div>
|
||||
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
model="TABLE"
|
||||
:columns="columns"
|
||||
|
|
@ -78,7 +78,7 @@
|
|||
<span>{{ slotProps.productName }}</span>
|
||||
</template>
|
||||
<template #state="slotProps">
|
||||
<a-badge
|
||||
<j-badge
|
||||
:text="slotProps.state.text"
|
||||
:color="colorMap.get(slotProps.state.value)"
|
||||
/>
|
||||
|
|
@ -87,7 +87,7 @@
|
|||
<span>{{ slotProps.progress }}%</span>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<a-space>
|
||||
<j-space>
|
||||
<template
|
||||
v-for="i in getActions(slotProps)"
|
||||
:key="i.key"
|
||||
|
|
@ -108,9 +108,9 @@
|
|||
/></template>
|
||||
</PermissionButton>
|
||||
</template>
|
||||
</a-space>
|
||||
</j-space>
|
||||
</template>
|
||||
</JTable>
|
||||
</j-pro-table>
|
||||
<Save :data="current" v-if="visible" @change="saveChange" />
|
||||
</div>
|
||||
</page-container>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template lang="">
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请选择设备"
|
||||
v-model:value="checkLable"
|
||||
:disabled="true"
|
||||
|
|
@ -11,8 +11,8 @@
|
|||
@click="onVisible"
|
||||
/>
|
||||
</template>
|
||||
</a-input>
|
||||
<a-modal
|
||||
</j-input>
|
||||
<j-modal
|
||||
v-if="visible"
|
||||
title="选择设备"
|
||||
ok-text="确认"
|
||||
|
|
@ -28,7 +28,7 @@
|
|||
@search="handleSearch"
|
||||
type="simple"
|
||||
/>
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
model="TABLE"
|
||||
:columns="columns"
|
||||
|
|
@ -43,20 +43,20 @@
|
|||
:params="params"
|
||||
>
|
||||
<template #headerTitle>
|
||||
<a-checkbox
|
||||
<j-checkbox
|
||||
v-model:checked="state.checkAll"
|
||||
:indeterminate="state.indeterminate"
|
||||
@change="onCheckAllChange"
|
||||
style="margin-left: 8px"
|
||||
>
|
||||
全选
|
||||
</a-checkbox>
|
||||
</j-checkbox>
|
||||
</template>
|
||||
<template #productId="slotProps">
|
||||
<span>{{ slotProps.productName }}</span>
|
||||
</template>
|
||||
<template #state="slotProps">
|
||||
<a-badge
|
||||
<j-badge
|
||||
:text="slotProps.state?.text"
|
||||
:status="statusMap.get(slotProps.state?.value)"
|
||||
/>
|
||||
|
|
@ -69,8 +69,8 @@
|
|||
moment(slotProps.registerTime).format('YYYY-MM-DD HH:mm:ss')
|
||||
}}</span>
|
||||
</template>
|
||||
</JTable>
|
||||
</a-modal>
|
||||
</j-pro-table>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script lang="ts" setup name="SelectDevicesPage">
|
||||
import {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template lang="">
|
||||
<a-modal
|
||||
<j-modal
|
||||
:title="data.id ? '查看' : '新增' + '任务'"
|
||||
ok-text="确认"
|
||||
cancel-text="取消"
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
@cancel="handleCancel"
|
||||
@ok="handleOk"
|
||||
>
|
||||
<a-form
|
||||
<j-form
|
||||
class="form"
|
||||
layout="vertical"
|
||||
:model="formData"
|
||||
|
|
@ -18,18 +18,18 @@
|
|||
ref="formRef"
|
||||
:rules="rules"
|
||||
>
|
||||
<a-row :gutter="[24, 0]">
|
||||
<a-col :span="24">
|
||||
<a-form-item label="任务名称" name="name">
|
||||
<a-input
|
||||
<j-row :gutter="[24, 0]">
|
||||
<j-col :span="24">
|
||||
<j-form-item label="任务名称" name="name">
|
||||
<j-input
|
||||
placeholder="请输入任务名称"
|
||||
v-model:value="formData.name"
|
||||
:disabled="view"
|
||||
/></a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24"
|
||||
><a-form-item label="推送方式" name="mode">
|
||||
<a-select
|
||||
/></j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="24"
|
||||
><j-form-item label="推送方式" name="mode">
|
||||
<j-select
|
||||
v-model:value="formData.mode"
|
||||
:options="[
|
||||
{ label: '平台推送', value: 'push' },
|
||||
|
|
@ -41,14 +41,14 @@
|
|||
:filter-option="filterOption"
|
||||
@change="changeMode"
|
||||
:disabled="view"
|
||||
/> </a-form-item
|
||||
></a-col>
|
||||
<a-col :span="12" v-if="formData.mode === 'push'"
|
||||
><a-form-item
|
||||
/> </j-form-item
|
||||
></j-col>
|
||||
<j-col :span="12" v-if="formData.mode === 'push'"
|
||||
><j-form-item
|
||||
label="响应超时时间"
|
||||
name="responseTimeoutSeconds"
|
||||
>
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
placeholder="请输入响应超时时间(秒)"
|
||||
style="width: 100%"
|
||||
:min="1"
|
||||
|
|
@ -56,13 +56,13 @@
|
|||
:disabled="view"
|
||||
v-model:value="
|
||||
formData.responseTimeoutSeconds
|
||||
" /></a-form-item
|
||||
></a-col>
|
||||
<a-col
|
||||
" /></j-form-item
|
||||
></j-col>
|
||||
<j-col
|
||||
:span="formData.mode === 'push' ? 12 : 24"
|
||||
v-if="formData.mode === 'push' || formData.mode === 'pull'"
|
||||
><a-form-item label="升级超时时间" name="timeoutSeconds">
|
||||
<a-input-number
|
||||
><j-form-item label="升级超时时间" name="timeoutSeconds">
|
||||
<j-input-number
|
||||
placeholder="请输入升级超时时间(秒)"
|
||||
style="width: 100%"
|
||||
:min="1"
|
||||
|
|
@ -70,42 +70,42 @@
|
|||
:disabled="view"
|
||||
v-model:value="
|
||||
formData.timeoutSeconds
|
||||
" /></a-form-item
|
||||
></a-col>
|
||||
<a-col :span="12" v-if="!!formData.mode"
|
||||
><a-form-item label="升级设备" name="releaseType">
|
||||
<a-radio-group
|
||||
" /></j-form-item
|
||||
></j-col>
|
||||
<j-col :span="12" v-if="!!formData.mode"
|
||||
><j-form-item label="升级设备" name="releaseType">
|
||||
<j-radio-group
|
||||
v-model:value="formData.releaseType"
|
||||
button-style="solid"
|
||||
@change="changeShareCluster"
|
||||
:disabled="view"
|
||||
>
|
||||
<a-radio value="all">所有设备</a-radio>
|
||||
<a-radio value="part">选择设备</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12" v-if="formData.releaseType === 'part'">
|
||||
<a-form-item label="选择设备" name="deviceId">
|
||||
<j-radio value="all">所有设备</j-radio>
|
||||
<j-radio value="part">选择设备</j-radio>
|
||||
</j-radio-group>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="12" v-if="formData.releaseType === 'part'">
|
||||
<j-form-item label="选择设备" name="deviceId">
|
||||
<SelectDevices
|
||||
v-model:modelValue="formData.deviceId"
|
||||
:data="data"
|
||||
></SelectDevices> </a-form-item
|
||||
></a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="说明" name="description">
|
||||
<a-textarea
|
||||
></SelectDevices> </j-form-item
|
||||
></j-col>
|
||||
<j-col :span="24">
|
||||
<j-form-item label="说明" name="description">
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
v-model:value="formData.description"
|
||||
:maxlength="200"
|
||||
:rows="3"
|
||||
showCount
|
||||
:disabled="view"
|
||||
/> </a-form-item
|
||||
></a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-modal>
|
||||
/> </j-form-item
|
||||
></j-col>
|
||||
</j-row>
|
||||
</j-form>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script lang="ts" setup name="TaskPage">
|
||||
import { message } from 'ant-design-vue';
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<page-container>
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
model="TABLE"
|
||||
:columns="columns"
|
||||
|
|
@ -29,37 +29,25 @@
|
|||
<span>{{ slotProps.progress }}%</span>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<a-space :size="16">
|
||||
<a-tooltip
|
||||
v-for="i in getActions(slotProps)"
|
||||
:key="i.key"
|
||||
v-bind="i.tooltip"
|
||||
>
|
||||
<a-popconfirm v-if="i.popConfirm" v-bind="i.popConfirm">
|
||||
<a-button
|
||||
<j-space>
|
||||
<template v-for="i in getActions(slotProps)" :key="i.key">
|
||||
<PermissionButton
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
:popConfirm="i.popConfirm"
|
||||
:tooltip="{
|
||||
...i.tooltip,
|
||||
}"
|
||||
style="padding: 0px"
|
||||
@click="i.onClick"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></a-button>
|
||||
</a-popconfirm>
|
||||
<a-button
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
v-else
|
||||
@click="i.onClick && i.onClick(slotProps)"
|
||||
:hasPermission="'device/Firmware:' + i.key"
|
||||
>
|
||||
<a-button
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></a-button>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-space>
|
||||
<template #icon><AIcon :type="i.icon" /></template>
|
||||
</PermissionButton>
|
||||
</template>
|
||||
</JTable>
|
||||
</j-space>
|
||||
</template>
|
||||
</j-pro-table>
|
||||
<Save v-if="visible" :data="current" @change="saveChange" />
|
||||
</page-container>
|
||||
</template>
|
||||
|
|
@ -159,7 +147,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
|
|||
|
||||
const Actions = [
|
||||
{
|
||||
key: 'details',
|
||||
key: 'view',
|
||||
text: '详情',
|
||||
tooltip: {
|
||||
title: '详情',
|
||||
|
|
@ -170,7 +158,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
|
|||
},
|
||||
},
|
||||
{
|
||||
key: 'eye',
|
||||
key: 'view',
|
||||
text: '查看',
|
||||
tooltip: {
|
||||
title: '查看',
|
||||
|
|
@ -184,7 +172,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
|
|||
|
||||
if (stop) {
|
||||
Actions.push({
|
||||
key: 'actions',
|
||||
key: 'update',
|
||||
text: '停止',
|
||||
tooltip: {
|
||||
title: '停止',
|
||||
|
|
@ -200,7 +188,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
|
|||
});
|
||||
} else if (pause) {
|
||||
Actions.push({
|
||||
key: 'actions',
|
||||
key: 'update',
|
||||
text: '继续升级',
|
||||
tooltip: {
|
||||
title: '继续升级',
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<page-container>
|
||||
<div>
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
model="TABLE"
|
||||
:columns="columns"
|
||||
|
|
@ -33,7 +33,7 @@
|
|||
}}</span>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<a-space>
|
||||
<j-space>
|
||||
<template
|
||||
v-for="i in getActions(slotProps)"
|
||||
:key="i.key"
|
||||
|
|
@ -54,9 +54,9 @@
|
|||
/></template>
|
||||
</PermissionButton>
|
||||
</template>
|
||||
</a-space>
|
||||
</j-space>
|
||||
</template>
|
||||
</JTable>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
<Save v-if="visible" :data="current" @change="saveChange" />
|
||||
</page-container>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<page-container>
|
||||
<a-spin :spinning="loading">
|
||||
<a-card :bordered="false">
|
||||
<j-spin :spinning="loading">
|
||||
<j-card :bordered="false">
|
||||
<div v-if="type && id === ':id'">
|
||||
<Provider
|
||||
@onClick="goProviders"
|
||||
|
|
@ -38,8 +38,8 @@
|
|||
:data="data"
|
||||
/>
|
||||
</div>
|
||||
</a-card>
|
||||
</a-spin>
|
||||
</j-card>
|
||||
</j-spin>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,24 +1,24 @@
|
|||
<template>
|
||||
<a-card
|
||||
<j-card
|
||||
hoverable
|
||||
:class="['card-render', checked === data.id ? 'checked' : '']"
|
||||
@click="checkedChange(data.id)"
|
||||
>
|
||||
<div class="title">
|
||||
<a-tooltip placement="topLeft" :title="data.name">{{
|
||||
<j-tooltip placement="topLeft" :title="data.name">{{
|
||||
data.name
|
||||
}}</a-tooltip>
|
||||
}}</j-tooltip>
|
||||
</div>
|
||||
<slot name="other"></slot>
|
||||
<div class="desc">
|
||||
<a-tooltip placement="topLeft" :title="data.description">{{
|
||||
<j-tooltip placement="topLeft" :title="data.description">{{
|
||||
data.description
|
||||
}}</a-tooltip>
|
||||
}}</j-tooltip>
|
||||
</div>
|
||||
<div class="checked-icon">
|
||||
<div><CheckOutlined /></div>
|
||||
</div>
|
||||
</a-card>
|
||||
</j-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="AccessCard">
|
||||
|
|
|
|||
|
|
@ -1,18 +1,18 @@
|
|||
<template>
|
||||
<div class="container">
|
||||
<div v-if="type === 'channel'" class="card-last">
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<title-component data="基本信息" />
|
||||
<div>
|
||||
<a-form
|
||||
<j-form
|
||||
:model="formState"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
layout="vertical"
|
||||
@finish="onFinish"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="名称"
|
||||
name="name"
|
||||
:rules="[
|
||||
|
|
@ -24,21 +24,21 @@
|
|||
{ max: 64, message: '最多可输入64个字符' },
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入名称"
|
||||
v-model:value="formState.name"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="说明" name="description">
|
||||
<a-textarea
|
||||
</j-form-item>
|
||||
<j-form-item label="说明" name="description">
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
:rows="4"
|
||||
v-model:value="formState.description"
|
||||
show-count
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
</j-form-item>
|
||||
<j-form-item>
|
||||
<PermissionButton
|
||||
v-if="view === 'false'"
|
||||
type="primary"
|
||||
|
|
@ -49,11 +49,11 @@
|
|||
>
|
||||
保存
|
||||
</PermissionButton>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="config-right">
|
||||
<div class="config-right-item">
|
||||
<title-component data="配置概览" />
|
||||
|
|
@ -83,8 +83,8 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div class="container">
|
||||
<a-steps class="steps-steps" :current="stepCurrent">
|
||||
<a-step v-for="item in steps" :key="item" :title="item" />
|
||||
</a-steps>
|
||||
<j-steps class="steps-steps" :current="stepCurrent">
|
||||
<j-step v-for="item in steps" :key="item" :title="item" />
|
||||
</j-steps>
|
||||
<div class="steps-content">
|
||||
<div class="steps-box" v-if="current === 0">
|
||||
<div class="alert">
|
||||
|
|
@ -10,18 +10,18 @@
|
|||
通过CTWing平台的HTTP推送服务进行数据接入
|
||||
</div>
|
||||
<div style="margin-top: 15px">
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="16">
|
||||
<a-form
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="16">
|
||||
<j-form
|
||||
:model="formState"
|
||||
ref="formRef1"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
layout="vertical"
|
||||
>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="接口地址"
|
||||
name="apiAddress"
|
||||
:rules="[
|
||||
|
|
@ -30,16 +30,16 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
disabled
|
||||
v-model:value="
|
||||
formState.apiAddress
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="appKey"
|
||||
name="appKey"
|
||||
:rules="[
|
||||
|
|
@ -54,16 +54,16 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="formState.appKey"
|
||||
placeholder="请输入appKey"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="appSecret"
|
||||
name="appSecret"
|
||||
:rules="[
|
||||
|
|
@ -78,23 +78,23 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="
|
||||
formState.appSecret
|
||||
"
|
||||
placeholder="请输入appSecret"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12"> </a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="24">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="12"> </j-col>
|
||||
</j-row>
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="24">
|
||||
<j-form-item
|
||||
label="说明"
|
||||
name="description"
|
||||
>
|
||||
<a-textarea
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
:rows="4"
|
||||
v-model:value="
|
||||
|
|
@ -103,11 +103,11 @@
|
|||
show-count
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row> </a-form
|
||||
></a-col>
|
||||
<a-col :span="8">
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row> </j-form
|
||||
></j-col>
|
||||
<j-col :span="8">
|
||||
<div class="doc">
|
||||
<h1>操作指引：</h1>
|
||||
<div>
|
||||
|
|
@ -122,7 +122,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="image">
|
||||
<a-image width="100%" :src="img1" />
|
||||
<j-image width="100%" :src="img1" />
|
||||
</div>
|
||||
<div>
|
||||
3、IOT端创建类型为CTWing的设备接入网关
|
||||
|
|
@ -131,13 +131,13 @@
|
|||
4、IOT端创建产品，选中接入方式为CTWing,填写CTWing平台中的产品ID、Master-APIkey。
|
||||
</div>
|
||||
<div class="image">
|
||||
<a-image width="100%" :src="img2" />
|
||||
<j-image width="100%" :src="img2" />
|
||||
</div>
|
||||
<div>
|
||||
5、IOT端添加设备，为每一台设备设置唯一的IMEI（需与CTWing平台中填写的值一致）
|
||||
</div>
|
||||
<div class="image">
|
||||
<a-image width="100%" :src="img3" />
|
||||
<j-image width="100%" :src="img3" />
|
||||
</div>
|
||||
<h1>设备接入网关配置说明</h1>
|
||||
<div>
|
||||
|
|
@ -145,15 +145,15 @@
|
|||
Key和App Secret复制到当前页面
|
||||
</div>
|
||||
<div class="image">
|
||||
<a-image width="100%" :src="img4" />
|
||||
<j-image width="100%" :src="img4" />
|
||||
</div>
|
||||
<h1>其他说明</h1>
|
||||
<div>
|
||||
1.在IOT端启用设备时，若CTWing平台没有与之对应的设备，则将在CTWing端自动创建新设备
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -164,7 +164,7 @@
|
|||
只能选择HTTP通信方式的协议
|
||||
</div>
|
||||
<div class="search">
|
||||
<a-input-search
|
||||
<j-input-search
|
||||
allowClear
|
||||
placeholder="请输入"
|
||||
style="width: 300px"
|
||||
|
|
@ -180,8 +180,8 @@
|
|||
</PermissionButton>
|
||||
</div>
|
||||
<div class="card-item">
|
||||
<a-row :gutter="[24, 24]" v-if="procotolList.length > 0">
|
||||
<a-col
|
||||
<j-row :gutter="[24, 24]" v-if="procotolList.length > 0">
|
||||
<j-col
|
||||
:span="8"
|
||||
v-for="item in procotolList"
|
||||
:key="item.id"
|
||||
|
|
@ -192,25 +192,25 @@
|
|||
:data="item"
|
||||
>
|
||||
</access-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-empty v-else description="暂无数据" />
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-empty v-else description="暂无数据" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="current === 2" class="card-last">
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<title-component data="基本信息" />
|
||||
<div>
|
||||
<a-form
|
||||
<j-form
|
||||
:model="formData"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
layout="vertical"
|
||||
ref="formRef2"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="名称"
|
||||
name="name"
|
||||
:rules="[
|
||||
|
|
@ -222,24 +222,24 @@
|
|||
{ max: 64, message: '最多可输入64个字符' },
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入名称"
|
||||
v-model:value="formData.name"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="说明" name="description">
|
||||
<a-textarea
|
||||
</j-form-item>
|
||||
<j-form-item label="说明" name="description">
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
:rows="4"
|
||||
v-model:value="formData.description"
|
||||
show-count
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="config-right">
|
||||
<div class="config-right-item">
|
||||
<title-component data="配置概览" />
|
||||
|
|
@ -275,18 +275,18 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
<div :class="current !== 2 ? 'steps-action' : 'steps-action-save'">
|
||||
<a-button
|
||||
<j-button
|
||||
v-if="[0, 1].includes(current)"
|
||||
type="primary"
|
||||
style="margin-right: 8px"
|
||||
@click="next"
|
||||
>
|
||||
下一步
|
||||
</a-button>
|
||||
</j-button>
|
||||
<PermissionButton
|
||||
v-if="current === 2 && view === 'false'"
|
||||
type="primary"
|
||||
|
|
@ -298,7 +298,7 @@
|
|||
>
|
||||
保存
|
||||
</PermissionButton>
|
||||
<a-button v-if="current > 0" @click="prev"> 上一步 </a-button>
|
||||
<j-button v-if="current > 0" @click="prev"> 上一步 </j-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div class="container">
|
||||
<a-steps class="steps-steps" :current="stepCurrent">
|
||||
<a-step v-for="item in steps" :key="item" :title="item" />
|
||||
</a-steps>
|
||||
<j-steps class="steps-steps" :current="stepCurrent">
|
||||
<j-step v-for="item in steps" :key="item" :title="item" />
|
||||
</j-steps>
|
||||
<div class="steps-content">
|
||||
<div class="steps-box" v-if="current === 0">
|
||||
<div class="alert">
|
||||
|
|
@ -10,18 +10,18 @@
|
|||
通过OneNet平台的HTTP推送服务进行数据接入
|
||||
</div>
|
||||
<div style="margin-top: 15px">
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="16">
|
||||
<a-form
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="16">
|
||||
<j-form
|
||||
:model="formState"
|
||||
ref="formRef1"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
layout="vertical"
|
||||
>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="24">
|
||||
<a-form-item
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="24">
|
||||
<j-form-item
|
||||
name="apiAddress"
|
||||
:rules="[
|
||||
{
|
||||
|
|
@ -35,7 +35,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
同步物联网平台设备数据到OneNet
|
||||
|
|
@ -44,20 +44,20 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
<j-input
|
||||
disabled
|
||||
v-model:value="
|
||||
formState.apiAddress
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="24">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="24">
|
||||
<j-form-item
|
||||
label="apiKey"
|
||||
name="apiKey"
|
||||
:rules="[
|
||||
|
|
@ -72,16 +72,16 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="formState.apiKey"
|
||||
placeholder="请输入apiKey"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
name="validateToken"
|
||||
:rules="[
|
||||
{
|
||||
|
|
@ -101,7 +101,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
接收OneNet推送的Token地址
|
||||
|
|
@ -110,18 +110,18 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="
|
||||
formState.validateToken
|
||||
"
|
||||
placeholder="请输入通知Token"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
name="aesKey"
|
||||
:rules="[
|
||||
{
|
||||
|
|
@ -133,7 +133,7 @@
|
|||
>
|
||||
<div class="form-label">
|
||||
aesKey
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
OneNet
|
||||
|
|
@ -143,21 +143,21 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="formState.aesKey"
|
||||
placeholder="请输入aesKey"
|
||||
/> </a-form-item
|
||||
></a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="24">
|
||||
<a-form-item
|
||||
/> </j-form-item
|
||||
></j-col>
|
||||
</j-row>
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="24">
|
||||
<j-form-item
|
||||
label="说明"
|
||||
name="description"
|
||||
>
|
||||
<a-textarea
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
:rows="4"
|
||||
v-model:value="
|
||||
|
|
@ -166,11 +166,11 @@
|
|||
show-count
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row> </a-form
|
||||
></a-col>
|
||||
<a-col :span="8">
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row> </j-form
|
||||
></j-col>
|
||||
<j-col :span="8">
|
||||
<div class="doc">
|
||||
<h1>操作指引：</h1>
|
||||
<div>
|
||||
|
|
@ -183,76 +183,76 @@
|
|||
3、IOT端创建产品，选中接入方式为OneNet类型的设备接入网关，填写Master-APIkey（OneNet端的产品Key）
|
||||
</div>
|
||||
<div class="image">
|
||||
<a-image width="100%" :src="img5" />
|
||||
<j-image width="100%" :src="img5" />
|
||||
</div>
|
||||
<div>
|
||||
4、IOT端添加设备，在设备实例页面为每一台设备设置唯一的IMEI、IMSI码（需与OneNet平台中的值一致）
|
||||
</div>
|
||||
<div class="image">
|
||||
<a-image width="100%" :src="img6" />
|
||||
<j-image width="100%" :src="img6" />
|
||||
</div>
|
||||
<h1>HTTP推送配置说明</h1>
|
||||
<div class="image">
|
||||
<a-image width="100%" :src="img" />
|
||||
<j-image width="100%" :src="img" />
|
||||
</div>
|
||||
<div>
|
||||
HTTP推送配置路径：应用开发>数据推送
|
||||
</div>
|
||||
<a-descriptions
|
||||
<j-descriptions
|
||||
bordered
|
||||
size="small"
|
||||
:column="1"
|
||||
:labelStyle="{ width: '100px' }"
|
||||
>
|
||||
<a-descriptions-item label="参数"
|
||||
>说明</a-descriptions-item
|
||||
<j-descriptions-item label="参数"
|
||||
>说明</j-descriptions-item
|
||||
>
|
||||
<a-descriptions-item label="实例名称"
|
||||
>推送实例的名称</a-descriptions-item
|
||||
<j-descriptions-item label="实例名称"
|
||||
>推送实例的名称</j-descriptions-item
|
||||
>
|
||||
<a-descriptions-item label="推送地址">
|
||||
<j-descriptions-item label="推送地址">
|
||||
用于接收OneNet推送设备数据的地址物联网平台地址:
|
||||
<div style="word-wrap: break-word">
|
||||
{{
|
||||
`${origin}/api/one-net/${randomString()}/notify`
|
||||
}}
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="Token">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="Token">
|
||||
自定义token,可用于验证请求是否来自OneNet
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="消息加密">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="消息加密">
|
||||
采用AES加密算法对推送的数据进行数据加密，AesKey为加密秘钥
|
||||
</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</j-descriptions-item>
|
||||
</j-descriptions>
|
||||
|
||||
<h1>设备接入网关配置说明</h1>
|
||||
<a-descriptions
|
||||
<j-descriptions
|
||||
bordered
|
||||
size="small"
|
||||
:column="1"
|
||||
:labelStyle="{ width: '100px' }"
|
||||
>
|
||||
<a-descriptions-item label="参数"
|
||||
>说明</a-descriptions-item
|
||||
<j-descriptions-item label="参数"
|
||||
>说明</j-descriptions-item
|
||||
>
|
||||
<a-descriptions-item label="apiKey"
|
||||
>OneNet平台中具体产品的Key</a-descriptions-item
|
||||
<j-descriptions-item label="apiKey"
|
||||
>OneNet平台中具体产品的Key</j-descriptions-item
|
||||
>
|
||||
<a-descriptions-item label="通知Token">
|
||||
<j-descriptions-item label="通知Token">
|
||||
填写OneNet数据推送配置中设置的Token
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="aesKey">
|
||||
</j-descriptions-item>
|
||||
<j-descriptions-item label="aesKey">
|
||||
若OneNet数据推送配置了消息加密，此处填写OneNet端数据推送配置中设置的aesKey
|
||||
</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</j-descriptions-item>
|
||||
</j-descriptions>
|
||||
<h1>其他说明</h1>
|
||||
<div>
|
||||
1.在IOT端启用设备时，若OneNet平台没有与之对应的设备，则将在OneNet端自动创建新设备
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -263,7 +263,7 @@
|
|||
只能选择HTTP通信方式的协议
|
||||
</div>
|
||||
<div class="search">
|
||||
<a-input-search
|
||||
<j-input-search
|
||||
allowClear
|
||||
placeholder="请输入"
|
||||
style="width: 300px"
|
||||
|
|
@ -279,8 +279,8 @@
|
|||
</PermissionButton>
|
||||
</div>
|
||||
<div class="card-item">
|
||||
<a-row :gutter="[24, 24]" v-if="procotolList.length > 0">
|
||||
<a-col
|
||||
<j-row :gutter="[24, 24]" v-if="procotolList.length > 0">
|
||||
<j-col
|
||||
:span="8"
|
||||
v-for="item in procotolList"
|
||||
:key="item.id"
|
||||
|
|
@ -291,25 +291,25 @@
|
|||
:data="item"
|
||||
>
|
||||
</access-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-empty v-else description="暂无数据" />
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-empty v-else description="暂无数据" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="current === 2" class="card-last">
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<title-component data="基本信息" />
|
||||
<div>
|
||||
<a-form
|
||||
<j-form
|
||||
:model="formData"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
layout="vertical"
|
||||
ref="formRef2"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="名称"
|
||||
name="name"
|
||||
:rules="[
|
||||
|
|
@ -321,24 +321,24 @@
|
|||
{ max: 64, message: '最多可输入64个字符' },
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入名称"
|
||||
v-model:value="formData.name"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="说明" name="description">
|
||||
<a-textarea
|
||||
</j-form-item>
|
||||
<j-form-item label="说明" name="description">
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
:rows="4"
|
||||
v-model:value="formData.description"
|
||||
show-count
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="config-right">
|
||||
<div class="config-right-item">
|
||||
<title-component data="配置概览" />
|
||||
|
|
@ -374,18 +374,18 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
<div :class="current !== 2 ? 'steps-action' : 'steps-action-save'">
|
||||
<a-button
|
||||
<j-button
|
||||
v-if="[0, 1].includes(current)"
|
||||
type="primary"
|
||||
style="margin-right: 8px"
|
||||
@click="next"
|
||||
>
|
||||
下一步
|
||||
</a-button>
|
||||
</j-button>
|
||||
<PermissionButton
|
||||
style="margin-right: 8px"
|
||||
v-if="current === 2 && view === 'false'"
|
||||
|
|
@ -397,7 +397,7 @@
|
|||
>
|
||||
保存
|
||||
</PermissionButton>
|
||||
<a-button v-if="current > 0" @click="prev"> 上一步 </a-button>
|
||||
<j-button v-if="current > 0" @click="prev"> 上一步 </j-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<div v-if="type === 'edge'" class="container">
|
||||
<a-steps
|
||||
<j-steps
|
||||
v-if="channel !== 'edge-child-device'"
|
||||
class="steps-steps"
|
||||
:current="stepCurrent"
|
||||
>
|
||||
<a-step v-for="item in steps" :key="item" :title="item" />
|
||||
</a-steps>
|
||||
<j-step v-for="item in steps" :key="item" :title="item" />
|
||||
</j-steps>
|
||||
<div v-if="channel !== 'edge-child-device'" class="steps-content">
|
||||
<div class="steps-box" v-if="current === 0">
|
||||
<div class="alert">
|
||||
|
|
@ -14,7 +14,7 @@
|
|||
选择与设备通信的网络组件
|
||||
</div>
|
||||
<div class="search">
|
||||
<a-input-search
|
||||
<j-input-search
|
||||
allowClear
|
||||
placeholder="请输入"
|
||||
style="width: 300px"
|
||||
|
|
@ -30,8 +30,8 @@
|
|||
</PermissionButton>
|
||||
</div>
|
||||
<div class="card-item">
|
||||
<a-row :gutter="[24, 24]" v-if="networkList.length > 0">
|
||||
<a-col
|
||||
<j-row :gutter="[24, 24]" v-if="networkList.length > 0">
|
||||
<j-col
|
||||
:span="8"
|
||||
v-for="item in networkList"
|
||||
:key="item.id"
|
||||
|
|
@ -48,7 +48,7 @@
|
|||
>
|
||||
<template #other>
|
||||
<div class="other">
|
||||
<a-tooltip placement="topLeft">
|
||||
<j-tooltip placement="topLeft">
|
||||
<div
|
||||
v-if="
|
||||
(item.addresses || [])
|
||||
|
|
@ -61,7 +61,7 @@
|
|||
:key="i.address"
|
||||
class="item"
|
||||
>
|
||||
<a-badge
|
||||
<j-badge
|
||||
:color="
|
||||
i.health === -1
|
||||
? 'red'
|
||||
|
|
@ -77,7 +77,7 @@
|
|||
:key="i.address"
|
||||
class="item"
|
||||
>
|
||||
<a-badge
|
||||
<j-badge
|
||||
:color="
|
||||
i.health === -1
|
||||
? 'red'
|
||||
|
|
@ -93,13 +93,13 @@
|
|||
>...</span
|
||||
>
|
||||
</div>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
</access-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-empty v-else description="暂无数据" />
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-empty v-else description="暂无数据" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -107,10 +107,10 @@
|
|||
v-if="channel === 'edge-child-device' || current === 1"
|
||||
class="card-last"
|
||||
>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<title-component data="基本信息" />
|
||||
<a-form
|
||||
<j-form
|
||||
:model="formState"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
|
|
@ -118,7 +118,7 @@
|
|||
@finish="onFinish"
|
||||
ref="formRef"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="名称"
|
||||
name="name"
|
||||
:rules="[
|
||||
|
|
@ -130,21 +130,21 @@
|
|||
{ max: 64, message: '最多可输入64个字符' },
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入名称"
|
||||
v-model:value="formState.name"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="说明" name="description">
|
||||
<a-textarea
|
||||
</j-form-item>
|
||||
<j-form-item label="说明" name="description">
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
:rows="4"
|
||||
v-model:value="formState.description"
|
||||
show-count
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
</j-form-item>
|
||||
<j-form-item>
|
||||
<PermissionButton
|
||||
v-if="current !== 1 && view === 'false'"
|
||||
type="primary"
|
||||
|
|
@ -155,10 +155,10 @@
|
|||
>
|
||||
保存
|
||||
</PermissionButton>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="config-right">
|
||||
<div class="config-right-item">
|
||||
<title-component data="配置概览" />
|
||||
|
|
@ -173,20 +173,20 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
<div
|
||||
v-if="channel !== 'edge-child-device'"
|
||||
:class="current !== 1 ? 'steps-action' : 'steps-action-save'"
|
||||
>
|
||||
<a-button
|
||||
<j-button
|
||||
v-if="[0].includes(current)"
|
||||
style="margin-right: 8px"
|
||||
@click="next"
|
||||
>
|
||||
下一步
|
||||
</a-button>
|
||||
</j-button>
|
||||
<PermissionButton
|
||||
v-if="current === 1 && view === 'false'"
|
||||
type="primary"
|
||||
|
|
@ -198,7 +198,7 @@
|
|||
>
|
||||
保存
|
||||
</PermissionButton>
|
||||
<a-button v-if="current > 0" @click="prev"> 上一步 </a-button>
|
||||
<j-button v-if="current > 0" @click="prev"> 上一步 </j-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div style="margin-top: 10px">
|
||||
<a-steps :current="stepCurrent">
|
||||
<a-step v-for="item in steps" :key="item" :title="item" />
|
||||
</a-steps>
|
||||
<j-steps :current="stepCurrent">
|
||||
<j-step v-for="item in steps" :key="item" :title="item" />
|
||||
</j-steps>
|
||||
<div class="steps-content">
|
||||
<div class="steps-box" v-if="current === 0">
|
||||
<div class="alert">
|
||||
|
|
@ -10,16 +10,16 @@
|
|||
配置设备信令参数
|
||||
</div>
|
||||
<div>
|
||||
<a-form
|
||||
<j-form
|
||||
:model="formState"
|
||||
ref="formRef1"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
layout="vertical"
|
||||
>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="SIP 域"
|
||||
name="domain"
|
||||
:rules="[
|
||||
|
|
@ -33,14 +33,14 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="formState.domain"
|
||||
placeholder="请输入SIP 域"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="SIP ID"
|
||||
name="sipId"
|
||||
:rules="[
|
||||
|
|
@ -54,15 +54,15 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="formState.sipId"
|
||||
placeholder="请输入SIP ID"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
name="shareCluster"
|
||||
:rules="[
|
||||
{
|
||||
|
|
@ -76,7 +76,7 @@
|
|||
<span style="color: red; margin: 0 4px 0 -2px"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
共享配置:集群下所有节点共用同一配置
|
||||
|
|
@ -86,20 +86,20 @@
|
|||
</p>
|
||||
</template>
|
||||
<AIcon type="QuestionCircleOutlined" />
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
|
||||
<a-radio-group
|
||||
<j-radio-group
|
||||
v-model:value="formState.shareCluster"
|
||||
>
|
||||
<a-radio :value="true">共享配置</a-radio>
|
||||
<a-radio :value="false">独立配置</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<j-radio :value="true">共享配置</j-radio>
|
||||
<j-radio :value="false">独立配置</j-radio>
|
||||
</j-radio-group>
|
||||
</j-form-item>
|
||||
<div v-if="formState.shareCluster" class="form-item1">
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="6">
|
||||
<a-form-item
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="6">
|
||||
<j-form-item
|
||||
label="SIP 地址"
|
||||
:name="['hostPort', 'host']"
|
||||
:rules="[
|
||||
|
|
@ -109,7 +109,7 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="
|
||||
formState.hostPort.host
|
||||
"
|
||||
|
|
@ -118,14 +118,14 @@
|
|||
show-search
|
||||
:filter-option="filterOption"
|
||||
>
|
||||
<a-select-option value="0.0.0.0"
|
||||
>0.0.0.0</a-select-option
|
||||
<j-select-option value="0.0.0.0"
|
||||
>0.0.0.0</j-select-option
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-form-item
|
||||
</j-select>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="6">
|
||||
<j-form-item
|
||||
:name="['hostPort', 'port']"
|
||||
:rules="[
|
||||
{
|
||||
|
|
@ -136,7 +136,7 @@
|
|||
>
|
||||
<div class="form-label"></div>
|
||||
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="
|
||||
formState.hostPort.port
|
||||
"
|
||||
|
|
@ -146,10 +146,10 @@
|
|||
show-search
|
||||
:filter-option="filterOption"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="6">
|
||||
<j-form-item
|
||||
label="公网 Host"
|
||||
:name="['hostPort', 'publicHost']"
|
||||
:rules="[
|
||||
|
|
@ -164,17 +164,17 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
style="width: 105%"
|
||||
v-model:value="
|
||||
formState.hostPort.publicHost
|
||||
"
|
||||
placeholder="请输入IP地址"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="6">
|
||||
<j-form-item
|
||||
:name="['hostPort', 'publicPort']"
|
||||
:rules="[
|
||||
{
|
||||
|
|
@ -185,7 +185,7 @@
|
|||
>
|
||||
<div class="form-label"></div>
|
||||
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
placeholder="请输入端口"
|
||||
v-model:value="
|
||||
|
|
@ -194,13 +194,13 @@
|
|||
:min="1"
|
||||
:max="65535"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</a-form>
|
||||
</j-form>
|
||||
<div v-if="!formState.shareCluster">
|
||||
<a-form
|
||||
<j-form
|
||||
ref="formRef2"
|
||||
layout="vertical"
|
||||
name="dynamic_form_nest_item"
|
||||
|
|
@ -212,17 +212,17 @@
|
|||
) in dynamicValidateForm.cluster"
|
||||
:key="cluster.id"
|
||||
>
|
||||
<a-collapse v-model:activeKey="activeKey">
|
||||
<a-collapse-panel
|
||||
<j-collapse v-model:activeKey="activeKey">
|
||||
<j-collapse-panel
|
||||
:key="cluster.id"
|
||||
:header="`#${index + 1}.节点`"
|
||||
>
|
||||
<template #extra>
|
||||
<AIcon type="DeleteOutlined" />
|
||||
</template>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="8">
|
||||
<a-form-item
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="8">
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -232,7 +232,7 @@
|
|||
<div class="form-label">
|
||||
节点名称
|
||||
</div>
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="
|
||||
cluster.clusterNodeId
|
||||
"
|
||||
|
|
@ -244,11 +244,11 @@
|
|||
filterOption
|
||||
"
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<a-form-item
|
||||
</j-select>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="4">
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -266,7 +266,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
绑定到服务器上的网卡地址,绑定到所有网卡:0.0.0.0
|
||||
|
|
@ -275,10 +275,10 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="
|
||||
cluster.host
|
||||
"
|
||||
|
|
@ -296,11 +296,11 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<a-form-item
|
||||
</j-select>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="4">
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -314,7 +314,7 @@
|
|||
<div
|
||||
class="form-label"
|
||||
></div>
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="
|
||||
cluster.port
|
||||
"
|
||||
|
|
@ -328,10 +328,10 @@
|
|||
filterOption
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="4">
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -357,7 +357,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
监听指定端口的请求
|
||||
|
|
@ -366,9 +366,9 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
<j-input
|
||||
style="width: 110%"
|
||||
v-model:value="
|
||||
cluster.publicHost
|
||||
|
|
@ -376,10 +376,10 @@
|
|||
placeholder="请输入IP地址"
|
||||
allowClear
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="4">
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -397,7 +397,7 @@
|
|||
class="form-label"
|
||||
></div>
|
||||
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
placeholder="请输入端口"
|
||||
v-model:value="
|
||||
|
|
@ -406,14 +406,14 @@
|
|||
:min="1"
|
||||
:max="65535"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-collapse-panel>
|
||||
</a-collapse>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</j-collapse-panel>
|
||||
</j-collapse>
|
||||
</div>
|
||||
<a-form-item>
|
||||
<a-button
|
||||
<j-form-item>
|
||||
<j-button
|
||||
style="margin-top: 10px"
|
||||
type="dashed"
|
||||
block
|
||||
|
|
@ -421,9 +421,9 @@
|
|||
>
|
||||
<AIcon type="PlusOutlined" />
|
||||
新增
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-button>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -434,38 +434,38 @@
|
|||
clientHeight > 900 ? 750 : clientHeight * 0.7
|
||||
}px`"
|
||||
>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<title-component data="基本信息" />
|
||||
<div>
|
||||
<a-form :model="formData" layout="vertical">
|
||||
<a-form-item
|
||||
<j-form :model="formData" layout="vertical">
|
||||
<j-form-item
|
||||
label="名称"
|
||||
v-bind="validateInfos.name"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="formData.name"
|
||||
allowClear
|
||||
placeholder="请输入名称"
|
||||
/>
|
||||
</a-form-item>
|
||||
</j-form-item>
|
||||
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="说明"
|
||||
v-bind="validateInfos.description"
|
||||
>
|
||||
<a-textarea
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
:rows="4"
|
||||
v-model:value="formData.description"
|
||||
show-count
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="config-right">
|
||||
<div class="config-right-item">
|
||||
<div class="config-right-item-title">
|
||||
|
|
@ -491,19 +491,19 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="steps-action">
|
||||
<a-button
|
||||
<j-button
|
||||
v-if="[0].includes(current)"
|
||||
style="margin-right: 8px"
|
||||
@click="next"
|
||||
>
|
||||
下一步
|
||||
</a-button>
|
||||
</j-button>
|
||||
<PermissionButton
|
||||
v-if="current === 1 && view === 'false'"
|
||||
type="primary"
|
||||
|
|
@ -515,7 +515,7 @@
|
|||
>
|
||||
保存
|
||||
</PermissionButton>
|
||||
<a-button v-if="current > 0" @click="prev"> 上一步 </a-button>
|
||||
<j-button v-if="current > 0" @click="prev"> 上一步 </j-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,18 +1,18 @@
|
|||
<template>
|
||||
<div class="container">
|
||||
<div v-if="channel === 'fixed-media'" class="card-last">
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<title-component data="基本信息" />
|
||||
<div>
|
||||
<a-form
|
||||
<j-form
|
||||
:model="formState"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
layout="vertical"
|
||||
@finish="onFinish"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="名称"
|
||||
name="name"
|
||||
:rules="[
|
||||
|
|
@ -24,21 +24,21 @@
|
|||
{ max: 64, message: '最多可输入64个字符' },
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入名称"
|
||||
v-model:value="formState.name"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="说明" name="description">
|
||||
<a-textarea
|
||||
</j-form-item>
|
||||
<j-form-item label="说明" name="description">
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
:rows="4"
|
||||
v-model:value="formState.description"
|
||||
show-count
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
</j-form-item>
|
||||
<j-form-item>
|
||||
<PermissionButton
|
||||
v-if="view === 'false'"
|
||||
type="primary"
|
||||
|
|
@ -49,11 +49,11 @@
|
|||
>
|
||||
保存
|
||||
</PermissionButton>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="config-right">
|
||||
<div class="config-right-item">
|
||||
<div class="config-right-item-title">接入方式</div>
|
||||
|
|
@ -75,8 +75,8 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
<div v-else-if="channel === 'gb28181'">
|
||||
<GB28181 :provider="props.provider" :data="props.data"></GB28181>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div>
|
||||
<a-steps :current="stepCurrent">
|
||||
<a-step v-for="item in steps" :key="item" :title="item" />
|
||||
</a-steps>
|
||||
<j-steps :current="stepCurrent">
|
||||
<j-step v-for="item in steps" :key="item" :title="item" />
|
||||
</j-steps>
|
||||
<div class="steps-content">
|
||||
<div class="steps-box" v-if="current === 0">
|
||||
<div class="alert">
|
||||
|
|
@ -10,7 +10,7 @@
|
|||
选择与设备通信的网络组件
|
||||
</div>
|
||||
<div class="search">
|
||||
<a-input-search
|
||||
<j-input-search
|
||||
allowClear
|
||||
placeholder="请输入"
|
||||
style="width: 300px"
|
||||
|
|
@ -26,8 +26,8 @@
|
|||
</PermissionButton>
|
||||
</div>
|
||||
<div class="card-item">
|
||||
<a-row :gutter="[24, 24]" v-if="networkList.length > 0">
|
||||
<a-col
|
||||
<j-row :gutter="[24, 24]" v-if="networkList.length > 0">
|
||||
<j-col
|
||||
:span="8"
|
||||
v-for="item in networkList"
|
||||
:key="item.id"
|
||||
|
|
@ -44,7 +44,7 @@
|
|||
>
|
||||
<template #other>
|
||||
<div class="other">
|
||||
<a-tooltip placement="topLeft">
|
||||
<j-tooltip placement="topLeft">
|
||||
<div
|
||||
v-if="
|
||||
(item.addresses || [])
|
||||
|
|
@ -57,7 +57,7 @@
|
|||
:key="i.address"
|
||||
class="item"
|
||||
>
|
||||
<a-badge
|
||||
<j-badge
|
||||
:color="getColor(i)"
|
||||
/>{{ i.address }}
|
||||
</div>
|
||||
|
|
@ -69,7 +69,7 @@
|
|||
:key="i.address"
|
||||
class="item"
|
||||
>
|
||||
<a-badge
|
||||
<j-badge
|
||||
:color="getColor(i)"
|
||||
:text="i.address"
|
||||
/>
|
||||
|
|
@ -81,13 +81,13 @@
|
|||
>...</span
|
||||
>
|
||||
</div>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
</access-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-empty v-else description="暂无数据" />
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-empty v-else description="暂无数据" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="steps-box" v-else-if="current === 1">
|
||||
|
|
@ -96,7 +96,7 @@
|
|||
使用选择的消息协议，对网络组件通信数据进行编解码、认证等操作
|
||||
</div>
|
||||
<div class="search">
|
||||
<a-input-search
|
||||
<j-input-search
|
||||
allowClear
|
||||
placeholder="请输入"
|
||||
style="width: 300px"
|
||||
|
|
@ -112,8 +112,8 @@
|
|||
</PermissionButton>
|
||||
</div>
|
||||
<div class="card-item">
|
||||
<a-row :gutter="[24, 24]" v-if="procotolList.length > 0">
|
||||
<a-col
|
||||
<j-row :gutter="[24, 24]" v-if="procotolList.length > 0">
|
||||
<j-col
|
||||
:span="8"
|
||||
v-for="item in procotolList"
|
||||
:key="item?.id"
|
||||
|
|
@ -124,9 +124,9 @@
|
|||
:data="item"
|
||||
>
|
||||
</access-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-empty v-else description="暂无数据" />
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-empty v-else description="暂无数据" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="steps-box" v-else>
|
||||
|
|
@ -136,41 +136,41 @@
|
|||
clientHeight > 900 ? 750 : clientHeight * 0.7
|
||||
}px`"
|
||||
>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12">
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12">
|
||||
<title-component data="基本信息" />
|
||||
<div>
|
||||
<a-form
|
||||
<j-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
layout="vertical"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="名称"
|
||||
v-bind="validateInfos.name"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="formData.name"
|
||||
allowClear
|
||||
placeholder="请输入名称"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
label="说明"
|
||||
v-bind="validateInfos.description"
|
||||
>
|
||||
<a-textarea
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
:rows="4"
|
||||
v-model:value="formData.description"
|
||||
show-count
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="config-right">
|
||||
<div class="config-right-item">
|
||||
<div class="config-right-item-title">
|
||||
|
|
@ -212,7 +212,7 @@
|
|||
v-for="i in getNetworkCurrentData()"
|
||||
:key="i.address"
|
||||
>
|
||||
<a-badge
|
||||
<j-badge
|
||||
:color="getColor(i)"
|
||||
:text="i.address"
|
||||
/>
|
||||
|
|
@ -235,10 +235,10 @@
|
|||
: 'URL信息'
|
||||
}}
|
||||
</div>
|
||||
<a-table
|
||||
<j-table
|
||||
:pagination="false"
|
||||
:rowKey="generateUUID()"
|
||||
:data-source="config.routes || []"
|
||||
:datj-source="config.routes || []"
|
||||
bordered
|
||||
:columns="
|
||||
config.id === 'MQTT'
|
||||
|
|
@ -261,23 +261,23 @@
|
|||
}}</span>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</j-table>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="steps-action">
|
||||
<a-button
|
||||
<j-button
|
||||
v-if="[0, 1].includes(current)"
|
||||
type="primary"
|
||||
style="margin-right: 8px"
|
||||
@click="next"
|
||||
>
|
||||
下一步
|
||||
</a-button>
|
||||
</j-button>
|
||||
<PermissionButton
|
||||
v-if="current === 2 && view === 'false'"
|
||||
type="primary"
|
||||
|
|
@ -289,12 +289,12 @@
|
|||
>
|
||||
保存
|
||||
</PermissionButton>
|
||||
<a-button
|
||||
<j-button
|
||||
v-if="type === 'child-device' ? current > 1 : current > 0"
|
||||
@click="prev"
|
||||
>
|
||||
上一步
|
||||
</a-button>
|
||||
</j-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@
|
|||
<div v-for="items in dataSource" :key="items.type" class="card-items">
|
||||
<div class="card-items-container">
|
||||
<TitleComponent :data="items.title"></TitleComponent>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="12" v-for="item in items.list" :key="item.id">
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="12" v-for="item in items.list" :key="item.id">
|
||||
<div class="provider">
|
||||
<div class="box">
|
||||
<div class="left">
|
||||
|
|
@ -15,21 +15,21 @@
|
|||
{{ item.name }}
|
||||
</div>
|
||||
<div class="desc">
|
||||
<a-tooltip :title="item.description">
|
||||
<j-tooltip :title="item.description">
|
||||
{{ item.description || '' }}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<a-button type="primary" @click="click(item)"
|
||||
>接入</a-button
|
||||
<j-button type="primary" @click="click(item)"
|
||||
>接入</j-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div>
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
model="CARD"
|
||||
:columns="columns"
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
:params="params"
|
||||
>
|
||||
<template #headerTitle>
|
||||
<a-space>
|
||||
<j-space>
|
||||
<PermissionButton
|
||||
type="primary"
|
||||
@click="handlAdd"
|
||||
|
|
@ -27,7 +27,7 @@
|
|||
/></template>
|
||||
新增
|
||||
</PermissionButton>
|
||||
</a-space>
|
||||
</j-space>
|
||||
</template>
|
||||
<template #card="slotProps">
|
||||
<CardBox
|
||||
|
|
@ -63,8 +63,8 @@
|
|||
{{ slotProps.name }}
|
||||
</PermissionButton>
|
||||
|
||||
<a-row class="card-item-content-box">
|
||||
<a-col
|
||||
<j-row class="card-item-content-box">
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="slotProps.channelInfo"
|
||||
class="card-item-content-text"
|
||||
|
|
@ -78,10 +78,10 @@
|
|||
slotProps.channelInfo.addresses
|
||||
"
|
||||
>
|
||||
<a-badge
|
||||
<j-badge
|
||||
:status="getStatus(slotProps)"
|
||||
/>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.channelInfo
|
||||
.addresses[0].address
|
||||
|
|
@ -90,10 +90,10 @@
|
|||
slotProps.channelInfo
|
||||
.addresses[0].address
|
||||
}}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="slotProps.protocolDetail"
|
||||
>
|
||||
|
|
@ -101,7 +101,7 @@
|
|||
协议
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.protocolDetail
|
||||
.name
|
||||
|
|
@ -110,14 +110,14 @@
|
|||
slotProps.protocolDetail
|
||||
.name
|
||||
}}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col :span="24">
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-row>
|
||||
<j-col :span="24">
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
{{
|
||||
getDescription(
|
||||
|
|
@ -126,10 +126,10 @@
|
|||
}}
|
||||
</template>
|
||||
{{ getDescription(slotProps) }}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -156,12 +156,12 @@
|
|||
</CardBox>
|
||||
</template>
|
||||
<template #state="slotProps">
|
||||
<a-badge
|
||||
<j-badge
|
||||
:text="slotProps.state.text"
|
||||
:status="statusMap.get(slotProps.state.value)"
|
||||
/>
|
||||
</template>
|
||||
</JTable>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
</page-container>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<j-spin :spinning="loading">
|
||||
<div>
|
||||
<a-textarea
|
||||
<j-textarea
|
||||
:rows="4"
|
||||
@change="textChange"
|
||||
v-model:value="keystoreBase64"
|
||||
:placeholder="placeholder"
|
||||
/>
|
||||
<a-upload
|
||||
<j-upload
|
||||
accept=".pem"
|
||||
listType="text"
|
||||
:action="NETWORK_CERTIFICATE_UPLOAD"
|
||||
|
|
@ -17,13 +17,13 @@
|
|||
:showUploadList="false"
|
||||
@change="handleChange"
|
||||
>
|
||||
<a-button style="margin-top: 10px">
|
||||
<j-button style="margin-top: 10px">
|
||||
<upload-outlined />
|
||||
上传文件</a-button
|
||||
上传文件</j-button
|
||||
>
|
||||
</a-upload>
|
||||
</j-upload>
|
||||
</div>
|
||||
</a-spin>
|
||||
</j-spin>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="CertificateFile">
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<template>
|
||||
<page-container>
|
||||
<a-card>
|
||||
<a-row :gutter="[24, 24]" style="padding: 24px">
|
||||
<a-col :span="12">
|
||||
<a-form
|
||||
<j-card>
|
||||
<j-row :gutter="[24, 24]" style="padding: 24px">
|
||||
<j-col :span="12">
|
||||
<j-form
|
||||
class="form"
|
||||
layout="vertical"
|
||||
:model="formData"
|
||||
|
|
@ -12,30 +12,30 @@
|
|||
:wrapper-col="{ span: 16 }"
|
||||
autocomplete="off"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="证书标准"
|
||||
v-bind="validateInfos.type"
|
||||
>
|
||||
<a-radio-group v-model:value="formData.type">
|
||||
<a-radio-button
|
||||
<j-radio-group v-model:value="formData.type">
|
||||
<j-radio-button
|
||||
class="form-radio-button"
|
||||
value="common"
|
||||
>
|
||||
<img :src="getImage('/certificate.png')" />
|
||||
</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</j-radio-button>
|
||||
</j-radio-group>
|
||||
</j-form-item>
|
||||
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="证书名称"
|
||||
v-bind="validateInfos.name"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入证书名称"
|
||||
v-model:value="formData.name"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
label="证书文件"
|
||||
v-bind="validateInfos['configs.cert']"
|
||||
>
|
||||
|
|
@ -44,8 +44,8 @@
|
|||
v-model:modelValue="formData.configs.cert"
|
||||
placeholder='证书格式以"-----BEGIN CERTIFICATE-----"开头，以"-----END CERTIFICATE-----"结尾"'
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
label="证书私钥"
|
||||
v-bind="validateInfos['configs.key']"
|
||||
>
|
||||
|
|
@ -54,31 +54,31 @@
|
|||
v-model:modelValue="formData.configs.key"
|
||||
placeholder='证书私钥格式以"-----BEGIN (RSA|EC) PRIVATE KEY-----"开头，以"-----END(RSA|EC) PRIVATE KEY-----"结尾。'
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="说明" name="description">
|
||||
<a-textarea
|
||||
</j-form-item>
|
||||
<j-form-item label="说明" name="description">
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
v-model:value="formData.description"
|
||||
:maxlength="200"
|
||||
:rows="3"
|
||||
showCount
|
||||
/>
|
||||
</a-form-item>
|
||||
</j-form-item>
|
||||
|
||||
<a-form-item>
|
||||
<a-button
|
||||
<j-form-item>
|
||||
<j-button
|
||||
v-if="view === 'false'"
|
||||
class="form-submit"
|
||||
html-type="submit"
|
||||
type="primary"
|
||||
@click.prevent="onSubmit"
|
||||
:loading="loading"
|
||||
>保存</a-button
|
||||
>保存</j-button
|
||||
>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="doc">
|
||||
<h1>1. 概述</h1>
|
||||
<div>
|
||||
|
|
@ -95,9 +95,9 @@
|
|||
您可以使用文本编辑工具打开KEY格式的证书私钥文件，复制其中的内容并粘贴到该文本框，或者单击该文本框下的上传并选择存储在本地计算机的证书私钥文件，将文件内容上传到文本框。
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-card>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</j-card>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<page-container>
|
||||
<div>
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
model="TABLE"
|
||||
:columns="columns"
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
<span>{{ slotProps.type.text }}</span>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<a-space>
|
||||
<j-space>
|
||||
<template
|
||||
v-for="i in getActions(slotProps)"
|
||||
:key="i.key"
|
||||
|
|
@ -47,9 +47,9 @@
|
|||
/></template>
|
||||
</PermissionButton>
|
||||
</template>
|
||||
</a-space>
|
||||
</j-space>
|
||||
</template>
|
||||
</JTable>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
</page-container>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<j-spin :spinning="loading">
|
||||
<div class="dash-board">
|
||||
<div class="header">
|
||||
<h3>CPU使用率趋势</h3>
|
||||
<a-range-picker
|
||||
<j-range-picker
|
||||
@change="pickerTimeChange"
|
||||
:allowClear="false"
|
||||
:show-time="{ format: 'HH:mm:ss' }"
|
||||
|
|
@ -14,28 +14,28 @@
|
|||
><AIcon type="CalendarOutlined"
|
||||
/></template>
|
||||
<template #renderExtraFooter>
|
||||
<a-radio-group
|
||||
<j-radio-group
|
||||
default-value="a"
|
||||
button-style="solid"
|
||||
style="margin-right: 10px"
|
||||
v-model:value="data.type"
|
||||
>
|
||||
<a-radio-button value="hour">
|
||||
<j-radio-button value="hour">
|
||||
最近1小时
|
||||
</a-radio-button>
|
||||
<a-radio-button value="today">
|
||||
</j-radio-button>
|
||||
<j-radio-button value="today">
|
||||
今日
|
||||
</a-radio-button>
|
||||
<a-radio-button value="week">
|
||||
</j-radio-button>
|
||||
<j-radio-button value="week">
|
||||
近一周
|
||||
</a-radio-button>
|
||||
</a-radio-group></template
|
||||
</j-radio-button>
|
||||
</j-radio-group></template
|
||||
>
|
||||
</a-range-picker>
|
||||
</j-range-picker>
|
||||
</div>
|
||||
<div ref="chartRef" style="width: 100%; height: 300px"></div>
|
||||
</div>
|
||||
</a-spin>
|
||||
</j-spin>
|
||||
</template>
|
||||
m
|
||||
<script lang="ts" setup name="Cpu">
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<j-spin :spinning="loading">
|
||||
<div class="dash-board">
|
||||
<div class="header">
|
||||
<h3>JVM内存使用率趋势</h3>
|
||||
<a-range-picker
|
||||
<j-range-picker
|
||||
@change="pickerTimeChange"
|
||||
:allowClear="false"
|
||||
:show-time="{ format: 'HH:mm:ss' }"
|
||||
|
|
@ -14,28 +14,28 @@
|
|||
><AIcon type="CalendarOutlined"
|
||||
/></template>
|
||||
<template #renderExtraFooter>
|
||||
<a-radio-group
|
||||
<j-radio-group
|
||||
default-value="a"
|
||||
button-style="solid"
|
||||
style="margin-right: 10px"
|
||||
v-model:value="data.type"
|
||||
>
|
||||
<a-radio-button value="hour">
|
||||
<j-radio-button value="hour">
|
||||
最近1小时
|
||||
</a-radio-button>
|
||||
<a-radio-button value="today">
|
||||
</j-radio-button>
|
||||
<j-radio-button value="today">
|
||||
今日
|
||||
</a-radio-button>
|
||||
<a-radio-button value="week">
|
||||
</j-radio-button>
|
||||
<j-radio-button value="week">
|
||||
近一周
|
||||
</a-radio-button>
|
||||
</a-radio-group></template
|
||||
</j-radio-button>
|
||||
</j-radio-group></template
|
||||
>
|
||||
</a-range-picker>
|
||||
</j-range-picker>
|
||||
</div>
|
||||
<div ref="chartRef" style="width: 100%; height: 300px"></div>
|
||||
</div>
|
||||
</a-spin>
|
||||
</j-spin>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="Jvm">
|
||||
|
|
|
|||
|
|
@ -1,35 +1,35 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<j-spin :spinning="loading">
|
||||
<div class="dash-board">
|
||||
<div class="header">
|
||||
<div class="left">
|
||||
<h3 style="width: 80px">网络流量</h3>
|
||||
<a-radio-group
|
||||
<j-radio-group
|
||||
button-style="solid"
|
||||
v-model:value="data.type"
|
||||
>
|
||||
<a-radio-button value="bytesRead">
|
||||
<j-radio-button value="bytesRead">
|
||||
上行
|
||||
</a-radio-button>
|
||||
<a-radio-button value="bytesSent">
|
||||
</j-radio-button>
|
||||
<j-radio-button value="bytesSent">
|
||||
下行
|
||||
</a-radio-button>
|
||||
</a-radio-group>
|
||||
</j-radio-button>
|
||||
</j-radio-group>
|
||||
</div>
|
||||
<div class="right">
|
||||
<a-radio-group
|
||||
<j-radio-group
|
||||
default-value="a"
|
||||
button-style="solid"
|
||||
style="margin-right: 10px"
|
||||
v-model:value="data.time.type"
|
||||
>
|
||||
<a-radio-button value="hour">
|
||||
<j-radio-button value="hour">
|
||||
最近1小时
|
||||
</a-radio-button>
|
||||
<a-radio-button value="today"> 今日 </a-radio-button>
|
||||
<a-radio-button value="week"> 近一周 </a-radio-button>
|
||||
</a-radio-group>
|
||||
<a-range-picker
|
||||
</j-radio-button>
|
||||
<j-radio-button value="today"> 今日 </j-radio-button>
|
||||
<j-radio-button value="week"> 近一周 </j-radio-button>
|
||||
</j-radio-group>
|
||||
<j-range-picker
|
||||
:allowClear="false"
|
||||
:show-time="{ format: 'HH:mm:ss' }"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
|
|
@ -39,14 +39,14 @@
|
|||
<template #suffixIcon
|
||||
><AIcon type="CalendarOutlined"
|
||||
/></template>
|
||||
</a-range-picker>
|
||||
</j-range-picker>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div ref="chartRef" style="width: 100%; height: 350px"></div>
|
||||
</div>
|
||||
</div>
|
||||
</a-spin>
|
||||
</j-spin>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="Network">
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<div>
|
||||
<a-select
|
||||
<j-select
|
||||
style="width: 300px; margin-bottom: 20px"
|
||||
@change="serverIdChange"
|
||||
:value="serverId"
|
||||
:options="serverNodeOptions"
|
||||
v-if="serverNodeOptions.length > 1"
|
||||
></a-select>
|
||||
></j-select>
|
||||
<div class="dash-board">
|
||||
<div class="dash-board-item">
|
||||
<TopEchartsItemNode title="CPU使用率" :value="topValues.cpu" />
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<page-container>
|
||||
<div>
|
||||
<a-row :gutter="[24, 24]">
|
||||
<a-col :span="24"><TopCard /> </a-col>
|
||||
<a-col :span="24"><Network /></a-col>
|
||||
<a-col :span="12"><Cpu /></a-col>
|
||||
<a-col :span="12"><Jvm /></a-col>
|
||||
</a-row>
|
||||
<j-row :gutter="[24, 24]">
|
||||
<j-col :span="24"><TopCard /> </j-col>
|
||||
<j-col :span="24"><Network /></j-col>
|
||||
<j-col :span="12"><Cpu /></j-col>
|
||||
<j-col :span="12"><Jvm /></j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</page-container>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<a-input
|
||||
<j-spin :spinning="loading">
|
||||
<j-input
|
||||
placeholder="请上传文件"
|
||||
v-model:value="value"
|
||||
style="width: calc(100% - 100px)"
|
||||
:disabled="true"
|
||||
/>
|
||||
<a-upload
|
||||
<j-upload
|
||||
name="file"
|
||||
accept=".jar, .zip"
|
||||
:multiple="true"
|
||||
|
|
@ -19,9 +19,9 @@
|
|||
class="upload-box"
|
||||
:before-upload="beforeUpload"
|
||||
>
|
||||
<a-button type="primary">上传jar包</a-button>
|
||||
</a-upload>
|
||||
</a-spin>
|
||||
<j-button type="primary">上传jar包</j-button>
|
||||
</j-upload>
|
||||
</j-spin>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="FileUpload">
|
||||
|
|
@ -46,7 +46,7 @@ const loading = ref(false);
|
|||
|
||||
const beforeUpload: UploadProps['beforeUpload'] = (file) => {
|
||||
const arr = file.name.split('.');
|
||||
const isFile = ['jar', 'zip'].includes(arr[arr.length - 1]); // file.type === 'application/zip' || file.type === 'application/java-archive'
|
||||
const isFile = ['jar', 'zip'].includes(arr[arr.length - 1]); // file.type === 'application/zip' || file.type === 'application/javj-archive'
|
||||
if (!isFile) {
|
||||
message.error('请上传.zip.jar格式的文件');
|
||||
loading.value = false;
|
||||
|
|
|
|||
|
|
@ -1,24 +1,24 @@
|
|||
<template lang="">
|
||||
<a-modal
|
||||
<j-modal
|
||||
:title="data.id ? '编辑' : '新增'"
|
||||
:visible="true"
|
||||
width="700px"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<a-form
|
||||
<j-form
|
||||
class="form"
|
||||
layout="vertical"
|
||||
:model="formData"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
>
|
||||
<a-form-item label="名称" v-bind="validateInfos.name">
|
||||
<a-input
|
||||
<j-form-item label="名称" v-bind="validateInfos.name">
|
||||
<j-input
|
||||
placeholder="请输入名称"
|
||||
v-model:value="formData.name"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="类型" v-bind="validateInfos.type">
|
||||
</j-form-item>
|
||||
<j-form-item label="类型" v-bind="validateInfos.type">
|
||||
<RadioCard
|
||||
:disabled="!!id"
|
||||
layout="horizontal"
|
||||
|
|
@ -26,12 +26,12 @@
|
|||
:options="options"
|
||||
v-model="formData.type"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
<j-form-item
|
||||
label="文件地址"
|
||||
v-bind="validateInfos['configuration.location']"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-if="formData.type === 'local'"
|
||||
placeholder="请输入文件地址"
|
||||
v-model:value="formData.configuration.location"
|
||||
|
|
@ -40,19 +40,19 @@
|
|||
v-else
|
||||
v-model:modelValue="formData.configuration.location"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="说明" v-bind="validateInfos.description">
|
||||
<a-textarea
|
||||
</j-form-item>
|
||||
<j-form-item label="说明" v-bind="validateInfos.description">
|
||||
<j-textarea
|
||||
placeholder="请输入说明"
|
||||
v-model:value="formData.description"
|
||||
:maxlength="200"
|
||||
:rows="3"
|
||||
showCount
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
<template #footer>
|
||||
<a-button key="back" @click="handleCancel">取消</a-button>
|
||||
<j-button key="back" @click="handleCancel">取消</j-button>
|
||||
<PermissionButton
|
||||
key="submit"
|
||||
type="primary"
|
||||
|
|
@ -64,7 +64,7 @@
|
|||
确认
|
||||
</PermissionButton>
|
||||
</template>
|
||||
</a-modal>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { message, Form } from 'ant-design-vue';
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div>
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
:columns="columns"
|
||||
:request="list"
|
||||
|
|
@ -36,7 +36,7 @@
|
|||
</template>
|
||||
<template #content>
|
||||
<div class="card-item-content">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
{{ slotProps.name }}
|
||||
</template>
|
||||
|
|
@ -45,9 +45,9 @@
|
|||
>
|
||||
{{ slotProps.name }}
|
||||
</h3>
|
||||
</a-tooltip>
|
||||
<a-row class="card-item-content-box">
|
||||
<a-col
|
||||
</j-tooltip>
|
||||
<j-row class="card-item-content-box">
|
||||
<j-col
|
||||
:span="12"
|
||||
class="card-item-content-text"
|
||||
>
|
||||
|
|
@ -55,28 +55,28 @@
|
|||
ID
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.id
|
||||
}}</template>
|
||||
{{ slotProps.id }}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="card-item-content-text">
|
||||
类型
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.type
|
||||
}}</template>
|
||||
{{ slotProps.type }}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</template>
|
||||
<template #actions="item">
|
||||
|
|
@ -102,7 +102,7 @@
|
|||
</CardBox>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<a-space>
|
||||
<j-space>
|
||||
<template
|
||||
v-for="i in getActions(slotProps, 'table')"
|
||||
:key="i.key"
|
||||
|
|
@ -123,9 +123,9 @@
|
|||
/></template>
|
||||
</PermissionButton>
|
||||
</template>
|
||||
</a-space>
|
||||
</j-space>
|
||||
</template>
|
||||
</JTable>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
<Save v-if="visible" :data="current" @change="saveChange" />
|
||||
</page-container>
|
||||
|
|
|
|||
|
|
@ -1,34 +1,34 @@
|
|||
<template>
|
||||
<page-container>
|
||||
<a-card>
|
||||
<j-card>
|
||||
<div class="container">
|
||||
<a-form
|
||||
<j-form
|
||||
:model="formData"
|
||||
ref="formRef1"
|
||||
name="basic"
|
||||
autocomplete="off"
|
||||
layout="vertical"
|
||||
>
|
||||
<a-row :gutter="[24, 0]">
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
<j-row :gutter="[24, 0]">
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="名称"
|
||||
name="name"
|
||||
:rules="Rules.name"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="formData.name"
|
||||
placeholder="请输入名称"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="类型"
|
||||
name="type"
|
||||
:rules="Rules.type"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="formData.type"
|
||||
:options="typeOptions"
|
||||
placeholder="请选择类型"
|
||||
|
|
@ -37,17 +37,17 @@
|
|||
:filter-option="filterOption"
|
||||
@change="changeType"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="24">
|
||||
<j-form-item
|
||||
name="shareCluster"
|
||||
:rules="Rules.shareCluster"
|
||||
>
|
||||
<div class="form-label">
|
||||
集群
|
||||
<span class="form-label-required">*</span>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
共享配置:集群下所有节点共用同一配置
|
||||
|
|
@ -57,9 +57,9 @@
|
|||
</p>
|
||||
</template>
|
||||
<AIcon type="QuestionCircleOutlined" />
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-radio-group
|
||||
<j-radio-group
|
||||
v-model:value="formData.shareCluster"
|
||||
button-style="solid"
|
||||
@change="
|
||||
|
|
@ -68,18 +68,18 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-radio-button :value="true"
|
||||
>共享配置</a-radio-button
|
||||
<j-radio-button :value="true"
|
||||
>共享配置</j-radio-button
|
||||
>
|
||||
<a-radio-button :value="false"
|
||||
>独立配置</a-radio-button
|
||||
<j-radio-button :value="false"
|
||||
>独立配置</j-radio-button
|
||||
>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-radio-group>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
|
||||
<a-form
|
||||
<j-form
|
||||
ref="formRef2"
|
||||
layout="vertical"
|
||||
name="dynamic_form_nest_item"
|
||||
|
|
@ -91,11 +91,11 @@
|
|||
) in dynamicValidateForm.cluster"
|
||||
:key="cluster.id"
|
||||
>
|
||||
<a-collapse
|
||||
<j-collapse
|
||||
v-model:activeKey="activeKey"
|
||||
class="collapse"
|
||||
>
|
||||
<a-collapse-panel
|
||||
<j-collapse-panel
|
||||
:key="cluster.id"
|
||||
:header="`#${index + 1}.节点`"
|
||||
>
|
||||
|
|
@ -105,9 +105,9 @@
|
|||
type="DeleteOutlined"
|
||||
/>
|
||||
</template>
|
||||
<a-row :gutter="[24, 0]">
|
||||
<a-col :span="12" v-if="!shareCluster">
|
||||
<a-form-item
|
||||
<j-row :gutter="[24, 0]">
|
||||
<j-col :span="12" v-if="!shareCluster">
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -121,7 +121,7 @@
|
|||
>*</span
|
||||
>
|
||||
</div>
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="
|
||||
cluster.serverId
|
||||
"
|
||||
|
|
@ -141,16 +141,16 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-select>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible('host', formData.type)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -165,7 +165,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
绑定到服务器上的网卡地址,绑定到所有网卡:0.0.0.0
|
||||
|
|
@ -174,10 +174,10 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.host
|
||||
|
|
@ -202,16 +202,16 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-select>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible('port', formData.type)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -226,7 +226,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
监听指定端口的请求
|
||||
|
|
@ -235,9 +235,9 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.port
|
||||
|
|
@ -252,9 +252,9 @@
|
|||
filterPortOption
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -263,7 +263,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -279,7 +279,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
对外提供访问的地址,内网环境时填写服务器的内网IP地址
|
||||
|
|
@ -288,9 +288,9 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.publicHost
|
||||
|
|
@ -298,9 +298,9 @@
|
|||
placeholder="请输入公网地址"
|
||||
allowClear
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -309,7 +309,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -324,7 +324,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
对外提供访问的端口
|
||||
|
|
@ -333,10 +333,10 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
placeholder="请输入端口"
|
||||
v-model:value="
|
||||
|
|
@ -346,9 +346,9 @@
|
|||
:min="1"
|
||||
:max="65535"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -357,7 +357,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -374,16 +374,16 @@
|
|||
>
|
||||
</div>
|
||||
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入远程地址"
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.remoteHost
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -392,7 +392,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="远程端口"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -402,7 +402,7 @@
|
|||
]"
|
||||
:rules="Rules.remotePort"
|
||||
>
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
placeholder="请输入远程端口"
|
||||
v-model:value="
|
||||
|
|
@ -412,9 +412,9 @@
|
|||
:min="1"
|
||||
:max="65535"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -423,7 +423,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="clientId"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -433,17 +433,17 @@
|
|||
]"
|
||||
:rules="Rules.clientId"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.clientId
|
||||
"
|
||||
placeholder="请输入ClientId"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
|
||||
<a-col
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -452,7 +452,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="用户名"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -462,16 +462,16 @@
|
|||
]"
|
||||
:rules="Rules.username"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.username
|
||||
"
|
||||
placeholder="请输入用户名"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -480,7 +480,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="密码"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -490,16 +490,16 @@
|
|||
]"
|
||||
:rules="Rules.password"
|
||||
>
|
||||
<a-input-password
|
||||
<j-input-password
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.password
|
||||
"
|
||||
placeholder="请输入密码"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -508,7 +508,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -519,7 +519,7 @@
|
|||
>
|
||||
<div class="form-label">
|
||||
订阅前缀
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
当连接的服务为EMQ时,可能需要使用共享的订阅前缀,如:$queue或$share
|
||||
|
|
@ -528,19 +528,19 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.topicPrefix
|
||||
"
|
||||
placeholder="请输入订阅前缀"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
|
||||
<a-col
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -549,7 +549,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -564,7 +564,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
单次收发消息的最大长度,单位:字节;设置过大可能会影响性能
|
||||
|
|
@ -573,9 +573,9 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
|
|
@ -585,10 +585,10 @@
|
|||
:min="1024"
|
||||
:max="1073741824"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="24">
|
||||
<j-form-item
|
||||
:label="
|
||||
isVisible(
|
||||
'secure',
|
||||
|
|
@ -605,27 +605,27 @@
|
|||
]"
|
||||
:rules="Rules.secure"
|
||||
>
|
||||
<a-radio-group
|
||||
<j-radio-group
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.secure
|
||||
"
|
||||
>
|
||||
<a-radio :value="true"
|
||||
>是</a-radio
|
||||
<j-radio :value="true"
|
||||
>是</j-radio
|
||||
>
|
||||
<a-radio :value="false"
|
||||
>否</a-radio
|
||||
<j-radio :value="false"
|
||||
>否</j-radio
|
||||
>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</j-radio-group>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
|
||||
<a-col
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="cluster.configuration.secure"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="证书"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -635,7 +635,7 @@
|
|||
]"
|
||||
:rules="Rules.certId"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.certId
|
||||
|
|
@ -648,13 +648,13 @@
|
|||
filterOption
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="cluster.configuration.secure"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="私钥别名"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -664,16 +664,16 @@
|
|||
]"
|
||||
:rules="Rules.privateKeyAlias"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.privateKeyAlias
|
||||
"
|
||||
placeholder="请输入私钥别名"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="24"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -682,7 +682,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="[
|
||||
'cluster',
|
||||
index,
|
||||
|
|
@ -697,7 +697,7 @@
|
|||
class="form-label-required"
|
||||
>*</span
|
||||
>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
处理TCP粘拆包的方式
|
||||
|
|
@ -706,9 +706,9 @@
|
|||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
<j-select
|
||||
style="width: 48.5%"
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
|
|
@ -730,10 +730,10 @@
|
|||
)
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
|
||||
<a-col
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -743,7 +743,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="分隔符"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -754,7 +754,7 @@
|
|||
]"
|
||||
:rules="Rules.delimited"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.parserConfiguration
|
||||
|
|
@ -762,9 +762,9 @@
|
|||
"
|
||||
placeholder="请输入分隔符"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="24"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -774,7 +774,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
v-show="false"
|
||||
label="脚本语言"
|
||||
:name="[
|
||||
|
|
@ -785,16 +785,16 @@
|
|||
'lang',
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
.parserConfiguration
|
||||
.lang
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="24"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -804,7 +804,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="解析脚本"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -831,9 +831,9 @@
|
|||
"
|
||||
/>
|
||||
</div>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -843,7 +843,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="长度值"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -854,7 +854,7 @@
|
|||
]"
|
||||
:rules="Rules.size"
|
||||
>
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
|
|
@ -863,9 +863,9 @@
|
|||
"
|
||||
placeholder="请输入长度值"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -875,7 +875,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="长度"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -886,7 +886,7 @@
|
|||
]"
|
||||
:rules="Rules.length"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
style="width: 100%"
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
|
|
@ -901,9 +901,9 @@
|
|||
filterOption
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -913,7 +913,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="偏移量"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -924,7 +924,7 @@
|
|||
]"
|
||||
:rules="Rules.offset"
|
||||
>
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
|
|
@ -935,9 +935,9 @@
|
|||
:min="0"
|
||||
:max="65535"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="12"
|
||||
v-if="
|
||||
isVisible(
|
||||
|
|
@ -947,7 +947,7 @@
|
|||
)
|
||||
"
|
||||
>
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
label="大小端"
|
||||
:name="[
|
||||
'cluster',
|
||||
|
|
@ -957,7 +957,7 @@
|
|||
'little',
|
||||
]"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
style="width: 100%"
|
||||
v-model:value="
|
||||
cluster.configuration
|
||||
|
|
@ -972,32 +972,32 @@
|
|||
filterOption
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-collapse-panel>
|
||||
</a-collapse>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</j-collapse-panel>
|
||||
</j-collapse>
|
||||
</div>
|
||||
<a-form-item v-if="!shareCluster">
|
||||
<a-button type="dashed" block @click="addCluster">
|
||||
<j-form-item v-if="!shareCluster">
|
||||
<j-button type="dashed" block @click="addCluster">
|
||||
<AIcon type="PlusOutlined" />
|
||||
新增
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</j-button>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
|
||||
<a-row :gutter="[24, 0]">
|
||||
<a-col :span="24">
|
||||
<a-form-item label="说明" name="description">
|
||||
<a-textarea
|
||||
<j-row :gutter="[24, 0]">
|
||||
<j-col :span="24">
|
||||
<j-form-item label="说明" name="description">
|
||||
<j-textarea
|
||||
v-model:value="formData.description"
|
||||
show-count
|
||||
:maxlength="200"
|
||||
:rows="4"
|
||||
/> </a-form-item
|
||||
></a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
/> </j-form-item
|
||||
></j-col>
|
||||
</j-row>
|
||||
</j-form>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<PermissionButton
|
||||
|
|
@ -1010,7 +1010,7 @@
|
|||
保存
|
||||
</PermissionButton>
|
||||
</div>
|
||||
</a-card>
|
||||
</j-card>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div>
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
:columns="columns"
|
||||
:gridColumn="3"
|
||||
|
|
@ -56,36 +56,36 @@
|
|||
>
|
||||
{{ slotProps.name }}
|
||||
</PermissionButton>
|
||||
<a-row class="card-item-content-box">
|
||||
<a-col :span="12">
|
||||
<j-row class="card-item-content-box">
|
||||
<j-col :span="12">
|
||||
<div class="card-item-content-text">
|
||||
类型
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.type
|
||||
}}</template>
|
||||
{{ slotProps.type }}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<div class="card-item-content-text">
|
||||
详情
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
getDetails(slotProps)
|
||||
}}</template>
|
||||
<span class="details-text">{{
|
||||
getDetails(slotProps)
|
||||
}}</span>
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</template>
|
||||
<template #actions="item">
|
||||
|
|
@ -111,7 +111,7 @@
|
|||
</CardBox>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<a-space>
|
||||
<j-space>
|
||||
<template
|
||||
v-for="i in getActions(slotProps, 'table')"
|
||||
:key="i.key"
|
||||
|
|
@ -132,10 +132,10 @@
|
|||
/></template>
|
||||
</PermissionButton>
|
||||
</template>
|
||||
</a-space>
|
||||
</j-space>
|
||||
</template>
|
||||
<template #state="slotProps">
|
||||
<a-badge
|
||||
<j-badge
|
||||
:text="slotProps.state.text"
|
||||
:status="statusMap.get(slotProps.state.value)"
|
||||
/>
|
||||
|
|
@ -153,7 +153,7 @@
|
|||
<template #details="slotProps">
|
||||
{{ getDetails(slotProps) }}
|
||||
</template>
|
||||
</JTable>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
</page-container>
|
||||
</template>
|
||||
|
|
@ -346,7 +346,7 @@ const handlEdit = (id: string) => {
|
|||
const getDetails = (slotProps: Partial<Record<string, any>>) => {
|
||||
const { typeObject, shareCluster, configuration, cluster } = slotProps;
|
||||
const headers =
|
||||
typeObject.name.replace(/[^a-zA-Z]/g, '').toLowerCase() + '://';
|
||||
typeObject.name.replace(/[^j-zA-Z]/g, '').toLowerCase() + '://';
|
||||
const content = !!shareCluster
|
||||
? (configuration.publicHost || configuration.remoteHost) +
|
||||
':' +
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<page-container>
|
||||
<a-card>
|
||||
<a-form
|
||||
<j-card>
|
||||
<j-form
|
||||
ref="formRef"
|
||||
class="form"
|
||||
layout="vertical"
|
||||
|
|
@ -9,9 +9,9 @@
|
|||
name="basic"
|
||||
autocomplete="off"
|
||||
>
|
||||
<a-row :gutter="[16, 0]">
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
<j-row :gutter="[16, 0]">
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="流媒体名称"
|
||||
name="name"
|
||||
:rules="[
|
||||
|
|
@ -25,14 +25,14 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-input
|
||||
<j-input
|
||||
v-model:value="formData.name"
|
||||
placeholder="请输入流媒体名称"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="服务商"
|
||||
name="provider"
|
||||
:rules="[
|
||||
|
|
@ -42,16 +42,16 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
ref="select"
|
||||
v-model:value="formData.provider"
|
||||
:options="options"
|
||||
placeholder="请选择服务商"
|
||||
></a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
></j-select>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="12">
|
||||
<j-form-item
|
||||
label="密钥"
|
||||
:name="['configuration', 'secret']"
|
||||
:rules="[
|
||||
|
|
@ -61,14 +61,14 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<a-input-password
|
||||
<j-input-password
|
||||
placeholder="请输入密钥"
|
||||
v-model:value="formData.configuration.secret"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="8" class="form-item">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="8" class="form-item">
|
||||
<j-form-item
|
||||
:name="['configuration', 'apiHost']"
|
||||
:rules="[
|
||||
{
|
||||
|
|
@ -84,22 +84,22 @@
|
|||
<div class="form-label">
|
||||
API Host
|
||||
<span class="form-label-required">*</span>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>调用流媒体接口时请求的服务地址</p>
|
||||
</template>
|
||||
<AIcon type="QuestionCircleOutlined" />
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入API Host"
|
||||
v-model:value="formData.configuration.apiHost"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="4">
|
||||
<j-form-item
|
||||
class="form-item"
|
||||
:name="['configuration', 'apiPort']"
|
||||
:rules="[
|
||||
|
|
@ -111,7 +111,7 @@
|
|||
>
|
||||
<div class="form-label"></div>
|
||||
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
:min="1"
|
||||
:max="65535"
|
||||
|
|
@ -119,10 +119,10 @@
|
|||
placeholder="请输入输入端口"
|
||||
v-model:value="formData.configuration.apiPort"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="8" class="form-item">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="8" class="form-item">
|
||||
<j-form-item
|
||||
:name="['configuration', 'rtpIp']"
|
||||
:rules="[
|
||||
{
|
||||
|
|
@ -138,24 +138,24 @@
|
|||
<div class="form-label">
|
||||
RTP IP
|
||||
<span class="form-label-required">*</span>
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>
|
||||
<p>
|
||||
视频设备将流推送到该IP地址下，部分设备仅支持IP地址，建议全是用IP地址
|
||||
</p>
|
||||
</template>
|
||||
<AIcon type="QuestionCircleOutlined" />
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
|
||||
<a-input
|
||||
<j-input
|
||||
placeholder="请输入RTP IP"
|
||||
v-model:value="formData.configuration.rtpIp"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4" v-if="!checked">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="4" v-if="!checked">
|
||||
<j-form-item
|
||||
class="form-item"
|
||||
:name="['configuration', 'rtpPort']"
|
||||
:rules="[
|
||||
|
|
@ -167,7 +167,7 @@
|
|||
>
|
||||
<div class="form-label"></div>
|
||||
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
:min="1"
|
||||
:max="65535"
|
||||
|
|
@ -175,10 +175,10 @@
|
|||
placeholder="请输入端口"
|
||||
v-model:value="formData.configuration.rtpPort"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4" v-if="checked">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="4" v-if="checked">
|
||||
<j-form-item
|
||||
class="form-item"
|
||||
:name="['configuration', 'dynamicRtpPortRange0']"
|
||||
:rules="[
|
||||
|
|
@ -189,7 +189,7 @@
|
|||
]"
|
||||
>
|
||||
<div class="form-label"></div>
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
:min="1"
|
||||
:max="
|
||||
|
|
@ -201,11 +201,11 @@
|
|||
formData.configuration.dynamicRtpPortRange0
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<div class="form-item-checked" v-if="checked">至</div>
|
||||
<a-col :span="4" v-if="checked">
|
||||
<a-form-item
|
||||
<j-col :span="4" v-if="checked">
|
||||
<j-form-item
|
||||
class="form-item"
|
||||
:name="['configuration', 'dynamicRtpPortRange1']"
|
||||
:rules="[
|
||||
|
|
@ -216,7 +216,7 @@
|
|||
]"
|
||||
>
|
||||
<div class="form-label"></div>
|
||||
<a-input-number
|
||||
<j-input-number
|
||||
style="width: 100%"
|
||||
:min="
|
||||
formData.configuration.dynamicRtpPortRange0
|
||||
|
|
@ -228,40 +228,40 @@
|
|||
formData.configuration.dynamicRtpPortRange1
|
||||
"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<a-form-item
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="4">
|
||||
<j-form-item
|
||||
class="form-item-checked2"
|
||||
:name="['configuration', 'dynamicRtpPort']"
|
||||
>
|
||||
<div class="form-label"></div>
|
||||
<a-checkbox
|
||||
<j-checkbox
|
||||
v-model:checked="
|
||||
formData.configuration.dynamicRtpPort
|
||||
"
|
||||
>
|
||||
动态端口
|
||||
</a-checkbox>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</j-checkbox>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
|
||||
<a-col :span="24">
|
||||
<a-form-item>
|
||||
<a-button
|
||||
<j-col :span="24">
|
||||
<j-form-item>
|
||||
<j-button
|
||||
v-if="view === 'false'"
|
||||
class="form-submit"
|
||||
html-type="submit"
|
||||
type="primary"
|
||||
@click.prevent="onSubmit"
|
||||
:loading="loading"
|
||||
>保存</a-button
|
||||
>保存</j-button
|
||||
>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</j-form>
|
||||
</j-card>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
|
|
@ -283,7 +283,7 @@ const loading = ref(false);
|
|||
const options = ref([]);
|
||||
const checked = ref(false);
|
||||
const regDomain =
|
||||
/[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(\.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+\.?/;
|
||||
/[j-zA-Z0-9][-j-zA-Z0-9]{0,62}(\.[j-zA-Z0-9][-j-zA-Z0-9]{0,62})+\.?/;
|
||||
|
||||
const formData = ref<FormDataType>({
|
||||
name: '',
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div>
|
||||
<Search :columns="columns" target="search" @search="handleSearch" />
|
||||
|
||||
<JTable
|
||||
<j-pro-table
|
||||
ref="tableRef"
|
||||
model="CARD"
|
||||
:columns="columns"
|
||||
|
|
@ -56,8 +56,8 @@
|
|||
>
|
||||
{{ slotProps.name }}
|
||||
</h3>
|
||||
<a-row class="card-item-content-box">
|
||||
<a-col
|
||||
<j-row class="card-item-content-box">
|
||||
<j-col
|
||||
:span="8"
|
||||
class="card-item-content-text"
|
||||
>
|
||||
|
|
@ -65,20 +65,20 @@
|
|||
服务商
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.provider
|
||||
}}</template>
|
||||
{{ slotProps.provider }}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="8">
|
||||
</j-col>
|
||||
<j-col :span="8">
|
||||
<div class="card-item-content-text">
|
||||
RTP IP
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.configuration
|
||||
?.rtpIp
|
||||
|
|
@ -87,15 +87,15 @@
|
|||
slotProps.configuration
|
||||
?.rtpIp
|
||||
}}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="8">
|
||||
</j-col>
|
||||
<j-col :span="8">
|
||||
<div class="card-item-content-text">
|
||||
API HOST
|
||||
</div>
|
||||
<div class="card-item-content-text">
|
||||
<a-tooltip>
|
||||
<j-tooltip>
|
||||
<template #title>{{
|
||||
slotProps.configuration
|
||||
?.apiHost
|
||||
|
|
@ -104,10 +104,10 @@
|
|||
slotProps.configuration
|
||||
?.apiHost
|
||||
}}
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</div>
|
||||
</template>
|
||||
<template #actions="item">
|
||||
|
|
@ -132,7 +132,7 @@
|
|||
</template>
|
||||
</CardBox>
|
||||
</template>
|
||||
</JTable>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
</page-container>
|
||||
</template>
|
||||
|
|
|
|||
Loading…
Reference in New Issue