persagy_topo_editer/src/components/editClass/edit/items/SBaseTextEdit.ts

/*
 * *********************************************************************************************************************
 *
 *          !!
 *        .F88X
 *        X8888Y
 *      .}888888N;
 *        i888888N;        .:!              .I$WI:
 *          R888888I      .'N88~            i8}+8Y&8"l8i$8>8W~'>W8}8]KW+8IIN"8&
 *          .R888888I    .;N8888~          .X8'  "8I.!,/8"  !%NY8`"8I8~~8>,88I
 *            +888888N;  .8888888Y                                  "&&8Y.}8,
 *            ./888888N;  .R888888Y        .'}~    .>}'.`+>  i}!    "i'  +/'  .'i~  !11,.:">,  .~]!  .i}i
 *              ~888888%:  .I888888l      .]88~`1/iY88Ii+1'.R$8$8]"888888888>  Y8$  W8E  X8E  W8888'188Il}Y88$*
 *              18888888    E8888881    .]W%8$`R8X'&8%++N8i,8N%N8+l8%`  .}8N:.R$RE%N88N%N$K$R  188,FE$8%~Y88I
 *            .E888888I  .i8888888'      .:$8I;88+`E8R:/8N,.>881.`$8E/1/]N8X.Y8N`"KF&&FK!'88*."88K./$88%RN888+~
 *            8888888I  .,N888888~        ~88i"8W,!N8*.I88.}888%F,i$88"F88"  888:E8X.>88!i88>`888*.}Fl1]*}1YKi'
 *          i888888N'      I888Y          ]88;/EX*IFKFK88X  K8R  .l8W  88Y  ~88}'88E&%8W.X8N``]88!.$8K  .:W8I
 *        .i888888N;        I8Y          .&8$  .X88!  i881.:%888>I88  ;88]  +88+.';;;;:.Y88X  18N.,88l  .+88/
 *      .:R888888I
 *      .&888888I                                          Copyright (c) 2016-2020.  博锐尚格科技股份有限公司
 *        ~8888'
 *        .!88~                                                                     All rights reserved.
 *
 * *********************************************************************************************************************
 */
import { SPainter, SRect, SColor, SFont, SPoint, SSize } from "@persagy-web/draw";
import { SGraphItem, STextOrigin, SLineStyle, SAnchorItem } from "@persagy-web/graph/";
import { SItemStatus } from "@persagy-web/big";
import { SGraphEdit } from ".."
import { Marker } from "../type/Marker";
import { ItemOrder } from '@persagy-web/big/lib';
import { SMouseEvent } from '@persagy-web/base/lib';

/**
 * 文本编辑类
 *
 * @author  韩耀龙 <han_yao_long@163.com>
 */
export class SBaseTextEdit extends SGraphEdit {
    /////////////////////////////////////////////////////////////////////////////////////////////////////////////
    //属性
    /**编辑相关操作的数据 */
    data: Marker | null = null;
    /** 存储相关的信息数据 */
    propertyData: any
    /** 起始锚点 */
    startItem: SGraphItem | null = null;
    /** 结束锚点 */
    endItem: SGraphItem | null = null;
    /** 编辑状态 */
    protected _status: SItemStatus = SItemStatus.Normal;
    get status(): SItemStatus {
        return this._status;
    } //Get status
    set status(value: SItemStatus) {
        const oldStatus = this._status;
        const newStatus = value;
        this._status = value;
        //状态变更触发事件
        this.$emit('StatusChange', oldStatus, newStatus)
        this.update();
    } //Set status

    /** 记录 painter */
    private _painter: SPainter | null = null;

    /** 文本内容 */
    private _text: string = "";
    get text(): string {
        return this._text;
    } //Get text
    set text(v: string) {
        this._text = v;
        this._textArr = this.text.split(/\n/g);
        this.drawFormatText();
        this.update();
    } //Set text

    /** 切割后的文本数组 */
    private _textArr: string[] = [];
    /** 锚点 list */
    anchorList: SAnchorItem[] = [];
    /** 宽度 */
    private _width: number = 64;
    get width(): number {
        return this._width;
    } //Get width
    set width(v: number) {
        if (v > 0) {
            if (v != this._width) {
                let w = this._width;
                this._width = v;
                this.onResize(
                    new SSize(w, this._height),
                    new SSize(this._width, this._height)
                );
            }
        }
    } //Set width

