jhprjv2/ruoyi-ui/src/views/project/materialSeal/projectMaterialSealDrawer.vue

693 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="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:materialSeal: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:materialSeal: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:materialSeal: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="projectMaterialSealList"
@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="center"
prop="materialName"
width="250"
>
<template slot-scope="scope">
<div>{{ scope.row.materialName }}</div>
<div>{{ scope.row.usePosition }}</div>
</template>
</el-table-column>
<el-table-column
label="品牌"
align="center"
prop="contractBrand"
width="200"
>
<template slot-scope="scope">
<div>指定:{{ scope.row.contractBrand }}</div>
<div>拟用:{{ scope.row.useBrand }}</div>
</template>
</el-table-column>
<el-table-column label="封样时间" align="center" prop="sealDate" width="120">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.sealDate, "{y}-{m}-{d} {h}:{i}") }}</span>
</template>
</el-table-column>
<el-table-column
label="监理专员"
align="center"
prop="witnessUser"
width="120"
show-overflow-tooltip
>
<template slot-scope="scope">
<div>{{ scope.row.witnessUserName }}</div>
<div>{{ scope.row.witnessUser }}</div>
</template>
</el-table-column>
<!-- <el-table-column label="封样结果" align="center" prop="materialResult">
<template slot-scope="scope">
<dict-tag :options="dict.type.project_checking_result" :value="scope.row.materialResult" />
</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" prop="signFiles" width="100">
<template slot-scope="scope">
<el-button
v-if="scope.row.signFiles != null"
size="mini"
type="text"
icon="el-icon-paperclip"
@click="handledownloadSignFiles(scope.row)"
v-hasPermi="['project:materialSeal:list']"
>下载会签单</el-button
>
<span v-if="scope.row.signFiles == null"> - </span>
</template>
</el-table-column>
<el-table-column label="变更单" align="center" prop="alterationFiles" width="100">
<template slot-scope="scope">
<el-button
v-if="scope.row.alterationFiles != null"
size="mini"
type="text"
icon="el-icon-paperclip"
@click="handledownloadAlterationFiles(scope.row)"
v-hasPermi="['project:materialSeal:list']"
>下载变更单</el-button
>
<span v-if="scope.row.signFiles == null"> - </span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
fixed="right"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<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:materialSeal: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:materialSeal: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>
<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="materialName">
<el-input v-model="form.materialName" placeholder="请输入封样名称" />
</el-form-item>
<el-form-item label="使用部位" prop="usePosition">
<el-input v-model="form.usePosition" placeholder="请输入使用部位" />
</el-form-item>
<el-form-item label="指定品牌" prop="contractBrand">
<el-input
v-model="form.contractBrand"
placeholder="请输入指定品牌"
@change="onlyFile"
/>
</el-form-item>
<el-form-item label="拟用品牌" prop="useBrand">
<el-input
v-model="form.useBrand"
placeholder="请输入拟用品牌"
@change="onlyFile"
/>
</el-form-item>
<el-form-item label="封样时间" prop="sealDate">
<el-date-picker
clearable
v-model="form.sealDate"
type="datetime"
default-time="10:00:00"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择封样时间"
style="width: 100%"
>
</el-date-picker>
</el-form-item>
<el-form-item label="监理专员" prop="witnessUser">
<el-select
v-model="form.witnessUser"
placeholder="请选择监理专员"
filterable
style="width: 100%"
@change="selectWitnessUser"
>
<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="signFiles">
<file-upload
v-model="form.signFiles"
:limit="1"
:fileType="['pdf', 'png', 'jpg', 'jpeg']"
@input="fileInputSign"
/>
</el-form-item>
<el-form-item label="变更单" prop="alterationFiles" v-show="true">
<file-upload
v-model="form.alterationFiles"
:limit="1"
:fileType="['pdf', 'png', 'jpg', 'jpeg']"
@input="fileInputAlteration"
/>
</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"
/>
<indexDrawer ref="indexDrawer"></indexDrawer>
</div>
</template>
<script>
import {
listMaterialSeal,
getMaterialSeal,
delMaterialSeal,
addMaterialSeal,
updateMaterialSeal,
findGroupCountByApprove,
} from "@/api/project/materialSeal";
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"],
data() {
return {
showViewer: false,
open: false,
isOpen: false,
project: null,
title: "",
isUnit: true,
nodes: [],
form: {},
rules: {
imageUrls: [{ required: true, message: "请上传封样现场图片", trigger: "blur" }],
materialName: [
{ required: true, message: "请输入封样名称", trigger: "blur" },
{ max: 100, message: "封样名称最多100字符", trigger: "blur" },
],
usePosition: [
{ required: true, message: "请输入使用部位", trigger: "blur" },
{ max: 100, message: "使用部位最多100字符", trigger: "blur" },
],
contractBrand: [
{ required: true, message: "请输入合同指定品牌", trigger: "blur" },
{ max: 100, message: "合同指定品牌最多100字符", trigger: "blur" },
],
useBrand: [
{ required: true, message: "请输入使用品牌", trigger: "blur" },
{ max: 100, message: "使用品牌最多100字符", trigger: "blur" },
],
sealDate: [{ required: true, message: "请选择封样时间", trigger: "blur" }],
witnessUser: [
{ required: true, message: "请选择监理单位监理专员", trigger: "blur" },
],
signFiles: [{ required: true, message: "请上传会签单附件", trigger: "blur" }],
alterationFiles: [
{ required: false, message: "请上传变更单附件", trigger: "blur" },
],
},
projectMaterialSealList: [],
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:[],
previewList: [],
isOnly: false,
};
},
computed: {},
mounted() {},
methods: {
fileInputSign(files) {
let fileUrls = null;
if (files.length > 0) {
fileUrls = "";
files.forEach((item) => {
fileUrls += "," + item.url;
});
fileUrls = fileUrls.substring(1);
}
this.form.signFiles = fileUrls;
},
fileInputAlteration(files) {
let fileUrls = null;
if (files.length > 0) {
fileUrls = "";
files.forEach((item) => {
fileUrls += "," + item.url;
});
fileUrls = fileUrls.substring(1);
}
this.form.alterationFiles = fileUrls;
},
onlyFile() {
if (
this.form.contractBrand &&
this.form.useBrand &&
this.form.contractBrand.indexOf(this.form.useBrand) == -1
) {
this.isOnly = true;
this.rules.alterationFiles[0].required = true;
} else {
this.isOnly = false;
this.alterationFiles = null;
this.rules.alterationFiles[0].required = false;
}
},
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.projectMaterialSealList = [];
this.$message.error("当前项目未分配总包单位,不能办理材料封样!");
this.isUnit = false;
}
});
},
// 页签点击
getList() {
this.queryParams.deptId = this.unitActiveName;
this.queryCount()
this.loading = true;
listMaterialSeal(this.queryParams).then((response) => {
this.projectMaterialSealList = 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 = "添加项目材料封样";
//查询单位人员
this.$api.publics
.selectProjectUnitUser({
unitType: "4",
projectId: this.project.id,
})
.then((d) => {
this.deptUserData = d.data;
});
} else {
this.$message.error("当前项目未分配总包单位,不能办理材料封样!");
}
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
getMaterialSeal(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 = "修改项目材料封样";
});
//查询单位人员
this.$api.publics
.selectProjectUnitUser({
unitType: "4",
projectId: this.project.id,
})
.then((d) => {
this.deptUserData = d.data;
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
this.form.approveStatus="1";
if (this.form.id != null) {
updateMaterialSeal(this.form).then((response) => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addMaterialSeal(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 delMaterialSeal(ids);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
this.download(
"project/materialSeal/export",
{
...this.queryParams,
},
`materialSeal_${new Date().getTime()}.xlsx`
);
},
/** 选择见证人*/
selectWitnessUser(val) {
this.deptUserData.forEach((item) => {
item.userinfoList.forEach((u) => {
if (u.phonenumber == val) {
this.form.witnessUserName = u.nickName + " [" + u.jobTypeName + "] ";
}
});
});
},
/** 下载附件 */
handleDownload(row) {
this.files = row.checkingFiles.split(",");
this.files.forEach((item) => {
this.$download.resource(item);
});
},
/** 下载附件 */
handledownloadSignFiles(row) {
this.files = row.signFiles.split(",");
this.files.forEach((item) => {
this.$download.resource(item);
});
},
/** 下载附件 */
handledownloadAlterationFiles(row) {
this.files = row.alterationFiles.split(",");
this.files.forEach((item) => {
this.$download.resource(item);
});
},
/** 审批日志 */
handleAuditinfo(row) {
row.title="材料封样";
row.logType="4";
this.$refs.indexDrawer.show(row);
}
},
};
</script>