kd-aiot-frontend-pcs/src/views/recordComponents/workOrderReport.vue

<template>
  <ele-modal
    :title="title"
    :visible.sync="visible"
    :close-on-click-modal="false"
    @close="handleClose"
    resizable
    maxable
    append-to-body
    width="80%"
  >
    <header-title title="基本信息"></header-title>
    <el-form
      ref="formRef"
      :model="addForm"
      :rules="rules"
      label-width="150px"
      v-loading="loading"
      :disabled="type == 'detail'"
    >
      <el-row>
        <el-col :span="8">
          <el-form-item label="记录规则名称" required>
            <el-input
              v-model="addForm.ruleName"
              placeholder="自动带出"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="记录规则分类" required>
            <DictSelection
              dictName="记录规则类型"
              clearable
              v-model="addForm.recordRulesClassify"
              disabled
            >
            </DictSelection>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="检查时间" required prop="checkStartTime">
            <el-date-picker
              v-model="addForm.checkStartTime"
              type="datetime"
              format="yyyy-MM-dd HH:mm:ss"
              value-format="yyyy-MM-dd HH:mm:ss"
              placeholder="选择日期"
              style="width: 100%"
              :picker-options="{
                disabledDate: (time) => time.getTime() > Date.now()
              }"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="报工时间" required prop="checkFinishTime">
            <el-date-picker
              v-model="addForm.checkFinishTime"
              type="datetime"
              format="yyyy-MM-dd HH:mm:ss"
              value-format="yyyy-MM-dd HH:mm:ss"
              placeholder="选择日期"
              style="width: 100%"
              :picker-options="{
                disabledDate: (time) => time.getTime() > Date.now()
              }"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col v-if="!addForm.type" :span="8">
          <el-form-item label="部门">
            <deptSelect
              v-model="addForm.groupId"
              @changeGroup="searchDeptNodeClick"
            />
          </el-form-item>
        </el-col>

        <el-col v-if="!addForm.type" :span="8">
          <el-form-item label="指定负责人" prop="executeUsersIds">
            <el-select
              v-model="addForm.executeUsersIds"
              size="small"
              style="width: 100%"
              multiple
              filterable
              @change="executeIdListChange"
              key="executeUsersIds"
            >
              <el-option
                v-for="item in executorList"
                :key="item.id"
                :value="item.id"
                :label="item.name"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="addForm.type">
          <el-form-item label="班组" required prop="teamId">
            <el-input
              v-model="addForm.teamName"
              placeholder=" "
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="addForm.type">
          <el-form-item label="执行人" required prop="executeUsersIds">
            <el-select
              v-model="addForm.executeUsersIds"
              placeholder="请选择执行人"
              filterable
              multiple
              @change="changeId"
              style="width: 100%"
            >
              <div class="checkboxWrapper">
                <el-checkbox v-model="checked" @change="checkChange">
                  全选
                </el-checkbox>
              </div>
              <el-option
                v-for="item in teamUserList"
                :label="item.name"
                :value="item.id"
                :key="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="addForm.type">
          <el-form-item label="场站" prop="productLineId">
            <el-select
              v-model="addForm.productLineId"
              placeholder="请选择场站"
              filterable
            >
              <el-option
                v-for="item in productLineList"
                :label="item.name"
                :value="item.id"
                :key="item.id"
                @click.native="addForm.productLineName = item.name"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col
          :span="8"
          v-if="
            pageName == 'productionRecords' || pageName == 'qualityTestRecords'
          "
        >
          <el-form-item label="客户" required prop="contactName">
            <el-input
              clearable
              v-model="addForm.contactName"
              @click.native="handParent"
              placeholder="请选择"
              readonly
            />
          </el-form-item>
        </el-col>

        <el-col
          :span="8"
          v-if="
            ['QualityInspection', 'TransportAsh', 'HaulSlag'].includes(pageName)
          "
        >
          <el-form-item label="供应商" required prop="supplierName">
            <el-input
              clearable
              v-model="addForm.supplierName"
              @click.native="handParent"
              placeholder="请选择"
              readonly
            />
          </el-form-item>
        </el-col>
        <el-col
          :span="8"
          v-if="
            ['QualityInspection', 'TransportAsh', 'HaulSlag'].includes(pageName)
          "
        >
          <el-form-item label="采购订单" required prop="purchaseOrderNo">
            <el-input
              clearable
              v-model="addForm.purchaseOrderNo"
              @click.native="openOrd"
              placeholder="请选择"
              readonly
            />
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="pageName == 'QualityInspection'">
          <el-form-item
            label="检查卸车是否到位"
            required
            prop="unloadCheckStatus"
          >
            <el-radio-group v-model="addForm.unloadCheckStatus">
              <el-radio :label="1">已到位</el-radio>
              <el-radio :label="2">未到位</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="9" v-if="pageName == 'QualityInspection'">
          <el-form-item label="车辆照片" prop="vehiclePhotoUrl">
            <WithView
              :assetName="''"
              v-model="addForm.vehiclePhotoUrl"
              style="max-height: 370px"
            ></WithView>
          </el-form-item>
        </el-col>
      </el-row>

      <header-title title="记录数据" :style="`margin-top: 20px`"></header-title>

      <ele-pro-table
        v-loading="loading"
        ref="table"
        row-key="id"
        :columns="detailsColumns"
        :datasource="addForm.detailList"
        :needPage="false"
        :page-size="defPageSize"
      >
        <template v-slot:toolkit>
          <el-button
            v-if="
              ![
                'qualityTestRecords',
                'productionRecords',
                'QualityInspection',
                'HaulSlag',
                'TransportAsh'
              ].includes(pageName)
            "
            type="primary"
            @click="batchCheck"
            >批量检查</el-button
          >
          <el-button
            v-if="
              ![
                'qualityTestRecords',
                'productionRecords',
                'QualityInspection',
                'HaulSlag',
                'TransportAsh'
              ].includes(pageName)
            "
            type="primary"
            @click="batchQualified"
            >批量合格</el-button
          >
        </template>
        <template v-slot:paramValue="{ row }">
          <!-- <div v-if="addForm.recordTemplateStyle == '3'">
            {{ row.productName }}
          </div>
          <div v-else>
            {{ row.paramValue }}
            <span v-if="row.paramValue">{{ row.paramValue }}</span>
            <span v-else>
              {{ row.productName }}
            </span>
            
          </div> -->
          <div> {{ row.paramValue }}</div>
        </template>

        <template v-slot:checkUsersIds="{ row }">
          <div>
            <el-select
              v-model="row.checkUsersIds"
              placeholder="请选择检查人"
              filterable
              multiple
              @change="checkUsersIdsChange(row)"
            >
              <el-option
                v-for="item in addForm.executeUsers"
                :label="item.userName"
                :value="item.userId"
                :key="item.userId"
              >
              </el-option>
            </el-select>
          </div>
        </template>
        <template v-slot:checkStatus="{ row }">
          <div>
            <el-radio-group v-model="row.checkStatus">
              <el-radio :label="1">已检查</el-radio>
              <el-radio :label="0">未检查</el-radio>
            </el-radio-group>
          </div>
        </template>
        <!-- <template v-slot:errorMsg="{ row }">
          <div>
            <el-input
              type="text"
              :rows="1"
              placeholder="请输入"
              v-model="row.errorMsg"
            >
              <template v-if="row.unitName" slot="append">
                <div>{{ row.unitName }}</div>
              </template>
            </el-input>
          </div></template
        > -->
        <template v-slot:num="{ row }">
          <div>
            <el-input
              type="text"
              placeholder="请输入"
              v-model="row.num"
              @input="setValue"
            >
              <template v-if="row.unitName" slot="append">
                <div>{{ row.unitName }}</div>
              </template>
            </el-input>
          </div>
        </template>
        <template v-slot:checkResult="{ row }">
          <div>
            <el-radio-group v-model="row.checkResult">
              <el-radio :label="1">合格</el-radio>
              <el-radio :label="0">不合格</el-radio>
            </el-radio-group>
          </div>
        </template>
      </ele-pro-table>
    </el-form>

    <parentList
      :classType="
        pageName == 'productionRecords' || pageName == 'qualityTestRecords'
          ? '1'
          : '2'
      "
      :type="
        pageName == 'productionRecords' || pageName == 'qualityTestRecords'
          ? '17'
          : '19'
      "
      :code="getCode()"
      ref="parentListRef"
      @changeParent="changeParent"
    >
    </parentList>
    <template v-slot:footer>
      <el-button
        v-if="type == 'add'"
        type="primary"
        @click="submit"
        :loading="butLoading"
        >提 交</el-button
      >
      <el-button @click="handleClose">取 消</el-button>
    </template>
    <orderListDialog
      ref="orderListDialogRef"
      @changeParent="orderListDialogSuccess"
    ></orderListDialog>
  </ele-modal>
