<template>
  <div class="testdiv">
    <div class="divborder newSearchDiv" style="margin:0px;">
      <div class="filter">
          <label >{{$t('1132')}}：</label>
          <Cascader :data="datalevel" :value="leveldata" trigger="click" change-on-select class="searchInput" @on-change="getlevel"></Cascader>
      </div>
      <div class="filter">
         <label >{{this.$t('1031')}}：</label>
          <Select v-model="ftype" label-in-value @on-change="ftypechange" clearable class="searchSelect" >
              <Option v-for="item in ftypelist" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
      </div>
      <div class="filter">
          <label >{{this.$t('1032')}}：</label>
          <Select v-model="ctype" label-in-value  clearable class="searchSelect" >
              <Option v-for="item in ctypelist" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
      </div>
      <div class="filter">
          <label >{{$t('500070')}}：</label>
         <Input class="searchInput" v-model="alarmcode"  />
      </div>
      <div v-show="!morecondition">
      <div class="filter">
          <label >{{$t('200054')}}：</label>
          <Select v-model="alarmstate" clearable class="searchSelect">
              <Option :value='0' >{{$t('1014')}}</Option>
              <Option :value='1' >{{$t('950001')}}</Option>
              <Option :value='2' >{{$t('950002')}}</Option>
          </Select>
      </div>
      </div>
      <div class="searchBtn">
        <Button type="primary" class="twoWord" icon="ios-search" @click="tosearch(0)">{{$t('1001')}}</Button>
        <Button type="warning" class="twoWord intervalRight" icon="ios-build"  @click="edit()">{{$t('900311')}}</Button>
        <Button type="primary" class="fourWord" icon="ios-cloud-download" @click="tosearch(1)">{{$t('1007')}}</Button>
      </div>
      <!-- 更多条件 按钮 -->
      <MoreConbtn @getCon="morecondition = !morecondition" :morecondition="morecondition"></MoreConbtn>
    </div>

     <div class="divborder newTableDiv">
      <Table
         class="tableClass"
        @on-current-change="handleRowChange"
        @on-selection-change="handleSelectRow"
        highlight-row
        :data="tableData1"
        :columns="tableColumns1"></Table>
    <div class="pageDiv">
      <div class="pageDirection">
        <Page
          :total="total"
          :current="page"
          @on-change="changePage"
          show-elevator
          show-sizer
          show-total
          @on-page-size-change="handlePageSize"
          :page-size-opts="[10,20,30,40,100]"
        ></Page>
      </div>
    </div>
      <Modal class="newModalClass" :title="editmodaltitle" v-model="editmodal" :styles="{width:'550px'}">
        <div class="modal_body">
        <div class="filter">
            <label><i>*</i>{{this.$t('200005')}}：</label>
             <RadioGroup v-model="isfault">
                <Radio v-for="item in faultlist" :label="item.value" :key="item.value" style="width:100px!important;"><span>{{item.label}}</span></Radio>
            </RadioGroup>
        </div>
        <div class="filter">
            <label ><i>*</i>{{this.$t('950005')}}：</label>
             <Select v-model="faulttype" clearable class="searchSelect" style="margin-right:10px;">
                  <Option v-for="(item,key) in xTypeList" :value="item.id" :key="key">{{ item.name }}</Option>
            </Select>
            <Input type="text" class="searchInput" v-model="faultcategory" :placeholder='this.$t("950008")'/>
        </div>
        <div class="filter">
            <label >{{this.$t('200010')}}：</label>
            <Input type="text" class="searchInput MaxWidth" v-model="faultreason"/>
        </div>
        <div class="filter">
            <label >{{this.$t('500073')}}：</label>
            <Input type="text" class="searchInput MaxWidth" v-model="faultsolution"/>
        </div>
        <div class="filter">
            <label >{{this.$t('800041')}}：</label>
            <Input type="text" class="searchInput MaxWidth" v-model="remark"/>
        </div>
      </div>
      <div slot="footer">
            <Button type="text" size="large" @click="cancel()">{{$t('1033')}}</Button>
            <Button type="primary" size="large" @click="editdata()">{{$t('1011')}}</Button>
        </div>
      </Modal>
  </div>
  </div>
</template>

