屏蔽门系统图

This commit is contained in:
joylink_zhaoerwei 2024-10-28 16:53:12 +08:00
parent 3c67d4b5b7
commit 9e0bc3ea0b
13 changed files with 436 additions and 12 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

View File

@ -0,0 +1,28 @@
<template>
<div class="title">{{ props.stationName }}模式总览图</div>
</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue';
const props = defineProps<{
stationName: string;
}>();
const chooseStation = ref('');
onMounted(() => {
chooseStation.value = props.stationName;
});
</script>
<style lang="scss" scoped>
$first-top: 20vh;
$second-top: 37vh;
.title {
height: 50px;
margin-bottom: 10px;
line-height: 50px;
text-align: center;
font-size: 28px;
}
</style>

382
src/components/Iscs/PSD.vue Normal file
View File

@ -0,0 +1,382 @@
<template>
<div class="psd-title">{{ props.stationName }}屏蔽门系统图</div>
<div class="up-train">
<q-img :src="train" />
</div>
<div class="down-train">
<q-img :src="train" />
</div>
<div class="duanmen up-first-duanmen">
<q-img :src="allDuanmenImg.upFirst" class="img" />
<div>上行首端门</div>
</div>
<div class="duanmen up-end-duanmen">
<q-img :src="allDuanmenImg.upEnd" class="img" />
<div>上行尾端门</div>
</div>
<div class="duanmen down-first-duanmen">
<q-img :src="allDuanmenImg.downFirst" class="img" />
<div>下行首端门</div>
</div>
<div class="duanmen down-end-duanmen">
<q-img :src="allDuanmenImg.downEnd" class="img" />
<div>下行尾端门</div>
</div>
<div
v-for="(tableData, index) in allTableDatas"
:key="index"
:class="`tableItem-${index}`"
>
<q-markup-table separator="cell" ref="tableRef" class="table">
<thead class="table-head">
<tr class="table-head-tr">
<th v-for="header in tableData.columnDefs" :key="header.name">
{{ header.label }}
</th>
</tr>
</thead>
<tbody>
<tr v-for="row in tableData.rows" :key="row.name">
<td
class="table-body-tr"
align="center"
v-for="header in tableData.columnDefs"
:key="header.name"
>
{{ row[header.name] }}
</td>
</tr>
</tbody>
</q-markup-table>
</div>
</template>
<script setup lang="ts">
import { onMounted, reactive, ref } from 'vue';
import train from 'src/assets/ISCS/PSD/train.png';
import duanmenClose from 'src/assets/ISCS/PSD/duanmenClose.png';
import duanmenAlarm from 'src/assets/ISCS/PSD/duanmenAlarm.png';
import duanmenConnectBreak from 'src/assets/ISCS/PSD/duanmenConnectBreak.png';
const props = defineProps<{
stationName: string;
}>();
const chooseStation = ref('');
const allDuanmenImg = reactive({
upFirst: duanmenClose,
upEnd: duanmenClose,
downFirst: duanmenAlarm,
downEnd: duanmenConnectBreak,
});
const allTableDatas = reactive([
{
columnDefs: [
{ name: 'name', label: '上行首PSL', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '操作允许状态', state: '不允许' },
{ name: '开门命令触发', state: '无效' },
{ name: '关门命令触发', state: '无效' },
{ name: '互锁解除命令', state: '无效' },
],
},
{
columnDefs: [
{ name: 'name', label: '下行尾PSL', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '操作允许状态', state: '不允许' },
{ name: '开门命令触发', state: '无效' },
{ name: '关门命令触发', state: '无效' },
{ name: '互锁解除命令', state: '无效' },
],
},
{
columnDefs: [
{ name: 'name', label: '名称', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '驱动电源故障报警', state: '正常' },
{ name: '控制电源故障报警', state: '正常' },
{ name: '驱动电源输入故障报警', state: '正常' },
{ name: '控制电源输入故障报警', state: '正常' },
{ name: '驱动电源低电压故障报警', state: '正常' },
{ name: '控制电源电压故障报警', state: '正常' },
],
},
{
columnDefs: [
{ name: 'name', label: '名称', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '上行控制系统故障报警', state: '正常' },
{ name: '上行SIG使用', state: '正常' },
{ name: '上行SIG开门命令', state: '正常' },
],
},
{
columnDefs: [
{ name: 'name', label: '名称', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '下行控制系统故障报警', state: '正常' },
{ name: '下行SIG使用', state: '正常' },
{ name: '下行SIG开门命令', state: '正常' },
],
},
{
columnDefs: [
{ name: 'name', label: '名称', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '上行所有门关闭且锁紧', state: '正常' },
{ name: '上行滑动门和应急门开门故障', state: '正常' },
{ name: '上行滑动门和应急门关门故障', state: '正常' },
],
},
{
columnDefs: [
{ name: 'name', label: '名称', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '下行所有门关闭且锁紧', state: '正常' },
{ name: '下行滑动门和应急门开门故障', state: '正常' },
{ name: '下行滑动门和应急门关门故障', state: '正常' },
],
},
{
columnDefs: [
{ name: 'name', label: '名称', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '上行IBP盘使能', state: '正常' },
{ name: '上行IBP盘开门命令', state: '正常' },
{ name: '上行IBP盘关门命令', state: '正常' },
],
},
{
columnDefs: [
{ name: 'name', label: '名称', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '下行IBP盘使能', state: '正常' },
{ name: '下行IBP盘开门命令', state: '正常' },
{ name: '下行IBP盘关门命令', state: '正常' },
],
},
{
columnDefs: [
{ name: 'name', label: '上行尾PSL', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '操作允许状态', state: '不允许' },
{ name: '开门命令触发', state: '无效' },
{ name: '关门命令触发', state: '无效' },
{ name: '互锁解除命令', state: '无效' },
],
},
{
columnDefs: [
{ name: 'name', label: '下行首PSL', align: 'center' },
{
name: 'state',
label: '状态',
align: 'center',
},
],
rows: [
{ name: '操作允许状态', state: '不允许' },
{ name: '开门命令触发', state: '无效' },
{ name: '关门命令触发', state: '无效' },
{ name: '互锁解除命令', state: '无效' },
],
},
]);
onMounted(() => {
chooseStation.value = props.stationName;
});
</script>
<style lang="scss" scoped>
$first-top: 20vh;
$second-top: 37vh;
.psd-title {
height: 50px;
margin-bottom: 10px;
line-height: 50px;
text-align: center;
font-size: 28px;
}
.up-train {
position: absolute;
top: 10vh;
width: 55vw;
}
.down-train {
position: absolute;
top: 55vh;
width: 55vw;
}
.img {
width: 15px;
}
.duanmen {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: absolute;
width: 100px;
}
.up-first-duanmen {
left: 22vw;
top: 8vh;
transform: translateX(-100%);
}
.up-end-duanmen {
right: 22vw;
top: 8vh;
transform: translateX(100%);
}
.down-first-duanmen {
left: 22vw;
top: 58vh;
transform: translateX(-100%);
}
.down-end-duanmen {
right: 22vw;
top: 58vh;
transform: translateX(100%);
}
.table {
.table-head {
background-image: linear-gradient(to bottom, #c1c9ea, #8e97ba);
.table-head-tr {
height: 33px !important;
padding: 0;
}
}
.table-body-tr {
height: 33px !important;
padding: 0 5px;
}
}
.tableItem-0 {
position: absolute;
top: 15vh;
right: calc(50vw + 380px);
transform: translateX(-100%);
}
.tableItem-1 {
position: absolute;
top: $second-top;
right: calc(50vw + 380px);
transform: translateX(-100%);
}
.tableItem-2 {
position: absolute;
top: $first-top;
right: calc(50vw + 50px);
transform: translateX(-100%);
}
.tableItem-3 {
position: absolute;
top: $first-top;
left: 49vw;
transform: translateX(-100%);
}
.tableItem-4 {
position: absolute;
top: $second-top;
left: 49vw;
transform: translateX(-100%);
}
.tableItem-5 {
position: absolute;
top: $first-top;
right: 49vw;
transform: translateX(100%);
}
.tableItem-6 {
position: absolute;
top: $second-top;
right: 49vw;
transform: translateX(100%);
}
.tableItem-7 {
position: absolute;
top: $first-top;
left: calc(50vw + 110px);
transform: translateX(100%);
}
.tableItem-8 {
position: absolute;
top: $second-top;
left: calc(50vw + 110px);
transform: translateX(100%);
}
.tableItem-9 {
position: absolute;
top: 15vh;
left: calc(50vw + 380px);
transform: translateX(100%);
}
.tableItem-10 {
position: absolute;
top: $second-top;
left: calc(50vw + 380px);
transform: translateX(100%);
}
</style>

View File

@ -130,7 +130,7 @@ const { data: buttonModel, onUpdate } = useFormData(
const optionsButtonType = [ const optionsButtonType = [
{ label: '无Icon', value: iscsGraphicData.Button.ButtonType.noIcon }, { label: '无Icon', value: iscsGraphicData.Button.ButtonType.noIcon },
{ label: '方形', value: iscsGraphicData.Button.ButtonType.cctvRect }, { label: '方形', value: iscsGraphicData.Button.ButtonType.cctvRect },
{ label: '监视器', value: iscsGraphicData.Button.ButtonType.cctvMonitor }, { label: '枪机', value: iscsGraphicData.Button.ButtonType.cctvMonitor },
{ label: '半圆', value: iscsGraphicData.Button.ButtonType.cctvSemicircle }, { label: '球机', value: iscsGraphicData.Button.ButtonType.cctvSemicircle },
]; ];
</script> </script>

View File

@ -60,7 +60,7 @@ const DA_SHI_ZHI_NENG: I_DA_SHI_ZHI_NENG[] = [
{ sunMenuName: '导向标识/广告', displayForm: DisplayForm.draw }, { sunMenuName: '导向标识/广告', displayForm: DisplayForm.draw },
{ sunMenuName: '人防门', displayForm: DisplayForm.draw }, { sunMenuName: '人防门', displayForm: DisplayForm.draw },
{ sunMenuName: 'BAS系统', displayForm: DisplayForm.draw }, { sunMenuName: 'BAS系统', displayForm: DisplayForm.draw },
{ sunMenuName: '模式控制', displayForm: DisplayForm.draw }, { sunMenuName: '模式控制', displayForm: DisplayForm.component },
{ sunMenuName: '时间表', displayForm: DisplayForm.draw }, { sunMenuName: '时间表', displayForm: DisplayForm.draw },
{ sunMenuName: '操作场所切换', displayForm: DisplayForm.draw }, { sunMenuName: '操作场所切换', displayForm: DisplayForm.draw },
], ],
@ -132,7 +132,9 @@ const DA_SHI_ZHI_NENG: I_DA_SHI_ZHI_NENG[] = [
menuName: 'PSD', menuName: 'PSD',
icon: 'svguse:../iscsMenuIcon.svg#icon-PSD', icon: 'svguse:../iscsMenuIcon.svg#icon-PSD',
activeIcon: 'svguse:../iscsMenuIcon.svg#icon-PSD-active', activeIcon: 'svguse:../iscsMenuIcon.svg#icon-PSD-active',
sunMenu: [{ sunMenuName: '屏蔽门系统图', displayForm: DisplayForm.draw }], sunMenu: [
{ sunMenuName: '屏蔽门系统图', displayForm: DisplayForm.component },
],
}, },
{ {
menuName: 'FG', menuName: 'FG',

View File

@ -82,7 +82,7 @@ function buildAbsorbablePositions(escalator: Escalator): AbsorbablePosition[] {
} }
export class EscalatorInteraction extends GraphicInteractionPlugin<Escalator> { export class EscalatorInteraction extends GraphicInteractionPlugin<Escalator> {
static Name = 'tcc_light_transform'; static Name = 'escalator_transform';
constructor(app: IDrawApp) { constructor(app: IDrawApp) {
super(EscalatorInteraction.Name, app); super(EscalatorInteraction.Name, app);
} }

View File

@ -89,7 +89,7 @@ function buildAbsorbablePositions(
} }
export class VerticalElevatorInteraction extends GraphicInteractionPlugin<VerticalElevator> { export class VerticalElevatorInteraction extends GraphicInteractionPlugin<VerticalElevator> {
static Name = 'tcc_light_transform'; static Name = 'vertical_elevator_transform';
constructor(app: IDrawApp) { constructor(app: IDrawApp) {
super(VerticalElevatorInteraction.Name, app); super(VerticalElevatorInteraction.Name, app);
} }

View File

@ -17,19 +17,19 @@
"anchor": { "x": 0.5, "y": 0.5 } "anchor": { "x": 0.5, "y": 0.5 }
}, },
"monitor-btn.png": { "monitor-btn.png": {
"frame": { "x": 148, "y": 0, "w": 74, "h": 66 }, "frame": { "x": 352, "y": 0, "w": 85, "h": 66 },
"rotated": false, "rotated": false,
"trimmed": false, "trimmed": false,
"spriteSourceSize": { "x": 0, "y": 0, "w": 74, "h": 66 }, "spriteSourceSize": { "x": 0, "y": 0, "w": 85, "h": 66 },
"sourceSize": { "w": 74, "h": 66 }, "sourceSize": { "w": 85, "h": 66 },
"anchor": { "x": 0.5, "y": 0.5 } "anchor": { "x": 0.5, "y": 0.5 }
}, },
"semicircle-btn.png": { "semicircle-btn.png": {
"frame": { "x": 230, "y": 0, "w": 66, "h": 66 }, "frame": { "x": 292, "y": 0, "w": 60, "h": 66 },
"rotated": false, "rotated": false,
"trimmed": false, "trimmed": false,
"spriteSourceSize": { "x": 0, "y": 0, "w": 66, "h": 66 }, "spriteSourceSize": { "x": 0, "y": 0, "w": 60, "h": 66 },
"sourceSize": { "w": 66, "h": 66 }, "sourceSize": { "w": 60, "h": 66 },
"anchor": { "x": 0.5, "y": 0.5 } "anchor": { "x": 0.5, "y": 0.5 }
} }
}, },

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.3 KiB

