kd-aiot-frontend-eam/src/views/maintenance/repair/planRepair/index.vue

<template>
  <div class="ele-body">
     <el-card shadow="never" v-loading="loading">
	   <maintenance-search @search="reload">
	   </maintenance-search>
	   <!-- 数据表格 -->
	   <ele-pro-table
	     ref="table"
	     :columns="columns"
	     :datasource="datasource"
	     cache-key="systemRoleTable"
	   >
	     <!-- 表头工具栏 -->
	     <template v-slot:toolbar>
	       <el-button
	         size="small"
	         type="primary"
	         icon="el-icon-plus"
	         class="ele-btn-icon"
	         @click="jumpAdd()"
	       >
	         新增维修计划
	       </el-button>
<!-- 		   <el-button
		     size="small"
		     type="primary"
		     class="ele-btn-icon"
		     @click="goDetail({id:12})"
		   >
		     详情
		   </el-button> -->
	     </template>
<!-- 	     <template v-slot:enable="{ row }">
	       <el-switch
	         v-model="row.enable"
	         active-color="#13ce66"
	         inactive-color="#ff4949"
	         :active-value="1"
	         :inactive-value="0"
	         @change="changeEnable(row)"
	       >
	       </el-switch>
	     </template> -->
	     <!-- 操作列 -->
	     <template v-slot:action="{ row }">
	       <el-link
	         type="primary"
	         :underline="false"
	         icon="el-icon-edit"
	         @click="toEdit(row)"
	       >
	         编辑
	       </el-link>
				 <el-popconfirm
				   class="ele-action"
				   title="确认撤销这条报修记录吗？"
				   @confirm="cancel(row)"
				 >
				   <template v-slot:reference>
				     <el-link type="danger" :underline="false" icon="el-icon-delete">
				       撤回
				     </el-link>
				   </template>
				 </el-popconfirm>
	     </template>
	   </ele-pro-table>
     </el-card>
	 
	 <!-- 详情 -->
	 <DetailDialog ref="detailDialogRef" />

  </div>
</template>

<script>
  import MaintenanceSearch from './components/maintenance-search.vue';
  import DetailDialog from './components/detailDialog.vue';
  import { getPlanList , removePlan } from '@/api/maintenance/repair_report';
  import dictMixins from '@/mixins/dictMixins';
  export default {
	mixins: [dictMixins],
    components: {
      MaintenanceSearch,
	  DetailDialog
    },
    data () {
      return {
		// 表格列配置
		columns: [
		  {
		    columnKey: 'index',
		    label: '序号',
		    type: 'index',
		    width: 55,
		    align: 'center',
		    showOverflowTooltip: true,
		    fixed: 'left'
		  },
		  {
		    prop: 'code',
		    label: '计划单号',
		    align: 'center',	
		    showOverflowTooltip: true,
		    minWidth: 110
		  },
		  {
		    prop: 'name',
		    label: '计划名称',
		    align: 'center',
		    showOverflowTooltip: true,
		    minWidth: 110
		  },
		  {
		    prop: 'number',
		    label: '报修设备数量',
		    align: 'center',	
		    showOverflowTooltip: true,
		    minWidth: 110
		  },
		  {
		    prop: 'planStatus',
		    label: '状态',
		    align: 'center',	
		    showOverflowTooltip: true,
		    minWidth: 110,
			formatter: (_row, _column, cellValue) => {
			  return this.getDictValue('维修计划状态', _row.planStatus);
			}
		  },
		  {
		    prop: 'executor',
		    label: '创建人',
		    align: 'center',	
		    showOverflowTooltip: true,
		    minWidth: 110
		  },
		  {
		    prop: 'createTime',
		    label: '创建时间',
		    align: 'center',
		    showOverflowTooltip: true,
		    minWidth: 110,
		    formatter: (_row, _column, cellValue) => {
		      return this.$util.toDateString(cellValue);
		    }
		  },
		  {
		    columnKey: 'action',
		    label: '操作',
		    width: 150,
		    align: 'center',
		    resizable: false,
		    slot: 'action',
		    showOverflowTooltip: true
		  }
		],
        // 加载状态
        loading: false,
        infoData: {},
        repairInfoLogs: [],
        addDialogTitle: '新增报修记录',
        detailsDialogTitle: '报修记录详情',
        deviceInfo: {}, //设备信息
		
      };
    },
    computed: {

    },
	created () {
	  this.requestDict('维修计划状态')
	},
    methods: {
      /* 表格数据源 */
      datasource({ page, limit, where, order }) {
        return getPlanList({ pageNum: page, size: limit, ...where });
      },
      async changeEnable(row) {
        const res = await putRoles(row);
        if (res.code == 0) {
          this.$message({
            type: 'success',
            message: '修改成功',
            customClass: 'ele-message-border'
          });
          this.reload();
        }
      },
      /* 刷新表格 */
      reload(where) {
        this.$refs.table.reload({ page: 1, where });
      },
	  
	  jumpAdd(){
		  this.$router.push({
			path: '/maintenance/repair/maintenancePlan/add'
		  })
	  },
	  toEdit({id}){
		  this.$router.push({
		    path: '/maintenance/repair/maintenancePlan/add',
		  	query: {id}
		  })
	  },
	  
	  goDetail(row){
		  this.$refs.detailDialogRef.openDeatailDialog(row)
	  },
		// 撤销
		cancel(row){
			removePlan([row.id]).then(res=>{
				this.$message.success('撤销成功！')
				this.reload()
			})	  
		}
	  
    }
  };
</script>

<style lang="scss" scoped>

</style>