<template>
    <div class="app-container">
        <el-card class="main-card">
            <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="75px" style="margin-bottom: -20px"
                v-show="showSearch">
                <el-form-item label="设备名称" prop="deviceName">
                    <el-input v-model="queryParams.deviceName" placeholder="请输入设备名称" clearable size="small"
                        style="width: 150px" />
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" icon="el-icon-search" size="mini">{{ $t('search') }}</el-button>
                    <el-button icon="el-icon-refresh" size="mini">{{ $t('reset') }}</el-button>
                </el-form-item>
            </el-form>
        </el-card>
        <el-card class="main-card" shadow="never">
            <div class="card-toolbar mb8">
                <div>
                    <el-button type="primary" icon="el-icon-plus" size="mini" v-hasPermi="['dtu:devicondtu:add']"
                        @click="getFormOpen(null)">{{ $t('add') }}</el-button>
                    <el-button type="primary" icon="el-icon-delete" size="mini" v-hasPermi="['dtu:devicondtu:dalete']"
                        @click="deleteDtudev">删除</el-button>
                </div>
            </div>
            <el-table class="base-table" :data="tableData" border style="width: 100%; margin-top: 10px"
                @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column prop="deviceDtuName" label="设备名称" align="center" width="150px"></el-table-column>
                <el-table-column prop="deviceDtuGroupName" label="分组" align="center" width="150px"></el-table-column>
                <el-table-column prop="deviceDtuBh" label="设备编号" align="center" width="200px"></el-table-column>
                <el-table-column label="创建时间" align="center" width="150px">
                    <template slot-scope="scope">
                        <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="操作" align="center">
                    <template slot-scope="scope">
                        <el-button size="mini" plain style="padding: 5px" type="primary" icon="el-icon-view"
                            v-hasPermi="['dtu:devicondtu:select']"
                            @click="getSelect(scope.row.deviceDtuJosn)">查看参数</el-button>
                        <el-button size="mini" plain style="padding: 5px" type="primary" icon="el-icon-edit"
                            v-hasPermi="['dtu:devicondtu:update']" @click="getFormOpen(scope.row)">修改</el-button>
                        <el-button size="mini" plain style="padding: 5px" type="primary" icon="el-icon-bottom"
                            v-hasPermi="['dtu:devicondtu:upload']">导出配置</el-button>
                        <el-button size="mini" plain style="padding: 5px" type="primary" icon="el-icon-s-operation"
                            v-hasPermi="['dtu:devicondtu:gsyd']">归属移动</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
                :limit.sync="queryParams.pageSize" />
        </el-card>

        <!--查看配置-->
        <el-dialog title="参数配置" :visible.sync="Pzopen" width="75%" append-to-body :before-close="cancel">
            <el-form ref="form" :model="form" style="font-size: 13px">
                <el-tabs v-model="activeName" @tab-click="handleClick">
                    <el-tab-pane label="基本参数" name="first">
                        <el-form-item label="模式:">
                            <el-radio-group v-model="form.passon">
                                <el-radio :label="0">透传</el-radio>
                                <el-radio :label="1">单片机控制</el-radio>
                            </el-radio-group>
                        </el-form-item>
                        <el-form-item label="是否加设备识别码IMEI:" v-if="form.passon === 0">
                            <el-radio-group v-model="form.plate">
                                <el-radio :label="0">不加</el-radio>
                                <el-radio :label="1">加</el-radio>
                            </el-radio-group>
                        </el-form-item>
                        <el-form-item label="报文转换（bin -- hex）:">
                            <el-radio-group v-model="form.convert">
                                <el-radio :label="0">转换</el-radio>
                                <el-radio :label="1">不换</el-radio>
                            </el-radio-group>
                            <span style="margin-left: 2%">提示: 如果启用数据流模板，这里选择“不换“</span>
                        </el-form-item>
                        <el-form-item label="首次登陆服务器发送注册信息:">
                            <el-radio-group v-model="form.reg.type">
                                <el-radio :label="1">发送{csq:rssi,imei:imei,iccid:iccid,ver:Version}</el-radio>
                                <el-radio :label="2">发送HEX报文"13,12345,12345"</el-radio>
                                <el-radio :label="0">不发</el-radio>
                                <el-radio :label="3">自定义</el-radio>
                                <el-radio :label="4">顺序生成</el-radio>
                            </el-radio-group>
                            <div v-if="form.reg.type === 3" style="margin-top: 10px">
                                <el-input v-model="form.reg.data" style="width: 200px"></el-input>
                            </div>
                            <div v-if="form.reg.type === 4" style="margin-top: 10px">
                                <span>前缀：</span>
                                <el-input v-model="form.reg.prefix" style="width: 200px"></el-input>
                                <span style="margin-left: 2%">后缀：</span>
                                <el-input v-model="form.reg.postfix" style="width: 200px"></el-input>
                            </div>
                        </el-form-item>
                        <el-form-item label="参数版本号:">
                            <el-input-number v-model="form.param_ver" controls-position="right"
                                style="width: 200px"></el-input-number>
                            <span style="margin-left: 2%">提示: 范围 1~n</span>
                        </el-form-item>
                        <el-form-item label="每分钟最大串口流量(Byte):">
                            <el-input v-model="form.flow" style="width: 200px"></el-input>
                            <span style="margin-left: 2%">提示: 0为不启用</span>
                        </el-form-item>
                        <el-form-item label="是否启用自动更新:">
                            <el-radio-group v-model="form.fota">
                                <el-radio :label="0">否</el-radio>
                                <el-radio :label="1">是</el-radio>
                            </el-radio-group>
                        </el-form-item>
                        <el-form-item label="串口分帧超时:">
                            <el-input-number v-model="form.uartReadTime" controls-position="right"
                                style="width: 200px"></el-input-number>
                            <span style="margin-left: 2%">提示:（单位：ms 默认25ms，范围10-2000）</span>
                        </el-form-item>
                        <el-form-item label="电源模式:">
                            <el-radio-group v-model="form.pwrmod">
                                <el-radio label="normal">正常</el-radio>
                                <el-radio label="energy">节能</el-radio>
                            </el-radio-group>
                        </el-form-item>
                        <el-form-item label="配置密码:">
                            <el-input v-model="form.password" style="width: 200px"></el-input>
                            <span style="margin-left: 2%">提示:只允许包含字母数字_</span>
                        </el-form-item>
                        <el-form-item label="网络分帧超时:">
                            <el-input v-model="form.netReadTime" style="width: 200px"></el-input>
                            <span style="margin-left: 2%">提示:同串口分帧超时，默认 0</span>
                        </el-form-item>
                        <el-form-item label="日志输出:">
                            <el-radio-group v-model="form.nolog">
                                <el-radio label="0">关闭</el-radio>
                                <el-radio label="1">开启</el-radio>
                            </el-radio-group>
                        </el-form-item>
                        <el-form-item label="是否打开RNDIS:">
                            <el-radio-group v-model="form.isRndis">
                                <el-radio label="0">关闭</el-radio>
                                <el-radio label="1">开启</el-radio>
                            </el-radio-group>
                        </el-form-item>
                        <el-form-item label="是否打开ipv6:">
                            <el-radio-group v-model="form.isipv6">
                                <el-radio label="0">关闭</el-radio>
                                <el-radio label="1">开启</el-radio>
                            </el-radio-group>
                            <span
                                style="margin-left: 2%">提示:目前仅780E/700E/600E/780EX/780EG支持该选项，724/720系列/820/600ug等模组不支持</span>
                        </el-form-item>
                        <el-form-item label="是否守护全部网络通道:">
                            <el-radio-group v-model="form.webProtect">
                                <el-radio label="0">个别</el-radio>
                                <el-radio label="1">全部</el-radio>
                            </el-radio-group>
                        </el-form-item>
                        <p>提示: 服务器连接断开时5分钟会重启，守护全部通道有一个断开就重启，守护个别通道在个别通道断开会重启</p>
                        <el-form-item label="守护的线路:" v-if="form.webProtect === '0'">
                            <el-checkbox-group v-model="form.protectContent">
                                <el-checkbox v-for="channel in channels" :key="channel.id" :label="channel.id">
                                    {{ channel.name }}
                                </el-checkbox>
                            </el-checkbox-group>
                        </el-form-item>
                    </el-tab-pane>
                    <el-tab-pane label="串口参数" name="second">
                        <el-tabs v-model="activeNameckcs" @tab-click="handleClick01">
                            <el-tab-pane label="串口1" name="ckcs01">
                                <el-form-item>
                                    <el-radio-group v-model="uconfData[0].ckcs01">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                                <div v-if="uconfData[0].ckcs01 == 0">
                                    <el-form-item label="波特率:">
                                        <el-select v-model="uconfData[0].btl01" clearable placeholder="请选择">
                                            <el-option v-for="item in optionsbtl" :key="item.value" :label="item.label"
                                                :value="item.value"></el-option>
                                        </el-select>
                                        <span style="margin-left: 2%">单位bps</span>
                                    </el-form-item>
                                    <el-form-item label="数据位:">
                                        <el-radio-group v-model="uconfData[0].sjw01">
                                            <el-radio label="8">8</el-radio>
                                            <el-radio label="7">7</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="校验位:">
                                        <el-radio-group v-model="uconfData[0].xyw01">
                                            <el-radio label="0">uart.PAR_EVEN</el-radio>
                                            <el-radio label="1">uart.PAR_ODD</el-radio>
                                            <el-radio label="2">uart.PAR_NONE</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="停止位:">
                                        <el-radio-group v-model="uconfData[0].tzw01">
                                            <el-radio label="1">1</el-radio>
                                            <el-radio label="2">2</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="485DIR:">
                                        <el-select v-model="uconfData[0].dir01" clearable placeholder="请选择">
                                            <el-option v-for="item in optionsDir" :key="item.value" :label="item.label"
                                                :value="item.value"></el-option>
                                        </el-select>
                                        <span style="margin-left: 2%">提示: 485方向控制GPIO</span>
                                    </el-form-item>
                                    <el-form-item label="485oe转向延迟时间:">
                                        <el-input v-model="uconfData[0].zxycsj01" style="width: 200px"></el-input>
                                        <span style="margin-left: 2%">单位US</span>
                                    </el-form-item>
                                </div>
                            </el-tab-pane>
                            <el-tab-pane label="串口2" name="ckcs02">
                                <el-form-item>
                                    <el-radio-group v-model="form.ckcs02">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                                <div v-if="form.ckcs02 == 0">
                                    <el-form-item label="波特率:">
                                        <el-select v-model="form.btl01" clearable placeholder="请选择">
                                            <el-option v-for="item in optionsbtl" :key="item.value" :label="item.label"
                                                :value="item.value"></el-option>
                                        </el-select>
                                        <span style="margin-left: 2%">单位bps</span>
                                    </el-form-item>
                                    <el-form-item label="数据位:">
                                        <el-radio-group v-model="form.sjw01">
                                            <el-radio label="8">8</el-radio>
                                            <el-radio label="7">7</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="校验位:">
                                        <el-radio-group v-model="form.xyw01">
                                            <el-radio label="0">uart.PAR_EVEN</el-radio>
                                            <el-radio label="1">uart.PAR_ODD</el-radio>
                                            <el-radio label="2">uart.PAR_NONE</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="停止位:">
                                        <el-radio-group v-model="form.tzw01">
                                            <el-radio label="1">1</el-radio>
                                            <el-radio label="2">2</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="485DIR:">
                                        <el-select v-model="form.dir01" clearable placeholder="请选择">
                                            <el-option v-for="item in optionsbtl" :key="item.value" :label="item.label"
                                                :value="item.value"></el-option>
                                        </el-select>
                                        <span style="margin-left: 2%">提示: 485方向控制GPIO</span>
                                    </el-form-item>
                                    <el-form-item label="485oe转向延迟时间:">
                                        <el-input v-model="form.zxycsj01" style="width: 200px"></el-input>
                                        <span style="margin-left: 2%">单位US</span>
                                    </el-form-item>
                                </div>
                            </el-tab-pane>
                            <el-tab-pane label="串口3" name="ckcs03">
                                <el-form-item>
                                    <el-radio-group v-model="form.ckcs03">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                                <div v-if="form.ckcs03 == 0">
                                    <el-form-item label="波特率:">
                                        <el-select v-model="form.btl01" clearable placeholder="请选择">
                                            <el-option v-for="item in optionsbtl" :key="item.value" :label="item.label"
                                                :value="item.value"></el-option>
                                        </el-select>
                                        <span style="margin-left: 2%">单位bps</span>
                                    </el-form-item>
                                    <el-form-item label="数据位:">
                                        <el-radio-group v-model="form.sjw01">
                                            <el-radio label="8">8</el-radio>
                                            <el-radio label="7">7</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="校验位:">
                                        <el-radio-group v-model="form.xyw01">
                                            <el-radio label="0">uart.PAR_EVEN</el-radio>
                                            <el-radio label="1">uart.PAR_ODD</el-radio>
                                            <el-radio label="2">uart.PAR_NONE</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="停止位:">
                                        <el-radio-group v-model="form.tzw01">
                                            <el-radio label="1">1</el-radio>
                                            <el-radio label="2">2</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="485DIR:">
                                        <el-select v-model="form.dir01" clearable placeholder="请选择">
                                            <el-option v-for="item in optionsbtl" :key="item.value" :label="item.label"
                                                :value="item.value"></el-option>
                                        </el-select>
                                        <span style="margin-left: 2%">提示: 485方向控制GPIO</span>
                                    </el-form-item>
                                    <el-form-item label="485oe转向延迟时间:">
                                        <el-input v-model="form.zxycsj01" style="width: 200px"></el-input>
                                        <span style="margin-left: 2%">单位US</span>
                                    </el-form-item>
                                </div>
                            </el-tab-pane>
                        </el-tabs>
                    </el-tab-pane>
                    <el-tab-pane label="网络通道参数" name="third">
                        <el-tabs v-model="activeNameTdcs" @tab-click="handleClick01">
                            <el-tab-pane label="通道一" name="tdcs01">
                                <el-form-item>
                                    <el-radio-group v-model="form.tdcs01">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                                <div v-if="form.tdcs01 == 0">
                                    <el-form-item label="通道类型:">
                                        <el-radio-group v-model="form.tdlx01">
                                            <el-radio label="HTTP">HTTP</el-radio>
                                            <el-radio label="SOCKET">SOCKET</el-radio>
                                            <el-radio label="MQTT">MQTT</el-radio>
                                            <el-radio label="OneNET">OneNET</el-radio>
                                            <el-radio label="阿里云">阿里云</el-radio>
                                            <el-radio label="百度云">百度云</el-radio>
                                            <el-radio label="腾讯云">腾讯云</el-radio>
                                            <el-radio label="腾讯云（new）">腾讯云（new）</el-radio>
                                            <el-radio label="onenet（new）">onenet（new）</el-radio>
                                            <el-radio label="LuatCloud">LuatCloud</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <div v-if="form.tdlx01 == 'HTTP'">
                                        <el-form-item label="HTTP绑定串口ID:">
                                            <el-radio-group v-model="form.httpbdckId">
                                                <el-radio label="1">1</el-radio>
                                                <el-radio label="2">2</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                        <el-form-item label="method:">
                                            <el-radio-group v-model="form.method">
                                                <el-radio label="get">get</el-radio>
                                                <el-radio label="post">post</el-radio>
                                            </el-radio-group>
                                            <span style="margin-left: 2%">提示：提交请求的方法</span>
                                        </el-form-item>
                                        <el-form-item label="url:">
                                            <el-input v-model="form.url" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">提示： HTTP请求的地址和参数，参数需要自己urllencode处理</span>
                                        </el-form-item>
                                        <el-form-item label="timeout:">
                                            <el-input v-model="form.timeout" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">提示： HTTP请求最长等待时间，超过这个时间，HTTP将返回</span>
                                        </el-form-item>
                                        <el-form-item label="请求类型:">
                                            <el-radio-group v-model="form.qqlx">
                                                <el-radio label="body">body</el-radio>
                                                <el-radio label="param">param</el-radio>
                                            </el-radio-group>
                                            <span style="margin-left: 2%">提示： 串口数据类型，默认body</span>
                                        </el-form-item>
                                        <el-form-item label="type:">
                                            <el-radio-group v-model="form.httpbdckId">
                                                <el-radio label="urlencode">urlencode</el-radio>
                                                <el-radio label="json">json</el-radio>
                                                <el-radio label="stream">stream</el-radio>
                                            </el-radio-group>
                                            <span style="margin-left: 2%">提示： body的提交类型</span>
                                        </el-form-item>
                                        <el-form-item label="basic:">
                                            <el-input v-model="form.basic" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">提示：HTTP的BASIC验证，注意账号密码之间用 ： 连接</span>
                                        </el-form-item>
                                        <el-form-item label="head:">
                                            <el-input v-model="form.head" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">提示：HTTP请求报文头部字符串</span>
                                        </el-form-item>
                                        <el-form-item label="返回数据过滤:">
                                            <el-radio-group v-model="form.fhsjgl">
                                                <el-radio label="code">code</el-radio>
                                                <el-radio label="head">head</el-radio>
                                                <el-radio label="body">body</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                    </div>
                                    <div v-if="form.tdlx01 == 'SOCKET'">
                                        <el-form-item label="协议:">
                                            <el-radio-group v-model="form.xy01">
                                                <el-radio label="TCP">TCP协议</el-radio>
                                                <el-radio label="UDP">UDP协议</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                        <el-form-item label="心跳包:">
                                            <el-radio-group v-model="form.xtb01">
                                                <el-radio label="0">自定义</el-radio>
                                                <el-radio label="1">顺序生成</el-radio>
                                            </el-radio-group>
                                            <div v-if="form.xtb01 == 0" style="margin-top: 10px">
                                                <el-input v-model="form.xtb01_zcxxZdy" style="width: 200px"></el-input>
                                            </div>
                                            <div v-if="form.xtb01 == 1" style="margin-top: 10px">
                                                <span>前缀：</span>
                                                <el-input v-model="form.xtb01_zcxxQz" style="width: 200px"></el-input>
                                                <span style="margin-left: 2%">后缀：</span>
                                                <el-input v-model="form.xtb01_zcxxHz" style="width: 200px"></el-input>
                                            </div>
                                        </el-form-item>
                                        <el-form-item label="心跳间隔时间:">
                                            <el-input v-model="form.xtjgsj01" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">(单位秒) 提示： 0为关闭心跳包，建议60-300</span>
                                        </el-form-item>
                                        <el-form-item label="socket的地址或域名:">
                                            <el-input v-model="form.socketdz01" style="width: 200px"></el-input>
                                        </el-form-item>
                                        <el-form-item label="socket服务器的端口号:">
                                            <el-input-number controls-position="right" v-model="form.socketdzdkh01"
                                                style="width: 200px"></el-input-number>
                                            <span style="margin-left: 2%">提示: 端口号范围：1~65536</span>
                                        </el-form-item>
                                        <el-form-item label="TCP通道捆绑的串口ID :">
                                            <el-radio-group v-model="form.tcptdkbckid">
                                                <el-radio label="1">1</el-radio>
                                                <el-radio label="2">2</el-radio>
                                                <el-radio label="3">3</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                        <el-form-item label="被动上报间隔 :">
                                            <el-input v-model="form.bdsbjg01" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">(单位秒) 提示: 非被动模式留空 范围：1~65535</span>
                                        </el-form-item>
                                        <el-form-item label="被动采集间隔 :">
                                            <el-input v-model="form.bdcjjg01" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">(单位秒) 提示: 非被动模式留空 范围：1~15</span>
                                        </el-form-item>
                                        <el-form-item label="自动采集任务间隔时间 :">
                                            <el-input-number controls-position="right" v-model="form.zdcjrwjgsj01"
                                                style="width: 200px"></el-input-number>
                                            <span style="margin-left: 2%">(单位秒) 提示:主动采集任务间隔时间,配合自动采集任务使用</span>
                                        </el-form-item>
                                        <el-form-item label="SSL :">
                                            <el-radio-group v-model="form.tcptdkbckid">
                                                <el-radio label="1">启用</el-radio>
                                                <el-radio label="2">不启用</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                    </div>
                                    <div v-if="form.tdlx01 == 'MQTT'">
                                        <el-form-item label="MQTT心跳包的间隔:">
                                            <el-input v-model="form.mqtttxbdjg01" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">提示： 单位秒,默认300</span>
                                        </el-form-item>
                                        <el-form-item label="自动采集任务间隔时间:">
                                            <el-input v-model="form.zdcjrwjgsj01" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">提示： MQTT接收超时时间,单位秒,配合自动采集任务使用</span>
                                        </el-form-item>
                                        <el-form-item label="MQTT的地址或域名:">
                                            <el-input v-model="form.mqttdz01" style="width: 200px"></el-input>
                                        </el-form-item>
                                        <el-form-item label="MQTT服务器的端口号:">
                                            <el-input v-model="form.mqttdkh01" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">提示: 端口号范围：1~65536</span>
                                        </el-form-item>
                                        <el-form-item label="MQTT的登陆账号:">
                                            <el-input v-model="form.mqttzh01" style="width: 200px"></el-input>
                                        </el-form-item>
                                        <el-form-item label="MQTT的登陆密码:">
                                            <el-input v-model="form.mqttmm01" style="width: 200px"></el-input>
                                        </el-form-item>
                                        <el-form-item label="MQTT保存会话标志位:">
                                            <el-radio-group v-model="form.mqttbchhbzw01">
                                                <el-radio label="1">持久会话</el-radio>
                                                <el-radio label="2">离线自动销毁</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                        <el-form-item label="订阅消息主题:">
                                            <el-input v-model="form.dgxxzt01" style="width: 200px"></el-input>
                                        </el-form-item>
                                        <el-form-item label="发布消息主题:">
                                            <el-input v-model="form.fbxxzt01" style="width: 200px"></el-input>
                                        </el-form-item>
                                        <el-form-item label="MQTT的QOS级别:">
                                            <el-radio-group v-model="form.mqttqosjb01">
                                                <el-radio label="0">0</el-radio>
                                                <el-radio label="1">1</el-radio>
                                                <el-radio label="2">2</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                        <el-form-item label="MQTT的publish参数retain:">
                                            <el-radio-group v-model="form.mqttretain01">
                                                <el-radio label="0">0</el-radio>
                                                <el-radio label="1">1</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                        <el-form-item label="MQTT通道捆绑的串口ID:">
                                            <el-radio-group v-model="form.mqtttdkbckid01">
                                                <el-radio label="1">1</el-radio>
                                                <el-radio label="2">2</el-radio>
                                                <el-radio label="3">3</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                        <el-form-item label="ID是否添加默认IMEI :">
                                            <el-radio-group v-model="form.idsftjmrimei01">
                                                <el-radio label="1">是</el-radio>
                                                <el-radio label="2">否</el-radio>
                                            </el-radio-group>
                                            <span style="margin-left: 2%">提示：
                                                （默认添加IMEI，选是的格式是IMEI+内容，选否则自定义内容，不填则默认IMEI）</span>
                                        </el-form-item>
                                        <el-form-item label="接收mqtt信息是否显示主题 :">
                                            <el-radio-group v-model="form.tcptdkbckid">
                                                <el-radio label="1">1</el-radio>
                                                <el-radio label="2">2</el-radio>
                                                <el-radio label="3">3</el-radio>
                                            </el-radio-group>
                                            <span style="margin-left: 2%">提示： （默认不显示主题,显示格式为[+MSUB:
                                                topic,len,message]）</span>
                                        </el-form-item>
                                        <el-form-item label="客户端ID:">
                                            <el-input v-model="form.khdid01" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">提示： 不填系统用IMEI做客户端ID</span>
                                        </el-form-item>
                                        <el-form-item label="主题添加IMEI :">
                                            <el-radio-group v-model="form.zttjimei01">
                                                <el-radio label="1">是</el-radio>
                                                <el-radio label="2">否</el-radio>
                                            </el-radio-group>
                                            <span style="margin-left: 2%">提示： 默认添加（/自定义主题/IMEI）</span>
                                        </el-form-item>
                                        <el-form-item label="transport:">
                                            <el-radio-group v-model="form.transport01">
                                                <el-radio label="1">是</el-radio>
                                                <el-radio label="2">否</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                        <el-form-item label="MQTT的遗嘱:">
                                            <el-input v-model="form.mqttyz" style="width: 200px"></el-input>
                                            <span style="margin-left: 2%">提示： 可不填</span>
                                        </el-form-item>
                                    </div>
                                </div>
                            </el-tab-pane>
                            <el-tab-pane label="通道二" name="tdcs02">
                                <el-form-item>
                                    <el-radio-group v-model="form.tdcs02">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-tab-pane>
                            <el-tab-pane label="通道三" name="tdcs03">
                                <el-form-item>
                                    <el-radio-group v-model="form.tdcs03">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-tab-pane>
                            <el-tab-pane label="通道四" name="tdcs04">
                                <el-form-item>
                                    <el-radio-group v-model="form.tdcs04">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-tab-pane>
                            <el-tab-pane label="通道五" name="tdcs05">
                                <el-form-item>
                                    <el-radio-group v-model="form.tdcs05">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-tab-pane>
                            <el-tab-pane label="通道六" name="tdcs06">
                                <el-form-item>
                                    <el-radio-group v-model="form.tdcs06">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-tab-pane>
                            <el-tab-pane label="通道七" name="tdcs07">
                                <el-form-item>
                                    <el-radio-group v-model="form.tdcs07">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-tab-pane>
                        </el-tabs>
                    </el-tab-pane>
                    <el-tab-pane label="预置信息" name="fourth">
                        <h3 style="font-weight: bold">远程更新参数和固件</h3>
                        <el-form-item>
                            <span>白名单号：</span>
                            <el-input v-model="form.bmdh" style="width: 200px"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <span>振铃延时：</span>
                            <el-input v-model="form.zlys" style="width: 200px"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <span>短信字段：</span>
                            <el-input v-model="form.dxzd" style="width: 200px"></el-input>
                        </el-form-item>
                        <h3 style="font-weight: bold">设置APN</h3>
                        <el-form-item>
                            <span>名称：</span>
                            <el-input v-model="form.apnMc" style="width: 200px"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <span>用户名：</span>
                            <el-input v-model="form.apnYhm" style="width: 200px"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <span>密码：</span>
                            <el-input v-model="form.apnMm" style="width: 200px"></el-input>
                        </el-form-item>
                        <h3 style="font-weight: bold">自动采集任务</h3>
                        <el-tabs v-model="activeNameckcsZdcj" @tab-click="handleClick01">
                            <el-tab-pane label="串口1" name="ckcszdcj01">
                                <el-form-item>
                                    <el-radio-group v-model="form.ckcszdcj01">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-tab-pane>
                            <el-tab-pane label="串口2" name="ckcszdcj02">
                                <el-form-item>
                                    <el-radio-group v-model="form.ckcszdcj02">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-tab-pane>
                            <el-tab-pane label="串口3" name="ckcszdcj03">
                                <el-form-item>
                                    <el-radio-group v-model="form.ckcszdcj03">
                                        <el-radio label="0">启动</el-radio>
                                        <el-radio label="1">不启动</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-tab-pane>
                        </el-tabs>
                    </el-tab-pane>
                    <!--                    <el-tab-pane label="GPIO" name="gpio">GPIO</el-tab-pane>
                    <el-tab-pane label="GPS" name="gps">GPS</el-tab-pane>
                    <el-tab-pane label="视频流" name="spl">视频流</el-tab-pane>
                    <el-tab-pane label="预警" name="yj">预警</el-tab-pane>-->
                    <el-tab-pane label="任务" name="rw">
                        <el-form-item>
                            <el-radio-group v-model="rwsfqy">
                                <el-radio :label="0">启动</el-radio>
                                <el-radio :label="1">不启动</el-radio>
                            </el-radio-group>
                        </el-form-item>
                        <div v-if="rwsfqy === 0">
                            <div v-for="task in tasks" class="yh_div">
                                <ul>
                                    <li>
                                        <h3>{{ task.name }}</h3>
                                    </li>
                                    <li class="btn_sc">
                                        <el-button type="info" icon="el-icon-delete" circle
                                            @click="removeTask(task.id)"></el-button>
                                    </li>
                                </ul>
                                <el-form-item>
                                    <el-input type="textarea" :rows="4" placeholder="请输入内容" style="max-width: 600px"
                                        v-model="sfdata[task.id - 1]"></el-input>
                                </el-form-item>
                            </div>
                            <p>提示：用户任务最多10个</p>
                        </div>
                    </el-tab-pane>
                </el-tabs>
                <el-divider></el-divider>
                <el-form-item style="margin-left: 95%">
                    <div style="width: 200px">
                        <el-button type="primary" @click="cancel">确定</el-button>
                    </div>
                </el-form-item>
            </el-form>
        </el-dialog>

        <!--添加设备-->
        <el-dialog :title="title" :visible.sync="Formopen" width="30%" append-to-body>
            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                <el-form-item label="设备名称" prop="deviceDtuName">
                    <el-input v-model="ruleForm.deviceDtuName"></el-input>
                </el-form-item>
                <el-form-item label="分组类型" prop="deviceDtuGroupid">
                    <el-select v-model="ruleForm.deviceDtuGroupid" placeholder="请选择分组类型">
                        <el-option v-for="dict in DeviceGroup" :key="dict.deviceDtuGroupid"
                            :label="dict.deviceDtuGroupName" :value="dict.deviceDtuGroupid"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="设备编号" prop="deviceDtuBh">
                    <el-input v-model="ruleForm.deviceDtuBh"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="submitForm('ruleForm')">确定</el-button>
                    <el-button @click="resetForm('ruleForm')">{{ $t('reset') }}</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>

