cuijian
2025-07-28 accebdce93486d3b4f26e55ffdea047549cce20c
src/views/mdc/base/modules/deviceRepair/DeviceRepairList.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,638 @@
<template>
  <div class="device_list">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="background-color: #fff" class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24" style="width: 100%;">
          <a-col :md="7" :sm="7">
            <a-form-item label="时间">
              <a-range-picker @change="dateParamChange" v-model="dates"  format="YYYY-MM-DD HH:mm:ss"/>
            </a-form-item>
          </a-col>
          <a-col :md="5" :sm="5">
            <a-form-item label="设备编号">
              <a-input placeholder="输入设备编号查询" v-model="queryParams.equipmentId"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="5" :sm="5" :xs="5">
            <a-form-item label="安装位置">
              <a-input placeholder="输入安装位置查询" v-model="queryParams.equipmentName"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="2" :sm="2" :xs="2">
            <a-space>
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload">重置</a-button>
            </a-space>
          </a-col>
          <!--<a-col :md="2" :sm="3" :xs="3">-->
            <!--<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>-->
          <!--</a-col>-->
          <!--<a-col :md="2" :sm="2" :xs="2">-->
            <!--<a-button type="primary" @click="searchReset" icon="reload">重置</a-button>-->
          <!--</a-col>-->
          <!--<a-col :lg="2" :md="3" :sm="3" :xs="3">-->
            <!--&lt;!&ndash;<a-button type="primary" @click="exportExcel" icon="download">导出</a-button>&ndash;&gt;-->
            <!--<a-button type="primary" @click="handleExportXls('维修休班管理')" icon="download">导出</a-button>-->
          <!--</a-col>-->
        </a-row>
      </a-form>
    </div>
    <!-- æ“ä½œæŒ‰é’®åŒºåŸŸ -->
    <div class="table-operator" style="display: inline;">
      <a-button  @click="handleAdd" type="primary" icon="plus">新增
      </a-button>
      <a-button type="primary" @click="handleExportXls('维修休班管理')" icon="download">导出</a-button>
      <!--<a-button v-has="'user.add'"  @click="handleAddXIU" type="primary" icon="plus">休班新增-->
      <!--</a-button>-->
    </div>
    <!-- table区域-begin -->
    <div id="DeviceList" style="flex: 1;overflow: hidden">
      <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns"
               :dataSource="dataSource" :pagination="ipagination" :loading="loading"
               :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
               @change="handleTableChange" :scroll="{x:'max-content',y:scrollY}">
        <span slot="action" slot-scope="text, record">
        <a @click="handleEdit(record)">编辑</a>
            <a-divider type="vertical" />
          <a @click="handleDelete(record.id)">删除</a>
        </span>
        <!--字符串超长截取省略号显示-->
        <span slot="num" slot-scope="text" style="font-weight: bold">
          <j-ellipsis :value="text" :length="8"/>
        </span>
        <span slot="name" slot-scope="text" style="font-weight: bold">
          <j-ellipsis :value="text" :length="8"/>
        </span>
        <span slot="model" slot-scope="text" style="font-weight: bold">
          <j-ellipsis :value="text" :length="8"/>
        </span>
      </a-table>
    </div>
    <!-- table区域-end -->
    <device-repair-model ref="modalForm" :equipmentId="queryParams.equipmentId" @ok="modalFormOk"></device-repair-model>
    <!--<device-repair-model-add  ref="modalFormadd" @ok="modalFormOk"></device-repair-model-add>-->
    <device-repair-model-edit ref="modalFormedit" @ok="modalFormOk"></device-repair-model-edit>
    <!--<repair-model ref="repairModelFrom" @ok="modalFormOk">0</repair-model>-->
  </div>
