新增 后管设置桩对应第三方平台编号页面

jsowell-ui/src/views/pile/basic/detail.vue

@@ -31,7 +31,7 @@
                                             <template slot="label">
                                                 别名
                                                 <el-button type="text" icon="el-icon-edit" size="medium" circle
-                                                    @click="openEdit" v-hasPermi="['pile:basic:edit']" />
+                                                    @click="openEditName" v-hasPermi="['pile:basic:edit']" />
                                             </template>
                                             <el-input v-model="pileDetail.name" size="medium" clearable
                                                 :disabled="clearableFlag" type="number" :min="1"
@@ -43,6 +43,23 @@
                                                 </template>
                                             </el-input>
                                         </el-descriptions-item>
+
+                                        <el-descriptions-item v-for="(item,index) in snRelationList"  :key="index">
+                                            <template slot="label">
+                                                {{item.thirdPartyName}} sn编号
+                                                <el-button type="text" icon="el-icon-edit" size="medium" circle
+                                                           @click="openEditSnRelation" v-hasPermi="['pile:basic:edit']" />
+                                            </template>
+                                            <el-input v-model="item.thirdPartySn" size="medium" clearable
+                                                      :disabled="clearableFlagSnRelation" type="text"
+                                                      oninput="if(value<1)value=''">
+                                                <template slot="append">
+                                                    <el-button type="text" size="medium" circle @click="updateThirdPartySn(item)">保存
+                                                    </el-button>
+                                                </template>
+                                            </el-input>
+                                        </el-descriptions-item>
+
                                         <el-descriptions-item label="运营商">{{ pileDetail.merchantName }}
                                         </el-descriptions-item>
                                         <el-descriptions-item label="站点">{{ pileDetail.stationName }}
@@ -187,10 +204,10 @@
 import remoteUpgrade from "./components/remoteUpgrade.vue";
 import {
     getPileDetailById,
-    getPileFeedList,
+    getPileFeedList, getThirdPartySnRelation,
     listBasic,
     updateBasic,
-    updatePileName,
+    updatePileName, updateThirdPartySnRelation,
 } from "@/api/pile/basic";
 import { queryConnectorListByParams } from "@/api/pile/connector";
 // 二维码组件
@@ -206,6 +223,7 @@ export default {
         return {
             visible: false,
             clearableFlag: true,
+            clearableFlagSnRelation: true,
             resCode: null,
             msg: null,
             pileDetailLoading: false,
@@ -217,6 +235,7 @@ export default {
             // 充电桩详情 竖向 表格渲染的数据
             pileDetail: { url: "" },
             feedListLoading: false,
+            snRelationList: [],
             qrWidth: 60,
             flag: true,
             // 充电桩通信日志
@@ -254,6 +273,8 @@ export default {
         this.getPileDetail();
         // 查询充电桩接口列表
         this.queryPileConnectorList();
+        // 查询桩对应的第三方平台桩编号列表
+        this.getThirdPartySnRelationList();
     },
     mounted() {
         setTimeout(() => {
@@ -309,9 +330,12 @@ export default {
             console.log("测试");
         },
         // 开放编辑按钮
-        openEdit() {
+        openEditName() {
             this.clearableFlag = this.clearableFlag === false;
         },
+        openEditSnRelation() {
+            this.clearableFlagSnRelation = this.clearableFlagSnRelation === false;
+        },
         // 修改充电桩别名
         updateName() {
             const params = {
@@ -335,6 +359,18 @@ export default {
                 this.getPileDetail();
             });
         },
+        // 修改第三方平台对应编号
+        updateThirdPartySn(item) {
+            const params = {
+                thirdPartyType: item.thirdPartyType,
+                pileSn: item.pileSn,
+                thirdPartySn: item.thirdPartySn,
+            }
+            console.log("修改第三方平台对应编号 params:", params)
+            updateThirdPartySnRelation(params).then((response) => {
+                console.log("修改第三方平台对应编号 response:", response)
+            });
+        },
         // 查询充电桩详情接口
         getPileDetail() {
             this.pileDetailLoading = true;
@@ -349,6 +385,17 @@ export default {
                 console.log("getPileDetailById结果：", this.pileDetail);
             });
         },
+
+        getThirdPartySnRelationList() {
+            const params = {
+                pileSn: this.pileDetail.pileSn
+            }
+            getThirdPartySnRelation(params).then((response) =>{
+                this.snRelationList = response.rows;
+                console.log("snRelationList:", this.snRelationList)
+            });
+        },
+
         handleClick(tab) {
             // console.log(tab.name, event);
             if (tab.name === "second") {