|
|
@ -30,28 +30,24 @@ |
|
|
|
fontWeight: 400, |
|
|
|
lineHeight: ' 17.38px', |
|
|
|
color: 'rgba(57, 215, 187, 1)', |
|
|
|
marginLeft:'180px' |
|
|
|
marginLeft: '180px' |
|
|
|
}">正常</button> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="light-tag-box"> |
|
|
|
|
|
|
|
|
|
|
|
<img src="/asset/image//bulbLogo/22496.png" alt=""> |
|
|
|
<span :style="{ color: 'rgba(64, 255, 252, 1)',marginLeft: '-60px', marginRight: '20px' }">控制模式</span> |
|
|
|
<span :style="{ color: 'rgba(64, 255, 252, 1)', marginLeft: '-60px', marginRight: '20px' }">控制模式</span> |
|
|
|
<span |
|
|
|
:style="{ color: 'rgba(255, 255, 255, 1)', fontSize: '16px', fontWeight: '700', marginRight: '20px' }">自动</span> |
|
|
|
<img src="/asset/image//bulbLogo/22546.png" alt=""> |
|
|
|
<span :style="{ color: 'rgba(64, 255, 252, 1)',marginLeft: '-60px' }">亮度</span> |
|
|
|
<span :style="{ color: 'rgba(64, 255, 252, 1)', marginLeft: '-60px' }">亮度</span> |
|
|
|
<span |
|
|
|
:style="{ color: 'rgba(255, 255, 255, 1)', fontSize: '16px', fontWeight: '700', marginLeft: '20px' }">1000lux</span> |
|
|
|
<img src="/asset/image//bulbLogo/22554.png" alt=""> |
|
|
|
<span :style="{ color: 'rgba(64, 255, 252, 1)',marginLeft: '-60px', marginRight: '20px' }">控制场景</span> |
|
|
|
<span :style="{ color: 'rgba(64, 255, 252, 1)', marginLeft: '-60px', marginRight: '20px' }">控制场景</span> |
|
|
|
<span |
|
|
|
:style="{ color: 'rgba(255, 255, 255, 1)', fontSize: '16px', fontWeight: '700', marginRight: '20px' }">舒适</span> |
|
|
|
<img src="/asset/image//bulbLogo/22553.png" alt=""> |
|
|
|
<span :style="{ color: 'rgba(64, 255, 252, 1)',marginLeft: '-60px' }">色温</span> |
|
|
|
<span :style="{ color: 'rgba(64, 255, 252, 1)', marginLeft: '-60px' }">色温</span> |
|
|
|
<span |
|
|
|
:style="{ color: 'rgba(255, 255, 255, 1)', fontSize: '16px', fontWeight: '700', marginLeft: '20px' }">4200k</span> |
|
|
|
</div> |
|
|
@ -116,7 +112,6 @@ |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="btnarea" v-if="selectedButton"> |
|
|
|
<template v-if="!showAllButtons"> |
|
|
|
<button v-for="(button2, index) in limitedButtons" :key="index" |
|
|
@ -197,21 +192,21 @@ |
|
|
|
<button class="flushed" @click="refresh">刷新</button> |
|
|
|
<button class="execute" @click="showModal">执行</button> |
|
|
|
</div> |
|
|
|
<a-modal width="500px" v-model:visible="executevisible" :closable="false" okText="执行" @ok="handleOk2" |
|
|
|
:mask="false" :bodyStyle="{ |
|
|
|
height: '100vh', |
|
|
|
maxHeight: '100vh', |
|
|
|
position: 'fixed', |
|
|
|
right: '496px', |
|
|
|
top: '0', |
|
|
|
<a-modal :v-if="cxlist.length === 0" v-model:visible="executevisible" width="500px" height="792px" okText="执行" |
|
|
|
:closable="false" @ok="handleOk2" :mask="false" :bodyStyle="{ |
|
|
|
opacity: 1, |
|
|
|
background: ' rgba(0,0,0)', |
|
|
|
boxShadow: '-2px 0px 10px rgba(217, 217, 217, 0.5)', |
|
|
|
color: 'rgba(255,83,0)', |
|
|
|
boxSizing: 'borderBox', |
|
|
|
display: 'flex', |
|
|
|
flexDirection: 'column', |
|
|
|
height: '100vh', |
|
|
|
maxHeight: '100vh', |
|
|
|
position: 'fixed', |
|
|
|
right: '496px', |
|
|
|
top: '0', |
|
|
|
}"> |
|
|
|
<div style="height: 792px"> |
|
|
|
<div :v-if="cxlist.length === 0" style="height: 792px"> |
|
|
|
<div> |
|
|
|
<div class="div-operation"></div> |
|
|
|
<span class="text-operation">变更内容 </span> |
|
|
@ -387,7 +382,6 @@ |
|
|
|
<td>{{ row.key }}</td> |
|
|
|
<td>{{ row.data }}</td> |
|
|
|
<td>{{ row.planname }}</td> |
|
|
|
|
|
|
|
<td v-if="row.status === '待执行'"> |
|
|
|
<button style=" |
|
|
|
font-size: 12px; |
|
|
@ -409,25 +403,25 @@ |
|
|
|
</button> |
|
|
|
</td> |
|
|
|
<td> |
|
|
|
<span class="tabreboot" @click="handlerefClick1">重启</span> |
|
|
|
<span class="tabdelete">删除</span> |
|
|
|
<button class="tabreboot" @click="handlerefClick1">重启</button> |
|
|
|
<button class="tabdelete">删除</button> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
</tbody> |
|
|
|
</table> |
|
|
|
<a-modal v-model:visible="addvisible" width="500px" height="792px" :closable="false" :footer="null" |
|
|
|
:mask="false" :bodyStyle="{ |
|
|
|
opacity: 1, |
|
|
|
background: ' rgba(0,0,0)', |
|
|
|
boxSizing: 'borderBox', |
|
|
|
display: 'flex', |
|
|
|
flexDirection: 'column', |
|
|
|
height: '100vh', |
|
|
|
maxHeight: '100vh', |
|
|
|
position: 'fixed', |
|
|
|
right: '496px', |
|
|
|
top: '0', |
|
|
|
}"> |
|
|
|
<a-modal v-model:visible="addvisible" width="500px" height="792px" :closable="false" :mask="false" :bodyStyle="{ |
|
|
|
opacity: 1, |
|
|
|
background: ' rgba(0,0,0)', |
|
|
|
color: 'rgba(255,83,0)', |
|
|
|
boxSizing: 'borderBox', |
|
|
|
display: 'flex', |
|
|
|
flexDirection: 'column', |
|
|
|
height: '100vh', |
|
|
|
maxHeight: '100vh', |
|
|
|
position: 'fixed', |
|
|
|
right: '496px', |
|
|
|
top: '0', |
|
|
|
}"> |
|
|
|
<div> |
|
|
|
<div class="div-operation"></div> |
|
|
|
<span class="text-operation">计划库</span> |
|
|
@ -435,7 +429,8 @@ |
|
|
|
<div style="margin-top: 20px"> |
|
|
|
<a-transfer v-model:target-keys="targetKeys" :data-source="mockData" show-search |
|
|
|
:filter-option="filterOption" :render="(item) => item.title" @change="handleChange" |
|
|
|
:style="{ color: 'rgba(255,255,255,1)' }" @search="handleSearch" /> |
|
|
|
: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> |
|
|
@ -631,33 +626,30 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</a-modal> |
|
|
|
<div class="divadd"> |
|
|
|
<!-- <div class="divadd"> |
|
|
|
<button class="add">刷新</button> |
|
|
|
</div> |
|
|
|
</div> --> |
|
|
|
</a-tab-pane> |
|
|
|
</a-tabs> |
|
|
|
</div> |
|
|
|
</a-drawer> |
|
|
|
<div class="drawer-title1" v-if="!visible"> |
|
|
|
<a-button @click="toggleDrawer" class="arrowbtn"> |
|
|
|
<!-- <left-outlined style="color: rgba(255, 255, 255, 1)" /> --> |
|
|
|
<double-left-outlined style="color: rgba(255, 255, 255, 1)" /> |
|
|
|
</a-button> |
|
|
|
</div> |
|
|
|
<div class="drawer-title2" v-if="visible"> |
|
|
|
<a-button @click="toggleDrawer" class="arrowbtn"> |
|
|
|
<!-- <right-outlined/> --> |
|
|
|
<double-right-outlined style="color: rgba(255, 255, 255, 1)" /> |
|
|
|
</a-button> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script setup lang="ts"> |
|
|
|
import { ref, computed, onMounted } from "vue"; |
|
|
|
import { ref, computed } from "vue"; |
|
|
|
import { |
|
|
|
DownOutlined, |
|
|
|
UpOutlined, |
|
|
|
InfoCircleOutlined, |
|
|
|
DoubleLeftOutlined, |
|
|
|
DoubleRightOutlined, |
|
|
|
StopOutlined |
|
|
@ -1026,9 +1018,9 @@ const handlerefClick1 = () => { |
|
|
|
executevisible.value = true; |
|
|
|
}; |
|
|
|
|
|
|
|
const closeModal = () => { |
|
|
|
executevisible.value = false; |
|
|
|
}; |
|
|
|
// const closeModal = () => { |
|
|
|
// executevisible.value = false; |
|
|
|
// }; |
|
|
|
|
|
|
|
let trindex = ref("-1"); |
|
|
|
const handleRowClick = (index: any) => { |
|
|
@ -1096,10 +1088,27 @@ const handleSearch = (dir: string, value: string) => { |
|
|
|
const delbtn = (id: any) => { |
|
|
|
console.log(id); |
|
|
|
cxlist.value.pop(id); |
|
|
|
console.log(cxlist.value.length); |
|
|
|
|
|
|
|
if (cxlist.value.length === 0) { |
|
|
|
executevisible.value = false |
|
|
|
} |
|
|
|
}; |
|
|
|
</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); |
|
|
|
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; |
|
|
|
} |
|
|
@ -1113,7 +1122,8 @@ const delbtn = (id: any) => { |
|
|
|
opacity: 0.8; |
|
|
|
border-radius: 8px; |
|
|
|
background: rgba(0, 0, 0, 1); |
|
|
|
box-shadow: 0px 20px 30px rgba(0, 85, 133, 0.5); |
|
|
|
// border:5px solid rebeccapurple; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.light-tag-tit { |
|
|
@ -1585,9 +1595,11 @@ p { |
|
|
|
|
|
|
|
.tabreboot, |
|
|
|
.tabdelete { |
|
|
|
border: none; |
|
|
|
background-color: rgba(0,0,0,0); |
|
|
|
font-size: 14px; |
|
|
|
font-weight: 400; |
|
|
|
letter-spacing: 0px; |
|
|
|
letter-spacing: 0; |
|
|
|
line-height: 20px; |
|
|
|
color: rgba(67, 136, 251, 1); |
|
|
|
} |
|
|
@ -1948,13 +1960,15 @@ p { |
|
|
|
|
|
|
|
.journal { |
|
|
|
padding: 3% 5%; |
|
|
|
// background-image: url("/asset/image/bulbLogo/bgsquare.png"); |
|
|
|
background-size: 450px 177px; |
|
|
|
width: 482px; |
|
|
|
height: 177px; |
|
|
|
background-color: rgba(0, 0, 0); |
|
|
|
border-radius: 12px; |
|
|
|
box-shadow: -2px 0px 10px rgb(133, 167, 186) |
|
|
|
/* 圆角边框 */ |
|
|
|
border: 2px solid transparent; |
|
|
|
/* 边框为2px宽,透明颜色 */ |
|
|
|
border-image: linear-gradient(to bottom, #0077FF, #00F6FF, #000000) 1; |
|
|
|
} |
|
|
|
|
|
|
|
// .gird22 { |
|
|
|