| <template> | 
|   <TableLayout v-permissions="['ext:workorderrecordext:query']"> | 
|     <!-- 搜索表单 --> | 
|     <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" label-suffix=":" inline> | 
|       <el-form-item label="生产人员" prop="userId"> | 
|         <el-select v-model="searchForm.userId" clearable filterable placeholder="请选择"> | 
|           <el-option | 
|             v-for="item in proUsers" | 
|             :key="item.id" | 
|             :label="item.name" | 
|             :value="item.userId"> | 
|           </el-option> | 
|         </el-select> | 
|       </el-form-item> | 
|       <el-form-item label="物料信息" prop="materialName"> | 
|         <el-input v-model="searchForm.materialName" placeholder="请输入物料名称/编码" @keypress.enter.native="search"></el-input> | 
|       </el-form-item> | 
|       <el-form-item label="工序" prop="procedureId"> | 
|         <el-select v-model="searchForm.procedureId" filterable clearable placeholder="请选择"> | 
|           <el-option | 
|             v-for="(item, index) in procedures" | 
|             :key="index" | 
|             :label="item.name" | 
|             :value="item.id"> | 
|           </el-option> | 
|         </el-select> | 
|       </el-form-item> | 
|       <el-form-item label="报工时间"> | 
|         <el-date-picker | 
|           v-model="planDate" | 
|           type="daterange" | 
|           value-format="yyyy-MM-dd" | 
|           range-separator="~" | 
|           start-placeholder="开始日期" | 
|           end-placeholder="结束日期" | 
|           @change="dateChange" | 
|         ></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"> | 
|         <!-- v-permissions="['ext:workorderrecordext:exportExcel']" --> | 
|         <li ><el-button type="primary" :loading="isWorking.export" @click="exportExcel">导出</el-button></li> | 
|       </ul> | 
|       <el-table | 
|         v-loading="isWorking.search" | 
|         :data="tableData.list" | 
|         stripe | 
|         border | 
|       > | 
|         <el-table-column type="index" :index="customIndex" label="序号" fixed="left" min-width="80px"></el-table-column> | 
|         <el-table-column prop="userInfo.userName" label="生产人员" min-width="100px"></el-table-column> | 
|         <el-table-column prop="userInfo.departName" label="部门" min-width="100px"> </el-table-column> | 
|         <el-table-column prop="materialName" label="物料名称" min-width="100px"></el-table-column> | 
|         <el-table-column prop="materialCode" label="物料编码" min-width="140px"></el-table-column> | 
|         <el-table-column prop="procedureName" label="工序名称" min-width="100px"></el-table-column> | 
|         <el-table-column prop="workorderCode" label="工单编码" min-width="150px"></el-table-column> | 
|         <el-table-column prop="unitName" label="单位" min-width="100px"></el-table-column> | 
|         <el-table-column prop="num" label="报工数" min-width="100px"></el-table-column> | 
|         <el-table-column prop="qualifiedNum" label="良品数" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span class="valid-style">{{ row.qualifiedNum || 0 }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="unQualifiedNum" label="不良品数" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span class="unvalid-style">{{ row.unQualifiedNum || 0 }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="rate" 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 { getDeviceByCondition } from '@/api/ext/deviceExt' | 
| import { productesGroup } from '@/api/ext/proceduresExt' | 
| import { companyUserExtAllUser } from '@/api/ext/companyUserExt' | 
| import { addPrecision } from '@/utils/util' | 
| export default { | 
|   name: 'WorkorderRecordExt', | 
|   extends: BaseTable, | 
|   components: { TableLayout, Pagination }, | 
|   data () { | 
|     return { | 
|       // 搜索 | 
|       searchForm: { | 
|         procedureId: '', | 
|         userId: '', | 
|         startDate: '', | 
|         endDate: '', | 
|         materialName: '', | 
|       }, | 
|       procedures: [ | 
|       ], | 
|       proUsers: [ | 
|       ], | 
|     | 
|       orderStatus:[ | 
|         // 0已创建、1已领料、2已完工检、3已检验、4已返工、5已入库、6已暂停、7已取消、8已关闭 | 
|         //  0已创建、1已备料、2已完工检、3已检验、4已报工、5已入库、6已取消 | 
|         { name: '已创建', id: 0 }, | 
|         { name: '已备料', id: 1 }, | 
|         { name: '已完工检', id: 2 }, | 
|         { name: '已检验', id: 3 }, | 
|         { name: '已报工', id: 4 }, | 
|         { name: '已取消', id: 6 } | 
|       ], | 
|       planDate: [] | 
|     } | 
|   }, | 
|   created () { | 
|     this.config({ | 
|       module: '报工记录', | 
|       api: '/ext/userSalary', | 
|       'field.id': 'id', | 
|       'field.main': 'name', | 
|       sorts: [{ direction: 'DESC', property: 'CREATE_TIME' }] | 
|     }) | 
|     let tempDate = new Date() | 
|     let year = tempDate.getFullYear() | 
|     let month = tempDate.getMonth() + 1 | 
|     let day = tempDate.getDate() | 
|     this.searchForm.startDate = `${year}-${month}-01` | 
|     this.searchForm.endDate = `${year}-${month}-${day}` | 
|     this.planDate = [this.searchForm.startDate, this.searchForm.endDate] | 
|     this.search() | 
|   }, | 
|   activated() { | 
|     productesGroup({}) | 
|       .then(res => { | 
|         this.procedures = res | 
|       }) | 
|       .catch(err => { | 
|         console.log(err) | 
|       }) | 
|     companyUserExtAllUser({ departmentId: this.$store.state.userInfo.curComDepartment.id }) | 
|       .then(res => { | 
|         this.proUsers = res | 
|       }) | 
|       .catch(err => { | 
|         console.log(err) | 
|       }) | 
|   }, | 
|   methods: { | 
|     dateChange (v) { | 
|       // console.log('日期选择了') | 
|       this.searchForm.startDate = v[0] | 
|       this.searchForm.endDate = v[1] | 
|     }, | 
|     reset () { | 
|       // console.log('rest', this.searchDate) | 
|       this.planDate = [] | 
|       this.searchForm.startDate = '' | 
|       this.searchForm.endDate = '' | 
|       this.$refs.searchForm.resetFields() | 
|       this.search() | 
|     }, | 
|     statusToStr (row) { | 
|       for (const item of this.orderStatus) { | 
|         if (item.id === row.omodel.status) { | 
|           return item.name | 
|         } | 
|       } | 
|       return '-' | 
|     }, | 
|     getSummaries (param) { | 
|       const { columns, data } = param; | 
|       const sums = []; | 
|       columns.forEach((column, index) => { | 
|         if (index === 0) { | 
|           sums[index] = '合计'; | 
|           return; | 
|         } else if (index === 4 || index === 8 || index === 6 || index === 10) { | 
|           // || index === 8 || index === 9 || index === 16 || index === 17 | 
|           sums[index] = '-'; | 
|           return; | 
|         } | 
|         const values = data.map(item => { | 
|           if (index === 6) { | 
|             return Number(item.omodel.planNum) | 
|           } else { | 
|             return Number(item[column.property]) | 
|           } | 
|            | 
|         }); | 
|         if (!values.every(value => isNaN(value))) { | 
|           sums[index] = 0 | 
|           values.forEach(item => { | 
|             sums[index] = addPrecision(item, sums[index]) | 
|           }) | 
|         } else { | 
|           sums[index] = '-'; | 
|         } | 
|       }); | 
|       return sums | 
|     }, | 
|     customIndex(index) { | 
|       console.log(); | 
|       return (this.tableData.pagination.pageIndex-1) * this.tableData.pagination.pageSize + index + 1 | 
|     } | 
|   } | 
| } | 
|   | 
| </script> |