<script>
import axios from '@/libs/api.request'
export default {
    components: {

    },
    data () {
        return {
            morecondition: false, // 条件
            editmodaltitle: this.$t('1003'),
            leveldata: [], // 产线层级集合
            levelid: 0, // 产线层级id
            tableData1: [], // 列表数据
            page: 1,
            pagesize: 10,
            total: 0,
            datalevel: [],
            editmodal: false,
            detailobj: {},
            ftype: 0,
            ftypelist: [],
            ctype: 0,
            ctypelist: [],
            alarmcode: '',
            alarmstate: '',
            xTypeList: [],
            isfault: 1,
            faulttype: '',
            faultcategory: '',
            faultreason: '',
            faultsolution: '',
            remark: '',
            selectids: [],
            faultlist: [
                {
                    label: this.$t('950000'),
                    value: 1
                },
                {
                    label: this.$t('950006'),
                    value: 2
                }
            ],
            tableColumns1: [
                {
                    type: 'selection',
                    width: 50,
                    align: 'center'
                },
                {
                    type: 'index2',
                    title: this.$t('1008'),
                    key: 'xuhao',
                    render: (h, params) => {
                        return h('span', params.index + (this.page - 1) * this.pagesize + 1)
                    },
                    width: '60px'
                },
                {
                    title: this.$t('200003'),
                    key: 'machine_location',
                    width: '160px'
                },
                {
                    title: this.$t('1040'),
                    key: 'machine_code',
                    width: '100px'
                },
                {
                    title: this.$t('100074'),
                    key: 'machine_type',
                    width: '150px'
                },
                {
                    title: this.$t('500070'),
                    key: 'fault_code',
                    width: '100px'
                },
                {
                    title: this.$t('500071'),
                    key: 'error_msg',
                    width: '250px'
                },
                {
                    title: this.$t('200005'),
                    key: 'fault_content',
                    width: '200px'
                },
                {
                    title: this.$t('200010'),
                    key: 'fault_reason',
                    width: '100px'
                },
                {
                    title: this.$t('800145'),
                    key: 'fault_solution',
                    width: '100px'
                },
                {
                    title: this.$t('500072'),
                    key: 'alarm_times',
                    width: '100px'
                },
                {
                    title: this.$t('950000'),
                    key: 'isFault',
                    width: '100px'
                },
                {
                    title: this.$t('950004'),
                    key: 'markTime',
                    width: '200px'
                },
                {
                    title: this.$t('1030'),
                    key: 'remark',
                    width: '200px'
                }
            ],
            excel:0, //是否导出
        }
    },
    created () {
        this.initlevel()
        this.initftype()
        this.tosearch(0)
        // 格式化表格样式
        this.tableColumns1 = this.$time.initTableTitle(this.tableColumns1)
    },
    methods: {
        selectdate (e) {
            this.dateTime = [e[0], e[1]]
        },
        // 产线层级
        initlevel () {
            axios.request({
                url: 'config/ProjectLevelSection/GetSectionTree',
                method: 'get'
            }).then(res => {
                const arr = []
                this.datalevel = res.data.data
                arr.push(res.data.data[0].value)
                this.leveldata = arr
            })
        },
        // 产线层级选择
        getlevel: function (data) {
            this.levelid = data[data.length - 1]
        },
        tosearch (excel) {
            this.excel = excel
            this.page = 1
            this.pagesize = 10
            this.search()
        },
        search () {
            var machineID = []
            this.tableData1 = []
            var params = {
                levelID: this.levelid,
                typeID: this.ctype !== 0 ? this.ctype : (this.ftype !== 0 ? this.ftype : 0),
                code: this.alarmcode,
                page: this.page,
                pageSize: this.pagesize
            }
            axios.request({
                url: '/cnc/MachineAlarm/selectMachineIDArr',
                params,
                method: 'get'
            })
                .then(res => {
                    // console.log(res.data.data);
                    res.data.data.forEach(i => {
                        machineID.push(i)
                    })
                    if (machineID.length <= 0) {
                        this.total = 0
                        return
                    }
                    // this.page = page
                    var data = {
                        code: this.alarmcode,
                        status: this.alarmstate,
                        machineID: machineID,
                        page: this.page,
                        pagesize: this.pagesize,
                        toexcel:this.excel
                    }
                    axios.request({
                        url: '/cnc/MachineAlarm/GetAlarmInfoForEdit',
                        data,
                        method: 'post'
                    })
                        .then(res => {
                            if(this.excel === 1){
                                document.location.href = axios.publicPath + "" + res.data.data;
                                return false;
                            }
                            this.total = 0
                            this.tableData1 = []
                            if (res.data.ret === 1 && res.data.data.length > 0) {
                                this.total = res.data.total
                                this.mockTableData1(res.data.data)
                            }
                        })
                })
        },
        initftype () {
            axios.request({
                url: '/config/MachineType/GetEditDcategory',
                method: 'get'
            }).then(res => {
                this.ftypelist = res.data.data
            })
        },
        ftypechange () {
            if (this.ftype === undefined) {
                this.ctype = ''
            }
            this.equipmentid = this.ftype
            axios.request({
                url: '/config/MachineType/GetLastMachineType?id=' + this.equipmentid,
                method: 'get'
            }).then(res => {
                this.ctypelist = res.data.data
            })
        },
        mockTableData1 (tablelist) {
            let data = []
            tablelist.forEach(item => {
                if (item) {
                    data.push({
                        machine_code: item.machine_code,
                        machine_location: item.machine_location,
                        machine_type: item.machine_type,
                        fault_code: item.fault_code,
                        fault_content: item.fault_content,
                        fault_reason: item.fault_reason,
                        fault_solution: item.fault_solution,
                        alarm_times: item.alarm_times,
                        remark: item.remark,
                        isFault: item.isFault === 1 ? this.$t('300030') : this.$t('300031'),
                        markTime: item.markTime,
                        id: item.id,
                        error_msg: item.error_msg
                    })
                }
            })
            this.tableData1 = data
        },
        handleRowChange (currentRow, oldCurrentRow) {
            this.detailobj = currentRow
        },
        handlePageSize (value) {
            this.pagesize = value
            this.search()
        },
        changePage (value) {
            this.page = value
            this.search()
        },
        timechange (num) {
            var str = ''
            if (num > 86400) {
                let d = Math.floor(num / 86400)
                let h = Math.floor((num % 86400) / 3600)
                let m = Math.floor(((num % 86400) % 3600) / 60)
                let s = ((num % 86400) % 3600) % 60
                str = d + this.$t('1101') + h + this.$t('1102') + m + this.$t('1103') + s + this.$t('1104')
                return str
            } else if (num > 3600) {
                let h = Math.floor(num / 3600)
                let m = Math.floor((num % 3600) / 60)
                let s = (num % 24) % 60
                str = h + this.$t('1102') + m + this.$t('1103') + s + this.$t('1104')
                return str
            } else if (num > 60) {
                let m = Math.floor(num / 60)
                let s = Math.floor(num % 60)
                str = '' + m + this.$t('1103') + s + this.$t('1104')
                return str
            } else {
                str = num + this.$t('1104')
                return str
            }
        },
        handleSelectRow: function (data) {
            this.selectids = []
            for (var i in data) {
                var item = {
                    id: data[i].id,
                    code: data[i].fault_code
                }
                this.selectids.push(item)
            }
        },
        edit () {
            if (this.selectids === undefined || this.selectids === [] || this.selectids.length === 0) {
                this.$Message.error((this.$t('1017')))
                return false
            }
            this.inifaulttype()
            this.isfault = 1
            this.faulttype = ''
            this.faultcategory = ''
            this.faultreason = ''
            this.faultsolution = ''
            this.remark = ''
            this.editmodal = true
        },
        inifaulttype () {
            axios.request({
                url: '/cnc/MachineAlarm/GetMachineFaultTypes',
                method: 'get'
            }).then(res => {
                this.xTypeList = res.data.data
            })
        },
        editdata () {
            if (this.faulttype === '' && this.faultcategory === '') {
                this.$Message.error(this.$t('950007'))
                return false
            }
            let data = {
                ids: this.selectids,
                isfault: this.isfault,
                faulttype: this.faulttype === 0 ? '' : this.faulttype,
                inputtype: this.faultcategory,
                faultReason: this.faultreason,
                faultSolution: this.faultsolution,
                remark: this.remark
            }
            axios.request({
                url: '/cnc/MachineAlarm/updateAlarm',
                data,
                method: 'post'
            })
                .then(res => {
                    this.editmodal = false
                    this.$Message.info(this.$t('1060'))
                    this.search()
                    this.selectids = []
                })
        },
        cancel () {
            this.editmodal = false
        }
    }
}
</script>
<style lang="less" scoped>
.echart-div-list {
        margin-top: 15px;
        border: 0px solid #ddd;
        padding: 15px;
    }
 .modal_body label {
  width: 100px;
  display: inline-block;
  text-align: right;
}
</style>
