From 415ec24706101a5e760c5e64795c2c0c36bc6c2c Mon Sep 17 00:00:00 2001
From: "BOOL\\25024" <http://192.168.2.2:8099/jsowell/jsowell-uniapp.git>
Date: Tue, 12 Mar 2024 09:32:49 +0800
Subject: [PATCH] =?UTF-8?q?sn=E7=BC=96=E5=8F=B7=E6=B7=BB=E5=8A=A0=E9=BB=98?=
 =?UTF-8?q?=E8=AE=A4=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jsowell-ui/src/views/pile/basic/detail.vue | 71 ++++++++++++++--------
 1 file changed, 45 insertions(+), 26 deletions(-)

diff --git a/jsowell-ui/src/views/pile/basic/detail.vue b/jsowell-ui/src/views/pile/basic/detail.vue
index 89079c8fc..a9c505dd9 100644
--- a/jsowell-ui/src/views/pile/basic/detail.vue
+++ b/jsowell-ui/src/views/pile/basic/detail.vue
@@ -11,8 +11,8 @@
                             <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 icon="el-icon-refresh-right" style="float: right; padding: 3px 0"
+                                        type="text" @click="getPileDetail">刷新
                                     </el-button>
                                 </div>
                                 <!--二维码-->
@@ -24,7 +24,7 @@
                                 <!-- 表格 -->
                                 <div style="margin-bottom: 10px">
                                     <el-descriptions :column="1" border>
-                                        <el-descriptions-item label="SN" labelStyle="width: 80px"
+                                        <el-descriptions-item label="SN" labelStyle="width: 120px"
                                             contentStyle="width: 150px">{{ pileDetail.pileSn }}
                                         </el-descriptions-item>
                                         <el-descriptions-item>
@@ -35,8 +35,8 @@
                                             </template>
                                             <el-input v-model="pileDetail.name" size="medium" clearable
                                                 :disabled="clearableFlag" type="number" :min="1"
-                                                oninput="if(value<1)value=''">
-                                                <template slot="suffix"> 号桩</template>
+                                                oninput="if(value<1)value=''" style="line-height: 36px;">
+                                                <template slot="suffix" > 号桩</template>
                                                 <template slot="append">
                                                     <el-button type="text" size="medium" circle @click="updateName">保存
                                                     </el-button>
@@ -44,17 +44,18 @@
                                             </el-input>
                                         </el-descriptions-item>
 
-                                        <el-descriptions-item v-for="(item,index) in snRelationList"  :key="index">
+                                        <el-descriptions-item v-for="(item, index) in snRelationList" :key="index">
                                             <template slot="label">
-                                                {{item.thirdPartyName}} sn编号
+                                                <span style="font-weight: 600;">{{ item.thirdPartyName }}</span> sn编号
                                                 <el-button type="text" icon="el-icon-edit" size="medium" circle
-                                                           @click="openEditSnRelation" v-hasPermi="['pile:basic:edit']" />
+                                                    @click="openEditSnRelation(index)"
+                                                    v-hasPermi="['pile:basic:edit']" />
                                             </template>
                                             <el-input v-model="item.thirdPartySn" size="medium" clearable
-                                                      :disabled="clearableFlagSnRelation" type="text"
-                                                      oninput="if(value<1)value=''">
+                                                :disabled="item.disabled" type="text" oninput="if(value<1)value=''">
                                                 <template slot="append">
-                                                    <el-button type="text" size="medium" circle @click="updateThirdPartySn(item)">保存
+                                                    <el-button type="text" size="medium" circle
+                                                        @click="updateThirdPartySn(item)">保存
                                                     </el-button>
                                                 </template>
                                             </el-input>
@@ -64,12 +65,6 @@
                                         </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 }}
@@ -82,7 +77,8 @@
                                         </el-descriptions-item>
 
                                         <el-descriptions-item label="sim卡商">
-                                            <dict-tag :options="dict.type.sim_supplier" :value="pileDetail.simSupplier" />
+                                            <dict-tag :options="dict.type.sim_supplier"
+                                                :value="pileDetail.simSupplier" />
                                         </el-descriptions-item>
 
                                         <el-descriptions-item label="卡运营商">
@@ -124,8 +120,10 @@
                             <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">
+                                    <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"
@@ -143,9 +141,11 @@
                                             <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 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="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">-->
@@ -188,7 +188,8 @@
                             </el-table>
                             <!--分页-->
                             <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
-                                :limit.sync="queryParams.pageSize" @pagination="getFeedList" style="margin-bottom: 20px" />
+                                :limit.sync="queryParams.pageSize" @pagination="getFeedList"
+                                style="margin-bottom: 20px" />
                         </el-card>
                     </el-col>
                 </el-row>
@@ -333,8 +334,19 @@ export default {
         openEditName() {
             this.clearableFlag = this.clearableFlag === false;
         },
-        openEditSnRelation() {
-            this.clearableFlagSnRelation = this.clearableFlagSnRelation === false;
+        openEditSnRelation(index) {
+            const updatedSnRelationList = this.snRelationList.map((item, currentIndex) => {
+                // 只对当前点击的项进行状态切换  
+                if (currentIndex === index) {
+                    return {
+                        ...item,
+                        disabled: !item.disabled
+                    };
+                }
+                return item;
+            });
+            // 更新snRelationList  
+            this.snRelationList = updatedSnRelationList;
         },
         // 修改充电桩别名
         updateName() {
@@ -390,8 +402,15 @@ export default {
             const params = {
                 pileSn: this.pileDetail.pileSn
             }
-            getThirdPartySnRelation(params).then((response) =>{
+            getThirdPartySnRelation(params).then((response) => {
                 this.snRelationList = response.rows;
+                //默认添加一个状态
+                this.snRelationList = this.snRelationList.map(item => {
+                    return {
+                        ...item,
+                        disabled: true
+                    };
+                });
                 console.log("snRelationList:", this.snRelationList)
             });
         },