<template>
  <div class="app-container">
    <div class="filter-container">

      <el-input size="mini" v-model.trim="search.keyWord" placeholder="关键字" style="width: 150px;" class="filter-item"/>
      <el-input size="mini" v-model.trim="search.orderCode" placeholder="订单编号" style="width: 150px;" class="filter-item"/>
      <el-input size="mini" v-model.trim="search.printBillCode" placeholder="施工单号" style="width: 150px;" class="filter-item"/>
      <el-input size="mini" v-model.trim="search.productName" placeholder="产品类型" style="width: 150px;" class="filter-item"/>
      <el-select multiple style="width: 260px;" size="mini" v-model="search.billStates" placeholder="工单状态查询">
        <el-option
          v-for="item in optionsList"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-button size="mini" class="filter-item" type="primary" icon="el-icon-search" @click="searchData">
        搜索
      </el-button>
      <el-checkbox style="margin-left: 20px" size="small" @change="checkState" v-model="processStateBtn"
                   label="已作废" border></el-checkbox>

      <el-button
        size="mini"
        class="filter-item"
        style="margin-left: 10px;"
        type="primary"
        icon="el-icon-plus"
        @click="handleCreateAdd">
        增加外加工单
      </el-button>
      <el-button size="mini"  @click="acceptBtn"  type="primary">批量验收</el-button>
    </div>
    <div class="table-con">
      <el-table
        ref="multipleTable"
        size="mini"
        @selection-change="handleSelectionChange"
        tooltip-effect="light"
        :data="tableData"
        v-loading="listLoading"
        style="width: 100%;margin-bottom: 20px;"
        border
      >
        <el-table-column
          label="#"
          align="center"
          type="index"
          :index="indexMethod">
        </el-table-column>
        <el-table-column
          :selectable="checkboxT"
          type="selection"
          width="55">
        </el-table-column>
        <el-table-column label="操作" align="left" width="220" class-name="small-padding fixed-width">
          <template slot-scope="{row}">
            <el-button v-if="row.voidFlag==0 && row.billState==0" @click="handleUpdate(row.id,row.billType,row.billCode,row)" type="primary" size="mini">
              编辑
            </el-button>
            <el-button v-if="row.billState>=1 && row.originBillFeedback!=1 && row.voidFlag==0"
                       @click="handleFeedback(row,2)" type="warning" size="mini">
              反馈
            </el-button>
            <el-button v-if="row.voidFlag==0 && row.billState==1" @click="backCraftBtn(row.id)" type="danger" size="mini">
              退回
            </el-button>
            <el-button v-if="row.voidFlag==0" @click="editStatus(row.id,'1')" type="info" size="mini">
              作废
            </el-button>
