<template>
|
<el-form
|
ref="ruleForm"
|
size="mini"
|
label-position="top"
|
:model="params"
|
:rules="rules"
|
class="params-dialog"
|
>
|
<el-row :gutter="row.gutter">
|
<el-col :span="row.span">
|
<el-form-item label="电池充电限流值" prop="battChrcurrLimit">
|
<el-input v-model="params.battChrcurrLimit"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="row.span">
|
<el-form-item label="均充电压" prop="junChrvol">
|
<el-input v-model="params.junChrvol"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="row.span">
|
<el-form-item label="浮充电压" prop="floatChrvol">
|
<el-input v-model="params.floatChrvol"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="row.span">
|
<el-form-item label="模块浮充电压" prop="modeFloatChrvol">
|
<el-input v-model="params.modeFloatChrvol"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="row.span">
|
<el-form-item label="模块均充电压" prop="modeJunChrvol">
|
<el-input v-model="params.modeJunChrvol"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<div class="form-footer">
|
<gradient-btn size="sm" :disabled="!hasPermission" @click="getParam(true)"
|
>读取</gradient-btn
|
>
|
<gradient-btn
|
size="sm"
|
:disabled="!hasPermission || !setTestFlag"
|
@click="submitFrom"
|
>设定</gradient-btn
|
>
|
</div>
|
</el-form>
|
</template>
|
|
<script>
|
import gradientBtn from "@/components/gradientBtn.vue";
|
import testVal from "@/assets/js/testVal";
|
import { getModeParams, setModeParams } from "../js/apis";
|
import const_mode from "../js/const_mode";
|
export default {
|
name: "",
|
props: {
|
btnText: {
|
type: String,
|
default: "给定",
|
},
|
},
|
computed: {
|
// title() {
|
// return this.option.label;
|
// },
|
// tip() {
|
// return this.option.tip;
|
// },
|
// setFlag() {
|
// return !!this.datas[this.option.flag];
|
// },
|
// value() {
|
// let { datas, option } = this;
|
// return this.setFlag ? datas[option.key1] : datas[option.key0];
|
// },
|
hasPermission() {
|
return this.$store.state.user.downloadFlag == 1;
|
},
|
},
|
watch: {},
|
data() {
|
const { logList, rules } = const_mode;
|
const validator_Num = (rule, value, callback) => {
|
testVal(rule, value, callback, rules.Number);
|
};
|
const testNumber = [
|
{
|
validator: validator_Num,
|
trigger: "change",
|
},
|
];
|
return {
|
logList,
|
setTestFlag: false, // 设置参数的状态
|
row: {
|
gutter: 16,
|
span: 8,
|
},
|
params: {
|
num: 0,
|
opCmd: 0,
|
battChrcurrLimit: 0, // "电池充电限流值",
|
junChrvol: 0, // "均充电压",
|
floatChrvol: 0, // "浮充电压",
|
modeFloatChrvol: 0, // "模块浮充电压",
|
modeJunChrvol: 0, // "模块均充电压",
|
},
|
rules: {
|
battChrcurrLimit: [...testNumber],
|
junChrvol: [...testNumber],
|
floatChrvol: [...testNumber],
|
modeFloatChrvol: [...testNumber],
|
modeJunChrvol: [...testNumber],
|
},
|
};
|
},
|
components: {
|
gradientBtn,
|
},
|
methods: {
|
initParams() {
|
// 初始化参数
|
this.params = {
|
num: 0,
|
opCmd: 0,
|
battChrcurrLimit: 0, // "电池充电限流值",
|
junChrvol: 0, // "均充电压",
|
floatChrvol: 0, // "浮充电压",
|
modeFloatChrvol: 0, // "模块浮充电压",
|
modeJunChrvol: 0, // "模块均充电压",
|
};
|
},
|
// 获取参数
|
getParam(showLoad) {
|
// 定义等待框
|
let loading;
|
if (showLoad) {
|
loading = this.$layer.loading(1);
|
}
|
// 查询后台
|
getModeParams()
|
.then((res) => {
|
let { code, data, data2, msg } = res.data;
|
if (code && data) {
|
this.params = {
|
...this.params,
|
...data2,
|
};
|
if (showLoad) {
|
this.$layer.msg("读取成功！");
|
}
|
// 设置按钮可点击
|
this.setTestFlag = true;
|
} else {
|
// 初始化参数
|
this.initParams();
|
// 设置按钮不可点击
|
this.setTestFlag = false;
|
if (showLoad) {
|
this.$layer.msg("读取失败！");
|
}
|
}
|
// 关闭等待框
|
this.$layer.close(loading);
|
})
|
.catch((error) => {
|
console.log(error);
|
// 初始化参数
|
this.initParams();
|
// 设置按钮不可点击
|
this.setTestFlag = false;
|
// 关闭等待框
|
this.$layer.close(loading);
|
if (showLoad) {
|
this.$layer.msg("读取失败，读取请求异常！");
|
}
|
});
|
},
|
// 提交表单设置参数
|
submitFrom() {
|
this.$refs.ruleForm.validate((valid) => {
|
// 校验通过
|
if (valid) {
|
// 设置参数
|
this.setParamsCheck();
|
} else {
|
this.$layer.msg("存在校验未通过的数据！");
|
return false;
|
}
|
});
|
},
|
setParamsCheck() {
|
this.setParam();
|
},
|
// 设置参数
|
setParam() {
|
// 等待框
|
let loading = this.$layer.loading(1);
|
let logList = this.logList.map((v) => {
|
return {
|
param: v.param,
|
paramCn: v.paramCn,
|
value: this.params[v.param],
|
};
|
});
|
let param = {
|
...this.params,
|
// opCmd: this.cmd.setParam,
|
logList,
|
};
|
// 请求后台
|
setModeParams(param)
|
.then((res) => {
|
res = res.data;
|
if (res.code && res.data) {
|
// 提示信息
|
this.$layer.msg("设置成功");
|
} else {
|
// 提示信息
|
this.$layer.msg("设置失败！");
|
}
|
// 关闭等待框
|
this.$layer.close(loading);
|
})
|
.catch((error) => {
|
console.log(error);
|
// 关闭等待框
|
this.$layer.close(loading);
|
// 提示信息
|
this.$layer.msg("设置失败，设置请求异常！");
|
});
|
},
|
},
|
|
mounted() {
|
this.getParam();
|
},
|
};
|
</script>
|
|
<style scoped lang="less">
|
:deep(.el-form-item__label) {
|
color: inherit;
|
}
|
.form-footer {
|
// display: inline-block;
|
display: flex;
|
justify-content: flex-end;
|
padding-right: 6em;
|
}
|
</style>
|
