YZProjectCloud/yanzhu-ui-vue3/src/views/manage/proProjectInfoSubdepts/index.vue

432 lines
19 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="queryRef" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
<el-input v-model="queryParams.projectName" placeholder="请输入项目名称" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="单位名称" prop="subDeptName">
<el-input v-model="queryParams.subDeptName" placeholder="请输入参建单位名称" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="单位类型" prop="subDeptType">
<el-select v-model="queryParams.subDeptType" placeholder="请选择参建单位类型" clearable>
<el-option v-for="dict in sub_dept_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="进场状态" prop="useStatus">
<el-select v-model="queryParams.useStatus" placeholder="请选择进场状态" clearable>
<el-option v-for="dict in sys_use_status" :key="dict.value" :label="dict.label"
:value="dict.value"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @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="Plus" @click="handleAdd"
v-hasPermi="['manage:proProjectInfoSubdepts:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate"
v-hasPermi="['manage:proProjectInfoSubdepts:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete"
v-hasPermi="['manage:proProjectInfoSubdepts:remove']">删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="Download" @click="handleExport"
v-hasPermi="['manage:proProjectInfoSubdepts:export']">导出</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="proProjectInfoSubdeptsList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="公司名称" align="center" prop="comName" />
<el-table-column label="项目名称" align="center" prop="projectName" />
<el-table-column label="单位类型" align="center" prop="subDeptType">
<template #default="scope">
<dict-tag :options="sub_dept_type" :value="scope.row.subDeptType" />
</template>
</el-table-column>
<el-table-column label="单位名称" align="center" prop="subDeptName" />
<el-table-column label="信用代码" align="center" prop="subDeptCode" />
<el-table-column label="入场二维码" align="center" prop="qrCode" width="100">
<template #default="scope">
<image-preview v-if="scope.row.qrCode" :src="scope.row.qrCode" :width="50" :height="50" />
<span v-if="!scope.row.qrCode">-</span>
</template>
</el-table-column>
<el-table-column label="进场状态" align="center" prop="useStatus" width="80">
<template #default="scope">
<dict-tag :options="sys_use_status" :value="scope.row.useStatus" />
</template>
</el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime" width="120">
<template #default="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="审批状态" align="center" prop="approveStatus" width="100">
<template #default="scope">
<dict-tag :options="sys_approve_status" :value="scope.row.approveStatus" />
</template>
</el-table-column>
<el-table-column label="数据状态" align="center" prop="isDel" width="80" v-if="false">
<template #default="scope">
<dict-tag :options="sys_is_del" :value="scope.row.isDel" />
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" width="150" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['manage:proProjectInfoSubdepts:edit']">修改</el-button>
<el-button v-if="scope.row.useStatus == '0'" link type="primary" icon="Setting"
@click="handleUseStatus(scope.row)" v-hasPermi="['manage:proProjectInfoSubdepts:edit']">离场</el-button>
<el-button v-if="scope.row.useStatus == '1'" link type="primary" icon="Setting"
@click="handleUseStatus(scope.row)" v-hasPermi="['manage:proProjectInfoSubdepts:edit']">进场</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
@pagination="getList" />
<!-- 添加或修改分包单位对话框 -->
<el-dialog :title="title" v-model="open" width="680px" append-to-body modal-class="SubdeptsDlg">
<el-form ref="proProjectInfoSubdeptsRef" :model="form" :rules="rules" label-width="88px">
<el-tabs v-model="activeTabs" type="card" class="demo-tabs">
<el-tab-pane label="基本信息" name="base">
<el-form-item label="项目名称" v-if="form.projectId">
<el-tag effect="plain">{{ form.projectName }}</el-tag>
</el-form-item>
<el-form-item label="单位类型" prop="subDeptType">
<el-select v-model="form.subDeptType" placeholder="请选择单位类型" style="width:100%">
<el-option v-for="dict in sub_dept_type" :key="dict.value" :label="dict.label"
:value="dict.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="单位名称" prop="subDeptName">
<el-input v-model="form.subDeptName" placeholder="请输入单位名称" maxlength="64" show-word-limit />
</el-form-item>
<el-form-item label="信用代码" prop="subDeptCode">
<el-input v-model="form.subDeptCode" placeholder="请输入信用代码" maxlength="64" show-word-limit />
</el-form-item>
<el-form-item label="进场时间" prop="useDates">
<el-date-picker v-model="form.useDates" type="date" placeholder="请选择进场时间" style="width:100%" />
</el-form-item>
<el-form-item label="开工时间" prop="startWorkDates" v-if="form.subDeptType == '4' || form.subDeptType == '5'">
<el-date-picker v-model="form.startWorkDates" type="date" placeholder="请选择计划开工时间" style="width:100%" />
</el-form-item>
<el-form-item label="完工时间" prop="endWorkDates" v-if="form.subDeptType == '4' || form.subDeptType == '5'">
<el-date-picker v-model="form.endWorkDates" type="date" placeholder="请选择计划完工时间" style="width:100%" />
</el-form-item>
<el-form-item label="进场状态" prop="useStatus">
<el-select v-model="form.useStatus" placeholder="请选择进场状态" style="width:100%">
<el-option v-for="dict in sys_use_status" :key="dict.value" :label="dict.label"
:value="dict.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="承包范围" prop="contractInfos" v-if="form.subDeptType == '4' || form.subDeptType == '5'">
<el-input v-model="form.contractInfos" maxlength="2000" show-word-limit type="textarea" rows="4"
placeholder="请输入承包范围" />
</el-form-item>
</el-tab-pane>
<el-tab-pane label="单位信息" name="infos">
<el-form-item label="经营范围">
<el-input v-model="form.subDeptInfos.busScope" maxlength="2000" show-word-limit type="textarea" rows="3"
placeholder="请输入经营范围" />
</el-form-item>
<el-form-item label="注册日期">
<el-date-picker v-model="form.subDeptInfos.signDate" type="date" placeholder="请选择注册日期"
style="width:100%" />
</el-form-item>
<el-form-item label="公司地址">
<el-input v-model="form.subDeptInfos.address" maxlength="200" show-word-limit type="textarea" rows="2"
placeholder="请输入公司地址" />
</el-form-item>
<el-form-item label="营业执照" prop="businessLicensePath">
<image-upload v-model="form.businessLicensePath" :limit="1" />
</el-form-item>
<el-form-item label="企业联系人">
<el-input v-model="form.subDeptInfos.person" maxlength="10" show-word-limit placeholder="请输入企业联系人" />
</el-form-item>
<el-form-item label="联系人电话">
<el-input v-model="form.subDeptInfos.personPhone" maxlength="11" show-word-limit placeholder="请输入联系人电话" />
</el-form-item>
<el-form-item label="法定代表人">
<el-input v-model="form.subDeptInfos.legalPerson" maxlength="10" show-word-limit placeholder="请输入法定代表人" />
</el-form-item>
<el-form-item label="法人身份证">
<el-input v-model="form.subDeptInfos.legalPersonCard" maxlength="18" show-word-limit
placeholder="请输入法人身份证" />
</el-form-item>
<el-form-item label="获得奖项">
<el-input v-model="form.subDeptInfos.awards" maxlength="999" show-word-limit type="textarea" rows="3"
placeholder="请输入获得奖项" />
</el-form-item>
<el-form-item label="企业评分">
<el-input v-model="form.subDeptInfos.mark" maxlength="10" show-word-limit placeholder="请输入企业评分" />
</el-form-item>
<el-divider content-position="left" class="divider_title">银行卡信息</el-divider>
<el-form-item label="支行名称">
<el-input v-model="form.subDeptInfos.bankName" maxlength="32" show-word-limit placeholder="请输入支行名称" />
</el-form-item>
<el-form-item label="银行卡号">
<el-input v-model="form.subDeptInfos.bankNumber" maxlength="32" show-word-limit placeholder="请输入银行卡号" />
</el-form-item>
</el-tab-pane>
<el-tab-pane label="委托人信息" name="leader" v-if="form.subDeptType == '4' || form.subDeptType == '5'">
<el-form-item label="单位委托书" prop="subDeptLeaderPowerPath">
<image-upload v-model="form.subDeptLeaderPowerPath" :limit="1" />
</el-form-item>
<el-form-item label="委托人姓名" prop="subDeptLeaderName">
<el-input v-model="form.subDeptLeaderName" placeholder="请输入委托人姓名" maxlength="10" show-word-limit />
</el-form-item>
<el-form-item label="身份证号码" prop="subDeptLeaderCode">
<el-input v-model="form.subDeptLeaderCode" placeholder="请输入委托人身份证号码" maxlength="18" show-word-limit />
</el-form-item>
<el-form-item label="委托人电话" prop="subDeptLeaderPhone">
<el-input v-model="form.subDeptLeaderPhone" placeholder="请输入委托人电话" maxlength="11" show-word-limit />
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item label="身份证正面">
<image-upload v-model="form.leaderCardImgPos" :limit="1" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="身份证反面">
<image-upload v-model="form.leaderCardImgInv" :limit="1" />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="委托人照片">
<image-upload v-model="form.leaderUserPicture" :limit="1" />
</el-form-item>
</el-tab-pane>
</el-tabs>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="ProProjectInfoSubdepts">
import { listProProjectInfoSubdepts, getProProjectInfoSubdepts, delProProjectInfoSubdepts, addProProjectInfoSubdepts, updateProProjectInfoSubdepts, editUseStatus } from "@/api/manage/proProjectInfoSubdepts";
import useUserStore from '@/store/modules/user'
const { proxy } = getCurrentInstance();
const { sys_use_status, sub_dept_type, sys_approve_status, sys_is_del } = proxy.useDict('sys_use_status', 'sub_dept_type', 'sys_approve_status', 'sys_is_del');
const userStore = useUserStore()
const proProjectInfoSubdeptsList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const activeTabs = ref("base");
const data = reactive({
form: {
subDeptInfos: {}
},
queryParams: {
pageNum: 1,
pageSize: 10,
projectName: null,
subDeptType: null,
subDeptName: null,
subDeptCode: null,
activeTags: "finished",
approveStatus: null,
},
rules: {
subDeptType: [{ required: true, message: "", trigger: "change" }],
subDeptName: [{ required: true, message: "", trigger: "blur" }],
subDeptCode: [{ required: true, message: "", trigger: "blur" }],
useDates: [{ required: true, message: "", trigger: "change" }],
startWorkDates: [{ required: true, message: "", trigger: "change" }],
endWorkDates: [{ required: true, message: "", trigger: "change" }],
useStatus: [{ required: true, message: "", trigger: "change" }],
contractInfos: [{ required: true, message: "", trigger: "blur" }]
}
});
const { queryParams, form, rules } = toRefs(data);
/** */
function getList() {
loading.value = true;
listProProjectInfoSubdepts(queryParams.value).then(response => {
proProjectInfoSubdeptsList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
// 取消按钮
function cancel() {
open.value = false;
reset();
}
// 表单重置
function reset() {
form.value = {
id: null,
comId: null,
projectId: null,
subDeptId: null,
subDeptType: null,
subDeptName: null,
subDeptCode: null,
subDeptLeaderId: null,
subDeptLeaderName: null,
subDeptLeaderCode: null,
subDeptLeaderPhone: null,
subDeptLeaderPowerPath: null,
businessLicensePath: null,
subDeptInfos: null,
contractInfos: null,
useDates: null,
useStatus: '1',
approveStatus: null,
qrCode: null,
isDel: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null,
subDeptInfos: {}
};
proxy.resetForm("proProjectInfoSubdeptsRef");
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef");
handleQuery();
}
// 多选框选中数据
function handleSelectionChange(selection) {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
}
/** 新增按钮操作 */
function handleAdd() {
if (!userStore.currentPrjId) {
proxy.$modal.msgWarning("请切换到项目数据!!!");
return false;
}
reset();
form.value.projectId = userStore.currentPrjId;
form.value.projectName = userStore.currentProName;
activeTabs.value = "base";
open.value = true;
title.value = "添加参建单位";
}
/** 修改按钮操作 */
function handleUpdate(row) {
reset();
const _id = row.id || ids.value
getProProjectInfoSubdepts(_id).then(response => {
response.data.subDeptInfos = JSON.parse(response.data.subDeptInfos);
form.value = response.data;
open.value = true;
title.value = "修改参建单位";
});
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["proProjectInfoSubdeptsRef"].validate(valid => {
if (valid) {
form.value.subDeptInfos = JSON.stringify(form.value.subDeptInfos);
if (form.value.id != null) {
updateProProjectInfoSubdepts(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
});
} else {
form.value.approveStatus = 101;
addProProjectInfoSubdepts(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功");
open.value = false;
getList();
});
}
}
});
}
/** 删除按钮操作 */
function handleDelete(row) {
const _ids = row.id || ids.value
proxy.$modal.confirm('是否确认删除分包单位编号为"' + _ids + '"的数据项?').then(function () {
return delProProjectInfoSubdepts(_ids);
}).then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
}).catch(() => { });
}
/** 进场/退场操作 */
function handleUseStatus(row) {
let state = row.useStatus == '1' ? "2" : "1"
let stateMsg = row.useStatus == '1' ? "离场" : "进场";
proxy.$modal.confirm('是否确认修改单位状态为"' + stateMsg + '"').then(function () {
return editUseStatus(row.id,state);
}).then(() => {
getList();
proxy.$modal.msgSuccess("修改成功");
}).catch(() => { });
}
/** 导出按钮操作 */
function handleExport() {
proxy.download('manage/proProjectInfoSubdepts/export', {
...queryParams.value
}, `proProjectInfoSubdepts_${new Date().getTime()}.xlsx`)
}
getList();
</script>
<style lang="scss" scope>
.el-divider__text {
color: #409eff;
font-weight: 800;
}
.SubdeptsDlg {
.el-dialog__body {
overflow: auto;
max-height: 680px;
}
}
</style>