<!--            <el-button @click="editStatus(row.id,'0')" v-else="row.enable==1" size="mini">-->
<!--              启用-->
<!--            </el-button>-->
          </template>
        </el-table-column>
        <el-table-column
          label="订单编号"
          width="100px"
        >
          <template slot-scope="{row}">
            <span>{{row.originOrderCode}}</span>
          </template>
        </el-table-column>

        <el-table-column
          label="工序尺寸"
          width="100px"
        >
          <template slot-scope="{row}">
            <span>{{row.outProcessSize}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="展开尺寸"
          width="100px"
        >
          <template slot-scope="{row}">
            <span>{{row.breedCutSize}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="交货日期"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.expectedDeliverDate | getLongDay}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="发货方式"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.originOrderSendKind}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="外协单号"
          width="130px"
        >
          <template slot-scope="{row}">
            <span v-show="row.voidFlag==0" @click.stop="billCodePrint(row)" style="color: #E6A23C;cursor: pointer">打印&nbsp;&nbsp;</span>
            <span>{{row.originOutAssistBill}}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="billCode"
          width="140"
          label="外加工单号">
          <template slot-scope="{row}">
            <span @click="getBillStep(row)" style="color: #409EFF;cursor: pointer">{{row.billCode}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="印品名称"
          width="100px"
          show-overflow-tooltip
        >
          <template slot-scope="{row}">
            <span @click="handleShowStep(row.id,row.billType,row.billCode,row)" style="color: #409EFF;cursor: pointer">{{row.printName}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="原订单所有后工"
          width="150"
          show-overflow-tooltip
        >
          <template slot-scope="{row}">
           {{row.origOrderAllProcess}}
          </template>
        </el-table-column>
        <el-table-column
          label="原订单消息"
          width="190"
          show-overflow-tooltip
        >
          <template slot-scope="{row}">
            <template v-if="row.originOrderMessage">
<!--              <el-button v-show="row.originOrderId!=null" size="mini" @click="openOriginOrderMessage(row)">查看</el-button>-->
              <span
                style="color: #20a0ff; cursor: pointer"
                @click="openOriginOrderMessage(row)"> {{ row.originOrderMessage }}</span>
            </template>
            <template v-else>
<!--              <el-button v-show="row.originOrderId!=null" size="mini" @click="openOriginOrderMessage(row)">查看</el-button>-->
            </template>
          </template>
        </el-table-column>
        <el-table-column label="状态" align="center" width="110px" class-name="small-padding fixed-width">
          <template slot-scope="{row}">
            <div v-if="row.voidFlag==1">
              <el-tag size="mini" type="warning">已作废</el-tag>
            </div>
            <div v-else>
              <el-tag size="mini" type="info" v-if="row.billState==0">待验收</el-tag>
              <!--            <el-tag type="warning" type="info" v-if="row.taskStatus==0 && row.pauseStatus==1">暂停</el-tag>-->
              <el-tag size="mini" type="success"  v-if="row.billState==1">待排产</el-tag>
              <el-tag size="mini" type="danger" v-if="row.billState==2">待反馈</el-tag>
              <el-tag size="mini" type="" v-if="row.billState==3">部分反馈</el-tag>
              <el-tag size="mini" type="" v-if="row.billState==4">已完成</el-tag>
            </div>

          </template>
        </el-table-column>
        <el-table-column label="反馈状态" align="center" width="110px" class-name="small-padding fixed-width">
          <template slot-scope="{row}">
              <el-tag size="mini" type="info" v-if="row.originBillFeedback==0">未反馈</el-tag>
              <el-tag size="mini" type="success"  v-if="row.originBillFeedback==1">已反馈</el-tag>
          </template>
        </el-table-column>

        <el-table-column
          label="施工单号"
          width="150px"
        >
          <template slot-scope="{row}">
            <span v-show="row.voidFlag==0" @click.stop="printBillCodePrint(row)" style="color: #E6A23C;cursor: pointer">打印&nbsp;&nbsp;</span>
            <span>{{row.originPrintBillCode}}</span>
          </template>
        </el-table-column>

        <el-table-column
          width="120"
          prop="productName"
          label="产品类型">
        </el-table-column>
        <el-table-column
          width="120"
          prop="originOrderSendKind"
          label="订单发货方式">
        </el-table-column>
        <el-table-column
          width="120"
          prop="customerName"
          label="客户名称">
        </el-table-column>
        <el-table-column
          label="加工单金额"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.billMoney}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="对接时间"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.createTime | getTime}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="订单下机时间"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.printCompleteTime | getTime}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="覆膜反馈状态"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.coveringState}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="模切反馈状态"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.cuttingState}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="成型反馈状态"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.moldingState}}</span>
          </template>
        </el-table-column>


        <el-table-column
          label="原外协单备注"
          width="200px"
        >
          <template slot-scope="{row}">
            <el-popover
              placement="top-start"
              width="400"
              trigger="hover"
              :content="row.originBillMemo">
              <span slot="reference" style="width: 200px" class="ellipsis"> {{ row.originBillMemo }}</span>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column
          label="备注"
          width="200px"
        >
          <template slot-scope="{row}">
              <el-popover
                placement="top-start"
                width="400"
                trigger="hover"
                :content="row.billMemo">
                <span slot="reference" style="width: 200px" class="ellipsis"> {{ row.billMemo }}</span>
              </el-popover>
          </template>
        </el-table-column>
        <el-table-column
          label="订单制单日期"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.createTime | getTime}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="加工单制单日期"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.originOrderSubmitTime | getTime}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="加工单制单人"
          width="130px"
        >
          <template slot-scope="{row}">
            <span>{{row.createManName}}</span>
          </template>
        </el-table-column>

      </el-table>
      <pagination v-show="listData.total>0" :total="listData.total" :page.sync="listData.page"
                  :limit.sync="listData.pageSize" @pagination="getTableInfo"/>
    </div>
    <el-dialog size="mini" :title="dialogTitle" :visible.sync="dialogVisible" width="1180px" :modal-append-to-body='false' append-to-body>
      <el-dialog
        width="600px"
        height="auto"
        title="选择工序"
        :visible.sync="innerVisible"
        append-to-body>
        <el-form style="height: 230px" size="small" label-width="130px">
          <el-col :span="12">
            <el-form-item label="选择工序">
              <el-select v-model="innerForm.craftName" filterable placeholder="请选择">
                <el-option
                  v-for="item in options"
                  :key="item.id"
                  :label="item.craftName"
                  :value="item.craftName+','+item.id+','+item.craftType">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工序尺寸">
              <el-input v-model.trim="innerForm.processSize"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工序数量">
              <el-input v-model.trim="innerForm.processNum"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label.trim="工序金额">
              <el-input v-model="innerForm.processMoney"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工序成本">
              <el-input v-model.trim="innerForm.processCost"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工序耗时">
              <el-input v-model.trim="innerForm.processNeedTime"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="工序备注">
              <el-input :rows="2" type="textarea" v-model="innerForm.processMemo"></el-input>
            </el-form-item>
          </el-col>
        </el-form>
        <el-button @click="addProcess" style="margin-left: 130px" size="mini" type="primary">增加</el-button>
      </el-dialog>
      <div style="margin-bottom: 10px;width: 100%;">
        <el-button size="mini"  type="primary" @click="dialogStatus==='1'?addBtn():editBtn()">保  存</el-button>
        <el-button size="mini" @click="dialogVisible = false" type="">关  闭</el-button>
