xuhuajiao
/
canvasScreen_admin
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

设备管理-修复bug

dev
xuhuajiao 3 years ago
parent
002839c17f
commit
c81e089be9
1 changed files with 124 additions and 94 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 218
      src/views/device/deviceConfig.vue

218
src/views/device/deviceConfig.vue
View File

@ -14,10 +14,12 @@
</div>
</el-col>
<el-col class="page_add" :span="4">
<el-button class="table_add clear_btn" plain :disabled="clearBtnDisabled" @click="clearStartUp">清空</el-button>
<!-- @click="clearStartUp" -->
<el-button class="table_add clear_btn" plain :disabled="clearBtnDisabled">清空</el-button>
</el-col>
</el-row>
</div>
<!-- 配置开关机列表 -->
<el-row :gutter="15">
<el-col>
<el-table style="width: 100%;" :data="startUpList" :header-cell-style="{ background: '#3a8aeb', color: '#fff' }" @selection-change="handleSelectionChange">
@ -31,9 +33,9 @@
</template>
</el-table-column>
<el-table-column prop="period" label="配置周期" align="center" width="300">
<template slot-scope="{row}">
<div>{{ row.open_setting==1? '每天 - 开机 '+row.open_time :'每周'+openWeekly(row.open_weekly)+'开机'+row.open_time }}</div>
<div>{{ row.close_setting==1?'每天 - 关机'+row.close_time :'每周'+closeWeekly(row.close_weekly)+'关机'+row.close_time }}</div>
<template slot-scope="{row}">
<div>{{ row.open_setting==1? '每天 - 开机 '+row.open_time :'每周'+setWeekly(row.open_weekly)+'开机'+row.open_time }}</div>
<div>{{ 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">
@ -81,31 +83,24 @@
<el-radio :label="2" value="weekly">每周</el-radio>
</el-radio-group>
</el-form-item>
<!-- :rules="[
{ required: true, message: '请选择每周开机时间', trigger: 'change' },
]" -->
<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="open_weekly">
<el-checkbox :label='1' name="open_weekly">周一</el-checkbox>
<el-checkbox :label="2" name="open_weekly" >周二</el-checkbox>
<el-checkbox :label="3" name="open_weekly" >周三</el-checkbox>
<el-checkbox :label="4" name="open_weekly" >周四</el-checkbox>
<el-checkbox :label="5" name="open_weekly" >周五</el-checkbox>
<el-checkbox :label="6" name="open_weekly" >周六</el-checkbox>
<el-checkbox :label="7" name="open_weekly" >周日</el-checkbox>
<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="[
{type: 'string', required: true, message: '请选择具体开机时间', trigger: 'change' },
]"
]"
>
<el-time-picker
v-model="form.open_time"
@ -136,31 +131,24 @@
<el-radio :label="2" value="weekly">每周</el-radio>
</el-radio-group>
</el-form-item>
<!-- :rules="[
{ required: true, message: '请选择每周关机时间', trigger: 'change' },
]" -->
<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="close_weekly">
<el-checkbox :label="1" name="close_weekly">周一</el-checkbox>
<el-checkbox :label="2" name="close_weekly" >周二</el-checkbox>
<el-checkbox :label="3" name="close_weekly" >周三</el-checkbox>
<el-checkbox :label="4" name="close_weekly" >周四</el-checkbox>
<el-checkbox :label="5" name="close_weekly" >周五</el-checkbox>
<el-checkbox :label="6" name="close_weekly" >周六</el-checkbox>
<el-checkbox :label="7" name="close_weekly" >周日</el-checkbox>
<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="[
:rules="[
{type: 'string', required: true, message: '请选择具体关机时间', trigger: 'change' },
]"
]"
>
<el-time-picker
v-model="form.close_time"
@ -179,13 +167,13 @@
<div class="setting_cont">
<span>设备方向：</span>
<el-form-item
prop="device_direction"
prop="device_direction_name"
:rules="[
{ required: true, message: '请选择具体设备方向', trigger: 'change' },
]"
>
<el-select v-model="form.device_direction" size="small" class="filter-item">
<el-option v-for="item in deviceData" :key="item.key" :label="item.name" :value="item.key" />
<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>
</el-form-item>
</div>
@ -249,7 +237,8 @@ export default {
// 开关机列表的数据
startUpList: [],
form: {
device_direction:null,
device_direction: null,
device_direction_name: null,
device_id: '',
open_setting: null, // 开机状态的每天和每周
close_setting: null, // 关机状态的每天和每周
@ -259,39 +248,61 @@ export default {
open_weekly: [],
close_weekly: []
},
open_weekly: [],
close_weekly: [],
selectOpenWeekly: [], // 选中的开机每周状态
selectCloseweekly: [], // 选中的关机机每周状态
addFromVisible: false,
selectedList: [],
clearBtnDisabled: true,
deviceData: [{ key: '1', name: '竖屏' }, { key: '2', name: '横屏' }]
deviceData: [{ key: '1', name: '竖屏' }, { key: '2', name: '横屏' }],
weeklyList: [
{
id: '1',
name: '周一'
},
{
id: '2',
name: '周二'
},
{
id: '3',
name: '周三'
},
{
id: '4',
name: '周四'
},
{
id: '5',
name: '周五'
},
{
id: '6',
name: '周六'
},
{
id: '7',
name: '周七'
}
]
}
},
computed: {
// 将字符串渲染成汉字显示到页面
openWeekly(){
const a ={
1:'一',
2:'二',
3:'三',
4:'四',
5:'五',
6:'六',
7:'七'
setWeekly() {
const a = {
1: '一',
2: '二',
3: '三',
4: '四',
5: '五',
6: '六',
7: '七'
}
return(str)=>str.split(',').map(i=>a[i]).join('/')
},
closeWeekly(){
const a ={
1:'一',
2:'二',
3:'三',
4:'四',
5:'五',
6:'六',
7:'七'
return function(str) {
if (str) {
return str.split(',').map(i => a[i]).join('/')
}
}
return(str)=>str.split(',').map(i=>a[i]).join('/')
}
},
watch: {},
@ -310,24 +321,33 @@ export default {
}
})
},
// 编辑
// 编辑开关机
editFormData(row) {
this.$nextTick(()=>{
console.log(this.$refs.childUpload)
// this.$refs.childUpload.imageUrl=this.form.startup_screen
})
console.log(this.form.startup_screen)
this.addFromVisible = true
this.form.device_id=row.device_id
this.form.open_setting=row.open_setting
this.form.close_setting=row.close_setting
this.form.open_time=row.open_time
this.form.close_time=row.close_time
this.form.startup_screen=row.startup_screen
this.form.open_weekly=row.open_weekly
this.form.close_weekly=row.close_weekly
this.form.device_direction=row.device_direction==1?'竖屏':'横屏'
this.form.device_id = row.device_id
this.form.open_setting = row.open_setting
this.form.close_setting = row.close_setting
this.form.open_time = row.open_time
this.form.close_time = row.close_time
this.form.startup_screen = row.startup_screen
this.form.open_weekly = row.open_weekly
if (row.open_weekly) {
this.selectOpenWeekly = row.open_weekly.split(',')
}
console.log(this.form.open_weekly)
console.log(typeof this.form.open_weekly)
console.log(this.selectOpenWeekly)
this.form.close_weekly = row.close_weekly
if (row.close_weekly) {
this.selectCloseweekly = row.close_weekly.split(',')
}
this.form.device_direction_name = row.device_direction == 1 ? '竖屏' : '横屏'
this.form.device_direction = row.device_direction
this.$nextTick(() => {
this.$refs.childUpload.imageUrl = this.form.startup_screen
})
},
// 每天/每周切换的情况下数据处理
clearCheckbox() {
if (this.form.open_setting === 1) {
this.open_weekly = []
@ -335,33 +355,42 @@ export default {
}
if (this.form.close_setting === 1) {
this.close_weekly = []
this.form.close_weekly=null
this.form.close_weekly = null
}
},
// 选择设备方向处理
selectDirection(selVal) {
this.key = selVal.key
this.name = selVal.name
this.form.device_direction = selVal.key
this.form.device_direction_name = selVal.name
},
// 重置表单数据
resetForm(formName) {
this.addFromVisible = false
this.$refs[formName].resetFields()
},
// 提交表单数据
submitForm(formName) {
this.form.startup_screen = this.$refs.childUpload.imageUrl
if (this.form.open_setting === 2) {
this.form.open_weekly = this.open_weekly.join(',')
this.form.open_weekly = this.selectOpenWeekly.join(',')
}
if(this.form.close_setting ===2) {
this.form.close_weekly=this.close_weekly.join(',')
if (this.form.close_setting === 2) {
this.form.close_weekly = this.selectCloseweekly.join(',')
}
this.$refs[formName].validate(valid => {
if (valid) {
const params = {
close_setting:this.form.close_setting,
close_time:this.form.close_time,
close_weekly:this.form.close_weekly,
device_id:this.form.device_id,
open_setting:this.form.open_setting,
open_time:this.form.open_time,
open_weekly:this.form.open_weekly,
device_direction:this.form.device_direction,
startup_screen:this.form.startup_screen
close_setting: this.form.close_setting,
close_time: this.form.close_time,
close_weekly: this.form.close_weekly,
device_id: this.form.device_id,
open_setting: this.form.open_setting,
open_time: this.form.open_time,
open_weekly: this.form.open_weekly,
device_direction: this.form.device_direction,
startup_screen: this.form.startup_screen
}
console.log(params)
reqEditStartUp(params).then(res => {
@ -380,10 +409,10 @@ export default {
}
})
},
handleAvatarSuccess(res, file) {
this.form.startup_screen = res.data
},
// handleAvatarSuccess(res, file) {
// this.form.startup_screen = res.data
// },
// 列表多选操作 - 清空btn状态
handleSelectionChange(val) {
this.selectedList = val
if (val.length > 0) {
@ -396,6 +425,7 @@ export default {
}
}
</script>
<style lang="scss" scoped>
.setting_btn{
margin-right: 10px;
@ -466,7 +496,7 @@ export default {
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;

Write Preview
Loading…
Cancel
Save