</template>
<script>
  import moment from 'moment'
  import $ from 'jquery'
  import JDictSelectTag from '@/components/dict/JDictSelectTag'
  import JDate from '../../../../../components/jeecg/JDate'
  import {
    requestPut,
    deleteAction,
    getAction
  } from '@/api/manage'
  import DeviceRepairModel from './DeviceRepairModel'
  import DeviceRepairModelAdd from './DeviceRepairModelAdd'
  import DeviceRepairModelEdit from './DeviceRepairModelEdit'
  import '@/components/table2excel/table2excel'
  import {
    JeecgListMixin
  } from '@/mixins/JeecgListMixin'
  import JInput from '@/components/jeecg/JInput'
  import JEllipsis from '@/components/jeecg/JEllipsis'
  import Tooltip from 'ant-design-vue/es/tooltip'
  import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api'
  import ACol from 'ant-design-vue/es/grid/Col'
  export default {
    name: 'DeviceRepairList',
    mixins: [JeecgListMixin],
    components: {
      ACol,
      Tooltip,
      DeviceRepairModel,
      DeviceRepairModelAdd,
      DeviceRepairModelEdit,
      JDictSelectTag,
      JInput,
      JDate,
      JEllipsis
    },
    props: {  nodeTree: '', Type:'',nodePeople: '' },
    data() {
      return {
        typeTree:"",
        typeParent:1,
        typeEquipment:1,
        dates: [],
        xianshi:"",
        readOnly:true,
        queryParam: {},
        queryParams:{},
        queryParamEquip:{},
        queryParamPeople:{},
        dataStartsoucre:[],
        scrollY:465,
        /* åˆ†é¡µå‚æ•° */
        ipagination:{
          current: 1,
          pageSize: 30,
          pageSizeOptions: ['30', '50', '100'],
          showTotal: (total, range) => {
            return range[0] + "-" + range[1] + " å…±" + total + "条"
          },
          showQuickJumper: true,
          showSizeChanger: true,
          total: 0
        },
        columns: [
          {
            title: '设备编号',
            align: 'center',
            dataIndex: 'equipmentId',
            width:250
          },
          {
            title: '设备名称',
            align: 'center',
            dataIndex: 'equipmentName',
            defaultSortOrder:'descend',
            sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1},
            width:250
          },
          {
            title: '维修类型',
            align: 'center',
            dataIndex: 'mdcRepairTypeDictText',
            width:250
          },
          {
            title: '开始时间',
            align: 'center',
            dataIndex: 'startTime',
            width:250
            // scopedSlots:{customRender:'startTime'},
            // customRender:(text,row,index) => {
            //   return moment(text).format("YYYY-MM-DD HH:mm:ss")
            // }
          },
          {
            title: '结束时间',
            align: 'center',
            dataIndex: 'endTime',
            width:250
          },
          {
            title: '操作',
            dataIndex: 'action',
            scopedSlots: {customRender: 'action'},
            align: "center",
            width: 150,
            fixed:'right'
          }
        ],
        url: {
          list: '/mdc/mdcEquipmentRepair/pageList',
          deleteBatch: '/mdc/mdcEquipmentRepair/delete',
          getEquipmentByPid: '/mdc/mdcequipment/getEquipmentByPid',
          exportXlsUrl:'/mdc/mdcEquipmentRepair/exportXls'
        }
      }
    },
    watch:{
      Type(valmath){
        this.dataList = [];
        this.queryParams.typeTree = valmath
        // console.log(this.queryParams.typeTree)
      },
      nodeTree(val) { //监听currSelected å˜åŒ–,将变化后的数值传递给 getCurrSelected äº‹ä»¶
        if (JSON.stringify(val) != '{}') {
          if (val.equipmentId) {
            this.queryParamEquip.parentId =  ""
            this.queryParams.equipmentId = val.equipmentId
            this.queryParamEquip.equipmentId = val.equipmentId
          } else {
            this.queryParamEquip.parentId = val.key
            this.queryParams.equipmentId =''
          }
        }else{
          this.queryParams.equipmentId=''
          this.queryParamEquip.parentId = ""
        }
        this.searchQuery()
      },
      nodePeople(val){
        if (JSON.stringify(val) != '{}') {
          if (val.equipmentId) {
            this.queryParamEquip.parentId =  ""
            this.queryParams.equipmentId = val.equipmentId
            this.queryParamEquip.equipmentId = val.equipmentId
          } else {
            this.queryParamPeople.parentId = val.key
            this.queryParams.equipmentId = ''
          }
          this.searchQuery()
        }
      }
    },
    methods: {
      dateParamChange(v1, v2) {
        // console.log(v1,v2)
        this.queryParam.startTime = v2[0]
        this.queryParam.endTime = v2[1]
        // console.log(v2[0],v2[1])
      },
      onChange(value, dateString) {
        // console.log('Selected Time: ', value);
        // console.log('Formatted Selected Time: ', dateString);
      },
      onOk(value) {
        console.log('onOk: ', value);
      },
      searchReset() {
        if(this.queryParams.typeTree == "1"){
          this.typeTree = this.queryParams.typeTree
          this.typeParent =  this.queryParams.parentId
          this.typeEquipment = this.queryParams.equipmentId
          this.queryParams = {}
          this.queryParam = {}
          this.dates = []
          this.queryParams.typeTree = this.typeTree
          this.queryParams.parentId = this.typeParent
          if(this.queryParams.parentId !=  ""){
            this.queryParams.equipmentId =  ""
          }else{
            if(this.queryParams.equipmentId == this.queryParamEquip.equipmentId){
              this.queryParams.equipmentId =  this.typeEquipment
            }else{
              this.queryParams.equipmentId = this.queryParamEquip.equipmentId
            }
          }
          this.ipagination.current = 1
          this.ResetloadData();
        }else{
          this.typeTree = this.queryParams.typeTree
          this.typeParent =  this.queryParams.parentId
          // this.typeEquipment = this.queryParams.equipmentId
          this.queryParams = {}
          this.queryParam = {}
          this.dates = []
          this.queryParams.typeTree = this.typeTree
          this.queryParams.parentId = this.typeParent
          // this.queryParams.equipmentId =  this.typeEquipment
          this.ipagination.current = 1
          this.ResetloadData();
        }
      },
      ResetloadData() {
        if(!this.url.list){
          this.$message.error("请设置url.list属性!")
          return
        }
        //加载数据 è‹¥ä¼ å…¥å‚æ•°1则加载第一页的内容
        var params = this.getQueryParams();//查询条件
        if(!params){
          return false;
        }
        params.typeTree = this.queryParams.typeTree
        params.parentId = this.queryParams.parentId
        params.equipmentId = this.queryParams.equipmentId
        this.loading = true;
        getAction(this.url.list, params).then((res) => {
          if (res.success) {
            this.dataSource = res.result.records||res.result;
            // this.initDeviceType(this.dataSource)
            //update-begin---author:zhangyafei    Date:20201118  for:适配不分页的数据列表------------
            // this.dataSource = res.result.records||res.result;
            if(res.result.total)
            {
              this.ipagination.total = res.result.total;
            }else{
              this.ipagination.total = 0;
            }
            //update-end---author:zhangyafei    Date:20201118  for:适配不分页的数据列表------------
          }else{
            // this.$message.warning(res.message)
            this.$notification.warning({
              message:'消息',
              description:res.message
            });
          }
        }).finally(() => {
          this.loading = false
        })
      },
      handleEdit: function (record) {
        this.$refs.modalFormedit.edit(record);
        this.$refs.modalFormedit.title = "编辑";
        this.$refs.modalFormedit.disableSubmit = false;
      },
      handleTableChange(pagination, filters, sorter) {
        this.dataSource = []
        //分页、排序、筛选变化时触发
        //TODO ç­›é€‰
        // console.log(pagination)
        if (Object.keys(sorter).length > 0) {
          this.isorter.column = sorter.field;
          this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
        }
        this.ipagination = pagination;
        //获取查询条件
        let sqp = {}
        if(this.superQueryParams){
          sqp['superQueryParams']=encodeURI(this.superQueryParams)
          sqp['superQueryMatchType'] = this.superQueryMatchType
        }
        var param = Object.assign(sqp, this.queryParams, this.isorter ,this.filters);
        param.pageNo = this.ipagination.current;
        param.pageSize = this.ipagination.pageSize;
        param.field = this.getQueryField();
        param.parentId = this.queryParams.parentId;
        param.equipmentId = this.queryParams.equipmentId;
        param.startTime = this.queryParam.startTime;
        param.endTime =  this.queryParam.endTime;
        getAction(this.url.list,param).then((res) => {
          if(res.success){
            this.dataSource = res.result.records||res.result;
            if(res.result.total)
            {
              this.ipagination.total = res.result.total;
            }else{
              this.ipagination.total = 0;
            }
          }else{
            // this.$message.warning(res.message)
            this.$notification.warning({
              message:'消息',
              description:res.message
            });
          }
        }).finally(() => {
          this.loading = false
        })
      },
      searchQueryEdit(){
        if(this.queryParams.typeTree == "1"){
          this.queryParams.parentId =  this.queryParamEquip.parentId
        }else{
          this.queryParams.parentId = this.queryParamPeople.parentId
          this.queryParams.equipmentIds = ""
        }
        this.dataSource = [];
        //获取查询条件
        let sqp = {}
        if(this.superQueryParams){
          sqp['superQueryParams']=encodeURI(this.superQueryParams)
          sqp['superQueryMatchType'] = this.superQueryMatchType
        }
        var param = Object.assign(sqp, this.queryParams, this.isorter ,this.filters);
        param.pageNo = this.ipagination.current;
        param.pageSize = this.ipagination.pageSize;
        param.field = this.getQueryField();
        param.parentId = this.queryParams.parentId;
        param.equipmentId = this.queryParams.equipmentId;
        param.startTime = this.queryParam.startTime;
        param.endTime =  this.queryParam.endTime;
        getAction(this.url.list,param).then((res) => {
          if(res.success){
            this.dataSource = res.result.records||res.result;
            if(res.result.total)
            {
              this.ipagination.total = res.result.total;
            }else{
              this.ipagination.total = 0;
            }
          }else{
            // this.$message.warning(res.message)
            this.$notification.warning({
              message:'消息',
              description:res.message
            });
          }
        }).finally(() => {
          this.loading = false
        })
      },
      searchQuery(){
        if(this.queryParams.typeTree == "1"){
          this.queryParams.parentId =  this.queryParamEquip.parentId
          // this.queryParams.equipmentId =  this.queryParamEquip.equipmentId
        }else{
          this.queryParams.parentId = this.queryParamPeople.parentId
          // this.queryParams.equipmentId = ""
        }
        this.dataSource = [];
        //获取查询条件
        let sqp = {}
        if(this.superQueryParams){
          sqp['superQueryParams']=encodeURI(this.superQueryParams)
          sqp['superQueryMatchType'] = this.superQueryMatchType
        }
        var param = Object.assign(sqp, this.queryParams, this.isorter ,this.filters);
        param.pageNo = 1;
        param.pageSize = this.ipagination.pageSize;
        param.field = this.getQueryField();
        param.parentId = this.queryParams.parentId;
        param.equipmentId = this.queryParams.equipmentId;
        param.startTime = this.queryParam.startTime;
        param.endTime =  this.queryParam.endTime;
        // console.log(param);
        getAction(this.url.list,param).then((res) => {
          if(res.success){
            this.dataSource = res.result.records||res.result;
            if(res.result.total)
            {
              this.ipagination.total = res.result.total;
            }else{
              this.ipagination.total = 0;
            }
          }else{
            // this.$message.warning(res.message)
            this.$notification.warning({
              message:'消息',
              description:res.message
            });
          }
        }).finally(() => {
          this.loading = false
        })
      },
      loadData(arg) {
        if(!this.url.list){
          this.$message.error("请设置url.list属性!")
          return
        }
        //加载数据 è‹¥ä¼ å…¥å‚æ•°1则加载第一页的内容
        if (arg === 1) {
          this.ipagination.current = 1;
        }
        var params = this.getQueryParams();//查询条件
        if(!params){
          return false;
        }
        this.loading = true;
        getAction(this.url.list, params).then((res) => {
          if (res.success) {
            this.dataSource = res.result.records||res.result;
            // this.initDeviceType(this.dataSource)
            //update-begin---author:zhangyafei    Date:20201118  for:适配不分页的数据列表------------
            // this.dataSource = res.result.records||res.result;
            if(res.result.total)
            {
              this.ipagination.total = res.result.total;
            }else{
              this.ipagination.total = 0;
            }
            //update-end---author:zhangyafei    Date:20201118  for:适配不分页的数据列表------------
          }else{
            // this.$message.warning(res.message)
            this.$notification.warning({
              message:'消息',
              description:res.message
            });
          }
        }).finally(() => {
          this.loading = false
        })
      },
      modalFormOk(val) {
        // æ–°å¢ž/修改 æˆåŠŸæ—¶ï¼Œé‡è½½åˆ—è¡¨
        this.searchQueryEdit();
        // this.$emit('openBasetree','')
        this.selectedRowKeys = []
      },
      handleDelete: function (id) {
        if(!this.url.deleteBatch){
          this.$message.error("请设置url.delete属性!")
          return
        }
        var that = this;
        deleteAction(that.url.deleteBatch, {id: id}).then((res) => {
          if (res.success) {
            //重新计算分页问题
            that.reCalculatePage(1)
            // that.$message.success(res.message);
            that.$notification.success({
              message:'消息',
              description:res.message
            });
            that.searchQuery();
          } else {
            // that.$message.warning(res.message);
            that.$notification.warning({
              message:'消息',
              description:res.message
            });
          }
        });
      },
      /**
       * æ‰“开新增维修或休班弹窗
       */
      handleAdd() {
        this.$refs.modalForm.add(this.node)
        this.$refs.modalForm.title = '新增'
        this.$refs.modalForm.disableSubmit = false
      },
      // handleAddXIU() {
      //   this.$refs.modalFormadd.add()
      //   this.$refs.modalFormadd.title = '新增'
      //   this.$refs.modalFormadd.disableSubmit = false
      // },
      pQuery(parentId) {
        this.queryParam.parentId = parentId[0]
        if(this.selectedRowKeys.length >= 1) {
          this.selectedRowKeys.length = 0
        }
        this.loadData()
      },
      onSelectChange(selectedRowKeys) {
        this.selectedRowKeys = selectedRowKeys
      },
      initEquipment(id) {
        let _this = this
        getAction(this.url.getEquipmentByPid, { pid: id }).then((res) => {
          if (res.success) {
            if (res.result) {
              _this.$set(this.queryParams, 'equipmentName', res.result.equipmentName)
              _this.$set(this.queryParams, 'equipmentId', res.result.equipmentId)
              _this.equipment = res.result
              _this.searchQuery()
            } else {
              // _this.$message.warning('请配置设备!')
              _this.$notification.warning({
                message:'消息',
                description:"请配置设备!"
              });
            }
          }
        })
      },
      exportExcel() {
        $("#DeviceList").table2excel({
          exclude: ".noExl",
          name: "Excel Document Name",
          filename: "维修休班管理",
          exclude_img: true,
          fileext: ".xls",
          exclude_links: true,
          exclude_inputs: true
        });
      },
      /**
       * å½“浏览器可视窗口尺寸发生改变时触发
       */
      handleWindowResize(){
        const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2)
        const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2)
        this.scrollY = boxHeight - tableHeadHeight - 50
      }
    },
    created() {
      this.queryParam.typeTree = "1"
    },
    mounted(){
      window.addEventListener('resize',this.handleWindowResize)
      this.handleWindowResize()
    },
    beforeDestroy(){
      window.removeEventListener('resize',this.handleWindowResize)
    }
  }
</script>
<style lang="less" scoped>
  @import '~@assets/less/common.less';
  .device_list{
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }
  @media screen and (min-width: 1920px){
    .device_list{
      height: 811px!important;
    }
  }
  @media screen and (min-width: 1680px) and (max-width: 1920px){
    .device_list{
      height: 811px!important;
    }
  }
  @media screen and (min-width: 1400px) and (max-width: 1680px){
    .device_list{
      height: 663px!important;
    }
  }
  @media screen and (min-width: 1280px) and (max-width: 1400px){
    .device_list{
      height: 564px!important;
    }
  }
  @media screen and (max-width: 1280px){
    .device_list{
      height: 564px!important;
    }
  }
</style>