屏蔽门系统图
This commit is contained in:
parent
3c67d4b5b7
commit
9e0bc3ea0b
BIN
src/assets/ISCS/PSD/duanmenAlarm.png
Normal file
BIN
src/assets/ISCS/PSD/duanmenAlarm.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.7 KiB |
BIN
src/assets/ISCS/PSD/duanmenClose.png
Normal file
BIN
src/assets/ISCS/PSD/duanmenClose.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.4 KiB |
BIN
src/assets/ISCS/PSD/duanmenConnectBreak.png
Normal file
BIN
src/assets/ISCS/PSD/duanmenConnectBreak.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.6 KiB |
BIN
src/assets/ISCS/PSD/train.png
Normal file
BIN
src/assets/ISCS/PSD/train.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 4.6 KiB |
28
src/components/Iscs/ModeControl.vue
Normal file
28
src/components/Iscs/ModeControl.vue
Normal 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
382
src/components/Iscs/PSD.vue
Normal 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>
|
@ -130,7 +130,7 @@ const { data: buttonModel, onUpdate } = useFormData(
|
||||
const optionsButtonType = [
|
||||
{ label: '无Icon', value: iscsGraphicData.Button.ButtonType.noIcon },
|
||||
{ label: '方形', value: iscsGraphicData.Button.ButtonType.cctvRect },
|
||||
{ label: '监视器', value: iscsGraphicData.Button.ButtonType.cctvMonitor },
|
||||
{ label: '半圆', value: iscsGraphicData.Button.ButtonType.cctvSemicircle },
|
||||
{ label: '枪机', value: iscsGraphicData.Button.ButtonType.cctvMonitor },
|
||||
{ label: '球机', value: iscsGraphicData.Button.ButtonType.cctvSemicircle },
|
||||
];
|
||||
</script>
|
||||
|
@ -60,7 +60,7 @@ const DA_SHI_ZHI_NENG: I_DA_SHI_ZHI_NENG[] = [
|
||||
{ sunMenuName: '导向标识/广告', displayForm: DisplayForm.draw },
|
||||
{ sunMenuName: '人防门', displayForm: DisplayForm.draw },
|
||||
{ sunMenuName: 'BAS系统', displayForm: DisplayForm.draw },
|
||||
{ sunMenuName: '模式控制', displayForm: DisplayForm.draw },
|
||||
{ sunMenuName: '模式控制', displayForm: DisplayForm.component },
|
||||
{ sunMenuName: '时间表', displayForm: DisplayForm.draw },
|
||||
{ sunMenuName: '操作场所切换', displayForm: DisplayForm.draw },
|
||||
],
|
||||
@ -132,7 +132,9 @@ const DA_SHI_ZHI_NENG: I_DA_SHI_ZHI_NENG[] = [
|
||||
menuName: 'PSD',
|
||||
icon: 'svguse:../iscsMenuIcon.svg#icon-PSD',
|
||||
activeIcon: 'svguse:../iscsMenuIcon.svg#icon-PSD-active',
|
||||
sunMenu: [{ sunMenuName: '屏蔽门系统图', displayForm: DisplayForm.draw }],
|
||||
sunMenu: [
|
||||
{ sunMenuName: '屏蔽门系统图', displayForm: DisplayForm.component },
|
||||
],
|
||||
},
|
||||
{
|
||||
menuName: 'FG',
|
||||
|
@ -82,7 +82,7 @@ function buildAbsorbablePositions(escalator: Escalator): AbsorbablePosition[] {
|
||||
}
|
||||
|
||||
export class EscalatorInteraction extends GraphicInteractionPlugin<Escalator> {
|
||||
static Name = 'tcc_light_transform';
|
||||
static Name = 'escalator_transform';
|
||||
constructor(app: IDrawApp) {
|
||||
super(EscalatorInteraction.Name, app);
|
||||
}
|
||||
|
@ -89,7 +89,7 @@ function buildAbsorbablePositions(
|
||||
}
|
||||
|
||||
export class VerticalElevatorInteraction extends GraphicInteractionPlugin<VerticalElevator> {
|
||||
static Name = 'tcc_light_transform';
|
||||
static Name = 'vertical_elevator_transform';
|
||||
constructor(app: IDrawApp) {
|
||||
super(VerticalElevatorInteraction.Name, app);
|
||||
}
|
||||
|
@ -17,19 +17,19 @@
|
||||
"anchor": { "x": 0.5, "y": 0.5 }
|
||||
},
|
||||
"monitor-btn.png": {
|
||||
"frame": { "x": 148, "y": 0, "w": 74, "h": 66 },
|
||||
"frame": { "x": 352, "y": 0, "w": 85, "h": 66 },
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": { "x": 0, "y": 0, "w": 74, "h": 66 },
|
||||
"sourceSize": { "w": 74, "h": 66 },
|
||||
"spriteSourceSize": { "x": 0, "y": 0, "w": 85, "h": 66 },
|
||||
"sourceSize": { "w": 85, "h": 66 },
|
||||
"anchor": { "x": 0.5, "y": 0.5 }
|
||||
},
|
||||
"semicircle-btn.png": {
|
||||
"frame": { "x": 230, "y": 0, "w": 66, "h": 66 },
|
||||
"frame": { "x": 292, "y": 0, "w": 60, "h": 66 },
|
||||
"rotated": false,
|
||||
"trimmed": false,
|
||||
"spriteSourceSize": { "x": 0, "y": 0, "w": 66, "h": 66 },
|
||||
"sourceSize": { "w": 66, "h": 66 },
|
||||
"spriteSourceSize": { "x": 0, "y": 0, "w": 60, "h": 66 },
|
||||
"sourceSize": { "w": 60, "h": 66 },
|
||||
"anchor": { "x": 0.5, "y": 0.5 }
|
||||
}
|
||||
},
|
||||
|
Binary file not shown.
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 14 KiB |
@ -162,6 +162,14 @@
|
||||
v-if="drawStore.selectSubmenuAndStation.submenu == '监控布局图'"
|
||||
: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>
|
||||
</q-scroll-area>
|
||||
</div>
|
||||
@ -305,6 +313,8 @@ import { toStorageTransform } from 'src/drawApp/graphics/GraphicDataBase';
|
||||
import { Circle } from 'src/graphics/circle/Circle';
|
||||
import IscsBottomAlarm from 'src/components/Iscs/IscsBottomAlarm.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 { FasFailureControlHost } from 'src/graphics/FAS/fireFailureControlHost/FasFailureControlHost';
|
||||
import { FasAlarm } from 'src/graphics/FAS/fasAlarm/FasAlarm';
|
||||
@ -715,10 +725,12 @@ function selectedSubMenu(subName: string) {
|
||||
).displayForm;
|
||||
if (subMenuDisplayForm.value !== DisplayForm.component) {
|
||||
showDrawTool.value = true;
|
||||
rightDrawerOpen.value = true;
|
||||
forceReloadDate();
|
||||
handleUtilsOption();
|
||||
} else {
|
||||
showDrawTool.value = false;
|
||||
rightDrawerOpen.value = false;
|
||||
}
|
||||
onResize();
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user