This commit is contained in:
lll 2023-12-04 17:32:54 +08:00
commit 57dc155f20
73 changed files with 53502 additions and 14 deletions

View File

@ -0,0 +1,478 @@
export let pdsJs = [
{
name: "总降电力室",
list: [
"6.3KV#1破碎出线",
"6.3KV#1窑头出线",
"6.3KV#1原料#1出线",
"6.3KV#1原料#2出线",
"6.3KV#2窑头出线",
"6.3KV#2原料#1出线",
"6.3KV#2原料#2出线",
"6.3KV#1发电机出线(安热线)",
"6.3KV#主变1进线",
"6.3KV#主变2进线",
"6.3KV#1水泥磨出线",
"6.3KV塑料厂出线",
"",
"",
"",
"",
"",
"",
],
},
{
name: "矿山电力室",
list: [
"矿山进线柜",
"矿山变压器",
"1#石灰石破碎机",
"2#石灰石破碎机",
"矿山皮带机",
],
},
{
name: "原材料电力室",
list: [
"仓库电源",
"水井总电源",
"1#圆锥取料机",
"2#圆锥取料机",
"28F1板喂机",
"28F2板喂机",
"2802皮带机",
"2803皮带机",
"2801皮带机",
"2302堆料机",
"2403皮带机",
"2402皮带机",
"2401皮带机",
"3504可逆皮带机",
"3502皮带机",
"3501皮带机",
"2306皮带机",
"2305皮带机",
"2304取料机",
"2303取料机",
],
},
{
name: "一线生料磨电力室",
list: [
"1#进线",
"1#变压器",
"2#变压器",
"生料磨主电机",
"1#生料磨高温风机",
"原材料变压器",
"窑尾变压器",
"窑中整流变压器",
"1#循环风机",
"1#后排风机",
"2#进线",
"西院变压器",
"取暖泵1#2#3#",
"取暖泵4#",
"取暖泵5#",
"食堂公寓",
"1#空压机",
"2#空压机",
"3#空压机",
"选粉机",
"入库提升机",
],
},
{
name: "二线生料磨电力室",
list: [
"1#进线",
"1#变压器",
"2#变压器",
"生料磨主电机",
"2#生料磨高温风机",
"窑尾变压器",
"窑中整流变压器",
"2#后排风机",
"2#循环风机",
"2#进线",
"6#水井",
"选粉机",
"4#空压机",
"入库提升机",
],
},
{
name: "窑尾电力室",
list: ["南入窑提升机", "北入窑提升机", "入窑提升机1", "入窑提升机2"],
},
{
name: "一线窑头电力室1",
list: [
"辊式破碎机",
"FR风机",
"F7风机",
"F8风机",
"F4风机",
"F5风机",
"F9风机",
"5703空浮风机",
"煤磨控制柜电源",
"7517风机",
"7516风机",
"1#液压电源",
"2#液压电源",
"F3风机",
"F2风机",
"F1风机",
"FB风机",
"FA风机",
"7518风机",
"F6风机",
"斜斗",
],
},
{
name: "一线窑头电力室2",
list: [
"1#窑头进线",
"1#煤磨主电机",
"1#煤磨通风机",
"1#变压器",
"2#变压器",
"1#过剩风机",
"熟料外放1",
"7602堆料机、7603取料机",
"老中控楼、化验室",
"循环水泵房",
"1#煤磨辅机设备",
"熟料外放2",
],
},
{
name: "二线窑头电力室1",
list: [
"F1风机",
"F2风机",
"F3风机",
"F4风机",
"F5风机",
"F6风机",
"F7风机",
"F8风机",
"FA风机",
"原煤板喂机",
"6635风机",
"FB风机",
"FR风机",
"5703空浮风机",
"7516风机",
"液压站一段油泵",
"液压站二段油泵",
"辊破电源",
"熟料链斗输送机",
"5703备用风机",
"7517风机",
"老中控楼电源",
"空调",
],
},
{
name: "二线窑头电力室2",
list: [
"2#窑头进线",
"2#煤磨主电机",
"2#煤磨通风机",
"1#变压器",
"2#变压器",
"2#过剩风机",
"2#煤磨辅机",
"2#熟料外放",
],
},
{
name: "一线原煤电力室",
list: [
"7102皮带机",
"7103皮带机",
"7601皮带机",
"原煤输送皮带",
"7605皮带机",
"7610皮带机",
"7604皮带机",
],
},
{
name: "水泥磨电力室",
list: [
"总进线柜",
"变压器",
"水泥磨主电机",
"水泥磨收尘风机",
"水泥磨辊压机",
"水泥库底1#斜槽风机",
"2#3#4#库侧卸料罗茨风机",
"1#库侧罗茨风机",
"水泥库底2#斜槽风机",
"2#库侧罗茨风机",
"3#库侧罗茨风机",
"1#2#3#4#库侧水泥散装机",
"1#包装斗式提升机",
"4#库侧罗茨风机",
"1#库侧卸料罗茨风机",
"4#空压机",
"万吨仓电源",
"1#包装收尘风机电院",
"1#回灰斜槽风机",
"1#包装除尘器",
"1#包装机电源",
"2#包装除尘器",
"2#包装收尘变频电源",
"2#包装提升机",
"2#包装机",
"粉煤灰空压机",
"料饼提升机",
"选粉机",
"循环风机",
],
},
{
name: "万吨仓电力室",
list: ["污水处理"],
},
{
name: "余热发电电力室",
list: [
"1#循环水泵",
"2#循环水泵",
"3#循环水泵",
"4#循环水泵",
"润滑高压油泵",
],
},
// 有问题,暂时没有写三号线熟料配电室
{
name: "三号线熟料配电室",
list: [
"电源进线",
"备用抽屉柜",
"与窑头电力室联络电源",
"照明电源",
"侧式悬臂堆料机电源",
"侧式悬臂堆料机备用柜",
"1#桥式取料机电源",
"2#桥式取料机电源",
"251BC03MT01带式输送机软起柜",
"741BC01MT01带式输送机软起柜",
"521FN06VF01离心通风机变频柜",
"521FN05VF01离心通风机变频柜",
"521FN04VF01离心通风机变频柜",
"521FN03VF01离心通风机变频柜",
"521FN02VF01离心通风机变频柜",
"521BC06SS01带式输送机软起柜",
"进线电源",
],
},
// 有问题,暂时没有写三号线窑头配电室
{
name: "三号线窑头配电室",
list: [
"电源进线",
"应急电源",
"备用抽屉柜",
"与窑尾电力室联络电源",
"与2#变压器联络电源",
"备用抽屉柜",
"3#空气悬浮离心风机",
"1#空气悬浮离心风机",
"2#空气悬浮离心风机",
"1#液压油泵软起柜",
"2#液压油泵软起柜",
"3#液压油泵软起柜",
"4#液压油泵软起柜",
"电源进线",
"与1#变压器联络电源",
"发电备用抽屉柜",
"照明电源",
"备用抽屉柜",
"备用抽屉柜",
"与3#变压器联络电源",
"熟料输送机软起柜",
"FC冷却风机",
"FR冷却风机",
"F1冷却风机",
"F3冷却风机变频柜",
"F5冷却风机变频柜",
"电源进线",
"2#空压机电源",
"1#空压机电源",
"与2#变压器联络电源",
"3#空压机电源",
"4#空压机电源",
"与熟料库电气室联络电源",
"3#可逆螺旋输送机",
"无741JX编号",
"备用抽屉柜",
"1#空气悬浮离心鼓风机",
"3#空气悬浮离心鼓风机",
"2#空气悬浮离心鼓风机",
"备用抽屉柜",
"5#液压油泵软起柜",
"6#液压油泵软起柜",
"FA冷却风机",
"FB冷却风机",
"F2冷却风机",
"F4冷却风机",
"FRB1冷却风机变频柜",
"F8冷却风机",
"离心通风机变频柜",
"F9冷却风机变频柜",
"F7冷却风机变频柜",
"F6冷却风机变频柜",
"备用高压柜",
"熟料库变压器",
"窑头变压器3",
"窑头变压器2",
"窑头变压器1",
"窑头排风机",
"煤磨风机",
"煤磨主电机",
"电源进线",
],
},
// 三号线窑尾配电室
{
name: "三号线窑尾配电室",
list: [
"电源进线",
"备用抽屉柜",
"照明电源",
"1#磁悬浮鼓风机控制柜",
"废气处理电源",
"3#磁悬浮鼓风机控制柜",
"4#磁悬浮鼓风机控制柜",
"与原料磨电气室联络电源",
"与窑头电气室联络",
"罗茨鼓风机变频柜",
"窑辅助传动及制动器软起柜",
"斗式提升机软起柜",
],
},
// 三号线生料配电室
{
name: "三号线生料配电室",
list: [
"电源进线",
"辊压机固定辊主电机",
"辊压机活动辊主电机",
"循环风机变频柜",
"原料磨电气室变压器",
"辅料处理电气室变压器",
"原料配料站电气室变压器",
"电机备用",
"反击式破碎机主电机",
"电源进线",
"窑尾变压器",
"窑中主传动柜",
"窑尾排风机变频柜",
"窑尾高温风机变频柜",
"垃圾处理变压器1",
"垃圾处理变压器2",
"变压器备用",
"电源进线",
"照明电源",
"与原料配料电气室联络电源",
"与窑尾电气室联络电源",
"备用抽屉柜",
"1#链板式提升机软启动柜1",
"1#链板式提升机软启动柜2",
"361BE02SS012#链板式提升机软启动柜1",
"361BE02SS022#链板式提升机软启动柜2",
"391BE01SS01胶带斗式提升机软启动",
"361SR02VF01选粉机变频器",
"341BC01VF01带式输送机变频柜",
"391FN01VF01离心通风机变频柜",
],
},
// 辅料处理配电室
{
name: "辅料处理配电室",
list: [
"电源进线",
"251CA01AP01辅料智能抓斗电源",
"721CA01AP01原煤智能抓斗电源",
"与原料配料电气室联络电源",
"照明电源",
"331ST01LP01侧式悬臂堆料机电源",
"331ST01LP01SP侧式悬臂堆料机备用柜",
"备用抽屉柜",
"251BC01MT01带式输送机软起柜",
"251FN02MT01离心风机变频柜",
"进线电源",
"备用抽屉柜",
],
},
{
name: "原料配料配电室",
list: [
"331RE01LP011#侧式刮板取料机电源",
"331RE02LP012#侧式刮板取料机电源",
"331RE02LP01SP2#侧式刮板取料机备用",
"321SE01LP01圆形堆场堆取料机电源",
"1#定量给料机电源",
"1#定量给料机备用电源",
"2#定量给料机电源",
"2#定量给料机备用电源",
"4#定量给料机电源",
"4#定量给料机备用电源",
"与辅材处理电气室联络电源",
"与原料磨电气室联络电源",
"照明电源",
"电源进线",
"2A1BC05MT01带式输送机软起柜",
"331BC04MT01带式输送机软起柜",
"331BC03MT01带式输送机软起柜",
"331BC02MT01带式输送机软起柜",
"321BC02MT01带式输送机软起柜",
"321BC01MT01带式输送机软起柜",
"综合材料库电源",
"循环水电源",
"备用抽屉柜",
"备用抽屉柜",
"721BC02MT01带式输送机电源",
],
},
{
name: "石灰石破碎配电室",
list: [
"电源进线",
"照明电源",
"备用抽屉柜",
"1#重型板式喂料机变频柜",
"2#重型板式喂料机变频柜",
"211FN01VF01离心通风机变频柜",
"211FN02VF01离心通风机变频柜",
"211BC01SS01带式输送机软起柜",
"211BC02SS01带式输送机软起柜",
"电源进线柜",
"3#破碎机1#主电机",
"3#破碎机2#主电机",
"2#破碎机1#主电机",
"2#破碎机2#主电机",
"矿山电力室变压器",
"电机备用",
],
},
{
name: "石灰石输送控制室1、2",
list: [
"2A1BC02MT01带式输送机软起柜",
"2A1BC01MT01带式输送机软起柜",
"电源进线",
"2A1BC06MT01带式输送机软起柜",
"2A1BC04MT01带式输送机软起柜",
"2A1BC03MT01带式输送机软起柜",
"电源进线",
],
},
];

