|
|
@ -11,7 +11,7 @@ watchEffect(() => { |
|
|
|
appEvents.value = deviceStore.deviceState.appEvents |
|
|
|
}) |
|
|
|
|
|
|
|
const confirmClose = (item: Record<string, any>) => { |
|
|
|
const confirmClose = async (item: Record<string, any>) => { |
|
|
|
console.log('item === ', item) |
|
|
|
const evenid = item.uuid |
|
|
|
const params = { |
|
|
@ -21,7 +21,10 @@ const confirmClose = (item: Record<string, any>) => { |
|
|
|
evenid, |
|
|
|
}, |
|
|
|
} |
|
|
|
syncSendCmd(params) |
|
|
|
item.loading = true |
|
|
|
await syncSendCmd(params).finally(() => { |
|
|
|
// item.loading = false |
|
|
|
}) |
|
|
|
} |
|
|
|
const getClassByType = (type: string) => { |
|
|
|
if (type === 'AppCheckPointCheckFailEvent') { |
|
|
@ -43,7 +46,7 @@ const getClassByType = (type: string) => { |
|
|
|
错误信息 |
|
|
|
</h2> |
|
|
|
<ul class="recipe-list"> |
|
|
|
<li v-for="(item, index) in appEvents" :key="index" :class="getClassByType(item.type)"> |
|
|
|
<el-tag v-for="(item, index) in appEvents" :key="index" :class="getClassByType(item.type)"> |
|
|
|
<span v-if="item.type === 'AppCheckPointCheckFailEvent'"> |
|
|
|
<span v-for="checkItem in item.errCheckPoints" :key="checkItem.ecode"> |
|
|
|
{{ checkItem.ecodeInfo }} |
|
|
@ -54,14 +57,14 @@ const getClassByType = (type: string) => { |
|
|
|
</span> |
|
|
|
<span v-else>{{ item.message }}</span> |
|
|
|
<div class="actions"> |
|
|
|
<button class="delete-button" @click.stop="confirmClose(item)"> |
|
|
|
<el-button :loading="item.loading" class="delete-button" @click.stop="confirmClose(item)"> |
|
|
|
关闭 |
|
|
|
</button> |
|
|
|
</el-button> |
|
|
|
<span class="selected-icon"> |
|
|
|
<i class="fa fa-check-circle" /> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</li> |
|
|
|
</el-tag> |
|
|
|
</ul> |
|
|
|
</div> |
|
|
|
</div> |
|
|
@ -109,8 +112,8 @@ const getClassByType = (type: string) => { |
|
|
|
.reconnect-modal-container { |
|
|
|
background-color: white; |
|
|
|
border-radius: 12px; |
|
|
|
padding: 40px; |
|
|
|
width: 40vw; |
|
|
|
padding: 20px; |
|
|
|
width: 50%; |
|
|
|
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); |
|
|
|
text-align: center; |
|
|
|
animation: fadeIn 0.3s ease-out; |
|
|
@ -118,18 +121,29 @@ const getClassByType = (type: string) => { |
|
|
|
list-style: none; |
|
|
|
padding: 0; |
|
|
|
margin: 0; |
|
|
|
max-height: 70vh; |
|
|
|
overflow-y: auto; |
|
|
|
} |
|
|
|
|
|
|
|
.recipe-list li { |
|
|
|
.recipe-list .el-tag { |
|
|
|
height: 40px; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
padding: 10px; |
|
|
|
//padding: 10px; |
|
|
|
border-radius: 4px; |
|
|
|
margin-bottom: 8px; |
|
|
|
transition: all 0.2s; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
:deep(.el-tag__content) { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
|
|
|
|
.recipe-list li:hover { |
|
|
|
background-color: #f5f7fa; |
|
|
@ -171,10 +185,10 @@ const getClassByType = (type: string) => { |
|
|
|
|
|
|
|
.view-button, |
|
|
|
.delete-button { |
|
|
|
font-size: 14px; |
|
|
|
border: none; |
|
|
|
padding: 4px 8px; |
|
|
|
border-radius: 3px; |
|
|
|
cursor: pointer; |
|
|
|
padding: 2px 8px; |
|
|
|
height: 30px; |
|
|
|
margin-right: 5px; |
|
|
|
transition: all 0.3s; |
|
|
|
} |
|
|
|