diff --git a/src/components/mycomponent/dialog/productDetailDialog.vue b/src/components/mycomponent/dialog/productDetailDialog.vue
index 7b19a76..bd6ab97 100644
--- a/src/components/mycomponent/dialog/productDetailDialog.vue
+++ b/src/components/mycomponent/dialog/productDetailDialog.vue
@@ -1,133 +1,56 @@
 <!--产品详情弹窗-->
 <template>
-  <el-dialog title="详情" width="920px" :visible.sync="isShowInfo" append-to-body @close="close">
-    <div class="contanier">
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            产品编号
+  <el-dialog title="详情" width="920px" :visible.sync="dialogShow" append-to-body @close="close">
+    <div v-loading="loading" class="contanier">
+      <el-descriptions v-if="form" class="margin-top" title="" label-class-name="description-label" :column="2" border>
+        <el-descriptions-item label="产品型号">
+          {{ form ? form.productCode : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品名称">
+          {{ form ? form.productName : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品品牌">
+          {{ form ? form.brandName : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品品类">
+          {{ form ? form.categoryStr : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品版本">
+          {{ form ? form.productEdition : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="国际69码">
+          {{ form ? form.internationalCode : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="包装尺寸">
+          {{ form ? form.productPackageSize : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品颜色">
+          {{ form ? form.productColor : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品状态">
+          {{ form ? form.productStatus : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品材质">
+          {{ form ? form.productMaterialQuality : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品重量">
+          {{ form ? form.productWeight : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item v-if="form" label="是否为IOT产品">
+          {{ form&&form.productNetworkMode=='1' ? '是' : '否' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="照片" :span="2">
+          <div v-if="form.productPicture" style="display: flex">
+            <div>
+              <el-image :src="imageUrl+form.productPicture" style="height: 150px;width:auto" fit="scale-down" />
+            </div>
           </div>
-          <div class="content">
-            {{ dataInfo ? dataInfo.productCode : '' }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品名称
-          </div>
-          <div class="content">
-            {{ dataInfo.productName }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            品牌Id
-          </div>
-          <div class="content">
-            {{ dataInfo.brandId }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            品类Id
-          </div>
-          <div class="content">
-            {{ dataInfo.categoryId }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            国际69码
-          </div>
-          <div class="content">
-            {{ dataInfo.internationalCode }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品版本
-          </div>
-          <div class="content">
-            {{ dataInfo.productEdition }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            产品尺寸
-          </div>
-          <div class="content">
-            {{ dataInfo.productPackageSize }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品状态
-          </div>
-          <div class="content">
-            {{ dataInfo.productStatus }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            产品颜色
-          </div>
-          <div class="content">
-            {{ dataInfo.productColor }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品重量
-          </div>
-          <div class="content">
-            {{ dataInfo.productWeight }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            产品材质
-          </div>
-          <div class="content">
-            {{ dataInfo.productMaterialQuality }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品图片
-          </div>
-          <div class="content">
-            {{ dataInfo.productPicture }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            配网方式
-          </div>
-          <div class="content">
-            {{ dataInfo.productNetworkMode }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品参数值列表
-          </div>
-          <div class="content">
-            {{ dataInfo.paramValues }}
-          </div>
-        </div>
-      </div>
+          <span v-else>无</span>
+        </el-descriptions-item>
+        <el-descriptions-item v-for="param of form.paramValues" :key="param.paramId" :label="param.paramName">
+          {{ param.paramValue }}
+        </el-descriptions-item>
+      </el-descriptions>
     </div>
   </el-dialog>
 </template>
@@ -137,11 +60,23 @@
 import { infoDialog } from '../../../utils/myUtils/mixins/infoDialog' // 抽离porp 和 methods
 export default {
   mixins: [infoDialog],
-  mounted() {
-    const id = this.dataInfo.id
-    productDetail({ id: id }).then(res => {
-      console.log(res, '----')
-    })
+  data() {
+    return {
+      dialogShow: false,
+      loading: false,
+      form: null,
+      imageUrl: this.baseConfig.baseUrl + '/static/'
+    }
+  },
+  methods: {
+    initDialog(id) {
+      this.dialogShow = true
+      this.loading = true
+      productDetail({ id: id }).then(res => {
+        this.form = res
+        this.loading = false
+      })
+    }
   }
 }
 </script>
@@ -149,3 +84,8 @@
 <style lang="scss" scoped>
 @import '../../../assets/css/infoDialog.scss';
 </style>
+<style>
+.description-label{
+  width: 140px !important;
+}
+</style>

diff --git a/src/components/mycomponent/dialog/productDetailDialog.vue b/src/components/mycomponent/dialog/productDetailDialog.vue
index 7b19a76..bd6ab97 100644
--- a/src/components/mycomponent/dialog/productDetailDialog.vue
+++ b/src/components/mycomponent/dialog/productDetailDialog.vue
@@ -1,133 +1,56 @@
 <!--产品详情弹窗-->
 <template>
-  <el-dialog title="详情" width="920px" :visible.sync="isShowInfo" append-to-body @close="close">
-    <div class="contanier">
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            产品编号
+  <el-dialog title="详情" width="920px" :visible.sync="dialogShow" append-to-body @close="close">
+    <div v-loading="loading" class="contanier">
+      <el-descriptions v-if="form" class="margin-top" title="" label-class-name="description-label" :column="2" border>
+        <el-descriptions-item label="产品型号">
+          {{ form ? form.productCode : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品名称">
+          {{ form ? form.productName : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品品牌">
+          {{ form ? form.brandName : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品品类">
+          {{ form ? form.categoryStr : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品版本">
+          {{ form ? form.productEdition : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="国际69码">
+          {{ form ? form.internationalCode : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="包装尺寸">
+          {{ form ? form.productPackageSize : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品颜色">
+          {{ form ? form.productColor : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品状态">
+          {{ form ? form.productStatus : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品材质">
+          {{ form ? form.productMaterialQuality : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品重量">
+          {{ form ? form.productWeight : '' }}
+        </el-descriptions-item>
+        <el-descriptions-item v-if="form" label="是否为IOT产品">
+          {{ form&&form.productNetworkMode=='1' ? '是' : '否' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="照片" :span="2">
+          <div v-if="form.productPicture" style="display: flex">
+            <div>
+              <el-image :src="imageUrl+form.productPicture" style="height: 150px;width:auto" fit="scale-down" />
+            </div>
           </div>
-          <div class="content">
-            {{ dataInfo ? dataInfo.productCode : '' }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品名称
-          </div>
-          <div class="content">
-            {{ dataInfo.productName }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            品牌Id
-          </div>
-          <div class="content">
-            {{ dataInfo.brandId }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            品类Id
-          </div>
-          <div class="content">
-            {{ dataInfo.categoryId }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            国际69码
-          </div>
-          <div class="content">
-            {{ dataInfo.internationalCode }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品版本
-          </div>
-          <div class="content">
-            {{ dataInfo.productEdition }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            产品尺寸
-          </div>
-          <div class="content">
-            {{ dataInfo.productPackageSize }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品状态
-          </div>
-          <div class="content">
-            {{ dataInfo.productStatus }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            产品颜色
-          </div>
-          <div class="content">
-            {{ dataInfo.productColor }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品重量
-          </div>
-          <div class="content">
-            {{ dataInfo.productWeight }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            产品材质
-          </div>
-          <div class="content">
-            {{ dataInfo.productMaterialQuality }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品图片
-          </div>
-          <div class="content">
-            {{ dataInfo.productPicture }}
-          </div>
-        </div>
-      </div>
-      <div class="box">
-        <div class="item">
-          <div class="title">
-            配网方式
-          </div>
-          <div class="content">
-            {{ dataInfo.productNetworkMode }}
-          </div>
-        </div>
-        <div class="item">
-          <div class="title">
-            产品参数值列表
-          </div>
-          <div class="content">
-            {{ dataInfo.paramValues }}
-          </div>
-        </div>
-      </div>
+          <span v-else>无</span>
+        </el-descriptions-item>
+        <el-descriptions-item v-for="param of form.paramValues" :key="param.paramId" :label="param.paramName">
+          {{ param.paramValue }}
+        </el-descriptions-item>
+      </el-descriptions>
     </div>
   </el-dialog>
 </template>
@@ -137,11 +60,23 @@
 import { infoDialog } from '../../../utils/myUtils/mixins/infoDialog' // 抽离porp 和 methods
 export default {
   mixins: [infoDialog],
-  mounted() {
-    const id = this.dataInfo.id
-    productDetail({ id: id }).then(res => {
-      console.log(res, '----')
-    })
+  data() {
+    return {
+      dialogShow: false,
+      loading: false,
+      form: null,
+      imageUrl: this.baseConfig.baseUrl + '/static/'
+    }
+  },
+  methods: {
+    initDialog(id) {
+      this.dialogShow = true
+      this.loading = true
+      productDetail({ id: id }).then(res => {
+        this.form = res
+        this.loading = false
+      })
+    }
   }
 }
 </script>
@@ -149,3 +84,8 @@
 <style lang="scss" scoped>
 @import '../../../assets/css/infoDialog.scss';
 </style>
+<style>
+.description-label{
+  width: 140px !important;
+}
+</style>
diff --git a/src/views/product/productList.vue b/src/views/product/productList.vue
index 1e62903..309ce79 100644
--- a/src/views/product/productList.vue
+++ b/src/views/product/productList.vue
@@ -78,7 +78,7 @@
         @setLimit="setLimit"
       />
     </div>
-    <productDetailDialog v-if="isShowDetail" :data-info="dataInfo" @close="DetailDialogClose" />
+    <productDetailDialog ref="detailDialog" :data-info="dataInfo" @close="DetailDialogClose" />
     <product-list-add-dialog v-show="isShowDialog" ref="addProduct" :title="dialogTitle" @close="addDialogClose" @refresh="refresh" />
     <productBindDialog v-if="isBindShow" :data-info="dataInfo" @close="BindDialogClose" />
   </div>
@@ -181,9 +181,9 @@
     },
     // 详情
     handleDetail(row) {
-      console.log(row)
       this.isShowDetail = true
       this.dataInfo = row
+      this.$refs.detailDialog.initDialog(row.id)
     },
     DetailDialogClose() {
       this.isShowDetail = false
@@ -226,6 +226,9 @@
         this.refresh()
       })
     },
+    addDialogClose() {
+      this.refresh()
+    },
     handleBind(row) {
       console.log(row)
       this.isBindShow = true