<template>
    <div class="vehicleModelCarsimPanel">
        <el-form ref="form" :model="form" :rules="rules" label-width="213px">
            <div class="titlePanel">
                <div class="titlePanelBor">几何参数</div>
            </div>

            <div class="titlePanelA padTop0">
                <div class="titlePanelABor">
                    <b></b>
                    <span>车体</span>
                </div>
            </div>

            <div class="carTipBox">
                <div class="searchLayoutBox">
                    <img :src="imgSrc" width="100%" alt="" />
                    <el-form-item label="" prop="wheelCenterToTop" class="p1">
                        <el-input
                            placeholder="请输入"
                            maxlength="12"
                            v-autoTrim="{ obj: form, key: 'wheelCenterToTop' }"
                            v-model="form.wheelCenterToTop"
                        >
                        </el-input>
                    </el-form-item>
                    <el-form-item
                        label=""
                        prop="wheelCenterToGround"
                        class="p2"
                    >
                        <el-input
                            placeholder="请输入"
                            maxlength="12"
                            v-autoTrim="{
                                obj: form,
                                key: 'wheelCenterToGround',
                            }"
                            v-model="form.wheelCenterToGround"
                        >
                        </el-input>
                    </el-form-item>
                    <el-form-item
                        label=""
                        prop="centroidToFrontWheelCenter"
                        class="p3"
                    >
                        <el-input
                            placeholder="请输入"
                            maxlength="12"
                            v-autoTrim="{
                                obj: form,
                                key: 'centroidToFrontWheelCenter',
                            }"
                            v-model="form.centroidToFrontWheelCenter"
                        >
                        </el-input>
                    </el-form-item>
                    <el-form-item label="" prop="centroidToGround" class="p4">
                        <el-input
                            placeholder="请输入"
                            maxlength="12"
                            v-autoTrim="{ obj: form, key: 'centroidToGround' }"
                            v-model="form.centroidToGround"
                        >
                        </el-input>
                    </el-form-item>
                    <el-form-item label="" prop="wheelbase" class="p6">
                        <el-input
                            placeholder="请输入"
                            maxlength="12"
                            v-autoTrim="{ obj: form, key: 'wheelbase' }"
                            v-model="form.wheelbase"
                        >
                        </el-input>
                    </el-form-item>
                </div>
            </div>

            <div class="flexBox padTop22">
                <el-form-item label="车辆长度(mm):" prop="vehicleLength">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'vehicleLength' }"
                        v-model="form.vehicleLength"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="车辆宽度(mm):" prop="vehicleWidth">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'vehicleWidth' }"
                        v-model="form.vehicleWidth"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="簧上质量(kg):" prop="sprungMass">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'sprungMass' }"
                        v-model="form.sprungMass"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="整车绕Y轴转动惯量(kg·m²):"
                    prop="rotationalInertiaY"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'rotationalInertiaY' }"
                        v-model="form.rotationalInertiaY"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="整车绕Z轴转动惯量(kg·m²):"
                    prop="rotationalInertiaZ"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'rotationalInertiaZ' }"
                        v-model="form.rotationalInertiaZ"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="整车绕X轴转动惯量(kg·m²):"
                    prop="rotationalInertiaX"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'rotationalInertiaX' }"
                        v-model="form.rotationalInertiaX"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div class="titlePanelA">
                <div class="titlePanelABor">
                    <i class="el-icon-s-tools"></i>
                    <span>空气动力学</span>
                </div>
            </div>
            <div class="flexBox">
                <el-form-item label="迎风面积(㎡):" prop="windwardArea">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'windwardArea' }"
                        v-model="form.windwardArea"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="空气密度(kg·m³):" prop="airDensity">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'airDensity' }"
                        v-model="form.airDensity"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div class="titlePanel">
                <div class="titlePanelBor">动力参数</div>
            </div>
            <div class="titlePanelA padTop0">
                <div class="titlePanelABor">
                    <i class="el-icon-s-finance"></i>
                    <span>发动机</span>
                </div>
            </div>

            <div class="flexBox">
                <el-form-item label="驱动类型:" prop="driverType">
                    <el-select v-model="form.driverType" disabled>
                        <el-option
                            v-for="item in driverTypeList"
                            :label="item.caption"
                            :value="item.code"
                            :key="item.code"
                        >
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="怠速转速(rpm):" prop="idleSpeed">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'idleSpeed' }"
                        v-model="form.idleSpeed"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="发动机曲轴转动惯量(kg·m²):"
                    prop="engineCrankshaftMomentInertia"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'engineCrankshaftMomentInertia',
                        }"
                        v-model="form.engineCrankshaftMomentInertia"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div class="dialogBtnBox">
                <div
                    class="dia dia2"
                    v-bind:class="{ isCur: isCurA === 'isCurA' }"
                    @click="
                        diaChange1(
                            'isCurA',
                            '发动机扭矩、转速和节气门开度的关系曲线',
                            4
                        )
                    "
                >
                    发动机扭矩、转速和节气门开度的关系曲线
                </div>
            </div>

            <div class="titlePanelA">
                <div class="titlePanelABor">
                    <i class="el-icon-s-unfold"></i>
                    <span>离合器</span>
                </div>
            </div>
            <div class="flexBox">
                <el-form-item
                    label="输入轴转动惯量(kg·m²):"
                    prop="momentInertiaInputShaft"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'momentInertiaInputShaft',
                        }"
                        v-model="form.momentInertiaInputShaft"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="输出轴转动惯量(kg·m²):"
                    prop="momentInertiaOutputShaft"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'momentInertiaOutputShaft',
                        }"
                        v-model="form.momentInertiaOutputShaft"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div class="titlePanelA">
                <div class="titlePanelABor">
                    <i class="el-icon-s-operation"></i>
                    <span>差速器</span>
                </div>
            </div>
            <div class="flexBox">
                <el-form-item label="主减速器传动比:" prop="finalDriveRatio">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'finalDriveRatio' }"
                        v-model="form.finalDriveRatio"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="传动效率:" prop="transmissionEfficiency">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'transmissionEfficiency',
                        }"
                        v-model="form.transmissionEfficiency"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div class="titlePanelA">
                <div class="titlePanelABor">
                    <i class="el-icon-s-data"></i>
                    <span>变速器</span>
                </div>
            </div>

            <div>
                <tableList
                    :columns="columns"
                    :getDataWay="getDataWay"
                    style="margin: 0 15px 15px 0"
                >
                    <el-table-column
                        v-for="(column, index) in columns"
                        :key="`col_${index}`"
                        :slot="column.prop"
                        :label="column.label"
                        align="center"
                    >
                        <template v-slot="scope">
                            <span
                                v-if="
                                    column.prop != 'inertia' &&
                                    scope.row.a === '空挡'
                                "
                                >/</span
                            >
                            <el-input
                                v-else
                                maxlength="12"
                                placeholder="请输入"
                                v-autoTrim="{
                                    obj: scope.row,
                                    key: `${column.prop}`,
                                }"
                                v-model="scope.row[`${column.prop}`]"
                            ></el-input>
                        </template>
                    </el-table-column>
                </tableList>
                <div>
                    <el-form-item label="换挡时间(s):" prop="shiftTime">
                        <el-input
                            placeholder="请输入"
                            maxlength="12"
                            v-autoTrim="{ obj: form, key: 'shiftTime' }"
                            v-model="form.shiftTime"
                        >
                        </el-input>
                    </el-form-item>
                </div>

                <div class="flexBox wrapBox">
                    <div class="labelName">各挡位换挡曲线:</div>
                    <div class="dialogBtnBox flexBox">
                        <div
                            class="dia"
                            v-bind:class="{ isCur: isCurB === 'isCurB1' }"
                            @click="diaChange2('isCurB1', '1-2 换挡曲线', 1)"
                        >
                            1-2 换挡曲线
                        </div>
                        <div
                            class="dia"
                            v-bind:class="{ isCur: isCurB === 'isCurB2' }"
                            @click="diaChange2('isCurB2', '2-3 换挡曲线', 2)"
                        >
                            2-3 换挡曲线
                        </div>
                        <div
                            class="dia"
                            v-bind:class="{ isCur: isCurB === 'isCurB3' }"
                            @click="diaChange2('isCurB3', '3-4 换挡曲线', 3)"
                        >
                            3-4 换挡曲线
                        </div>
                        <div
                            class="dia"
                            v-bind:class="{ isCur: isCurB === 'isCurB4' }"
                            @click="diaChange2('isCurB4', '4-5 换挡曲线', 4)"
                        >
                            4-5 换挡曲线
                        </div>
                        <div
                            class="dia"
                            v-bind:class="{ isCur: isCurB === 'isCurB5' }"
                            @click="diaChange2('isCurB5', '5-6 换挡曲线', 5)"
                        >
                            5-6 换挡曲线
                        </div>
                    </div>
                </div>
            </div>

            <div class="titlePanel">
                <div class="titlePanelBor">制动参数</div>
            </div>

            <div class="flexBox">
                <!-- <el-form-item label="制动类型:" prop="brakeType">
                    <el-select v-model="form.brakeType">
                        <el-option
                            v-for="item in brakeTypeList"
                            :label="item.caption"
                            :value="item.code"
                            :key="item.code"
                        >
                        </el-option>
                    </el-select>
                </el-form-item> -->
                <el-form-item
                    label="前轮制动力矩(N·m/Mpa):"
                    prop="frontLeftWheelBrakingTorque"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontLeftWheelBrakingTorque',
                        }"
                        v-model="form.frontLeftWheelBrakingTorque"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="后轮制动力矩(N·m/Mpa):"
                    prop="rearLeftWheelBrakingTorque"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'rearLeftWheelBrakingTorque',
                        }"
                        v-model="form.rearLeftWheelBrakingTorque"
                    >
                    </el-input>
                </el-form-item>
                <!-- <el-form-item
                    label="右前轮制动力矩(N·m/Mpa):"
                    prop="frontRightWheelBrakingTorque"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontRightWheelBrakingTorque',
                        }"
                        v-model="form.frontRightWheelBrakingTorque"
                    >
                    </el-input>
                </el-form-item> -->
                <!-- <el-form-item
                    label="右后轮制动力矩(N·m/Mpa):"
                    prop="rearRightWheelBrakingTorque"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'rearRightWheelBrakingTorque',
                        }"
                        v-model="form.rearRightWheelBrakingTorque"
                    >
                    </el-input>
                </el-form-item> -->
            </div>

            <div class="titlePanel">
                <div class="titlePanelBor">转向参数</div>
            </div>

            <div class="flexBox">
                <el-form-item label="转向类型:" prop="steeringType">
                    <el-select v-model="form.steeringType" disabled>
                        <el-option
                            v-for="item in steeringTypeList"
                            :label="item.caption"
                            :value="item.code"
                            :key="item.code"
                        >
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="转向器类型:" prop="steeringGearType">
                    <el-select v-model="form.steeringGearType" disabled>
                        <el-option
                            v-for="item in steeringGearTypeList"
                            :label="item.caption"
                            :value="item.code"
                            :key="item.code"
                        >
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item
                    label="转向器传动比(mm/rev):"
                    prop="steeringGearRatio"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'steeringGearRatio' }"
                        v-model="form.steeringGearRatio"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div class="dialogBtnBox">
                <div
                    class="dia dia2"
                    v-bind:class="{ isCur: isCurC === 'isCurC' }"
                    @click="
                        diaChange3('isCurC', '车轮转角与转向器输出的关系曲线')
                    "
                >
                    车轮转角与转向器输出的关系曲线
                </div>
            </div>

            <div class="titlePanelA">
                <div class="titlePanelABor">
                    <i class="el-icon-s-help"></i>
                    <span>轮胎</span>
                </div>
            </div>

            <div class="myTabsBox myTabsBoxFourTabs">
                <el-tabs
                    v-model="activeName"
                    type="card"
                    @tab-click="pageControl"
                >
                    <el-tab-pane label="左前轮" name="1"></el-tab-pane>
                    <el-tab-pane label="左后轮" name="2"></el-tab-pane>
                    <el-tab-pane label="右前轮" name="3"></el-tab-pane>
                    <el-tab-pane label="右后轮" name="4"></el-tab-pane>
                </el-tabs>
            </div>
            <div v-show="activeName === '1'" class="flexBox">
                <el-form-item
                    label="有效滚动半径(mm):"
                    prop="frontLeftWheelEffectiveRollingRadius"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontLeftWheelEffectiveRollingRadius',
                        }"
                        v-model="form.frontLeftWheelEffectiveRollingRadius"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="滚动阻力系数:"
                    prop="frontLeftWheelRollingResistanceCoefficient"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontLeftWheelRollingResistanceCoefficient',
                        }"
                        v-model="
                            form.frontLeftWheelRollingResistanceCoefficient
                        "
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="自由半径(mm):"
                    prop="frontLeftWheelFreeRadius"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontLeftWheelFreeRadius',
                        }"
                        v-model="form.frontLeftWheelFreeRadius"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div v-show="activeName === '2'" class="flexBox">
                <el-form-item
                    label="有效滚动半径(mm):"
                    prop="rearLeftWheelEffectiveRollingRadius"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'rearLeftWheelEffectiveRollingRadius',
                        }"
                        v-model="form.rearLeftWheelEffectiveRollingRadius"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="滚动阻力系数:"
                    prop="rearLeftWheelRollingResistanceCoefficient"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'rearLeftWheelRollingResistanceCoefficient',
                        }"
                        v-model="form.rearLeftWheelRollingResistanceCoefficient"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="自由半径(mm):"
                    prop="rearLeftWheelFreeRadius"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'rearLeftWheelFreeRadius',
                        }"
                        v-model="form.rearLeftWheelFreeRadius"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div v-show="activeName === '3'" class="flexBox">
                <el-form-item
                    label="有效滚动半径(mm):"
                    prop="frontRightWheelEffectiveRollingRadius"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontRightWheelEffectiveRollingRadius',
                        }"
                        v-model="form.frontRightWheelEffectiveRollingRadius"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="滚动阻力系数:"
                    prop="frontRightWheelRollingResistanceCoefficient"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontRightWheelRollingResistanceCoefficient',
                        }"
                        v-model="
                            form.frontRightWheelRollingResistanceCoefficient
                        "
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="自由半径(mm):"
                    prop="frontRightWheelFreeRadius"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontRightWheelFreeRadius',
                        }"
                        v-model="form.frontRightWheelFreeRadius"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div v-show="activeName === '4'" class="flexBox">
                <el-form-item
                    label="有效滚动半径(mm):"
                    prop="rearRightWheelEffectiveRollingRadius"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'rearRightWheelEffectiveRollingRadius',
                        }"
                        v-model="form.rearRightWheelEffectiveRollingRadius"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="滚动阻力系数:"
                    prop="rearRightWheelRollingResistanceCoefficient"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'rearRightWheelRollingResistanceCoefficient',
                        }"
                        v-model="
                            form.rearRightWheelRollingResistanceCoefficient
                        "
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="自由半径(mm):"
                    prop="rearRightWheelFreeRadius"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'rearRightWheelFreeRadius',
                        }"
                        v-model="form.rearRightWheelFreeRadius"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div class="dialogBtnBox flexBox">
                <div
                    class="dia"
                    v-bind:class="{ isCur: isCur === 'isCur1' }"
                    @click="
                        diaChange(
                            'isCur1',
                            '不同载荷下轮胎回正力矩和侧偏角的关系曲线',
                            1
                        )
                    "
                >
                    不同载荷下轮胎回正力矩和侧偏角的关系曲线
                </div>
                <div
                    class="dia"
                    v-bind:class="{ isCur: isCur === 'isCur2' }"
                    @click="
                        diaChange(
                            'isCur2',
                            '不同载荷下轮胎侧向力和侧偏角的关系曲线',
                            2
                        )
                    "
                >
                    不同载荷下轮胎侧向力和侧偏角的关系曲线
                </div>
                <div
                    class="dia"
                    v-bind:class="{ isCur: isCur === 'isCur3' }"
                    @click="
                        diaChange(
                            'isCur3',
                            '不同载荷下轮胎纵向力和滑移率的关系曲线',
                            3
                        )
                    "
                >
                    不同载荷下轮胎纵向力和滑移率的关系曲线
                </div>
            </div>

            <div class="titlePanelA">
                <div class="titlePanelABor">
                    <i class="el-icon-s-ticket"></i>
                    <span>悬架</span>
                </div>
            </div>

            <div class="myTabsBox myTabsBoxFourTabs">
                <el-tabs
                    v-model="activeName2"
                    type="card"
                    @tab-click="pageControl2"
                >
                    <el-tab-pane label="前轮" name="1"></el-tab-pane>
                    <el-tab-pane label="后轮" name="2"></el-tab-pane>
                </el-tabs>
            </div>

            <div v-show="activeName2 === '1'" class="flexBox">
                <el-form-item label="悬架类型:" prop="frontWheelSuspensionType">
                    <el-select v-model="form.frontWheelSuspensionType" disabled>
                        <el-option
                            v-for="item in suspensionTypeList"
                            :label="item.caption"
                            :value="item.code"
                            :key="item.code"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item
                    label="悬架运动学系数:"
                    prop="frontWheelSuspensionKinematicsCoefficient"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontWheelSuspensionKinematicsCoefficient',
                        }"
                        v-model="form.frontWheelSuspensionKinematicsCoefficient"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="簧下质量(kg):"
                    prop="frontWheelUnsprungMass"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'frontWheelUnsprungMass',
                        }"
                        v-model="form.frontWheelUnsprungMass"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="轮距(mm):" prop="frontWheelTrackWidth">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'frontWheelTrackWidth' }"
                        v-model="form.frontWheelTrackWidth"
                    >
                    </el-input>
                </el-form-item>
            </div>

            <div v-show="activeName2 === '2'" class="flexBox">
                <el-form-item label="悬架类型:" prop="rearWheelSuspensionType">
                    <el-select v-model="form.rearWheelSuspensionType" disabled>
                        <el-option
                            v-for="item in suspensionTypeList"
                            :label="item.caption"
                            :value="item.code"
                            :key="item.code"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item
                    label="悬架运动学系数:"
                    prop="rearWheelSuspensionKinematicsCoefficient"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{
                            obj: form,
                            key: 'rearWheelSuspensionKinematicsCoefficient',
                        }"
                        v-model="form.rearWheelSuspensionKinematicsCoefficient"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item
                    label="簧下质量(kg):"
                    prop="rearWheelUnsprungMass"
                >
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'rearWheelUnsprungMass' }"
                        v-model="form.rearWheelUnsprungMass"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="轮距(mm):" prop="rearWheelTrackWidth">
                    <el-input
                        placeholder="请输入"
                        maxlength="12"
                        v-autoTrim="{ obj: form, key: 'rearWheelTrackWidth' }"
                        v-model="form.rearWheelTrackWidth"
                    >
                    </el-input>
                </el-form-item>
            </div>
        </el-form>

        <el-dialog
            v-if="diaVisible"
            :title="diaTitle"
            :visible.sync="diaVisible"
            width="90%"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            :before-close="diaCancel"
        >
            <div class="diaContentBox">
                <div class="diaContent chartBox chartBox1">
                    <line-chart
                        :id="'carsimChartA' + chartIndex"
                        :dataList="getDataWay1.data"
                        :columns="columns1"
                        :xName="xName"
                        :yName="yName"
                    >
                    </line-chart>
                </div>
                <div class="diaContent tableBox">
                    <tableList
                        :columns="columns1"
                        :getDataWay="getDataWay1"
                        :propMaxHeight="propMaxHeight"
                        :indexFixed="true"
                        style="margin: 0 -10px 15px -10px"
                        index
                        >
                        <!-- 
                            :indexFixed="true"
                            propHeight="300"
                            propMaxHeight="calc(85vh - 294px)"
                        -->
                        <el-table-column
                            v-for="(column, index) in columns1"
                            :key="`col_${index}`"
                            :slot="column.prop"
                            :label="column.label"
                            align="center"
                            min-width="120"
                        >
                            <template v-slot="scope">
                                <el-input
                                    maxlength="12"
                                    placeholder="请输入"
                                    v-autoTrim="{
                                        obj: scope.row,
                                        key: `${column.prop}`,
                                    }"
                                    v-model="scope.row[`${column.prop}`]"
                                ></el-input>
                            </template>
                        </el-table-column>
                    </tableList>
                    <el-form
                        ref="form1"
                        key="1"
                        :model="form1"
                        :rules="rules1"
                        label-width="60px"
                        class="handleForm"
                    >
                        <div class="flexBox">
                            <el-form-item label="行数:" prop="a">
                                <el-input
                                    placeholder="请输入"
                                    maxlength="12"
                                    v-autoTrim="{ obj: form1, key: 'a' }"
                                    v-model="form1.a"
                                    @change="handleChang"
                                >
                                </el-input>
                            </el-form-item>
                            <el-form-item label="列数:" prop="b">
                                <el-input
                                    placeholder="请输入"
                                    maxlength="12"
                                    v-autoTrim="{ obj: form1, key: 'b' }"
                                    v-model="form1.b"
                                    @change="handleChang"
                                >
                                </el-input>
                            </el-form-item>
                        </div>
                    </el-form>
                    <div>
                        <upload
                            ref="upload"
                            :multiple="false"
                            @attachmentChange="attachmentChange1"
                        ></upload>
                    </div>
                </div>
            </div>
            <span slot="footer">
                <el-button type="primary" @click="diaSave">保 存</el-button>
                <el-button @click="diaCancel">取 消</el-button>
            </span>
        </el-dialog>

        <el-dialog
            v-if="diaVisible1"
            :title="diaTitle1"
            :visible.sync="diaVisible1"
            width="90%"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            :before-close="diaCancel1"
        >
            <div class="diaContentBox">
                <div class="diaContent chartBox chartBox1">
                    <line-chart-a
                        :id="'carsimChartB' + chartIndex"
                        :dataList="getDataWay2.data"
                        :dataListA="getDataWay2A.data"
                        :columns="columns2"
                    >
                    </line-chart-a>
                </div>
                <div class="diaContent tableBox">
                    <div class="tipName">升挡</div>
                    <tableList
                        :columns="columns2"
                        :getDataWay="getDataWay2"
                        :propMaxHeight="propMaxHeight"
                        :indexFixed="true"
                        style="margin: 0 -10px 15px -10px"
                        index
                    >
                        <el-table-column
                            v-for="(column, index) in columns2"
                            :key="`col_${index}`"
                            :slot="column.prop"
                            :label="column.label"
                            align="center"
                        >
                            <template v-slot="scope">
                                <el-input
                                    maxlength="12"
                                    placeholder="请输入"
                                    v-autoTrim="{
                                        obj: scope.row,
                                        key: `${column.prop}`,
                                    }"
                                    v-model="scope.row[`${column.prop}`]"
                                ></el-input>
                            </template>
                        </el-table-column>
                    </tableList>
                    <el-form
                        ref="form2"
                        :model="form2"
                        :rules="rules2"
                        label-width="60px"
                        class="handleForm"
                    >
                        <div class="flexBox">
                            <el-form-item label="行数:" prop="a">
                                <el-input
                                    placeholder="请输入"
                                    maxlength="12"
                                    v-autoTrim="{ obj: form2, key: 'a' }"
                                    v-model="form2.a"
                                    @change="handleChang1('2')"
                                >
                                </el-input>
                            </el-form-item>
                        </div>
                    </el-form>
                    <div class="marBot20">
                        <upload
                            ref="upload"
                            :multiple="false"
                            @attachmentChange="attachmentChange2"
                        ></upload>
                    </div>

                    <div class="tipName">降挡</div>
                    <tableList
                        :columns="columns2A"
                        :getDataWay="getDataWay2A"
                        :propMaxHeight="propMaxHeight"
                        :indexFixed="true"
                        style="margin: 0 -10px 15px -10px"
                        index
                    >
                        <el-table-column
                            v-for="(column, index) in columns2A"
                            :key="`col_${index}`"
                            :slot="column.prop"
                            :label="column.label"
                            align="center"
                        >
                            <template v-slot="scope">
                                <el-input
                                    maxlength="12"
                                    placeholder="请输入"
                                    v-autoTrim="{
                                        obj: scope.row,
                                        key: `${column.prop}`,
                                    }"
                                    v-model="scope.row[`${column.prop}`]"
                                ></el-input>
                            </template>
                        </el-table-column>
                    </tableList>
                    <el-form
                        ref="form2A"
                        :model="form2A"
                        :rules="rules2A"
                        label-width="60px"
                        class="handleForm"
                    >
                        <div class="flexBox">
                            <el-form-item label="行数:" prop="a">
                                <el-input
                                    placeholder="请输入"
                                    maxlength="12"
                                    v-autoTrim="{ obj: form2A, key: 'a' }"
                                    v-model="form2A.a"
                                    @change="handleChang1('2A')"
                                >
                                </el-input>
                            </el-form-item>
                        </div>
                    </el-form>
                    <div>
                        <upload
                            ref="upload1"
                            :multiple="false"
                            @attachmentChange="attachmentChange2A"
                        ></upload>
                    </div>
                </div>
            </div>
            <span slot="footer">
                <el-button type="primary" @click="diaSave1">保 存</el-button>
                <el-button @click="diaCancel1">取 消</el-button>
            </span>
        </el-dialog>

        <el-dialog
            v-if="diaVisible2"
            :title="diaTitle2"
            :visible.sync="diaVisible2"
            width="90%"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            :before-close="diaCancel2"
        >
            <div class="diaContentBox">
                <div class="diaContent chartBox">
                    <div class="diaLineTitle">右轮转角与转向器输出的关系</div>
                    <line-chart-b
                        key="carsimChartC"
                        :id="'carsimChartC' + chartIndex"
                        :dataList="getDataWay3.data"
                        :columns="columns3"
                        xName="齿条位移(mm)"
                        yName="右轮转角(deg)"
                    >
                    </line-chart-b>
                </div>
                <div class="diaContent tableBox">
                    <tableList
                        :columns="columns3"
                        :getDataWay="getDataWay3"
                        :propMaxHeight="propMaxHeight"
                        :indexFixed="true"
                        style="margin: 0 -10px 15px -10px"
                        index
                    >
                        <el-table-column
                            v-for="(column, index) in columns3"
                            :key="`col_${index}`"
                            :slot="column.prop"
                            :label="column.label"
                            align="center"
                        >
                            <template v-slot="scope">
                                <el-input
                                    maxlength="12"
                                    placeholder="请输入"
                                    v-autoTrim="{
                                        obj: scope.row,
                                        key: `${column.prop}`,
                                    }"
                                    v-model="scope.row[`${column.prop}`]"
                                ></el-input>
                            </template>
                        </el-table-column>
                    </tableList>
                    <el-form
                        ref="form3"
                        :model="form3"
                        :rules="rules3"
                        label-width="60px"
                        class="handleForm"
                    >
                        <div class="flexBox">
                            <el-form-item label="行数:" prop="a">
                                <el-input
                                    placeholder="请输入"
                                    maxlength="12"
                                    v-autoTrim="{ obj: form3, key: 'a' }"
                                    v-model="form3.a"
                                    @change="handleChang1('3')"
                                >
                                </el-input>
                            </el-form-item>
                        </div>
                    </el-form>
                    <div class="marBot20">
                        <upload
                            ref="upload"
                            :multiple="false"
                            @attachmentChange="attachmentChange3"
                        ></upload>
                    </div>
                </div>
            </div>
            <div class="diaContentBox">
                <div class="diaContent chartBox">
                    <div class="diaLineTitle">左轮转角与转向器输出的关系</div>
                    <line-chart-b
                        key="carsimChartD"
                        :id="'carsimChartD' + chartIndex"
                        :dataList="getDataWay3A.data"
                        :columns="columns3A"
                        xName="齿条位移(mm)"
                        yName="左轮转角(deg)"
                    >
                    </line-chart-b>
                </div>
                <div class="diaContent tableBox">
                    <tableList
                        :columns="columns3A"
                        :getDataWay="getDataWay3A"
                        :propMaxHeight="propMaxHeight"
                        :indexFixed="true"
                        style="margin: 0 -10px 15px -10px"
                        index
                    >
                        <el-table-column
                            v-for="(column, index) in columns3A"
                            :key="`col_${index}`"
                            :slot="column.prop"
                            :label="column.label"
                            align="center"
                        >
                            <template v-slot="scope">
                                <el-input
                                    maxlength="12"
                                    placeholder="请输入"
                                    v-autoTrim="{
                                        obj: scope.row,
                                        key: `${column.prop}`,
                                    }"
                                    v-model="scope.row[`${column.prop}`]"
                                ></el-input>
                            </template>
                        </el-table-column>
                    </tableList>
                    <el-form
                        ref="form3"
                        :model="form3A"
                        :rules="rules3A"
                        label-width="60px"
                        class="handleForm"
                    >
                        <div class="flexBox">
                            <el-form-item label="行数:" prop="a">
                                <el-input
                                    placeholder="请输入"
                                    maxlength="12"
                                    v-autoTrim="{ obj: form3A, key: 'a' }"
                                    v-model="form3A.a"
                                    @change="handleChang1('3A')"
                                >
                                </el-input>
                            </el-form-item>
                        </div>
                    </el-form>
                    <div>
                        <upload
                            ref="upload1"
                            :multiple="false"
                            @attachmentChange="attachmentChange3A"
                        ></upload>
                    </div>
                </div>
            </div>
            <span slot="footer">
                <el-button type="primary" @click="diaSave2">保 存</el-button>
                <el-button @click="diaCancel2">取 消</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import tableList from "@/components/grid/TableList";
