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