<!--        <el-button size="mini" @click="billPrintBtn" type="warning">打印外加工单</el-button>-->
      </div>

      <el-card class="box-card">
        <el-tabs v-model="activeName" type="card">
          <el-tab-pane  size="mini" label="外加工单" name="first">
            <div>

              <el-form size="mini" label-width="100px" label-position="right">
                <el-row>
                  <el-col :span="6">
                    <el-form-item label="客户名称">
                      <el-input :disabled="billType==0" v-model="form.customerName"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="印品名称">
                      <el-input :disabled="billType==0" v-model="form.printName"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="施工单号">
                      <el-input :disabled="true" v-model="form.originPrintBillCode"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="订单编号">
                      <el-input :disabled="true" v-model="form.originOrderCode"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="单据后工">
                      <el-input :disabled="billType==0" v-model="form.originOrderProcessStr"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="预计交货时间">
                      <el-date-picker
                        style="width: 160px"
                        :disabled="billType==0"
                        v-model="form.expectedDeliverDate"
                        type="date"
                        value-format="yyyy-MM-dd"
                        placeholder="选择日期">
                      </el-date-picker>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="单据金额">
                      <el-input :disabled="billType==0" v-model="form.billMoney"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="外协单号">
                      <el-input :disabled="true" v-model="form.originOutAssistBill"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="原外协单备注">
                      <el-input :disabled="billType==0" :rows="4" type="textarea" v-model="form.originBillMemo"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="单据备注">
                      <el-input  :rows="3" type="textarea" v-model="form.billMemo"></el-input>
                    </el-form-item>
                  </el-col>

                </el-row>
              </el-form>
            </div>
          </el-tab-pane>
          <el-tab-pane  size="mini" label="订单" name="two">
            <div>
              <el-form size="mini" label-width="100px" label-position="right">
                <el-row>
                  <el-col :span="6">
                    <el-form-item label="订单编号">
                      <span>{{fileInfoData.orderCode}}</span>
                    </el-form-item>
                    <el-form-item label="印品名称">
                      <span>{{fileInfoData.orderName}}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="样稿文件">
                    <span><el-link :href="fileInfoData.webProofFileLink" target="_blank" style="color: #20a0ff">{{ fileInfoData.proofFile}}
                    </el-link></span>
                    </el-form-item>
                  </el-col>

                </el-row>
              </el-form>
            </div>
          </el-tab-pane>
        </el-tabs>
        <div slot="header" class="clearfix">
          <span>外加工单</span>
        </div>

      </el-card>

      <el-card style="margin-top: 10px" class="box-card">
        <div slot="header" class="clearfix">
          <span>工序</span>
          <el-button v-show="billType!=0" @click="innerBtn" size="mini" type="primary">增加工序</el-button>
        </div>
        <div>
          <el-table
            border
            class="tb-edit"
            row-key="id"
            size="mini"
            highlight-current-row
            @row-click="handleCurrentChange"
            :data="processList"
            style="width: 100%">
            <el-table-column
              label="工序名称"
            >
              <template slot-scope="scope">
                <el-input :disabled="billType==0" size="mini" v-model="scope.row.craftName" placeholder="请输入内容"
                          @change="handleEdit(scope.$index, scope.row.craftName)"></el-input>
                <span>{{ scope.row.craftName }}</span>
              </template>
            </el-table-column>

            <el-table-column
              label="工序尺寸"
            >
              <template slot-scope="scope">
                <el-input size="mini" :disabled="billType==0" v-model="scope.row.processSize" placeholder="请输入内容"
                          @change="handleEdit(scope.$index, scope.row.processSize)"></el-input>
                <span>{{ scope.row.processSize }}</span>
              </template>
            </el-table-column>

            <el-table-column
              label="工序数量"
            >
              <template slot-scope="scope">
                <el-input :disabled="billType==0" size="mini" v-model="scope.row.processNum" placeholder="请输入内容"
                          @change="handleEdit(scope.$index, scope.row.processNum)"></el-input>
                <span>{{ scope.row.processNum }}</span>
              </template>
            </el-table-column>
            <el-table-column
              label="已反馈数量"
            >
              <template slot-scope="scope">
                <el-input :disabled="billType==0" size="mini" v-model="scope.row.feedbackNum" placeholder=""
                          @change="handleEdit(scope.$index, scope.row.feedbackNum)"></el-input>
                <span>{{ scope.row.feedbackNum }}</span>
              </template>
            </el-table-column>
            <el-table-column
              label="反馈状态"
            >
              <template slot-scope="{row}">
                <el-tag size="mini" type="info" v-if="row.processState==0">待排产</el-tag>
                <el-tag size="mini" type="danger" v-if="row.processState==1">待验收</el-tag>
                <el-tag size="mini" type="warning" v-if="row.processState==2">待生产</el-tag>
                <el-tag size="mini" type="primary" v-if="row.processState==3">待完工</el-tag>
                <el-tag size="mini" type="success" v-if="row.processState==4">待流转</el-tag>
                <el-tag size="mini" type="" v-if="row.processState==10">已完成</el-tag>
              </template>
            </el-table-column>
            <el-table-column
              label="反馈版组"
            >
              <template  slot-scope="scope">
                <span>{{ scope.row.feedbackGroupName }}</span>
              </template>
            </el-table-column>
            <el-table-column
              label="备注"
            >
              <template slot-scope="scope">
                <el-input  size="mini" v-model="scope.row.processMemo" placeholder="请输入内容"
                          @change="handleEdit(scope.$index, scope.row.processMemo)"></el-input>
                <span>{{ scope.row.processMemo }}</span>
              </template>
            </el-table-column>
          </el-table>
        </div>

      </el-card>
      <el-card style="margin-top: 10px" class="box-card">
        <div slot="header" class="clearfix">
          <span>收货信息</span>
        </div>
        <el-form size="small" label-width="100px" label-position="right">
          <el-row>
            <el-col :span="8">
              <el-form-item label="收货人">
                <el-input :disabled="billType==0" v-model="form.receiveMan"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="收货电话">
                <el-input :disabled="billType==0" v-model="form.receivePhone"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="收货地址">
                <el-input :disabled="billType==0" v-model="form.sendAddress"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-card>
    </el-dialog>
    <bill-step ref="billStep"></bill-step>
    <craft-detail ref="craftDetail"></craft-detail>
    <cancledialog @tableRefresh="tableRefresh" ref="confirmDialog"></cancledialog>
    <!--    外协单反馈开始-->
    <el-dialog title="外协单反馈与包数录入" size="mini" :visible.sync="feedBackVisible" width="1200px">
      <el-row>
        <div>
          <el-form size="mini" label-width="130px"
                   label-position="right">
            <el-row :gutter="10">
              <el-col :span="8">
                <el-form-item label="单据号">
                  <span>{{ printOrderFeedBack.orderCode }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="外协单号">
                  <span>{{ printOrderFeedBack.printBillCode }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="印件名称">
                  <span v-if="printOrderFeedBack.createTime">{{ printOrderFeedBack.createTime | getTime }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="外协单位">
                  <span>{{ printOrderFeedBack.outAssistFactoryName }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="印品名称">
                  <span>{{ printOrderFeedBack.orderName }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="外协金额">
                  <span>{{ printOrderFeedBack.outAssistMoney }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="外协单备注">
                  <span>{{ printOrderFeedBack.billMemo }}</span>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>

        </div>
      </el-row>
      <el-row style="margin-top: 20px">
        <el-tabs v-model="activeNameFeedBack" type="card">
          <el-tab-pane label="包数录入" name="one">
            <span style="line-height: 30px;color: #F56C6C">订单包数录入:包数录入请输入有效的计算表达式,比如2*3000+1*4000</span>
            <div>
              <el-table
                :cell-style="customCellStyle"
                size="mini"
                border
                class="tb-edit"
                row-key="id"
                highlight-current-row
                :data="packOrderList"
                tooltip-effect="light"
                style="width: 100%"
              >
                <el-table-column
                  label="订单编号"
                >
                  <template slot-scope="scope">{{ scope.row.orderCode }}</template>
                </el-table-column>
                <el-table-column
                  label="客户名称"
                  show-overflow-tooltip
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.clientName }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="印品名称"
                  show-overflow-tooltip
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.orderName }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="订单后工"
                  show-overflow-tooltip
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.allProcessStr }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="订单印量"
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.orderQty }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="已打包印量"
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.boxedOrderQty }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="未打包印量"
                >
                  <template slot-scope="scope">
                    <span>{{getUnpackagedNum(scope.row)}}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="已打包数"
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.packageQty }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="currentBoxCount"
                  label="本次打包数据"
                  width="200"
                  show-overflow-tooltip>
                  <template slot-scope="scope">
                    <input style="border: 1px solid #ddd;background: #fff;width:180px;height: 30px;line-height: 30px;outline: 1px solid #ddd;" size="mini" v-model="scope.row.currentBoxCount"/>
                  </template>
                </el-table-column>
              </el-table>

            </div>
          </el-tab-pane>
          <el-tab-pane label="外协工序" name="two">
            <div>
              <el-table
                size="mini"
                class="tb-edit"
                row-key="id"
                highlight-current-row
                :data="uniqueProcessList"
                tooltip-effect="dark"
                style="width: 100%"
              >
                <el-table-column
                  label="外协工序"
                >
                  <template slot-scope="scope">{{ scope.row.outProcessName }}</template>
                </el-table-column>
                <el-table-column
                  label="尺寸"
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.outProcessSize }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="工序数量"
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.outProcessQty }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="金额"
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.outProcessMoney }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="备注"
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.outProcessMemo }}</span>
                  </template>
                </el-table-column>
              </el-table>

            </div>
          </el-tab-pane>
        </el-tabs>
      </el-row>
      <div slot="footer" class="dialog-footer">
        <el-button @click="feedBackVisible = false">取 消</el-button>
        <el-button type="primary" :disabled="clickBtn" @click="feedbackOutAssistBillBtn">确 定
        </el-button>
      </div>
    </el-dialog>
    <!--    外协单反馈结束-->
    <el-drawer
      title="原订单消息"
      :reverse="true"
      :visible.sync="memoDrawer"
      size="600px">
      <originorder-message ref="originorderMessage"></originorder-message>
    </el-drawer>
  </div>
