Browse Source

refactor: 移除表格多选功能,改用行内操作按钮

统一三个页面的表格操作栏样式,移除批量选择相关逻辑,将修改删除操作改为行内按钮,简化页面交互逻辑
huoyi 3 weeks ago
parent
commit
f50fa0448a

+ 10 - 18
src/views/ledgerManage/contractExpirationLedger/index.vue

@@ -41,15 +41,12 @@
41
 
41
 
42
     <div class="operation-container">
42
     <div class="operation-container">
43
       <el-button type="primary" plain icon="Plus" @click="handleAdd">新增</el-button>
43
       <el-button type="primary" plain icon="Plus" @click="handleAdd">新增</el-button>
44
-      <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate">修改</el-button>
45
-      <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete">删除</el-button>
46
       <el-button type="info" plain icon="Upload" @click="handleImport">导入</el-button>
44
       <el-button type="info" plain icon="Upload" @click="handleImport">导入</el-button>
47
       <el-button type="warning" plain icon="Download" @click="handleExport">导出</el-button>
45
       <el-button type="warning" plain icon="Download" @click="handleExport">导出</el-button>
48
     </div>
46
     </div>
49
 
47
 
50
     <el-table v-loading="loading" :data="list" border fit highlight-current-row style="width: 100%; margin-top: 20px;"
48
     <el-table v-loading="loading" :data="list" border fit highlight-current-row style="width: 100%; margin-top: 20px;"
51
-      @selection-change="handleSelectionChange" @expand-change="handleExpandChange">
52
-      <el-table-column type="selection" width="55" align="center" />
49
+      @expand-change="handleExpandChange">
53
       <el-table-column type="expand">
50
       <el-table-column type="expand">
54
         <template #default="scope">
51
         <template #default="scope">
55
           <div class="detail-container">
52
           <div class="detail-container">
@@ -80,6 +77,12 @@
80
       <el-table-column label="合同名称" prop="contractName" align="center" min-width="150" show-overflow-tooltip />
77
       <el-table-column label="合同名称" prop="contractName" align="center" min-width="150" show-overflow-tooltip />
81
       <el-table-column label="合同开始日期" prop="contractStartDate" align="center" min-width="130" />
78
       <el-table-column label="合同开始日期" prop="contractStartDate" align="center" min-width="130" />
82
       <el-table-column label="合同结束日期" prop="contractEndDate" align="center" min-width="130" />
79
       <el-table-column label="合同结束日期" prop="contractEndDate" align="center" min-width="130" />
80
+      <el-table-column label="操作" align="center" width="150" fixed="right">
81
+        <template #default="scope">
82
+          <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button>
83
+          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
84
+        </template>
85
+      </el-table-column>
83
     </el-table>
86
     </el-table>
84
 
87
 
85
     <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
88
     <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
@@ -203,9 +206,6 @@ const total = ref(0)
203
 const list = ref([])
206
 const list = ref([])
204
 const queryFormRef = ref(null)
207
 const queryFormRef = ref(null)
205
 const formRef = ref(null)
208
 const formRef = ref(null)
206
-const ids = ref([])
207
-const single = ref(true)
208
-const multiple = ref(true)
209
 const open = ref(false)
209
 const open = ref(false)
210
 const title = ref('')
210
 const title = ref('')
211
 
211
 
@@ -293,12 +293,6 @@ const resetQuery = () => {
293
   handleQuery()
293
   handleQuery()
294
 }
294
 }
295
 
295
 
