用户管理
This commit is contained in:
sjl
@@ -1,163 +1,218 @@
|
||||
<template>
|
||||
<el-dialog :title="dialogTitle" v-model='dialogVisible' @close="close" v-bind="dialogBig">
|
||||
<el-divider >设备台账信息</el-divider>
|
||||
<div class="form-grid">
|
||||
<el-form :model='formContent' ref='dialogFormRef' :rules='rules' :disabled="false">
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label="设备名称" prop="name">
|
||||
<el-input v-model='formContent.name' placeholder="请输入设备名称"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='设备类型' prop='devType'>
|
||||
<el-select v-model="formContent.devType" clearable placeholder="请选择设备类型">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Type')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="设备通道数" prop="devChns">
|
||||
<el-select v-model="formContent.devChns" clearable placeholder="请选择设备通道数">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Chns')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label="额定电压(V)" prop="devVolt">
|
||||
<el-select v-model="formContent.devVolt" clearable placeholder="请选择额定电压">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Volt')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="额定电流(A)" prop="devCurr" >
|
||||
<el-select v-model="formContent.devCurr" clearable placeholder="请选择额定电流">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Curr')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='生产厂家' prop='manufacturer'>
|
||||
<el-select v-model="formContent.manufacturer" clearable placeholder="请选择生产厂家">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Manufacturers')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label="生产日期" prop="createDate">
|
||||
<el-date-picker
|
||||
v-model="formContent.createDate"
|
||||
placeholder="请选择生产日期"
|
||||
:disabled-date="disabledDate"
|
||||
/>
|
||||
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="出厂编号" prop="createId" placeholder="请输入出厂编号">
|
||||
<el-input v-model="formContent.createId" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="固件版本" prop="hardwareVersion">
|
||||
<el-input v-model="formContent.hardwareVersion" placeholder="请输入固件版本"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="软件版本" prop="softwareVersion">
|
||||
<el-input v-model="formContent.softwareVersion" placeholder="请输入软件版本"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label='通讯协议' prop='protocol'>
|
||||
<el-select v-model="formContent.protocol" clearable placeholder="请选择通讯协议">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Event_Type')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="IP地址" prop="ip">
|
||||
<!-- <el-input v-model='formContent.ip'/> -->
|
||||
<IPAddress v-model:value="formContent.ip"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="端口号" prop="port" placeholder="请输入端口号">
|
||||
<el-input v-model="formContent.port" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='是否加密' prop='encryption'>
|
||||
<el-select v-model="formContent.encryption" clearable placeholder="请选择是否加密">
|
||||
<el-option label="是" :value="1"></el-option>
|
||||
<el-option label="否" :value="0"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label='设备模式' prop='pattern'>
|
||||
<el-input v-model='formContent.pattern' disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" v-if="true">
|
||||
<el-col :span="8">
|
||||
<el-form-item label='样品编号' prop='sampleID' clearable placeholder="请输入样品编号">
|
||||
<el-input v-model='formContent.sampleID' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='送样日期' prop='arrivedDate' >
|
||||
<el-date-picker
|
||||
v-model="formContent.arrivedDate"
|
||||
placeholder="请选择送样日期"
|
||||
:disabled-date="disabledDate"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<el-tabs type="border-card">
|
||||
<el-tab-pane label="设备台账信息">
|
||||
<div class="form-grid">
|
||||
<el-form :model='formContent' ref='dialogFormRef' :rules='rules' :disabled="false">
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label="设备名称" prop="name">
|
||||
<el-input v-model='formContent.name' placeholder="请输入设备名称"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='设备类型' prop='devType'>
|
||||
<el-select v-model="formContent.devType" clearable placeholder="请选择设备类型">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Type')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='通讯协议' prop='protocol'>
|
||||
<el-select v-model="formContent.protocol" clearable placeholder="请选择通讯协议">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Event_Type')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label="设备通道数" prop="devChns">
|
||||
<el-select v-model="formContent.devChns" clearable placeholder="请选择设备通道数">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Chns')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="额定电压(V)" prop="devVolt">
|
||||
<el-select v-model="formContent.devVolt" clearable placeholder="请选择额定电压">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Volt')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="额定电流(A)" prop="devCurr" >
|
||||
<el-select v-model="formContent.devCurr" clearable placeholder="请选择额定电流">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Curr')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label='生产厂家' prop='manufacturer'>
|
||||
<el-select v-model="formContent.manufacturer" clearable placeholder="请选择生产厂家">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('Dev_Manufacturers')"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="生产日期" prop="createDate">
|
||||
<el-date-picker
|
||||
v-model="formContent.createDate"
|
||||
placeholder="请选择生产日期"
|
||||
:disabled-date="disabledDate"
|
||||
/>
|
||||
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="出厂编号" prop="createId" placeholder="请输入出厂编号">
|
||||
<el-input v-model="formContent.createId" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label="固件版本" prop="hardwareVersion">
|
||||
<el-input v-model="formContent.hardwareVersion" placeholder="请输入固件版本"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="软件版本" prop="softwareVersion">
|
||||
<el-input v-model="formContent.softwareVersion" placeholder="请输入软件版本"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='设备模式' prop='pattern'>
|
||||
<el-input v-model='formContent.pattern' disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label="IP地址" prop="ip">
|
||||
<IPAddress v-model:value="formContent.ip"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="端口号" prop="port" placeholder="请输入端口号">
|
||||
<el-input v-model="formContent.port" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="24" >
|
||||
<el-col :span="8">
|
||||
<el-form-item label='是否加密' prop='encryption'>
|
||||
<el-select v-model="formContent.encryption" clearable placeholder="请选择是否加密" @change="handleEncryptionChange">
|
||||
<el-option label="是" :value="1"></el-option>
|
||||
<el-option label="否" :value="0"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" v-if="IsPasswordShow">
|
||||
<el-form-item label='识别码' prop='series' clearable placeholder="请输入识别码">
|
||||
<el-input v-model='formContent.series' show-password/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" v-if="IsPasswordShow">
|
||||
<el-form-item label='密钥' prop='devKey' clearable placeholder="请输入密钥">
|
||||
<el-input v-model='formContent.devKey' show-password/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" v-if="DevIsShow">
|
||||
<el-col :span="8">
|
||||
<el-form-item label='样品编号' prop='sampleID' clearable placeholder="请输入样品编号">
|
||||
<el-input v-model='formContent.sampleID' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='送样日期' prop='arrivedDate' >
|
||||
<el-date-picker
|
||||
v-model="formContent.arrivedDate"
|
||||
placeholder="请选择送样日期"
|
||||
:disabled-date="disabledDate"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" v-if="MonIsShow">
|
||||
<el-col :span="8">
|
||||
<el-form-item label='所属地市' prop='cityName' clearable placeholder="请输入所属地市">
|
||||
<el-input v-model='formContent.cityName' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='所属供电公司' prop='gDName' clearable placeholder="请输入所属供电公司">
|
||||
<el-input v-model='formContent.gDName' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label='所属电站' prop='subName' clearable placeholder="请输入所属电站">
|
||||
<el-input v-model='formContent.subName' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="监测点台账信息" v-if="MonIsShow">
|
||||
<div class='table-box' ref='popupBaseView'>
|
||||
<ProTable
|
||||
ref='proTable'
|
||||
:columns='columns'
|
||||
:request-api='getPqMonList'
|
||||
>
|
||||
<!-- 表格 header 按钮 -->
|
||||
<template #tableHeader='scope'>
|
||||
<el-button type='primary' :icon='CirclePlus' >新增</el-button>
|
||||
<el-button type='danger' :icon='Delete' plain :disabled='!scope.isSelected'>批量删除</el-button>
|
||||
</template>
|
||||
<!-- 表格操作 -->
|
||||
<template #operation>
|
||||
<el-button type='primary' link :icon='EditPen'>复制</el-button>
|
||||
<el-button type='primary' link :icon='EditPen'>编辑</el-button>
|
||||
<el-button type='primary' link :icon='Delete'>删除</el-button>
|
||||
</template>
|
||||
</ProTable>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
|
||||
</el-tabs>
|
||||
<template #footer>
|
||||
<div >
|
||||
<el-button @click='close()'>取 消</el-button>
|
||||
@@ -175,11 +230,18 @@
|
||||
import { type Device } from '@/api/device/interface'
|
||||
import { ElMessage, type FormItemRule } from 'element-plus'
|
||||
import { addPqDev, updatePqDev } from '@/api/device/device.ts'
|
||||
import { computed, type Ref, ref } from 'vue';
|
||||
import { computed, reactive, type Ref, ref } from 'vue';
|
||||
import { useDictStore } from '@/stores/modules/dict'
|
||||
import { CirclePlus, Delete } from '@element-plus/icons-vue'
|
||||
import { CirclePlus, Delete ,EditPen} from '@element-plus/icons-vue'
|
||||
// 使用 dayjs 库格式化
|
||||
import dayjs from 'dayjs';
|
||||
import {getPqMonList,deletePqMon,} from '@/api/monitor/monitor.ts'
|
||||
import { type ColumnProps } from '@/components/ProTable/interface'
|
||||
import { type Monitor } from '@/api/monitor/interface'
|
||||
import { el } from 'element-plus/es/locale'
|
||||
const MonIsShow = ref(false)
|
||||
const DevIsShow = ref(false)
|
||||
const IsPasswordShow = ref(false)
|
||||
const dictStore = useDictStore()
|
||||
// 定义弹出组件元信息
|
||||
const dialogFormRef = ref()
|
||||
@@ -317,11 +379,28 @@
|
||||
const open = (sign: string, data: Device.ResPqDev) => {
|
||||
titleType.value = sign
|
||||
dialogVisible.value = true
|
||||
|
||||
|
||||
if(data.encryption === 1){
|
||||
handleEncryptionChange(1)
|
||||
}else{
|
||||
handleEncryptionChange(0)
|
||||
}
|
||||
|
||||
if(data.pattern == '比对式')
|
||||
{
|
||||
MonIsShow.value = true
|
||||
DevIsShow.value = false
|
||||
}else{
|
||||
MonIsShow.value = false
|
||||
DevIsShow.value = true
|
||||
}
|
||||
|
||||
if (data.id) {
|
||||
|
||||
formContent.value = { ...data }
|
||||
} else {
|
||||
resetFormContent()
|
||||
handleEncryptionChange(1)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -332,5 +411,55 @@
|
||||
}>()
|
||||
|
||||
|
||||
const handleEncryptionChange = (value: number) => {
|
||||
// 根据是否加密来显示或隐藏识别码和密钥
|
||||
if(value === 1){
|
||||
IsPasswordShow.value = true
|
||||
}else
|
||||
{
|
||||
IsPasswordShow.value = false
|
||||
formContent.value.series = ''
|
||||
formContent.value.devKey = ''
|
||||
}
|
||||
|
||||
// 如果选择"是"，则显示；否则隐藏
|
||||
}
|
||||
|
||||
// 表格配置项
|
||||
const columns = reactive<ColumnProps<Monitor.ResPqMon>[]>([
|
||||
{ type: 'selection', fixed: 'left', width: 70 },
|
||||
{ type: 'index', fixed: 'left', width: 70, label: '序号' },
|
||||
{
|
||||
prop: '',
|
||||
label: '所属母线',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
prop: '',
|
||||
label: '被检通道',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
prop: '',
|
||||
label: 'PT变比',
|
||||
width: 110,
|
||||
},
|
||||
{
|
||||
prop: '',
|
||||
label: 'CT变比',
|
||||
width: 130,
|
||||
},
|
||||
{
|
||||
prop: '',
|
||||
label: '接线方式',
|
||||
width: 130,
|
||||
|
||||
},
|
||||
{
|
||||
prop: '',
|
||||
label: '谐波系统监测点ID',
|
||||
minWidth: 250,
|
||||
},
|
||||
{ prop: 'operation', label: '操作', fixed: 'right', width: 200 },
|
||||
])
|
||||
</script>
|
||||
Reference in New Issue
Block a user