jhprjv2/ruoyi-ui/src/views/trouble/pshProblemmodify/index.vue

681 lines
21 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="项目名称" prop="problemArea">
<el-input
v-model="queryParams.problemArea"
placeholder="请输入项目名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="提交用户" prop="createUser">
<el-input
v-model="queryParams.createUser"
placeholder="请输入提交用户手机号"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="隐患描述" prop="workParts">
<el-input
v-model="queryParams.workParts"
placeholder="请输入隐患描述"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="隐患类型" prop="dangerType">
<el-select v-model="queryParams.dangerType" placeholder="隐患类型" clearable>
<el-option
v-for="dict in dict.type.ssp_aqyhlx"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="提交时间">
<el-date-picker
v-model="daterangeMarksTime"
style="width: 240px"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item
label="责任主体"
prop="projectDeptId"
v-hasPermi="['project:project:zgs']"
>
<el-select
v-model="queryParams.projectDeptId"
placeholder="请选择责任主体"
clearable
>
<el-option
v-for="dict in depts"
:key="dict.deptId"
:label="dict.deptName"
:value="dict.deptId"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- <el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['trouble:sspProblemmodify:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['trouble:sspProblemmodify:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['trouble:sspProblemmodify:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['trouble:sspProblemmodify:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>-->
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane :label="tabs.all" name="all"></el-tab-pane>
<el-tab-pane :label="tabs.dzg" name="dzg"></el-tab-pane>
<el-tab-pane :label="tabs.dqr" name="dqr"></el-tab-pane>
<el-tab-pane :label="tabs.ycl" name="ycl"></el-tab-pane>
<el-tab-pane :label="tabs.zgcs" name="zgcs"></el-tab-pane>
<el-table
v-loading="loading"
:data="sspProblemmodifyList"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="40" align="center" v-if="false" />
<el-table-column
label="项目名称"
align="center"
prop="problemArea"
width="200"
show-overflow-tooltip
/>
<el-table-column label="隐患图片" align="center" property="path" width="220">
<template slot-scope="scope">
<el-image
ref="preview"
style="width: 200px; height: 100px"
:src="scope.row.marksPicture + '.min.jpg'"
@click="onPreview(scope.row.smarkUrl)"
>
</el-image>
</template>
</el-table-column>
<el-table-column label="隐患类型" align="center" prop="dangerType">
<template slot-scope="scope">
<dict-tag :options="dict.type.ssp_aqyhlx" :value="scope.row.dangerType" />
</template>
</el-table-column>
<el-table-column
label="隐患描述"
align="center"
prop="workParts"
width="100"
show-overflow-tooltip
/>
<el-table-column
label="整改要求"
align="center"
prop="changeInfo"
width="200"
show-overflow-tooltip
/>
<el-table-column
label="整改截至时间"
align="center"
prop="nickedTime"
width="135"
>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.nickedTime, "{y}-{m}-{d}") }}</span>
</template>
</el-table-column>
<el-table-column
label="隐患整改人"
align="left"
width="120"
show-overflow-tooltip
>
<template slot-scope="scope">
<div>{{ scope.row.lordSent }}</div>
<div>{{ scope.row.lordSentUser }}</div>
</template>
</el-table-column>
<el-table-column label="流程状态" align="center" prop="checkState">
<template slot-scope="scope">
<dict-tag
:options="dict.type.smz_ssp_checkstate"
:value="scope.row.checkState"
/>
</template>
</el-table-column>
<el-table-column label="复检人" align="left" width="120" show-overflow-tooltip>
<template slot-scope="scope">
<div>{{ scope.row.recheckSend }}</div>
<div>{{ scope.row.recheckSendUser }}</div>
</template>
</el-table-column>
<el-table-column
label="抄送人"
align="left"
prop="copySend"
width="120"
show-overflow-tooltip
>
<template slot-scope="scope">
<div>{{ scope.row.copySend }}</div>
<div>{{ scope.row.copySendUser }}</div>
</template>
</el-table-column>
<el-table-column
label="提交用户"
align="left"
prop="createUser"
width="120"
show-overflow-tooltip
>
<template slot-scope="scope">
<div>{{ scope.row.createBy }}</div>
<div>{{ scope.row.createUser }}</div>
</template>
</el-table-column>
<el-table-column label="提交时间" align="center" prop="createTime" width="100">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d} {h}:{i}") }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
width="100"
fixed="right"
>
<template slot-scope="scope">
<!-- <el-button v-if="scope.row.marksVideo != null && scope.row.marksVideo != ''"
size="mini"
type="text"
icon="el-icon-video-play"
@click="handlePlay(scope.row)"
v-hasPermi="['trouble:sspMarks:query']"
>视频</el-button> -->
<!-- <el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['trouble:sspProblemmodify:edit']"
>修改</el-button> -->
<el-button
size="mini"
type="text"
icon="el-icon-notebook-2"
@click="handleLog(scope.row)"
v-hasPermi="['trouble:sspProblemmodify:query']"
>整改日志</el-button
>
<el-button
v-if="scope.row.vDel == '0'"
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['work:sspProblemmodify:remove']"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</el-tabs>
<!-- 添加或修改安全整改对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="项目id" prop="projectId">
<el-input v-model="form.projectId" placeholder="请输入项目id" />
</el-form-item>
<el-form-item label="拍摄位置" prop="problemArea">
<el-input v-model="form.problemArea" placeholder="请输入拍摄位置" />
</el-form-item>
<el-form-item label="隐患描述" prop="workParts">
<el-input v-model="form.workParts" placeholder="请输入隐患描述" />
</el-form-item>
<el-form-item label="整改要求" prop="changeInfo">
<el-input v-model="form.changeInfo" placeholder="请输入整改要求" />
</el-form-item>
<el-form-item label="主送人姓名" prop="lordSent">
<el-input v-model="form.lordSent" placeholder="请输入主送人姓名" />
</el-form-item>
<el-form-item label="主送人手机号" prop="lordSentUser">
<el-input v-model="form.lordSentUser" placeholder="请输入主送人手机号" />
</el-form-item>
<el-form-item label="抄送人姓名" prop="copySend">
<el-input v-model="form.copySend" placeholder="请输入抄送人姓名" />
</el-form-item>
<el-form-item label="抄送人手机号" prop="copySendUser">
<el-input v-model="form.copySendUser" placeholder="请输入抄送人手机号" />
</el-form-item>
<el-form-item label="流程状态" prop="checkState">
<el-input v-model="form.checkState" placeholder="请输入流程状态" />
</el-form-item>
<el-form-item label="留痕定位" prop="nickedArea">
<el-input v-model="form.nickedArea" placeholder="请输入留痕定位" />
</el-form-item>
<el-form-item label="留痕时间" prop="nickedTime">
<el-date-picker
clearable
v-model="form.nickedTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择留痕时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="工序名称" prop="processName">
<el-input v-model="form.processName" placeholder="请输入工序名称" />
</el-form-item>
<el-form-item label="工程名称" prop="projectName">
<el-input v-model="form.projectName" placeholder="请输入工程名称" />
</el-form-item>
<el-form-item label="留痕说明" prop="nickedInfo">
<el-input v-model="form.nickedInfo" placeholder="请输入留痕说明" />
</el-form-item>
<el-form-item label="审核人" prop="checkUser">
<el-input v-model="form.checkUser" placeholder="请输入审核人" />
</el-form-item>
<el-form-item label="审核人手机号" prop="checkUserPhone">
<el-input v-model="form.checkUserPhone" placeholder="请输入审核人手机号" />
</el-form-item>
<el-form-item label="删除状态" prop="isDel">
<el-input v-model="form.isDel" placeholder="请输入删除状态" />
</el-form-item>
<el-form-item label="创建人" prop="createUser">
<el-input v-model="form.createUser" placeholder="请输入创建人" />
</el-form-item>
<el-form-item label="修改人" prop="updateUser">
<el-input v-model="form.updateUser" placeholder="请输入修改人" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<el-image-viewer v-if="showViewer" :on-close="closeViewer" :url-list="srcList" />
<sspProblemmodifyAuditinfoDrawer
size="40%"
:visible.sync="sspProblemmodifyAuditinfoDrawerVisible"
:form-data="formData"
/>
<el-dialog
title="视频播放"
:visible.sync="openVideo"
width="980px"
:before-close="cancelVideo"
append-to-body
>
<video
ref="video"
:src="videoSrc"
controls="controls"
autoplay="autoplay"
poster="../../../assets/images/video_loading.gif"
style="max-height: 550px"
/>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelVideo"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
listSspProblemmodify,
getSspProblemmodify,
delSspProblemmodify,
addSspProblemmodify,
updateSspProblemmodify,
findGroupCount,
} from "@/api/trouble/sspProblemmodify";
import ElImageViewer from "element-ui/packages/image/src/image-viewer";
import sspProblemmodifyAuditinfoDrawer from "../sspProblemmodify/sspProblemmodifyAuditinfoDrawer.vue";
export default {
name: "SspProblemmodify",
components: {
sspProblemmodifyAuditinfoDrawer,
ElImageViewer,
},
dicts: ["ssp_aqyhlx", "sys_common_isdel", "smz_ssp_checkstate"],
data() {
return {
showViewer: false,
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 安全整改表格数据
sspProblemmodifyList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
openVideo: false,
videoSrc: null,
// 更新时间时间范围
daterangeMarksTime: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
activeName: null,
projectId: null,
infoType: 0,
problemArea: null,
workParts: null,
changeInfo: null,
lordSent: null,
lordSentUser: null,
copySend: null,
copySendUser: null,
checkState: null,
nickedArea: null,
nickedTime: null,
projectType: null,
processName: null,
projectName: null,
nickedInfo: null,
checkUser: null,
checkUserPhone: null,
isDel: null,
dangerType: null,
createUser: null,
createTime: null,
updateUser: null,
updateTime: null,
projectDeptId: null,
},
depts: null,
// 表单参数
form: {},
// 表单校验
rules: {},
srcList: [],
activeName: "dzg",
sspProblemmodifyAuditinfoDrawerVisible: false,
formData: {
problemmodifyId: null,
},
tabs: {
all: "全部数据0",
dzg: "待整改0",
dqr: "待复检0",
ycl: "整改完成0",
zgcs: "整改超时0",
},
};
},
created() {
this.queryParams.activeName = this.activeName;
this.getList();
this.$api.publics.getZgsDeptList().then((d) => {
this.depts = d?.data || [];
});
},
methods: {
onPreview(urls) {
var arrayurls = urls.split(",");
this.srcList = [];
arrayurls.forEach((v, i) => {
this.srcList.push(v);
});
this.showViewer = true;
},
closeViewer() {
this.showViewer = false;
},
/** 查询安全整改列表 */
getList() {
this.loading = true;
this.queryParams.params = {};
if (null != this.daterangeMarksTime && "" != this.daterangeMarksTime) {
this.queryParams.params["beginMarksTime"] = this.daterangeMarksTime[0];
this.queryParams.params["endMarksTime"] = this.daterangeMarksTime[1];
}
this.queryGroupCount();
listSspProblemmodify(this.queryParams).then((response) => {
this.sspProblemmodifyList = response.rows;
this.total = response.total;
this.loading = false;
});
},
queryGroupCount() {
findGroupCount(this.queryParams).then((response) => {
if (response && response.data) {
let sum = 0;
this.tabs.dzg = "待整改0";
if (response.data.check0) {
sum += response.data.check0;
this.tabs.dzg = "待整改(" + response.data.check0 + "";
}
this.tabs.dqr = "待复检0";
if (response.data.check1) {
sum += response.data.check1;
this.tabs.dqr = "待复检(" + response.data.check1 + "";
}
this.tabs.ycl = "整改完成0";
if (response.data.check4) {
sum += response.data.check4;
this.tabs.ycl = "整改完成(" + response.data.check4 + "";
}
this.tabs.all = "全部数据(" + sum + "";
this.tabs.zgcs = "整改超时0";
if (response.data.check99) {
this.tabs.zgcs = "整改超时(" + response.data.check99 + "";
}
}
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 取消按钮
cancelVideo() {
this.videoSrc = null;
this.$refs.video.pause();
this.openVideo = false;
},
// 表单重置
reset() {
this.form = {
id: null,
projectId: null,
infoType: null,
problemArea: null,
workParts: null,
changeInfo: null,
lordSent: null,
lordSentUser: null,
copySend: null,
copySendUser: null,
checkState: null,
nickedArea: null,
nickedTime: null,
projectType: null,
processName: null,
projectName: null,
nickedInfo: null,
checkUser: null,
checkUserPhone: null,
isDel: null,
createUser: null,
createTime: null,
updateUser: null,
updateTime: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.daterangeMarksTime = [];
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加安全整改";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
getSspProblemmodify(id).then((response) => {
this.form = response.data;
this.open = true;
this.title = "修改安全整改";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateSspProblemmodify(this.form).then((response) => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addSspProblemmodify(this.form).then((response) => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
// 页签点击
handleClick() {
this.queryParams.activeName = this.activeName;
this.getList();
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal
.confirm('是否确认删除安全整改编号为"' + ids + '"的数据项?')
.then(function () {
return delSspProblemmodify(ids);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
},
handleLog(row) {
this.formData.problemmodifyId = row.id;
this.sspProblemmodifyAuditinfoDrawerVisible = true;
},
/** 导出按钮操作 */
handleExport() {
this.download(
"trouble/sspProblemmodify/export",
{
...this.queryParams,
},
`sspProblemmodify_${new Date().getTime()}.xlsx`
);
},
},
};
</script>