<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="98px"
    >
      <el-form-item label="维修单号" prop="workCode">
        <el-input
          v-model="queryParams.workCode"
          placeholder="请输入维修单号"
          clearable
          style="width: 200px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="审核状态" prop="resultInspect">
        <el-select
          v-model="queryParams.resultInspect"
          style="width: 200px"
          clearable
        >
          <el-option
            v-for="dict in dict.type.device_audit_status"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="报修单号" prop="orderCode">
        <el-input
          v-model="queryParams.orderCode"
          placeholder="请输入报修单号"
          style="width: 200px"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="设备编码" prop="equipmentCode">
        <el-input
          v-model="queryParams.equipmentCode"
          placeholder="请输入设备编码"
          clearable
          style="width: 200px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <!-- <el-form-item label="是否停机维修" prop="workDownMachine">
        <el-select
          v-model="queryParams.workDownMachine"
          placeholder="请选择是否停机"
          @change="$forceUpdate()"
          clearable
          style="width: 200px"
          @keyup.enter.native="handleQuery"
        >
          <el-option
            v-for="item in workDownMachineOption"
            :key="item.workDownMachine"
            :label="item.label"
            :value="item.workDownMachine"
          ></el-option>
        </el-select>
      </el-form-item> -->
      <el-form-item label="维修人员姓名" prop="workPersonName">
        <el-input
          v-model="queryParams.workPersonName"
          placeholder="请输入维修人员姓名"
          clearable
          style="width: 200px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="维修组" prop="workTeam">
        <el-select
          v-model="queryParams.workTeam"
          placeholder="请选择维修组"
          @change="$forceUpdate()"
          clearable
          filterable
          style="width: 200px"
          @keyup.enter.native="handleQuery"
        >
          <el-option
            v-for="item in teamOption"
            :key="item.teamCode"
            :label="item.teamName"
            :value="item.teamCode"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="维修状态" prop="workStatus">
        <el-select
          v-model="queryParams.workStatus"
          placeholder="请选择维修状态"
          @change="$forceUpdate()"
          clearable
          style="width: 200px"
          @keyup.enter.native="handleQuery"
        >
          <el-option
            v-for="dict in dict.type.device_repair_status"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="是否委外" prop="workOutsource">
        <el-select
          v-model="queryParams.workOutsource"
          placeholder="请选择是否委外"
          @change="$forceUpdate()"
          clearable
          style="width: 200px"
          @keyup.enter.native="handleQuery"
        >
          <el-option
            v-for="item in workOutsourceOption"
            :key="item.workOutsource"
            :label="item.label"
            :value="item.workOutsource"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="委外工单编码" prop="outWorkCode">
        <el-input
          v-model="queryParams.outWorkCode"
          placeholder="请输入委外工单编码"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="计划维修时间" prop="workPlanTime">
        <el-date-picker
          clearable
          v-model="queryParams.workPlanTimeArray"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd HH:mm:ss"
          :picker-options="pickerOptions"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="计划停机时间" prop="workPlanDownTime">
        <el-date-picker
          clearable
          v-model="queryParams.workPlanDownTimeArray"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd HH:mm:ss"
          :picker-options="pickerOptions"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['device:repairOrder:add']"
          >快速工单</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['device:repairOrder:edit']"
          >修改</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['device:repairOrder:remove']"
          >删除</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['device:repairOrder:export']"
          >导出</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          :disabled="single"
          plain
          icon="el-icon-document-add"
          size="mini"
          @click="handleApply"
          v-hasPermi="['device:repairOrder:apply']"
          >委外申请</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-edit"
          size="mini"
          @click="clickInspect"
          v-hasPermi="['device:repairOrder:check']"
          >维修结果审核
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          :disabled="single"
          @click="handleWrite"
          v-hasPermi="['device:repairOrder:write']"
          >填写维修记录</el-button
        >
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>

    <el-table
      v-loading="loading"
      :data="repairOrderList"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <!-- 序号 -->
      <el-table-column
        type="index"
        width="90"
        align="center"
        :index="indexMethod"
        label="序号"
        fixed
      />
      <el-table-column
        label="维修单号"
        align="center"
        prop="workCode"
        width="250"
        fixed
      />
      <el-table-column
        label="维修状态"
        align="center"
        prop="workStatus"
        width="150"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.device_repair_status"
            :value="scope.row.workStatus"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="审核状态"
        align="center"
        prop="resultInspect"
        width="100">
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.device_audit_status"
            :value="scope.row.resultInspect"
          />
        </template>
      </el-table-column>
      <!-- <el-table-column
        label="审核意见"
        align="center"
        prop="auditOpinion"
        width="100"
      /> -->
      <el-table-column
        label="报修单号"
        align="center"
        prop="orderCode"
        width="230"
      />
      <el-table-column
        label="设备名称"
        align="center"
        prop="equipmentName"
        width="200"
      />
      <el-table-column
        label="设备编码"
        align="center"
        prop="equipmentCode"
        width="150"
      />
      <el-table-column
        label="故障描述"
        align="center"
        prop="workFaultDesc"
        width="300"
      />
      <el-table-column
        label="计划维修时间"
        align="center"
        prop="workPlanTime"
        width="180"
      >
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.workPlanTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="是否停机维修"
        align="center"
        prop="workDownMachine"
        width="180"
      >
        <template slot-scope="scope">
          {{ scope.row.workDownMachine == "1" ? "停机" : "不停机" }}
        </template>
      </el-table-column>
      <el-table-column
        label="计划停机时间"
        align="center"
        prop="workPlanDownTime"
        width="180"
      >
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.workPlanDownTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="维修人员工号" align="center" prop="workPerson" width="120"/>
      <el-table-column label="维修人员姓名" align="center" prop="workPersonName" width="150"/>
      <el-table-column
        label="维修组编码"
        align="center"
        prop="workTeam"
        width="100"
      />
      <el-table-column
        label="维修组名称"
        align="center"
        prop="teamName"
        width="100"
      />
      <el-table-column
        label="维修组人员"
        align="center"
        prop="teamPerson"
        width="300"
      />
      <el-table-column label="是否委外" align="center" prop="workOutsource">
        <template slot-scope="scope">
          {{ scope.row.workOutsource == "1" ? "转委外" : "不委外" }}
        </template>
      </el-table-column>
      <el-table-column
        label="委外工单编码"
        align="center"
        prop="outWorkCode"
        width="180"
      />
      <el-table-column
        label="原因分析"
        align="center"
        prop="workReason"
        width="300"
      />
      <el-table-column
        label="维修处理措施"
        align="center"
        prop="repairMeasures"
        width="300"
      />
      <el-table-column
        label="维修开始时间"
        align="center"
        prop="workStartTime"
        width="180"
      >
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.workStartTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="维修结束时间"
        align="center"
        prop="workEndTime"
        width="180"
      >
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.workEndTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="维修用时"
        align="center"
        prop="workCostTime"
        width="200"
      >
      </el-table-column>
      <el-table-column label="维修费用" align="center" prop="workCost" />
      <el-table-column label="工厂编码" align="center" prop="factoryCode" />
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
        width="180"
        fixed="right"
      >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['device:repairOrder:edit']"
            >修改</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['device:repairOrder:remove']"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 快速维修工单对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="openAdd"
      width="500px"
      append-to-body
    >
      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
        <el-form-item label="设备编码" prop="equipmentCode">
          <el-input
            v-model="form.equipmentCode"
            placeholder="请输入设备编码"
            style="width: 280px"
          >
            <el-button
              slot="append"
              @click="handleSelectEquipment"
              icon="el-icon-search"
            ></el-button>
          </el-input>
          <ItemSelect ref="itemSelect" @onSelected="onItemSelectedEquipment">
          </ItemSelect>
        </el-form-item>
        <el-form-item label="故障开始时间" prop="faultStartTime">
          <el-date-picker
            clearable
            v-model="form.faultStartTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            style="width: 280px"
            placeholder="请选择故障开始时间"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="计划维修时间" prop="workPlanTime">
          <el-date-picker
            clearable
            v-model="form.workPlanTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            style="width: 280px"
            placeholder="请选择计划维修时间"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="是否停机维修" prop="workDownMachine">
          <el-radio-group v-model="form.workDownMachine">
            <el-radio label="1">是</el-radio>
            <el-radio label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item
          label="计划停机时间"
          prop="workPlanDownTime"
          v-if="form.workDownMachine == '1'"
        >
          <el-date-picker
            clearable
            v-model="form.workPlanDownTime"
            type="datetime"
            style="width: 280px"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="请选择计划停机时间"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="维修人工号" prop="workPerson">
          <el-input
            v-model="form.workPerson"
            placeholder="请选择维修人工号"
            style="width: 280px"
          >
            <el-button
              slot="append"
              @click="handleSelectPerson"
              icon="el-icon-search"
            ></el-button>
          </el-input>
          <ItemSelectPerson
            ref="itemSelectPerson"
            @onSelected="onItemSelectedPerson"
          >
          </ItemSelectPerson>
        </el-form-item>
        <el-form-item label="维修人姓名" prop="workPersonName">
          <el-input
            v-model="form.workPersonName"
            placeholder="请输入维修人姓名"
            style="width: 280px"
            disabled
          />
        </el-form-item>
        <el-form-item label="维修组" prop="workTeam">
          <el-select
            v-model="form.workTeam"
            placeholder="请选择维修组"
            @change="$forceUpdate()"
            clearable
            filterable
            style="width: 280px"
            @keyup.enter.native="handleQuery"
          >
            <el-option
              v-for="item in teamOption"
              :key="item.teamCode"
              :label="item.teamName"
              :value="item.teamCode"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="故障描述" prop="workFaultDesc">
          <el-select
            v-model="form.workFaultDesc"
            @change="$forceUpdate()"
            @blur="selectBlurworkFaultDesc"
            clearable
            filterable
            style="width: 280px"
            @keyup.enter.native="handleQuery"
          >
            <el-option
              v-for="item in workFaultDescOption"
              :key="item.faultCode"
              :label="item.faultSubclass"
              :value="item.faultSubclass"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancelAddForm">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 修改维修工单对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="openUpdate"
      width="500px"
      append-to-body
    >
      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
        <el-form-item label="报修单号" prop="orderCode">
          <el-input
            v-model="form.orderCode"
            placeholder="请输入报修单号"
            style="width: 250px"
            disabled
          />
        </el-form-item>
        <el-form-item label="设备编码" prop="equipmentCode">
          <el-input
            v-model="form.equipmentCode"
            placeholder="请输入设备编码"
            style="width: 250px"
            disabled
          />
        </el-form-item>
        <el-form-item label="计划维修时间" prop="workPlanTime">
          <el-date-picker
            clearable
            v-model="form.workPlanTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            style="width: 250px"
            placeholder="请选择计划维修时间"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="是否停机维修" prop="workDownMachine">
          <el-radio-group v-model="form.workDownMachine">
            <el-radio label="1">是</el-radio>
            <el-radio label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item
          label="计划停机时间"
          prop="workPlanDownTime"
          v-if="form.workDownMachine == '1'"
        >
          <el-date-picker
            clearable
            v-model="form.workPlanDownTime"
            type="datetime"
            style="width: 250px"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="请选择计划停机时间"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="维修人工号" prop="workPerson">
          <el-input
            v-model="form.workPerson"
            placeholder="请选择维修人工号"
            style="width: 250px"
          >
            <el-button
              slot="append"
              @click="handleSelectPerson"
              icon="el-icon-search"
            ></el-button>
          </el-input>
          <ItemSelectPerson
            ref="itemSelectPerson"
            @onSelected="onItemSelectedPerson"
          >
          </ItemSelectPerson>
        </el-form-item>
        <el-form-item label="维修人姓名" prop="workPersonName">
          <el-input
            v-model="form.workPersonName"
            placeholder="请输入维修人姓名"
            style="width: 250px"
            disabled
          />
        </el-form-item>
        <el-form-item label="维修组" prop="workTeam">
          <el-select
            v-model="form.workTeam"
            placeholder="请选择维修组"
            @change="$forceUpdate()"
            clearable
            filterable
            style="width: 250px"
            @keyup.enter.native="handleQuery"
          >
            <el-option
              v-for="item in teamOption"
              :key="item.teamCode"
              :label="item.teamName"
              :value="item.teamCode"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancelUpdateForm">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 委外申请 -->
    <el-dialog
      :title="title"
      :visible.sync="openApply"
      width="1000px"
      append-to-body
    >
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <el-row :gutter="10" class="mb8">
          <el-col :span="8">
            <el-form-item label="设备编码" prop="equipmentCode">
              <el-input
                v-model="form.equipmentCode"
                style="width: 195px"
                disabled
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="设备名称" prop="equipmentName">
              <el-input
                v-model="form.equipmentName"
                style="width: 195px"
                disabled
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="设备类型" prop="equipmentTypeName">
              <el-input
                v-model="form.equipmentTypeName"
                style="width: 195px"
                disabled
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10" class="mb8">
          <el-col :span="8">
            <el-form-item label="规格型号" prop="equipmentSpec">
              <el-input
                v-model="form.equipmentSpec"
                style="width: 195px"
                disabled
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="所在部门" prop="department">
              <el-input v-model="form.department" style="width: 195px" disabled>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="所在位置" prop="equipmentLocation">
              <el-input
                v-model="form.equipmentLocation"
                style="width: 195px"
                disabled
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item prop="workOutsourcingUnit" label="委外单位">
              <el-input
                v-model="form.workOutsourcingUnit"
                placeholder="请填写委外单位"
                style="width: 195px"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="outSourcePerson" label="委外维修人员">
              <el-input
                v-model="form.outSourcePerson"
                placeholder="请填写委外维修人员"
                style="width: 195px"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="workConnection" label="联系方式">
              <el-input
                v-model="form.workConnection"
                placeholder="请填写委外联系方式"
                style="width: 195px"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item prop="outSourceReason" label="委外原因">
              <el-input
                v-model="form.outSourceReason"
                placeholder="请输入委外原因"
                type="textarea"
                style="width: 840px"
                :autosize="{ minRows: 2, maxRows: 4 }"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitApplyForm">确 定</el-button>
        <el-button @click="cancelApplyForm">返 回</el-button>
      </div>
    </el-dialog>

    <!-- 委外申请查看页面 -->
    <el-dialog
      :title="title"
      :visible.sync="openApplyView"
      width="1000px"
      append-to-body
    >
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <el-descriptions
          :column="2"
          border
          :contentStyle="WCS"
          :label-style="WLS"
        >
          <el-descriptions-item label="设备编号">{{
            form.equipmentCode
          }}</el-descriptions-item>
          <el-descriptions-item label="设备名称">{{
            form.equipmentName
          }}</el-descriptions-item>
          <el-descriptions-item label="设备类型">{{
            form.equipmentTypeName
          }}</el-descriptions-item>
          <el-descriptions-item label="设备位置">{{
            form.equipmentLocation
          }}</el-descriptions-item>
          <el-descriptions-item label="工作中心编码">{{
            form.workshopCode
          }}</el-descriptions-item>
          <el-descriptions-item label="工作中心名称">{{
            form.workshopName
          }}</el-descriptions-item>

          <el-descriptions-item label="委外单位">{{
            form.workOutsourcingUnit
          }}</el-descriptions-item>
          <el-descriptions-item label="委外维修人员">{{
            form.outSourcePerson
          }}</el-descriptions-item>
          <el-descriptions-item label="委外联系方式">{{
            form.outSourceConnection
          }}</el-descriptions-item>
          <el-descriptions-item label="委外原因">{{
            form.outSourceReason
          }}</el-descriptions-item>
        </el-descriptions>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancelApplyViewForm">返 回</el-button>
      </div>
    </el-dialog>

    <!-- 填写维修记录对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="openWrite"
      width="1500px"
      append-to-body
      v-if="openWrite"
    >
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <el-tabs type="border-card">
          <el-tab-pane label="维修基本信息">
            <el-descriptions
              :column="3"
              border
              :contentStyle="CS_WRITE"
              :label-style="LS_WRITE"
            >
              <el-descriptions-item label="维修工单号">{{
                form.workCode
              }}</el-descriptions-item>
              <el-descriptions-item label="报修单号">{{
                form.workCode
              }}</el-descriptions-item>
              <el-descriptions-item label="设备编号">{{
                form.equipmentCode
              }}</el-descriptions-item>
              <el-descriptions-item label="设备名称">{{
                form.equipmentName
              }}</el-descriptions-item>
              <el-descriptions-item label="设备类型">{{
                form.equipmentTypeName
              }}</el-descriptions-item>
              <el-descriptions-item label="设备位置">{{
                form.equipmentLocation
              }}</el-descriptions-item>
              <el-descriptions-item label="工作中心编码">{{
                form.workshopCode
              }}</el-descriptions-item>
              <el-descriptions-item label="工作中心名称">{{
                form.workshopName
              }}</el-descriptions-item>
              <el-descriptions-item label="报修来源">{{
                form.orderSource
              }}</el-descriptions-item>
              <el-descriptions-item label="故障报修时间">{{
                form.orderBreakdownTime
              }}</el-descriptions-item>
              <el-descriptions-item label="报修人名字">{{
                form.orderRepairmanName
              }}</el-descriptions-item>
              <el-descriptions-item label="联系方式">{{
                form.orderConnection
              }}</el-descriptions-item>
              <el-descriptions-item label="是否立即处理">{{
                form.workHandle ? "否" : "是"
              }}</el-descriptions-item>
              <el-descriptions-item label="计划维修时间">{{
                form.workPlanTime
              }}</el-descriptions-item>
              <el-descriptions-item label="是否停机维修">{{
                form.workDownMachine ? "否" : "是"
              }}</el-descriptions-item>
              <el-descriptions-item label="计划停机时间">{{
                form.workPlanDownTime
              }}</el-descriptions-item>
              <el-descriptions-item label="是否委外">{{
                form.workOutsource ? "否" : "是"
              }}</el-descriptions-item>
              <el-descriptions-item label="维修班组">{{
                form.workTeam
              }}</el-descriptions-item>
              <el-descriptions-item label="维修班组人员">{{
                form.workTeamPerson
              }}</el-descriptions-item>
              <el-descriptions-item label="故障描述">{{
                form.orderDesc
              }}</el-descriptions-item>
            </el-descriptions>
            <el-descriptions :column="1" border>
              <el-descriptions-item
                label="维修前故障图片"
                :contentStyle="CS_WRITE_IMG"
                :label-style="LS_WRITE_IMG"
              >
                <div class="view_picture_body">
                  <el-image
                    v-for="(item, index) in urlBeforeLists"
                    :key="index"
                    :src="item"
                  ></el-image>
                </div>
              </el-descriptions-item>
            </el-descriptions>
            <el-descriptions :column="1" border>
              <el-descriptions-item
                label="维修后故障图片"
                :contentStyle="CS_WRITE_IMG"
                :label-style="LS_WRITE_IMG"
              >
                <div class="view_picture_body">
                  <el-image
                    v-for="(item, index) in urlAfterLists"
                    :key="index"
                    :src="item"
                  ></el-image>
                </div>
              </el-descriptions-item>
            </el-descriptions>
          </el-tab-pane>

          <el-tab-pane label="检查项信息">
            <el-table :data="detailList" border :span-method="objectSpanMethod">
              <el-table-column prop="itemTypeName" label="检查类型" width="100">
              </el-table-column>
              <el-table-column prop="itemName" label="检查项名称" width="150">
              </el-table-column>
              <el-table-column prop="itemMethod" label="方法" width="150">
              </el-table-column>
              <el-table-column prop="itemTools" label="工具" width="50">
              </el-table-column>
              <el-table-column prop="standardName" label="标准名称" width="150">
              </el-table-column>
              <el-table-column
                prop="detailReach"
                label="维修前是否达标"
                width="67"
              >
                <template slot-scope="scope">
                  {{ scope.row.detailReach == "1" ? "达标" : "不达标" }}
                </template>
              </el-table-column>
              <el-table-column
                prop="repairReach"
                label="维修后是否达标"
                width="110"
              >
                <template scope="scope">
                  <el-radio-group
                    v-model="scope.row.repairReach"
                    v-if="scope.row.standardType != 'quantify'"
                  >
                    <el-radio label="1">达标</el-radio>
                    <el-radio label="0">不达标</el-radio>
                  </el-radio-group>
                </template>
              </el-table-column>
              <el-table-column
                prop="actualValue"
                label="维修前实际值"
                width="50"
              >
              </el-table-column>
              <el-table-column
                prop="repairValue"
                label="维修后实际值"
                width="100"
              >
                <template slot-scope="scope">
                  <el-input
                    size="small"
                    v-model="scope.row.repairValue"
                    v-if="scope.row.standardType == 'quantify'"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column prop="detailUpLimit" label="上限" width="50">
              </el-table-column>
              <el-table-column prop="detailDownLimit" label="下限" width="50">
              </el-table-column>
              <el-table-column prop="detailUnit" label="单位" width="40">
              </el-table-column>
              <el-table-column prop="picturePath" label="提交图片">
                <template slot-scope="scope">
                  <FileUpload v-model="scope.row.picturePath" />
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>

          <el-tab-pane label="填写维修记录">
            <el-row>
              <el-col :span="8">
                <el-form-item label="维修人工号" prop="workPerson" label-width="120px">
                  <el-input
                    v-model="form.workPerson"
                    placeholder="请选择维修人工号"
                    style="width: 250px"
                  >
                    <el-button
                      slot="append"
                      @click="handleSelectPerson"
                      icon="el-icon-search"
                    ></el-button>
                  </el-input>
                  <ItemSelectPerson
                    ref="itemSelectPerson"
                    @onSelected="onItemSelectedPerson"
                  > 
                  </ItemSelectPerson>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="维修人姓名" prop="workPersonName" label-width="120px">
                  <el-input
                    v-model="form.workPersonName"
                    style="width: 250px"
                    disabled
                  >
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="维修状态" prop="workStatus" label-width="120px">
                  <el-select
                    v-model="form.workStatus"
                    placeholder="请选择维修状态"
                    style="width: 250px"
                  >
                    <el-option
                      v-for="dict in dict.type.device_repair_status"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="开始时间" prop="workStartTime" label-width="120px">
                  <el-date-picker
                    clearable
                    v-model="form.workStartTime"
                    type="datetime"
                    style="width: 250px"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    @change="listeningTime"
                    placeholder="请输入开始时间"
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="结束时间" prop="workEndTime" label-width="120px">
                  <el-date-picker
                    clearable
                    v-model="form.workEndTime"
                    type="datetime"
                    style="width: 250px"
                    @change="listeningTime"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    placeholder="请输入结束时间"
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="维修用时" prop="workCostTime" label-width="120px">
                  <el-input
                    v-model="form.workCostTime"
                    style="width: 250px"
                    disabled
                  >
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="故障报修时间" prop="orderBreakdownTime" v-if = "form.faultStartTime == null" label-width="120px">
                  <el-date-picker
                    clearable
                    v-model="form.orderBreakdownTime"
                    type="datetime"
                    style="width: 250px"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    disabled
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="故障开始时间" prop="faultStartTime" v-if = "form.faultStartTime != null" label-width="120px">
                  <el-date-picker
                    clearable
                    v-model="form.faultStartTime"
                    type="datetime"
                    style="width: 250px"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    disabled
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="故障停机时间" prop="faultDownTime" label-width="120px">
                  <el-input
                    v-model="form.faultDownTime"
                    style="width: 250px"
                    disabled
                  >
                  </el-input>
                </el-form-item>
              </el-col>  
              <el-col :span="8">
                <el-form-item label="是否停机" prop="workDownMachine" abel-width="120px">
                  <el-radio-group v-model="form.workDownMachine">
                    <el-radio label="1">是</el-radio>
                    <el-radio label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <!-- <el-col :span="8">
                <el-form-item label="故障类型" prop="faultType">
                  <el-cascader
                    :options="faultTypeOption"
                    v-model="form.faultType"
                    style="width: 250px"
                    clearable
                  ></el-cascader>
                </el-form-item>
              </el-col> -->
              <el-col :span="8">
                <el-form-item label="故障原因" prop="workReason" label-width="120px">
                  <el-select
                    v-model="form.workReason"
                    placeholder="请选择故障原因"
                    @change="$forceUpdate()"
                    @blur="selectBlurWorkReason"
                    clearable
                    filterable
                    style="width: 250px"
                    @keyup.enter.native="handleQuery"
                  >
                    <el-option
                      v-for="item in workReasonOption"
                      :key="item.faultCode"
                      :label="item.faultSubclass"
                      :value="item.faultSubclass"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="处理措施" prop="repairMeasures" label-width="120px">
                  <el-select
                    v-model="form.repairMeasures"
                    placeholder="请选择处理措施"
                    @change="$forceUpdate()"
                    @blur="selectRepairMeasures"
                    clearable
                    filterable
                    style="width: 250px"
                    @keyup.enter.native="handleQuery"
                  >
                    <el-option
                      v-for="item in repairMeasuresOption"
                      :key="item.faultCode"
                      :label="item.faultSubclass"
                      :value="item.faultSubclass"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="维修费用" prop="workCost" label-width="120px">
                  <el-input-number
                    :min="0"
                    :step="1"
                    v-model="form.workCost"
                    style="width: 250px"
                  />
                  <span> 元</span>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item prop="remark" label="备注" label-width="120px">
                  <el-input
                    v-model="form.remark"
                    placeholder="请填写备注"
                    type="textarea"
                    :autosize="{ minRows: 2, maxRows: 4}"
                    style="width: 725px"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="维修后图片" prop="afterRepairFile" label-width="120px">
                  <FileUpload v-model="form.afterRepairFile" />
                </el-form-item>
              </el-col>
            </el-row>
          </el-tab-pane>

          <el-tab-pane label="提交备件申领记录">
            <!-- 使用备件领用记录 -->
            <ItemSelectSpareParts
              :optType="optType"
              :workCode="form.workCode"
              :equipmentCode="form.equipmentCode"
              v-if="form.workCode != null"
            ></ItemSelectSpareParts>
          </el-tab-pane>
        </el-tabs>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitWriteForm">提 交</el-button>
        <el-button @click="cancelWriteForm">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 维修结果审核 -->
    <el-dialog title="维修结果审核" :visible.sync="inspectDialog" width="30%">
      <el-radio v-model="inspect" label="2">待审核</el-radio>
      <el-radio v-model="inspect" label="1">审核通过</el-radio>
      <el-radio v-model="inspect" label="0">驳回</el-radio>
      <row></row>
      <el-input
        v-model="auditOpinion"
        placeholder="请填写审核意见"
        type="textarea"
        :autosize="{ minRows: 2, maxRows: 4}"
        style="width: 350px"
      />   
      <span slot="footer" class="dialog-footer">
        <el-button @click="inspectDialog = false">取 消</el-button>
        <el-button type="primary" @click="checkRepairWorkOrder">确 定</el-button>
      </span>
    </el-dialog>

    <!-- 查看维修记录对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="queryWrite"
      width="1200px"
      append-to-body
      v-if="queryWrite"
    >
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <el-tabs type="border-card">
          <el-tab-pane label="维修基本信息">
            <el-descriptions
              :column="3"
              border
              :contentStyle="CS_VIEW"
              :label-style="LS_VIEW"
            >
              <el-descriptions-item label="维修工单号">{{
                form.workCode
              }}</el-descriptions-item>
              <el-descriptions-item label="报修单号">{{
                form.workCode
              }}</el-descriptions-item>
              <el-descriptions-item label="设备编号">{{
                form.equipmentCode
              }}</el-descriptions-item>
              <el-descriptions-item label="设备名称">{{
                form.equipmentName
              }}</el-descriptions-item>
              <el-descriptions-item label="设备类型">{{
                form.equipmentTypeName
              }}</el-descriptions-item>
              <el-descriptions-item label="设备位置">{{
                form.equipmentLocation
              }}</el-descriptions-item>
              <el-descriptions-item label="工作中心编码">{{
                form.workshopCode
              }}</el-descriptions-item>
              <el-descriptions-item label="工作中心名称">{{
                form.workshopName
              }}</el-descriptions-item>
              <el-descriptions-item label="报修来源">{{
                form.orderSource
              }}</el-descriptions-item>
              <el-descriptions-item label="故障报修时间">{{
                form.orderBreakdownTime
              }}</el-descriptions-item>
              <el-descriptions-item label="报修人名字">{{
                form.orderRepairmanName
              }}</el-descriptions-item>
              <el-descriptions-item label="联系方式">{{
                form.orderConnection
              }}</el-descriptions-item>
              <el-descriptions-item label="是否立即处理">{{
                form.workHandle ? "否" : "是"
              }}</el-descriptions-item>
              <el-descriptions-item label="计划维修时间">{{
                form.workPlanTime
              }}</el-descriptions-item>
              <el-descriptions-item label="是否停机维修">{{
                form.workDownMachine ? "否" : "是"
              }}</el-descriptions-item>
              <el-descriptions-item label="计划停机时间">{{
                form.workPlanDownTime
              }}</el-descriptions-item>
              <el-descriptions-item label="是否委外">{{
                form.workOutsource ? "否" : "是"
              }}</el-descriptions-item>
              <el-descriptions-item label="维修班组">{{
                form.workTeam
              }}</el-descriptions-item>
            </el-descriptions>
            <el-descriptions
              :column="1"
              border
              :contentStyle="CS_VIEW_IMG"
              :label-style="LS_VIEW_IMG"
            >
              <el-descriptions-item label="维修班组人员">{{
                form.workTeamPerson
              }}</el-descriptions-item>
              <el-descriptions-item label="故障描述">{{
                form.orderDesc
              }}</el-descriptions-item>
            </el-descriptions>
            <el-descriptions :column="1" border>
              <el-descriptions-item
                label="维修前故障图片"
                :contentStyle="CS_VIEW_IMG"
                :label-style="LS_VIEW_IMG"
              >
                <div class="view_picture_body">
                  <el-image
                    v-for="(item, index) in urlBeforeLists"
                    :key="index"
                    :src="item"
                  ></el-image>
                </div>
              </el-descriptions-item>
            </el-descriptions>
            <el-descriptions :column="1" border>
              <el-descriptions-item
                label="维修后故障图片"
                :contentStyle="CS_VIEW_IMG"
                :label-style="LS_VIEW_IMG"
              >
                <div class="view_picture_body">
                  <el-image
                    v-for="(item, index) in urlAfterLists"
                    :key="index"
                    :src="item"
                  ></el-image>
                </div>
              </el-descriptions-item>
            </el-descriptions>
          </el-tab-pane>
          <el-tab-pane label="查看检查项信息">
            <el-table :data="detailList" border :span-method="objectSpanMethod">
              <el-table-column prop="itemTypeName" label="检查类型" width="100">
              </el-table-column>
              <el-table-column prop="itemName" label="检查项名称" width="150">
              </el-table-column>
              <el-table-column prop="itemMethod" label="方法" width="150">
              </el-table-column>
              <el-table-column prop="itemTools" label="工具" width="50">
              </el-table-column>
              <el-table-column prop="standardName" label="标准名称" width="150">
              </el-table-column>
              <el-table-column
                prop="detailReach"
                label="维修前是否达标"
                width="67"
              >
                <template slot-scope="scope">
                  {{ scope.row.detailReach == "1" ? "达标" : "不达标" }}
                </template>
              </el-table-column>
              <el-table-column
                prop="repairReach"
                label="维修后是否达标"
                width="110"
              >
                <template slot-scope="scope">
                  {{ scope.row.repairReach == "1" ? "达标" : "不达标" }}
                </template>
              </el-table-column>
              <el-table-column
                prop="actualValue"
                label="维修前实际值"
                width="75"
              >
              </el-table-column>
              <el-table-column
                prop="repairValue"
                label="维修后实际值"
                width="75"
              >
                <template slot-scope="scope">
                  <el-input
                    size="small"
                    disabled
                    v-model="scope.row.repairValue"
                    v-if="scope.row.standardType == 'quantify'"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column prop="detailUpLimit" label="上限" width="50">
              </el-table-column>
              <el-table-column prop="detailDownLimit" label="下限" width="50">
              </el-table-column>
              <el-table-column prop="detailUnit" label="单位" width="40">
              </el-table-column>
              <el-table-column prop="picturePath" label="维修后图片" width="60">
                <template slot-scope="scope">
                  <el-popover placement="right" width="300" trigger="hover">
                    <div class="standardUrl_body">
                      <div
                        v-for="(url, index) in scope.row.standardUrlLists"
                        :key="index"
                      >
                        <el-image :src="url"></el-image>
                      </div>
                    </div>
                    <el-button
                      slot="reference"
                      type="primary"
                      icon="el-icon-picture"
                      circle
                    ></el-button>
                  </el-popover>
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>

          <el-tab-pane label="查看维修记录">
            <el-row :gutter="10" class="mb8">
              <el-col :span="8">
                <el-form-item label="维修人工号" prop="workPerson" label-width="120px">
                  <el-input
                    v-model="form.workPerson"
                    style="width: 195px"
                    disabled
                  >
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="维修人姓名" prop="workPersonName" label-width="120px">
                  <el-input
                    v-model="form.workPersonName"
                    style="width: 195px"
                    disabled
                  >
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="维修状态" prop="workStatus" label-width="120px">
                  <el-select
                    v-model="form.workStatus"
                    disabled
                    style="width: 195px"
                  >
                    <el-option
                      v-for="dict in dict.type.device_repair_status"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="10" class="mb8">
              <el-col :span="8">
                <el-form-item label="开始时间" prop="workStartTime" label-width="120px">
                  <el-date-picker
                    clearable
                    v-model="form.workStartTime"
                    type="datetime"
                    style="width: 195px"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    @change="listeningTime"
                    disabled
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="结束时间" prop="workEndTime" label-width="120px">
                  <el-date-picker
                    clearable
                    v-model="form.workEndTime"
                    type="datetime"
                    style="width: 195px"
                    @change="listeningTime"
                    disabled
                    value-format="yyyy-MM-dd HH:mm:ss"
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="维修用时" prop="workCostTime" label-width="120px">
                  <el-input
                    v-model="form.workCostTime"
                    style="width: 195px"
                    disabled
                  >
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="10" class="mb8">
              <el-col :span="8">
                <el-form-item label="故障报修时间" prop="orderBreakdownTime" v-if = "form.faultStartTime == null" label-width="120px">
                  <el-date-picker
                    clearable
                    v-model="form.orderBreakdownTime"
                    type="datetime"
                    style="width: 195px"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    disabled
                  ></el-date-picker>
                </el-form-item>
                <el-form-item label="故障开始时间" prop="faultStartTime" v-if = "form.faultStartTime != null" label-width="120px">
                  <el-date-picker
                    clearable
                    v-model="form.faultStartTime"
                    type="datetime"
                    style="width: 195px"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    disabled
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="故障停机时间" prop="faultDownTime" label-width="120px">
                  <el-input
                    v-model="form.faultDownTime"
                    style="width: 195px"
                    disabled
                  >
                  </el-input>
                </el-form-item>
              </el-col>  
              <el-col :span="8">
                <el-form-item label="是否停机" prop="workDownMachine" label-width="120px">
                  <el-radio-group v-model="form.workDownMachine" disabled>
                    <el-radio label="1">是</el-radio>
                    <el-radio label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="8">
                <el-form-item label="故障类型" prop="faultType">
                  <el-cascader
                    disabled
                    :options="faultTypeOption"
                    v-model="form.faultType"
                    style="width: 195px"
                    clearable
                  ></el-cascader>
                </el-form-item>
              </el-col> -->
            </el-row>
            <el-row :gutter="10" class="mb8">
              <el-col :span="8">
                <el-form-item label="故障原因" prop="workReason" label-width="120px">
                  <el-select
                    v-model="form.workReason"
                    @change="$forceUpdate()"
                    disabled
                    clearable
                    filterable
                    style="width: 195px"
                    @keyup.enter.native="handleQuery"
                  >
                    <el-option
                      v-for="item in workReasonOption"
                      :key="item.faultCode"
                      :label="item.faultSubclass"
                      :value="item.faultCode"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="处理措施" prop="repairMeasures" label-width="120px">
                  <el-select
                    v-model="form.repairMeasures"
                    @change="$forceUpdate()"
                    clearable
                    filterable
                    disabled
                    style="width: 195px"
                    @keyup.enter.native="handleQuery"
                  >
                    <el-option
                      v-for="item in repairMeasuresOption"
                      :key="item.faultCode"
                      :label="item.faultSubclass"
                      :value="item.faultCode"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="维修费用" prop="workCost" label-width="120px">
                  <el-input-number
                    :min="0"
                    :step="1"
                    disabled
                    v-model="form.workCost"
                    style="width: 175px"
                  />
                  <span> 元</span>
                </el-form-item>
              </el-col>
            </el-row>
          </el-tab-pane>
          <el-tab-pane label="查看备件申领记录">
            <!-- 使用备件领用记录 -->
            <ItemSelectSpareParts
              :optType="optType"
              :workCode="form.workCode"
              :equipmentCode="form.equipmentCode"
              :workStatus="form.workStatus"
              v-if="form.workCode != null"
            ></ItemSelectSpareParts>
          </el-tab-pane>
        </el-tabs>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancelQueryWriteForm">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

	<script>
