<template>
  <el-dialog :append-to-body="true" :close-on-click-modal="false" :before-close="cancel" :visible.sync="logdialog" :title="'控制记录'" width="40%">
    <!--表格渲染-->
    <el-table v-loading="loading" :data="data" size="small" style="width: 100%;padding: 20px;">
      <!--<el-table-column prop="deviceid" label="设备ID" min-width="130%"/>-->
      <el-table-column prop="wayname" label="支路名称"/>
      <el-table-column prop="way" label="支路"/>
      <el-table-column prop="logtime" label="操作时间" min-width="130%">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.logtime) }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="action" label="操作"/>
      <el-table-column prop="message" label="信息"/>
      <!-- <template slot-scope="scope">
          <el-switch v-model="scope.row.status" :disabled=" deviceStatus==='在线' ? true:false" active-value="1" inactive-value="0" @change="changeStatus($event, scope.row)"/>
        </template>
      </el-table-column>-->
      <!--<el-table-column prop="msg" label="信息"/>-->
      <!--<el-table-column v-if="checkPermission(['ADMIN','SDEVICEWAY_ALL','SDEVICEWAY_EDIT','SDEVICEWAY_DELETE'])" label="操作" width="150px" align="center">
        <template slot-scope="scope">
          <el-button v-permission="['ADMIN','SDEVICEWAY_ALL','SDEVICEWAY_EDIT']" size="mini" type="primary" icon="el-icon-edit" @click="createDialog(scope.row)"/>
        </template>
      </el-table-column>-->
    </el-table>
    <!--分页组件-->
    <el-pagination
      :total="total"
      :current-page="page + 1"
      style="margin-top: 8px;"
      layout="total, prev, pager, next, sizes"
      @size-change="sizeChange"
      @current-change="pageChange"/>
    <!--<div slot="footer" class="dialog-footer">
      <el-button type="text" @click="cancel">取消</el-button>
      <el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
    </div>-->
    <el-dialog :visible.sync="editDialog" width="40%" title="修改支路名称" center append-to-body>
      <el-form ref="form" :model="editForm" :rules="rules" size="small" label-width="80px">
        <el-form-item label="项目名">
          <el-input v-model="editForm.wayname" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="text" @click="editDialog = false">取消</el-button>
        <el-button :loading="loading" type="primary" @click="submitWay">确认</el-button>
      </div>
    </el-dialog>
  </el-dialog>
</template>

<script>
import checkPermission from '@/utils/permission'
import { add, edit, controlWay } from '@/api/sDeviceWay'
import { parseTime } from '@/utils/index'
import { loadLogByDeviceid } from '@/api/sDeviceLog'
// import initData from '@/mixins/initData'
export default {
  // mixins: [initData],
  props: {
  },
  data() {
    return {
      loading: false, logdialog: false, deviceStatus: '', editDialog: false, devicid: '',
      data: [], page: 0, size: 10, total: 0, url: '', params: {}, query: {},
      form: {
        id: '',
        deviceid: '',
        wayname: '',
        way: '',
        status: '',
        msg: '',
        createTime: '',
        updateTime: ''
      },
      editForm: {
        id: '',
        deviceid: '',
        wayname: '',
        way: '',
        status: '',
        msg: '',
        createTime: '',
        updateTime: ''
      },
      rules: {
      }
    }
  },
  /* created() {
    loadByDeviceid()
  },*/
  methods: {
    parseTime,
    checkPermission,
    beforeInit() {
      this.url = 'api/sDeviceWay'
      const sort = 'id'
      this.params = { page: this.page, size: this.size, sort: sort }
      const query = this.query
      const type = query.type
      const value = query.value
      if (type && value) { this.params[type] = value }
      return true
    },
    cancel() {
      this.resetForm()
    },
    changeStatus(val, data) {
      console.log(val)
      controlWay(data).then(response => {
        console.log(response, '11')
        if (response === 'success') {
          this.$notify({
            title: '操作成功',
            type: 'success',
            duration: 2500
          })
        }
      }).catch(err => {
        // this.loading = false
        this.$notify({
          title: '操作失败',
          type: 'warning',
          duration: 2500
        })
        if (data.status === '0') {
          data.status = '1'
        } else {
          data.status = '0'
        }
        console.log(err.response.data.message)
      })
    },
    submitWay() {
      console.log(this.editForm)
      // this.editDialog = false
      this.editForm.msg = null
      edit(this.editForm).then(res => {
        this.reseteditForm()
        this.$notify({
          title: '修改成功',
          type: 'success',
          duration: 2500
        })
        this.loading = false
        this.init()
      }).catch(err => {
        this.loading = false
        console.log(err.response.data.message)
      })
    },
    createDialog(data) {
      console.log(data)
      this.editDialog = true
      // const _this = this.wayForm
      this.editForm = {
        id: data.id,
        deviceid: data.deviceid,
        wayname: data.wayname,
        way: data.way,
        status: data.status,
        msg: data.msg,
        createTime: data.createTime,
        updateTime: data.updateTime
      }
    },
    doSubmit() {
      this.loading = true
      if (this.isAdd) {
        this.doAdd()
      } else this.doEdit()
    },
    doAdd() {
      add(this.form).then(res => {
        this.resetForm()
        this.$notify({
          title: '添加成功',
          type: 'success',
          duration: 2500
        })
        this.loading = false
        this.$parent.init()
      }).catch(err => {
        this.loading = false
        console.log(err.response.data.message)
      })
    },
    doEdit() {
      edit(this.form).then(res => {
        this.resetForm()
        this.$notify({
          title: '修改成功',
          type: 'success',
          duration: 2500
        })
        this.loading = false
        this.$parent.init()
      }).catch(err => {
        this.loading = false
        console.log(err.response.data.message)
      })
    },
    resetForm() {
      this.logdialog = false
      // this.$refs['form'].resetFields()
      this.form = {
        id: '',
        deviceid: '',
        wayname: '',
        way: '',
        status: '',
        msg: '',
        createTime: '',
        updateTime: ''
      }
    },
    reseteditForm() {
      this.editDialog = false
      // this.$refs['form'].resetFields()
      this.form = {
        id: '',
        deviceid: '',
        wayname: '',
        way: '',
        status: '',
        msg: '',
        createTime: '',
        updateTime: ''
      }
    },
    initLog() {
      const sort = 'id,desc'
      this.params = { page: this.page, size: this.size, sort: sort }
      loadLogByDeviceid(this.form, this.params).then(response => {
        this.total = response.totalElements
        this.data = response.content
        console.log(response)
      })
    },
    pageChange(e) {
      this.page = e - 1
      this.initLog()
    },
    sizeChange(e) {
      this.page = 0
      this.size = e
      this.initLog()
    }
  }
}
</script>

<style scoped>

</style>
