433无线点阵屏开发

dist/static/js/chunk-2d2105d3.d4ca2bd4.js

@@ -1 +0,0 @@
-(window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-2d2105d3"],{b829:function(n,e,o){"use strict";o.r(e);o("fb6a"),o("ac1f"),o("841c");var c,a,t={name:"AuthRedirect",created:function(){var n=window.location.search.slice(1);window.localStorage&&(window.localStorage.setItem("x-admin-oauth-code",n),window.close())},render:function(n){return n()}},d=t,i=o("2877"),l=Object(i["a"])(d,c,a,!1,null,null,null);e["default"]=l.exports}}]);

dist/static/js/chunk-2d230fe7.042d38d1.js

@@ -1 +0,0 @@
-(window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-2d230fe7"],{ef3c:function(e,r,n){"use strict";n.r(r);n("ac1f"),n("5319");var t,u,a={created:function(){var e=this.$route,r=e.params,n=e.query,t=r.path;this.$router.replace({path:"/"+t,query:n})},render:function(e){return e()}},c=a,o=n("2877"),p=Object(o["a"])(c,t,u,!1,null,null,null);r["default"]=p.exports}}]);

languages/en.js

@@ -1051,8 +1051,9 @@ module.exports = {
     HUMAN_DETECTION_RADAR: 'Sleep Detection Radar',
     ALARM_INFUSION: 'Infusion alarm',
     ELECTRONIC_FENCE: 'Electronic fence',
-    WIRELESS_DOOR_LAMP: 'Wireless door lamp',
-    WIRELESS_CONVERSION_BOX: 'Wireless conversion box'
+    S433_DOOR_LAMP: 'Wireless door lamp',
+    S433_TRANSFER_BOX: 'Wireless conversion box',
+    S433_RECEIVER: 'Signal receiver'
   },
   vitalSignsDeviceType: {
     BLOOD_SUGAR: 'Blood Pressure Meter',

languages/es.js

@@ -1052,8 +1052,9 @@ module.exports = {
     HUMAN_DETECTION_RADAR: 'Radar de monitoreo del sueño',
     ALARM_INFUSION: 'Alarma de infusión',
     ELECTRONIC_FENCE: 'Valla electrónica',
-    WIRELESS_DOOR_LAMP: 'Luz de puerta inalámbrica',
-    WIRELESS_CONVERSION_BOX: 'Caja de conversión inalámbrica'
+    S433_DOOR_LAMP: 'Luz de puerta inalámbrica',
+    S433_TRANSFER_BOX: 'Caja de conversión inalámbrica',
+    S433_RECEIVER: 'Receptor de señal'
   },
   vitalSignsDeviceType: {
     BLOOD_SUGAR: 'Medidor de presión arterial',

languages/zh-CN.js

@@ -1006,7 +1006,7 @@ module.exports = {
     roleManage: '角色管理',
     debugging485: '485调试',
     deviceFrame: '设备空间',
-    ledDevice: 'LED点阵屏',
+    ledDevice: '点阵屏设置',
     entraceguardUser:'用户通行设置',
     customBoardManage: '自定义信息看板屏',
     customBoardDesigner:'看板屏设计',
@@ -1052,8 +1052,9 @@ module.exports = {
     HUMAN_DETECTION_RADAR: '睡眠监测雷达',
     ALARM_INFUSION: '输液报警器',
     ELECTRONIC_FENCE: '电子围栏',
-    WIRELESS_DOOR_LAMP: '无线门灯',
-    WIRELESS_CONVERSION_BOX: '无线转换盒'
+    S433_DOOR_LAMP: '433无线门灯',
+    S433_TRANSFER_BOX: '433无线转换盒',
+    S433_RECEIVER: '433接收器'
   },
   vitalSignsDeviceType: {
     BLOOD_SUGAR: '血糖仪',

node_modules/zrender/src/svg/helper/ClippathManager.js

@@ -1,172 +0,0 @@
-/**
- * @file Manages SVG clipPath elements.
- * @author Zhang Wenli
- */
-
-import Definable from './Definable';
-import * as zrUtil from '../../core/util';
-import * as matrix from '../../core/matrix';
-
-/**
- * Manages SVG clipPath elements.
- *
- * @class
- * @extends Definable
- * @param   {number}     zrId    zrender instance id
- * @param   {SVGElement} svgRoot root of SVG document
- */
-function ClippathManager(zrId, svgRoot) {
-    Definable.call(this, zrId, svgRoot, 'clipPath', '__clippath_in_use__');
-}
-
-
-zrUtil.inherits(ClippathManager, Definable);
-
-
-/**
- * Update clipPath.
- *
- * @param {Displayable} displayable displayable element
- */
-ClippathManager.prototype.update = function (displayable) {
-    var svgEl = this.getSvgElement(displayable);
-    if (svgEl) {
-        this.updateDom(svgEl, displayable.__clipPaths, false);
-    }
-
-    var textEl = this.getTextSvgElement(displayable);
-    if (textEl) {
-        // Make another clipPath for text, since it's transform
-        // matrix is not the same with svgElement
-        this.updateDom(textEl, displayable.__clipPaths, true);
-    }
-
-    this.markUsed(displayable);
-};
-
-
-/**
- * Create an SVGElement of displayable and create a <clipPath> of its
- * clipPath
- *
- * @param {Displayable} parentEl  parent element
- * @param {ClipPath[]}  clipPaths clipPaths of parent element
- * @param {boolean}     isText    if parent element is Text
- */
-ClippathManager.prototype.updateDom = function (
-    parentEl,
-    clipPaths,
-    isText
-) {
-    if (clipPaths && clipPaths.length > 0) {
-        // Has clipPath, create <clipPath> with the first clipPath
-        var defs = this.getDefs(true);
-        var clipPath = clipPaths[0];
-        var clipPathEl;
-        var id;
-
-        var dom = isText ? '_textDom' : '_dom';
-
-        if (clipPath[dom]) {
-            // Use a dom that is already in <defs>
-            id = clipPath[dom].getAttribute('id');
-            clipPathEl = clipPath[dom];
-
-            // Use a dom that is already in <defs>
-            if (!defs.contains(clipPathEl)) {
-                // This happens when set old clipPath that has
-                // been previously removed
-                defs.appendChild(clipPathEl);
-            }
-        }
-        else {
-            // New <clipPath>
-            id = 'zr' + this._zrId + '-clip-' + this.nextId;
-            ++this.nextId;
-            clipPathEl = this.createElement('clipPath');
-            clipPathEl.setAttribute('id', id);
-            defs.appendChild(clipPathEl);
-
-            clipPath[dom] = clipPathEl;
-        }
-
-        // Build path and add to <clipPath>
-        var svgProxy = this.getSvgProxy(clipPath);
-        if (clipPath.transform
-            && clipPath.parent.invTransform
-            && !isText
-        ) {
-            /**
-             * If a clipPath has a parent with transform, the transform
-             * of parent should not be considered when setting transform
-             * of clipPath. So we need to transform back from parent's
-             * transform, which is done by multiplying parent's inverse
-             * transform.
-             */
-            // Store old transform
-            var transform = Array.prototype.slice.call(
-                clipPath.transform
-            );
-
-            // Transform back from parent, and brush path
-            matrix.mul(
-                clipPath.transform,
-                clipPath.parent.invTransform,
-                clipPath.transform
-            );
-            svgProxy.brush(clipPath);
-
-            // Set back transform of clipPath
-            clipPath.transform = transform;
-        }
-        else {
-            svgProxy.brush(clipPath);
-        }
-
-        var pathEl = this.getSvgElement(clipPath);
-
-        clipPathEl.innerHTML = '';
-        /**
-         * Use `cloneNode()` here to appendChild to multiple parents,
-         * which may happend when Text and other shapes are using the same
-         * clipPath. Since Text will create an extra clipPath DOM due to
-         * different transform rules.
-         */
-        clipPathEl.appendChild(pathEl.cloneNode());
-
-        parentEl.setAttribute('clip-path', 'url(#' + id + ')');
-
-        if (clipPaths.length > 1) {
-            // Make the other clipPaths recursively
-            this.updateDom(clipPathEl, clipPaths.slice(1), isText);
-        }
-    }
-    else {
-        // No clipPath
-        if (parentEl) {
-            parentEl.setAttribute('clip-path', 'none');
-        }
-    }
-};
-
-/**
- * Mark a single clipPath to be used
- *
- * @param {Displayable} displayable displayable element
- */
-ClippathManager.prototype.markUsed = function (displayable) {
-    var that = this;
-    if (displayable.__clipPaths && displayable.__clipPaths.length > 0) {
-        zrUtil.each(displayable.__clipPaths, function (clipPath) {
-            if (clipPath._dom) {
-                Definable.prototype.markUsed.call(that, clipPath._dom);
-            }
-            if (clipPath._textDom) {
-                Definable.prototype.markUsed.call(that, clipPath._textDom);
-            }
-        });
-    }
-};
-
-
-export default ClippathManager;

node_modules/zrender/src/svg/helper/ShadowManager.js

@@ -1,212 +0,0 @@
-/**
- * @file Manages SVG shadow elements.
- * @author Zhang Wenli
- */
-
-import Definable from './Definable';
-import * as zrUtil from '../../core/util';
-
-/**
- * Manages SVG shadow elements.
- *
- * @class
- * @extends Definable
- * @param   {number}     zrId    zrender instance id
- * @param   {SVGElement} svgRoot root of SVG document
- */
-function ShadowManager(zrId, svgRoot) {
-    Definable.call(
-        this,
-        zrId,
-        svgRoot,
-        ['filter'],
-        '__filter_in_use__',
-        '_shadowDom'
-    );
-}
-
-
-zrUtil.inherits(ShadowManager, Definable);
-
-
-/**
- * Create new shadow DOM for fill or stroke if not exist,
- * but will not update shadow if exists.
- *
- * @param {SvgElement}  svgElement   SVG element to paint
- * @param {Displayable} displayable  zrender displayable element
- */
-ShadowManager.prototype.addWithoutUpdate = function (
-    svgElement,
-    displayable
-) {
-    if (displayable && hasShadow(displayable.style)) {
-        var style = displayable.style;
-
-        // Create dom in <defs> if not exists
-        var dom;
-        if (style._shadowDom) {
-            // Gradient exists
-            dom = style._shadowDom;
-
-            var defs = this.getDefs(true);
-            if (!defs.contains(style._shadowDom)) {
-                // _shadowDom is no longer in defs, recreate
-                this.addDom(dom);
-            }
-        }
-        else {
-            // New dom
-            dom = this.add(displayable);
-        }
-
-        this.markUsed(displayable);
-
-        var id = dom.getAttribute('id');
-        svgElement.style.filter = 'url(#' + id + ')';
-    }
-};
-
-
-/**
- * Add a new shadow tag in <defs>
- *
- * @param {Displayable} displayable  zrender displayable element
- * @return {SVGFilterElement} created DOM
- */
-ShadowManager.prototype.add = function (displayable) {
-    var dom = this.createElement('filter');
-    var style = displayable.style;
-
-    // Set dom id with shadow id, since each shadow instance
-    // will have no more than one dom element.
-    // id may exists before for those dirty elements, in which case
-    // id should remain the same, and other attributes should be
-    // updated.
-    style._shadowDomId = style._shadowDomId || this.nextId++;
-    dom.setAttribute('id', 'zr' + this._zrId
-        + '-shadow-' + style._shadowDomId);
-
-    this.updateDom(displayable, dom);
-    this.addDom(dom);
-
-    return dom;
-};
-
-
-/**
- * Update shadow.
- *
- * @param {Displayable} displayable  zrender displayable element
- */
-ShadowManager.prototype.update = function (svgElement, displayable) {
-    var style = displayable.style;
-    if (hasShadow(style)) {
-        var that = this;
-        Definable.prototype.update.call(this, displayable, function (style) {
-            that.updateDom(displayable, style._shadowDom);
-        });
-    }
-    else {
-        // Remove shadow
-        this.remove(svgElement, style);
-    }
-};
-
-
-/**
- * Remove DOM and clear parent filter
- */
-ShadowManager.prototype.remove = function (svgElement, style) {
-    if (style._shadowDomId != null) {
-        this.removeDom(style);
-        svgElement.style.filter = '';
-    }
-};
-
-
-/**
- * Update shadow dom
- *
- * @param {Displayable} displayable  zrender displayable element
- * @param {SVGFilterElement} dom DOM to update
- */
-ShadowManager.prototype.updateDom = function (displayable, dom) {
-    var domChild = dom.getElementsByTagName('feDropShadow');
-    if (domChild.length === 0) {
-        domChild = this.createElement('feDropShadow');
-    }
-    else {
-        domChild = domChild[0];
-    }
-
-    var style = displayable.style;
-    var scaleX = displayable.scale ? (displayable.scale[0] || 1) : 1;
-    var scaleY = displayable.scale ? (displayable.scale[1] || 1) : 1;
-
-    // TODO: textBoxShadowBlur is not supported yet
-    var offsetX, offsetY, blur, color;
-    if (style.shadowBlur || style.shadowOffsetX || style.shadowOffsetY) {
-        offsetX = style.shadowOffsetX || 0;
-        offsetY = style.shadowOffsetY || 0;
-        blur = style.shadowBlur;
-        color = style.shadowColor;
-    }
-    else if (style.textShadowBlur) {
-        offsetX = style.textShadowOffsetX || 0;
-        offsetY = style.textShadowOffsetY || 0;
-        blur = style.textShadowBlur;
-        color = style.textShadowColor;
-    }
-    else {
-        // Remove shadow
-        this.removeDom(dom, style);
-        return;
-    }
-
-    domChild.setAttribute('dx', offsetX / scaleX);
-    domChild.setAttribute('dy', offsetY / scaleY);
-    domChild.setAttribute('flood-color', color);
-
-    // Divide by two here so that it looks the same as in canvas
-    // See: https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-shadowblur
-    var stdDx = blur / 2 / scaleX;
-    var stdDy = blur / 2 / scaleY;
-    var stdDeviation = stdDx + ' ' + stdDy;
-    domChild.setAttribute('stdDeviation', stdDeviation);
-
-    // Fix filter clipping problem
-    dom.setAttribute('x', '-100%');
-    dom.setAttribute('y', '-100%');
-    dom.setAttribute('width', Math.ceil(blur / 2 * 200) + '%');
-    dom.setAttribute('height', Math.ceil(blur / 2 * 200) + '%');
-
-    dom.appendChild(domChild);
-
-    // Store dom element in shadow, to avoid creating multiple
-    // dom instances for the same shadow element
-    style._shadowDom = dom;
-};
-
-/**
- * Mark a single shadow to be used
- *
- * @param {Displayable} displayable displayable element
- */
-ShadowManager.prototype.markUsed = function (displayable) {
-    var style = displayable.style;
-    if (style && style._shadowDom) {
-        Definable.prototype.markUsed.call(this, style._shadowDom);
-    }
-};
-
-function hasShadow(style) {
-    // TODO: textBoxShadowBlur is not supported yet
-    return style
-        && (style.shadowBlur || style.shadowOffsetX || style.shadowOffsetY
-            || style.textShadowBlur || style.textShadowOffsetX
-            || style.textShadowOffsetY);
-}
-
-
-export default ShadowManager;

package.json

@@ -92,8 +92,7 @@
     "serve-static": "1.13.2",
     "svg-sprite-loader": "4.1.3",
     "svgo": "1.2.0",
-    "vue-template-compiler": "2.6.10",
-    "exports-loader": "^1.1.0"
+    "vue-template-compiler": "2.6.10"
   },
   "browserslist": [
     "> 1%",

src/api/ncs_device.js

@@ -245,4 +245,10 @@ export function update485s(data) {
     loading: true
   })
 }
-
+export function getCacheListByType(partId, deviceType) {
+  return request({
+    url: `/ncs/device/getCacheListByType/${partId}/${deviceType}`,
+    method: 'GET',
+    loading: true
+  })
+}

src/router/index.js

@@ -564,7 +564,7 @@ export const partRoutes = [
         path: 'index',
         component: () => import('@/views/ncs-led/ledManager'),
         name: 'part_led',
-        meta: { title: i18n.t('tab.ledDevice'), icon: 'el-icon-message-solid', noCache: true }
+        meta: { title: i18n.t('tab.ledDevice'), icon: 'el-icon-message-solid', noCache: true } // LED点阵屏
       }
     ],
     hidden: uiVersion !== 1

src/utils/enum/DeviceTypeEnum.js

@@ -42,7 +42,8 @@ export const DEVICE_TYPE = createEnum(
     HUMAN_DETECTION_RADAR: [37, i18n.t('deviceType.HUMAN_DETECTION_RADAR')], // 睡眠监测雷达
     ALARM_INFUSION: [38, i18n.t('deviceType.ALARM_INFUSION')], // 输液报警器
     ELECTRONIC_FENCE: [39, i18n.t('deviceType.ELECTRONIC_FENCE')], //电子围栏
-    WIRELESS_DOOR_LAMP: [40, i18n.t('deviceType.WIRELESS_DOOR_LAMP')], // 无线门灯
-    WIRELESS_CONVERSION_BOX: [41, i18n.t('deviceType.WIRELESS_CONVERSION_BOX')] //无线转换盒
+    S433_DOOR_LAMP: [40, i18n.t('deviceType.S433_DOOR_LAMP')], // 433无线门灯
+    S433_TRANSFER_BOX: [41, i18n.t('deviceType.S433_TRANSFER_BOX')], //433无线转换盒
+    S433_RECEIVER: [42, i18n.t('deviceType.S433_RECEIVER')] //433接收器
   }
 )

src/utils/mixin.js

@@ -128,6 +128,20 @@ export default {
           return buf
         }
       }
+    },
+    //将秒转化为时分秒
+    formateSeconds(startTime, endTime){
+      if (!startTime) {
+        return 0
+      }
+      let secondTime = endTime - startTime//将传入的秒的值转化为Number
+      let min = 0// 初始化分
+      if(secondTime>1000){//如果秒数大于60，将秒数转换成整数
+        min=parseInt(secondTime/1000)//获取秒，除以1000取整数，得到整数秒
+        return min + this.$t('action.second')
+      } else {
+        return secondTime + this.$t('action.millisecond')
+      }
     }
   }
 }

