feat:照明
This commit is contained in:
lushihan
@@ -0,0 +1,952 @@
|
||||
<style lang="less" scoped>
|
||||
:deep(.ant-transfer-list-content-item:not(.ant-transfer-list-content-item-disabled):hover){
|
||||
background-color: rgba(20,41,76,1);
|
||||
color:rgb(29, 83, 172)
|
||||
}
|
||||
:global(.ant-transfer-list-header-selected) {
|
||||
color: rgba(255, 83, 0)
|
||||
}
|
||||
|
||||
:global(.ant-transfer-list-header > *:not(:last-child)) {
|
||||
color: rgba(255, 83, 0)
|
||||
}
|
||||
|
||||
.tagtext {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.light-tag {
|
||||
position: fixed;
|
||||
bottom: 135px;
|
||||
left: 450px;
|
||||
width: 396px;
|
||||
height: 200px;
|
||||
opacity: 0.8;
|
||||
border-radius: 8px;
|
||||
background: rgba(0, 0, 0, 1);
|
||||
}
|
||||
|
||||
.light-tag-tit {
|
||||
display: flex;
|
||||
margin-top: 18px;
|
||||
margin-left: 18px;
|
||||
}
|
||||
|
||||
.light-tag-box {
|
||||
padding: 15px 15px;
|
||||
}
|
||||
|
||||
.light-tag-box>img {
|
||||
width: 120px;
|
||||
height: 51px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.light-tag-box>span {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.titleimg,
|
||||
.titletext {
|
||||
display: inline-block;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.control-btn,
|
||||
.light-btn {
|
||||
display: inline-block;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.controlarea-btn,
|
||||
.temp-btn {
|
||||
display: inline-block;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
:global(.ant-drawer-content) {
|
||||
background-color: rgba(0, 0, 0, 1);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
:global(.ant-modal-content) {
|
||||
background-color: rgba(0, 0, 0, 1);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
:deep(.ant-transfer-list) {
|
||||
width: 230px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
:deep(.ant-transfer-list-header) {
|
||||
background-color: rgba(0, 0, 0, 1);
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.bulbLogo1 {
|
||||
margin-top: 40%;
|
||||
margin-left: 12%;
|
||||
}
|
||||
|
||||
.bulbLogo2 {
|
||||
margin-top: 35%;
|
||||
margin-left: 20%;
|
||||
}
|
||||
|
||||
.bulbLogo3 {
|
||||
margin-top: 23%;
|
||||
margin-left: 10%;
|
||||
}
|
||||
|
||||
.bulbLogo4 {
|
||||
margin-top: 10%;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.bulbLogo5 {
|
||||
margin-top: 8%;
|
||||
margin-left: 13%;
|
||||
}
|
||||
|
||||
.bulbLogo6 {
|
||||
margin-top: 8%;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.bulbLogo7 {
|
||||
margin-top: 0%;
|
||||
margin-left: 12%;
|
||||
}
|
||||
|
||||
.bulbLogo9 {
|
||||
margin-top: 35%;
|
||||
margin-left: 20%;
|
||||
}
|
||||
|
||||
.bulbLogo10 {
|
||||
margin-top: 35%;
|
||||
margin-left: 20%;
|
||||
}
|
||||
|
||||
.bulbLogo11 {
|
||||
margin-top: 35%;
|
||||
margin-left: 20%;
|
||||
}
|
||||
|
||||
.bulbLogo12 {
|
||||
margin-top: 35%;
|
||||
margin-left: 20%;
|
||||
}
|
||||
|
||||
.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);
|
||||
}
|
||||
|
||||
.lightarea,
|
||||
.circuitarea,
|
||||
.controlarea,
|
||||
.controlscenearea,
|
||||
.lightparametersarea {
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lightareatab,
|
||||
.circuittab,
|
||||
.controltab,
|
||||
.controlscenetab,
|
||||
.lightparameterstab {
|
||||
width: 5px;
|
||||
height: 23px;
|
||||
opacity: 1;
|
||||
background: rgba(26, 174, 251, 1);
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.lightareatext,
|
||||
.circuittext,
|
||||
.controltext,
|
||||
.controlscenetext,
|
||||
.lightparameterstext {
|
||||
font-size: 14px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
line-height: 19px;
|
||||
width: 110px;
|
||||
height: 23px;
|
||||
opacity: 1;
|
||||
background: linear-gradient(270deg,
|
||||
rgba(86, 221, 253, 0) 0%,
|
||||
rgba(25, 176, 255, 1) 100%);
|
||||
}
|
||||
|
||||
.lightareatab,
|
||||
.lightareatext {
|
||||
display: inline-block;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.plan.enabled {
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
border-radius: 5px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
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: rgba(255, 255, 255, 1);
|
||||
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: rgba(255, 255, 255, 1);
|
||||
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: rgba(255, 255, 255, 1);
|
||||
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 {
|
||||
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: rgba(255, 255, 255, 1);
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.btn2 {
|
||||
button {
|
||||
margin: 0 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.allbtn {
|
||||
border: 0;
|
||||
width: 40px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
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: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.area,
|
||||
.btnarea,
|
||||
.controlmodebtnarea,
|
||||
.controlscenebtnarea {
|
||||
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: rgba(255, 255, 255, 1);
|
||||
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 rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background-color: rgba(207, 212, 219, 1);
|
||||
}
|
||||
|
||||
.btn:active {
|
||||
background-color: rgba(102, 102, 102, 1);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.circuitarea,
|
||||
.controlscenearea,
|
||||
.lightparametersarea {
|
||||
left: 51px;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.circuittab,
|
||||
.circuittext {
|
||||
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: rgba(255, 255, 255, 1);
|
||||
margin-left: 11px;
|
||||
}
|
||||
|
||||
.controlarea {
|
||||
left: 51px;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.controltab,
|
||||
.controltext {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
:deep(.cell) {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
:deep(#pane-first) {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.controlscenetab,
|
||||
.controlscenetext {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.lightparameterstab,
|
||||
.lightparameterstext {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
||||
.lightparameterstextarea>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;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.execute {
|
||||
margin-right: 20px;
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
background: rgba(67, 136, 251, 1);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
border: 0;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.flushed {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(102, 102, 102, 1);
|
||||
background: rgba(255, 255, 255, 1);
|
||||
border: 1px solid rgba(193, 197, 204, 1);
|
||||
}
|
||||
|
||||
.tabreboot,
|
||||
.tabdelete {
|
||||
border: none;
|
||||
background-color: rgba(0,0,0,0);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0;
|
||||
line-height: 20px;
|
||||
color: rgba(67, 136, 251, 1);
|
||||
}
|
||||
|
||||
.tabreboot {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.add {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
background: rgba(67, 136, 251, 1);
|
||||
border: rgba(67, 136, 251, 1);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.divadd {
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin-bottom: 10px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.atable {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
: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;
|
||||
}
|
||||
.lighting-img-box {
|
||||
width: 100%;
|
||||
max-height: calc(100% - 79px);
|
||||
}
|
||||
.lighting-img-box>img {
|
||||
width: 100%;
|
||||
height: calc(100vh - 96px);
|
||||
object-fit: cover;
|
||||
}
|
||||
.F1 {
|
||||
width: 120px;
|
||||
height: 50.72px;
|
||||
border-radius: 4px;
|
||||
background: rgba(39, 120, 255, 1);
|
||||
border: 1px solid rgba(51, 199, 255, 1);
|
||||
box-shadow: 0px 10px 15px rgba(0, 54, 136, 0.3);
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
.F2,
|
||||
.platform {
|
||||
width: 120px;
|
||||
height: 50.72px;
|
||||
border-radius: 4px;
|
||||
background: rgba(7, 72, 116, 1);
|
||||
box-shadow: 0px 10px 15px rgba(0, 54, 136, 0.3);
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: rgba(146, 187, 255, 1);
|
||||
border: 1px solid rgba(39, 120, 255, 1);
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
position: fixed;
|
||||
top: 100px;
|
||||
left: 250px;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.wh100 {
|
||||
width: 38px;
|
||||
height: calc(38px + 19px);
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo1 {
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
left: 10%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo2 {
|
||||
position: absolute;
|
||||
top: 9%;
|
||||
left: 15%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo3 {
|
||||
position: absolute;
|
||||
top: 34%;
|
||||
left: 25%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo4 {
|
||||
position: absolute;
|
||||
top: 45%;
|
||||
left: 30%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo5 {
|
||||
position: absolute;
|
||||
top: 45%;
|
||||
left: 30%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo6 {
|
||||
position: absolute;
|
||||
top: 55%;
|
||||
left: 30%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo7 {
|
||||
position: absolute;
|
||||
top: 60%;
|
||||
left: 40%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo8 {
|
||||
position: absolute;
|
||||
top: 55%;
|
||||
left: 70%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo9 {
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
left: 60%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo10 {
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
left: 40%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo11 {
|
||||
position: absolute;
|
||||
top: 15%;
|
||||
left: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo12 {
|
||||
position: absolute;
|
||||
top: 15%;
|
||||
left: 60%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo13 {
|
||||
position: absolute;
|
||||
top: 55%;
|
||||
left: 70%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo14 {
|
||||
position: absolute;
|
||||
top: 45%;
|
||||
left: 60%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo15 {
|
||||
position: absolute;
|
||||
top: 45%;
|
||||
left: 80%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lighting-img-box>.bulbBox>.bulbLogo16 {
|
||||
position: absolute;
|
||||
top: 45%;
|
||||
left: 90%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.editable-cell {
|
||||
position: relative;
|
||||
|
||||
.editable-cell-input-wrapper,
|
||||
.editable-cell-text-wrapper {
|
||||
padding-right: 24px;
|
||||
}
|
||||
|
||||
.editable-cell-text-wrapper {
|
||||
padding: 5px 24px 5px 5px;
|
||||
}
|
||||
|
||||
.editable-cell-icon,
|
||||
.editable-cell-icon-check {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
width: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.editable-cell-icon {
|
||||
margin-top: 4px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.editable-cell-icon-check {
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
.editable-cell-icon:hover,
|
||||
.editable-cell-icon-check:hover {
|
||||
color: #108ee9;
|
||||
}
|
||||
|
||||
.editable-add-btn {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.editable-cell:hover .editable-cell-icon {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.div-operation {
|
||||
width: 3px;
|
||||
height: 13px;
|
||||
opacity: 1;
|
||||
border-radius: 1px;
|
||||
background: rgba(67, 136, 251, 1);
|
||||
}
|
||||
|
||||
.text-operation {
|
||||
color: rgba(255, 255, 255, 1);
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.div-operation,
|
||||
.text-operation {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.jbox {
|
||||
background-color: #000;
|
||||
opacity: 1;
|
||||
z-index: 99999;
|
||||
}
|
||||
|
||||
.journal {
|
||||
padding: 3% 5%;
|
||||
background-size: 450px 177px;
|
||||
width: 482px;
|
||||
height: 177px;
|
||||
background-color: rgba(0, 0, 0);
|
||||
border-radius: 12px;
|
||||
border: 2px solid transparent;
|
||||
border-image: linear-gradient(to bottom, #0077FF, #00F6FF, #000000) 1;
|
||||
}
|
||||
|
||||
.imgText {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.ztzm {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cxbtn {
|
||||
color: rgba(255, 255, 255, 1);
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
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%);
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-modal-content) {
|
||||
width: 555px;
|
||||
height: 792px;
|
||||
}
|
||||
|
||||
:deep(.ant-modal-body) {
|
||||
width: 555px;
|
||||
max-height: 792px !important;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.text-change {
|
||||
text-align: center;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.excuno {
|
||||
width: 150px;
|
||||
height: 40px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.excuok {
|
||||
width: 150px;
|
||||
height: 40px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.excubtn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.addok {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
background: rgba(67, 136, 251, 1);
|
||||
border: rgba(67, 136, 251, 1);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
margin-top: 440px;
|
||||
margin-left: 350px;
|
||||
}
|
||||
|
||||
.zmhlbtn {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.anticon-stop {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
bottom: 3px;
|
||||
}
|
||||
|
||||
.istrindex {
|
||||
background: rgba(67, 136, 251, 1);
|
||||
}
|
||||
|
||||
:deep(.ant-modal-mask.ant-modal-content) {
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
right: 496px;
|
||||
top: 0%;
|
||||
}
|
||||
:global(.ant-modal-content) {
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
right: 500px;
|
||||
}
|
||||
</style>
|
||||
@@ -100,13 +100,11 @@
|
||||
@click="togglePlan2">
|
||||
{{ isPlanEnabled2 ? "启用面板" : "禁用面板" }}
|
||||
</button>
|
||||
<!-- <button >启用面板</button> -->
|
||||
<a-switch v-model:checked="selectAllCheckbox" :class="{
|
||||
'blue-background': selectAllCheckbox,
|
||||
'grey-background': !selectAllCheckbox,
|
||||
}" @change="toggleAllSelection" />
|
||||
<button @click="allbtn1" class="allbtn">全选</button>
|
||||
<!-- <button v-if="!allbtnB" class="allbtn"></button> -->
|
||||
<button @click="allbtn1" class="allbtn">全选</button>
|
||||
<button class="both" @click="selectAll">
|
||||
{{ isAllchoose ? "多选" : "单选" }}
|
||||
</button>
|
||||
@@ -432,7 +430,6 @@
|
||||
:style="{ color: 'rgba(255,255,255,1)' }" @search="handleSearch"
|
||||
:listStyle="{ border: '2px solid rgba(25,74,125,1)' }" />
|
||||
</div>
|
||||
<!-- <button class="addok" @click="addhandleOk">确定</button> -->
|
||||
</a-modal>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="日志">
|
||||
@@ -788,11 +785,12 @@ const bulbs = ref([
|
||||
|
||||
// 照明区域按钮单选
|
||||
const isPlanEnabled = ref(true); // 初始状态是启用
|
||||
// 启用面板
|
||||
const togglePlan = () => {
|
||||
isPlanEnabled.value = !isPlanEnabled.value;
|
||||
};
|
||||
const showAllButtonsarea = ref(false);
|
||||
|
||||
// 最多展示八个按钮
|
||||
const buttons1 = computed(() => buttons.value.slice(0, 8));
|
||||
const buttons = ref([
|
||||
{ label: "A区", selected: false, id: 1 },
|
||||
@@ -825,7 +823,6 @@ let singleSelection = ref(true); // 默认为单选
|
||||
const selectAllCheckbox = ref(false);
|
||||
const showControlMode = ref(false);
|
||||
const showAllButtons = ref(false);
|
||||
const zmhldis = ref(false);
|
||||
// 默认展示八个
|
||||
const limitedButtons = computed(() => buttons2.value.slice(0, 8));
|
||||
const buttons2 = ref([
|
||||
@@ -857,9 +854,6 @@ const togglePlan2 = () => {
|
||||
}
|
||||
}
|
||||
};
|
||||
//多选按钮 隐藏显示
|
||||
// const allbtnB = ref(false);
|
||||
|
||||
const selectAll = () => {
|
||||
if (isAllchoose.value === false) {
|
||||
isPlanEnabled2.value = limitedButtons.value[0].zmhld;
|
||||
@@ -870,16 +864,13 @@ const selectAll = () => {
|
||||
// 单选
|
||||
buttons2.value.forEach((button) => {
|
||||
button.selected = false;
|
||||
// allbtnB.value = false;
|
||||
});
|
||||
} else {
|
||||
// 多选
|
||||
buttons2.value.forEach((button) => {
|
||||
button.selected = true;
|
||||
// allbtnB.value = true;
|
||||
});
|
||||
}
|
||||
|
||||
selectAllCheckbox.value = !singleSelection.value; // 更新全选开关的状态
|
||||
};
|
||||
const allbtn1 = () => {
|
||||
@@ -1018,15 +1009,10 @@ const handlerefClick1 = () => {
|
||||
executevisible.value = true;
|
||||
};
|
||||
|
||||
// const closeModal = () => {
|
||||
// executevisible.value = false;
|
||||
// };
|
||||
|
||||
let trindex = ref("-1");
|
||||
const handleRowClick = (index: any) => {
|
||||
trindex.value = index;
|
||||
// 处理行点击事件，例如选中行或者其他操作
|
||||
// console.log("=================", index);
|
||||
if (index === trindex.value) {
|
||||
console.log("tri");
|
||||
}
|
||||
@@ -1079,10 +1065,6 @@ const handleChange = (keys: string[], direction: string, moveKeys: string[]) =>
|
||||
const handleSearch = (dir: string, value: string) => {
|
||||
console.log("search:", dir, value);
|
||||
};
|
||||
// const addhandleOk = (e: MouseEvent) => {
|
||||
// console.log(e);
|
||||
// addvisible.value = false;
|
||||
// };
|
||||
|
||||
//撤销
|
||||
const delbtn = (id: any) => {
|
||||
@@ -1095,7 +1077,6 @@ const delbtn = (id: any) => {
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
:deep(.ant-transfer-list-content-item:not(.ant-transfer-list-content-item-disabled):hover){
|
||||
background-color: rgba(20,41,76,1);
|
||||
@@ -1122,8 +1103,6 @@ const delbtn = (id: any) => {
|
||||
opacity: 0.8;
|
||||
border-radius: 8px;
|
||||
background: rgba(0, 0, 0, 1);
|
||||
// border:5px solid rebeccapurple;
|
||||
|
||||
}
|
||||
|
||||
.light-tag-tit {
|
||||
@@ -1539,13 +1518,6 @@ p {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
// .lightparameterstextarea {
|
||||
// border: 1px solid rgba(236, 239, 245, 1);
|
||||
// margin-top: 10px;
|
||||
// display: grid;
|
||||
// grid-template-columns: 1fr 1fr 1fr;
|
||||
// grid-template-rows: 1fr 1fr;
|
||||
// }
|
||||
|
||||
.lightparameterstextarea>p {
|
||||
height: 100%;
|
||||
@@ -1643,7 +1615,6 @@ p {
|
||||
|
||||
.drawer-content {
|
||||
margin-left: 20px;
|
||||
/* 留出空间给小箭头 */
|
||||
}
|
||||
|
||||
.arrow-indicator {
|
||||
@@ -1652,7 +1623,6 @@ p {
|
||||
left: 0;
|
||||
transform: translateY(-50%);
|
||||
z-index: 1;
|
||||
/* 控制箭头显示在最上层 */
|
||||
}
|
||||
|
||||
.drawer-title1 {
|
||||
@@ -1679,11 +1649,8 @@ p {
|
||||
|
||||
.arrowbtn {
|
||||
display: flex;
|
||||
/* 使用 flex 布局 */
|
||||
justify-content: center;
|
||||
/* 水平居中 */
|
||||
align-items: center;
|
||||
/* 垂直居中 */
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
background: rgba(0, 0, 0, 1);
|
||||
@@ -1693,7 +1660,6 @@ p {
|
||||
|
||||
:deep(.ant-tabs-tab-btn) {
|
||||
color: white;
|
||||
/* 背景颜色改为白色 */
|
||||
}
|
||||
|
||||
:deep(.ant-table) {
|
||||
@@ -1712,18 +1678,15 @@ p {
|
||||
background-color: transparent;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.lighting-img-box {
|
||||
width: 100%;
|
||||
max-height: calc(100% - 79px);
|
||||
}
|
||||
|
||||
.lighting-img-box>img {
|
||||
width: 100%;
|
||||
height: calc(100vh - 96px);
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.F1 {
|
||||
width: 120px;
|
||||
height: 50.72px;
|
||||
@@ -1735,7 +1698,6 @@ p {
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.F2,
|
||||
.platform {
|
||||
width: 120px;
|
||||
@@ -1965,25 +1927,10 @@ p {
|
||||
height: 177px;
|
||||
background-color: rgba(0, 0, 0);
|
||||
border-radius: 12px;
|
||||
/* 圆角边框 */
|
||||
border: 2px solid transparent;
|
||||
/* 边框为2px宽，透明颜色 */
|
||||
border-image: linear-gradient(to bottom, #0077FF, #00F6FF, #000000) 1;
|
||||
}
|
||||
|
||||
// .gird22 {
|
||||
// display: grid;
|
||||
// grid-template-columns: repeat(2, 1fr);
|
||||
// grid-template-rows: repeat(2, 1fr);
|
||||
// grid-column-gap: 15px;
|
||||
// grid-row-gap: 10px;
|
||||
// margin-top: 10px;
|
||||
// }
|
||||
|
||||
// .bulbLogo1 {
|
||||
// background-image: url("/asset/t/image/bulbLogo/bulbLogo1.png");
|
||||
// }
|
||||
|
||||
.imgText {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -1995,7 +1942,6 @@ p {
|
||||
}
|
||||
|
||||
.cxbtn {
|
||||
// width:80px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
@@ -2069,7 +2015,6 @@ p {
|
||||
|
||||
.istrindex {
|
||||
background: rgba(67, 136, 251, 1);
|
||||
// font-size: 36px;
|
||||
}
|
||||
|
||||
:deep(.ant-modal-mask.ant-modal-content) {
|
||||
@@ -2078,16 +2023,10 @@ p {
|
||||
right: 496px;
|
||||
top: 0%;
|
||||
}
|
||||
|
||||
// :global(.ant-tabs-tab-active) {
|
||||
// color: blue !important;
|
||||
// }
|
||||
// .ant-tabs-tab:hover {
|
||||
// color: blue !important;
|
||||
// }
|
||||
:global(.ant-modal-content) {
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
right: 500px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user