<template>
<div>
<el-dialog
:title="!dataForm.id ? '指令生成' : '修改'"
:close-on-click-modal="false"
v-dialogDrag
:visible.sync="visible"
id="myOrder">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px"
style="margin-top: -0.275rem;background-color: #fff;border: 0px solid #DCDFE6;">
<!-- 升级类型 1-BMS升级 2-Tracker通讯板升级 -->
<el-form-item label="升级类型" size="mini" prop="type">
<el-radio-group v-model="dataForm.type" :disabled="dataForm.id ? 'disabled' : null">
<el-radio :label="1">BMS升级</el-radio>
<el-radio :label="2">Tracker通讯板升级</el-radio>
<!-- <el-radio :label="2">参数设置</el-radio> -->
</el-radio-group>
</el-form-item>
<el-form-item label="项目" prop="projectParameter">
<el-select v-model="dataForm.projectParameter" placeholder="请选择项目" @change="blurSelect" style="width:6rem" clearable>
<el-option
v-for="item in projectIds"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="项目名称" prop="projectRef">
<el-input v-model="dataForm.projectRef" placeholder="项目简称" style="width:6rem" readonly></el-input>
</el-form-item>
<el-form-item label="升级模式" size="mini" prop="orderType">
<el-radio-group v-model="dataForm.orderType" :disabled="dataForm.id ? 'disabled' : null">
<el-radio :label="1" @change="typeChange(1)">指定设备升级</el-radio>
<el-radio :label="0" @change="typeChange(0)">所有设备升级</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="设备导入" v-if="showotaall">
<!-- <el-button v-if="isAuth('maya:myotarequest:batchUpgrade')" type="success" @click="otaBatchUpgradeHandle()" :disabled="dataListSelections.length != 2">批量升级</el-button> -->
<el-button type="success" @click="otaBatchUpgradeHandle()" >Excel导入</el-button>
</el-form-item>
<el-form-item label="设备编号" prop="deviceCodes" v-if="showotaall">
<!-- <el-input v-model="dataForm.deviceCodes" placeholder="设备编号。多个用“;”隔开,如下224042102999025;411219000005615;411219000005617"></el-input> -->
<el-autocomplete style="width:10rem" size="normal" v-model="dataForm.deviceCodes" :popper-append-to-body="false"
:fetch-suggestions="querySearchAsync" @select="handleSelect"
placeholder="请输入设备编号。多个用“;”隔开,如下224042102999025;411219000005615;411219000005617">
</el-autocomplete>
</el-form-item>
<el-form-item label="Topic" prop="topic">
<el-select v-model="dataForm.topic" placeholder="请选择topic" style="width:6rem" >
<el-option
v-for="item in topics"
:key="item.value"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
>
</el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="通讯方式" prop="communicationMode">
<el-input v-model="dataForm.communicationMode" placeholder="通讯方式 0:暂无 1:串口 2:can 3:i2c"></el-input>
</el-form-item> -->
<!-- <el-form-item label="通讯类型" size="mini" prop="communicationMode">
<el-radio-group v-model="dataForm.communicationMode" :disabled="dataForm.id ? 'disabled' : null">
<el-radio :label="1">串口</el-radio>
<el-radio :label="2">can</el-radio>
<el-radio :label="3">i2c</el-radio>
</el-radio-group>
</el-form-item> -->
<!-- <el-form-item label="can通讯的帧id" prop="frameIdCan">
<el-input v-model="dataForm.frameIdCan" placeholder="can通讯的帧id"></el-input>
</el-form-item>
<el-form-item label="通讯数据" prop="payload">
<el-input v-model="dataForm.payload" placeholder="通讯的数据"></el-input>
</el-form-item> -->
<!-- <el-form-item label="升级固件地址" prop="url">
<el-input v-model="dataForm.url" placeholder="升级时的固件地址"></el-input>
</el-form-item> -->
<!-- <el-form-item label="*固件地址" prop="url" v-if="showota"> -->
<el-form-item label="*固件地址" prop="url">
<el-select v-model="dataForm.url" placeholder="升级固件地址" style="width:10rem">
<el-option
v-for="item in uploadurls"
:key="item.value"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="硬件版本" prop="hardwareversion">
<el-input v-model="dataForm.hardwareversion" placeholder="要升级的目标电池硬件版本" style="width:6rem;padding-left:0.0rem;"></el-input>
<br/><span style="color:blue;font-size:13px">✸ 可不填写,若指定要升级的目标电池硬件版本,填写请在前面请带上“V”,如V1.00,V1.02</span>
</el-form-item>
<el-form-item label="*软件版本" prop="softwareversion">
<el-input v-model="dataForm.softwareversion" placeholder="当前升级的固件的软件版本" style="width:6rem"></el-input>
</el-form-item>
<el-form-item label="是否执行" size="mini" prop="todoNow">
<el-radio-group v-model="dataForm.todoNow">
<el-radio :label="0">等待</el-radio>
<el-radio :label="1">立即执行</el-radio>
</el-radio-group>
</el-form-item>
<!-- <el-form-item label="固件MD5" prop="md5">
<el-input v-model="dataForm.md5" placeholder="固件MD5"></el-input>
</el-form-item>
<el-form-item label="固件大小" prop="size">
<el-input v-model="dataForm.size" placeholder="固件大小"></el-input>
</el-form-item>
<el-form-item label="配置是否处理 " prop="handled">
<el-input v-model="dataForm.handled" placeholder="配置是否处理 1:已处理 0:待处理"></el-input>
</el-form-item>
<el-form-item label="是否立即执行" prop="todoNow">
<el-input v-model="dataForm.todoNow" placeholder="是否立即执行 0:等待执行 1:立即执行"></el-input>
</el-form-item>-->
<!-- <el-form-item label="是否执行" size="mini" prop="todoNow">
<el-radio-group v-model="dataForm.todoNow">
<el-radio :label="0">等待</el-radio>
<el-radio :label="1">执行</el-radio>
</el-radio-group>
</el-form-item> -->
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="dataFormSubmit()">生成指令</el-button>
</span>
</el-dialog>
<!-- 弹窗, Excel导入-->
<ota-batch-upgrade v-if="otaBatchUpgradeVisible" ref="otaBatchUpgrade" @refreshDataList="onSubmit(1)"></ota-batch-upgrade>
</div>
</template>
<script>
import OtaBatchUpgrade from './myotabatchupgrade'
export default {
data () {
return {
visible: false,
showotaall: true,
otaBatchUpgradeVisible: false,
projectIds:[],
uploadurls:[],
topics: [{
value: '/{productKey}/{deviceId}/maya7026/ota/upgrade/push',
label: '固件升级(ota/upgrade/push)'
}
// , {
// value: '/{productKey}/{deviceId}/upgradebox/{projectRef}/property/get',
// label: '电池数据获取(property/get)'
// }
],
dataForm: {
id: 0,
type: 1,
orderType: 1,
projectParameter: '',
deviceCodes: '',
projectRef: '',
topic: '',
// communicationMode: 1,
// frameIdCan: '',
payload: '',
url: '',
hardwareversion: '',
softwareversion: '',
md5: '',
size: '',
handled: '',
todoNow: 0,
createTime: '',
updateTime: ''
},
dataRule: {
type: [
{ required: true, message: '升级类型 1-BMS升级 2-Tracker通讯板升级 不能为空', trigger: 'blur' }
],
orderType: [
{ required: true, message: '升级模式勾选 不能为空', trigger: 'blur' }
],
projectParameter: [
{ required: true, message: '不能为空', trigger: 'blur' }
],
// deviceCodes: [
// { required: true, message: '设备编号不能为空', trigger: 'blur' }
// ],
// projectRef: [
// { required: true, message: '项目简称(用于topic)不能为空', trigger: 'blur' }
// ],
topic: [
{ required: true, message: 'mqtt发送主题,如:battery/{batteryCode}/down/upgrade不能为空', trigger: 'blur' }
],
// communicationMode: [
// { required: true, message: '通讯方式 0:暂无 1:串口 2:can 3:i2c不能为空', trigger: 'blur' }
// ],
// frameIdCan: [
// { required: true, message: 'can通讯的帧id不能为空', trigger: 'blur' }
// ],
// payload: [
// { required: true, message: '通讯的数据不能为空', trigger: 'blur' }
// ],
// url: [
// { required: true, message: '升级时的固件地址不能为空', trigger: 'blur' }
// ],
// md5: [
// { required: true, message: '固件MD5不能为空', trigger: 'blur' }
// ],
// size: [
// { required: true, message: '固件大小不能为空', trigger: 'blur' }
// ],
// handled: [
// { required: true, message: '配置是否处理 1:已处理 0:待处理不能为空', trigger: 'blur' }
// ],
todoNow: [
{ required: true, message: '是否立即执行 0:等待执行 1:立即执行不能为空', trigger: 'blur' }
],
// createTime: [
// { required: true, message: '不能为空', trigger: 'blur' }
// ],
// updateTime: [
// { required: true, message: '更新时间不能为空', trigger: 'blur' }
// ]
}
}
},
components: {
OtaBatchUpgrade,
},
methods: {
typeChange(val){
// alert('packageChange')
if(val=='1'){ // 指定电池升级,打开电池编号输入框
this.showotaall = true
}else if(val=='0'){ // ota升级项目下所有电池
this.showotaall = false
}
},
// el-select失去焦点必填校验
blurSelect() {
var project_name = this.dataForm.projectParameter.substring(this.dataForm.projectParameter.lastIndexOf("::")+2)
this.$set(this.dataForm,'projectRef', project_name)
},
querySearchAsync(queryString, cb) {
clearTimeout(1000);
var results = []
// alert('queryString='+queryString)
if (queryString == '') {
cb(results);
} else {
//掉接口需要的参数
this.$http({
url: this.$http.adornUrl('/mqtt/mqtttriad/getDeviceIds'),
method: 'get',
params: this.$http.adornParams({
'deviceId': queryString,
'projectParameter': this.dataForm.projectParameter
})
}).then(({data}) => {
if (data && data.code === 0) {
// alert(data.data.length)
var result = data.data
//循环放到一个远程搜索需要的数组
for (let i = 0; i < result.length; i++) {
const element = result[i];
// alert(element)
results.push({
value: element,
id: i
})
}
cb(results);
} else {
console.log('没有数据的显示')
results = []
cb(results);
}
})
}
},
//点击出现搜索后点击的每一项
handleSelect(item) {
this.id = item.id
this.name = item.value
},
init (id) {
this.dataForm.id = id || 0
this.showotaall = true
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
this.$http({
url: this.$http.adornUrl(`/maya/myotarequest/info/${this.dataForm.id}`),
method: 'get',
params: this.$http.adornParams()
}).then(({data}) => {
if (data && data.code === 0) {
this.projectIds = data.data.projectMenus.projectIds
this.uploadurls = data.data.OtaUrlMenus.uploads
const socitem = data.data.mqttSends
this.dataForm.type = socitem.type
this.dataForm.projectParameter = socitem.projectParameter
this.dataForm.deviceCodes = socitem.deviceCodes
this.dataForm.projectRef = socitem.projectRef
this.dataForm.topic = socitem.topic
// this.dataForm.communicationMode = socitem.communicationMode
// this.dataForm.frameIdCan = socitem.frameIdCan
// this.dataForm.payload = socitem.payload
this.dataForm.url = socitem.url
this.dataForm.md5 = socitem.md5
this.dataForm.size = socitem.size
this.dataForm.handled = socitem.handled
this.dataForm.todoNow = socitem.todoNow
this.dataForm.createTime = socitem.createTime
this.dataForm.updateTime = socitem.updateTime
}
})
}else{
this.$http({
url: this.$http.adornUrl(`/maya/myotarequest/getOtaAndProjectMenus`),
method: 'get',
params: this.$http.adornParams()
}).then(({data}) => {
if (data && data.code === 0) {
this.projectIds = data.data.projectMenus.projectIds
this.uploadurls = data.data.OtaUrlMenus.uploads
}
})
}
})
},
/**
* 设备导入弹窗触发方法
*/
otaBatchUpgradeHandle(){
this.otaBatchUpgradeVisible=true
this.$nextTick(()=>{
this.$refs.otaBatchUpgrade.init()
})
},
// 表单提交
dataFormSubmit () {
if(this.dataForm.orderType==='1' || this.dataForm.orderType===1){
if(this.dataForm.deviceCodes === '' || this.dataForm.deviceCodes === undefined || this.dataForm.deviceCodes === null){
this.$message.warning('选择指定电池升级的,设备编号不能为空!')
return
}
}
// if(this.dataForm.type==='0' || this.dataForm.type===0){
if(this.dataForm.url === '' || this.dataForm.url === undefined || this.dataForm.url === null){
this.$message.warning('升级固件地址不能为空!')
return
}
// if(this.dataForm.hardwareversion === '' || this.dataForm.hardwareversion === undefined || this.dataForm.hardwareversion === null){
// this.$message.warning('升级硬件版本不能为空!')
// return
// }
if(this.dataForm.softwareversion === '' || this.dataForm.softwareversion === undefined || this.dataForm.softwareversion === null){
this.$message.warning('升级软件版本不能为空!')
return
}
// }
this.$refs['dataForm'].validate((valid) => {
if (valid) {
this.$http({
url: this.$http.adornUrl(`/maya/myotarequest/create`),
method: 'post',
data: this.$http.adornData({
'id': this.dataForm.id || undefined,
'type': this.dataForm.type,
'orderType': this.dataForm.orderType,
'projectParameter': this.dataForm.projectParameter,
'deviceCodes': this.dataForm.deviceCodes,
'projectRef': this.dataForm.projectRef,
'topic': this.dataForm.topic,
// 'communicationMode': this.dataForm.communicationMode,
// 'frameIdCan': this.dataForm.frameIdCan,
// 'payload': this.dataForm.payload,
'url': this.dataForm.url,
'hardwareversion': this.dataForm.hardwareversion,
'softwareversion': this.dataForm.softwareversion,
'md5': this.dataForm.md5,
'size': this.dataForm.size,
'handled': this.dataForm.handled,
'todoNow': this.dataForm.todoNow,
'createTime': this.dataForm.createTime,
'updateTime': this.dataForm.updateTime
})
}).then(({data}) => {
if (data && data.code === 0) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
// this.$emit('refreshDataList', this.dataForm.type,this.dataForm.communicationMode,this.dataForm.deviceCodes);
}
})
} else {
this.$message.error(data.msg)
}
})
}
})
}
}
}
</script>
<style>
#myOrder element.style {
width: 150px;
}
</style>父组件是这样的