rt-sim-training-client/src/jmapNew/shape/Signal/ESigPost.js

import Polyline from 'zrender/src/graphic/shape/Polyline';
import Group from 'zrender/src/container/Group';
import Polygon from 'zrender/src/graphic/shape/Polygon';

class ESigPost extends Group {
    constructor(model) {
        super();
        this.model = model;
        this.create();
    }

    create() {
        const model = this.model;
        const style = this.model.style;
        // 竖杆
        this.ver = new Polyline({
            _subType: 'SignalLamp',
            _val: '3',
            zlevel: model.zlevel,
            z: model.z,
            shape: {
                points: [
                    [model.x, model.y + style.Signal.post.standardHeight * 1.2],
                    [model.x, model.y - style.Signal.post.standardHeight * 1.2]
                ]
            },
            style: {
                lineWidth: style.Signal.post.standardWidth,
                stroke: style.Signal.post.standardColor
            }
        });
        // 横杆
        this.hor = new Polyline({
            zlevel: model.zlevel,
            z: model.z,
            shape: {
                points: [
                    [model.x, model.y],
                    [model.x + model.drict * style.Signal.post.standardLength * 1.2, model.y]
                ]
            },
            style: {
                lineWidth: style.Signal.post.standardWidth,
                stroke: style.Signal.post.standardColor
            }
        });

        this.add(this.ver);
        this.add(this.hor);

        model.type === '01' ? this.hor.hide() : this.hor.show();
        if (style.Signal.post.standardShow) {
            this.hor.show();
        }
    }

    setColor(color) {
        if (color) {
            this.ver && this.ver.setStyle({ stroke: color });
            this.hor && this.hor.setStyle({ stroke: color });
        }
    }
    /* 灯柱变换为三角形并闪烁*/
    setTerminalOptional() {
        this.triangle = new Polygon({
            zlevel: this.model.zlevel,
            z: this.model.z,
            shape: {
                points: [
                    [this.model.x, this.model.y + this.model.style.Signal.post.standardHeight * 1.2],
                    [this.model.x, this.model.y - this.model.style.Signal.post.standardHeight * 1.2],
                    [this.model.x + this.model.drict * this.model.style.Signal.post.standardLength * 1.2, this.model.y]
                ]
            },
            style: {
                fill: this.model.style.Signal.post.terminalOptional
            }
        });
        this.add(this.triangle);
        this.triangle.animateStyle(true)
            .when(0, { fill: this.model.style.backgroundColor })
            .when(1000, { fill: this.model.style.Signal.post.terminalOptional })
            .when(2000, { fill: this.model.style.backgroundColor })
            .start();
        this.ver.hide();
        this.hor.hide();
        console.log('222222222222222', this.triangle);
    }
    /* 关闭闪烁三角形并还原灯柱 */
    removeTerminalOptional() {
        this.triangle && this.triangle.stopAnimation(false);
        this.triangle && this.remove(this.triangle);
        this.ver.show();
        this.hor.show();
    }
    getLampPosition(type) {
        const model = this.model;
        const style = this.model.style;
        if (style.Signal.post.standardShow) {
            type = '01';
        }
        const length = style.Signal.post.standardShow ? 4 : 0;
        if (type === '01') {
            return {
                x: model.x + model.drict * style.Signal.lamp.radiusR * 3 / 2 + model.drict * length,
                y: model.y
            };
        } else {
            return {
                x: this.hor.shape.points[1][0] + model.drict * style.Signal.lamp.radiusR + model.drict * length,
                y: this.hor.shape.points[1][1]
            };
        }
    }
}

export default ESigPost;