    /** 高度 */
    private _height: number = 64;
    get height(): number {
        return this._height;
    } //Get height
    set height(v: number) {
        if (v > 0) {
            if (v != this._height) {
                let h = this._height;
                this._height = v;
                this.onResize(
                    new SSize(this._width, h),
                    new SSize(this._width, this._height)
                );
            }
        }
    } //Set height

    /** 原点 */
    origin = new SPoint();

    /** 文本颜色 */
    private _color: SColor = new SColor("#333333");
    get color(): SColor {
        return this._color;
    } //Get color
    set color(v: SColor) {
        this._color = v;
        this.update();
    } //Set color

    /** 字体 */
    private _font: SFont = new SFont("sans-serif", 12);
    get font(): SFont {
        return this._font;
    } //Get font
    set font(v: SFont) {
        this._font = v;
        this.drawFormatText();
        this.update();
    } //Set font

    /** 背景色 */
    private _backgroundColor: SColor = SColor.Transparent;
    get backgroundColor(): SColor {
        return this._backgroundColor;
    } //Get backgroundColor
    set backgroundColor(v: SColor) {
        this._backgroundColor = v;
        this.update();
    } //Set backgroundColor

    /** 边框色 */
    private _strokeColor: SColor = SColor.Transparent;
    get strokeColor(): SColor {
        return this._strokeColor;
    } //Get strokeColor
    set strokeColor(v: SColor) {
        this._strokeColor = v;
        this.update();
    } //Set strokeColor

    /** 边框宽度 */
    private _lineWidth: number = 1;
    get lineWidth(): number {
        return this._lineWidth;
    } //Get lineWidth
    set lineWidth(v: number) {
        this._lineWidth = v;
        this.update();
    } //Set lineWidth

    /** 边框样式 */
    private _borderStyle: SLineStyle = SLineStyle.None;
    get borderStyle(): SLineStyle {
        return this._borderStyle;
    } //Get borderStyle
    set borderStyle(v: SLineStyle) {
        this._borderStyle = v;
        this.update();
    } //Set borderStyle

    /** 原点位置 */
    private _originPosition: STextOrigin = STextOrigin.LeftTop;
    get originPosition(): STextOrigin {
        return this._originPosition;
    } //Get originPosition
    set originPosition(v: STextOrigin) {
        this._originPosition = v;
        this.update();
    } //Set originPosition

    /** 文本绘制最大宽 */
    maxWidth: number | undefined = undefined;

    /**
     * 构造函数
     *
     * @param parent    指向父 Item
     * @param data      文本数据
     */
    constructor(parent: SGraphItem | null, data: Marker | null) {
        super(parent);
        if (data) {
            this.initData(data)
        }
    } // Constructor

    /**
     * 初始化 当data传入时设置相关状态
     *
     * @param data      Mark 数据
     */
    initData(data: Marker) {
        this.showSelect = false;
        this.zOrder = ItemOrder.textOrder;
        this.isTransform = false;
        this.data = data;
        this.name = data.name;
        this.moveTo(data.pos.x, data.pos.y);
        if (data.size) {
            this.width = data.size.width;
            this.height = data.size.height;
        }
        if (data.style && data.style.default) {
            // 高度
            if (data.style.default.zorder) {
                this.zOrder = data.style.default.zorder;
            }
            // 文本
            if (data.style.default.text) {
                this.text = data.style.default.text;
            }
            // 文本颜色
            if (data.style.default.strokeColor) {
                this.strokeColor = new SColor(data.style.default.strokeColor);
            }
            // 字体大小
            if (data.style.default.font) {
                this.font = new SFont("sans-serif", data.style.default.font);
            }
            // 背景色
            if (data.style.default.backgroundColor) {
                this.backgroundColor = new SColor(data.style.default.backgroundColor);
            }
        }
    }

    /**
     * 宽高发发生变化
     *
     * @param oldSize 改之前的大小
     * @param newSize 改之后大小
     */
    protected onResize(oldSize: SSize, newSize: SSize) { } // Function onResize()

