Browse Source

Merge remote-tracking branch 'origin/master'

master
修宁 7 months ago
parent
commit
5a59ffe708
  1. 180
      src/designer/viewWidgets/alarm/AlarmView.vue
  2. 174
      src/designer/viewWidgets/task/TaskView.vue

180
src/designer/viewWidgets/alarm/AlarmView.vue

@ -11,46 +11,66 @@
</span>
</div>
<div class="calc-right-panel">
AlarmView_1<br />
AlarmView_2<br />
AlarmView_3<br />
AlarmView_4<br />
AlarmView_5<br />
AlarmView_6<br />
AlarmView_7<br />
AlarmView_8<br />
AlarmView_9<br />
AlarmView_10<br />
AlarmView_11<br />
AlarmView_12<br />
AlarmView_13<br />
AlarmView_14<br />
AlarmView_15<br />
AlarmView_16<br />
AlarmView_17<br />
AlarmView_18<br />
AlarmView_19<br />
AlarmView_20<br />
AlarmView_21<br />
AlarmView_22<br />
AlarmView_23<br />
AlarmView_24<br />
AlarmView_25<br />
AlarmView_26<br />
AlarmView_27<br />
AlarmView_28<br />
AlarmView_29<br />
AlarmView_30<br />
AlarmView_31<br />
AlarmView_32<br />
AlarmView_33<br />
AlarmView_34<br />
AlarmView_35<br />
AlarmView_36<br />
AlarmView_37<br />
AlarmView_38<br />
AlarmView_39<br />
AlarmView_40<br />
<div class="alarm-wrap">
<div class="alarm-toolbar">
<span class="alarm-toolbar-icon">
<component :is="renderIcon('fa HourglassStart')"></component>
</span>
<span class="alarm-toolbar-icon">
<component :is="renderIcon('fa LightbulbRegular')"></component>
</span>
<el-checkbox v-model="filter">应用过滤</el-checkbox>
<span class="alarm-toolbar-icon">
<component :is="renderIcon('antd PauseOutlined')"></component>
</span>
<span class="alarm-toolbar-icon">
<component :is="renderIcon('element CaretRight')"></component>
</span>
<span class="alarm-toolbar-icon">
<component :is="renderIcon('element Document')"></component>
</span>
<span class="alarm-toolbar-icon">
<component :is="renderIcon('element Delete')"></component>
</span>
<span>显示数量1</span>
</div>
<div class="alarm-content">
<div class="alarm-row">
<div class="alarm-row-infor alarm-row-header">
<div class="alarm-row-left">
<span class="num">1</span>
打开文件成功
<span class="text-bold">系统</span>
</div>
<div class="alarm-row-right">05-23 09:05:05 607</div>
</div>
<div class="alarm-row-infor">
<div class="alarm-row-left"></div>
<div class="alarm-row-right">等级1</div>
</div>
<div class="alarm-row-infor alarm-row-footer">
<div class="alarm-row-left">打开文件成功</div>
</div>
</div>
<div class="alarm-row selected">
<div class="alarm-row-infor alarm-row-header">
<div class="alarm-row-left">
<span class="num">1</span>
打开文件成功
<span class="text-bold">系统</span>
</div>
<div class="alarm-row-right">05-23 09:05:05 607</div>
</div>
<div class="alarm-row-infor">
<div class="alarm-row-left"></div>
<div class="alarm-row-right">等级1</div>
</div>
<div class="alarm-row-infor alarm-row-footer">
<div class="alarm-row-left">全局数据恢复完成</div>
</div>
</div>
</div>
</div>
</div>
</template>
@ -63,8 +83,86 @@ export default {
mixins: [IWidgets],
data() {
return {
searchKeyword: ''
searchKeyword: '',
filter:''
}
}
}
</script>
<style lang="less">
.alarm-wrap{
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
.alarm-toolbar{
display: flex;
flex-direction: row;
flex-wrap: wrap;
border-bottom:1px solid #dcdcdc;
align-items: center;
font-size: 14px;
.alarm-toolbar-icon{
display:inline-flex;
align-items: center;
padding:0 5px;
background: #747a80;
margin:2px 3px;
height:28px;
.el-icon{
font-size: 16px;
color: #ffc80e;
}
}
.el-checkbox{
margin:0 3px;
.el-checkbox__label{
padding-left:2px;
}
}
}
.alarm-content{
flex:1;
overflow: auto;
.alarm-row{
border:1px solid #dcdcdc;
margin:5px;
&.selected{
border:1px solid #0e75ff;
}
.alarm-row-infor{
display: flex;
flex-direction: row;
justify-content: space-between;
padding:5px;
font-size: 13px;
background: #efefef;
.alarm-row-left{
width:60%;
.num{
display: inline-block;
padding:0 6px;
background: #b1b1b1;
border-radius: 3px;
color:#fff;
font-weight: bold;
}
.text-bold{
font-weight: bold;
font-size: 14px;
}
}
.alarm-row-right{
flex:1;
}
}
.alarm-row-header{
background: #dbdbdc;
}
.alarm-row-footer{
border-top:1px solid #e1e1e1;
}
}
}
}
</style>

