| | |
| | | <template> |
| | | <GlobalWindow :title="title" :visible.sync="visible" :confirm-working="isWorking" @confirm="confirm"> |
| | | <GlobalWindow width="800px" :title="title" :visible.sync="visible" :confirm-working="isWorking" @confirm="confirm"> |
| | | <el-form :model="form" ref="form" :rules="rules"> |
| | | <el-form-item label="线路名称" prop="name"> |
| | | <el-input v-model="form.name" placeholder="请输入线路名称" v-trim /> |
| | |
| | | <div class="title">巡检点</div> |
| | | <el-button type="primary" @click="openModal">添加巡检点</el-button> |
| | | </div> |
| | | <el-table v-loading="isWorking.search" :data="list" stripe> |
| | | <el-table :data="list" stripe> |
| | | <el-table-column prop="code" label="巡检点编码" min-width="100px"></el-table-column> |
| | | <el-table-column prop="pointName" label="巡检点名称" min-width="100px"></el-table-column> |
| | | <el-table-column prop="name" label="扫码打卡" min-width="100px"> |
| | | <template v-slot="scope"> |
| | | <el-switch v-model="scope.row.needScancode" @change="changeStatus" active-value="0" |
| | | inactive-value="1"></el-switch> |
| | | <el-switch v-model="scope.row.needScancode" :disabled="true" @change="changeStatus" :active-value="0" |
| | | :inactive-value="1"></el-switch> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="name" label="排序码" min-width="100px"> |
| | |
| | | |
| | | </el-form> |
| | | <!-- --> |
| | | <el-dialog title="添加巡检点" :close-on-click-modal="false" append-to-body :visible.sync="isShowModal" width="500px"> |
| | | <el-select class="w400" v-model="selPoint" clearable multiple filterable> |
| | | <el-dialog title="添加巡检点" :close-on-click-modal="false" append-to-body :visible.sync="isShowModal" width="880px"> |
| | | <!-- <el-select class="w400" v-model="selPoint" clearable multiple filterable> |
| | | <el-option v-for="item in pointList" :value="item.id" :label="item.name"></el-option> |
| | | </el-select> |
| | | </el-select> --> |
| | | <el-form ref="searchForm" :model="searchForm" label-width="80px" inline> |
| | | <el-form-item label="巡检点" prop="name"> |
| | | <el-input v-model="searchForm.name" placeholder="请输入巡检点名称/编码" @keypress.enter.native="search"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="巡检区域"> |
| | | <el-cascader v-model="searchForm.areaIds" @change="changeSel" placeholder="请选择巡检区域" clearable |
| | | :options="areaList" :props="{ |
| | | label: 'name', |
| | | value: 'id', |
| | | children: 'childCategoryList' |
| | | }"></el-cascader> |
| | | </el-form-item> |
| | | <el-button type="primary" @click="initData">搜索</el-button> |
| | | <el-button @click="reset">重置</el-button> |
| | | <el-button type="primary" @click="editClick()" icon="el-icon-plus" |
| | | v-permissions="['business:ywpatrolpoint:create']">新建巡检点</el-button> |
| | | </el-form> |
| | | |
| | | <el-table @selection-change="handleSelectionChange" v-loading="isWorking.search" :data="pointList" stripe> |
| | | <el-table-column type="selection" width="55" align="center" /> |
| | | <el-table-column prop="code" label="巡检点编码" min-width="100px"></el-table-column> |
| | | <el-table-column prop="name" label="巡检点名称" min-width="100px"></el-table-column> |
| | | <el-table-column prop="deviceName" label="关联设备" min-width="100px"></el-table-column> |
| | | <el-table-column prop="areaName" label="巡检区域" min-width="100px"></el-table-column> |
| | | </el-table> |
| | | <pagination class="mt10" @size-change="handleSizeChange" @current-change="handlePageChange" :pagination="pagination"> |
| | | </pagination> |
| | | |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="isShowModal = false">取 消</el-button> |
| | | <el-button type="primary" @click="subModal">确 定</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | <OperaYwPatrolPointWindow ref="operaYwPatrolPointWindow" @success="handlePageChange" /> |
| | | </GlobalWindow> |
| | | </template> |
| | | |
| | | <script> |
| | | import BaseOpera from '@/components/base/BaseOpera' |
| | | import GlobalWindow from '@/components/common/GlobalWindow' |
| | | import { getFetchList } from '@/api/Inspection/ywPatrolPoint' |
| | | import { create,detailById } from '@/api/Inspection/ywPatrolLine' |
| | | import OperaYwPatrolPointWindow from '@/views/Inspection/components/OperaYwPatrolPointWindow' |
| | | import Pagination from '@/components/common/Pagination' |
| | | import { fetchList as getFetchList } from '@/api/Inspection/ywPatrolPoint' |
| | | import { create, updateById, detailById } from '@/api/Inspection/ywPatrolLine' |
| | | import { Message } from 'element-ui' |
| | | import { fetchList } from '@/api/business/category' |
| | | export default { |
| | | name: 'OperaYwPatrolLineWindow', |
| | | extends: BaseOpera, |
| | | components: { GlobalWindow }, |
| | | components: { GlobalWindow, Pagination,OperaYwPatrolPointWindow }, |
| | | data() { |
| | | return { |
| | | // 表单数据 |
| | |
| | | name: '', |
| | | }, |
| | | selPoint: [], |
| | | |
| | | pointList: [], |
| | | selList: [], |
| | | areaList: [], |
| | | searchForm: { |
| | | name: '', |
| | | areaId: '', |
| | | areaIds: [] |
| | | }, |
| | | pagination: { |
| | | pageSize: 10, |
| | | page: 1, |
| | | total: 0 |
| | | }, |
| | | |
| | | list: [], |
| | | isWorking: false, |
| | | isShowModal: false, |
| | | // 验证规则 |
| | | rules: { |
| | | name: [{ required: true, message: '请输入' }], |
| | | selPoint: [{ type: 'array', required: true, message: '请输入' }], |
| | | } |
| | | }, |
| | | } |
| | | }, |
| | | created() { |
| | |
| | | }) |
| | | }, |
| | | methods: { |
| | | editClick(row) { |
| | | this.$refs.operaYwPatrolPointWindow.open('新建巡检点') |
| | | // this.$refs.operaYwPatrolPointWindow.initData() |
| | | }, |
| | | confirm() { |
| | | const { form, list } = this |
| | | if (list.length == 0) return Message.warning('请先选择巡检点') |
| | | form.linePointList = list |
| | | create({ ...form }).then(res => { |
| | | Message.success('保存成功') |
| | | this.$emit('success') |
| | | this.close() |
| | | |
| | | this.$refs['form'].validate((valid) => { |
| | | if (valid) { |
| | | if (list.length == 0) return Message.warning('请先选择巡检点') |
| | | form.linePointList = list |
| | | this.isWorking = true |
| | | let fn = form.id ? updateById : create |
| | | fn({ ...form }).then(res => { |
| | | Message.success('保存成功') |
| | | this.isWorking = false |
| | | this.close() |
| | | }, () => { |
| | | this.isWorking = false |
| | | }) |
| | | } |
| | | }) |
| | | |
| | | }, |
| | | getDetail(row) { |
| | | detailById(row.id).then(res => { |
| | |
| | | this.list = res.linePointList || [] |
| | | }) |
| | | }, |
| | | initData() { |
| | | this.list = [] |
| | | |
| | | getFetchList({}).then(res => { |
| | | this.pointList = res || [] |
| | | getProject() { |
| | | fetchList({ |
| | | model: { type: 4 }, |
| | | capacity: 1000, |
| | | page: 1, |
| | | }).then(res => { |
| | | this.areaList = res.records || [] |
| | | }) |
| | | }, |
| | | initData() { |
| | | const { searchForm, pagination } = this |
| | | getFetchList({ |
| | | page: pagination.page, |
| | | capacity: pagination.pageSize, |
| | | model: { ...searchForm } |
| | | }).then(res => { |
| | | this.pointList = res.records || [] |
| | | this.pagination.total = res.total |
| | | }) |
| | | }, |
| | | handleSelectionChange(val) { |
| | | this.selList = val |
| | | }, |
| | | reset() { |
| | | this.searchForm = { |
| | | name: '', |
| | | areaId: '', |
| | | areaIds: [] |
| | | } |
| | | this.initData() |
| | | }, |
| | | handleSizeChange(val) { |
| | | this.pagination.pageSize = val |
| | | this.initData() |
| | | }, |
| | | handlePageChange(val) { |
| | | this.pagination.page = val |
| | | this.initData() |
| | | }, |
| | | handleDel(row) { |
| | | this.list.splice(row.$index, 1) |
| | |
| | | |
| | | }, |
| | | openModal() { |
| | | this.selPoint = this.list.map(i => i.id) |
| | | this.getProject() |
| | | this.reset() |
| | | this.isShowModal = true |
| | | }, |
| | | changeSel(e) { |
| | | if (e && e.length == 1) { |
| | | } else if (e && e.length == 2) { |
| | | this.$set(this.searchForm, 'areaId', e[1]) |
| | | } else { |
| | | } |
| | | this.initData() |
| | | }, |
| | | subModal() { |
| | | const { selPoint, pointList, list } = this |
| | | if (selPoint.length == 0) return Message.warning('请先选择巡检点') |
| | | let arr = [] |
| | | // 取出选中列表 |
| | | pointList.forEach(item => { |
| | | selPoint.forEach(item2 => { |
| | | if (item.id === item2) { |
| | | arr.push(item) |
| | | } |
| | | }) |
| | | }) |
| | | // 同list去重 |
| | | list.forEach(item => { |
| | | arr.forEach((item2, i) => { |
| | | if (item.id === item2.id) { |
| | | arr.splice(i, 1) |
| | | } |
| | | }) |
| | | }) |
| | | // 添加 |
| | | arr.forEach(i => { |
| | | this.list.push({ |
| | | needScancode: '1', |
| | | pointName: i.name, |
| | | pointId: i.id, |
| | | code: i.code |
| | | }) |
| | | // this.list = this.selList.map(item => { |
| | | // return { |
| | | // needScancode: 0, |
| | | // pointName: item.name, |
| | | // pointId: item.id, |
| | | // code: item.code |
| | | // } |
| | | // }) |
| | | this.selList.forEach(item => { |
| | | const index = this.list.findIndex(i => i.code === item.code) |
| | | if (index === -1) { |
| | | this.list.push({ |
| | | needScancode: 0, |
| | | pointName: item.name, |
| | | pointId: item.id, |
| | | code: item.code |
| | | }) |
| | | } |
| | | }) |
| | | this.isShowModal = false |
| | | }, |