负载点列表组件优化

whyczyk

2021-05-25 17f9722fb23200c964d0c2d36d2025d552f2a3db

负载点列表组件优化

 src/components/smallModule/stepList.vue

@@ -58,11 +58,10 @@
        },
        data() {
            return {
                startArr: [],
                endArr: [],
                endTextArr: []

            }
        },

        computed: {
            status() {
                let data = this.data;
@@ -93,19 +92,31 @@
                        break;
                }
                return sizeClass;
            }
            },
            startArr() {
                let data = this.data;
                if (data.start && data.start.indexOf("&&") != -1) {
                    return data.start.split("&&")
                }
                return []
            },
            endArr() {
                let data = this.data;
                if (data.end && data.end.indexOf("&&") != -1) {
                    return data.end.split("&&")
                }
                return []
            },
            endTextArr() {
                let data = this.data;
                if (data.endText && data.endText.indexOf("&&") != -1) {
                    return data.endText.split("&&")
                }
                return []
            },
        },
        mounted() {
            let data = this.data;
            if (data.start && data.start.indexOf("\n") != -1) {
                this.startArr = data.start.split("\n")
            }
            if (data.end && data.end.indexOf("\n") != -1) {
                this.endArr = data.end.split("\n")
            }
            if (data.endText && data.endText.indexOf("\n") != -1) {
                this.endTextArr = data.endText.split("\n")
            }

        }
    }
</script>

 src/pages/test/dialog/LoadTestDialog.vue

@@ -1,12 +1,9 @@
<template>
    <div class="el-dialog-wrapper">
        <el-dialog
            :visible.sync="dialogVisible" class="position-absolute dialog-center dialog-no-header" width="840px"
        <el-dialog :visible.sync="dialogVisible" class="position-absolute dialog-center dialog-no-header" width="840px"
            top="0" :modal="false" :destroy-on-close="true" :close-on-press-escape="false" :close-on-click-modal="false"
            :modal-append-to-body="false"
            v-loading="loading" element-loading-text="拼命加载中"
            element-loading-spinner="el-icon-loading"
            element-loading-background="rgba(0, 0, 0, 0)">
            :modal-append-to-body="false" v-loading="loading" element-loading-text="拼命加载中"
            element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0)">
            <mw-step v-model="step"></mw-step>
            <div class="step-list">
                <div class="step-item" v-show="step == 0">
@@ -21,262 +18,266 @@
                </div>
            </div>
        </el-dialog>
        <el-dialog
            :visible.sync="testStepCheck" class="position-absolute dialog-center dialog-no-header"
            width="840px" top="0"
            :modal="false" :destroy-on-close="true"
            :close-on-press-escape="false" :close-on-click-modal="false"
        <el-dialog :visible.sync="testStepCheck" class="position-absolute dialog-center dialog-no-header" width="840px"
            top="0" :modal="false" :destroy-on-close="true" :close-on-press-escape="false" :close-on-click-modal="false"
            :modal-append-to-body="false">
            <test-start :type="type" @startTest="startTest" v-if="testStepCheck"></test-start>
        </el-dialog>
        <el-dialog
            :visible.sync="startResult" class="position-absolute dialog-center dialog-no-header"
            width="840px" top="0"
            :modal="false" :destroy-on-close="true"
            :close-on-press-escape="false" :close-on-click-modal="false"
        <el-dialog :visible.sync="startResult" class="position-absolute dialog-center dialog-no-header" width="840px"
            top="0" :modal="false" :destroy-on-close="true" :close-on-press-escape="false" :close-on-click-modal="false"
            :modal-append-to-body="false">
            <heating-up-rs :list="heatingUpList" @updatePoint="updatePoint"></heating-up-rs>
        </el-dialog>
        <test-step-dialog :type="type" :step="testStepKey" :list="list" :end="endStep" :progress="progressStep"></test-step-dialog>
        <test-step-dialog :type="type" :step="testStepKey" :list="list" :end="endStep" :progress="progressStep">
        </test-step-dialog>
    </div>
</template>

