From ad2901a19dc86705d49b3f7316a1c468027147c7 Mon Sep 17 00:00:00 2001
From: "autumn.g@foxmail.com" <autumn.g@foxmail.com>
Date: Wed, 2 Aug 2023 13:30:54 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8F=91=E9=80=81=E9=81=A5=E6=8E=A7=E5=9C=B0?=
 =?UTF-8?q?=E9=94=81=E6=8C=87=E4=BB=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../controller/pile/PileRemoteController.java |   6 +-
 jsowell-ui/src/api/pile/pileRemote.js         |   9 +
 jsowell-ui/src/views/pile/basic/detail.vue    | 748 +++++++++---------
 3 files changed, 409 insertions(+), 354 deletions(-)

diff --git a/jsowell-admin/src/main/java/com/jsowell/web/controller/pile/PileRemoteController.java b/jsowell-admin/src/main/java/com/jsowell/web/controller/pile/PileRemoteController.java
index cf6ffb094..82a16f2be 100644
--- a/jsowell-admin/src/main/java/com/jsowell/web/controller/pile/PileRemoteController.java
+++ b/jsowell-admin/src/main/java/com/jsowell/web/controller/pile/PileRemoteController.java
@@ -1,5 +1,6 @@
 package com.jsowell.web.controller.pile;
 
+import com.alibaba.fastjson2.JSON;
 import com.google.common.collect.ImmutableMap;
 import com.jsowell.common.core.controller.BaseController;
 import com.jsowell.common.core.domain.AjaxResult;
@@ -143,15 +144,16 @@ public class PileRemoteController extends BaseController {
 	 */
 	@PostMapping("remoteControlGroundLock")
 	public AjaxResult remoteControlGroundLock(@RequestBody RemoteControlGroundLockCommand command) {
+		logger.info("遥控地锁接口param:{}", JSON.toJSONString(command));
 		AjaxResult result;
 		try {
 			pileRemoteService.remoteControlGroundLock(command);
 			result = AjaxResult.success();
 		} catch (BusinessException e) {
-			logger.error("遥控地锁error", e);
+			logger.error("遥控地锁接口error", e);
 			result = AjaxResult.error(e.getMessage());
 		} catch (Exception e) {
-			logger.error("遥控地锁error", e);
+			logger.error("遥控地锁接口error", e);
 			result = AjaxResult.error(e.getMessage());
 		}
 		return result;
diff --git a/jsowell-ui/src/api/pile/pileRemote.js b/jsowell-ui/src/api/pile/pileRemote.js
index 0a91e3bc7..c44c4e9ba 100644
--- a/jsowell-ui/src/api/pile/pileRemote.js
+++ b/jsowell-ui/src/api/pile/pileRemote.js
@@ -8,3 +8,12 @@ export function updateFirmware(data) {
     data: data
   })
 }
+
+// 遥控地锁
+export function remoteControlGroundLock(data) {
+    return request({
+        url: '/pile/remote/remoteControlGroundLock',
+        method: 'post',
+        data: data
+    })
+}
diff --git a/jsowell-ui/src/views/pile/basic/detail.vue b/jsowell-ui/src/views/pile/basic/detail.vue
index 8bdb67eea..e135c2d5e 100644
--- a/jsowell-ui/src/views/pile/basic/detail.vue
+++ b/jsowell-ui/src/views/pile/basic/detail.vue
@@ -1,385 +1,429 @@
 <template>
