xuziqiang
4 months ago
21 changed files with 1139 additions and 873 deletions
@ -0,0 +1,20 @@ |
|||||
|
|
||||
|
// 照明系统及相关接口
|
||||
|
export enum lightingManage { |
||||
|
|
||||
|
// 主页 ========================================================
|
||||
|
|
||||
|
// 获得分区与线路
|
||||
|
getArea = '/carbon-smart/IlluminationInfo/region', |
||||
|
// 修改线路的可用/禁用状态
|
||||
|
setDisable = '/carbon-smart/IlluminationInfo/revisePanel', |
||||
|
|
||||
|
// 计划列表tab页 ================================================
|
||||
|
|
||||
|
// 获得计划列表tab页的表格数据
|
||||
|
getPlanTable = '/carbon-smart/IlluminationPlan/selectPanelPlan', |
||||
|
// 获得计划列表tab页的穿梭框左侧数据
|
||||
|
getLeftPlan = '/carbon-smart/IlluminationPlan/getPlan', |
||||
|
// 提交穿梭框被选择的数据
|
||||
|
submitLeftPlan = '/carbon-smart/IlluminationPlan/joinPlan', |
||||
|
} |
||||
@ -0,0 +1,10 @@ |
|||||
|
<template> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<script lang="ts" setup> |
||||
|
</script> |
||||
|
|
||||
|
<style lang="less" scoped> |
||||
|
|
||||
|
</style> |
||||
@ -0,0 +1,439 @@ |
|||||
|
// 抽屉 |
||||
|
.drawer-item { |
||||
|
|
||||
|
.light-area, |
||||
|
.circuit-area, |
||||
|
.control-area, |
||||
|
.control-scene-area, |
||||
|
.light-parameters-area { |
||||
|
width: 100%; |
||||
|
margin-top: 20px; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
.light-area-tab, |
||||
|
.circuit-tab, |
||||
|
.control-tab, |
||||
|
.control-scene-tab, |
||||
|
.light-parameters-tab { |
||||
|
width: 5px; |
||||
|
height: 23px; |
||||
|
opacity: 1; |
||||
|
background: rgba(26, 174, 251, 1); |
||||
|
margin-right: 4px; |
||||
|
} |
||||
|
|
||||
|
.light-area-text, |
||||
|
.circuit-text, |
||||
|
.control-text, |
||||
|
.control-scene-text, |
||||
|
.light-parameters-text { |
||||
|
font-size: 14px; |
||||
|
color: white; |
||||
|
padding-left: 5px; |
||||
|
line-height: 23px; |
||||
|
width: 110px; |
||||
|
height: 23px; |
||||
|
background: linear-gradient(270deg, rgba(86, 221, 253, 0) 0%, rgba(25, 176, 255, 1) 100%); |
||||
|
user-select: none; |
||||
|
} |
||||
|
|
||||
|
.light-area-tab, |
||||
|
.light-area-text { |
||||
|
display: inline-block; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
|
||||
|
.plan.enabled { |
||||
|
border: none; |
||||
|
font-size: 14px; |
||||
|
font-weight: 400; |
||||
|
border-radius: 5px; |
||||
|
vertical-align: top; |
||||
|
margin-left: 235px; |
||||
|
width: 88px; |
||||
|
height: 32px; |
||||
|
background: linear-gradient(180deg, rgba(103, 222, 0, 1) 0%, rgba(0, 181, 6, 1) 100%); |
||||
|
color: white; |
||||
|
} |
||||
|
|
||||
|
.plan.disabled { |
||||
|
border: none; |
||||
|
font-size: 14px; |
||||
|
font-weight: 400; |
||||
|
border-radius: 5px; |
||||
|
color: white; |
||||
|
vertical-align: top; |
||||
|
margin-left: 235px; |
||||
|
width: 88px; |
||||
|
height: 32px; |
||||
|
background-color: red; |
||||
|
} |
||||
|
|
||||
|
.plan:disabled { |
||||
|
cursor: not-allowed; |
||||
|
} |
||||
|
|
||||
|
.openPlan.enabled2 { |
||||
|
border: none; |
||||
|
font-size: 14px; |
||||
|
font-weight: 400; |
||||
|
border-radius: 5px; |
||||
|
color: white; |
||||
|
vertical-align: top; |
||||
|
width: 88px; |
||||
|
height: 32px; |
||||
|
background: linear-gradient(180deg, rgba(103, 222, 0, 1) 0%, rgba(0, 181, 6, 1) 100%); |
||||
|
color: white; |
||||
|
} |
||||
|
|
||||
|
.openPlan.disabled2 { |
||||
|
border: none; |
||||
|
font-size: 14px; |
||||
|
font-weight: 400; |
||||
|
border-radius: 5px; |
||||
|
color: white; |
||||
|
vertical-align: top; |
||||
|
width: 88px; |
||||
|
height: 32px; |
||||
|
background-color: red; |
||||
|
} |
||||
|
|
||||
|
.openPlan:disabled { |
||||
|
cursor: not-allowed; |
||||
|
} |
||||
|
|
||||
|
.btn2 { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
margin-left: 80px; |
||||
|
} |
||||
|
|
||||
|
.openzm { |
||||
|
cursor: pointer; |
||||
|
color: rgba(34, 183, 255, 1); |
||||
|
margin-left: 20px; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
.custom-checkbox { |
||||
|
width: 13px; |
||||
|
height: 13px; |
||||
|
} |
||||
|
|
||||
|
.both { |
||||
|
width: 59.79px; |
||||
|
height: 32px; |
||||
|
opacity: 1; |
||||
|
background: linear-gradient(180deg, |
||||
|
rgba(255, 187, 0, 1) 0%, |
||||
|
rgba(255, 112, 3, 1) 91.21%, |
||||
|
rgba(255, 129, 3, 1) 100%); |
||||
|
margin-left: 8px; |
||||
|
font-size: 12px; |
||||
|
color: white; |
||||
|
border: none; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
.btn2 { |
||||
|
button { |
||||
|
margin: 0 5px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.allBtn { |
||||
|
border: 0; |
||||
|
width: 40px; |
||||
|
color: white; |
||||
|
background-color: transparent; |
||||
|
} |
||||
|
|
||||
|
.blue-background.ant-switch-checked { |
||||
|
background-color: linear-gradient(180deg, |
||||
|
rgba(1, 206, 255, 1) 0%, |
||||
|
rgba(0, 150, 229, 1) 100%) !important; |
||||
|
} |
||||
|
|
||||
|
.grey-background.ant-switch { |
||||
|
background-color: grey !important; |
||||
|
} |
||||
|
|
||||
|
.blue-background.ant-switch-checked .ant-switch-handle { |
||||
|
background-color: linear-gradient(180deg, |
||||
|
rgba(1, 206, 255, 1) 0%, |
||||
|
rgba(0, 150, 229, 1) 100%) !important; |
||||
|
} |
||||
|
|
||||
|
.grey-background.ant-switch .ant-switch-handle { |
||||
|
background-color: grey !important; |
||||
|
} |
||||
|
|
||||
|
p { |
||||
|
color: white; |
||||
|
} |
||||
|
|
||||
|
.area, |
||||
|
.btnArea, |
||||
|
.control-mode-btn-area, |
||||
|
.control-scene-btn-area { |
||||
|
margin-left: -17px; |
||||
|
|
||||
|
button { |
||||
|
width: 21%; |
||||
|
padding: 0 2%; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.btn { |
||||
|
width: 92px; |
||||
|
height: 40px; |
||||
|
border-radius: 4px; |
||||
|
opacity: 1; |
||||
|
margin-top: 10px; |
||||
|
margin-left: 17px; |
||||
|
font-size: 14px; |
||||
|
font-weight: 400; |
||||
|
opacity: 1; |
||||
|
border: 1px solid rgba(207, 212, 219, 1); |
||||
|
line-height: 20.27px; |
||||
|
color: white; |
||||
|
text-align: center; |
||||
|
vertical-align: top; |
||||
|
background-color: rgba(255, 255, 255, 0.1); |
||||
|
} |
||||
|
|
||||
|
.selected { |
||||
|
background: linear-gradient(180deg, rgba(201, 245, 255, 1) 0%, rgba(138, 215, 255, 1) 100%); |
||||
|
color: rgba(0, 61, 90, 1); |
||||
|
border: 1px solid white; |
||||
|
} |
||||
|
|
||||
|
.btn:hover { |
||||
|
background-color: rgba(207, 212, 219, 1); |
||||
|
} |
||||
|
|
||||
|
.btn:active { |
||||
|
background-color: rgba(102, 102, 102, 1); |
||||
|
color: white; |
||||
|
} |
||||
|
|
||||
|
.circuit-area, |
||||
|
.control-scene-area, |
||||
|
.light-parameters-area { |
||||
|
left: 51px; |
||||
|
width: 100%; |
||||
|
margin-top: 20px; |
||||
|
} |
||||
|
|
||||
|
.circuit-tab, |
||||
|
.circuit-text { |
||||
|
display: inline-block; |
||||
|
} |
||||
|
|
||||
|
.batch { |
||||
|
width: 60px; |
||||
|
height: 32px; |
||||
|
opacity: 1; |
||||
|
border: 1px solid rgba(67, 136, 251, 1); |
||||
|
color: rgba(67, 136, 251, 1); |
||||
|
border-radius: 5px; |
||||
|
background-color: white; |
||||
|
margin-left: 11px; |
||||
|
} |
||||
|
|
||||
|
.control-area { |
||||
|
left: 51px; |
||||
|
width: 100%; |
||||
|
margin-top: 20px; |
||||
|
} |
||||
|
|
||||
|
.control-tab, |
||||
|
.control-text { |
||||
|
display: inline-block; |
||||
|
} |
||||
|
|
||||
|
:deep(.cell) { |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
:deep(#pane-first) { |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.control-scene-tab, |
||||
|
.control-scene-text { |
||||
|
display: inline-block; |
||||
|
} |
||||
|
|
||||
|
.light-parameters-tab, |
||||
|
.light-parameters-text { |
||||
|
display: inline-block; |
||||
|
} |
||||
|
|
||||
|
.light-parameters-textarea>p { |
||||
|
height: 100%; |
||||
|
display: flex; |
||||
|
border: 1px solid rgba(236, 239, 245, 1); |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
.bottom { |
||||
|
width: 100%; |
||||
|
height: 64px; |
||||
|
display: flex; |
||||
|
justify-content: flex-end; |
||||
|
align-items: center; |
||||
|
position: fixed; |
||||
|
bottom: 0; |
||||
|
right: 0; |
||||
|
} |
||||
|
|
||||
|
.execute { |
||||
|
margin-right: 20px; |
||||
|
width: 74px; |
||||
|
height: 40px; |
||||
|
opacity: 1; |
||||
|
cursor: pointer; |
||||
|
border-radius: 4px; |
||||
|
background: rgba(67, 136, 251, 1); |
||||
|
font-size: 14px; |
||||
|
font-weight: 400; |
||||
|
color: white; |
||||
|
border: 0; |
||||
|
margin: 0 10px; |
||||
|
} |
||||
|
|
||||
|
.flushed { |
||||
|
width: 74px; |
||||
|
height: 40px; |
||||
|
cursor: pointer; |
||||
|
opacity: 1; |
||||
|
border-radius: 4px; |
||||
|
font-size: 14px; |
||||
|
font-weight: 400; |
||||
|
color: rgba(102, 102, 102, 1); |
||||
|
background: white; |
||||
|
border: 1px solid rgba(193, 197, 204, 1); |
||||
|
margin: 0 10px; |
||||
|
} |
||||
|
|
||||
|
:deep(.ant-table-pagination) { |
||||
|
visibility: hidden; |
||||
|
} |
||||
|
|
||||
|
.drawer-content { |
||||
|
margin-left: 20px; |
||||
|
} |
||||
|
|
||||
|
.arrow-indicator { |
||||
|
position: absolute; |
||||
|
top: 50%; |
||||
|
left: 0; |
||||
|
transform: translateY(-50%); |
||||
|
z-index: 1; |
||||
|
} |
||||
|
|
||||
|
.drawer-title1 { |
||||
|
position: fixed; |
||||
|
width: 33px; |
||||
|
height: 33px; |
||||
|
top: 0; |
||||
|
bottom: 0; |
||||
|
right: 20px; |
||||
|
margin: auto; |
||||
|
z-index: 99999; |
||||
|
} |
||||
|
|
||||
|
.drawer-title2 { |
||||
|
position: fixed; |
||||
|
width: 33px; |
||||
|
height: 33px; |
||||
|
top: 0; |
||||
|
bottom: 0; |
||||
|
right: 495px; |
||||
|
margin: auto; |
||||
|
z-index: 99999; |
||||
|
} |
||||
|
|
||||
|
.arrowbtn { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
width: 28px; |
||||
|
height: 28px; |
||||
|
background: rgba(0, 0, 0, 1); |
||||
|
opacity: 0.5; |
||||
|
border: none; |
||||
|
} |
||||
|
|
||||
|
:deep(.ant-tabs-tab-btn) { |
||||
|
color: white; |
||||
|
} |
||||
|
|
||||
|
:deep(.ant-table) { |
||||
|
background-color: transparent; |
||||
|
} |
||||
|
|
||||
|
:deep(.ant-table-bordered) { |
||||
|
background-color: transparent; |
||||
|
} |
||||
|
|
||||
|
:deep(.ant-table-thead) { |
||||
|
background-color: transparent; |
||||
|
} |
||||
|
|
||||
|
:deep(.ant-table-cell) { |
||||
|
background-color: transparent; |
||||
|
color: #fff; |
||||
|
} |
||||
|
|
||||
|
.custom-table { |
||||
|
border-collapse: collapse; |
||||
|
width: 416px; |
||||
|
height: 60px; |
||||
|
color: rgba(255, 255, 255, 1); |
||||
|
} |
||||
|
|
||||
|
.custom-table th, |
||||
|
.custom-table td { |
||||
|
border: 1px solid rgba(163, 192, 243, 1); |
||||
|
text-align: left; |
||||
|
padding: 8px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.table1 { |
||||
|
margin-top: 20px; |
||||
|
width: 100%; |
||||
|
cellspacing: 0; |
||||
|
cellpadding: 0; |
||||
|
border: 1px solid rgba(255, 255, 255); |
||||
|
border-radius: 5px; |
||||
|
background: rgba(255, 255, 255, 0.1); |
||||
|
} |
||||
|
|
||||
|
.light-area, |
||||
|
.circuit-area, |
||||
|
.control-area, |
||||
|
.control-scene-area, |
||||
|
.light-parameters-area { |
||||
|
width: 100%; |
||||
|
margin-top: 20px; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
.zmhlbtn { |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
// 禁用图标 |
||||
|
.anticon-stop { |
||||
|
position: absolute; |
||||
|
right: 3px; |
||||
|
bottom: 3px; |
||||
|
} |
||||
|
} |
||||
Loading…
Reference in new issue