View File

@ -0,0 +1,479 @@
export let pdsJs = [
{
name: "总降电力室",
list: [
"6.3KV#1破碎出线",
"6.3KV#1窑头出线",
"6.3KV#1原料#1出线",
"6.3KV#1原料#2出线",
"6.3KV#2窑头出线",
"6.3KV#2原料#1出线",
"6.3KV#2原料#2出线",
"6.3KV#1发电机出线(安热线)",
"6.3KV#主变1进线",
"6.3KV#主变2进线",
"6.3KV#1水泥磨出线",
"6.3KV塑料厂出线",
"6.3KV骨料出线",
"6.3KV#3石灰石出线",
"6.3KV#3原料出线",
"6.3KV#3窑尾出线",
"6.3KV#3窑头出线",
"6.3KV#2水泥磨出线",
"6.3KV#2发电机出线"
],
},
{
name: "矿山电力室",
list: [
"矿山进线柜",
"矿山变压器",
"1#石灰石破碎机",
"2#石灰石破碎机",
"矿山皮带机",
],
},
{
name: "原材料电力室",
list: [
"仓库电源",
"水井总电源",
"1#圆锥取料机",
"2#圆锥取料机",
"28F1板喂机",
"28F2板喂机",
"2802皮带机",
"2803皮带机",
"2801皮带机",
"2302堆料机",
"2403皮带机",
"2402皮带机",
"2401皮带机",
"3504可逆皮带机",
"3502皮带机",
"3501皮带机",
"2306皮带机",
"2305皮带机",
"2304取料机",
"2303取料机",
],
},
{
name: "一线生料磨电力室",
list: [
"1#进线",
"1#变压器",
"2#变压器",
"生料磨主电机",
"1#生料磨高温风机",
"原材料变压器",
"窑尾变压器",
"窑中整流变压器",
"1#循环风机",
"1#后排风机",
"2#进线",
"西院变压器",
"取暖泵1#2#3#",
"取暖泵4#",
"取暖泵5#",
"食堂公寓",
"1#空压机",
"2#空压机",
"3#空压机",
"选粉机",
"入库提升机",
],
},
{
name: "二线生料磨电力室",
list: [
"1#进线",
"1#变压器",
"2#变压器",
"生料磨主电机",
"2#生料磨高温风机",
"窑尾变压器",
"窑中整流变压器",
"2#后排风机",
"2#循环风机",
"2#进线",
"6#水井",
"选粉机",
"4#空压机",
"入库提升机",
],
},
{
name: "窑尾电力室",
list: ["南入窑提升机", "北入窑提升机", "入窑提升机1", "入窑提升机2"],
},
{
name: "一线窑头电力室1",
list: [
"辊式破碎机",
"FR风机",
"F7风机",
"F8风机",
"F4风机",
"F5风机",
"F9风机",
"5703空浮风机",
"煤磨控制柜电源",
"7517风机",
"7516风机",
"1#液压电源",
"2#液压电源",
"F3风机",
"F2风机",
"F1风机",
"FB风机",
"FA风机",
"7518风机",
"F6风机",
"斜斗",
],
},
{
name: "一线窑头电力室2",
list: [
"1#窑头进线",
"1#煤磨主电机",
"1#煤磨通风机",
"1#变压器",
"2#变压器",
"1#过剩风机",
"熟料外放1",
"7602堆料机、7603取料机",
"老中控楼、化验室",
"循环水泵房",
"1#煤磨辅机设备",
"熟料外放2",
],
},
{
name: "二线窑头电力室1",
list: [
"F1风机",
"F2风机",
"F3风机",
"F4风机",
"F5风机",
"F6风机",
"F7风机",
"F8风机",
"FA风机",
"原煤板喂机",
"6635风机",
"FB风机",
"FR风机",
"5703空浮风机",
"7516风机",
"液压站一段油泵",
"液压站二段油泵",
"辊破电源",
"熟料链斗输送机",
"5703备用风机",
"7517风机",
"老中控楼电源",
"空调",
],
},
{
name: "二线窑头电力室2",
list: [
"2#窑头进线",
"2#煤磨主电机",
"2#煤磨通风机",
"1#变压器",
"2#变压器",
"2#过剩风机",
"2#煤磨辅机",
"2#熟料外放",
],
},
{
name: "一线原煤电力室",
list: [
"7102皮带机",
"7103皮带机",
"7601皮带机",
"原煤输送皮带",
"7605皮带机",
"7610皮带机",
"7604皮带机",
],
},
{
name: "水泥磨电力室",
list: [
"总进线柜",
"变压器",
"水泥磨主电机",
"水泥磨收尘风机",
"水泥磨辊压机",
"水泥库底1#斜槽风机",
"2#3#4#库侧卸料罗茨风机",
"1#库侧罗茨风机",
"水泥库底2#斜槽风机",
"2#库侧罗茨风机",
"3#库侧罗茨风机",
"1#2#3#4#库侧水泥散装机",
"1#包装斗式提升机",
"4#库侧罗茨风机",
"1#库侧卸料罗茨风机",
"4#空压机",
"万吨仓电源",
"1#包装收尘风机电院",
"1#回灰斜槽风机",
"1#包装除尘器",
"1#包装机电源",
"2#包装除尘器",
"2#包装收尘变频电源",
"2#包装提升机",
"2#包装机",
"粉煤灰空压机",
"料饼提升机",
"选粉机",
"循环风机",
],
},
{
name: "万吨仓电力室",
list: ["污水处理"],
},
{
name: "余热发电电力室",
list: [
"1#循环水泵",
"2#循环水泵",
"3#循环水泵",
"4#循环水泵",
"润滑高压油泵",
],
},
// 有问题,暂时没有写三号线熟料配电室
{
name: "三号线熟料配电室",
list: [
"电源进线",
"备用抽屉柜",
"与窑头电力室联络电源",
"照明电源",
"侧式悬臂堆料机电源",
"侧式悬臂堆料机备用柜",
"1#桥式取料机电源",
"2#桥式取料机电源",
"251BC03MT01带式输送机软起柜",
"741BC01MT01带式输送机软起柜",
"521FN06VF01离心通风机变频柜",
"521FN05VF01离心通风机变频柜",
"521FN04VF01离心通风机变频柜",
"521FN03VF01离心通风机变频柜",
"521FN02VF01离心通风机变频柜",
"521BC06SS01带式输送机软起柜",
"进线电源",
],
},
// 有问题,暂时没有写三号线窑头配电室
{
name: "三号线窑头配电室",
list: [
"电源进线",
"应急电源",
"备用抽屉柜",
"与窑尾电力室联络电源",
"与2#变压器联络电源",
"备用抽屉柜",
"3#空气悬浮离心风机",
"1#空气悬浮离心风机",
"2#空气悬浮离心风机",
"1#液压油泵软起柜",
"2#液压油泵软起柜",
"3#液压油泵软起柜",
"4#液压油泵软起柜",
"电源进线",
"与1#变压器联络电源",
"发电备用抽屉柜",
"照明电源",
"备用抽屉柜",
"备用抽屉柜",
"与3#变压器联络电源",
"熟料输送机软起柜",
"FC冷却风机",
"FR冷却风机",
"F1冷却风机",
"F3冷却风机变频柜",
"F5冷却风机变频柜",
"电源进线",
"2#空压机电源",
"1#空压机电源",
"与2#变压器联络电源",
"3#空压机电源",
"4#空压机电源",
"与熟料库电气室联络电源",
"3#可逆螺旋输送机",
"无741JX编号",
"备用抽屉柜",
"1#空气悬浮离心鼓风机",
"3#空气悬浮离心鼓风机",
"2#空气悬浮离心鼓风机",
"备用抽屉柜",
"5#液压油泵软起柜",
"6#液压油泵软起柜",
"FA冷却风机",
"FB冷却风机",
"F2冷却风机",
"F4冷却风机",
"FRB1冷却风机变频柜",
"F8冷却风机",
"离心通风机变频柜",
"F9冷却风机变频柜",
"F7冷却风机变频柜",
"F6冷却风机变频柜",
"备用高压柜",
"熟料库变压器",
"窑头变压器3",
"窑头变压器2",
"窑头变压器1",
"窑头排风机",
"煤磨风机",
"煤磨主电机",
"电源进线",
],
},
// 三号线窑尾配电室
{
name: "三号线窑尾配电室",
list: [
"电源进线",
"备用抽屉柜",
"照明电源",
"1#磁悬浮鼓风机控制柜",
"废气处理电源",
"3#磁悬浮鼓风机控制柜",
"4#磁悬浮鼓风机控制柜",
"与原料磨电气室联络电源",
"与窑头电气室联络",
"罗茨鼓风机变频柜",
"窑辅助传动及制动器软起柜",
"斗式提升机软起柜",
],
},
// 三号线生料配电室
{
name: "三号线生料配电室",
list: [
"电源进线",
"辊压机固定辊主电机",
"辊压机活动辊主电机",
"循环风机变频柜",
"原料磨电气室变压器",
"辅料处理电气室变压器",
"原料配料站电气室变压器",
"电机备用",
"反击式破碎机主电机",
"电源进线",
"窑尾变压器",
"窑中主传动柜",
"窑尾排风机变频柜",
"窑尾高温风机变频柜",
"垃圾处理变压器1",
"垃圾处理变压器2",
"变压器备用",
"电源进线",
"照明电源",
"与原料配料电气室联络电源",
"与窑尾电气室联络电源",
"备用抽屉柜",
"1#链板式提升机软启动柜1",
"1#链板式提升机软启动柜2",
"361BE02SS012#链板式提升机软启动柜1",
"361BE02SS022#链板式提升机软启动柜2",
"391BE01SS01胶带斗式提升机软启动",
"361SR02VF01选粉机变频器",
"341BC01VF01带式输送机变频柜",
"391FN01VF01离心通风机变频柜",
],
},
// 辅料处理配电室
{
name: "辅料处理配电室",
list: [
"电源进线",
"251CA01AP01辅料智能抓斗电源",
"721CA01AP01原煤智能抓斗电源",
"与原料配料电气室联络电源",
"照明电源",
"331ST01LP01侧式悬臂堆料机电源",
"331ST01LP01SP侧式悬臂堆料机备用柜",
"备用抽屉柜",
"251BC01MT01带式输送机软起柜",
"251FN02MT01离心风机变频柜",
"进线电源",
"备用抽屉柜",
],
},
{
name: "原料配料配电室",
list: [
"331RE01LP011#侧式刮板取料机电源",
"331RE02LP012#侧式刮板取料机电源",
"331RE02LP01SP2#侧式刮板取料机备用",
"321SE01LP01圆形堆场堆取料机电源",
"1#定量给料机电源",
"1#定量给料机备用电源",
"2#定量给料机电源",
"2#定量给料机备用电源",
"4#定量给料机电源",
"4#定量给料机备用电源",
"与辅材处理电气室联络电源",
"与原料磨电气室联络电源",
"照明电源",
"电源进线",
"2A1BC05MT01带式输送机软起柜",
"331BC04MT01带式输送机软起柜",
"331BC03MT01带式输送机软起柜",
"331BC02MT01带式输送机软起柜",
"321BC02MT01带式输送机软起柜",
"321BC01MT01带式输送机软起柜",
"综合材料库电源",
"循环水电源",
"备用抽屉柜",
"备用抽屉柜",
"721BC02MT01带式输送机电源",
],
},
{
name: "石灰石破碎配电室",
list: [
"电源进线",
"照明电源",
"备用抽屉柜",
"1#重型板式喂料机变频柜",
"2#重型板式喂料机变频柜",
"211FN01VF01离心通风机变频柜",
"211FN02VF01离心通风机变频柜",
"211BC01SS01带式输送机软起柜",
"211BC02SS01带式输送机软起柜",
"电源进线柜",
"3#破碎机1#主电机",
"3#破碎机2#主电机",
"2#破碎机1#主电机",
"2#破碎机2#主电机",
"矿山电力室变压器",
"电机备用",
],
},
{
name: "石灰石输送控制室1、2",
list: [
"2A1BC02MT01带式输送机软起柜",
"2A1BC01MT01带式输送机软起柜",
"电源进线",
"2A1BC06MT01带式输送机软起柜",
"2A1BC04MT01带式输送机软起柜",
"2A1BC03MT01带式输送机软起柜",
"电源进线",
],
},
];

