581 lines
22 KiB
Vue
581 lines
22 KiB
Vue
<template>
|
||
<div class="app-container problemmodify-draft">
|
||
<el-form :model="data.queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
|
||
<el-form-item label="检查类型" prop="problemType">
|
||
<el-select v-model="data.queryParams.problemType" placeholder="请选择检查类型" clearable>
|
||
<el-option v-for="dict in ssp_proble_type" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="整改人" prop="lordSent">
|
||
<el-input v-model="data.queryParams.userName" style="width: 200px;" placeholder="请输入人员姓名/联系方式" clearable @keyup.enter="handleQuery" />
|
||
</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 size="small" @click="handleAdd" v-hasPermi="['trouble:smzSspProblemmodifyDraft:add']">
|
||
<el-icon>
|
||
<Plus />
|
||
</el-icon>新增
|
||
</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button type="warning" plain size="small" @click="dataSynchronization" :disabled="single" v-hasPermi="['trouble:smzSspProblemmodifyDraft:add']">
|
||
<el-icon>
|
||
<CopyDocument />
|
||
</el-icon>数据同步
|
||
</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-tooltip content="批量提交选择的数据!" placement="bottom">
|
||
<el-button type="success" plain size="small" @click="batchSubmitForm" :disabled="multiple" v-hasPermi="['trouble:smzSspProblemmodifyDraft:add']">
|
||
<el-icon>
|
||
<Check />
|
||
</el-icon>批量提交
|
||
</el-button>
|
||
</el-tooltip>
|
||
</el-col>
|
||
</el-row>
|
||
<el-alert title="操作说明" class="tips" effect="dark" type="warning" :closable="false">
|
||
<template #title>
|
||
<div>
|
||
<strong>数据同步:</strong>将选中行的数据同步到(当前项目或项目为空)的其它行!
|
||
</div>
|
||
<div>
|
||
<strong>批量提交:</strong>将选中行的数据,数据验证通过后一次全部提交!
|
||
</div>
|
||
</template>
|
||
</el-alert>
|
||
<el-form :model="data.form" :rules="data.rules" ref="formRef">
|
||
<el-table :data="data.showList" @selection-change="handleSelectionChange">
|
||
<el-table-column type="selection" width="30" align="center" />
|
||
<el-table-column type="index" width="50" align="center" label="序号"></el-table-column>
|
||
|
||
<el-table-column align="center" width="180" class-name="td-up-img" label="问题图片">
|
||
<template #default="scope">
|
||
<div :class="scope.row.errSmarkUrl ? 'is-err' : ''">
|
||
<image-upload v-model="scope.row.smarkUrl" previewAll :limit="5" :isShowTip="false" @change="scope.row.errSmarkUrl = scope.row.smarkUrl ? false : true" />
|
||
</div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column align="center" width="180" class-name="td-proble-type" label="隐患类型">
|
||
<template #default="scope">
|
||
<div :class="scope.row.errProblemType ? 'is-err' : ''">
|
||
<el-select v-model="scope.row.problemType" placeholder="请选择检查类型" clearable @change="scope.row.errProblemType = scope.row.problemType ? false : true">
|
||
<el-option v-for="dict in ssp_proble_type" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
|
||
</el-select>
|
||
</div>
|
||
<div :class="scope.row.errDangerType ? 'is-err' : ''">
|
||
<el-select v-model="scope.row.dangerType" placeholder="请选择隐患类型" clearable style="margin-top:80px;" @change="scope.row.errDangerType = scope.row.dangerType ? false : true">
|
||
<el-option v-for="dict in ssp_proble_sub_type" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
|
||
</el-select>
|
||
</div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="施工部位" align="center" prop="workParts" min-width="240" class-name="td-textarea">
|
||
<template #default="scope">
|
||
<div :class="scope.row.errWorkParts ? 'is-err' : ''">
|
||
<el-input v-model="scope.row.workParts" placeholder="请输入施工部位" type="textarea" :rows="3" @change="scope.row.errWorkParts = scope.row.workParts ? false : true" />
|
||
</div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="整改要求" align="center" prop="changeInfo" min-width="240" class-name="td-textarea">
|
||
<template #default="scope">
|
||
<div :class="scope.row.errChangeInfo ? 'is-err' : ''">
|
||
<el-input v-model="scope.row.changeInfo" placeholder="请输入整改要求" type="textarea" :rows="3" @change="scope.row.errChangeInfo = scope.row.changeInfo ? false : true" />
|
||
</div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="问题人员" align="center" width="300" class-name="td-select">
|
||
<template #default="scope">
|
||
<el-form-item label="整改人">
|
||
<div :class="scope.row.errLordSent ? 'is-err' : ''" style="width: 100%;">
|
||
<el-select
|
||
v-model="scope.row.lordSent"
|
||
placeholder="请选择人员"
|
||
clearable
|
||
@change="scope.row.errLordSent = scope.row.lordSent ? false : true"
|
||
popper-class="select-popper-group-pd"
|
||
>
|
||
<el-option-group v-for="group in data.modUserList" :key="group.label" :label="group.label">
|
||
<el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value" />
|
||
</el-option-group>
|
||
</el-select>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="抄送人">
|
||
<div :class="scope.row.errCopySend ? 'is-err' : ''" style="width: 100%;">
|
||
<el-select
|
||
v-model="scope.row.copySend"
|
||
placeholder="请选择人员"
|
||
clearable
|
||
multiple
|
||
collapse-tags
|
||
@change="scope.row.errCopySend = scope.row.copySend ? false : true"
|
||
popper-class="select-popper-group-pd"
|
||
collapse-tags-tooltip
|
||
>
|
||
<el-option-group v-for="group in data.ccUserList" :key="group.label" :label="group.label">
|
||
<el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value" />
|
||
</el-option-group>
|
||
</el-select>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="复检人">
|
||
<div :class="scope.row.errRecheckSend ? 'is-err' : ''" style="width: 100%;">
|
||
<el-select
|
||
v-model="scope.row.recheckSend"
|
||
placeholder="请选择人员"
|
||
clearable
|
||
@change="scope.row.errRecheckSend = scope.row.recheckSend ? false : true"
|
||
popper-class="select-popper-group-pd"
|
||
collapse-tags-tooltip
|
||
>
|
||
<el-option-group v-for="group in data.recheckUserList" :key="group.label" :label="group.label">
|
||
<el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value" />
|
||
</el-option-group>
|
||
</el-select>
|
||
</div>
|
||
</el-form-item>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="整改截至时间" align="center" prop="nickedTime" width="180" class-name="td-select">
|
||
<template #default="scope">
|
||
<el-form-item label>
|
||
<div :class="scope.row.errNickedTime ? 'is-err' : ''" style="width: 100%;">
|
||
<el-date-picker
|
||
v-model="scope.row.nickedTime"
|
||
type="date"
|
||
placeholder="选择日期"
|
||
value-format="YYYY-MM-DD"
|
||
@change="scope.row.errNickedTime = scope.row.nickedTime ? false : true"
|
||
style="width: 100%"
|
||
/>
|
||
</div>
|
||
</el-form-item>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||
<template #default="scope">
|
||
<el-button link type="primary" icon="Edit" @click="submitRow(scope.row)" v-hasPermi="['trouble:problemmodifyDraft:edit']">提交</el-button>
|
||
<br />
|
||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['trouble:problemmodifyDraft:remove']">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</el-form>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup name="ProblemmodifyDraft">
|
||
import {
|
||
listProblemmodifyDraft,
|
||
getProblemmodifyDraft,
|
||
delProblemmodifyDraft,
|
||
addProblemmodifyDraft,
|
||
updateProblemmodifyDraft,
|
||
} from '@/api/trouble/problemmodifyDraft'
|
||
import { batchAddProblemmodify } from '@/api/trouble/problemmodify'
|
||
|
||
import useUserStore from '@/store/modules/user'
|
||
import { listProProjectInfoSubdeptsUsers } from '@/api/manage/proProjectInfoSubdeptsUsers'
|
||
const userStore = useUserStore()
|
||
const { proxy } = getCurrentInstance()
|
||
const { ssp_proble_type, ssp_proble_sub_type } = proxy.useDict('ssp_proble_type', 'ssp_proble_sub_type')
|
||
|
||
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 uploadFileUrl = ref(import.meta.env.VITE_APP_BASE_API + '/file/upload') // 上传文件服务器地址
|
||
|
||
const data = reactive({
|
||
dataList: [],
|
||
showList: [],
|
||
form: {},
|
||
queryParams: {
|
||
problemType: null,
|
||
userName: null,
|
||
},
|
||
rules: {},
|
||
selData: [],
|
||
users: [],
|
||
modUserList: [], //整改人
|
||
ccUserList: [], //抄送人
|
||
recheckUserList: [], //复检人
|
||
})
|
||
|
||
const { queryParams, form, rules } = toRefs(data)
|
||
|
||
/** 搜索按钮操作 */
|
||
function handleQuery() {
|
||
data.showList = data.dataList.filter((d) => {
|
||
let ck1 = true
|
||
if (data.queryParams.problemType) {
|
||
ck1 = d.problemType == data.queryParams.problemType
|
||
}
|
||
return ck1
|
||
})
|
||
}
|
||
|
||
/** 重置按钮操作 */
|
||
function resetQuery() {
|
||
proxy.resetForm('queryRef')
|
||
handleQuery()
|
||
}
|
||
|
||
// 多选框选中数据
|
||
function handleSelectionChange(selection) {
|
||
data.selData = selection
|
||
ids.value = selection.map((item) => item.id)
|
||
single.value = selection.length != 1
|
||
multiple.value = !selection.length
|
||
}
|
||
|
||
/** 新增按钮操作 */
|
||
function handleAdd() {
|
||
let row = {
|
||
key: +new Date(),
|
||
id: null,
|
||
projectId: userStore.currentPrjId,
|
||
comId: userStore.currentComId,
|
||
problemType: null,
|
||
dangerType: null,
|
||
smarkUrl: null,
|
||
workParts: null,
|
||
changeInfo: null,
|
||
lordSent: null,
|
||
copySend: null,
|
||
recheckSend: null,
|
||
nickedTime: null,
|
||
isDel: 0,
|
||
infoType: 1,
|
||
}
|
||
data.dataList.push(row)
|
||
data.showList.push(row)
|
||
}
|
||
/** 数据同步 */
|
||
function dataSynchronization() {
|
||
let row = data.selData[0]
|
||
data.showList.forEach((it) => {
|
||
if (it != row) {
|
||
it.problemType = row.problemType
|
||
it.dangerType = row.dangerType
|
||
it.smarkUrl = row.smarkUrl
|
||
it.workParts = row.workParts
|
||
it.changeInfo = row.changeInfo
|
||
it.lordSent = row.lordSent
|
||
it.copySend = row.copySend
|
||
it.recheckSend = row.recheckSend
|
||
it.nickedTime = row.nickedTime
|
||
}
|
||
})
|
||
}
|
||
function submitRow(row) {
|
||
if (checkRow(row)) {
|
||
doBatchAdd([row])
|
||
}
|
||
}
|
||
function batchSubmitForm() {
|
||
let cnt = 0
|
||
data.selData.forEach((it) => {
|
||
if (!checkRow(it)) {
|
||
cnt++
|
||
//data.showList.splice(it, 1);
|
||
//data.dataList.splice(it, 1);
|
||
}
|
||
})
|
||
if (cnt > 0) {
|
||
return
|
||
}
|
||
doBatchAdd(data.selData)
|
||
}
|
||
function doBatchAdd(datas) {
|
||
datas.forEach((it) => {
|
||
it.projectId = userStore.currentPrjId
|
||
it.comId = userStore.currentComId
|
||
it.infoType = 0
|
||
let users = data.users.filter((u) => u.userId == it.lordSent)
|
||
it.lordSent = users.map((u) => u.userId).join(',')
|
||
it.lordSentUser = users.map((u) => u.userName).join(',')
|
||
users = data.users.filter((u) => it.copySend.includes(u.userId))
|
||
it.copySend = users.map((u) => u.userId).join(',')
|
||
it.copySendUser = users.map((u) => u.userName).join(',')
|
||
users = data.users.filter((u) => u.userId == it.recheckSend)
|
||
it.recheckSend = users.map((u) => u.userId).join(',')
|
||
it.recheckSendUser = users.map((u) => u.userName).join(',')
|
||
})
|
||
batchAddProblemmodify(datas).then((res) => {
|
||
if (res.code == 200) {
|
||
proxy.$modal.msgSuccess('提交成功!')
|
||
datas.forEach((it) => {
|
||
data.showList.splice(it, 1)
|
||
data.dataList.splice(it, 1)
|
||
})
|
||
if (data.showList.length == 0) {
|
||
let row = {
|
||
key: +new Date(),
|
||
id: null,
|
||
projectId: userStore.currentPrjId,
|
||
comId: userStore.currentComId,
|
||
problemType: null,
|
||
dangerType: null,
|
||
smarkUrl: null,
|
||
workParts: null,
|
||
changeInfo: null,
|
||
lordSent: null,
|
||
copySend: null,
|
||
recheckSend: null,
|
||
nickedTime: null,
|
||
isDel: 0,
|
||
infoType: 1,
|
||
}
|
||
data.dataList.push(row)
|
||
data.showList.push(row)
|
||
}
|
||
}
|
||
})
|
||
}
|
||
function checkRow(row) {
|
||
row.errSmarkUrl = false
|
||
row.errProblemType = false
|
||
row.errDangerType = false
|
||
row.errWorkParts = false
|
||
row.errChangeInfo = false
|
||
row.errLordSent = false
|
||
row.errCopySend = false
|
||
row.errRecheckSend = false
|
||
row.errNickedTime = false
|
||
let ret = true
|
||
if (!row.smarkUrl) {
|
||
row.errSmarkUrl = true
|
||
ret = false
|
||
}
|
||
if (!row.problemType) {
|
||
row.errProblemType = true
|
||
ret = false
|
||
}
|
||
if (!row.dangerType) {
|
||
row.errDangerType = true
|
||
ret = false
|
||
}
|
||
if (!row.workParts) {
|
||
row.errWorkParts = true
|
||
ret = false
|
||
}
|
||
if (!row.changeInfo) {
|
||
row.errChangeInfo = true
|
||
ret = false
|
||
}
|
||
if (!row.lordSent) {
|
||
row.errLordSent = true
|
||
ret = false
|
||
}
|
||
if (!row.copySend) {
|
||
row.errCopySend = true
|
||
ret = false
|
||
}
|
||
if (!row.recheckSend) {
|
||
row.errRecheckSend = true
|
||
ret = false
|
||
}
|
||
if (!row.nickedTime) {
|
||
row.errNickedTime = true
|
||
ret = false
|
||
}
|
||
return ret
|
||
}
|
||
|
||
/** 提交按钮 */
|
||
function submitForm() {
|
||
proxy.$refs['problemmodifyDraftRef'].validate((valid) => {
|
||
if (valid) {
|
||
if (form.value.id != null) {
|
||
updateProblemmodifyDraft(form.value).then((response) => {
|
||
proxy.$modal.msgSuccess('修改成功')
|
||
open.value = false
|
||
getList()
|
||
})
|
||
} else {
|
||
addProblemmodifyDraft(form.value).then((response) => {
|
||
proxy.$modal.msgSuccess('新增成功')
|
||
open.value = false
|
||
getList()
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
/** 删除按钮操作 */
|
||
function handleDelete(row) {
|
||
if (data.dataList.length == 1) {
|
||
proxy.$modal.msgError('至少保留一条数据')
|
||
return
|
||
}
|
||
proxy.$modal
|
||
.confirm('是否确认删除数据项?')
|
||
.then(function () {
|
||
data.showList.splice(row, 1)
|
||
data.dataList.splice(row, 1)
|
||
proxy.$modal.msgSuccess('删除成功')
|
||
})
|
||
.catch(() => {})
|
||
}
|
||
|
||
/** 导出按钮操作 */
|
||
function handleExport() {
|
||
proxy.download(
|
||
'trouble/problemmodifyDraft/export',
|
||
{
|
||
...queryParams.value,
|
||
},
|
||
`problemmodifyDraft_${new Date().getTime()}.xlsx`
|
||
)
|
||
}
|
||
function makeSelectData(users, type) {
|
||
console.log("--->",users,type)
|
||
let objs = {}
|
||
users.forEach((it) => {
|
||
let deptName = it.subDeptName||it.projectName
|
||
if (!objs[deptName]) {
|
||
objs[deptName] = []
|
||
}
|
||
objs[deptName].push(it)
|
||
})
|
||
let arr = []
|
||
for (let k in objs) {
|
||
arr.push({
|
||
label: k,
|
||
options: objs[k].map((it) => {
|
||
let pos = type ? `[${it.userPost == 2 ? '项目经理' : it.userPost == 3 ? '班组长' : it.userPost == 8 ? '安全员' : ''}]` : ''
|
||
return {
|
||
value: it.userId,
|
||
label: it.userName + pos,
|
||
data: it,
|
||
}
|
||
}),
|
||
})
|
||
}
|
||
return arr
|
||
}
|
||
function getUserTree() {
|
||
let row = {
|
||
key: +new Date(),
|
||
id: null,
|
||
projectId: userStore.currentPrjId,
|
||
comId: userStore.currentComId,
|
||
problemType: null,
|
||
dangerType: null,
|
||
smarkUrl: null,
|
||
workParts: null,
|
||
changeInfo: null,
|
||
lordSent: null,
|
||
copySend: null,
|
||
recheckSend: null,
|
||
nickedTime: null,
|
||
isDel: 0,
|
||
infoType: 1,
|
||
}
|
||
data.dataList.push(row)
|
||
data.showList.push(row)
|
||
listProProjectInfoSubdeptsUsers({ projectId: userStore.currentPrjId, pageNum: 1, pageSize: 1000 }).then((d) => {
|
||
let users = d.rows || []
|
||
data.users = users
|
||
data.modUserList = makeSelectData(
|
||
users
|
||
.filter((it) => it.subDeptType == 4 || it.subDeptType == 5)
|
||
.filter((it) => it.userPost == 2 || it.userPost == 3 || it.userPost == 8),
|
||
true
|
||
)
|
||
data.ccUserList = makeSelectData(users.filter((it) => it.userPost != 4 && it.userPost != 5))
|
||
data.recheckUserList = makeSelectData(users.filter((it) => it.subDeptType == 1))
|
||
})
|
||
}
|
||
getUserTree()
|
||
</script>
|
||
<style lang="scss">
|
||
.problemmodify-draft {
|
||
.td-up-img {
|
||
.component-upload-image {
|
||
height: 150px;
|
||
overflow: hidden;
|
||
|
||
.el-upload-list__item {
|
||
position: absolute;
|
||
}
|
||
}
|
||
}
|
||
|
||
.td-textarea {
|
||
.cell {
|
||
width: 100%;
|
||
height: 100%;
|
||
|
||
.el-textarea {
|
||
width: 100%;
|
||
height: 150px;
|
||
|
||
.el-textarea__inner {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.td-select {
|
||
.el-select {
|
||
width: 100%;
|
||
}
|
||
|
||
.is-err {
|
||
&::after {
|
||
bottom: -15px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.is-err {
|
||
position: relative;
|
||
padding-bottom: 12px;
|
||
|
||
.el-upload--picture-card {
|
||
border-color: red;
|
||
}
|
||
|
||
&::after {
|
||
content: '不为空';
|
||
color: red;
|
||
left: 0px;
|
||
font-size: 12px;
|
||
position: absolute;
|
||
bottom: -7px;
|
||
}
|
||
|
||
.el-select__wrapper,
|
||
.el-textarea__inner,
|
||
.el-input__wrapper {
|
||
box-shadow: inset 0 0 0 1px red;
|
||
}
|
||
}
|
||
}
|
||
|
||
.select-popper-group-pd {
|
||
.el-select-group {
|
||
.el-select-dropdown__item {
|
||
padding-left: 30px;
|
||
}
|
||
}
|
||
}
|
||
</style> |