Merge branch 'develop' of https://gitea.joylink.club/joylink/rtss-simulation-app-client into develop
This commit is contained in:
commit
dbed83df26
|
@ -39,8 +39,8 @@
|
|||
<circle-property
|
||||
v-else-if="drawStore.selectedGraphicType === Circle.Type"
|
||||
/>
|
||||
<cctv-button-property
|
||||
v-else-if="drawStore.selectedGraphicType === CCTVButton.Type"
|
||||
<button-property
|
||||
v-else-if="drawStore.selectedGraphicType === Button.Type"
|
||||
/>
|
||||
</q-card-section>
|
||||
</template>
|
||||
|
@ -56,8 +56,6 @@ import { useDrawStore } from 'src/stores/draw-store';
|
|||
import CanvasProperty from './properties/CanvasIscsProperty.vue';
|
||||
import IscsTextProperty from './properties/IscsTextProperty.vue';
|
||||
import { TextContent } from 'src/graphics/textContent/TextContent';
|
||||
import cctvButtonProperty from './properties/CCTV/CCTVButtonProperty.vue';
|
||||
import { CCTVButton } from 'src/graphics/CCTV/cctvButton/CCTVButton';
|
||||
import RectProperty from './properties/RectProperty.vue';
|
||||
import { Rect } from 'src/graphics/rect/Rect';
|
||||
import LineTemplate from './templates/LineTemplate.vue';
|
||||
|
@ -65,6 +63,8 @@ import LineProperty from './properties/LineProperty.vue';
|
|||
import { Line } from 'src/graphics/line/Line';
|
||||
import CircleProperty from './properties/CircleProperty.vue';
|
||||
import { Circle } from 'src/graphics/circle/Circle';
|
||||
import ButtonProperty from './properties/ButtonProperty.vue';
|
||||
import { Button } from 'src/graphics/button/Button';
|
||||
import { watch } from 'vue';
|
||||
|
||||
const drawStore = useDrawStore();
|
||||
|
|
|
@ -0,0 +1,136 @@
|
|||
<template>
|
||||
<q-form class="q-gutter-sm">
|
||||
<q-input outlined readonly v-model="buttonModel.id" label="id" />
|
||||
<q-input
|
||||
outlined
|
||||
v-model="buttonModel.code"
|
||||
@blur="onUpdate"
|
||||
label="label"
|
||||
lazy-rules
|
||||
/>
|
||||
<q-input
|
||||
outlined
|
||||
v-model.number="buttonModel.codeFontSize"
|
||||
type="number"
|
||||
@blur="onUpdate"
|
||||
label="label字体大小"
|
||||
lazy-rules
|
||||
:rules="[(val) => val >= 0 || '宽度必须大于等于0']"
|
||||
/>
|
||||
<q-input
|
||||
outlined
|
||||
v-model="buttonModel.codeColor"
|
||||
@change="onUpdate"
|
||||
label="字体颜色"
|
||||
lazy-rules
|
||||
:rules="[(val) => (val && val.length > 0) || '线色不能为空']"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="colorize" class="cursor-pointer">
|
||||
<q-popup-proxy cover transition-show="scale" transition-hide="scale">
|
||||
<q-color
|
||||
v-model="buttonModel.codeColor"
|
||||
@change="
|
||||
(val) => {
|
||||
buttonModel.codeColor = val;
|
||||
onUpdate();
|
||||
}
|
||||
"
|
||||
/>
|
||||
</q-popup-proxy>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
outlined
|
||||
class="q-mt-sm"
|
||||
v-model="buttonModel.buttonType"
|
||||
:options="optionsButtonType"
|
||||
:map-options="true"
|
||||
:emit-value="true"
|
||||
@update:model-value="onUpdate"
|
||||
label="按钮类型"
|
||||
/>
|
||||
<q-input
|
||||
outlined
|
||||
v-model="buttonModel.fillColor"
|
||||
@change="onUpdate"
|
||||
label="button颜色"
|
||||
lazy-rules
|
||||
:rules="[(val) => (val && val.length > 0) || '线色不能为空']"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="colorize" class="cursor-pointer">
|
||||
<q-popup-proxy cover transition-show="scale" transition-hide="scale">
|
||||
<q-color
|
||||
v-model="buttonModel.fillColor"
|
||||
@change="
|
||||
(val) => {
|
||||
buttonModel.fillColor = val;
|
||||
onUpdate();
|
||||
}
|
||||
"
|
||||
/>
|
||||
</q-popup-proxy>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
<q-input
|
||||
outlined
|
||||
v-model="buttonModel.alpha"
|
||||
mask="#.###"
|
||||
@blur="onUpdate"
|
||||
label="透明度"
|
||||
lazy-rules
|
||||
:rules="[
|
||||
(val) => (val && val > 0 && val <= 1) || '透明度必须大于0且小于等于1',
|
||||
]"
|
||||
/>
|
||||
<q-input
|
||||
outlined
|
||||
v-model.number="buttonModel.width"
|
||||
type="number"
|
||||
@blur="onUpdate"
|
||||
label="宽度"
|
||||
lazy-rules
|
||||
:rules="[(val) => val >= 0 || '宽度必须大于0']"
|
||||
/>
|
||||
<q-input
|
||||
outlined
|
||||
v-model.number="buttonModel.height"
|
||||
type="number"
|
||||
@blur="onUpdate"
|
||||
label="高度"
|
||||
lazy-rules
|
||||
:rules="[(val) => val >= 0 || '高度必须大于等于0']"
|
||||
/>
|
||||
<q-input
|
||||
outlined
|
||||
v-model.number="buttonModel.radius"
|
||||
type="number"
|
||||
@blur="onUpdate"
|
||||
label="圆角半径"
|
||||
lazy-rules
|
||||
:rules="[(val) => val >= 0 || '圆角半径必须大于等于0']"
|
||||
/>
|
||||
</q-form>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useFormData } from 'src/components/DrawAppFormUtils';
|
||||
import { useDrawStore } from 'src/stores/draw-store';
|
||||
import { ButtonData } from 'src/drawApp/graphics/ButtonInteraction';
|
||||
import { iscsGraphicData } from 'src/protos/iscs_graphic_data';
|
||||
|
||||
const { data: buttonModel, onUpdate } = useFormData(
|
||||
new ButtonData(),
|
||||
useDrawStore().getDrawApp()
|
||||
);
|
||||
|
||||
const optionsButtonType = [
|
||||
{ label: '无Icon', value: iscsGraphicData.Button.ButtonType.noIcon },
|
||||
{ label: '方形', value: iscsGraphicData.Button.ButtonType.cctvRect },
|
||||
{ label: '监视器', value: iscsGraphicData.Button.ButtonType.cctvMonitor },
|
||||
{ label: '半圆', value: iscsGraphicData.Button.ButtonType.cctvSemicircle },
|
||||
];
|
||||
</script>
|
|
@ -1,40 +0,0 @@
|
|||
<template>
|
||||
<q-form class="q-gutter-sm">
|
||||
<q-input outlined readonly v-model="cctvButtonModel.id" label="id" />
|
||||
<q-input
|
||||
outlined
|
||||
v-model="cctvButtonModel.code"
|
||||
@blur="onUpdate"
|
||||
label="CCTV按钮"
|
||||
lazy-rules
|
||||
/>
|
||||
<q-select
|
||||
outlined
|
||||
class="q-mt-sm"
|
||||
v-model="cctvButtonModel.buttonType"
|
||||
:options="optionsButtonType"
|
||||
:map-options="true"
|
||||
:emit-value="true"
|
||||
@update:model-value="onUpdate"
|
||||
label="按钮类型"
|
||||
/>
|
||||
</q-form>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useFormData } from 'src/components/DrawAppFormUtils';
|
||||
import { useDrawStore } from 'src/stores/draw-store';
|
||||
import { CCTVButtonData } from 'src/drawApp/graphics/CCTV/CCTVButtonInteraction';
|
||||
import { iscsGraphicData } from 'src/protos/iscs_graphic_data';
|
||||
|
||||
const { data: cctvButtonModel, onUpdate } = useFormData(
|
||||
new CCTVButtonData(),
|
||||
useDrawStore().getDrawApp()
|
||||
);
|
||||
|
||||
const optionsButtonType = [
|
||||
{ label: '方形', value: iscsGraphicData.CCTVButton.ButtonType.rect },
|
||||
{ label: '监视器', value: iscsGraphicData.CCTVButton.ButtonType.monitor },
|
||||
{ label: '半圆', value: iscsGraphicData.CCTVButton.ButtonType.semicircle },
|
||||
];
|
||||
</script>
|
|
@ -85,7 +85,7 @@
|
|||
@blur="onUpdate"
|
||||
label="高度"
|
||||
lazy-rules
|
||||
:rules="[(val) => (val && val > 0) || '宽度必须大于0']"
|
||||
:rules="[(val) => (val && val > 0) || '高度必须大于0']"
|
||||
/>
|
||||
<q-input
|
||||
outlined
|
||||
|
|
|
@ -29,6 +29,9 @@ import { LineData } from './graphics/LineInteraction';
|
|||
import { CircleDraw } from 'src/graphics/circle/CircleDrawAssistant';
|
||||
import { Circle, CircleTemplate } from 'src/graphics/circle/Circle';
|
||||
import { CircleData } from './graphics/CircleInteraction';
|
||||
import { ButtonDraw } from 'src/graphics/button/ButtonDrawAssistant';
|
||||
import { Button, ButtonTemplate } from 'src/graphics/button/Button';
|
||||
import { ButtonData } from './graphics/ButtonInteraction';
|
||||
|
||||
const UndoOptions: MenuItemOptions = {
|
||||
name: '撤销',
|
||||
|
@ -58,6 +61,7 @@ export function initCommonDrawApp(app: IDrawApp) {
|
|||
new RectDraw(app, new RectTemplate(new RectData()));
|
||||
new LineDraw(app, new LineTemplate(new LineData()));
|
||||
new CircleDraw(app, new CircleTemplate(new CircleData()));
|
||||
new ButtonDraw(app, new ButtonTemplate(new ButtonData()));
|
||||
// 画布右键菜单
|
||||
app.registerMenu(DefaultCanvasMenu);
|
||||
|
||||
|
@ -88,6 +92,7 @@ interface ICommonStorage {
|
|||
rects: iscsGraphicData.Rect[];
|
||||
lines: iscsGraphicData.Line[];
|
||||
circles: iscsGraphicData.Circle[];
|
||||
buttons: iscsGraphicData.Button[];
|
||||
};
|
||||
}
|
||||
export function loadCommonDrawDatas(storage: ICommonStorage): GraphicData[] {
|
||||
|
@ -108,6 +113,9 @@ export function loadCommonDrawDatas(storage: ICommonStorage): GraphicData[] {
|
|||
storage.commonGraphicStorage.circles.forEach((circle) => {
|
||||
datas.push(new CircleData(circle));
|
||||
});
|
||||
storage.commonGraphicStorage.buttons.forEach((button) => {
|
||||
datas.push(new ButtonData(button));
|
||||
});
|
||||
return datas;
|
||||
}
|
||||
|
||||
|
@ -140,6 +148,11 @@ export function saveCommonDrawDatas(app: IDrawApp, storage: ICommonStorage) {
|
|||
storage.commonGraphicStorage.circles.push(
|
||||
(circleData as CircleData).data
|
||||
);
|
||||
} else if (g instanceof Button) {
|
||||
const buttonData = g.saveData();
|
||||
storage.commonGraphicStorage.buttons.push(
|
||||
(buttonData as ButtonData).data
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
@ -0,0 +1,92 @@
|
|||
import * as pb_1 from 'google-protobuf';
|
||||
import { GraphicDataBase } from './GraphicDataBase';
|
||||
import { Button, IButtonData } from 'src/graphics/button/Button';
|
||||
import { iscsGraphicData } from 'src/protos/iscs_graphic_data';
|
||||
|
||||
export class ButtonData extends GraphicDataBase implements IButtonData {
|
||||
constructor(data?: iscsGraphicData.Button) {
|
||||
let button;
|
||||
if (data) {
|
||||
button = data;
|
||||
} else {
|
||||
button = new iscsGraphicData.Button({
|
||||
common: GraphicDataBase.defaultCommonInfo(Button.Type),
|
||||
});
|
||||
}
|
||||
super(button);
|
||||
}
|
||||
|
||||
public get data(): iscsGraphicData.Button {
|
||||
return this.getData<iscsGraphicData.Button>();
|
||||
}
|
||||
|
||||
get code(): string {
|
||||
return this.data.code;
|
||||
}
|
||||
set code(v: string) {
|
||||
this.data.code = v;
|
||||
}
|
||||
get codeColor(): string {
|
||||
return this.data.codeColor;
|
||||
}
|
||||
set codeColor(v: string) {
|
||||
this.data.codeColor = v;
|
||||
}
|
||||
get codeFontSize(): number {
|
||||
return this.data.codeFontSize;
|
||||
}
|
||||
set codeFontSize(v: number) {
|
||||
this.data.codeFontSize = v;
|
||||
}
|
||||
get belongSubMenu(): string {
|
||||
return this.data.codeColor;
|
||||
}
|
||||
set belongSubMenu(v: string) {
|
||||
this.data.codeColor = v;
|
||||
}
|
||||
get buttonType(): iscsGraphicData.Button.ButtonType {
|
||||
return this.data.buttonType;
|
||||
}
|
||||
set buttonType(v: iscsGraphicData.Button.ButtonType) {
|
||||
this.data.buttonType = v;
|
||||
}
|
||||
get width(): number {
|
||||
return this.data.width;
|
||||
}
|
||||
set width(v: number) {
|
||||
this.data.width = v;
|
||||
}
|
||||
get height(): number {
|
||||
return this.data.height;
|
||||
}
|
||||
set height(v: number) {
|
||||
this.data.height = v;
|
||||
}
|
||||
get radius(): number {
|
||||
return this.data.radius;
|
||||
}
|
||||
set radius(v: number) {
|
||||
this.data.radius = v;
|
||||
}
|
||||
get fillColor(): string {
|
||||
return this.data.fillColor;
|
||||
}
|
||||
set fillColor(v: string) {
|
||||
this.data.fillColor = v;
|
||||
}
|
||||
get alpha(): number {
|
||||
return this.data.alpha;
|
||||
}
|
||||
set alpha(v: number) {
|
||||
this.data.alpha = v;
|
||||
}
|
||||
clone(): ButtonData {
|
||||
return new ButtonData(this.data.cloneMessage());
|
||||
}
|
||||
copyFrom(data: ButtonData): void {
|
||||
pb_1.Message.copyInto(data.data, this.data);
|
||||
}
|
||||
eq(other: ButtonData): boolean {
|
||||
return pb_1.Message.equals(this.data, other.data);
|
||||
}
|
||||
}
|
|
@ -1,47 +0,0 @@
|
|||
import * as pb_1 from 'google-protobuf';
|
||||
import { GraphicDataBase } from '../GraphicDataBase';
|
||||
import {
|
||||
CCTVButton,
|
||||
ICCTVButtonData,
|
||||
} from 'src/graphics/CCTV/cctvButton/CCTVButton';
|
||||
import { iscsGraphicData } from 'src/protos/iscs_graphic_data';
|
||||
|
||||
export class CCTVButtonData extends GraphicDataBase implements ICCTVButtonData {
|
||||
constructor(data?: iscsGraphicData.CCTVButton) {
|
||||
let cctvButton;
|
||||
if (data) {
|
||||
cctvButton = data;
|
||||
} else {
|
||||
cctvButton = new iscsGraphicData.CCTVButton({
|
||||
common: GraphicDataBase.defaultCommonInfo(CCTVButton.Type),
|
||||
});
|
||||
}
|
||||
super(cctvButton);
|
||||
}
|
||||
|
||||
public get data(): iscsGraphicData.CCTVButton {
|
||||
return this.getData<iscsGraphicData.CCTVButton>();
|
||||
}
|
||||
|
||||
get code(): string {
|
||||
return this.data.code;
|
||||
}
|
||||
set code(v: string) {
|
||||
this.data.code = v;
|
||||
}
|
||||
get buttonType(): iscsGraphicData.CCTVButton.ButtonType {
|
||||
return this.data.buttonType;
|
||||
}
|
||||
set buttonType(v: iscsGraphicData.CCTVButton.ButtonType) {
|
||||
this.data.buttonType = v;
|
||||
}
|
||||
clone(): CCTVButtonData {
|
||||
return new CCTVButtonData(this.data.cloneMessage());
|
||||
}
|
||||
copyFrom(data: CCTVButtonData): void {
|
||||
pb_1.Message.copyInto(data.data, this.data);
|
||||
}
|
||||
eq(other: CCTVButtonData): boolean {
|
||||
return pb_1.Message.equals(this.data, other.data);
|
||||
}
|
||||
}
|
|
@ -17,12 +17,6 @@ import {
|
|||
saveDrawToServer,
|
||||
handlerNoEditCommonData,
|
||||
} from './commonApp';
|
||||
import { CCTVButtonData } from './graphics/CCTV/CCTVButtonInteraction';
|
||||
import { CCTVButtonDraw } from 'src/graphics/CCTV/cctvButton/CCTVButtonDrawAssistant';
|
||||
import {
|
||||
CCTVButton,
|
||||
CCTVButtonTemplate,
|
||||
} from 'src/graphics/CCTV/cctvButton/CCTVButton';
|
||||
import { useDrawStore } from 'src/stores/draw-store';
|
||||
import { iscsGraphicData } from 'src/protos/iscs_graphic_data';
|
||||
import { getDraft } from 'src/api/DraftApi';
|
||||
|
@ -72,7 +66,6 @@ export function initIscsDrawApp(): IDrawApp {
|
|||
|
||||
const app = drawApp;
|
||||
initCommonDrawApp(app);
|
||||
new CCTVButtonDraw(app, new CCTVButtonTemplate(new CCTVButtonData()));
|
||||
new FasFailureControlHostDraw(
|
||||
app,
|
||||
new FasFailureControlHostTemplate(new FasFailureControlHostData())
|
||||
|
@ -255,9 +248,9 @@ export async function loadDrawDatas(): Promise<IGraphicStorage> {
|
|||
) {
|
||||
canvasProperty = ctvOfStationControl.canvas;
|
||||
datas = loadCommonDrawDatas(ctvOfStationControl);
|
||||
ctvOfStationControl.cctvButtons.forEach((cctvButton) => {
|
||||
/* ctvOfStationControl.cctvButtons.forEach((cctvButton) => {
|
||||
datas.push(new CCTVButtonData(cctvButton));
|
||||
});
|
||||
}); */
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
@ -353,14 +346,14 @@ export function saveDrawDatas(app: IDrawApp) {
|
|||
cctvOfStationControl
|
||||
) as iscsGraphicData.CCTVOfStationControlStorage;
|
||||
|
||||
graphics.forEach((g) => {
|
||||
/* graphics.forEach((g) => {
|
||||
if (g instanceof CCTVButton) {
|
||||
const cctvButtonData = g.saveData();
|
||||
cctvStorage.cctvButtons.push(
|
||||
(cctvButtonData as CCTVButtonData).data
|
||||
);
|
||||
}
|
||||
});
|
||||
}); */
|
||||
storage.cctvOfStationControlStorages[i] = cctvStorage;
|
||||
break;
|
||||
}
|
||||
|
|
|
@ -1,81 +0,0 @@
|
|||
import { GraphicData, JlGraphic, JlGraphicTemplate } from 'jl-graphic';
|
||||
import CCTV_Button_Assets from './cctv-button-spritesheet.png';
|
||||
import CCTV_Button_JSON from './cctv-button-data.json';
|
||||
import { Assets, Sprite, Spritesheet, Texture } from 'pixi.js';
|
||||
import { iscsGraphicData } from 'src/protos/iscs_graphic_data';
|
||||
|
||||
interface CCTVButtonTextures {
|
||||
rectPressBtn: Texture;
|
||||
rectBtn: Texture;
|
||||
monitorBtn: Texture;
|
||||
semicircleBtn: Texture;
|
||||
}
|
||||
|
||||
export interface ICCTVButtonData extends GraphicData {
|
||||
get code(): string;
|
||||
set code(v: string);
|
||||
get buttonType(): iscsGraphicData.CCTVButton.ButtonType;
|
||||
set buttonType(v: iscsGraphicData.CCTVButton.ButtonType);
|
||||
}
|
||||
|
||||
export class CCTVButton extends JlGraphic {
|
||||
static Type = 'CCTVButton';
|
||||
_cctvButton: Sprite;
|
||||
cctvButtonTextures: CCTVButtonTextures;
|
||||
__state = 0;
|
||||
|
||||
constructor(cctvButtonTextures: CCTVButtonTextures) {
|
||||
super(CCTVButton.Type);
|
||||
this.cctvButtonTextures = cctvButtonTextures;
|
||||
this._cctvButton = new Sprite();
|
||||
this._cctvButton.texture = this.cctvButtonTextures.rectBtn;
|
||||
this._cctvButton.anchor.set(0.5);
|
||||
this.addChild(this._cctvButton);
|
||||
}
|
||||
get code(): string {
|
||||
return this.datas.code;
|
||||
}
|
||||
get datas(): ICCTVButtonData {
|
||||
return this.getDatas<ICCTVButtonData>();
|
||||
}
|
||||
|
||||
doRepaint(): void {
|
||||
if (this.datas.buttonType == iscsGraphicData.CCTVButton.ButtonType.rect) {
|
||||
this._cctvButton.texture = this.cctvButtonTextures.rectBtn;
|
||||
} else if (
|
||||
this.datas.buttonType == iscsGraphicData.CCTVButton.ButtonType.monitor
|
||||
) {
|
||||
this._cctvButton.texture = this.cctvButtonTextures.monitorBtn;
|
||||
} else {
|
||||
this._cctvButton.texture = this.cctvButtonTextures.semicircleBtn;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export class CCTVButtonTemplate extends JlGraphicTemplate<CCTVButton> {
|
||||
cctvButtonTextures?: CCTVButtonTextures;
|
||||
constructor(dataTemplate: ICCTVButtonData) {
|
||||
super(CCTVButton.Type, { dataTemplate });
|
||||
this.loadAssets();
|
||||
}
|
||||
new(): CCTVButton {
|
||||
if (this.cctvButtonTextures) {
|
||||
const g = new CCTVButton(this.cctvButtonTextures);
|
||||
g.loadData(this.datas);
|
||||
return g;
|
||||
}
|
||||
throw new Error('资源未加载/加载失败');
|
||||
}
|
||||
async loadAssets(): Promise<CCTVButtonTextures> {
|
||||
const texture = await Assets.load(CCTV_Button_Assets);
|
||||
const cctvButtonSheet = new Spritesheet(texture, CCTV_Button_JSON);
|
||||
const result = await cctvButtonSheet.parse();
|
||||
this.cctvButtonTextures = {
|
||||
rectPressBtn: result['rect-press-btn.png'],
|
||||
rectBtn: result['rect-btn.png'],
|
||||
monitorBtn: result['monitor-btn.png'],
|
||||
semicircleBtn: result['semicircle-btn.png'],
|
||||
};
|
||||
return this.cctvButtonTextures as CCTVButtonTextures;
|
||||
}
|
||||
}
|
|
@ -1,122 +0,0 @@
|
|||
import { DisplayObject, FederatedMouseEvent, Point } from 'pixi.js';
|
||||
import {
|
||||
AbsorbableLine,
|
||||
AbsorbablePosition,
|
||||
GraphicDrawAssistant,
|
||||
GraphicInteractionPlugin,
|
||||
GraphicTransformEvent,
|
||||
IDrawApp,
|
||||
JlGraphic,
|
||||
} from 'jl-graphic';
|
||||
import { ICCTVButtonData, CCTVButton, CCTVButtonTemplate } from './CCTVButton';
|
||||
|
||||
export class CCTVButtonDraw extends GraphicDrawAssistant<
|
||||
CCTVButtonTemplate,
|
||||
ICCTVButtonData
|
||||
> {
|
||||
_cctvButton: CCTVButton | null = null;
|
||||
constructor(app: IDrawApp, template: CCTVButtonTemplate) {
|
||||
super(
|
||||
app,
|
||||
template,
|
||||
'svguse:../drawIcon.svg#icon-psl-button',
|
||||
'cctv按钮'
|
||||
);
|
||||
CCTVButtonInteraction.init(app);
|
||||
}
|
||||
|
||||
bind(): void {
|
||||
super.bind();
|
||||
if (!this._cctvButton) {
|
||||
this._cctvButton = this.graphicTemplate.new();
|
||||
this.container.addChild(this._cctvButton);
|
||||
}
|
||||
}
|
||||
|
||||
public get cctvButton(): CCTVButton {
|
||||
if (!this._cctvButton) {
|
||||
this._cctvButton = this.graphicTemplate.new();
|
||||
this.container.addChild(this._cctvButton);
|
||||
}
|
||||
return this._cctvButton;
|
||||
}
|
||||
|
||||
redraw(cp: Point): void {
|
||||
this.cctvButton.position.copyFrom(cp);
|
||||
}
|
||||
onLeftUp(e: FederatedMouseEvent): void {
|
||||
this.cctvButton.position.copyFrom(this.toCanvasCoordinates(e.global));
|
||||
this.createAndStore(true);
|
||||
}
|
||||
prepareData(data: ICCTVButtonData): boolean {
|
||||
data.transform = this.cctvButton.saveTransform();
|
||||
return true;
|
||||
}
|
||||
onEsc(): void {
|
||||
this.finish();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 构建吸附线
|
||||
* @param cctvButton
|
||||
*/
|
||||
function buildAbsorbablePositions(cctvButton: CCTVButton): AbsorbablePosition[] {
|
||||
const aps: AbsorbablePosition[] = [];
|
||||
const cctvButtons = cctvButton.queryStore.queryByType<CCTVButton>(
|
||||
CCTVButton.Type
|
||||
);
|
||||
const canvas = cctvButton.getCanvas();
|
||||
cctvButtons.forEach((item) => {
|
||||
if (item.id === cctvButton.id) {
|
||||
return;
|
||||
}
|
||||
const ala = new AbsorbableLine(
|
||||
new Point(item.x, 0),
|
||||
new Point(item.x, canvas.height)
|
||||
);
|
||||
const alb = new AbsorbableLine(
|
||||
new Point(0, item.y),
|
||||
new Point(canvas.width, item.y)
|
||||
);
|
||||
aps.push(ala);
|
||||
aps.push(alb);
|
||||
});
|
||||
|
||||
return aps;
|
||||
}
|
||||
|
||||
export class CCTVButtonInteraction extends GraphicInteractionPlugin<CCTVButton> {
|
||||
static Name = 'cctv_button_transform';
|
||||
constructor(app: IDrawApp) {
|
||||
super(CCTVButtonInteraction.Name, app);
|
||||
}
|
||||
static init(app: IDrawApp) {
|
||||
return new CCTVButtonInteraction(app);
|
||||
}
|
||||
filter(...grahpics: JlGraphic[]): CCTVButton[] | undefined {
|
||||
return grahpics
|
||||
.filter((g) => g.type === CCTVButton.Type)
|
||||
.map((g) => g as CCTVButton);
|
||||
}
|
||||
bind(g: CCTVButton): void {
|
||||
g.eventMode = 'static';
|
||||
g.cursor = 'pointer';
|
||||
g.scalable = true;
|
||||
g.rotatable = true;
|
||||
g.on('transformstart', this.transformstart, this);
|
||||
}
|
||||
unbind(g: CCTVButton): void {
|
||||
g.eventMode = 'none';
|
||||
g.scalable = false;
|
||||
g.rotatable = false;
|
||||
g.off('transformstart', this.transformstart, this);
|
||||
}
|
||||
transformstart(e: GraphicTransformEvent) {
|
||||
const target = e.target as DisplayObject;
|
||||
const cctvButton = target.getGraphic() as CCTVButton;
|
||||
cctvButton.getGraphicApp().setOptions({
|
||||
absorbablePositions: buildAbsorbablePositions(cctvButton),
|
||||
});
|
||||
}
|
||||
}
|
|
@ -0,0 +1,203 @@
|
|||
import {
|
||||
getRectangleCenter,
|
||||
GraphicData,
|
||||
JlGraphic,
|
||||
JlGraphicTemplate,
|
||||
VectorText,
|
||||
} from 'jl-graphic';
|
||||
import CCTV_Button_Assets from './cctv-button-spritesheet.png';
|
||||
import CCTV_Button_JSON from './cctv-button-data.json';
|
||||
import {
|
||||
Assets,
|
||||
Color,
|
||||
Graphics,
|
||||
Rectangle,
|
||||
Sprite,
|
||||
Spritesheet,
|
||||
Texture,
|
||||
} from 'pixi.js';
|
||||
import { iscsGraphicData } from 'src/protos/iscs_graphic_data';
|
||||
|
||||
interface ButtonTextures {
|
||||
rectPressBtn: Texture;
|
||||
rectBtn: Texture;
|
||||
monitorBtn: Texture;
|
||||
semicircleBtn: Texture;
|
||||
}
|
||||
|
||||
export const buttonConsts = {
|
||||
width: 60,
|
||||
height: 30,
|
||||
radius: 2,
|
||||
fillColor: '0x1976D2',
|
||||
alpha: 1,
|
||||
codeColor: '#000',
|
||||
codeFontSize: 16,
|
||||
};
|
||||
|
||||
export interface IButtonData extends GraphicData {
|
||||
get code(): string;
|
||||
set code(v: string);
|
||||
get codeColor(): string; // 填充色
|
||||
set codeColor(v: string);
|
||||
get codeFontSize(): number; // 宽度
|
||||
set codeFontSize(v: number);
|
||||
get belongSubMenu(): string; // 所属子菜单
|
||||
set belongSubMenu(v: string);
|
||||
get buttonType(): iscsGraphicData.Button.ButtonType;
|
||||
set buttonType(v: iscsGraphicData.Button.ButtonType);
|
||||
get width(): number; // 宽度
|
||||
set width(v: number);
|
||||
get height(): number; // 高度
|
||||
set height(v: number);
|
||||
get radius(): number; // 圆角半径
|
||||
set radius(v: number);
|
||||
get fillColor(): string; // 填充色
|
||||
set fillColor(v: string);
|
||||
get alpha(): number; // 透明度
|
||||
set alpha(v: number);
|
||||
}
|
||||
|
||||
export class Button extends JlGraphic {
|
||||
static Type = 'Button';
|
||||
_buttonIcon: Sprite;
|
||||
labelGraphic = new VectorText();
|
||||
buttonTextures: ButtonTextures;
|
||||
buttonBackground: Graphics = new Graphics();
|
||||
__state = 0;
|
||||
|
||||
constructor(buttonTextures: ButtonTextures) {
|
||||
super(Button.Type);
|
||||
this.buttonTextures = buttonTextures;
|
||||
this._buttonIcon = new Sprite();
|
||||
this._buttonIcon.anchor.set(0.5);
|
||||
this.addChild(this.buttonBackground);
|
||||
}
|
||||
get code(): string {
|
||||
return this.datas.code;
|
||||
}
|
||||
get datas(): IButtonData {
|
||||
return this.getDatas<IButtonData>();
|
||||
}
|
||||
|
||||
doRepaint(): void {
|
||||
this.buttonBackground.clear();
|
||||
if (this.datas.width > 0 && this.datas.height > 0) {
|
||||
this.drawRect();
|
||||
} else {
|
||||
this.removeChild(this.buttonBackground);
|
||||
}
|
||||
|
||||
if (this.datas.buttonType !== iscsGraphicData.Button.ButtonType.noIcon) {
|
||||
this.addChild(this._buttonIcon);
|
||||
this._buttonIcon.transformSave = true;
|
||||
this._buttonIcon.name = 'buttonIcon';
|
||||
if (this.datas.buttonType == iscsGraphicData.Button.ButtonType.cctvRect) {
|
||||
this._buttonIcon.texture = this.buttonTextures.rectBtn;
|
||||
} else if (
|
||||
this.datas.buttonType == iscsGraphicData.Button.ButtonType.cctvMonitor
|
||||
) {
|
||||
this._buttonIcon.texture = this.buttonTextures.monitorBtn;
|
||||
}
|
||||
if (
|
||||
this.datas.buttonType ==
|
||||
iscsGraphicData.Button.ButtonType.cctvSemicircle
|
||||
) {
|
||||
this._buttonIcon.texture = this.buttonTextures.semicircleBtn;
|
||||
}
|
||||
const iconPosition = this.datas.childTransforms?.find(
|
||||
(t) => t.name === this._buttonIcon.name
|
||||
)?.transform.position;
|
||||
if (iconPosition) {
|
||||
this._buttonIcon.position.set(iconPosition.x, iconPosition.y);
|
||||
} else {
|
||||
this._buttonIcon.position.set(0, 0);
|
||||
}
|
||||
const iconScale = this.datas.childTransforms?.find(
|
||||
(t) => t.name === this._buttonIcon.name
|
||||
)?.transform.scale;
|
||||
if (iconScale) {
|
||||
this._buttonIcon.scale.set(iconScale.x, iconScale.y);
|
||||
} else {
|
||||
this._buttonIcon.scale.set(1, 1);
|
||||
}
|
||||
} else {
|
||||
this.removeChild(this._buttonIcon);
|
||||
}
|
||||
|
||||
if (this.datas.code) {
|
||||
this.labelGraphic.text = this.datas.code;
|
||||
this.datas.codeFontSize =
|
||||
this.datas.codeFontSize || buttonConsts.codeFontSize;
|
||||
this.datas.codeColor = this.datas.codeColor || buttonConsts.codeColor;
|
||||
this.setTextGraphic(this.labelGraphic, 'label');
|
||||
const labelPosition = this.datas.childTransforms?.find(
|
||||
(t) => t.name === this.labelGraphic.name
|
||||
)?.transform.position;
|
||||
if (labelPosition) {
|
||||
this.labelGraphic.position.set(labelPosition.x, labelPosition.y);
|
||||
} else {
|
||||
this.labelGraphic.position.set(0, 0);
|
||||
}
|
||||
this.addChild(this.labelGraphic);
|
||||
} else {
|
||||
this.removeChild(this.labelGraphic);
|
||||
}
|
||||
}
|
||||
|
||||
drawRect(): void {
|
||||
const buttonBackground = this.buttonBackground;
|
||||
const width = this.datas.width || buttonConsts.width;
|
||||
const height = this.datas.height || buttonConsts.height;
|
||||
const radius = this.datas?.radius || buttonConsts.radius;
|
||||
const fillColor = this.datas.fillColor || buttonConsts.fillColor;
|
||||
buttonBackground.lineStyle(1, new Color(fillColor));
|
||||
buttonBackground.beginFill(
|
||||
fillColor,
|
||||
this.datas.alpha || buttonConsts.alpha
|
||||
);
|
||||
buttonBackground.drawRoundedRect(0, 0, width, height, radius);
|
||||
buttonBackground.endFill;
|
||||
buttonBackground.pivot = getRectangleCenter(
|
||||
new Rectangle(0, 0, width, height)
|
||||
);
|
||||
}
|
||||
|
||||
setTextGraphic(g: VectorText, name: string) {
|
||||
const fontSize = this.datas.codeFontSize;
|
||||
g.setVectorFontSize(fontSize);
|
||||
g.anchor.set(0.5);
|
||||
g.style.fill = this.datas.codeColor;
|
||||
g.transformSave = true;
|
||||
g.name = name;
|
||||
}
|
||||
}
|
||||
|
||||
export class ButtonTemplate extends JlGraphicTemplate<Button> {
|
||||
buttonTextures?: ButtonTextures;
|
||||
constructor(dataTemplate: IButtonData) {
|
||||
super(Button.Type, { dataTemplate });
|
||||
this.loadAssets();
|
||||
}
|
||||
new(): Button {
|
||||
if (this.buttonTextures) {
|
||||
const g = new Button(this.buttonTextures);
|
||||
g.loadData(this.datas);
|
||||
g.drawRect();
|
||||
return g;
|
||||
}
|
||||
throw new Error('资源未加载/加载失败');
|
||||
}
|
||||
async loadAssets(): Promise<ButtonTextures> {
|
||||
const texture = await Assets.load(CCTV_Button_Assets);
|
||||
const buttonSheet = new Spritesheet(texture, CCTV_Button_JSON);
|
||||
const result = await buttonSheet.parse();
|
||||
this.buttonTextures = {
|
||||
rectPressBtn: result['rect-press-btn.png'],
|
||||
rectBtn: result['rect-btn.png'],
|
||||
monitorBtn: result['monitor-btn.png'],
|
||||
semicircleBtn: result['semicircle-btn.png'],
|
||||
};
|
||||
return this.buttonTextures as ButtonTextures;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,129 @@
|
|||
import { DisplayObject, FederatedMouseEvent, Point } from 'pixi.js';
|
||||
import {
|
||||
AbsorbableLine,
|
||||
AbsorbablePosition,
|
||||
GraphicDrawAssistant,
|
||||
GraphicInteractionPlugin,
|
||||
GraphicTransformEvent,
|
||||
IDrawApp,
|
||||
JlGraphic,
|
||||
} from 'jl-graphic';
|
||||
import { IButtonData, Button, ButtonTemplate, buttonConsts } from './Button';
|
||||
|
||||
export class ButtonDraw extends GraphicDrawAssistant<
|
||||
ButtonTemplate,
|
||||
IButtonData
|
||||
> {
|
||||
_button: Button | null = null;
|
||||
constructor(app: IDrawApp, template: ButtonTemplate) {
|
||||
super(app, template, 'radio_button_checked', '按钮');
|
||||
ButtonInteraction.init(app);
|
||||
}
|
||||
|
||||
bind(): void {
|
||||
super.bind();
|
||||
if (!this._button) {
|
||||
this._button = this.graphicTemplate.new();
|
||||
this.container.addChild(this._button);
|
||||
}
|
||||
}
|
||||
|
||||
public get button(): Button {
|
||||
if (!this._button) {
|
||||
this._button = this.graphicTemplate.new();
|
||||
this.container.addChild(this._button);
|
||||
}
|
||||
return this._button;
|
||||
}
|
||||
|
||||
redraw(cp: Point): void {
|
||||
this.button.position.copyFrom(cp);
|
||||
}
|
||||
onLeftUp(e: FederatedMouseEvent): void {
|
||||
this.button.position.copyFrom(this.toCanvasCoordinates(e.global));
|
||||
this.createAndStore(true);
|
||||
}
|
||||
prepareData(data: IButtonData): boolean {
|
||||
data.transform = this.button.saveTransform();
|
||||
data.width = buttonConsts.width;
|
||||
data.height = buttonConsts.height;
|
||||
data.fillColor = buttonConsts.fillColor;
|
||||
data.radius = buttonConsts.radius;
|
||||
data.alpha = buttonConsts.alpha;
|
||||
return true;
|
||||
}
|
||||
onEsc(): void {
|
||||
this.finish();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 构建吸附线
|
||||
* @param button
|
||||
*/
|
||||
function buildAbsorbablePositions(button: Button): AbsorbablePosition[] {
|
||||
const aps: AbsorbablePosition[] = [];
|
||||
const buttons = button.queryStore.queryByType<Button>(Button.Type);
|
||||
const canvas = button.getCanvas();
|
||||
buttons.forEach((item) => {
|
||||
if (item.id === button.id) {
|
||||
return;
|
||||
}
|
||||
const ala = new AbsorbableLine(
|
||||
new Point(item.x, 0),
|
||||
new Point(item.x, canvas.height)
|
||||
);
|
||||
const alb = new AbsorbableLine(
|
||||
new Point(0, item.y),
|
||||
new Point(canvas.width, item.y)
|
||||
);
|
||||
aps.push(ala);
|
||||
aps.push(alb);
|
||||
});
|
||||
|
||||
return aps;
|
||||
}
|
||||
|
||||
export class ButtonInteraction extends GraphicInteractionPlugin<Button> {
|
||||
static Name = 'cctv_button_transform';
|
||||
constructor(app: IDrawApp) {
|
||||
super(ButtonInteraction.Name, app);
|
||||
}
|
||||
static init(app: IDrawApp) {
|
||||
return new ButtonInteraction(app);
|
||||
}
|
||||
filter(...grahpics: JlGraphic[]): Button[] | undefined {
|
||||
return grahpics
|
||||
.filter((g) => g.type === Button.Type)
|
||||
.map((g) => g as Button);
|
||||
}
|
||||
bind(g: Button): void {
|
||||
g.eventMode = 'static';
|
||||
g.cursor = 'pointer';
|
||||
g.scalable = true;
|
||||
g.rotatable = true;
|
||||
g.labelGraphic.eventMode = 'static';
|
||||
g.labelGraphic.cursor = 'pointer';
|
||||
g.labelGraphic.selectable = true;
|
||||
g.labelGraphic.draggable = true;
|
||||
g._buttonIcon.eventMode = 'static';
|
||||
g._buttonIcon.cursor = 'pointer';
|
||||
g._buttonIcon.scalable = true;
|
||||
g._buttonIcon.selectable = true;
|
||||
g._buttonIcon.draggable = true;
|
||||
g.on('transformstart', this.transformstart, this);
|
||||
}
|
||||
unbind(g: Button): void {
|
||||
g.eventMode = 'none';
|
||||
g.labelGraphic.eventMode = 'none';
|
||||
g._buttonIcon.eventMode = 'none';
|
||||
g.off('transformstart', this.transformstart, this);
|
||||
}
|
||||
transformstart(e: GraphicTransformEvent) {
|
||||
const target = e.target as DisplayObject;
|
||||
const button = target.getGraphic() as Button;
|
||||
button.getGraphicApp().setOptions({
|
||||
absorbablePositions: buildAbsorbablePositions(button),
|
||||
});
|
||||
}
|
||||
}
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
@ -282,7 +282,7 @@ import { onMounted, onUnmounted, reactive, ref, watch } from 'vue';
|
|||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { date, useQuasar } from 'quasar';
|
||||
import { useDrawStore } from 'src/stores/draw-store';
|
||||
import { CCTVButton } from 'src/graphics/CCTV/cctvButton/CCTVButton';
|
||||
import { Button } from 'src/graphics/button/Button';
|
||||
import { Arrow } from 'src/graphics/arrow/Arrow';
|
||||
import { TextContent } from 'src/graphics/textContent/TextContent';
|
||||
import { Rect } from 'src/graphics/rect/Rect';
|
||||
|
@ -384,10 +384,11 @@ function handleUtilsOption() {
|
|||
Circle.Type,
|
||||
Rect.Type,
|
||||
Line.Type,
|
||||
Button.Type,
|
||||
];
|
||||
switch (drawStore.selectSubmenuAndStation.submenu) {
|
||||
case '监控布局图':
|
||||
drawAssistantsTypes.push(CCTVButton.Type);
|
||||
//drawAssistantsTypes.push(CCTVButton.Type);
|
||||
break;
|
||||
case '火灾报警平面图':
|
||||
drawAssistantsTypes.push(FasFailureControlHost.Type);
|
||||
|
|
|
@ -217,9 +217,10 @@ export namespace iscsGraphicData {
|
|||
rects?: Rect[];
|
||||
lines?: Line[];
|
||||
circles?: Circle[];
|
||||
buttons?: Button[];
|
||||
}) {
|
||||
super();
|
||||
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [1, 2, 3, 4, 5], this.#one_of_decls);
|
||||
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [1, 2, 3, 4, 5, 6], this.#one_of_decls);
|
||||
if (!Array.isArray(data) && typeof data == "object") {
|
||||
if ("arrows" in data && data.arrows != undefined) {
|
||||
this.arrows = data.arrows;
|
||||
|
@ -236,6 +237,9 @@ export namespace iscsGraphicData {
|
|||
if ("circles" in data && data.circles != undefined) {
|
||||
this.circles = data.circles;
|
||||
}
|
||||
if ("buttons" in data && data.buttons != undefined) {
|
||||
this.buttons = data.buttons;
|
||||
}
|
||||
}
|
||||
}
|
||||
get arrows() {
|
||||
|
@ -268,12 +272,19 @@ export namespace iscsGraphicData {
|
|||
set circles(value: Circle[]) {
|
||||
pb_1.Message.setRepeatedWrapperField(this, 5, value);
|
||||
}
|
||||
get buttons() {
|
||||
return pb_1.Message.getRepeatedWrapperField(this, Button, 6) as Button[];
|
||||
}
|
||||
set buttons(value: Button[]) {
|
||||
pb_1.Message.setRepeatedWrapperField(this, 6, value);
|
||||
}
|
||||
static fromObject(data: {
|
||||
arrows?: ReturnType<typeof Arrow.prototype.toObject>[];
|
||||
texts?: ReturnType<typeof Text.prototype.toObject>[];
|
||||
rects?: ReturnType<typeof Rect.prototype.toObject>[];
|
||||
lines?: ReturnType<typeof Line.prototype.toObject>[];
|
||||
circles?: ReturnType<typeof Circle.prototype.toObject>[];
|
||||
buttons?: ReturnType<typeof Button.prototype.toObject>[];
|
||||
}): CommonGraphicStorage {
|
||||
const message = new CommonGraphicStorage({});
|
||||
if (data.arrows != null) {
|
||||
|
@ -291,6 +302,9 @@ export namespace iscsGraphicData {
|
|||
if (data.circles != null) {
|
||||
message.circles = data.circles.map(item => Circle.fromObject(item));
|
||||
}
|
||||
if (data.buttons != null) {
|
||||
message.buttons = data.buttons.map(item => Button.fromObject(item));
|
||||
}
|
||||
return message;
|
||||
}
|
||||
toObject() {
|
||||
|
@ -300,6 +314,7 @@ export namespace iscsGraphicData {
|
|||
rects?: ReturnType<typeof Rect.prototype.toObject>[];
|
||||
lines?: ReturnType<typeof Line.prototype.toObject>[];
|
||||
circles?: ReturnType<typeof Circle.prototype.toObject>[];
|
||||
buttons?: ReturnType<typeof Button.prototype.toObject>[];
|
||||
} = {};
|
||||
if (this.arrows != null) {
|
||||
data.arrows = this.arrows.map((item: Arrow) => item.toObject());
|
||||
|
@ -316,6 +331,9 @@ export namespace iscsGraphicData {
|
|||
if (this.circles != null) {
|
||||
data.circles = this.circles.map((item: Circle) => item.toObject());
|
||||
}
|
||||
if (this.buttons != null) {
|
||||
data.buttons = this.buttons.map((item: Button) => item.toObject());
|
||||
}
|
||||
return data;
|
||||
}
|
||||
serialize(): Uint8Array;
|
||||
|
@ -332,6 +350,8 @@ export namespace iscsGraphicData {
|
|||
writer.writeRepeatedMessage(4, this.lines, (item: Line) => item.serialize(writer));
|
||||
if (this.circles.length)
|
||||
writer.writeRepeatedMessage(5, this.circles, (item: Circle) => item.serialize(writer));
|
||||
if (this.buttons.length)
|
||||
writer.writeRepeatedMessage(6, this.buttons, (item: Button) => item.serialize(writer));
|
||||
if (!w)
|
||||
return writer.getResultBuffer();
|
||||
}
|
||||
|
@ -356,6 +376,9 @@ export namespace iscsGraphicData {
|
|||
case 5:
|
||||
reader.readMessage(message.circles, () => pb_1.Message.addToRepeatedWrapperField(message, 5, Circle.deserialize(reader), Circle));
|
||||
break;
|
||||
case 6:
|
||||
reader.readMessage(message.buttons, () => pb_1.Message.addToRepeatedWrapperField(message, 6, Button.deserialize(reader), Button));
|
||||
break;
|
||||
default: reader.skipField();
|
||||
}
|
||||
}
|
||||
|
@ -1368,12 +1391,20 @@ export namespace iscsGraphicData {
|
|||
return Circle.deserialize(bytes);
|
||||
}
|
||||
}
|
||||
export class CCTVButton extends pb_1.Message {
|
||||
export class Button extends pb_1.Message {
|
||||
#one_of_decls: number[][] = [];
|
||||
constructor(data?: any[] | {
|
||||
common?: dependency_1.common.CommonInfo;
|
||||
code?: string;
|
||||
buttonType?: CCTVButton.ButtonType;
|
||||
codeColor?: string;
|
||||
codeFontSize?: number;
|
||||
belongSubMenu?: string;
|
||||
buttonType?: Button.ButtonType;
|
||||
width?: number;
|
||||
height?: number;
|
||||
radius?: number;
|
||||
fillColor?: string;
|
||||
alpha?: number;
|
||||
}) {
|
||||
super();
|
||||
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [], this.#one_of_decls);
|
||||
|
@ -1384,9 +1415,33 @@ export namespace iscsGraphicData {
|
|||
if ("code" in data && data.code != undefined) {
|
||||
this.code = data.code;
|
||||
}
|
||||
if ("codeColor" in data && data.codeColor != undefined) {
|
||||
this.codeColor = data.codeColor;
|
||||
}
|
||||
if ("codeFontSize" in data && data.codeFontSize != undefined) {
|
||||
this.codeFontSize = data.codeFontSize;
|
||||
}
|
||||
if ("belongSubMenu" in data && data.belongSubMenu != undefined) {
|
||||
this.belongSubMenu = data.belongSubMenu;
|
||||
}
|
||||
if ("buttonType" in data && data.buttonType != undefined) {
|
||||
this.buttonType = data.buttonType;
|
||||
}
|
||||
if ("width" in data && data.width != undefined) {
|
||||
this.width = data.width;
|
||||
}
|
||||
if ("height" in data && data.height != undefined) {
|
||||
this.height = data.height;
|
||||
}
|
||||
if ("radius" in data && data.radius != undefined) {
|
||||
this.radius = data.radius;
|
||||
}
|
||||
if ("fillColor" in data && data.fillColor != undefined) {
|
||||
this.fillColor = data.fillColor;
|
||||
}
|
||||
if ("alpha" in data && data.alpha != undefined) {
|
||||
this.alpha = data.alpha;
|
||||
}
|
||||
}
|
||||
}
|
||||
get common() {
|
||||
|
@ -1404,34 +1459,122 @@ export namespace iscsGraphicData {
|
|||
set code(value: string) {
|
||||
pb_1.Message.setField(this, 2, value);
|
||||
}
|
||||
get buttonType() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 3, CCTVButton.ButtonType.rect) as CCTVButton.ButtonType;
|
||||
get codeColor() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 3, "") as string;
|
||||
}
|
||||
set buttonType(value: CCTVButton.ButtonType) {
|
||||
set codeColor(value: string) {
|
||||
pb_1.Message.setField(this, 3, value);
|
||||
}
|
||||
get codeFontSize() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 4, 0) as number;
|
||||
}
|
||||
set codeFontSize(value: number) {
|
||||
pb_1.Message.setField(this, 4, value);
|
||||
}
|
||||
get belongSubMenu() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 5, "") as string;
|
||||
}
|
||||
set belongSubMenu(value: string) {
|
||||
pb_1.Message.setField(this, 5, value);
|
||||
}
|
||||
get buttonType() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 6, Button.ButtonType.noIcon) as Button.ButtonType;
|
||||
}
|
||||
set buttonType(value: Button.ButtonType) {
|
||||
pb_1.Message.setField(this, 6, value);
|
||||
}
|
||||
get width() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 7, 0) as number;
|
||||
}
|
||||
set width(value: number) {
|
||||
pb_1.Message.setField(this, 7, value);
|
||||
}
|
||||
get height() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 8, 0) as number;
|
||||
}
|
||||
set height(value: number) {
|
||||
pb_1.Message.setField(this, 8, value);
|
||||
}
|
||||
get radius() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 9, 0) as number;
|
||||
}
|
||||
set radius(value: number) {
|
||||
pb_1.Message.setField(this, 9, value);
|
||||
}
|
||||
get fillColor() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 10, "") as string;
|
||||
}
|
||||
set fillColor(value: string) {
|
||||
pb_1.Message.setField(this, 10, value);
|
||||
}
|
||||
get alpha() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 11, 0) as number;
|
||||
}
|
||||
set alpha(value: number) {
|
||||
pb_1.Message.setField(this, 11, value);
|
||||
}
|
||||
static fromObject(data: {
|
||||
common?: ReturnType<typeof dependency_1.common.CommonInfo.prototype.toObject>;
|
||||
code?: string;
|
||||
buttonType?: CCTVButton.ButtonType;
|
||||
}): CCTVButton {
|
||||
const message = new CCTVButton({});
|
||||
codeColor?: string;
|
||||
codeFontSize?: number;
|
||||
belongSubMenu?: string;
|
||||
buttonType?: Button.ButtonType;
|
||||
width?: number;
|
||||
height?: number;
|
||||
radius?: number;
|
||||
fillColor?: string;
|
||||
alpha?: number;
|
||||
}): Button {
|
||||
const message = new Button({});
|
||||
if (data.common != null) {
|
||||
message.common = dependency_1.common.CommonInfo.fromObject(data.common);
|
||||
}
|
||||
if (data.code != null) {
|
||||
message.code = data.code;
|
||||
}
|
||||
if (data.codeColor != null) {
|
||||
message.codeColor = data.codeColor;
|
||||
}
|
||||
if (data.codeFontSize != null) {
|
||||
message.codeFontSize = data.codeFontSize;
|
||||
}
|
||||
if (data.belongSubMenu != null) {
|
||||
message.belongSubMenu = data.belongSubMenu;
|
||||
}
|
||||
if (data.buttonType != null) {
|
||||
message.buttonType = data.buttonType;
|
||||
}
|
||||
if (data.width != null) {
|
||||
message.width = data.width;
|
||||
}
|
||||
if (data.height != null) {
|
||||
message.height = data.height;
|
||||
}
|
||||
if (data.radius != null) {
|
||||
message.radius = data.radius;
|
||||
}
|
||||
if (data.fillColor != null) {
|
||||
message.fillColor = data.fillColor;
|
||||
}
|
||||
if (data.alpha != null) {
|
||||
message.alpha = data.alpha;
|
||||
}
|
||||
return message;
|
||||
}
|
||||
toObject() {
|
||||
const data: {
|
||||
common?: ReturnType<typeof dependency_1.common.CommonInfo.prototype.toObject>;
|
||||
code?: string;
|
||||
buttonType?: CCTVButton.ButtonType;
|
||||
codeColor?: string;
|
||||
codeFontSize?: number;
|
||||
belongSubMenu?: string;
|
||||
buttonType?: Button.ButtonType;
|
||||
width?: number;
|
||||
height?: number;
|
||||
radius?: number;
|
||||
fillColor?: string;
|
||||
alpha?: number;
|
||||
} = {};
|
||||
if (this.common != null) {
|
||||
data.common = this.common.toObject();
|
||||
|
@ -1439,9 +1582,33 @@ export namespace iscsGraphicData {
|
|||
if (this.code != null) {
|
||||
data.code = this.code;
|
||||
}
|
||||
if (this.codeColor != null) {
|
||||
data.codeColor = this.codeColor;
|
||||
}
|
||||
if (this.codeFontSize != null) {
|
||||
data.codeFontSize = this.codeFontSize;
|
||||
}
|
||||
if (this.belongSubMenu != null) {
|
||||
data.belongSubMenu = this.belongSubMenu;
|
||||
}
|
||||
if (this.buttonType != null) {
|
||||
data.buttonType = this.buttonType;
|
||||
}
|
||||
if (this.width != null) {
|
||||
data.width = this.width;
|
||||
}
|
||||
if (this.height != null) {
|
||||
data.height = this.height;
|
||||
}
|
||||
if (this.radius != null) {
|
||||
data.radius = this.radius;
|
||||
}
|
||||
if (this.fillColor != null) {
|
||||
data.fillColor = this.fillColor;
|
||||
}
|
||||
if (this.alpha != null) {
|
||||
data.alpha = this.alpha;
|
||||
}
|
||||
return data;
|
||||
}
|
||||
serialize(): Uint8Array;
|
||||
|
@ -1452,13 +1619,29 @@ export namespace iscsGraphicData {
|
|||
writer.writeMessage(1, this.common, () => this.common.serialize(writer));
|
||||
if (this.code.length)
|
||||
writer.writeString(2, this.code);
|
||||
if (this.buttonType != CCTVButton.ButtonType.rect)
|
||||
writer.writeEnum(3, this.buttonType);
|
||||
if (this.codeColor.length)
|
||||
writer.writeString(3, this.codeColor);
|
||||
if (this.codeFontSize != 0)
|
||||
writer.writeInt32(4, this.codeFontSize);
|
||||
if (this.belongSubMenu.length)
|
||||
writer.writeString(5, this.belongSubMenu);
|
||||
if (this.buttonType != Button.ButtonType.noIcon)
|
||||
writer.writeEnum(6, this.buttonType);
|
||||
if (this.width != 0)
|
||||
writer.writeFloat(7, this.width);
|
||||
if (this.height != 0)
|
||||
writer.writeFloat(8, this.height);
|
||||
if (this.radius != 0)
|
||||
writer.writeInt32(9, this.radius);
|
||||
if (this.fillColor.length)
|
||||
writer.writeString(10, this.fillColor);
|
||||
if (this.alpha != 0)
|
||||
writer.writeFloat(11, this.alpha);
|
||||
if (!w)
|
||||
return writer.getResultBuffer();
|
||||
}
|
||||
static deserialize(bytes: Uint8Array | pb_1.BinaryReader): CCTVButton {
|
||||
const reader = bytes instanceof pb_1.BinaryReader ? bytes : new pb_1.BinaryReader(bytes), message = new CCTVButton();
|
||||
static deserialize(bytes: Uint8Array | pb_1.BinaryReader): Button {
|
||||
const reader = bytes instanceof pb_1.BinaryReader ? bytes : new pb_1.BinaryReader(bytes), message = new Button();
|
||||
while (reader.nextField()) {
|
||||
if (reader.isEndGroup())
|
||||
break;
|
||||
|
@ -1470,8 +1653,32 @@ export namespace iscsGraphicData {
|
|||
message.code = reader.readString();
|
||||
break;
|
||||
case 3:
|
||||
message.codeColor = reader.readString();
|
||||
break;
|
||||
case 4:
|
||||
message.codeFontSize = reader.readInt32();
|
||||
break;
|
||||
case 5:
|
||||
message.belongSubMenu = reader.readString();
|
||||
break;
|
||||
case 6:
|
||||
message.buttonType = reader.readEnum();
|
||||
break;
|
||||
case 7:
|
||||
message.width = reader.readFloat();
|
||||
break;
|
||||
case 8:
|
||||
message.height = reader.readFloat();
|
||||
break;
|
||||
case 9:
|
||||
message.radius = reader.readInt32();
|
||||
break;
|
||||
case 10:
|
||||
message.fillColor = reader.readString();
|
||||
break;
|
||||
case 11:
|
||||
message.alpha = reader.readFloat();
|
||||
break;
|
||||
default: reader.skipField();
|
||||
}
|
||||
}
|
||||
|
@ -1480,15 +1687,16 @@ export namespace iscsGraphicData {
|
|||
serializeBinary(): Uint8Array {
|
||||
return this.serialize();
|
||||
}
|
||||
static deserializeBinary(bytes: Uint8Array): CCTVButton {
|
||||
return CCTVButton.deserialize(bytes);
|
||||
static deserializeBinary(bytes: Uint8Array): Button {
|
||||
return Button.deserialize(bytes);
|
||||
}
|
||||
}
|
||||
export namespace CCTVButton {
|
||||
export namespace Button {
|
||||
export enum ButtonType {
|
||||
rect = 0,
|
||||
monitor = 1,
|
||||
semicircle = 2
|
||||
noIcon = 0,
|
||||
cctvRect = 1,
|
||||
cctvMonitor = 2,
|
||||
cctvSemicircle = 3
|
||||
}
|
||||
}
|
||||
export class ManualAlarmButton extends pb_1.Message {
|
||||
|
@ -1962,10 +2170,9 @@ export namespace iscsGraphicData {
|
|||
stationName?: string;
|
||||
canvas?: dependency_1.common.Canvas;
|
||||
commonGraphicStorage?: CommonGraphicStorage;
|
||||
cctvButtons?: CCTVButton[];
|
||||
}) {
|
||||
super();
|
||||
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [4], this.#one_of_decls);
|
||||
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [], this.#one_of_decls);
|
||||
if (!Array.isArray(data) && typeof data == "object") {
|
||||
if ("stationName" in data && data.stationName != undefined) {
|
||||
this.stationName = data.stationName;
|
||||
|
@ -1976,9 +2183,6 @@ export namespace iscsGraphicData {
|
|||
if ("commonGraphicStorage" in data && data.commonGraphicStorage != undefined) {
|
||||
this.commonGraphicStorage = data.commonGraphicStorage;
|
||||
}
|
||||
if ("cctvButtons" in data && data.cctvButtons != undefined) {
|
||||
this.cctvButtons = data.cctvButtons;
|
||||
}
|
||||
}
|
||||
}
|
||||
get stationName() {
|
||||
|
@ -2005,17 +2209,10 @@ export namespace iscsGraphicData {
|
|||
get has_commonGraphicStorage() {
|
||||
return pb_1.Message.getField(this, 3) != null;
|
||||
}
|
||||
get cctvButtons() {
|
||||
return pb_1.Message.getRepeatedWrapperField(this, CCTVButton, 4) as CCTVButton[];
|
||||
}
|
||||
set cctvButtons(value: CCTVButton[]) {
|
||||
pb_1.Message.setRepeatedWrapperField(this, 4, value);
|
||||
}
|
||||
static fromObject(data: {
|
||||
stationName?: string;
|
||||
canvas?: ReturnType<typeof dependency_1.common.Canvas.prototype.toObject>;
|
||||
commonGraphicStorage?: ReturnType<typeof CommonGraphicStorage.prototype.toObject>;
|
||||
cctvButtons?: ReturnType<typeof CCTVButton.prototype.toObject>[];
|
||||
}): CCTVOfStationControlStorage {
|
||||
const message = new CCTVOfStationControlStorage({});
|
||||
if (data.stationName != null) {
|
||||
|
@ -2027,9 +2224,6 @@ export namespace iscsGraphicData {
|
|||
if (data.commonGraphicStorage != null) {
|
||||
message.commonGraphicStorage = CommonGraphicStorage.fromObject(data.commonGraphicStorage);
|
||||
}
|
||||
if (data.cctvButtons != null) {
|
||||
message.cctvButtons = data.cctvButtons.map(item => CCTVButton.fromObject(item));
|
||||
}
|
||||
return message;
|
||||
}
|
||||
toObject() {
|
||||
|
@ -2037,7 +2231,6 @@ export namespace iscsGraphicData {
|
|||
stationName?: string;
|
||||
canvas?: ReturnType<typeof dependency_1.common.Canvas.prototype.toObject>;
|
||||
commonGraphicStorage?: ReturnType<typeof CommonGraphicStorage.prototype.toObject>;
|
||||
cctvButtons?: ReturnType<typeof CCTVButton.prototype.toObject>[];
|
||||
} = {};
|
||||
if (this.stationName != null) {
|
||||
data.stationName = this.stationName;
|
||||
|
@ -2048,9 +2241,6 @@ export namespace iscsGraphicData {
|
|||
if (this.commonGraphicStorage != null) {
|
||||
data.commonGraphicStorage = this.commonGraphicStorage.toObject();
|
||||
}
|
||||
if (this.cctvButtons != null) {
|
||||
data.cctvButtons = this.cctvButtons.map((item: CCTVButton) => item.toObject());
|
||||
}
|
||||
return data;
|
||||
}
|
||||
serialize(): Uint8Array;
|
||||
|
@ -2063,8 +2253,6 @@ export namespace iscsGraphicData {
|
|||
writer.writeMessage(2, this.canvas, () => this.canvas.serialize(writer));
|
||||
if (this.has_commonGraphicStorage)
|
||||
writer.writeMessage(3, this.commonGraphicStorage, () => this.commonGraphicStorage.serialize(writer));
|
||||
if (this.cctvButtons.length)
|
||||
writer.writeRepeatedMessage(4, this.cctvButtons, (item: CCTVButton) => item.serialize(writer));
|
||||
if (!w)
|
||||
return writer.getResultBuffer();
|
||||
}
|
||||
|
@ -2083,9 +2271,6 @@ export namespace iscsGraphicData {
|
|||
case 3:
|
||||
reader.readMessage(message.commonGraphicStorage, () => message.commonGraphicStorage = CommonGraphicStorage.deserialize(reader));
|
||||
break;
|
||||
case 4:
|
||||
reader.readMessage(message.cctvButtons, () => pb_1.Message.addToRepeatedWrapperField(message, 4, CCTVButton.deserialize(reader), CCTVButton));
|
||||
break;
|
||||
default: reader.skipField();
|
||||
}
|
||||
}
|
||||
|
|
|
@ -198,7 +198,7 @@ export namespace sync_data_message {
|
|||
pb_1.Message.setField(this, 2, value);
|
||||
}
|
||||
get data() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 3, new Uint8Array()) as Uint8Array;
|
||||
return pb_1.Message.getFieldWithDefault(this, 3, new Uint8Array(0)) as Uint8Array;
|
||||
}
|
||||
set data(value: Uint8Array) {
|
||||
pb_1.Message.setField(this, 3, value);
|
||||
|
|
Loading…
Reference in New Issue