174
src/designer/viewWidgets/task/TaskView.vue

@ -11,26 +11,82 @@
</span>
</div>
<div class="calc-bottom-panel">
TaskView1<br />
TaskView2<br />
TaskView3<br />
TaskView4<br />
TaskView5<br />
TaskView6<br />
TaskView7<br />
TaskView8<br />
TaskView9<br />
TaskView10<br />
TaskView11<br />
TaskView12<br />
TaskView13<br />
TaskView14<br />
TaskView15<br />
TaskView16<br />
TaskView17<br />
TaskView18<br />
TaskView19<br />
TaskView20<br />
<el-tabs type="border-card" class="task-view-tabs">
<el-tab-pane>
<template #label>
<span class="tabs-title-label">
<component :is="renderIcon('element Lightning')"></component>
<span>执行中</span>
</span>
</template>
<div class="task-tab-wrap">
<div class="tab-row">
<div class="tab-row-icon">
<component :is="renderIcon('antd NodeIndexOutlined')"></component>
</div>
<div class="tab-row-content">
<div class="tab-row-infor">
<component :is="renderIcon('antd AppstoreOutlined')"></component>
[结束]导航到目的点
</div>
<div class="tab-row-infor">
<component :is="renderIcon('antd FireFilled')"></component>
[结束]按照导航路径移动到目标点
</div>
<div class="tab-row-infor">
<component :is="renderIcon('element AlarmClock')"></component>
23 16:10:09:103 - 23 16:40:39:103
</div>
<div class="tab-row-infor">
<component :is="renderIcon('fa LuggageCart')"></component>
<span class="blue">Agv-1 30 32 当前目标点 32</span>
</div>
</div>
</div>
<div class="tab-row selected">
<div class="tab-row-icon">
<component :is="renderIcon('antd NodeIndexOutlined')"></component>
</div>
<div class="tab-row-content">
<div class="tab-row-infor">
<component :is="renderIcon('antd AppstoreOutlined')"></component>
[结束]导航到目的点
</div>
<div class="tab-row-infor">
<component :is="renderIcon('antd FireFilled')"></component>
[结束]按照导航路径移动到目标点
</div>
<div class="tab-row-infor">
<component :is="renderIcon('element AlarmClock')"></component>
23 16:10:09:103 - 23 16:40:39:103
</div>
<div class="tab-row-infor">
<component :is="renderIcon('fa LuggageCart')"></component>
<span class="blue">Agv-1 30 32 当前目标点 32</span>
</div>
</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane>
<template #label>
<span class="tabs-title-label">
<component :is="renderIcon('element CircleCheck')"></component>
<span>执行中</span>
</span>
</template>
<div class=""></div>
</el-tab-pane>
<el-tab-pane>
<template #label>
<span class="tabs-title-label">
<component :is="renderIcon('element Warning')"></component>
<span>执行中</span>
</span>
</template>
<div class=""></div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
@ -47,3 +103,81 @@ export default {
}
}
</script>
<style lang="less">
.task-view-wrap{
height: 100%;
}
.task-view-tabs {
height: 100%;
&.el-tabs--border-card{
border: none;
&>.el-tabs__header{
background: #efefef;
.tabs-title-label span {
vertical-align: middle;
margin-left: 4px;
color: #333;
}
.tabs-title-label .el-icon {
vertical-align: middle;
}
.el-tabs__item{
height: 30px;
&.is-active{
.tabs-title-label span {;
color: var(--el-color-primary);
font-weight: bold;
}
}
}
}
&> .el-tabs__content {
padding:2px 5px;
color: #6b778c;
font-size: 32px;
font-weight: 600;
overflow: auto;
.task-tab-wrap{
.tab-row{
display: flex;
flex-direction: row;
margin:3px 0;
padding:10px;
background: #efefef;
&.selected{
background: #f5eed8;
}
.tab-row-icon{
flex-shrink: 0;
width: 75px;
height: 75px;
background: #747a80;
display: flex;
justify-content: center;
align-items: center;
color:#fff
}
.tab-row-content{
flex: 1;
margin-left:10px;
.tab-row-infor{
font-size: 13px;
margin-bottom: 5px;
color:#222;
.el-icon {
font-size: 14px;
position: relative;
top:3px;
margin-right: 5px;
}
.blue{
color:#00beff;
}
}
}
}
}
}
}
}
</style>
Loading…
Cancel
Save