通讯设置
This commit is contained in:
jingna
parent
c07a118964
commit
2bf510dced
@ -1,38 +1,37 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
|
||||
import { fetchDeviceNet, fetchDevicePort, saveDeviceConfig, verifyAccessPassword, fetchChannelConfig } from '@/api/platform'
|
||||
// 表单数据
|
||||
const formData = ref({
|
||||
networkCard: '网卡二',
|
||||
ipAddress: '192.168.1.56',
|
||||
subnetMask: '255.255.255.255',
|
||||
gateway: '192.168.1.56',
|
||||
tcpProtocol: 'Modbus TCP',
|
||||
// 串口设置
|
||||
comPort: 'COM3',
|
||||
baudRate: 115200,
|
||||
parity: 'NONE',
|
||||
dataBits: 8,
|
||||
stopBits: 1,
|
||||
rtuProtocol: 'Modbus RTU'
|
||||
const formData: any = ref({
|
||||
nic: '',
|
||||
ip: '',
|
||||
mask: '',
|
||||
gateway: '',
|
||||
protocol: '',
|
||||
})
|
||||
|
||||
const networkCardOptions = [
|
||||
const formData2: any = ref({
|
||||
port: '',
|
||||
baud: null,
|
||||
parity: '',
|
||||
data_bits: null,
|
||||
stop_bits: null,
|
||||
protocol: ''
|
||||
})
|
||||
const networkCardOptions: any = ref([
|
||||
{ label: '网卡一', value: '网卡一' },
|
||||
{ label: '网卡二', value: '网卡二' }
|
||||
]
|
||||
{ label: '网卡二', value: '网卡二' },
|
||||
])
|
||||
|
||||
const tcpProtocolOptions = [
|
||||
const tcpProtocolOptions: any = [
|
||||
{ label: 'Modbus TCP', value: 'Modbus TCP' },
|
||||
{ label: 'IEC104 ', value: 'IEC104' }
|
||||
]
|
||||
|
||||
const comPortOptions = [
|
||||
const comPortOptions: any = ref([
|
||||
{ label: 'COM1', value: 'COM1' },
|
||||
{ label: 'COM2', value: 'COM2' },
|
||||
{ label: 'COM3', value: 'COM3' }
|
||||
]
|
||||
])
|
||||
|
||||
const baudRateOptions = [
|
||||
{ label: '9600', value: 9600 },
|
||||
@ -68,29 +67,70 @@ const rtuProtocolOptions = [
|
||||
// 保存
|
||||
const handleSave = () => {
|
||||
ElMessageBox.prompt('请输入密码', '保存', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
closeOnClickModal: false,
|
||||
// inputType: 'password',
|
||||
})
|
||||
.then(({ value }) => {
|
||||
console.log(value)
|
||||
|
||||
// ElMessage({
|
||||
// type: 'success',
|
||||
// message: `密码正确，保存成功`,
|
||||
// })
|
||||
})
|
||||
.catch(() => {
|
||||
// ElMessage({
|
||||
// type: 'info',
|
||||
// message: '密码错误',
|
||||
// })
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
closeOnClickModal: false,
|
||||
})
|
||||
.then(({ value }) => {
|
||||
verifyAccessPassword(value).then((res: any) => {
|
||||
if (res.code == 200) {
|
||||
const params = {
|
||||
net: [formData.value],
|
||||
uart: [formData2.value],
|
||||
password: config.value.password,
|
||||
hardware_version: config.value.hardware_version,
|
||||
software_version: config.value.software_version,
|
||||
}
|
||||
saveDeviceConfig(params).then((res: any) => {
|
||||
if (res.code == 200) {
|
||||
ElMessage({
|
||||
type: 'success',
|
||||
message: `保存成功`,
|
||||
})
|
||||
} else {
|
||||
ElMessage({
|
||||
type: 'info',
|
||||
message: '保存失败',
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
ElMessage({
|
||||
type: 'info',
|
||||
message: '密码错误',
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {
|
||||
// ElMessage({
|
||||
// type: 'info',
|
||||
// message: '密码错误',
|
||||
// })
|
||||
})
|
||||
console.log('保存配置:', formData.value)
|
||||
}
|
||||
const config: any = ref({})
|
||||
const handleChange = (val: any) => {
|
||||
fetchDeviceNet(val).then((res: any) => {
|
||||
formData.value = res
|
||||
})
|
||||
}
|
||||
const handleChangePort = (val: any) => {
|
||||
fetchDevicePort(val).then((res: any) => {
|
||||
formData2.value = res
|
||||
})
|
||||
}
|
||||
function init() {
|
||||
|
||||
fetchDeviceNet('网卡一').then((res: any) => {
|
||||
formData.value = res
|
||||
})
|
||||
fetchDevicePort('COM1').then((res: any) => {
|
||||
formData2.value = res
|
||||
})
|
||||
fetchChannelConfig().then((res: any) => {
|
||||
config.value = res
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
init()
|
||||
@ -108,18 +148,18 @@ onMounted(() => {
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<el-form-item label="网卡号">
|
||||
<el-select v-model="formData.networkCard" placeholder="请选择">
|
||||
<el-select v-model="formData.nic" placeholder="请选择" @change="handleChange">
|
||||
<el-option v-for="item in networkCardOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value" />
|
||||
:value="item.label" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="IP地址">
|
||||
<el-input v-model="formData.ipAddress" />
|
||||
<el-input v-model="formData.ip" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<el-form-item label="子网掩码">
|
||||
<el-input v-model="formData.subnetMask" />
|
||||
<el-input v-model="formData.mask" />
|
||||
</el-form-item>
|
||||
<el-form-item label="默认网关">
|
||||
<el-input v-model="formData.gateway" />
|
||||
@ -127,9 +167,9 @@ onMounted(() => {
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<el-form-item label="通讯协议">
|
||||
<el-select v-model="formData.tcpProtocol" placeholder="请选择">
|
||||
<el-select v-model="formData.protocol" placeholder="请选择">
|
||||
<el-option v-for="item in tcpProtocolOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value" />
|
||||
:value="item.label" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item />
|
||||
@ -142,13 +182,13 @@ onMounted(() => {
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<el-form-item label="串口号">
|
||||
<el-select v-model="formData.comPort" placeholder="请选择">
|
||||
<el-option v-for="item in comPortOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value" />
|
||||
<el-select v-model="formData2.port" placeholder="请选择" @change="handleChangePort">
|
||||
<el-option v-for="item in comPortOptions" :key="item.label" :label="item.label"
|
||||
:value="item.label" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="波特率">
|
||||
<el-select v-model="formData.baudRate" placeholder="请选择">
|
||||
<el-select v-model="formData2.baud" placeholder="请选择">
|
||||
<el-option v-for="item in baudRateOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value" />
|
||||
</el-select>
|
||||
@ -156,13 +196,13 @@ onMounted(() => {
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<el-form-item label="校验位">
|
||||
<el-select v-model="formData.parity" placeholder="请选择">
|
||||
<el-select v-model="formData2.parity" placeholder="请选择">
|
||||
<el-option v-for="item in parityOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据位">
|
||||
<el-select v-model="formData.dataBits" placeholder="请选择">
|
||||
<el-select v-model="formData2.data_bits" placeholder="请选择">
|
||||
<el-option v-for="item in dataBitsOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value" />
|
||||
</el-select>
|
||||
@ -170,13 +210,13 @@ onMounted(() => {
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<el-form-item label="停止位">
|
||||
<el-select v-model="formData.stopBits" placeholder="请选择">
|
||||
<el-select v-model="formData2.stop_bits" placeholder="请选择">
|
||||
<el-option v-for="item in stopBitsOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="通讯协议">
|
||||
<el-select v-model="formData.rtuProtocol" placeholder="请选择">
|
||||
<el-select v-model="formData2.protocol" placeholder="请选择">
|
||||
<el-option v-for="item in rtuProtocolOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value" />
|
||||
</el-select>
|
||||
@ -197,6 +237,7 @@ onMounted(() => {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 20px;
|
||||
|
||||
.form-wrapper {
|
||||
background: #fff;
|
||||
padding: 20px 50px;
|
||||
@ -204,6 +245,7 @@ onMounted(() => {
|
||||
padding-bottom: 120px;
|
||||
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
|
||||
}
|
||||
|
||||
.section {
|
||||
margin-bottom: 24px;
|
||||
padding-bottom: 16px;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user