simulation-front/src/views/modelLibrary/vehicleModel.vue

<template>
    <div class="vehicleModelPanel">
        <model-list
            ref="modelList"
            class="modelList"
            @showInfo="showInfo"
            @addOne="addOne"
            @delOne="delOne"
            :getListApi="getListApi"
            :showName="showName"
            :curOne="curOne"
        ></model-list>

        <div class="contentPanel">
            <el-form
                ref="form"
                :model="form"
                :rules="rules"
                label-width="160px"
            >
                <div class="flexBox">
                    <el-form-item label="车辆设置方式:" prop="parameterType">
                        <el-select
                            v-model="form.parameterType"
                            :disabled="form.share != ''"
                            @change="parameterTypeChange"
                        >
                            <el-option
                                v-for="item in parameterTypeList"
                                :label="item.caption"
                                :value="item.code"
                                :key="item.code"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                    <div class="inputBox flexBox">
                        <span class="label">车辆ID:</span>
                        <div>{{ form.vehicleCode }}</div>
                    </div>
                </div>

                <div class="flexBox">
                    <el-form-item label="车辆名称:" prop="vehicleName">
                        <el-input
                            placeholder="请输入"
                            maxlength="60"
                            v-autoTrim="{ obj: form, key: 'vehicleName' }"
                            v-model="form.vehicleName"
                        >
                        </el-input>
                    </el-form-item>
                    <el-form-item label="车辆描述:" prop="description">
                        <el-input
                            v-autoTrim="{ obj: form, key: 'description' }"
                            v-model="form.description"
                            placeholder="请输入"
                            maxlength="200"
                        ></el-input>
                    </el-form-item>
                    <el-form-item label="车辆模型:" prop="vehicleType">
                        <el-cascader
                            ref="cascader"
                            v-model="form.vehicleType"
                            :options="modelLabelList"
                            :props="props"
                            @change="modelLabelChange"
                        ></el-cascader>
                    </el-form-item>
                    <el-form-item label="车辆模型标识:" prop="modelLabel">
                        <el-input
                            placeholder="请输入"
                            v-autoTrim="{ obj: form, key: 'modelLabel' }"
                            v-model="form.modelLabel"
                            disabled
                        >
                        </el-input>
                    </el-form-item>
                    <el-form-item
                        v-if="form.parameterType != '1'"
                        label="参数文件:"
                        prop=""
                    >
                        <el-input
                            placeholder="请输入"
                            maxlength="120"
                            v-model="file"
                            disabled
                            :title="file"
                        >
                        </el-input>
                        <upload
                            ref="upload"
                            :multiple="false"
                            @attachmentChange="attachmentChange"
                        ></upload>
                    </el-form-item>
                </div>

                <vtd
                    ref="vtd"
                    v-if="form.parameterType === '1'"
                    :wheelDriveList="wheelDriveList"
                ></vtd>
                <Carsim
                    ref="carsim"
                    v-if="form.parameterType != '1'"
                    :suspensionTypeList="suspensionTypeList"
                    :brakeTypeList="brakeTypeList"
                    :steeringTypeList="steeringTypeList"
                    :steeringGearTypeList="steeringGearTypeList"
                    :driverTypeList="driverTypeList"
                ></Carsim>

                <div class="titlePanel">
                    <div class="titlePanelBor">3D视图</div>
                </div>

                <div class="modelBox">
                    <!-- <img v-show="modelImgSrc" :src="modelImgSrc" width="100%" /> -->
                    <three-show
                        ref="threeShow"
                        :carModel="carModel"
                    ></three-show>
                </div>
            </el-form>

            <div class="btns">
                <!-- 新增和私有才能修改和保存 -->
                <!-- 私有才能分享 -->
                <!-- share有值 才能另存为 -->
                <el-button
                    type="primary"
                    v-show="form.share === '0' || form.share === ''"
                    @click="save(false)"
                    >保存</el-button
                >
                <el-button
                    type="primary"
                    v-if="roleCode === '0' || roleCode === '1'"
                    v-show="form.share === '0'"
                    @click="share"
                    >分享</el-button
                >
                <el-button
                    type="primary"
                    v-show="form.share === '0' || form.share === '1'"
                    @click="save(true)"
                    >另存为</el-button
                >
                <el-button type="primary" plain @click="cancel">取消</el-button>
            </div>
        </div>
    </div>
