<template>
  <div class="content-main" id="protectedItems">
    <div style="display: table; margin-right: 10px; margin-left: auto">
      <el-button type="primary" @click="checkProblem(1)"
        >问题处理过程({{ formData.solveCount }})</el-button
      >
      <el-button type="primary" @click="checkProblem(2)"
        >追加问题描述({{ formData.problemCount }})</el-button
      >
    </div>
    <div class="ywborderS">
      <div style="text-align: center; font-size: 22px; font-weight: bold">
        系统运维申请表
      </div>
      <div style="margin-left: auto; display: table">
        编号:{{ formData.gdbh }}
      </div>
    </div>
    <el-form ref="formData" :rules="rules" :model="formData" inline>
      <el-row>
        <table class="table-b table-el-form">
          <tr>
            <td class="songFont"><span style="color: red">*</span>申请单位</td>
            <td class="songFont">
              <el-form-item prop="sqdwmc">
                <span class="songFont">{{ formData.sqdwmc }}</span>
              </el-form-item>
            </td>
            <td><span style="color: red">*</span>申请日期</td>
            <td>
              <el-form-item prop="sqrq">
                <el-date-picker
                  :disabled="true"
                  clearable
                  v-model="formData.sqrq"
                  type="date"
                  value-format="yyyy-MM-dd"
                ></el-date-picker>
              </el-form-item>
            </td>
          </tr>
          <tr>
            <!-- <td class="songFont">系统名称</td>
           <td>
             <el-form-item prop="webSysName">
               <el-select
                :disabled="disabled"
                 clearable
                 v-model="formData.webSysName"
                 placeholder="请选择系统名称"
               >
                 <el-option
                   v-for="item in systemNameOptions"
                   :key="item.name"
                   :label="item.name"
                   :value="item.name"
                 ></el-option>
               </el-select>
             </el-form-item>
           </td> -->
            <td><span style="color: red">*</span>申请人</td>
            <td>
              <el-form-item prop="sqr">
                <el-input
                  :disabled="disabled"
                  clearable
                  v-model="formData.sqr"
                ></el-input>
              </el-form-item>
            </td>
            <td><span style="color: red">*</span>申请人联系方式</td>
            <td>
              <el-form-item>
                <el-input
                  :disabled="disabled"
                  clearable
                  v-model="formData.sqrlxfs"
                ></el-input>
              </el-form-item>
            </td>
          </tr>
          <tr>
            <td><span style="color: red">*</span>问题情况描述</td>
            <td colspan="3">
              <el-form-item prop="problemDesc">
                <el-input
                  :disabled="disabled"
                  type="textarea"
                  clearable
                  v-model="formData.problemDesc"
                  :autosize="{ minRows: 2, maxRows: 20 }"
                  maxlength="300"
                  show-word-limit
                ></el-input>
              </el-form-item>
            </td>
          </tr>
          <tr v-if="cameraList && cameraList.length > 0">
            <td><span style="color: red">*</span>申请离线(故障)摄像头</td>
            <td colspan="4">
              <el-form-item>
                <div
                  style="
                    border: 1px solid;
                    min-height: 55px;
                    padding: 0 15px;
                    overflow: hidden;
                    cursor: pointer;
                  "
                >
                  <span
                    v-for="item in cameraList"
                    style="
                      display: inline-block;
                      margin-right: 10px;
                      margin-bottom: 10px;
                    "
                  >
                    <el-tag>{{ item.stdname }}</el-tag>
                  </span>
                </div>
              </el-form-item>
            </td>
          </tr>
          <tr>
            <td>附件</td>
            <td colspan="3" style="text-align: left">
              <el-form-item prop="" label-width="0px">
                <!-- <el-upload
                 v-if='!disabled'
                 :on-success="handleSuccess"
                 class="upload-demo"
                 :action="fileUrl"
                 :on-preview="handlePreview"
                 :on-remove="handleRemove"
                 :before-remove="beforeRemove"
                 :file-list="fileList"
               >
                 <el-button
                   type="primary"
                   size="small"
                   class="iconfont icon"
                   >上传</el-button
                 >
               </el-upload> -->
                <div v-for="item in fileList" :key="item.id">
                  <span>{{ item.name }}</span>
                  <el-button
                    v-if="
                      ['png', 'jpg', 'jpeg', 'bmp', 'pdf'].includes(
                        item.link.split('.')[item.link.split('.').length - 1]
                      )
                    "
                    type="text"
                    size="small"
                    @click="YlPic(item.link)"
                    >预览</el-button
                  >
                  <el-button type="text" size="small" @click="XzPic(item.id)"
                    >下载</el-button
                  >
                </div>
              </el-form-item>
            </td>
          </tr>
          <!-- <tr>
           <td>申请人</td>
           <td>
             <el-form-item prop="sqr">
               <el-input
                 :disabled='disabled'
                 clearable
                 v-model="formData.sqr"
               ></el-input>
             </el-form-item>
           </td>
           <td>申请日期</td>
           <td>
             <el-form-item prop="sqrq">
               <el-date-picker
                :disabled="true"
                 clearable
                 v-model="formData.sqrq"
                 type="date"
                 value-format="yy-MM-dd"
               ></el-date-picker>
             </el-form-item>
           </td>
         </tr> -->
          <div style="display: contents">
            <!-- 审核开始 -->
            <!-- 盖章信息 -->
            <tr>
              <td><span style="color: red">*</span>主管领导意见</td>
              <el-form-item prop="zgldyj">
                <el-radio-group
                  v-model="formData.zgldyj"
                  :disabled="SHdisabled"
                >
                  <el-radio :label="'1'">同意</el-radio>
                  <el-radio :label="'2'">不同意</el-radio>
                </el-radio-group>
              </el-form-item>
            </tr>
            <tr></tr>
            <tr>
              <td><span style="color: red">*</span>审核人</td>
              <td>
                <el-form-item prop="verifyPerson">
                  <el-input
                    :disabled="SHdisabled"
                    clearable
                    v-model="formData.verifyPerson"
                  ></el-input>
                </el-form-item>
              </td>
              <td rowspan="2" colspan="2">
                <div style="text-align: left; align-items: center">盖章</div>
                <div style="margin: 0 100px" id="OperationOrder"></div>
              </td>
            </tr>
            <tr>
              <td><span style="color: red">*</span>审核日期</td>
              <td>
                <el-form-item prop="verifyDate">
                  <el-date-picker
                    clearable
                    :disabled="true"
                    v-model="formData.verifyDate"
                    type="date"
                    value-format="yyyy-MM-dd"
                  ></el-date-picker>
                </el-form-item>
              </td>
            </tr>
            <!-- </tr> -->
            <!-- 审核结束 -->
          </div>

          <div
            v-if="
              ($route.query.type != 'CK' && $route.query.shzt == '91000030') ||
              $route.query.shzt == '91000040' ||
              $route.query.shzt == '91000042' ||
              $route.query.shzt == '91000070' ||
              $route.query.shzt == '91000050' ||
              $route.query.shzt == '91000052' ||
              $route.query.shzt == '91000060'
            "
            style="display: contents"
          >
            <tr>
              <td colspan="4" style="font-weight: 600">受理情况</td>
            </tr>
            <tr>
              <td><span style="color: red">*</span>受理人员</td>
              <td>
                <el-form-item prop="acceptPerson">
                  <el-input
                    :disabled="SLdisabled"
                    clearable
                    v-model="formData.acceptPerson"
                  ></el-input>
                </el-form-item>
              </td>
              <td><span style="color: red">*</span>受理日期</td>
              <td>
                <el-form-item prop="acceptDate">
                  <el-date-picker
                    :disabled="SLdisabled"
                    clearable
                    v-model="formData.acceptDate"
                    type="date"
                    value-format="yyyy-MM-dd"
                  ></el-date-picker>
                </el-form-item>
              </td>
            </tr>
          </div>
          <!-- 受理情况 -->

          <div
            v-if="
              ($route.query.type != 'CK' &&
                $route.query.type != 'tj' &&
                $route.query.shzt == '91000040') ||
              $route.query.shzt == '91000042' ||
              $route.query.shzt == '91000070' ||
              $route.query.shzt == '91000050' ||
              $route.query.shzt == '91000052' ||
              $route.query.shzt == '91000060'
            "
            style="display: contents"
          >
            <!-- 运维人员确认 -->
            <tr>
              <td colspan="4" style="font-weight: 600">解决情况</td>
            </tr>
            <tr>
              <td><span style="color: red">*</span>系统名称</td>
              <td colspan="3">
                <el-form-item prop="webSysName">
                  <!-- <span>{{formData.problemType}}</span> -->
                  <el-select
                    multiple
                    :disabled="BLdisabled"
                    clearable
                    v-model="formData.webSysName"
                    placeholder="请选择系统名称"
                  >
                    <el-option
                      v-for="item in systemNameOptions"
                      :key="item.name"
                      :label="item.name"
                      :value="item.name"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td><span style="color: red">*</span>问题类型</td>
              <td colspan="3">
                <el-form-item prop="problemType">
                  <!-- <span>{{formData.problemType}}</span> -->
                  <el-select
                    multiple
                    :disabled="BLdisabled"
                    clearable
                    v-model="formData.problemType"
                    placeholder="请选择问题类型"
                  >
                    <el-option
                      v-for="item in problemTypeOptions"
                      :key="item.code"
                      :label="item.name"
                      :value="item.name"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td><span style="color: red">*</span>处理方式</td>
              <td colspan="3">
                <el-form-item prop="solveType">
                  <!-- <span>{{formData.solveType}}</span> -->
                  <el-select
                    multiple
                    :disabled="BLdisabled"
                    clearable
                    v-model="formData.solveType"
                    placeholder="请选择处理方式"
                  >
                    <el-option
                      v-for="item in solveTypeOptions"
                      :key="item.code"
                      :label="item.name"
                      :value="item.name"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td><span style="color: red">*</span>处理结果</td>
              <td colspan="3">
                <el-form-item prop="solveRes">
                  <!-- <span>{{formData.solveRes}}</span> -->
                  <el-input
                    :disabled="BLdisabled"
                    type="textarea"
                    :autosize="{ minRows: 2, maxRows: 20 }"
                    maxlength="300"
                    show-word-limit
                    clearable
                    v-model="formData.solveRes"
                  ></el-input>
                  <!-- <el-select
				   :disabled="BLdisabled"
                   clearable
                   v-model="formData.solveRes"
                   placeholder="请选择处理结果"
                 >
                   <el-option
                     v-for="item in solveResOptions"
                     :key="item.dictCode"
                     :label="item.dictName"
                     :value="item.dictCode"
                     multiple
                   ></el-option>
                 </el-select> -->
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td><span style="color: red">*</span>是否需要信息中心确认</td>
              <td colspan="3">
                <el-row style="text-align: left">
                  <el-form-item prop="isIcOpsScope">
                    <el-radio-group
                      v-model="formData.isIcOpsScope"
                      :disabled="BLdisabled"
                    >
                      <el-radio :label="1">需要</el-radio>
                      <el-radio :label="0">不需要</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-row>
                <el-row style="text-align: left">
                  <span
                    >如果该运维问题再信息中心运维范围内，则选择"需要"。反之,则选择"不需要"。</span
                  >
                </el-row>
              </td>
            </tr>

            <tr>
              <td>附件</td>
              <td colspan="3" style="text-align: left">
                <!-- <span>{{formData.solveFile}}</span> -->
                <el-form-item prop="" label-width="0px">
                  <el-upload
                    v-if="!BLdisabled"
                    :on-success="handleSuccess"
                    class="upload-demo"
                    :action="fileUrl"
                    :on-preview="handlePreview"
                    :on-remove="handleRemove"
                    :before-remove="beforeRemove"
                    :file-list="fileListBL"
                  >
                    <el-button type="primary" size="small" class="iconfont"
                      >上传</el-button
                    >
                  </el-upload>
                  <div
                    v-for="item in fileListBL"
                    :key="item.id"
                    v-show="BLdisabled"
                  >
                    <span>{{ item.name }}</span>
                    <el-button
                      v-if="
                        ['png', 'jpg', 'jpeg', 'bmp', 'pdf'].includes(
                          item.link.split('.')[item.link.split('.').length - 1]
                        ) && BLdisabled
                      "
                      type="text"
                      size="small"
                      @click="YlPic(item.link)"
                      >预览</el-button
                    >
                    <el-button
                      v-show="BLdisabled"
                      type="text"
                      size="small"
                      @click="XzPic(item.id)"
                      >下载</el-button
                    >
                  </div>
                </el-form-item>
                <!-- <el-form-item prop="" label-width="0px">
                 <el-upload
				   :disabled="BLdisabled"
                   :on-success="handleSuccess"
                   class="upload-demo"
                   :action="fileUrl"
                   :on-preview="handlePreview"
                   :on-remove="handleRemove"
                   :before-remove="beforeRemove"
                   :file-list="fileListBL"
                 >
                   <el-button
                     type="primary"
                     size="small"
                     class="iconfont icon"
                     >上传</el-button
                   >
                 </el-upload>
               </el-form-item> -->
              </td>
            </tr>
            <tr>
              <td>备注</td>
              <td colspan="3">
                <el-form-item prop="solveRemark">
                  <el-input
                    :disabled="BLdisabled"
                    type="textarea"
                    :rows="2"
                    clearable
                    v-model="formData.solveRemark"
                  ></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td><span style="color: red">*</span>运维人员</td>
              <td>
                <el-form-item prop="solvePerson">
                  <!-- <span>{{formData.solvePerson}}</span> -->
                  <el-select
                    :disabled="BLdisabled"
                    multiple
                    clearable
                    v-model="formData.solvePerson"
                    placeholder="请选择运维人员"
                  >
                    <el-option
                      v-for="item in solvePersonOptions"
                      :key="item.dictCode"
                      :label="item.dictName"
                      :value="item.dictName"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </td>
              <td><span style="color: red">*</span>解决日期</td>
              <td>
                <el-form-item prop="solveDate">
                  <!-- <span>{{formData.solveDate}}</span> -->
                  <el-date-picker
                    :disabled="BLdisabled"
                    clearable
                    v-model="formData.solveDate"
                    type="date"
                    value-format="yyyy-MM-dd"
                  ></el-date-picker>
                </el-form-item>
              </td>
            </tr>
          </div>

          <!-- 申请人员确认 -->
          <div
            v-if="
              ($route.query.type != 'CK' && $route.query.shzt == '91000050') ||
              $route.query.shzt == '91000052' ||
              $route.query.shzt == '91000060' ||
              $route.query.shzt == '91000070'
            "
            style="display: contents"
          >
            <tr>
              <td colspan="4">
                <span style="font-weight: bold">确认完成情况</span>
              </td>
              <!-- <td colspan="3">
               <el-form-item prop="htsl">
                 <el-input
                   type="textarea"
                   :rows="2"
                   clearable
                   v-model="formData.htsl"
                 ></el-input>
               </el-form-item>
             </td> -->
            </tr>
            <tr>
              <td><span style="color: red">*</span>申请人确认</td>
              <!-- <td colspan="3"> -->
              <el-form-item prop="applicantVerifyRes">
                <el-radio-group
                  v-model="formData.applicantVerifyRes"
                  :disabled="SQRdisabled"
                >
                  <el-radio :label="'1'">已完成</el-radio>
                  <el-radio :label="'2'">未完成</el-radio>
                </el-radio-group>
              </el-form-item>
              <!-- </td> -->
            </tr>
            <tr>
              <td><span style="color: red">*</span>申请人</td>
              <td>
                <el-form-item prop="applicantVerify">
                  <el-input
                    :disabled="SQRdisabled"
                    clearable
                    v-model="formData.applicantVerify"
                  ></el-input>
                </el-form-item>
              </td>
              <td><span style="color: red">*</span>确认日期</td>
              <td>
                <el-form-item prop="applicantVerifyDate">
                  <el-date-picker
                    :disabled="true"
                    clearable
                    v-model="formData.applicantVerifyDate"
                    type="date"
                    value-format="yyyy-MM-dd"
                  ></el-date-picker>
                </el-form-item>
              </td>
            </tr>
          </div>

          <div
            v-if="
              ($route.query.type != 'CK' && $route.query.shzt == '91000060') ||
              ($route.query.shzt == '91000070' && formData.icVerifyRes)
            "
            style="display: contents"
          >
            <!-- 信息中心确认 -->
            <tr>
              <td><span style="color: red">*</span>信息中心确认</td>
              <!-- <td colspan="3"> -->
              <el-form-item prop="icVerifyRes">
                <el-radio-group
                  v-model="formData.icVerifyRes"
                  :disabled="XXZXdisabled"
                >
                  <el-radio :label="'1'">已完成</el-radio>
                  <el-radio :label="'2'">未完成</el-radio>
                </el-radio-group>
              </el-form-item>
              <!-- </td> -->
            </tr>
            <tr>
              <td><span style="color: red">*</span>信息中心人员</td>
              <td>
                <el-form-item prop="icVerify">
                  <el-input
                    :disabled="XXZXdisabled"
                    clearable
                    v-model="formData.icVerify"
                    placeholder="请输入信息中心人员"
                  ></el-input>
                </el-form-item>
              </td>
              <td><span style="color: red">*</span>确认日期</td>
              <td>
                <el-form-item prop="icVerifyDate">
                  <el-date-picker
                    :disabled="true"
                    clearable
                    v-model="formData.icVerifyDate"
                    type="date"
                    value-format="yyyy-MM-dd"
                  ></el-date-picker>
                </el-form-item>
              </td>
            </tr>
          </div>
        </table>
      </el-row>
    </el-form>
    <span class="detail-footer">
      <el-button
        type="primary"
        class="iconfont iconchakan"
        v-show="formData.opsOffLineFid"
        @click="toOffline"
        >查看关联离线备案表</el-button
      >
      <!-- ($route.query.shzt=='91000040' || $route.query.shzt=='91000042') &&-->
      <el-button
        v-if="$route.query.type == 'tj'"
        @click="AddProblem"
        type="primary"
        class="iconfont iconadd"
        >追加过程</el-button
      >
      <el-button
        v-if="
          $route.query.type != 'CK' &&
          $route.query.type != 'tj' &&
          ($route.query.shzt == '91000030' ||
            $route.query.shzt == '91000040' ||
            $route.query.shzt == '91000040' ||
            $route.query.shzt == '91000042' ||
            $route.query.shzt == '91000040' ||
            $route.query.shzt == '91000060')
        "
        @click="saveSubmit()"
        type="primary"
        class="iconfont icontijiao"
        >提交</el-button
      >
      <el-button @click="returnList" type="primary" class="iconfont iconfanhui"
        >返回</el-button
      >
    </span>
    <!-- 添加处理过程弹窗 -->
    <el-dialog
      title="添加处理过程"
      :visible.sync="dialogVisible"
      width="40%"
      ref="domPrint"
      :close-on-click-modal="false"
      :show-close="false"
    >
      <el-form
        ref="addFrom"
        :rules="addrule"
        :model="addFrom"
        label-width="70px"
        label-position="left"
      >
        <el-row>
          <el-col :span="24">
            <el-form-item prop="solveDesc" label-width="20px" label=" ">
              <el-input
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 20 }"
                maxlength="300"
                show-word-limit
                clearable
                v-model="addFrom.solveDesc"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="附件">
            <el-upload
              :on-success="handleSuccessCL"
              class="upload-demo"
              :action="fileUrl"
              :on-preview="handlePreviewCL"
              :on-remove="handleRemoveCL"
              :before-remove="beforeRemoveCL"
              :file-list="fileList1"
            >
              <el-button type="primary" size="small" class="iconfont"
                >上传</el-button
              >
            </el-upload>
          </el-form-item>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="solveAuthor" label="填写人">
              <el-input clearable v-model="addFrom.solveAuthor"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item class="el-data-width" prop="writeDate" label="日期">
              <el-date-picker
                clearable
                v-model="addFrom.writeDate"
                type="date"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
              <!-- <el-input
                 clearable
                 v-model="addFrom.writeDate"
               ></el-input> -->
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer no-print">
        <el-button
          type="primary"
          size="small"
          class="iconfont icontijiao"
          @click="AddProblomSubmit"
          >提交</el-button
        >
        <el-button
          type="primary"
          size="small"
          class="iconfont iconquxiao"
          @click="dialogVisible = false"
          >取消</el-button
        >
      </div>
    </el-dialog>
    <!--追加问题描述---查看 和问题处理过程--查看 -->
    <el-dialog
      :title="ProbelmName"
      :visible.sync="dialogCKVisible"
      width="40%"
      height="30%"
      :close-on-click-modal="false"
      :show-close="false"
    >
      <div style="height: 50vh; overflow: auto">
        <div
          v-if="ProbelmName == '追加问题描述'"
          class="box-pro"
          v-for="item in problemList"
        >
          <div style="display: flex">
            <div style="margin-right: 20px">{{ item.writeDate }}</div>
            <div>{{ item.problemAuthor }}</div>
          </div>
          <div>{{ item.problemDesc }}</div>
          <div>
            <div v-for="items in item.problemFileList" :key="items.id">
              <span>{{ items.name }}</span>
              <el-button
                v-if="
                  ['png', 'jpg', 'jpeg', 'bmp', 'pdf'].includes(
                    items.link.split('.')[items.link.split('.').length - 1]
                  )
                "
                type="text"
                size="small"
                @click="YlPic(items.link)"
                >预览</el-button
              >
              <el-button type="text" size="small" @click="XzPic(items.id)"
                >下载</el-button
              >
              <!-- <el-button  type="text" size="small" @click="XzPic(items.id)">
				{{items.name}}</el-button> -->
            </div>
          </div>
          <!-- <a :href="item.problemFile">{{item.problemFile}}</a> -->
        </div>
        <div
          v-if="ProbelmName == '问题处理过程'"
          class="box-pro"
          v-for="item in SolveList"
        >
          <div style="display: flex">
            <div style="margin-right: 20px">{{ item.writeDate }}</div>
            <div>{{ item.solveAuthor }}</div>
          </div>
          <div>{{ item.solveDesc }}</div>
          <div>
            <div v-for="items in item.solveFileList" :key="items.id">
              <span>{{ items.name }}</span>
              <el-button
                v-if="
                  ['png', 'jpg', 'jpeg', 'bmp', 'pdf'].includes(
                    items.link.split('.')[items.link.split('.').length - 1]
                  )
                "
                type="text"
                size="small"
                @click="YlPic(items.link)"
                >预览</el-button
              >
              <el-button type="text" size="small" @click="XzPic(items.id)"
                >下载</el-button
              >
              <!-- <el-button  type="text" size="small" @click="XzPic(items.id)">
				{{items.name}}</el-button> -->
            </div>
          </div>
        </div>
      </div>
      <div
        slot="footer"
        style="text-align: center"
        class="dialog-footer no-print"
      >
        <el-button
          type="primary"
          size="small"
          class="iconfont iconquxiao"
          @click="dialogCKVisible = false"
          >关闭</el-button
        >
      </div>
    </el-dialog>
    <!-- //签章弹窗组件 -->
    <sealDialog
      ref="sealDialog"
      sealId="OperationOrder"
      @sealTodo="sealTodo"
      @sealError="sealError"
    ></sealDialog>
  </div>
