邓洁 : 修改页面细节

src/views/custom-query/sql/index.vue

@@ -17,7 +17,9 @@
     </el-form>
     <div class="query-btn">
       <el-button type="primary" @click="handleAdd" :icon="Plus" plain>新增</el-button>
-      <el-button type="danger" @click="handleMoreDelete" :icon="Delete" plain>删除</el-button>
+      <popover-delete :name="uqNameList" btn-type="danger" :type="'SQL查询'"
+                      :is-disabled="disabled" :is-plain="true" :btn-icon="Delete"
+                      @delete="handleDelete(uqIds)"/>
     </div>
     <div class="table">
       <el-table
@@ -48,14 +50,13 @@
           <template #default="scope">
             <div v-if="scope.row.publish == false">
               <el-button type="text" size="mini"
-                         @click="handleEdit(scope.row.id)" :icon="Edit">编辑
+                         @click="handleEdit(scope.row.id)" >编辑
               </el-button>
               <el-button type="text" size="mini"
-                         @click="handleDesign(scope.row)" :icon="Edit">设计
-              </el-button>
-              <el-button type="text" size="mini" @click="handleDelete(scope.row)"
-                         :icon="Delete" style="color: red">删除
+                         @click="handleDesign(scope.row)" >设计
               </el-button>
+              <popover-delete :name="scope.row.uqName"  :type="'SQL查询'"
+                              @delete="handleDelete(scope.row.id)"/>
             </div>
             <div v-else>
               <el-button type="text" size="mini" @click="handleDownLine(scope.row)"
@@ -133,9 +134,12 @@ const queryParams = reactive({
 })
 const dataSourceOption = ref([])
 const queryForm = ref([])
+const uqIds = ref([])
+const uqNameList = ref([])
 const list = ref([])
 const total = ref()
 const loading = ref(true)
+const disabled = ref(true)
 const title = ref('')
 const isVisited = ref(false)
 const pageInfo = reactive({
@@ -253,15 +257,15 @@ const handleDownLine = (row) => {
 }
 
 //单个删除
-const handleDelete = async (row) => {
-  let list = []
-  list.push(row.id)
-  ElMessageBox.confirm(`确认删除名称为${row.uqName}的数据吗?`, '系统提示', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning'
-  }).then(() => {
-    delSql(list).then(res => {
+const handleDelete = async (id) => {
+  // let list = []
+  // list.push(row.id)
+  // ElMessageBox.confirm(`确认删除名称为${row.uqName}的数据吗?`, '系统提示', {
+  //   confirmButtonText: '确定',
+  //   cancelButtonText: '取消',
+  //   type: 'warning'
+  // }).then(() => {
+    delSql(id).then(res => {
       if (res.code === 1000) {
         ElMessage.success(res.msg)
         getList()
@@ -269,7 +273,7 @@ const handleDelete = async (row) => {
         ElMessage.error(res.msg)
       }
     })
-  })
+  // })
 }
 //取消
 const handleCancel = () => {
@@ -305,14 +309,16 @@ const handleSubmit = async (instance) => {
     }
   })
 }
-//可删除多行
-const handleMoreDelete = () => {
 
-}
 //勾选table数据行事件
-const handleSelect = (selection) => {
-  console.log('selection', selection)
-  // tableNameArray.value=selection.map(item => item.tableName)
+const handleSelect = async (selection) => {
+  if (selection.length !== 0) {
+    disabled.value = false
+    uqIds.value=selection.map(item => item.id).join()
+    uqNameList.value = selection.map(item => item.uqName).join()
+  } else {
+    disabled.value = true
+  }
 }
 //切换每页显示条数
 const handleSizeChange = async (val) => {