View File

@ -0,0 +1,479 @@
export let pdsJs = [
{
name: "总降电力室",
list: [
"6.3KV#1破碎出线",
"6.3KV#1窑头出线",
"6.3KV#1原料#1出线",
"6.3KV#1原料#2出线",
"6.3KV#2窑头出线",
"6.3KV#2原料#1出线",
"6.3KV#2原料#2出线",
"6.3KV#1发电机出线(安热线)",
"6.3KV#主变1进线",
"6.3KV#主变2进线",
"6.3KV#1水泥磨出线",
"6.3KV塑料厂出线",
"6.3KV骨料出线",
"6.3KV#3石灰石出线",
"6.3KV#3原料出线",
"6.3KV#3窑尾出线",
"6.3KV#3窑头出线",
"6.3KV#2水泥磨出线",
"6.3KV#2发电机出线"
],
},
{
name: "矿山电力室",
list: [
"矿山进线柜",
"矿山变压器",
"1#石灰石破碎机",
"2#石灰石破碎机",
"矿山皮带机",
],
},
{
name: "原材料电力室",
list: [
"仓库电源",
"水井总电源",
"1#圆锥取料机",
"2#圆锥取料机",
"28F1板喂机",
"28F2板喂机",
"2802皮带机",
"2803皮带机",
"2801皮带机",
"2302堆料机",
"2403皮带机",
"2402皮带机",
"2401皮带机",
"3504可逆皮带机",
"3502皮带机",
"3501皮带机",
"2306皮带机",
"2305皮带机",
"2304取料机",
"2303取料机",
],
},
{
name: "一线生料磨电力室",
list: [
"1#进线",
"1#变压器",
"2#变压器",
"生料磨主电机",
"1#生料磨高温风机",
"原材料变压器",
"窑尾变压器",
"窑中整流变压器",
"1#循环风机",
"1#后排风机",
"2#进线",
"西院变压器",
"取暖泵1#2#3#",
"取暖泵4#",
"取暖泵5#",
"食堂公寓",
"1#空压机",
"2#空压机",
"3#空压机",
"选粉机",
"入库提升机",
],
},
{
name: "二线生料磨电力室",
list: [
"1#进线",
"1#变压器",
"2#变压器",
"生料磨主电机",
"2#生料磨高温风机",
"窑尾变压器",
"窑中整流变压器",
"2#后排风机",
"2#循环风机",
"2#进线",
"6#水井",
"选粉机",
"4#空压机",
"入库提升机",
],
},
{
name: "窑尾电力室",
list: ["南入窑提升机", "北入窑提升机", "入窑提升机1", "入窑提升机2"],
},
{
name: "一线窑头电力室1",
list: [
"辊式破碎机",
"FR风机",
"F7风机",
"F8风机",
"F4风机",
"F5风机",
"F9风机",
"5703空浮风机",
"煤磨控制柜电源",
"7517风机",
"7516风机",
"1#液压电源",
"2#液压电源",
"F3风机",
"F2风机",
"F1风机",
"FB风机",
"FA风机",
"7518风机",
"F6风机",
"斜斗",
],
},
{
name: "一线窑头电力室2",
list: [
"1#窑头进线",
"1#煤磨主电机",
"1#煤磨通风机",
"1#变压器",
"2#变压器",
"1#过剩风机",
"熟料外放1",
"7602堆料机、7603取料机",
"老中控楼、化验室",
"循环水泵房",
"1#煤磨辅机设备",
"熟料外放2",
],
},
{
name: "二线窑头电力室1",
list: [
"F1风机",
"F2风机",
"F3风机",
"F4风机",
"F5风机",
"F6风机",
"F7风机",
"F8风机",
"FA风机",
"原煤板喂机",
"6635风机",
"FB风机",
"FR风机",
"5703空浮风机",
"7516风机",
"液压站一段油泵",
"液压站二段油泵",
"辊破电源",
"熟料链斗输送机",
"5703备用风机",
"7517风机",
"老中控楼电源",
"空调",
],
},
{
name: "二线窑头电力室2",
list: [
"2#窑头进线",
"2#煤磨主电机",
"2#煤磨通风机",
"1#变压器",
"2#变压器",
"2#过剩风机",
"2#煤磨辅机",
"2#熟料外放",
],
},
{
name: "一线原煤电力室",
list: [
"7102皮带机",
"7103皮带机",
"7601皮带机",
"原煤输送皮带",
"7605皮带机",
"7610皮带机",
"7604皮带机",
],
},
{
name: "水泥磨电力室",
list: [
"总进线柜",
"变压器",
"水泥磨主电机",
"水泥磨收尘风机",
"水泥磨辊压机",
"水泥库底1#斜槽风机",
"2#3#4#库侧卸料罗茨风机",
"1#库侧罗茨风机",
"水泥库底2#斜槽风机",
"2#库侧罗茨风机",
"3#库侧罗茨风机",
"1#2#3#4#库侧水泥散装机",
"1#包装斗式提升机",
"4#库侧罗茨风机",
"1#库侧卸料罗茨风机",
"4#空压机",
"万吨仓电源",
"1#包装收尘风机电院",
"1#回灰斜槽风机",
"1#包装除尘器",
"1#包装机电源",
"2#包装除尘器",
"2#包装收尘变频电源",
"2#包装提升机",
"2#包装机",
"粉煤灰空压机",
"料饼提升机",
"选粉机",
"循环风机",
],
},
{
name: "万吨仓电力室",
list: ["污水处理"],
},
{
name: "余热发电电力室",
list: [
"1#循环水泵",
"2#循环水泵",
"3#循环水泵",
"4#循环水泵",
"润滑高压油泵",
],
},
// 有问题,暂时没有写三号线熟料配电室
{
name: "三号线熟料配电室",
list: [
"电源进线",
"备用抽屉柜",
"与窑头电力室联络电源",
"照明电源",
"侧式悬臂堆料机电源",
"侧式悬臂堆料机备用柜",
"1#桥式取料机电源",
"2#桥式取料机电源",
"251BC03MT01带式输送机软起柜",
"741BC01MT01带式输送机软起柜",
"521FN06VF01离心通风机变频柜",
"521FN05VF01离心通风机变频柜",
"521FN04VF01离心通风机变频柜",
"521FN03VF01离心通风机变频柜",
"521FN02VF01离心通风机变频柜",
"521BC06SS01带式输送机软起柜",
"进线电源",
],
},
// 有问题,暂时没有写三号线窑头配电室
{
name: "三号线窑头配电室",
list: [
"电源进线",
"应急电源",
"备用抽屉柜",
"与窑尾电力室联络电源",
"与2#变压器联络电源",
"备用抽屉柜",
"3#空气悬浮离心风机",
"1#空气悬浮离心风机",
"2#空气悬浮离心风机",
"1#液压油泵软起柜",
"2#液压油泵软起柜",
"3#液压油泵软起柜",
"4#液压油泵软起柜",
"电源进线",
"与1#变压器联络电源",
"发电备用抽屉柜",
"照明电源",
"备用抽屉柜",
"备用抽屉柜",
"与3#变压器联络电源",
"熟料输送机软起柜",
"FC冷却风机",
"FR冷却风机",
"F1冷却风机",
"F3冷却风机变频柜",
"F5冷却风机变频柜",
"电源进线",
"2#空压机电源",
"1#空压机电源",
"与2#变压器联络电源",
"3#空压机电源",
"4#空压机电源",
"与熟料库电气室联络电源",
"3#可逆螺旋输送机",
"无741JX编号",
"备用抽屉柜",
"1#空气悬浮离心鼓风机",
"3#空气悬浮离心鼓风机",
"2#空气悬浮离心鼓风机",
"备用抽屉柜",
"5#液压油泵软起柜",
"6#液压油泵软起柜",
"FA冷却风机",
"FB冷却风机",
"F2冷却风机",
"F4冷却风机",
"FRB1冷却风机变频柜",
"F8冷却风机",
"离心通风机变频柜",
"F9冷却风机变频柜",
"F7冷却风机变频柜",
"F6冷却风机变频柜",
"备用高压柜",
"熟料库变压器",
"窑头变压器3",
"窑头变压器2",
"窑头变压器1",
"窑头排风机",
"煤磨风机",
"煤磨主电机",
"电源进线",
],
},
// 三号线窑尾配电室
{
name: "三号线窑尾配电室",
list: [
"电源进线",
"备用抽屉柜",
"照明电源",
"1#磁悬浮鼓风机控制柜",
"废气处理电源",
"3#磁悬浮鼓风机控制柜",
"4#磁悬浮鼓风机控制柜",
"与原料磨电气室联络电源",
"与窑头电气室联络",
"罗茨鼓风机变频柜",
"窑辅助传动及制动器软起柜",
"斗式提升机软起柜",
],
},
// 三号线生料配电室
{
name: "三号线生料配电室",
list: [
"电源进线",
"辊压机固定辊主电机",
"辊压机活动辊主电机",
"循环风机变频柜",
"原料磨电气室变压器",
"辅料处理电气室变压器",
"原料配料站电气室变压器",
"电机备用",
"反击式破碎机主电机",
"电源进线",
"窑尾变压器",
"窑中主传动柜",
"窑尾排风机变频柜",
"窑尾高温风机变频柜",
"垃圾处理变压器1",
"垃圾处理变压器2",
"变压器备用",
"电源进线",
"照明电源",
"与原料配料电气室联络电源",
"与窑尾电气室联络电源",
"备用抽屉柜",
"1#链板式提升机软启动柜1",
"1#链板式提升机软启动柜2",
"361BE02SS012#链板式提升机软启动柜1",
"361BE02SS022#链板式提升机软启动柜2",
"391BE01SS01胶带斗式提升机软启动",
"361SR02VF01选粉机变频器",
"341BC01VF01带式输送机变频柜",
"391FN01VF01离心通风机变频柜",
],
},
// 辅料处理配电室
{
name: "辅料处理配电室",
list: [
"电源进线",
"251CA01AP01辅料智能抓斗电源",
"721CA01AP01原煤智能抓斗电源",
"与原料配料电气室联络电源",
"照明电源",
"331ST01LP01侧式悬臂堆料机电源",
"331ST01LP01SP侧式悬臂堆料机备用柜",
"备用抽屉柜",
"251BC01MT01带式输送机软起柜",
"251FN02MT01离心风机变频柜",
"进线电源",
"备用抽屉柜",
],
},
{
name: "原料配料配电室",
list: [
"331RE01LP011#侧式刮板取料机电源",
"331RE02LP012#侧式刮板取料机电源",
"331RE02LP01SP2#侧式刮板取料机备用",
"321SE01LP01圆形堆场堆取料机电源",
"1#定量给料机电源",
"1#定量给料机备用电源",
"2#定量给料机电源",
"2#定量给料机备用电源",
"4#定量给料机电源",
"4#定量给料机备用电源",
"与辅材处理电气室联络电源",
"与原料磨电气室联络电源",
"照明电源",
"电源进线",
"2A1BC05MT01带式输送机软起柜",
"331BC04MT01带式输送机软起柜",
"331BC03MT01带式输送机软起柜",
"331BC02MT01带式输送机软起柜",
"321BC02MT01带式输送机软起柜",
"321BC01MT01带式输送机软起柜",
"综合材料库电源",
"循环水电源",
"备用抽屉柜",
"备用抽屉柜",
"721BC02MT01带式输送机电源",
],
},
{
name: "石灰石破碎配电室",
list: [
"电源进线",
"照明电源",
"备用抽屉柜",
"1#重型板式喂料机变频柜",
"2#重型板式喂料机变频柜",
"211FN01VF01离心通风机变频柜",
"211FN02VF01离心通风机变频柜",
"211BC01SS01带式输送机软起柜",
"211BC02SS01带式输送机软起柜",
"电源进线柜",
"3#破碎机1#主电机",
"3#破碎机2#主电机",
"2#破碎机1#主电机",
"2#破碎机2#主电机",
"矿山电力室变压器",
"电机备用",
],
},
{
name: "石灰石输送控制室1、2",
list: [
"2A1BC02MT01带式输送机软起柜",
"2A1BC01MT01带式输送机软起柜",
"电源进线",
"2A1BC06MT01带式输送机软起柜",
"2A1BC04MT01带式输送机软起柜",
"2A1BC03MT01带式输送机软起柜",
"电源进线",
],
},
];

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,975 @@
<template>
<div class="box">
<div class="a">
<img src="../../assets/img/可调负荷/可调图标--未选中.png" alt="" @click="sendMessageToCSharp" />
</div>
<div class="left">
<img src="../../assets/img/标题/智能运维-监控.png" class="title" />
<div class="dqsxtxx">
<div class="imgBox">
<img src="../../assets/img/小标题栏.png" class="img" />
<p>当前摄像头信息</p>
</div>
<div id="dqsxtxx">
<div class="headers"></div>
<h2>摄像头信息</h2>
<div class="footers">
<div class="one">
<p>余热发电站</p>
</div>
<div class="two">
<p>网络数据</p>
</div>
<div class="three">
<p>1920*1080</p>
</div>
<div class="four">
<p>5ms</p>
</div>
</div>
</div>
</div>
<div class="spjk">
<div class="imgBox">
<img src="../../assets/img/小标题栏.png" class="img" />
<p>摄像头视频监控</p>
</div>
<div id="spjk">
<div class="spjk_one">
<div class="jiankong"></div>
<div class="title">SP锅炉</div>
</div>
<div class="spjk_one">
<div class="jiankong"></div>
<div class="title">SP锅炉</div>
</div>
<div class="spjk_one">
<div class="jiankong"></div>
<div class="title">SP锅炉</div>
</div>
<div class="spjk_one">
<div class="jiankong"></div>
<div class="title">SP锅炉</div>
</div>
</div>
</div>
<div class="sxtlb">
<div class="imgBox">
<img src="../../assets/img/小标题栏.png" class="img" />
<p>摄像头列表</p>
</div>
<div id="sxtlb">
<div class="data">
<span :class="res == '生产监控系统' ? 'active' : ''" @click="res = '生产监控系统'">生产监控系统</span>
<span :class="res == '配电室监控系统' ? 'active' : ''" @click="res = '配电室监控系统'">配电室监控系统</span>
</div>
<div class="con">
<div class="con1">
<p>监控17回转窑南侧</p>
<p>07:12:18</p>
</div>
<div class="con2">
<p>监控16篦冷机</p>
<p>07:12:18</p>
</div>
</div>
</div>
</div>
</div>
<div class="right">
<div class="wdjc1">
<div class="imgBox">
<img src="../../assets/img/小标题栏.png" class="img" />
<p>温度监测1</p>
</div>
<div class="chartBox">
<div class="selects">
<el-select v-model="value" :popper-append-to-body="false" class="custom-select" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :popper-append-to-body="false"
:label="item.label" :value="item.value">
</el-option>
</el-select>
</div>
<div id="wdjc1">
<div class="hpfj">
<h2>1#后排风机</h2>
<div class="nei">
<div class="ones" v-for="(item, index) in fjlist" :key="index">
<p>{{ item.name }}</p>
<p class="green">{{ item.count }}</p>
<p class="bianhao">编号{{ item.bianhao }}</p>
</div>
</div>
</div>
<div class="hpfj">
<h2>1#窑主电机</h2>
<div class="nei">
<div class="ones" v-for="(item, index) in fjlist2" :key="index">
<p>{{ item.name }}</p>
<p class="green">{{ item.count }}</p>
<p class="bianhao">编号{{ item.bianhao }}</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="wdjc2">
<div class="imgBox">
<img src="../../assets/img/小标题栏.png" class="img" />
<p>温度监测2</p>
</div>
<div class="chartBox">
<div class="selects">
<el-select v-model="value" :popper-append-to-body="false" class="custom-select" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :popper-append-to-body="false"
:label="item.label" :value="item.value">
</el-option>
</el-select>
</div>
<div id="wdjc2">
<div class="controls">
<h3>智能操控装置</h3>
<ul>
<li v-for="item in list">
<span>{{ item.name }}</span>
<span class="blue">{{ item.count }}</span>
<span></span>
</li>
</ul>
</div>
<div class="controls">
<h3>智能操控装置</h3>
<ul>
<li v-for="item in list">
<span>{{ item.name }}</span>
<span class="blue">{{ item.count }}</span>
<span></span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
fjlist: [
{
name: "1#后排风机上动触头A相",
count: "0.0",
bianhao: "139671",
},
{
name: "1#后排风机上动触头A相",
count: "0.0",
bianhao: "139671",
},
{
name: "1#后排风机上动触头A相",
count: "0.0",
bianhao: "139671",
},
{
name: "1#后排风机上动触头A相",
count: "0.0",
bianhao: "139671",
},
{
name: "1#后排风机上动触头A相",
count: "0.0",
bianhao: "139671",
},
{
name: "1#后排风机上动触头A相",
count: "0.0",
bianhao: "139671",
},
],
fjlist2: [
{
name: "1#窑主电机上动触头A相",
count: "0.0",
bianhao: "139671",
},
{
name: "1#窑主电机上动触头A相",
count: "0.0",
bianhao: "139671",
},
{
name: "1#窑主电机上动触头A相",
count: "0.0",
bianhao: "139671",
},
{
name: "1#窑主电机上动触头A相",
count: "0.0",
bianhao: "139671",
},
],
list: [
{
name: "上静触头A相温度",
count: "0.0",
},
{
name: "上静触头A相温度",
count: "0.0",
},
{
name: "上静触头A相温度",
count: "0.0",
},
{
name: "上静触头A相温度",
count: "0.0",
},
{
name: "上静触头A相温度",
count: "0.0",
},
{
name: "上静触头A相温度",
count: "0.0",
},
{
name: "上静触头A相温度",
count: "0.0",
},
{
name: "上静触头A相温度",
count: "0.0",
},
{
name: "上静触头A相温度",
count: "0.0",
}
],
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶',
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}],
value: '',
res: "生产监控系统",
tableData: [
{
date1: "水泥单位产品综合能耗",
date2: "80kgce/t",
date3: "84kgce/t",
date4: "5%",
},
{
date1: "水泥大内产品综合电耗",
date2: "40kWh/t",
date3: "53kWh/t",
date4: "32.5%",
},
{
date1: "熟料单位产品综合能耗",
date2: "100kgce/t",
date3: "114kgce/t",
date4: "14%",
},
{
date1: "熟料单位产品综合电耗",
date2: "48kWh/t",
date3: "55kWh/t",
date4: "14.58%",
},
{
date1: "熟料单位产品综合煤耗",
date2: "94kgce/",
date3: "108kgce/",
date4: "14.89%",
},
],
devices: [
{
date1: "回转窑",
date2: true,
date3: "102.00",
},
{
date1: "熟料收尘",
date2: true,
date3: "29.00",
},
{
date1: "篦冷机",
date2: true,
date3: "45.00",
},
{
date1: "生料收尘",
date2: false,
date3: "102.00",
},
{
date1: "回转窑",
date2: true,
date3: "29.00",
},
{
date1: "熟料收尘",
date2: false,
date3: "45.00",
}
],
};
},
methods: {
//U3D
sendMessageToCSharp() {
// window.vuplex.postMessage({
// type: "Tog",
// message: "_true",
// });
window.vuplex.postMessage("智能运维-监控")
this.$router.push('/znyw');
},
defineEcharts(dom, option) {
var chartDom = document.getElementById(dom);
var myChart = this.$echarts.init(chartDom);
myChart.setOption(option);
},
tableRowClassName({ row, rowIndex }) {
if ((rowIndex + 1) % 2 === 0) {
return "success-row";
}
return "";
},
},
created() {
// if (window.vuplex) {
// addMessageListener();
// } else {
// window.addEventListener("vuplexready", addEventListener);
// } function addEventListener() {
// window.vuplex.addEventListener("message", function (event) {
// let json = event.data;
// console.log("JSON received" + json);
// })
// }
},
mounted() {
// this.defineEcharts("sstpf", this.option1);
// this.defineEcharts("yysl", this.option2);
// this.defineEcharts("nysl", this.option3);
// this.defineEcharts("nhfx", this.option4);
},
};
</script>
<style scoped lang="less">
.box {
width: 100%;
height: 100%;
box-sizing: border-box;
background-color: transparent;
display: flex;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
padding-top: 400px;
justify-content: space-between;
position: relative;
.a {
position: absolute;
width: 1300px;
z-index: 2;
top: 420px;
right: 480px;
z-index: 100;
img {
margin-right: 102px;
pointer-events: all;
cursor: pointer;
}
}
.left {
width: 1237px;
height: 2500px;
margin-left: 61px;
background-image: url("../../assets/img/侧边.png");
padding-left: 59px;
padding-right: 45px;
box-sizing: border-box;
.dqsxtxx {
position: relative;
margin-top: 56px;
.imgBox {
height: 93px;
width: 1156px;
p {
position: absolute;
color: #fff;
top: 20px;
left: 50px;
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
#dqsxtxx {
margin-top: 50px;
width: 1151px;
height: 800px;
.headers {
width: 1041px;
height: 586px;
opacity: 1;
}
h2 {
width: 184px;
height: 37px;
font-size: 22px;
font-family: MicrosoftYaHei;
color: #FFFFFF;
line-height: 20px;
}
.footers {
width: 100%;
height: 200px;
display: flex;
justify-content: space-around;
flex-wrap: wrap;
align-items: center;
align-content: space-around;
.one {
width: 497px;
height: 80px;
background: url(../../assets/ZNYWJK/1.png);
background-size: cover;
position: relative;
p {
width: 166px;
height: 33px;
font-size: 28px;
font-family: MicrosoftYaHei;
color: #FFFFFF;
left: 50%;
top: 50%;
margin-left: 20px;
transform: translate(50%, 50%);
}
}
.two {
width: 497px;
height: 80px;
background: url(../../assets/ZNYWJK/2.png);
background-size: cover;
position: relative;
p {
width: 166px;
height: 33px;
font-size: 28px;
font-family: MicrosoftYaHei;
color: #FFFFFF;
left: 50%;
top: 50%;
margin-left: 40px;
transform: translate(50%, 50%);
}
}
.three {
width: 497px;
height: 80px;
background: url(../../assets/ZNYWJK/3.png);
background-size: cover;
position: relative;
p {
width: 166px;
height: 33px;
font-size: 28px;
font-family: MicrosoftYaHei;
color: #FFFFFF;
left: 50%;
top: 50%;
margin-left: 20px;
transform: translate(50%, 50%);
}
}
.four {
width: 497px;
height: 80px;
background: url(../../assets/ZNYWJK/4.png);
background-size: cover;
position: relative;
p {
width: 166px;
height: 33px;
font-size: 28px;
font-family: MicrosoftYaHei;
color: #FFFFFF;
left: 50%;
top: 50%;
margin-left: 40px;
transform: translate(50%, 50%);
}
}
}
}
}
.spjk {
position: relative;
margin-top: 56px;
.imgBox {
height: 93px;
width: 1156px;
p {
position: absolute;
color: #fff;
top: 20px;
left: 50px;
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
#spjk {
width: 1155px;
height: 800px;
margin-top: 50px;
display: flex;
justify-content: space-around;
flex-wrap: wrap;
align-items: center;
align-content: space-around;
.spjk_one {
width: 551px;
height: 383px;
background: #1969A8;
opacity: 1;
.jiankong {
width: 100%;
height: 323px;
background-color: #fff;
}
.title {
width: 100%;
height: 40px;
font-size: 28px;
text-align: center;
font-family: MicrosoftYaHei;
color: #FFFFFF;
line-height: 60px;
}
}
}
}
.sxtlb {
position: relative;
margin-top: 56px;
.imgBox {
height: 93px;
width: 1156px;
p {
position: absolute;
color: #fff;
top: 20px;
left: 50px;
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
#sxtlb {
width: 1155px;
height: 500px;
margin-top: 50px;
.data {
position: absolute;
font-size: 28px;
font-family: "DOUYU";
color: #ffffff;
line-height: 18px;
display: flex;
right: 0;
top: 120px;
z-index: 1;
span {
width: 240px;
height: 38px;
margin: 10px;
display: block;
line-height: 38px;
text-align: center;
cursor: pointer;
}
.active {
background: linear-gradient(to right,
rgba(33, 76, 124, 0.3) 20%,
rgba(152, 207, 230, 0.3) 100%,
rgba(33, 76, 124, 0.3) 20%);
}
}
.con {
margin-top: 100px;
width: 1120px;
height: 125px;
// background: #6C1C00;
// opacity: 1;
// border: 1px solid #FF4200;
.con1,
.con2 {
width: 100%;
height: 70px;
padding: 0px 80px 0px 20px;
display: flex;
justify-content: space-between;
align-items: center;
font-size: 24px;
color: #fff;
box-sizing: border-box;
}
.con1 {
background: url(../../assets/ZNYWJK/.png);
}
.con2 {
margin-top: 20px;
background: url(../../assets/ZNYWJK/.png);
}
}
}
}
}
.right {
width: 1237px;
height: 2500px;
margin-right: 61px;
background-image: url("../../assets/img/侧边.png");
padding-left: 59px;
padding-right: 45px;
box-sizing: border-box;
.wdjc1 {
position: relative;
margin-top: 130px;
.imgBox {
height: 93px;
width: 1156px;
p {
position: absolute;
color: #fff;
top: 20px;
left: 50px;
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
.chartBox {
margin-top: 120px;
position: relative;
.selects {
position: absolute;
right: 20px;
top: -60px;
z-index: 1000;
//
.custom-select /deep/ .el-input__inner {
color: #fff !important;
border-radius: 10px 10px 10px 10px;
opacity: 1;
border: 2px solid #06CDFF !important;
background: #1D3349 !important;
}
/* // 设置下拉框的背景颜色及边框属性; */
.custom-select /deep/.el-select-dropdown {
// transparent
border-radius: 10px 10px 10px 10px;
opacity: 1;
border: 2px solid #06CDFF !important;
background: #1D3349 !important;
}
/* // 设置下拉框的字体属性及背景颜色; */
.custom-select /deep/ .el-select-dropdown__item {
font-size: 7px;
color: #fff;
font-weight: 200;
background: #1D3349 !important;
}
// /* // padding 0() */
.custom-select /deep/.el-select-dropdown__list {
/* padding-top: 10px; */
padding: 0;
}
/* // 设置输入框与下拉框的距离为0; (即:样式调整) */
.custom-select /deep/.el-popper[x-placement^="bottom"] {
margin-top: 5px;
}
/* // 将下拉框上的小箭头取消;(看着像一个箭头,其实是两个重叠在一起的箭头) */
.custom-select /deep/.el-popper .popper__arrow,
.custom-select /deep/.el-popper .popper__arrow::after {
display: none;
}
/* // 设置鼠标悬停在下拉框列表的悬停色; */
.custom-select /deep/.el-select-dropdown__item:hover {
color: rgb(213, 215, 230);
background-color: #326AFF;
}
.custom-select /deep/ .el-select-dropdown {
position: absolute;
top: 40px !important;
left: 0px !important;
}
}
#wdjc1 {
width: 1156px;
height: 960px;
font-size: 20px;
color: #fff;
position: relative;
.hpfj {
width: 1154px;
height: 471px;
background: url(../../assets/ZNYWJK/风机框.png);
background-size: cover;
margin-bottom: 40px;
// background: #0184AA;
// opacity: 1;
// border: 1px solid #0EE0ED;
h2 {
color: #fff;
padding: 20px;
}
.nei {
width: 100%;
height: 380px;
display: flex;
justify-content: flex-start;
align-items: center;
align-content: space-around;
flex-wrap: wrap;
// flex-direction: column;
.ones {
margin-left: 12px;
width: 350px;
height: 163px;
font-size: 30px;
margin-right: 20px;
background: url(../../assets/ZNYWJK/风机内框.png);
// background: #00F0FF;
// opacity: 0.2;
// border: NaNpx solid #00F0FF;
.green {
text-align: center;
color: #51FF72;
height: 80px;
font-size: 40px;
line-height: 80px;
}
.bianhao {
font-size: 22px;
}
}
}
}
}
}
}
.wdjc2 {
position: relative;
margin-top: 100px;
.imgBox {
height: 93px;
width: 1156px;
p {
position: absolute;
color: #fff;
top: 20px;
left: 50px;
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
.chartBox {
margin-top: 120px;
position: relative;
.selects {
position: absolute;
right: 20px;
top: -60px;
z-index: 1000;
//
.custom-select /deep/ .el-input__inner {
color: #fff !important;
border-radius: 10px 10px 10px 10px;
opacity: 1;
border: 2px solid #06CDFF !important;
background: #1D3349 !important;
}
/* // 设置下拉框的背景颜色及边框属性; */
.custom-select /deep/.el-select-dropdown {
// transparent
border-radius: 10px 10px 10px 10px;
opacity: 1;
border: 2px solid #06CDFF !important;
background: #1D3349 !important;
}
/* // 设置下拉框的字体属性及背景颜色; */
.custom-select /deep/.el-select-dropdown__item {
font-size: 7px;
color: #fff;
font-weight: 200;
background: #1D3349 !important;
}
// /* // padding 0() */
.custom-select /deep/.el-select-dropdown__list {
/* padding-top: 10px; */
padding: 0;
}
/* // 设置输入框与下拉框的距离为0; (即:样式调整) */
.custom-select /deep/.el-popper[x-placement^="bottom"] {
margin-top: 5px;
}
/* // 将下拉框上的小箭头取消;(看着像一个箭头,其实是两个重叠在一起的箭头) */
.custom-select /deep/.el-popper .popper__arrow,
.custom-select /deep/.el-popper .popper__arrow::after {
display: none;
}
/* // 设置鼠标悬停在下拉框列表的悬停色; */
.custom-select /deep/.el-select-dropdown__item:hover {
color: rgb(213, 215, 230);
background-color: #326AFF;
}
.custom-select /deep/ .el-select-dropdown {
position: absolute;
top: 40px !important;
left: 0px !important;
}
}
#wdjc2 {
width: 1156px;
height: 900px;
font-size: 20px;
color: #fff;
position: relative;
display: flex;
justify-content: space-around;
align-items: center;
h3 {
text-align: center;
font-size: 30px;
margin-top: 10px;
}
.controls {
width: 512px;
height: 883px;
background: url(../../assets/ZNYWJK/竖框.png);
ul {
width: 100%;
list-style: none;
box-sizing: border-box;
li {
width: 456px;
margin: 0 auto;
margin-top: 10px;
padding: 0px 30px;
height: 80px;
line-height: 80px;
font-size: 28px;
box-sizing: border-box;
background: url(../../assets/ZNYWJK/输入框.png);
.blue {
margin: 0px 20px 10px;
color: #0EE5FF;
font-size: 40px;
}
}
}
}
}
}
}
}
}
</style>

View File

@ -0,0 +1,115 @@
<template>
<div class="box">
<div class="a">
<img
src="../../assets/nyjc/电1.png"
alt=""
v-show="!dian"
@click="
(dian = true),
(shui = false),
(mei = false),
sendMessageToCSharp('能源监测_电');
$router.push(
'/area/nyjcd',
() => {},
() => {}
);
"
/>
<img src="../../assets/nyjc/电.png" alt="" v-show="dian" />
<img
src="../../assets/nyjc/水1.png"
alt=""
v-show="!shui"
@click="
(dian = false),
(shui = true),
(mei = false),
sendMessageToCSharp('能源监测_水');
$router.push(
'/area/nyjcs',
() => {},
() => {}
);
"
/>
<img src="../../assets/nyjc/水.png" alt="" v-show="shui" />
<img
src="../../assets/nyjc/煤1.png"
alt=""
v-show="!mei"
@click="
(dian = false),
(shui = false),
(mei = true),
sendMessageToCSharp('能源监测_煤');
$router.push(
'/area/nyjcm',
() => {},
() => {}
);
"
/>
<img src="../../assets/nyjc/煤.png" alt="" v-show="mei" />
</div>
<div class="areaBox" ref="areaBox">
<router-view></router-view>
</div>
</div>
</template>
<script>
export default {
data() {
return {
dian: false,
shui: false,
mei: false,
};
},
created() {},
methods: {
sendMessageToCSharp(name) {
window.vuplex.postMessage({
type: "Tog",
message: `${name}_true`,
});
},
},
};
</script>
<style scoped lang="less">
.box {
width: 100%;
height: 100%;
box-sizing: border-box;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
background-color: transparent;
display: flex;
justify-content: space-between;
position: relative;
.a {
position: absolute;
width: 1300px;
z-index: 2;
top: 420px;
right: 1351px;
z-index: 100;
img {
margin-right: 102px;
pointer-events: all;
cursor: pointer;
}
}
}
.areaBox {
width: 100%;
height: 100%;
background-color: transparent;
position: absolute;
z-index: 1;
}
</style>

View File

@ -0,0 +1,115 @@
<template>
<div class="box">
<div class="a">
<img
src="../../assets/nyjc/电1.png"
alt=""
v-show="!dian"
@click="
(dian = true),
(shui = false),
(mei = false),
sendMessageToCSharp('能源监测_电');
$router.push(
'/area/nyjcd',
() => {},
() => {}
);
"
/>
<img src="../../assets/nyjc/电.png" alt="" v-show="dian" />
<img
src="../../assets/nyjc/水1.png"
alt=""
v-show="!shui"
@click="
(dian = false),
(shui = true),
(mei = false),
sendMessageToCSharp('能源监测_水');
$router.push(
'/area/nyjcs',
() => {},
() => {}
);
"
/>
<img src="../../assets/nyjc/水.png" alt="" v-show="shui" />
<img
src="../../assets/nyjc/煤1.png"
alt=""
v-show="!mei"
@click="
(dian = false),
(shui = false),
(mei = true),
sendMessageToCSharp('能源监测_煤');
$router.push(
'/area/nyjcm',
() => {},
() => {}
);
"
/>
<img src="../../assets/nyjc/煤.png" alt="" v-show="mei" />
</div>
<div class="areaBox" ref="areaBox">
<router-view></router-view>
</div>
</div>
</template>
<script>
export default {
data() {
return {
dian: false,
shui: false,
mei: false,
};
},
created() {},
methods: {
sendMessageToCSharp(name) {
window.vuplex.postMessage({
type: "Tog",
message: `${name}_true`,
});
},
},
};
</script>
<style scoped lang="less">
.box {
width: 100%;
height: 100%;
box-sizing: border-box;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
// background-color: transparent;
display: flex;
justify-content: space-between;
position: relative;
.a {
position: absolute;
width: 1300px;
z-index: 2;
top: 420px;
right: 1351px;
z-index: 100;
img {
margin-right: 102px;
pointer-events: all;
cursor: pointer;
}
}
}
.areaBox {
width: 100%;
height: 100%;
background-color: transparent;
position: absolute;
z-index: 1;
}
</style>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,312 @@
<template>
<div class="box">
<div class="left">
<img src="../../assets/img/标题/回路名称.png" class="title" />
<ul class="list">
<li
v-for="item in list"
:class="res == item ? 'active' : ''"
@click="(res = item), sendMessageToCSharp(item)"
>
{{ item }}
</li>
</ul>
<div class="tpt">
<div class="imgBox">
<img src="../../assets/img/小标题栏.png" class="img" />
<p>拓扑图</p>
</div>
<div id="tpt">
<el-image
v-for="item in arr"
:src="item.url"
:preview-src-list="item.srcList"
>
</el-image>
</div>
</div>
</div>
<img src="../../assets/img/pdsbg.png" alt="" class="bgt">
</div>
</template>
<script>
import Viewer from "viewerjs";
import { pdsJs } from "../../utils/pds";
export default {
data() {
return {
arr: [
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/线1.png"),
// srcList: [require("../../assets/tpt/线1.png")],
// },
// {
// url: require("../../assets/tpt/线2.png"),
// srcList: [require("../../assets/tpt/线2.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/线1.png"),
// srcList: [require("../../assets/tpt/线1.png")],
// },
// {
// url: require("../../assets/tpt/线2.png"),
// srcList: [require("../../assets/tpt/线2.png")],
// },
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
],
list: [
// "6.3KV#1线",
// "6.3KV#1线",
// "6.3KV#1#1线",
// "6.3KV#1#2线",
// "6.3KV#2线",
// "6.3KV#2#1线",
// "6.3KV#2#2线",
// "6.3KV#1线(线)",
// "6.3KV#1线",
// "6.3KV#2线",
],
res: "",
};
},
created() {
this.getList(this.$route.query.type);
this.changeArr(this.$route.query.type);
},
methods: {
initViewer() {
this.viewer = new Viewer(this.$el, {
inline: false,
button: true,
navbar: true,
title: false,
toolbar: true,
tooltip: true,
movable: false,
zoomable: true,
rotatable: false,
scalable: true,
transition: true,
fullscreen: true,
keyboard: true,
url(image) {
console.log(image.src);
return image.src;
},
ready() {
console.log("Viewer is ready");
},
});
},
//
getList(name) {
var list = [];
pdsJs.forEach((item) => {
if (item.name == name) {
list = item.list;
}
});
this.list = list;
},
sendMessageToCSharp(name) {
let that = this;
window.vuplex.postMessage({
type: that.$route.query.type,
name: name,
});
},
changeArr(name) {
if (name == "总降电力室") {
this.arr[0] = {
url: require("../../assets/tpt/二线生料电力室.png"),
srcList: [require("../../assets/tpt/二线生料电力室.png")],
};
} else if (name == "矿山电力室") {
this.arr[0] = {
url: require("../../assets/tpt/矿山电力室.png"),
srcList: [require("../../assets/tpt/矿山电力室.png")],
};
} else if (name == "原材料电力室") {
this.arr[0] = {
url: require("../../assets/tpt/原材料电力室.png"),
srcList: [require("../../assets/tpt/原材料电力室.png")],
};
} else if (name == "一线生料磨电力室") {
this.arr[0] = {
url: require("../../assets/tpt/一线生料电力室.png"),
srcList: [require("../../assets/tpt/一线生料电力室.png")],
};
} else if (name == "二线生料磨电力室") {
this.arr[0] = {
url: require("../../assets/tpt/二线生料电力室.png"),
srcList: [require("../../assets/tpt/二线生料电力室.png")],
};
}
},
},
mounted() {
this.initViewer();
},
beforeDestroy() {
if (this.viewer) {
this.viewer.destroy();
}
},
};
</script>
<style scoped lang="less">
.box {
width: 100%;
height: 100%;
padding-top: 400px;
box-sizing: border-box;
display: flex;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
justify-content: space-between;
.left {
width: 1237px;
height: 2500px;
margin-left: 61px;
background-image: url("../../assets/img/侧边.png");
padding-left: 59px;
padding-right: 45px;
box-sizing: border-box;
.title {
margin-top: 15px;
margin-left: 60px;
}
.list {
margin-top: 50px;
list-style-type: none;
color: #fff;
font-size: 30px;
max-height: 1300px;
min-height: 600px;
overflow-y: auto;
overflow-x: hidden;
li {
width: 1128px;
height: 103px;
background-color: #123c63;
text-align: left;
line-height: 103px;
text-indent: 50px;
margin: 20px;
cursor: pointer;
}
.active {
color: #00fcff;
}
}
.tpt {
position: relative;
margin-top: 56px;
.data {
position: absolute;
font-size: 20px;
font-family: "DOUYU";
color: #ffffff;
line-height: 18px;
display: flex;
right: 0;
top: 120px;
z-index: 1;
cursor: pointer;
span {
width: 122px;
height: 38px;
margin: 10px;
display: block;
line-height: 38px;
text-align: center;
}
.active {
background: linear-gradient(
to right,
rgba(33, 76, 124, 0.3) 20%,
rgba(152, 207, 230, 0.3) 100%,
rgba(33, 76, 124, 0.3) 20%
);
}
}
.imgBox {
height: 93px;
width: 1156px;
p {
position: absolute;
color: #fff;
top: 20px;
left: 50px;
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
#tpt {
width: 1155px;
height: 500px;
margin-top: 50px;
/deep/ .el-image {
width: 100%;
height: 100%;
}
}
}
}
}
.bgt {
// width: 1113px;
// height: 2055px;
width: 317px;
height: 485px;
position: absolute;
left: 50%;
top: 50%;
// border: 2px solid #20d6fe;
transform: translate(50%, -50%);
}
</style>

View File

@ -0,0 +1,312 @@
<template>
<div class="box">
<div class="left">
<img src="../../assets/img/标题/回路名称.png" class="title" />
<ul class="list">
<li
v-for="item in list"
:class="res == item ? 'active' : ''"
@click="(res = item), sendMessageToCSharp(item)"
>
{{ item }}
</li>
</ul>
<div class="tpt">
<div class="imgBox">
<img src="../../assets/img/小标题栏.png" class="img" />
<p>拓扑图</p>
</div>
<div id="tpt">
<el-image
v-for="item in arr"
:src="item.url"
:preview-src-list="item.srcList"
>
</el-image>
</div>
</div>
</div>
<img src="../../assets/img/pdsbg.png" alt="" class="bgt">
</div>
</template>
<script>
import Viewer from "viewerjs";
import { pdsJs } from "../../utils/pds";
export default {
data() {
return {
arr: [
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/线1.png"),
// srcList: [require("../../assets/tpt/线1.png")],
// },
// {
// url: require("../../assets/tpt/线2.png"),
// srcList: [require("../../assets/tpt/线2.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/线1.png"),
// srcList: [require("../../assets/tpt/线1.png")],
// },
// {
// url: require("../../assets/tpt/线2.png"),
// srcList: [require("../../assets/tpt/线2.png")],
// },
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
],
list: [
// "6.3KV#1线",
// "6.3KV#1线",
// "6.3KV#1#1线",
// "6.3KV#1#2线",
// "6.3KV#2线",
// "6.3KV#2#1线",
// "6.3KV#2#2线",
// "6.3KV#1线(线)",
// "6.3KV#1线",
// "6.3KV#2线",
],
res: "",
};
},
created() {
this.getList(this.$route.query.type);
this.changeArr(this.$route.query.type);
},
methods: {
initViewer() {
this.viewer = new Viewer(this.$el, {
inline: false,
button: true,
navbar: true,
title: false,
toolbar: true,
tooltip: true,
movable: false,
zoomable: true,
rotatable: false,
scalable: true,
transition: true,
fullscreen: true,
keyboard: true,
url(image) {
console.log(image.src);
return image.src;
},
ready() {
console.log("Viewer is ready");
},
});
},
//
getList(name) {
var list = [];
pdsJs.forEach((item) => {
if (item.name == name) {
list = item.list;
}
});
this.list = list;
},
sendMessageToCSharp(name) {
let that = this;
window.vuplex.postMessage({
type: that.$route.query.type,
name: name,
});
},
changeArr(name) {
if (name == "总降电力室") {
this.arr[0] = {
url: require("../../assets/tpt/二线生料电力室.png"),
srcList: [require("../../assets/tpt/二线生料电力室.png")],
};
} else if (name == "矿山电力室") {
this.arr[0] = {
url: require("../../assets/tpt/矿山电力室.png"),
srcList: [require("../../assets/tpt/矿山电力室.png")],
};
} else if (name == "原材料电力室") {
this.arr[0] = {
url: require("../../assets/tpt/原材料电力室.png"),
srcList: [require("../../assets/tpt/原材料电力室.png")],
};
} else if (name == "一线生料磨电力室") {
this.arr[0] = {
url: require("../../assets/tpt/一线生料电力室.png"),
srcList: [require("../../assets/tpt/一线生料电力室.png")],
};
} else if (name == "二线生料磨电力室") {
this.arr[0] = {
url: require("../../assets/tpt/二线生料电力室.png"),
srcList: [require("../../assets/tpt/二线生料电力室.png")],
};
}
},
},
mounted() {
this.initViewer();
},
beforeDestroy() {
if (this.viewer) {
this.viewer.destroy();
}
},
};
</script>
<style scoped lang="less">
.box {
width: 100%;
height: 100%;
padding-top: 400px;
box-sizing: border-box;
display: flex;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png);
justify-content: space-between;
.left {
width: 1237px;
height: 2500px;
margin-left: 61px;
background-image: url("../../assets/img/侧边.png");
padding-left: 59px;
padding-right: 45px;
box-sizing: border-box;
.title {
margin-top: 15px;
margin-left: 60px;
}
.list {
margin-top: 50px;
list-style-type: none;
color: #fff;
font-size: 30px;
max-height: 1300px;
min-height: 600px;
overflow-y: auto;
overflow-x: hidden;
li {
width: 1128px;
height: 103px;
background-color: #123c63;
text-align: left;
line-height: 103px;
text-indent: 50px;
margin: 20px;
cursor: pointer;
}
.active {
color: #00fcff;
}
}
.tpt {
position: relative;
margin-top: 56px;
.data {
position: absolute;
font-size: 20px;
font-family: "DOUYU";
color: #ffffff;
line-height: 18px;
display: flex;
right: 0;
top: 120px;
z-index: 1;
cursor: pointer;
span {
width: 122px;
height: 38px;
margin: 10px;
display: block;
line-height: 38px;
text-align: center;
}
.active {
background: linear-gradient(
to right,
rgba(33, 76, 124, 0.3) 20%,
rgba(152, 207, 230, 0.3) 100%,
rgba(33, 76, 124, 0.3) 20%
);
}
}
.imgBox {
height: 93px;
width: 1156px;
p {
position: absolute;
color: #fff;
top: 20px;
left: 50px;
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
#tpt {
width: 1155px;
height: 500px;
margin-top: 50px;
/deep/ .el-image {
width: 100%;
height: 100%;
}
}
}
}
}
.bgt {
// width: 1113px;
// height: 2055px;
width: 317px;
height: 485px;
position: absolute;
left: 50%;
top: 50%;
// border: 2px solid #20d6fe;
transform: translate(50%, -50%);
}
</style>

View File

@ -0,0 +1,312 @@
<template>
<div class="box">
<div class="left">
<img src="../../assets/img/标题/回路名称.png" class="title" />
<ul class="list">
<li
v-for="item in list"
:class="res == item ? 'active' : ''"
@click="(res = item), sendMessageToCSharp(item)"
>
{{ item }}
</li>
</ul>
<div class="tpt">
<div class="imgBox">
<img src="../../assets/img/小标题栏.png" class="img" />
<p>拓扑图</p>
</div>
<div id="tpt">
<el-image
v-for="item in arr"
:src="item.url"
:preview-src-list="item.srcList"
>
</el-image>
</div>
</div>
</div>
<img src="../../assets/img/pdsbg.png" alt="" class="bgt">
</div>
</template>
<script>
import Viewer from "viewerjs";
import { pdsJs } from "../../utils/pds";
export default {
data() {
return {
arr: [
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/线1.png"),
// srcList: [require("../../assets/tpt/线1.png")],
// },
// {
// url: require("../../assets/tpt/线2.png"),
// srcList: [require("../../assets/tpt/线2.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/线1.png"),
// srcList: [require("../../assets/tpt/线1.png")],
// },
// {
// url: require("../../assets/tpt/线2.png"),
// srcList: [require("../../assets/tpt/线2.png")],
// },
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
],
list: [
// "6.3KV#1线",
// "6.3KV#1线",
// "6.3KV#1#1线",
// "6.3KV#1#2线",
// "6.3KV#2线",
// "6.3KV#2#1线",
// "6.3KV#2#2线",
// "6.3KV#1线(线)",
// "6.3KV#1线",
// "6.3KV#2线",
],
res: "",
};
},
created() {
this.getList(this.$route.query.type);
this.changeArr(this.$route.query.type);
},
methods: {
initViewer() {
this.viewer = new Viewer(this.$el, {
inline: false,
button: true,
navbar: true,
title: false,
toolbar: true,
tooltip: true,
movable: false,
zoomable: true,
rotatable: false,
scalable: true,
transition: true,
fullscreen: true,
keyboard: true,
url(image) {
console.log(image.src);
return image.src;
},
ready() {
console.log("Viewer is ready");
},
});
},
//
getList(name) {
var list = [];
pdsJs.forEach((item) => {
if (item.name == name) {
list = item.list;
}
});
this.list = list;
},
sendMessageToCSharp(name) {
let that = this;
window.vuplex.postMessage({
type: that.$route.query.type,
name: name,
});
},
changeArr(name) {
if (name == "总降电力室") {
this.arr[0] = {
url: require("../../assets/tpt/二线生料电力室.png"),
srcList: [require("../../assets/tpt/二线生料电力室.png")],
};
} else if (name == "矿山电力室") {
this.arr[0] = {
url: require("../../assets/tpt/矿山电力室.png"),
srcList: [require("../../assets/tpt/矿山电力室.png")],
};
} else if (name == "原材料电力室") {
this.arr[0] = {
url: require("../../assets/tpt/原材料电力室.png"),
srcList: [require("../../assets/tpt/原材料电力室.png")],
};
} else if (name == "一线生料磨电力室") {
this.arr[0] = {
url: require("../../assets/tpt/一线生料电力室.png"),
srcList: [require("../../assets/tpt/一线生料电力室.png")],
};
} else if (name == "二线生料磨电力室") {
this.arr[0] = {
url: require("../../assets/tpt/二线生料电力室.png"),
srcList: [require("../../assets/tpt/二线生料电力室.png")],
};
}
},
},
mounted() {
this.initViewer();
},
beforeDestroy() {
if (this.viewer) {
this.viewer.destroy();
}
},
};
</script>
<style scoped lang="less">
.box {
width: 100%;
height: 100%;
padding-top: 400px;
box-sizing: border-box;
display: flex;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
justify-content: space-between;
.left {
width: 1237px;
height: 2500px;
margin-left: 61px;
background-image: url("../../assets/img/侧边.png");
padding-left: 59px;
padding-right: 45px;
box-sizing: border-box;
.title {
margin-top: 15px;
margin-left: 60px;
}
.list {
margin-top: 50px;
list-style-type: none;
color: #fff;
font-size: 30px;
max-height: 1300px;
min-height: 600px;
overflow-y: auto;
overflow-x: hidden;
li {
width: 1128px;
height: 103px;
background-color: #123c63;
text-align: left;
line-height: 103px;
text-indent: 50px;
margin: 20px;
cursor: pointer;
}
.active {
color: #00fcff;
}
}
.tpt {
position: relative;
margin-top: 56px;
.data {
position: absolute;
font-size: 20px;
font-family: "DOUYU";
color: #ffffff;
line-height: 18px;
display: flex;
right: 0;
top: 120px;
z-index: 1;
cursor: pointer;
span {
width: 122px;
height: 38px;
margin: 10px;
display: block;
line-height: 38px;
text-align: center;
}
.active {
background: linear-gradient(
to right,
rgba(33, 76, 124, 0.3) 20%,
rgba(152, 207, 230, 0.3) 100%,
rgba(33, 76, 124, 0.3) 20%
);
}
}
.imgBox {
height: 93px;
width: 1156px;
p {
position: absolute;
color: #fff;
top: 20px;
left: 50px;
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
#tpt {
width: 1155px;
height: 500px;
margin-top: 50px;
/deep/ .el-image {
width: 100%;
height: 100%;
}
}
}
}
}
.bgt {
// width: 1113px;
// height: 2055px;
width: 317px;
height: 485px;
position: absolute;
left: 50%;
top: 50%;
// border: 2px solid #20d6fe;
transform: translate(50%, -50%);
}
</style>

View File

@ -0,0 +1,312 @@
<template>
<div class="box">
<div class="left">
<img src="../../assets/img/标题/回路名称.png" class="title" />
<ul class="list">
<li
v-for="item in list"
:class="res == item ? 'active' : ''"
@click="(res = item), sendMessageToCSharp(item)"
>
{{ item }}
</li>
</ul>
<div class="tpt">
<div class="imgBox">
<img src="../../assets/img/小标题栏.png" class="img" />
<p>拓扑图</p>
</div>
<div id="tpt">
<el-image
v-for="item in arr"
:src="item.url"
:preview-src-list="item.srcList"
>
</el-image>
</div>
</div>
</div>
<img src="../../assets/img/pdsbg.png" alt="" class="bgt">
</div>
</template>
<script>
import Viewer from "viewerjs";
import { pdsJs } from "../../utils/pds";
export default {
data() {
return {
arr: [
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/线1.png"),
// srcList: [require("../../assets/tpt/线1.png")],
// },
// {
// url: require("../../assets/tpt/线2.png"),
// srcList: [require("../../assets/tpt/线2.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/线1.png"),
// srcList: [require("../../assets/tpt/线1.png")],
// },
// {
// url: require("../../assets/tpt/线2.png"),
// srcList: [require("../../assets/tpt/线2.png")],
// },
// {
// url: require("../../assets/tpt/线.png"),
// srcList: [require("../../assets/tpt/线.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
// {
// url: require("../../assets/tpt/.png"),
// srcList: [require("../../assets/tpt/.png")],
// },
],
list: [
// "6.3KV#1线",
// "6.3KV#1线",
// "6.3KV#1#1线",
// "6.3KV#1#2线",
// "6.3KV#2线",
// "6.3KV#2#1线",
// "6.3KV#2#2线",
// "6.3KV#1线(线)",
// "6.3KV#1线",
// "6.3KV#2线",
],
res: "",
};
},
created() {
this.getList(this.$route.query.type);
this.changeArr(this.$route.query.type);
},
methods: {
initViewer() {
this.viewer = new Viewer(this.$el, {
inline: false,
button: true,
navbar: true,
title: false,
toolbar: true,
tooltip: true,
movable: false,
zoomable: true,
rotatable: false,
scalable: true,
transition: true,
fullscreen: true,
keyboard: true,
url(image) {
console.log(image.src);
return image.src;
},
ready() {
console.log("Viewer is ready");
},
});
},
//
getList(name) {
var list = [];
pdsJs.forEach((item) => {
if (item.name == name) {
list = item.list;
}
});
this.list = list;
},
sendMessageToCSharp(name) {
let that = this;
window.vuplex.postMessage({
type: that.$route.query.type,
name: name,
});
},
changeArr(name) {
if (name == "总降电力室") {
this.arr[0] = {
url: require("../../assets/tpt/二线生料电力室.png"),
srcList: [require("../../assets/tpt/二线生料电力室.png")],
};
} else if (name == "矿山电力室") {
this.arr[0] = {
url: require("../../assets/tpt/矿山电力室.png"),
srcList: [require("../../assets/tpt/矿山电力室.png")],
};
} else if (name == "原材料电力室") {
this.arr[0] = {
url: require("../../assets/tpt/原材料电力室.png"),
srcList: [require("../../assets/tpt/原材料电力室.png")],
};
} else if (name == "一线生料磨电力室") {
this.arr[0] = {
url: require("../../assets/tpt/一线生料电力室.png"),
srcList: [require("../../assets/tpt/一线生料电力室.png")],
};
} else if (name == "二线生料磨电力室") {
this.arr[0] = {
url: require("../../assets/tpt/二线生料电力室.png"),
srcList: [require("../../assets/tpt/二线生料电力室.png")],
};
}
},
},
mounted() {
this.initViewer();
},
beforeDestroy() {
if (this.viewer) {
this.viewer.destroy();
}
},
};
</script>
<style scoped lang="less">
.box {
width: 100%;
height: 100%;
padding-top: 400px;
box-sizing: border-box;
display: flex;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png);
justify-content: space-between;
.left {
width: 1237px;
height: 2500px;
margin-left: 61px;
background-image: url("../../assets/img/侧边.png");
padding-left: 59px;
padding-right: 45px;
box-sizing: border-box;
.title {
margin-top: 15px;
margin-left: 60px;
}
.list {
margin-top: 50px;
list-style-type: none;
color: #fff;
font-size: 30px;
max-height: 1300px;
min-height: 600px;
overflow-y: auto;
overflow-x: hidden;
li {
width: 1128px;
height: 103px;
background-color: #123c63;
text-align: left;
line-height: 103px;
text-indent: 50px;
margin: 20px;
cursor: pointer;
}
.active {
color: #00fcff;
}
}
.tpt {
position: relative;
margin-top: 56px;
.data {
position: absolute;
font-size: 20px;
font-family: "DOUYU";
color: #ffffff;
line-height: 18px;
display: flex;
right: 0;
top: 120px;
z-index: 1;
cursor: pointer;
span {
width: 122px;
height: 38px;
margin: 10px;
display: block;
line-height: 38px;
text-align: center;
}
.active {
background: linear-gradient(
to right,
rgba(33, 76, 124, 0.3) 20%,
rgba(152, 207, 230, 0.3) 100%,
rgba(33, 76, 124, 0.3) 20%
);
}
}
.imgBox {
height: 93px;
width: 1156px;
p {
position: absolute;
color: #fff;
top: 20px;
left: 50px;
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
#tpt {
width: 1155px;
height: 500px;
margin-top: 50px;
/deep/ .el-image {
width: 100%;
height: 100%;
}
}
}
}
}
.bgt {
// width: 1113px;
// height: 2055px;
width: 317px;
height: 485px;
position: absolute;
left: 50%;
top: 50%;
// border: 2px solid #20d6fe;
transform: translate(50%, -50%);
}
</style>

File diff suppressed because it is too large Load Diff

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

View File

@ -12,6 +12,15 @@ export let pdsJs = [
"6.3KV#1发电机出线(安热线)",
"6.3KV#主变1进线",
"6.3KV#主变2进线",
"6.3KV#1水泥磨出线",
"6.3KV塑料厂出线",
"6.3KV骨料出线",
"6.3KV#3石灰石出线",
"6.3KV#3原料出线",
"6.3KV#3窑尾出线",
"6.3KV#3窑头出线",
"6.3KV#2水泥磨出线",
"6.3KV#2发电机出线"
],
},
{

View File

@ -729,8 +729,7 @@ export default {
.box {
width: 100%;
height: 100%;
// background-image: url(../../assets/img/.png), url(../../assets/img/.png),
// url(../../assets/img/.png), url(../../assets/img/.png);
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
// background-color: transparent;
padding-top: 500px;
box-sizing: border-box;

View File

@ -1159,6 +1159,7 @@ export default {
box-sizing: border-box;
display: flex;
position: relative;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
background-color: transparent;
justify-content: space-between;

View File

@ -1280,6 +1280,7 @@ export default {
box-sizing: border-box;
background-color: transparent;
display: flex;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
padding-top: 400px;
justify-content: space-between;
position: relative;

View File

@ -1098,6 +1098,7 @@ export default {
padding-top: 500px;
box-sizing: border-box;
display: flex;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
background-color: transparent;
justify-content: space-between;
position: relative;

View File

@ -1269,6 +1269,7 @@ export default {
box-sizing: border-box;
background-color: transparent;
display: flex;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
padding-top: 400px;
justify-content: space-between;
position: relative;

View File

@ -740,6 +740,7 @@ export default {
box-sizing: border-box;
background-color: transparent;
display: flex;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
padding-top: 400px;
justify-content: space-between;
position: relative;

View File

@ -384,6 +384,7 @@ export default {
box-sizing: border-box;
background-color: transparent;
display: flex;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
padding-top: 400px;
justify-content: space-between;
position: relative;

View File

@ -83,7 +83,8 @@ export default {
width: 100%;
height: 100%;
box-sizing: border-box;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
// background-color: transparent;
display: flex;
justify-content: space-between;
position: relative;

View File

@ -933,6 +933,7 @@ export default {
padding-top: 400px;
box-sizing: border-box;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
display: flex;
justify-content: space-between;
position: relative;

View File

@ -727,6 +727,7 @@ export default {
box-sizing: border-box;
background-color: transparent;
display: flex;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
justify-content: space-between;
position: relative;
pointer-events: all;
@ -739,21 +740,23 @@ export default {
top: 1500px;
div {
width: 457px;
height: 140px;
width: 540px;
height: 147px;
text-align: center;
line-height: 140px;
line-height: 147px;
color: #fff;
font-size: 40px;
font-weight: bold;
padding-left: 88px;
box-sizing: border-box;
font-family: "FZZCHJW-1";
background-image: url("../../assets/nyjc/图层 11.png");
background-image: url("../../assets/nyjc/左默认.png");
margin: 37px;
cursor: pointer;
}
.active {
background-image: url("../../assets/nyjc/图层 2.png");
background-image: url("../../assets/nyjc/左选中.png");
}
}
@ -764,21 +767,24 @@ export default {
top: 1300px;
div {
width: 560px;
height: 140px;
width: 550px;
height: 147px;
text-align: center;
line-height: 140px;
line-height: 147px;
color: #fff;
font-size: 40px;
font-weight: bold;
background-image: url("../../assets/nyjc/组 277.png");
padding-right: 108px;
box-sizing: border-box;
background-image: url("../../assets/nyjc/右默认.png");
background-size: cover;
font-family: "FZZCHJW-1";
margin: 37px;
cursor: pointer;
}
.active {
background-image: url("../../assets/nyjc/组 276.png");
background-image: url("../../assets/nyjc/右选中.png");
}
}
@ -874,7 +880,7 @@ export default {
margin-top: 50px;
.chartbox {
width: 1000%;
width: 100%;
color: #fff;
font-size: 30px;
align-items: center;

View File

@ -760,6 +760,7 @@ export default {
height: 100%;
box-sizing: border-box;
background-color: transparent;
background-image: url(../../../assets/img/左遮罩.png), url(../../../assets/img/右遮罩.png);
display: flex;
justify-content: space-between;
position: relative;

View File

@ -1575,6 +1575,7 @@ export default {
height: 100%;
box-sizing: border-box;
background-color: transparent;
background-image: url(../../../assets/img/左遮罩.png), url(../../../assets/img/右遮罩.png);
margin-top: -800px;
display: flex;
justify-content: space-between;

View File

@ -765,6 +765,7 @@ export default {
height: 100%;
box-sizing: border-box;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
display: flex;
padding-top: 400px;
justify-content: space-between;

View File

@ -695,6 +695,7 @@ export default {
height: 100%;
box-sizing: border-box;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
display: flex;
padding-top: 400px;
justify-content: space-between;

View File

@ -288,6 +288,7 @@ export default {
box-sizing: border-box;
display: flex;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png);
justify-content: space-between;
.left {

View File

@ -495,6 +495,7 @@ export default {
display: flex;
justify-content: space-between;
background-color: transparent;
background-image: url(../../assets/img/左遮罩.png), url(../../assets/img/右遮罩.png);
position: relative;
.a {