Compare commits
2 Commits
23a69954d1
...
db8d57565d
| Author | SHA1 | Date |
|---|---|---|
 zzyuan
|
db8d57565d | |
|
zzyuan
|
2eb0d99f54 |
|
|
@ -0,0 +1,77 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 查询列表
|
||||
export function listPerson(query) {
|
||||
return request({
|
||||
url: '/bracelet/person/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 新增
|
||||
export function addPerson(data) {
|
||||
return request({
|
||||
headers: { // 修改请求头
|
||||
'decrypt': 'decrypt',
|
||||
'Content-Type': 'multipart/form-data'
|
||||
},
|
||||
url: '/bracelet/person/addPerson',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 编辑
|
||||
export function editPerson(data) {
|
||||
return request({
|
||||
headers: { // 修改请求头
|
||||
'decrypt': 'decrypt',
|
||||
'Content-Type': 'multipart/form-data'
|
||||
},
|
||||
url: '/bracelet/person/editPerson',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 详情
|
||||
export function getPersonInfo(data) {
|
||||
return request({
|
||||
url: '/bracelet/person/getPersonInfo',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 删除
|
||||
export function delPerson(data) {
|
||||
return request({
|
||||
url: '/bracelet/person/delPerson',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 导出
|
||||
export function exportPerson(query) {
|
||||
return request({
|
||||
url: '/bracelet/export/exportPerson',
|
||||
method: 'get',
|
||||
responseType: 'blob',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
// 模板下载
|
||||
export function personFile(query) {
|
||||
return request({
|
||||
url: '/bracelet/download/personFile',
|
||||
method: 'get',
|
||||
responseType: 'blob',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,83 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 查询列表
|
||||
export function listTeam(query) {
|
||||
return request({
|
||||
url: '/bracelet/team/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询人员
|
||||
export function getPersonList(data) {
|
||||
return request({
|
||||
url: '/bracelet/team/getPersonList',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 添加
|
||||
export function addTeam(data) {
|
||||
return request({
|
||||
url: '/bracelet/team/addTeam',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 详情
|
||||
export function getTeamInfo(data) {
|
||||
return request({
|
||||
url: '/bracelet/team/getTeamInfo',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 修改
|
||||
export function editTeam(data) {
|
||||
return request({
|
||||
url: '/bracelet/team/editTeam',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 删除
|
||||
export function delTeam(data) {
|
||||
return request({
|
||||
url: '/bracelet/team/delTeam',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 解散
|
||||
export function dissolutionTeam(data) {
|
||||
return request({
|
||||
url: '/bracelet/team/dissolutionTeam',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 导出
|
||||
export function exportTeam(query) {
|
||||
return request({
|
||||
url: '/bracelet/export/exportTeam',
|
||||
method: 'get',
|
||||
responseType: 'blob',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询班组成员列表
|
||||
export function getWorkPersonList(query) {
|
||||
return request({
|
||||
url: '/bracelet/team/getWorkPersonList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
import request from '@/utils/request'
|
||||
//公共下拉选接口集合
|
||||
|
||||
export function getProList(query) {
|
||||
return request({
|
||||
url: '/system/select/getProList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -22,7 +22,7 @@ export function addPost(data) {
|
|||
return request({
|
||||
url: '/system/post',
|
||||
method: 'post',
|
||||
data: data
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
|
|
@ -8,6 +8,9 @@ const getters = {
|
|||
token: state => state.user.token,
|
||||
avatar: state => state.user.avatar,
|
||||
name: state => state.user.name,
|
||||
roleCode: state => state.user.roleCode,
|
||||
departId: state => state.user.departId,
|
||||
teamId: state => state.user.teamId,
|
||||
introduction: state => state.user.introduction,
|
||||
roles: state => state.user.roles,
|
||||
permissions: state => state.user.permissions,
|
||||
|
|
|
|||
|
|
@ -8,7 +8,10 @@ const user = {
|
|||
name: '',
|
||||
avatar: '',
|
||||
roles: [],
|
||||
permissions: []
|
||||
permissions: [],
|
||||
roleCode: '',
|
||||
departId: '',
|
||||
teamId: '',
|
||||
},
|
||||
|
||||
mutations: {
|
||||
|
|
@ -24,6 +27,15 @@ const user = {
|
|||
SET_NAME: (state, name) => {
|
||||
state.name = name
|
||||
},
|
||||
SET_ROLE_CODE: (state, roleCode) => {
|
||||
state.roleCode = roleCode
|
||||
},
|
||||
SET_DEPART_ID: (state, departId) => {
|
||||
state.departId = departId
|
||||
},
|
||||
SET_TEAM_ID: (state, teamId) => {
|
||||
state.teamId = teamId
|
||||
},
|
||||
SET_AVATAR: (state, avatar) => {
|
||||
state.avatar = avatar
|
||||
},
|
||||
|
|
@ -68,6 +80,10 @@ const user = {
|
|||
} else {
|
||||
commit('SET_ROLES', ['ROLE_DEFAULT'])
|
||||
}
|
||||
commit('SET_ROLE_CODE', user.roleCode)
|
||||
commit('SET_DEPART_ID', user.deptId)
|
||||
commit('SET_TEAM_ID', user.teamId)
|
||||
|
||||
commit('SET_ID', user.userId)
|
||||
commit('SET_NAME', user.userName)
|
||||
commit('SET_AVATAR', avatar)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,26 @@
|
|||
// 下载blob文件
|
||||
export const downloadFile = ({ fileData, fileType, fileName }) => {
|
||||
const blob = new Blob([fileData], {
|
||||
type: fileType
|
||||
})
|
||||
const link = document.createElement('a')
|
||||
link.href = URL.createObjectURL(blob)
|
||||
link.download = fileName
|
||||
link.style.display = 'none'
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
URL.revokeObjectURL(link.href)
|
||||
document.body.removeChild(link)
|
||||
}
|
||||
|
||||
// 通用a链接下载
|
||||
export const downloadFileByUrl = (url) => {
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.setAttribute('download', '')
|
||||
link.style.display = 'none'
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
URL.revokeObjectURL(link.href)
|
||||
document.body.removeChild(link)
|
||||
}
|
||||
|
|
@ -0,0 +1,597 @@
|
|||
<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="name">
|
||||
<el-input
|
||||
v-model="queryParams.name"
|
||||
placeholder="请输入姓名"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="sex">
|
||||
<el-select v-model="queryParams.sex" placeholder="性别" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_user_sex"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</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="['basic:person:add']"
|
||||
>新增人员</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['basic:person:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="info"
|
||||
plain
|
||||
icon="el-icon-upload"
|
||||
size="mini"
|
||||
@click="handleImport"
|
||||
v-hasPermi="['basic:person:excelUpload']"
|
||||
>导入人员</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleFile"
|
||||
>模板下载</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="['basic:person: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="['basic:person:del']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
-->
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="postList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="姓名" align="center" prop="name" />
|
||||
<el-table-column label="性别" align="center" prop="sex" width="60">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="身份证号" align="center" prop="idCard" />
|
||||
<el-table-column label="电话" align="center" prop="phone" />
|
||||
<el-table-column label="安全帽编号" align="center" prop="aqmCode" />
|
||||
<el-table-column label="马甲编号" align="center" prop="mjCode" />
|
||||
<el-table-column label="人脸信息" align="center" prop="filePath">
|
||||
<template slot-scope="scope">
|
||||
<div @click="openImg(scope.row.base64Url)"
|
||||
style="color: #02a7f0; cursor: pointer"
|
||||
>
|
||||
<img :src="scope.row.base64Url" style="width: 100px;height: 100px;">
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="证书" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div @click="openCertificate(scope.row)" style="color: #02a7f0; cursor: pointer">
|
||||
3
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['basic:person:edit']"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['basic:person:del']"
|
||||
>删除</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="showCertificate" width="1000px" append-to-body>
|
||||
<el-form ref="certificateForm" :model="certificateForm" label-width="100px">
|
||||
<!-- 文件格式下载，图片格式预览 -->
|
||||
<el-form-item label="高处作业证">
|
||||
<uploadFile :limit="5" :accept="accept" :uploadList.sync="highImgList" @picturePreview="picturePreview"></uploadFile>
|
||||
</el-form-item>
|
||||
<el-form-item label="电工作业证">
|
||||
<uploadFile :limit="5" :accept="accept" :uploadList.sync="electricianImgList" @picturePreview="picturePreview"></uploadFile>
|
||||
</el-form-item>
|
||||
<el-form-item label="其他作业证">
|
||||
<uploadFile :limit="5" :accept="accept" :uploadList.sync="elseImgList" @picturePreview="picturePreview"></uploadFile>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitCertificate">确 定</el-button>
|
||||
<el-button @click="cancelCertificate">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 添加或修改人员对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
|
||||
<el-form-item label="人员姓名" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入人员名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="人员性别" prop="sex">
|
||||
<el-select v-model="form.sex" placeholder="请选择人员性别" clearable style="width: 100%;">
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_user_sex"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="身份证号" prop="idCard">
|
||||
<el-input v-model="form.idCard" placeholder="请输入人员身份证号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号" prop="phone">
|
||||
<el-input v-model="form.phone" placeholder="请输入人员手机号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="安全帽编号" prop="aqmCode">
|
||||
<el-input v-model="form.aqmCode" placeholder="请输入安全帽编号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="马甲编号" prop="mjCode">
|
||||
<el-input v-model="form.mjCode" placeholder="请输入马甲编号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="人脸照片" prop="fileName">
|
||||
<el-upload
|
||||
action="#"
|
||||
:limit="1"
|
||||
:file-list="fileList"
|
||||
:show-file-list="true"
|
||||
:auto-upload="false"
|
||||
list-type="picture-card"
|
||||
accept=".png, .jpg, .jpeg"
|
||||
:on-change="handleChange"
|
||||
:class="{ disabled: uploadDisabled }"
|
||||
:on-preview="picturePreview"
|
||||
:on-remove="handleRemove"
|
||||
>
|
||||
<i
|
||||
class="el-icon-plus avatar-uploader-icon"
|
||||
></i>
|
||||
</el-upload>
|
||||
</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-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
|
||||
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
|
||||
:action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
|
||||
:on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
||||
<div class="el-upload__tip text-center" slot="tip">
|
||||
<!-- <div class="el-upload__tip" slot="tip">
|
||||
<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的用户数据
|
||||
</div> -->
|
||||
<span>仅允许导入xls、xlsx格式文件。</span>
|
||||
<!-- <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;"
|
||||
@click="importTemplate">下载模板</el-link> -->
|
||||
</div>
|
||||
</el-upload>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitFileForm">确 定</el-button>
|
||||
<el-button @click="upload.open = false">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 图片查看弹窗 -->
|
||||
<el-dialog :visible.sync="dialogVisible">
|
||||
<img width="100%" height="650px" :src="dialogImageUrl" alt />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listPerson, addPerson, editPerson, getPersonInfo, delPerson, exportPerson, personFile} from "@/api/base/staff";
|
||||
import { downloadFile } from '@/utils/download'
|
||||
import { getToken } from '@/utils/auth'
|
||||
import uploadFile from '../../components/uploadFile.vue'
|
||||
export default {
|
||||
name: "Post",
|
||||
dicts: ['sys_normal_disable','sys_user_sex'],
|
||||
components: {
|
||||
uploadFile
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 人员表格数据
|
||||
postList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
name: undefined,
|
||||
sex: undefined,
|
||||
roleCode: this.$store.getters.roleCode,
|
||||
departId: this.$store.getters.departId,
|
||||
teamId: this.$store.getters.teamId,
|
||||
},
|
||||
showCertificate:false,
|
||||
memberId:"",
|
||||
//证书
|
||||
certificateForm:{},
|
||||
accept:'.png, .jpg, .jpeg, .pdf, .doc, .docx',
|
||||
highImgList: [],
|
||||
electricianImgList: [],
|
||||
elseImgList: [],
|
||||
// 表单参数
|
||||
form: {},
|
||||
//图片上传
|
||||
fileList: [],
|
||||
//图片查看弹窗
|
||||
dialogImageUrl: '',
|
||||
dialogVisible: false,
|
||||
// 用户导入参数
|
||||
upload: {
|
||||
// 是否显示弹出层（用户导入）
|
||||
open: false,
|
||||
// 弹出层标题（用户导入）
|
||||
title: "",
|
||||
// 是否禁用上传
|
||||
isUploading: false,
|
||||
// 是否更新已经存在的用户数据
|
||||
updateSupport: 0,
|
||||
// 设置上传的请求头部
|
||||
headers: { Authorization: "Bearer " + getToken() },
|
||||
// 上传的地址
|
||||
url: process.env.VUE_APP_BASE_API + "/bracelet/person/excelUpload"
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: "人员姓名不能为空", trigger: "blur" }
|
||||
],
|
||||
sex: [
|
||||
{ required: true, message: "人员性别不能为空", trigger: "blur" }
|
||||
],
|
||||
idCard: [
|
||||
{ required: true, message: "身份证号码不能为空", trigger: "blur" },
|
||||
{
|
||||
pattern: /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/,
|
||||
message: "请输入正确的身份证号码",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
phone: [
|
||||
{ required: true, message: "手机号不能为空", trigger: "blur" },
|
||||
{
|
||||
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
||||
message: "请输入正确的手机号码",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
aqmCode: [
|
||||
{ required: true, message: "安全帽编号不能为空", trigger: "blur" }
|
||||
],
|
||||
mjCode: [
|
||||
{ required: true, message: "马甲编号不能为空", trigger: "blur" }
|
||||
],
|
||||
fileName: [
|
||||
{ required: true, message: "人脸图片不能为空", trigger: "blur" }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
//图片上传1张后，隐藏上传框
|
||||
uploadDisabled() {
|
||||
return this.fileList.length > 0
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询人员列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listPerson(this.queryParams).then(response => {
|
||||
this.postList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.fileList=[];
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {};
|
||||
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() {
|
||||
this.fileList = []
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加人员";
|
||||
},
|
||||
// 图片上传
|
||||
handleChange(file, fileList) {
|
||||
console.log(file)
|
||||
// this.$refs["form"].clearValidate()
|
||||
this.form.fileName = file.name;
|
||||
this.fileList = fileList;
|
||||
},
|
||||
handleRemove(file, fileList) {
|
||||
let sum = 0
|
||||
this.fileList.forEach((item, index) => {
|
||||
if (item.uid == file.uid) {
|
||||
sum = index
|
||||
}
|
||||
})
|
||||
this.fileList.splice(sum, 1)
|
||||
},
|
||||
//上传组件-图片查看
|
||||
picturePreview(file) {
|
||||
console.log(file)
|
||||
this.dialogImageUrl = file.url
|
||||
this.dialogVisible = true
|
||||
},
|
||||
//列表-图片查看
|
||||
openImg(url) {
|
||||
this.dialogImageUrl = url
|
||||
this.dialogVisible = true
|
||||
},
|
||||
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id
|
||||
this.fileList=[];
|
||||
getPersonInfo({id:id}).then(response => {
|
||||
this.form = response.data;
|
||||
this.$set(this.form,'sex',response.data.sex+'')
|
||||
this.fileList.push({
|
||||
name: response.data.fileId,
|
||||
url: response.data.base64Url
|
||||
})
|
||||
this.form.fileName = response.data.fileId;
|
||||
setTimeout(()=>{
|
||||
this.open = true;
|
||||
this.title = "修改人员";
|
||||
},100)
|
||||
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id != undefined) {
|
||||
console.log(this.form)
|
||||
const reqData = new FormData()
|
||||
reqData.append('params', JSON.stringify(this.form))
|
||||
const { file } = this.getFileData()
|
||||
file.forEach(item => {
|
||||
reqData.append('file', item)
|
||||
})
|
||||
editPerson(reqData).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.fileList=[];
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
console.log(this.form)
|
||||
const reqData = new FormData()
|
||||
reqData.append('params', JSON.stringify(this.form))
|
||||
const { file } = this.getFileData()
|
||||
file.forEach(item => {
|
||||
reqData.append('file', item)
|
||||
})
|
||||
addPerson(reqData).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.fileList=[];
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
//提交时循环fileList 获取raw文件
|
||||
getFileData() {
|
||||
const file = []
|
||||
this.fileList.forEach(item => {
|
||||
if (item?.hasOwnProperty('raw')) {
|
||||
file.push(item.raw)
|
||||
}
|
||||
})
|
||||
return { file }
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
console.log(row)
|
||||
const param = {
|
||||
id:row.id,
|
||||
fileId:row.fileId,
|
||||
filePath:row.filePath,
|
||||
teamId:row.teamId,
|
||||
}
|
||||
this.$modal.confirm('是否确认删除人员编号为"' + row.id + '"的数据项？').then(function() {
|
||||
return delPerson(param);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
exportPerson(this.queryParams).then(res => {
|
||||
downloadFile({ fileName: `人员_${new Date().getTime()}.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' })
|
||||
})
|
||||
},
|
||||
//模板下载
|
||||
handleFile(){
|
||||
personFile().then(res => {
|
||||
downloadFile({ fileName: `人员模板.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' })
|
||||
})
|
||||
},
|
||||
/** 导入按钮操作 */
|
||||
handleImport() {
|
||||
this.upload.title = "人员导入";
|
||||
this.upload.open = true;
|
||||
},
|
||||
// 文件上传中处理
|
||||
handleFileUploadProgress(event, file, fileList) {
|
||||
this.upload.isUploading = true;
|
||||
},
|
||||
// 文件上传成功处理
|
||||
handleFileSuccess(response, file, fileList) {
|
||||
this.upload.open = false;
|
||||
this.upload.isUploading = false;
|
||||
this.$refs.upload.clearFiles();
|
||||
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
|
||||
this.getList();
|
||||
},
|
||||
// 提交上传文件
|
||||
submitFileForm() {
|
||||
this.$refs.upload.submit();
|
||||
},
|
||||
//打开证书上传
|
||||
openCertificate(row){
|
||||
this.memberId = row.id;
|
||||
this.title = "证书"
|
||||
this.showCertificate = true;
|
||||
},
|
||||
//关闭证书上传
|
||||
cancelCertificate(){
|
||||
this.highImgList = []
|
||||
this.electricianImgList = []
|
||||
this.elseImgList = []
|
||||
this.showCertificate = false;
|
||||
},
|
||||
//提交证书上传
|
||||
submitCertificate(){
|
||||
console.log(this.highImgList)
|
||||
console.log(this.electricianImgList)
|
||||
console.log(this.elseImgList)
|
||||
// this.highImgList = []
|
||||
// this.electricianImgList = []
|
||||
// this.elseImgList = []
|
||||
|
||||
this.showCertificate = false;
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep.el-table .fixed-width .el-button--mini {
|
||||
width: 60px !important;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
//隐藏图片上传框的css
|
||||
::v-deep.disabled {
|
||||
.el-upload--picture-card {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,702 @@
|
|||
<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="postName">
|
||||
<el-input
|
||||
v-model="queryParams.postName"
|
||||
placeholder="请输入关键字"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="班组名称" prop="teamName">
|
||||
<el-input
|
||||
v-model="queryParams.teamName"
|
||||
placeholder="请输入班组名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="班组长" prop="teamLeader">
|
||||
<el-input
|
||||
v-model="queryParams.teamLeader"
|
||||
placeholder="请输入班组长"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="项目部" prop="roleCode">
|
||||
<el-input
|
||||
v-model="queryParams.roleCode"
|
||||
placeholder="请输入项目部"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</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="['basic:team:add']"
|
||||
>新增班组</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['basic:team:export']"
|
||||
>导出</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="['system:post: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="['system:post:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
-->
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="teamList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="班组名称" align="center" prop="teamName" />
|
||||
<el-table-column label="所属工程 " align="center" prop="proName" />
|
||||
<el-table-column label="班组长" align="center" prop="teamLeader" />
|
||||
<el-table-column label="班组成员(在施\未施)" align="center" prop="workNum">
|
||||
<template slot-scope="scope">
|
||||
<div style="cursor: pointer;" @click="openTeamTable(scope.row)">
|
||||
<span style="color: green;">{{ scope.row.workNum }}/</span><span>{{ scope.row.notWorkNum }}</span>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="班组状态" align="center" prop="teamStatus">
|
||||
<template slot-scope="scope">
|
||||
<div v-if="scope.row.teamStatus==0" style="color: green;">{{ stateList[Number(scope.row.teamStatus)] }}</div>
|
||||
<div v-if="scope.row.teamStatus==1" style="color: red;">{{ stateList[Number(scope.row.teamStatus)] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建日期" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="解散日期" align="center" prop="jsTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.jsTime) || '- -' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
v-if="scope.row.teamStatus==0"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['basic:team:edit']"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['basic:team:del']"
|
||||
>删除</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
v-if="scope.row.teamStatus==0"
|
||||
@click="handleDissolution(scope.row)"
|
||||
v-hasPermi="['basic:team:dissolution']"
|
||||
>解散</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"
|
||||
/>
|
||||
|
||||
|
||||
<!-- -------------------分割线---------------------------------- -->
|
||||
|
||||
<!-- 班组成员dialog -->
|
||||
<el-dialog title="班组成员" :visible.sync="openTeam" width="1000px" append-to-body>
|
||||
<!-- 搜索 -->
|
||||
<el-form :model="formQuery" ref="formQuery" size="small" :inline="true" label-width="68px">
|
||||
<el-form-item label="姓名" prop="name">
|
||||
<el-input
|
||||
v-model="formQuery.name"
|
||||
placeholder="请输入姓名"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="sex">
|
||||
<el-select v-model="formQuery.sex" placeholder="性别" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_user_sex"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleMemberQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetMemberQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<!-- 表格 -->
|
||||
<el-table :data="memberList">
|
||||
<el-table-column label="序号" align="center" type="index" />
|
||||
<el-table-column label="姓名" align="center" prop="name" />
|
||||
<el-table-column label="性别" align="center" prop="sex" width="60">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="身份证号" align="center" prop="idCard" width="180"/>
|
||||
<el-table-column label="电话" align="center" prop="phone" />
|
||||
|
||||
<el-table-column label="状态" align="center" prop="workStatus">
|
||||
<template slot-scope="scope">
|
||||
<div v-if="scope.row.workStatus==0" style="color: green;">{{ workStateList[Number(scope.row.workStatus)] }}</div>
|
||||
<div v-if="scope.row.workStatus==1" style="color: grey;">{{ workStateList[Number(scope.row.workStatus)] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="手环编码" align="center" prop="braceletCode">
|
||||
<template slot-scope="scope">
|
||||
<div>{{ scope.row.braceletCode || '- -'}}</div>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页 -->
|
||||
<pagination
|
||||
v-show="memberTotal>0"
|
||||
:total="memberTotal"
|
||||
:page.sync="formQuery.pageNum"
|
||||
:limit.sync="formQuery.pageSize"
|
||||
@pagination="getTeamTable"
|
||||
/>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="openTeam=false">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 添加或修改班组对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="850px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班组名称" prop="teamName">
|
||||
<el-input v-model="form.teamName" placeholder="请输入班组名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班组长" prop="leaderPhone">
|
||||
<el-select v-model="form.leaderPhone" placeholder="请选择班组长" clearable filterable style="width: 100%;" @change="changeLeader">
|
||||
<el-option
|
||||
v-for="item in personList"
|
||||
:key="item.phone"
|
||||
:label="item.name+'-'+item.phone"
|
||||
:value="item.phone"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班组成员" prop="userIdArrIds">
|
||||
<el-input v-model="form.userIdArrIds" v-show="false"/>
|
||||
<span style="margin-left: 20px;color:aquamarine;cursor: pointer;" @click="openChosen()">选择成员</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属工程" prop="proId">
|
||||
<el-select v-model="form.proId" placeholder="请选择所属工程" clearable style="width: 100%;">
|
||||
<el-option
|
||||
v-for="dict in proList"
|
||||
:key="dict.id"
|
||||
:label="dict.name"
|
||||
:value="dict.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" style="display: flex;justify-content: center;">
|
||||
<el-col :span="23">
|
||||
<el-table :data="teamUserList" style="max-height: 300px;overflow-y: auto;">
|
||||
<el-table-column label="序号" type="index" />
|
||||
<el-table-column label="姓名" align="center" prop="name" />
|
||||
<el-table-column label="身份证" align="center" prop="idCard" />
|
||||
<el-table-column label="电话" align="center" prop="phone" />
|
||||
<el-table-column label="操作" align="center" >
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" @click="delUser(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</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-dialog title="选择" :visible.sync="openPeople" width="700px" append-to-body>
|
||||
<div class="people-dialog" style="">
|
||||
<!-- 左侧人员 -->
|
||||
<div class="people-list-box">
|
||||
<div class="dialog-header">
|
||||
<el-input style="width: 90%;" @input="searchUser(searchName)"
|
||||
placeholder="请输入人员姓名"
|
||||
prefix-icon="el-icon-search"
|
||||
v-model="searchName">
|
||||
</el-input>
|
||||
</div>
|
||||
<div style="height: 80%;overflow-y: auto">
|
||||
<el-table :data="peopleList" :show-header="false" @select="selectTeamPeople" ref="peopleTable" :row-key="(row) => { return row.id }">
|
||||
<el-table-column type="selection" width="45" align="center" :reserve-selection="true"/>
|
||||
<el-table-column label="姓名" align="center" prop="name" width="80"/>
|
||||
<el-table-column label="身份证" align="center" prop="idCard" />
|
||||
<el-table-column label="电话" align="center" prop="phone" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 右侧选中 -->
|
||||
<div class="chosen-list-box">
|
||||
<div class="dialog-header">已选择</div>
|
||||
<div class="chosen-list">
|
||||
<div class="chosen-list-item" v-for="item in chosenUser" :key="item.id">
|
||||
<div style="margin-left: 20px;">{{ item.name }}</div>
|
||||
<div style="margin-right: 20px;cursor: pointer;" @click="delChosen(item)">
|
||||
<i class="el-icon-close" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitPeople">确 定</el-button>
|
||||
<el-button @click="cancelPeople">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listTeam,getPersonList,addTeam,editTeam,getTeamInfo,delTeam,dissolutionTeam,exportTeam,getWorkPersonList } from "@/api/base/team";
|
||||
import { getProList } from "@/api/select";
|
||||
import { downloadFile } from '@/utils/download'
|
||||
export default {
|
||||
name: "Post",
|
||||
dicts: ['sys_normal_disable','sys_user_sex'],
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 班组表格数据
|
||||
teamList: [],
|
||||
proList: [],
|
||||
personList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
//班组成员
|
||||
openTeam:false,
|
||||
memberList:[],
|
||||
formQuery:{
|
||||
teamId:'',
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
name: undefined,
|
||||
sex: undefined,
|
||||
},
|
||||
memberTotal: 0, // 总条数
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
teamName:'',
|
||||
teamLeader:'',
|
||||
roleCode: this.$store.getters.roleCode,
|
||||
departId: this.$store.getters.departId,
|
||||
teamId: this.$store.getters.teamId,
|
||||
},
|
||||
stateList:['正常','已解散'],
|
||||
workStateList:['在施工','未施工'],
|
||||
// 表单参数
|
||||
form: {},
|
||||
teamUserList:[],//新增编辑弹窗-班组成员
|
||||
chosenUser:[],//人员列表右侧-选中人员
|
||||
peopleDataList:[],//接口获取-所有人员列表
|
||||
peopleList:[],//人员列表左侧-表格渲染
|
||||
checkList:[],//编辑-详情-已选组员
|
||||
searchName:'',//人员弹窗-搜索框变量
|
||||
openPeople: false,
|
||||
// 表单校验
|
||||
rules: {
|
||||
teamName: [
|
||||
{ required: true, message: "班组名称不能为空", trigger: "blur" }
|
||||
],
|
||||
leaderPhone: [
|
||||
{ required: true, message: "班组长不能为空", trigger: "change" }
|
||||
],
|
||||
// userIdArrIds: [
|
||||
// { required: true, message: "班组成员不能为空", trigger: "change" }
|
||||
// ],
|
||||
proId: [
|
||||
{ required: true, message: "所属工程不能为空", trigger: "change" }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.getProList();
|
||||
this.getPersonList();
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
//获取所属工程
|
||||
getProList(){
|
||||
getProList().then(response => {
|
||||
this.proList = response.data;
|
||||
});
|
||||
},
|
||||
// 获取人员列表
|
||||
getPersonList(){
|
||||
let param = {
|
||||
type:1,//1.全部人员 2.未分配人员 3.已分配人员
|
||||
roleCode: this.$store.getters.roleCode,
|
||||
departId: this.$store.getters.departId,
|
||||
teamId: this.$store.getters.teamId,
|
||||
}
|
||||
getPersonList(param).then(response => {
|
||||
this.personList = response.data;
|
||||
});
|
||||
},
|
||||
// 班组长下拉选
|
||||
changeLeader(val){
|
||||
console.log(val)
|
||||
this.personList.forEach(item=>{
|
||||
if(item.phone==val){
|
||||
this.form.teamLeader = item.name;
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 查询班组列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listTeam(this.queryParams).then(response => {
|
||||
this.teamList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.teamUserList = []
|
||||
this.form = {
|
||||
teamName: undefined,
|
||||
teamLeader: undefined,
|
||||
leaderPhone: undefined,
|
||||
proId: undefined,
|
||||
userIdArr: undefined,
|
||||
userIdArrIds: undefined,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.teamId)
|
||||
this.single = selection.length!=1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
//查看班组成员
|
||||
openTeamTable(row){
|
||||
// this.teamId = row.teamId;
|
||||
this.openTeam = true;
|
||||
this.formQuery = {
|
||||
teamId:row.teamId,
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
name: undefined,
|
||||
sex: undefined,
|
||||
}
|
||||
this.getTeamTable()
|
||||
},
|
||||
//获取成员
|
||||
getTeamTable(){
|
||||
getWorkPersonList(this.formQuery).then(response => {
|
||||
this.memberList = response.rows;
|
||||
this.memberTotal = response.total;
|
||||
});
|
||||
},
|
||||
// 查询
|
||||
handleMemberQuery(){
|
||||
this.formQuery.pageNum = 1;
|
||||
this.getTeamTable();
|
||||
},
|
||||
// 重置
|
||||
resetMemberQuery(){
|
||||
this.resetForm("formQuery");
|
||||
this.handleMemberQuery();
|
||||
},
|
||||
//人员表格-删除
|
||||
delUser(row){
|
||||
console.log(row)
|
||||
let sum = 0
|
||||
this.teamUserList.forEach((item, index) => {
|
||||
if (item.id == row.id) {
|
||||
sum = index
|
||||
}
|
||||
})
|
||||
this.teamUserList.splice(sum, 1)
|
||||
},
|
||||
//打开选择人员
|
||||
openChosen(){
|
||||
this.openPeople = true;
|
||||
this.searchName = '';
|
||||
this.chosenUser = this.teamUserList.slice();
|
||||
let param = {
|
||||
type:2,//1.全部人员 2.未分配人员 3.已分配人员
|
||||
roleCode: this.$store.getters.roleCode,
|
||||
departId: this.$store.getters.departId,
|
||||
teamId: this.$store.getters.teamId,
|
||||
}
|
||||
getPersonList(param).then(response => {
|
||||
this.peopleDataList = this.checkList.concat(response.data);
|
||||
this.peopleList = this.peopleDataList;
|
||||
this.$nextTick(()=>{
|
||||
this.$refs.peopleTable.clearSelection()
|
||||
this.peopleList.forEach(row => {
|
||||
for(let i=0;i<this.teamUserList.length;i++){
|
||||
if(row.id==this.teamUserList[i].id){
|
||||
this.$refs.peopleTable.toggleRowSelection(row,true);
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
});
|
||||
},
|
||||
// 搜索人员姓名
|
||||
searchUser(val){
|
||||
if(val!=''){
|
||||
this.peopleList = this.peopleDataList.filter(item => item.name.includes(val));
|
||||
}else{
|
||||
this.peopleList = this.peopleDataList;
|
||||
}
|
||||
|
||||
},
|
||||
//勾选选择框
|
||||
selectTeamPeople(selection,row) {
|
||||
this.chosenUser = selection;
|
||||
// this.chosenIds = selection.map(item => item.userId)
|
||||
},
|
||||
//选择人员-右侧删除
|
||||
delChosen(obj){
|
||||
let sum = 0
|
||||
this.chosenUser.forEach((item, index) => {
|
||||
if (item.id == obj.id) {sum = index;}
|
||||
})
|
||||
//删除
|
||||
this.chosenUser.splice(sum, 1)
|
||||
// 取消勾选
|
||||
this.$nextTick(()=>{
|
||||
this.$refs.peopleTable.clearSelection()
|
||||
this.peopleList.forEach(row => {
|
||||
for(let i=0;i<this.chosenUser.length;i++){
|
||||
if(row.id==this.chosenUser[i].id){
|
||||
this.$refs.peopleTable.toggleRowSelection(row,true);
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
},
|
||||
//选择人员弹窗-关闭
|
||||
cancelPeople() {
|
||||
this.openPeople = false;
|
||||
},
|
||||
//选择人员弹窗-确认
|
||||
submitPeople(){
|
||||
// let arrs=[...this.chosenUser,...this.teamUserList];
|
||||
// //根据id去重
|
||||
// let map=new Map();
|
||||
// for(let item of arrs){
|
||||
// if(!map.has(item.id)){
|
||||
// map.set(item.id,item)
|
||||
// }
|
||||
// }
|
||||
// let newArr=[...map.values()];
|
||||
this.teamUserList = this.chosenUser;
|
||||
|
||||
this.openPeople = false;
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.checkList = []
|
||||
this.open = true;
|
||||
this.title = "添加班组";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const teamId = row.teamId
|
||||
getTeamInfo({id:teamId}).then(response => {
|
||||
this.form = response.data;
|
||||
this.$set(this.form,'proId',response.data.proId+'')
|
||||
this.checkList = response.data.checkList;
|
||||
// this.$set(this.form,'sex',response.data.sex+'')
|
||||
this.teamUserList = response.data.checkList.slice();
|
||||
this.open = true;
|
||||
this.title = "修改班组";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.form.userIdArr = this.teamUserList.map(item => item.id)
|
||||
this.form.userIdArrIds = this.form.userIdArr.join(',')
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.teamId != undefined) {
|
||||
editTeam(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
console.log(this.form)
|
||||
addTeam(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const teamIds = row.teamId;
|
||||
this.$modal.confirm('是否确认删除班组编号为"' + teamIds + '"的数据项？').then(function() {
|
||||
return delTeam({id:teamIds});
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 解散按钮操作 */
|
||||
handleDissolution(row) {
|
||||
const teamIds = row.teamId;
|
||||
this.$modal.confirm('是否确认解散班组编号为"' + teamIds + '"的数据项？').then(function() {
|
||||
return dissolutionTeam({id:teamIds});
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("解散成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
exportTeam(this.queryParams).then(res => {
|
||||
downloadFile({ fileName: `班组_${new Date().getTime()}.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' })
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.people-dialog{
|
||||
width: 100%;height: 500px;display: flex; justify-content: space-between;
|
||||
}
|
||||
.people-list-box{
|
||||
width: 55%;height: 98%;border: 1px solid #e0e0e0;
|
||||
}
|
||||
.chosen-list-box{
|
||||
width: 40%;height: 98%;border: 1px solid #e0e0e0;
|
||||
}
|
||||
.chosen-list{
|
||||
height: 85%;overflow-y: auto;
|
||||
}
|
||||
.chosen-list-item{
|
||||
width: 100%;height: 40px;display: flex;justify-content: space-between;align-items: center;
|
||||
}
|
||||
.dialog-header{
|
||||
width: 100%;height: 60px;background-color: #F2F2F2;display: flex;align-items: center;justify-content: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,125 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-upload
|
||||
action="#"
|
||||
:limit="limit"
|
||||
:file-list="fileList"
|
||||
:show-file-list="true" :auto-upload="false"
|
||||
list-type="picture-card"
|
||||
:accept="accept"
|
||||
:on-change="fileChange"
|
||||
:class="{ disabled: uploadDisabled }"
|
||||
>
|
||||
<!-- 文件格式下载，图片格式预览 -->
|
||||
<div slot="file" slot-scope="{file}">
|
||||
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
|
||||
<span class="el-upload-list__item-actions">
|
||||
<span v-if="updataIf(file)" class="el-upload-list__item-delete" @click="handleDownload(file)">
|
||||
<i class="el-icon-download" />
|
||||
</span>
|
||||
<span v-else class="el-upload-list__item-preview" @click="picturePreview(file)">
|
||||
<i class="el-icon-zoom-in" />
|
||||
</span>
|
||||
<span class="el-upload-list__item-delete" @click="fileRemove(file)">
|
||||
<i class="el-icon-delete" />
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<i class="el-icon-plus avatar-uploader-icon"></i>
|
||||
</el-upload>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { downloadFile } from '@/utils/download'
|
||||
export default {
|
||||
name: "uploadFile",
|
||||
data() {
|
||||
return {
|
||||
fileList:[],
|
||||
|
||||
}
|
||||
},
|
||||
props: {
|
||||
limit: {
|
||||
type: [String, Number],
|
||||
default: ""
|
||||
},
|
||||
uploadList: {
|
||||
type: Array,
|
||||
default: function() {
|
||||
return []
|
||||
}
|
||||
},
|
||||
accept: {
|
||||
type: String,
|
||||
default: ".png, .jpg, .jpeg"
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
//图片上传超出限制，隐藏上传框
|
||||
uploadDisabled() {
|
||||
return this.fileList.length >= Number(this.limit)
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
fileChange(file, fileList){
|
||||
if(file.size > 1024 * 1024 * 10){
|
||||
this.$message.warning('文件大小不能超过10Mb')
|
||||
fileList = fileList.filter(item => {
|
||||
return item.uid != file.uid
|
||||
})
|
||||
}
|
||||
fileList.forEach(file=>{
|
||||
if(file.name.split('.')[1] === 'doc'||file.name.split('.')[1] === 'docx'||file.name.split('.')[1] === 'pdf'){
|
||||
file.url = require('../../assets/file.png')
|
||||
}
|
||||
})
|
||||
this.fileList = fileList;
|
||||
this.$emit('update:uploadList',this.fileList)
|
||||
},
|
||||
fileRemove(file) {
|
||||
let sum = 0
|
||||
this.fileList.forEach((item, index) => {
|
||||
if (item.uid == file.uid) { sum = index }
|
||||
})
|
||||
this.fileList.splice(sum, 1)
|
||||
// this.$emit('uploadList', this.fileList)
|
||||
this.$emit('update:uploadList',this.fileList)
|
||||
},
|
||||
handleDownload(file) {
|
||||
downloadFile({ fileName: file.name, fileData: file.raw, fileType: 'application/vnd.ms-excel;charset=utf-8' })
|
||||
},
|
||||
//上传组件-图片查看
|
||||
picturePreview(file) {
|
||||
this.$emit('picturePreview', file)
|
||||
},
|
||||
// 判断文件类型,图片预览，文件下载
|
||||
updataIf(e) {
|
||||
if (e.fileName) {
|
||||
if (e.fileName.split('.')[1] === 'png' || e.fileName.split('.')[1] === 'jpeg' || e.fileName.split('.')[1] === 'jpg') {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
} else {
|
||||
if (e.name.split('.')[1] === 'png' || e.name.split('.')[1] === 'jpeg' || e.name.split('.')[1] === 'jpg') {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep.disabled {
|
||||
.el-upload--picture-card {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue