From 283acf91859e48d7e9fed0a152a14353152d125e Mon Sep 17 00:00:00 2001
From: big_sun_962464 <big_sun_962464@devide>
Date: Wed, 28 Aug 2024 17:10:00 +0800
Subject: [PATCH] Wed Aug 28 17:10:00 CST 2024 inscode

---
 src/App.vue                                   | 13 +++++-
 src/components/HowToUseConfirmPopup/index.vue | 40 +++++++++++++++++++
 src/hooks/useConfirmPopup.js                  |  2 +
 3 files changed, 53 insertions(+), 2 deletions(-)
 create mode 100644 src/components/HowToUseConfirmPopup/index.vue

diff --git a/src/App.vue b/src/App.vue
index ce25fe8..669bbbf 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -4,12 +4,14 @@ import EditTable from './components/TableForm/EditTable.vue';
 import ElTableColumnFormatter from './components/TableForm/ElTableColumnFormatter.vue';
 import RemoteSearch from './components/Select/RemoteSearch.vue';
 import SelectValueObj from './components/Select/SelectValueObj.vue';
+import HowToUseConfirmPopup from './components/HowToUseConfirmPopup/index.vue'
 
 const tabs = {
   EditTable,
   ElTableColumnFormatter,
   RemoteSearch,
-  SelectValueObj
+  SelectValueObj,
+  HowToUseConfirmPopup
 }
 const current = ref(EditTable)
 
@@ -26,7 +28,10 @@ function handleClick(val) {
       :key="index"
       @click="handleClick(val)"
     >{{ key }}</button>
-    <component :is="current" />
+
+    <div class="content">
+      <component :is="current" />
+    </div>
   </div>
 </template>
 
@@ -34,6 +39,10 @@ function handleClick(val) {
 .active {
   background: red;
 }
+.content{
+  border: 1px solid #000;
+  padding: 12px;
+}
 </style>
 
 
diff --git a/src/components/HowToUseConfirmPopup/index.vue b/src/components/HowToUseConfirmPopup/index.vue
new file mode 100644
index 0000000..177cb77
--- /dev/null
+++ b/src/components/HowToUseConfirmPopup/index.vue
@@ -0,0 +1,40 @@
+<script setup>
+import useConfirmPopup from '../../hooks/useConfirmPopup'
+
+// 模拟Ajax请求
+function ajax(data){
+  debugger
+  return new Promise((resolve,reject)=>{
+    setTimeout(() => {
+      debugger
+      resolve('请求成功')
+    }, 2000);
+  })
+}
+
+// 新增方法
+async function addFn(data){
+  debugger
+  try {
+    debugger
+    const res = await ajax(data)
+    debugger
+    console.log('res',res)
+  } catch (error) {
+    
+  }
+}
+
+// 按钮触发事件
+function handleClick() {
+  useConfirmPopup(
+    '确认新增?',
+    addFn.bind(null, {name:'张三'})
+  )
+}
+</script>
+
+<template>
+  <button @click="handleClick">触发useConfirmPopup</button>
+</template>
+  
\ No newline at end of file
diff --git a/src/hooks/useConfirmPopup.js b/src/hooks/useConfirmPopup.js
index 13f730e..c68b7c9 100644
--- a/src/hooks/useConfirmPopup.js
+++ b/src/hooks/useConfirmPopup.js
@@ -23,6 +23,7 @@ function useConfirmPopup(title, confirmCallBack, cancelCallback) {
         })
 
         try {
+          debugger
           await confirmCallBack()
           done()
         } catch (err) {
@@ -33,6 +34,7 @@ function useConfirmPopup(title, confirmCallBack, cancelCallback) {
         }
 
       } else if (action === 'cancel') {
+        debugger
         // 取消按钮触发事件
         if(confirmDisabled){
           ElMessage({
-- 
GitLab