yiliangyiyun-pc/src/views/dynamicRport/components/addConstructionReport.vue

<!-- 施工报-->
<template>
  <div class="frame"
       id="addConstuctionReport">
    <div style="height: 50px"
         v-if="editFlag">
      <auditFlow show-history-flag="true"
                 :activities="activities"
                 :message="approveStatus"
                 :billNo="shipMan.status" />
    </div>
    <div class="app-container input-form">
      <ws-form :model="shipMan"
               label-width="30%"
               :show-message="false"
               ref="shipMan"
               :rules="rules">
        <div class="crewAddTitle clearfix"
             style="margin-top:1px">
          <div class="left">
            <span class="crewAddTitleMsg">基本信息(施工报)</span>
          </div>
          <div class="right">
            <ws-button type="primary"
                       class="editBtn"
                       @click="submit"
                       v-if="!auth">提 交</ws-button>
            <ws-button type="primary"
                       class="editBtn"
                       @click="confirm"
                       v-if="auth">确 认</ws-button>
            <ws-button type="primary"
                       class="editBtn"
                       @click="refuse"
                       v-if="auth">退 回</ws-button>
            <ws-button type="primary"
                       class="editBtn"
                       @click="save">保 存</ws-button>
            <ws-button class="editBtn"
                       @click="back">返 回</ws-button>
            <div class="divIcon"
                 @click="openState(openMsg[0].key)">
              <i v-show="openMsg[0].state"
                 class="iconfont iconopen" />
              <i v-show="!openMsg[0].state"
                 class="iconfont iconclose" />
              <!--                <svg-icon class="openCloseIcon" v-show="openMsg[0].state" icon-class="open" />-->
              <!--                <svg-icon class="openCloseIcon" v-show="!openMsg[0].state" icon-class="close" />-->
              <span class="openClose">{{ openMsg[0].value }}</span>
            </div>
          </div>
        </div>
        <transition name="draw">
          <div v-show="openMsg[0].state"
               class="crewMsg">
            <ws-info-table>
              <ws-form-item span="1"
                            label="报告类型"
                            class="labelDiv"
                            prop="reportTypeId">
                <ws-select :placeholder="$t('common.selected')"
                           v-model="shipMan.reportTypeId"
                           disabled>
                  <ws-option v-for="item in typeList"
                             :key="item.parameterKey"
                             :label="item.parameterValue"
                             :value="item.parameterKey">
                  </ws-option>
                </ws-select>
              </ws-form-item>
              <ws-form-item span="1"
                            label="船舶名称"
                            class="labelDiv"
                            prop="vesselId">
                <!-- <ws-select :placeholder="$t('common.selected')"
                           v-model="shipMan.vesselId"
                           clearable
                           @change="vesselChange"
                           :disabled="editFlag || vesselBankFlag == 'V'"
                           filterable>
                  <ws-option v-for="item in shipList"
                             :key="item.vesselId"
                             :label="item.vesselName"
                             :value="item.vesselId"></ws-option>
                </ws-select> -->
                <BaseShipSelect v-model="shipMan.vesselId"
                                :disabled="editFlag || vesselBankFlag == 'V'"
                                filterable
                                :placeholder="$t('common.selected')"
                                :showAll="false"
                                clearable
                                :remote="true"
                                @change="vesselChange"
                                style="width:100%;"></BaseShipSelect>
              </ws-form-item>
              <ws-form-item span="1"
                            label="船舶呼号"
                            class="labelDiv"
                            prop="callSign">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.callSign"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="报告日期"
                            class="labelDiv"
                            prop="reportDate">
                <ws-date-picker v-model="shipMan.reportDate"
                                type="date"
                                :placeholder="$t('common.selected')"
                                value-format="yyyy-MM-dd"
                                format="yyyy.MM.dd">
                </ws-date-picker>
              </ws-form-item>
              <ws-form-item span="1"
                            label="时区"
                            class="labelDiv"
                            prop="timeZone">
                <ws-select :placeholder="$t('common.selected')"
                           v-model="shipMan.timeZone"
                           clearable>
                  <ws-option v-for="item in timeList"
                             :key="item.dictionaryItemId"
                             :label="item.dictionaryItemName"
                             :value="item.dictionaryItemName"></ws-option>
                </ws-select>
              </ws-form-item>
              <ws-form-item span="1"
                            label="船舶状态"
                            class="labelDiv"
                            prop="shipStatus">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.shipStatus"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="施工地点"
                            class="labelDiv">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.constructionSite"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="备注"
                            class="labelDiv">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.remarks"
                          maxlength="50"></ws-input>
              </ws-form-item>
            </ws-info-table>
          </div>
        </transition>
        <div class="crewAddTitle clearfix">
          <div class="left">
            <span class="crewAddTitleMsg">天气及施工信息</span>
          </div>
          <div class="right"
               @click="openState(openMsg[1].key)">
            <i v-show="openMsg[1].state"
               class="iconfont iconopen" />
            <i v-show="!openMsg[1].state"
               class="iconfont iconclose" />
            <!--              <svg-icon class="openCloseIcon" v-show="openMsg[1].state" icon-class="open" />-->
            <!--              <svg-icon class="openCloseIcon" v-show="!openMsg[1].state" icon-class="close" />-->
            <span class="openClose">{{ openMsg[1].value }}</span>
          </div>
        </div>
        <transition name="draw">
          <div v-show="openMsg[1].state"
               class="crewMsg">
            <ws-info-table>
              <ws-form-item span="1"
                            label="海况">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.sea"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="浪高">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.swell"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="天气及视距">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.weatherStadia"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="风向及风力">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.windDirection"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="施工区段">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.constructionSection"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="工程量">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.quantityWork"
                            maxlength="50"
                            clearable></ws-input>
                  <div class="rightDiv">m³</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="船次">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.shipTimes"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="停工时长">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.downtime"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">h</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="停工原因">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.downtimeReasons"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="生产时长">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.runningTime"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">h</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="主机（左）运转时长">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.hostLeftRunningTime"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">h</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="主机（右）运转时长">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.hostRightRunningTime"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">h</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="副机运转时长">
                <ws-input v-leave-num-only
                          :placeholder="$t('common.input')"
                          v-model.trim="
                    shipMan.reportDetail.secondaryMachineRunningTime
                  "
                          maxlength="50"></ws-input>
              </ws-form-item>
            </ws-info-table>
          </div>
        </transition>
        <transition name="draw">
          <div class="crewAddTitle clearfix">
            <div class="left">
              <span class="crewAddTitleMsg">油水存量、消耗及接收信息</span>
            </div>
            <div class="right"
                 @click="openState(openMsg[2].key)">
              <i v-show="openMsg[2].state"
                 class="iconfont iconopen" />
              <i v-show="!openMsg[2].state"
                 class="iconfont iconclose" />
              <!--<svg-icon class="openCloseIcon" v-show="openMsg[2].state" icon-class="open" />-->
              <!--<svg-icon class="openCloseIcon" v-show="!openMsg[2].state" icon-class="close" />-->
              <span class="openClose">{{ openMsg[2].value }}</span>
            </div>
          </div>
        </transition>
        <div class="crewAddTitle clearfix">
          <div class="left">
            <span class="crewAddTitleMsg">天气及施工信息</span>
          </div>
          <div class="right"
               @click="openState(openMsg[1].key)">
            <i v-show="openMsg[1].state"
               class="iconfont iconopen"
               style="font-size: 14px;" />
            <i v-show="!openMsg[1].state"
               class="iconfont iconclose"
               style="font-size: 14px;" />
            <!--              <svg-icon class="openCloseIcon" v-show="openMsg[1].state" icon-class="open" />-->
            <!--              <svg-icon class="openCloseIcon" v-show="!openMsg[1].state" icon-class="close" />-->
            <span class="openClose">{{ openMsg[1].value }}</span>
          </div>
        </div>
        <transition name="draw">
          <div v-show="openMsg[1].state"
               class="crewMsg">
            <ws-info-table>
              <ws-form-item span="1"
                            label="海况">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.sea"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="浪高">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.swell"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="天气及视距">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.weatherStadia"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="风向及风力">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.windDirection"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="施工区段">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.constructionSection"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="工程量">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.quantityWork"
                            maxlength="50"
                            clearable></ws-input>
                  <div class="rightDiv">m³</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="船次">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.shipTimes"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="停工时长">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.downtime"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">h</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="停工原因">
                <ws-input :placeholder="$t('common.input')"
                          v-model.trim="shipMan.reportDetail.downtimeReasons"
                          maxlength="50"></ws-input>
              </ws-form-item>
              <ws-form-item span="1"
                            label="生产时长">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.runningTime"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">h</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="主机（左）运转时长">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.hostLeftRunningTime"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">h</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="主机（右）运转时长">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.hostRightRunningTime"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">h</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="副机运转时长">
                <ws-input v-leave-num-only
                          :placeholder="$t('common.input')"
                          v-model.trim="
                    shipMan.reportDetail.secondaryMachineRunningTime
                  "
                          maxlength="50"></ws-input>
              </ws-form-item>
            </ws-info-table>
          </div>
        </transition>
        <div class="crewAddTitle clearfix">
          <div class="left">
            <span class="crewAddTitleMsg">油水存量、消耗及接收信息</span>
          </div>
          <div class="right"
               @click="openState(openMsg[2].key)">
            <i v-show="openMsg[2].state"
               class="iconfont iconopen"
               style="font-size: 14px;" />
            <i v-show="!openMsg[2].state"
               class="iconfont iconclose"
               style="font-size: 14px;" />
            <!--              <svg-icon class="openCloseIcon" v-show="openMsg[2].state" icon-class="open" />-->
            <!--              <svg-icon class="openCloseIcon" v-show="!openMsg[2].state" icon-class="close" />-->
            <span class="openClose">{{ openMsg[2].value }}</span>
          </div>
        </div>
        <transition name="draw">
          <div v-show="openMsg[2].state"
               class="crewMsg">
            <ws-info-table>
              <ws-form-item span="1"
                            label="重油补给">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.heavyOilSupply"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="轻油补给">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.lightOilSupply"
                            maxlength="50"
                            ws></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="重油消耗">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.heavyOilDeplete"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="轻油消耗">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.lightOilDeplete"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="重油存量">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.heavyOilStock"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="轻油存量">
                <div>
                  <ws-input v-leave-num-only
                            style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.lightOilStock"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="主机系统油补给">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.mainOilSupply"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">L</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="副机系统油补给">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.auxiliaryOilSupply"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">L</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="主机系统油消耗">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.mainOilDeplete"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">L</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="副机系统油消耗">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.auxiliaryOilDeplete"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">L</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="主机系统油存量">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.mainOilStock"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">L</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="副机系统油存量">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.auxiliaryOilStock"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">L</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="主机重油消耗">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.mainHeavyOilSupply"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="主机轻油消耗">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.mainLightOilSupply"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="副机轻油消耗">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-model.trim="shipMan.reportDetail.auxiliaryLightOilSupply"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="日用淡水补给">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.dailyWaterSupply"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="日用淡水消耗">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.dailyWaterDeplete"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
              <ws-form-item span="1"
                            label="日用淡水存量">
                <div>
                  <ws-input style="width:95%"
                            :placeholder="$t('common.input')"
                            v-leave-num-only
                            v-model.trim="shipMan.reportDetail.dailyWaterStock"
                            maxlength="50"></ws-input>
                  <div class="rightDiv">MT</div>
                </div>
              </ws-form-item>
            </ws-info-table>
          </div>
        </transition>
        <div class="crewAddTitle clearfix">
          <div class="left">
            <span class="crewAddTitleMsg">附件</span>
          </div>
        </div>
        <transition name="draw">
          <div class="crewMsg">
            <div>
              <ws-upload ref="upload"
                         table-name="noonreport_dynamic_report_info"
                         oss-key="deploy"
                         :vesselId="my_VesselId ? my_VesselId : ''"
                         :comp-id="compId"
                         :appendix-ids="appendixIds" />
            </div>
          </div>
        </transition>
      </ws-form>
    </div>
  </div>