-  <div class="app-container">
-    <!-- 标签页 -->
-    <el-tabs
-      value="first"
-      type="border-card"
-      @tab-click="handleClick"
-    >
-      <el-tab-pane label="基本信息" name="first">
-        <el-row type="flex" justify="space-between">
-          <!-- 左侧内容 -->
-          <el-col :span="5">
-            <!-- 充电设备 -->
-            <div class="advContent">
-              <el-card class="box-card" shadow="hover" v-loading="pileDetailLoading">
-                <div slot="header" class="clearfix">
-                  <span>充电设备(<span style="color: #bf1c1c">{{ status }}</span>)</span>
-                  <el-button icon="el-icon-refresh-right" style="float: right; padding: 3px 0" type="text" @click="getPileDetail">刷新</el-button>
-                </div>
-                <!--二维码-->
-                <div class="hello">
-                  <vue-qr
-                    ref="Qrcode"
-                    :text="pileDetail.qrCodeURL"
-                    qid="testQrId"
-                    :width="150"
-                    style="margin-left: 25%"
-                  />
-                </div>
+    <div class="app-container">
+        <!-- 标签页 -->
+        <el-tabs
+            value="first"
+            type="border-card"
+            @tab-click="handleClick"
+        >
+            <el-tab-pane label="基本信息" name="first">
+                <el-row type="flex" justify="space-between">
+                    <!-- 左侧内容 -->
+                    <el-col :span="5">
+                        <!-- 充电设备 -->
+                        <div class="advContent">
+                            <el-card class="box-card" shadow="hover" v-loading="pileDetailLoading">
+                                <div slot="header" class="clearfix">
+                                    <span>充电设备(<span style="color: #bf1c1c">{{ status }}</span>)</span>
+                                    <el-button icon="el-icon-refresh-right" style="float: right; padding: 3px 0"
+                                               type="text" @click="getPileDetail">刷新
+                                    </el-button>
+                                </div>
+                                <!--二维码-->
+                                <div class="hello">
+                                    <vue-qr
+                                        ref="Qrcode"
+                                        :text="pileDetail.qrCodeURL"
+                                        qid="testQrId"
+                                        :width="150"
+                                        style="margin-left: 25%"
+                                    />
+                                </div>
 
-                <!-- 表格 -->
-                <div style="margin-bottom: 10px">
-                  <el-descriptions :column="1" border>
-                    <el-descriptions-item
-                      label="SN"
-                      labelStyle="width: 80px"
-                      contentStyle="width: 150px"
-                      >{{ pileDetail.pileSn }}</el-descriptions-item
-                    >
-                    <el-descriptions-item label="运营商">{{
-                      pileDetail.merchantName
-                    }}</el-descriptions-item>
-                    <el-descriptions-item label="站点">{{
-                      pileDetail.stationName
-                    }}</el-descriptions-item>
-                    <!--<el-descriptions-item label="厂商">
-                      <el-tag size="small">举视</el-tag>
-                    </el-descriptions-item>-->
-                    <!--                    <el-descriptions-item label="使用车辆类型">{{
-                      pileDetail.matchCars
-                    }}</el-descriptions-item>-->
-                    <el-descriptions-item label="设备型号">{{pileDetail.modelName}}</el-descriptions-item>
-                    <el-descriptions-item label="额定功率(kW)">{{
-                      pileDetail.ratedPower
-                    }}</el-descriptions-item>
-                    <!--<el-descriptions-item label="额定电压(V)">{{pileDetail.sn}}</el-descriptions-item>-->
-                    <el-descriptions-item label="额定电流(A)">{{
-                      pileDetail.ratedCurrent
-                    }}</el-descriptions-item>
+                                <!-- 表格 -->
+                                <div style="margin-bottom: 10px">
+                                    <el-descriptions :column="1" border>
+                                        <el-descriptions-item
+                                            label="SN"
+                                            labelStyle="width: 80px"
+                                            contentStyle="width: 150px"
+                                        >{{ pileDetail.pileSn }}
+                                        </el-descriptions-item
+                                        >
+                                        <el-descriptions-item label="运营商">{{
+                                                pileDetail.merchantName
+                                            }}
+                                        </el-descriptions-item>
+                                        <el-descriptions-item label="站点">{{
+                                                pileDetail.stationName
+                                            }}
+                                        </el-descriptions-item>
+                                        <!--<el-descriptions-item label="厂商">
+                                          <el-tag size="small">举视</el-tag>
+                                        </el-descriptions-item>-->
+                                        <!--                    <el-descriptions-item label="使用车辆类型">{{
+                                          pileDetail.matchCars
+                                        }}</el-descriptions-item>-->
+                                        <el-descriptions-item label="设备型号">{{ pileDetail.modelName }}
+                                        </el-descriptions-item>
+                                        <el-descriptions-item label="额定功率(kW)">{{
+                                                pileDetail.ratedPower
+                                            }}
+                                        </el-descriptions-item>
+                                        <!--<el-descriptions-item label="额定电压(V)">{{pileDetail.sn}}</el-descriptions-item>-->
+                                        <el-descriptions-item label="额定电流(A)">{{
+                                                pileDetail.ratedCurrent
+                                            }}
+                                        </el-descriptions-item>
 
