餐饮油烟智能监测与监管一体化平台
riku
2026-03-17 b1a0d701cf898c8b7812e66a808a1c91f2bae6cc
src/views/system/SystemManage.vue
@@ -60,108 +60,6 @@
            />
          </div>
        </el-tab-pane>
        <!-- 餐饮店铺管理 -->
        <el-tab-pane label="餐饮店铺管理" name="restaurants">
          <div class="tab-content">
            <!-- 搜索和添加按钮 -->
            <div class="search-add-bar">
              <el-input
                v-model="restaurantSearchQuery"
                placeholder="搜索店铺"
                style="width: 200px"
                prefix-icon="el-icon-search"
              />
              <el-button type="primary" @click="openRestaurantDialog">
                <el-icon><Plus /></el-icon> 添加店铺
              </el-button>
            </div>
            <!-- 店铺表格 -->
            <el-table :data="filteredRestaurants" style="width: 100%">
              <el-table-column prop="id" label="ID" width="80" />
              <el-table-column prop="name" label="店铺名称" />
              <el-table-column prop="address" label="地址" />
              <el-table-column prop="contact" label="联系人" />
              <el-table-column prop="phone" label="联系电话" />
              <el-table-column label="操作" width="250">
                <template #default="scope">
                  <el-button size="small" @click="editRestaurant(scope.row)"> 编辑 </el-button>
                  <el-button size="small" type="danger" @click="deleteRestaurant(scope.row.id)">
                    删除
                  </el-button>
                  <el-button size="small" @click="manageDevices(scope.row)"> 设备管理 </el-button>
                </template>
              </el-table-column>
            </el-table>
            <!-- 分页 -->
            <el-pagination
              v-model:current-page="restaurantCurrentPage"
              v-model:page-size="restaurantPageSize"
              :page-sizes="[10, 20, 50]"
              layout="total, sizes, prev, pager, next, jumper"
              :total="restaurants.length"
              style="margin-top: 20px"
            />
          </div>
        </el-tab-pane>
        <!-- 设备管理 -->
        <el-tab-pane label="设备管理" name="devices">
          <div class="tab-content" v-if="selectedRestaurant">
            <h3>{{ selectedRestaurant.name }} - 设备列表</h3>
            <!-- 搜索和添加按钮 -->
            <div class="search-add-bar">
              <el-input
                v-model="deviceSearchQuery"
                placeholder="搜索设备"
                style="width: 200px"
                prefix-icon="el-icon-search"
              />
              <el-button type="primary" @click="openDeviceDialog">
                <el-icon><Plus /></el-icon> 添加设备
              </el-button>
            </div>
            <!-- 设备表格 -->
            <el-table :data="filteredDevices" style="width: 100%">
              <el-table-column prop="id" label="ID" width="80" />
              <el-table-column prop="deviceId" label="设备编号" />
              <el-table-column prop="type" label="设备类型" />
              <el-table-column prop="status" label="状态">
                <template #default="scope">
                  <el-tag :type="scope.row.status === 'online' ? 'success' : 'danger'">
                    {{ scope.row.status === 'online' ? '在线' : '离线' }}
                  </el-tag>
                </template>
              </el-table-column>
              <el-table-column prop="installDate" label="安装日期" />
              <el-table-column label="操作" width="200">
                <template #default="scope">
                  <el-button size="small" @click="editDevice(scope.row)"> 编辑 </el-button>
                  <el-button size="small" type="danger" @click="deleteDevice(scope.row.id)">
                    删除
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
            <!-- 分页 -->
            <el-pagination
              v-model:current-page="deviceCurrentPage"
              v-model:page-size="devicePageSize"
              :page-sizes="[10, 20, 50]"
              layout="total, sizes, prev, pager, next, jumper"
              :total="devices.length"
              style="margin-top: 20px"
            />
          </div>
          <div class="tab-content" v-else>
            <el-empty description="请先选择一个餐饮店铺" />
          </div>
        </el-tab-pane>
      </el-tabs>
    </el-card>