112 lines
2.7 KiB
Vue
112 lines
2.7 KiB
Vue
|
<template>
|
||
|
|
<el-dialog
|
||
|
|
v-dialogDrag
|
||
|
|
class="dispatcher-cmd chengdou-03__systerm"
|
||
|
|
:title="title"
|
||
|
|
:visible.sync="show"
|
||
|
|
width="960px"
|
||
|
|
:before-close="doClose"
|
||
|
|
:z-index="2010"
|
||
|
|
:modal="false"
|
||
|
|
:close-on-click-modal="false"
|
||
|
|
append-to-body
|
||
|
|
>
|
||
|
|
<div class="main">
|
||
|
|
<el-row style="height: 100%;">
|
||
|
|
<el-col :span="6" style="height: 100%;">
|
||
|
|
<div class="left">
|
||
|
|
<el-tabs v-model="activeTab" type="card" @tab-click="tabClick">
|
||
|
|
<el-tab-pane label="操作" name="operate">
|
||
|
|
<div class="operate-box">
|
||
|
|
<div>数据库正常</div>
|
||
|
|
<div>缓存命令</div>
|
||
|
|
<div>接受命令</div>
|
||
|
|
<div>发送命令</div>
|
||
|
|
<div>签收完成</div>
|
||
|
|
</div>
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane label="查询" name="search">
|
||
|
|
<div class="search-box">
|
||
|
|
<div>查询</div>
|
||
|
|
</div>
|
||
|
|
</el-tab-pane>
|
||
|
|
</el-tabs>
|
||
|
|
</div>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="12">
|
||
|
|
<div class="middle">
|
||
|
|
<el-tabs v-model="cmdTab" type="card">
|
||
|
|
<el-tab-pane label="调度命令" name="cmd">
|
||
|
|
<div class="cmd-box">
|
||
|
|
<div>命令标题</div>
|
||
|
|
</div>
|
||
|
|
</el-tab-pane>
|
||
|
|
</el-tabs>
|
||
|
|
<el-tabs v-model="textTab" type="card">
|
||
|
|
<el-tab-pane label="命令正文" name="text">
|
||
|
|
<div class="cmd-box">
|
||
|
|
<div>正文字体</div>
|
||
|
|
</div>
|
||
|
|
</el-tab-pane>
|
||
|
|
</el-tabs>
|
||
|
|
<div>
|
||
|
|
<div>受令列表</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="6">
|
||
|
|
<div class="right">
|
||
|
|
常用词汇
|
||
|
|
</div>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
</div>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name:'DispatcherCmd',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
dialogShow: false,
|
||
|
|
activeTab: 'operate',
|
||
|
|
cmdTab: 'cmd',
|
||
|
|
textTab: 'text'
|
||
|
|
};
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
show() {
|
||
|
|
return this.dialogShow;
|
||
|
|
},
|
||
|
|
title() {
|
||
|
|
return '调度命令管理系统';
|
||
|
|
}
|
||
|
|
},
|
||
|
|
watch: {},
|
||
|
|
beforeDestroy() {},
|
||
|
|
mounted() {},
|
||
|
|
methods:{
|
||
|
|
doShow() {
|
||
|
|
this.dialogShow = true;
|
||
|
|
},
|
||
|
|
doClose() {
|
||
|
|
this.dialogShow = false;
|
||
|
|
},
|
||
|
|
tabClick() {
|
||
|
|
console.log('tabClick');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
// .dispatcher-cmd{
|
||
|
|
// }
|
||
|
|
.main {
|
||
|
|
height: 100%;
|
||
|
|
.left {
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|