<template>
  <view>
    <u-modal :title="$t('修改报工')" @cancel="(show = false, $emit('close'))" show-cancel-button
        :cancelText="$t('关闭')" :show-confirm-button="false"
        :title-style="{ 'background-color': '#1E3770', color: '#FFFFFF', 'line-height': '37px', 'padding-top': '0px' }"
        v-model="show" width="100%" height="100%" :content-style="{ height: '87vh' }">
        <zb-table :columns="editFeedingColumn" :stripe="true" :border="true" :data="editFeedingTable" style="height: calc(100% - 40px)" class="editzbtable">
            <template slot="number" slot-scope="scope">
            <span>{{ getSumNumber(scope.row) }}</span>
            </template>
            <template slot="pro" slot-scope="scope">
            <u-button
                size="mini"
                type="text"
                @click="handleView(scope.row)"
            >{{$t('查看')}}</u-button>
            <u-button
                size="mini"
                type="text"
                style="margin-left: 10rpx"
                icon="edit-pen"
                @click="handleUpdate(scope.row)"
            >{{$t('修改')}}</u-button>
            <u-button
                size="mini"
                type="text"
                style="margin-left: 10rpx"
                icon="trash"
                @click="handleDelete(scope.row)"
            >{{$t('删除')}}</u-button>
              <u-button
                  size="mini"
                  type="text"
                  style="margin-left: 10rpx"
                  icon="edit-pen"
                  @click="handlePrintQrcode(scope.row)"
              >{{$t('补打')}}</u-button>
            </template>
        </zb-table>
        <uni-pagination :show-icon="true" style="margin-top: 10rpx;" v-if="total" :total="total" :current="queryParams.pageNum" :pageSize="queryParams.pageSize" @change="handlePage" />
    </u-modal>
    <!-- 添加或修改生产报工记录对话框 -->
    <u-modal :cancelText="$t('取消')" :confirmText="$t('确认')" :title="title" v-model="open" width="80%" :show-confirm-button="optType !='view' " show-cancel-button
    @confirm="submitForm" :title-style="{ 'background-color': '#1E3770', color: '#FFFFFF', 'line-height': '37px', 'padding-top': '0px' }" :content-style="{ padding: '20rpx', 'max-height': '87vh' }">
      <u-form ref="form" :model="form" label-width="100px">
        <u-row>
          <u-col :span="6">
            <u-form-item :label="$t('报工类型')" prop="feedbackType">
              <uni-data-select v-model="form.feedbackType"
                  :localdata="dict.type.mes_feedback_type" disabled></uni-data-select>
            </u-form-item>
          </u-col>
          <u-col v-if="form.feedbackType == 'ASSIST_PROCESS'" :span="6">
            <u-form-item :label="$t('外协单号')" prop="assistProcessCode">
              {{form.assistProcessCode}}
            </u-form-item>
          </u-col>
          <u-col v-if="form.feedbackType == 'ASSIST_PROCESS'" :span="6">
            <u-form-item :label="$t('是否关单')" prop="closeType">
              <u-radio-group v-model="form.closeType" disabled>
                <u-radio :label="1">{{$t('是')}}</u-radio>
                <u-radio :label="0">{{$t('否')}}</u-radio>
              </u-radio-group>
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('生产工单')" prop="workorderCode">
              {{form.workorderCode}}
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('生产任务')" prop="taskCode">
              {{form.taskCode}}
            </u-form-item>
          </u-col>
        </u-row>
        <u-row>
          <u-col :span="6">
            <u-form-item :label="$t('产品编码')" prop="sapItemCode">
              {{form.sapItemCode}}
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('产品名称')" prop="itemName">
              {{form.itemName}}
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('单位')" prop="unitOfMeasure">
              {{form.unitOfMeasure}}
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('规格型号')" prop="specification">
              {{form.specification}}
            </u-form-item>
          </u-col>
        </u-row>
        <u-row>
          <u-col :span="6">
            <u-form-item :label="$t('报工数量')" prop="quantityFeedback">
              <u-input disabled v-model="form.quantityFeedback" :input-width="190" />
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('良品报工')" prop="quantityQualify">
              <u-number-box :min="0" @change="handleQuantityChanged" :input-width="190" v-model="form.quantityQualify" :long-press="false" :placeholder="$t('请输入良品报工')" />
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('不良品报工')" prop="quantityUnqualify">
              <u-number-box :min="0" @change="handleQuantityChanged" :input-width="190" v-model="form.quantityUnqualify" :long-press="false" :placeholder="$t('请输入不良品报工')" />
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('加工工时')" prop="machineTime">
              <u-number-box :min="0" v-model="form.machineTime" :input-width="190" :placeholder="$t('请输入加工工时')" :long-press="false" />
            </u-form-item>
          </u-col>
        </u-row>
        <u-row>
          <u-col :span="6">
            <u-form-item :label="$t('报工人')" prop="nickName">
              {{form.nickName}}
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('报工时间')" prop="feedbackTime">
              {{form.feedbackTime}}
            </u-form-item>
          </u-col>
          <u-col :span="6">
            <u-form-item :label="$t('审核人')" prop="recordNick">
              {{form.recordNick}}
            </u-form-item>
          </u-col>
        </u-row>
        <u-row>
          <u-col :span="24">
            <u-form-item :label="$t('备注')" prop="remark">
              {{form.remark}}
            </u-form-item>
          </u-col>
        </u-row>
      </u-form>
    </u-modal>
  </view>
</template>

<script>
import i18n from '../../../../lang/index'

