index.vue

<!--
 * @Author: panda
 * @Date: 2021-12-18 13:00:42
 * @LastEditTime: 2021-12-26 10:17:41
 * @LastEditors: Please set LastEditors
 * @Description: 系统设置
 * @FilePath: /sdc-face/src/views/DataShow/index.vue
-->
<template>
  <div class="sysbox">
    <div class="sys-item-box">
      <div class="sys-header">服务状态信息</div>
      <div class="sys-content">
        <el-row>
          <el-col :span="8">
            <span>授权序列号：</span>
          </el-col>
          <el-col :span="8">授权有效期：{{licence.lastdate}}</el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <span>算法版本号：</span>
          </el-col>
          <el-col :span="8">软件版本号：{{licence.cpuid}}</el-col>
          <el-col :span="8">硬件版本号：</el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <span>出厂版本号：</span>
          </el-col>
          <el-col :span="8">
            <span>Web版本号：</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <span>数据服务地址：</span>
          </el-col>
          <el-col :span="8">
            <span>中心状态：</span>
          </el-col>
        </el-row>
      </div>
    </div>
    <div class="sys-item-box">
      <div class="sys-header">工作时间</div>
      <div class="sys-content">
        <el-col :span="8">
          <span>开始时间：</span>
          <el-date-picker v-model="commonconfig.workStartTime" type="date" placeholder="选择日期">
          </el-date-picker>
        </el-col>
        <el-col :span="8">
          <span>结束时间：</span>
          <el-date-picker v-model="commonconfig.workEndTime" type="date" placeholder="选择日期">
          </el-date-picker>
        </el-col>
        <el-col :span="8">
          <el-button type="primary" class="savebtn" size="mini" @click="setWorkTimer">保存</el-button>
        </el-col>
      </div>
    </div>
    <div class="sys-item-box">
      <div class="sys-header">中心配置</div>
      <div class="sys-content">
        <div class="bth">
          <span class="sys-label">Http地址：</span>
          <div class="sys-set-content">
            <el-input v-model="commonconfig.httpUploadAddr" size="mini"></el-input>
          </div>
         
        </div>
        <el-row>
          <span>上传截图：</span>
          <el-radio v-model="commonconfig.uploadjpgswitch" :label="1">是</el-radio>
          <el-radio v-model="commonconfig.uploadjpgswitch" :label="0">否</el-radio>
           <el-button type="primary" class="savebtn" size="mini" @click="setCenterParam">保存</el-button>
        </el-row>
        <el-row class="bth">
          <span class="sys-label">截图时间：</span>
          <div class="sys-set-content">
            <el-slider
              v-model="commonconfig.uploadjpginterval"
              :min="0"
              :max="24"
              :step="1"
              range
      show-stops
              input-size="mini"
              style="
                position: relative;
                float: none;
                width: 376px;
                margin-left: 15px;
              "
            >
            </el-slider>
          </div>
        </el-row>
        <el-row class="bth">
          <span class="sys-label">截图张数：</span>
          <div class="sys-set-content">
            <el-slider
              v-model="commonconfig.uploadjpgnum"
              :min="180"
              :max="3600"
              :step="1"
              input-size="mini"
              show-input
              :show-tooltip="false"
              style="
                position: relative;
                float: none;
                width: 376px;
                margin-left: 15px;
              "
            >
            </el-slider>
          </div>
        </el-row>
        <el-row class="bth">
          <span class="sys-label">截图间隔：</span>
          <div class="sys-set-content">
            <el-slider
              v-model="commonconfig.uploadjpginterval"
              :min="180"
              :max="3600"
              :step="1"
              input-size="mini"
              show-input
              :show-tooltip="false"
              style="
                position: relative;
                float: none;
                width: 376px;
                margin-left: 15px;
              "
            >
            </el-slider>
          </div>
        </el-row>
        <el-row>
          <span>上传心跳：</span>
          <el-radio v-model="cutpic" :label="1">是</el-radio>
          <el-radio v-model="cutpic" :label="0">否</el-radio>
        </el-row>
        <el-row class="bth">
          <span class="sys-label">心跳间隔：</span>
          <div class="sys-set-content">
            <el-slider
              v-model="commonconfig.keepaliveinterval"
              :min="180"
              :max="3600"
              :step="1"
              input-size="mini"
              show-input
              :show-tooltip="false"
              style="
                position: relative;
                float: none;
                width: 376px;
                margin-left: 15px;
              "
            >
            </el-slider>
          </div>
        </el-row>
      </div>
    </div>
    <div class="sys-item-box">
      <div class="sys-header">存储配置</div>
      <div class="sys-content">
        <el-row>
          <span>发送间隔：</span>
          <el-radio-group v-model="sendinterval">
            <el-radio v-for="(item,index) in sdata" :key="index" :label="item.key">{{item.val}}</el-radio>
          </el-radio-group>
        </el-row>
        <el-row style="margin-top:10px">
          <span>数据存储：</span>
          <el-checkbox v-model="save">本地保存</el-checkbox>
           <el-button type="primary" class="savebtn" size="mini" @click="setModBusiness">保存</el-button>
        </el-row>
      </div>
    </div>
    <div class="sys-item-box">
      <div class="sys-header">备份</div>
      <div class="sys-content">
        <el-row>
          <el-col :span="19">
             <el-checkbox-group v-model="backList">
              <el-checkbox v-for="(item,index) in backListData" :key="index" :label="item.val">{{item.key}}</el-checkbox>
            </el-checkbox-group>
          </el-col>
          <el-col :span="5">
          <el-button class="savebtn">备份</el-button>
          </el-col>
         
        </el-row>
        <el-row>
        <el-upload
          class="upload-demo"
          ref="upload"
          action="https://jsonplaceholder.typicode.com/posts/"
          :on-remove="handleRemove"
          :file-list="fileList"
          :auto-upload="false">
          <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
          <span style="with:190px;display:inline-block;margin-left:10px"><el-input size="mini" style="width:100%" disabled="disabled"></el-input></span>
          <el-button class="savebtn" style="margin-top:5px" size="small" type="success" @click="submitUpload">恢复</el-button>
          <div slot="tip" class="el-upload__tip">只能上传zip文件，且不超过500kb</div>
        </el-upload>

        </el-row>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      cutpic: 0,
      serverData: {},
      stimer:"1",
      licence:{},
      commonconfig:{
        workStartTime:""
      },
      backList:[],
      fileList:[],
      sendinterval:60,
      businessData:{},
      save:0,
      backListData:[{
        key:'算法参数',
        val:'1',
      },{
        key:'规则参数',
        val:'1',
      },{
        key:'模型参数',
        val:'1',
      },{
        key:'运行参数',
        val:'1',
      }],
      sdata:[{
        key:'1',
        val:'1秒'
      },{
        key:'6',
        val:'6秒'
      },{
        key:'60',
        val:'1分钟'
      },{
        key:'120',
        val:'2分钟'
      },{
        key:'600',
        val:'10分钟'
      },{
        key:'900',
        val:'15分钟'
      },{
        key:'1800',
        val:'30分钟'
      },{
        key:'3600',
        val:'60分钟'
      }]
    };
  },
  methods:{
    /**
     * @description: 获取基础配置
     * @param {*}
     * @return {*}
     */    
    getDeviceBasicInfo(){
      this.$api.getDeviceBasicInfo().then(res=> {
        let {commonconfig,licence} = res.data;
        this.commonconfig = commonconfig || {};
        this.licence = licence;
      })
    },
    /**
     * @description: 获取存储配置
     * @param {*}
     * @return {*}
     */    
    getBusiness(){
      this.$api.getBusiness().then(res=> {
        let {result:{inout}} = res.business;
        this.businessData = res.data
        this.sendinterval = inout.sendinterval;
        this.save = inout.save;
      })
    },
   /**
     * @description: 设置存储配置
     * @param {*}
     * @return {*}
     */    
    setModBusiness(){
      this.businessData.result.inout.sendinterval = this.sendinterval;
      this.businessData.result.inout.save = this.save;
      this.$api.setModBusiness(this.businessData).then(res=> {

      })
    },
    /**
     * @description: 设置中心参数
     * @param {*}
     * @return {*}
     */    
    setCenterParam(){
      let data = {
        channelid:'1',
        centerconfig:this.commonconfig
      }
      this.$api.setCenterParam(data).then(res => {

      })
    },
    /**
     * @description: 设置工作时间
     * @param {*}
     * @return {*}
     */    
    setWorkTimer(){
      debugger
      let data = {
        startTime:this.commonconfig.workStartTime,
        endTime:this.commonconfig.workEndTime,
      }
      this.$api.setWorking(data).then(res => {

      })
    },
  
    handleRemove(){},
    /**
     * @description: 提交算法配置文件
     * @param {*}
     * @return {*}
     */    
    submitUpload(){},
  },
  created(){
    this.getDeviceBasicInfo()
  }
};
</script>

<style scope>
.sysbox {
  margin-top: 10px;
  font-size: 14px;
}
.sys-item-box .sys-header {
  height: 35px;
  line-height: 35px;
  background: rgba(142,228,258,1);
  padding-left: 10px;
}
.sys-item-box {
  width: 100%;
  overflow: hidden;
  padding: 10px 0;
}
.sys-item-box .sys-content {
  margin: 10px 0;
  padding-left: 10px;
}
.savebtn {
  float: right;
}
.sys-label {
  float: left;
  height: 35px;
  line-height: 35px;
}
.sys-set-content {
  float: left;
}
.bth {
  overflow: hidden;
}
</style>