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

650 lines
24 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="projectId">
<el-select v-model="queryParams.projectId" placeholder="请选择所属项目" filterable clearable>
<el-option v-for="(item, index) in projectOptions" :key="index" :label="item.projectName" :value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="隐患分类" prop="roleTypes">
<el-select v-model="queryParams.roleTypes" multiple placeholder="请选择隐患分类" clearable collapse-tags>
<el-option v-for="dict in roleTypeOpts" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</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_zlyhlx" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="整改用户" prop="lordSent">
<el-input v-model="queryParams.lordSent" placeholder="请输入整改人姓名/联系方式" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="提交用户" prop="createBy">
<el-input v-model="queryParams.createBy" placeholder="请输入提交人姓名/联系方式" clearable
@keyup.enter.native="handleQuery" />
</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 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>
<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-button icon="el-icon-download" size="mini" v-hasPermi="['trouble:sspProblemmodify:export']"
@click="handleExport">导出</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 type="card" 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" stripe>
<el-table-column type="selection" width="40" align="center" v-if="false" />
<el-table-column label="项目名称" align="center" prop="problemArea" width="200" fixed="left"
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_zlyhlx" :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>
<div>
<el-tag v-if="scope.row.zgDeptType == '1'" size="small">
集团公司
</el-tag>
<el-tag v-if="scope.row.zgDeptType == '11'" size="small">
子公司
</el-tag>
<el-tag v-if="scope.row.zgDeptType == '2'" size="small">
总包单位
</el-tag>
<el-tag v-if="scope.row.zgDeptType == '3'" size="small">
分包单位
</el-tag>
<el-tag v-if="scope.row.zgDeptType == '4'" size="small">
监理单位
</el-tag>
</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>
<div>
<el-tag v-if="scope.row.fjDeptType == '1'" size="small" effect="plain">
集团公司
</el-tag>
<el-tag v-if="scope.row.fjDeptType == '11'" size="small" effect="plain">
子公司
</el-tag>
<el-tag v-if="scope.row.fjDeptType == '2'" size="small" effect="plain">
总包单位
</el-tag>
<el-tag v-if="scope.row.fjDeptType == '3'" size="small" effect="plain">
分包单位
</el-tag>
<el-tag v-if="scope.row.fjDeptType == '4'" size="small" effect="plain">
监理单位
</el-tag>
</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" fixed="right" width="120">
<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 v-if="getIsModify(scope.row)" size="mini" type="text" icon="el-icon-check"
@click="handleModify(scope.row)" v-hasPermi="['trouble:sspProblemmodify:edit']">处理</el-button>
<el-button size="mini" type="text" icon="el-icon-notebook-2" @click="handleDetail(scope.row)"
v-hasPermi="['trouble:sspProblemmodify:query']">详情</el-button>
<el-button v-if="getIsVdel(scope.row)" 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 :close-on-click-modal="false"
:close-on-press-escape="false">
<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 ref="sspProblemmodifyAuditinfoDrawer" />
<modifyProblemDrawer ref="modifyProblemDrawer" :closeCallBack="getList" />
<el-dialog title="视频播放" :visible.sync="openVideo" width="980px" :before-close="cancelVideo"
:close-on-click-modal="false" :close-on-press-escape="false" 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 "./sspProblemmodifyAuditinfoDrawer.vue";
import modifyProblemDrawer from "./modifyProblemDrawer.vue";
export default {
name: "SspProblemmodify",
components: {
ElImageViewer,
modifyProblemDrawer,
sspProblemmodifyAuditinfoDrawer,
},
dicts: ["ssp_zlyhlx", "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: 1,
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,
createBy: null,
createUser: null,
createTime: null,
updateUser: null,
updateTime: null,
roleTypes: [],
projectDeptId: null,
},
depts: null,
// 表单参数
form: {},
// 表单校验
rules: {},
srcList: [],
activeName: "dzg",
tabs: {
all: "全部数据0",
dzg: "待整改0",
dqr: "待复检0",
ycl: "整改完成0",
zgcs: "整改超时0",
},
roleTypeOpts: [
{ label: "集团", value: 3 },
{ label: "子公司", value: 4 },
{ label: "甲方代表", value: 5 },
{ label: "监理单位", value: 6 },
{ label: "总包单位", value: 7 },
],
myMinRoles: [],
projectOptions: [],
isAdmin: false,
nowUser: "",
};
},
created() {
this.nowUser = this.$store.getters.name;
this.myMinRoles = this.$store.getters.roles;
if (
this.myMinRoles.includes("admin") ||
this.myMinRoles.includes("super")
) {
this.isAdmin = true;
}
this.queryParams.activeName = this.activeName;
this.getList();
this.$api.publics.getZgsDeptList().then((d) => {
this.depts = d?.data || [];
});
this.$api.publics.getMyProjectList({}).then((response) => {
this.projectOptions = response.rows;
});
},
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";
let chk03 = 0;
if (response.data.check0) {
chk03 += response.data.check0;
}
if (response.data.check3) {
chk03 += response.data.check3;
}
if (chk03) {
sum += chk03;
this.tabs.dzg = "待整改(" + chk03 + "";
}
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.queryParams.roleTypes = [];
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) {
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(() => { });
},
/** 查看详情 */
handleDetail(row) {
this.$refs.sspProblemmodifyAuditinfoDrawer.show(row);
},
/** 导出按钮操作 */
handleExport() {
this.download(
"trouble/sspProblemmodify/export",
{
...this.queryParams,
},
`质量整改_${new Date().getTime()}.xlsx`
);
},
/** 是否可处理 */
getIsModify(row) {
if (row.checkState == 0 || row.checkState == 3) {
if (this.isAdmin || this.nowUser == row.lordSentUser) {
return true;
} else {
return false;
}
} else if (row.checkState == 1) {
if (this.isAdmin || this.nowUser == row.recheckSendUser) {
return true;
} else {
return false;
}
} else {
return false;
}
},
/** 处理操作 */
handleModify(row) {
this.$refs.modifyProblemDrawer.show(row);
},
/** 是否可删除 */
getIsVdel(row) {
if (this.isAdmin) {
return true;
} else if (this.nowUser == row.createUser && row.checkState != 4) {
return true;
} else {
return false;
}
},
},
};
</script>