joylink/xian-ncc-da-client
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of https://git.code.tencent.com/xian-ncc-da/xian-ncc-da-client

Browse Source
This commit is contained in:
fan 2024-01-25 10:15:39 +08:00
commit 3aa3038504
11 changed files with 300 additions and 136 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/api/AlertMock.ts
View File

@ -9,9 +9,12 @@ export function mockLocalDemoTestSet(
alertType: string,
data: {
lineId: number;
deviceInfos: { deviceName: string; deviceType: string }[];
status: string;
groupId?: string;
deviceInfos: {
deviceName: string;
deviceType: string;
status: string;
groupId?: string;
}[];
}
) {
return api.post(`${alertUriBase}/localDemoTest/${alertType}`, data);

2
src/api/ConfigApi.ts
View File

@ -45,7 +45,7 @@ export interface IAreaConfigItem {
areaName: string;
deviceType: string;
alertTypes: string[];
data: string[];
data: number[];
}
export function deviceRangeSet(data: IAreaConfigItem) {
return api.post('/api/config/device/area/save', data);

270
src/components/alarm/setAlarmText.vue
View File

@ -25,52 +25,79 @@
v-model="setAlartTextData.alertType"
:options="optionsAlertType"
:rules="[(val) => val.length > 0 || '请选择故障类型！']"
/>
<q-input
v-if="setAlartTextData.alertType == '列车信号故障'"
outlined
label="车组号"
v-model.number="setAlartTextData.groupId"
type="number"
lazy-rules
:rules="[(val) => val || '请输入车组号！']"
/>
<q-select
outlined
label="故障测试状态"
v-model="setAlartTextData.status"
:options="optionsStatus"
:rules="[(val) => val.length > 0 || '请选择故障类型！']"
map-options
emit-value
@update:model-value="onChooseAlertType"
/>
<q-list bordered separator class="rounded-borders">
<q-item>
<q-item-section no-wrap class="q-gutter-y-sm column">
<q-item-label> 框选的设备 </q-item-label>
<div class="q-gutter-sm row">
<q-chip
v-for="item in setAlartTextData.deviceInfos"
:key="item.deviceName"
square
color="primary"
text-color="white"
removable
@remove="removeSelect(item)"
>
{{ item.deviceName }}
</q-chip>
</div>
<q-btn
v-show="setAlartTextData.deviceInfos.length > 0"
style="width: 120px"
label="清空框选的设备"
color="red"
@click="clearSelect"
/>
</q-item-section>
</q-item>
<q-expansion-item
bordered
expand-separator
v-for="(configItem, index) in setAlartTextData.groupList"
:key="configItem"
v-model="configItem.expanded"
:label="configItem.groupName"
@click="toggleItem(index)"
>
<q-card>
<q-item no-wrap class="column">
<q-input
v-if="setAlartTextData.alertType == '列车信号故障'"
outlined
label="车组号"
v-model="configItem.groupId"
lazy-rules
:rules="[(val) => val.length > 0 || '请输入车组号！']"
/>
<q-select
outlined
label="故障测试状态"
v-model="configItem.status"
:options="optionsStatus"
:rules="[(val) => val.length > 0 || '请选择故障类型！']"
map-options
emit-value
/>
<div class="q-gutter-sm row">
<q-chip
v-for="(item, selectIndex) in configItem.deviceInfos"
:key="item"
square
color="primary"
text-color="white"
removable
@remove="removeSelect(selectIndex)"
clickable
@click="clickSelectCenter(selectIndex)"
>
{{ item.deviceName }}
</q-chip>
</div>
<div>
<q-btn
v-show="configItem.deviceInfos.length > 0"
style="width: 100px"
label="清空选择"
color="red"
class="q-mr-md"
@click="clearAllSelect(index)"
/>
<q-btn
v-if="setAlartTextData.alertType == '列车信号故障'"
label="删除测试组"
color="secondary"
@click="deleteSelectConfig(index)"
/>
</div>
</q-item>
</q-card>
</q-expansion-item>
</q-list>
<q-btn
v-if="setAlartTextData.alertType == '列车信号故障'"
class="q-mt-md"
label="增加测试组"
color="secondary"
@click="addSelectConfig"
/>
<div class="q-gutter-sm q-pa-md row justify-center">
<q-btn
label="提交"
@ -102,15 +129,28 @@ const lineStore = useLineStore();
const setAlartTextData = ref<{
lineId: string;
alertType: string;
deviceInfos: { deviceName: string; deviceType: string }[];
status: string;
groupId: string;
groupList: {
groupName: string;
groupId?: string;
status: string;
deviceInfos: {
deviceName: string;
deviceType: string;
}[];
expanded: boolean;
}[];
}>({
lineId: '',
alertType: '',
deviceInfos: [],
status: '',
groupId: '',
groupList: [
{
groupName: '测试组',
groupId: '',
status: '',
deviceInfos: [],
expanded: false,
},
],
});
const optionsAlertType = [
'蓝显',
@ -141,7 +181,12 @@ let selectGraphic: JlGraphic[] = [];
watch(
() => lineStore.selectedGraphics,
(val) => {
if (val && val.length > 0 && setAlartTextData.value.alertType) {
if (
val &&
val.length > 0 &&
setAlartTextData.value.alertType &&
clickIndex !== null
) {
const selectGraphicId = selectGraphic.map((g) => g.id);
const appSelectedGraphicsId = lineStore.selectedGraphics?.map(
(g) => g.id
@ -176,12 +221,14 @@ watch(
}
selectGraphic = Array.from(new Set(selectGraphic));
lineStore.getLineApp().updateSelected(...selectGraphic);
setAlartTextData.value.deviceInfos = [];
setAlartTextData.value.groupList[clickIndex].deviceInfos = [];
selectGraphic.forEach((g) => {
setAlartTextData.value.deviceInfos.push({
deviceName: g.code,
deviceType: (DeviceType as never)[g.type + ''],
});
setAlartTextData.value.groupList[clickIndex as number].deviceInfos.push(
{
deviceName: g.code,
deviceType: (DeviceType as never)[g.type + ''],
}
);
});
}
}
@ -196,7 +243,6 @@ onMounted(() => {
wheelZoom: true,
},
});
clearSelect();
onReset();
setAlartTextData.value.lineId = lineStore.lineId as unknown as string;
});
@ -208,12 +254,25 @@ const $q = useQuasar();
async function onSubmit() {
myForm.value?.validate().then(async (res) => {
if (res) {
const deviceInfos = setAlartTextData.value.groupList
.map((group) => {
const deviceInfo = group.deviceInfos.map((deviceInfo) => {
const status = group.status;
const groupId = group.groupId || '';
return {
deviceName: deviceInfo.deviceName,
deviceType: deviceInfo.deviceType,
status,
groupId,
};
});
return deviceInfo;
})
.flat();
try {
const params = {
lineId: +setAlartTextData.value.lineId,
deviceInfos: setAlartTextData.value.deviceInfos,
status: setAlartTextData.value.status,
groupId: setAlartTextData.value.groupId,
deviceInfos,
};
const alertType = (saveAlertTypeData as never)[
setAlartTextData.value.alertType + ''
@ -237,28 +296,101 @@ async function onSubmit() {
});
}
function removeSelect(code: { deviceName: string; deviceType: string }) {
const removeIndex = setAlartTextData.value.deviceInfos.findIndex(
(item) => item == code
);
let clickIndex: null | number = null;
function toggleItem(index: number) {
const lineApp = lineStore.getLineApp();
selectGraphic = [];
lineApp.updateSelected();
if (setAlartTextData.value.groupList[index].expanded == true) {
clickIndex = index;
const select: JlGraphic[] = [];
setAlartTextData.value.groupList[index].deviceInfos.forEach(
(deviceInfo) => {
const deviceType = (
Object.keys(DeviceType) as Array<keyof typeof DeviceType>
).find((key) => DeviceType[key] === deviceInfo.deviceType) as string;
const g = lineApp.queryStore.queryByCodeAndType(
deviceInfo.deviceName,
deviceType
) as JlGraphic;
select.push(g);
}
);
lineApp.updateSelected(...select);
} else {
clickIndex = null;
}
}
function clickSelectCenter(index: number) {
const lineApp = lineStore.getLineApp();
const clickTarget = setAlartTextData.value.groupList[clickIndex as number];
const deviceType = (
Object.keys(DeviceType) as Array<keyof typeof DeviceType>
).find(
(key) => DeviceType[key] === clickTarget.deviceInfos[index].deviceType
) as string;
const clickGraphic = lineApp.queryStore.queryByCodeAndType(
clickTarget.deviceInfos[index].deviceName,
deviceType
) as JlGraphic;
lineApp.makeGraphicCenterShow(clickGraphic);
}
function removeSelect(removeIndex: number) {
const clickTarget = setAlartTextData.value.groupList[clickIndex as number];
selectGraphic.splice(removeIndex, 1);
setAlartTextData.value.deviceInfos.splice(removeIndex, 1);
clickTarget.deviceInfos.splice(removeIndex, 1);
lineStore.getLineApp().updateSelected(...selectGraphic);
}
function clearSelect() {
setAlartTextData.value.deviceInfos = [];
function clearAllSelect(index: number) {
setAlartTextData.value.groupList[index].deviceInfos = [];
selectGraphic = [];
lineStore.getLineApp().updateSelected();
}
function addSelectConfig() {
setAlartTextData.value.groupList.push({
groupName: '测试组',
groupId: '',
status: '',
deviceInfos: [],
expanded: false,
});
}
function deleteSelectConfig(index: number) {
setAlartTextData.value.groupList.splice(index, 1);
selectGraphic = [];
lineStore.getLineApp().updateSelected();
}
function onChooseAlertType() {
setAlartTextData.value.groupList = [
{
groupName: '测试组',
groupId: '',
status: '',
deviceInfos: [],
expanded: false,
},
];
}
function onReset() {
setAlartTextData.value = {
lineId: lineStore.lineId as unknown as string,
alertType: '',
deviceInfos: [],
status: '',
groupId: '',
groupList: [
{
groupName: '测试组',
groupId: '',
status: '',
deviceInfos: [],
expanded: false,
},
],
};
selectGraphic = [];
}

4
src/components/common/DraggableDialog.vue
View File

@ -27,7 +27,7 @@
:style="`height: ${props.titleHeight}px;background: ${props.titleColor}`"
>
<div
:style="`color:${props.fontColor};font-size: ${props.fontSize}px;`"
:style="`height: 100%; line-height: ${props.titleHeight}px; color:${props.fontColor};font-size: ${props.fontSize}px;`"
>
{{ props.title }}
</div>
@ -113,7 +113,7 @@ function onMouseUp() {
startOffset.y = 0;
}
function onMouseDown(e: MouseEvent) {
if (headerRef.value?.$el !== e.target) return;
if (!e.target || !headerRef.value?.$el.contains(e.target)) return;
startOffset.x = e.offsetX;
startOffset.y = e.offsetY;
start.x = e.clientX - offset.x;

12
src/components/rangeConfigApp/RangeConfig.vue
View File

@ -94,7 +94,7 @@ const showRangeConfig = ref(true);
const rangeConfig = reactive<{
areaName: string;
deviceType: `${DeviceType}` | '';
device: string[];
device: number[];
alertTypes: string[];
}>({
areaName: '',
@ -184,15 +184,11 @@ watch(
}
return select;
}) as JlGraphic[];
if (rangeConfig.alertTypes[0] !== '一级联锁') {
selectGraphic.push(...deviceFilter);
} else if (deviceFilter.length) {
selectGraphic = [deviceFilter[0]];
}
selectGraphic.push(...deviceFilter);
selectGraphic = Array.from(new Set(selectGraphic));
getRangeConfigApp().updateSelected(...selectGraphic);
device.value = selectGraphic.map((g) => g.code) as string[];
rangeConfig.device = selectGraphic.map((g) => g.id) as string[];
rangeConfig.device = selectGraphic.map((g) => g.id) as number[];
}
}
);
@ -267,7 +263,7 @@ async function searchById(id: number) {
(type) => (showAlertTypeData as never)[type + '']
);
const select: JlGraphic[] = [];
response.data.data.forEach((id: string) => {
response.data.data.forEach((id: number) => {
const g = getRangeConfigApp().queryStore.queryById(id);
select.push(g);
device.value.push(g.code);

8
src/drawApp/graphics/SectionInteraction.ts
View File

@ -53,11 +53,11 @@ export class SectionData extends GraphicDataBase implements ISectionData {
set sectionType(type: graphicData.Section.SectionType) {
this.data.sectionType = type;
}
get axleCountings(): string[] {
return this.data.axleCountings;
get axleCountings(): number[] {
return this.data.axleCountings.map((a) => Number(a));
}
set axleCountings(axleCountings: string[]) {
this.data.axleCountings = axleCountings;
set axleCountings(axleCountings: number[]) {
this.data.axleCountings = axleCountings.map((a) => a.toString());
}
get children(): number[] {
return this.data.children;

7
src/graphics/section/Section.ts
View File

@ -40,8 +40,8 @@ export interface ISectionData extends GraphicData {
set pbRef(ref: IRelatedRefData | undefined);
get sectionType(): SectionType;
set sectionType(type: SectionType);
get axleCountings(): string[];
set axleCountings(axleCountings: string[]);
get axleCountings(): number[];
set axleCountings(axleCountings: number[]);
get children(): number[];
set children(children: number[]);
get destinationCode(): string;
@ -233,9 +233,11 @@ export class Section extends JlGraphic implements ILineGraphic {
buildRelation() {
this.relationManage.deleteRelationOfGraphicAndOtherType(this, Section.Type);
if (this.datas.sectionType === SectionType.TurnoutPhysical) return;
/** 区段与区段 */
this.queryStore.queryByType<Section>(Section.Type).forEach((section) => {
if (section.id === this.id) return;
if (section.datas.sectionType === SectionType.TurnoutPhysical) return;
let param: SectionPort[] = [];
if (
@ -346,7 +348,6 @@ export class Section extends JlGraphic implements ILineGraphic {
});
}
if (
this.datas.children &&
this.datas.children &&
this.datas.sectionType === SectionType.TurnoutPhysical
) {

45
src/graphics/section/SectionDrawAssistant.ts
View File

@ -123,7 +123,7 @@ export class SectionDraw extends GraphicDrawAssistant<
}
generateTurnoutSection() {
const turnoutIds: string[] = []; /* 已遍历的道岔id列表 */
const turnoutIds: number[] = []; /* 已遍历的道岔id列表 */
const dfs = (turnout: Turnout) => {
const axleCountings: AxleCounting[] = [];
const turnouts: Turnout[] = [];
@ -173,6 +173,18 @@ export class SectionDraw extends GraphicDrawAssistant<
turnoutPhysicalSectionData.axleCountings = result.axleCountings.map(
(ac) => ac.datas.id
);
const exsit = this.app.queryStore
.queryByType<Section>(Section.Type)
.filter((g) => g.datas.sectionType === SectionType.TurnoutPhysical)
.some(
(ts) =>
ts.datas.axleCountings.every((id) =>
turnoutPhysicalSectionData.axleCountings.includes(id)
) &&
ts.datas.axleCountings.length ===
turnoutPhysicalSectionData.axleCountings.length
);
if (exsit) return;
turnoutPhysicalSectionData.children = result.turnouts.map(
(t) => t.datas.id
);
@ -232,18 +244,25 @@ export class SectionGraphicHitArea implements IHitArea {
function buildAbsorbablePositions(section: Section): AbsorbablePosition[] {
const aps: AbsorbablePosition[] = [];
const sections = section.queryStore.queryByType<Section>(Section.Type);
sections.forEach((other) => {
const [ps, pe] = [
other.localToCanvasPoint(other.getStartPoint()),
other.localToCanvasPoint(other.getEndPoint()),
];
const { width, height } = section.getGraphicApp().canvas;
const xs = new AbsorbableLine({ x: 0, y: ps.y }, { x: width, y: ps.y });
const ys = new AbsorbableLine({ x: ps.x, y: 0 }, { x: ps.x, y: height });
const xe = new AbsorbableLine({ x: 0, y: pe.y }, { x: width, y: pe.y });
const ye = new AbsorbableLine({ x: pe.x, y: 0 }, { x: pe.x, y: height });
aps.push(xs, ys, xe, ye);
const [ps, pe] = [
section.localToCanvasPoint(section.getStartPoint()),
section.localToCanvasPoint(section.getEndPoint()),
];
const { width, height } = section.getGraphicApp().canvas;
const xs = new AbsorbableLine({ x: 0, y: ps.y }, { x: width, y: ps.y });
const ys = new AbsorbableLine({ x: ps.x, y: 0 }, { x: ps.x, y: height });
const xe = new AbsorbableLine({ x: 0, y: pe.y }, { x: width, y: pe.y });
const ye = new AbsorbableLine({ x: pe.x, y: 0 }, { x: pe.x, y: height });
aps.push(xs, ys, xe, ye);
const sections = section.queryStore
.queryByType<Section>(Section.Type)
.filter((g) => g.datas.sectionType == SectionType.Physical);
sections.forEach((item) => {
if (item.id !== section.id) {
item.localToCanvasPoints(...item.datas.points).forEach((p) => {
aps.push(new AbsorbablePoint(p));
});
}
});
const turnouts = section.queryStore.queryByType<Turnout>(Turnout.Type);

73
src/graphics/turnout/Turnout.ts
View File

@ -13,7 +13,7 @@ import {
epsilon,
Vector2,
} from 'jl-graphic';
import { Section, SectionPort } from '../section/Section';
import { Section, SectionPort, SectionType } from '../section/Section';
import {
IRelatedRefData,
createRelatedRefProto,
@ -541,39 +541,47 @@ export class Turnout extends JlGraphic {
buildRelation(): void {
this.relationManage.deleteRelationOfGraphic(this);
/** 道岔和区段 */
this.queryStore.queryByType<Section>(Section.Type).forEach((section) => {
this.getPortPoints().forEach((port, i) => {
if (
distance2(
section.localToCanvasPoint(section.getStartPoint()),
this.localToCanvasPoint(port[port.length - 1])
) <= epsilon
) {
this.relationManage.addRelation(
new GraphicRelationParam(
this,
[TurnoutPort.A, TurnoutPort.B, TurnoutPort.C][i]
),
new GraphicRelationParam(section, SectionPort.A)
);
}
if (
distance2(
section.localToCanvasPoint(section.getEndPoint()),
this.localToCanvasPoint(port[port.length - 1])
) <= epsilon
) {
this.relationManage.addRelation(
new GraphicRelationParam(
this,
[TurnoutPort.A, TurnoutPort.B, TurnoutPort.C][i]
),
new GraphicRelationParam(section, SectionPort.B)
);
this.queryStore.queryByType<Section>(Section.Type)
.forEach((section) => {
if (section.datas.sectionType === SectionType.TurnoutPhysical) {
if (section.datas.children.includes(this.datas.id)) {
this.relationManage.addRelation(this, section)
}
return
}
this.getPortPoints().forEach((port, i) => {
if (
distance2(
section.localToCanvasPoint(section.getStartPoint()),
this.localToCanvasPoint(port[port.length - 1])
) <= epsilon
) {
this.relationManage.addRelation(
new GraphicRelationParam(
this,
[TurnoutPort.A, TurnoutPort.B, TurnoutPort.C][i]
),
new GraphicRelationParam(section, SectionPort.A)
);
}
if (
distance2(
section.localToCanvasPoint(section.getEndPoint()),
this.localToCanvasPoint(port[port.length - 1])
) <= epsilon
) {
this.relationManage.addRelation(
new GraphicRelationParam(
this,
[TurnoutPort.A, TurnoutPort.B, TurnoutPort.C][i]
),
new GraphicRelationParam(section, SectionPort.B)
);
}
});
});
});
/** 道岔和道岔 */
this.getPortPoints().forEach((thisPort, i) => {
@ -656,10 +664,13 @@ export class Turnout extends JlGraphic {
} else {
this.datas.pbRef = undefined;
}
const pcRelation = this.relationManage
.getRelationsOfGraphic(this)
.find(
(relation) => relation.getRelationParam(this).param === TurnoutPort.C
&& (!(relation.getOtherGraphic(this) instanceof Section
&& relation.getOtherGraphic<Section>(this).datas.sectionType !== SectionType.TurnoutPhysical))
);
const pcDevice = pcRelation?.getOtherGraphic<Section | Turnout>(this);
if (pcDevice) {

2
src/pages/LineMonitorPage.vue
View File

@ -1,6 +1,6 @@
<template>
<q-page class="row items-center justify-evenly">
<q-page-container style="padding: 0">
<q-page-container style="padding: 0; overflow: hidden">
<div id="line-app-container"></div>
</q-page-container>
</q-page>

4
src/pages/MonitorPage.vue
View File

@ -1,6 +1,8 @@
<template>
<q-page class="row items-center justify-evenly">
<div id="line-app-container"></div>
<q-page-container style="padding: 0; overflow: hidden">
<div id="line-app-container"></div>
</q-page-container>
</q-page>
</template>