import lineChart from "@/components/echarts/lineChartCarsim";
import lineChartA from "@/components/echarts/lineChartCarsimA";
import lineChartB from "@/components/echarts/lineChartCarsimB";
import upload from "./upload.vue";

export default {
    name: "vehicleModelCarsim", // 车辆模型-Carsim
    components: { tableList, lineChart, lineChartA, lineChartB, upload },
    data() {
        // 校验非负且最多4位小数
        let validateNum = (rule, value, callback) => {
            !/^(0|[1-9][0-9]*)(\.\d{1,4})?$/.test(value) &&
                callback(new Error(rule.message));
            callback();
        };

        // 校验不大于1
        let validateNoMore1 = (rule, value, callback) => {
            if (value > 1) {
                callback(new Error(rule.message));
                return;
            }
            callback();
        };

        return {
            imgSrc: require("@/assets/common/image/others/carsimFont.png"),
            form: {
                vehicleLength: "", // 车辆长度
                sprungMass: "", // 簧上质量
                vehicleWidth: "", // 车辆宽度
                rotationalInertiaX: "", // 整车绕X轴转动惯量
                rotationalInertiaY: "", // 整车绕Y轴转动惯量
                rotationalInertiaZ: "", // 整车绕Z轴转动惯量

                wheelCenterToTop: "", // 轮胎中心到车顶的高度
                wheelCenterToGround: "", // 轮胎中心到地面的高度
                centroidToFrontWheelCenter: "", // 质心到前轮中心的距离
                centroidToGround: "", // 质心到地面的高度
                wheelbase: "", // 轴距

                frontLeftWheelEffectiveRollingRadius: "", // 左前轮-有效滚动半径
                frontLeftWheelRollingResistanceCoefficient: "", // 左前轮-滚动阻力系数
                frontLeftWheelFreeRadius: "", // 左前轮-自由半径
                rearLeftWheelEffectiveRollingRadius: "", // 左后轮-有效滚动半径
                rearLeftWheelRollingResistanceCoefficient: "", // 左后轮-滚动阻力系数
                rearLeftWheelFreeRadius: "", // 左后轮-自由半径
                frontRightWheelEffectiveRollingRadius: "", // 右前轮-有效滚动半径
                frontRightWheelRollingResistanceCoefficient: "", // 右前轮-滚动阻力系数
                frontRightWheelFreeRadius: "", // 右前轮-自由半径
                rearRightWheelEffectiveRollingRadius: "", // 右后轮-有效滚动半径
                rearRightWheelRollingResistanceCoefficient: "", // 右后轮-滚动阻力系数
                rearRightWheelFreeRadius: "", // 右后轮-自由半径

                frontLeftWheelRelationCurvePositiveMomentAndSideslipAngle: [], // 左前轮不同载荷下轮胎回正力矩和侧偏角的关系曲线
                frontLeftWheelRelationCurveLateralForceAndSideslipAngle: [], // 左前轮不同载荷下轮胎侧向力和侧偏角的关系曲线
                frontLeftWheelRelationCurveLongitudinalForceAndSideslipAngle:
                    [], // 左前轮不同载荷下轮胎纵向力和滑移率的关系曲线
                rearLeftWheelRelationCurvePositiveMomentAndSideslipAngle: [], // 左后轮不同载荷下轮胎回正力矩和侧偏角的关系曲线
                rearLeftWheelRelationCurveLateralForceAndSideslipAngle: [], // 左后轮不同载荷下轮胎侧向力和侧偏角的关系曲线
                rearLeftWheelRelationCurveLongitudinalForceAndSideslipAngle: [], // 左后轮不同载荷下轮胎纵向力和滑移率的关系曲线
                frontRightWheelRelationCurvePositiveMomentAndSideslipAngle: [], // 右前轮不同载荷下轮胎回正力矩和侧偏角的关系曲线
                frontRightWheelRelationCurveLateralForceAndSideslipAngle: [], // 右前轮不同载荷下轮胎侧向力和侧偏角的关系曲线
                frontRightWheelRelationCurveLongitudinalForceAndSideslipAngle:
                    [], // 右前轮不同载荷下轮胎纵向力和滑移率的关系曲线
                rearRightWheelRelationCurvePositiveMomentAndSideslipAngle: [], // 右后轮不同载荷下轮胎回正力矩和侧偏角的关系曲线
                rearRightWheelRelationCurveLateralForceAndSideslipAngle: [], // 右后轮不同载荷下轮胎侧向力和侧偏角的关系曲线
                rearRightWheelRelationCurveLongitudinalForceAndSideslipAngle:
                    [], // 右后轮不同载荷下轮胎纵向力和滑移率的关系曲线

                frontWheelSuspensionType: "1", // 前轮-悬架类型
                frontWheelSuspensionKinematicsCoefficient: "", // 前轮-悬架运动学系数
                frontWheelUnsprungMass: "", // 前轮-簧下质量
                frontWheelTrackWidth: "", // 前轮-轮距
                rearWheelSuspensionType: "1", // 后轮-悬架类型
                rearWheelSuspensionKinematicsCoefficient: "", // 后轮-悬架运动学系数
                rearWheelUnsprungMass: "", // 后轮-簧下质量
                rearWheelTrackWidth: "", // 后轮-轮距

                windwardArea: "", // 迎风面积
                airDensity: "", // 空气密度

                engineCrankshaftMomentInertia: "", // 发动机曲轴转动惯量
                idleSpeed: "", // 怠速转速
                driverType: "1", // 驱动类型

                relationCurveEngineTorqueSpeedAndThrottleOpening: [], // 发动机扭矩、转速和节气门开的度关系曲线

                momentInertiaInputShaft: "", // 输入轴转动惯量
                momentInertiaOutputShaft: "", // 输出轴转动惯量

                finalDriveRatio: "", // 主减速器传动比
                transmissionEfficiency: "", // 传动效率

                gearRatio: [], // R,N,1,2,3,4,5,6
                inertia: [], // R,N,1,2,3,4,5,6
                driving: [], // R,N,1,2,3,4,5,6
                coasting: [], // R,N,1,2,3,4,5,6

                shiftTime: "", // 换挡时间（S）

                shiftTimeUp12: [],
                shiftTimeDown12: [],
                shiftTimeUp23: [],
                shiftTimeDown23: [],
                shiftTimeUp34: [],
                shiftTimeDown34: [],
                shiftTimeUp45: [],
                shiftTimeDown45: [],
                shiftTimeUp56: [],
                shiftTimeDown56: [],

                // brakeType: "", // 制动类型
                frontLeftWheelBrakingTorque: "", // 前轮制动力矩
                rearLeftWheelBrakingTorque: "", // 后轮制动力矩
                // frontRightWheelBrakingTorque: "", // 右前轮制动力矩
                // rearRightWheelBrakingTorque: "", // 右后轮制动力矩

                steeringType: "1", // 转向类型
                steeringGearType: "1", // 转向器类型
                steeringGearRatio: "", // 转向器传动比

                relationCurveRightWheelAngleAndSteeringGearOutput: [], // 右轮转角与转向器输出的关系
                relationCurveLeftWheelAngleAndSteeringGearOutput: [], // 左轮转角与转向器输出的关系
            },
            rules: {
                vehicleLength: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                sprungMass: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                vehicleWidth: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rotationalInertiaX: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rotationalInertiaY: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rotationalInertiaZ: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],

                wheelCenterToTop: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                wheelCenterToGround: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                centroidToFrontWheelCenter: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                centroidToGround: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                wheelbase: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],

                frontLeftWheelEffectiveRollingRadius: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                frontLeftWheelRollingResistanceCoefficient: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                frontLeftWheelFreeRadius: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearLeftWheelEffectiveRollingRadius: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearLeftWheelRollingResistanceCoefficient: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearLeftWheelFreeRadius: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                frontRightWheelEffectiveRollingRadius: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                frontRightWheelRollingResistanceCoefficient: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                frontRightWheelFreeRadius: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearRightWheelEffectiveRollingRadius: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearRightWheelRollingResistanceCoefficient: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearRightWheelFreeRadius: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],

                frontWheelSuspensionType: [
                    { required: true, message: "请选择", trigger: "change" },
                ],
                frontWheelSuspensionKinematicsCoefficient: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                frontWheelUnsprungMass: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                frontWheelTrackWidth: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearWheelSuspensionType: [
                    { required: true, message: "请输入", trigger: "change" },
                ],
                rearWheelSuspensionKinematicsCoefficient: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearWheelUnsprungMass: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearWheelTrackWidth: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],

                windwardArea: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                airDensity: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],

                engineCrankshaftMomentInertia: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                idleSpeed: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                driverType: [
                    { required: true, message: "请选择", trigger: "change" },
                ],

                momentInertiaInputShaft: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                momentInertiaOutputShaft: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],

                finalDriveRatio: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                transmissionEfficiency: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNoMore1,
                        message: "请输入不大于1的非负数",
                        trigger: ["blur"],
                    },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],

                shiftTime: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],

                // brakeType: [
                //     { required: true, message: "请选择", trigger: "change" },
                // ],
                frontLeftWheelBrakingTorque: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                rearLeftWheelBrakingTorque: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
                // frontRightWheelBrakingTorque: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // rearRightWheelBrakingTorque: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],

                steeringType: [
                    { required: true, message: "请选择", trigger: "change" },
                ],
                steeringGearType: [
                    { required: true, message: "请选择", trigger: "change" },
                ],
                steeringGearRatio: [
                    { required: true, message: "请输入", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入最多带有4位小数的非负数",
                        trigger: ["blur"],
                    },
                ],
            },
            activeName: "1",
            activeName2: "1",
            isCur: "", // 轮胎下的样式控制
            isCurA: "", // 发动机下的样式控制
            isCurB: "", // 各挡位换挡曲线
            isCurC: "", // 各挡位换挡曲线
            columns: [
                {
                    label: "",
                    prop: "a",
                },
                {
                    label: "传动比",
                    prop: "gearRatio",
                    template: true,
                },
                {
                    label: "转动惯量(kg·m²)",
                    prop: "inertia",
                    template: true,
                },
                {
                    label: "传动效率",
                    prop: "driving",
                    template: true,
                },
                {
                    label: "滑行效率",
                    prop: "coasting",
                    template: true,
                },
            ],
            columns1: [],
            columns2: [],
            columns2A: [],
            columns3: [],
            columns3A: [],
            getDataWay: {
                //加载表格数据
                dataType: "data",
                type: "post",
                data: [
                    {
                        a: "倒挡",
                        gearRatio: "",
                        inertia: "",
                        driving: "",
                        coasting: "",
                    },
                    {
                        a: "空挡",
                        gearRatio: "/",
                        inertia: "",
                        driving: "/",
                        coasting: "/",
                    },
                    {
                        a: "1挡",
                        gearRatio: "",
                        inertia: "",
                        driving: "",
                        coasting: "",
                    },
                    {
                        a: "2挡",
                        gearRatio: "",
                        inertia: "",
                        driving: "",
                        coasting: "",
                    },
                    {
                        a: "3挡",
                        gearRatio: "",
                        inertia: "",
                        driving: "",
                        coasting: "",
                    },
                    {
                        a: "4挡",
                        gearRatio: "",
                        inertia: "",
                        driving: "",
                        coasting: "",
                    },
                    {
                        a: "5挡",
                        gearRatio: "",
                        inertia: "",
                        driving: "",
                        coasting: "",
                    },
                    {
                        a: "6挡",
                        gearRatio: "",
                        inertia: "",
                        driving: "",
                        coasting: "",
                    },
                ],
                param: {},
            },
            getDataWay1: {
                //加载表格数据
                dataType: "data",
                type: "post",
                data: [],
                param: {},
            },
            getDataWay2: {
                //加载表格数据
                dataType: "data",
                type: "post",
                data: [],
                param: {},
            },
            getDataWay2A: {
                //加载表格数据
                dataType: "data",
                type: "post",
                data: [],
                param: {},
            },
            getDataWay3: {
                //加载表格数据
                dataType: "data",
                type: "post",
                data: [],
                param: {},
            },
            getDataWay3A: {
                //加载表格数据
                dataType: "data",
                type: "post",
                data: [],
                param: {},
            },
            diaTitle: "",
            diaTitle1: "",
            diaTitle2: "",
            diaVisible: false,
            diaVisible1: false,
            diaVisible2: false,
            form1: {
                a: "",
                b: "",
            },
            form2: {
                a: "",
            },
            form2A: {
                a: "",
            },
            form3: {
                a: "",
            },
            form3A: {
                a: "",
            },
            rules1: {},
            rules2: {},
            rules2A: {},
            rules3: {},
            rules3A: {},
            file: "",
            file1: "",
            chartIndex: 0, // 配合每个echarts有不同的id
            dia1Type: 0, // 判断可输入多y轴数据的dialog类型
            dia2Type: 0, // 判断可输入单y轴数据的dialog类型
            // xName: "", // 图表x轴name
            // yName: "", // 图表y轴name
            propMaxHeight: 300, // table最大高度
        };
    },

    props: {
        suspensionTypeList: {
            default: function () {
                return [];
            },
            type: Array,
        },
        brakeTypeList: {
            default: function () {
                return [];
            },
            type: Array,
        },
        steeringTypeList: {
            default: function () {
                return [];
            },
            type: Array,
        },
        steeringGearTypeList: {
            default: function () {
                return [];
            },
            type: Array,
        },
        driverTypeList: {
            default: function () {
                return [];
            },
            type: Array,
        },
    },

    computed: {
        // 图表x轴name
        xName() {
            switch (this.dia1Type) {
                case 1:
                    return "侧偏角(deg)";
                    break;
                case 2:
                    return "侧偏角(deg)";
                    break;
                case 3:
                    return "滑移率(kappa)";
                    break;
                case 4:
                    return "发动机转速(rpm)";
                    break;
                default:
                    return "";
                    break;
            }
        },
        // 图表y轴name
        yName() {
            switch (this.dia1Type) {
                case 1:
                    return "回正力矩(N·m)";
                    break;
                case 2:
                    return "侧向力(N)";
                    break;
                case 3:
                    return "纵向力(N)";
                    break;
                case 4:
                    return "发动机扭矩(N·m)";
                    break;
                default:
                    return "";
                    break;
            }
        },
    },

    methods: {
        pageControl(data) {
            this.activeName = data.name;
        },
        pageControl2(data) {
            this.activeName2 = data.name;
        },
        arrToData(arr, s = "") {
            if (Array.isArray(arr) && arr.length > 0) {
                if (s) {
                    this[`getDataWay${s}`].data = this.attachmentHandle(arr);
                } else {
                    this.attachmentChange1(arr);
                }
            }
        },
        /**
         *
         * @param {*} v 样式
         * @param {*} t title
         * @param {*} d data
         */
        diaChange(v, t, d) {
            this.diaTitle = t;
            this.isCur = v;
            this.chartIndex++;

            this.dia1Type = d;

            switch (this.activeName) {
                case "1":
                    if (d === 1) {
                        this.arrToData(
                            this.form
                                .frontLeftWheelRelationCurvePositiveMomentAndSideslipAngle
                        );
                    } else if (d === 2) {
                        this.arrToData(
                            this.form
                                .frontLeftWheelRelationCurveLateralForceAndSideslipAngle
                        );
                    } else if (d === 3) {
                        this.arrToData(
                            this.form
                                .frontLeftWheelRelationCurveLongitudinalForceAndSideslipAngle
                        );
                    }
                    break;
                case "2":
                    if (d === 1) {
                        this.arrToData(
                            this.form
                                .rearLeftWheelRelationCurvePositiveMomentAndSideslipAngle
                        );
                    } else if (d === 2) {
                        this.arrToData(
                            this.form
                                .rearLeftWheelRelationCurveLateralForceAndSideslipAngle
                        );
                    } else if (d === 3) {
                        this.arrToData(
                            this.form
                                .rearLeftWheelRelationCurveLongitudinalForceAndSideslipAngle
                        );
                    }
                    break;
                case "3":
                    if (d === 1) {
                        this.arrToData(
                            this.form
                                .frontRightWheelRelationCurvePositiveMomentAndSideslipAngle
                        );
                    } else if (d === 2) {
                        this.arrToData(
                            this.form
                                .frontRightWheelRelationCurveLateralForceAndSideslipAngle
                        );
                    } else if (d === 3) {
                        this.arrToData(
                            this.form
                                .frontRightWheelRelationCurveLongitudinalForceAndSideslipAngle
                        );
                    }
                    break;
                case "4":
                    if (d === 1) {
                        this.arrToData(
                            this.form
                                .rearRightWheelRelationCurvePositiveMomentAndSideslipAngle
                        );
                    } else if (d === 2) {
                        this.arrToData(
                            this.form
                                .rearRightWheelRelationCurveLateralForceAndSideslipAngle
                        );
                    } else if (d === 3) {
                        this.arrToData(
                            this.form
                                .rearRightWheelRelationCurveLongitudinalForceAndSideslipAngle
                        );
                    }
                    break;
                default:
                    break;
            }

            if (this.getDataWay1.data.length === 0) {
                this.columns1 = this.getDefaultArr("columnsOri1");
                this.getDataWay1.data = this.getDefaultArr("defaultArr1");
            }

            this.form1 = {
                a: "",
                b: "",
            };

            this.diaVisible = true;
        },
        diaChange1(v, t, d) {
            this.diaTitle = t;
            this.isCurA = v;
            this.chartIndex++;

            this.dia1Type = d;

            this.arrToData(
                this.form.relationCurveEngineTorqueSpeedAndThrottleOpening
            );

            if (this.getDataWay1.data.length === 0) {
                this.columns1 = this.getDefaultArr("columnsOri1");
                this.getDataWay1.data = this.getDefaultArr("defaultArr1");
            }

            this.form1 = {
                a: "",
                b: "",
            };

            this.diaVisible = true;
        },
        diaChange2(v, t, d) {
            this.diaTitle1 = t;
            this.isCurB = v;
            this.chartIndex++;

            this.dia2Type = d;

            this.columns2 = this.getDefaultArr("columnsOri2");
            this.columns2A = this.getDefaultArr("columnsOri2");

            switch (d) {
                case 1:
                    this.arrToData(this.form.shiftTimeUp12, "2");
                    this.arrToData(this.form.shiftTimeDown12, "2A");
                    break;
                case 2:
                    this.arrToData(this.form.shiftTimeUp23, "2");
                    this.arrToData(this.form.shiftTimeDown23, "2A");
                    break;
                case 3:
                    this.arrToData(this.form.shiftTimeUp34, "2");
                    this.arrToData(this.form.shiftTimeDown34, "2A");
                    break;
                case 4:
                    this.arrToData(this.form.shiftTimeUp45, "2");
                    this.arrToData(this.form.shiftTimeDown45, "2A");
                    break;
                case 5:
                    this.arrToData(this.form.shiftTimeUp56, "2");
                    this.arrToData(this.form.shiftTimeDown56, "2A");
                    break;
                default:
                    break;
            }

            if (this.getDataWay2.data.length === 0) {
                this.getDataWay2.data = this.getDefaultArr("defaultArr2");
            }

            if (this.getDataWay2A.data.length === 0) {
                this.getDataWay2A.data = this.getDefaultArr("defaultArr2");
            }

            this.form2 = { a: "" };
            this.form2A = { a: "" };

            this.diaVisible1 = true;
        },
        diaChange3(v, t) {
            this.diaTitle2 = t;
            this.isCurC = v;
            this.chartIndex++;

            this.columns3 = this.getDefaultArr("columnsOri2");
            this.columns3A = this.getDefaultArr("columnsOri2");

            this.arrToData(
                this.form.relationCurveRightWheelAngleAndSteeringGearOutput,
                "3"
            );

            this.arrToData(
                this.form.relationCurveLeftWheelAngleAndSteeringGearOutput,
                "3A"
            );

            if (this.getDataWay3.data.length === 0) {
                this.getDataWay3.data = this.getDefaultArr("defaultArr2");
            }

            if (this.getDataWay3A.data.length === 0) {
                this.getDataWay3A.data = this.getDefaultArr("defaultArr2");
            }

            this.form3 = { a: "" };
            this.form3A = { a: "" };

            this.diaVisible2 = true;
        },
        diaSave() {
            let array = this.getDataWay1.data;

            for (let index = 0; index < array.length; index++) {
                const element = array[index];

                let flag = Object.values(element).some((i) => i === "");
                // let flag = Object.values(element).some((i) => i === "" || i == undefined);

                if (flag) {
                    this.$message.error("数据不全，请填写完整");
                    return;
                }
            }

            // if (!this.isSorted(array.map((i) => i.x))) {
            //     this.$message.error("X轴的坐标应逐渐增大");
            //     return;
            // }

            let data = [];

            let labels = [];
            let props = [];

            this.columns1.forEach((i) => {
                labels.push(i.label); // ['X Axis', '1.0', '2.0', '3.0', '4.0']
                props.push(i.prop); // ['x', '1.0', '2.0', '3.0', '4.0']
            });

            data.push(labels);

            array.forEach((i) => {
                let arr = [];
                props.forEach((j) => {
                    arr.push(i[j]);
                });
                data.push(arr);
            });

            let d = this.dia1Type;

            if (d === 4) {
                this.form.relationCurveEngineTorqueSpeedAndThrottleOpening =
                    data;
            } else {
                switch (this.activeName) {
                    case "1":
                        if (d === 1) {
                            this.form.frontLeftWheelRelationCurvePositiveMomentAndSideslipAngle =
                                data;
                        } else if (d === 2) {
                            this.form.frontLeftWheelRelationCurveLateralForceAndSideslipAngle =
                                data;
                        } else if (d === 3) {
                            this.form.frontLeftWheelRelationCurveLongitudinalForceAndSideslipAngle =
                                data;
                        }
                        break;
                    case "2":
                        if (d === 1) {
                            this.form.rearLeftWheelRelationCurvePositiveMomentAndSideslipAngle =
                                data;
                        } else if (d === 2) {
                            this.form.rearLeftWheelRelationCurveLateralForceAndSideslipAngle =
                                data;
                        } else if (d === 3) {
                            this.form.rearLeftWheelRelationCurveLongitudinalForceAndSideslipAngle =
                                data;
                        }
                        break;
                    case "3":
                        if (d === 1) {
                            this.form.frontRightWheelRelationCurvePositiveMomentAndSideslipAngle =
                                data;
                        } else if (d === 2) {
                            this.form.frontRightWheelRelationCurveLateralForceAndSideslipAngle =
                                data;
                        } else if (d === 3) {
                            this.form.frontRightWheelRelationCurveLongitudinalForceAndSideslipAngle =
                                data;
                        }
                        break;
                    case "4":
                        if (d === 1) {
                            this.form.rearRightWheelRelationCurvePositiveMomentAndSideslipAngle =
                                data;
                        } else if (d === 2) {
                            this.form.rearRightWheelRelationCurveLateralForceAndSideslipAngle =
                                data;
                        } else if (d === 3) {
                            this.form.rearRightWheelRelationCurveLongitudinalForceAndSideslipAngle =
                                data;
                        }
                        break;

                    default:
                        break;
                }
            }

            this.diaCancel();
        },
        diaCancel() {
            this.diaVisible = false;

            this.diaTitle = "";
            this.isCur = "";
            this.isCurA = "";

            this.columns1 = [];
            this.getDataWay1.data = [];
        },
        diaSave1() {
            let array = this.getDataWay2.data;

            for (let index = 0; index < array.length; index++) {
                const element = array[index];

                let flag = Object.values(element).some((i) => i === "");

                if (flag) {
                    this.$message.error("数据不全，请填写完整");
                    return;
                }
            }

            let array1 = this.getDataWay2A.data;

            for (let index = 0; index < array1.length; index++) {
                const element = array1[index];

                let flag = Object.values(element).some((i) => i === "");

                if (flag) {
                    this.$message.error("数据不全，请填写完整");
                    return;
                }
            }

            // if (
            //     !this.isSorted(array.map((i) => i.x)) ||
            //     !this.isSorted(array1.map((i) => i.x))
            // ) {
            //     this.$message.error("X轴的坐标应逐渐增大");
            //     return;
            // }

            let data = [];
            data.push(["X Axis", "Y Axis"]);

            array.forEach((i) => {
                data.push([i.x, i.y]);
            });

            let data1 = [];
            data1.push(["X Axis", "Y Axis"]);

            array1.forEach((i) => {
                data1.push([i.x, i.y]);
            });

            switch (this.dia2Type) {
                case 1:
                    this.form.shiftTimeUp12 = data;
                    this.form.shiftTimeDown12 = data1;
                    break;
                case 2:
                    this.form.shiftTimeUp23 = data;
                    this.form.shiftTimeDown23 = data1;
                    break;
                case 3:
                    this.form.shiftTimeUp34 = data;
                    this.form.shiftTimeDown34 = data1;
                    break;
                case 4:
                    this.form.shiftTimeUp45 = data;
                    this.form.shiftTimeDown45 = data1;
                    break;
                case 5:
                    this.form.shiftTimeUp56 = data;
                    this.form.shiftTimeDown56 = data1;
                    break;
                default:
                    break;
            }

            this.diaCancel1();
        },
        diaCancel1() {
            this.diaVisible1 = false;

            this.diaTitle1 = "";
            this.isCurB = "";

            this.columns2 = [];
            this.columns2A = [];
            this.getDataWay2.data = [];
            this.getDataWay2A.data = [];
        },
        diaSave2() {
            let array = this.getDataWay3.data;

            for (let index = 0; index < array.length; index++) {
                const element = array[index];

                let flag = Object.values(element).some((i) => i === "");

                if (flag) {
                    this.$message.error("数据不全，请填写完整");
                    return;
                }
            }

            let array1 = this.getDataWay3A.data;

            for (let index = 0; index < array1.length; index++) {
                const element = array1[index];

                let flag = Object.values(element).some((i) => i === "");

                if (flag) {
                    this.$message.error("数据不全，请填写完整");
                    return;
                }
            }

            // if (
            //     !this.isSorted(array.map((i) => i.x)) ||
            //     !this.isSorted(array1.map((i) => i.x))
            // ) {
            //     this.$message.error("X轴的坐标应逐渐增大");
            //     return;
            // }

            let data = [];
            data.push(["X Axis", "Y Axis"]);

            array.forEach((i) => {
                data.push([i.x, i.y]);
            });

            let data1 = [];
            data1.push(["X Axis", "Y Axis"]);

            array1.forEach((i) => {
                data1.push([i.x, i.y]);
            });

            this.form.relationCurveRightWheelAngleAndSteeringGearOutput = data;
            this.form.relationCurveLeftWheelAngleAndSteeringGearOutput = data1;

            this.diaCancel2();
        },
        diaCancel2() {
            this.diaVisible2 = false;

            this.diaTitle2 = "";
            this.isCurC = "";

            this.columns3 = [];
            this.columns3A = [];
            this.getDataWay3.data = [];
            this.getDataWay3A.data = [];
        },
        attachmentHandle(fileInfo) {
            let data = []; // 表格数据

            let brr = fileInfo.slice(1) || []; // 传过来的数据

            for (let j = 0; j < brr.length; j++) {
                let v = brr[j];
                let obj = {
                    x: v[0],
                    y: v[1],
                };

                data.push(obj);
            }

            return data;
        },
        attachmentChange(fileInfo) {
            this.file = fileInfo;
        },
        attachmentChange1(fileInfo) {
            this.file1 = fileInfo;

            let columns = []; // column数组

            let flag = false; // 简单的校验是否是只有x、y轴的单y轴数据

            fileInfo[0].forEach((i) => {
                if (i.toLowerCase().includes("y")) flag = true;
                columns.push({
                    label: i,
                    prop: i.toLowerCase().includes("x") ? "x" : i,
                    template: true,
                });
            });

            if (flag) return;

            let data = []; // 表格数据

            let arr = fileInfo[0] || []; // 传过来的props
            let brr = fileInfo.slice(1) || []; // 传过来的数据

            for (let j = 0; j < brr.length; j++) {
                let v = brr[j];
                let obj = {};

                arr.forEach((i, index) => {
                    let prop = "";
                    if (i.toLowerCase().includes("x")) {
                        prop = "x";
                    } else {
                        prop = i;
                    }

                    obj[prop] = v[index];
                });

                data.push(obj);
            }

            this.columns1 = columns;
            this.getDataWay1.data = data;
        },
        attachmentChange2(fileInfo) {
            this.getDataWay2.data = this.attachmentHandle(fileInfo);
        },
        attachmentChange2A(fileInfo) {
            this.getDataWay2A.data = this.attachmentHandle(fileInfo);
        },
        attachmentChange3(fileInfo) {
            this.getDataWay3.data = this.attachmentHandle(fileInfo);
        },
        attachmentChange3A(fileInfo) {
            this.getDataWay3A.data = this.attachmentHandle(fileInfo);
        },
        handleChang() {
            let a = +this.form1.a;
            let b = +this.form1.b;

            if (a && b) {
                let columnsArr = [
                    {
                        label: "X Axis",
                        prop: "x",
                        template: true,
                    },
                ];

                let propArr = ["x"];

                // 处理表头，并确定对应的prop ->column
                for (let index = 1; index < b; index++) {
                    columnsArr.push({
                        label: index + "",
                        prop: index,
                        template: true,
                    });

                    propArr.push(index);
                }

                let dataArr = [];

                // 往对应的prop里添加数据 ->data
                for (let j = 0; j < a; j++) {
                    let obj = {};

                    propArr.forEach((p) => {
                        obj[p] = "";
                    });

                    dataArr.push(obj);
                }

                this.columns1 = columnsArr;
                this.getDataWay1.data = dataArr;
            }
        },
        handleChang1(s) {
            let a = +this[`form${s}`].a;

            if (a) {
                let dataArr = [];

                // 往对应的prop里添加数据 ->data
                for (let j = 0; j < a; j++) {
                    let obj = { x: "", y: "" };
                    dataArr.push(obj);
                }

                this[`getDataWay${s}`].data = dataArr;
            }
        },
        getDefaultArr(type) {
            switch (type) {
                case "columnsOri1":
                    return [
                        {
                            label: "X Axis",
                            prop: "x",
                            template: true,
                        },
                        {
                            label: "1",
                            prop: "1",
                            template: true,
                        },
                        {
                            label: "2",
                            prop: "2",
                            template: true,
                        },
                        {
                            label: "3",
                            prop: "3",
                            template: true,
                        },
                        {
                            label: "4",
                            prop: "4",
                            template: true,
                        },
                    ];
                    break;
                case "columnsOri2":
                    return [
                        {
                            label: "X Axis",
                            prop: "x",
                            template: true,
                        },
                        {
                            label: "Y Axis",
                            prop: "y",
                            template: true,
                        },
                    ];
                    break;
                case "defaultArr1":
                    return [
                        {
                            x: "",
                            1: "",
                            2: "",
                            3: "",
                            4: "",
                        },
                        {
                            x: "",
                            1: "",
                            2: "",
                            3: "",
                            4: "",
                        },
                        {
                            x: "",
                            1: "",
                            2: "",
                            3: "",
                            4: "",
                        },
                        {
                            x: "",
                            1: "",
                            2: "",
                            3: "",
                            4: "",
                        },
                        {
                            x: "",
                            1: "",
                            2: "",
                            3: "",
                            4: "",
                        },
                    ];
                    break;
                case "defaultArr2":
                    return [
                        {
                            x: "",
                            y: "",
                        },
                        {
                            x: "",
                            y: "",
                        },
                        {
                            x: "",
                            y: "",
                        },
                        {
                            x: "",
                            y: "",
                        },
                        {
                            x: "",
                            y: "",
                        },
                    ];
                    break;
                default:
                    return [];
                    break;
            }
        },
        checkArr() {
            /*  
                frontLeftWheelRelationCurvePositiveMomentAndSideslipAngle: [], // 左前轮不同载荷下轮胎回正力矩和侧偏角的关系曲线
                frontLeftWheelRelationCurveLateralForceAndSideslipAngle: [], // 左前轮不同载荷下轮胎侧向力和侧偏角的关系曲线
                frontLeftWheelRelationCurveLongitudinalForceAndSideslipAngle:
                    [], // 左前轮不同载荷下轮胎纵向力和滑移率的关系曲线
                rearLeftWheelRelationCurvePositiveMomentAndSideslipAngle: [], // 左后轮不同载荷下轮胎回正力矩和侧偏角的关系曲线
                rearLeftWheelRelationCurveLateralForceAndSideslipAngle: [], // 左后轮不同载荷下轮胎侧向力和侧偏角的关系曲线
                rearLeftWheelRelationCurveLongitudinalForceAndSideslipAngle: [], // 左后轮不同载荷下轮胎纵向力和滑移率的关系曲线
                frontRightWheelRelationCurvePositiveMomentAndSideslipAngle: [], // 右前轮不同载荷下轮胎回正力矩和侧偏角的关系曲线
                frontRightWheelRelationCurveLateralForceAndSideslipAngle: [], // 右前轮不同载荷下轮胎侧向力和侧偏角的关系曲线
                frontRightWheelRelationCurveLongitudinalForceAndSideslipAngle:
                    [], // 右前轮不同载荷下轮胎纵向力和滑移率的关系曲线
                rearRightWheelRelationCurvePositiveMomentAndSideslipAngle: [], // 右后轮不同载荷下轮胎回正力矩和侧偏角的关系曲线
                rearRightWheelRelationCurveLateralForceAndSideslipAngle: [], // 右后轮不同载荷下轮胎侧向力和侧偏角的关系曲线
                rearRightWheelRelationCurveLongitudinalForceAndSideslipAngle:
                    [], // 右后轮不同载荷下轮胎纵向力和滑移率的关系曲线
            */
            let arr =
                this.form
                    .frontLeftWheelRelationCurvePositiveMomentAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "左前轮不同载荷下轮胎回正力矩和侧偏角的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .frontLeftWheelRelationCurveLateralForceAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "左前轮不同载荷下轮胎侧向力和侧偏角的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .frontLeftWheelRelationCurveLongitudinalForceAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "左前轮不同载荷下轮胎纵向力和滑移率的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .rearLeftWheelRelationCurvePositiveMomentAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "左后轮不同载荷下轮胎回正力矩和侧偏角的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .rearLeftWheelRelationCurveLateralForceAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "左后轮不同载荷下轮胎侧向力和侧偏角的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .rearLeftWheelRelationCurveLongitudinalForceAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "左后轮不同载荷下轮胎纵向力和滑移率的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .frontRightWheelRelationCurvePositiveMomentAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "右前轮不同载荷下轮胎回正力矩和侧偏角的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .frontRightWheelRelationCurveLateralForceAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "右前轮不同载荷下轮胎侧向力和侧偏角的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .frontRightWheelRelationCurveLongitudinalForceAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "右前轮不同载荷下轮胎纵向力和滑移率的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .rearRightWheelRelationCurvePositiveMomentAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "右后轮不同载荷下轮胎回正力矩和侧偏角的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .rearRightWheelRelationCurveLateralForceAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "右后轮不同载荷下轮胎侧向力和侧偏角的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            arr =
                this.form
                    .rearRightWheelRelationCurveLongitudinalForceAndSideslipAngle;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "右后轮不同载荷下轮胎纵向力和滑移率的关系曲线数据不全，请填写完整"
                );
                return false;
            }

            /* 
            relationCurveEngineTorqueSpeedAndThrottleOpening: [], // 发动机扭矩、转速和节气门开的度关系曲线
            */

            arr = this.form.relationCurveEngineTorqueSpeedAndThrottleOpening;
            if (!Array.isArray(arr) || arr.length === 0) {
                this.$message.error(
                    "发动机扭矩、转速和节气门开的度关系曲线数据不全，请填写完整"
                );
                return false;
            }

            /* 
                gearRatio: [], // R,N,1,2,3,4,5,6
                inertia: [], // R,N,1,2,3,4,5,6
                driving: [], // R,N,1,2,3,4,5,6
                coasting: [], // R,N,1,2,3,4,5,6
            */

            let dataArray = this.getDataWay.data;

            for (let index = 0; index < dataArray.length; index++) {
                const element = dataArray[index];

                if (index === 1) {
                    if (element.gearRatio === "") element.gearRatio = null;
                    if (element.driving === "") element.driving = null;
                    if (element.coasting === "") element.coasting = null;
                }

                let flag = Object.values(element).some((i) => i === "");

                if (flag) {
                    this.$message.error("变速器表格中数据不全，请填写完整");
                    return false;
                }
            }

            this.form.gearRatio = [];
            this.form.inertia = [];
            this.form.driving = [];
            this.form.coasting = [];

            dataArray.forEach((i) => {
                this.form.gearRatio.push(i.gearRatio);
                this.form.inertia.push(i.inertia);
                this.form.driving.push(i.driving);
                this.form.coasting.push(i.coasting);
            });

            /* 
                shiftTimeUp12: [],
                shiftTimeDown12: [],
                shiftTimeUp23: [],
                shiftTimeDown23: [],
                shiftTimeUp34: [],
                shiftTimeDown34: [],
                shiftTimeUp45: [],
                shiftTimeDown45: [],
                shiftTimeUp56: [],
                shiftTimeDown56: [],
            */

            arr = this.form.shiftTimeUp12;
            let arr1 = this.form.shiftTimeDown12;
            if (
                !Array.isArray(arr) ||
                arr.length === 0 ||
                !Array.isArray(arr1) ||
                arr1.length === 0
            ) {
                this.$message.error("1-2 换挡曲线数据不全，请填写完整");
                return false;
            }

            arr = this.form.shiftTimeUp23;
            arr1 = this.form.shiftTimeDown23;
            if (
                !Array.isArray(arr) ||
                arr.length === 0 ||
                !Array.isArray(arr1) ||
                arr1.length === 0
            ) {
                this.$message.error("2-3 换挡曲线数据不全，请填写完整");
                return false;
            }

            arr = this.form.shiftTimeUp34;
            arr1 = this.form.shiftTimeDown34;
            if (
                !Array.isArray(arr) ||
                arr.length === 0 ||
                !Array.isArray(arr1) ||
                arr1.length === 0
            ) {
                this.$message.error("3-4 换挡曲线数据不全，请填写完整");
                return false;
            }

            arr = this.form.shiftTimeUp45;
            arr1 = this.form.shiftTimeDown45;
            if (
                !Array.isArray(arr) ||
                arr.length === 0 ||
                !Array.isArray(arr1) ||
                arr1.length === 0
            ) {
                this.$message.error("4-5 换挡曲线数据不全，请填写完整");
                return false;
            }

            arr = this.form.shiftTimeUp56;
            arr1 = this.form.shiftTimeDown56;
            if (
                !Array.isArray(arr) ||
                arr.length === 0 ||
                !Array.isArray(arr1) ||
                arr1.length === 0
            ) {
                this.$message.error("5-6 换挡曲线数据不全，请填写完整");
                return false;
            }

            /* 
            relationCurveRightWheelAngleAndSteeringGearOutput: [], // 右轮转角与转向器输出的关系
            relationCurveLeftWheelAngleAndSteeringGearOutput: [], // 左轮转角与转向器输出的关系
             */

            arr = this.form.relationCurveRightWheelAngleAndSteeringGearOutput;
            arr1 = this.form.relationCurveLeftWheelAngleAndSteeringGearOutput;
            if (
                !Array.isArray(arr) ||
                arr.length === 0 ||
                !Array.isArray(arr1) ||
                arr1.length === 0
            ) {
                this.$message.error(
                    "车轮转角与转向器输出的关系曲线线数据不全，请填写完整"
                );
                return false;
            }

            return true;
        },
        save() {
            let flag = null;

            this.$refs.form.validate((valid) => {
                if (valid) {
                    let hasArr = this.checkArr();

                    if (hasArr) {
                        flag = true;
                    } else {
                        flag = false;
                    }
                } else {
                    flag = false;
                }
            });

            return flag;
        },
        handleData() {
            /* gearRatio: [], // R,N,1,2,3,4,5,6
                inertia: [], // R,N,1,2,3,4,5,6
                driving: [], // R,N,1,2,3,4,5,6
                coasting: [], // R,N,1,2,3,4,5,6 
                
                {
                        a: "N",
                        gearRatio: "/",
                        inertia: "",
                        driving: "/",
                        coasting: "/",
                    },
                */

            if (this.form.gearRatio.length === 0) return;

            let arr = this.getDataWay.data;

            for (let index = 0; index < arr.length; index++) {
                const obj = arr[index];
                obj.gearRatio = this.form.gearRatio[index];
                obj.inertia = this.form.inertia[index];
                obj.driving = this.form.driving[index];
                obj.coasting = this.form.coasting[index];
            }
        },
        isSorted(arr = []) {
            return arr.every((x, i) => i === 0 || +x > +arr[i - 1]);
        },
        getMaxHeight() {
            this.propMaxHeight = $(window).height() -294;
        },
    },

    mounted() {
        this.getMaxHeight();

        window.addEventListener("resize", () => {
            this.getMaxHeight();
        }, false);
    },
};
</script>

