1
MrShi
2025-01-06 d7dca690cedd12e271f0ee0b9050679d73796f5c
admin/src/views/Inspection/components/OperaYwPatrolLineWindow.vue
@@ -1,5 +1,5 @@
<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 />
@@ -8,13 +8,13 @@
        <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">
@@ -32,28 +32,60 @@
    </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 {
      // 表单数据
@@ -61,14 +93,29 @@
        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() {
@@ -77,16 +124,28 @@
    })
  },
  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 => {
@@ -94,12 +153,44 @@
        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)
@@ -109,37 +200,37 @@
    },
    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
    },