<script>
import mwStep from "@/components/smallModule/mwStep";
import newTest from "@/pages/test/dialog/newTest";
import TestDataInput from "@/pages/test/dialog/testDataInput";
import TestStepConfirm from "@/pages/test/dialog/testStepConfirm";
import testStepConfirmKz from "@/pages/test/dialog/testStepConfirmKz";
import TestStart from "@/pages/test/dialog/testStart";
import {addKzFzTest, experimentPoint, getExitTest, testHeatingUp} from "@/pages/test/js/api";
import HeatingUpRs from "@/pages/test/dialog/heatingUpRs";
import {getLabel} from "@/assets/js/tools";
import {constTestType} from "@/pages/test/js/const";
import Timeout from "@/assets/js/tools/Timeout";
import TestStepDialog from "@/pages/test/dialog/testStepDialog";
    import mwStep from "@/components/smallModule/mwStep";
    import newTest from "@/pages/test/dialog/newTest";
    import TestDataInput from "@/pages/test/dialog/testDataInput";
    import TestStepConfirm from "@/pages/test/dialog/testStepConfirm";
    import testStepConfirmKz from "@/pages/test/dialog/testStepConfirmKz";
    import TestStart from "@/pages/test/dialog/testStart";
    import {
        addKzFzTest,
        experimentPoint,
        getExitTest,
        testHeatingUp
    } from "@/pages/test/js/api";
    import HeatingUpRs from "@/pages/test/dialog/heatingUpRs";
    import {
        getLabel
    } from "@/assets/js/tools";
    import {
        constTestType
    } from "@/pages/test/js/const";
    import Timeout from "@/assets/js/tools/Timeout";
    import TestStepDialog from "@/pages/test/dialog/testStepDialog";

