src/views/data/channel/opcua/index.vue

@@ -19,20 +19,20 @@
      </el-form-item>
      <el-form-item>
        <el-button @click="handleQuery">
          <Icon icon="ep:search" class="mr-5px" />
          <Icon icon="ep:search" class="mr-5px"/>
          搜索
        </el-button>
        <el-button @click="resetQuery">
          <Icon icon="ep:refresh" class="mr-5px" />
          <Icon icon="ep:refresh" class="mr-5px"/>
          重置
        </el-button>
        <el-button
          type="primary"
          plain
          @click="openForm('create')"
          v-hasPermi="['system:tenant:create']"
          v-hasPermi="['data:channel-opcua:create']"
        >
          <Icon icon="ep:plus" class="mr-5px" />
          <Icon icon="ep:plus" class="mr-5px"/>
          新增
        </el-button>
      </el-form-item>
@@ -42,31 +42,43 @@
  <!-- 列表 -->
  <ContentWrap>
    <el-table v-loading="loading" :data="list">
      <el-table-column label="服务名" align="center" prop="serverName" />
      <el-table-column label="端点URL" align="center" prop="endpointUrl" />
      <el-table-column label="安全策略" align="center" prop="securityPolicy" />
      <el-table-column label="安全模式" align="center" prop="securityMode" />
      <el-table-column label="连接方式" align="center" prop="connectionType" />
      <el-table-column label="用户名" align="center" prop="userName" />
      <el-table-column label="密码" align="center" prop="password" />
      <el-table-column label="安全证书路径" align="center" prop="certificatePath" />
      <el-table-column label="设备不活动超时时间" align="center" prop="connectInactivityTimeout" />
      <el-table-column label="重连超时" align="center" prop="reconnectInterval" />
      <el-table-column label="服务名" header-align="center" align="left" prop="serverName" min-width="180"/>
      <el-table-column label="端点URL" header-align="center" align="left" prop="endpointUrl" min-width="260"/>
      <el-table-column label="安全策略" align="center" prop="securityPolicy"/>
      <el-table-column label="安全模式" align="center" prop="securityMode"/>
      <el-table-column label="连接方式" align="center" prop="connectionType">
        <template #default="scope">
          <dict-tag :type="DICT_TYPE.OPCUA_CONNECTION_TYPE" :value="scope.row.connectionType" />
        </template>
      </el-table-column>
      <el-table-column label="用户名" align="center" prop="userName"/>
      <el-table-column label="密码" align="center" prop="password"/>
      <el-table-column label="安全证书路径" header-align="center" align="left" prop="certificatePath" min-width="200"/>
      <el-table-column label="设备不活动超时时间" align="center" prop="connectInactivityTimeout"/>
      <el-table-column label="重连超时" align="center" prop="reconnectInterval"/>
      <el-table-column label="操作" align="center" min-width="110" fixed="right">
        <template #default="scope">
          <el-button
            link
            type="primary"
            @click="openForm('update', scope.row.id)"
            v-hasPermi="['system:tenant:update']"
            v-hasPermi="['data:channel-opcua:update']"
          >
            编辑
          </el-button>
          <el-button
            link
            type="primary"
            @click="openTagList(scope.row.serverName)"
            v-hasPermi="['data:channel-modbus:update']"
          >
            TAG
          </el-button>
          <el-button
            link
            type="danger"
            @click="handleDelete(scope.row.id)"
            v-hasPermi="['system:tenant:delete']"
            v-hasPermi="['data:channel-opcua:delete']"
          >
            删除
          </el-button>
@@ -83,14 +95,19 @@
  </ContentWrap>

  <!-- 表单弹窗：添加/修改 -->
  <OpcUaDeviceForm ref="formRef" @success="getList" />
  <OpcUaDeviceForm ref="formRef" @success="getList"/>

  <!-- TAG弹窗：添加/修改 -->
  <TagList ref="tagRef" @success="getList"/>

</template>
<script lang="ts" setup>
import * as OpcUaApi from '@/api/data/channel/opcua'
import OpcUaDeviceForm from './OpcUaDeviceForm.vue'
  import * as OpcUaApi from '@/api/data/channel/opcua'
  import OpcUaDeviceForm from './OpcUaDeviceForm.vue'
  import TagList from './tag/index.vue'
  import { DICT_TYPE } from '@/utils/dict'

defineOptions({name: 'DataOpcUa'})
  defineOptions({name: 'DataOpcUa'})

  const message = useMessage() // 消息弹窗
  const {t} = useI18n() // 国际化
@@ -136,6 +153,12 @@
    formRef.value.open(type, id)
  }

  /** TAG操作 */
  const tagRef = ref()
  const openTagList = (serverName?: string) => {
    tagRef.value.open(serverName)
  }

  /** 删除按钮操作 */
  const handleDelete = async (id: number) => {
    try {