<template> 
 | 
  <TableLayout v-permissions="['ext:workordercheckattrext:findallpage']"> 
 | 
    <!-- 搜索表单 --> 
 | 
    <el-form ref="searchForm" slot="search-form" :model="searchForm" label-suffix=":" label-width="100px" inline> 
 | 
      <el-form-item label="工单编号" prop="workordercode"> 
 | 
        <el-input v-model="searchForm.workordercode" placeholder="请输入工单编号" @keypress.enter.native="search"></el-input> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="工厂" prop="orgId"> 
 | 
        <el-select v-model="searchForm.orgId" filterable clearable placeholder="请选择工厂" @change="selectFactroy"> 
 | 
          <el-option 
 | 
            v-for="item in factories" 
 | 
            :key="item.id" 
 | 
            :label="item.name" 
 | 
            :value="item.id"> 
 | 
          </el-option> 
 | 
        </el-select> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="工序" prop="procedureid"> 
 | 
        <el-select v-model="searchForm.procedureid" :disabled="!searchForm.orgId" clearable filterable placeholder="请选择工序" @change="selectProce"> 
 | 
          <el-option 
 | 
            v-for="item in productes" 
 | 
            :key="item.id" 
 | 
            :label="item.name" 
 | 
            :value="item.id"> 
 | 
          </el-option> 
 | 
        </el-select> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="点检属性" prop="attrId"> 
 | 
        <el-select v-model="searchForm.attrId" :disabled="!searchForm.procedureid" filterable clearable placeholder="请选择点检属性"> 
 | 
          <el-option 
 | 
            v-for="item in checkAttr" 
 | 
            :key="item.id" 
 | 
            :label="item.name" 
 | 
            :value="item.id"> 
 | 
          </el-option> 
 | 
        </el-select> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="填报人员" prop="createUser"> 
 | 
        <el-select v-model="searchForm.createUser" filterable clearable placeholder="请选择"> 
 | 
          <el-option 
 | 
            v-for="(item, index) in creatUsers" 
 | 
            :key="index" 
 | 
            :label="item.name" 
 | 
            :value="item.userId"> 
 | 
          </el-option> 
 | 
        </el-select> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="计划日期" prop="planDate"> 
 | 
        <el-date-picker 
 | 
          size="mini" 
 | 
          value-format="yyyy-MM-dd" 
 | 
          v-model="data" 
 | 
          type="daterange" 
 | 
          range-separator="至" 
 | 
          start-placeholder="开始日期" 
 | 
          end-placeholder="结束日期" 
 | 
          @change="selectDate" 
 | 
        ></el-date-picker> 
 | 
      </el-form-item> 
 | 
      <section> 
 | 
        <el-button type="primary" @click="search">搜索</el-button> 
 | 
        <el-button @click="reset">重置</el-button> 
 | 
      </section> 
 | 
    </el-form> 
 | 
      
 | 
    <!-- 表格和分页 --> 
 | 
    <template v-slot:table-wrap> 
 | 
      <ul class="toolbar"> 
 | 
        <li><el-button type="primary" :loading="isWorking.export" v-permissions="['ext:workordercheckattrext:exportExcel']" @click="exportExcel">导出</el-button></li> 
 | 
      </ul> 
 | 
      <el-table 
 | 
        v-loading="isWorking.search" 
 | 
        :data="tableData.list" 
 | 
        stripe 
 | 
        border 
 | 
        @selection-change="handleSelectionChange" 
 | 
      > 
 | 
        <el-table-column prop="createTime" label="记录时间" min-width="140px"></el-table-column> 
 | 
        <el-table-column prop="userName" label="操作人员" min-width="100px"></el-table-column> 
 | 
        <el-table-column prop="attrName" label="检点属性" min-width="100px"></el-table-column> 
 | 
        <el-table-column prop="val" label="检点属性值" min-width="100px"></el-table-column> 
 | 
        <el-table-column prop="workordercode" label="工单编码" min-width="100px"></el-table-column> 
 | 
        <el-table-column prop="procedureName" label="工序名称" min-width="100px"></el-table-column> 
 | 
      </el-table> 
 | 
      <pagination 
 | 
        @size-change="handleSizeChange" 
 | 
        @current-change="handlePageChange" 
 | 
        :pagination="tableData.pagination" 
 | 
      > 
 | 
      </pagination> 
 | 
    </template> 
 | 
  </TableLayout> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import BaseTable from '@/components/base/BaseTable' 
 | 
