|
|
@@ -11,6 +11,7 @@
|
|
|
<!-- 搜索区域 -->
|
|
|
<div class="search-area">
|
|
|
<seek-page
|
|
|
+ ref="seekPage"
|
|
|
:seekList="seekList"
|
|
|
@search="handleSearch"
|
|
|
:formLength="4"
|
|
|
@@ -19,15 +20,20 @@
|
|
|
|
|
|
<!-- 列表视图 -->
|
|
|
<div class="list-view">
|
|
|
+ <!--
|
|
|
+ v-if="work.id":el-dialog 首次打开才会渲染弹窗内容,表格也是此时才挂载。
|
|
|
+ 表格挂载后由自身 mounted 触发首次加载,避免首次打开时 $refs.table 还不存在而不发请求。
|
|
|
+ -->
|
|
|
<ele-pro-table
|
|
|
+ v-if="work.id"
|
|
|
ref="table"
|
|
|
row-key="id"
|
|
|
:columns="columns"
|
|
|
:datasource="datasource"
|
|
|
:cache-key="cacheKeyUrl"
|
|
|
max-height="500px"
|
|
|
- :initLoad="false"
|
|
|
@columns-change="handleColumnChange"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
>
|
|
|
<template v-slot:toolbar>
|
|
|
<div class="toolbar-left">
|
|
|
@@ -38,6 +44,17 @@
|
|
|
@click="handleAdd"
|
|
|
>申请作业票</el-button
|
|
|
>
|
|
|
+ <el-button
|
|
|
+ type="danger"
|
|
|
+ size="small"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ :disabled="!selectedRows.length"
|
|
|
+ @click="handleBatchDelete"
|
|
|
+ >批量删除</el-button
|
|
|
+ >
|
|
|
+ <span class="toolbar-tip"
|
|
|
+ >仅草稿(待提交)状态的作业票可删除</span
|
|
|
+ >
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:workType="{ row }">
|
|
|
@@ -61,7 +78,7 @@
|
|
|
</ele-pro-table>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <add ref="addRef" @reload="$refs.table.reload()"> </add>
|
|
|
+ <add ref="addRef" @reload="reloadTable"> </add>
|
|
|
</ele-modal>
|
|
|
</template>
|
|
|
|
|
|
@@ -80,6 +97,10 @@
|
|
|
4: '已驳回'
|
|
|
};
|
|
|
|
|
|
+ // 草稿(待提交)状态,只有该状态的作业票允许删除
|
|
|
+ const DRAFT_STATUS = 1;
|
|
|
+ const DELETE_TIP = '仅草稿(待提交)状态的作业票可以删除';
|
|
|
+
|
|
|
export default {
|
|
|
mixins: [tabMixins, dictMixins],
|
|
|
components: { add },
|
|
|
@@ -88,7 +109,18 @@
|
|
|
visible: false,
|
|
|
// 所属的危险作业
|
|
|
work: {},
|
|
|
+ // 表格选中的作业票
|
|
|
+ selectedRows: [],
|
|
|
columns: [
|
|
|
+ {
|
|
|
+ columnKey: 'selection',
|
|
|
+ type: 'selection',
|
|
|
+ width: 50,
|
|
|
+ align: 'center',
|
|
|
+ fixed: 'left',
|
|
|
+ // 只有草稿(待提交)状态的作业票允许勾选,避免误删已提交的票
|
|
|
+ selectable: (row) => this.isDraft(row)
|
|
|
+ },
|
|
|
{
|
|
|
columnKey: 'index',
|
|
|
label: '序号',
|
|
|
@@ -209,6 +241,8 @@
|
|
|
work: {
|
|
|
immediate: true,
|
|
|
handler(val) {
|
|
|
+ // 首次打开弹窗时表格尚未挂载(el-dialog 懒渲染),由表格自身 mounted 触发加载;
|
|
|
+ // 这里只处理弹窗已打开、切换所属危险作业的场景
|
|
|
if (val?.id && this.$refs.table) {
|
|
|
this.$refs.table.reload({ page: 1 });
|
|
|
}
|
|
|
@@ -220,6 +254,8 @@
|
|
|
// 打开弹窗,work 可以是危险作业对象或危险作业id
|
|
|
open(work) {
|
|
|
this.work = work && work.id ? work : { id: work };
|
|
|
+ // 重置上一次打开时残留的查询条件,保证界面条件与本次请求参数一致
|
|
|
+ this.$refs.seekPage?.reset();
|
|
|
this.visible = true;
|
|
|
},
|
|
|
handleAdd() {
|
|
|
@@ -231,7 +267,12 @@
|
|
|
},
|
|
|
|
|
|
handleSearch(where) {
|
|
|
- this.$refs.table.reload({ page: 1, where });
|
|
|
+ this.reloadTable({ page: 1, where });
|
|
|
+ },
|
|
|
+
|
|
|
+ // 表格可能尚未挂载(弹窗首次打开时),此处统一做存在性判断
|
|
|
+ reloadTable(option) {
|
|
|
+ this.$refs.table && this.$refs.table.reload(option);
|
|
|
},
|
|
|
|
|
|
// 作业类型名称
|
|
|
@@ -253,7 +294,11 @@
|
|
|
},
|
|
|
|
|
|
handleDelete(row) {
|
|
|
- this.$confirm('确认删除吗?', '提示', {
|
|
|
+ if (!this.isDraft(row)) {
|
|
|
+ this.$message.warning(DELETE_TIP);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.$confirm('确认删除该草稿作业票吗?删除后不可恢复。', '提示', {
|
|
|
confirmButtonText: '确定',
|
|
|
cancelButtonText: '取消',
|
|
|
type: 'warning'
|
|
|
@@ -261,12 +306,59 @@
|
|
|
.then(() => {
|
|
|
ticketRemove([row.id]).then(() => {
|
|
|
this.$message.success('删除成功');
|
|
|
- this.$refs.table.reload();
|
|
|
+ this.clearSelection();
|
|
|
+ this.reloadTable();
|
|
|
});
|
|
|
})
|
|
|
.catch(() => {});
|
|
|
},
|
|
|
|
|
|
+ // 批量删除:仅允许删除草稿(待提交)状态的作业票
|
|
|
+ handleBatchDelete() {
|
|
|
+ const rows = this.selectedRows || [];
|
|
|
+ if (!rows.length) {
|
|
|
+ this.$message.warning('请至少选择一条数据');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (rows.some((row) => !this.isDraft(row))) {
|
|
|
+ this.$message.warning(DELETE_TIP);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.$confirm(
|
|
|
+ `确认删除选中的 ${rows.length} 条草稿作业票吗?删除后不可恢复。`,
|
|
|
+ '提示',
|
|
|
+ {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }
|
|
|
+ )
|
|
|
+ .then(() => {
|
|
|
+ ticketRemove(rows.map((row) => row.id)).then(() => {
|
|
|
+ this.$message.success('删除成功');
|
|
|
+ this.clearSelection();
|
|
|
+ this.reloadTable();
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
+ },
|
|
|
+
|
|
|
+ // 是否草稿(待提交)状态,只有该状态允许删除
|
|
|
+ isDraft(row) {
|
|
|
+ return Number(row?.status) === DRAFT_STATUS;
|
|
|
+ },
|
|
|
+
|
|
|
+ // 多选
|
|
|
+ handleSelectionChange(rows) {
|
|
|
+ this.selectedRows = rows || [];
|
|
|
+ },
|
|
|
+
|
|
|
+ // 清空选中项
|
|
|
+ clearSelection() {
|
|
|
+ this.selectedRows = [];
|
|
|
+ this.$refs.table && this.$refs.table.clearSelection();
|
|
|
+ },
|
|
|
+
|
|
|
async datasource({ page, limit, where }) {
|
|
|
const body = {
|
|
|
...where,
|
|
|
@@ -316,4 +408,11 @@
|
|
|
font-size: 12px;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ .toolbar-tip {
|
|
|
+ margin-left: 12px;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #909399;
|
|
|
+ line-height: 32px;
|
|
|
+ }
|
|
|
</style>
|