<template>
  <div class="index-inner">
    <el-form
      style="padding: 20px; width: 100%"
      :model="form"
      v-form
      label-width="110px"
      data-vv-scope="form"
      ref="taskManageForm"
      :rules="rules"
      :disabled="readDetaial"
    >
      <el-collapse v-model="activeNames">
        <el-collapse-item name="1">
          <template slot="title">
            <span class="tip"></span>创建养护工单
          </template>
          <el-card>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="工单号"
                  prop="workOrderInformation.jobNumber"
                >
                  <el-input
                    v-model="form.workOrderInformation.jobNumber"
                    disabled
                    placeholder="由后台生成"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="工单类型" prop="workOrderInformation.type">
                  <!-- <el-input v-model="form.type"></el-input> -->
                  <dict-select
                    dictCode="yhgd-gdlx"
                    :hasDefaultOption="true"
                    clearable
                    @input="(val, obj) => handleDict(val, obj, 'yhgd-gdlx')"
                    v-model="form.workOrderInformation.type"
                    style="width: 100%"
                    :disabled="disabledCreated"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="路段"
                  prop="workOrderInformation.roadSegmentId"
                >
                  <!-- <el-input v-model="form.roadSegmentId"></el-input> -->
                  <!-- <router-info-selector
                    v-model="form.workOrderInformation.roadSegmentId"
                    :value="form.workOrderInformation.roadSegmentId"
                    @changed="changed"
                    @value="value"
                    :disabledCreated="disabledCreated"
                  /> -->
                  <sction-info-selector
                    v-model="form.workOrderInformation.roadSegmentName"
                    :value="form.workOrderInformation.roadSegmentId"
                    @changed="changed"
                    @value="value"
                    :disabled="disabledCreated"
                  />
                </el-form-item>
              </el-col>
              <!-- <el-col :span="12">
                <el-form-item
                  label="施工单位"
                  prop="workOrderInformation.companyName"
                >
                  <company-info-selector
                    v-model="form.workOrderInformation.companyName"
                    :valueName="form.workOrderInformation.companyIds"
                    @handleChanged="handleChanged"
                    @value="companyValue"
                    :disabledCreated="disabledCreated"
                  />
                </el-form-item>
              </el-col> -->
              <el-col :span="12">
                <el-form-item label="位置" prop="workOrderInformation.position">
                  <el-input
                    :disabled="disabledCreated"
                    v-model="form.workOrderInformation.position"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="合同"
                  prop="workOrderInformation.contractId"
                >
                  <!-- <el-input v-model="form.contractId"></el-input> -->
                  <el-select
                    v-model="form.workOrderInformation.contractId"
                    placeholder="请选择合同"
                    style="width: 100%"
                    @change="contractChange"
                    :disabled="disabledCreated"
                  >
                    <el-option
                      v-for="item in contractInfoList"
                      :value="item.id"
                      :label="item.name"
                      :key="item.id"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  label="类别"
                  prop="workOrderInformation.categoryId"
                >
                  <!-- <el-input v-model="form.categoryId"></el-input> -->
                  <el-select
                    v-model="form.workOrderInformation.categoryId"
                    placeholder="请选择"
                    @change="changesele"
                    style="width: 100%"
                    :disabled="disabledCreated"
                  >
                    <el-option
                      v-for="item in options"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="细目"
                  prop="workOrderInformation.detailsId"
                >
                  <!-- <el-input v-model="form.detailsId"></el-input> -->
                  <el-select
                    v-model="form.workOrderInformation.detailsId"
                    placeholder="请选择"
                    style="width: 100%"
                    :disabled="disabledCreated"
                    @change="dsubchange"
                  >
                    <el-option
                      v-for="item in cbkm"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  label="要求修复时间"
                  prop="workOrderInformation.demandFinishTime"
                >
                  <!-- <el-input v-model="form.demandFinishTime"></el-input> -->
                  <el-date-picker
                    v-model="form.workOrderInformation.demandFinishTime"
                    type="date"
                    placeholder="选择日期"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd"
                    style="width: 100%"
                    :disabled="disabledCreated"
                  >
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="签发人" prop="workOrderInformation.issuer">
                  <el-input
                    :disabled="disabledCreated"
                    v-model="form.workOrderInformation.issuer"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  label="养护单位"
                  prop="workOrderInformation.maintenanceUnitAudit"
                >
                  <company-info-selector
                    v-model="form.workOrderInformation.maintenanceUnitAudit"
                    :valueName="
                      form.workOrderInformation.maintenanceUnitAuditIds
                    "
                    @handleChanged="handleChangedA"
                    @value="companyValueA"
                    :disabledCreated="disabledCreated"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="签发日期"
                  prop="workOrderInformation.issueDate"
                >
                  <!-- <el-input v-model="form.issueDate"></el-input> -->
                  <el-date-picker
                    v-model="form.workOrderInformation.issueDate"
                    type="date"
                    placeholder="选择日期"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd"
                    style="width: 100%"
                    :disabled="disabledCreated"
                  >
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  label="收方审核"
                  prop="workOrderInformation.receivingPartyReview"
                >
                  <eip-user-selector
                    v-model="form.workOrderInformation.receivingPartyReview"
                    :permission="disabledCreated ? 'r' : 'b'"
                    :single="true"
                    append-to-body
                    :config="{
                      id: 'form.workOrderInformation.receivingPartyReviewId',
                      account:
                        'form.workOrderInformation.receivingPartyReviewAccount',
                      fullname: 'form.workOrderInformation.receivingPartyReview'
                    }"
                    placeholder="请选择"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="养护站审核"
                  prop="workOrderInformation.maintenanceStationAudit"
                >
                  <eip-user-selector
                    v-model="form.workOrderInformation.maintenanceStationAudit"
                    :permission="disabledCreated ? 'r' : 'b'"
                    :single="true"
                    append-to-body
                    :config="{
                      id: 'form.workOrderInformation.maintenanceStationAuditId',
                      account:
                        'form.workOrderInformation.maintenanceStationAuditAccount',
                      fullname:
                        'form.workOrderInformation.maintenanceStationAudit'
                    }"
                    placeholder="请选择"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  label="养护人员"
                  prop="workOrderInformation.assignedPersonnel"
                >
                  <eip-user-selector
                    v-model="form.workOrderInformation.assignedPersonnel"
                    :permission="disabledCreated ? 'r' : 'b'"
                    :single="true"
                    append-to-body
                    :config="{
                      fullname: 'form.workOrderInformation.assignedPersonnel',
                      account:
                        'form.workOrderInformation.assignedPersonnelAccount',
                      id: 'form.workOrderInformation.assignedPersonnelId'
                    }"
                    placeholder="请选择"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="养护部审核"
                  prop="workOrderInformation.maintenanceDept"
                >
                  <eip-user-selector
                    v-model="form.workOrderInformation.maintenanceDept"
                    :permission="disabledCreated ? 'r' : 'b'"
                    :single="true"
                    append-to-body
                    :config="{
                      id: 'form.workOrderInformation.maintenanceDeptId',
                      account:
                        'form.workOrderInformation.maintenanceDeptAccount',
                      fullname: 'form.workOrderInformation.maintenanceDept'
                    }"
                    placeholder="请选择"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item
                  label="任务内容"
                  prop="workOrderInformation.taskContent"
                >
                  <el-input
                    v-model="form.workOrderInformation.taskContent"
                    type="textarea"
                    rows="3"
                    :disabled="disabledCreated"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24" v-if="currentNode == 1">
                <el-form-item
                  label="关联病害"
                  prop="workOrderInformation.description"
                >
                  <el-input
                    v-model="form.workOrderInformation.description"
                    placeholder="选择关联病害"
                    ref="diseaseName"
                    @focus="handleFocusDisease"
                    @clear="handleDiseaseClear"
                    clearable
                    :disabled="disabledCreated"
                  >
                    <el-button
                      type="primary"
                      @click="openDisease"
                      slot="append"
                      icon="el-icon-search"
                    ></el-button>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-card>
        </el-collapse-item>
        <el-collapse-item
          name="2"
          v-if="
            currentNode == 2 ||
              currentNode == 3 ||
              currentNode == 4 ||
              currentNode == 5 ||
              currentNode == 6
          "
        >
          <template slot="title">
            <span class="tip"></span>养护站派单
          </template>
          <el-card>
            <el-row>
              <el-col :span="24">
                <el-form-item
                  label="施工班组"
                  prop="workOrderInformation.responsiblePerson"
                >
                  <el-input
                    v-model="form.workOrderInformation.responsiblePerson"
                    placeholder="选择施工班组"
                    ref="responsName"
                    @focus="handleFocusRespons"
                    clearable
                    @clear="hanldeResponsClear"
                    :disabled="disabledCreated"
                  >
                    <el-button
                      type="primary"
                      @click="openRespons"
                      slot="append"
                      icon="el-icon-search"
                    ></el-button>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-card>
        </el-collapse-item>
        <el-collapse-item
          name="3"
          v-if="
            (currentNode == 2 ||
              currentNode == 3 ||
              currentNode == 4 ||
              currentNode == 5 ||
              currentNode == 6) &&
              isshow
          "
        >
          <template slot="title"> <span class="tip"></span>关联病害 </template>
          <el-card v-for="(item, index) in form.diseases" :key="index">
            <span class="number">{{ index + 1 }}</span>
            <el-row>
              <el-col :span="12">
                <el-form-item label="巡检类别">
                  <dict-select
                    dictCode="xjlb"
                    :hasDefaultOption="true"
                    v-model="item.type"
                    style="width: 100%"
                    disabled
                  />
                  <!-- <el-input
                    disabled
                    v-model="item.typeName"
                  ></el-input> -->
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="方向">
                  <dict-select
                    dictCode="qlfx"
                    :hasDefaultOption="true"
                    clearable
                    v-model="item.direction"
                    style="width: 100%"
                    disabled
                  />
                  <!-- <el-input
                    disabled
                    v-model="item.directionName"
                  ></el-input> -->
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="起点桩号">
                  <el-input disabled v-model="item.startPeg"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="止点桩号">
                  <el-input disabled v-model="item.endPeg"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="类别">
                  <el-select
                    v-model="item.categoryId"
                    placeholder="请选择"
                    @change="val => changesele(val)"
                    disabled
                    style="width: 100%"
                  >
                    <el-option
                      v-for="item in options"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                  <!-- <el-input
                    disabled
                    v-model="item.subjectName"
                  ></el-input> -->
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="细目">
                  <el-select
                    v-model="item.detailsId"
                    placeholder="请选择"
                    disabled
                    style="width: 100%"
                    @change="val => dsubchange(val)"
                  >
                    <el-option
                      v-for="item in cbkm"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                  <!-- <el-input
                    disabled
                    v-model="item.dsubjectName"
                  ></el-input> -->
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="病害部位">
                  <dict-select
                    dictCode="bhbw"
                    :hasDefaultOption="true"
                    clearable
                    v-model="item.positionName"
                    style="width: 100%"
                    disabled
                  />
                  <!-- <el-input
                    disabled
                    v-model="item.positionName"
                  ></el-input> -->
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="处理情况">
                  <el-input
                    disabled
                    v-model="item.handlingSituation"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="病害描述">
                  <el-input disabled v-model="item.description"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="病害 长(mm)">
                  <el-input disabled v-model="item.paramLength"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="病害 宽(mm)">
                  <el-input disabled v-model="item.paramWidth"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="病害 高(mm)">
                  <el-input disabled v-model="item.paramHeight"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="病害照片列表">
                  <div
                    class="img-box"
                    v-for="(itemImg, index) in item.accessories"
                    :key="index"
                  >
                    <img :src="itemImg.url" :key="itemImg.id" />
                    <div class="img-box-mask">
                      <i class="el-icon-zoom-in" @click="handleEnlarge"></i>
                    </div>
                  </div>
                  <el-dialog
                    title="查看病害图片"
                    :visible.sync="isEnlarge"
                    width="1000px"
                    :before-close="handleClose"
                    appendToBody
                    destroy-on-close
                    :open="open"
                    :close-on-click-modal="false"
                    :close-on-press-escape="false"
                    append-to-body
                  >
                    <div class="block" v-if="isEnlarge">
                      <el-carousel
                        trigger="click"
                        height="500px"
                        :autoplay="false"
                      >
                        <el-carousel-item
                          v-for="(item, index) in item.accessories"
                          :key="item.id"
                        >
                          <img
                            :src="item.url"
                            alt=""
                            style="width: 100%; height: 100%"
                          />
                        </el-carousel-item>
                      </el-carousel>
                    </div>
                  </el-dialog>
                  <!-- <el-input
                    disabled
                    v-model="form.disease.diseasePicIds"
                  ></el-input> -->
                </el-form-item>
              </el-col>
            </el-row>
          </el-card>
        </el-collapse-item>

        <el-collapse-item
          name="4"
          v-if="
            currentNode == 3 ||
              currentNode == 4 ||
              currentNode == 5 ||
              currentNode == 6
          "
        >
          <template slot="title"> <span class="tip"></span>施工填报 </template>
          <el-card>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="施工照片"
                  prop="workOrderInformation.constructionPicIds"
                >
                  <!-- <el-upload
                    :action="actionUrl"
                    list-type="picture-card"
                    :on-preview="handlePictureCardPreview"
                    :on-remove="handleRemove"
                  >
                    <i class="el-icon-plus"></i>
                  </el-upload>
                  <el-dialog :visible.sync="dialogVisible">
                    <img
                      width="100%"
                      :src="dialogImageUrl"
                      alt=""
                    >
                  </el-dialog> -->
                  <ImgPreviewUpload
                    :dadToSon="dadToSon"
                    @sonToDad="sonToDad"
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    ref="constructionPicIdsUrl"
                    :model="form.workOrderInformation.constructionPicIds"
                    :accept="`.jpg,.jpeg,.png,.JPG,.JPEG`"
                    v-if="dadToSon.sourceId && source"
                  >
                  </ImgPreviewUpload>
                  <!-- <file-upload
                    :dadToSon="dadToSon"
                    @sonToDad="sonToDad"
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    ref="constructionPicIdsUrl"
                    :model="form.workOrderInformation.constructionPicIds"
                    :accept="`.jpg,.jpeg,.png,.JPG,.JPEG`"
                    v-if="dadToSon.sourceId && source"
                  ></file-upload> -->
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="起点桩号"
                  prop="workOrderInformation.constructionStartPegK"
                >
                  <el-input
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    v-model="form.workOrderInformation.constructionStartPegK"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  label="止点桩号"
                  prop="workOrderInformation.constructionEndPegK"
                >
                  <el-input
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    v-model="form.workOrderInformation.constructionEndPegK"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <!-- <el-row>
              <el-col :span='12'>
                <el-form-item
                  label="现场负责人"
                  prop="name"
                >
                  <el-input v-model="form.name"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span='12'>
                <el-form-item
                  label="亮工时间"
                  prop="workOrderInformation.issueDate"
                >
                  <el-input v-model="form.name"></el-input>
                </el-form-item>
              </el-col>
            </el-row> -->
            <el-row>
              <el-col :span="24">
                <el-form-item
                  label="施工描述"
                  prop="workOrderInformation.constructionDesc"
                >
                  <el-input
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    v-model="form.workOrderInformation.constructionDesc"
                    type="textarea"
                    rows="3"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-card>
        </el-collapse-item>
        <el-collapse-item
          name="5"
          v-if="
            currentNode == 3 ||
              currentNode == 4 ||
              currentNode == 5 ||
              currentNode == 6
          "
        >
          <template slot="title">
            <span class="tip"></span>关联信息、工程量清单
          </template>
          <el-card style="max-width: 100%; box-sizing: border-box">
            <el-button
              type="primary"
              @click="addListItem"
              style="margin-bottom: 20px"
              icon="el-icon-plus"
              :disabled="currentNode == 4"
            >
              添加</el-button
            >

            <el-table
              :data="tableData"
              border
              stripe
              style="max-width: 100%; min-width: 100%"
              max-height="360"
            >
              <el-table-column
                prop="subjectName"
                label="科目名称"
                min-width="130"
                fixed="left"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    v-model="scope.row.subjectName"
                    suffix-icon="el-icon-search"
                    @focus="searchSubject(scope.$index)"
                  >
                  </el-input>
                </template>
              </el-table-column>
              <el-table-column
                prop="fineSubjectName"
                label="细科目名称"
                min-width="130"
                fixed="left"
                ><template slot-scope="scope">
                  <el-input
                    disabled
                    v-model="scope.row.fineSubjectName"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column prop="spec" label="单位" min-width="130">
                <template slot-scope="scope">
                  <el-input disabled v-model="scope.row.spec"></el-input>
                </template>
              </el-table-column>
              <el-table-column prop="price" label="单价(元)" min-width="130">
                <template slot-scope="scope">
                  <el-input-number
                    disabled
                    :min="0"
                    :precision="2"
                    class="input-number"
                    :controls="false"
                    v-model="scope.row.price"
                  ></el-input-number>
                </template>
              </el-table-column>
              <el-table-column prop="amount" label="数量" min-width="130">
                <template slot-scope="scope">
                  <el-input-number
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    :min="0"
                    class="input-number"
                    controls-position="right"
                    v-model="scope.row.amount"
                    @change="val => changeAmount(val, scope.$index)"
                  >
                  </el-input-number>
                </template>
              </el-table-column>
              <el-table-column prop="money" label="金额(元)" min-width="140">
                <template slot-scope="scope">
                  <el-input-number
                    disabled
                    :min="0"
                    :precision="2"
                    class="input-number"
                    :controls="false"
                    v-model="scope.row.money"
                  ></el-input-number>
                </template>
              </el-table-column>
              <el-table-column
                prop="auditPrice"
                label="审核单价(元)"
                min-width="130"
              >
                <template slot-scope="scope">
                  <el-input-number
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    :min="0"
                    :precision="2"
                    class="input-number"
                    :controls="false"
                    v-model="scope.row.auditPrice"
                    @change="
                      val =>
                        changeColNum(
                          val,
                          scope.$index,
                          'auditPrice',
                          'auditAmount',
                          'auditMoney'
                        )
                    "
                  ></el-input-number>
                </template>
              </el-table-column>
              <el-table-column
                prop="auditAmount"
                label="审核数量"
                min-width="130"
              >
                <template slot-scope="scope">
                  <el-input-number
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    :min="0"
                    class="input-number"
                    controls-position="right"
                    v-model="scope.row.auditAmount"
                    @change="
                      val =>
                        changeColNum(
                          val,
                          scope.$index,
                          'auditAmount',
                          'auditPrice',
                          'auditMoney'
                        )
                    "
                  ></el-input-number>
                </template>
              </el-table-column>
              <el-table-column
                prop="auditMoney"
                label="审核金额(元)"
                min-width="140"
              >
                <template slot-scope="scope">
                  <el-input-number
                    disabled
                    :min="0"
                    :precision="2"
                    class="input-number"
                    :controls="false"
                    v-model="scope.row.auditMoney"
                  ></el-input-number>
                </template>
              </el-table-column>
              <el-table-column
                prop="receiverPrice"
                label="收方单价"
                min-width="130"
              >
                <template slot-scope="scope">
                  <el-input-number
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    :min="0"
                    :precision="2"
                    class="input-number"
                    :controls="false"
                    v-model="scope.row.receiverPrice"
                    @change="
                      val =>
                        changeColNum(
                          val,
                          scope.$index,
                          'receiverPrice',
                          'receiverAmount',
                          'receiverMoney'
                        )
                    "
                  ></el-input-number>
                </template>
              </el-table-column>
              <el-table-column
                prop="receiverAmount"
                label="收方数量"
                min-width="130"
              >
                <template slot-scope="scope">
                  <el-input-number
                    :disabled="
                      currentNode == 4 || currentNode == 5 || currentNode == 6
                    "
                    :min="0"
                    class="input-number"
                    controls-position="right"
                    v-model="scope.row.receiverAmount"
                    @change="
                      val =>
                        changeColNum(
                          val,
                          scope.$index,
                          'receiverAmount',
                          'receiverPrice',
                          'receiverMoney'
                        )
                    "
                  ></el-input-number>
                </template>
              </el-table-column>
              <el-table-column
                prop="receiverMoney"
                label="收方金额(元)"
                min-width="140"
              >
                <template slot-scope="scope">
                  <el-input-number
                    disabled
                    :min="0"
                    :precision="2"
                    class="input-number"
                    :controls="false"
                    v-model="scope.row.receiverMoney"
                  ></el-input-number>
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                fixed="right"
                width="80"
                align="center"
              >
                <template slot-scope="scope">
                  <el-button
                    type="danger"
                    size="small"
                    icon="el-icon-delete"
                    @click="deleteListItem(scope.$index)"
                  />
                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </el-collapse-item>
      </el-collapse>
    </el-form>
    <disease-dialog
      ref="disease"
      :single="true"
      @select="handleSelectDisease"
    ></disease-dialog>
    <respons-dialog
      ref="respons"
      :single="true"
      @select="handleSelectRespons"
    ></respons-dialog>
    <selectContractDialog
      ref="selectContract"
      @change="getContractItem"
    ></selectContractDialog>
    <!-- <div class="el-dialog-footer">
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="handleCancel">取 消</el-button>
        <el-button
          type="primary"
          @click="dialogVisibleInfo = false"
        >导出</el-button>
      </span>
    </div> -->
  </div>
