From 678a50c24c4c978bbb078be4717d175ad92247ad Mon Sep 17 00:00:00 2001
From: dong <58670809@qq.com>
Date: Wed, 25 Oct 2023 10:49:04 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8C=BA=E6=AE=B5=E7=A0=81=E4=BD=8D=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../draw-app/dialogs/SectionCodePointList.vue | 150 ++++++++++
 .../properties/KilometerConvertConfig.vue     |   4 +-
 .../properties/SectionCodePointConfig.vue     | 261 ++++++++++++++++++
 src/drawApp/commonApp.ts                      |  27 ++
 src/layouts/DrawLayout.vue                    |  22 ++
 src/protos/request.ts                         |  48 ++++
 src/protos/stationLayoutGraphics.ts           | 115 +++++++-
 src/stores/draw-store.ts                      |   7 +
 8 files changed, 631 insertions(+), 3 deletions(-)
 create mode 100644 src/components/draw-app/dialogs/SectionCodePointList.vue
 create mode 100644 src/components/draw-app/properties/SectionCodePointConfig.vue

diff --git a/src/components/draw-app/dialogs/SectionCodePointList.vue b/src/components/draw-app/dialogs/SectionCodePointList.vue
new file mode 100644
index 0000000..369e589
--- /dev/null
+++ b/src/components/draw-app/dialogs/SectionCodePointList.vue
@@ -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>
diff --git a/src/components/draw-app/properties/KilometerConvertConfig.vue b/src/components/draw-app/properties/KilometerConvertConfig.vue
index 0f4d7cd..dce0f5f 100644
--- a/src/components/draw-app/properties/KilometerConvertConfig.vue
+++ b/src/components/draw-app/properties/KilometerConvertConfig.vue
@@ -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;
diff --git a/src/components/draw-app/properties/SectionCodePointConfig.vue b/src/components/draw-app/properties/SectionCodePointConfig.vue
new file mode 100644
index 0000000..2516c20
--- /dev/null
+++ b/src/components/draw-app/properties/SectionCodePointConfig.vue
@@ -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>
diff --git a/src/drawApp/commonApp.ts b/src/drawApp/commonApp.ts
index 36f7e76..8fdac52 100644
--- a/src/drawApp/commonApp.ts
+++ b/src/drawApp/commonApp.ts
@@ -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);
+}
diff --git a/src/layouts/DrawLayout.vue b/src/layouts/DrawLayout.vue
index 69c7db1..598cf3a 100644
--- a/src/layouts/DrawLayout.vue
+++ b/src/layouts/DrawLayout.vue
@@ -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>>();
diff --git a/src/protos/request.ts b/src/protos/request.ts
index fd21add..87c51db 100644
--- a/src/protos/request.ts
+++ b/src/protos/request.ts
@@ -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
+        }
+    }
 }
diff --git a/src/protos/stationLayoutGraphics.ts b/src/protos/stationLayoutGraphics.ts
index 5c081bf..455c69a 100644
--- a/src/protos/stationLayoutGraphics.ts
+++ b/src/protos/stationLayoutGraphics.ts
@@ -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);
+        }
+    }
 }
diff --git a/src/stores/draw-store.ts b/src/stores/draw-store.ts
index 57c9792..7c3b22d 100644
--- a/src/stores/draw-store.ts
+++ b/src/stores/draw-store.ts
@@ -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;
+    },
   },
 });