feat: 同步协议处理、前端交互与业务联调改动

wanshenmean

2026-03-17 94ad631d316da04c46266ddb1fc6e63e6f8f2fae

 Code/WCS/WIDESEAWCS_S7Simulator/WIDESEAWCS_S7Simulator.Web/src/views/HomeView.vue

@@ -1,12 +1,15 @@
<template>
  <div>
<template>
  <div
    v-loading.fullscreen.lock="startActionLoading"
    element-loading-text="正在启动实例，请稍候..."
  >
    <div class="page-header">
      <div class="header-left">
        <h2>
          <el-icon :size="24"><Cpu /></el-icon>
          S7 PLC 仿真器实例
          S7 PLC 模拟器实例
        </h2>
        <p class="text-muted">管理和监控 S7 PLC 仿真器实例</p>
        <p class="text-muted">管理和监控 S7 PLC 模拟器实例</p>
      </div>
      <div class="header-right">
        <div class="stats">
@@ -107,7 +110,7 @@
</template>

<script setup lang="ts">
import { onMounted, onUnmounted } from 'vue'
import { onMounted, onUnmounted, ref } from 'vue'
import { storeToRefs } from 'pinia'
import { useInstancesStore } from '../stores/instances'
import { ElMessage, ElMessageBox } from 'element-plus'
@@ -125,6 +128,7 @@

const store = useInstancesStore()
const { instances, loading, runningCount, stoppedCount, errorCount } = storeToRefs(store)
const startActionLoading = ref(false)

onMounted(() => {
  store.loadInstances()
@@ -135,22 +139,28 @@
  store.stopAutoRefresh()
})

function handleStart(id: string) {
  ElMessageBox.confirm(`确定要启动实例 "${id}" 吗?`, '确认', {
async function handleStart(id: string) {
  try {
    await ElMessageBox.confirm(`确定要启动实例 "${id}" 吗？`, '确认', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'info'
  }).then(() => {
    store.startInstance(id).then(() => {
    })

    startActionLoading.value = true
    await store.startInstance(id)
      ElMessage.success('启动命令已发送')
    }).catch(() => {
  } catch (err) {
    if (err !== 'cancel') {
      ElMessage.error('启动失败，请查看控制台')
    })
  })
    }
  } finally {
    startActionLoading.value = false
  }
}

function handleStop(id: string) {
  ElMessageBox.confirm(`确定要停止实例 "${id}" 吗?`, '确认', {
  ElMessageBox.confirm(`确定要停止实例 "${id}" 吗？`, '确认', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning'
@@ -164,7 +174,7 @@
}

function handleDelete(id: string) {
  ElMessageBox.confirm(`确定要删除实例 "${id}" 吗?此操作不可撤销!`, '警告', {
  ElMessageBox.confirm(`确定要删除实例 "${id}" 吗？此操作不可撤销！`, '警告', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'error'
@@ -188,7 +198,7 @@
  return map[status] || ''
}

function getStatusTagType(status: string): 'success' | 'info' | 'warning' | 'danger' | 'info' {
function getStatusTagType(status: string): 'success' | 'info' | 'warning' | 'danger' {
  const map: Record<string, 'success' | 'info' | 'warning' | 'danger'> = {
    'Stopped': 'info',
    'Starting': 'info',
@@ -337,3 +347,5 @@
  margin-top: 8px;
}
</style>