</template>

<script>
import {
  insertEntitySelective,
  selectById,
  updateByEntitySelective,
  findByIds,
  findYWRYPDictCode,
  addSolve,
  GetlistProblem,
  GetlistSolve,
} from "../../../api/operationServices/operationManagement/index.js";
// import {findByIds} from "@/api/grainReserves/outInManagement/outInAccApply/index";
// import upload from "@/components/upload";
import { files } from "@/api/index";
import sealDialog from "@/components/sealDialog/index.vue";
export default {
  components: {
    sealDialog,
  },
  data() {
    return {
      cameraList: [],
      // msDisabel:false,
      XXZXdisabled: false,
      BLdisabled: false,
      SLdisabled: false,
      stateLoading: false,
      disabled: true, //申请人填写信息是否禁用
      SHdisabled: true, //审核盖章
      SQRdisabled: true, //申请人确认
      ProbelmName: "", //动态title
      fileUrl: `${files}/file/upload`,
      fileList: [],
      fileList1: [],
      //办理附件
      fileListBL: [],
      dialogVisible: false, //问题添加
      dialogCKVisible: false, //问题查看
      systemNameOptions: [
        {
          code: "1",
          name: "天津智能出入库系统",
        },
        {
          code: "2",
          name: "天津市企业服务平台",
        },
        {
          code: "3",
          name: "天津智能粮库业务平台",
        },
        {
          code: "4",
          name: "市级综合粮食管理和服务平台",
        },
      ], //系统名称list
      djOptions: [],
      //运维人员list
      solvePersonOptions: [],
      //处理方式
      solveTypeOptions: [
        {
          code: "1",
          name: "现场处理",
        },
        {
          code: "2",
          name: "远程处理",
        },
        {
          code: "3",
          name: "第三方介入处理",
        },
        {
          code: "4",
          name: "研发人员处理",
        },
        {
          code: "5",
          name: "其他",
        },
      ],
      //问题类型
      problemTypeOptions: [
        {
          code: "1",
          name: "测温问题",
        },
        {
          code: "2",
          name: "硬件问题",
        },
        {
          code: "3",
          name: "网路问题",
        },
        {
          code: "4",
          name: "供电问题",
        },
        {
          code: "5",
          name: "数据问题",
        },
        {
          code: "6",
          name: "配置问题",
        },
        {
          code: "7",
          name: "操作问题",
        },
        {
          code: "8",
          name: "系统服务问题",
        },
        {
          code: "9",
          name: "其他",
        },
      ],
      addFrom: {
        gdbh: "",
        mainId: "",
        solveDesc: "",
        solveFile: "",
        writeDate: this.dateFormat(new Date()),
        solveAuthor: sessionStorage.getItem("userName"),
      },
      tableData: [],
      formData: {
        fid: "",
        gdbh: "",
        sqdwmc: sessionStorage.getItem("orgName"),
        sqdwdm: sessionStorage.getItem("orgCode"),
        webSysName: "",
        sqrlxfs: "",
        problemDesc: "", //问题情况描述
        problemFile: "", //问题附件
        // sqrq:'',
        sqrq: this.dateFormat(new Date()),
        sqr: sessionStorage.getItem("userName"),
        zgldyj: "",
        verifyPerson: sessionStorage.getItem("userName"),
        // verifyDate:'',
        verifyDate: this.dateFormat(new Date()),
        acceptPerson: sessionStorage.getItem("userName"),
        acceptDate: this.dateFormat(new Date()),
        problemType: "", //问题类型
        solveType: "", //解决方式
        solveRes: "", //处理结果
        solveFile: "", //解决附件,
        solveRemark: "", //解决备注
        solvePerson: "",
        solveDate: this.dateFormat(new Date()),
        applicantVerifyRes: "",
        applicantVerify: "",
        applicantVerifyDate: "",
        icVerifyRes: "",
        icVerify: sessionStorage.getItem("userName"),
        icVerifyDate: this.dateFormat(new Date()),
        shzt: "91000010", //默认审核状态
      },
      SolveList: [],
      problemList: [],
      addrule: {
        solveDesc: [
          {
            required: true,
            message: "请输入处理过程描述",
            trigger: ["blur", "change"],
          },
        ],
        writeDate: [
          {
            required: true,
            message: "请输选择日期",
            trigger: ["blur", "change"],
          },
        ],
        solveAuthor: [
          {
            required: true,
            message: "请输入填写人",
            trigger: ["blur", "change"],
          },
        ],
      },
      rules: {
        sqdw: [
          {
            required: true,
            message: "请输入申请单位",
            trigger: ["blur", "change"],
          },
        ],
        problemDesc: [
          {
            required: true,
            message: "请输入问题描述",
            trigger: ["blur", "change"],
          },
        ],
        sqrq: [
          {
            required: true,
            message: "请输入申请日期",
            trigger: ["blur", "change"],
          },
        ],
        sqr: [
          {
            required: true,
            message: "请输入申请人",
            trigger: ["blur", "change"],
          },
        ],
        zgldyj: [
          {
            required: true,
            message: "请选择主管领导意见",
            trigger: ["blur", "change"],
          },
        ],
        verifyPerson: [
          {
            required: true,
            message: "请输入审核人",
            trigger: ["blur", "change"],
          },
        ],
        verifyDate: [
          {
            required: true,
            message: "请输入审核日期",
            trigger: ["blur", "change"],
          },
        ],
        acceptPerson: [
          {
            required: true,
            message: "请输入受理人",
            trigger: ["blur", "change"],
          },
        ],
        acceptDate: [
          {
            required: true,
            message: "请输入确认日期",
            trigger: ["blur", "change"],
          },
        ],
        webSysName: [
          {
            required: true,
            message: "请选择系统名称",
            trigger: ["blur", "change"],
          },
        ],
        problemType: [
          {
            required: true,
            message: "请选择问题类型",
            trigger: ["change"],
          },
        ],
        solveType: [
          {
            required: true,
            message: "请选择处理方式",
            trigger: ["blur", "change"],
          },
        ],
        solveRes: [
          {
            required: true,
            message: "请输入处理结果",
            trigger: ["blur", "change"],
          },
        ],
        isIcOpsScope: [
          {
            required: true,
            message: "请选择是否需要",
            trigger: ["blur", "change"],
          },
        ],
        solveRemark: [
          {
            required: true,
            message: "请输入备注",
            trigger: ["blur", "change"],
          },
        ],
        solvePerson: [
          {
            required: true,
            message: "请选择运维人员",
            trigger: ["blur", "change"],
          },
        ],
        solveDate: [
          {
            required: true,
            message: "请选择解决日期",
            trigger: ["blur", "change"],
          },
        ],
        icVerifyDate: [
          {
            required: true,
            message: "请选择确认日期",
            trigger: ["blur", "change"],
          },
        ],
        icVerify: [
          {
            required: true,
            message: "请输入信息中心人员",
            trigger: ["blur", "change"],
          },
        ],
        icVerifyRes: [
          {
            required: true,
            message: "请选择信息确认状态",
            trigger: ["blur", "change"],
          },
        ],
      },
    };
  },
  created() {
    if (this.$route.query.type == "CK") {
      this.SLdisabled = true;
      this.BLdisabled = true;
      this.XXZXdisabled = true;
    } else if (this.$route.query.shzt == "91000030") {
      this.SLdisabled = false;
      this.BLdisabled = true;
      this.XXZXdisabled - true;
    } else if (
      this.$route.query.shzt == "91000040" ||
      this.$route.query.shzt == "91000042"
    ) {
      if (this.$route.query.type == "tj") {
        this.BLdisabled = true;
        this.SLdisabled = true;
        this.XXZXdisabled = true;
      } else {
        this.BLdisabled = false;
        this.SLdisabled = true;
        this.XXZXdisabled = true;
      }
    } else if (this.$route.query.shzt == "91000060") {
      this.BLdisabled = true;
      this.SLdisabled = true;
      this.XXZXdisabled = false;
    } else {
      this.SLdisabled = true;
      this.BLdisabled = true;
      this.XXZXdisabled = true;
    }
    findYWRYPDictCode("YWRY").then((res) => {
      if (res.infoCode == 200) {
        this.solvePersonOptions = res.data;
      } else {
        this.$message.error(res.msg);
      }
    });
    this.selectByInfo();
  },
  methods: {
    //获取字典表

    //详情信息
    selectByInfo() {
      if (this.$route.query.fid) {
        let data = {
          fid: this.$route.query.fid,
        };
        selectById(data).then((res) => {
          if (res.infoCode == 200) {
            // this.formData.zgldyj=1
            // this.$refs.formData.clearValidate();
            this.formData = res.data;
            this.cameraList = res.data.cameraList;
            if (res.data.acceptPerson) {
              this.formData.acceptPerson = res.data.acceptPerson;
            } else {
              this.formData.acceptPerson = sessionStorage.getItem("userName");
            }
            if (res.data.acceptDate) {
              this.formData.acceptDate = res.data.acceptDate;
            } else {
              this.formData.acceptDate = this.dateFormat(new Date());
            }
            if (res.data.solveDate) {
              this.formData.solveDate = res.data.solveDate;
            } else {
              this.formData.solveDate = this.dateFormat(new Date());
            }
            if (res.data.icVerifyDate) {
              this.formData.icVerifyDate = res.data.icVerifyDate;
            } else {
              this.formData.icVerifyDate = this.dateFormat(new Date());
            }
            if (res.data.icVerify) {
              this.formData.icVerify = res.data.icVerify;
            } else {
              this.formData.icVerify = sessionStorage.getItem("userName");
            }

            if (this.formData.problemFile) {
              findByIds(this.formData.problemFile).then((res) => {
                this.fileList = res.data;
              });
            }
            if (this.formData.solveFile) {
              findByIds(this.formData.solveFile).then((res) => {
                this.fileListBL = res.data;
              });
            }
            // this.formData.problemType=res.data.problemType ? res.data.problemType.split(',') : res.data.problemType.split(',')
            // this.formData.solveType = res.data.solveType ? res.data.solveType.split(',') : res.data.solveType.split(',')
            // this.formData.webSysName =res.data.webSysName ? res.data.webSysName.split(',') :res.data.webSysName.split(',')
            // this.formData.solvePerson = res.data.solvePerson ? res.data.solvePerson.split(',') :res.data.solvePerson.split(',')
            this.formData.problemType = res.data.problemType
              ? res.data.problemType.split(",")
              : "";
            this.formData.solveType = res.data.solveType
              ? res.data.solveType.split(",")
              : "";
            this.formData.webSysName = res.data.webSysName
              ? res.data.webSysName.split(",")
              : "";
            this.formData.solvePerson = res.data.solvePerson
              ? res.data.solvePerson.split(",")
              : "";

            if (this.formData.qhrqz) {
              if (this.formData.qhrqz.indexOf("newSeal") == -1) {
                this.$nextTick(() => {
                  this.$ShowSeal("OperationOrder", 1);
                  this.$SetSealData(this.formData.qhrqz, 0, "lingdao", 1);
                });
              } else {
                this.$nextTick(() => {
                  this.$signatureOnload(
                    "OperationOrder",
                    this.formData.qhrqz.substring(7)
                  );
                });
              }
            }
            this.$nextTick(() => {
              this.$refs.formData.clearValidate();
            });
          }
        });
      }
    },
    //查看追加问题
    checkProblem(state) {
      this.dialogCKVisible = true;
      this.problemList = [];
      this.$nextTick(() => {
        let data = {
          fid: this.formData.fid,
        };
        if (state == 2) {
          this.ProbelmName = "追加问题描述";
          GetlistProblem(data).then((res) => {
            if (res.infoCode == 200) {
              res.data.forEach((item) => {
                if (item.problemFile) {
                  findByIds(item.problemFile).then((ress) => {
                    this.$set(item, "problemFileList", ress.data);
                    // item.problemFileList = res.data;
                  });
                }
              });
              // this.msDisabel=true
              this.problemList = res.data;
            }
          });
        } else {
          this.ProbelmName = "问题处理过程";
          GetlistSolve(data).then((res) => {
            if (res.infoCode == 200) {
              this.SolveList = res.data;
              // this.SolveList=res.data
              this.SolveList.forEach((item) => {
                if (item.solveFile) {
                  findByIds(item.solveFile).then((ress) => {
                    this.$set(item, "solveFileList", ress.data);
                  });
                }
              });
            }
          });
        }
      });
    },
    //追加问题描述
    AddProblem() {
      this.dialogVisible = true;
      this.addFrom.mainId = this.formData.fid;
      this.addFrom.gdbh = this.formData.gdbh;
    },
    //提交追加问题描述
    AddProblomSubmit() {
      this.$refs["addFrom"].validate((valid) => {
        if (valid) {
          let arrZJ = [];
          this.fileList1.map((item) => {
            arrZJ.push(item.response ? item.response.data.id : item.id);
          });
          this.addFrom.solveFile = arrZJ.join();
          addSolve(this.addFrom).then((res) => {
            if (res.infoCode == 200) {
              this.$message({
                message: "添加成功",
                type: "success",
              });
              this.dialogVisible = false;
              this.selectByInfo();
            } else {
              this.$message.error(res.msg);
            }
          });
        }
      });
    },
    //提交信息
    saveSubmit(susInfo, errInfo) {
      this.stateLoading = false;
      let validateFieldList = [];
      let arrList = [];
      // this.formData.shzt=this.$route.query.shzt ? this.$route.query.shzt : '91000010'
      if (this.$route.query.shzt == "91000030") {
        this.formData.shzt = "91000040";
        this.formData.icVerify = "";
        this.formData.icVerifyDate = "";
        this.formData.solveDate = "";
        arrList = ["acceptPerson", "acceptDate"];
      } else if (
        this.$route.query.shzt == "91000040" ||
        this.$route.query.shzt == "91000042"
      ) {
        this.formData.shzt = "91000050";
        this.formData.icVerify = "";
        this.formData.icVerifyDate = "";
        if (
          this.formData.problemType == "其他" ||
          this.formData.solveType == "其他"
        ) {
          arrList = [
            "webSysName",
            "problemType",
            "solveType",
            "solveRes",
            "solveRemark",
            "solvePerson",
            "solveDate",
            "isIcOpsScope",
          ];
        } else {
          arrList = [
            "webSysName",
            "problemType",
            "solveType",
            "solveRes",
            "solvePerson",
            "solveDate",
            "isIcOpsScope",
          ];
        }
      } else if (this.$route.query.shzt == "91000060") {
        if (this.formData.icVerifyRes == "2") {
          this.formData.shzt = "91000052";
        } else {
          this.formData.shzt = "91000070";
        }

        arrList = ["icVerifyRes", "icVerifyDate", "icVerify"];
      }
      console.log(arrList, "8888888888888");
      this.$refs["formData"].validateField(
        //这里要放数组,数组中写上要校验的字段
        arrList,
        async (valid) => {
          if (!valid) {
            let arr = [];
            console.log(this.fileListBL, "ppppppp000000");
            this.fileListBL.map((item) => {
              arr.push(item.response ? item.response.data.id : item.id);
            });
            this.formData.solveFile = arr.join();
            //校验通过走这里,每通过一次,会往这个数组里加一个""
            validateFieldList.push(valid);
            //因为我这里总共校验了三个字段,所有最终三个字段都校验成功之后,数组中会有三个""
            if (
              validateFieldList.length == arrList.length &&
              validateFieldList.every((item) => item === "")
            ) {
              //这里写校验通过的业务逻辑
              console.log("通过");
              this.formData.problemType = this.formData.problemType
                ? this.formData.problemType.join()
                : this.formData.problemType;
              this.formData.solveType = this.formData.solveType
                ? this.formData.solveType.join()
                : this.formData.solveType;
              this.formData.webSysName = this.formData.webSysName
                ? this.formData.webSysName.join()
                : this.formData.webSysName;
              this.formData.solvePerson = this.formData.solvePerson
                ? this.formData.solvePerson.join()
                : this.formData.solvePerson;
              this.formData.fid = this.$route.query.fid;
              updateByEntitySelective(this.formData).then((res) => {
                console.log(res, susInfo, "kkkkkkkkkk4444444444");
                if (res.infoCode == 200) {
                  this.$message({
                    message: susInfo ? susInfo : "提交成功",
                    type: "success",
                  });
                  this.$router.push({
                    name: "operationManagement",
                  });
                  // this.$router.go(-1);
                } else {
                  this.$message({
                    type: "error",
                    message: errInfo ? errInfo : res.msg,
                  });
                  // this.$message.error(res.msg);
                }
              });
            }
            //校验不通过走这里
            return;
          }
        }
      );
    },
    //盖章
    stamp() {
      this.$confirm("是否确认盖章？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.stateLoading = true;
          this.$refs.sealDialog.getData();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消盖章",
          });
        });
    },
    sealTodo(sealData) {
      // new签章
      var sh = `newSeal${sealData}`;
      console.log(sh, "ppppppp66666666666s");
      // let data = {
      //   ...this.formData,
      //   qyqz: sh,
      // };
      this.formData.qhrqz = sh;
      this.formData.shzt = "91000030";
      this.saveSubmit("盖章成功！", "盖章失败！");
    },
    sealError() {
      this.stateLoading = false;
    },
    //驳回
    signNotDo() {
      this.$confirm("是否确认驳回？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.formData.shzt = "91000011";
          this.saveSubmit("签章驳回成功！", "签章驳回失败！");
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消驳回",
          });
        });
    },
    toOffline() {
      this.$router.push({
        name: "offlineFilingDetail",
        query: {
          shzt: this.formData.tzshzt,
          fid: this.formData.opsOffLineFid,
          type: "CK",
        },
      });
    },
    //返回
    returnList() {
      this.$router.go(-1);
    },
    //上传
    handleSuccess(res, file, fileList) {
      this.fileListBL = fileList;
    },
    handleRemove(file, fileList) {
      this.fileListBL = fileList;
    },
    handlePreview(file) {
      // console.log(file);
      window.location.href = `${files}/file/download?id=${
        file.response ? file.response.data.id : file.id
      }`;
    },
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },
    //处理过程附件
    handleSuccessCL(res, file, fileList) {
      this.fileList1 = fileList;
    },
    handleRemoveCL(file, fileList) {
      this.fileList1 = fileList;
    },
    handlePreviewCL(file) {
      // console.log(file);
      window.location.href = `${files}/file/download?id=${
        file.response ? file.response.data.id : file.id
      }`;
    },
    beforeRemoveCL(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },
    //预览
    YlPic(link) {
      // window.open(`${files}/${link}`)
      window.open(`${window.location.origin}/file/${link}`);
      // window.open(`http://101.36.160.140:8097/file/${link}`)
      // window.open(`${files}/file/download?id=${id}`);
    },
    //下载
    XzPic(id) {
      window.location.href = `${files}/file/download?id=${id}`;
    },
    dateFormat(date) {
      // let date = new Date();
      let year = date.getFullYear();
      /* 在日期格式中，月份是从0开始的，因此要加0
       * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
       * */
      let month =
        date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1;
      let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      let hours =
        date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
      let minutes =
        date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
      let seconds =
        date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
      // 拼接
      return year + "-" + month + "-" + day;

      // this.formData.fbrq = year + "-" + month + "-" + day;
    },
  },
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.ywborderS {
  // border: 1px solid #000000;
  padding: 15px;
}
.table-b {
  width: 100%;
  border-collapse: collapse;
  //   height: 100px;
  text-align: center;
  // background-color: #000;
  // border-right: 1px solid #000;
  // border-bottom: 1px solid #000;
  border: 1px solid #000;
  td {
    // width: 320px;
    // height: 50px;
    padding: 10px 40px;
    border: 1px solid #000;
    // border-left: 1px solid #000;
    // border-top: 1px solid #000;
  }
  .inputwidth {
    width: 100%;
  }
}
.table-b td:nth-child(odd) {
  // text-align: justify;
  // text-align-last: justify;
}
.table-el-form /deep/ .el-form-item {
  width: 100%;
}
.table-el-form /deep/ .el-form-item__content {
  width: 100%;
}
.table-el-form /deep/ .el-date-editor.el-input,
.el-date-editor.el-input__inner {
  width: inherit;
}
.box-pro {
  border: 1px solid #cfcfcf;
  padding: 10px;
  margin-bottom: 20px;
}
.el-data-width /deep/.el-date-editor.el-input,
.el-date-editor.el-input__inner {
  width: auto;
}
::-webkit-scrollbar {
  width: 4px;
}
::-webkit-scrollbar-thumb {
  background: #99a9bf;
  border-radius: 20px;
}
</style>
<style>
#OperationOrder {
  position: relative;
}

#OperationOrder > div {
  top: -23px !important;
  align-items: center;
  /* left: -25px !important; */
}
</style>