</template>
<script>
import {
  parameterTenantQuery,
  queryItems,
  saveDynamicReport,
  submitDynamicReport,
  getReportInfoById,
  saveConfirm,
  saveReturn,
  getDynamicHistorys
} from '@/model/crew/index'
import WsUpload from '@/components/WsUpload'
import auditFlow from '@/components/WinseaCom/auditFlow.vue'
import { EventBus } from 'base-core-lib'
export default {
  components: { WsUpload, auditFlow },
  name: 'addConstructionReport',
  props: ['callbackdata', 'authFlag'],
  data () {
    return {
      my_VesselId: localStorage.getItem('ws-pf_vesselId'),
      openMsg: [
        {
          key: 0,
          value: '收起',
          state: true
        },
        {
          key: 1,
          value: '收起',
          state: true
        },
        {
          key: 2,
          value: '收起',
          state: true
        },
        {
          key: 3,
          value: '收起',
          state: true
        }
      ],
      shipMan: {
        id: '',
        reportTypeId: '1', //报告类型ID
        reportType: '施工报', //报告类型
        vesselId: '', //船舶ID
        vesselName: '', //船舶
        sailingStatusId: '',
        sailingStatus: '',
        callSign: '', //呼号
        timeZone: '', //时区
        shipStatus: '施工', //船舶状态
        remarks: '', //备注
        constructionSite: '', //施工地点
        previousProjectPort: '',
        nextProjectPort: '',
        reportDate: '', //报告日期
        reporter: '',
        appendixFileUrls: '',
        // 动态报明细
        reportDetail: {
          sea: '',
          swell: '',
          weatherStadia: '',
          windDirection: '',
          constructionSection: '',
          quantityWork: '',
          shipTimes: '',
          downtimeReasons: '',
          downtime: '',
          runningTime: '',
          hostLeftRunningTime: '',
          hostRightRunningTime: '',
          secondaryMachineRunningTime: '',
          heavyOilSupply: '',
          lightOilSupply: '',
          heavyOilDeplete: '',
          lightOilDeplete: '',
          heavyOilStock: '',
          lightOilStock: '',
          mainOilSupply: '',
          auxiliaryOilSupply: '',
          mainOilDeplete: '',
          auxiliaryOilDeplete: '',
          mainOilStock: '',
          auxiliaryOilStock: '',
          dailyWaterSupply: '',
          dailyWaterDeplete: '',
          dailyWaterStock: '',
          auxiliaryLightOilSupply: ''
        }
      },
      typeList: [],
      shipList: [],
      timeList: [],
      compId: localStorage.getItem('ws-pf_compId'),
      rules: {
        reportTypeId: [
          {
            required: true,
            message: '请输入优惠政策名称',
            trigger: ['blur', 'change']
          }
        ],
        vesselId: [
          {
            required: true,
            message: '请输入优惠政策名称',
            trigger: ['blur', 'change']
          }
        ],
        callSign: [
          {
            required: true,
            message: '请输入优惠政策名称',
            trigger: ['blur', 'change']
          }
        ],
        timeZone: [
          {
            required: true,
            message: '请输入优惠政策名称',
            trigger: ['blur', 'change']
          }
        ],
        shipStatus: [
          {
            required: true,
            message: '请输入优惠政策名称',
            trigger: ['blur', 'change']
          }
        ],
        reportDate: [
          {
            required: true,
            message: '请输入优惠政策名称',
            trigger: ['blur', 'change']
          }
        ]
      },
      id: '',
      editFlag: false,
      auth: false,
      // 新上传
      oldAppendixIds: '',
      newAppendixs: [],
      onChangeFlag: false,
      appendixIds: '',
      activities: [],
      approveStatus: '',
      vesselBankFlag: localStorage.getItem('ws-pf_vesselBankFlag')
    }
  },
  created () { },
  mounted () {
    document.getElementById('addConstuctionReport').style.cssText =
      'width:100%;background-color: white;position:absolute;overflow-y:scroll;height:' +
      (document.body.clientHeight - 40) +
      'px'
    if (this.callbackdata) {
      this.editFlag = this.callbackdata
      getReportInfoById({
        id: localStorage.getItem('ws_dynamicReport_id')
      }).toPromise().then(response => {
        this.shipMan = response
        if (this.shipMan.appendixFileUrls) {
          this.appendixIds = this.shipMan.appendixFileUrls // 用于回显
          this.oldAppendixIds = this.shipMan.appendixFileUrls // 用于下一次点击保存给saveFiles接口传参
        }
        // 操作历史
        getDynamicHistorys({
          id: response.id
        }).toPromise().then(response => {
          this.activities = response
        })
      })
    }
    if (this.authFlag) {
      this.auth = this.authFlag
    }
    this.initData()
  },
  methods: {
    editData () {
      this.editFlag = true
      getReportInfoById({ id: this.id }).toPromise().then(response => {
        this.shipMan = response
        if (this.shipMan.appendixFileUrls) {
          this.appendixIds = this.shipMan.appendixFileUrls // 用于回显
          this.oldAppendixIds = this.shipMan.appendixFileUrls // 用于下一次点击保存给saveFiles接口传参
        }
        // 操作历史
        getDynamicHistorys({
          id: response.id
        }).toPromise().then(response => {
          this.activities = response
        })
      })
    },
    initData () {
      // 所属船舶
      this.shipList = JSON.parse(localStorage.getItem('ws-pf_vessels'))
      if (this.vesselBankFlag == 'V') {
        this.shipMan.vesselId = localStorage.getItem('ws-pf_vesselId')
        this.shipMan.vesselName = this.shipList.find(
          item => this.shipMan.vesselId == item.vesselId
        ).vesselName
      }
      parameterTenantQuery({
        compId: this.compId,
        constCode: 'NOON_REPORT_TYPE'
      }).toPromise().then(response => {
        this.typeList = response
      })
      queryItems({ categoryCode: 'TIME_ZONE' })
        .toPromise()
        .then(response => {
          this.timeList = response
        })
    },
    vesselChange () {
      const arrat = JSON.parse(JSON.stringify(this.shipList))
      let findVessel = arrat.find((item, index, arr) => {
        return item.vesselId == this.shipMan.vesselId
      })
      this.shipMan.vesselName = findVessel.vesselName
    },
    // 展开状态
    openState (key) {
      this.openMsg[key].state = !this.openMsg[key].state
      if (this.openMsg[key].state) {
        this.openMsg[key].value = '收起'
      } else {
        this.openMsg[key].value = '展开'
      }
    },
    // 保存接口
    saveData () {
      return new Promise(resolve => {
        this.$refs['shipMan'].validate(valid => {
          if (valid) {
            saveDynamicReport(this.shipMan).toPromise().then(response => {
              this.id = response
              resolve('ok')
            })
          } else {
            EventBus.$emit('error', this.$t('deploy.enterRequireData'))
          }
        })
      })
    },
    saveDataChild (resolve) {
      this.saveData().then(value => {
        if (value == 'ok') {
          resolve('yes')
          EventBus.$emit('success', '保存成功')
          this.editData()
        }
      })
    },
    save () {
      return new Promise(resolve => {
        this.$refs.upload.handleSaveBill().then(res => {
          this.shipMan.appendixFileUrls = res
          this.saveDataChild(resolve)
        })
      })
    },
    submitData () {
      let that = this
      submitDynamicReport(that.$qs.stringify({ id: this.id })).toPromise().then(
        response => {
          that.$router.push({ name: 'dynamicReportView' })
        }
      )
    },
    submit () {
      this.$refs['shipMan'].validate(valid => {
        if (valid) {
          let that = this
          that
            .$confirm(
              that.$t('deploy.message02'),
              that.$t('showMessage.hint'),
              {
                confirmButtonText: that.$t('showMessage.confirm'),
                cancelButtonText: that.$t('showMessage.cancel'),
                type: 'warning'
              }
            )
            .then(() => {
              that.save().then(val => {
                if (val == 'yes') {
                  that.submitData()
                }
              })
            })
        } else {
          EventBus.$emit('error', this.$t('deploy.enterRequireData'))
        }
      })
    },
    back () {
      this.$router.back(-1)
    },
    onChange (files) {
      this.newAppendixs = files
      this.onChangeFlag = true
    },
    confirm () {
      let that = this
      that
        .$confirm(
          '确认后将不能更改，确认提交吗？',
          that.$t('showMessage.hint'),
          {
            confirmButtonText: that.$t('showMessage.confirm'),
            cancelButtonText: that.$t('showMessage.cancel'),
            type: 'warning'
          }
        )
        .then(() => {
          that.save().then(val => {
            if (val == 'yes') {
              saveConfirm(this.$qs.stringify({ id: this.shipMan.id })).toPromise().then(
                response => {
                  EventBus.$emit('success', '确认成功')
                  this.$router.push({ name: 'dynamicReportView' })
                }
              )
            }
          })
        })
    },
    refuse () {
      let that = this
      that
        .$confirm(
          '退回后将不能更改，确认提交吗？',
          that.$t('showMessage.hint'),
          {
            confirmButtonText: that.$t('showMessage.confirm'),
            cancelButtonText: that.$t('showMessage.cancel'),
            type: 'warning'
          }
        )
        .then(() => {
          saveReturn(this.$qs.stringify({ id: this.shipMan.id })).toPromise().then(
            response => {
              EventBus.$emit('success', '退回成功')
              this.$router.push({ name: 'dynamicReportView' })
            }
          )
        })
    }
  },
  // 空内容填充‘--’字符

  watch: {}
}
</script>
<style lang="scss" scoped>
.yhellipsis {
  width: 95%;
}
.frame {
  padding: 0px 15px 15px 1px;
}
.frameTitle {
  background-color: #fff;
}
.frameCenter {
  background-color: #fff;

  padding: 0px 15px 45px 15px;
  height: calc(100vh - 90px);
  overflow-y: auto;
}
.crewAddButton {
  height: 50px;
  line-height: 50px;
  padding-right: 10px;
}
.crewAddTitle {
  font-size: 16px;
  color: #333;
  font-weight: bold;
  height: 60px;
  line-height: 60px;
}
.left {
  float: left;
}
.right {
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  float: right;
}
.crewAddTitleMsg::before {
  content: '▍';
  color: #1d6ced;
}
.uphead {
  margin-bottom: 10px;
  display: inline-block;
  position: relative;
  height: 60px;
  line-height: 60px;
}
.img {
  position: absolute;
  display: inline-block;
  height: 60px;
  width: 60px;
  border-radius: 50%;
}
.kyc-passin0 {
  font-size: 14px;
  margin-left: 70px;
  color: #666666;
  position: absolute;
  top: 14px;
  width: 80px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border: 1px solid #cccccc;
  border-radius: 5px;
}
.kyc-passin {
  width: 85px;
  opacity: 0;
  margin-left: 70px;
}
.talk {
  font-size: 12px;
  color: #999999;
}
.draw-enter-active,
.draw-leave-active {
  transition: all 0.4s;
}
.draw-enter,
.draw-leave-active {
  transform: translateY(-45px);
  opacity: 0;
}
.add {
  margin-right: 15px;
}
.add,
.openClose {
  display: inline-block;
}
/deep/ .edit-input .el-input__inner {
  width: 95%;
}
.certificateEdit .el-input--medium {
  border-left: none;
}
.el-dialog__body {
  padding: 10px;
}
.Yhsearch {
  margin-bottom: 10px;
}
.divIcon {
  display: inline-block;
}
.editBtn {
  margin-right: 10px;
}
/deep/ .labelDiv label {
  display: block;
}
.rightDiv {
  width: 5%;
  float: right;
}
/deep/ .el-time-panel {
  margin: 5px -27px !important;
}
</style>