设备管理

src/views/device/deviceConfig.vue

@@ -26,27 +26,27 @@
           <el-table-column prop="device_id" label="设备ID" align="center" />
           <el-table-column prop="device_account" label="设备账号" align="center" width="150" />
           <el-table-column prop="device_name" label="设备名称" align="center" />
-          <el-table-column label="设备方向" align="center" >
-              <template slot-scope="{row}">
-              <div>{{row.device_direction==1? '竖屏' : '横屏' }}</div>
+          <el-table-column label="设备方向" align="center">
+            <template slot-scope="{row}">
+              <div>{{ row.device_direction==1? '竖屏' : '横屏' }}</div>
             </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 :'每周'+row.open_weekly}}</div>
-                <div>{{row.close_setting==1? '关机 - '+row.close_time :'每周'+row.close_weekly}}</div>
+          </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 :'每周'+row.open_weekly }}</div>
+              <div>{{ row.close_setting==1? '关机 - '+row.close_time :'每周'+row.close_weekly }}</div>
             </template>
-           </el-table-column>
+          </el-table-column>
           <el-table-column label="启动画面" align="center">
             <template slot-scope="{row}">
               <el-image class="cover_img" :src="row.startup_screen" />
             </template>
           </el-table-column>
-          <el-table-column prop="create_time" label="创建时间" align="center" width="200" >
+          <el-table-column prop="create_time" label="创建时间" align="center" width="200">
             <template slot-scope="{row}">
-              <div>{{ row.create_time | parseTime}}</div>
+              <div>{{ row.create_time | parseTime }}</div>
             </template>
-             </el-table-column>
+          </el-table-column>
           <el-table-column fixed="right" label="操作" align="center" width="120">
             <template slot-scope="scope">
               <el-button
@@ -85,19 +85,19 @@
                 <el-form-item
                   v-if="form.open_setting === 2"
                   :class="{'weekly_margin': form.open_setting === 2}"
-                  prop="openweekly"
+                  prop="open_weekly"
                   :rules="[
                     { required: true, message: '请选择每周开机时间', trigger: 'change' },
                   ]"
                 >
-                  <el-checkbox-group v-model="openweekly">
-                    <el-checkbox label="周一" name="openweekly" />
-                    <el-checkbox label="周二" name="openweekly" />
-                    <el-checkbox label="周三" name="openweekly" />
-                    <el-checkbox label="周四" name="openweekly" />
-                    <el-checkbox label="周五" name="openweekly" />
-                    <el-checkbox label="周六" name="openweekly" />
-                    <el-checkbox label="周日" name="openweekly" />
+                  <el-checkbox-group v-model="open_weekly">
+                    <el-checkbox label="周一" name="open_weekly" />
+                    <el-checkbox label="周二" name="open_weekly" />
+                    <el-checkbox label="周三" name="open_weekly" />
+                    <el-checkbox label="周四" name="open_weekly" />
+                    <el-checkbox label="周五" name="open_weekly" />
+                    <el-checkbox label="周六" name="open_weekly" />
+                    <el-checkbox label="周日" name="open_weekly" />
                   </el-checkbox-group>
                 </el-form-item>
                 <el-form-item
@@ -192,14 +192,15 @@
             <!--   action="https://jsonplaceholder.typicode.com/posts/" -->
             <div class="setting_cont upload_img">
               <el-form-item prop="startup_screen">
-               <el-upload
-                class="avatar-uploader"
-                action=""
-                :show-file-list="false"
-                :on-success="handleAvatarSuccess">
-                <img v-if="form.startup_screen" :src="form.startup_screen" class="avatar">
-                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
-              </el-upload>
+                <el-upload
+                  class="avatar-uploader"
+                  action=""
+                  :show-file-list="false"
+                  :on-success="handleAvatarSuccess"
+                >
+                  <img v-if="form.startup_screen" :src="form.startup_screen" class="avatar" />
+                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                </el-upload>
               <!-- <el-dialog :visible.sync="dialogVisible">
                 <img width="100%" :src="dialogImageUrl" alt />
               </el-dialog>-->
@@ -217,86 +218,86 @@
 </template>
 
 <script>
