jhprjv2/ruoyi-ui/src/views/project/projectChecking/projectCheckingDrawer.vue

644 lines
20 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="projectect-attendance-drawer">
<el-drawer
v-if="isOpen"
:visible.sync="isOpen"
direction="rtl"
size="65%"
style="padding-left: 20px"
>
<template slot="title">
<div>{{ title + " 【举牌验收管理】" }}</div>
</template>
<el-tabs
v-model="unitActiveName"
style="margin-left: 20px; margin-right: 20px"
@tab-click="getList"
>
<el-tab-pane
v-for="(it, idx) in nodes"
:label="it.unitName + ''"
:name="it.unitId + ''"
:key="idx"
></el-tab-pane>
</el-tabs>
<el-row
:gutter="10"
class="mb8"
style="margin-left: 20px; margin-top: 10px; margin-right: 20px"
>
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['project:projectChecking: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="['project:projectChecking: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="['project:projectChecking:remove']"
>删除</el-button
>
</el-col> -->
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-tabs
v-model="queryParams.activeName"
@tab-click="getList"
style="margin-left: 25px; margin-right: 25px"
>
<el-tab-pane :label="tabs.all" name="all"></el-tab-pane>
<el-tab-pane :label="tabs.jxz" name="jxz"></el-tab-pane>
<el-tab-pane :label="tabs.ywc" name="ywc"></el-tab-pane>
</el-tabs>
<el-table
v-loading="loading"
:data="projectCheckingList"
@selection-change="handleSelectionChange" stripe
>
<el-table-column label="验收图片" align="center" prop="mainImage" width="80">
<template slot-scope="scope">
<el-image
ref="preview"
style="width: 50px; height: 50px"
:src="getImageUrl(scope.row.mainImage)"
@click="onPreview(scope.row.imageUrls)"
></el-image>
</template>
</el-table-column>
<el-table-column
label="验收工序部位"
align="left"
prop="checkWorkingPosition"
width="220"
show-overflow-tooltip
/>
<el-table-column
label="验收描述"
align="left"
prop="intro"
width="220"
show-overflow-tooltip
/>
<el-table-column
label="质量专员"
align="left"
prop="qualityUser"
width="120"
show-overflow-tooltip
>
<template slot-scope="scope">
<div>{{ scope.row.qualityUserName }}</div>
<div>{{ scope.row.qualityUser }}</div>
</template>
</el-table-column>
<el-table-column
label="监理专员"
align="left"
prop="superviseUser"
width="120"
show-overflow-tooltip
>
<template slot-scope="scope">
<div>{{ scope.row.superviseUserName }}</div>
<div>{{ scope.row.superviseUser }}</div>
</template>
</el-table-column>
<el-table-column
label="验收时间"
align="center"
prop="checkingDate"
width="150"
show-overflow-tooltip
>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.checkingDate, "{y}-{m}-{d} {h}:{i}") }}</span>
</template>
</el-table-column>
<!-- <el-table-column label="验收结果" align="center" prop="checkResult" width="80">
<template slot-scope="scope">
<dict-tag
:options="dict.type.project_checking_result"
:value="scope.row.checkResult"
/>
</template>
</el-table-column> -->
<el-table-column label="审批状态" align="center" prop="approveStatus" width="120">
<template slot-scope="scope">
<dict-tag :options="dict.type.project_check_status" :value="scope.row.approveStatus" />
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
fixed="right"
class-name="small-padding fixed-width"
width="150"
>
<template slot-scope="scope">
<el-button
v-if="scope.row.checkingFiles != null"
size="mini"
type="text"
icon="el-icon-paperclip"
@click="handledownload(scope.row)"
v-hasPermi="['project:projectChecking:list']"
>下载附件</el-button
>
<el-button
v-if="scope.row.approveStatus != null"
size="mini"
type="text"
icon="el-icon-tickets"
@click="handleAuditinfo(scope.row)"
>审批日志</el-button
>
<el-button
v-if="scope.row.approveStatus != '4'"
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['project:projectChecking:edit']"
>修改</el-button
>
<el-button
v-if="scope.row.approveStatus != '4'"
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['project:projectChecking: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-dialog :title="title" :visible.sync="open" width="780px" 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="项目名称" prop="projectName">
<el-input
v-model="form.projectName"
placeholder="请输入项目名称"
:disabled="true"
/>
</el-form-item>
<el-form-item label="单位名称" prop="deptName">
<el-input
v-model="form.deptName"
placeholder="请输入单位名称"
:disabled="true"
/>
</el-form-item>
<el-form-item label="验收图片" prop="imageUrls">
<image-upload v-model="form.imageUrls" :limit="9" />
</el-form-item>
<el-form-item label="质量专员" prop="qualityUser">
<el-select
v-model="form.qualityUser"
placeholder="请选择质量专员"
filterable
style="width: 100%"
@change="selectQualityUser"
>
<el-option-group
v-for="group in deptUserData2"
:key="group.unitId + ''"
:label="group.unitName + ' [' + group.unitTypeName + '] '"
>
<el-option
v-for="item in group.userinfoList"
:key="item.phonenumber"
:label="item.nickName + ' [' + item.jobTypeName + '] '"
:value="item.phonenumber"
>
</el-option>
</el-option-group>
</el-select>
</el-form-item>
<el-form-item label="监理专员" prop="superviseUser">
<el-select
v-model="form.superviseUser"
placeholder="请选择监理专员"
filterable
style="width: 100%"
@change="selectSuperviseUser"
>
<el-option-group
v-for="group in deptUserData"
:key="group.unitId + ''"
:label="group.unitName + ' [' + group.unitTypeName + '] '"
>
<el-option
v-for="item in group.userinfoList"
:key="item.phonenumber"
:label="item.nickName + ' [' + item.jobTypeName + '] '"
:value="item.phonenumber"
>
</el-option>
</el-option-group>
</el-select>
</el-form-item>
<el-form-item label="工序部位" prop="checkWorkingPosition">
<el-input
type="textarea"
v-model="form.checkWorkingPosition"
placeholder="请输入验收工序部位"
/>
</el-form-item>
<el-form-item label="验收描述" prop="intro">
<el-input v-model="form.intro" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="验收时间" prop="checkingDate">
<el-date-picker
style="width: 100%"
v-model="form.checkingDate"
type="datetime"
placeholder="选择日期时间"
default-time="10:00:00"
value-format="yyyy-MM-dd HH:mm:ss"
>
</el-date-picker>
</el-form-item>
<el-form-item label="验收结果" prop="checkResult" v-if="false">
<el-radio
v-model="form.checkResult"
v-for="dict in dict.type.project_checking_result"
:label="dict.value"
:key="dict.value"
border
size="small"
>{{ dict.label }}</el-radio
>
</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-drawer>
<el-image-viewer
v-if="showViewer"
:on-close="closeViewer"
:url-list="previewList"
style="z-index: 2050"
/>
<index-drawer ref="indexDrawer"></index-drawer>
</div>
</template>
<script>
import {
listProjectChecking,
getProjectChecking,
delProjectChecking,
addProjectChecking,
updateProjectChecking,
findGroupCountByApprove,
} from "@/api/project/projectChecking";
import ElImageViewer from "element-ui/packages/image/src/image-viewer";
import indexDrawer from "../projectAuditinfo/indexDrawer.vue";
export default {
name: "RuoyiUiProjectDeptWroksDrawer",
components: {
indexDrawer,
ElImageViewer,
},
dicts: ["project_check_status","project_checking_result"],
data() {
return {
showViewer: false,
open: false,
isOpen: false,
project: null,
title: "",
isUnit: true,
nodes: [],
form: {},
rules: {
imageUrls: [{ required: true, message: "请上传验收图片", trigger: "blur" }],
qualityUser: [{ required: true, message: "请选择质量专员", trigger: "blur" }],
superviseUser: [{ required: true, message: "请选择监理专员", trigger: "blur" }],
checkWorkingPosition: [
{ required: true, message: "请输入验收工序部位", trigger: "blur" },
{ max: 200, message: "验收工序部位最多200字符", trigger: "blur" },
],
intro: [
{ required: true, message: "请输入验收描述", trigger: "blur" },
{ max: 200, message: "验收描述最多200字符", trigger: "blur" },
],
checkingDate: [{ required: true, message: "请选择验收时间", trigger: "blur" }],
checkResult: [{ required: false, message: "请选择验收结果", trigger: "blur" }],
},
projectCheckingList: [],
unitActiveName: "",
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
projectId: null,
deptId: null,
activeName: "jxz",
},
tabs: {
all: "全部数据0",
jxz: "进行中0",
ywc: "已完成0",
},
deptUserData: [],
deptUserData2:[],
previewList: [],
};
},
computed: {},
mounted() {},
methods: {
getImageUrl(url) {
return process.env.VUE_APP_BASE_API + url + ".min.jpg";
},
onPreview(urls) {
this.previewList = [];
urls.split(",").forEach((item) => {
this.previewList.push(process.env.VUE_APP_BASE_API + item);
});
this.showViewer = true;
},
closeViewer() {
this.showViewer = false;
},
show(project) {
this.project = project;
this.title = project.projectName;
this.isOpen = true;
this.tabs.all="全部数据0";
this.tabs.jxz="进行中0";
this.tabs.ywc="已完成0";
this.queryParams.projectId = project.id;
this.$api.publics
.queryUnitList({
projectId: project.id,
unitType: 2
})
.then((d) => {
this.nodes = d.rows;
if (d.rows.length > 0) {
this.unitActiveName = this.nodes[0].unitId + "";
this.isUnit = true;
this.getList();
} else {
this.projectCheckingList = [];
this.$message.error("当前项目未分配总包单位,不能办理举牌验收!");
this.isUnit = false;
}
});
this.$api.publics
.selectProjectUnitUser({
unitType: "4",
projectId: project.id,
})
.then((d) => {
this.deptUserData = d.data;
});
this.$api.publics
.selectProjectUnitUser({
unitType: "2",
projectId: project.id,
})
.then((d) => {
this.deptUserData2 = d.data;
});
},
// 页签点击
getList() {
this.queryParams.deptId = this.unitActiveName;
this.queryCount();
this.loading = true;
listProjectChecking(this.queryParams).then((response) => {
this.projectCheckingList = response.rows;
this.total = response.total;
this.loading = false;
});
},
queryCount() {
findGroupCountByApprove(this.queryParams).then((response) => {
if (response && response.data) {
this.tabs.jxz = "进行中(" + response.data.jxz + "";
this.tabs.ywc = "已完成(" + response.data.ywc + "";
this.tabs.all = "全部数据(" + (response.data.jxz + response.data.ywc) + "";
}
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
projectId: null,
deptId: null,
insuranceType: null,
insuranceNumber: null,
insuranceFile: null,
insuranceState: null,
beginDate: null,
endDate: null,
companyName: null,
isDel: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
if (this.nodes.length > 0) {
this.reset();
this.form.projectId = this.project.id;
this.form.projectName = this.project.projectName;
this.form.deptId = this.unitActiveName;
this.nodes.forEach((item) => {
if (item.unitId == this.unitActiveName) {
this.form.deptName = item.unitName;
}
});
this.open = true;
this.title = "添加项目举牌验收";
} else {
this.$message.error("当前项目未分配总包单位,不能办理举牌验收!");
}
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
getProjectChecking(id).then((response) => {
this.form = response.data;
this.form.projectName = this.project.projectName;
this.nodes.forEach((item) => {
if (item.unitId == this.unitActiveName) {
this.form.deptName = item.unitName;
}
});
this.open = true;
this.title = "修改项目举牌验收";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
this.form.approveStatus="1";
if (this.form.id != null) {
updateProjectChecking(this.form).then((response) => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addProjectChecking(this.form).then((response) => {
if (response.code == 200) {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
}
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal
.confirm('是否确认删除项目举牌验收编号为"' + ids + '"的数据项?')
.then(function () {
return delProjectChecking(ids);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
this.download(
"project/ProjectChecking/export",
{
...this.queryParams,
},
`ProjectChecking_${new Date().getTime()}.xlsx`
);
},
/** 选择质量专员*/
selectQualityUser(val) {
this.deptUserData2.forEach((item) => {
item.userinfoList.forEach((u) => {
if (u.phonenumber == val) {
this.form.qualityUserName = u.nickName + " [" + u.jobTypeName + "] ";
}
});
});
},
/** 选择监理专员*/
selectSuperviseUser(val) {
this.deptUserData.forEach((item) => {
item.userinfoList.forEach((u) => {
if (u.phonenumber == val) {
this.form.superviseUserName = u.nickName + " [" + u.jobTypeName + "] ";
}
});
});
},
/** 下载附件 */
handleDownload(row) {
this.files = row.checkingFiles.split(",");
this.files.forEach((item) => {
this.$download.resource(item);
});
},
/** 审批日志 */
handleAuditinfo(row) {
row.title="举牌验收";
row.logType="3";
this.$refs.indexDrawer.show(row);
}
},
};
</script>