区段码位列表

This commit is contained in:
dong 2023-10-25 10:49:04 +08:00
parent afa8cb5e8c
commit 678a50c24c
8 changed files with 631 additions and 3 deletions

View File

@ -0,0 +1,150 @@
<template>
<draggable-dialog seamless title="区段码位列表" :width="600" :height="0">
<template v-slot:titleButton>
<q-btn
color="primary"
label="新建"
style="margin-right: 10px"
@click="createSectionCodePoint"
/>
</template>
<template v-slot:footer>
<q-table
ref="tableRef"
style="max-height: 600px"
v-model:pagination="pagination"
:loading="loading"
:rows="rows"
:columns="columns"
@request="onRequest"
:rows-per-page-options="[5, 10, 20, 50]"
>
<template v-slot:body-cell="props">
<q-td :props="props" class="custom-column">
{{ props.value }}
</q-td>
</template>
<template v-slot:body-cell-operations="props">
<q-td :props="props">
<div class="q-gutter-sm row justify-center">
<q-btn
color="primary"
label="编辑"
@click="editData(props.rowIndex)"
/>
<q-btn
color="red"
label="删除"
@click="deleteData(props.rowIndex)"
/>
</div>
</q-td>
</template>
</q-table>
</template>
</draggable-dialog>
</template>
<script setup lang="ts">
import { onMounted, ref, watch } from 'vue';
import DraggableDialog from 'src/components/common/DraggableDialog.vue';
import { QTable, useQuasar } from 'quasar';
import { errorNotify, successNotify } from 'src/utils/CommonNotify';
import {
deleteSectionCodePoint,
loadSectionCodePointList,
} from 'src/drawApp/commonApp';
import { graphicData } from 'src/protos/stationLayoutGraphics';
import { useDrawStore } from 'src/stores/draw-store';
const drawStore = useDrawStore();
const $q = useQuasar();
const tableRef = ref<QTable>();
const columns: QTable['columns'] = [
{
name: 'centralizedStation',
label: '集中站',
field: (row) => row.centralizedStation,
align: 'center',
},
{
name: 'sectionIds',
label: '区段id',
field: (row) => row.sectionIds.join(','),
align: 'center',
},
{ name: 'operations', label: '操作', field: 'operations', align: 'center' },
];
const rows = ref<graphicData.SectionCodePoint[]>([]);
const loading = ref(false);
const pagination = ref({
sortBy: 'desc',
descending: false,
page: 1,
rowsPerPage: 10,
rowsNumber: 10,
});
const onRequest: QTable['onRequest'] = () => {
getList();
};
function getList() {
loading.value = true;
const refDatas = loadSectionCodePointList();
rows.value = refDatas;
pagination.value.rowsNumber = refDatas.length;
pagination.value.rowsPerPage = refDatas.length;
loading.value = false;
}
function deleteData(index: number) {
const row = rows.value[index];
const name = row.centralizedStation;
$q.dialog({
message: `确定删除 "${name}" 吗?`,
cancel: true,
}).onOk(() => {
try {
if (drawStore.editSectionCodePointIndex == index) {
drawStore.setEditSectionCodePointIndex(-1);
}
deleteSectionCodePoint(index);
successNotify('删除数据成功!');
} catch (err) {
errorNotify('删除失败:', err);
} finally {
tableRef.value?.requestServerInteraction();
}
});
}
onMounted(() => {
getList();
});
watch(
() => drawStore.showEditSectionCodePoint,
(val) => {
if (!val) {
tableRef.value?.requestServerInteraction();
}
}
);
function createSectionCodePoint() {
drawStore.setEditSectionCodePointIndex(loadSectionCodePointList().length);
}
function editData(index: number) {
drawStore.setEditSectionCodePointIndex(index);
}
</script>
<style scoped>
.custom-column {
max-width: 250px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>

View File

@ -116,7 +116,7 @@ onMounted(() => {
watch(
() => drawStore.editKilometerConvertIndex,
(val) => {
if (val) {
if (val > -1) {
getData();
}
}
@ -161,7 +161,7 @@ async function onSubmit() {
}
function onReset() {
handleState.value = '新建';
// handleState.value = '';
data.kmA.coordinateSystem = 'MAIN_LINE';
data.kmA.kilometer = 0;
data.kmA.direction = 0;

View File

@ -0,0 +1,261 @@
<template>
<div v-if="showRangeConfig">
<q-card class="q-pa-sm" flat>
<q-card-section>
<div class="text-h6">{{ handleState }}区段码位</div>
</q-card-section>
<q-form
ref="myForm"
@submit="onSubmit"
@reset="onReset"
class="q-gutter-md"
>
<q-card>
<q-card-section>
<q-select
outlined
dense
v-model="data.centralizedStation"
:options="centralizedOption"
:option-disable="optionDisable"
label="所属集中站"
lazy-rules
:rules="[(val) => val.length > 0 || '请选择所属集中站!']"
></q-select>
</q-card-section>
<q-card-section no-wrap class="q-gutter-y-sm">
<div class="flex justify-between items-center">
<div>区段码位</div>
<q-btn
color="positive"
label="采集"
:disable="!data.centralizedStation"
@click="oneKeyGenerate"
/>
</div>
<q-list
dense
bordered
padding
style="height: 400px; overflow: auto"
>
<q-item
clickable
v-for="(item, index) in data.sectionIds"
:key="index"
:active="activeId == item"
active-class="bg-teal-1 text-grey-8"
@click.stop="clickSectionId(item)"
>
<q-item-section
>{{ getSectionById(item).code }}
</q-item-section>
<q-item-section side v-if="activeId == item">
<div class="q-gutter-md">
<q-btn
v-show="index != 0"
flat
dense
color="primary"
size="sm"
icon="arrow_upward"
@click.stop="moveUp(index)"
/>
<q-btn
v-show="index != data.sectionIds.length - 1"
flat
dense
color="primary"
size="sm"
icon="arrow_downward"
@click.stop="moveDown(index)"
/>
<q-btn
flat
dense
color="red"
size="sm"
icon="delete_forever"
@click.stop="deleteSectionId(index)"
/>
</div>
</q-item-section>
</q-item>
</q-list>
</q-card-section>
</q-card>
<div class="q-gutter-sm q-pa-md row justify-center">
<q-btn label="提交" type="submit" color="primary" class="q-mr-md" />
<q-btn label="重置" type="reset" color="primary" class="q-mr-md" />
<q-btn label="返回" color="primary" @click="goBack" />
</div>
</q-form>
</q-card>
</div>
</template>
<script setup lang="ts">
import { onMounted, reactive, ref, watch } from 'vue';
import { QForm, useQuasar } from 'quasar';
import { graphicData } from 'src/protos/stationLayoutGraphics';
import {
creatSectionCodePoint,
editSectionCodePoint,
loadSectionCodePointList,
} from 'src/drawApp/commonApp';
import { useDrawStore } from 'src/stores/draw-store';
import {
ISectionData,
Section,
SectionType,
} from 'src/graphics/section/Section';
const $q = useQuasar();
const showRangeConfig = ref(true);
const handleState = ref('新建');
const drawStore = useDrawStore();
interface IConvertData {
centralizedStation: string;
sectionIds: string[];
}
const data = reactive<IConvertData>({
centralizedStation: '',
sectionIds: [],
});
onMounted(() => {
getCentralizedOption();
getData();
});
watch(
() => drawStore.editSectionCodePointIndex,
(val) => {
if (val > -1) {
getData();
}
}
);
const myForm = ref<QForm | null>(null);
async function onSubmit() {
myForm.value?.validate().then(async (res) => {
if (res) {
try {
const convert = new graphicData.SectionCodePoint(data);
if (handleState.value == '新建') {
creatSectionCodePoint(convert);
} else {
editSectionCodePoint(convert);
}
onReset();
showRangeConfig.value = false;
drawStore.setEditSectionCodePointIndex(-1);
} catch (err) {
console.log(err);
$q.notify({
type: 'negative',
message: `${handleState.value}区段码位提交失败!`,
});
}
}
});
}
function onReset() {
// handleState.value = '';
data.centralizedStation = '';
data.sectionIds = [];
}
function goBack() {
onReset();
drawStore.setEditSectionCodePointIndex(-1);
}
function getData() {
const index = drawStore.editSectionCodePointIndex;
const codePointData = loadSectionCodePointList()[index];
if (codePointData?.centralizedStation || codePointData?.sectionIds) {
handleState.value = '编辑';
} else {
handleState.value = '新建';
}
data.centralizedStation = codePointData?.centralizedStation || '';
const ids = codePointData?.sectionIds || [];
data.sectionIds = [...ids];
}
function oneKeyGenerate() {
const pSections = drawStore
.getDrawApp()
.queryStore.queryByType<Section>(Section.Type);
const pType = [SectionType.Physical, SectionType.TurnoutPhysical];
const filetr = pSections.filter((item) => {
return (
item.datas.centralizedStations.includes(data.centralizedStation) &&
pType.includes(item.datas.sectionType)
);
});
data.sectionIds = filetr.map((ii) => ii.datas.id);
}
const activeId = ref('');
function clickSectionId(id: string) {
activeId.value = id;
const device = drawStore.getDrawApp().queryStore.queryById(id);
drawStore.getDrawApp().makeGraphicCenterShow(device);
drawStore.getDrawApp().updateSelected(device);
}
const centralizedOption = ref<string[]>([]);
function getCentralizedOption() {
const pSections = drawStore
.getDrawApp()
.queryStore.queryByType<Section>(Section.Type);
pSections.forEach((item) => {
item.datas.centralizedStations.forEach((ii) => {
if (!centralizedOption.value.includes(ii)) {
centralizedOption.value.push(ii);
}
});
});
}
function optionDisable(item: string) {
let s = false;
const find = loadSectionCodePointList().find(
(ii) => ii.centralizedStation == item
);
if (find && handleState.value == '新建') {
s = true;
}
return s;
}
function getSectionById(id: string): ISectionData {
const device = drawStore.getDrawApp().queryStore.queryById(id);
return (device as Section).datas;
}
function moveUp(index: number) {
if (index === 0) {
return;
}
data.sectionIds.splice(index - 1, 0, data.sectionIds[index]);
data.sectionIds.splice(index + 1, 1);
}
function moveDown(index: number) {
if (index === data.sectionIds.length - 1) {
return;
}
data.sectionIds.splice(index + 2, 0, data.sectionIds[index]);
data.sectionIds.splice(index, 1);
}
function deleteSectionId(index: number) {
data.sectionIds.splice(index, 1);
}
</script>

View File

@ -237,6 +237,7 @@ export function initCommonDrawApp(app: IDrawApp) {
app.on('destroy', async () => {
UniqueIdPrefix = new graphicData.UniqueIdOfStationLayout();
kilometerConvertList = [];
sectionCodePointList = [];
});
}
@ -246,6 +247,7 @@ export function loadCommonDrawDatas(
const datas: GraphicData[] = [];
UniqueIdPrefix = storage.UniqueIdPrefix;
kilometerConvertList = storage.kilometerConvertList;
sectionCodePointList = storage.sectionCodePointList;
storage.Platforms.forEach((platform) => {
datas.push(new PlatformData(platform));
});
@ -380,6 +382,7 @@ export function saveCommonDrawDatas(
}
storage.UniqueIdPrefix = UniqueIdPrefix;
storage.kilometerConvertList = kilometerConvertList;
storage.sectionCodePointList = sectionCodePointList;
return storage;
}
@ -465,3 +468,27 @@ export const directionOptions = [
{ label: '左行', value: 0 },
{ label: '右行', value: 1 },
];
//区段码位列表增删改查
let sectionCodePointList: graphicData.SectionCodePoint[] = [];
export function loadSectionCodePointList() {
return sectionCodePointList;
}
export function creatSectionCodePoint(row: graphicData.SectionCodePoint) {
sectionCodePointList.push(row);
}
export function editSectionCodePoint(row: graphicData.SectionCodePoint) {
const drawStore = useDrawStore();
const sIndex = drawStore.editSectionCodePointIndex;
const find = sectionCodePointList.find(
(item, index) =>
index != sIndex && item.centralizedStation == row.centralizedStation
);
if (!find && sIndex > -1) {
sectionCodePointList.splice(sIndex, 1, row);
}
}
export function deleteSectionCodePoint(index: number) {
sectionCodePointList.splice(index, 1);
}

View File

@ -75,6 +75,11 @@
<q-item-label>公里标转换</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="openSectionCodePointList">
<q-item-section>
<q-item-label>区段码位列表</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
<q-btn color="info" label="返回" @click="backConfirm" />
@ -89,6 +94,9 @@
<KilometerConvertConfig
v-if="drawStore.showEditKilometerConvert"
></KilometerConvertConfig>
<SectionCodePointConfig
v-else-if="drawStore.showEditSectionCodePoint"
></SectionCodePointConfig>
<draw-properties
v-else-if="!drawStore.showRelateDeviceConfig"
></draw-properties>
@ -288,6 +296,8 @@ import { CategoryType } from 'src/components/CategoryType';
import { graphicData } from 'src/protos/stationLayoutGraphics';
import KilometerConvertList from 'src/components/draw-app/dialogs/KilometerConvertList.vue';
import KilometerConvertConfig from 'src/components/draw-app/properties/KilometerConvertConfig.vue';
import SectionCodePointList from 'src/components/draw-app/dialogs/SectionCodePointList.vue';
import SectionCodePointConfig from 'src/components/draw-app/properties/SectionCodePointConfig.vue';
import StationRelateDeviceConfig from 'src/components/draw-app/properties/StationRelateDeviceConfig.vue';
import StationRelateDeviceList from 'src/components/draw-app/dialogs/StationRelateDeviceList.vue';
import { PictureType } from 'src/protos/picture';
@ -749,6 +759,18 @@ function openkilometerConvertList() {
});
}
const sectionCodePointDialog = ref();
function openSectionCodePointList() {
if (sectionCodePointDialog.value) return;
sectionCodePointDialog.value = $q
.dialog({
component: SectionCodePointList,
})
.onCancel(() => {
sectionCodePointDialog.value = null;
});
}
let relateDeviceDialogInstance: DialogChainObject | null = null;
const relateDeviceConfigEdit =
ref<InstanceType<typeof StationRelateDeviceConfig>>();

View File

@ -250,4 +250,52 @@ export namespace request {
LightBCancelDs = 11
}
}
export class Section extends pb_1.Message {
#one_of_decls: number[][] = [];
constructor(data?: any[] | {}) {
super();
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [], this.#one_of_decls);
if (!Array.isArray(data) && typeof data == "object") { }
}
static fromObject(data: {}): Section {
const message = new Section({});
return message;
}
toObject() {
const data: {} = {};
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 (!w)
return writer.getResultBuffer();
}
static deserialize(bytes: Uint8Array | pb_1.BinaryReader): Section {
const reader = bytes instanceof pb_1.BinaryReader ? bytes : new pb_1.BinaryReader(bytes), message = new Section();
while (reader.nextField()) {
if (reader.isEndGroup())
break;
switch (reader.getFieldNumber()) {
default: reader.skipField();
}
}
return message;
}
serializeBinary(): Uint8Array {
return this.serialize();
}
static deserializeBinary(bytes: Uint8Array): Section {
return Section.deserialize(bytes);
}
}
export namespace Section {
export enum AxleOperation {
Drst = 0,
Pdrst = 1,
TrainIn = 2,
TrainOut = 3
}
}
}

View File

@ -40,9 +40,10 @@ export namespace graphicData {
kilometerConvertList?: KilometerConvert[];
screenDoors?: ScreenDoor[];
stationRelateDeviceList?: StationRelateDevice[];
sectionCodePointList?: SectionCodePoint[];
}) {
super();
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [4, 5, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 32, 33, 34], this.#one_of_decls);
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [4, 5, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 32, 33, 34, 35], this.#one_of_decls);
if (!Array.isArray(data) && typeof data == "object") {
if ("canvas" in data && data.canvas != undefined) {
this.canvas = data.canvas;
@ -128,6 +129,9 @@ export namespace graphicData {
if ("stationRelateDeviceList" in data && data.stationRelateDeviceList != undefined) {
this.stationRelateDeviceList = data.stationRelateDeviceList;
}
if ("sectionCodePointList" in data && data.sectionCodePointList != undefined) {
this.sectionCodePointList = data.sectionCodePointList;
}
}
}
get canvas() {
@ -304,6 +308,12 @@ export namespace graphicData {
set stationRelateDeviceList(value: StationRelateDevice[]) {
pb_1.Message.setRepeatedWrapperField(this, 34, value);
}
get sectionCodePointList() {
return pb_1.Message.getRepeatedWrapperField(this, SectionCodePoint, 35) as SectionCodePoint[];
}
set sectionCodePointList(value: SectionCodePoint[]) {
pb_1.Message.setRepeatedWrapperField(this, 35, value);
}
static fromObject(data: {
canvas?: ReturnType<typeof Canvas.prototype.toObject>;
Platforms?: ReturnType<typeof Platform.prototype.toObject>[];
@ -333,6 +343,7 @@ export namespace graphicData {
kilometerConvertList?: ReturnType<typeof KilometerConvert.prototype.toObject>[];
screenDoors?: ReturnType<typeof ScreenDoor.prototype.toObject>[];
stationRelateDeviceList?: ReturnType<typeof StationRelateDevice.prototype.toObject>[];
sectionCodePointList?: ReturnType<typeof SectionCodePoint.prototype.toObject>[];
}): RtssGraphicStorage {
const message = new RtssGraphicStorage({});
if (data.canvas != null) {
@ -419,6 +430,9 @@ export namespace graphicData {
if (data.stationRelateDeviceList != null) {
message.stationRelateDeviceList = data.stationRelateDeviceList.map(item => StationRelateDevice.fromObject(item));
}
if (data.sectionCodePointList != null) {
message.sectionCodePointList = data.sectionCodePointList.map(item => SectionCodePoint.fromObject(item));
}
return message;
}
toObject() {
@ -451,6 +465,7 @@ export namespace graphicData {
kilometerConvertList?: ReturnType<typeof KilometerConvert.prototype.toObject>[];
screenDoors?: ReturnType<typeof ScreenDoor.prototype.toObject>[];
stationRelateDeviceList?: ReturnType<typeof StationRelateDevice.prototype.toObject>[];
sectionCodePointList?: ReturnType<typeof SectionCodePoint.prototype.toObject>[];
} = {};
if (this.canvas != null) {
data.canvas = this.canvas.toObject();
@ -536,6 +551,9 @@ export namespace graphicData {
if (this.stationRelateDeviceList != null) {
data.stationRelateDeviceList = this.stationRelateDeviceList.map((item: StationRelateDevice) => item.toObject());
}
if (this.sectionCodePointList != null) {
data.sectionCodePointList = this.sectionCodePointList.map((item: SectionCodePoint) => item.toObject());
}
return data;
}
serialize(): Uint8Array;
@ -598,6 +616,8 @@ export namespace graphicData {
writer.writeRepeatedMessage(33, this.screenDoors, (item: ScreenDoor) => item.serialize(writer));
if (this.stationRelateDeviceList.length)
writer.writeRepeatedMessage(34, this.stationRelateDeviceList, (item: StationRelateDevice) => item.serialize(writer));
if (this.sectionCodePointList.length)
writer.writeRepeatedMessage(35, this.sectionCodePointList, (item: SectionCodePoint) => item.serialize(writer));
if (!w)
return writer.getResultBuffer();
}
@ -691,6 +711,9 @@ export namespace graphicData {
case 34:
reader.readMessage(message.stationRelateDeviceList, () => pb_1.Message.addToRepeatedWrapperField(message, 34, StationRelateDevice.deserialize(reader), StationRelateDevice));
break;
case 35:
reader.readMessage(message.sectionCodePointList, () => pb_1.Message.addToRepeatedWrapperField(message, 35, SectionCodePoint.deserialize(reader), SectionCodePoint));
break;
default: reader.skipField();
}
}
@ -7131,4 +7154,94 @@ export namespace graphicData {
return DeviceCombinationtype.deserialize(bytes);
}
}
export class SectionCodePoint extends pb_1.Message {
#one_of_decls: number[][] = [];
constructor(data?: any[] | {
centralizedStation?: string;
sectionIds?: string[];
}) {
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 ("centralizedStation" in data && data.centralizedStation != undefined) {
this.centralizedStation = data.centralizedStation;
}
if ("sectionIds" in data && data.sectionIds != undefined) {
this.sectionIds = data.sectionIds;
}
}
}
get centralizedStation() {
return pb_1.Message.getFieldWithDefault(this, 1, "") as string;
}
set centralizedStation(value: string) {
pb_1.Message.setField(this, 1, value);
}
get sectionIds() {
return pb_1.Message.getFieldWithDefault(this, 2, []) as string[];
}
set sectionIds(value: string[]) {
pb_1.Message.setField(this, 2, value);
}
static fromObject(data: {
centralizedStation?: string;
sectionIds?: string[];
}): SectionCodePoint {
const message = new SectionCodePoint({});
if (data.centralizedStation != null) {
message.centralizedStation = data.centralizedStation;
}
if (data.sectionIds != null) {
message.sectionIds = data.sectionIds;
}
return message;
}
toObject() {
const data: {
centralizedStation?: string;
sectionIds?: string[];
} = {};
if (this.centralizedStation != null) {
data.centralizedStation = this.centralizedStation;
}
if (this.sectionIds != null) {
data.sectionIds = this.sectionIds;
}
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.centralizedStation.length)
writer.writeString(1, this.centralizedStation);
if (this.sectionIds.length)
writer.writeRepeatedString(2, this.sectionIds);
if (!w)
return writer.getResultBuffer();
}
static deserialize(bytes: Uint8Array | pb_1.BinaryReader): SectionCodePoint {
const reader = bytes instanceof pb_1.BinaryReader ? bytes : new pb_1.BinaryReader(bytes), message = new SectionCodePoint();
while (reader.nextField()) {
if (reader.isEndGroup())
break;
switch (reader.getFieldNumber()) {
case 1:
message.centralizedStation = reader.readString();
break;
case 2:
pb_1.Message.addToRepeatedField(message, 2, reader.readString());
break;
default: reader.skipField();
}
}
return message;
}
serializeBinary(): Uint8Array {
return this.serialize();
}
static deserializeBinary(bytes: Uint8Array): SectionCodePoint {
return SectionCodePoint.deserialize(bytes);
}
}
}

View File

@ -28,6 +28,7 @@ export const useDrawStore = defineStore('draw', {
categoryType: null as CategoryType | null,
oneClickType: '',
editKilometerConvertIndex: -1,
editSectionCodePointIndex: -1,
table: undefined as QTable | undefined,
showRelateDeviceConfig: false,
}),
@ -81,6 +82,9 @@ export const useDrawStore = defineStore('draw', {
showEditKilometerConvert: (state) => {
return state.editKilometerConvertIndex >= 0;
},
showEditSectionCodePoint: (state) => {
return state.editSectionCodePointIndex >= 0;
},
},
actions: {
getDrawApp(): IDrawApp {
@ -151,5 +155,8 @@ export const useDrawStore = defineStore('draw', {
setEditKilometerConvertIndex(index: number) {
this.editKilometerConvertIndex = index;
},
setEditSectionCodePointIndex(index: number) {
this.editSectionCodePointIndex = index;
},
},
});