update:协议界面

frontend/src/components/device_communication/CommunicationTab.vue

 <template>
   <div class="text-right mb-5">
-    <el-button type="primary" @click="applyComunications"> 应用 </el-button>
-    <el-button type="primary" @click="copy">复制配置</el-button>
-    <el-button type="primary" @click="addDevice">添加通信参数</el-button>
+    <el-button type="primary" @click="applyComunications" icon="pointer"> 应用 </el-button>
+    <el-button type="primary" @click="copy" icon="CopyDocument">复制配置</el-button>
+    <el-button type="primary" @click="addDevice" icon="plus">添加通信参数</el-button>
   </div>
   <div class="demo-collapse">
     <el-collapse>

frontend/src/components/device_communication/DeviceInfoCard.vue

 <template>
 	<el-descriptions :title="deviceInfo.device_name" :column=1>
 		<template #extra>
-			<el-button type="danger" size="small" @click="del">删除</el-button>
-			<el-button type="primary" size="small" @click="dialogFormVisible = true">编辑</el-button>
+			<el-button type="danger" size="small" @click="del" icon="delete">删除</el-button>
+			<el-button type="primary" size="small" @click="dialogFormVisible = true" icon="edit">编辑</el-button>
 		</template>
 		<el-descriptions-item label="协议名">{{ deviceInfo.protocol_name }}</el-descriptions-item>
 		<el-descriptions-item label="通信参数" :column=3>

frontend/src/components/protocol/CollapseTable.vue

@@ -2,8 +2,8 @@
   <div class="demo-collapse">
     <div class="containers">
       <div class="left">
-        <div class="mr-4">协议版本</div>
-        <el-select v-model="currentVersion" @change="changeProtocolVersion">
+        <div class="ml-4">协议版本</div>
+        <el-select v-model="currentVersion" @change="changeProtocolVersion" ml-4>
           <el-option
             v-for="option in options"
             :key="option.value"
@@ -434,8 +434,12 @@ const addNewVersion = () => {
   background-color: white; /* 设置展开区域的头部颜色 */
 }
 .collapse1 .el-collapse-item__wrap {
-  border: 1px solid;
-  padding: 10px;
+  /*border: 1px solid;*/
+  /*padding: 10px;*/
+  /*border-radius: 10px;*/
+  /*margin-bottom: 4px;*/
+  box-shadow: var(--el-box-shadow-dark);
+  background-color: #f9f9f9;
 }
 /*.collapse1 .el-collapse-item__wrap {*/
 /*  background-color: white; !* 设置展开区域的背景颜色 *!*/

frontend/src/components/protocol/ProtocolTable.vue

@@ -2,7 +2,7 @@
   <el-table :data="tableData"
             :header-cell-style="{backgroundColor:'#eff3f8', 'text-align':'center',color: 'black'}"
             border
-            :cell-style="{'text-align':'center'}"
+            :cell-style="{'text-align':'center', backgroundColor:'#f9f9f9'}"
   >
     <el-table-column fixed prop="fieldname" label="字段名" style="width: 25%" />
     <el-table-column prop="fieldsize" label="字段长度" style="width: 25%" />
@@ -17,7 +17,7 @@
     </el-table-column>
   </el-table>
 
-  <el-button style="width: 100%; border: 1px dashed" class="mt-4" @click="addField">+</el-button>
+  <el-button style="width: 100%; border: 1px dashed; background-color: #f9f9f9" class="mt-4" @click="addField">+</el-button>
 
   <el-dialog v-model="dialogVisible" @close="handlerClose">
     <template #header>{{ flag ? '新增' : '编辑' }}字段</template>