<style lang='less' scoped>
.vehicleModelCarsimPanel {
    .titlePanel {
        padding: 22px 0;
    }

    .titlePanelA {
        padding-top: 22px;
        padding-bottom: 22px;
    }

    .padTop15 {
        padding-top: 15px;
    }

    .padTop22 {
        padding-top: 22px;
    }

    .padTop0 {
        padding-top: 0;
    }

    .marBot20 {
        margin-bottom: 20px;
    }

    .titlePanelABor {
        padding-left: 9px;
        font-weight: bold;
        line-height: 1.08;
        font-size: 16px;

        b {
            display: inline-block;
            width: 18px;
            height: 15px;
            margin-top: -2px;
            margin-right: 6px;
            vertical-align: middle;
            background: url("../../../assets/common/image/others/car.png")
                center no-repeat;
            background-size: contain;
        }

        i {
            margin-right: 6px;
            font-size: 18px;
        }
    }

    .carTipBox {
        width: 84%;
        min-width: 810px;
        padding-right: 30px;
        // margin: 0 auto;

        .searchLayoutBox {
            position: relative;
            padding: 18px;
            text-align: center;
        }

        /deep/ .el-form-item {
            position: absolute;
            z-index: 6;
            margin: 0;
            width: 12%;

            .el-input {
                width: 100%;
                max-width: 180px;
            }
        }

        /deep/ .el-form-item__content {
            margin: 0 !important;
        }

        .p1 {
            top: 33.6%;
            left: 4.2%;
        }

        .p2 {
            top: 79.2%;
            left: 9%;
        }

        .p3 {
            top: 65.1%;
            left: 36%;
        }

        .p4 {
            top: 62.1%;
            left: 54%;
        }

        .p6 {
            top: 81%;
            left: 42%;
        }
    }

    .myTabsBox {
        margin-right: 30px;

        /deep/ .el-tabs__nav-scroll {
            &:after {
                width: 100%;
            }
        }

        &.myTabsBoxFourTabs {
            /deep/ .el-tabs {
                width: auto;
                margin: 0;
            }

            /deep/ .el-tabs__item {
                width: 90px;
            }
        }

        /deep/
            .el-tabs--top.el-tabs--card
            > .el-tabs__header
            .el-tabs__item:nth-child(2) {
            padding-left: 0;
            border-left-color: @gray;

            &.is-active {
                border-left-color: @themeColor;
            }
        }

        /deep/
            .el-tabs--top.el-tabs--card
            > .el-tabs__header
            .el-tabs__item:last-child {
            padding-right: 0;
        }
    }

    .dialogBtnBox {
        // justify-content: space-between;
        padding-bottom: 12px;
        margin-right: 30px;

        .dia {
            padding: 10px 6px;
            margin-right: 10px;
            margin-bottom: 10px;
            border: 1px solid @gray;
            border-radius: 4px;
            background: rgba(51, 151, 255, 0.06);
            cursor: pointer;

            &:last-child {
                margin-right: 0;
            }

            &:hover,
            &.isCur {
                border-color: @themeColor;
                color: @themeColor;
            }
        }

        .dia2 {
            display: inline-block;
        }
    }

    .wrapBox {
        .labelName {
            padding-right: 10px;
            margin-top: 10px;
        }
    }

    .diaContentBox {
        display: flex;
        justify-content: space-between;

        .diaContent {
            width: 48%;
        }

        .chartBox {
            // height: 60vh;
            height: calc(85vh - 294px);
        }

        .chartBox1 {
            // height: 66vh;
            height: calc(85vh - 201px);
        }

        .diaLineTitle {
            padding: 0 10px 10px;
            font-weight: bold;
        }

        .handleForm {
            .el-form-item {
                margin-right: 30px;
            }

            .el-input {
                width: 180px;
            }
        }

        .tipName {
            padding-bottom: 10px;
            font-size: 18px;
            font-weight: bold;
        }

        /deep/ .el-table::before {
            position: initial;
        }
    }

    .el-table .el-input {
        width: 100%;
        max-width: 180px;
    }
}
</style>