296
-const handleSelectionChange = (selection) => {
297
-  ids.value = selection.map(item => item.id)
298
-  single.value = selection.length !== 1
299
-  multiple.value = !selection.length
300
-}
301
-
302
 const handleExpandChange = async (row, expandedRows) => {
296
 const handleExpandChange = async (row, expandedRows) => {
303
   if (expandedRows.includes(row) && (!row.ledgerContractExpirationDetailList || row.ledgerContractExpirationDetailList.length === 0)) {
297
   if (expandedRows.includes(row) && (!row.ledgerContractExpirationDetailList || row.ledgerContractExpirationDetailList.length === 0)) {
304
     try {
298
     try {
@@ -318,17 +312,15 @@ const handleAdd = () => {
318
 
312
 
319
 const handleUpdate = async (row) => {
313
 const handleUpdate = async (row) => {
320
   reset()
314
   reset()
321
-  const id = row.id || ids.value[0]
322
-  const res = await getContractExpirationLedger(id)
315
+  const res = await getContractExpirationLedger(row.id)
323
   form.value = res.data || {}
316
   form.value = res.data || {}
324
   open.value = true
317
   open.value = true
325
   title.value = '修改合同到期信息'
318
   title.value = '修改合同到期信息'
326
 }
319
 }
327
 
320
 
328
 const handleDelete = (row) => {
321
 const handleDelete = (row) => {
329
-  const deleteIds = row.id || ids.value
330
-  proxy.$modal.confirm('是否确认删除合同到期信息编号为"' + deleteIds + '"的数据项?').then(() => {
331
-    return delContractExpirationLedger(deleteIds)
322
+  proxy.$modal.confirm('是否确认删除合同到期信息编号为"' + row.id + '"的数据项?').then(() => {
323
+    return delContractExpirationLedger(row.id)
332
   }).then(() => {
324
   }).then(() => {
333
     getList()
325
     getList()
334
     proxy.$modal.msgSuccess('删除成功')
326
     proxy.$modal.msgSuccess('删除成功')

+ 10 - 19
src/views/ledgerManage/qualificationSummary/index.vue

@@ -33,15 +33,11 @@
33
 
33
 
34
     <div class="operation-container">
34
     <div class="operation-container">
35
       <el-button type="primary" plain icon="Plus" @click="handleAdd">新增</el-button>
35
       <el-button type="primary" plain icon="Plus" @click="handleAdd">新增</el-button>
36
-      <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate">修改</el-button>
37
-      <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete">删除</el-button>
38
       <el-button type="info" plain icon="Upload" @click="handleImport">导入</el-button>
36
       <el-button type="info" plain icon="Upload" @click="handleImport">导入</el-button>
39
       <el-button type="warning" plain icon="Download" @click="handleExport">导出</el-button>
37
       <el-button type="warning" plain icon="Download" @click="handleExport">导出</el-button>
40
     </div>
38
     </div>
41
 
39
 
42
-    <el-table v-loading="loading" :data="list" border fit highlight-current-row style="width: 100%; margin-top: 20px;"
43
-      @selection-change="handleSelectionChange">
44
-      <el-table-column type="selection" width="55" align="center" />
40
+    <el-table v-loading="loading" :data="list" border fit highlight-current-row style="width: 100%; margin-top: 20px;">
45
       <el-table-column label="序号" type="index" width="60" align="center">
41
       <el-table-column label="序号" type="index" width="60" align="center">
46
         <template #default="scope">
42
         <template #default="scope">
47
           {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
43
           {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
@@ -69,6 +65,12 @@
69
           </span>
65
           </span>
70
         </template>
66
         </template>
71
       </el-table-column>
67
       </el-table-column>
68
+      <el-table-column label="操作" align="center" width="150" fixed="right">
69
+        <template #default="scope">
70
+          <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button>
71
+          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
72
+        </template>
73
+      </el-table-column>
72
     </el-table>
74
     </el-table>
73
 
75
 
74
     <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
76
     <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
@@ -183,9 +185,6 @@ const total = ref(0)
183
 const list = ref([])
185
 const list = ref([])
184
 const queryFormRef = ref(null)
186
 const queryFormRef = ref(null)
185
 const formRef = ref(null)
187
 const formRef = ref(null)
186
-const ids = ref([])
187
-const single = ref(true)
188
-const multiple = ref(true)
189
 
188
 
190
 const queryParams = reactive({
189
 const queryParams = reactive({
191
   pageNum: 1,
190
   pageNum: 1,
@@ -265,12 +264,6 @@ const resetQuery = () => {
265
   handleQuery()
264
   handleQuery()
266
 }
265
 }
267
 
266
 
268
-const handleSelectionChange = (selection) => {
269
-  ids.value = selection.map(item => item.id)
270
-  single.value = selection.length !== 1
271
-  multiple.value = !selection.length
272
-}
273
-
274
 const handleAdd = () => {
267
 const handleAdd = () => {
275
   reset()
268
   reset()
276
   open.value = true
269
   open.value = true
@@ -279,17 +272,15 @@ const handleAdd = () => {
279
 
272
 
280
 const handleUpdate = async (row) => {
273
 const handleUpdate = async (row) => {
281
   reset()
274
   reset()
282
-  const id = row.id || ids.value[0]
283
-  const res = await getQualificationSummary(id)
275
+  const res = await getQualificationSummary(row.id)
284
   form.value = res.data || {}
276
   form.value = res.data || {}
285
   open.value = true
277
   open.value = true
286
   title.value = '修改证书信息'
278
   title.value = '修改证书信息'
287
 }
279
 }
288
 
280
 
289
 const handleDelete = (row) => {
281
 const handleDelete = (row) => {
290
-  const deleteIds = row.id || ids.value
291
-  proxy.$modal.confirm('是否确认删除证书信息编号为"' + deleteIds + '"的数据项?').then(() => {
292
-    return delQualificationSummary(deleteIds)
282
+  proxy.$modal.confirm('是否确认删除证书信息编号为"' + row.id + '"的数据项?').then(() => {
283
+    return delQualificationSummary(row.id)
293
   }).then(() => {
284
   }).then(() => {
294
     getList()
285
     getList()
295
     proxy.$modal.msgSuccess('删除成功')
286
     proxy.$modal.msgSuccess('删除成功')

+ 10 - 19
src/views/performanceManage/exemptEvaluation/index.vue

@@ -24,15 +24,11 @@
24
 
24
 
25
     <div class="operation-container">
25
     <div class="operation-container">
26
       <el-button type="primary" plain icon="Plus" @click="handleAdd">新增</el-button>
26
       <el-button type="primary" plain icon="Plus" @click="handleAdd">新增</el-button>
27
-      <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate">修改</el-button>
28
-      <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete">删除</el-button>
29
       <el-button type="info" plain icon="Upload" @click="handleImport">导入</el-button>
27
       <el-button type="info" plain icon="Upload" @click="handleImport">导入</el-button>
30
       <el-button type="warning" plain icon="Download" @click="handleExport">导出</el-button>
28
       <el-button type="warning" plain icon="Download" @click="handleExport">导出</el-button>
31
     </div>
29
     </div>
32
 
30
 
33
-    <el-table v-loading="loading" :data="list" border fit highlight-current-row style="width: 100%; margin-top: 20px;"
34
-      @selection-change="handleSelectionChange">
35
-      <el-table-column type="selection" width="55" align="center" />
31
+    <el-table v-loading="loading" :data="list" border fit highlight-current-row style="width: 100%; margin-top: 20px;">
36
       <el-table-column label="序号" type="index" width="60" align="center">
32
       <el-table-column label="序号" type="index" width="60" align="center">
37
         <template #default="scope">
33
         <template #default="scope">
38
           {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
34
           {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
@@ -41,6 +37,12 @@
41
       <el-table-column label="年度月份" prop="yearAndMonth" align="center" min-width="150" />
37
       <el-table-column label="年度月份" prop="yearAndMonth" align="center" min-width="150" />
42
       <el-table-column label="姓名" prop="userName" align="center" min-width="120" />
38
       <el-table-column label="姓名" prop="userName" align="center" min-width="120" />
43
       <el-table-column label="不参加考核原因" prop="reason" align="center" min-width="200" show-overflow-tooltip />
39
       <el-table-column label="不参加考核原因" prop="reason" align="center" min-width="200" show-overflow-tooltip />
40
+      <el-table-column label="操作" align="center" width="150" fixed="right">
41
+        <template #default="scope">
42
+          <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button>
43
+          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
44
+        </template>
45
+      </el-table-column>
44
     </el-table>
46
     </el-table>
45
 
47
 
46
     <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
48
     <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
@@ -114,9 +116,6 @@ const total = ref(0)
114
 const list = ref([])
116
 const list = ref([])
115
 const queryFormRef = ref(null)
117
 const queryFormRef = ref(null)
116
 const formRef = ref(null)
118
 const formRef = ref(null)
117
-const ids = ref([])
118
-const single = ref(true)
119
-const multiple = ref(true)
120
 const open = ref(false)
119
 const open = ref(false)
121
 const title = ref('')
120
 const title = ref('')
122
 
121
 
@@ -190,12 +189,6 @@ const resetQuery = () => {
190
   handleQuery()
189
   handleQuery()
191
 }
190
 }
192
 
191
 
193
-const handleSelectionChange = (selection) => {
194
-  ids.value = selection.map(item => item.id)
195
-  single.value = selection.length !== 1
196
-  multiple.value = !selection.length
197
-}
198
-
199
 const handleAdd = () => {
192
 const handleAdd = () => {
200
   reset()
193
   reset()
201
   open.value = true
194
   open.value = true
@@ -204,17 +197,15 @@ const handleAdd = () => {
204
 
197
 
205
 const handleUpdate = async (row) => {
198
 const handleUpdate = async (row) => {
206
   reset()
199
   reset()
207
-  const id = row.id || ids.value[0]
208
-  const res = await getExemptEvaluation(id)
200
+  const res = await getExemptEvaluation(row.id)
209
   form.value = res.data || {}
201
   form.value = res.data || {}
210
   open.value = true
202
   open.value = true
211
   title.value = '修改不参加绩效考核人员'
203
   title.value = '修改不参加绩效考核人员'
212
 }
204
 }
213
 
205
 
214
 const handleDelete = (row) => {
206
 const handleDelete = (row) => {
215
-  const deleteIds = row.id || ids.value
216
-  proxy.$modal.confirm('是否确认删除不参加绩效考核人员编号为"' + deleteIds + '"的数据项?').then(() => {
217
-    return delExemptEvaluation(deleteIds)
207
+  proxy.$modal.confirm('是否确认删除不参加绩效考核人员编号为"' + row.id + '"的数据项?').then(() => {
208
+    return delExemptEvaluation(row.id)
218
   }).then(() => {
209
   }).then(() => {
219
     getList()
210
     getList()
220
     proxy.$modal.msgSuccess('删除成功')
211
     proxy.$modal.msgSuccess('删除成功')