-                    <el-descriptions-item label="iccid">{{
-                      pileDetail.iccid
-                    }}</el-descriptions-item>
+                                        <el-descriptions-item label="iccid">{{
+                                                pileDetail.iccid
+                                            }}
+                                        </el-descriptions-item>
 
-                    <el-descriptions-item label="sim卡商">
-                      <dict-tag
-                        :options="dict.type.sim_supplier"
-                        :value="pileDetail.simSupplier"
-                      />
-                    </el-descriptions-item>
+                                        <el-descriptions-item label="sim卡商">
+                                            <dict-tag
+                                                :options="dict.type.sim_supplier"
+                                                :value="pileDetail.simSupplier"
+                                            />
+                                        </el-descriptions-item>
 
-                    <el-descriptions-item label="卡运营商">
-                      <dict-tag
-                        :options="dict.type.sim_operator"
-                        :value="pileDetail.operator"
-                      />
-                    </el-descriptions-item>
+                                        <el-descriptions-item label="卡运营商">
+                                            <dict-tag
+                                                :options="dict.type.sim_operator"
+                                                :value="pileDetail.operator"
+                                            />
+                                        </el-descriptions-item>
 
-                    <!--                    <el-descriptions-item label="桩类型">-->
-                    <!--                      桩类型 数据-->
-                    <!--                    </el-descriptions-item>-->
-                    <el-descriptions-item label="故障原因">
-                    </el-descriptions-item>
-                    <el-descriptions-item label="故障时间">
-                    </el-descriptions-item>
-                  </el-descriptions>
-                </div>
-                <!-- <div ></div> -->
-              </el-card>
-            </div>
-          </el-col>
-          <!-- 右侧内容 -->
-          <el-col :span="19" style="margin-left: 15px">
-            <el-card class="box-card" shadow="hover">
-              <div style="margin: 12px 0">
-                <span>接口列表</span>
-                <el-button icon="el-icon-refresh-right" style="float: right; padding: 3px 0" type="text" @click="refreshPileConnectorList">刷新</el-button>
-              </div>
-              <!--<div style="margin-top: 20px">
-                &lt;!&ndash; 刷新按钮 &ndash;&gt;
-                <el-button
-                  size="medium"
-                  type="primary"
-                  @click="refreshPileConnectorList"
-                >
-                  刷新
-                </el-button>
-              </div>-->
-              <div class="sideNav" id="app">
-                <!-- 接口列表表单 -->
-                <el-table
-                  :data="connectorList"
-                  style="width: 100%"
-                  v-loading="pileListLoading"
-                >
-                  <el-table-column
-                    prop="pileConnectorCode"
-                    label="枪口编号"
-                    width="180px"
-                    align="center"
-                  />
-                  <el-table-column
-                    prop="connectorQrCodeUrl"
-                    label="充电二维码"
-                    width="180px"
-                    align="center"
-                  >
-                    <template slot-scope="scope">
-                      <el-link @click="qrcodeClick(scope.row)">
-                        <vue-qr
-                          ref="Qrcode"
-                          :text="scope.row.connectorQrCodeUrl"
-                          qid="scope.row.connectorId"
-                          :width="qrWidth"
-                        />
-                      </el-link>
-                    </template>
-                  </el-table-column>
-                  <el-table-column
-                    width="118px"
-                    align="center"
-                    prop="status"
-                    label="状态"
-                  >
-                    <template slot-scope="scope">
-                      <dict-tag
-                        :options="dict.type.connector_status"
-                        :value="scope.row.status"
-                      />
-                    </template>
-                  </el-table-column>
-                  <el-table-column
-                    width="80px"
-                    align="center"
-                    prop="type"
-                    label="类型"
-                  >
-                    <template slot-scope="scope">
-                      <dict-tag
-                        :options="dict.type.connector_type"
-                        :value="scope.row.type"
-                      />
-                    </template>
-                  </el-table-column>
-                  <el-table-column
-                    width="118px"
-                    align="center"
-                    prop="instantPower"
-                    label="即时功率（kW）"
-                  />
-                  <el-table-column prop="soc" label="SOC(°C)" align="center" />
-                  <el-table-column
-                    prop="equipmentOrderNum"
-                    label="设备订单号"
-                    align="center"
-                    width="200"
-                  />
-                  <el-table-column
-                    prop="orderCode"
-                    label="平台订单"
-                    align="center"
-                    width="200"
-                  />
-                  <!--                  <el-table-column prop="businessType" label="桩类型" align="center" >-->
-                  <!--                    <template slot-scope="scope">-->
-                  <!--                      <span>{{scope.row.businessType === '1' ? '运营桩':'个人桩'}}</span>-->
-                  <!--                    </template>-->
-                  <!--                  </el-table-column>-->
-                </el-table>
-              </div>
-            </el-card>
-            <el-card style="margin-top: 20px" shadow="hover">
-              <div style="margin: 12px 0">
-                <span>充电桩通信日志</span>
-                <el-button icon="el-icon-refresh-right" style="float: right; padding: 3px 0" type="text" @click="getFeedList">刷新</el-button>
-              </div>
-              <el-table :data="feedList" stripe style="width: 100%" v-loading="feedListLoading">
-                <el-table-column prop="createTime" label="触发时间" align="center" width="200"/>
-                <el-table-column prop="description" label="描述" align="center" width="200"/>
-                <el-table-column prop="originalMsg" label="原始报文" align="center"/>
-              </el-table>
-              <!--分页-->
-              <pagination
-                v-show="total > 0"
-                :total="total"
-                :page.sync="queryParams.pageNum"
-                :limit.sync="queryParams.pageSize"
-                @pagination="getFeedList"
-                style="margin-bottom: 20px"
-              />
-            </el-card>
-          </el-col>
-        </el-row>
-      </el-tab-pane>
-        <el-tab-pane label="配置管理" name="second">
-            <remoteUpgrade :pileSn="pileSn" ref="second"></remoteUpgrade>
-        </el-tab-pane>
-    </el-tabs>
-  </div>
+                                        <!--                    <el-descriptions-item label="桩类型">-->
+                                        <!--                      桩类型 数据-->
+                                        <!--                    </el-descriptions-item>-->
+                                        <el-descriptions-item label="故障原因">
+                                        </el-descriptions-item>
+                                        <el-descriptions-item label="故障时间">
+                                        </el-descriptions-item>
+                                    </el-descriptions>
+                                </div>
+                                <!-- <div ></div> -->
+                            </el-card>
+                        </div>
+                    </el-col>
+                    <!-- 右侧内容 -->
+                    <el-col :span="19" style="margin-left: 15px">
+                        <el-card class="box-card" shadow="hover">
+                            <div style="margin: 12px 0">
+                                <span>接口列表</span>
+                                <el-button icon="el-icon-refresh-right" style="float: right; padding: 3px 0" type="text"
+                                           @click="refreshPileConnectorList">刷新
+                                </el-button>
+                            </div>
+                            <!--<div style="margin-top: 20px">
+                              &lt;!&ndash; 刷新按钮 &ndash;&gt;
+                              <el-button
+                                size="medium"
+                                type="primary"
+                                @click="refreshPileConnectorList"
+                              >
+                                刷新
+                              </el-button>
+                            </div>-->
+                            <div class="sideNav" id="app">
+                                <!-- 接口列表表单 -->
+                                <el-table
+                                    :data="connectorList"
+                                    style="width: 100%"
+                                    v-loading="pileListLoading"
+                                >
+                                    <el-table-column
+                                        prop="pileConnectorCode"
+                                        label="枪口编号"
+                                        width="180px"
+                                        align="center"
+                                    />
+                                    <el-table-column
+                                        prop="connectorQrCodeUrl"
+                                        label="充电二维码"
+                                        width="180px"
+                                        align="center"
+                                    >
+                                        <template slot-scope="scope">
+                                            <el-link @click="qrcodeClick(scope.row)">
+                                                <vue-qr
+                                                    ref="Qrcode"
+                                                    :text="scope.row.connectorQrCodeUrl"
+                                                    qid="scope.row.connectorId"
+                                                    :width="qrWidth"
+                                                />
+                                            </el-link>
+                                        </template>
+                                    </el-table-column>
+                                    <el-table-column
+                                        width="118px"
+                                        align="center"
+                                        prop="status"
+                                        label="状态"
+                                    >
+                                        <template slot-scope="scope">
+                                            <dict-tag
+                                                :options="dict.type.connector_status"
+                                                :value="scope.row.status"
+                                            />
+                                        </template>
+                                    </el-table-column>
+                                    <el-table-column
+                                        width="80px"
+                                        align="center"
+                                        prop="type"
+                                        label="类型"
+                                    >
+                                        <template slot-scope="scope">
+                                            <dict-tag
+                                                :options="dict.type.connector_type"
+                                                :value="scope.row.type"
+                                            />
+                                        </template>
+                                    </el-table-column>
+                                    <el-table-column
+                                        width="118px"
+                                        align="center"
+                                        prop="instantPower"
+                                        label="即时功率（kW）"
+                                    />
+                                    <el-table-column prop="soc" label="SOC(°C)" align="center"/>
+                                    <el-table-column
+                                        prop="equipmentOrderNum"
+                                        label="设备订单号"
+                                        align="center"
+                                        width="200"
+                                    />
+                                    <el-table-column
+                                        prop="orderCode"
+                                        label="平台订单"
+                                        align="center"
+                                        width="200"
+                                    />
+                                    <!--                  <el-table-column prop="businessType" label="桩类型" align="center" >-->
+                                    <!--                    <template slot-scope="scope">-->
+                                    <!--                      <span>{{scope.row.businessType === '1' ? '运营桩':'个人桩'}}</span>-->
+                                    <!--                    </template>-->
+                                    <!--                  </el-table-column>-->
+                                    <el-table-column label="地锁操作" align="center"
+                                                     class-name="small-padding fixed-width">
+                                        <template slot-scope="scope">
+                                            <el-button size="mini" type="text" icon="el-icon-caret-bottom"
+                                                       @click="remoteControlGroundLock(scope.row, '0')">降锁
+                                            </el-button>
+                                            <el-button size="mini" type="text" icon="el-icon-caret-top"
+                                                       @click="remoteControlGroundLock(scope.row, '1')">升锁
+                                            </el-button>
+                                        </template>
+                                    </el-table-column>
+                                </el-table>
+                            </div>
+                        </el-card>
+                        <el-card style="margin-top: 20px" shadow="hover">
+                            <div style="margin: 12px 0">
+                                <span>充电桩通信日志</span>
+                                <el-button icon="el-icon-refresh-right" style="float: right; padding: 3px 0" type="text"
+                                           @click="getFeedList">刷新
+                                </el-button>
+                            </div>
+                            <el-table :data="feedList" stripe style="width: 100%" v-loading="feedListLoading">
+                                <el-table-column prop="createTime" label="触发时间" align="center" width="200"/>
+                                <el-table-column prop="description" label="描述" align="center" width="200"/>
+                                <el-table-column prop="originalMsg" label="原始报文" align="center"/>
+                            </el-table>
+                            <!--分页-->
+                            <pagination
+                                v-show="total > 0"
+                                :total="total"
+                                :page.sync="queryParams.pageNum"
+                                :limit.sync="queryParams.pageSize"
+                                @pagination="getFeedList"
+                                style="margin-bottom: 20px"
+                            />
+                        </el-card>
+                    </el-col>
+                </el-row>
+            </el-tab-pane>
+            <el-tab-pane label="配置管理" name="second">
+                <remoteUpgrade :pileSn="pileSn" ref="second"></remoteUpgrade>
+            </el-tab-pane>
+        </el-tabs>
+    </div>
 </template>
 
 <script>
 import remoteUpgrade from './components/remoteUpgrade.vue';
 import {
-  getPileDetailById,
-  getPileFeedList,
-  listBasic,
+    getPileDetailById,
+    getPileFeedList,
+    listBasic,
 } from "@/api/pile/basic";