-import {reqStartUpList,reqEditStartUp} from '@/api/device/startUpList.js'
-import {parseTime} from '@/utils/index.js'
+import { reqStartUpList, reqEditStartUp } from '@/api/device/startUpList.js'
+import { parseTime } from '@/utils/index.js'
 export default {
   name: 'DeviceConfig',
+  filters: {
+    parseTime(time, cFormat) {
+      return parseTime(time, cFormat)
+    }
+  },
   data() {
     return {
-      query:{
-        blurry:''
+      query: {
+        blurry: ''
       },
       // 获取开关机列表的参数
-      queryInfo:{
-        device_id:'',
-        device_name:'',
-        is_state:'',
-        page:'1',
-        size:'3'
+      queryInfo: {
+        device_id: '',
+        device_name: '',
+        is_state: '',
+        page: '1',
+        size: '3'
       },
       // 开关机列表的数据
-      startUpList:[],
-      form:{
-         device_id:'',
-         open_setting: null,  //开机状态的每天和每周
-         close_setting: null,  //关机状态的每天和每周      
-         orientation: null,  //设备方向
-         open_time: '',  //具体的开机时间
-         close_time: ''  ,//具体的关机时间
-         startup_screen:''  ,//启动画面的图片   
-         open_weekly:[],
-         close_weekly:[]
+      startUpList: [],
+      form: {
+        device_id: '',
+        open_setting: null, // 开机状态的每天和每周
+        close_setting: null, // 关机状态的每天和每周
+        orientation: null, // 设备方向
+        open_time: '', // 具体的开机时间
+        close_time: '', // 具体的关机时间
+        startup_screen: '', // 启动画面的图片
+        open_weekly: []
+        // close_weekly: []
       },
-      openweekly:[],
-      closeweekly:[],
-       addFromVisible: false,
-       selectedList: [],
-       clearBtnDisabled: true,
-       deviceData: [{ key: '0', name: '竖屏' }, { key: '1', name: '横屏' }]
-    }
-  },
-  filters: {
-    parseTime(time, cFormat) {
-      return parseTime(time, cFormat)
+      open_weekly: [],
+      closeweekly: [],
+      addFromVisible: false,
+      selectedList: [],
+      clearBtnDisabled: true,
+      deviceData: [{ key: '0', name: '竖屏' }, { key: '1', name: '横屏' }]
     }
   },
   computed: {},
   watch: {},
-  mounted(){
+  mounted() {
     this.getStartUpList()
   },
   methods: {
     // 获取开关机列表
-    getStartUpList(){
+    getStartUpList() {
       const params = this.queryInfo
-     reqStartUpList(params).then(res => {
-         if(res.code==200) {
-          this.startUpList=res.data.content
-         }else{
-            return this.$message.error('获取设备列表失败！')
-         }
+      reqStartUpList(params).then(res => {
+        if (res.code == 200) {
+          this.startUpList = res.data.content
+        } else {
+          return this.$message.error('获取设备列表失败！')
+        }
       })
     },
     // 编辑
     editFormData(index, row) {
       console.log(row)
       this.addFromVisible = true
-      this.form={ ...row }
-    //  this.form={
-    //    ontime:row.open_setting ,
-    //    offtime:row.close_setting,
-    //    ontimeValue:row.open_time,
-    //    offtimeValue:row.close_time,
-    //  }
-    //  this.offweek=row.close_weekly
-    //  this.onweek=row.open_weekly
-    
+      this.form = { ...row }
+      //  this.form={
+      //    ontime:row.open_setting ,
+      //    offtime:row.close_setting,
+      //    ontimeValue:row.open_time,
+      //    offtimeValue:row.close_time,
+      //  }
+      //  this.offweek=row.close_weekly
+      //  this.onweek=row.open_weekly
     },
     clearCheckbox() {
-      if (this.form.open_setting == 1) {
-        this.openweekly = []
+      if (this.form.open_setting === 1) {
+        this.open_weekly = []
+        this.form.open_weekly = null
       }
-      if (this.form.close_setting == 1) {
+      if (this.form.close_setting === 1) {
         this.closeweekly = []
       }
     },
@@ -305,18 +306,22 @@ export default {
       this.$refs[formName].resetFields()
     },
     submitForm(formName) {
+      if (this.form.open_setting === 2) {
+        this.form.open_weekly = this.open_weekly
+      }
       this.$refs[formName].validate(valid => {
         if (valid) {
-          const params =this.form
-          reqEditStartUp(params).then(res=>{
-             if(res.code==200) {
-            this.$message({
-              type: "success",
-              message: '修改设备成功'
-            });
-             this.addFromVisible = false
+          const params = this.form
+          console.log(params)
+          reqEditStartUp(params).then(res => {
+            if (res.code == 200) {
+              this.$message({
+                type: 'success',
+                message: '修改设备成功'
+              })
+              this.addFromVisible = false
               this.getStartUpList()
-         }
+            }
           })
         } else {
           console.log('error submit!!')
@@ -324,8 +329,8 @@ export default {
         }
       })
     },
-    handleAvatarSuccess(res, file){
-      this.form.startup_screen=res.data
+    handleAvatarSuccess(res, file) {
+      this.form.startup_screen = res.data
     },
 
     handleSelectionChange(val) {
@@ -336,7 +341,6 @@ export default {
         this.clearBtnDisabled = true
       }
       console.log(val)
-    
     }
   }
 }