<template>
  <div>
    <el-dialog custom-class="bbsl-location-dialog"
               top="5vh"
               :close-on-click-modal="false"
               :title="title"
               :visible.sync="showFormDia"
               width="90%"
               :before-close="handleClose">
      <el-tabs v-model="activeName"
               @tab-click="handleClick"
               :before-leave="leaveTab"
               class="bbsl-tab">
        <el-tab-pane label="基础信息"
                     name="form">
          <div class="bbsl-scroll-pane">
            <!-- <div class="bbsl-scroll-step">
                            <el-steps direction="vertical" :active="activeStep">
                                <el-step
								    v-for="item in stepData"
									:key="item.domId"
                                    :title="item.title"
                                    icon="el-icon-s-management"
                                    @click.native="localtion(item.domId)"
                                ></el-step>
                            </el-steps>
            </div>-->
            <el-form class="bbsl-scroll-form"
                     ref="formInfo"
                     :rules="rules"
                     :model="params"
                     label-width="150px">
              <p class="from-title"
                 id="step1">
                <i class="el-icon-info"></i>
                <span>基础信息</span>
              </p>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="水库名称："
                                prop="rsnm">
                    <el-input size="mini"
                              placeholder="请输入水库名称"
                              v-model="params.rsnm"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="水库代码："
                                prop="rscd">
                    <el-input size="mini"
                              placeholder="请输入水库代码"
                              v-model="params.rscd"
                              maxlength="18"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="水库注册码："
                                prop="rsrd">
                    <el-input size="mini"
                              placeholder="请输入水库注册码"
                              maxlength="16"
                              v-model="params.rsrd">
                    </el-input>
                  </el-form-item>
                </el-col>

              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="水库类型："
                                prop="resType">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.resType"
                               clearable
                               placeholder="请选择水库类型">
                      <el-option v-for="item in resTypes"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="工程规模："
                                prop="prsc">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.prsc"
                               clearable
                               placeholder="请选择工程规模">
                      <el-option v-for="item in prscs"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="工程状态："
                                prop="prst">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.prst"
                               clearable
                               placeholder="请选择工程状态">
                      <el-option v-for="item in prsts"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>

              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="水源地："
                                prop="waterSource">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.waterSource"
                               clearable
                               placeholder="请选择水源地">
                      <el-option v-for="item in waterSources"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="水库功能："
                                prop="rsfn">
                    <el-select @change="changeRsr"
                               style="width: 100%"
                               size="mini"
                               multiple
                               v-model="rsr"
                               clearable
                               placeholder="请选择水库功能">
                      <el-option v-for="item in rsrs"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="工程等级："
                                prop="prgr">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.prgr"
                               clearable
                               placeholder="请选择工程等级">
                      <el-option v-for="item in prgrs"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>

              </el-row>
              <!-- <el-row>
								<el-col :span="8">
								    <el-form-item
								        label="最大坝高："
								        prop="maxdmhg"
								    >
								        <el-input
								            @input="maxdmhgs"
								            size="mini"
								            placeholder="请输入最大坝高"
								            v-model="params.maxdmhg"
								        ></el-input>
								    </el-form-item>
								</el-col>
                               <el-col :span="8">
                                    <el-form-item
                                        label="坝顶高程："
                                        prop="dmcrel"
                                    >
                                        <el-input
                                            @input="dmcrels('1')"
                                            size="mini"
                                            placeholder="请输入坝顶高程"
                                            v-model="params.dmcrel"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item
                                        label="集雨面积(Km2)："
                                        prop="catchmentArea"
                                    >
                                        <el-input
                                            @input="dmcrels('2')"
                                            size="mini"
                                            placeholder="请输入集雨面积"
                                            v-model="params.catchmentArea"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
              </el-row>-->
              <el-row>
                <!-- <el-col :span="8">
								    <el-form-item
								        label="水域面积(亩)："
								        prop="watersArea"
								    >
								        <el-input
								            @input="dmcrels('3')"
								            size="mini"
								            placeholder="请输入水域面积"
								            v-model="params.watersArea"
								        ></el-input>
								    </el-form-item>
                </el-col>-->
                <el-col :span="8">
                  <el-form-item label="管理单位电话："
                                prop="cmdptel">
                    <el-input maxlength="15"
                              size="mini"
                              placeholder="请输入管理单位电话"
                              v-model="params.cmdptel"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="建成年月："
                                prop="cpyr">
                    <el-date-picker style="width: 100%"
                                    value-format="yyyy-MM-dd"
                                    v-model="params.cpyr"
									size="mini"
                                    type="date"
                                    placeholder="选择建成年月"></el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="管理单位："
                                prop="cmdp">
                    <!-- <el-select style="width: 100%" size="mini" v-model="params.cmdp" clearable
											placeholder="请选择管理单位">
											<el-option v-for="item in cmdps" :key="item.id" :label="item.name"
												:value="item.code"></el-option>
                    </el-select>-->
                    <el-input maxlength="40"
                              size="mini"
                              placeholder="请输入管理单位"
                              v-model="params.cmdp"></el-input>
                  </el-form-item>
                </el-col>

              </el-row>
              <el-row>
                <el-form-item label="水库概况："
                              prop="rsov">
                  <el-input type="textarea"
                            :autosize="{minRows: 2, maxRows: 4}"
                            placeholder="请输入内容"
                            v-model="params.rsov"></el-input>
                </el-form-item>
              </el-row>
              <p class="from-title"
                 id="step2">
                <i class="el-icon-location"></i>
                <span>所在位置</span>
              </p>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="所在乡镇位置："
                                prop="vltw">
                    <el-input size="mini"
                              placeholder="请输入所在乡镇位置"
                              v-model="params.vltw"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="行政区划："
                                prop="addvcd">
                    <el-cascader filterable
                                 :show-all-levels="false"
                                 style="width: 100%"
								 size="mini"
                                 :options="basAdNames"
                                 v-model="params.addvcd"
                                 :props="{
                                                value: 'code',
                                                label: 'name',
                                                children: 'children',
                                            }"
                                 @change="onhouChange"
                                 placeholder="请选择行政区划"
                                 clearable></el-cascader>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="所在流域："
                                prop="ctcd">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.ctcd"
                               clearable
                               placeholder="请选择所在流域">
                      <el-option v-for="item in ctcds"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="所在河流："
                                prop="rvcd">
                    <el-cascader :show-all-levels="false"
                                 style="width: 100%"
								 size="mini"
                                 :options="rvcds"
                                 filterable
                                 v-model="params.rvcd"
                                 :props="{
								value: 'code',
								label: 'name',
								children: 'children',
								checkStrictly: true,
							}"
                                 @change="rvcdChange"
                                 placeholder="请选择所在河流"
                                 clearable></el-cascader>
                    <!-- <el-select
                    style="width: 100%"
                    size="mini"
                    v-model="params.rvcd"
                    clearable
                    placeholder="请选择所在河流"
                  >
                    <el-option
                      v-for="item in rvcds"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    ></el-option>
                    </el-select>-->
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="经度："
                                prop="eslg">
                    <el-input @input="deadLevs('1')"
                              size="mini"
                              placeholder="请输入所在位置经度"
                              v-model="params.eslg"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="纬度："
                                prop="nrlt">
                    <el-input @input="deadLevs('2')"
                              size="mini"
                              placeholder="请输入所在位置纬度"
                              v-model="params.nrlt"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <p class="from-title"
                 id="step3">
                <i class="el-icon-s-flag"></i>
                <span>水文特征</span>
              </p>
              <el-row>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="总库容(万m3)："
                                prop="ttstcp">
                    <el-input @input="totCaps"
                              size="mini"
                              placeholder="请输入总库容"
                              v-model="params.hychList.ttstcp"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="防洪库容(万m3)："
                                prop="flcnstcp">
                    <el-input @input="flcoCaps"
                              size="mini"
                              placeholder="请输入防洪库容"
                              v-model="params.hychList.flcnstcp"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="调洪库容(万m3)："
                                prop="rfstcp">
                    <el-input onkeyup="this.value=this.value.match(/\d+\.?\d{0,2}/);this.dispatchEvent(new Event('input'))"
                              oninput="if(value.length>6)value=value.indexOf('.') > 0 ? value.split('.')[0].substring(0, 7) + '.' +
											value.split('.')[1] : value.substring(0, 7)"
                              size="mini"
                              placeholder="请输入调洪库容"
                              v-model="params.hychList.rfstcp"></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="兴利库容(万m3)："
                                prop="acstcp">
                    <el-input onkeyup="this.value=this.value.match(/\d+\.?\d{0,2}/);this.dispatchEvent(new Event('input'))"
                              oninput="if(value.length>6)value=value.indexOf('.') > 0 ? value.split('.')[0].substring(0, 7) + '.' +
											value.split('.')[1] : value.substring(0, 7)"
                              size="mini"
                              placeholder="请输入兴利库容"
                              v-model="params.hychList.acstcp"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="死库容(万m2)："
                                prop="ddstcp">
                    <el-input @input="deadCaps"
                              size="mini"
                              placeholder="请输入死库容"
                              v-model="params.hychList.ddstcp"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="水域面积(亩)："
                                prop="catchmentArea">
                    <el-input @input="deadLevs('7')"
                              size="mini"
                              placeholder="请输入水域面积"
                              v-model="params.hychList.catchmentArea"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="集雨面积(km2)："
                                prop="watersArea">
                    <el-input @input="deadLevs('8')"
                              size="mini"
                              placeholder="请输入集雨面积"
                              v-model="params.hychList.watersArea"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="正常蓄水位相应水面面积(km2)："
                                prop="nwsa">
                    <el-input @input="deadLevs('9')"
                              size="mini"
                              placeholder="请输入正常蓄水位相应水面面积"
                              v-model="params.hychList.nwsa"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="正常蓄水位(m)："
                                prop="nrstlv">
                    <el-input @input="nrstlvs"
                              size="mini"
                              placeholder="请输入正常蓄水位"
                              v-model="params.hychList.nrstlv"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="设计洪水位(m)："
                                prop="dsfllv">
                    <el-input @input="dsfllvs"
                              size="mini"
                              placeholder="请输入设计洪水位"
                              v-model="params.hychList.dsfllv"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="校核洪水位(m)："
                                prop="chfllv">
                    <el-input @input="chfllvs"
                              size="mini"
                              placeholder="请输入校核洪水位"
                              v-model="params.hychList.chfllv"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="防洪高水位(m)："
                                prop="fllv">
                    <el-input onkeyup="this.value=this.value.match(/\d+\.?\d{0,2}/);this.dispatchEvent(new Event('input'))"
                              oninput="if(value.length>6)value=value.indexOf('.') > 0 ? value.split('.')[0].substring(0, 4) + '.' +
											value.split('.')[1] : value.substring(0, 4)"
                              size="mini"
                              placeholder="请输入防洪高水位"
                              v-model="params.hychList.fllv"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="期限制水位(m)："
                                prop="flsscnwl">
                    <el-input @input="flsscnwls"
                              size="mini"
                              placeholder="请输入期限制水位"
                              v-model="params.hychList.flsscnwl"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label-width="190px"
                                label="死水位(m)："
                                prop="ddwl">
                    <el-input @input="deadLevsl"
                              size="mini"
                              placeholder="请输入死水位"
                              v-model="params.hychList.ddwl"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <p class="from-title"
                 id="step4">
                <i class="el-icon-info"></i>
                <span>大坝</span>
              </p>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="大坝名称："
                                prop="damName">
                    <el-input size="mini"
                              placeholder="请输入大坝名称"
                              v-model="params.wrpRsrDm.damName"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="大坝代码："
                                prop="damCode">
                    <el-input size="mini"
                              placeholder="请输入大坝代码"
                              v-model="params.wrpRsrDm.damCode"
                              maxlength="18"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="大坝级别："
                                prop="damGrad">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.wrpRsrDm.damGrad"
                               clearable
                               placeholder="请选择大坝级别">
                      <el-option v-for="item in damGrads"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="大坝材料类型："
                                prop="damTypeMat">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.wrpRsrDm.damTypeMat"
                               clearable
                               placeholder="请选择大坝材料类型">
                      <el-option v-for="item in damTypeMats"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="大坝结构类型："
                                prop="damTypeStr">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.wrpRsrDm.damTypeStr"
                               clearable
                               placeholder="请选择大坝结构类型">
                      <el-option v-for="item in damTypeStrs"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="工程等级："
                                prop="engGrad">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.wrpRsrDm.engGrad"
                               clearable
                               placeholder="请选择工程等级">
                      <el-option v-for="item in prgrs"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="是否主坝："
                                prop="ifMainDam">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.wrpRsrDm.ifMainDam"
                               clearable
                               placeholder="请选择是否主坝">
                      <el-option v-for="item in ifMainDams"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="开工时间："
                                prop="startDate">
                    <el-date-picker style="width: 100%"
					size="mini"
                                    value-format="yyyy-MM-dd"
                                    v-model="params.wrpRsrDm.startDate"
                                    type="date"
                                    placeholder="选择开工时间"></el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="建成时间："
                                prop="compDate">
                    <el-date-picker style="width: 100%"
					size="mini"
                                    value-format="yyyy-MM-dd"
                                    v-model="params.wrpRsrDm.compDate"
                                    type="date"
                                    placeholder="选择建成时间"></el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="所在位置："
                                prop="damLoc">
                    <el-input type="textarea"
                              :autosize="{minRows: 2, maxRows: 4}"
                              size="mini"
                              placeholder="请输入所在位置"
                              v-model="params.wrpRsrDm.damLoc"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="坝址断面经度："
                                prop="damLong">
                    <el-input size="mini"
                              @input="deadLevs('3')"
                              placeholder="请输入坝址断面经度"
                              v-model="params.wrpRsrDm.damLong"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="坝址断面纬度："
                                prop="damLat">
                    <el-input size="mini"
                              @input="deadLevs('4')"
                              placeholder="请输入坝址断面纬度"
                              v-model="params.wrpRsrDm.damLat"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="高程系统："
                                prop="elevSys">
                    <el-select style="width: 100%"
                               size="mini"
                               v-model="params.wrpRsrDm.elevSys"
                               clearable
                               placeholder="请选择高程系统">
                      <el-option v-for="item in elevSyss"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="坝顶长度(m)："
                                prop="damTopLen">
                    <el-input @input="damTopLens"
                              size="mini"
                              placeholder="请输入坝顶长度"
                              v-model="params.wrpRsrDm.damTopLen"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="坝顶宽度(m)："
                                prop="damTopWid">
                    <el-input @input="damTopWids"
                              size="mini"
                              placeholder="请输入坝顶宽度"
                              v-model="params.wrpRsrDm.damTopWid"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="坝顶高程(m)："
                                prop="damTopElev">
                    <el-input @input="dikeTopWidMaxs"
                              size="mini"
                              placeholder="请输入坝顶高程"
                              v-model="params.wrpRsrDm.damTopElev"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="最大坝高(m)："
                                prop="damMaxHeig">
                    <el-input @input="damMaxHeigs"
                              size="mini"
                              placeholder="请输入最大坝高"
                              v-model="params.wrpRsrDm.damMaxHeig"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="坝址控制流域面积："
                                prop="damCba">
                    <el-input size="mini"
                              @input="deadLevs('5')"
                              placeholder="请输入坝址控制流域面积(km2)"
                              v-model="params.wrpRsrDm.damCba"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="坝址多年平均径流量："
                                prop="damAr">
                    <el-input size="mini"
                              @input="deadLevs('6')"
                              placeholder="请输入坝址多年平均径流量(万m3)"
                              v-model="params.wrpRsrDm.damAr"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <p class="from-title"
                 id="step5">
                <i class="el-icon-s-open"></i>
                <span>历史文化</span>
              </p>
              <el-row>
                <el-col :span="24">
                  <div class="quill-editor">
                    <!-- 图片上传组件辅助-->
                    <el-upload name="img"
                               class="avatar-uploader"
                               :action="uploadUrl"
                               :show-file-list="false"
                               :on-success="uploadSuccess"
                               :before-upload="beforeUpload"
                               :headers="header"
                               :accept="accept"></el-upload>
                    <!--富文本编辑器组件-->
                    <quill-editor v-model="params.history.content"
                                  :content="params.history.content"
                                  :options="editorOption"
                                  @blur="onEditorBlur($event)"
                                  @focus="onEditorFocus($event)"
                                  @ready="onEditorReady($event)"
                                  @change="onEditorChange"
                                  ref="QuillEditor"></quill-editor>
                  </div>
                </el-col>
              </el-row>
            </el-form>
          </div>
        </el-tab-pane>
        <el-tab-pane label="负责人"
                     name="persons">
          <div style="margin: 10px 0">
            <el-button size="mini"
                       icon="el-icon-plus"
                       type="primary"
                       @click="addAcounts">添加</el-button>
            <el-button size="mini"
                       icon="el-icon-delete"
                       type="danger"
                       @click="deletAcounts">删除</el-button>
          </div>
          <el-table :row-key="getRowKey"
                    ref="multipleSelections"
                    border
                    :data="params.persons"
                    :row-style="{height: '61px'}"
                    style="width: 100%"
                    @selection-change="handleChanges"
                    :header-cell-style="{'text-align': 'center'}"
                    :cell-style="{'text-align': 'center'}">
            <el-table-column type="selection"
                             width="55"
                             :reserve-selection="true"></el-table-column>
            <el-table-column prop="orgId"
                             label="责任人组织">
              <template slot-scope="scope">
                <el-cascader @change="changeOrgIds(scope.row)"
                             style="width: 100%"
                             size="mini"
                             v-model="scope.row.orgId"
                             :class="scope.row.orgId ? '' : 'redBull'"
                             :placeholder="
                                        scope.row.orgId
                                            ? ''
                                            : '请选择责任人组织'
                                    "
                             clearable
                             :options="orgIds"
                             :props="{value: 'id', label: 'name', children: 'children',checkStrictly: true}"
                             filterable
                             :show-all-levels="false"
                             :checkStrictly="false"></el-cascader>
              </template>
            </el-table-column>
            <el-table-column prop="personId"
                             label="责任人人员">
              <template slot-scope="scope">
                <el-select @change="changePids(scope.row)"
                           :disabled="scope.row.orgId ? false : true"
                           style="width: 100%"
                           size="mini"
                           v-model="scope.row.personId"
                           :class="scope.row.personId ? '' : 'redBull'"
                           :placeholder="
                                        scope.row.personId
                                            ? ''
                                            : '请选择责任人人员'
                                    "
                           clearable>
                  <el-option v-for="item in personIds"
                             :key="item.id"
                             :label="item.name"
                             :value="item.id"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="personClass"
                             label="责任类型">
              <template slot-scope="scope">
                <el-select style="width: 100%"
                           size="mini"
                           v-model="scope.row.personClass"
                           :class="scope.row.personClass ? '' : 'redBull'"
                           :placeholder="
								        scope.row.personClass
								            ? ''
								            : '请选择责任类型'
								    "
                           clearable>
                  <el-option v-for="item in personClass"
                             :key="item.id"
                             :label="item.name"
                             :value="item.value"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="personType"
                             label="责任人类型">
              <template slot-scope="scope">
                <el-select v-if="scope.row.personClass==1"
                           style="width: 100%"
                           size="mini"
                           v-model="scope.row.personType"
                           :class="scope.row.personType ? '' : 'redBull'"
                           :placeholder="
								        scope.row.personType
								            ? ''
								            : '请选择责任人类型'
								    "
                           clearable>
                  <el-option v-for="item in personTypes"
                             :key="item.id"
                             :label="item.name"
                             :value="item.value"></el-option>
                </el-select>
                <el-select v-else-if="scope.row.personClass==2"
                           style="width: 100%"
                           size="mini"
                           v-model="scope.row.personType"
                           :class="scope.row.personType ? '' : 'redBull'"
                           :placeholder="
								        scope.row.personType
								            ? ''
								            : '请选择责任人类型'
								    "
                           clearable>
                  <el-option v-for="item in personTypess"
                             :key="item.id"
                             :label="item.name"
                             :value="item.value"></el-option>
                </el-select>
                <el-select v-else
                           style="width: 100%"
                           size="mini"
                           v-model="scope.row.personType"
                           :class="scope.row.personType ? '' : 'redBull'"
                           :placeholder="
								        scope.row.personType
								            ? ''
								            : '请选择责任人类型'
								    "
                           clearable>
                  <el-option v-for="item in personTypeOne"
                             :key="item.id"
                             :label="item.name"
                             :value="item.value"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <!-- <el-table-column prop="isHead"
                             label="是否负责人">
              <template slot-scope="scope">
                <el-radio v-model="scope.row.isHead"
                          label="1">是</el-radio>
                <el-radio v-model="scope.row.isHead"
                          label="0">否</el-radio>
              </template>
            </el-table-column> -->
            <el-table-column prop="personType"
                             width='120'
                             label="排序号">
              <template slot-scope="scope">
                <el-input type="number"
                          min="1"
						  size="mini"
                          @input="insort(scope.row,scope.$index)"
                          v-model="scope.row.sn"></el-input>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="巡查账号"
                     :disabled="tabType"
                     name="resInsList">
          <!-- <div style="margin: 10px 0">
            <el-button size="mini" icon="el-icon-plus" type="primary" @click="addAcount">添加</el-button>
            <el-button size="mini" icon="el-icon-delete" type="danger" @click="deletAcount">删除</el-button>
          </div>
          <el-table
            :row-key="getRowKey"
            ref="multipleSelection"
            border
            :data="params.resInsList"
            :row-style="{height: '61px'}"
            style="width: 100%"
            @selection-change="handleSelectionChange"
            :header-cell-style="{'text-align': 'center'}"
            :cell-style="{'text-align': 'center'}"
          >
            <el-table-column type="selection" width="55" :reserve-selection="true"></el-table-column>
            <el-table-column prop="account" label="登录账号"></el-table-column>
            <el-table-column prop="password" label="密码"></el-table-column>
            <el-table-column prop="mobilePhone" label="联系电话"></el-table-column>
          </el-table> -->
          <!-- 巡查账号 -->
          <rltFormdailog :stateTitlt="title"
                         :rscd="rscd"></rltFormdailog>
          <!-- <el-dialog
		    title="提示"
		    :visible.sync="dialogVisible"
		    width="30%"
		    :before-close="handleClose">
		    <span>这是一段信息</span>
		    <span slot="footer" class="dialog-footer">
		      <el-button @click="dialogVisible = false">取 消</el-button>
		      <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
		    </span>
		  </el-dialog> -->

        </el-tab-pane>
        <el-tab-pane label="除险加固"
                     :disabled="tabType"
                     name="reinforcement">
          <reinforcement :wId="wId"
                         :rscd="rscd"></reinforcement>
        </el-tab-pane>
        <el-tab-pane label="安全鉴定"
                     :disabled="tabType"
                     name="safetyAppraisal">
          <safetyAppraisal :wId="wId"
                           :rscd="rscd"></safetyAppraisal>
        </el-tab-pane>
        <el-tab-pane label="维修保养"
                     :disabled="tabType"
                     name="maintenance">
          <maintenance :wId="wId"
                       :rscd="rscd"></maintenance>
        </el-tab-pane>
        <el-tab-pane label="应急预案"
                     :disabled="tabType"
                     name="contingencyPlan">
          <contingencyPlan :wId="wId"
                           :rscd="rscd"></contingencyPlan>
        </el-tab-pane>
        <el-tab-pane label="水位库容"
                     :disabled="tabType"
                     name="capacity">
          <capacity :wId="wId"
                    :rscd="rscd"></capacity>
        </el-tab-pane>
      </el-tabs>
      <span slot="footer"
            class="dialog-footer">
        <el-button type="primary"
                   v-if="this.activeName=='form'?true:this.activeName=='persons'?true:false"
                   @click="goInfo">暂 存</el-button>
        <el-button v-if="this.activeName=='form'?true:this.activeName=='persons'?true:false"
                   @click="handleClose">取 消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import reservoirManager from '@/api/reservoirManagement/reservoirManager.js'
