Merge branch 'develop' into single-develop

This commit is contained in:
白菜
2025-12-26 21:01:54 +08:00
3 changed files with 453 additions and 359 deletions

View File

@ -18,7 +18,7 @@ const ems = {
deviceTypeOptions: {'TCP': 'TCP', 'RTU': 'RTU'},//设备类型 deviceTypeOptions: {'TCP': 'TCP', 'RTU': 'RTU'},//设备类型
ticketStatusOptions: {1: '待处理', 2: '处理中', 3: '已处理'},//工单处理状态 ticketStatusOptions: {1: '待处理', 2: '处理中', 3: '已处理'},//工单处理状态
strategyStatusOptions: {'0': '未启用', '1': '已运行', '2': '已暂停', '3': '禁用', '4': '删除'},//策略状态 strategyStatusOptions: {'0': '未启用', '1': '已运行', '2': '已暂停', '3': '禁用', '4': '删除'},//策略状态
chargeStatusOptions: {'1': '充电', '2': '待机'},//冲放状态 chargeStatusOptions: {'1': '充电', '2': '待机', '3': '放电'},//冲放状态
comparisonOperatorOptions: {'>': '>', '<': '<', '=': '=', '>=': '>=', '<=': '<='}, comparisonOperatorOptions: {'>': '>', '<': '<', '=': '=', '>=': '>=', '<=': '<='},
relationWithPoint: {'||': '||', '&&': '&&'} relationWithPoint: {'||': '||', '&&': '&&'}
}, },

View File

