<template>
|
<div class="fileinfo">
|
<el-form
|
ref="form"
|
:model="info"
|
label-position="top"
|
label-width="80px"
|
size="mini"
|
:rules="rules"
|
>
|
<el-row :gutter="40">
|
<el-col :span="12">
|
<el-form-item :label="$t('Region')">
|
<el-input
|
v-model="info.battStation"
|
:placeholder="$t('Pleaseenterthetestsitename')"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item :label="$t('System')" prop="battGroupName">
|
<el-input
|
v-model="info.battGroupName"
|
:placeholder="$t('Pleaseenterthesystemname')"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item :label="$t('BatteryBrand')">
|
<el-input
|
v-model="info.battBrand"
|
:placeholder="$t('Pleaseenterthebatterybrand')"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item :label="$t('BatteryModel')">
|
<el-input
|
v-model="info.battModel"
|
:placeholder="$t('Pleaseenterthebatterymodel')"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item :label="$t('BatteryType') + '(V)'" prop="battVol">
|
<el-input
|
type="number"
|
v-model="info.battVol"
|
:placeholder="$t('Pleaseenterthebatterytype')"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item :label="$t('CellQty')" prop="battCount">
|
<el-input
|
type="number"
|
v-model="info.battCount"
|
:placeholder="$t('Pleaseenterthecellquantity')"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item :label="$t('RatedCapacity') + '(Ah)'" prop="battCap">
|
<el-input
|
type="number"
|
v-model="info.battCap"
|
:placeholder="$t('Pleaseentertheratedcapacity')"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item
|
:label="$t('ReferenceResistance') + '(mΩ)'"
|
prop="battRes"
|
>
|
<el-input
|
type="number"
|
v-model="info.battRes"
|
:placeholder="$t('Pleaseenterthereferenceresistance')"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item :label="$t('ConnectionBar') + '(μΩ)'" prop="chainRes">
|
<el-input type="number" v-model="info.chainRes"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item :label="$t('InstallationTime')">
|
<el-date-picker
|
v-model="info.battBatch"
|
format="yyyy-MM-dd"
|
value-format="yyyyMMdd"
|
type="date"
|
:editable="false"
|
:clearable="false"
|
:placeholder="$t('Pleaseselecttheinstallationtime')"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-form-item :label="$t('AppearanceMark')">
|
<el-radio-group v-model="info.battErrflag" size="medium">
|
<el-radio border class="good" :label="0">{{ $t("Good") }}</el-radio>
|
<el-radio border :label="1"
|
>{{ $t("Bulging") }}/{{ $t("Leaking") }}/{{
|
$t("Cracking")
|
}}</el-radio
|
>
|
</el-radio-group>
|
</el-form-item>
|
</el-form>
|
<div class="footer">
|
<el-button type="primary" class="btn" @click="editOk">{{ $t('operate.ok') }}</el-button>
|
<!-- <el-button type="warning" class="btn" @click="editCancel"
|
>取消修改</el-button
|
> -->
|
<el-button type="info" class="btn" @click="quit">{{ $t('Exit') }}</el-button>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import CONST from "@/assets/js/const";
|
import testVal from "@/assets/js/testVal";
|
|
import i18n from './i18n/fileInfo';
|
import i18nRule from '@/assets/js/i18n/const_rules.js';
|
import { createI18nOption } from '@/assets/js/tools/i18n';
|
|
const i18nMixin = createI18nOption(i18n, [[i18nRule, 'rule']]);
|
|
const O_rules = CONST.rules;
|
export default {
|
name: "FileInfo",
|
mixins: [i18nMixin],
|
props: {
|
info: {
|
type: Object,
|
default() {
|
return {};
|
},
|
},
|
},
|
computed: {},
|
data() {
|
let R_chainRes = {
|
validator(rule, value, callback) {
|
testVal(rule, value, callback, O_rules.chainRes);
|
},
|
trigger: ["change", "blur"],
|
};
|
const rules = {
|
battStation: [
|
{ required: true, message: this.$t('Pleaseenterthetestsitename'), trigger: "blur" },
|
],
|
// battlineName: [
|
// { required: true, message: "请输入线路名称", trigger: "blur" },
|
// ],
|
battGroupName: [
|
{ required: true, message: this.$t('Pleaseenterthesystemname'), trigger: "blur" },
|
],
|
battBrand: [
|
{ required: true, message: this.$t('Pleaseenterthebatterybrand'), trigger: "blur" },
|
],
|
battModel: [
|
{ required: true, message: this.$t('Pleaseenterthebatterymodel'), trigger: "blur" },
|
],
|
battVol: [
|
{ required: true, message: this.$t('Pleaseenterthebatterytype'), trigger: "blur" },
|
{
|
validator(rule, value, callback) {
|
testVal(rule, value, callback, O_rules.battVol);
|
},
|
trigger: ["change", "blur"],
|
},
|
],
|
battCount: [
|
{ required: true, message: this.$t('Pleaseenterthecellquantity'), trigger: "blur" },
|
{
|
validator(rule, value, callback) {
|
testVal(rule, value, callback, O_rules.battCount);
|
},
|
trigger: ["change", "blur"],
|
},
|
],
|
battCap: [
|
{ required: true, message: this.$t('Pleaseentertheratedcapacity'), trigger: "blur" },
|
R_chainRes,
|
],
|
battRes: [
|
{ required: true, message: this.$t('Pleaseenterthereferenceresistance'), trigger: "blur" },
|
{
|
validator(rule, value, callback) {
|
testVal(rule, value, callback, O_rules.battRes);
|
},
|
trigger: ["change", "blur"],
|
},
|
],
|
chainRes: [
|
{ required: true, message: this.$t('Pleaseentertheconnectionbarreferenceresistance'), trigger: "blur" },
|
R_chainRes,
|
],
|
};
|
return {
|
rules,
|
};
|
},
|
components: {},
|
methods: {
|
editOk() {
|
this.$refs.form.validate((valid) => {
|
// 校验通过
|
if (valid) {
|
this.$emit("ok", this.info);
|
} else {
|
this.$message.error(this.$t('Thereexistsunverifieddata'));
|
return false;
|
}
|
});
|
},
|
editCancel() {
|
this.$emit("cancel", this.info);
|
},
|
quit() {
|
this.$emit("quit");
|
},
|
},
|
|
mounted() {
|
this.$refs.form.resetFields();
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
:deep(.el-form-item__label) {
|
color: #333;
|
font-weight: bold;
|
}
|
:deep(.el-form--label-top) .el-form-item__label {
|
padding-bottom: 0;
|
}
|
:deep(.el-radio__input) {
|
display: none;
|
}
|
:deep(.el-radio--medium).is-checked.is-checked {
|
background: #edb20a;
|
border-color: #edb20a;
|
&.good {
|
background: green;
|
border-color: green;
|
}
|
.el-radio__label {
|
color: #fff;
|
}
|
}
|
.required.required {
|
margin-bottom: 0;
|
}
|
.footer {
|
display: flex;
|
justify-content: flex-end;
|
}
|
.fileinfo :deep(.el-date-editor) {
|
&.el-input,
|
&.el-input__inner {
|
width: auto;
|
}
|
}
|
:deep(input)[type="number"]::-webkit-outer-spin-button,
|
:deep(input)[type="number"]::-webkit-inner-spin-button {
|
-webkit-appearance: none !important;
|
}
|
</style>
|