yuliang
/
yvan-rcs-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge remote-tracking branch 'origin/master'

master
修宁 7 months ago
parent
afd6d11f9a b7987c6c36
commit
5a59ffe708
2 changed files with 295 additions and 63 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 182
      src/designer/viewWidgets/alarm/AlarmView.vue
  2. 176
      src/designer/viewWidgets/task/TaskView.vue

182
src/designer/viewWidgets/alarm/AlarmView.vue
View File

@ -11,46 +11,66 @@
</span> </span>
</div> </div>
<div class="calc-right-panel"> <div class="calc-right-panel">
AlarmView_1<br /> <div class="alarm-wrap">
AlarmView_2<br /> <div class="alarm-toolbar">
AlarmView_3<br /> <span class="alarm-toolbar-icon">
AlarmView_4<br /> <component :is="renderIcon('fa HourglassStart')"></component>
AlarmView_5<br /> </span>
AlarmView_6<br /> <span class="alarm-toolbar-icon">
AlarmView_7<br /> <component :is="renderIcon('fa LightbulbRegular')"></component>
AlarmView_8<br /> </span>
AlarmView_9<br /> <el-checkbox v-model="filter">应用过滤</el-checkbox>
AlarmView_10<br /> <span class="alarm-toolbar-icon">
AlarmView_11<br /> <component :is="renderIcon('antd PauseOutlined')"></component>
AlarmView_12<br /> </span>
AlarmView_13<br /> <span class="alarm-toolbar-icon">
AlarmView_14<br /> <component :is="renderIcon('element CaretRight')"></component>
AlarmView_15<br /> </span>
AlarmView_16<br /> <span class="alarm-toolbar-icon">
AlarmView_17<br /> <component :is="renderIcon('element Document')"></component>
AlarmView_18<br /> </span>
AlarmView_19<br /> <span class="alarm-toolbar-icon">
AlarmView_20<br /> <component :is="renderIcon('element Delete')"></component>
AlarmView_21<br /> </span>
AlarmView_22<br /> <span>显示数量：1</span>
AlarmView_23<br /> </div>
AlarmView_24<br /> <div class="alarm-content">
AlarmView_25<br /> <div class="alarm-row">
AlarmView_26<br /> <div class="alarm-row-infor alarm-row-header">
AlarmView_27<br /> <div class="alarm-row-left">
AlarmView_28<br /> <span class="num">1</span>
AlarmView_29<br /> 打开文件成功
AlarmView_30<br /> <span class="text-bold">系统</span>
AlarmView_31<br /> </div>
AlarmView_32<br /> <div class="alarm-row-right">05-23 09:05:05 607</div>
AlarmView_33<br /> </div>
AlarmView_34<br /> <div class="alarm-row-infor">
AlarmView_35<br /> <div class="alarm-row-left"></div>
AlarmView_36<br /> <div class="alarm-row-right">等级1</div>
AlarmView_37<br /> </div>
AlarmView_38<br /> <div class="alarm-row-infor alarm-row-footer">
AlarmView_39<br /> <div class="alarm-row-left">打开文件成功</div>
AlarmView_40<br /> </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> </div>
</template> </template>
@ -63,8 +83,86 @@ export default {
mixins: [IWidgets], mixins: [IWidgets],
data() { data() {
return { return {
searchKeyword: '' searchKeyword: '',
filter:''
} }
} }
} }
</script> </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>

176
src/designer/viewWidgets/task/TaskView.vue
View File

@ -11,26 +11,82 @@
</span> </span>
</div> </div>
<div class="calc-bottom-panel"> <div class="calc-bottom-panel">
TaskView1<br /> <el-tabs type="border-card" class="task-view-tabs">
TaskView2<br /> <el-tab-pane>
TaskView3<br /> <template #label>
TaskView4<br /> <span class="tabs-title-label">
TaskView5<br /> <component :is="renderIcon('element Lightning')"></component>
TaskView6<br /> <span>执行中</span>
TaskView7<br /> </span>
TaskView8<br /> </template>
TaskView9<br /> <div class="task-tab-wrap">
TaskView10<br /> <div class="tab-row">
TaskView11<br /> <div class="tab-row-icon">
TaskView12<br /> <component :is="renderIcon('antd NodeIndexOutlined')"></component>
TaskView13<br /> </div>
TaskView14<br /> <div class="tab-row-content">
TaskView15<br /> <div class="tab-row-infor">
TaskView16<br /> <component :is="renderIcon('antd AppstoreOutlined')"></component>
TaskView17<br /> [结束]导航到目的点
TaskView18<br /> </div>
TaskView19<br /> <div class="tab-row-infor">
TaskView20<br /> <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> </div>
</template> </template>
<script> <script>
@ -46,4 +102,82 @@ export default {
} }
} }
} }
</script> </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>
Write Preview
Loading…
Cancel
Save