export default {
    name: "LoadTestDialog",
    props: {
        visible: {
            type: Boolean,
            default: false,
        },
        type: {
            require: true,
            type: String,
        }
    },
    components: {
        TestStepDialog,
        HeatingUpRs,
        TestStepConfirm,
        TestDataInput,
        mwStep,
        newTest,
        testStepConfirmKz,
        TestStart
    },
    data() {
        return {
            loading: false,
            timer: new Timeout(),
            step: 0,
            dialogVisible: false,
            testStepCheck: false,
            startResult: false,
            experimentId: 0,
            params: {
                baseData: {
                    experimentId: "",           // 试验编号
                    gearSpeedRatio: "",         // 齿轮转速比
                    ratedLateralSpeed: 0,       // 高速侧转速,单位:r/min
                    ratedPower: 0,              // 额定功率,单位KW
                    ratedRotateSpeed: 0,        // 额定转速,单位:r/min
                    ratedVol: 0                 // 额定电压,单位V
                },
                createTime: "",         // 创建时间
                deviceId: "",           // 被测设备id
                deviceSn: "",           // 被测设备SN
                duration: "",           // 试验时长
                endTime: "",            // 结束时间
                id: "",                 // 试验编号
                name: "",               // 试验名称
                point: [],
                projectId: 0,           // 对应的项目
                rz_link: 0,             // 各相绕组连接情况 0 引出; 1 内部连接
                startTime: "",          // 启动时间
                status: 0,              // 状态:-1-取消,0-未开始,1-进行中,2-完成
                type: "",               // 试验类型:九大试验
                userId: sessionStorage.getItem('uid'),              // 负责人
                username: ""            // 负责人姓名
    export default {
        name: "LoadTestDialog",
        props: {
            visible: {
                type: Boolean,
                default: false,
            },
            heatingUpList: [],
            list: [],
            testStepKey: -1,
            endStep: false,
            progressStep: false,
        }
    },
    watch: {
        visible(value) {
            this.dialogVisible = value;
        },
    },
    methods: {
        startTimer() {
            this.timer.start(()=>{
                this.$axios.all([
                    this.experimentPoint()
                ]).then(res => {
                    this.timer.open();
                }).catch(error => {
                    this.timer.open();
                });
            }, 2000);

        },
        experimentPoint() {
            let postData = {
                experimentId: this.experimentId
            type: {
                require: true,
                type: String,
            }
            experimentPoint(postData).then((res) => {
                let rs = res.data;
                let data = [];
                if (rs.code == 1) {
                    data = rs.data.map(item => {
                        let start = item.startTime?new Date(item.startTime).format("hh:ss"):'';
                        let end = item.endTime?new Date(item.endTime).format("hh:ss"):'';
                        item.start = item.startTime ? `开始时间\n${start}`: '';
                        item.end = item.endTime ? `完成时间\n${end}`: '';
                        item.endText = item.averagePower ? `平均功率\n${item.averagePower}kW` : '';
                        return item;
                    });
                }
                this.list = data;
                this.$nextTick(()=>{
                    // 设置testStepKey
                    let step = -1;
                    this.progressStep = false;
                    for(let i=0; i<data.length; i++) {
                        let status = data[i].status;
                        if(status == 0) {
                            step = i;
                            this.endStep = false;
                            break;
                        }else if(status == 1) {
                            step = i;
                            this.progressStep = true;
                            break;
                        }
                        step = i;
                        this.endStep = true;
                    }
                    // 设置未激活点
                    this.testStepKey = step;
                });
                this.$emit('updateList', this.list);
            }).catch((err) => {
                console.log(err)
            });
        },
        checkIsTesting() {
            getExitTest().then(res => {
                let rs = res.data;
                console.log(rs);
                if (rs.code == 1) {
                    let data = rs.data;
                    if (data.type != this.type) {
                        let testType = getLabel(data.type, constTestType);
                        this.$alert("当前已开启试验：" + testType + "。如需要进行其他试验需先关闭此试验。", '系统提示', {
                            callback: () => {
                                this.$router.push('/index/testManager/testing');
        components: {
            TestStepDialog,
            HeatingUpRs,
            TestStepConfirm,
            TestDataInput,
            mwStep,
            newTest,
            testStepConfirmKz,
            TestStart
        },
        data() {
            return {
                loading: false,
                timer: new Timeout(),
                step: 0,
                dialogVisible: false,
                testStepCheck: false,
                startResult: false,
                experimentId: 0,
                params: {
                    baseData: {
                        experimentId: "", // 试验编号
                        gearSpeedRatio: "", // 齿轮转速比
                        ratedLateralSpeed: 0, // 高速侧转速,单位:r/min
                        ratedPower: 0, // 额定功率,单位KW
                        ratedRotateSpeed: 0, // 额定转速,单位:r/min
                        ratedVol: 0 // 额定电压,单位V
                    },
                    createTime: "", // 创建时间
                    deviceId: "", // 被测设备id
                    deviceSn: "", // 被测设备SN
                    duration: "", // 试验时长
                    endTime: "", // 结束时间
                    id: "", // 试验编号
                    name: "", // 试验名称
                    point: [],
                    projectId: 0, // 对应的项目
                    rz_link: 0, // 各相绕组连接情况 0 引出; 1 内部连接
                    startTime: "", // 启动时间
                    status: 0, // 状态:-1-取消,0-未开始,1-进行中,2-完成
                    type: "", // 试验类型:九大试验
                    userId: sessionStorage.getItem('uid'), // 负责人
                    username: "" // 负责人姓名
                },
                heatingUpList: [],
                list: [],
                testStepKey: -1,
                endStep: false,
                progressStep: false,
            }
        },
        watch: {
            visible(value) {
                this.dialogVisible = value;
            },
        },
        methods: {
            startTimer() {
                this.timer.start(() => {
                    this.$axios.all([
                        this.experimentPoint()
                    ]).then(res => {
                        this.timer.open();
                    }).catch(error => {
                        this.timer.open();
                    });
                }, 2000);

            },
            experimentPoint() {
                let postData = {
                    experimentId: this.experimentId
                }
                experimentPoint(postData).then((res) => {
                    let rs = res.data;
                    let data = [];
                    if (rs.code == 1) {
                        data = rs.data.map(item => {
                            let start = item.startTime ? new Date(item.startTime).format("hh:ss") : '';
                            let end = item.endTime ? new Date(item.endTime).format("hh:ss") : '';
                            item.start = item.startTime ? `开始时间&&${start}` : '';
                            item.end = item.endTime ? `完成时间&&${end}` : '';
                            item.endText = item.averagePower ? `平均功率&&${item.averagePower}kW` : '';
                            return item;
                        });
                    }
                    this.list = data;
                    this.$nextTick(() => {
                        // 设置testStepKey
                        let step = -1;
                        this.progressStep = false;
                        for (let i = 0; i < data.length; i++) {
                            let status = data[i].status;
                            if (status == 0) {
                                step = i;
                                this.endStep = false;
                                break;
                            } else if (status == 1) {
                                step = i;
                                this.progressStep = true;
                                break;
                            }
                            step = i;
                            this.endStep = true;
                        }
                        // 设置未激活点
                        this.testStepKey = step;
                    });
                    this.$emit('updateList', this.list);
                }).catch((err) => {
                    console.log(err)
                });
            },
            checkIsTesting() {
                getExitTest().then(res => {
                    let rs = res.data;
                    console.log(rs);
                    if (rs.code == 1) {
                        let data = rs.data;
                        if (data.type != this.type) {
                            let testType = getLabel(data.type, constTestType);
                            this.$alert("当前已开启试验：" + testType + "。如需要进行其他试验需先关闭此试验。", '系统提示', {
                                callback: () => {
                                    this.$router.push('/index/testManager/testing');
                                }
                            });
                        } else {
                            console.log('查询试验步骤');
                            this.experimentId = rs.data.id;
                            this.startTimer();
                        }
                    } else {
                        this.dialogVisible = true;
                    }
                }).catch(error => {

                });
            },
            newTest(data) {
                this.params.name = data.name;
                this.params.projectId = data.projectId;
                this.step++;
            },
            dataInput(data) {
                this.params.baseData.experimentId = data.experimentId;
                this.params.id = data.experimentId;
                this.params.deviceSn = data.deviceSn;
                this.params.deviceId = data.deviceId;
                this.params.baseData.ratedPower = data.ratedPower;
                this.params.baseData.ratedVol = data.ratedVol;
                this.params.baseData.gearSpeedRatio = data.gearSpeedRatio;
                this.params.baseData.ratedRotateSpeed = data.ratedRotateSpeed;
                this.params.baseData.ratedLateralSpeed = data.ratedLateralSpeed;
                this.step++;
            },
            completeTest(data) {
                let experimentId = this.params.baseData.experimentId;
                this.params.point = data.point.map(item => {
                    item.experimentId = experimentId;
                    return item;
                });
                this.loading = true;
                addKzFzTest(this.params).then(res => {
                    let rs = res.data;
                    if (rs.code == 1) {
                        this.dialogVisible = false;
                        this.$nextTick(() => {
                            this.$layer.msg("生成试验成功");
                            this.testStepCheck = true;
                        });
                    } else {
                        console.log('查询试验步骤');
                        this.experimentId = rs.data.id;
                        this.startTimer();
                        this.$layer.msg("生成试验失败");
                    }
                } else {
                    this.dialogVisible = true;
                }
            }).catch(error => {
                    this.loading = false;
                }).catch(error => {
                    this.$layer.msg("请检测网络");
                    this.loading = false;
                });
            },
            startTest() { // 开始试验, 进行升温
                this.testStepCheck = false;
                testHeatingUp(this.params.id).then(res => {
                    let rs = res.data;
                    let data = [];
                    if (rs.code == 1) {
                        data = rs.data;
                    }
                    this.heatingUpList = data;
                    this.startResult = true;
                }).catch(error => {

            });
                });
            },
            updatePoint() { // 更新节点数据
                this.$emit('updatePoint');
                this.startResult = false;
                this.experimentId = this.params.id;
                this.startTimer();
            }
        },
        newTest(data) {
            this.params.name = data.name;
            this.params.projectId = data.projectId;
            this.step++;
        },
        dataInput(data) {
            this.params.baseData.experimentId = data.experimentId;
            this.params.id = data.experimentId;
            this.params.deviceSn = data.deviceSn;
            this.params.deviceId = data.deviceId;
            this.params.baseData.ratedPower = data.ratedPower;
            this.params.baseData.ratedVol = data.ratedVol;
            this.params.baseData.gearSpeedRatio = data.gearSpeedRatio;
            this.params.baseData.ratedRotateSpeed = data.ratedRotateSpeed;
            this.params.baseData.ratedLateralSpeed = data.ratedLateralSpeed;
            this.step++;
        },
        completeTest(data) {
            let experimentId = this.params.baseData.experimentId;
            this.params.point = data.point.map(item => {
                item.experimentId = experimentId;
                return item;
            });
            this.loading = true;
            addKzFzTest(this.params).then(res => {
                let rs = res.data;
                if (rs.code == 1) {
                    this.dialogVisible = false;
                    this.$nextTick(() => {
                        this.$layer.msg("生成试验成功");
                        this.testStepCheck = true;
                    });
                } else {
                    this.$layer.msg("生成试验失败");
                }
                this.loading = false;
            }).catch(error => {
                this.$layer.msg("请检测网络");
                this.loading = false;
            });
        },
        startTest() {           // 开始试验, 进行升温
            this.testStepCheck = false;
            testHeatingUp(this.params.id).then(res => {
                let rs = res.data;
                let data = [];
                if (rs.code == 1) {
                    data = rs.data;
                }
                this.heatingUpList = data;
                this.startResult = true;
            }).catch(error => {
        mounted() {
            this.params.type = this.type;
            this.dialogVisible = this.visible;

            });
            this.checkIsTesting();
        },
        updatePoint() {     // 更新节点数据
            this.$emit('updatePoint');
            this.startResult = false;
            this.experimentId = this.params.id;
            this.startTimer();
        destroyed() {
            this.timer.stop();
        }
    },
    mounted() {
        this.params.type = this.type;
        this.dialogVisible = this.visible;

        this.checkIsTesting();
    },
    destroyed() {
        this.timer.stop();
    }
}
</script>

<style scoped>