import TableLayout from '@/layouts/TableLayout' 
 | 
import Pagination from '@/components/common/Pagination' 
 | 
import { getDepartmentListByConditon } from '@/api/ext/departmentExt' 
 | 
import { productesGroup } from '@/api/ext/proceduresExt' 
 | 
import { getListByCondition } from "@/api/ext/checkAttrExt" 
 | 
import { companyUserExtAllUser } from '@/api/ext/companyUserExt' 
 | 
export default { 
 | 
  name: 'WorkorderCheckAttrExt', 
 | 
  extends: BaseTable, 
 | 
  components: { TableLayout, Pagination }, 
 | 
  data () { 
 | 
    return { 
 | 
      // 搜索 
 | 
      searchForm: { 
 | 
        workordercode: '', 
 | 
        orgId: '', 
 | 
        procedureid: '', 
 | 
        attrId: '', 
 | 
        createUser: '', 
 | 
  
 | 
        startdate: '', 
 | 
        enddate: '' 
 | 
      }, 
 | 
      factories: [], 
 | 
      productes: [], 
 | 
      checkAttr: [], 
 | 
      creatUsers: [], 
 | 
      data: [] 
 | 
    } 
 | 
  }, 
 | 
  created () { 
 | 
    this.config({ 
 | 
      module: '工单类-检点属性关联表', 
 | 
      api: '/ext/workorderCheckAttrExt', 
 | 
      'field.id': 'id', 
 | 
      'field.main': 'id' 
 | 
    }) 
 | 
    getDepartmentListByConditon({ 
 | 
      type: 1 
 | 
    }) 
 | 
      .then(res => { 
 | 
        // console.log(res) 
 | 
        this.factories = res 
 | 
      }) 
 | 
      .catch(err => { 
 | 
        console.log(err) 
 | 
      }) 
 | 
    companyUserExtAllUser({ departmentId: this.$store.state.userInfo.curComDepartment.id }) 
 | 
      .then(res => { 
 | 
        this.creatUsers = res 
 | 
      }) 
 | 
      .catch(err => { 
 | 
        console.log(err) 
 | 
      }) 
 | 
    this.search() 
 | 
  }, 
 | 
  methods: { 
 | 
     selectDate (v) { 
 | 
      this.searchForm.startDate = v[0] 
 | 
      this.searchForm.endDate = v[1] 
 | 
    }, 
 | 
    selectFactroy (v) { 
 | 
      this.searchForm.procedureid = null 
 | 
      this.searchForm.attrId = null 
 | 
      productesGroup({ orgId: v }) 
 | 
        .then(res => { 
 | 
          this.productes = res 
 | 
        }) 
 | 
        .catch(err => { 
 | 
          console.log(err) 
 | 
        }) 
 | 
    }, 
 | 
    selectProce (v) { 
 | 
      this.searchForm.attrId = null 
 | 
      getListByCondition({ procedureId: v }) 
 | 
        .then(res => { 
 | 
          this.checkAttr = res 
 | 
        }) 
 | 
        .catch(err => { 
 | 
          console.log(err) 
 | 
        }) 
 | 
    }, 
 | 
    reset () { 
 | 
      this.$refs.searchForm.resetFields() 
 | 
      this.searchForm.startdate = null 
 | 
      this.searchForm.enddate = null 
 | 
      this.data = [] 
 | 
      this.search() 
 | 
    }, 
 | 
  } 
 | 
} 
 | 
</script> 
 |