</template>

<script>
  import dictMixins from '@/mixins/dictMixins';
  import parentList from '@/components/contact/parentList.vue';
  import {
    producetaskrulerecordSaveOrUpdateAndSubmit,
    getById
  } from '@/api/recordRules/index.js';
  import deptSelect from '@/components/CommomSelect/dept-select.vue';
  import orderListDialog from '@/components/orderListDialog/orderListDialog.vue';
  import { getUserPage } from '@/api/system/organization';
  import { getteampage, getTeam } from '@/api/main/index.js';
  import WithView from '@/components/upload/WithViewNew.vue';
  import dayjs from 'dayjs';
  import { getTableList } from '@/api/purchasingManage/purchaseOrder';

  export default {
    mixins: [dictMixins],
    components: {
      deptSelect,
      parentList,
      orderListDialog,
      WithView
    },
    props: {
      pageName: {
        type: String,
        default: 'productionRecords'
      }
    },
    watch: {
      'addForm.detailList': {
        handler(details) {
          // 排除 物料添加 和 生产统计 模板
          if (this.pageName == 'productionRecords') return;
          const any = details.some((i) => i.checkResult === null);

          if (any || details.length === 0) return;

          const every = details.every((i) => i.checkResult == 1);
          this.addForm.conclusion = every ? 1 : 2;
          console.log('this.addForm.conclusion', this.addForm.conclusion);
        },
        deep: true
      }
    },
    data() {
      const formBaseData = {
        id: null,
        workshopArea: '',
        workshopAreaId: null,
        checkFinishTime: '',
        checkStartTime: '',
        checkValidity: null,
        checkValidityUnit: '',
        conclusion: null,
        isTempRecord: this.isTempRecord,
        unloadCheckStatus: 1,
        vehiclePhotoUrl: '',
        detailList: [],
        deviceId: 0,
        deviceName: '',
        batchNo: '',
        executeMethod: 0,
        formingNum: 0,
        itemType: 0,
        produceRoutingId: 0,
        produceRoutingName: '',
        produceTaskConfigId: 0,
        produceTaskId: 0,
        produceTaskName: '',
        productCode: '',
        productModel: '',
        productName: '',
        recordRulesClassify: null,
        recordTemplateStyle: null,
        ruleId: 0,
        ruleName: '',
        reportWorkType: 0,
        specification: '',
        workOrderCode: '',
        workOrderId: 0,
        itemTaskName: '',
        brandNo: '',
        duration: null,
        // 执行人
        executeUsersIds: [],
        executeUsers: [],
        // 班组id
        teamId: '',
        groupId: null,
        // 物料字段name
        pickDetails: [],
        // 本次产出明细
        outputDetails: [],
        recordRulesExecuteMethodId: null,
        recordRulesExecuteMethodName: '',
        // 	产出类型 1-原材料，2-在制品，3.BOM标准产出
        outputType: 1,
        type: 0,
        contactName: '',
        contactId: '',
        supplierId: '',
        supplierName: '',
        productLineId: null,
        productLineName: '',
        purchaseOrderId: '',
        purchaseOrderNo: ''
      };

      return {
        visible: false,
        activeIndex: 0,
        type: 'add',
        title: '报工',
        formBaseData,
        addForm: JSON.parse(JSON.stringify(formBaseData)),
        rules: {
          checkStartTime: [
            { required: true, message: '请选择检查时间', trigger: 'blur' },
            {
              required: true,
              message: '请选择检查时间',
              trigger: 'change'
            },
            {
              validator: (rule, value, callback) => {
                if (!value) return callback();
                const start = new Date(value).getTime();
                const now = Date.now();
                if (start > now) {
                  callback(new Error('检查时间不能超过当前时间'));
                } else {
                  callback();
                }
              },
              trigger: 'blur'
            }
          ],
          checkFinishTime: [
            { required: true, message: '请选择报工时间', trigger: 'blur' },
            {
              required: true,
              message: '请选择报工时间',
              trigger: 'change'
            },
            {
              validator: (rule, value, callback) => {
                if (!value) return callback();
                const start = new Date(this.addForm.checkStartTime).getTime();
                const finish = new Date(value).getTime();
                const now = Date.now();
                if (finish < start) {
                  callback(new Error('报工时间必须大于检查开始时间'));
                } else if (finish > now) {
                  callback(new Error('报工时间不能超过当前时间'));
                } else {
                  callback();
                }
              },
              trigger: 'blur'
            }
          ],
          vehiclePhotoUrl: [
            { required: true, message: '请选择', trigger: 'blur' }
          ],
          contactName: [
            { required: true, message: '请选择', trigger: 'blur' },
            { required: true, message: '请选择', trigger: 'change' }
          ],
          supplierName: [
            { required: true, message: '请选择', trigger: 'blur' },
            { required: true, message: '请选择', trigger: 'change' }
          ],
          teamId: [
            { required: true, message: '请选择班组', trigger: 'blur' },
            { required: true, message: '请选择班组', trigger: 'change' }
          ],
          executeUsersIds: [
            { required: true, message: '请选择', trigger: 'blur' },
            { required: true, message: '请选择', trigger: 'change' }
          ],
          purchaseOrderNo: [
            { required: true, message: '请选择', trigger: 'blur' },
            { required: true, message: '请选择', trigger: 'change' }
          ]
        },
        loading: false,
        butLoading: false,
        checked: false,
        teamUserList: [],
        teamList: [],
        teamAllList: [],

        executorList: [],
        allTeamList: [],
        productLineList: []
      };
    },
    computed: {
      activeTeamUserList() {
        return this.teamUserList.filter((user) =>
          this.addForm.executeUsersIds.includes(user.id)
        );
      },
      // 规则详情表头
      detailsColumns() {
        let list = [
          {
            width: 45,
            type: 'index',
            columnKey: 'index',
            align: 'center'
          },
          {
            label: '检查内容',
            prop: 'paramValue',
            minWidth: 120,
            slot: 'paramValue'
          },
          {
            label: '物联点位',
            prop: 'iotPointName',
            minWidth: 120
          },

          {
            label: '设备名称',
            prop: 'substanceName',
            minWidth: 120
          },
          {
            label: '值',
            prop: 'num',
            minWidth: 120,
            slot: 'num'
          },
          {
            label: '检查人',
            prop: 'checkUsersIds',
            minWidth: 120,
            slot: 'checkUsersIds',
            isNone: this.pageName != 'qualityTestRecords'
          },

          {
            label: '检查情况',
            prop: 'checkStatus',
            minWidth: 120,
            slot: 'checkStatus',
            isNone: [
              'qualityTestRecords',
              'productionRecords',
              'QualityInspection',
              'HaulSlag',
              'TransportAsh'
            ].includes(this.pageName)
          },

          {
            label: '检查结果',
            prop: 'checkResult',
            minWidth: 120,
            isNone: [
              'qualityTestRecords',
              'productionRecords',
              'QualityInspection',
              'HaulSlag',
              'TransportAsh'
            ].includes(this.pageName),
            slot: 'checkResult'
          }
        ];

        return list.filter((item) => !item.isNone);
      }
    },
    created() {
      if (localStorage.getItem('singleUserInfo') == '1') {
        const data = JSON.parse(localStorage.getItem('chooseUserInfo'));
        this.getTeamList(data.teamId);
      } else {
        this.getTeamList(this.$store.state.user.info.teamId);
      }
      // 获取审核人列表、巡点检人员
    },
    methods: {
      // 外部调用，打开弹窗
      async open(type = 'add', data) {
        this.type = type;
        console.log('data', data);
        if (type == 'add') {
          this.title = '报工';
        } else {
          this.title = '详情';
        }
        await this.getUserList();
        await this.getAllTeamList();
        await this.getOrderDetials(data.id);
        this.visible = true;
      },
      handParent() {
        this.$refs.parentListRef.open();
      },
      changeParent(data) {
        this.addForm.contactName = data.name;
        this.addForm.contactId = data.id;
        this.addForm.supplierName = data.name;
        this.addForm.supplierId = data.id;
        if (
          ['QualityInspection', 'HaulSlag', 'TransportAsh'].includes(
            this.pageName
          )
        ) {
          let data = {
            pageNum: 1,
            size: 999,
            orderStatus: 2,
            partbId: data.id
          };

          //来煤获取采购订单
          getTableList({
            pageNum: 1,
            size: 999,
            orderStatus: 2,
            partbId: data.id
          }).then((res) => {
            if (res.list?.length == 1) {
              this.addForm.purchaseOrderId = res.list[0].id;
              this.addForm.purchaseOrderNo = res.list[0].orderNo;
            }
          });
        }
      },
      getCode() {
        if (this.$store.state.user.info.clientEnvironmentId == 10) {
          return this.pageName == 'QualityInspection'
            ? '06mei'
            : this.pageName == 'TransportAsh'
            ? '07lafei'
            : this.pageName == 'HaulSlag'
            ? '08lazha'
            : '';
        } else {
          return '';
        }
      },
      // 获取工单详情
      async getOrderDetials(id) {
        try {
          const data = await getById(id);
          console.log('data', data);
          data.detailList = data.detailList.map((i) => {
            i.toolNames = i.tools.map((j) => j.toolName).join(',');
            if (i.checkUsers && i.checkUsers.length > 0) {
              console.log('i.checkUsers', i.checkUsers);
              i.checkUsersIds = i.checkUsers.map((j) => j.userId);
            }

            if (
              (!i.checkUsersIds || i.checkUsersIds.length == 0) &&
              data.executeUsers.length > 0
            ) {
              // 默认执行人作为检查人
              i.checkUsersIds = data.executeUsers
                .filter((i) => i.userId)
                .map((j) => j.userId);
              i.checkUsers = data.executeUsers
                .filter((i) => i.userId)
                .map((j) => {
                  return {
                    teamId: j.teamId,
                    teamName: j.teamName,
                    userId: j.userId,
                    userName: j.userName
                  };
                });
            }
            return i;
          });

          Object.assign(this.addForm, data);
          this.addForm.unloadCheckStatus = this.addForm.unloadCheckStatus || 1;

          this.addForm.checkStartTime =
            this.addForm.checkStartTime ||
            dayjs(new Date()).format('YYYY-M-D HH:mm:ss');
          this.addForm.checkFinishTime =
            this.addForm.checkFinishTime ||
            dayjs(new Date()).format('YYYY-M-D HH:mm:ss');
          console.log(
            this.addForm.checkStartTime,
            'this.addForm.checkStartTime'
          );
          // 处理数据
          this.addForm.executeUsersIds = this.addForm.executeUsers
            .map((i) => i.userId)
            .filter((i) => i); // 过滤掉 undefined

          // this.addForm.teamId =
          //   this.addForm.executeUsers.length > 0
          //     ? this.addForm.executeUsers[0].teamId
          //     : '';

          if (this.addForm.executeUsers.length > 0 && !this.addForm.type) {
            this.addForm.groupId = this.addForm.executeUsers[0]?.groupId + '';
            this.addForm.groupName = this.addForm.executeUsers[0]?.groupName;
            if (this.addForm.groupId) {
              this.searchDeptNodeClick(this.addForm.groupId, 'init');
            }
          }

          if (!this.addForm.teamId && this.teamList.length > 0) {
            this.addForm.teamId = this.teamList[0].id;
          }

          this.addForm.recordRulesClassify += '';

          // 加载班组人员列表
          if (this.addForm.teamId) {
            const index = this.allTeamList.findIndex(
              (item) => item.id == this.addForm.teamId
            );
            console.log(this.allTeamList[index], 'dsadas');
            this.teamUserList = this.allTeamList[index].userVOList;
            this.productLineList = [];

            this.allTeamList[index].factoryWorkstationVOList.forEach((item) => {
              if (
                !this.productLineList.find(
                  (p) => p.id === item.productionLineId
                )
              ) {
                this.productLineList.push({
                  name: item.productionLineName,
                  id: item.productionLineId
                });
              }
            });

            console.log('this.teamUserList', this.teamUserList);
          }

          //宇信
          if (
            this.$store.state.user.info.clientEnvironmentId == 10 &&
            ['productionRecords', 'qualityTestRecords'].includes(this.pageName)
          ) {
            //客户:5#和6#默认是重油公司7#默认是红山 2008389016775864321==7#
            if (this.addForm.productLineId == '2008389016775864321') {
              this.addForm.contactId =
                this.addForm.contactId || '2008562263580520449';
              this.addForm.contactName =
                this.addForm.contactName || '克拉玛依红山油田有限责任公司';
            } else {
              this.addForm.contactId =
                this.addForm.contactId || '2008383566202318850';
              this.addForm.contactName =
                this.addForm.contactName || '中国石油新疆油田分公司(重油公司)';
            }
          }
          this.setValue();
          this.$nextTick(() => {
            this.$refs.formRef.clearValidate();

            this.loading = false;
          });
        } catch (error) {
          console.log('error', error);
          this.loading = false;
        }
      },
      openOrd() {
        if (!this.addForm.supplierId) {
          this.$message.warning('请先选择供应商！');
          return;
        }
        this.$refs.orderListDialogRef.open(
          this.addForm.supplierId,
          //渣和灰拿委外订单
          ['TransportAsh', 'HaulSlag'].includes(this.pageName)
            ? '3,4,5,6,7'
            : ''
        );
      },
      orderListDialogSuccess(data) {
        this.addForm.purchaseOrderId = data.id;
        this.addForm.purchaseOrderNo = data.orderNo;
      },
      setValue() {
        if (this.title == '报工') {
          this.addForm.detailList.forEach((item, index) => {
            if (this.pageName == 'productionRecords') {
              if (item.paramValue == '用煤量') {
                let num1 = this.addForm.detailList.find(
                  (item1) => item1.paramValue == '用水量'
                )?.num;
                console.log(num1, 'num1');
                let num = 0;
                if (num1) {
                  num = (62 / 600) * num1;
                }

                this.$set(
                  this.addForm.detailList[index],
                  'num',
                  parseFloat(num.toFixed(5))
                );
              }
            }
            if (this.pageName == 'qualityTestRecords') {
              let num1 = this.addForm.detailList.find(
                (item1) => item1.paramValue == '给水量'
              )?.num;
              let num2 = this.addForm.detailList.find(
                (item1) => item1.paramValue == '炉水量'
              )?.num;
              let num = 0;
              if (num1 && num2) {
                num = (num2 - num1) / num2;
              }
              if (item.paramValue == '干度') {
                this.$set(
                  this.addForm.detailList[index],
                  'num',
                  parseFloat(num.toFixed(5)) * 100
                );
              }
              if (item.paramValue == '是否合格' && num1) {
                this.$set(
                  this.addForm.detailList[index],
                  'num',
                  parseFloat(num.toFixed(5)) * 100 >= 90 ? '合格' : '不合格'
                );
              }
            }
            if (this.pageName == 'productionRecords') {
              let num1 = this.addForm.detailList.find(
                (item1) => item1.paramValue == '日用水量'
              )?.num;

              let num = 0;
              if (num1) {
                num = num1 * 0.1034;
              }
              if (item.paramValue == '日用煤量') {
                this.$set(
                  this.addForm.detailList[index],
                  'num',
                  parseFloat(num.toFixed(5))
                );
              }
            }
          });
        }
      },
      // 关闭时清理表单
      handleClose() {
        this.addForm = JSON.parse(JSON.stringify(this.formBaseData));
        this.$nextTick(() => {
          this.$refs.formRef.clearValidate();
          this.visible = false;
        });
      },
      // 提交
      submit() {
        this.$refs.formRef.validate(async (valid) => {
          if (valid) {
            console.log('this.addForm', this.addForm);
            // this.handleClose();
            if (this.addForm.executeUsersIds.length == 0) {
              this.$message.warning('请选择执行人！');
              return;
            }

            // 报工需要验证 缓存不验证 排除 recordTemplateStyle ==3 物料添加 == 4生产统计 模板
            if (
              ![
                'qualityTestRecords',
                'productionRecords',
                'QualityInspection',
                'HaulSlag',
                'TransportAsh'
              ].includes(this.pageName)
            ) {
              // 验证检查项目
              const detailRequired = this.addForm.detailList.some((i) => {
                return i.checkResult == null || i.checkStatus == null;
              });

              if (detailRequired) {
                return this.$message.warning(
                  '请先完善、检查情况、检查结果 内容！'
                );
              }
            }

            const body = JSON.parse(JSON.stringify(this.addForm));
            console.log(body);
            // return

            this.butLoading = true;

            try {
              await producetaskrulerecordSaveOrUpdateAndSubmit(body);
              this.$message.success('报工成功！');
              this.butLoading = false;
              this.$emit('refresh');
              this.handleClose();
            } catch (error) {
              this.butLoading = false;
            }
          }
        });
      },

      checkTeamList(id) {
        const index = this.teamList.findIndex((item) => item.id == id);
        this.teamUserList = this.teamAllList[index];
        this.addForm.teamName = this.teamList[index].name;
        console.log('this.teamUserList', this.teamUserList);
      },
      async getTeamList(id) {
        if (!id) return;
        const ids = id.split(',');
        this.teamList = [];
        this.teamUserList = [];
        const list = ids.map((item) => getTeam(item));

        const dataList = await Promise.all(list);

        dataList.forEach((item) => {
          this.teamList.push({
            name: item.name,
            id: item.id
          });

          this.teamAllList.push(item.userVOList);
        });
      },
      changeId() {
        if (this.addForm.executeUsersIds.length == this.teamUserList.length) {
          this.checked = true;
        } else {
          this.checked = false;
        }

        const deleteUserIds = this.addForm.executeUsers
          .map((i) => i.userId)
          .filter((id) => !this.addForm.executeUsersIds.includes(id));

        const addUserIds = this.addForm.executeUsersIds.filter(
          (id) => !this.addForm.executeUsers.map((i) => i.userId).includes(id)
        );

        // 删除 用户
        if (deleteUserIds.length > 0) {
          this.addForm.executeUsers = this.addForm.executeUsers.filter(
            (item) => !deleteUserIds.includes(item.userId)
          );
        }

        // 添加 用户
        addUserIds.forEach((id) => {
          const user = this.teamUserList.find((item) => item.id === id);
          if (user) {
            this.addForm.executeUsers.push({
              teamId: this.addForm.teamId,
              teamName: this.teamList.find(
                (team) => team.id == this.addForm.teamId
              )?.name,
              userId: user.id,
              userName: user.name
            });
          }
        });
        this.addForm.detailList.forEach((detail) => {
          detail.checkUsersIds = this.addForm.executeUsersIds;
          detail.checkUsers = this.addForm.executeUsers;
        });
      },
      checkUsersIdsChange(row) {
        // 同步 checkUsers
        row.checkUsers = row.checkUsersIds.map((i) => {
          const user = this.addForm.executeUsers.find(
            (item) => item.userId === i
          );
          return user;
        });

        console.log('row', row);
      },
      checkChange() {
        this.addForm.executeUsersIds = [];
        if (this.checked) {
          this.addForm.executeUsersIds = this.teamUserList.map(
            (item) => item.id
          );
        } else {
          this.addForm.executeUsersIds = [];
        }
        this.changeId();
      },

      // 批量检查
      batchCheck() {
        this.addForm.detailList = this.addForm.detailList.map((i) => {
          i.checkStatus = 1;
          return i;
        });
      },
      // 批量合格
      batchQualified() {
        this.addForm.detailList = this.addForm.detailList.map((i) => {
          i.checkResult = 1;
          return i;
        });
      },
      // 获取审核人列表、巡点检人员
      async getUserList(params) {
        try {
          let data = { pageNum: 1, size: -1 };
          // 如果传了参数就是获取部门人员数据
          if (params) {
            data = Object.assign(data, params);
          }
          const res = await getUserPage(data);
          if (params) {
            this.executorList = res.list;
          } else {
            this.uerList = res.list;
          }
        } catch (error) {}
      },
      //选择部门(搜索)
      async searchDeptNodeClick(groupId, type) {
        if (groupId) {
          // 根据部门获取人员
          const params = { groupId: groupId };
          await this.getUserList(params);
        } else {
          this.addForm.groupId = null;
        }
        if (type != 'init') {
          this.addForm.detailList.forEach((detail) => {
            detail.checkUsersIds = [];
            detail.checkUsers = [];
          });
          this.addForm.executeUsers = [];
          this.addForm.executeUsersIds = [];
        }
      },
      // 负责人变更 同步执行人列表
      executeIdListChange() {
        this.addForm.executeUsers = this.addForm.executeUsersIds
          .map((userId) => {
            const user = this.executorList.find((u) => u.id === userId);
            if (!user) return null;
            return {
              userId: user.id,
              userName: user.name,
              groupId: user.groupId,
              groupName: user.groupName
            };
          })
          .filter((i) => i);
        // 同步详情执行人
        this.addForm.detailList.forEach((detail) => {
          detail.checkUsersIds = this.addForm.executeUsersIds;
          detail.checkUsers = this.addForm.executeUsers;
        });
        console.log('this.addForm.executeUsers', this.addForm.executeUsers);
      },
      async getAllTeamList() {
        const { list } = await getteampage({
          pageNum: 1,
          size: -1
        });
        console.log('teamAllList 班组', list);
        this.allTeamList = list;
      }
    }
  };
</script>

<style scoped lang="scss">
  :deep(.el-form) {
    .el-form-item:last-child {
      margin-bottom: 22px !important;
    }
  }

  ::v-deep .el-row {
    display: flex;
    flex-wrap: wrap;
  }

  .checkboxWrapper {
    padding: 8px 20px;
    border-bottom: 1px solid #ccc;
  }

  ::v-deep .el-select__tags {
    flex-wrap: nowrap;
    overflow: auto;
  }

  /* 输入框最大宽度*/
  ::v-deep .el-select__tags-text {
    max-width: 90px;
  }

  /* 底部滚动条的高度*/
  ::v-deep .el-select__tags::-webkit-scrollbar {
    height: 2px !important;
  }

  .footer-box {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
  }
</style>