Merge branch 'master' of https://git.code.tencent.com/beijing-rtss-test/bj-rtss-client
This commit is contained in:
fan
commit
c2e8f1c92f
@ -1 +1 @@
|
||||
Subproject commit da65562e424bfc69981acba945214e17974e588d
|
||||
Subproject commit 9945a2001adc1d7ae83b8de722c33afd7cd6f1d7
|
||||
@ -66,7 +66,7 @@ function main() {
|
||||
recursiveGenerate(f, [], prepareCmds);
|
||||
});
|
||||
|
||||
console.log(prepareCmds);
|
||||
// console.log(prepareCmds);
|
||||
|
||||
exec(
|
||||
prepareCmds.join(' && '),
|
||||
|
||||
31
src/components/draw-app/IbpDrawProperties.vue
Normal file
31
src/components/draw-app/IbpDrawProperties.vue
Normal file
@ -0,0 +1,31 @@
|
||||
<script setup lang="ts">
|
||||
import { useIBPDrawStore } from 'src/stores/ibp-draw-store';
|
||||
import CanvasIBPProperty from './properties/CanvasIBPProperty.vue';
|
||||
import IbpButtonProperty from './properties/IbpButtonProperty.vue';
|
||||
import { IBPButton } from 'src/graphics/IBPButton/IBPButton';
|
||||
|
||||
const ibpDrawStore = useIBPDrawStore();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="ibpDrawStore.selectedGraphics !== null">
|
||||
<QCard flat>
|
||||
<QCardSection>
|
||||
<div class="text-h6">{{ ibpDrawStore.selectedObjName }}属性</div>
|
||||
</QCardSection>
|
||||
<QSeparator inset />
|
||||
<template v-if="ibpDrawStore.selectedGraphics.length === 0">
|
||||
<QCardSection>
|
||||
<CanvasIBPProperty></CanvasIBPProperty>
|
||||
</QCardSection>
|
||||
</template>
|
||||
<template v-else-if="ibpDrawStore.selectedGraphics.length === 1">
|
||||
<QCardSection>
|
||||
<IbpButtonProperty
|
||||
v-if="ibpDrawStore.selectedGraphicType === IBPButton.Type"
|
||||
/>
|
||||
</QCardSection>
|
||||
</template>
|
||||
</QCard>
|
||||
</div>
|
||||
</template>
|
||||
80
src/components/draw-app/properties/CanvasIBPProperty.vue
Normal file
80
src/components/draw-app/properties/CanvasIBPProperty.vue
Normal file
@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<q-form>
|
||||
<q-input
|
||||
outlined
|
||||
v-model.number="canvas.width"
|
||||
@blur="onUpdate"
|
||||
label="画布宽 *"
|
||||
lazy-rules
|
||||
:rules="[(val) => (val && val > 0) || '画布宽必须大于0']"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
outlined
|
||||
type="number"
|
||||
v-model.number="canvas.height"
|
||||
@blur="onUpdate"
|
||||
label="画布高 *"
|
||||
lazy-rules
|
||||
:rules="[(val) => val > 0 || '画布高必须大于0']"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
outlined
|
||||
v-model="canvas.backgroundColor"
|
||||
@blur="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
|
||||
:model-value="canvas.backgroundColor"
|
||||
@change="
|
||||
(val) => {
|
||||
canvas.backgroundColor = val;
|
||||
onUpdate();
|
||||
}
|
||||
"
|
||||
/>
|
||||
</q-popup-proxy>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</q-form>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useIBPDrawStore } from 'src/stores/ibp-draw-store';
|
||||
import { onMounted, onUnmounted, reactive } from 'vue';
|
||||
const ibpDrawStore = useIBPDrawStore();
|
||||
|
||||
const canvas = reactive({
|
||||
width: 1920,
|
||||
height: 1080,
|
||||
backgroundColor: '#ffffff',
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// console.log('画布属性表单mounted');
|
||||
const jc = ibpDrawStore.getJlCanvas();
|
||||
canvas.width = jc.properties.width;
|
||||
canvas.height = jc.properties.height;
|
||||
canvas.backgroundColor = jc.properties.backgroundColor;
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
// console.log('画布属性表单unmounted');
|
||||
});
|
||||
|
||||
function onUpdate() {
|
||||
// console.log('画布属性更新');
|
||||
const app = ibpDrawStore.getDrawApp();
|
||||
app.updateCanvasAndRecord({
|
||||
...canvas,
|
||||
viewportTransform: app.canvas.properties.viewportTransform,
|
||||
});
|
||||
}
|
||||
</script>
|
||||
51
src/components/draw-app/properties/IbpButtonProperty.vue
Normal file
51
src/components/draw-app/properties/IbpButtonProperty.vue
Normal file
@ -0,0 +1,51 @@
|
||||
<script setup lang="ts">
|
||||
import { useFormData } from 'src/components/DrawAppFormUtils';
|
||||
import { IBPButtonData } from 'src/drawApp/graphics/IBPButtonInteraction';
|
||||
import { ibpGraphicData } from 'src/protos/ibpGraphics';
|
||||
import { useIBPDrawStore } from 'src/stores/ibp-draw-store';
|
||||
|
||||
const { data: ibpButtonModel, onUpdate } = useFormData(
|
||||
new IBPButtonData(),
|
||||
useIBPDrawStore().getDrawApp()
|
||||
);
|
||||
|
||||
const { IbpButtonColor } = ibpGraphicData.IBPButton;
|
||||
const colorOptions = [
|
||||
{ label: '灰色', value: IbpButtonColor.gray },
|
||||
{ label: '红色', value: IbpButtonColor.red },
|
||||
{ label: '黄色', value: IbpButtonColor.yellow },
|
||||
{ label: '蓝色', value: IbpButtonColor.blue },
|
||||
{ label: '绿色', value: IbpButtonColor.green },
|
||||
];
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QForm>
|
||||
<QInput
|
||||
outlined
|
||||
readonly
|
||||
v-model="ibpButtonModel.id"
|
||||
label="id"
|
||||
@blur="onUpdate"
|
||||
/>
|
||||
<QInput
|
||||
class="q-mt-sm"
|
||||
outlined
|
||||
v-model="ibpButtonModel.code"
|
||||
@blur="onUpdate"
|
||||
label="名称"
|
||||
/>
|
||||
<QSelect
|
||||
class="q-mt-sm"
|
||||
emitValue
|
||||
mapOptions
|
||||
outlined
|
||||
v-model="ibpButtonModel.color"
|
||||
label="颜色"
|
||||
:options="colorOptions"
|
||||
@popupHide="onUpdate"
|
||||
/>
|
||||
</QForm>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
48
src/drawApp/graphics/IBPButtonInteraction.ts
Normal file
48
src/drawApp/graphics/IBPButtonInteraction.ts
Normal file
@ -0,0 +1,48 @@
|
||||
import * as pb_1 from 'google-protobuf';
|
||||
import { GraphicDataBase } from './GraphicDataBase';
|
||||
import { IBPButton, IIBPButtonData } from 'src/graphics/IBPButton/IBPButton';
|
||||
import { ibpGraphicData } from 'src/protos/ibpGraphics';
|
||||
|
||||
export class IBPButtonData extends GraphicDataBase implements IIBPButtonData {
|
||||
constructor(data?: ibpGraphicData.IBPButton) {
|
||||
let ibpButton;
|
||||
if (data) {
|
||||
ibpButton = data;
|
||||
} else {
|
||||
ibpButton = new ibpGraphicData.IBPButton({
|
||||
common: GraphicDataBase.defaultCommonInfo(IBPButton.Type),
|
||||
});
|
||||
}
|
||||
super(ibpButton);
|
||||
}
|
||||
public get data() {
|
||||
return this.getData<ibpGraphicData.IBPButton>();
|
||||
}
|
||||
get code(): string {
|
||||
return this.data.code;
|
||||
}
|
||||
set code(v: string) {
|
||||
this.data.code = v;
|
||||
}
|
||||
get color(): ibpGraphicData.IBPButton.IbpButtonColor {
|
||||
return this.data.color;
|
||||
}
|
||||
set color(v: ibpGraphicData.IBPButton.IbpButtonColor) {
|
||||
this.data.color = v;
|
||||
}
|
||||
get isSelfReset(): boolean {
|
||||
return this.data.isSelfReset;
|
||||
}
|
||||
set isSelfReset(v: boolean) {
|
||||
this.data.isSelfReset = v;
|
||||
}
|
||||
clone() {
|
||||
return new IBPButtonData(this.data.cloneMessage());
|
||||
}
|
||||
copyFrom(data: IBPButtonData): void {
|
||||
pb_1.Message.copyInto(data.data, this.data);
|
||||
}
|
||||
eq(other: IBPButtonData): boolean {
|
||||
return pb_1.Message.equals(this.data, other.data);
|
||||
}
|
||||
}
|
||||
94
src/drawApp/ibpDrawApp.ts
Normal file
94
src/drawApp/ibpDrawApp.ts
Normal file
@ -0,0 +1,94 @@
|
||||
import { fromUint8Array, toUint8Array } from 'js-base64';
|
||||
import { getDraft, saveDraft } from 'src/api/DraftApi';
|
||||
import { GraphicData, IDrawApp, newDrawApp } from 'src/jl-graphic';
|
||||
import { ibpGraphicData } from 'src/protos/ibpGraphics';
|
||||
import { useIBPDrawStore } from 'src/stores/ibp-draw-store';
|
||||
import { IBPButtonData } from './graphics/IBPButtonInteraction';
|
||||
import { errorNotify, successNotify } from 'src/utils/CommonNotify';
|
||||
import { graphicData } from 'src/protos/stationLayoutGraphics';
|
||||
import { toStorageTransform } from './graphics/GraphicDataBase';
|
||||
import {
|
||||
IBPButton,
|
||||
IBPButtonTemplate,
|
||||
IIBPButtonData,
|
||||
} from 'src/graphics/IBPButton/IBPButton';
|
||||
import { IBPButtonDrawAssistant } from 'src/graphics/IBPButton/IBPButtonDrawAssistant';
|
||||
|
||||
let drawApp: IDrawApp | null = null;
|
||||
|
||||
export function getIBPDrawApp(): IDrawApp | null {
|
||||
return drawApp;
|
||||
}
|
||||
|
||||
export function initIBPDrawApp() {
|
||||
drawApp = newDrawApp({
|
||||
dataLoader: IBPDrawDataLoader,
|
||||
});
|
||||
|
||||
new IBPButtonDrawAssistant(
|
||||
drawApp,
|
||||
new IBPButtonTemplate(new IBPButtonData())
|
||||
);
|
||||
|
||||
return drawApp;
|
||||
}
|
||||
|
||||
export function saveIBPDrawToServer(app: IDrawApp) {
|
||||
const base64 = saveIBPDrawDatas(app);
|
||||
const ibpDrawStore = useIBPDrawStore();
|
||||
const id = ibpDrawStore.draftId;
|
||||
if (!id) {
|
||||
return;
|
||||
}
|
||||
saveDraft(id as number, { proto: base64 })
|
||||
.then(() => {
|
||||
successNotify('保存数据成功！');
|
||||
})
|
||||
.catch((err) => {
|
||||
errorNotify(err.message, err);
|
||||
});
|
||||
}
|
||||
|
||||
function saveIBPDrawDatas(app: IDrawApp) {
|
||||
const storage = new ibpGraphicData.IBPGraphicStorage();
|
||||
const canvasData = app.canvas.saveData();
|
||||
storage.canvas = new graphicData.Canvas({
|
||||
...canvasData,
|
||||
viewportTransform: toStorageTransform(canvasData.viewportTransform),
|
||||
});
|
||||
|
||||
const graphics = app.queryStore.getAllGraphics();
|
||||
graphics.forEach((g) => {
|
||||
if (g instanceof IBPButton) {
|
||||
storage.ibpButtons.push(g.saveData<IBPButtonData>().data);
|
||||
}
|
||||
});
|
||||
const base64 = fromUint8Array(storage.serialize());
|
||||
return base64;
|
||||
}
|
||||
|
||||
async function IBPDrawDataLoader() {
|
||||
const IBPDrawStore = useIBPDrawStore();
|
||||
const id = IBPDrawStore.draftId;
|
||||
if (!id) {
|
||||
throw new Error('获取数据异常：未获取到草稿地图ID');
|
||||
}
|
||||
const { proto: base64 } = await getDraft(id);
|
||||
if (base64) {
|
||||
const storage = ibpGraphicData.IBPGraphicStorage.deserialize(
|
||||
toUint8Array(base64)
|
||||
);
|
||||
const datas: GraphicData[] = [];
|
||||
storage.ibpButtons.forEach((ibpButton) => {
|
||||
datas.push(new IBPButtonData(ibpButton));
|
||||
});
|
||||
return {
|
||||
canvasProperty: storage.canvas,
|
||||
datas: datas,
|
||||
};
|
||||
} else {
|
||||
return Promise.resolve({
|
||||
datas: [],
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -215,10 +215,10 @@ export async function loadPslDrawDatas(): Promise<IGraphicStorage> {
|
||||
});
|
||||
console.log(datas);
|
||||
console.log(storage);
|
||||
return Promise.resolve({
|
||||
return {
|
||||
canvasProperty: storage.canvas,
|
||||
datas: datas,
|
||||
});
|
||||
};
|
||||
} else {
|
||||
return Promise.resolve({
|
||||
datas: [],
|
||||
|
||||
144
src/graphics/IBPButton/IBPButton.ts
Normal file
144
src/graphics/IBPButton/IBPButton.ts
Normal file
@ -0,0 +1,144 @@
|
||||
import { GraphicData, JlGraphic, JlGraphicTemplate } from 'src/jl-graphic';
|
||||
import { ibpGraphicData } from 'src/protos/ibpGraphics';
|
||||
import IPBButtonAssets from './ibpButton.png';
|
||||
import IBPButtonJSON from './ibpButton.json';
|
||||
import { Assets, Sprite, Spritesheet, Texture } from 'pixi.js';
|
||||
|
||||
export interface IIBPButtonData extends GraphicData {
|
||||
get code(): string;
|
||||
set code(v: string);
|
||||
get color(): ibpGraphicData.IBPButton.IbpButtonColor;
|
||||
set color(v: ibpGraphicData.IBPButton.IbpButtonColor);
|
||||
get isSelfReset(): boolean;
|
||||
set isSelfReset(v: boolean);
|
||||
}
|
||||
|
||||
export class IBPButton extends JlGraphic {
|
||||
static Type = 'IBPButton';
|
||||
textures: IBPButtonTextures;
|
||||
sprite: Sprite;
|
||||
|
||||
constructor(textures: IBPButtonTextures) {
|
||||
super(IBPButton.Type);
|
||||
this.textures = textures;
|
||||
this.sprite = new Sprite();
|
||||
this.sprite.texture = this.textures.get(
|
||||
ibpGraphicData.IBPButton.IbpButtonColor.gray,
|
||||
false,
|
||||
false
|
||||
);
|
||||
this.sprite.anchor.set(0.5);
|
||||
this.addChild(this.sprite);
|
||||
}
|
||||
get datas() {
|
||||
return this.getDatas<IIBPButtonData>();
|
||||
}
|
||||
|
||||
doRepaint(): void {
|
||||
console.log(1);
|
||||
this.sprite.texture = this.textures.get(this.datas.color, false, false);
|
||||
}
|
||||
}
|
||||
|
||||
interface IBPButtonTextures {
|
||||
get(
|
||||
color: ibpGraphicData.IBPButton.IbpButtonColor,
|
||||
isPressed: boolean,
|
||||
isOn: boolean
|
||||
): Texture;
|
||||
textures: {
|
||||
[key in ibpGraphicData.IBPButton.IbpButtonColor]: {
|
||||
pressed: {
|
||||
on: Texture;
|
||||
off: Texture;
|
||||
};
|
||||
unPressed: {
|
||||
on: Texture;
|
||||
off: Texture;
|
||||
};
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
export class IBPButtonTemplate extends JlGraphicTemplate<IBPButton> {
|
||||
static Textures: IBPButtonTextures | null = null;
|
||||
constructor(dataTemplate: IIBPButtonData) {
|
||||
super(IBPButton.Type, { dataTemplate });
|
||||
this.loadAssets();
|
||||
}
|
||||
new(): IBPButton {
|
||||
if (IBPButtonTemplate.Textures === null) {
|
||||
throw new Error('IBPButtonTemplate.Textures is null');
|
||||
}
|
||||
const g = new IBPButton(IBPButtonTemplate.Textures);
|
||||
return g;
|
||||
}
|
||||
async loadAssets(): Promise<IBPButtonTextures> {
|
||||
//FIXME 多次加载问题(异步)
|
||||
if (IBPButtonTemplate.Textures === null) {
|
||||
const texture = await Assets.load(IPBButtonAssets);
|
||||
const IBPButtonSheet = new Spritesheet(texture, IBPButtonJSON);
|
||||
const result = await IBPButtonSheet.parse();
|
||||
IBPButtonTemplate.Textures = {
|
||||
get(color, isPressed, isOn) {
|
||||
return this.textures[color][isPressed ? 'pressed' : 'unPressed'][
|
||||
isOn ? 'on' : 'off'
|
||||
];
|
||||
},
|
||||
textures: {
|
||||
[ibpGraphicData.IBPButton.IbpButtonColor.red]: {
|
||||
pressed: {
|
||||
on: result['red_button_pressed_on.png'],
|
||||
off: result['red_button_pressed.png'],
|
||||
},
|
||||
unPressed: {
|
||||
on: result['red_button_on.png'],
|
||||
off: result['red_button.png'],
|
||||
},
|
||||
},
|
||||
[ibpGraphicData.IBPButton.IbpButtonColor.green]: {
|
||||
pressed: {
|
||||
on: result['green_button_pressed_on.png'],
|
||||
off: result['green_button_pressed.png'],
|
||||
},
|
||||
unPressed: {
|
||||
on: result['green_button_on.png'],
|
||||
off: result['green_button.png'],
|
||||
},
|
||||
},
|
||||
[ibpGraphicData.IBPButton.IbpButtonColor.blue]: {
|
||||
pressed: {
|
||||
on: result['blue_button_pressed_on.png'],
|
||||
off: result['blue_button_pressed.png'],
|
||||
},
|
||||
unPressed: {
|
||||
on: result['blue_button_on.png'],
|
||||
off: result['blue_button.png'],
|
||||
},
|
||||
},
|
||||
[ibpGraphicData.IBPButton.IbpButtonColor.yellow]: {
|
||||
pressed: {
|
||||
on: result['yellow_button_pressed_on.png'],
|
||||
off: result['yellow_button_pressed.png'],
|
||||
},
|
||||
unPressed: {
|
||||
on: result['yellow_button_on.png'],
|
||||
off: result['yellow_button.png'],
|
||||
},
|
||||
},
|
||||
[ibpGraphicData.IBPButton.IbpButtonColor.gray]: {
|
||||
pressed: {
|
||||
on: result['gray_button_pressed_on.png'],
|
||||
off: result['gray_button_pressed.png'],
|
||||
},
|
||||
unPressed: {
|
||||
on: result['gray_button_on.png'],
|
||||
off: result['gray_button.png'],
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
return Promise.resolve(IBPButtonTemplate.Textures);
|
||||
}
|
||||
}
|
||||
39
src/graphics/IBPButton/IBPButtonDrawAssistant.ts
Normal file
39
src/graphics/IBPButton/IBPButtonDrawAssistant.ts
Normal file
@ -0,0 +1,39 @@
|
||||
import { GraphicDrawAssistant, IDrawApp } from 'src/jl-graphic';
|
||||
import { IBPButton, IBPButtonTemplate, IIBPButtonData } from './IBPButton';
|
||||
import { FederatedMouseEvent, Point } from 'pixi.js';
|
||||
|
||||
export class IBPButtonDrawAssistant extends GraphicDrawAssistant<
|
||||
IBPButtonTemplate,
|
||||
IIBPButtonData
|
||||
> {
|
||||
_ibpButton: IBPButton | null = null;
|
||||
constructor(app: IDrawApp, template: IBPButtonTemplate) {
|
||||
super(
|
||||
app,
|
||||
template,
|
||||
'svguse:../../drawIcon.svg#icon-psl-button',
|
||||
'IBP按钮'
|
||||
);
|
||||
}
|
||||
get ibpButton(): IBPButton {
|
||||
if (!this._ibpButton) {
|
||||
this._ibpButton = this.graphicTemplate.new();
|
||||
this.container.addChild(this.ibpButton);
|
||||
}
|
||||
return this._ibpButton;
|
||||
}
|
||||
onLeftUp(e: FederatedMouseEvent): void {
|
||||
this.ibpButton.position.copyFrom(this.toCanvasCoordinates(e.global));
|
||||
this.createAndStore(true);
|
||||
}
|
||||
onEsc(): void {
|
||||
this.finish();
|
||||
}
|
||||
redraw(cp: Point): void {
|
||||
this.ibpButton.position.copyFrom(cp);
|
||||
}
|
||||
prepareData(data: IIBPButtonData): boolean {
|
||||
data.transform = this.ibpButton.saveTransform();
|
||||
return true;
|
||||
}
|
||||
}
|
||||
172
src/graphics/IBPButton/ibpButton.json
Normal file
172
src/graphics/IBPButton/ibpButton.json
Normal file
@ -0,0 +1,172 @@
|
||||
{"frames": {
|
||||
|
||||
"blue_button.png":
|
||||
{
|
||||
"frame": {"x":0,"y":0,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"blue_button_on.png":
|
||||
{
|
||||
"frame": {"x":70,"y":0,"w":70,"h":81},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":81},
|
||||
"sourceSize": {"w":70,"h":81}
|
||||
},
|
||||
"blue_button_pressed.png":
|
||||
{
|
||||
"frame": {"x":140,"y":0,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"blue_button_pressed_on.png":
|
||||
{
|
||||
"frame": {"x":210,"y":0,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"gray_button.png":
|
||||
{
|
||||
"frame": {"x":280,"y":0,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"gray_button_on.png":
|
||||
{
|
||||
"frame": {"x":350,"y":0,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"gray_button_pressed.png":
|
||||
{
|
||||
"frame": {"x":420,"y":0,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"gray_button_pressed_on.png":
|
||||
{
|
||||
"frame": {"x":0,"y":81,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"green_button.png":
|
||||
{
|
||||
"frame": {"x":70,"y":81,"w":70,"h":81},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":81},
|
||||
"sourceSize": {"w":70,"h":81}
|
||||
},
|
||||
"green_button_on.png":
|
||||
{
|
||||
"frame": {"x":140,"y":81,"w":70,"h":79},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":79},
|
||||
"sourceSize": {"w":70,"h":79}
|
||||
},
|
||||
"green_button_pressed.png":
|
||||
{
|
||||
"frame": {"x":210,"y":81,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"green_button_pressed_on.png":
|
||||
{
|
||||
"frame": {"x":280,"y":81,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"red_button.png":
|
||||
{
|
||||
"frame": {"x":350,"y":81,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"red_button_on.png":
|
||||
{
|
||||
"frame": {"x":420,"y":81,"w":70,"h":78},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":78},
|
||||
"sourceSize": {"w":70,"h":78}
|
||||
},
|
||||
"red_button_pressed.png":
|
||||
{
|
||||
"frame": {"x":0,"y":162,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"red_button_pressed_on.png":
|
||||
{
|
||||
"frame": {"x":70,"y":162,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"yellow_button.png":
|
||||
{
|
||||
"frame": {"x":140,"y":162,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"yellow_button_on.png":
|
||||
{
|
||||
"frame": {"x":210,"y":162,"w":70,"h":81},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":81},
|
||||
"sourceSize": {"w":70,"h":81}
|
||||
},
|
||||
"yellow_button_pressed.png":
|
||||
{
|
||||
"frame": {"x":280,"y":162,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
},
|
||||
"yellow_button_pressed_on.png":
|
||||
{
|
||||
"frame": {"x":350,"y":162,"w":70,"h":80},
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": {"x":0,"y":0,"w":70,"h":80},
|
||||
"sourceSize": {"w":70,"h":80}
|
||||
}},
|
||||
"meta": {
|
||||
"app": "https://www.codeandweb.com/texturepacker",
|
||||
"version": "1.1",
|
||||
"image": "ibpButton.png",
|
||||
"format": "RGBA8888",
|
||||
"size": {"w":490,"h":243},
|
||||
"scale": "1",
|
||||
"smartupdate": "$TexturePacker:SmartUpdate:64855b0739789b4990f3f5a6ebb380e4:2e868bac59d1dfa40064527e00c49c2d:d64169bde96e532a4833ca4e2184b4e6$"
|
||||
}
|
||||
}
|
||||
BIN
src/graphics/IBPButton/ibpButton.png
Normal file
BIN
src/graphics/IBPButton/ibpButton.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
@ -144,7 +144,12 @@ export class TrainHead extends Container {
|
||||
-marginX - pauseW / 2 - codeWidth / 2,
|
||||
codeHeight / 2,
|
||||
];
|
||||
if (states.runDirection) {
|
||||
// 道岔时运行上下行决定箭头方向
|
||||
// 区段时是否从A到B决定箭头方向
|
||||
if (
|
||||
(states.devicePort && states.runDirection) ||
|
||||
(!states.devicePort && states.pointTo)
|
||||
) {
|
||||
const aP: Array<number> = [];
|
||||
arrowPoint.forEach((item, index) => {
|
||||
if (index % 2 == 1) {
|
||||
@ -155,7 +160,10 @@ export class TrainHead extends Container {
|
||||
});
|
||||
arrowPoint = aP;
|
||||
}
|
||||
if (states.headDirection) {
|
||||
if (
|
||||
(states.devicePort && states.headDirection) ||
|
||||
(!states.devicePort && states.pointTo)
|
||||
) {
|
||||
const pP: Array<number> = [];
|
||||
pausePoint.forEach((item, index) => {
|
||||
if (index % 2 == 1) {
|
||||
|
||||
149
src/layouts/IBPDrawLayout.vue
Normal file
149
src/layouts/IBPDrawLayout.vue
Normal file
@ -0,0 +1,149 @@
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref } from 'vue';
|
||||
import { useIBPDrawStore } from '../stores/ibp-draw-store';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { IBPButton } from 'src/graphics/IBPButton/IBPButton';
|
||||
import { getIBPDrawApp } from 'src/drawApp/ibpDrawApp';
|
||||
import IbpDrawProperties from 'src/components/draw-app/IbpDrawProperties.vue';
|
||||
|
||||
const ibpDrawStore = useIBPDrawStore();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const canvasWidth = ref(0);
|
||||
const canvasHeight = ref(0);
|
||||
const headerHeight = ref(0);
|
||||
const leftWidth = ref(0);
|
||||
const rightWidth = ref(0);
|
||||
function onHeaderResize(size: { height: number; width: number }) {
|
||||
headerHeight.value = size.height;
|
||||
onResize();
|
||||
}
|
||||
function onRightResize(size: { height: number; width: number }) {
|
||||
rightWidth.value = size.width;
|
||||
onResize();
|
||||
}
|
||||
const leftDrawerOpen = ref(false);
|
||||
const rightDrawerOpen = ref(false);
|
||||
function toggleRightDrawer() {
|
||||
rightDrawerOpen.value = !rightDrawerOpen.value;
|
||||
onResize();
|
||||
}
|
||||
|
||||
const selectUtil = ref('');
|
||||
const utilsOption: ControlItem[] = reactive([]);
|
||||
const drawSelect = (item: string) => {
|
||||
getIBPDrawApp()?.interactionPlugin(item).resume();
|
||||
};
|
||||
class ControlItem {
|
||||
value: string;
|
||||
slot: string;
|
||||
icon: string;
|
||||
tip: string;
|
||||
show = true;
|
||||
|
||||
constructor(value: string, icon: string, tip: string, show?: boolean) {
|
||||
this.value = value;
|
||||
this.slot = value;
|
||||
this.icon = icon;
|
||||
this.tip = tip;
|
||||
if (show != undefined) {
|
||||
this.show = show;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
const dom = document.getElementById('draw-app-container');
|
||||
if (dom) {
|
||||
ibpDrawStore.setDraftId(Number(route.params.id));
|
||||
const drawApp = ibpDrawStore.initDrawApp();
|
||||
drawApp.bindDom(dom);
|
||||
drawApp.reload();
|
||||
onResize();
|
||||
} else {
|
||||
ibpDrawStore.setDraftId(null);
|
||||
}
|
||||
const drawAssistantsTypes = [IBPButton.Type];
|
||||
drawAssistantsTypes.forEach((type) => {
|
||||
const drawAssistant = getIBPDrawApp()?.getDrawAssistant(type);
|
||||
if (drawAssistant) {
|
||||
utilsOption.push(
|
||||
new ControlItem(
|
||||
drawAssistant.name,
|
||||
drawAssistant.icon,
|
||||
drawAssistant.description || drawAssistant.name
|
||||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function onResize() {
|
||||
const clientWidth = document.documentElement.clientWidth;
|
||||
const clientHeight = document.documentElement.clientHeight;
|
||||
canvasWidth.value =
|
||||
clientWidth -
|
||||
(leftDrawerOpen.value ? leftWidth.value : 0) -
|
||||
(rightDrawerOpen.value ? rightWidth.value : 0);
|
||||
canvasHeight.value = clientHeight - headerHeight.value;
|
||||
const dom = document.getElementById('draw-app-container');
|
||||
// console.log(dom);
|
||||
console.log(canvasWidth.value);
|
||||
console.log(canvasHeight.value);
|
||||
if (dom) {
|
||||
dom.style.width = canvasWidth.value + 'px';
|
||||
dom.style.height = canvasHeight.value + 'px';
|
||||
}
|
||||
}
|
||||
function backConfirm() {
|
||||
router.go(-1);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QLayout view="hHh LpR fFf">
|
||||
<QHeader class="bg-primary">
|
||||
<QToolbar>
|
||||
<QToolbarTitle>
|
||||
<QBtn color="accent" label="功能菜单">
|
||||
<QMenu>
|
||||
<QList style="min-width: 100px">
|
||||
<QItem clickable @click="console.log('保存')" v-close-popup>
|
||||
<QItemSection>保存</QItemSection>
|
||||
</QItem>
|
||||
</QList>
|
||||
</QMenu>
|
||||
</QBtn>
|
||||
<QBtnToggle
|
||||
v-model="selectUtil"
|
||||
:options="utilsOption"
|
||||
color="brown"
|
||||
text-color="white"
|
||||
toggle-color="orange"
|
||||
toggle-text-color="black"
|
||||
@update:model-value="drawSelect"
|
||||
>
|
||||
<template
|
||||
v-for="(ctl, idx) in utilsOption"
|
||||
:key="idx"
|
||||
v-slot:[ctl.value]
|
||||
>
|
||||
<QTooltip>{{ ctl.tip }}</QTooltip>
|
||||
</template></QBtnToggle
|
||||
>
|
||||
</QToolbarTitle>
|
||||
<QBtn color="info" label="返回" @click="backConfirm" />
|
||||
<QBtn dense flat round icon="menu" @click="toggleRightDrawer" />
|
||||
</QToolbar>
|
||||
<QResizeObserver @resize="onHeaderResize" />
|
||||
</QHeader>
|
||||
<QDrawer show-if-above bordered v-model="rightDrawerOpen" side="right">
|
||||
<QResizeObserver @resize="onRightResize" />
|
||||
<IbpDrawProperties />
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<div id="draw-app-container"></div>
|
||||
</QPageContainer>
|
||||
</QLayout>
|
||||
</template>
|
||||
@ -358,6 +358,7 @@ const pictureTypeList: { label: string; value: PictureType }[] = [
|
||||
{ label: '信号布置图', value: PictureType.StationLayout },
|
||||
{ label: 'PSL', value: PictureType.Psl },
|
||||
{ label: '继电器柜布置图', value: PictureType.RelayCabinetLayout },
|
||||
{ label: 'IBP盘', value: PictureType.IBP },
|
||||
];
|
||||
const categoryId = ref('');
|
||||
const pictureType = ref(PictureType.StationLayout);
|
||||
@ -382,10 +383,12 @@ function getTypeName(val?: number) {
|
||||
|
||||
function goToPath(row: DraftItem) {
|
||||
let path = `/painting/${row.id}/${row.category}`;
|
||||
if (row.type == PictureType.RelayCabinetLayout) {
|
||||
if (row.type === PictureType.RelayCabinetLayout) {
|
||||
path = `/relayCabinet/${row.id}`;
|
||||
} else if (row.type === PictureType.Psl) {
|
||||
path = `/pslPainting/${row.id}`;
|
||||
} else if (row.type === PictureType.IBP) {
|
||||
path = `/ibpPainting/${row.id}`;
|
||||
}
|
||||
router.push({ path: path });
|
||||
}
|
||||
|
||||
343
src/protos/ibpGraphics.ts
Normal file
343
src/protos/ibpGraphics.ts
Normal file
@ -0,0 +1,343 @@
|
||||
/**
|
||||
* Generated by the protoc-gen-ts. DO NOT EDIT!
|
||||
* compiler version: 4.23.1
|
||||
* source: ibpGraphics.proto
|
||||
* git: https://github.com/thesayyn/protoc-gen-ts */
|
||||
import * as dependency_1 from "./stationLayoutGraphics";
|
||||
import * as pb_1 from "google-protobuf";
|
||||
export namespace ibpGraphicData {
|
||||
export class IBPGraphicStorage extends pb_1.Message {
|
||||
#one_of_decls: number[][] = [];
|
||||
constructor(data?: any[] | {
|
||||
canvas?: dependency_1.graphicData.Canvas;
|
||||
ibpButtons?: IBPButton[];
|
||||
}) {
|
||||
super();
|
||||
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [2], this.#one_of_decls);
|
||||
if (!Array.isArray(data) && typeof data == "object") {
|
||||
if ("canvas" in data && data.canvas != undefined) {
|
||||
this.canvas = data.canvas;
|
||||
}
|
||||
if ("ibpButtons" in data && data.ibpButtons != undefined) {
|
||||
this.ibpButtons = data.ibpButtons;
|
||||
}
|
||||
}
|
||||
}
|
||||
get canvas() {
|
||||
return pb_1.Message.getWrapperField(this, dependency_1.graphicData.Canvas, 1) as dependency_1.graphicData.Canvas;
|
||||
}
|
||||
set canvas(value: dependency_1.graphicData.Canvas) {
|
||||
pb_1.Message.setWrapperField(this, 1, value);
|
||||
}
|
||||
get has_canvas() {
|
||||
return pb_1.Message.getField(this, 1) != null;
|
||||
}
|
||||
get ibpButtons() {
|
||||
return pb_1.Message.getRepeatedWrapperField(this, IBPButton, 2) as IBPButton[];
|
||||
}
|
||||
set ibpButtons(value: IBPButton[]) {
|
||||
pb_1.Message.setRepeatedWrapperField(this, 2, value);
|
||||
}
|
||||
static fromObject(data: {
|
||||
canvas?: ReturnType<typeof dependency_1.graphicData.Canvas.prototype.toObject>;
|
||||
ibpButtons?: ReturnType<typeof IBPButton.prototype.toObject>[];
|
||||
}): IBPGraphicStorage {
|
||||
const message = new IBPGraphicStorage({});
|
||||
if (data.canvas != null) {
|
||||
message.canvas = dependency_1.graphicData.Canvas.fromObject(data.canvas);
|
||||
}
|
||||
if (data.ibpButtons != null) {
|
||||
message.ibpButtons = data.ibpButtons.map(item => IBPButton.fromObject(item));
|
||||
}
|
||||
return message;
|
||||
}
|
||||
toObject() {
|
||||
const data: {
|
||||
canvas?: ReturnType<typeof dependency_1.graphicData.Canvas.prototype.toObject>;
|
||||
ibpButtons?: ReturnType<typeof IBPButton.prototype.toObject>[];
|
||||
} = {};
|
||||
if (this.canvas != null) {
|
||||
data.canvas = this.canvas.toObject();
|
||||
}
|
||||
if (this.ibpButtons != null) {
|
||||
data.ibpButtons = this.ibpButtons.map((item: IBPButton) => item.toObject());
|
||||
}
|
||||
return data;
|
||||
}
|
||||
serialize(): Uint8Array;
|
||||
serialize(w: pb_1.BinaryWriter): void;
|
||||
serialize(w?: pb_1.BinaryWriter): Uint8Array | void {
|
||||
const writer = w || new pb_1.BinaryWriter();
|
||||
if (this.has_canvas)
|
||||
writer.writeMessage(1, this.canvas, () => this.canvas.serialize(writer));
|
||||
if (this.ibpButtons.length)
|
||||
writer.writeRepeatedMessage(2, this.ibpButtons, (item: IBPButton) => item.serialize(writer));
|
||||
if (!w)
|
||||
return writer.getResultBuffer();
|
||||
}
|
||||
static deserialize(bytes: Uint8Array | pb_1.BinaryReader): IBPGraphicStorage {
|
||||
const reader = bytes instanceof pb_1.BinaryReader ? bytes : new pb_1.BinaryReader(bytes), message = new IBPGraphicStorage();
|
||||
while (reader.nextField()) {
|
||||
if (reader.isEndGroup())
|
||||
break;
|
||||
switch (reader.getFieldNumber()) {
|
||||
case 1:
|
||||
reader.readMessage(message.canvas, () => message.canvas = dependency_1.graphicData.Canvas.deserialize(reader));
|
||||
break;
|
||||
case 2:
|
||||
reader.readMessage(message.ibpButtons, () => pb_1.Message.addToRepeatedWrapperField(message, 2, IBPButton.deserialize(reader), IBPButton));
|
||||
break;
|
||||
default: reader.skipField();
|
||||
}
|
||||
}
|
||||
return message;
|
||||
}
|
||||
serializeBinary(): Uint8Array {
|
||||
return this.serialize();
|
||||
}
|
||||
static deserializeBinary(bytes: Uint8Array): IBPGraphicStorage {
|
||||
return IBPGraphicStorage.deserialize(bytes);
|
||||
}
|
||||
}
|
||||
export class IBPButton extends pb_1.Message {
|
||||
#one_of_decls: number[][] = [];
|
||||
constructor(data?: any[] | {
|
||||
common?: dependency_1.graphicData.CommonInfo;
|
||||
code?: string;
|
||||
color?: IBPButton.IbpButtonColor;
|
||||
isSelfReset?: boolean;
|
||||
}) {
|
||||
super();
|
||||
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [], this.#one_of_decls);
|
||||
if (!Array.isArray(data) && typeof data == "object") {
|
||||
if ("common" in data && data.common != undefined) {
|
||||
this.common = data.common;
|
||||
}
|
||||
if ("code" in data && data.code != undefined) {
|
||||
this.code = data.code;
|
||||
}
|
||||
if ("color" in data && data.color != undefined) {
|
||||
this.color = data.color;
|
||||
}
|
||||
if ("isSelfReset" in data && data.isSelfReset != undefined) {
|
||||
this.isSelfReset = data.isSelfReset;
|
||||
}
|
||||
}
|
||||
}
|
||||
get common() {
|
||||
return pb_1.Message.getWrapperField(this, dependency_1.graphicData.CommonInfo, 1) as dependency_1.graphicData.CommonInfo;
|
||||
}
|
||||
set common(value: dependency_1.graphicData.CommonInfo) {
|
||||
pb_1.Message.setWrapperField(this, 1, value);
|
||||
}
|
||||
get has_common() {
|
||||
return pb_1.Message.getField(this, 1) != null;
|
||||
}
|
||||
get code() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 2, "") as string;
|
||||
}
|
||||
set code(value: string) {
|
||||
pb_1.Message.setField(this, 2, value);
|
||||
}
|
||||
get color() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 3, IBPButton.IbpButtonColor.gray) as IBPButton.IbpButtonColor;
|
||||
}
|
||||
set color(value: IBPButton.IbpButtonColor) {
|
||||
pb_1.Message.setField(this, 3, value);
|
||||
}
|
||||
get isSelfReset() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 4, false) as boolean;
|
||||
}
|
||||
set isSelfReset(value: boolean) {
|
||||
pb_1.Message.setField(this, 4, value);
|
||||
}
|
||||
static fromObject(data: {
|
||||
common?: ReturnType<typeof dependency_1.graphicData.CommonInfo.prototype.toObject>;
|
||||
code?: string;
|
||||
color?: IBPButton.IbpButtonColor;
|
||||
isSelfReset?: boolean;
|
||||
}): IBPButton {
|
||||
const message = new IBPButton({});
|
||||
if (data.common != null) {
|
||||
message.common = dependency_1.graphicData.CommonInfo.fromObject(data.common);
|
||||
}
|
||||
if (data.code != null) {
|
||||
message.code = data.code;
|
||||
}
|
||||
if (data.color != null) {
|
||||
message.color = data.color;
|
||||
}
|
||||
if (data.isSelfReset != null) {
|
||||
message.isSelfReset = data.isSelfReset;
|
||||
}
|
||||
return message;
|
||||
}
|
||||
toObject() {
|
||||
const data: {
|
||||
common?: ReturnType<typeof dependency_1.graphicData.CommonInfo.prototype.toObject>;
|
||||
code?: string;
|
||||
color?: IBPButton.IbpButtonColor;
|
||||
isSelfReset?: boolean;
|
||||
} = {};
|
||||
if (this.common != null) {
|
||||
data.common = this.common.toObject();
|
||||
}
|
||||
if (this.code != null) {
|
||||
data.code = this.code;
|
||||
}
|
||||
if (this.color != null) {
|
||||
data.color = this.color;
|
||||
}
|
||||
if (this.isSelfReset != null) {
|
||||
data.isSelfReset = this.isSelfReset;
|
||||
}
|
||||
return data;
|
||||
}
|
||||
serialize(): Uint8Array;
|
||||
serialize(w: pb_1.BinaryWriter): void;
|
||||
serialize(w?: pb_1.BinaryWriter): Uint8Array | void {
|
||||
const writer = w || new pb_1.BinaryWriter();
|
||||
if (this.has_common)
|
||||
writer.writeMessage(1, this.common, () => this.common.serialize(writer));
|
||||
if (this.code.length)
|
||||
writer.writeString(2, this.code);
|
||||
if (this.color != IBPButton.IbpButtonColor.gray)
|
||||
writer.writeEnum(3, this.color);
|
||||
if (this.isSelfReset != false)
|
||||
writer.writeBool(4, this.isSelfReset);
|
||||
if (!w)
|
||||
return writer.getResultBuffer();
|
||||
}
|
||||
static deserialize(bytes: Uint8Array | pb_1.BinaryReader): IBPButton {
|
||||
const reader = bytes instanceof pb_1.BinaryReader ? bytes : new pb_1.BinaryReader(bytes), message = new IBPButton();
|
||||
while (reader.nextField()) {
|
||||
if (reader.isEndGroup())
|
||||
break;
|
||||
switch (reader.getFieldNumber()) {
|
||||
case 1:
|
||||
reader.readMessage(message.common, () => message.common = dependency_1.graphicData.CommonInfo.deserialize(reader));
|
||||
break;
|
||||
case 2:
|
||||
message.code = reader.readString();
|
||||
break;
|
||||
case 3:
|
||||
message.color = reader.readEnum();
|
||||
break;
|
||||
case 4:
|
||||
message.isSelfReset = reader.readBool();
|
||||
break;
|
||||
default: reader.skipField();
|
||||
}
|
||||
}
|
||||
return message;
|
||||
}
|
||||
serializeBinary(): Uint8Array {
|
||||
return this.serialize();
|
||||
}
|
||||
static deserializeBinary(bytes: Uint8Array): IBPButton {
|
||||
return IBPButton.deserialize(bytes);
|
||||
}
|
||||
}
|
||||
export namespace IBPButton {
|
||||
export enum IbpButtonColor {
|
||||
gray = 0,
|
||||
red = 1,
|
||||
green = 2,
|
||||
blue = 3,
|
||||
yellow = 4
|
||||
}
|
||||
}
|
||||
export class IBPText extends pb_1.Message {
|
||||
#one_of_decls: number[][] = [];
|
||||
constructor(data?: any[] | {
|
||||
common?: dependency_1.graphicData.CommonInfo;
|
||||
size?: number;
|
||||
}) {
|
||||
super();
|
||||
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [], this.#one_of_decls);
|
||||
if (!Array.isArray(data) && typeof data == "object") {
|
||||
if ("common" in data && data.common != undefined) {
|
||||
this.common = data.common;
|
||||
}
|
||||
if ("size" in data && data.size != undefined) {
|
||||
this.size = data.size;
|
||||
}
|
||||
}
|
||||
}
|
||||
get common() {
|
||||
return pb_1.Message.getWrapperField(this, dependency_1.graphicData.CommonInfo, 1) as dependency_1.graphicData.CommonInfo;
|
||||
}
|
||||
set common(value: dependency_1.graphicData.CommonInfo) {
|
||||
pb_1.Message.setWrapperField(this, 1, value);
|
||||
}
|
||||
get has_common() {
|
||||
return pb_1.Message.getField(this, 1) != null;
|
||||
}
|
||||
get size() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 2, 0) as number;
|
||||
}
|
||||
set size(value: number) {
|
||||
pb_1.Message.setField(this, 2, value);
|
||||
}
|
||||
static fromObject(data: {
|
||||
common?: ReturnType<typeof dependency_1.graphicData.CommonInfo.prototype.toObject>;
|
||||
size?: number;
|
||||
}): IBPText {
|
||||
const message = new IBPText({});
|
||||
if (data.common != null) {
|
||||
message.common = dependency_1.graphicData.CommonInfo.fromObject(data.common);
|
||||
}
|
||||
if (data.size != null) {
|
||||
message.size = data.size;
|
||||
}
|
||||
return message;
|
||||
}
|
||||
toObject() {
|
||||
const data: {
|
||||
common?: ReturnType<typeof dependency_1.graphicData.CommonInfo.prototype.toObject>;
|
||||
size?: number;
|
||||
} = {};
|
||||
if (this.common != null) {
|
||||
data.common = this.common.toObject();
|
||||
}
|
||||
if (this.size != null) {
|
||||
data.size = this.size;
|
||||
}
|
||||
return data;
|
||||
}
|
||||
serialize(): Uint8Array;
|
||||
serialize(w: pb_1.BinaryWriter): void;
|
||||
serialize(w?: pb_1.BinaryWriter): Uint8Array | void {
|
||||
const writer = w || new pb_1.BinaryWriter();
|
||||
if (this.has_common)
|
||||
writer.writeMessage(1, this.common, () => this.common.serialize(writer));
|
||||
if (this.size != 0)
|
||||
writer.writeInt32(2, this.size);
|
||||
if (!w)
|
||||
return writer.getResultBuffer();
|
||||
}
|
||||
static deserialize(bytes: Uint8Array | pb_1.BinaryReader): IBPText {
|
||||
const reader = bytes instanceof pb_1.BinaryReader ? bytes : new pb_1.BinaryReader(bytes), message = new IBPText();
|
||||
while (reader.nextField()) {
|
||||
if (reader.isEndGroup())
|
||||
break;
|
||||
switch (reader.getFieldNumber()) {
|
||||
case 1:
|
||||
reader.readMessage(message.common, () => message.common = dependency_1.graphicData.CommonInfo.deserialize(reader));
|
||||
break;
|
||||
case 2:
|
||||
message.size = reader.readInt32();
|
||||
break;
|
||||
default: reader.skipField();
|
||||
}
|
||||
}
|
||||
return message;
|
||||
}
|
||||
serializeBinary(): Uint8Array {
|
||||
return this.serialize();
|
||||
}
|
||||
static deserializeBinary(bytes: Uint8Array): IBPText {
|
||||
return IBPText.deserialize(bytes);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -7,5 +7,6 @@ import * as pb_1 from "google-protobuf";
|
||||
export enum PictureType {
|
||||
StationLayout = 0,
|
||||
Psl = 1,
|
||||
RelayCabinetLayout = 2
|
||||
RelayCabinetLayout = 2,
|
||||
IBP = 3
|
||||
}
|
||||
|
||||
@ -177,6 +177,14 @@ export const asyncRoutes: RouteRecordRaw[] = [
|
||||
hidden: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/ibpPainting/:id',
|
||||
name: 'ibpPainting',
|
||||
component: () => import('src/layouts/IBPDrawLayout.vue'),
|
||||
meta: {
|
||||
hidden: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/linemap',
|
||||
name: 'linemap',
|
||||
|
||||
75
src/stores/ibp-draw-store.ts
Normal file
75
src/stores/ibp-draw-store.ts
Normal file
@ -0,0 +1,75 @@
|
||||
import { defineStore } from 'pinia';
|
||||
import { getIBPDrawApp, initIBPDrawApp } from 'src/drawApp/ibpDrawApp';
|
||||
import { DrawAssistant, IDrawApp, IJlCanvas, JlGraphic } from 'src/jl-graphic';
|
||||
|
||||
export const useIBPDrawStore = defineStore('ibpDraw', {
|
||||
state: () => ({
|
||||
drawAssistant: null as DrawAssistant | null,
|
||||
selectedGraphics: null as JlGraphic[] | null,
|
||||
draftId: null as number | null,
|
||||
draftType: 'IBP',
|
||||
}),
|
||||
getters: {
|
||||
selectedObjName: (state) => {
|
||||
if (state.selectedGraphics) {
|
||||
if (state.selectedGraphics.length == 0) {
|
||||
return '画布';
|
||||
} else if (state.selectedGraphics.length == 1) {
|
||||
return state.selectedGraphics[0].type;
|
||||
}
|
||||
return '多选';
|
||||
}
|
||||
return '';
|
||||
},
|
||||
selectedGraphicType: (state) => {
|
||||
if (state.selectedGraphics) {
|
||||
if (state.selectedGraphics.length === 1) {
|
||||
return state.selectedGraphics[0].type;
|
||||
}
|
||||
}
|
||||
},
|
||||
selectedGraphic: (state) => {
|
||||
if (state.selectedGraphics) {
|
||||
if (state.selectedGraphics.length === 1) {
|
||||
return state.selectedGraphics[0];
|
||||
}
|
||||
}
|
||||
return null;
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
getDrawApp(): IDrawApp {
|
||||
const app = getIBPDrawApp();
|
||||
if (app == null) {
|
||||
throw new Error('未初始化app');
|
||||
}
|
||||
return app;
|
||||
},
|
||||
getJlCanvas(): IJlCanvas {
|
||||
return this.getDrawApp().canvas;
|
||||
},
|
||||
initDrawApp() {
|
||||
const app = initIBPDrawApp();
|
||||
app.on('interaction-plugin-resume', (plugin) => {
|
||||
if (plugin.isAppPlugin()) {
|
||||
if (Object.hasOwn(plugin, '__GraphicDrawAssistant')) {
|
||||
this.drawAssistant = plugin as DrawAssistant;
|
||||
} else {
|
||||
this.drawAssistant = null;
|
||||
}
|
||||
}
|
||||
});
|
||||
app.on('graphicselectedchange', () => {
|
||||
this.selectedGraphics = app.selectedGraphics;
|
||||
});
|
||||
this.selectedGraphics = [];
|
||||
return app;
|
||||
},
|
||||
setDraftId(id: number | null) {
|
||||
this.draftId = id;
|
||||
},
|
||||
setDraftType(type: string) {
|
||||
this.draftType = type;
|
||||
},
|
||||
},
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user