</template>

<script>
import modelList from "./components/modelTypeList.vue";
import { mapState } from "vuex";
import threeShow from "./components/threeVehicleModel.vue";
import vtd from "./components/vehicleModelVTD.vue";
import Carsim from "./components/vehicleModelCarsim.vue";
import upload from "./components/uploadPar.vue";

export default {
    name: "vehicleModel", // 车辆模型
    components: { modelList, threeShow, vtd, Carsim, 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 {
            getListApi: this.$api.modelLibrary.getVehicleList, // 获取列表api
            showName: "vehicleName",
            typeList: [],
            // imgSrc: require("@/assets/common/image/car.png"),
            form: {
                parameterType: "1", // 车辆设置方式
                vehicleCode: "", // 车辆ID
                vehicleName: "", // 车辆名称
                description: "", // 车辆描述
                // file: "", // 参数文件
                // vehicleType: "", // 车辆类型
                // vehicleModel: "", // 车辆型号
                // vehicleColour: "", // 车辆颜色
                vehicleType: [], // 车辆模型
                modelLabel: "", // 车辆模型标识

                // maxSpeed: "", // 最大速度
                // enginePower: "", // 发动机功率
                // maxDeceleration: "", // 最大减速度
                // maxSteeringAngle: "", // 最大转角
                // wheelDrive: "", // 驱动方式
                // overallEfficiency: "", // 总效率
                // frontSurfaceEffective: "", // 前表面有效面积
                // airDragCoefficient: "", // 空气阻力系数
                // rollingResistanceCoefficient: "", // 滚动阻力系数
                // wheelDiameter: "", // 车轮直径
                // frontDistance: "", // 车前距
                // rearDistance: "", // 车后距
                // leftDistance: "", // 车左距
                // rightDistance: "", // 车右距
                // heightDistance: "", // 车高
                // wheelbase: "", // 轴距
                // mass: "", // 质量

                share: "", // 分享
                // vehicleImage: "", // 对应的图片相对地址
                id: "",
                vehicleFrontView: "", // 对应的图片相对地址
                vehicleTopView: "", // 对应的图片相对地址
            },
            vehicleTypeList: [],
            vehicleModelList: [],
            vehicleColourList: [],
            wheelDriveList: [],
            parameterTypeList: [],

            suspensionTypeList: [],
            brakeTypeList: [],
            steeringTypeList: [],
            steeringGearTypeList: [],
            driverTypeList: [],

            rules: {
                parameterType: [
                    { required: true, message: "请选择", trigger: "change" },
                ],
                vehicleName: [
                    { required: true, message: "请输入", trigger: "blur" },
                ],
                description: [
                    { required: true, message: "请输入", trigger: "blur" },
                ],
                vehicleType: [
                    { required: true, message: "请选择", trigger: "change" },
                ],
                modelLabel: [
                    { required: true, message: "请输入", trigger: "blur" },
                ],
                // file: [{ required: true, message: "请上传", trigger: "blur" }],

                // vehicleModel: [
                //     { required: true, message: "请输入", trigger: "blur" },
                // ],
                // vehicleColour: [
                //     { required: true, message: "请输入", trigger: "blur" },
                // ],
                // maxSpeed: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // enginePower: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // maxDeceleration: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // maxSteeringAngle: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // overallEfficiency: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNoMore1,
                //         message: "请输入不大于1的非负数",
                //         trigger: ["blur"],
                //     },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // frontSurfaceEffective: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // airDragCoefficient: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNoMore1,
                //         message: "请输入不大于1的非负数",
                //         trigger: ["blur"],
                //     },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // rollingResistanceCoefficient: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNoMore1,
                //         message: "请输入不大于1的非负数",
                //         trigger: ["blur"],
                //     },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // wheelDiameter: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // frontDistance: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // rearDistance: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // leftDistance: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // rightDistance: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // heightDistance: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // wheelbase: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // mass: [
                //     { required: true, message: "请输入", trigger: "blur" },
                //     {
                //         validator: validateNum,
                //         message: "请输入最多带有4位小数的非负数",
                //         trigger: ["blur"],
                //     },
                // ],
                // wheelDrive: [
                //     { required: true, message: "请选择", trigger: "change" },
                // ],
            },
            props: {
                multiple: false,
                label: "name",
                value: "code",
            },
            modelLabelList: [],
            modelImgSrc: "",
            // 用于当前选中项的展示
            curOne: {
                share: "",
                id: "",
            },
            carModel: "",
            file: "", // 参数文件
        };
    },

    computed: {
        ...mapState(["fileHost", "fileUrl", "roleCode"]),
    },

    methods: {
        updateForm(t, o) {
            let form = {};

            if (t === "1") {
                form.maxSpeed = o.maxSpeed;
                form.enginePower = o.enginePower;
                form.maxDeceleration = o.maxDeceleration;
                form.maxSteeringAngle = o.maxSteeringAngle;
                form.wheelDrive = o.wheelDrive;
                form.overallEfficiency = o.overallEfficiency;
                form.frontSurfaceEffective = o.frontSurfaceEffective;
                form.airDragCoefficient = o.airDragCoefficient;
                form.rollingResistanceCoefficient =
                    o.rollingResistanceCoefficient;
                form.wheelDiameter = o.wheelDiameter;
                form.frontDistance = o.frontDistance;
                form.rearDistance = o.rearDistance;
                form.leftDistance = o.leftDistance;
                form.rightDistance = o.rightDistance;
                form.heightDistance = o.heightDistance;
                form.wheelbase = o.wheelbase;
                form.mass = o.mass;

                this.$refs.vtd.form = form;
            } else {
                form.vehicleLength = o.vehicleLength;
                form.sprungMass = o.sprungMass;
                form.vehicleWidth = o.vehicleWidth;
                form.rotationalInertiaX = o.rotationalInertiaX;
                form.rotationalInertiaY = o.rotationalInertiaY;
                form.rotationalInertiaZ = o.rotationalInertiaZ;

                form.wheelCenterToTop = o.wheelCenterToTop;
                form.wheelCenterToGround = o.wheelCenterToGround;
                form.centroidToFrontWheelCenter = o.centroidToFrontWheelCenter;
                form.centroidToGround = o.centroidToGround;
                form.wheelbase = o.wheelbase;

                form.frontLeftWheelEffectiveRollingRadius =
                    o.frontLeftWheelEffectiveRollingRadius;
                form.frontLeftWheelRollingResistanceCoefficient =
                    o.frontLeftWheelRollingResistanceCoefficient;
                form.frontLeftWheelFreeRadius = o.frontLeftWheelFreeRadius;
                form.rearLeftWheelEffectiveRollingRadius =
                    o.rearLeftWheelEffectiveRollingRadius;
                form.rearLeftWheelRollingResistanceCoefficient =
                    o.rearLeftWheelRollingResistanceCoefficient;
                form.rearLeftWheelFreeRadius = o.rearLeftWheelFreeRadius;
                form.frontRightWheelEffectiveRollingRadius =
                    o.frontRightWheelEffectiveRollingRadius;
                form.frontRightWheelRollingResistanceCoefficient =
                    o.frontRightWheelRollingResistanceCoefficient;
                form.frontRightWheelFreeRadius = o.frontRightWheelFreeRadius;
                form.rearRightWheelEffectiveRollingRadius =
                    o.rearRightWheelEffectiveRollingRadius;
                form.rearRightWheelRollingResistanceCoefficient =
                    o.rearRightWheelRollingResistanceCoefficient;
                form.rearRightWheelFreeRadius = o.rearRightWheelFreeRadius;

                form.frontLeftWheelRelationCurvePositiveMomentAndSideslipAngle =
                    o.frontLeftWheelRelationCurvePositiveMomentAndSideslipAngle;
                form.frontLeftWheelRelationCurveLateralForceAndSideslipAngle =
                    o.frontLeftWheelRelationCurveLateralForceAndSideslipAngle;
                form.frontLeftWheelRelationCurveLongitudinalForceAndSideslipAngle =
                    o.frontLeftWheelRelationCurveLongitudinalForceAndSideslipAngle;
                form.rearLeftWheelRelationCurvePositiveMomentAndSideslipAngle =
                    o.rearLeftWheelRelationCurvePositiveMomentAndSideslipAngle;
                form.rearLeftWheelRelationCurveLateralForceAndSideslipAngle =
                    o.rearLeftWheelRelationCurveLateralForceAndSideslipAngle;
                form.rearLeftWheelRelationCurveLongitudinalForceAndSideslipAngle =
                    o.rearLeftWheelRelationCurveLongitudinalForceAndSideslipAngle;
                form.frontRightWheelRelationCurvePositiveMomentAndSideslipAngle =
                    o.frontRightWheelRelationCurvePositiveMomentAndSideslipAngle;
                form.frontRightWheelRelationCurveLateralForceAndSideslipAngle =
                    o.frontRightWheelRelationCurveLateralForceAndSideslipAngle;
                form.frontRightWheelRelationCurveLongitudinalForceAndSideslipAngle =
                    o.frontRightWheelRelationCurveLongitudinalForceAndSideslipAngle;
                form.rearRightWheelRelationCurvePositiveMomentAndSideslipAngle =
                    o.rearRightWheelRelationCurvePositiveMomentAndSideslipAngle;
                form.rearRightWheelRelationCurveLateralForceAndSideslipAngle =
                    o.rearRightWheelRelationCurveLateralForceAndSideslipAngle;
                form.rearRightWheelRelationCurveLongitudinalForceAndSideslipAngle =
                    o.rearRightWheelRelationCurveLongitudinalForceAndSideslipAngle;

                form.frontWheelSuspensionType = o.frontWheelSuspensionType;
                form.frontWheelSuspensionKinematicsCoefficient =
                    o.frontWheelSuspensionKinematicsCoefficient;
                form.frontWheelUnsprungMass = o.frontWheelUnsprungMass;
                form.frontWheelTrackWidth = o.frontWheelTrackWidth;
                form.rearWheelSuspensionType = o.rearWheelSuspensionType;
                form.rearWheelSuspensionKinematicsCoefficient =
                    o.rearWheelSuspensionKinematicsCoefficient;
                form.rearWheelUnsprungMass = o.rearWheelUnsprungMass;
                form.rearWheelTrackWidth = o.rearWheelTrackWidth;

                form.windwardArea = o.windwardArea;
                form.airDensity = o.airDensity;

                form.engineCrankshaftMomentInertia =
                    o.engineCrankshaftMomentInertia;
                form.idleSpeed = o.idleSpeed;
                form.driverType = o.driverType;

                form.relationCurveEngineTorqueSpeedAndThrottleOpening =
                    o.relationCurveEngineTorqueSpeedAndThrottleOpening;

                form.momentInertiaInputShaft = o.momentInertiaInputShaft;
                form.momentInertiaOutputShaft = o.momentInertiaOutputShaft;

                form.finalDriveRatio = o.finalDriveRatio;
                form.transmissionEfficiency = o.transmissionEfficiency;

                form.gearRatio = o.gearRatio;
                form.inertia = o.inertia;
                form.driving = o.driving;
                form.coasting = o.coasting;

                form.shiftTime = o.shiftTime;

                form.shiftTimeUp12 = o.shiftTimeUp12;
                form.shiftTimeDown12 = o.shiftTimeDown12;
                form.shiftTimeUp23 = o.shiftTimeUp23;
                form.shiftTimeDown23 = o.shiftTimeDown23;
                form.shiftTimeUp34 = o.shiftTimeUp34;
                form.shiftTimeDown34 = o.shiftTimeDown34;
                form.shiftTimeUp45 = o.shiftTimeUp45;
                form.shiftTimeDown45 = o.shiftTimeDown45;
                form.shiftTimeUp56 = o.shiftTimeUp56;
                form.shiftTimeDown56 = o.shiftTimeDown56;

                // form.brakeType = o.brakeType;
                form.frontLeftWheelBrakingTorque =
                    o.frontLeftWheelBrakingTorque;
                form.rearLeftWheelBrakingTorque = o.rearLeftWheelBrakingTorque;
                // form.frontRightWheelBrakingTorque = o.frontRightWheelBrakingTorque;
                // form.rearRightWheelBrakingTorque = o.rearRightWheelBrakingTorque;

                form.steeringType = o.steeringType;
                form.steeringGearType = o.steeringGearType;
                form.steeringGearRatio = o.steeringGearRatio;

                form.relationCurveRightWheelAngleAndSteeringGearOutput =
                    o.relationCurveRightWheelAngleAndSteeringGearOutput;
                form.relationCurveLeftWheelAngleAndSteeringGearOutput =
                    o.relationCurveLeftWheelAngleAndSteeringGearOutput;

                this.$refs.carsim.form = form;

                this.$refs.carsim.handleData();
            }
        },
        showInfo(id) {
            this.file = "";

            this.$axios({
                method: "post",
                url: this.$api.modelLibrary.getVehicleInfo,
                data: {
                    id,
                },
            }).then((res) => {
                if (res.code == 200 && res.info) {
                    let info = res.info;

                    this.$refs.form.clearValidate();

                    Object.assign(this.form, info);

                    if (info.vehicleFrontView) {
                        // this.modelImgSrc = this.getImgUrl(
                        //     res.info.vehicleFrontView
                        // );
                        this.carModel = this.getImgUrl(info.vehicleFrontView);
                    }

                    this.curOne = {
                        share: info.share,
                        id: info.id,
                    };

                    this.$nextTick(() => {
                        if (info.parameterType === "1") {
                            this.$refs.vtd.$refs.form.clearValidate();
                        } else {
                            this.$refs.carsim.$refs.form.clearValidate();
                        }

                        this.updateForm(info.parameterType, info);
                    });
                } else {
                    this.$message.error(res.message || "获取失败");
                }
            });
        },
        save(isAdd) {
            this.$refs.form.validate((valid) => {
                if (valid) {
                    // 判断是否新增
                    if (isAdd || this.form.share === "") {
                        this.form.id = "";
                    }

                    let canSave = false;

                    if (this.form.parameterType === "1") {
                        canSave = this.$refs.vtd.save();
                    } else {
                        canSave = this.$refs.carsim.save();
                    }

                    if (!canSave) return;

                    let form = {};

                    if (this.form.parameterType === "1") {
                        form = this.$refs.vtd.form;
                    } else {
                        form = this.$refs.carsim.form;
                    }

                    let data = Object.assign({}, this.form, form);

                    this.$axios({
                        method: "post",
                        url: this.$api.modelLibrary.saveVehicle,
                        data,
                    }).then((res) => {
                        if (res.code == 200 && res.info) {
                            this.form.id = res.info.id;
                            this.form.share = res.info.share;
                            this.form.vehicleCode = res.info.vehicleCode;
                            this.$message.success("保存成功");
                            this.$refs.modelList.getList();

                            this.curOne = {
                                share: res.info.share,
                                id: res.info.id,
                            };
                        } else {
                            this.$message.error(res.message || "保存失败");
                        }
                    });
                }
            });
        },
        addOne() {
            this.$refs.form.resetFields();

            this.form.parameterType = "1";
            this.$refs.vtd && this.$refs.vtd.$refs.form.resetFields();

            this.form.vehicleCode = "";
            this.form.vehicleFrontView = "";
            this.form.vehicleTopView = "";
            this.form.share = "";
            this.form.id = "";
            this.modelImgSrc = "";
            this.carModel = "";

            this.curOne = {
                share: "",
                id: "",
            };
        },
        delOne(id) {
            this.$axios({
                method: "post",
                url: this.$api.modelLibrary.delVehicleById,
                data: {
                    id,
                },
            }).then((res) => {
                if (res.code == 200) {
                    this.$message.success("删除成功");
                    this.$refs.modelList.getList();
                    if (this.form.id && id === this.form.id) {
                        this.addOne();
                    }

                    if (id === this.curOne.id) {
                        this.curOne = {
                            share: "",
                            id: "",
                        };
                    }
                } else {
                    this.$message.error(res.message || "删除失败");
                }
            });
        },
        share() {
            let form = {};

            if (this.form.parameterType === "1") {
                form = this.$refs.vtd.form;
            } else {
                form = this.$refs.carsim.form;
            }

            let data = Object.assign({}, this.form, form);

            this.$axios({
                method: "post",
                url: this.$api.modelLibrary.shareVehicle,
                data,
            }).then((res) => {
                if (res.code == 200) {
                    this.$message.success("分享成功");
                    this.$refs.modelList.getList();
                } else {
                    this.$message.error(res.message || "分享失败");
                }
            });
        },
        cancel() {
            if (this.form.id) {
                // 取消时有id则重新请求表单
                this.showInfo(this.form.id);
            } else {
                // 清空
                this.addOne();
            }
        },
        getImgUrl(addr) {
            let url = "";
            if (process.env.VUE_APP_IS_DEV == "true") {
                url = this.fileHost + this.fileUrl;
            } else {
                url = this.fileUrl;
            }

            let token = localStorage.getItem("Authorization").split(" ")[1];
            let src = `${url}?objectName=${addr}&access_token=${token}`;
            return src;
        },
        modelLabelChange() {
            Object.assign(
                this.form,
                this.$refs.cascader.getCheckedNodes(true)[0].data.vo
            );

            if (this.form.parameterType === "1") {
                this.updateForm("1", this.form);
            }

            // this.modelImgSrc = this.getImgUrl(this.form.vehicleFrontView);
            this.carModel = this.getImgUrl(this.form.vehicleFrontView);
        },
        async getModelLabelList() {
            await this.$axios({
                method: "post",
                url: this.$api.modelLibrary.getVehicleTempTree,
                data: {},
            }).then((res) => {
                if (res.code == 200 && res.info) {
                    this.modelLabelList = res.info;
                } else {
                    this.$message.error(res.message || "获取车辆模型列表失败");
                }
            });
        },
        attachmentChange(fileInfo, name) {
            if (!fileInfo) {
                this.file = "";
                return;
            }

            this.file = name;

            this.$refs.form.clearValidate();
            this.updateForm("2", fileInfo);
        },
        parameterTypeChange() {
            this.file = "";
        },
    },

    async mounted() {
        await this.$dicsListsInit({
            vehicleTypeList: "vehicleType",
            wheelDriveList: "driveType",
            parameterTypeList: "dynamicParameterType",
            suspensionTypeList: "suspensionType",
            brakeTypeList: "brakeType",
            steeringTypeList: "steeringType",
            steeringGearTypeList: "steeringGearType",
            driverTypeList: "driverType",
        });

        this.getModelLabelList();
    },
};
</script>

<style lang='less' scoped>
.vehicleModelPanel {
    display: flex;
    flex: 1;
    padding: 15px 30px 10px;

    .modelList /deep/ .listPanel {
        min-height: 400px;
        height: calc(100vh - 120px);
    }

    .contentPanel {
        flex: 1;
        padding-left: 30px;
    }

    .inputBox.flexBox {
        // margin-bottom: 22px;

        .label {
            width: 138px;
        }

        div {
            line-height: 32px;
        }
    }

    .titlePanel {
        padding: 22px 0;
    }

    .btns {
        padding-top: 30px;
        text-align: center;
    }

    .modelBox {
        // width: 60%;
        min-width: 810px;
    }
}
</style>