-import { queryConnectorListByParams } from "@/api/pile/connector";
+import {queryConnectorListByParams} from "@/api/pile/connector";
 // 二维码组件
 import VueQr from "vue-qr";
+import {remoteControlGroundLock} from "@/api/pile/pileRemote";
 
 export default {
-  components: { VueQr ,remoteUpgrade},
-  name: "pile-detail",
-  dicts: ["connector_status", "connector_type", "sim_supplier", "sim_operator"],
-  data() {
-    return {
-      pileDetailLoading: false,
-      pileListLoading: false,
-      pileId: this.$route.params.pileId,
-      // 右侧数据数组
-      connectorList: [],
-      stationId: 1,
-      // 充电桩详情 竖向 表格渲染的数据
-      pileDetail: { url: "" },
-      feedListLoading: false,
-      qrWidth: 60,
-      flag: true,
-      // 充电桩通信日志
-      feedList: [],
-      // 总条数
-      total: 0,
-      // 查询参数
-      queryParams: {
-        pileSn: null,
-        pageNum: 1,
-        pageSize: 5,
-      },
-      pileSn: null,
-    };
-  },
-  computed: {
-    status() {
-      const status = this.pileDetail.status;
-      // 0-未知；1-在线；2-离线；3-故障
-      let str = "";
-      if (status === "1") {
-        str = "在线";
-      } else if (status === "2") {
-        str = "离线";
-      } else if (status === "3") {
-        str = "故障";
-      } else {
-        str = "未知";
-      }
-      return str;
+    components: {VueQr, remoteUpgrade},
+    name: "pile-detail",
+    dicts: ["connector_status", "connector_type", "sim_supplier", "sim_operator"],
+    data() {
+        return {
+            pileDetailLoading: false,
+            pileListLoading: false,
+            pileId: this.$route.params.pileId,
+            // 右侧数据数组
+            connectorList: [],
+            stationId: 1,
+            // 充电桩详情 竖向 表格渲染的数据
+            pileDetail: {url: ""},
+            feedListLoading: false,
+            qrWidth: 60,
+            flag: true,
+            // 充电桩通信日志
+            feedList: [],
+            // 总条数
+            total: 0,
+            // 查询参数
+            queryParams: {
+                pileSn: null,
+                pageNum: 1,
+                pageSize: 5,
+            },
+            pileSn: null,
+        };
     },
-  },
-  created() {
-    // 查询充电桩详情
-    this.getPileDetail();
-    // 查询充电桩接口列表
-    this.queryPileConnectorList();
-  },
-  mounted() {
-    setTimeout(() => {}, 300);
-  },
-  methods: {
-    //点击二维码事件
-    qrcodeClick(row) {
-      if (this.flag) {
-        this.flag = false;
-        this.qrWidth = 150;
-      } else {
-        this.flag = true;
-        this.qrWidth = 60;
-      }
+    computed: {
+        status() {
+            const status = this.pileDetail.status;
+            // 0-未知；1-在线；2-离线；3-故障
+            let str = "";
+            if (status === "1") {
+                str = "在线";
+            } else if (status === "2") {
+                str = "离线";
+            } else if (status === "3") {
+                str = "故障";
+            } else {
+                str = "未知";
+            }
+            return str;
+        },
     },
-    // 查询接口列表
-    queryPileConnectorList() {
-      const data = {
-        pileIds: [this.pileId],
-      };
-      queryConnectorListByParams(data)
-        .then((response) => {
-          console.log("response", response);
-          this.connectorList = response.rows;
-          console.log("接口列表", this.connectorList);
-        })
-        .catch((error) => {
-          console.log("错误日志", error);
-        });
-    },
-    // test(dataUrl, id){
-    //   console.log(dataUrl)
-    //   console.log(id)
-    // },
-    test() {
-      console.log("测试");
-    },
-    // 查询充电桩详情接口
-    getPileDetail() {
-      this.pileDetailLoading = true;
-      // console.log(this.pileId);
-      const queryForm = {
-        pileId: this.pileId,
-      };
-      getPileDetailById(queryForm).then((response) => {
-        this.pileDetail = response.data;
-        this.pileSn = this.pileDetail.pileSn;
-        this.pileDetailLoading = false;
-        console.log("getPileDetailById结果：", this.pileDetail);
-      });
-    },
-     handleClick(tab) {
-      // console.log(tab.name, event);
-      if(tab.name === 'second') {
-        this.$refs.second.getList();
-      }
-      // this.initializeData(tab.name);
-    },
-    // 刷新按钮重新获取数据
-    refreshPileConnectorList() {
-      this.pileListLoading = true;
-      setTimeout(() => {
+    created() {
+        // 查询充电桩详情
+        this.getPileDetail();
+        // 查询充电桩接口列表
         this.queryPileConnectorList();
-        this.pileListLoading = false;
-      }, 1000);
     },
-    /** 查询充电桩通信日志 */
-    getFeedList() {
-      this.feedListLoading = true;
-      this.queryParams.pileSn = this.pileSn;
-      getPileFeedList(this.queryParams).then((response) => {
-        console.log("查询充电桩通信日志", response);
-        this.feedList = response.data.list;
-        this.total = response.data.total;
-        this.feedListLoading = false;
-      });
+    mounted() {
+        setTimeout(() => {
+        }, 300);
     },
-  },
-  watch: {
-    pileSn(newValue, oldValue) {
-      if (newValue !== null) {
-        this.getFeedList();
-      }
+    methods: {
+        // 遥控地锁
+        remoteControlGroundLock(row, operate) {
+            console.log("row:", row);
+            const pileSn = row.pileSn;
+            const pileConnectorCode = row.pileConnectorCode;
+            const connectorCode = pileConnectorCode.replace(pileSn, "");
+            var data = {
+                "pileSn": pileSn,
+                "connectorCode": connectorCode,
+                "operate": operate
+            };
+            remoteControlGroundLock(data).then((response) => {
+                console.log("后管遥控地锁结果：", response);
+            });
+        },
+
+        //点击二维码事件
+        qrcodeClick(row) {
+            if (this.flag) {
+                this.flag = false;
+                this.qrWidth = 150;
+            } else {
+                this.flag = true;
+                this.qrWidth = 60;
+            }
+        },
+        // 查询接口列表
+        queryPileConnectorList() {
+            const data = {
+                pileIds: [this.pileId],
+            };
+            queryConnectorListByParams(data)
+                .then((response) => {
+                    console.log("response", response);
+                    this.connectorList = response.rows;
+                    console.log("接口列表", this.connectorList);
+                })
+                .catch((error) => {
+                    console.log("错误日志", error);
+                });
+        },
+        // test(dataUrl, id){
+        //   console.log(dataUrl)
+        //   console.log(id)
+        // },
+        test() {
+            console.log("测试");
+        },
+        // 查询充电桩详情接口
+        getPileDetail() {
+            this.pileDetailLoading = true;
+            // console.log(this.pileId);
+            const queryForm = {
+                pileId: this.pileId,
+            };
+            getPileDetailById(queryForm).then((response) => {
+                this.pileDetail = response.data;
+                this.pileSn = this.pileDetail.pileSn;
+                this.pileDetailLoading = false;
+                console.log("getPileDetailById结果：", this.pileDetail);
+            });
+        },
+        handleClick(tab) {
+            // console.log(tab.name, event);
+            if (tab.name === 'second') {
+                this.$refs.second.getList();
+            }
+            // this.initializeData(tab.name);
+        },
+        // 刷新按钮重新获取数据
+        refreshPileConnectorList() {
+            this.pileListLoading = true;
+            setTimeout(() => {
+                this.queryPileConnectorList();
+                this.pileListLoading = false;
+            }, 1000);
+        },
+        /** 查询充电桩通信日志 */
+        getFeedList() {
+            this.feedListLoading = true;
+            this.queryParams.pileSn = this.pileSn;
+            getPileFeedList(this.queryParams).then((response) => {
+                console.log("查询充电桩通信日志", response);
+                this.feedList = response.data.list;
+                this.total = response.data.total;
+                this.feedListLoading = false;
+            });
+        },
+    },
+    watch: {
+        pileSn(newValue, oldValue) {
+            if (newValue !== null) {
+                this.getFeedList();
+            }
+        },
     },
-  },
 };
 </script>
 
 <style scoped lang="scss">
 .advContent {
-  background: #fff;
-  border-radius: 5px 5px 0px 0px;
+    background: #fff;
+    border-radius: 5px 5px 0px 0px;
 }
+
 .sideNav {
-  padding: 30px 0 12px;
+    padding: 30px 0 12px;
 }
+
 #qrcodeArea img {
-  height: 80px;
-  width: 80px;
+    height: 80px;
+    width: 80px;
 }
 </style>