|
|
|
@ -21,7 +21,7 @@ |
|
|
|
<!-- 配置开关机列表 --> |
|
|
|
<el-row :gutter="15"> |
|
|
|
<el-col> |
|
|
|
<el-table style="width: 100%;" :data="startUpList" :header-cell-style="{ background: '#3a8aeb', color: '#fff' }" @selection-change="handleSelectionChange" > |
|
|
|
<el-table style="width: 100%;" :data="startUpList" :header-cell-style="{ background: '#3a8aeb', color: '#fff' }" @selection-change="handleSelectionChange"> |
|
|
|
<el-table-column type="selection" width="55" /> |
|
|
|
<el-table-column prop="device_id" label="设备ID" align="center" /> |
|
|
|
<el-table-column prop="device_account" label="设备账号" align="center" width="150" /> |
|
|
|
@ -33,13 +33,13 @@ |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="period" label="配置周期" align="center" width="300"> |
|
|
|
<template slot-scope="{row}"> |
|
|
|
<div v-show="row.open_setting">{{row.open_setting==1? '每天 - 开机 '+row.open_time :'每周'+setWeekly(row.open_weekly)+'开机'+row.open_time }}</div> |
|
|
|
<div v-show="row.open_setting">{{ row.open_setting==1? '每天 - 开机 '+row.open_time :'每周'+setWeekly(row.open_weekly)+'开机'+row.open_time }}</div> |
|
|
|
<div v-show="row.open_setting">{{ row.close_setting==1?'每天 - 关机'+row.close_time :'每周'+setWeekly(row.close_weekly)+'关机'+row.close_time }}</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="启动画面" align="center"> |
|
|
|
<template slot-scope="{row}"> |
|
|
|
<el-image class="cover_img" :src="row.startup_screen" v-show="row.startup_screen"></el-image> |
|
|
|
<el-image v-show="row.startup_screen" class="cover_img" :src="row.startup_screen" /> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="update_time" label="创建时间" align="center" width="200"> |
|
|
|
@ -49,27 +49,12 @@ |
|
|
|
</el-table-column> |
|
|
|
<el-table-column fixed="right" label="操作" align="center" width="120"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
class="edit_btn" |
|
|
|
@click="editFormData(scope.row)" |
|
|
|
>编辑</el-button> |
|
|
|
<el-button type="primary" class="edit_btn" @click="editFormData(scope.row)">编辑</el-button> |
|
|
|
<el-button type="info" class="record_btn">记录</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<el-pagination |
|
|
|
style="margin-top: 20px; text-align: center" |
|
|
|
:current-page="queryInfo.page" |
|
|
|
:total="total" |
|
|
|
:page-size="queryInfo.size" |
|
|
|
:pager-count="7" |
|
|
|
:page-sizes="[3, 5, 10]" |
|
|
|
@current-change="getStartUpList" |
|
|
|
@size-change="handleSizeChange" |
|
|
|
layout="prev, pager, next, jumper,->,sizes,total" |
|
|
|
> |
|
|
|
</el-pagination> |
|
|
|
<el-pagination style="margin-top: 20px; text-align: center" :current-page="queryInfo.page" :total="total" :page-size="queryInfo.size" :pager-count="7" :page-sizes="[3, 5, 10]" layout="prev, pager, next, jumper,->,sizes,total" @current-change="getStartUpList" @size-change="handleSizeChange" /> |
|
|
|
|
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
@ -82,45 +67,28 @@ |
|
|
|
<div class="setting_cont"> |
|
|
|
<span>设置时间：</span> |
|
|
|
<div> |
|
|
|
<el-form-item |
|
|
|
prop="open_setting" |
|
|
|
:rules="[ |
|
|
|
<el-form-item prop="open_setting" :rules="[ |
|
|
|
{ required: true, message: '请选择开机时间', trigger: 'change' }, |
|
|
|
]" |
|
|
|
:class="{'no_margin': form.open_setting === 2}" |
|
|
|
> |
|
|
|
]" :class="{'no_margin': form.open_setting === 2}"> |
|
|
|
<el-radio-group v-model="form.open_setting" @change="clearCheckbox()"> |
|
|
|
<el-radio :label="1" value="everyday">每天</el-radio> |
|
|
|
<el-radio :label="2" value="weekly">每周</el-radio> |
|
|
|
</el-radio-group> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item |
|
|
|
v-if="form.open_setting === 2" |
|
|
|
:class="{'weekly_margin': form.open_setting === 2}" |
|
|
|
prop="open_weekly" |
|
|
|
:rules="[ |
|
|
|
<el-form-item v-if="form.open_setting === 2" :class="{'weekly_margin': form.open_setting === 2}" prop="open_weekly" :rules="[ |
|
|
|
{ required: true, message: '请选择每周开机时间', trigger: 'change' }, |
|
|
|
]" |
|
|
|
> |
|
|
|
]"> |
|
|
|
<el-checkbox-group v-model="selectOpenWeekly"> |
|
|
|
<el-checkbox v-for="item in weeklyList" :key="item.id" :label="item.id" :value="item.id" name="type">{{ item.name }}</el-checkbox> |
|
|
|
</el-checkbox-group> |
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
<el-form-item |
|
|
|
prop="open_time" |
|
|
|
:rules="[ |
|
|
|
<el-form-item prop="open_time" :rules="[ |
|
|
|
{type: 'string', required: true, message: '请选择具体开机时间', trigger: 'change' }, |
|
|
|
]" |
|
|
|
> |
|
|
|
<el-time-picker |
|
|
|
v-model="form.open_time" |
|
|
|
:picker-options="{ |
|
|
|
]"> |
|
|
|
<el-time-picker v-model="form.open_time" :picker-options="{ |
|
|
|
selectableRange: '00:00:00 - 23:59:59' |
|
|
|
}" |
|
|
|
placeholder="任意时间点" |
|
|
|
value-format="HH:mm:ss" |
|
|
|
/> |
|
|
|
}" placeholder="任意时间点" value-format="HH:mm:ss" /> |
|
|
|
</el-form-item> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -130,45 +98,28 @@ |
|
|
|
<div class="setting_cont"> |
|
|
|
<span>设置时间：</span> |
|
|
|
<div> |
|
|
|
<el-form-item |
|
|
|
prop="close_setting" |
|
|
|
:rules="[ |
|
|
|
<el-form-item prop="close_setting" :rules="[ |
|
|
|
{required: true, message: '请选择关机时间', trigger: 'change' }, |
|
|
|
]" |
|
|
|
:class="{'no_margin': form.close_setting === 2}" |
|
|
|
> |
|
|
|
]" :class="{'no_margin': form.close_setting === 2}"> |
|
|
|
<el-radio-group v-model="form.close_setting" @change="clearCheckbox()"> |
|
|
|
<el-radio :label="1" value="everyday">每天</el-radio> |
|
|
|
<el-radio :label="2" value="weekly">每周</el-radio> |
|
|
|
</el-radio-group> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item |
|
|
|
v-if="form.close_setting === 2" |
|
|
|
:class="{'weekly_margin': form.close_setting === 2}" |
|
|
|
prop="close_weekly" |
|
|
|
:rules="[ |
|
|
|
<el-form-item v-if="form.close_setting === 2" :class="{'weekly_margin': form.close_setting === 2}" prop="close_weekly" :rules="[ |
|
|
|
{ required: true, message: '请选择每周关机时间', trigger: 'change' }, |
|
|
|
]" |
|
|
|
> |
|
|
|
]"> |
|
|
|
<el-checkbox-group v-model="selectCloseweekly"> |
|
|
|
<el-checkbox v-for="item in weeklyList" :key="item.id" :label="item.id" :value="item.id" name="type">{{ item.name }}</el-checkbox> |
|
|
|
</el-checkbox-group> |
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
<el-form-item |
|
|
|
prop="close_time" |
|
|
|
:rules="[ |
|
|
|
<el-form-item prop="close_time" :rules="[ |
|
|
|
{type: 'string', required: true, message: '请选择具体关机时间', trigger: 'change' }, |
|
|
|
]" |
|
|
|
> |
|
|
|
<el-time-picker |
|
|
|
v-model="form.close_time" |
|
|
|
:picker-options="{ |
|
|
|
]"> |
|
|
|
<el-time-picker v-model="form.close_time" :picker-options="{ |
|
|
|
selectableRange: '00:00:00 - 23:59:59' |
|
|
|
}" |
|
|
|
placeholder="任意时间点" |
|
|
|
value-format="HH:mm:ss" |
|
|
|
/> |
|
|
|
}" placeholder="任意时间点" value-format="HH:mm:ss" /> |
|
|
|
</el-form-item> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -177,12 +128,9 @@ |
|
|
|
<h4>设备方向</h4> |
|
|
|
<div class="setting_cont"> |
|
|
|
<span>设备方向：</span> |
|
|
|
<el-form-item |
|
|
|
prop="device_direction_name" |
|
|
|
:rules="[ |
|
|
|
<el-form-item prop="device_direction_name" :rules="[ |
|
|
|
{ required: true, message: '请选择具体设备方向', trigger: 'change' }, |
|
|
|
]" |
|
|
|
> |
|
|
|
]"> |
|
|
|
<el-select v-model="form.device_direction_name" size="small" class="filter-item" value-key="name" @change="selectDirection"> |
|
|
|
<el-option v-for="item in deviceData" :key="item.key" :label="item.name" :value="item" /> |
|
|
|
</el-select> |
|
|
|
@ -210,17 +158,17 @@ |
|
|
|
|
|
|
|
<script> |
|
|
|
import UploadCover from '../components/upload_cover.vue' |
|
|
|
import { reqStartUpList, reqEditStartUp ,reqClearStartUp} from '@/api/device/startUpList.js' |
|
|
|
import { reqStartUpList, reqEditStartUp, reqClearStartUp } from '@/api/device/startUpList.js' |
|
|
|
import { parseTime } from '@/utils/index.js' |
|
|
|
export default { |
|
|
|
name: 'DeviceConfig', |
|
|
|
components: { UploadCover }, |
|
|
|
filters: { |
|
|
|
parseTime(time, cFormat) { |
|
|
|
parseTime (time, cFormat) { |
|
|
|
return parseTime(time, cFormat) |
|
|
|
} |
|
|
|
}, |
|
|
|
data() { |
|
|
|
data () { |
|
|
|
return { |
|
|
|
query: { |
|
|
|
blurry: '' |
|
|
|
@ -233,8 +181,8 @@ export default { |
|
|
|
page: 1, |
|
|
|
size: 3 |
|
|
|
}, |
|
|
|
total:0, |
|
|
|
// 开关机列表的数据 |
|
|
|
total: 0, |
|
|
|
// 开关机列表的数据 |
|
|
|
startUpList: [], |
|
|
|
form: { |
|
|
|
device_direction: null, |
|
|
|
@ -289,7 +237,7 @@ export default { |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
// 将字符串渲染成汉字显示到页面 |
|
|
|
setWeekly() { |
|
|
|
setWeekly () { |
|
|
|
const a = { |
|
|
|
1: '一', |
|
|
|
2: '二', |
|
|
|
@ -299,35 +247,35 @@ export default { |
|
|
|
6: '六', |
|
|
|
7: '七' |
|
|
|
} |
|
|
|
return function(str) { |
|
|
|
return function (str) { |
|
|
|
if (str) { |
|
|
|
return str.split(',').map(i => a[i]).join('/') |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
watch: {}, |
|
|
|
mounted() { |
|
|
|
mounted () { |
|
|
|
this.getStartUpList() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 获取开关机列表 |
|
|
|
getStartUpList(pager=1) { |
|
|
|
this.queryInfo.page=pager |
|
|
|
getStartUpList () { |
|
|
|
// this.queryInfo.page = pager |
|
|
|
const params = this.queryInfo |
|
|
|
reqStartUpList(params).then(res => { |
|
|
|
if (res.code == 200) { |
|
|
|
this.startUpList = res.data.content |
|
|
|
this.total=res.data.totalElements |
|
|
|
this.queryInfo.size=res.data.size |
|
|
|
this.total = res.data.totalElements |
|
|
|
this.queryInfo.size = res.data.size |
|
|
|
} else { |
|
|
|
return this.$message.error('获取设备列表失败！') |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 编辑开关机 |
|
|
|
editFormData(row) { |
|
|
|
editFormData (row) { |
|
|
|
this.addFromVisible = true |
|
|
|
this.form.device_id = row.device_id |
|
|
|
this.form.open_setting = row.open_setting |
|
|
|
@ -353,7 +301,7 @@ export default { |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 每天/每周切换的情况下数据处理 |
|
|
|
clearCheckbox() { |
|
|
|
clearCheckbox () { |
|
|
|
if (this.form.open_setting === 1) { |
|
|
|
this.open_weekly = [] |
|
|
|
this.form.open_weekly = null |
|
|
|
@ -364,18 +312,18 @@ export default { |
|
|
|
} |
|
|
|
}, |
|
|
|
// 选择设备方向处理 |
|
|
|
selectDirection(selVal) { |
|
|
|
selectDirection (selVal) { |
|
|
|
console.log(selVal) |
|
|
|
this.form.device_direction = selVal.key |
|
|
|
this.form.device_direction_name = selVal.name |
|
|
|
}, |
|
|
|
// 重置表单数据 |
|
|
|
resetForm(formName) { |
|
|
|
resetForm (formName) { |
|
|
|
this.addFromVisible = false |
|
|
|
this.$refs[formName].resetFields() |
|
|
|
}, |
|
|
|
// 提交表单数据 |
|
|
|
submitForm(formName) { |
|
|
|
submitForm (formName) { |
|
|
|
this.form.startup_screen = this.$refs.childUpload.imageUrl |
|
|
|
if (this.form.open_setting === 2) { |
|
|
|
this.form.open_weekly = this.selectOpenWeekly.join(',') |
|
|
|
@ -415,7 +363,7 @@ export default { |
|
|
|
}, |
|
|
|
// 列表多选操作 - 清空btn状态 |
|
|
|
// 单选单个复选框 |
|
|
|
handleSelectionChange(sels) { |
|
|
|
handleSelectionChange (sels) { |
|
|
|
this.sels = sels |
|
|
|
if (sels.length > 0) { |
|
|
|
this.clearBtnDisabled = false |
|
|
|
@ -424,72 +372,72 @@ export default { |
|
|
|
} |
|
|
|
}, |
|
|
|
// 清空 |
|
|
|
removeStartUp(rows){ |
|
|
|
let ids=[] |
|
|
|
rows.forEach(item=>{ |
|
|
|
removeStartUp (rows) { |
|
|
|
const ids = [] |
|
|
|
rows.forEach(item => { |
|
|
|
ids.push(item.device_id) |
|
|
|
}) |
|
|
|
// console.log(ids) |
|
|
|
this.$confirm('确定要清空选中的配置周期和启动画面吗?','提示', { |
|
|
|
confirmButtonText: "确定", |
|
|
|
cancelButtonText: "取消", |
|
|
|
type: "warning", |
|
|
|
}).then(()=>{ |
|
|
|
const params={ |
|
|
|
ids |
|
|
|
} |
|
|
|
reqClearStartUp(params).then(res=>{ |
|
|
|
this.$confirm('确定要清空选中的配置周期和启动画面吗?', '提示', { |
|
|
|
confirmButtonText: '确定', |
|
|
|
cancelButtonText: '取消', |
|
|
|
type: 'warning' |
|
|
|
}).then(() => { |
|
|
|
const params = { |
|
|
|
ids |
|
|
|
} |
|
|
|
reqClearStartUp(params).then(res => { |
|
|
|
console.log(res) |
|
|
|
if(res.code==200){ |
|
|
|
if (res.code == 200) { |
|
|
|
this.$message({ |
|
|
|
message: '清空成功', |
|
|
|
type: 'success' |
|
|
|
}) |
|
|
|
this.getStartUpList(this.deviceList.length>1?this.queryInfo.page:this.queryInfo.page-1) |
|
|
|
} |
|
|
|
}).catch(()=>{ |
|
|
|
this.$message({ |
|
|
|
message:'清空失败', |
|
|
|
type:'info' |
|
|
|
this.getStartUpList(this.deviceList.length > 1 ? this.queryInfo.page : this.queryInfo.page - 1) |
|
|
|
} |
|
|
|
}).catch(() => { |
|
|
|
this.$message({ |
|
|
|
message: '清空失败', |
|
|
|
type: 'info' |
|
|
|
}) |
|
|
|
}) |
|
|
|
}) |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 每条显示数据改变时的事件 |
|
|
|
handleSizeChange(size) { |
|
|
|
//整理参数 |
|
|
|
handleSizeChange (size) { |
|
|
|
// 整理参数 |
|
|
|
this.queryInfo.size = size |
|
|
|
this.getStartUpList(); |
|
|
|
}, |
|
|
|
this.getStartUpList() |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
.setting_btn{ |
|
|
|
.setting_btn { |
|
|
|
margin-right: 10px; |
|
|
|
} |
|
|
|
.clear_btn { |
|
|
|
color: #3a8aeb; |
|
|
|
border-color: #3a8aeb; |
|
|
|
} |
|
|
|
.cover_img{ |
|
|
|
.cover_img { |
|
|
|
width: 65px; |
|
|
|
} |
|
|
|
.device_layer{ |
|
|
|
::v-deep .el-dialog__body{ |
|
|
|
.device_layer { |
|
|
|
::v-deep .el-dialog__body { |
|
|
|
padding: 0 20px; |
|
|
|
} |
|
|
|
.setting_item{ |
|
|
|
.setting_item { |
|
|
|
padding-top: 24px; |
|
|
|
color: #333; |
|
|
|
h4{ |
|
|
|
h4 { |
|
|
|
font-size: 16px; |
|
|
|
margin-bottom: 10px; |
|
|
|
} |
|
|
|
.setting_cont{ |
|
|
|
.setting_cont { |
|
|
|
display: flex; |
|
|
|
span{ |
|
|
|
span { |
|
|
|
display: block; |
|
|
|
width: 80px; |
|
|
|
line-height: 32px; |
|
|
|
@ -497,53 +445,52 @@ export default { |
|
|
|
.no_margin { |
|
|
|
margin: 0; |
|
|
|
} |
|
|
|
.weekly_margin{ |
|
|
|
.weekly_margin { |
|
|
|
margin-bottom: 6px; |
|
|
|
::v-deep .el-form-item__error{ |
|
|
|
::v-deep .el-form-item__error { |
|
|
|
top: 70%; |
|
|
|
} |
|
|
|
} |
|
|
|
::v-deep .el-form-item--small.el-form-item:last-child{ |
|
|
|
::v-deep .el-form-item--small.el-form-item:last-child { |
|
|
|
margin: 0; |
|
|
|
} |
|
|
|
::v-deep .el-radio-group{ |
|
|
|
::v-deep .el-radio-group { |
|
|
|
display: block; |
|
|
|
// line-height: 32px; |
|
|
|
.el-radio{ |
|
|
|
.el-radio { |
|
|
|
line-height: 32px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.upload_img{ |
|
|
|
.upload_img { |
|
|
|
padding-left: 82px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
</style> |
|
|
|
|
|
|
|
<style> |
|
|
|
.avatar-uploader .el-upload { |
|
|
|
border: 1px dashed #d9d9d9; |
|
|
|
border-radius: 6px; |
|
|
|
cursor: pointer; |
|
|
|
position: relative; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
.avatar-uploader .el-upload:hover { |
|
|
|
border-color: #409EFF; |
|
|
|
} |
|
|
|
.avatar-uploader-icon { |
|
|
|
font-size: 28px; |
|
|
|
color: #8c939d; |
|
|
|
width: 178px; |
|
|
|
height: 178px; |
|
|
|
line-height: 178px; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
.avatar { |
|
|
|
width: 178px; |
|
|
|
height: 178px; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
.avatar-uploader .el-upload { |
|
|
|
border: 1px dashed #d9d9d9; |
|
|
|
border-radius: 6px; |
|
|
|
cursor: pointer; |
|
|
|
position: relative; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
.avatar-uploader .el-upload:hover { |
|
|
|
border-color: #409eff; |
|
|
|
} |
|
|
|
.avatar-uploader-icon { |
|
|
|
font-size: 28px; |
|
|
|
color: #8c939d; |
|
|
|
width: 178px; |
|
|
|
height: 178px; |
|
|
|
line-height: 178px; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
.avatar { |
|
|
|
width: 178px; |
|
|
|
height: 178px; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
</style> |
xudanya
4 years ago