|
|
|
|
<template>
|
|
|
|
|
<div class="m-record">
|
|
|
|
|
<h3>巡查记录</h3>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="u-table-btn1 mt10" v-if="formType == 'edit'">
|
|
|
|
|
<el-button size="small" class="diy-button--blue" :disabled="btnDisabled || disabled" @click="handleAdd">新增</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="m-table-item">
|
|
|
|
|
<el-table :data="tableData" :header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }" class="resi-table" row-key="id" border style="width: 100%">
|
|
|
|
|
<el-table-column label="序号" type="index" align="center" width="50"></el-table-column>
|
|
|
|
|
<el-table-column prop="patrolTime" label="检查时间" align="center" width="200px">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-date-picker
|
|
|
|
|
v-if="scope.row.isEdit"
|
|
|
|
|
v-model="scope.row.patrolTime"
|
|
|
|
|
type="date"
|
|
|
|
|
class="input-width"
|
|
|
|
|
value-format="yyyy-MM-dd"
|
|
|
|
|
placeholder="选择日期"
|
|
|
|
|
></el-date-picker>
|
|
|
|
|
<div v-else class="div-content">{{ scope.row.patrolTime }}</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
|
|
<el-table-column prop="staffId" label="检查人员" align="center" width="200px">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-select
|
|
|
|
|
v-if="scope.row.isEdit"
|
|
|
|
|
v-model="scope.row.staffId"
|
|
|
|
|
placeholder="请选择"
|
|
|
|
|
class="input-width"
|
|
|
|
|
@change="handleChangeStaff(scope.row)"
|
|
|
|
|
clearable
|
|
|
|
|
>
|
|
|
|
|
<el-option v-for="subItem in optionStaff" :key="subItem.value" :label="subItem.label" :value="subItem.value"></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
<div v-else class="div-content">{{ scope.row.staffName }}</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
|
|
<el-table-column prop="mobile" label="联系电话" align="center" width="200px">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-input v-if="scope.row.isEdit" type="number" v-model="scope.row.mobile" placeholder="请输入" class="input-width" clearable disabled></el-input>
|
|
|
|
|
<div v-else class="div-content">{{ scope.row.mobile }}</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
|
|
<el-table-column prop="result" label="检查结果" align="center" width="200px">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-select v-if="scope.row.isEdit" v-model="scope.row.result" placeholder="请选择" class="input-width" size="small" clearable>
|
|
|
|
|
<el-option v-for="subItem in optionResult" :key="subItem.value" :label="subItem.label" :value="subItem.value"></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
<div v-else class="div-content">{{ scope.row.result == 1 ? '正常' : '异常' }}</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
|
|
<!-- <el-table-column
|
|
|
|
|
prop="detailed"
|
|
|
|
|
label="隐患明细"
|
|
|
|
|
align="center"
|
|
|
|
|
width="200px"
|
|
|
|
|
>
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-input
|
|
|
|
|
v-if="scope.row.isEdit"
|
|
|
|
|
type="text"
|
|
|
|
|
v-model="scope.row.detailed"
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
class="input-width"
|
|
|
|
|
maxlength="500"
|
|
|
|
|
clearable
|
|
|
|
|
></el-input>
|
|
|
|
|
<div v-else class="div-content">
|
|
|
|
|
{{ scope.row.detailed }}
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column> -->
|
|
|
|
|
|
|
|
|
|
<el-table-column prop="imgList" label="图片列表" align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<div v-if="scope.row.isEdit">
|
|
|
|
|
<el-upload
|
|
|
|
|
:headers="$getElUploadHeaders()"
|
|
|
|
|
class="avatar-uploader"
|
|
|
|
|
:action="uploadUrl"
|
|
|
|
|
:data="{ customerId: customerId }"
|
|
|
|
|
:show-file-list="true"
|
|
|
|
|
:limit="3"
|
|
|
|
|
:file-list="scope.row.imgList"
|
|
|
|
|
:on-success="res => handleImgSuccess(res, scope.row)"
|
|
|
|
|
:on-remove="res => handleImgRemove(res, scope.row)"
|
|
|
|
|
list-type="picture"
|
|
|
|
|
:before-upload="beforeImgUpload"
|
|
|
|
|
>
|
|
|
|
|
<i class="el-icon-plus avatar-uploader-icon"></i>
|
|
|
|
|
最多三张图片
|
|
|
|
|
</el-upload>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div v-else class="div-content">
|
|
|
|
|
<el-image
|
|
|
|
|
v-if="scope.row.imgList.length > 0"
|
|
|
|
|
style="width: 100px; height: 50px"
|
|
|
|
|
:src="scope.row.imgList[0]"
|
|
|
|
|
fit="cover"
|
|
|
|
|
:preview-src-list="scope.row.imgList"
|
|
|
|
|
></el-image>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
|
|
<el-table-column prop="reviewTime" label="拟复查时间" align="center" width="200px">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-date-picker
|
|
|
|
|
v-if="scope.row.isEdit"
|
|
|
|
|
v-model="scope.row.reviewTime"
|
|
|
|
|
type="date"
|
|
|
|
|
class="input-width"
|
|
|
|
|
value-format="yyyy-MM-dd"
|
|
|
|
|
placeholder="选择日期"
|
|
|
|
|
></el-date-picker>
|
|
|
|
|
<div v-else class="div-content">{{ scope.row.reviewTime }}</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
|
|
<el-table-column v-if="!disabled" fixed="right" label="操作" align="center" width="120">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<template v-if="scope.row.isEdit">
|
|
|
|
|
<el-button @click="handleEdit(scope.row)" type="text" size="small" class="btn-color-edit">保存</el-button>
|
|
|
|
|
<el-button @click="handleChange(scope.row, 'cancle')" type="text" size="small" class="btn-color-edit">取消</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else>
|
|
|
|
|
<el-button v-if="formType == 'edit'" @click="handleChange(scope.row, 'edit')" type="text" size="small" :disabled="disabled" class="btn-color-edit">
|
|
|
|
|
修改
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-popconfirm v-if="formType == 'edit'" title="删除之后无法恢复，确认删除？" @onConfirm="del(scope.row)" @confirm="del(scope.row)">
|
|
|
|
|
<el-button slot="reference" type="text" size="small" class="btn-color-del" style="margin-left: 10px">删除</el-button>
|
|
|
|
|
</el-popconfirm>
|
|
|
|
|
</template>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import { requestPost, requestGet } from '@/js/dai/request';
|
|
|
|
|
export default {
|
|
|
|
|
props: {
|
|
|
|
|
id: {
|
|
|
|
|
type: String,
|
|
|
|
|
default: ''
|
|
|
|
|
},
|
|
|
|
|
info: {
|
|
|
|
|
type: Object,
|
|
|
|
|
default: () => ({})
|
|
|
|
|
},
|
|
|
|
|
disabled: {
|
|
|
|
|
type: Boolean,
|
|
|
|
|
default: false
|
|
|
|
|
},
|
|
|
|
|
formType: {
|
|
|
|
|
type: String,
|
|
|
|
|
default: ''
|
|
|
|
|
},
|
|
|
|
|
source: {
|
|
|
|
|
//展示来源：manage 管理平台 visiual 可视化平台
|
|
|
|
|
type: String,
|
|
|
|
|
default: 'manage'
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
uploadUrl: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadqrcodeV2',
|
|
|
|
|
customerId: localStorage.getItem('customerId'),
|
|
|
|
|
|
|
|
|
|
btnDisabled: false,
|
|
|
|
|
btnType: 'cancle',
|
|
|
|
|
isEdit: false,
|
|
|
|
|
tableData: [],
|
|
|
|
|
tempRow: {},
|
|
|
|
|
|
|
|
|
|
optionResult: [
|
|
|
|
|
{
|
|
|
|
|
label: '异常',
|
|
|
|
|
value: '0'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: '正常',
|
|
|
|
|
value: '1'
|
|
|
|
|
}
|
|
|
|
|
],
|
|
|
|
|
optionStaff: [
|
|
|
|
|
// {
|
|
|
|
|
// label: "人名",
|
|
|
|
|
// value: "inspectStaffId",
|
|
|
|
|
// },
|
|
|
|
|
]
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
computed: {
|
|
|
|
|
allowOperate() {
|
|
|
|
|
const {
|
|
|
|
|
info: { agencyId }
|
|
|
|
|
} = this;
|
|
|
|
|
return agencyId && agencyId == this.$store.state.user.agencyId;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
watch: {
|
|
|
|
|
id: {
|
|
|
|
|
handler(val) {
|
|
|
|
|
if (val.length > 0) {
|
|
|
|
|
this.btnDisabled = false;
|
|
|
|
|
this.getList();
|
|
|
|
|
} else this.btnDisabled = true;
|
|
|
|
|
},
|
|
|
|
|
immediate: true
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
created() {
|
|
|
|
|
this.getOptionStaff();
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
methods: {
|
|
|
|
|
beforeImgUpload(file) {
|
|
|
|
|
console.log(file);
|
|
|
|
|
const isLt1M = file.size / 1024 / 1024 < 10;
|
|
|
|
|
const srcType = file.type;
|
|
|
|
|
const format = file.name.split('.').pop();
|
|
|
|
|
|
|
|
|
|
if (!isLt1M) {
|
|
|
|
|
this.$message.error('上传文件大小不能超过 10MB!');
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
if (srcType.indexOf('image') == -1) {
|
|
|
|
|
this.$message.error('仅限图片格式');
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
return true;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
handleImgSuccess(res, row) {
|
|
|
|
|
if (res.code === 0 && res.msg === 'success') {
|
|
|
|
|
row.imgList.push(res.data.url);
|
|
|
|
|
this.computeImgShowList(row);
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error(res.msg);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
computeImgShowList(row) {
|
|
|
|
|
row.imgShowList = row.imgList.map(url => {
|
|
|
|
|
return { name: '', url };
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
handleImgRemove(file, row) {
|
|
|
|
|
let url = file.url || file.response.data.url;
|
|
|
|
|
if (url) {
|
|
|
|
|
row.imgList = row.imgList.filter(item => item !== url);
|
|
|
|
|
this.computeImgShowList(row);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
getRowClass({ rowIndex, columnIndex }) {
|
|
|
|
|
if (rowIndex === 0) {
|
|
|
|
|
return 'background: #2195fe; color: #fff;';
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
handleChange(row, type) {
|
|
|
|
|
if (type == 'cancle') {
|
|
|
|
|
row = { ...this.tempRow };
|
|
|
|
|
row.isEdit = false;
|
|
|
|
|
if (this.btnType == 'add') this.tableData.pop();
|
|
|
|
|
this.getList();
|
|
|
|
|
} else {
|
|
|
|
|
this.tempRow = { ...row };
|
|
|
|
|
row.isEdit = true;
|
|
|
|
|
}
|
|
|
|
|
this.btnType = type;
|
|
|
|
|
this.isEdit = !this.isEdit;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
handleChangeStaff(row) {
|
|
|
|
|
const { staffId } = row;
|
|
|
|
|
const { optionStaff } = this;
|
|
|
|
|
let item = optionStaff.find(item => item.value == staffId);
|
|
|
|
|
if (item) {
|
|
|
|
|
row.staffName = item.name;
|
|
|
|
|
row.mobile = item.mobile;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
async getOptionStaff() {
|
|
|
|
|
let url = `/data/aggregator/org/staff-select-list/${this.$store.state.user.agencyId}`;
|
|
|
|
|
const { data, code, msg } = await requestPost(url, {});
|
|
|
|
|
|
|
|
|
|
if (code === 0) {
|
|
|
|
|
this.optionStaff = data || [];
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error('请求工作人员数据失败！');
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
async handleEdit(row) {
|
|
|
|
|
if (row.result == '0' && row.reviewTime == '') {
|
|
|
|
|
this.$message.error('拟复查时间不能为空');
|
|
|
|
|
} else {
|
|
|
|
|
if (this.btnType == 'add') this.save(row);
|
|
|
|
|
else this.edit(row);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
handleAdd() {
|
|
|
|
|
this.btnType = 'add';
|
|
|
|
|
this.isEdit = true;
|
|
|
|
|
|
|
|
|
|
const item = {
|
|
|
|
|
isEdit: true,
|
|
|
|
|
enterpriseId: this.id,
|
|
|
|
|
patrolTime: '',
|
|
|
|
|
staffId: '',
|
|
|
|
|
staffName: '',
|
|
|
|
|
mobile: '',
|
|
|
|
|
result: '',
|
|
|
|
|
reviewTime: '',
|
|
|
|
|
imgList: []
|
|
|
|
|
};
|
|
|
|
|
this.computeImgShowList(item);
|
|
|
|
|
this.tableData.push(item);
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
async save(row) {
|
|
|
|
|
const params = {
|
|
|
|
|
enterpriseId: this.id,
|
|
|
|
|
...row
|
|
|
|
|
};
|
|
|
|
|
const url = `/gov/org/enterprise/addorupdate-patrol`;
|
|
|
|
|
const { data, code, msg } = await requestPost(url, params);
|
|
|
|
|
if (code === 0) {
|
|
|
|
|
this.$message.success('保存成功');
|
|
|
|
|
row.isEdit = false;
|
|
|
|
|
this.isEdit = false;
|
|
|
|
|
this.btnType = 'cancle';
|
|
|
|
|
this.getList();
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error(msg);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
async edit(row) {
|
|
|
|
|
const params = {
|
|
|
|
|
...row
|
|
|
|
|
};
|
|
|
|
|
const url = `/gov/org/enterprise/addorupdate-patrol`;
|
|
|
|
|
const { data, code, msg } = await requestPost(url, params);
|
|
|
|
|
if (code === 0) {
|
|
|
|
|
this.$message.success('保存成功');
|
|
|
|
|
row.isEdit = false;
|
|
|
|
|
this.isEdit = false;
|
|
|
|
|
this.getList();
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error(msg);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
async del(row) {
|
|
|
|
|
const url = `/gov/org/enterprise/del-patrol/${row.patrolId}`;
|
|
|
|
|
const { data, code, msg } = await requestPost(url);
|
|
|
|
|
|
|
|
|
|
if (code === 0) {
|
|
|
|
|
this.$message.success('删除成功');
|
|
|
|
|
this.getList();
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error(msg);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
async getList() {
|
|
|
|
|
const url = `/gov/org/enterprise/patrollist/${this.id}`;
|
|
|
|
|
console.log('getList---------------------------------------------------------------------------', url);
|
|
|
|
|
const { data, code, msg } = await requestPost(url);
|
|
|
|
|
if (code === 0) {
|
|
|
|
|
console.log('data', data);
|
|
|
|
|
this.tableData = data.list.map(item => {
|
|
|
|
|
this.computeImgShowList(item);
|
|
|
|
|
return {
|
|
|
|
|
...item,
|
|
|
|
|
isEdit: false
|
|
|
|
|
};
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error(msg);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
@import '@/assets/scss/buttonstyle.scss';
|
|
|
|
|
@import '@/assets/scss/modules/management/list-main.scss';
|
|
|
|
|
.m-record h3{
|
|
|
|
|
font-size: 1.17em;
|
|
|
|
|
&::before {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.mt10 {
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
}
|
|
|
|
|
.input-width {
|
|
|
|
|
width: 170px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
