增加猪群管理界面

src/components/PigPenInfoCard.vue

@@ -4,7 +4,9 @@
       <div class="title">猪栏: {{ pen.pen_number }}</div>
       <div class="info-item">状态: <el-tag size="small" :type="statusType">{{ pen.status || '未知' }}</el-tag></div>
       <div class="info-item">容量: {{ pen.capacity }}</div>
+      <div class="info-item">存栏: {{ pen.current_pig_count || 0 }}</div>
       <div class="info-item">批次: {{ pen.batch_number || '未分配' }}</div>
+      <div class="info-item">猪舍: {{ pen.house_name || '未知' }}</div>
     </div>
     <div class="actions-section">
       <el-button size="small" @click="emitEdit">编辑</el-button>
@@ -67,7 +69,7 @@ export default {
   flex-direction: column;
   justify-content: space-between;
   width: 200px; /* 适当加宽以容纳更多信息 */
-  height: 240px;
+  height: 260px; /* 调整高度以适应更多信息 */
   background-color: #fff;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
   transition: box-shadow 0.3s;
@@ -80,7 +82,8 @@ export default {
 .info-section {
   display: flex;
   flex-direction: column;
-  gap: 12px; /* 增加信息项间距 */
+  gap: 10px; /* 调整信息项间距 */
+  margin-bottom: 10px;
 }
 
 .info-section .title {