| <template> | 
|   <TableLayout  v-permissions="['ext:workorderext:query']"> | 
|     <!-- 搜索表单 --> | 
|     <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" label-suffix=":" inline> | 
|       <el-form-item label="物料名称" prop="mmodelName"> | 
|         <el-input v-model="searchForm.mmodelName" placeholder="请输入物料名称" @keypress.enter.native="search"></el-input> | 
|       </el-form-item> | 
|       <el-form-item label="物料编码" prop="mmodelCode"> | 
|         <el-input v-model="searchForm.mmodelCode" placeholder="请输入物料编码" @keypress.enter.native="search"></el-input> | 
|       </el-form-item> | 
|       <el-form-item label="工单/工序" prop="mixParam"> | 
|         <el-input v-model="searchForm.mixParam" placeholder="请输入工单编号/工序名称" @keypress.enter.native="search"></el-input> | 
|       </el-form-item> | 
|       <el-form-item label="生产批次号" prop="batch"> | 
|         <el-input v-model="searchForm.batch" placeholder="请输入批次号" @keypress.enter.native="search"></el-input> | 
|       </el-form-item> | 
|       <el-form-item label="工单来源" prop="originId"> | 
|         <el-select v-model="searchForm.originId" clearable placeholder="请选择"> | 
|           <el-option | 
|             v-for="(item, index) in origins" | 
|             :key="index" | 
|             :label="item.code" | 
|             :value="item.id"> | 
|           </el-option> | 
|         </el-select> | 
|       </el-form-item> | 
|       <el-form-item label="工单类型" prop="type"> | 
|         <el-select v-model="searchForm.type" clearable placeholder="请选择"> | 
|           <el-option | 
|             v-for="(item, index) in types" | 
|             :key="index" | 
|             :label="item.name" | 
|             :value="item.id"> | 
|           </el-option> | 
|         </el-select> | 
|       </el-form-item> | 
|       <el-form-item label="生产人员" prop="proUserId"> | 
|         <el-select v-model="searchForm.proUserId" filterable clearable placeholder="请选择"> | 
|           <el-option | 
|             v-for="(item, index) in proUsers" | 
|             :key="index" | 
|             :label="item.name" | 
|             :value="item.userId"> | 
|           </el-option> | 
|         </el-select> | 
|       </el-form-item> | 
|       <el-form-item label="生产设备" prop="pgmodelId"> | 
|         <el-select v-model="searchForm.pgmodelId" filterable clearable placeholder="请选择"> | 
|           <el-option | 
|             v-for="(item, index) in device" | 
|             :key="index" | 
|             :label="'【' + item.code + '】'+ item.name" | 
|             :value="item.id"> | 
|             <span class="long-title-style" :title="'【' + item.code + '】'+ item.name">【{{ item.code }}】{{item.name}}</span> | 
|           </el-option> | 
|         </el-select> | 
|       </el-form-item> | 
|       <el-form-item label="工单状态" prop="status"> | 
|         <el-select v-model="searchForm.status" clearable placeholder="请选择"> | 
|           <el-option | 
|             v-for="(item, index) in status" | 
|             :key="index" | 
|             :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" filterable clearable placeholder="请选择"> | 
|           <el-option | 
|             v-for="(item, index) in productes" | 
|             :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" | 
|           value-format="yyyy-MM-dd" | 
|           type="daterange" | 
|           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"> | 
|         <li v-permissions="['ext:workorderext:exportExcel']"><el-button type="primary" :loading="isWorking.export" @click="exportExcel">导出</el-button></li> | 
|         <!-- <li><el-button type="primary" v-permissions="['ext:workorderext:preparationWTransfer']" @click="batchPrepare">批量备料</el-button></li> --> | 
|         <li><el-button type="primary" v-if="containPermissions(['ext:barcodeparamext:query'])" @click="printLables" plain>打印标签</el-button></li> | 
|       </ul> | 
|       <el-table | 
|         v-loading="isWorking.search" | 
|         :data="tableData.list" | 
|         max-height="550px" | 
|         stripe | 
|         border | 
|         :summary-method="getSummaries" | 
|         show-summary | 
|         @selection-change="handleSelectionChange" | 
|       > | 
|         <el-table-column type="selection" fixed="left" width="55"></el-table-column> | 
|         <el-table-column prop="planDate" label="计划开工日期" fixed="left" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <el-button type="text" @click="showWorkDeatil(row)">{{ row.planDate }}</el-button> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column label="生产人员" fixed="left" show-overflow-tooltip min-width="140px"> | 
|           <template slot-scope="{row}"> | 
|             <span class="long-title-style">{{ proStr(row.proUserList) }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="code" label="工单编号" min-width="140px"> | 
|           <template slot-scope="{row}"> | 
|             <span>{{ row.code }}</span> | 
|             <!-- <el-button type="text" @click="showWorkDeatil(row)">{{ row.code }}</el-button> --> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="typeId" label="工单类型" min-width="80px"> | 
|           <template slot-scope="{row}"> | 
|             <span :style="typeColor(row.type)">{{ typeToStr(row.type) }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="mmodel.name" label="物料名称" show-overflow-tooltip min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span class="long-title-style">{{ row.mmodel.name }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="mmodel.code" label="物料编码" show-overflow-tooltip min-width="160px"> | 
|           <template slot-scope="{row}"> | 
|             <span class="long-title-style">{{ row.mmodel.code }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <!-- <el-table-column prop="planDate" label="计划发布日期" min-width="100px"></el-table-column> --> | 
|         <!-- <el-table-column prop="urgent" label="优先级" min-width="100px"></el-table-column> --> | 
|         <el-table-column prop="planNum" label="计划生产数量" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span>{{row.planNum ? (row.planNum + row.umodel.name) : '-' }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="batch" label="生产批次号" show-overflow-tooltip min-width="110px"> | 
|           <template slot-scope="{row}"> | 
|             <span class="long-title-style">{{row.batch }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="procedureName" label="工序" show-overflow-tooltip min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span class="long-title-style">{{ row.procedureName }}</span> | 
|           </template> | 
|         </el-table-column> | 
|          <el-table-column prop="pgmodel.name" label="生产设备" show-overflow-tooltip min-width="120px"> | 
|           <template slot-scope="{ row }"> | 
|             <span class="long-title-style"> 【{{ row.pgmodel.code }}】{{ row.pgmodel.name }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <!-- <el-table-column label="暂停" min-width="60px"> | 
|           <template slot-scope="{ row }"> | 
|             {{ row.paused == 0 ? '否' : '是' }} | 
|           </template> | 
|         </el-table-column> --> | 
|         <el-table-column prop="origin" label="工单来源" min-width="100px"> | 
|           <template slot-scope="{ row }"> | 
|             {{ originToStr(row.originId) }} | 
|           </template> | 
|         </el-table-column> | 
|         <!-- <el-table-column label="工单类型" min-width="70px"> | 
|           <template slot-scope="{row}"> | 
|             {{ typeToStr(row.type) }} | 
|           </template> | 
|         </el-table-column> --> | 
|         | 
|         <!-- <el-table-column prop="proUserName" label="生产人员" min-width="100px"></el-table-column> --> | 
|         <el-table-column prop="proNum" label="报工数量" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span>{{row.proNum ? (row.proNum + row.umodel.name) : '-' }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="qualifiedNum" label="合格数量" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span class="valid-style">{{row.qualifiedNum ? (row.qualifiedNum + row.umodel.name) : '-' }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="unqualifiedNum" label="不良数量" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span class="unvalid-style">{{row.unqualifiedNum ? (row.unqualifiedNum + row.umodel.name) : '-' }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <!-- <el-table-column prop="originWorkorderId" label="原工单编码" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span>{{ row.originWorkorderId || '-' }}</span> | 
|           </template> | 
|         </el-table-column> --> | 
|         <el-table-column prop="status" label="工单状态" min-width="80px"> | 
|           <template slot-scope="{row}"> | 
|             {{ satusToStr(row.status) }} | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column | 
|           label="操作" | 
|           min-width="190px" | 
|           fixed="right"> | 
|           <template slot-scope="{row}"> | 
|             <el-button type="text" v-if="containPermissions(['ext:barcodeparamext:query'])" @click="printLable(row)">打印标签</el-button> | 
|             <template v-if="row.status == '0' || row.status == '1'"> | 
|               <el-button v-if="row.status == '0'" type="text" @click="reDistribute(row)" v-permissions="['ext:workorderext:update']">重分配</el-button> | 
|               <el-button v-if="row.status == '0'" type="text" @click="prepare(row)" v-permissions="['ext:workorderext:preparationWTransfer']">备料</el-button> | 
|               <span style="margin-left: 8px" v-permissions="['ext:workorderext:delete']"> | 
|                 <el-button type="text" @click="cancel(row)">取消</el-button> | 
|               </span> | 
|             </template> | 
|             <template v-else-if="row.status == '6'"> | 
|               <span style="margin-left: 8px" v-permissions="['ext:workorderext:delete']"> | 
|                 <el-button type="text" @click="deleteById(row)">删除</el-button> | 
|               </span> | 
|             </template> | 
|           </template> | 
|         </el-table-column> | 
|       </el-table> | 
|       <pagination | 
|         @size-change="handleSizeChange" | 
|         @current-change="handlePageChange" | 
|         :pagination="tableData.pagination" | 
|       > | 
|       </pagination> | 
|     </template> | 
|     <!-- 新建/修改 --> | 
|     <OperaWorkorderExtWindow ref="operaWorkorderExtWindow" @success="handlePageChange"/> | 
|     <OrderRedistrubution ref="orderRedistrubution" @success="handlePageChange"/> | 
|     <OperaWorkorderDetailWindow ref="operaWorkorderDetailWindow"/> | 
|     <OrderQrCodeLabel ref="orderQrCodeLabel"/> | 
|   </TableLayout> | 
| </template> | 
|   | 
| <script> | 
| import BaseTable from '@/components/base/BaseTable' | 
| import TableLayout from '@/layouts/TableLayout' | 
| import Pagination from '@/components/common/Pagination' | 
| import OperaWorkorderExtWindow from '@/components/ext/OperaWorkorderExtWindow' | 
| import OperaWorkorderDetailWindow from '@/components/ext/OperaWorkorderDetailWindow' | 
| import OrderRedistrubution from '@/components/ext/OrderRedistrubution' | 
| import OrderQrCodeLabel from '@/components/ext/OrderQrCodeLabel' | 
| import { productesGroup } from '@/api/ext/proceduresExt' | 
| import { getDeviceByCondition } from '@/api/ext/deviceExt' | 
| import { workorderExt, cancelById, preparationWTransfer } from '@/api/ext/workorderExt' | 
| import { queryListByCode } from '@/api/system/dictData' | 
| import { companyUserExtAllUser } from '@/api/ext/companyUserExt' | 
| import { fetchList as getPrefix } from '@/api/ext/barcodeParamExt' | 
| import { addPrecision } from '@/utils/util' | 
| export default { | 
|   name: 'WorkorderExt', | 
|   extends: BaseTable, | 
|   components: { | 
|     TableLayout, | 
|     Pagination, | 
|     OperaWorkorderExtWindow, | 
|     OperaWorkorderDetailWindow, | 
|     OrderRedistrubution, | 
|     OrderQrCodeLabel | 
|   }, | 
|   data () { | 
|     return { | 
|       // 搜索 | 
|       searchForm: { | 
|         batch: '', // 批次号 | 
|         originId: '', // 来源 | 
|         procedureId: '', | 
|         mmodelName: '', | 
|         mmodelCode: '', | 
|         type: '', | 
|         startDate: '', | 
|         endDate: '', | 
|         proUserId: '', | 
|         status: '', | 
|         mixParam: '', | 
|         pgmodelId: '', | 
|         statusList: [4,5,6] | 
|       }, | 
|       origins: [], | 
|       types: [ | 
|         // 0正常、1返工、2客户返修 | 
|         { name: '正常', id: 0 }, | 
|         { name: '返工返修', id: 2 }, | 
|         // { name: '客户返修', id: 2 } | 
|       ], | 
|       proUsers: [ | 
|         { name: '张三', id: '1' }, | 
|         { name: '李四', id: '2' }, | 
|         { name: '王五', id: '3' }, | 
|         { name: '刘六', id: '4' } | 
|       ], | 
|       device: [], | 
|       status: [ | 
|         // 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: 5 }, | 
|         { name: '已取消', id: 6 } | 
|       ], | 
|       productes: [ | 
|       ], | 
|       planDate: [], | 
|       prefix: '' | 
|     } | 
|   }, | 
|   provide() { | 
|     return { | 
|       origins: () => this.origins | 
|     } | 
|   }, | 
|   created () { | 
|     this.config({ | 
|       module: '工单', | 
|       api: '/ext/workorderExt', | 
|       'field.id': 'id', | 
|       'field.main': 'code', | 
|       sorts: [{ direction: 'DESC', property: 'CREATE_TIME' }] | 
|     }) | 
|     productesGroup({ departId: this.$store.state.userInfo.comDepartment.id }) | 
|       .then(res => { | 
|         this.productes = res | 
|       }) | 
|       .catch(err => { | 
|         console.log(err) | 
|       }) | 
|     companyUserExtAllUser({ departmentId: this.$store.state.userInfo.curComDepartment.id }) | 
|       .then(res => { | 
|         this.proUsers = res | 
|       }) | 
|       .catch(err => { | 
|         console.log(err) | 
|       }) | 
|      | 
|     queryListByCode('?dicCode=WORKORDER_SOURCE') | 
|       .then(res => { | 
|         // console.log(res) | 
|         this.origins = res | 
|       }) | 
|       .catch(err => { | 
|         console.log(err) | 
|       }) | 
|     this.search() | 
|     getPrefix({ | 
|       page: 1, | 
|       capacity: 1, | 
|       model: { type: 3, status: 1 } | 
|     }) | 
|       .then(res => { | 
|         this.prefix = res.records[0].prefix | 
|       }) | 
|   }, | 
|   activated() { | 
|     getDeviceByCondition({}) | 
|       .then(res => { | 
|         this.device = res | 
|       }) | 
|       .catch(err => { | 
|         console.log(err) | 
|       }) | 
|   }, | 
|   methods: { | 
|     typeToStr (type) { | 
|       for (const item of this.types) { | 
|         if (item.id === type) { | 
|           return item.name | 
|         } | 
|       } | 
|     }, | 
|     satusToStr (status) { | 
|       for (const item of this.status) { | 
|         if (item.id === status) { | 
|           return item.name | 
|         } | 
|       } | 
|     }, | 
|     dateChange (v) { | 
|       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() | 
|     }, | 
|     showWorkDeatil (row) { | 
|       workorderExt(row.id) | 
|         .then(res => { | 
|           console.log(res) | 
|           this.$refs.operaWorkorderDetailWindow.open('工单详情', res) | 
|         }) | 
|         .catch(err => { | 
|           this.$tip.error(err) | 
|         }) | 
|     }, | 
|     reDistribute (row) { | 
|       // console.log('重新分配', row) | 
|       this.$refs.orderRedistrubution.open('重新分配工单', row) | 
|     }, | 
|     cancel (row) { | 
|       this.$alert('确定取消选中工单吗?', '取消工单', { | 
|         showCancelButton: true, | 
|         // confirmButtonText: '确定', | 
|         // confirmButtonText: '确定', | 
|         callback: action => { | 
|           if (action === 'confirm') { | 
|             // console.log('关闭') | 
|             cancelById({ id: row.id }) | 
|               .then(() => { | 
|                 this.$tip.success('取消成功') | 
|                 this.handlePageChange() | 
|               }) | 
|               .catch(err => { | 
|                 this.$tip.error(err) | 
|               }) | 
|           } | 
|         } | 
|       }) | 
|     }, | 
|     originToStr (origin) { | 
|       for (const item of this.origins) { | 
|         if (item.id === origin) { | 
|           return item.code | 
|         } | 
|       } | 
|     }, | 
|     batchPrepare () { | 
|       if (this.tableData.selectedRows.length === 0) { | 
|         this.$tip.warning('请至少选择一条数据') | 
|         return | 
|       } | 
|       // const procedureId = this.tableData.selectedRows[0].procedureId | 
|       for (const item of this.tableData.selectedRows) { | 
|         // if (procedureId !== item.procedureId) { | 
|         //   this.$tip.warning('每次只能对一种工序备料') | 
|         //   return | 
|         // } | 
|         if (item.status !== 0) { | 
|           this.$tip.warning('只有已创建状态可以备料') | 
|           return | 
|         } | 
|       } | 
|       this.$refs.operaWorkorderExtWindow.open('批量备料', this.tableData.selectedRows) | 
|     }, | 
|     prepare (row) { | 
|       this.$alert('确定对此工单进行备料吗?', '确认备料', { | 
|         showCancelButton: true, | 
|         // confirmButtonText: '确定', | 
|         // confirmButtonText: '确定', | 
|         callback: action => { | 
|           if (action === 'confirm') { | 
|             preparationWTransfer(row.id) | 
|               .then(() => { | 
|                 this.$tip.success('备料成功') | 
|                 this.handlePageChange() | 
|               }) | 
|               .catch(err => { | 
|                 this.$tip.error(err) | 
|               }) | 
|           } | 
|         } | 
|       }) | 
|        | 
|     }, | 
|     typeToStr (type) { | 
|       for (const item of this.types) { | 
|         if (item.id === type) { | 
|           return item.name | 
|         } | 
|       } | 
|       return '-' | 
|     }, | 
|     typeColor (type) { | 
|       // { name: '正常', id: 0 }, | 
|         // { name: '返工返修', id: 2 }, | 
|         // $nav-stateColor1: #305ED5; | 
|         //     $nav-stateColor2: #03AF76; | 
|         //     $nav-stateColor4: #DE5243; | 
|         //     $nav-stateColor5: #F5A400; | 
|       switch (type) { | 
|         case 0 : return 'color: #03AF76' | 
|         case 2 : return 'color: #F5A400' | 
|         default: return 'color: #111111' | 
|       } | 
|     }, | 
|     printLables () { | 
|       if (this.tableData.selectedRows.length === 0) { | 
|         this.$tip.warning('请至少选择一条数据') | 
|         return | 
|       } | 
|       this.$refs.orderQrCodeLabel.open('打印标签', this.tableData.selectedRows, this.prefix) | 
|     }, | 
|     printLable (row) { | 
|       this.$refs.orderQrCodeLabel.open('打印标签', [row], this.prefix) | 
|     }, | 
|     getSummaries (param) { | 
|       const { columns, data } = param; | 
|       const sums = []; | 
|       columns.forEach((column, index) => { | 
|         // console.log(data); | 
|         if (index === 0) { | 
|           sums[index] = '合计'; | 
|           return; | 
|         } else if (index === 1 || index === 2 || index === 3 || index === 4 || index === 8 || index === 9 || index === 15 || index === 16) { | 
|           sums[index] = '-'; | 
|           return; | 
|         } else if (index === 8) { | 
|           sums[index] = '-'; | 
|           return; | 
|         } | 
|         const values = data.map(item => 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 | 
|     }, | 
|     proStr (proUserList) { | 
|       return proUserList.map((item) => { return item.proUserDepartName}).join(',') | 
|     } | 
|   } | 
| } | 
|   | 
| </script> |