import {
  listRepairOrder,
  getRepairOrder,
  delRepairOrder,
  addRepairOrder,
  updateRepairOrder,
  applyOutsource,
  writeRepairOrder,
  queryEquFaultTypeTree,
  checkRepairWorkOrder,
} from "@/api/device/repairOrder";
import { listFaultReason } from "@/api/device/faultReason";
import { listFaultMeasures } from "@/api/device/faultMeasures";
import { listFaultDescription } from "@/api/device/faultDescription";
import { getMaintenanceTeamList } from "@/api/device/equTeam";
import ItemSelect from "./selectSingleEquipment.vue";
import ItemSelectPerson from "./selectSinglePerson.vue";
import { Message } from "element-ui";
import ItemSelectSpareParts from "./selectSpareParts.vue";
import moment from "moment";
export default {
  name: " RepairOrder",
  components: { ItemSelect, ItemSelectPerson, ItemSelectSpareParts },
  dicts: ["device_repair_status","device_audit_status"],
  data() {
    return {
      //委外表格格式
      WCS: {
        "text-align": "left",
      },
      WLS: {
        width: "225px",
      },
      //查看维修表格
      CS_VIEW: {
        width: "183px",
      },
      LS_VIEW: {
        width: "150px",
      },
      //图片 以及图面上面两行
      LS_VIEW_IMG: {
        width: "145px",
      },
      CS_VIEW_IMG: {
        width: "817px",
      },
      //填写维修表格
      CS_WRITE: {
        width: "200px",
      },
      LS_WRITE: {
        width: "200px",
      },
      //图片 以及图面上面两行
      LS_WRITE_IMG: {
        width: "200px",
      },
      CS_WRITE_IMG: {
        width: "1000px",
      },
      //故障描述
      workFaultDescOption: [],
      //维修处理措施模糊选择
      repairMeasuresOption: [],
      //原因分析模糊选择
      workReasonOption: [],
      //检查项表格数据
      detailList: [],
      //维修前照片
      urlBeforeLists: [],
      //维修后照片
      urlAfterLists: [],
      //选择设备维修班组
      teamOption: [],
      //故障类型
      faultTypeOption: [],
      optType: undefined,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 维修工单表格数据
      repairOrderList: [],
      // 弹出层标题
      title: "",
      // 是否显示快速工单弹出层
      openAdd: false,
      // 是否显示修改工单弹出层
      openUpdate: false,
      // 是否显示委外申请弹出层
      openApply: false,
      // 是否显示委外申请查询弹出层
      openApplyView: false,
      // 是否显示填写维修记录弹出层
      openWrite: false,
      // 是否显示查看维修记录弹出层
      queryWrite: false,
      // 结果检验弹窗
      inspectDialog: false,
      // 检验结果
      inspect: null,
      // 审核意见
      auditOpinion: null,
      // 多个维修单号
      orderCodes: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        orderId: null,
        orderCode: null,
        workCode: null,
        workHandle: null,
        workPlanTime: null,
        workPlanDownTime: null,
        orderRelevance: null,
        workPerson: null,
        workPersonName: null,
        workTeam: null,
        workOutsource: null,
        workDownMachine: null,
        equipmentCode: null,
        workReason: null,
        workFaultDesc: null,
        workCostTime: null,
        workCost: null,
        outWorkId: null,
        outWorkCode: null,
        attr1: null,
        attr2: null,
        attr3: null,
        factoryCode: null,
        //计划维修时间组、计划停机时间组
        workPlanTimeArray: [],
        workPlanDownTimeArray: [],
        resultInspect: null,
      },
      auxiliaryQueryParams: {
        pageNum: 1,
        pageSize: 1000,
      },
      //选择是否委外
      workOutsourceOption: [
        {
          workOutsource: "1",
          label: "转委外",
        },
        {
          workOutsource: "0",
          label: "不委外",
        },
      ],
      //选择是否停机
      workDownMachineOption: [
        {
          workDownMachine: "1",
          label: "停机",
        },
        {
          workDownMachine: "0",
          label: "不停机",
        },
      ],
      // 日期范围选择快捷
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        //委外申请校验
        workOutsourcingUnit: [
          { required: true, message: "委外单位不能为空", trigger: "blur" },
        ],
        outSourceReason: [
          { required: true, message: "委外原因不能为空", trigger: "blur" },
        ],
        workConnection: [
          { required: true, message: "委外联系方式不能为空", trigger: "blur" },
        ],
        outSourcePerson: [
          { required: true, message: "委外维修人员不能为空", trigger: "blur" },
        ],

        //快速工单
        equipmentCode: [
          { required: true, message: "设备编码不能为空", trigger: "blur" },
        ],
        workPlanDownTime: [
          { required: true, message: "计划维修时间不能为空", trigger: "blur" },
        ],
        faultStartTime: [
          { required: true, message: "故障开始时间不能为空", trigger: "blur" },
        ],
        workDownMachine: [
          { required: true, message: "是否停机维修不能为空", trigger: "blur" },
        ],
        workFaultDesc: [
          { required: true, message: "故障描述不能为空", trigger: "blur" },
        ],
        workTeam: [
          { required: true, message: "故障组不能为空", trigger: "blur" },
        ],
      },
    };
  },
  created() {
    this.getList();
    this.getTeamList();
    this.getEquFaultTypeTree();
    this.getWorkReason();
    this.getRepairMeasures();
    this.getOrderDesc();
  },
  methods: {
    // 生成表头序号
    indexMethod(index) {
      return index + 1;
    },

    //计算时间维修时间 结束维修时间-开始维修时间 转化为小时 
    listeningTime() {
      if (this.form.workEndTime != null && this.form.workStartTime != null) {
        var time1 = moment(this.form.workStartTime);
        var time2 = moment(this.form.workEndTime);
        let duration = moment.duration(time2.diff(time1));
        let { _data } = duration;
        console.log("打印维修时间", _data);
        //拼接
        this.form.workCostTime =
          (
            _data.days * 24 +
            _data.hours +
            _data.minutes / 60 +
            _data.seconds / 3600
          ).toFixed(1) + "小时";

        //如果不停机
        if(this.form.workDownMachine == '0'){
          this.form.faultDownTime = "0.0小时";
        }
      }

      //增加故障停机时间
      if (this.form.orderBreakdownTime != null && this.form.workEndTime != null && this.form.workDownMachine == 1) {
        var time1 = moment(this.form.orderBreakdownTime);
        var time2 = moment(this.form.workEndTime);
        let duration = moment.duration(time2.diff(time1));
        let { _data } = duration;
        console.log("打印故障停机时间", _data);
        //拼接
        this.form.faultDownTime =
          (
            _data.days * 24 +
            _data.hours +
            _data.minutes / 60 +
            _data.seconds / 3600
          ).toFixed(1) + "小时";
      }else if(this.form.faultStartTime != null && this.form.workEndTime != null && this.form.workDownMachine == 1){
        var time1 = moment(this.form.faultStartTime);
        var time2 = moment(this.form.workEndTime);
        let duration = moment.duration(time2.diff(time1));
        let { _data } = duration;
        console.log("打印故障停机时间", _data);
        //拼接
        this.form.faultDownTime =
          (
            _data.days * 24 +
            _data.hours +
            _data.minutes / 60 +
            _data.seconds / 3600
          ).toFixed(1) + "小时";
      }
    },
    //计算时间 结束维修时间-开始维修时间
    // listeningTime() {
    //   if (this.form.workEndTime != null && this.form.workStartTime != null) {
    //     var time1 = moment(this.form.workStartTime);
    //     var time2 = moment(this.form.workEndTime);
    //     let duration = moment.duration(time2.diff(time1));
    //     let { _data } = duration;
    //     console.log("打印维修时间", _data);
    //     //拼接
    //     this.form.workCostTime =
    //       _data.years +
    //       "年" +
    //       _data.months +
    //       "月" +
    //       _data.days +
    //       "日" +
    //       _data.hours +
    //       "小时" +
    //       _data.minutes +
    //       "分" +
    //       _data.seconds +
    //       "秒";
    //   }
    // },

    /** 查询维修工单列表 */
    getList() {
      this.loading = true;
      listRepairOrder(this.queryParams).then((response) => {
        this.repairOrderList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    /** 查询故障描述列表 */
    getOrderDesc() {
      this.loading = true;
      listFaultDescription(this.auxiliaryQueryParams).then((response) => {
        this.workFaultDescOption = response.rows;
      });
    },
    selectBlurWorkReason(even) {
      if (even.target.value) {
        this.form.workReason = even.target.value;
      }
    },
    selectRepairMeasures(even) {
      if (even.target.value) {
        this.form.repairMeasures = even.target.value;
      }
    },
    selectBlurworkFaultDesc(even) {
      if (even.target.value) {
        this.form.workFaultDesc = even.target.value;
      }
    },
    /** 查询维修原因列表 */
    getWorkReason() {
      this.loading = true;
      listFaultReason(this.auxiliaryQueryParams).then((response) => {
        this.workReasonOption = response.rows;
      });
    },
    /** 查询维修措施列表 */
    getRepairMeasures() {
      this.loading = true;
      listFaultMeasures(this.auxiliaryQueryParams).then((response) => {
        this.repairMeasuresOption = response.rows;
      });
    },
    /** 查询维修班组列表 */
    getTeamList() {
      this.loading = true;
      getMaintenanceTeamList(this.queryParams).then((response) => {
        this.teamOption = response.rows;
      });
    },
    //故障类型
    getEquFaultTypeTree() {
      this.loading = true;
      queryEquFaultTypeTree(this.queryParams).then((response) => {
        console.log(response.rows);
        this.faultTypeOption = response.data;
      });
    },
    // 委外申请查看页面-取消按钮
    cancelApplyViewForm() {
      this.openApplyView = false;
    },
    // 新增-取消按钮
    cancelAddForm() {
      this.openAdd = false;
      this.reset();
    },
    // 更新-取消按钮
    cancelUpdateForm() {
      this.openUpdate = false;
      this.reset();
    },
    // 委外申请-取消按钮
    cancelApplyForm() {
      this.openApply = false;
      this.reset();
    },
    // 填写维修记录-取消按钮
    cancelWriteForm() {
      this.openWrite = false;
      this.reset();
    },
    // 查看维修记录-取消按钮
    cancelQueryWriteForm() {
      this.queryWrite = false;
    },
    // 表单重置
    reset() {
      this.form = {
        beforeRepairFiles: null,
        afterRepairFiles: null,
        workId: null,
        orderId: null,
        orderCode: null,
        workHandle: null,
        workPlanTime: null,
        workPlanDownTime: null,
        orderRelevance: null,
        workPerson: null,
        workPersonName: null,
        workTeam: null,
        workOutsource: null,
        workDownMachine: null,
        equipmentCode: null,
        workReason: null,
        workFaultDesc: null,
        workCostTime: null,
        workCost: null,
        outWorkId: null,
        outWorkCode: null,
        attr1: null,
        attr2: null,
        attr3: null,
        createBy: null,
        createTime: null,
        updateTime: null,
        updateBy: null,
        delFlag: null,
        factoryCode: null,
        auditOpinion: null,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      //计划维修时间组、计划停机时间组
      (this.queryParams.workPlanTimeArray = []),
        (this.queryParams.workPlanDownTimeArray = []),
        this.handleQuery();
    },
    // 多选框备品备件选中数据
    handleSelectionSparePartsChange(selection) {
      this.ids = selection.map((item) => item.applyId);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.workId);
      this.orderCodes = selection.map((item) => item.workCode);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.openAdd = true;
      this.title = "快速工单";
    },

    /** 填写按钮操作 */
    handleWrite(row) {
      this.reset();
      this.repairRecordSteps = 0;
      const workId = row.workId || this.ids;
      getRepairOrder(workId).then((response) => {
        this.form = response.data;

        //转成list
        if (response.data.faultType != null) {
          this.form.faultType = response.data.faultType.split(",");
        }

        //遍历response.data.beforeRepairFiles
        if (response.data.beforeRepairFiles != null) {
          var beforeNewFiles = [];
          response.data.beforeRepairFiles.forEach((item) => {
            var beforeNewFile = {};
            beforeNewFile.name = item.fileName;
            beforeNewFile.url = item.fileAddress;
            beforeNewFiles.push(beforeNewFile);
          });
          this.form.beforeRepairFiles = beforeNewFiles;

          //维修前照片
          var urlBeforeLists = [];
          beforeNewFiles.forEach((item) => {
            urlBeforeLists.push(item.url);
          });
          this.urlBeforeLists = urlBeforeLists;
        } else {
          this.urlBeforeLists = null;
        }

        //遍历response.data.afterRepairFiles
        if (response.data.afterRepairFiles != null) {
          var afterNewFiles = [];
          response.data.afterRepairFiles.forEach((item) => {
            var afterNewFile = {};
            afterNewFile.name = item.fileName;
            afterNewFile.url = item.fileAddress;
            afterNewFiles.push(afterNewFile);
          });
          this.form.afterRepairFiles = afterNewFiles;
          //维修后照片
          var urlAfterLists = [];
          afterNewFiles.forEach((item) => {
            urlAfterLists.push(item.url);
          });
          this.urlAfterLists = urlAfterLists;
        } else {
          this.urlAfterLists = null;
        }

        //重置
        this.detailList = null;
        this.detailList = response.data.detailList;
        if (this.detailList != null) {
          //检查项遍历
          var standards = [];
          this.detailList.forEach((item1) => {
            //检查项名字
            if (item1 != null) {
              item1.standardList.forEach((item) => {
                var standard = {};
                standard.id = item.id;
                standard.itemTypeName = item1.itemTypeName;
                standard.itemName = item1.itemName;
                standard.itemMethod = item1.itemMethod;
                standard.itemTools = item1.itemTools;
                standard.planLoop = item1.planLoop;
                standard.planLoopType = item1.planLoopType;
                standard.standardName = item.standardName;
                standard.detailUpLimit = item.detailUpLimit;
                standard.detailDownLimit = item.detailDownLimit;
                standard.detailUnit = item.detailUnit;
                standard.detailReach = item.detailReach;
                standard.actualValue = item.actualValue;
                //实际值
                standard.repairValue = item.repairValue;
                standard.repairReach = item.repairReach;
                standard.standardType = item.standardType;

                if (item.picturePaths != null) {
                  var newFiles = [];
                  item.picturePaths.forEach((item) => {
                    var newFile = {};
                    newFile.name = item.fileName;
                    newFile.url = item.fileAddress;
                    newFiles.push(newFile);
                  });
                  standard.picturePath = newFiles;
                }
                //检查项图片显示
                var standardUrlLists = [];
                if (item.picturePaths != null) {
                  item.picturePaths.forEach((item2) => {
                    standardUrlLists.push(item2.fileAddress);
                  });
                  standard.standardUrlLists = standardUrlLists;
                } else {
                  standard.standardUrlLists = null;
                }
                standards.push(standard);
              });
            }
          });

          this.detailList = standards;
        }
        if (this.form.workStatus == "1") {
          this.queryWrite = true;
          this.title = "查看维修记录";
        } else {
          this.openWrite = true;
          this.title = "填写维修记录";
        }
      });
    },
    /** 委外申请按钮操作 */
    handleApply(row) {
      this.reset();
      const workId = row.workId || this.ids;
      getRepairOrder(workId).then((response) => {
        this.form = response.data;
        console.log("打印委外信息", this.form.workOutsourcingUnit);
        if (
          this.form.workOutsourcingUnit == null ||
          this.form.workOutsourcingUnit == ""
        ) {
          this.openApply = true;
          this.title = "委外申请";
        } else {
          this.openApplyView = true;
          this.title = "查看委外申请";
        }
      });
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const workId = row.workId || this.ids;
      getRepairOrder(workId).then((response) => {
        this.form = response.data;
        this.openUpdate = true;
        this.title = "修改维修工单";
      });
    },
    /** 提交委外申请 */
    submitApplyForm() {
      applyOutsource(this.form).then((response) => {
        this.$modal.msgSuccess("委外申请成功");
        this.openApply = false;
        this.getList();
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.workId != null) {
            updateRepairOrder(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.openUpdate = false;
              this.getList();
            });
          } else {
            addRepairOrder(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.openAdd = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 提交填写维修记录按钮 */
    submitWriteForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.workId != null) {
            if (this.form.workStatus == null || this.form.workStatus == "") {
              Message.warning("维修状态不能为空");
            } else if (
              this.form.workPerson == null ||
              this.form.workPerson == ""
            ) {
              Message.warning("维修人员不能为空");
            } else if (
              this.form.workStartTime == null ||
              this.form.workStartTime == ""
            ) {
              Message.warning("维修开始时间不能为空");
            } else if (
              this.form.workEndTime == null ||
              this.form.workEndTime == ""
            ) {
              Message.warning("维修结束时间不能为空");
            } else {
              if (Array.isArray(this.form.afterRepairFile)) {
                this.form.afterRepairFile = this.listToString(
                  this.form.afterRepairFile
                );
              }

              if (this.form.faultType != null) {
                this.form.faultType = this.form.faultType.join(",");
              }

              this.form.standardList = this.detailList;
              //每个检查项
              this.form.standardList.forEach((item) => {
                if (Array.isArray(item.picturePath)) {
                  item.picturePath = this.listToString(item.picturePath);
                }
              });

              writeRepairOrder(this.form).then((response) => {
                this.openWrite = false;
                if(response.code == 200){
                  this.$modal.msgSuccess(response.msg);
                }
                this.queryParams.workStatus = null;
                this.getList();
              });
            }
          }
        }
      });
    },
    // 点击结果检验按钮
    clickInspect() {
      if (this.ids.length == 0 || this.ids == null) {
        this.$message({
          message: "请勾选工单！",
          type: "warning",
        });
        return;
      }
      // 如果审核通过 那么就只是展示？
      //需要加一个结果检验
      this.inspectDialog = true;
      this.inspect = "1";
    },

    // 提交检验信息
    checkRepairWorkOrder() {
      const data = {
        ids: this.ids,
        inspect: this.inspect,
        orderCodes: this.orderCodes,
        auditOpinion: this.auditOpinion,
      };

      checkRepairWorkOrder(data).then((response) => {
        this.getList();
        this.inspectDialog = false;
        this.$message({
          message: "提交成功！",
          type: "success",
        });
      });
    },
    //设备选择
    handleSelectEquipment() {
      this.$refs.itemSelect.showFlag = true;
    },
    //人员选择
    handleSelectPerson() {
      this.$refs.itemSelectPerson.showFlag = true;
    },
    //人员选择
    onItemSelectedPerson(obj) {
      console.log(obj);
      this.form.workPerson = obj[0].userName;
      this.form.workPersonName = obj[0].nickName;
    },
    //设备选择
    onItemSelectedEquipment(obj) {
      this.form.equipmentCode = obj;
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const workIds = row.workId || this.ids;
      this.$modal
        .confirm('是否确认删除维修工单编号为"' + workIds + '"的数据项？')
        .then(function () {
          return delRepairOrder(workIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "device/repairOrder/export",
        {
          ...this.queryParams,
        },
        ` repairOrder_${new Date().getTime()}.xlsx`
      );
    },

    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        // 获取当前单元格的值
        const currentValue = row[column.property];
        // 获取上一行相同列的值
        const preRow = this.detailList[rowIndex - 1];
        const preValue = preRow ? preRow[column.property] : null;
        // 如果当前值和上一行的值相同，则将当前单元格隐藏
        if (currentValue === preValue) {
          return { rowspan: 0, colspan: 0 };
        } else {
          // 否则计算当前单元格应该跨越多少行
          let rowspan = 1;
          for (let i = rowIndex + 1; i < this.detailList.length; i++) {
            const nextRow = this.detailList[i];
            const nextValue = nextRow[column.property];
            if (nextValue === currentValue) {
              rowspan++;
            } else {
              break;
            }
          }
          return { rowspan, colspan: 1 };
        }
      }

      if (columnIndex === 1) {
        // 获取当前单元格的值
        const currentValue = row[column.property];
        // 获取上一行相同列的值
        const preRow = this.detailList[rowIndex - 1];
        const preValue = preRow ? preRow[column.property] : null;
        // 如果当前值和上一行的值相同，则将当前单元格隐藏
        if (currentValue === preValue) {
          return { rowspan: 0, colspan: 0 };
        } else {
          // 否则计算当前单元格应该跨越多少行
          let rowspan = 1;
          for (let i = rowIndex + 1; i < this.detailList.length; i++) {
            const nextRow = this.detailList[i];
            const nextValue = nextRow[column.property];
            if (nextValue === currentValue) {
              rowspan++;
            } else {
              break;
            }
          }
          return { rowspan, colspan: 1 };
        }
      }
    },

    // 对象转成指定字符串分隔
    listToString(list, separator) {
      let strs = "";
      separator = separator || ",";
      for (let i in list) {
        strs += list[i].url + separator;
      }
      return strs != "" ? strs.substr(0, strs.length - 1) : "";
    },
  },
};
</script>

  <style>
.step-margin {
  margin-left: 10px;
}

.classification {
  margin-left: 452px;
}

.standardUrl_body {
  height: 400px;
  overflow-y: auto;
}

.view_picture_body {
  height: 300px;
  overflow-y: auto;
}
</style>