</template>

<script>
import {helper} from '../../../public/hotent.helper.js'
import req from '@/request.js'
import utils from '@/utils'
import basicData from '@/api/basicData.js'
import routerInfoSelector from '@/components/selector/routerInfoSelector.vue'
import DiseaseDialog from '@/components/dialog/DiseaseDialog.vue'
import ResponsDialog from '@/components/dialog/ResponsDialog.vue'
import selectContractDialog from '@/components/flowURLForm/selectContractDialog'
import sctionInfoSelector from '@/components/selector/sctionInfoSelector.vue'
import {mapState} from 'vuex'
import companyInfoSelector from '@/components/selector/companyInfoSelector.vue'
import eipUserSelector from '@/components/eipControl/selector/EipUserSelector.vue'
const ImgPreviewUpload = () =>
  import('@/components/common/ImgPreviewUpload.vue')
export default {
  name: 'flowInfoDailog',
  components: {
    routerInfoSelector,
    DiseaseDialog,
    selectContractDialog,
    ImgPreviewUpload,
    sctionInfoSelector,
    companyInfoSelector,
    eipUserSelector,
    ResponsDialog
  },
  data() {
    return {
      businessKeyId: '',
      jobNumber: '',
      responsIdArr: [], //选取施工班组的id，便于查询下一级用户账号
      responsId: '', //养护单位id，用于施工班组查询数据
      permission: 'b',
      isEnlarge: false, //用户是否选着放大病害照片列表
      isFirst: true, //判断是否调用两次saveData
      currentNode: 1,
      form: {
        //工单信息实体数据
        workOrderInformation: {
          // type: 1, //工单类型 字典
          // diseaseId: '', //病害描述
          // roadSegmentId: '',
          // typeValue: '派单项目',
          // contractId: '', //1427556055054946304
          // description: '',
          // detailsId: '',
          // responsiblePerson: '',
          // constructUnitId: '',
          // position: '',
        },
        billOfQuantities: [],
        contract: {},
        defaultBpmCheckOpinion: {},
        disease: []
      },
      workerform: {
        roadSegmentId: '', //路段id
        position: '', //位置
        categoryId: '', //类别id
        detailsId: '', //细目id
        description: '', //病害描述
        demandFinishTime: '',
        issueDate: ''
      }, //养护工单发起工单带过来的参数
      options: [],
      cbkm: [],
      activeNames: ['1', '2', '3', '4', '5'],
      tableData: [],
      contractInfoList: [], //合同信息列表
      disabledCreated: false, //控制创建工单信息表单的选填
      dialogImageUrl: '',
      dialogVisible: false,
      isshow: false, //控制关联病害是否显示
      readDetaial: false,
      rules: {
        // contract: {
        //   contractNumber: {
        //     required: true,
        //     message: '请输入合同',
        //     trigger: 'blur',
        //   },
        // },
        // disease: {
        //   direction: {
        //     required: true,
        //     message: '请选择方向',
        //     trigger: 'blur'
        //   },
        //   startPeg: {
        //     required: true,
        //     message: '请输入起点桩号',
        //     trigger: 'blur'
        //   },
        //   endPeg: {
        //     required: true,
        //     message: '请输入止点桩号',
        //     trigger: 'blur'
        //   }
        // },
        workOrderInformation: {
          type: {
            required: true,
            message: '请输入工单类型',
            trigger: 'blur'
          },
          roadSegmentName: {
            required: true,
            message: '请选择路段名称',
            trigger: 'blur'
          },
          contractId: {
            required: true,
            message: '请选择合同',
            trigger: 'blur'
          },
          companyName: {
            required: true,
            message: '请选择施工单位',
            trigger: 'blur'
          },
          position: {
            required: true,
            message: '请输入位置',
            trigger: 'blur'
          },
          categoryId: {
            required: true,
            message: '请选择类别',
            trigger: 'blur'
          },
          detailsId: {
            required: true,
            message: '请输入细目',
            trigger: 'blur'
          },
          demandFinishTime: {
            required: true,
            message: '请输入要求修复时间',
            trigger: 'blur'
          },
          issuer: {
            required: true,
            message: '请输入签发人',
            trigger: 'blur'
          },
          issueDate: {
            required: true,
            message: '请输入签发日期',
            trigger: 'blur'
          },
          taskContent: {
            required: true,
            message: '请输入任务内容',
            trigger: 'blur'
          },
          // constructionPicIds: {
          //   required: true,
          //   message: '请上传照片',
          //   trigger: 'blur'
          // }
          description: {
            required: true,
            message: '请选择关联病害',
            trigger: 'blur'
          },
          maintenanceUnitAudit: {
            required: true,
            message: '请选择养护单位',
            trigger: 'blur'
          },
          responsiblePerson: {
            required: true,
            message: '请选择施工班组',
            trigger: 'blur'
          },
          assignedPersonnel: {
            required: true,
            message: '必填',
            trigger: 'blur'
          },
          receivingPartyReview: {
            required: true,
            message: '必填',
            trigger: 'blur'
          },
          maintenanceStationAudit: {
            required: true,
            message: '必填',
            trigger: 'blur'
          },
          maintenanceDept: {
            required: true,
            message: '必填',
            trigger: 'blur'
          }
        }
      },
      dadToSon: {
        sourceId: ''
        // fileList: [

        // ],
      },
      source: false,
      selectorUser: {} //默认赋值
    }
  },
  mounted() {
    this.queryByType() //获取数据赋值默认值
    this.currentNode = this.$route.query.node
    console.log(this.$route, '参数')
    if (this.$route.query.type) {
      this.readDetaial = true
    }
    // this.currentNode = 4
    console.log(this.currentNode, '节点')
    if (
      this.currentNode == 2 ||
      this.currentNode == 3 ||
      this.currentNode == 4 ||
      this.currentNode == 5 ||
      this.currentNode == 6
    ) {
      this.disabledCreated = true
    }
    const _this = this
    window.saveData = this.saveData
    this.id = utils.getUrlKey('id')
    let isEdit = utils.getUrlKey('isEdit')
    this.disabled = isEdit == 'r' ? true : false
    if (this.id) {
      req
        .get(window.context.yhxt + '/workOrderInformation/v1/getVo/' + this.id)
        .then(res => {
          console.log(res, '流程数据')
          if (res.data) {
            res.data.type ? (res.data.type = res.data.type + '') : null
            this.form = res.data
            let obj = {
              workOrderInformation: {},
              billOfQuantities: [],
              contract: {},
              defaultBpmCheckOpinion: {}
            }
            if (this.form.diseases) {
              this.isshow = true
              let str = ''
              this.form.diseases.forEach(item => {
                str += item.description + ';'
              })
              this.form.workOrderInformation.description = str
            }
            this.form = {...obj, ...this.form}
            this.tableData = this.form.billOfQuantities
            console.log(this.form, 'this.form')
            this.dadToSon.sourceId = this.form.workOrderInformation.id
            this.source = true
            this.dadToSon.fileList = this.form.accessories
            console.log(this.dadToSon.sourceId, 'this.dadToSon.sourceId')
          }
        })
    }
    let that = this
    window.addEventListener('message', e => {
      if (e.data.params) {
        console.log(e.data.params, 'message-relationData')
        let data = e.data.params
        this.workerform.roadSegmentId = data.roadId //路段id
        this.form.workOrderInformation.roadSegmentName = data.roadName //路段名称
        this.getContractId() //根据路段id查询相应合同数据
        let str = data.startPeg + '~' + data.endPeg
        this.workerform.position = str //位置
        this.workerform.categoryId = data.categoryId //类别
        this.form.workOrderInformation.subjectName = data.subjectName //类别
        basicData.getCostAccountManagement(data.categoryId).then(res => {
          let arr = []
          if (res.data.length > 0) {
            res.data.forEach(item => {
              if (item.pcode == data.categoryId) {
                arr.push({
                  label: item.subjectName,
                  value: item.subjectCode
                })
              }
              this.cbkm = arr
            })
            console.log(this.cbkm, '123')
            this.form.workOrderInformation.detailsId = arr[0].value //细目
            this.form.workOrderInformation.dsubjectName = arr[0].label //细目
            // this.getTypeOptions()
          }
        })
        this.workerform.description = e.data.params.description
        this.form.workOrderInformation.id = e.data.params.id
        console.log(this.form.workOrderInformation)
      }
    })
    Date.prototype.format = function(fmt) {
      var o = {
        'M+': this.getMonth() + 1, //月份
        'd+': this.getDate(), //日
        'h+': this.getHours(), //小时
        'm+': this.getMinutes(), //分
        's+': this.getSeconds(), //秒
        'q+': Math.floor((this.getMonth() + 3) / 3), //季度
        S: this.getMilliseconds() //毫秒
      }
      if (/(y+)/.test(fmt)) {
        fmt = fmt.replace(
          RegExp.$1,
          (this.getFullYear() + '').substr(4 - RegExp.$1.length)
        )
      }
      for (var k in o) {
        if (new RegExp('(' + k + ')').test(fmt)) {
          fmt = fmt.replace(
            RegExp.$1,
            RegExp.$1.length == 1
              ? o[k]
              : ('00' + o[k]).substr(('' + o[k]).length)
          )
        }
      }
      return fmt
    }
    this.form.workOrderInformation.issueDate = new Date().format('yyyy-MM-dd')
    // 获取当前登录用户名
    let currentUser = JSON.parse(window.sessionStorage.getItem('currentUser'))
    this.form.workOrderInformation.issuer = currentUser.username
  },
  created() {
    this.getTypeOptions()
    // this.getContractId()
  },
  computed: mapState({
    actionUrl: function() {
      //工程图纸中文件上传
      if (this.dialogImageUrl) {
        return window.context.portal + this.dialogImageUrl
      } else {
        return window.context.portal + '/bizAccessory/v1/minioDrawingUpload'
      }
    }
  }),
  methods: {
    //获取用户选择的数据的第一条数据用于默认赋值
    queryByType() {
      this.$http.post('${yhxt}/api/user/v1/users/queryByType').then(res => {
        console.log(res)
        let resp = res.data.rows[0]
        let myDate = new Date()
        let date = this.getDate()
        // this.form.workOrderInformation.demandFinishTime = date
        // this.form.workOrderInformation.issueDate = date
        // 获取当前登录用户名
        let currentUser = JSON.parse(
          window.sessionStorage.getItem('currentUser')
        )
        //默认签发人为当前登录人账号
        // this.form.workOrderInformation.issuer = currentUser.username
        this.form.workOrderInformation = {
          type: 1, //工单类型 字典
          diseaseId: '', //病害描述
          roadSegmentId: this.workerform.roadSegmentId,
          position: this.workerform.position,
          categoryId: this.workerform.categoryId,
          detailsId: this.workerform.detailsId,
          description: this.workerform.description,
          typeValue: '派单项目',
          contractId: '', //1427556055054946304
          responsiblePerson: '',
          constructUnitId: '',
          companyName: '',
          assignedPersonnel: resp.fullname,
          assignedPersonnelAccount: resp.account,
          assignedPersonnelId: resp.id,
          receivingPartyReview: resp.fullname,
          receivingPartyReviewAccount: resp.account,
          receivingPartyReviewId: resp.id,
          maintenanceStationAudit: resp.fullname,
          maintenanceStationAuditAccount: resp.account,
          maintenanceStationAuditId: resp.id,
          maintenanceDept: resp.fullname,
          maintenanceDeptAccount: resp.account,
          maintenanceDeptId: resp.id,
          demandFinishTime: date,
          issueDate: date,
          issuer: currentUser.username
        }
      })
    },
    //放大病害照片
    handleEnlarge() {
      this.isEnlarge = true
    },
    handleRemove(file, fileList) {
      console.log(file, fileList)
    },
    handlePictureCardPreview(file) {
      console.log(file)
      this.dialogImageUrl = file.url
      this.dialogVisible = true
    },
    // imgUrl(url) {
    //   console.log(url)
    //   this.form.accessories = url
    // },
    sonToDad(data) {
      console.log(data)
      this.form.accessories = data
    },
    // 工程清单相关方法 start
    changeAmount(val, index) {
      let currentObj = this.tableData[index]
      currentObj.amount = val
      currentObj.money = currentObj.price * val
      currentObj.auditAmount = val
      currentObj.auditMoney = currentObj.price * val
      this.tableData.splice(index, 1, currentObj)
    },
    changeColNum(val, index, colums, otherCol, totalCol) {
      let currentObj = this.tableData[index]
      currentObj[colums] = val
      currentObj[totalCol] = currentObj[colums] * currentObj[otherCol]
      this.tableData.splice(index, 1, currentObj)
      console.log(this.tableData)
    },
    addListItem() {
      let length = this.tableData.length
      let workOrderInformationId =
        this.form.workOrderInformation && this.form.workOrderInformation.id
          ? this.form.workOrderInformation.id
          : ''
      let contractId =
        this.form.workOrderInformation &&
        this.form.workOrderInformation.contractId
          ? this.form.workOrderInformation.contractId
          : ''
      let newData = {
        // todo 回显时需加上工单id合同id，key
        key: length + 1,
        workOrderInformationId,
        contractId,
        subjectName: '',
        fineSubjectName: '',
        spec: '',
        price: 0,
        amount: 0,
        money: 0,
        auditPrice: 0,
        auditAmount: 0,
        auditMoney: 0,
        receiverPrice: 0,
        receiverAmount: 0,
        receiverMoney: 0
      }
      this.tableData.push(newData)
    },
    deleteListItem(index) {
      this.tableData.splice(index, 1)
    },
    searchSubject(index) {
      if (
        this.form.workOrderInformation &&
        this.form.workOrderInformation.contractId
      ) {
        this.$refs.selectContract.open(
          index,
          this.form.workOrderInformation.contractId
        )
      }
    },
    getContractItem(obj, index) {
      obj.key = index + 1
      obj.workOrderInformationId =
        this.form.workOrderInformation && this.form.workOrderInformation.id
          ? this.form.workOrderInformation.id
          : ''
      obj.auditPrice = obj.price
      this.tableData.splice(index, 1, obj)
    },
    // 工程清单相关方法 end
    handleRemove(file, fileList) {
      console.log(file, fileList)
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url
      // this.dialogVisible = true
    },
    handleFocusDisease() {
      this.$refs.disease.open()
    },
    openDisease() {
      this.$refs.disease.open()
    },
    handleFocusRespons() {
      this.$refs.respons.open(
        this.form.workOrderInformation.maintenanceUnitAuditId
      )
    },
    openRespons() {
      this.$refs.respons.open(
        this.form.workOrderInformation.maintenanceUnitAuditId
      )
    },
    //选取病害回填数据
    handleSelectDisease(data) {
      // console.log(data)
      if (data.id) {
        this.form.workOrderInformation.diseaseId += data.id + ';'
        this.form.workOrderInformation.description += data.description + ';'
        this.form.routeId = data.id
        this.form.createAccount = data.createAccount //创建人账号 运用于流程
        this.form.description = data.description //病号描述
        this.form.createTime = data.createTime //病害创建时间
        this.$refs.diseaseName.focus()
        this.$refs.diseaseName.blur()
      }
    },
    handleSelectRespons(data) {
      console.log(data)
      if (data.id) {
        this.responsIdArr.push(data.id)
        this.form.workOrderInformation.constructUnitId += data.id + ';'
        this.form.workOrderInformation.responsiblePerson += data.name + ';'
        // console.log(this.form.workOrderInformation, 'dddddddddddddddd')
        this.$refs.responsName.focus()
        this.$refs.responsName.blur()
      }
    },
    handleDiseaseClear() {
      this.form.workOrderInformation.diseaseId = ''
      this.form.workOrderInformation.description = ''
      this.form.routeId = ''
      this.form.createAccount = '' //创建人账号 运用于流程
      this.form.description = '' //病号描述
      this.form.createTime = '' //病害创建时间
    },
    hanldeResponsClear() {
      this.responsIdArr = []
      this.form.workOrderInformation.constructUnitId = ''
      this.form.workOrderInformation.responsiblePerson = ''
    },
    // //字典回调数据
    handleDict(val, obj, str) {
      if (str === 'yhgd-gdlx') {
        this.form.workOrderInformation.typeValue = obj.name
      } else if (str === 'fx') {
        this.form.disease.directionName = obj.name
      }
    },
    handleCancel() {
      this.$emit('handleCancel')
    },
    //根据选取的施工班组查询账户
    getResponsAccount() {
      return new Promise((resolve, reject) => {
        let arr = []
        let params = {
          pageBean: {
            page: 1,
            pageSize: 10,
            showTotal: true
          },
          params: {},
          querys: [
            {
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'org_id_',
              relation: 'AND',
              value: ''
            }
          ],
          sorter: []
        }
        this.responsIdArr.forEach(item => {
          return new Promise((resolve, reject) => {
            resolve(item)
          }).then(res => {
            params.querys[0].value = res
            return new Promise((resolve, reject) => {
              this.$http
                .post('${form}/api/user/v1/users/queryByType', params)
                .then(res => {
                  let resp = res.data.rows[0]
                  if (resp) {
                    arr.push(resp.account)
                  }
                  resolve(arr)
                })
            }).then(res => {
              resolve(res)
            })
          })
        })
      })
    },
    saveData() {
      // this.getResponsAccount()
      const _this = this
      //验证表单是否填写完
      this.form.billOfQuantities = this.tableData
      console.log(this.form, 'ddddddddddddddddd')
      this.$refs.taskManageForm.validate(pass => {
        if (pass) {
          //请求保存提交
          console.log(this.form, 'this.form')
          // if (this.isFirst) {
          this.$http
            .post('${yhxt}/workOrderInformation/v1/saveVo', this.form)
            .then(res => {
              console.log(res, 'resresree')
              this.businessKeyId = res.data.value.workOrderInformation.id
              this.jobNumber = res.data.value.workOrderInformation.jobNumber
            })
          // }
          let params = {
            type: 'saveData',
            state: true,
            businessKey: this.businessKeyId,
            sysCode: ''
          }
          params.vars = {}
          if (this.form.createAccount) {
            params.vars.createAccount = this.form.createAccount //创建者
          }
          if (this.form.description) {
            params.vars.description = this.form.description //描述
          }
          if (this.form.createTime) {
            params.vars.createTime = this.form.createTime //创建时间
          }
          if (this.jobNumber) {
            params.vars.jobNumber = this.jobNumber //工单号
          }
          if (this.form.workOrderInformation.assignedPersonnelAccount) {
            params.vars.assignedPersonnelAccount = this.form.workOrderInformation.assignedPersonnelAccount //养护人员账号
          }
          if (this.form.workOrderInformation.receivingPartyReviewAccount) {
            params.vars.receivingPartyReviewAccount = this.form.workOrderInformation.receivingPartyReviewAccount //收方审核账号
          }
          if (this.form.workOrderInformation.maintenanceStationAuditAccount) {
            params.vars.maintenanceStationAuditAccount = this.form.workOrderInformation.maintenanceStationAuditAccount
          }
          if (this.form.workOrderInformation.maintenanceDeptAccount) {
            params.vars.maintenanceDeptAccount = this.form.workOrderInformation.maintenanceDeptAccount //养护站审核账号
          }
          //根据施工班组id查询用户账号循环进流程变量中，自定义的参数
          if (this.currentNode == 2) {
            this.getResponsAccount().then(res => {
              let arr = res
              res.forEach((item, index) => {
                params.vars['props_' + index] = item
              })
            })
          }

          console.log(params.vars, '4444444444444444444444')
          hotent.sendMessage(params)
          this.isFirst = false //数据保存后置为false，防止多次保存
        }
      })
    },
    //路线信息赋值
    changed(obj) {
      console.log(obj)
      this.form.workOrderInformation.roadSegmentName = obj.name
      this.form.workOrderInformation.roadSegmentId = obj.id
      this.form.workOrderInformation.contractId = ''
      this.getContractId() //路段改变再次获取合同信息
    },
    value(obj) {
      console.log(obj)
      this.form.workOrderInformation.roadSegmentName = obj.name
      this.form.workOrderInformation.roadSegmentId = obj.id
      this.getContractId() //路段改变再次获取合同信息
    },
    //公司赋值
    handleChanged(obj) {
      console.log(obj.valueInfo.join(','))
      this.form.workOrderInformation.companyIds = JSON.stringify(obj.valueInfo)
      this.form.workOrderInformation.companyName = obj.name
      this.form.workOrderInformation.companyId = obj.id
    },
    companyValue(obj) {
      console.log(obj)
      this.form.workOrderInformation.companyName = obj.name
      this.form.workOrderInformation.companyId = obj.id
      this.form.workOrderInformation.companyIds = JSON.stringify(
        obj.id.split(' ')
      ) //必须是空格
    },
    changesele(value) {
      console.log(value)
      this.options.forEach(item => {
        if (value == item.value) {
          this.form.workOrderInformation.subjectName = item.label
          this.form.workOrderInformation.categoryId = item.value
        }
      })
      let arr = []
      basicData.getCostAccountManagement(value).then(res => {
        if (res.data.length > 0) {
          res.data.forEach(item => {
            if (item.pcode == value) {
              arr.push({
                label: item.subjectName,
                value: item.subjectCode
              })
            }
            this.cbkm = arr
            this.form.workOrderInformation.detailsId = arr[0].value
            this.form.workOrderInformation.dsubjectName = arr[0].label
          })
        }
      })
    },
    dsubchange(val) {
      console.log(val)
      this.cbkm.forEach(item => {
        if (item.value == val) {
          this.form.workOrderInformation.dsubjectName = item.label
          this.form.workOrderInformation.detailsId = item.value
        }
      })
      this.$forceUpdate()
    },
    //获取类型数据
    getTypeOptions() {
      if (this.options.length == 0) {
        let data = 'CBKM'
        basicData.getCostAccountManagement(data).then(res => {
          res.data.forEach(item => {
            this.options.push({
              label: item.subjectName,
              value: item.subjectCode
            })
          })
        })
      }
    },
    //获取合同信息
    getContractId() {
      let params = {
        pageBean: {
          page: 1,
          pageSize: 10,
          showTotal: true
        },
        params: {},
        querys: [
          {
            group: 'main',
            operation: 'EQUAL',
            property: 'road_segment_id_',
            relation: 'AND',
            value: this.form.workOrderInformation.roadSegmentId
          }
        ],
        sorter: []
      }
      basicData.getDailyMaintenanceontract(params).then(res => {
        this.contractInfoList = res.rows
        if (this.contractInfoList.length !== 0) {
          this.form.workOrderInformation.contractId = this.contractInfoList[0].id
        }
        console.log(this.contractInfoList)
      })
    },
    //赋值合同名称
    contractChange(val) {
      console.log(val)
      // this.contractInfoList.forEach((item) => {
      //     this.form.workOrderInformation.contractId = item.id
      // })
    },
    //公司赋值
    handleChangedA(obj) {
      // console.log(obj.valueInfo.join(','))
      this.form.workOrderInformation.maintenanceUnitAuditIds = JSON.stringify(
        obj.valueInfo
      )
      this.form.workOrderInformation.maintenanceUnitAudit = obj.name
      this.form.workOrderInformation.maintenanceUnitAuditId = obj.id
    },
    companyValueA(obj) {
      // console.log(obj)
      this.form.workOrderInformation.maintenanceUnitAudit = obj.name
      this.form.workOrderInformation.maintenanceUnitAuditId = obj.id
      // this.responsId = this.form.workOrderInformation.maintenanceUnitAuditId
      this.form.workOrderInformation.maintenanceUnitAuditIds = JSON.stringify(
        obj.id.split(' ')
      ) //必须是空格
    }
  }
}
</script>

