rt-sim-training-client/src/jmapNew/painter.js

import * as zrUtil from 'zrender/src/core/util';
// import * as vector from 'zrender/src/core/vector';
import Group from 'zrender/src/container/Group';
import deviceType from './constant/deviceType';
import systemGraphType from './constant/systemGraphType';
import transitionDeviceStatus from './constant/stateTransition';
// import shapefactory from './shape/factory';
import Graphic from './shape';
import TransformHandle from './transformHandle';
import TransformHandleScreen from './transformHandleScreen';
import deviceRender from './constant/deviceRender';

class Painter {
    constructor(jmap) {
        // 父级实例
        this.$jmap = jmap;
        this.$zr = jmap.getZr();

        // 图层数据
        this.mapInstanceLevel = {};

        this.screenFlag = false;

        // 初始图层
        this.initLevels();

        // 视图控制器
        this.$transformHandle = new TransformHandle(this);
        this.$transformHandleScreen = new TransformHandleScreen(this);
    }

    /**
     * 初始绘图实例
     * @param {*} dom
     * @param {*} config
     */
    initLevels() {

        // 添加父级图层
        this.parentLevel = new Group({ name: '__parent__' });
        this.$zr.add(this.parentLevel);

        // 添加子级图层
        zrUtil.each([
            ...Object.values(deviceType),
            ...Object.values(systemGraphType)], (type) => {
            const level = new Group({ name: `__${type}__` });
            this.mapInstanceLevel[type] = level;
            this.parentLevel.add(level);
        });
    }

    newGraph(device) {
        const type = device._type;
        // const state = this.$map.getState(); // 获取 默认状态
        const builder = Graphic.getBuilder(type); // 根据 type 绘制 面板，资源，画面对应的 instance
        return builder(device, this.$jmap);
    }

    /**
     * 重绘视图
     * @param {*} mapDevice
     */
    repaint(mapDevice) {
        // 清空视图
        this.clear();

        // 创建视图
        Object.values(mapDevice).forEach(device => {
            this.add(device);
        });
    }

    /**
     * 添加视图
     * @param {*} device
     */
    add(device) {
        try {
            const instance = device.instance || this.newGraph(device);
            if (instance) {
                device.instance = instance;
                this.$transformHandle.transformView(instance);
                this.mapInstanceLevel[device._type].add(instance);
            }
        } catch (err) {
            console.error(err);
        }
    }

    /**
     * 删除视图
     * @param {*} device
     */
    delete(device) {
        const instance = device.instance;
        if (instance) {
            this.mapInstanceLevel[device._type].remove(instance);
        }
    }

    checkTrainOverlap(device) { // 检查重叠列车
        const trainWindowCode = device.trainWindowCode;
        const overlapTrainList = [device.code];
        this.mapInstanceLevel[deviceType.Train].eachChild(elem => {
            if (elem.model.code !== device.code && elem.model.trainWindowCode === trainWindowCode) {
                overlapTrainList.push(elem.model.code);
            }
        });
        if (overlapTrainList.length > 1) {
            this.sortOverLapTrain(overlapTrainList);
        }
        return overlapTrainList;
    }
    sortOverLapTrain(overlapTrainList) { // 对重叠列车按照区段上的位置进行排序
        overlapTrainList.sort((a, b) => {
            const trainA = this.$jmap.getDeviceByCode(a);
            const trainB = this.$jmap.getDeviceByCode(b);
            if (trainA.right) {
                return trainA.offsetp - trainB.offsetp;
            } else {
                return trainB.offsetp - trainA.offsetp;
            }
        });
    }
    /**
	 * 更新列车
	 * @param {*} device
	 */
    updateTrain(device) {
        const curModel = device;
        if (curModel.sectionCode) {
            curModel.sectionModel = this.$jmap.getDeviceByCode(curModel.sectionCode);
            if (curModel.sectionModel.trainWindowCode) {
                curModel.trainWindowCode = curModel.sectionModel.trainWindowCode;
            } else if (curModel.right && curModel.sectionModel.logicSectionCodeList && curModel.sectionModel.logicSectionCodeList.length) {
                const sec = this.$jmap.getDeviceByCode(curModel.sectionModel.logicSectionCodeList[curModel.sectionModel.logicSectionCodeList.length - 1]);
                curModel.trainWindowCode = sec.trainWindowCode;
            } else if (!curModel.right && curModel.sectionModel.logicSectionCodeList && curModel.sectionModel.logicSectionCodeList.length) {
                const sec = this.$jmap.getDeviceByCode(curModel.sectionModel.logicSectionCodeList[0]);
                curModel.trainWindowCode = sec.trainWindowCode;
            }
        }

        if (curModel.trainWindowCode) {
            curModel.trainWindowModel = this.$jmap.getDeviceByCode(curModel.trainWindowCode);
        }
        const overlapTrainList = this.checkTrainOverlap(device);
        overlapTrainList.forEach((item, index) => {
            const trainDevice = this.$jmap.getDeviceByCode(item);
            trainDevice._type = deviceRender['Train']._type;
            trainDevice.zlevel = deviceRender['Train'].zlevel;
            trainDevice.overLapIndex = index;
            trainDevice.instance && this.mapInstanceLevel[deviceType.Train].remove(trainDevice.instance);
            trainDevice.instance = null;
            trainDevice.zrOffsetX = this.$jmap.$options.offsetX;
            trainDevice.zrOffsetY = this.$jmap.$options.offsetY;
            this.add(trainDevice);
        });

        if (this.screenFlag) {
            this.$transformHandleScreen.transformView(device.instance);
        }
    }