    /**
     * 对象边界区域
     *
     * @return 边界区域
     */
    boundingRect(): SRect {
        return new SRect(
            -this.origin.x,
            -this.origin.y,
            this.width,
            this.height
        );
    } // Function boundingRect()

    /**
     * 移动后处理所有坐标,并肩原点置为场景原点
     *
     * @param x   x 坐标
     * @param y   y 坐标
     */
    // moveToOrigin(x: number, y: number): void {
    //     this.moveTo(this.x + x, this.y + y);
    // } // Function moveToOrigin()

    /**
     * 鼠标按下事件
     *
     * @param event   保存事件参数
     * @return 是否处理事件
     */
    onMouseDown(event: SMouseEvent): boolean {
        this.$emit('textSelect')
        super.onMouseDown(event);
        return this.moveable;
    } // Function onMouseDown()

    /**
     * 释放鼠标事件
     *
     * @param event   保存事件参数
     * @return 是否处理事件
     */
    onMouseUp(event: SMouseEvent): boolean {
        super.onMouseUp(event);
        return this.moveable;
    } // Function onMouseUp()

    /**
     * 绘制显示状态文本 Item
     *
     * @param painter    绘制类
     */
    protected drawShowText(painter: SPainter): void {
        painter.translate(-this.origin.x, -this.origin.y);
        //绘制矩形轮廓
        if (this.selected) {
            painter.shadow.shadowBlur = 10;
            painter.shadow.shadowColor = new SColor(`#00000033`);
            painter.shadow.shadowOffsetX = 5;
            painter.shadow.shadowOffsetY = 5;
        } else {
            painter.shadow.shadowColor = SColor.Transparent;
        }

        painter.brush.color = this.backgroundColor;
        painter.pen.lineWidth = this.lineWidth;
        painter.pen.color = this.strokeColor;
        painter.drawRect(0, 0, this.width, this.height);

        //绘制文本
        painter.brush.color = new SColor(this.color);
        painter.shadow.shadowColor = SColor.Transparent;
        painter.font = this.font;
        this._textArr.forEach((text: string, index: number) => {
            painter.drawText(
                text,
                this.font.size / 4,
                index * (this.font.size * 1.25) + this.font.size / 4,
                this.maxWidth
            );
        });
    } // Function drawShowText()

    /**
     * 根据换行切割文本,绘制多行并计算外轮廓宽高
     */
    protected drawFormatText(): void {
        if (this._painter instanceof SPainter) {
            this._painter.save();
            this._painter.font = this.font;
            let textMaxWidth = 0;
            let fontSize: number = this.font.size;
            this._textArr.forEach((text: string, index: number) => {
                let textWidth: number = this._painter
                    ? this._painter.textWidth(text) + fontSize / 2
                    : fontSize / 2;
                if (textWidth > textMaxWidth) {
                    textMaxWidth = textWidth;
                }
            });
            // 在绘制文本后计算文本的宽高
            this.width = textMaxWidth;
            this.height = fontSize * 1.25 * this._textArr.length + fontSize / 8;
            // 设置原点位置(默认左上角)
            if (this.originPosition == STextOrigin.Center) {
                this.origin = new SPoint(this.width / 2, this.height / 2);
            }

            this._painter.restore();
        }
    } // Function drawFormatText()

    /**
     * 返回对象储存的相关数据
     *
     * @return 对象储存的相关数据
     */
    toData(): any {
        if (this.data.size) {
            this.data.size.width = this.width;
            this.data.size.height = this.height;
        }

        this.data.pos.x = this.pos.x;
        this.data.pos.y = this.pos.y;
        this.data.style.default.zorder = this.zOrder;
        this.data.style.default.text = this.text;
        this.data.style.default.strokeColor = this.strokeColor.value;
        this.data.style.default.font = this.font.size;
        this.data.style.default.backgroundColor = this.backgroundColor.value;
        return this.data;
    } // Function toData()

    /**
     * Item 绘制操作
     *
     * @param painter       绘画类
     */
    onDraw(painter: SPainter): void {
        if (!(this._painter instanceof SPainter)) {
            this._painter = painter;
            this.drawFormatText();
        }

        this.drawShowText(painter);
    } // Function onDraw()
} // Class SBaseTextEdit