After

Width:  |  Height:  |  Size: 14 KiB

View File

@ -162,6 +162,14 @@
v-if="drawStore.selectSubmenuAndStation.submenu == '监控布局图'" v-if="drawStore.selectSubmenuAndStation.submenu == '监控布局图'"
:stationName="drawStore.selectSubmenuAndStation.station" :stationName="drawStore.selectSubmenuAndStation.station"
/> />
<pSD
v-if="drawStore.selectSubmenuAndStation.submenu == '屏蔽门系统图'"
:stationName="drawStore.selectSubmenuAndStation.station"
/>
<mode-control
v-if="drawStore.selectSubmenuAndStation.submenu == '模式控制'"
:stationName="drawStore.selectSubmenuAndStation.station"
/>
</div> </div>
</q-scroll-area> </q-scroll-area>
</div> </div>
@ -305,6 +313,8 @@ import { toStorageTransform } from 'src/drawApp/graphics/GraphicDataBase';
import { Circle } from 'src/graphics/circle/Circle'; import { Circle } from 'src/graphics/circle/Circle';
import IscsBottomAlarm from 'src/components/Iscs/IscsBottomAlarm.vue'; import IscsBottomAlarm from 'src/components/Iscs/IscsBottomAlarm.vue';
import CCTVMonitoring from 'src/components/Iscs/CCTVMonitoring.vue'; import CCTVMonitoring from 'src/components/Iscs/CCTVMonitoring.vue';
import PSD from 'src/components/Iscs/PSD.vue';
import ModeControl from 'src/components/Iscs/ModeControl.vue';
import FASPlaneGraph from 'src/components/Iscs/FASPlaneGraph.vue'; import FASPlaneGraph from 'src/components/Iscs/FASPlaneGraph.vue';
import { FasFailureControlHost } from 'src/graphics/FAS/fireFailureControlHost/FasFailureControlHost'; import { FasFailureControlHost } from 'src/graphics/FAS/fireFailureControlHost/FasFailureControlHost';
import { FasAlarm } from 'src/graphics/FAS/fasAlarm/FasAlarm'; import { FasAlarm } from 'src/graphics/FAS/fasAlarm/FasAlarm';
@ -715,10 +725,12 @@ function selectedSubMenu(subName: string) {
).displayForm; ).displayForm;
if (subMenuDisplayForm.value !== DisplayForm.component) { if (subMenuDisplayForm.value !== DisplayForm.component) {
showDrawTool.value = true; showDrawTool.value = true;
rightDrawerOpen.value = true;
forceReloadDate(); forceReloadDate();
handleUtilsOption(); handleUtilsOption();
} else { } else {
showDrawTool.value = false; showDrawTool.value = false;
rightDrawerOpen.value = false;
} }
onResize(); onResize();
} }