    /**
     * 更新视图
     * @param {*} device
     */
    update(device) {
        if (device) {
            try {
                if (device._dispose) {
                    this.delete(device);
                } else if (deviceType.Train.toUpperCase() == device.deviceType) {
                    this.updateTrain(device);
                } else {
                    const instance = device.instance;
                    if (instance) {
                        instance.setState(transitionDeviceStatus(device)); // 改变视图状态
                    }
                }
            } catch (err) {
                console.error(err);
            }
        }
    }
    /**
     * 更新显示模式
     */
    updateShowMode(device) {
        if (device && device.instance) {
            device.instance.setShowMode();
        }
    }
    /**
     * 更新现地显示单独集中站
    * */
    updateShowStation(device, stationCode) {
        if (device && device.instance) {
            device.instance.setShowStation(stationCode);
        }
    }
    // updateSpecialShowStation(device, flag) {
    //     if (device && device.instance) {
    //         device.instance.setShowStation(flag);
    //     }
    // }
    /**
     * 更新transform变化
     * @param {*} opt
     */
    updateTransform(opt) {
        this.screenFlag = false;
        this.$transformHandle.updateTransform(opt);
    }

    updateScreen(opt) {
        this.$transformHandleScreen.updataOffset(opt);
    }
    updateScreenNum(opts) {
        this.$transformHandleScreen.updataOffsetNum(opts);
    }
    updateTransform1(list, opts) {
        this.screenFlag = true;
        this.$transformHandleScreen.updateTransform(list, opts);
    }
    /**
	 * 更新zrender尺寸
	 * @param {*} opt
	 */
    updateZrSize(opt) {
        this.$transformHandle.updateZrSize(opt);
    }

    /**
	 * 过去坐标提示位置
	 * @param {*} opts
	 */
    getShapeTipPoint(instance, opts) {
        if (instance) {
            var point = instance.getShapeTipPoint(opts);
            if (point) {
                // 矩阵变换
                var transPoint = instance.transformCoordToGlobal(point.x, point.y);
                return {
                    x: transPoint[0],
                    y: transPoint[1]
                };
            }
        }
    }

    /**
	 * 设置图层可见
	 * @param {*} code
	 */
    setLevelVisible(list) {
        zrUtil.each(Object.values(deviceType), type => {
            const level = this.mapInstanceLevel[type];
            if (list.includes(type)) {
                level.hide();
            } else {
                level.show();
            }
        }, this);
    }

    /**
     * 刷新图层
     */
    refresh() {
        this.$zr.refresh();
    }

    /**
	 * 清除图层
	 */
    clearLevel(type) {
        const level = this.mapInstanceLevel[type];
        if (level) {
            level.removeAll();
            this.screenFlag && this.$transformHandleScreen.removeType(type);
        }
    }

    /**
     * 清除canvas
     */
    clear() {
        zrUtil.each(Object.values(this.mapInstanceLevel), (level) => {
            level && level.removeAll();
        }, this);
        this.refresh();
    }

    /**
     * 销毁图层
     */
    dispose() {
        this.mapInstanceLevel = {};
        this.parentLevel = null;
    }

    /**
     * 父级图层
     */
    getParentLevel() {
        return this.parentLevel;
    }

}

export default Painter;