</template>

<script>
import {
  getInfo,
  getInfoById,
  addInfo,
  updateInfo,
  getCraftInfoList,
  acceptCraftBills,
  backCraftBill,
  viewRemoteOrder
} from '@/api/outsideFactory/queryCraftBill/index.js'
import Cancledialog from '@/components/Dialog/Cancledialog.vue'
import Pagination from "@/components/Pagination/index";
import {
  feedbackOutAssistBillList,
  getRemoteOutAssistInfo,
  remoteFeedbackOutAssistBill
} from "@/api/outsidebill/outsidebill";
import BillStep from '@/components/billStep/billStep'
import CraftDetail from "@/components/craftDetail/craftDetail";
import {doPrintRemoteOutAssistBill, doPrintRemotePrintBill} from "@/api/printbill/preOut/preOut";
import {doLocalPrint} from "@/utils";
import originorderMessage from '@/views/feedBack/orderMessage/originorderMessage'

export default {
  name: "queryCraftBill",
  components: {
    Cancledialog, Pagination,
    BillStep,
    CraftDetail,
    originorderMessage
  },
  data() {
    return {
      processStateBtn: false,
      rowData:{},
      memoDrawer:false,
      fileInfoData:{},
      activeName: 'first',
      optionsList: [{
        value: 0,
        label: '待验收'
      }, {
        value: 1,
        label: '待排产'
      }, {
        value: 2,
        label: '待反馈'
      }, {
        value: 4,
        label: '已完成'
      }],
      totalMoney: 0,
      feedbackState:"",
      idOutAssistBill:"",
      clickBtn:false,
      packOrderList:[],
      activeNameFeedBack: 'one',
      uniqueProcessList:[],
      printOrderFeedBack: {},
      feedBackVisible:false,
      stepVisible:false,
      billType:"",
      multipleSelection:[],
      innerForm:{},
      innerVisible:false,
      dialogStatus: 1,//1增加，2修改
      form: {},
      options: [],
      confirmdialog: false,
      dialogVisible: false,
      dialogTitle: "",
      listLoading: false,
      tableData: [],
      search: {
        keyWord: '',
        billStates:[0,1,2],
        orderCode:"",
        printBillCode:"",
        productName:"",
        voidFlag:0,
      },
      processList: [],
      listData: {
        total: 0,
        page: 1,
        pageSize: 10
      }
    }
  },
  mounted() {
    this.getTableInfo();
    this.getCraft();
  },
  methods: {
    checkState(val) {
      // console.log(val);
      const _that = this;
      _that.listData.page = 1;
      _that.search.keyWord = "";
      if (_that.processStateBtn) {
        _that.search.billStates = [];
        _that.search.voidFlag = 1;
      }else {
        _that.search.billStates = [0,1,2];
        _that.search.voidFlag = 0;
      }
      _that.getTableInfo();
    },
    openOriginOrderMessage(row){
      const _that = this;
      _that.memoDrawer = true;
      _that.rowData = row;
      _that.$nextTick(function () {
        // console.log(_that.$refs.orderMemo);
        _that.$refs.originorderMessage.idOriginFactory = row.idOriginFactory;
        _that.$refs.originorderMessage.originOrderId = row.originOrderId;
        _that.$refs.originorderMessage.getList()
      })
    },
    handleAddBreed(breedMsg) {
      this.memoDrawer = false;
    },
    printBillCodePrint(row) {
      const _that = this;
      var datas = {
        "idOriginFactory":row.idOriginFactory,
        "billCode": row.originPrintBillCode
      }
      doPrintRemotePrintBill(datas).then(response => {
        // console.log("printBillDoPrint", response);
        var PrintData = {
          '_rootData': response.data
        }
        // console.log(PrintData);
        var data = {
          PrintTemplate: 'printBill.fr3',
          NeedPreview: 1,
          PrintData: JSON.stringify(PrintData)
        }
        // 以后打印调这个通用接口
        doLocalPrint(data);
      }).catch(err => {
        _that.$message.error(err)
      })
    },
    billCodePrint(row) {
      const _that = this;
      var datas = {
        "idOriginFactory":row.idOriginFactory,
        "idOutAssistBill": row.idOriginOutAssisBill,
      }
      doPrintRemoteOutAssistBill(datas).then(response => {
        // console.log("printBillDoPrint", response);
        var PrintData = {
          '_rootData': response.data
        }
        // console.log(PrintData);
        var data = {
          PrintTemplate: 'OutSourceBill_XQD.fr3',
          NeedPreview: 1,
          PrintData: JSON.stringify(PrintData)
        }
        // 以后打印调这个通用接口
        doLocalPrint(data)
      }).catch(err => {
        _that.$message.error(err)
      })
    },
    handleFeedback(row, state) {
      // console.log(row);
      const _that = this;
      _that.idOutAssistBill = row.id;
      _that.feedbackState = state
      if(state==2){
        _that.feedBackVisible = true;
        var data = {
          "idCraftBill": row.id
        }
        getRemoteOutAssistInfo(data).then(res => {
          // console.log("getOutAssistOrderDetail22", res);
          if (res.httpCode == 200) {
            _that.uniqueProcessList = [];
            _that.printOrderFeedBack = res.data;
            // console.log(_that.printOrderFeedBack);
            _that.packOrderList = res.data.packOrderList;
            console.log("111",_that.printOrderFeedBack);
            for (let i = 0; i < res.data.packOrderList.length; i++) {
              _that.$set(res.data.packOrderList[i], 'currentBoxCount', "");
            }
            for (let i = 0; i < res.data.outAssistBillItemList.length; i++) {
              var item = res.data.outAssistBillItemList[i];
              if(!item.outProcessMoney){
                _that.totalMoney= 0
              }else {
                _that.totalMoney+=parseInt(item.outProcessMoney);
              }
              _that.uniqueProcessList.push(item);
            }

          } else {
            // _that.$message.error(res.msg)
          }
        }).catch(err => {
          // _that.$message.error(err)
        })
      }else {
        var datas = {
          ids: row.id,
          state: state
        }

        var Infos = {
          "params": datas,
        }

        feedbackOutAssistBillList(Infos).then(response => {
          // console.log("taskFeedbackPause", response);
          _that.$message("成功");
          _that.getTableInfo();
        }).catch(err => {
          _that.$message.error(err);
        })
      }
    },
    customCellStyle({row, column, rowIndex, columnIndex}) {
      if (column.property === 'currentBoxCount') {
        return {
          background: '#f7b1b180'
        }
      }
    },
    feedbackOutAssistBillBtn(){
      // 反馈外协单,带订单打包
      const _that = this;

      for (const x of _that.packOrderList) {
        // if (x.currentBoxCount === null || x.currentBoxCount === undefined || x.currentBoxCount === '') {
        //   this.$message('打包数量不正确')
        //   return
        // }
        if(x.currentBoxCount == ""){

        }else {
          var regTest = /^(?:(\d+\*\d+)\+)+$/
          var valInput = x.currentBoxCount+'+';
          if(!regTest.test(valInput)){
            _that.$message.error('打包数量存在非法字符,请检查')
            return
          }

          const reg = new RegExp('^[0-9*+]*$')
          const vali = x.currentBoxCount.search(reg)
          if (vali < 0) {
            this.$message.error('打包数量存在非法字符,请检查')
            return
          }
          try {
            // eslint-disable-next-line no-eval
            eval(x.currentBoxCount)
          } catch (e) {
            this.$message.error('打包数量存在非法字符,请检查')
            return
          }
        }


        // const packCount = execMathExpress(x.currentBoxCount)
        // console.log(packCount);
      }
      _that.clickBtn = true;
      var packArray = [];
      for (let i = 0; i < _that.packOrderList.length; i++) {
        var datas = _that.packOrderList[i];
        var item = {
          idOrder:"",
          currentBoxCount:""
        }
        item.idOrder = datas.id;
        if(!datas.currentBoxCount){

        }else {
          item.currentBoxCount = datas.currentBoxCount;
          packArray.push(item)
        }

      }
      var data = {
        feedbackState: _that.feedbackState,
        packOrderList: packArray
      }
      var parms = {
        "idCraftBill": _that.idOutAssistBill,
        "feedbackReq": JSON.stringify(data)
      }
      remoteFeedbackOutAssistBill(parms).then(res => {
        // console.log("getOutAssistOrderDetail22", res);
        if (res.httpCode == 200) {
          _that.$message('反馈成功')
          _that.feedBackVisible = false;
          _that.listData.page= 1;
          _that.getTableInfo();
        } else {
          // _that.$message.error(res.msg)
        }
        _that.clickBtn = false;
      }).catch(err => {
        // _that.$message.error(err)
        _that.clickBtn = false;
      })
    },
    getUnpackagedNum(row){
      return parseInt(row.orderQty)- parseInt(row.boxedOrderQty) || ""
    },
    backCraftBtn(id){
      const _that = this;
      _that.$confirm('确认退回, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var Infos = {
          "idCraftBill": id
        }
        backCraftBill(Infos).then(response => {
          _that.$message("退回成功");
          _that.getTableInfo();
        }).catch(err => {
          _that.$message.error(err);
        })
      }).catch(() => {

      });

    },
    billPrintBtn(){
      //打印外加工单
      const _that = this;
    },
    getBillStep(row){
      const _that = this;
      _that.$refs.billStep.idOrder = row.id
      _that.$refs.billStep.getBillStep()
    },
    checkboxT(row, index) {
      if(row.billState==0 && row.voidFlag==0) {
        return true;
      } else {
        return false;
      }
    },
    acceptBtn(){
      const _that = this;
      if(_that.multipleSelection.length<=0){
        _that.$message("请先选择验收的外加工单");
        return
      }
      var idsArray = [];
      _that.multipleSelection.forEach(item => {
        idsArray.push(item.id)
      })
      var ids = idsArray.join(',')
      var Infos = {
        "ids": ids,
      }
      acceptCraftBills(Infos).then(response => {
        console.log("taskFeedbackPause", response);
        _that.$message("验收成功");
        _that.getTableInfo();
      }).catch(err => {
        _that.$message.error(err);
      })
    },
    handleSelectionChange(val){
      this.multipleSelection = val;

    },
    //行内编辑
    handleCurrentChange(row, event, column) {
      // console.log(row, event, column, event.currentTarget);
    },
    handleEdit(index, row) {
      const _that = this;
    },
    addProcess(){
      var _that = this;
      var processList = {
        craftType: _that.innerForm.craftName.split(',')[2],
        idCraftInfo: _that.innerForm.craftName.split(',')[1],
        craftName: _that.innerForm.craftName.split(',')[0],
        processSize: _that.innerForm.processSize,
        processNum: _that.innerForm.processNum,
        processMoney: _that.innerForm.processMoney,
        processCost: _that.innerForm.processCost,
        processNeedTime: _that.innerForm.processNeedTime,
        processMemo: _that.innerForm.processMemo
      }
      _that.processList.push(processList);
      _that.innerVisible= false;
    },
    innerBtn(){
      //打开工序弹出框
      var _that = this;
      _that.innerVisible = true;
      _that.innerForm= {};
    },
    //启用禁用
    editStatus(id, status) {
      var _that = this;
      var data = {
        id: id,
        voidFlag: status
      }
      var params = {
        "craftBill": JSON.stringify(data),
      }

      var url = '/outassistBusiness/voidCraftBill';
      _that.$refs.confirmDialog.updataClick(params, url);
    },
    handleUpdate(id,billType,billCode,row) {
      const _that = this;
      _that.stepVisible = false;
      _that.dialogTitle = '修改外加工单信息'+'('+billCode+')';
      _that.dialogVisible = true
      _that.dialogStatus = '2'
      _that.byId = id;
      _that.billType = billType;
      var data = {
        idCraftBill: id
      }
      getInfoById(data).then(res => {
        //获取详情
        var datas = res.data;
        _that.processList = datas.processList;
        console.log(datas);
        var billMemo = "";
        if(datas.billMemo==null || datas.billMemo=="" || datas.billMemo==undefined){
          billMemo = datas.originBillMemo;
        }else {
          billMemo = datas.billMemo;
        }
        _that.form = {
          id: id,
          customerName: datas.customerName,
          billCode:datas.billCode,
          originOrderCode:datas.originOrderCode,
          originOutAssistBill:datas.originOutAssistBill,
          originPrintBillCode:datas.originPrintBillCode,
          originOrderProcessStr:datas.originOrderProcessStr,
          printName: datas.printName,
          billMoney: datas.billMoney,
          originBillMemo:datas.originBillMemo,
          billMemo: billMemo,
          expectedDeliverDate: datas.expectedDeliverDate,
          receiveMan: datas.receiveMan,
          sendAddress: datas.sendAddress,
          receivePhone: datas.receivePhone
        }
      }).catch(err => {
        _that.$message.error(err)
      })

      var dataInfo = {
        idOriginFactory: row.idOriginFactory,
        orderCode: row.originOrderCode
      }
      viewRemoteOrder(dataInfo).then(res => {
        //获取详情
        _that.fileInfoData = res.data;
      }).catch(err => {
        _that.$message.error(err)
      })
    },
    handleShowStep(id,billType,billCode,row){
      const _that = this;
      _that.$refs.craftDetail.idBill = id;
      _that.$refs.craftDetail.idOriginFactory = row.idOriginFactory;
      _that.$refs.craftDetail.orderCode = row.originOrderCode;
      _that.$refs.craftDetail.getDetail()
      _that.$refs.craftDetail.getOrderDetail();
      // _that.stepVisible = true;
      // _that.dialogTitle = '查看外加工单信息'+'('+billCode+')';
      // _that.dialogVisible = true
      // _that.dialogStatus = '2'
      // _that.byId = id;
      // _that.billType = 0;

    },
    editBtn() {
      //修改
      const _that = this;
      var infoForm = {
        id:_that.byId,
        customerName: _that.form.customerName,
        printName: _that.form.printName,
        billMoney: _that.form.billMoney,
        billMemo: _that.form.billMemo,
        expectedDeliverDate: _that.form.expectedDeliverDate,
        receiveMan: _that.form.receiveMan,
        sendAddress: _that.form.sendAddress,
        receivePhone: _that.form.receivePhone,
        processList: _that.processList
      }
      // console.log("112213",infoForm);
      var info = JSON.stringify(infoForm)
      var data = {
        "craftBill": info
      }
      // console.log(data);

      updateInfo(data).then(res => {
        // console.log(res);
        if (res.httpCode == 200) {
          _that.dialogVisible = false
          _that.$message({
            message: '修改成功',
            type: 'success'
          });
          _that.tableRefresh();
          _that.dialogVisible = false;
        } else {
          _that.$message.error(res.msg)
        }
      }).catch(err => {
        _that.$message.error(err)
        _that.dialogVisible = false
      })
    },
    addBtn() {
      //增加
      const _that = this;

      var infoForm = {
        customerName: _that.form.customerName,
        printName: _that.form.printName,
        billMoney: _that.form.billMoney,
        billMemo: _that.form.billMemo,
        expectedDeliverDate: _that.form.expectedDeliverDate,
        receiveMan: _that.form.receiveMan,
        sendAddress: _that.form.sendAddress,
        receivePhone: _that.form.receivePhone,
        processList: _that.processList
      }
      console.log(infoForm);
      var info = JSON.stringify(infoForm)
      // console.log(info);
      var data = {
        "craftBill": info
      }

      // console.log("clientLevel",data);
      addInfo(data).then(res => {
        console.log(res);
        if (res.httpCode == 200) {
          _that.dialogVisible = false;
          _that.$message({
            message: '增加成功',
            type: 'success'
          });
          _that.dialogVisible = false;
          _that.tableRefresh();
        } else {
          _that.$message.error(res.msg)
          _that.dialogVisible = false;
        }
      }).catch(err => {
        _that.$message.error(err)
        _that.dialogVisible = false;
      })
    },
    handleCreateAdd() {
      //增加外加工单来源
      const _that = this;
      _that.billType = 1;
      _that.form = {
        id: "",
        customerName: "",
        printName: "",
        billMoney: "",
        billMemo: "",
        expectedDeliverDate: "",
        receiveMan: "",
        sendAddress: "",
        receivePhone: "",
        processList: ""
      }
      _that.processList = [];
      _that.dialogTitle = '增加外加工单'
      _that.dialogStatus = '1';
      _that.dialogVisible = true;

    },
    //获取表格数据
    getTableInfo() {
      const _that = this
      _that.listLoading = true
      var params = {};
      if(_that.search.keyWord!=""){
        params["keyWord"] = _that.search.keyWord;
      }
      if(_that.search.orderCode!=""){
        params["orderCode"] = _that.search.orderCode;
      }
      if(_that.search.printBillCode!=""){
        params["printBillCode"] = _that.search.printBillCode;
      }
      if(_that.search.productName!=""){
        params["productName"] = _that.search.productName;
      }
      params["billStates"] = _that.search.billStates.toString();
      params["voidFlag"] = _that.search.voidFlag;
      var page = {
        pageIndex: _that.listData.page,
        pageSize: _that.listData.pageSize,
      }
      // console.log(params);
      var data = {
        "params": params,
        "page": JSON.stringify(page),
      }
      getInfo(data).then(response => {
        // console.log("tableData",response)
        const data = response.data
        // //  组合表单数据
        _that.tableData = data
        _that.listData.total = response.total
        // console.log(_that.tableData)
        _that.listLoading = false
      }).catch(err => {
        _that.listLoading = false
      })
    },
    getCraft(){
      const _that = this;
      var info = {
        "params": {}
      }
      // console.log(data);
      getCraftInfoList(info).then(response => {
        // console.log("tableData",response)
        const data = response.data;
        // //  组合表单数据
        _that.options = data;
        // console.log(_that.tableData)
        _that.listLoading = false;
      }).catch(err => {
        _that.listLoading = false;
      })
    },
    //刷新表格
    tableRefresh() {
      this.listData.page = 1;
      this.getTableInfo()
    },
    //搜索
    searchData() {
      this.listData.page = 1;
      this.getTableInfo()
    },
    //序号
    indexMethod(index) {
      return index + 1;
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-dialog__header{
  padding: 10px 10px 10px;
}
::v-deep .el-dialog__body{
  padding: 5px 20px;
}
::v-deep .el-card__header{
  padding: 5px 20px;
}
.app-container {
  background-color: #f0f2f5;
  padding: 30px;
  min-height: calc(100vh - 84px);
}

.filter-container {
  margin-bottom: 15px;
}
.tb-edit .el-input {
  display: none
}

.tb-edit .current-row .el-input {
  display: block
}

.tb-edit .current-row .el-input + span {
  display: none
}

</style>