<style lang="scss" scoped>
.index-inner {
  display: flex;
  justify-content: center;
  height: 100%;
  background-color: #103c5d;
  overflow-x: hidden;
}
.tip {
  display: inline-block;
  width: 6px;
  height: 16px;
  vertical-align: middle;
  margin-right: 6px;
  margin-top: 2px;
  background-color: #211bce;
}
.number {
  font-size: 14px;
  font-weight: bold;
  color: #409fff;
  margin-left: 20px;
}

::v-deep .el-collapse-item__header {
  // border: 0;
  border-bottom: 1px solid #eee;
  font-size: 16px;
}

::v-deep .el-collapse {
  border: 0;
  border-top: 1px solid #fff;
}

::v-deep .el-collapse-item__content {
  padding-top: 10px;
  padding-bottom: 0;
}
.el-dialog-footer {
  padding: 10px 20px 20px;
  text-align: right;
  box-sizing: border-box;
}
.img-box {
  width: 150px;
  height: 150px;
  border: 1px solid #eee;
  margin: 5px;
  display: inline-block;
  position: relative;
  &:hover .img-box-mask {
    display: block;
  }
  img {
    width: 100%;
    height: 100%;
    display: inline-block;
  }
  .img-box-mask {
    position: absolute;
    width: 150px;
    height: 150px;
    top: 0;
    left: 0;
    background: rgba($color: #000000, $alpha: 0.5);
    display: none;
    i {
      font-size: 14px;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      cursor: pointer;
    }
  }
}
</style>
