xymp
/
frontend
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

时间表设置样式

Browse Source
master
Fluyan 2 years ago
parent 41b0ba141f
commit 45072e0b14
3 changed files with 159 additions and 25 deletions
Show Stats Download Patch File Download Diff File

128
src/views/devicePhotoSchedule/components/setdevice.vue
Unescape Escape View File

@ -4,27 +4,9 @@
title="设置"
:visible.sync="isShow"
:close-on-click-modal="false"
width="480px"
width="680px"
>
<!-- <el-form
label-position="left"
ref="formInfo"
label-width="100px"
:rules="rules"
:model="formdata"
>
<el-form-item label="通道：" prop="name">
<el-tree
:data="listnr"
show-checkbox
:props="defaultProps"
ref="tree"
node-key="id"
:default-expand-all="true"
></el-tree>
</el-form-item>
</el-form> -->
<div class="flexnr">
<!-- <div class="flexnr">
<div class="w50">通道:</div>
<el-tree
:data="listnr"
@ -34,8 +16,57 @@
node-key="id"
:default-expand-all="true"
></el-tree>
</div> -->
<div class="setTimeTd">
<el-descriptions title="" :column="3" border>
<el-descriptions-item label="名称">名称</el-descriptions-item>
<el-descriptions-item label="时间表类型">按时间段</el-descriptions-item>
<el-descriptions-item label="开始时间"> 12:00:07</el-descriptions-item>
<el-descriptions-item label="结束时间"> 16:00:07</el-descriptions-item>
<el-descriptions-item label="时间间隔（分）">
<el-tag size="small">60</el-tag>
</el-descriptions-item>
<el-descriptions-item label="备注信息"
>这是备注信息</el-descriptions-item
>
</el-descriptions>
<h3>设置通道</h3>
<div class="setCheckbox">
<el-table
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange"
>
<el-table-column label="电压等级">
<template> 220KV</template>
</el-table-column>
<el-table-column prop="name" label="线路名称">
<template> 线路 </template>
</el-table-column>
<el-table-column
width="160"
prop="address"
label="装置信息"
show-overflow-tooltip
>
<template> XY-SIMULATOR-0001 </template>
</el-table-column>
<!-- <el-table-column type="selection" width="100px"></el-table-column> -->
<el-table-column label="全选">
<template>
<el-checkbox v-model="checked">通道1</el-checkbox></template
>
</el-table-column>
<el-table-column label="全选">
<template
><el-checkbox v-model="checked">通道2</el-checkbox></template
>
</el-table-column>
</el-table>
</div>
</div>
<div slot="footer" class="dialog-footer">
<!-- <el-button @click="getCheckedNodes">获取</el-button> -->
<el-button @click="isShow = false">取 消</el-button>
@ -67,6 +98,45 @@ export default {
selid: 0,
ruleid: "",
parmsList: [], //选中的通道
tableData: [
{
date: "2016-05-03",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-02",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-04",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-01",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-08",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-06",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-07",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
],
multipleSelection: [],
};
},
mounted() {},
@ -170,5 +240,21 @@ export default {
.w50 {
width: 50px;
}
.setTimeTd {
h3 {
margin: 8px 0px;
font-size: 16px;
line-height: 24px;
}
.setCheckbox {
.el-table__header .el-table-column--selection .cell .el-checkbox:after {
color: #333;
content: "全选";
font-size: 16px;
margin-left: 12px;
font-weight: bold;
}
}
}
}
</style>

2
src/views/devicePhotoSchedule/index.vue
Unescape Escape View File

@ -22,7 +22,7 @@
>
<!-- <el-table-column type="index" width="55"> </el-table-column>
<el-table-column type="selection" width="55"> </el-table-column> -->
<el-table-column label="单位" show-overflow-tooltip>
<el-table-column label="名称" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.name }}</template>
</el-table-column>
<el-table-column label="时间表类型" show-overflow-tooltip>

54
src/views/realTimeMonitor/components/setschedule.vue
Unescape Escape View File

@ -90,10 +90,10 @@
title="设置"
:visible.sync="isShowset"
:close-on-click-modal="false"
width="480px"
width="680px"
append-to-body
>
<el-form
<!-- <el-form
label-position="left"
ref="formInfo"
label-width="100px"
@ -109,7 +109,47 @@
:default-expand-all="true"
></el-tree>
</el-form-item>
</el-form>
</el-form> -->
<div class="setTimeTd">
<el-descriptions title="" :column="3" border>
<el-descriptions-item label="时间表类型"
>按时间段</el-descriptions-item
>
<el-descriptions-item label="开始时间">
12:00:07</el-descriptions-item
>
<el-descriptions-item label="结束时间">
16:00:07</el-descriptions-item
>
<el-descriptions-item label="时间间隔（分）">
<el-tag size="small">60</el-tag>
</el-descriptions-item>
<el-descriptions-item label="备注信息"
>这是备注信息</el-descriptions-item
>
</el-descriptions>
<h3>设置通道</h3>
<div class="tdSetBox">
<el-descriptions title="" :column="3" border>
<el-descriptions-item label="电压等级"
>220kV</el-descriptions-item
>
<el-descriptions-item label="线路名称">
线路</el-descriptions-item
>
<el-descriptions-item label="装置名称">
XYIGQ10C230300104</el-descriptions-item
>
</el-descriptions>
<h3>选择通道</h3>
<div class="checkBox">
<el-checkbox-group v-model="checkList">
<el-checkbox label="通道1" border></el-checkbox>
<el-checkbox label="通道2" border></el-checkbox>
</el-checkbox-group>
</div>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="isShowset = false">取 消</el-button>
<el-button type="primary" @click="submitForm()">确 定</el-button>
@ -153,6 +193,7 @@ export default {
ruleid: "", //线路id
parmsList: [], //所选装置下通道参数
scheduleid: 0, //所选时间表id
checkList: [],
};
},
mounted() {},
@ -336,6 +377,13 @@ export default {
height: 100%;
//background: #fcc;
}
.setTimeTd {
h3 {
margin: 8px 0px;
font-size: 16px;
line-height: 24px;
}
}
}
}
</style>

Write Preview
Loading…
Cancel
Save