diff --git a/src/apis/product.js b/src/apis/product.js
index fa2af56..df5a203 100644
--- a/src/apis/product.js
+++ b/src/apis/product.js
@@ -11,7 +11,7 @@ export const project_list = () => {
 }
 
 // 获取产品版本列表
-export const prd_list = (page_num, page_size, project='') => {
+export const prd_list = (page_num, page_size, project = '') => {
     // console.log('prd_list')
     return request({
         url: '/prd/prd_list',
@@ -82,7 +82,10 @@ export const prd_delete = (id) => {
 // 获取历史数据
 export const prd_history = (id) => {
     return request({
-        url: `/prd/prd_history/${id}/`,
+        url: `/prd/prd_history`,
         method: 'get',
+        params: {
+            prd_id: id,
+        }
     })
 }
\ No newline at end of file
diff --git a/src/components/product/ProductHistory.vue b/src/components/product/ProductHistory.vue
index 5d2f329..29c49b7 100644
--- a/src/components/product/ProductHistory.vue
+++ b/src/components/product/ProductHistory.vue
@@ -1,26 +1,63 @@
 <script setup>
- import { prd_history } from '@/apis/product.js';
+import {onBeforeMount, ref, computed} from "vue";
+import {useStore} from "vuex";
+import {prd_history} from '@/apis/product.js';
 
- async function get_history(id){
+// 定义数据源
+const history_data = ref([])
 
- }
+// 注册store
+const store = useStore()
+
+// 注册props
+const props = defineProps({
+  id: {
+    type: Number,
+    required: true,
+    default: 1
+  }
+})
+
+const handleOpen = () => {
+  get_history(props.id);
+}
+
+const handleClose = () => {
+  store.state.updateModule.update_dialog_show = false
+}
+
+// 通过接口获取历史数据
+async function get_history(id) {
+  await prd_history(id).then(res => {
+    console.log('get_history')
+    if (Array.isArray(res)) {
+      history_data.value = [...res]
+    }
+  }).catch(err => {
+    console.log(err)
+  });
+}
+
+// onBeforeMount(
+//     async () => {
+//       await get_history(props.id);
+//     }
+// )
 
 </script>
 
 <template>
-<el-row>
-  <el-col>
-    <el-button>返回</el-button>
-  </el-col>
-</el-row>
-  <el-table>
-    <el-table-column prop="update_at" label="版本发布日期">
-
-    </el-table-column>
-    <el-table-column prop="prd_history_doc_link" label="产品原型链接">
-
-    </el-table-column>
-  </el-table>
+  <el-dialog v-model="store.state.prdModule.history_dialog_show" title="历史记录" :modal="true" width="720px"
+             :close-on-click-modal="false" @open="handleOpen" @close="handleClose">
+    <el-table>
+      <el-table-column prop="update_at" label="版本发布日期">
+
+      </el-table-column>
+      <el-table-column prop="history_doc_link" label="产品原型链接">
+
+      </el-table-column>
+    </el-table>
+  </el-dialog>
 </template>
 
 <style scoped>
diff --git a/src/store/index.js b/src/store/index.js
index ff6ee1b..cc899b7 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -38,7 +38,7 @@ const updateModule = {
 const ecApiModule = {
     namespaced: true,
     state: {
-        ec_api_data: {api:[]},  // 所有api数据
+        ec_api_data: {api: []},  // 所有api数据
         // ec_select_api: [],  // 默认选中的api
         first_tab_api_id: 1,
         show_tab_area: true, //是否显示表格区域
@@ -76,11 +76,11 @@ const ecApiModule = {
             // console.log('state.ec_api_data.api', state.ec_api_data.api)
         },
         handle_sort_ec_select_api: (state, payload) => {
-            const movedTab = state.ec_api_data.api.splice(payload.oldIndex-1, 1)[0];
-            state.ec_api_data.api.splice(payload.newIndex-1, 0, movedTab);
+            const movedTab = state.ec_api_data.api.splice(payload.oldIndex - 1, 1)[0];
+            state.ec_api_data.api.splice(payload.newIndex - 1, 0, movedTab);
         },
         add_ec_api_data: (state, payload) => {
-            state.ec_api_data =  {api:[]}
+            state.ec_api_data = {api: []}
             state.ec_api_data = payload
         }
 
@@ -88,9 +88,23 @@ const ecApiModule = {
     actions: {},
 }
 
+const prdModule = {
+    namespaced: true,
+    state: {
+        history_dialog_show: false,
+    },
+    getter: {
+        dialog_change: state => {
+            state.history_dialog_show = !state.history_dialog_show
+            return state.history_dialog_show
+        },
+    },
+}
+
 export default createStore({
     modules: {
         updateModule,
         ecApiModule,
+        prdModule,
     },
 })
diff --git a/src/views/product/index.vue b/src/views/product/index.vue
index 7af75c7..9fc4abe 100644
--- a/src/views/product/index.vue
+++ b/src/views/product/index.vue
@@ -2,6 +2,8 @@
 import {onBeforeMount, onMounted, reactive, ref, unref, computed} from 'vue';
 import {useStore, mapGetters, mapState} from "vuex";
 import {project_list, prd_list, prd_add, prd_get, prd_update, prd_delete} from "@/apis/product.js";
+import CinemaUpdate from "@/components/update/CinemaUpdate.vue";
+import ProductHistory from "@/components/product/ProductHistory.vue";
 
 
 // 注册vuex
@@ -27,6 +29,8 @@ const pageSize = ref(20)
 
 const total = ref(0)
 
+const history_dialog_id = ref(1)
+
 // 处理翻页
 const handleCurrentChange = (newPage) => {
   currentPage.value = newPage
@@ -38,6 +42,14 @@ const handleSizeChange = (newPageSize) => {
   get_table_data(currentPage.value, pageSize.value, fromData.project)
 }
 
+// 处理历史记录对话框
+const changeDialogStatus = (id) => {
+  history_dialog_id.value = id
+  console.log('changeDialogStatus', id)
+  store.state.updateModule.update_dialog_show = true
+  console.log(store.state.updateModule.update_dialog_show)
+}
+
 
 // 数据提交 点击搜索按键提交数据
 const submitSearch = async () => {
@@ -148,6 +160,11 @@ onMounted(
       </template>
     </el-table-column>
     <el-table-column prop="update_at" label="最后更新时间" min-width="180"></el-table-column>
+    <el-table-column prop="id" label="历史文档" min-width="120">
+      <template v-slot="scope">
+        <el-button type="primary" size="small" @click="changeDialogStatus(scope.row.id)">查看</el-button>
+      </template>
+    </el-table-column>
   </el-table>
   <div class="pagination-container">
     <el-pagination
@@ -162,6 +179,7 @@ onMounted(
     >
     </el-pagination>
   </div>
+  <ProductHistory :id="history_dialog_id"></ProductHistory>
 </template>