src/views/ncs-device/components/deviceManager.vue

@@ -1232,7 +1232,8 @@
                     val === DEVICE_TYPE.ENTRANCE_GUARD ||
                     val === DEVICE_TYPE.OWON_X5_GATEWAY ||
                     val === DEVICE_TYPE.HUMAN_DETECTION_RADAR ||
-                    val === DEVICE_TYPE.INFORMATION_BOARD;
+                    val === DEVICE_TYPE.INFORMATION_BOARD ||
+                    val === DEVICE_TYPE.S433_TRANSFER_BOX;
             },
           getDeviceType() {
               return DEVICE_TYPE;

src/views/ncs-led/ledManager.vue

@@ -1,64 +1,151 @@
 <template>
   <div>
-    <el-card style="margin: 15px">
-      <el-form ref="editform" :rules="rules" label-width="140px" :model="formmodel">
-        <fieldset>
-          <legend>{{ this.$t('tab.ledDevice') }}</legend>
-
-          <el-row>
-            <el-form-item :label="this.$t('deviceManage.ledUpdateDefaultProgram')">
-              <el-radio v-model="isOnlyTime" :label="false">{{ this.$t('deviceManage.ledOnlyTime') }}</el-radio>
-              <el-radio v-model="isOnlyTime" :label="true">{{ this.$t('deviceManage.ledAddCustom') }}</el-radio>
+    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+      <el-tab-pane name="s433" label="无线点阵屏"></el-tab-pane>
+      <el-tab-pane name="led" label="LED点阵屏"></el-tab-pane>
+    </el-tabs>
+    <div v-if="activeName === 's433'">
+      <el-form ref="myForm" :rules="rules" label-width="90px" :model="s433FormModel">
+        <el-row>
+          <el-form-item label="模式">
+            <el-radio-group v-model="s433FormModel.type" size="mini" prop="unit">
+              <el-radio :label="4">校验时间</el-radio>
+              <el-radio :label="0">屏参</el-radio>
+              <el-radio :label="1">自定义数据</el-radio>
+              <el-radio :label="2">调试</el-radio>
+              <el-radio :label="3">清空显示</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-row>
+        <el-row v-if="s433FormModel.type === 0">
+          <el-col :span="8">
+            <el-form-item :label="this.$t('deviceManage.ledResolutionRatio')" prop="ledStyle">
+              <el-input v-model="s433FormModel.ledStyle" clearable placeholder="128*32" />
             </el-form-item>
-          </el-row>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item :label="this.$t('deviceManage.ledFontSize')" prop="ledSize">
+              <el-input-number v-model="s433FormModel.ledSize" controls-position="right" :min="0" :max="60" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row v-else-if="s433FormModel.type === 1">
+          <el-col :span="12">
+            <el-form-item label="自定义数据">
+              <el-input v-model="s433FormModel.title" placeholder="你好世界" :maxlength="50"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
 
-          <el-row v-if="isOnlyTime">
-<!--          <el-row>-->
-            <el-col :span="18">
-              <el-form-item :label="this.$t('deviceManage.ledAddCustom')">
-                <el-input v-model="formmodel.addCustom" :maxlength="50" />
+      <div class="table-wrapper" style="padding-bottom: 10px;padding-left: 10px">
+        <div style="padding: 5px;">
+          <el-select v-model="s433FormModel.boxMac" filterable style="margin-right: 10px;">
+            <el-option v-for="item in boxList" :key="item.eth_mac" :label="item.name" :value="item.eth_mac">
+              <span style="float: left">{{ item.name }}</span>
+              <span style="float: right; color: #8492a6; font-size: 13px">--{{ item.eth_mac }}</span>
+            </el-option>
+          </el-select>
+<!--          <el-button :disabled="multipleSelection.length === 0 && s433FormModel.boxMac != null" type="primary" @click="clickSend(4)">校验时间</el-button>-->
+          <el-button :disabled="multipleSelection.length === 0 && s433FormModel.boxMac != null" type="success" @click="sendChange">批量发送</el-button>
+<!--          <el-button :disabled="s433FormModel.boxMac != null" type="info" @click="clickSend">清空所有显示</el-button>-->
+        </div>
+        <el-table :data="s433DeviceList" id="myTableId" stripe border style="width: 100%" ref="refTable"
+                  @selection-change="selectFun" height="520">
+          <el-table-column type="selection" width="55"></el-table-column>
+          <el-table-column prop="name" label="设备名" min-width="130" align="center"/>
+          <el-table-column prop="eth_mac" label="Mac" min-width="130" align="center"/>
+          <!--        <el-table-column prop="send_time" label="发送时间" min-width="130" align="center" />-->
+          <el-table-column prop="receive_time" label="流程耗时" width="130" align="center"/>
+          <el-table-column prop="state" label="状态" width="140" align="center">
+            <template slot-scope="scope">
+              <el-tag v-if="scope.row.state === 0" type="warning" disable-transitions>等待发送</el-tag>
+              <el-tag v-if="scope.row.state === 1" type="primary" disable-transitions>发送成功等待返回</el-tag>
+              <el-tag v-if="scope.row.state === 2" type="success" disable-transitions>已返回完成流程</el-tag>
+              <el-tag v-if="scope.row.state === -1" type="danger" disable-transitions>发送失败</el-tag>
+              <el-tag v-if="scope.row.state === -2" type="danger" disable-transitions>返回超时</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column style="text-align: left;" label="操作" width="120" fixed="right">
+            <template slot-scope="scope">
+              <el-button type="success" size="mini" @click="handlerEdit(scope.$index, scope.row)">
+                发送
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div v-if="activeName === 'led'">
+      <el-card style="margin: 15px">
+        <el-form ref="editform" :rules="rules" label-width="140px" :model="formmodel">
+          <fieldset>
+            <legend>{{ this.$t('tab.ledDevice') }}</legend>
+
+            <el-row>
+              <el-form-item :label="this.$t('deviceManage.ledUpdateDefaultProgram')">
+                <el-radio v-model="isOnlyTime" :label="false">{{ this.$t('deviceManage.ledOnlyTime') }}</el-radio>
+                <el-radio v-model="isOnlyTime" :label="true">{{ this.$t('deviceManage.ledAddCustom') }}</el-radio>
               </el-form-item>
-            </el-col>
-          </el-row>
+            </el-row>
 
-          <el-row>
-            <el-form-item>
-              <el-col :span="4">
-                <el-button type="primary" @click="timing">{{ this.$t('deviceManage.ledTiming') }}</el-button>
+            <el-row v-if="isOnlyTime">
+              <!--          <el-row>-->
+              <el-col :span="18">
+                <el-form-item :label="this.$t('deviceManage.ledAddCustom')">
+                  <el-input v-model="formmodel.addCustom" :maxlength="50"/>
+                </el-form-item>
               </el-col>
+            </el-row>
 
-              <el-col :span="4">
-                <el-button type="primary" @click="updateDefaultProgram">{{ this.$t('deviceManage.ledUpdateDefaultProgram') }}</el-button>
-              </el-col>
+            <el-row>
+              <el-form-item>
+                <el-col :span="4">
+                  <el-button type="primary" @click="timing">{{ this.$t('deviceManage.ledTiming') }}</el-button>
+                </el-col>
 
-              <el-col :span="4">
-                <el-button type="primary" @click="deleteAllPrograms">{{ this.$t('deviceManage.ledRemoveAllProgram') }}</el-button>
-              </el-col>
+                <el-col :span="4">
+                  <el-button type="primary" @click="updateDefaultProgram">
+                    {{ this.$t('deviceManage.ledUpdateDefaultProgram') }}
+                  </el-button>
+                </el-col>
 
-              <el-col :span="4">
-                <el-button type="primary" @click="powerOn">{{ this.$t('deviceManage.ledPowerOn') }}</el-button>
-              </el-col>
+                <el-col :span="4">
+                  <el-button type="primary" @click="deleteAllPrograms">{{
+                      this.$t('deviceManage.ledRemoveAllProgram')
+                    }}
+                  </el-button>
+                </el-col>
 
-              <el-col :span="4">
-                <el-button type="primary" @click="powerOff">{{ this.$t('deviceManage.ledPowerOff') }}</el-button>
-              </el-col>
+                <el-col :span="4">
+                  <el-button type="primary" @click="powerOn">{{ this.$t('deviceManage.ledPowerOn') }}</el-button>
+                </el-col>
+
+                <el-col :span="4">
+                  <el-button type="primary" @click="powerOff">{{ this.$t('deviceManage.ledPowerOff') }}</el-button>
+                </el-col>
+
+                <el-col :span="4">
+                  <el-button type="primary" @click="powerRestart">{{ this.$t('deviceManage.ledRestart') }}</el-button>
+                </el-col>
+              </el-form-item>
+            </el-row>
+          </fieldset>
+        </el-form>
+      </el-card>
+    </div>
 
-              <el-col :span="4">
-                <el-button type="primary" @click="powerRestart">{{ this.$t('deviceManage.ledRestart') }}</el-button>
-              </el-col>
-            </el-form-item>
-          </el-row>
-        </fieldset>
-      </el-form>
-    </el-card>
   </div>
 </template>
 
 <script>
 
+import { DEVICE_TYPE } from '@/utils/enum/DeviceTypeEnum'
 import * as API_Led from '@/api/ncs_led'
+import { getCacheListByType } from '@/api/ncs_device'
+const DeviceUrl = domain.DeviceUrl
 export default {
-  name: "ledManager",
+  name: 'ledManager',
 
   data() {
     return {
@@ -66,15 +153,88 @@ export default {
       rules: {},
       isOnlyTime: false,
       // addCustom: '',
-      shop_id: this.$store.getters.partId
+      shop_id: this.$store.getters.partId,
+      activeName: 's433',
+      s433DeviceList: [],
+      boxList: [],
+      multipleSelection: [],
+      s433FormModel: {
+        type: 4,
+        ledStyle: '128*32',
+        ledSize: 16,
+        title: '你好世界',
+        boxMac: null,
+        macs: null,
+        partId: this.$store.getters.partId
+      },
+      boolDestroy: false
     }
   },
   async mounted() {
-    this.isOnlyTime === false
+    this.API_getList()
+    this.API_getList2()
+    this.initWebSocket()
+  },
+  beforeDestroy() {
+    this.boolDestroy = true
+    this.websock.close()
   },
   methods: {
+    initWebSocket: function() {
+      const time = Math.round(new Date()) + "" + Math.round(Math.random()*100)
+      let stockbase = DeviceUrl.replace('http', 'ws')
+      this.websock = new WebSocket(stockbase + '/s433/listening/'+ time + '/' + this.shop_id)
+      this.websock.onopen = this.websocketonopen
+      this.websock.onerror = this.websocketonerror
+      this.websock.onmessage = this.websocketonmessage
+      this.websock.onclose = this.websocketclose
+    },
+    websocketonopen: function() {
+      console.log(this.$t('deviceManage.webSocketSuccess'))
+    },
+    websocketonerror: function(e) {
+      console.log(this.$t('deviceManage.webSocketError'))
+    },
+    websocketonmessage: function(e) {
+      // console.log('收到消息：', e)
+      const data = JSON.parse(e.data)
+      console.log('收到消息：', data)
+      if (data.status === -1) {
+        this.$message.error('该转换盒不在线！')
+        return
+      }
+      const index = this.s433DeviceList.findIndex(p => p.eth_mac.toLowerCase() === data.mac.toLowerCase())
+      if (index === -1) {
+        return
+      }
+      const time = (new Date()).valueOf()
+      const item = this.s433DeviceList[index]
+      if (data.status === 1) { // 发送
+        // this.$set(this.s433DeviceList[index], 'send_time', time)
+        item.send_time = time
+      } else if (data.status === 2) { // 有返回
+        item.receive_time = this.formateSeconds(item.send_time, time)
+      } else { // 发送失败
+        item.receive_time = this.formateSeconds(item.send_time, time)
+      }
+
+      item.state = data.status
+      this.$set(this.s433DeviceList, index, item)
+    },
+    websocketclose: function(e) {
+      console.log('connection closed')
+      if (!this.boolDestroy) {
+        const _this = this
+        this.$alert('连接断开，是否重连', '提示', {
+          confirmButtonText: '确定',
+          callback: action => {
+            _this.initWebSocket()
+          }
+        })
+      }
+    },
     updateDefaultProgram() {
-      let text;
+      let text
       if (this.isOnlyTime) {
         text = this.formmodel.addCustom
       }
@@ -123,6 +283,56 @@ export default {
       API_Led.removeAllProgramByShopId(params).then(r => {
         this.$message.success(this.$t('action.saveSuccess'))
       })
+    },
+    handleClick(e) {
+      if (this.activeName === 's433') {
+        this.API_getList()
+      }
+    },
+    API_getList() {
+      getCacheListByType(this.shop_id, DEVICE_TYPE.S433_RECEIVER).then(res => {
+        res.forEach(item => {
+          item.state = null
+          item.send_time = ''
+          item.receive_time = ''
+        })
+        this.s433DeviceList = res
+      })
+    },
+    API_getList2() {
+      getCacheListByType(this.shop_id, DEVICE_TYPE.S433_TRANSFER_BOX).then(res => {
+        this.boxList = res
+        if (this.boxList.length > 0) {
+          this.s433FormModel.boxMac = this.boxList[0].eth_mac
+        } else {
+          this.$message.info('请先添加433转换盒！')
+        }
+      })
+    },
+    selectFun(val) {
+      this.multipleSelection = val
+    },
+    handlerEdit(index, row) {
+      row.state = 0
+      row.send_time = row.receive_time = ''
+      this.$set(this.s433DeviceList, index, row)
+      this.s433FormModel.macs = row.eth_mac
+      this.websock.send(JSON.stringify(this.s433FormModel))
+    },
+    sendChange() {
+      let list = []
+      const _this = this
+      this.s433FormModel.macs = null
+      _this.multipleSelection.forEach(item => {
+        const index = _this.s433DeviceList.indexOf(item)
+        item.state = 0
+        item.send_time = item.receive_time = ''
+        _this.$set(_this.s433DeviceList, index, item)
+        list.push(item.eth_mac)
+      })
+      this.s433FormModel.macs = list.join(',')
+      // this.multipleSelection = []
+      this.websock.send(JSON.stringify(this.s433FormModel))
     }
   }
 }
@@ -130,4 +340,4 @@ export default {
 
 <style scoped>
 
-</style>
+</style>