@ -1,5 +1,6 @@
<template> <template>
<el-dialog :visible.sync="dialogTableVisible" class="ems-dialog" :title="mode === 'add'?'新增模板':`编辑模板` "> <el-dialog :visible.sync="dialogTableVisible" class="ems-dialog add-template-dialog"
:title="mode === 'add'?'新增模板':`编辑模板` ">
<el-form ref="addTempForm" :model="formData" :rules="rules" size="medium" label-width="100px"> <el-form ref="addTempForm" :model="formData" :rules="rules" size="medium" label-width="100px">
<el-form-item label="模板名称" prop="templateName"> <el-form-item label="模板名称" prop="templateName">
<el-input v-model="formData.templateName" placeholder="请输入" clearable :style="{width: '100%'}"> <el-input v-model="formData.templateName" placeholder="请输入" clearable :style="{width: '100%'}">
@ -8,49 +9,65 @@
<el-form-item label="soc限制" prop="sdcLimit" required> <el-form-item label="soc限制" prop="sdcLimit" required>
<el-switch :active-value="1" :inactive-value="0" v-model="formData.sdcLimit"></el-switch> <el-switch :active-value="1" :inactive-value="0" v-model="formData.sdcLimit"></el-switch>
</el-form-item> </el-form-item>
<!-- <template v-if="formData.sdcLimit === 1">--> <!-- <template v-if="formData.sdcLimit === 1">-->
<el-form-item label="soc下限" prop="sdcDown"> <el-form-item label="soc下限" prop="sdcDown">
<el-input v-model="formData.sdcDown" placeholder="请输入" clearable :style="{width: '100%'}"></el-input> <el-input v-model="formData.sdcDown" placeholder="请输入" clearable :style="{width: '100%'}"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="soc上限" prop="sdcUp"> <el-form-item label="soc上限" prop="sdcUp">
<el-input v-model="formData.sdcUp" placeholder="请输入" clearable :style="{width: '100%'}"></el-input> <el-input v-model="formData.sdcUp" placeholder="请输入" clearable :style="{width: '100%'}"></el-input>
</el-form-item> </el-form-item>
<!-- </template>--> <!-- </template>-->
</el-form> </el-form>
<el-button type="primary" size="mini" @click="addTime">新增</el-button> <el-button type="primary" size="mini" @click="addTime">新增</el-button>
<!-- 新增时间段表单--> <!-- 新增时间段表单-->
<el-collapse-transition> <el-collapse-transition>
<el-card v-show="showAddTime" shadow="always" class="common-card-container" style="margin-top:25px;"> <el-card v-show="showAddTime" shadow="always" class="common-card-container" style="margin-top:25px;">
<el-form class="add-time-form transition-box" ref="addTimeForm" :model="formInline" :rules="formInlineRule" label-width="100px" style="margin-top:25px"> <el-form class="add-time-form transition-box" ref="addTimeForm" :model="formInline" :rules="formInlineRule"
<el-form-item label="开始时间" prop="startTime"> label-width="100px" style="margin-top:25px">
<el-time-select <!-- <el-form-item label="开始时间" prop="startTime">-->
placeholder="开始时间" <!-- <el-time-select-->
v-model="formInline.startTime" <!-- placeholder="开始时间"-->
:picker-options="{ <!-- v-model="formInline.startTime"-->
start: '00:00', <!-- :picker-options="{-->
step: '01:00', <!-- start: '00:00',-->
end: '23:00', <!-- step: '00:01',-->
}"> <!-- end: '23:00',-->
</el-time-select> <!-- }">-->
</el-form-item> <!-- </el-time-select>-->
<el-form-item label="结束时间" prop="endTime"> <!-- </el-form-item>-->
<el-time-select <!-- <el-form-item label="结束时间" prop="endTime">-->
placeholder="结束时间" <!-- <el-time-select-->
v-model="formInline.endTime" <!-- placeholder="结束时间"-->
:picker-options="{ <!-- v-model="formInline.endTime"-->
start: '00:00', <!-- :picker-options="{-->
step: '01:00', <!-- start: '00:00',-->
end: '23:00', <!-- step: '00:01',-->
minTime: formInline.startTime <!-- end: '23:00',-->
}"> <!-- minTime: formInline.startTime-->
</el-time-select> <!-- }">-->
<!-- </el-time-select>-->
<!-- </el-form-item>-->
<el-form-item label="时间范围" prop="timeRange">
<el-time-picker
is-range
v-model="formInline.timeRange"
range-separator=""
start-placeholder="开始时间"
end-placeholder="结束时间"
placeholder="选择时间范围"
format="HH:mm"
value-format="HH:mm"
:style="{width: '100%'}">
</el-time-picker>
</el-form-item> </el-form-item>
<el-form-item label="冲放功率" prop="chargeDischargePower"> <el-form-item label="冲放功率" prop="chargeDischargePower">
<el-input v-model="formInline.chargeDischargePower" placeholder="请输入"></el-input> <el-input v-model="formInline.chargeDischargePower" placeholder="请输入"
:style="{width: '100%'}"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="充电状态" prop="chargeStatus"> <el-form-item label="充电状态" prop="chargeStatus">
<el-select v-model="formInline.chargeStatus" placeholder="请选择"> <el-select v-model="formInline.chargeStatus" placeholder="请选择" :style="{width: '100%'}">
<el-option v-for="(value,key) in chargeStatusOptions" :key="key+'chargeStatusOptions'" :label="value" :value="key"></el-option> <el-option v-for="(value,key) in chargeStatusOptions" :key="key+'chargeStatusOptions'" :label="value"
:value="key"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@ -64,7 +81,6 @@
:data="tableData" :data="tableData"
border border
style="width: 100%;margin-top:25px"> style="width: 100%;margin-top:25px">
<!-- todo 如果要在span-method中使用column.property 在表格中必须定义prop="xxx"属性-->
<el-table-column <el-table-column
prop="startTime" prop="startTime"
label="开始时间"> label="开始时间">
@ -81,7 +97,7 @@
prop="chargeStatus" prop="chargeStatus"
label="充电状态"> label="充电状态">
<template slot-scope="scope"> <template slot-scope="scope">
{{chargeStatusOptions[scope.row.chargeStatus]}} {{ chargeStatusOptions[scope.row.chargeStatus] }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
@ -106,14 +122,19 @@
</template> </template>
<script> <script>
import {mapState} from 'vuex' import {mapState} from 'vuex'
import {addStrategyTemp,editStrategyTemp,getStrategyTempDetail} from '@/api/ems/dzjk' import {addStrategyTemp, editStrategyTemp, getStrategyTempDetail} from '@/api/ems/dzjk'
export default { export default {
inject:['$home'], inject: ['$home'],
data() { data() {
const now = new Date()
const year = now.getFullYear(), month = now.getMonth(), day = now.getDate()
const range = [new Date(year, month, day, 0), new Date(year, month, day, 23)]
return { return {
mode:'', mode: '',
editTempId:'', editTempId: '',
dialogTableVisible:false, dialogTableVisible: false,
secondRange: range,
formData: { formData: {
templateName: '', templateName: '',
sdcLimit: false, sdcLimit: false,
@ -127,27 +148,24 @@ export default {
trigger: 'blur' trigger: 'blur'
}], }],
sdcDown: [ sdcDown: [
{required: true,message: '请输入', trigger: 'blur'}, {required: true, message: '请输入', trigger: 'blur'},
{ pattern: /^(0|[1-9]\d*)(\.\d+)?$/, message: '请输入合法数字或小数' } {pattern: /^(0|[1-9]\d*)(\.\d+)?$/, message: '请输入合法数字或小数'}
], ],
sdcUp: [ sdcUp: [
{required: true,message: '请输入', trigger: 'blur'}, {required: true, message: '请输入', trigger: 'blur'},
{ pattern: /^(0|[1-9]\d*)(\.\d+)?$/, message: '请输入合法数字或小数' } {pattern: /^(0|[1-9]\d*)(\.\d+)?$/, message: '请输入合法数字或小数'}
], ],
}, },
showAddTime: false, showAddTime: false,
formInline:{ formInline: {
startTime:'',endTime:'',chargeDischargePower:'',chargeStatus:'' timeRange: range,
chargeDischargePower: '',
chargeStatus: ''
}, },
formInlineRule:{ formInlineRule: {
startTime: [{ timeRange: [{
required: true, required: true,
message: '请选择开始时间', message: '请选择时间范围',
trigger: 'change'
}],
endTime: [{
required: true,
message: '请选择结束时间',
trigger: 'change' trigger: 'change'
}], }],
chargeDischargePower: [{ chargeDischargePower: [{
@ -155,16 +173,16 @@ export default {
message: '请输入冲放功率', message: '请输入冲放功率',
trigger: 'blur' trigger: 'blur'
}, },
{ pattern: /^(0|[1-9]\d*)(\.\d+)?$/, message: '请输入合法数字或小数' } {pattern: /^-?\d*\.?\d*$/, message: '请输入合法数字或小数'}
], ],
chargeStatus:[{ chargeStatus: [{
required: true, required: true,
message: '请选择充放状态', message: '请选择充放状态',
trigger: ['blur','change'] trigger: ['blur', 'change']
} }
] ]
}, },
tableData:[], tableData: [],
} }
}, },
computed: { computed: {
@ -172,124 +190,131 @@ export default {
chargeStatusOptions: state => state?.ems?.chargeStatusOptions || {}, chargeStatusOptions: state => state?.ems?.chargeStatusOptions || {},
}) })
}, },
watch: {
"formInline.startTime":{
handler(newVal){
if(newVal && this.formInline.endTime){
const endTime = parseInt((this.formInline.endTime).split(':')[0] || 0)
const startTime =parseInt(newVal.split(':')[0])
if(endTime<=startTime){
this.formInline.endTime = `${startTime+1 <=9 ? '0'+(startTime+1) : startTime+1}:00`
}
}
},
deep:true
},
},
methods: { methods: {
changeSiteId(){ changeSiteId() {
this.dialogTableVisible=false this.dialogTableVisible = false
this.mode='' this.mode = ''
this.editTempId='' this.editTempId = ''
this.formData={ this.formData = {
templateName: '', templateName: '',
sdcLimit: false, sdcLimit: false,
sdcDown: '', sdcDown: '',
sdcUp: '', sdcUp: '',
} }
this.formInline={ this.formInline = {
startTime:'',endTime:'',chargeDischargePower:'',chargeStatus:'' timeRange: this.secondRange, chargeDischargePower: '', chargeStatus: ''
} }//startTime: '', endTime: '',
this.showAddTime = false this.showAddTime = false
this.tableData=[] this.tableData = []
}, },
show({mode = 'add', editTempId = ''}){ show({mode = 'add', editTempId = ''}) {
this.$nextTick(() => { this.$nextTick(() => {
this.dialogTableVisible = true this.dialogTableVisible = true
this.mode = mode this.mode = mode
this.editTempId=editTempId this.editTempId = editTempId
if(mode === 'edit' && editTempId){ if (mode === 'edit' && editTempId) {
getStrategyTempDetail(this.editTempId).then(response => { getStrategyTempDetail(this.editTempId).then(response => {
const data=JSON.parse(JSON.stringify(response?.data || [])); const data = JSON.parse(JSON.stringify(response?.data || []));
if(data.length>0){ if (data.length > 0) {
const {templateName,sdcLimit,sdcDown,sdcUp} =JSON.parse(JSON.stringify( data[0])); const {templateName, sdcLimit, sdcDown, sdcUp} = JSON.parse(JSON.stringify(data[0]));
this.formData.templateName=templateName this.formData.templateName = templateName
this.formData.sdcLimit=sdcLimit this.formData.sdcLimit = sdcLimit
this.formData.sdcDown=sdcDown this.formData.sdcDown = sdcDown
this.formData.sdcUp=sdcUp this.formData.sdcUp = sdcUp
} }
if(data.length === 1){ if (data.length === 1) {
const {startTime,endTime}=data; const {startTime, endTime} = data;
if(!startTime || !endTime){ if (!startTime || !endTime) {
this.tableData = [] this.tableData = []
}else{ } else {
this.tableData= data this.tableData = data
} }
}else{ } else {
this.tableData= data this.tableData = data
} }
}) })
} }
}) })
}, },
addTime(){ addTime() {
this.showAddTime=true this.showAddTime = true
}, },
cancelAddTime(){ cancelAddTime() {
this.$refs.addTimeForm.resetFields() this.$refs.addTimeForm.resetFields()
this.showAddTime=false this.showAddTime = false
this.formInline = {startTime:'',endTime:'',chargeDischargePower:'',chargeStatus:''} this.formInline = {timeRange: this.secondRange, chargeDischargePower: '', chargeStatus: ''}//startTime: '', endTime: '',
}, },
saveTime(){ saveTime() {
//表单校验校验成功添加到tableData里 //表单校验校验成功添加到tableData里
this.$refs.addTimeForm.validate(valid => { this.$refs.addTimeForm.validate(valid => {
if (!valid) return if (!valid) return
this.tableData.push(JSON.parse(JSON.stringify(this.formInline))); const {timeRange: [startTime, endTime], chargeDischargePower, chargeStatus} = this.formInline
this.$nextTick(() => {this.cancelAddTime()})
this.tableData.push({startTime, endTime, chargeDischargePower, chargeStatus})
this.$nextTick(() => {
this.cancelAddTime()
})
}) })
}, },
deleteRow(index){ deleteRow(index) {
this.tableData.splice(index,1) this.tableData.splice(index, 1)
}, },
saveDialog() { saveDialog() {
this.$refs.addTempForm.validate(valid => { this.$refs.addTempForm.validate(valid => {
if (!valid) return if (!valid) return
//校验时间选择范围是否冲突 //校验时间选择范围是否冲突
let status = true let status = true
this.tableData.forEach((outer,outerIndex)=>{ this.tableData.forEach((outer, outerIndex) => {
const {startTime, endTime}=outer const {startTime, endTime} = outer
const outerStart = parseInt(startTime),outerEnd = parseInt(endTime) const outerStart = parseInt(startTime), outerEnd = parseInt(endTime)
if(outerStart>outerEnd){ if (outerStart > outerEnd) {
status = false
} else {
this.tableData.forEach((inner, innerIndex) => {
if (innerIndex !== outerIndex) {
const {startTime: innerStartTime, endTime: innerEndTime} = inner
const innerStart = parseInt(innerStartTime), innerEnd = parseInt(innerEndTime)
if ((innerStart < outerStart && innerEnd > outerEnd) || !((innerStart < outerStart && innerEnd <= outerStart) || (innerStart >= outerEnd && innerEnd > outerEnd))) {
status = false status = false
}else{
this.tableData.forEach((inner,innerIndex)=>{
if(innerIndex !== outerIndex){
const {startTime:innerStartTime, endTime:innerEndTime}=inner
const innerStart = parseInt(innerStartTime),innerEnd = parseInt(innerEndTime)
if((innerStart<outerStart && innerEnd>outerEnd) || !((innerStart<outerStart && innerEnd<=outerStart) || (innerStart>=outerEnd && innerEnd>outerEnd))){
status=false
} }
} }
}) })
} }
}) })
if(!status){ if (!status) {
return this.$message.error('时间选择范围冲突'); return this.$message.error('时间选择范围冲突');
} }
const {templateName,sdcLimit,sdcDown,sdcUp} = this.formData const {templateName, sdcLimit, sdcDown, sdcUp} = this.formData
const {siteId,updateStrategyId} =this.$home const {siteId, updateStrategyId} = this.$home
const {tableData} = this const {tableData} = this
if(this.mode==='edit'){ if (this.mode === 'edit') {
editStrategyTemp({siteId,strategyId:updateStrategyId,templateId:this.editTempId,templateName,sdcLimit,sdcDown,sdcUp,timeConfigList:tableData}).then(response=>{ editStrategyTemp({
if(response?.code === 200){ siteId,
strategyId: updateStrategyId,
templateId: this.editTempId,
templateName,
sdcLimit,
sdcDown,
sdcUp,
timeConfigList: tableData
}).then(response => {
if (response?.code === 200) {
this.closeDialog() this.closeDialog()
this.$emit('update') this.$emit('update')
this.$emit('updateTimeSetting') this.$emit('updateTimeSetting')
} }
}) })
}else{ } else {
addStrategyTemp({siteId,strategyId:updateStrategyId,templateName,sdcLimit,sdcDown,sdcUp,timeConfigList:tableData}).then(response=>{ addStrategyTemp({
if(response?.code === 200){ siteId,
strategyId: updateStrategyId,
templateName,
sdcLimit,
sdcDown,
sdcUp,
timeConfigList: tableData
}).then(response => {
if (response?.code === 200) {
this.closeDialog() this.closeDialog()
this.$emit('update') this.$emit('update')
} }
@ -297,20 +322,26 @@ export default {
} }
}) })
}, },
closeDialog(){ closeDialog() {
// 清空所有数据 // 清空所有数据
this.$refs.addTempForm.resetFields() this.$refs.addTempForm.resetFields()
this.formData={ this.formData = {
templateName: '', templateName: '',
sdcLimit:0, sdcLimit: 0,
sdcDown: '', sdcDown: '',
sdcUp: '', sdcUp: '',
} }
this.tableData=[] this.tableData = []
this.cancelAddTime() this.cancelAddTime()
this.dialogTableVisible=false this.dialogTableVisible = false
} }
} }
} }
</script> </script>
<style lang="scss" scoped>
.add-template-dialog {
max-height: 90vh;
overflow-y: auto;
}
</style>

View File

@ -1,12 +1,15 @@
<template> <template>
<el-dialog :visible.sync="dialogTableVisible" :close-on-press-escape="false" :close-on-click-modal="false" :show-close="false" destroy-on-close lock-scroll append-to-body width="600px" class="ems-dialog" :title="mode === 'add'?'新增设备':`编辑设备` " > <el-dialog :visible.sync="dialogTableVisible" :close-on-press-escape="false" :close-on-click-modal="false"
:show-close="false" destroy-on-close lock-scroll append-to-body width="600px" class="ems-dialog"
:title="mode === 'add'?'新增设备':`编辑设备` ">
<el-form v-loading="loading>0" ref="addTempForm" :model="formData" :rules="rules" size="medium" label-width="140px"> <el-form v-loading="loading>0" ref="addTempForm" :model="formData" :rules="rules" size="medium" label-width="140px">
<el-form-item label="站点" prop="siteId"> <el-form-item label="站点" prop="siteId">
<el-select v-model="formData.siteId" placeholder="请选择" :style="{width: '100%'}" @change="changeType"> <el-select v-model="formData.siteId" placeholder="请选择" :style="{width: '100%'}" @change="changeType">
<el-option :label="item.siteName" :value="item.siteId" v-for="(item,index) in siteList" :key="index+'siteOptions'"></el-option> <el-option :label="item.siteName" :value="item.siteId" v-for="(item,index) in siteList"
:key="index+'siteOptions'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="设备id" prop="deviceId" > <el-form-item label="设备id" prop="deviceId">
<el-input v-model="formData.deviceId" placeholder="请输入" maxlength="60" clearable :style="{width: '100%'}"> <el-input v-model="formData.deviceId" placeholder="请输入" maxlength="60" clearable :style="{width: '100%'}">
</el-input> </el-input>
</el-form-item> </el-form-item>
@ -15,27 +18,34 @@
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="设备描述" prop="description"> <el-form-item label="设备描述" prop="description">
<el-input v-model="formData.description" type="textarea" placeholder="请输入" clearable :style="{width: '100%'}"> <el-input v-model="formData.description" type="textarea" placeholder="请输入" clearable
:style="{width: '100%'}">
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="工作状态" prop="communicationStatus"> <el-form-item label="工作状态" prop="communicationStatus">
<el-select v-model="formData.communicationStatus" placeholder="请选择" :style="{width: '100%'}"> <el-select v-model="formData.communicationStatus" placeholder="请选择" :style="{width: '100%'}">
<el-option :label="value" :value="key" v-for="(value,key) in communicationStatusOptions" :key="key+'communicationStatusOptions'"></el-option> <el-option :label="value" :value="key" v-for="(value,key) in communicationStatusOptions"
:key="key+'communicationStatusOptions'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="设备类型" prop="deviceType"> <el-form-item label="设备类型" prop="deviceType">
<el-select v-model="formData.deviceType" placeholder="请选择" :style="{width: '100%'}"> <el-select v-model="formData.deviceType" placeholder="请选择" :style="{width: '100%'}">
<el-option :label="value" :value="key" v-for="(value,key) in deviceTypeOptions" :key="key+'deviceTypeOptions'"></el-option> <el-option :label="value" :value="key" v-for="(value,key) in deviceTypeOptions"
:key="key+'deviceTypeOptions'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="设备类别" prop="deviceCategory"> <el-form-item label="设备类别" prop="deviceCategory">
<el-select v-model="formData.deviceCategory" placeholder="请选择" :style="{width: '100%'}" @change="changeType"> <el-select v-model="formData.deviceCategory" placeholder="请选择" :style="{width: '100%'}" @change="changeType">
<el-option :label="item.name" :value="item.code" v-for="(item,index) in deviceCategoryList" :key="index+'deviceCategoryList'"></el-option> <el-option :label="item.name" :value="item.code" v-for="(item,index) in deviceCategoryList"
:key="index+'deviceCategoryList'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="上级设备" prop="parentId" v-if="dccDeviceCategoryList.includes(formData.deviceCategory)"> <el-form-item label="上级设备" prop="parentId" v-if="dccDeviceCategoryList.includes(formData.deviceCategory)">
<el-select v-model="formData.parentId" :placeholder="parentDeviceList.length === 0 && !formData.siteId ? '请先选择站点' : '请选择'" :style="{width: '100%'}"> <el-select v-model="formData.parentId"
<el-option :label="item.deviceName" :value="item.id" v-for="(item,index) in parentDeviceList" :key="index+'parentDeviceList'" ></el-option> :placeholder="parentDeviceList.length === 0 && !formData.siteId ? '请先选择站点' : '请选择'"
:style="{width: '100%'}">
<el-option :label="item.deviceName" :value="item.id" v-for="(item,index) in parentDeviceList"
:key="index+'parentDeviceList'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="TCP设备的ip地址" prop="ipAddress" v-if="formData.deviceType === 'TCP'"> <el-form-item label="TCP设备的ip地址" prop="ipAddress" v-if="formData.deviceType === 'TCP'">
@ -46,7 +56,10 @@
<el-input v-model="formData.ipPort" placeholder="请输入" clearable :style="{width: '100%'}"> <el-input v-model="formData.ipPort" placeholder="请输入" clearable :style="{width: '100%'}">
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="从站地址" prop="slaveId" v-if="formData.deviceType === 'TCP'">
<el-input v-model="formData.slaveId" placeholder="请输入" clearable :style="{width: '100%'}">
</el-input>
</el-form-item>
<el-form-item label="串口路径" prop="serialPort"> <el-form-item label="串口路径" prop="serialPort">
<el-input v-model="formData.serialPort" placeholder="请输入" clearable :style="{width: '100%'}"> <el-input v-model="formData.serialPort" placeholder="请输入" clearable :style="{width: '100%'}">
</el-input> </el-input>
@ -82,28 +95,29 @@
import {mapState} from "vuex"; import {mapState} from "vuex";
import {getAllSites} from '@/api/ems/zddt' import {getAllSites} from '@/api/ems/zddt'
import {validText} from '@/utils/validate' import {validText} from '@/utils/validate'
import {getDeviceDetailInfo,updateDevice,addDevice,getParentDeviceId} from "@/api/ems/site"; import {addDevice, getDeviceDetailInfo, getParentDeviceId, updateDevice} from "@/api/ems/site";
import {getAllDeviceCategory} from '@/api/ems/search' import {getAllDeviceCategory} from '@/api/ems/search'
export default { export default {
props:{ props: {
mode:{ mode: {
type:String, type: String,
default:"add" default: "add"
}, },
id:{ id: {
type:String|Number, type: String | Number,
required:false required: false
} }
}, },
data() { data() {
const validateText=(rule, value, callback) =>{ const validateText = (rule, value, callback) => {
if (value !== '' && !validText(value)) { if (value !== '' && !validText(value)) {
callback(new Error('只能输入中文、英文、数字和特殊字符!')); callback(new Error('只能输入中文、英文、数字和特殊字符!'));
} else { } else {
callback(); callback();
} }
} }
const validateDeviceId=(rule, value, callback) =>{ const validateDeviceId = (rule, value, callback) => {
if (value !== '' && !/^[a-zA-Z0-9]+$/.test(value)) { if (value !== '' && !/^[a-zA-Z0-9]+$/.test(value)) {
callback(new Error('只能输入英文和数字!')); callback(new Error('只能输入英文和数字!'));
} else { } else {
@ -111,76 +125,80 @@ export default {
} }
} }
return { return {
loading:0, loading: 0,
dccDeviceCategoryList:['CLUSTER','BATTERY'],//需要展示上级设备的设备类型 dccDeviceCategoryList: ['CLUSTER', 'BATTERY'],//需要展示上级设备的设备类型
dialogTableVisible:false, dialogTableVisible: false,
parentDeviceList:[],//上级设备列表 从接口获取数据 parentDeviceList: [],//上级设备列表 从接口获取数据
siteList:[],//站点列表 从接口获取数据 siteList: [],//站点列表 从接口获取数据
deviceCategoryList:[],//设备类别列表 从接口获取数据 deviceCategoryList: [],//设备类别列表 从接口获取数据
formData: { formData: {
id:'',//设备唯一标识 id: '',//设备唯一标识
siteId:'',//站点ID siteId: '',//站点ID
deviceId:'',//设备id deviceId: '',//设备id
deviceName:'',//设备名称 deviceName: '',//设备名称
description:'',//设备描述 description: '',//设备描述
communicationStatus:'',//工作状态 communicationStatus: '',//工作状态
deviceType:'',//设备类型 deviceType: '',//设备类型
deviceCategory:'',//设备类别 deviceCategory: '',//设备类别
parentId:'',//上级设备id parentId: '',//上级设备id
ipAddress:'',//TCP设备的ip地址 ipAddress: '',//TCP设备的ip地址
ipPort:"",//TCP端口号 ipPort: "",//TCP端口号
serialPort:'',//串口路径 serialPort: '',//串口路径
baudRate:'',//波特率 baudRate: '',//波特率
dataBits:'',//数据位 dataBits: '',//数据位
stopBits:'',//停止位 stopBits: '',//停止位
parity:'',//校验位 parity: '',//校验位
pictureUrl:'',//设备图片 pictureUrl: '',//设备图片
slaveId: '',//从站地址
}, },
rules: { rules: {
siteId:[ siteId: [
{ required: true, message: '请选择站点', trigger: ['blur','change']} {required: true, message: '请选择站点', trigger: ['blur', 'change']}
], ],
deviceId:[ deviceId: [
{ required: true, message: '请输入设备id', trigger: 'blur'}, {required: true, message: '请输入设备id', trigger: 'blur'},
{ validator: validateDeviceId, trigger: 'blur' } {validator: validateDeviceId, trigger: 'blur'}
], ],
deviceName:[ deviceName: [
{ required: true, message: '请输入设备名称', trigger: 'blur'}, {required: true, message: '请输入设备名称', trigger: 'blur'},
{ validator: validateText, trigger: 'blur' } {validator: validateText, trigger: 'blur'}
], ],
description:[ description: [
{ required: true, message: '请输入设备描述', trigger: 'blur'}, {required: true, message: '请输入设备描述', trigger: 'blur'},
{ validator: validateText, trigger: 'blur' } {validator: validateText, trigger: 'blur'}
], ],
communicationStatus:[ communicationStatus: [
{ required: true, message: '请选择工作状态', trigger: ['blur','change']} {required: true, message: '请选择工作状态', trigger: ['blur', 'change']}
], ],
deviceType:[ deviceType: [
{ required: true, message: '请选择设备类型', trigger:['blur','change']} {required: true, message: '请选择设备类型', trigger: ['blur', 'change']}
], ],
deviceCategory:[ deviceCategory: [
{ required: true, message: '请选择设备类别', trigger: ['blur','change']} {required: true, message: '请选择设备类别', trigger: ['blur', 'change']}
], ],
ipAddress:[ ipAddress: [
{ validator: validateText, trigger: 'blur' } {validator: validateText, trigger: 'blur'}
], ],
ipPort:[ ipPort: [
{ validator: validateText, trigger: 'blur' } {validator: validateText, trigger: 'blur'}
], ],
serialPort:[ slaveId: [
{ validator: validateText, trigger: 'blur' } {validator: validateText, trigger: 'blur'}
], ],
baudRate:[ serialPort: [
{ validator: validateText, trigger: 'blur' } {validator: validateText, trigger: 'blur'}
], ],
dataBits:[ baudRate: [
{ validator: validateText, trigger: 'blur' } {validator: validateText, trigger: 'blur'}
], ],
stopBits:[ dataBits: [
{ validator: validateText, trigger: 'blur' } {validator: validateText, trigger: 'blur'}
], ],
parity:[ stopBits: [
{ validator: validateText, trigger: 'blur' } {validator: validateText, trigger: 'blur'}
],
parity: [
{validator: validateText, trigger: 'blur'}
], ],
// pictureUrl:[ // pictureUrl:[
// { required: true, message: '请上传图片', trigger: ['blur', 'change']} // { required: true, message: '请上传图片', trigger: ['blur', 'change']}
@ -191,144 +209,189 @@ export default {
computed: { computed: {
...mapState({ ...mapState({
communicationStatusOptions: state => state?.ems?.communicationStatusOptions || {}, communicationStatusOptions: state => state?.ems?.communicationStatusOptions || {},
deviceTypeOptions:state=>state?.ems?.deviceTypeOptions || {} deviceTypeOptions: state => state?.ems?.deviceTypeOptions || {}
}) })
}, },
watch:{ watch: {
dialogTableVisible:{ dialogTableVisible: {
handler(newVal){ handler(newVal) {
//打开弹窗 //打开弹窗
if(newVal){ if (newVal) {
this.getZdList() this.getZdList()
this.getDeviceCategoryList() this.getDeviceCategoryList()
} }
}, },
immediate: true, immediate: true,
}, },
id:{ id: {
handler(newVal){ handler(newVal) {
if((newVal || newVal===0) && this.mode !== 'add'){ if ((newVal || newVal === 0) && this.mode !== 'add') {
this.loading+=1 this.loading += 1
getDeviceDetailInfo(newVal).then(response => { getDeviceDetailInfo(newVal).then(response => {
this.formData = JSON.parse(JSON.stringify(response?.data || {})); this.formData = JSON.parse(JSON.stringify(response?.data || {}));
if(this.dccDeviceCategoryList.includes(this.formData.deviceCategory)){ if (this.dccDeviceCategoryList.includes(this.formData.deviceCategory)) {
this.getParentDeviceList(true) this.getParentDeviceList(true)
} }
}).finally(() => {this.loading-=1}) }).finally(() => {
this.loading -= 1
})
} }
}, },
immediate: true, immediate: true,
} }
}, },
methods: { methods: {
changeType(){ changeType() {
if(this.dccDeviceCategoryList.includes(this.formData.deviceCategory)){ if (this.dccDeviceCategoryList.includes(this.formData.deviceCategory)) {
this.getParentDeviceList() this.getParentDeviceList()
} }
}, },
uploadImage(data){ uploadImage(data) {
this.formData.pictureUrl = data this.formData.pictureUrl = data
}, },
//获取站点列表 //获取站点列表
getZdList(){ getZdList() {
this.loading+=1 this.loading += 1
getAllSites().then(response => { getAllSites().then(response => {
this.siteList = response?.data || [] this.siteList = response?.data || []
}).finally(() => {this.loading-=1}) }).finally(() => {
this.loading -= 1
})
}, },
// 获取设备类别 // 获取设备类别
getDeviceCategoryList(){ getDeviceCategoryList() {
this.loading+=1 this.loading += 1
getAllDeviceCategory().then(response => { getAllDeviceCategory().then(response => {
this.deviceCategoryList = response?.data || [] this.deviceCategoryList = response?.data || []
}).finally(() => {this.loading-=1}) }).finally(() => {
this.loading -= 1
})
}, },
//获取上级id列表 //获取上级id列表
getParentDeviceList(init=false){ getParentDeviceList(init = false) {
if(!this.formData.siteId){ if (!this.formData.siteId) {
return console.log('请先选择站点') return console.log('请先选择站点')
} }
!init && (this.formData.parentId='') !init && (this.formData.parentId = '')
this.loading= this.loading+1 this.loading = this.loading + 1
getParentDeviceId({siteId:this.formData.siteId,deviceCategory:this.formData.deviceCategory}).then(response => { getParentDeviceId({siteId: this.formData.siteId, deviceCategory: this.formData.deviceCategory}).then(response => {
this.parentDeviceList = JSON.parse(JSON.stringify(response?.data || [])); this.parentDeviceList = JSON.parse(JSON.stringify(response?.data || []));
}).finally(() => { }).finally(() => {
this.loading=this.loading -1 this.loading = this.loading - 1
}) })
}, },
saveDialog() { saveDialog() {
this.$refs.addTempForm.validate(valid => { this.$refs.addTempForm.validate(valid => {
if (!valid) return if (!valid) return
this.loading+=1 this.loading += 1
const { const {
id='', id = '',
siteId='',//站点ID siteId = '',//站点ID
deviceId='',//设备id deviceId = '',//设备id
deviceName='',//设备名称 deviceName = '',//设备名称
description='',//设备描述 description = '',//设备描述
communicationStatus='',//工作状态 communicationStatus = '',//工作状态
deviceType='',//设备类型 deviceType = '',//设备类型
deviceCategory='',//设备类别 deviceCategory = '',//设备类别
parentId='',//上级设备id parentId = '',//上级设备id
ipAddress='',//TCP设备的ip地址 ipAddress = '',//TCP设备的ip地址
ipPort="",//TCP端口号 ipPort = "",//TCP端口号
serialPort='',//串口路径 serialPort = '',//串口路径
baudRate='',//波特率 baudRate = '',//波特率
dataBits='',//数据位 dataBits = '',//数据位
stopBits='',//停止位 stopBits = '',//停止位
parity='',//校验位 parity = '',//校验位
pictureUrl='',//设备图片 pictureUrl = '',//设备图片
}= this.formData; slaveId = '',//从站地址
if(this.mode === 'add'){ } = this.formData;
addDevice({siteId,deviceId,deviceName,description,communicationStatus,deviceType,deviceCategory,parentId,ipAddress,ipPort,serialPort,baudRate,dataBits,stopBits,parity,pictureUrl}).then(response => { if (this.mode === 'add') {
if(response.code === 200){ addDevice({
siteId,
deviceId,
deviceName,
description,
communicationStatus,
deviceType,
deviceCategory,
parentId,
ipAddress,
ipPort,
serialPort,
baudRate,
dataBits,
stopBits,
parity,
pictureUrl,
slaveId
}).then(response => {
if (response.code === 200) {
//新增成功 //新增成功
// 关闭弹窗 更新表格 // 关闭弹窗 更新表格
this.$emit('update') this.$emit('update')
this.closeDialog() this.closeDialog()
} }
}).finally(() => { }).finally(() => {
this.loading-=1 this.loading -= 1
}) })
}else{ } else {
updateDevice({id,siteId,deviceId,deviceName,description,communicationStatus,deviceType,deviceCategory,parentId,ipAddress,ipPort,serialPort,baudRate,dataBits,stopBits,parity,pictureUrl}).then(response => { updateDevice({
if(response.code === 200){ id,
siteId,
deviceId,
deviceName,
description,
communicationStatus,
deviceType,
deviceCategory,
parentId,
ipAddress,
ipPort,
serialPort,
baudRate,
dataBits,
stopBits,
parity,
pictureUrl,
slaveId
}).then(response => {
if (response.code === 200) {
//新增成功 //新增成功
// 关闭弹窗 更新表格 // 关闭弹窗 更新表格
this.$emit('update') this.$emit('update')
this.closeDialog() this.closeDialog()
} }
}).finally(() => { }).finally(() => {
this.loading-=1 this.loading -= 1
}) })
} }
}) })
}, },
closeDialog(){ closeDialog() {
this.$emit('clear') this.$emit('clear')
// 清空所有数据 // 清空所有数据
this.formData= { this.formData = {
id:'',//设备唯一标识 id: '',//设备唯一标识
siteId:'',//站点ID siteId: '',//站点ID
deviceId:'',//设备id deviceId: '',//设备id
deviceName:'',//设备名称 deviceName: '',//设备名称
description:'',//设备描述 description: '',//设备描述
communicationStatus:'',//工作状态 communicationStatus: '',//工作状态
deviceType:'',//设备类型 deviceType: '',//设备类型
deviceCategory:'',//设备类别 deviceCategory: '',//设备类别
parentId:'',//上级设备id parentId: '',//上级设备id
ipAddress:'',//TCP设备的ip地址 ipAddress: '',//TCP设备的ip地址
ipPort:"",//TCP端口号 ipPort: "",//TCP端口号
serialPort:'',//串口路径 serialPort: '',//串口路径
baudRate:'',//波特率 baudRate: '',//波特率
dataBits:'',//数据位 dataBits: '',//数据位
stopBits:'',//停止位 stopBits: '',//停止位
parity:'',//校验位 parity: '',//校验位
pictureUrl:'',//设备图片 pictureUrl: '',//设备图片
slaveId: '',//从站地址
} }
this.$refs.addTempForm.resetFields() this.$refs.addTempForm.resetFields()
this.dialogTableVisible=false this.dialogTableVisible = false
} }
} }
} }