Merge remote-tracking branch 'origin/feature/iot' into feature/iot

# Conflicts:
#	src/components/DictTag/src/DictTag.vue

src/api/iot/product/index.ts

@@ -46,5 +46,10 @@ export const ProductApi = {
   // 导出iot 产品 Excel
   exportProduct: async (params) => {
     return await request.download({ url: `/iot/product/export-excel`, params })
+  },
+
+  // 更新产品状态
+  updateProductStatus: async (id: number, status: number) => {
+    return await request.put({ url: `/iot/product/update-status?id=` + id + `&status=` + status })
   }
-}
+}

src/views/iot/product/ProductForm.vue

@@ -103,16 +103,15 @@
 import { ProductApi, ProductVO } from '@/api/iot/product'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 
-/** iot 产品 表单 */
 defineOptions({ name: 'ProductForm' })
 
-const { t } = useI18n() // 国际化
-const message = useMessage() // 消息弹窗
+const { t } = useI18n()
+const message = useMessage()
 
-const dialogVisible = ref(false) // 弹窗的是否展示
-const dialogTitle = ref('') // 弹窗的标题
-const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
-const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const dialogVisible = ref(false)
+const dialogTitle = ref('')
+const formLoading = ref(false)
+const formType = ref('')
 const formData = ref({
   name: undefined,
   id: undefined,
@@ -161,15 +160,13 @@ const formRules = reactive({
     }
   ]
 })
-const formRef = ref() // 表单 Ref
+const formRef = ref()
 
-/** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true
   dialogTitle.value = t('action.' + type)
   formType.value = type
   resetForm()
-  // 修改时，设置数据
   if (id) {
     formLoading.value = true
     try {
@@ -179,14 +176,11 @@ const open = async (type: string, id?: number) => {
     }
   }
 }
-defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+defineExpose({ open, close: () => (dialogVisible.value = false) })
 
-/** 提交表单 */
-const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const emit = defineEmits(['success'])
 const submitForm = async () => {
-  // 校验表单
   await formRef.value.validate()
-  // 提交请求
   formLoading.value = true
   try {
     const data = formData.value as unknown as ProductVO
@@ -197,15 +191,13 @@ const submitForm = async () => {
       await ProductApi.updateProduct(data)
       message.success(t('common.updateSuccess'))
     }
-    dialogVisible.value = false
-    // 发送操作成功的事件
+    dialogVisible.value = false // 确保关闭弹框
     emit('success')
   } finally {
     formLoading.value = false
   }
 }
 