import req from '@/request.js'
import latitude from '@/mixins/latitude'
import { scrollFormMixin } from '@/mixins/scrollFormMixin'
import reinforcement from './reinforcement.vue'
import safetyAppraisal from './safetyAppraisal.vue'
import dictUtils from '@/components/dict/DictSelectUtils.js'
import maintenance from './maintenance.vue'
import capacity from './capacity.vue'
import contingencyPlan from './contingencyPlan.vue'
import rltFormdailog from './rltForm-dailog.vue'
import { quillEditor } from 'vue-quill-editor'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
import { mapState } from 'vuex'
const toolbarOptions = [
  ['bold', 'italic', 'underline', 'strike'], // 加粗，斜体，下划线，删除线
  ['blockquote', 'code-block'], //引用，代码块
  [
    {
      header: 1
    },
    {
      header: 2
    }
  ], // 几级标题
  [
    {
      list: 'ordered'
    },
    {
      list: 'bullet'
    }
  ], // 有序列表，无序列表
  [
    {
      script: 'sub'
    },
    {
      script: 'super'
    }
  ], // 下角标，上角标
  [
    {
      indent: '-1'
    },
    {
      indent: '+1'
    }
  ], // 缩进
  [
    {
      direction: 'rtl'
    }
  ], // 文字输入方向
  [
    {
      size: ['small', false, 'large', 'huge']
    }
  ], // 字体大小
  [
    {
      header: [1, 2, 3, 4, 5, 6, false]
    }
  ], // 标题
  [
    {
      color: []
    },
    {
      background: []
    }
  ], // 颜色选择
  [
    {
      font: [
        'SimSun',
        'SimHei',
        'Microsoft-YaHei',
        'KaiTi',
        'FangSong',
        'Arial'
      ]
    }
  ], // 字体
  [
    {
      align: []
    }
  ], // 居中
  ['clean'], // 清除样式,
  ['link', 'image'] // 上传图片、上传视频
]
export default {
  name: 'resFormDialog',
  mixins: [scrollFormMixin],
  components: {
    quillEditor,
    reinforcement,
    safetyAppraisal,
    maintenance,
    contingencyPlan,
    capacity,
    rltFormdailog
  },
  props: {
    showFormDia: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: ''
    },
    pId: {
      type: String,
      default: ''
    },
    rscd: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      dialogVisible: false,
      // 步骤条变量
      stepData: [
        {
          title: '基础信息',
          domId: 'step1'
        },
        {
          title: '所在位置',
          domId: 'step2'
        },
        {
          title: '水位特征',
          domId: 'step3'
        }
      ],
      personTypeOne: [],
      activeName: 'form',
      orgIds: [], //组织下拉
      personIds: [], //组织人员下拉
      personTypes: [], //责任人类型
      isHeads: [
        {
          name: '是',
          value: '1'
        },
        {
          name: '否',
          value: '0'
        }
      ], //是否负责人
      tableData: [],
      resTypes: [], //水库类型
      params: {
        resInsList: [],
        persons: [], //责任人
        rscd: null, //水库代码
        rsnm: null, //水库名称
        rsrd: null,//水库注册码
        resType: null, //水库类型
        addvcd: null, //行政区
        cmdptel: null, //主管部门电话
        cpyr: null, //建成年月
        ctcd: null, //所在流域代码
        ddstcp: null, //死库容
        dmcrel: null, //坝顶高程
        dtpl: null, //水面基准
        eslg: null, //水库位置坐标_东经
        maxdmhg: null, //最大坝高
        nrlt: null, //水库位置坐标_北纬
        prgr: null, //工程等别（字典
        prsc: null, //工程规模（参考字典）
        prst: '1', //工程状态（1在建 2已建 9其他）
        rvcd: null, //所在河流代码（参考河流表）
        vltw: null, //水库所在乡镇位置
        waterSource: '0', //水源地
        rsov: null,
        rsfn: null, //水库功能
        hychList: {
          nrstlv: null, //正常蓄水位
          flcnstcp: null, //防洪库容
          ttstcp: null, //总库容
          ddwl: null, //死水位
          ddstcp: null, //死库容
          dsfllv: null, //设计洪水位
          chfllv: null, //校核洪水位
          acstcp: null, //兴利库容
          flsscnwl: null, //期限制水位
          rfstcp: null, //调洪库容
          catchmentArea: null, //水域面积
          watersArea: null, ////集雨面积
          fllv: null //防洪高水位
        },
        wrpRsrDm: {
          damName: null, //大坝名称
          damCode: null, //大坝代码
          damGrad: null, //大坝级别
          engGrad: null, //工程等级
          damTypeMat: null, //大坝材料类型
          ifMainDam: '0', //是否主坝
          damTypeStr: null, //大坝结构类型
          elevSys: null, //高程系统
          damMaxHeig: null, //最大坝高
          damTopLen: null, //坝顶长度
          damTopWid: null, //坝顶宽度
          damTopElev: null, //坝顶高程
          startDate: null, //开工时间
          compDate: null, //建成时间
          damLoc: null, //所在位置
          damLong: null, //坝址断面经度
          damLat: null, //坝址断面纬度
          damCba: null, //坝址控制流域面积
          damAr: null //坝址多年平均径流量
        },
        history: {
          content: null //历史文化内容
        }
      },
      elevSyss: [], //高程系统列表
      damTypeStrs: [], //大坝结构级别
      damTypeMats: [], //大坝材料级别
      damGrads: [], //大坝级别
      ifMainDams: [
        {
          name: '未知',
          value: '0'
        },
        {
          name: '是',
          value: '1'
        },
        {
          name: '否',
          value: '2'
        }
      ], //是否主坝
      rsr: [],
      rvcds: [], //下拉
      ctcds: [], //下拉
      count: 0,
      rsrs: [{}], //水库功能
      prgrs: [], //工程等别（字典
      prscs: [], //工程规模（参考字典)
      dtpls: [], //水面基准
      waterSources: [
        {
          name: '非水源',
          value: '0'
        },
        {
          name: '饮用水源',
          value: '1'
        },
        {
          name: '备用水源',
          value: '2'
        }
      ], //水源地
      multipleSelection: [],
      multipleSelections: [],
      prsts: [
        {
          name: '在建',
          value: '1'
        },
        {
          name: '已建',
          value: '2'
        },
        {
          name: '其他',
          value: '9'
        }
      ],
      cmdps: [], //管理单位数组
      accound: 0,
      basGrads: [], //流域级别字典类型
      basAdNames: [], //行政下拉
      AdName: null, //接受每次选中的值
      counts: 0,
      Content: '',
      isClear: false,
      vuContent: '', //向富文本组件传参
      rules: {
        rscd: [
          {
            required: true,
            message: '请输入水库代码',
            trigger: 'blur'
          }
        ],
        rsrd: [
          {
            required: true,
            message: '请输入水库注册码',
            trigger: 'blur'
          }
        ],
        rsnm: [
          {
            required: true,
            message: '请输入水库名称',
            trigger: 'blur'
          }
        ],
        resType: [
          {
            required: true,
            message: '请选择水库类型',
            trigger: 'blur'
          }
        ],
        prsc: [
          {
            required: true,
            message: '请选择工程规模',
            trigger: 'blur'
          }
        ],
        rsfn: [
          {
            required: true,
            message: '请选择水库功能',
            trigger: 'blur'
          }
        ],
        prst: [
          {
            required: true,
            message: '请选择工程状态',
            trigger: 'blur'
          }
        ],
        waterSource: [
          {
            required: true,
            message: '请选择水源地',
            trigger: 'blur'
          }
        ],
        addvcd: [
          {
            required: true,
            message: '请选择行政区划',
            trigger: 'blur'
          }
        ]
      },
      // 富文本配置
      editorOption: {
        placeholder: '请在这里输入',
        theme: 'snow', //主题 snow/bubble
        modules: {
          history: {
            delay: 1000,
            maxStack: 50,
            userOnly: false
          },
          toolbar: {
            container: toolbarOptions,
            handlers: {
              image: function (value) {
                if (value) {
                  // 调用element的图片上传组件
                  document.querySelector('.avatar-uploader input').click()
                } else {
                  this.quill.format('image', false)
                }
              }
            }
          }
        }
      },
      uploadUrl: window.context.portal + '/file/v1/upload', // 服务器上传地址
      accept: '.jpg,.jpeg,.png,.JPG,.JPEG,.gif,.PNG,.GIF',
      previewUrl:
        window.context.portal + '/file/onlinePreviewController/v1/getFileById_',
      waterId: null,
      tabType: true, //tab栏禁用状态
      wId: null //水库保存成功后端返回id
    }
  },
  created () {
    this.getSysDict()
    this.getDetailInfo()
    this.getorgIds()
    this.getTreets()
    // 行政区查询
    reservoirManager.getbasAdName({}, res => {
      this.basAdNames = res.value
    })
    // 管理树
    reservoirManager.getrgTree({}, res => {
      this.cmdps = res.value
    })
    this.wId = this.pId
    this.rscd = this.rscd
    this.personClass = dictUtils.getDictItemsFromCache('zrlx')
    console.log(this.personClass);
    this.personClass.forEach(e => {
      console.log(e.value);
      if (e.value == 1) {
        this.personTypes = e.lowerDic.zrrlx
      } else if (e.value == 2) {
        this.personTypess = e.lowerDic.zrrlx
      }
    })
  },
  computed: mapState({
    header: state => {
      return {
        Authorization: `Bearer ${state.login.currentUser.token}`
      }
    }
  }),
  methods: {
    deadLevs (val) {
      switch (val) {
        case '1':
          this.params.eslg = latitude.TreeFour(this.params.eslg)
          break
        case '2':
          this.params.nrlt = latitude.TreeFour(this.params.nrlt)
          break
        case '3':
          this.params.wrpRsrDm.damLong = latitude.TreeFour(
            this.params.wrpRsrDm.damLong
          )
          break
        case '4':
          this.params.wrpRsrDm.damLat = latitude.TreeFour(
            this.params.wrpRsrDm.damLat
          )
          break
        // this.params.hychList.ttstcp = this.TenTwo(
        // 	this.params.hychList.ttstcp
        // )
        case '5':
          this.params.wrpRsrDm.damCba = this.TenTwo(this.params.wrpRsrDm.damCba)
          break
        case '6':
          this.params.wrpRsrDm.damAr = this.TenTwo(this.params.wrpRsrDm.damAr)
          break
        case '7':
          this.params.hychList.catchmentArea = this.NineTwo(
            this.params.hychList.catchmentArea
          )
          break
        case '8':
          this.params.hychList.watersArea = this.NineTwo(
            this.params.hychList.watersArea
          )
          break
        case '9':
          this.params.hychList.nwsa = this.NineTwo(this.params.hychList.nwsa)
          break
        default:
          this.params.nrlt = latitude.TreeFour(this.params.nrlt)
      }
    },
    rvcdChange (val) {
      if (val) {
        this.params.rvcd = val[val.length - 1]
      }
    },
    change (val) { },
    getMsgFormSon (data) {
      this.params.history.content = data
    },
    getTreets () {
      reservoirManager.getRvcds({}, res => {
        this.rvcds = res.value
      })
      // reservoirManager.getCtcds({}, (res) => {
      //     this.ctcds = res.value
      // })
    },
    changeRsr (val) {
      this.params.rsfn = val.toString()
    },
    getorgIds () {
      // 获取组织
      reservoirManager.getorgId({}, res => {
        this.orgIds = res.value
      })
    },
    changeOrgIds (val) {
      if (val.orgId) {
        this.personIds = []
        val.orgId = val.orgId[val.orgId.length - 1]
        val.personId = null
        reservoirManager.getpersonId(
          {
            val
          },
          res => {
            this.personIds = res.value
            this.$set(this.personIds)
          }
        )
      } else {
        this.personIds = []
        val.orgId = ''
        this.$set(this.personIds)
      }
    },
    //   changePerson(val) {
    //    console.log(val);
    // this.personClass.forEach(e=>{
    //  if(e.value==val){
    // 	 this.personTypes=e.lowerDic.zrrlx
    //  }
    // })
    //   },
    changePids (val) {
      if (val.personId) {
        val.personId = val.personId
      } else {
        val.personId = ''
      }
    },
    handleClick (tab, event) { },
    handleSelectionChange (val) {
      this.multipleSelection = val
    },
    handleChanges (val) {
      this.multipleSelections = val
    },
    //指定一个key标识这一行的数据
    getRowKey (row) {
      return row.id
    },
    chfllvs () {
      this.params.hychList.chfllv = this.SixTwo(this.params.hychList.chfllv)
    },
    dsfllvs () {
      this.params.hychList.dsfllv = this.SixTwo(this.params.hychList.dsfllv)
    },
    damTopWids () {
      this.params.wrpRsrDm.damTopWid = this.FiveTwo(
        this.params.wrpRsrDm.damTopWid
      )
    },
    flsscnwls () {
      this.params.hychList.flsscnwl = this.SixTwo(this.params.hychList.flsscnwl)
    },
    damMaxHeigs () {
      this.params.wrpRsrDm.damMaxHeig = this.FiveTwo(
        this.params.wrpRsrDm.damMaxHeig
      )
    },
    damTopLens () {
      this.params.wrpRsrDm.damTopLen = this.FiveTwo(
        this.params.wrpRsrDm.damTopLen
      )
    },
    nrstlvs () {
      this.params.hychList.nrstlv = this.SixTwo(this.params.hychList.nrstlv)
    },
    deadLevsl () {
      this.params.hychList.ddwl = this.ElghtThreen(this.params.hychList.ddwl)
    },
    totCaps () {
      this.params.hychList.ttstcp = this.TenTwo(this.params.hychList.ttstcp)
    },
    dikeTopWidMaxs () {
      this.params.wrpRsrDm.damTopElev = this.SixTwo(
        this.params.wrpRsrDm.damTopElev
      )
    },
    benResCaps () {
      this.params.hychList.acstcp = this.NineTwo(this.params.hychList.acstcp)
    },
    deadCaps () {
      this.params.hychList.ddstcp = this.NineTwo(this.params.hychList.ddstcp)
    },
    flcoCaps () {
      this.params.hychList.flcnstcp = this.NineTwo(
        this.params.hychList.flcnstcp
      )
    },
    // dmcrels(val) {
    //     switch (val) {
    //         case '1':
    //             this.params.dmcrel = latitude.FourTwo(this.params.dmcrel)
    //             break
    //         case '2':
    //             this.params.catchmentArea = latitude.FourTwo(
    //                 this.params.catchmentArea
    //             )
    //             break
    //         default:
    //             this.params.watersArea = latitude.FourTwo(
    //                 this.params.watersArea
    //             )
    //     }
    // },
    TenTwo (value) {
      value = value.replace(/^0*(0\.|[1-3])/, '$1')
      value = value.replace(/[^\d.]/g, '') //清除"数字"和"."以外的字符
      value = value.replace(/^\./g, '') //验证第一个字符是数字而不是字符
      value = value.replace(/\.{1,}/g, '.') //只保留第一个.清除多余的
      value = value
        .replace('.', '$#$')
        .replace(/\./g, '')
        .replace('$#$', '.')
      value = value.replace(/^(\-)*(\d*)\.(\d\d).*$/, '$1$2.$3') //只能输入两个小数
      value =
        value.indexOf('.') > 0
          ? value.split('.')[0].substring(0, 8) + '.' + value.split('.')[1]
          : value.substring(0, 8)
      return value
    },
    NineTwo (value) {
      value = value.replace(/^0*(0\.|[1-3])/, '$1')
      value = value.replace(/[^\d.]/g, '') //清除"数字"和"."以外的字符
      value = value.replace(/^\./g, '') //验证第一个字符是数字而不是字符
      value = value.replace(/\.{1,}/g, '.') //只保留第一个.清除多余的
      value = value
        .replace('.', '$#$')
        .replace(/\./g, '')
        .replace('$#$', '.')
      value = value.replace(/^(\-)*(\d*)\.(\d\d).*$/, '$1$2.$3') //只能输入两个小数
      value =
        value.indexOf('.') > 0
          ? value.split('.')[0].substring(0, 7) + '.' + value.split('.')[1]
          : value.substring(0, 7)
      return value
    },
    ElghtThreen (value) {
      value = value.replace(/^0*(0\.|[1-3])/, '$1')
      value = value.replace(/[^\d.]/g, '') //清除"数字"和"."以外的字符
      value = value.replace(/^\./g, '') //验证第一个字符是数字而不是字符
      value = value.replace(/\.{1,}/g, '.') //只保留第一个.清除多余的
      value = value
        .replace('.', '$#$')
        .replace(/\./g, '')
        .replace('$#$', '.')
      value = value.replace(/^(\-)*(\d*)\.(\d\d\d).*$/, '$1$2.$3') //只能输入两个小数
      value =
        value.indexOf('.') > 0
          ? value.split('.')[0].substring(0, 5) + '.' + value.split('.')[1]
          : value.substring(0, 5)
      return value
    },
    SixTwo (value) {
      value = value.replace(/^0*(0\.|[1-3])/, '$1')
      value = value.replace(/[^\d.]/g, '') //清除"数字"和"."以外的字符
      value = value.replace(/^\./g, '') //验证第一个字符是数字而不是字符
      value = value.replace(/\.{1,}/g, '.') //只保留第一个.清除多余的
      value = value
        .replace('.', '$#$')
        .replace(/\./g, '')
        .replace('$#$', '.')
      value = value.replace(/^(\-)*(\d*)\.(\d\d).*$/, '$1$2.$3') //只能输入两个小数
      value =
        value.indexOf('.') > 0
          ? value.split('.')[0].substring(0, 4) + '.' + value.split('.')[1]
          : value.substring(0, 4)
      return value
    },
    FiveTwo (value) {
      value = value.replace(/^0*(0\.|[1-3])/, '$1')
      value = value.replace(/[^\d.]/g, '') //清除"数字"和"."以外的字符
      value = value.replace(/^\./g, '') //验证第一个字符是数字而不是字符
      value = value.replace(/\.{1,}/g, '.') //只保留第一个.清除多余的
      value = value
        .replace('.', '$#$')
        .replace(/\./g, '')
        .replace('$#$', '.')
      value = value.replace(/^(\-)*(\d*)\.(\d\d).*$/, '$1$2.$3') //只能输入两个小数
      value =
        value.indexOf('.') > 0
          ? value.split('.')[0].substring(0, 3) + '.' + value.split('.')[1]
          : value.substring(0, 3)
      return value
    },
    onhouChange (val) {
      if (val) {
        this.params.addvcd = val[val.length - 1]
      }
      // let arr = this.basAdNames.filter((ite) => ite.code === val[0])
      // this.calleArr(arr, val[val.length - 1])
    },
    addAcount () {
      this.dialogVisible = true
    },
    deletAcount () {
      if (this.multipleSelection && this.multipleSelection.length) {
        this.multipleSelection.forEach(item => {
          this.params.resInsList.forEach((data, i) => {
            if (item.id == data.id) {
              this.params.resInsList.splice(i, 1)
            }
          })
        })
      }
    },
    insort (val, index) {
      let arr = JSON.parse(JSON.stringify(this.params.persons))
      arr.splice(index, 1)
      arr.forEach(e => {
        if (val.sn == e.sn) {
          this.$message.warning('存在相同排序号');
        }
      })

    },
    addAcounts () {
      const num = this.counts++
      let count = this.params.persons.length + 1
      this.params.persons.push({
        ident: num,
        orgId: '',
        personId: '',
        sn: count
      })
    },
    arrayRepeat (array1, array2) {
      var result = []
      for (var i = 0; i < array2.length; i++) {
        var obj = array2[i]
        var num = obj.destId
        var isExist = false
        for (var j = 0; j < array1.length; j++) {
          var aj = array1[j]
          var n = aj.destId
          if (n === num) {
            isExist = true
            break
          }
        }
        if (!isExist) {
          result.push(obj)
        }
      }
      return result
    },
    //判断是否显示按钮
    leaveTab (activeName, oldActiveName) {
      this.activeName = activeName
    },
    deletAcounts () {
      if (this.multipleSelections && this.multipleSelections.length) {
        this.multipleSelections.forEach(item => {
          this.params.persons.forEach((data, i) => {
            if (item.id == data.id) {
              this.params.persons.splice(i, 1)
            }
          })
        })
      }
    },
    // 根据ID查询
    getDetailInfo () {
      if (this.title === '修改') {
        this.tabType = false
        reservoirManager.getbasAdName({}, res => {
          this.basAdNames = res.value
        })
        reservoirManager.getpersonId({}, res => {
          this.personIds = res.value
        })
        // this.getSysDict()
        reservoirManager.detailId(this.pId, res => {
          if (!res.value.wrpRsrDm) {
            res.value.wrpRsrDm = {}
          }
          this.params = res.value
          // this.params.persons.sort((a, b) => {
          //    return a.sn - b.sn
          //  })
          this.vuContent = res.value.history.content
          // this.personIds.forEach(e=>{
          //   if(this.params.persons){
          //     if(this.params.persons.personId===e.orgId){
          //       this.params.persons.personId=e.orgId;
          //     }
          //   }
          // })
          let arr = res.value.rsfn.split('')
          arr.forEach((e, i) => {
            if (e.indexOf(',') > '-1' || e.indexOf(',') > -1) {
              arr.splice(i, 1)
            }
          })
          this.rsr = arr
        })
      }
    },
    handleClose () {
      this.params = {
        rsov: null,
        benResCap: null, //兴利库容
        rscd: null, //水库代码
        rsnm: null, //水库名称
        resType: null, //水库类型
        cmdptel: null, //主管部门电话
        cpyr: null, //建成年月
        ctcd: null, //所在流域代码
        deadCap: null, //死库容
        ddwl: null, //死水位
        dmcrel: null, //坝顶高程
        dsfllv: null, //设计洪水位
        dtpl: null, //水面基准
        eslg: null, //水库位置坐标_东经
        flcoCap: null, //防洪库容
        flsscnwl: null, //期限制水位
        maxdmhg: null, //最大坝高
        nrlt: null, //水库位置坐标_北纬
        nrstlv: null, //正常蓄水位
        prgr: null, //工程等别（字典
        prsc: null, //工程规模（参考字典）
        prst: null, //工程状态（1在建 2已建 9其他
        rvcd: null, //所在河流代码（参考河流表）
        totCap: null, //总库容
        vltw: null //水库所在乡镇位置
      }
      this.$emit('closeFormDiao')
    },
    goInfo (e) {
      this.$refs.formInfo.validate(valid => {
        if (valid) {
          if (this.title === '新增') {
            let canAdd = true
            if (this.params.resInsList.length != 0) {
              this.params.resInsList.forEach(item => {
                if (!item.account || !item.password) {
                  canAdd = false
                }
              })
            }
            if (canAdd) {

              reservoirManager.addSave(this.params, response => {
                if (response.state) {
                  if (response.value) {
                    this.tabType = false
                    this.wId = response.value
                  }
                  this.$notify({
                    type: 'success',
                    message: '暂存成功',
                    duration: 2000
                    // offset: 80
                  })
                  this.$emit('closeFormDiao')
                  this.$emit('refList')
                } else {
                }
                // this.$emit('closeFormDiao')
              })
            }
          }
          if (this.title === '修改') {
            reservoirManager.upData(this.params, response => {
              if (response.state) {
                this.$notify({
                  type: 'success',
                  message: '修改成功',
                  duration: 2000
                  // offset: 80
                })
                this.$emit('closeFormDiao')
                this.$emit('refList')
                // this.$message.success(response.message)
              } else {
                //  this.$message.success(response.message)
              }
              // this.$emit('closeFormDiao')
              // this.$router.go(-1)
            })
          }
        } else {
          return false
        }
      })
    },
    //获取字典数据
    getSysDict () {
      let portal = window.context.portal
      return new Promise((resolve, reject) => {
        req.post(portal + '/sys/sysDictionary/v1/queryAllDictItems').then(
          response => {
            resolve(response.data)
            if (this.title == '修改') {
              this.prgrs = response.data.gcdb
              this.prscs = response.data.gcgm
              this.resTypes = response.data.sklx
              this.basGrads = response.data.lyjb
              this.dtpls = response.data.szjm
              this.rsrs = response.data.skgn
              this.ctcds = response.data.ly
              // this.personTypes = response.data.zrrlx
              this.damGrads = response.data.dbjb
              this.damTypeMats = response.data.dbcl
              this.damTypeStrs = response.data.dbjg
              this.elevSyss = response.data.gcxt
            } else {
              this.prgrs = response.data.gcdb
              this.params.prgr = this.prgrs[0].value
              this.params.wrpRsrDm.engGrad = this.prgrs[0].value
              this.prscs = response.data.gcgm
              this.resTypes = response.data.sklx
              this.basGrads = response.data.lyjb
              this.dtpls = response.data.szjm
              this.params.dtpl = this.dtpls[0].value
              this.rsrs = response.data.skgn
              this.ctcds = response.data.ly
              // this.personTypes = response.data.zrrlx
              this.damGrads = response.data.dbjb
              this.params.wrpRsrDm.damGrad = this.damGrads[0].value
              this.damTypeMats = response.data.dbcl
              this.params.wrpRsrDm.damTypeMat = this.damTypeMats[0].value
              this.damTypeStrs = response.data.dbjg
              this.params.wrpRsrDm.damTypeStr = this.damTypeStrs[0].value
              this.elevSyss = response.data.gcxt
              this.params.wrpRsrDm.elevSys = this.elevSyss[0].value
              this.params.resType = this.resTypes[0].value
              this.params.prsc = this.prscs[0].value
            }
          },
          error => {
            reject(error)
          }
        )
      })
    },
    changebasAdName (val) {
      if (val) {
        this.params.addvcd = val.toString()
      } else {
        this.params.addvcd = null
      }
    },
    changeArea (val) {
      if (val) {
        this.params.basArea = val
      } else {
        this.params.basArea = null
      }
    },
    changecrOverType (val) {
      if (val) {
        this.params.crOverType = val
      } else {
        this.params.crOverType = null
      }
    },
    changebasGrad (val) {
      if (val) {
        this.params.basGrad = val
      } else {
        this.params.basGrad = null
      }
    },

    //富文本

    // 失去焦点
    onEditorBlur (editor) { },
    // 获得焦点
    onEditorFocus (editor) { },
    // 开始
    onEditorReady (editor) { },
    // 值发生变化
    onEditorChange (editor) {
      this.params.history.content = editor.html
    },
    // 父组件获取数据
    getVal () {
      return this.params.history.content
    },

    beforeUpload (file) {
      return true
    },
    uploadSuccess (res) {
		console.log(res);
      // 获取富文本组件实例
      let quill = this.$refs.QuillEditor.quill
      // 如果上传成功
      if (res) {
        // 获取光标所在位置
        let fileId = res.fileId
        let url = this.previewUrl + fileId
        let length = quill.getSelection().index
        // 插入图片，res为服务器返回的图片链接地址
        quill.insertEmbed(length, 'image', url)
        // 调整光标到最后
        quill.setSelection(length + 1)
      } else {
        // 提示信息，需引入Message
        this.$message.error('图片插入失败！')
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.el-divider--horizontal {
  margin: 24px 0 5px 0;
  height: 7px !important;
  background: #88b4dd !important;

  .el-divider__text {
    font-size: 16px !important;
  }
}

.redBull {
  border: 1px solid red;
}

/deep/.ql-container {
  height: 400px;
}

// ::v-deep .el-input__inner {
//   border: 1px solid orange;
// }
// ::v-deep .el-textarea__inner {
//   border: 1px solid orange;
// }
// 级联选择器el-cascader，通过点击label文字部分选中
// 级联选择器el-cascader，通过点击label文字部分选中
.cascader {
  .el-cascader-panel {
    .el-radio {
      width: 100%;
      height: 100%;
      z-index: 10;
      position: absolute;
      top: 10px;
      right: -10px;
    }
    .el-radio__input {
      visibility: hidden; //隐藏单选框，不隐藏就不用设置
    }
    .el-cascader-node__postfix {
      top: 10px;
    }
  }
}
</style>