import UButton from '../../../../uview-ui/components/u-button/u-button.vue';
import dayjs from 'dayjs'
export default {
  name: 'editFeeding',
  props: ['value'],
  dicts: ["mes_feedback_type"],
  components: {
    UButton
  },
  data() {
    return {
      editFeedingColumn: [
        {
          name: 'workstationName',
          label: i18n.t('工作中心'),
          width: 170
        },
        {
          name: 'workunitName',
          label: i18n.t('工作单元'),
          width: 170
        },
        {
          name: 'workorderCode',
          label: i18n.t('生产工单编号'),
          width: 120
        },
        {
          name: 'quantityQualify',
          label: i18n.t('报工数量'),
          width: 100,
          type: 'slot',
          slot: 'number'
        },
        {
          name: 'quantityQualify',
          label: i18n.t('合格数量'),
          width: 80
        },
        {
          name: 'quantityUnqualify',
          label: i18n.t('不合格数量'),
          width: 80
        },
        {
          name: 'nickName',
          label: i18n.t('报工人'),
          width: 80
        },
        {
          name: 'feedbackTime',
          label: i18n.t('报工时间'),
          width: 180
        },
        {
          name: 'peration',
          label: i18n.t('操作'),
          width: 170,
          type: 'slot',
          slot: 'pro'
        }
      ],
      total: 0,
      queryParams: {
        pageNum: 1,
        pageSize: 10
      },
      title: '',
      open: false,
      optType: '',
      form: {},
      show: false,
      editFeedingTable: [],
    }
  },
  watch: {
    value () {
        this.show = this.value
    }
  },
  methods: {
    handleQuantityChanged(){
      this.form.quantityFeedback = this.form.quantityQualify + this.form.quantityUnqualify;
    },
    getSumNumber(row) {
      const first = row.quantityQualify? Number(row.quantityQualify): 0
      const last = row.quantityUnqualify? Number(row.quantityUnqualify): 0
      return first + last
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const recordIds = row.recordId;
      uni.showModal({
        title: i18n.t('系统提示'),
        content: i18n.t('是否确认删除生产报工记录编号为"') + recordIds + i18n.t('"的数据项？'),
        success:  (res) => {
          if (res.confirm) {
            this.$u.api.delFeedback(recordIds).then((response) => {
              if(response.code && response.code === 200) {
                this.getList();
                this.$u.toast(i18n.t('删除成功'));
              } else {
                this.$u.toast(response.msg || i18n.t('删除失败'));
              }
            })
          }
        }
      })
    },
    /**打印二维码*/
    handlePrintQrcode(row) {
      let workunitName='';
      this.$u.api.getNextProcess({taskId:row.taskId}).then(workunit =>{
        workunitName = workunit.data.workunitName;
        this.printPdfSocket({
          reportName: 'mysql:qrcode-50*50-2',
          values: {
            detail: [
              {
                barcode: row.workorderCode,
                showText: i18n.t('编排单号:')+row.arrangeCode+i18n.t('\n数量:')+row.quantityQualify+i18n.t('\n工单号:')+row.workorderCode+i18n.t('\n下一道工序机台:')+workunitName,
                gp:1
              },
              {
                barcode: row.workorderCode,
                showText: i18n.t('编排单号:')+row.arrangeCode+i18n.t('\n数量:')+row.quantityQualify+i18n.t('\n工单号:')+row.workorderCode+i18n.t('\n下一道工序机台:')+workunitName,
                gp:1
              }
            ]
          }
        })
      });

    },


    /** 修改按钮操作 */
    handleUpdate(row) {
      this.form = {}
      const recordId = row.recordId
      this.$u.api.getFeedback(recordId).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = i18n.t('修改生产报工记录');
        this.optType = "edit";
      });
    },
    // 查询明细按钮操作
    handleView(row){
      this.form = {}
      const recordId = row.recordId;
      this.$u.api.getFeedback(recordId).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = i18n.t('查看生产报工单信息');
        this.optType = "view";
      });
    },
    submitForm() {
        if (this.form.recordId != null) {
          this.form.sizeReportData = this.form.sizeReportData ? this.form.sizeReportData : []
          this.form.directiveReportData = this.form.directiveReportData ? this.form.directiveReportData : []
            this.$u.api.updateFeedback(this.form).then(response => {
              if(response.code && response.code === 200) {
                this.$u.toast(i18n.t('修改成功'));
                this.open=false;
                this.getList();
              } else {
                this.$u.toast(response.msg || i18n.t('修改失败'));
              }
                
            });
        }
    },
    // 分页点击事件
		handlePage(params) {
			this.queryParams.pageNum = params.current;
			this.getList() // 点击的时候去请求查询列表
		},
    getList() {
      if(this.$store.state && this.$store.state.vuex_workunit) this.queryParams.workunitId = this.$store.state.vuex_workunit.workunitId
        const params = {
            ...this.queryParams,
            createStartTime: dayjs().subtract(5, 'minute').format('YYYY-MM-DD HH:mm:ss'),
            createEndTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
            userId: this.vuex_user.userId
        }
        return new Promise((resolve, reject) => {
            this.$u.api.feedbacklist(params).then((res)=>{
                if (res.code === 200) {
                    this.editFeedingTable = res.rows
                    this.total = res.total
                    resolve()
                } else {
                    reject()
                }
            })
        })
        
    }
  }
}
</script>

<style lang="scss" scoped>
/deep/ .editzbtable .item-td {
  word-break: break-all;
}
</style>