<script>
import { getDtuDeviceList, addDeviceUsers, getDtuDeviceGroup, updateDtuDevice, deleteDtuDevice } from '@/api/iot/device';

export default {
    name: 'Index',
    data() {
        return {
            //查询参数
            queryParams: {
                deviceDtuName: null,
                pageNum: 1,
                pageSize: 10,
            },
            showSearch: true,
            tableData: [],
            total: 0,
            multipleSelection: {},
            Pzopen: false,
            activeName: 'first',
            activeNameckcs: 'ckcs01',
            activeNameTdcs: 'tdcs01',
            activeNameckcsZdcj: '',
            optionsbtl: [
                { label: '300', value: '300' },
                { label: '600', value: '600' },
                { label: '1200', value: '1200' },
                { label: '2400', value: '2400' },
                { label: '4800', value: '4800' },
                { label: '9600', value: '9600' },
                { label: '14400', value: '14400' },
                { label: '19200', value: '19200' },
                { label: '28800', value: '28800' },
                { label: '38400', value: '38400' },
                { label: '56700', value: '56700' },
                { label: '115200', value: '115200' },
                { label: '230400', value: '230400' },
                { label: '460800', value: '460800' },
                { label: '921600', value: '921600' },
            ],
            uconfData: [
                {
                    tdcs01: 0,
                    btl01: null,
                    sjw01: null,
                    xyw01: null,
                    tzw01: null,
                    dir01: null,
                    zxycsj01: null,
                },
            ],
            form: {
                fota: 0,
                uartReadTime: 25,
                flow: '',
                param_ver: 1,
                pwrmod: 'normal',
                password: '',
                netReadTime: 0,
                passon: 1,
                nolog: '1',
                isRndis: '0',
                isipv6: '0',
                webProtect: '1',
                plate: 0,
                protectContent: [0, 0, 0, 0, 0, 0, 0],
                reg: {
                    type: 0,
                    data: '',
                    prefix: '',
                    postfix: '',
                },
                convert: 0,
                uconf: [[], [], []],
                conf: [[], [], [], [], [], [], []],
                preset: {
                    number: '',
                    delay: '',
                    smsword: '',
                },
                apn: ['', '', ''],
                cmds: [[], [], []],
                pins: [],
                gps: {
                    pio: [],
                    fun: [],
                },
                upprot: ['', '', '', '', '', '', ''],
                dwprot: ['', '', '', '', '', '', ''],
                warn: {
                    adc0: [],
                    adc1: [],
                    vbatt: [],
                    gpio: [],
                },
            },
            title: null,
            Formopen: false,
            ruleForm: {
                deviceDtuId: null,
                deviceDtuGroupid: null,
                deviceDtuName: null,
                deviceDtuBh: null,
            },
            rules: {
                deviceDtuBh: [{ required: true, message: '请输入设备编号', trigger: 'blur' }],
                deviceDtuGroupid: [{ required: true, message: '请选择分组类型', trigger: 'blur' }],
                deviceDtuName: [{ required: true, message: '请输入设备名称', trigger: 'blur' }],
            },
            DeviceGroup: [],
            rwsfqy: 1,
            tasks: [],
        };
    },
    created() {
        this.getList();
        this.getDtuDevGroup();
    },
    methods: {
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        handleClick() {
            switch (this.activeName) {
                case 'rw':
                    this.rwsfqy = 0;
                    break;
            }
        },
        handleClick01() { },
        /*查看参数*/
        getSelect(tab) {
            this.Pzopen = true;
            this.resettingform();
            if (tab != undefined) {
                const data = JSON.parse(tab);
                this.form = { ...data };
            }
        },
        /*取消*/
        cancel() {
            this.Pzopen = false;
            this.activeName = 'first';
            this.queryParams.pageNum = 1;
        },
        /*查询*/
        getList() {
            getDtuDeviceList(this.queryParams).then((rp) => {
                this.tableData = rp.rows;
                this.total = rp.total;
            });
        },
        /*添加和修改设备*/
        getDtuDevGroup() {
            getDtuDeviceGroup().then((rp) => {
                this.DeviceGroup = rp.data;
            });
        },
        getFormOpen(tab) {
            if (tab == null) {
                this.title = '添加设备';
                this.ruleForm = {};
            } else {
                this.title = '修改设备';
                this.ruleForm = {};
                this.ruleForm = { ...tab };
            }
            this.Formopen = true;
        },
        submitForm(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    if (this.ruleForm.deviceDtuId != null) {
                        updateDtuDevice(this.ruleForm).then((rp) => {
                            this.$modal.msgSuccess(rp.msg);
                            this.getList();
                        });
                    } else {
                        addDeviceUsers(this.ruleForm).then((rp) => {
                            this.$modal.msgSuccess(rp.msg);
                            this.getList();
                        });
                    }
                    this.resetForm();
                }
            });
        },
        resetForm(formName) {
            this.Formopen = false;
            this.$refs[formName].resetFields();
        },
        /*删除设备*/
        deleteDtudev() {
            if (this.multipleSelection.length === 0) {
                this.$modal.msgWarning('未选中设备');
                return;
            }
            // 确保发送的数据是数组格式，而不是对象
            const data = {
                dtuDeviceList: this.multipleSelection,
            };
            deleteDtuDevice(data).then((rp) => {
                this.$modal.msgSuccess(rp.msg);
                this.getList();
            });
        },
        resettingform() {
            this.form = {
                fota: null,
                uartReadTime: null,
                flow: null,
                param_ver: null,
                pwrmod: null,
                password: null,
                netReadTime: null,
                passon: null,
                nolog: null,
                isRndis: null,
                isipv6: null,
                webProtect: null,
                plate: null,
                protectContent: [],
                reg: {
                    type: null,
                    data: null,
                    prefix: null,
                    postfix: null,
                },
                convert: null,
                uconf: [[], [], []],
                conf: [[], [], [], [], [], [], []],
                preset: {
                    number: null,
                    delay: null,
                    smsword: null,
                },
                apn: [null, null, null],
                cmds: [[], [], []],
                pins: [],
                gps: {
                    pio: [],
                    fun: [],
                },
                upprot: [],
                dwprot: [],
                warn: {
                    adc0: [],
                    adc1: [],
                    vbatt: [],
                    gpio: [],
                },
            };
        },
    },
};
</script>

<style scoped lang="scss">
.el-form-item__label {
    font-size: 13px;
}
</style>