-/** 重置表单 */
 const resetForm = () => {
   formData.value = {
     name: undefined,

src/views/iot/product/detail/ProductDetailsHeader.vue

@@ -10,36 +10,89 @@
       </div>
       <div>
         <!-- 右上：按钮 -->
-        <el-button @click="openForm('update', product.id)" v-hasPermi="['iot:product:update']">
+        <el-button
+          @click="openForm('update', product.id)"
+          v-hasPermi="['iot:product:update']"
+          v-if="product.status === 0"
+        >
           编辑
         </el-button>
+        <el-button
+          type="primary"
+          @click="confirmPublish(product.id)"
+          v-hasPermi="['iot:product:update']"
+          v-if="product.status === 0"
+        >
+          发布
+        </el-button>
+        <el-button
+          type="danger"
+          @click="confirmUnpublish(product.id)"
+          v-hasPermi="['iot:product:update']"
+          v-if="product.status === 1"
+        >
+          撤销发布
+        </el-button>
       </div>
     </div>
   </div>
   <ContentWrap class="mt-10px">
-    <el-descriptions :column="5" direction="vertical">
-      <el-descriptions-item label="产品名称">{{ product.name }}</el-descriptions-item>
-      <el-descriptions-item label="产品标识">{{ product.identification }}</el-descriptions-item>
-      <el-descriptions-item label="设备类型">
-        <dict-tag :type="DICT_TYPE.IOT_PRODUCT_DEVICE_TYPE" :value="product.deviceType" />
+    <el-descriptions :column="5" direction="horizontal">
+      <el-descriptions-item label="ProductKey">
+        {{ product.productKey }}
+        <el-button @click="copyToClipboard(product.productKey)">复制</el-button>
       </el-descriptions-item>
-      <el-descriptions-item label="产品状态">
-        <dict-tag :type="DICT_TYPE.IOT_PRODUCT_STATUS" :value="product.status" />
+    </el-descriptions>
+    <el-descriptions :column="5" direction="horizontal">
+      <el-descriptions-item label="设备数">
+        0
+        <el-button @click="goToManagement(product.productKey)">前往管理</el-button>
       </el-descriptions-item>
     </el-descriptions>
   </ContentWrap>
   <!-- 表单弹窗：添加/修改 -->
-  <ProductForm ref="formRef" @success="openForm('update', product.id)" />
+  <ProductForm ref="formRef" @success="emit('refresh')" />
 </template>
 <script setup lang="ts">
 import ProductForm from '@/views/iot/product/ProductForm.vue'
-import { DICT_TYPE } from '@/utils/dict'
-import { ProductVO } from '@/api/iot/product'
+import { ProductApi, ProductVO } from '@/api/iot/product'
+
+const message = useMessage()
+const copyToClipboard = (text: string) => {
+  navigator.clipboard.writeText(text).then(() => {
+    message.success('复制成功')
+  })
+}
+const goToManagement = (productKey: string) => {
+  message.warning('暂未开放')
+}
 
 // 操作修改
 const formRef = ref()
 const openForm = (type: string, id?: number) => {
   formRef.value.open(type, id)
 }
+const confirmPublish = async (id: number) => {
+  try {
+    await ProductApi.updateProductStatus(id, 1)
+    message.success('发布成功')
+    formRef.value.close() // 关闭弹框
+    emit('refresh')
+  } catch (error) {
+    message.error('发布失败')
+  }
+}
+const confirmUnpublish = async (id: number) => {
+  try {
+    await ProductApi.updateProductStatus(id, 0)
+    message.success('撤销发布成功')
+    formRef.value.close() // 关闭弹框
+    emit('refresh')
+  } catch (error) {
+    message.error('撤销发布失败')
+  }
+}
+
 const { product } = defineProps<{ product: ProductVO }>()
+const emit = defineEmits(['refresh'])
 </script>

src/views/iot/product/detail/ProductDetailsInfo.vue

@@ -1,34 +1,41 @@
 <template>
   <ContentWrap>
     <el-collapse v-model="activeNames">
-      <el-collapse-item name="basicInfo">
-        <template #title>
-          <span class="text-base font-bold">基本信息</span>
-        </template>
-        <el-descriptions :column="4">
-          <el-descriptions-item label="产品名称">{{ product.name }}</el-descriptions-item>
-          <el-descriptions-item label="产品标识">{{ product.identification }}</el-descriptions-item>
-          <el-descriptions-item label="设备类型">
-            <dict-tag :type="DICT_TYPE.IOT_PRODUCT_DEVICE_TYPE" :value="product.deviceType" />
-          </el-descriptions-item>
-          <el-descriptions-item label="数据格式">
-            <dict-tag :type="DICT_TYPE.IOT_PRODUCT_DATA_FORMAT" :value="product.dataFormat" />
-          </el-descriptions-item>
-          <el-descriptions-item label="协议类型">
-            <dict-tag :type="DICT_TYPE.IOT_PRODUCT_PROTOCOL_TYPE" :value="product.protocolType" />
-          </el-descriptions-item>
-          <el-descriptions-item label="产品状态">
-            <dict-tag :type="DICT_TYPE.IOT_PRODUCT_STATUS" :value="product.status" />
-          </el-descriptions-item>
-          <el-descriptions-item label="产品描述">{{ product.description }}</el-descriptions-item>
-        </el-descriptions>
-      </el-collapse-item>
+      <el-descriptions :column="3" title="产品信息">
+        <el-descriptions-item label="产品名称">{{ product.name }}</el-descriptions-item>
+        <el-descriptions-item label="设备类型">
+          <dict-tag :type="DICT_TYPE.IOT_PRODUCT_DEVICE_TYPE" :value="product.deviceType" />
+        </el-descriptions-item>
+        <el-descriptions-item label="创建时间">{{
+          formatDate(product.createTime)
+        }}</el-descriptions-item>
+        <el-descriptions-item label="数据格式">
+          <dict-tag :type="DICT_TYPE.IOT_DATA_FORMAT" :value="product.dataFormat" />
+        </el-descriptions-item>
+        <el-descriptions-item label="数据校验级别">
+          <dict-tag :type="DICT_TYPE.IOT_VALIDATE_TYPE" :value="product.validateType" />
+        </el-descriptions-item>
+        <el-descriptions-item label="产品状态">
+          <dict-tag :type="DICT_TYPE.IOT_PRODUCT_STATUS" :value="product.status" />
+        </el-descriptions-item>
+        <el-descriptions-item
+          label="联网方式"
+          v-if="product.deviceType === 0 || product.deviceType === 2"
+        >
+          <dict-tag :type="DICT_TYPE.IOT_NET_TYPE" :value="product.netType" />
+        </el-descriptions-item>
+        <el-descriptions-item label="接入网关协议" v-if="product.deviceType === 1">
+          <dict-tag :type="DICT_TYPE.IOT_PROTOCOL_TYPE" :value="product.protocolType" />
+        </el-descriptions-item>
+        <el-descriptions-item label="产品描述">{{ product.description }}</el-descriptions-item>
+      </el-descriptions>
     </el-collapse>
   </ContentWrap>
 </template>
 <script setup lang="ts">
 import { DICT_TYPE } from '@/utils/dict'
 import { ProductVO } from '@/api/iot/product'
+import { formatDate } from '@/utils/formatTime'
 
 const { product } = defineProps<{ product: ProductVO }>()
 

src/views/iot/product/detail/index.vue

@@ -2,12 +2,15 @@
   <ProductDetailsHeader :loading="loading" :product="product" @refresh="getProductData(id)" />
   <el-col>
     <el-tabs>
-      <el-tab-pane label="详细资料">
+      <el-tab-pane label="产品信息">
         <ProductDetailsInfo :product="product" />
       </el-tab-pane>
+      <el-tab-pane label="Topic 类列表" />
       <el-tab-pane label="物模型">
         <!--        <ProductDetailsModel :product="product" />-->
       </el-tab-pane>
+      <el-tab-pane label="消息解析" />
+      <el-tab-pane label="服务端订阅" />
     </el-tabs>
   </el-col>
 </template>
@@ -30,6 +33,7 @@ const getProductData = async (id: number) => {
   loading.value = true
   try {
     product.value = await ProductApi.getProduct(id)
+    console.log(product.value)
   } finally {
     loading.value = false
   }

src/views/iot/product/index.vue

@@ -37,15 +37,6 @@
         >
           <Icon icon="ep:plus" class="mr-5px" /> 新增
         </el-button>
-        <el-button
-          type="success"
-          plain
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['iot:product:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
       </el-form-item>
     </el-form>
   </ContentWrap>
@@ -57,7 +48,7 @@
       <el-table-column label="ProductKey" align="center" prop="productKey" />
       <el-table-column label="设备类型" align="center" prop="deviceType">
         <template #default="scope">
-          <dict-tag :type="DICT_TYPE.IOT_PRODUCT_DEVICE_TYPE" :code="scope.row.deviceType" />
+          <dict-tag :type="DICT_TYPE.IOT_PRODUCT_DEVICE_TYPE" :value="scope.row.deviceType" />
         </template>
       </el-table-column>
       <el-table-column
@@ -69,7 +60,7 @@
       />
       <el-table-column label="产品状态" align="center" prop="status">
         <template #default="scope">
-          <dict-tag :type="DICT_TYPE.IOT_PRODUCT_STATUS" :code="scope.row.status" />
+          <dict-tag :type="DICT_TYPE.IOT_PRODUCT_STATUS" :value="scope.row.status" />
         </template>
       </el-table-column>
       <el-table-column label="操作" align="center">
@@ -77,16 +68,17 @@
           <el-button
             link
             type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['iot:product:update']"
+            @click="openDetail(scope.row.id)"
+            v-hasPermi="['iot:product:query']"
           >
-            编辑
+            查看
           </el-button>
           <el-button
             link
             type="danger"
             @click="handleDelete(scope.row.id)"
             v-hasPermi="['iot:product:delete']"
+            :disabled="scope.row.status === 1"
           >
             删除
           </el-button>
@@ -171,6 +163,12 @@ const openForm = (type: string, id?: number) => {
   formRef.value.open(type, id)
 }
 
+/** 打开详情 */
+const { currentRoute, push } = useRouter()
+const openDetail = (id: number) => {
+  push({ name: 'IotProductDetail', params: { id } })
+}
+
 /** 删除按钮操作 */
 const handleDelete = async (id: number) => {
   try {