<template>
  <modal :show.sync="show" v-ref:modal :backdrop="isBack">
    <div slot="modal-header" class="modal-header">
      <span class="modal-title font">
        新增设备信息
      </span>
    </div>
    <div slot="modal-body" class="modal-body">
      <div style="width: 95%;margin: auto">
        <form>
          <div v-for="row in f_items">
            <!--   照片循环   -->
            <div class="row col-xs-12 col-sm-6 col-md-6" v-if="row.type == 'picture'" v-show="row.isshow">
              <label class="control-label font text-left">{{ row.f_item_name }}<span
                v-if="row.checkmust">*</span></label>
              <div class="form-group col-sm-12">
                <div class="auto">
                  <div class="panel">
                    <div class="panel-body panel-self"
                         style="background-color: #F8F8F8;width: 100%;height: 260px;position: relative"
                         :style="isKHKitchen(row.f_item_name) ? (item.f_no_checkplan === '开户安检单' ? 'border: 2px solid red !important;' : 'border: 1px solid #499edf !important;') : ''">
                      <div class="row" style="height: 240px;overflow: scroll;top: 1px">
                        <div class="col-sm-4">
                          <img-self :src="row.f_path" :alt="row.f_item_name" width="150" height="200"></img-self>
                        </div>
                      </div>
                      <div class="row text-right div-photo">
                        <button type="button" name="button" class="btn btn-primary btn-photo"
                                @click="takePic($index, row.f_item_name)" v-if="role!='androidview'">拍照
                        </button>
                        &nbsp;&nbsp;&nbsp;&nbsp;<img src="../../assets/remove.png" :class="style__"
                                                     @click="delfile($index, row.f_path)" v-if="role!='androidview'"
                                                     style="width: 20px;"/>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!--   数字类型循环   -->
            <div class="row" v-if="row.type == 'number'" style="margin-top: 6px" v-show="row.isshow">
              <label class="col-xs-4 control-label font text-left">{{ row.f_item_name }}<span
                v-if="row.checkmust">*</span></label>
              <div class="col-xs-8">
                <div :class="row.f_item_name == '卡号'?'col-xs-8':''">
                  <input type="text" class="form-control" v-model="row.f_item_value" maxlength="20"
                         :readonly="role == 'androidview' || row.f_item_name == '新表底数' || row.f_item_name == '总购气量' || row.f_item_name == '剩余气量参考' || row.f_item_name == '剩余金额参考' || row.f_item_name == '换表后累购'"
                         onkeyup="value=value.replace(/[^\d\.]/g,'')">
                </div>
                <div :class="row.f_item_name == '卡号'?'col-xs-4':''">
                  <img src="../../assets/saoyisao.png" class="col-xs-4" style="width: 30px;" alt="" @click="saoyisao()"
                       v-if="row.f_item_name == '卡号'"
                       v-show="meterNumberReasonsBool||item.f_no_checkplan === '点火通气单'">
                </div>
              </div>
            </div>
            <!--   下拉框类型循环   -->
            <div class="row select-overspread"
                 v-if="row.type == 'selector' && row.f_item_name !== '表编号修正原因' && row.f_item_name !== '表封号修正原因'"
                 style="margin-top: 6px;width: 100%" v-show="row.isshow">
              <label class="col-xs-4 control-label font text-left">{{ row.f_item_name }}<span
                v-if="row.checkmust">*</span></label>
              <div class="col-xs-8 form-input-group">
                <v-select :value.sync="row.selected"
                          v-model="row.selected"
                          placeholder='请选择'
                          :options="row.options"
                          :disabled="role == 'androidview'"
                          @change="changse"
                          @click="transelation($index)"
                          :multiple="row.multiple"
                          :close-on-select="!row.multiple" clear-button></v-select>
              </div>
              <!--:multiple="row.multiple"-->
            </div>
            <!--   字符类型表编号表封号值循环   -->
            <div class="row"
                 v-if="row.type === 'string' && row.f_item_name !== '表编号' && row.f_item_name !== '表封号' "
                 style="margin-top: 6px" v-show="row.isshow">
              <label class="col-xs-4 control-label font text-left">{{ row.f_item_name }}<span
                v-if="row.checkmust">*</span></label>
              <div class="col-xs-8">
                <input type="text" class="form-control" maxlength="100" v-model="row.f_item_value"
                       :readonly="role === 'androidview' || (row.f_item_name ==='剩余金额') || (row.f_item_name === '剩余气量')"
                       :style="isKHKitchen(row.f_item_name) ? (item.f_no_checkplan === '开户安检单' ? 'border: 2px solid red !important;' : 'border: 1px solid #499edf !important;') : ''"
                       @input="handleInput(row)">
              </div>
            </div>
            <!--   表编号 表封号修正 -->
            <div class="row" v-if="row.f_item_name === '表编号' || row.f_item_name === '表封号'" style="margin-top: 6px"
                 v-show="row.isshow">
              <label class="col-xs-4 control-label font text-left">{{ row.f_item_name }}<span
                v-if="row.checkmust">*</span></label>
              <div class="col-xs-8">
                <div class="col-xs-8">
                  <input type="text" class="form-control" maxlength="100" v-model="row.f_item_value"
                         :readonly="role === 'androidview' || (item.f_no_checkplan !== '点火通气单' && row.f_item_name === '表编号' && meterNumberReasonsBool===false)
                         || (item.f_no_checkplan !== '点火通气单' && row.f_item_name === '表封号' && meterTitlesReasonBool===false)">
                </div>
                <div class="col-xs-4">
                  <button v-if="item.f_no_checkplan !== '点火通气单'" type="button" class="btn-danger btn text-rigth"
                          @click="showMeterNumberReason(row.f_item_name)">修正
                  </button>
                </div>
              </div>
            </div>
            <!--   表编号 表封号修正原因 -->
            <div class="row select-overspread"
                 v-if="(row.f_item_name === '表编号修正原因' && meterNumberReasonsBool) || (row.f_item_name === '表封号修正原因' && meterTitlesReasonBool)"
                 style="margin-top: 6px;width: 100%">
              <label class="col-xs-4 control-label font text-left" style="color: red">{{ row.f_item_name }}</label>
              <div class="col-xs-8 form-input-group">
                <v-select :value.sync="row.selected"
                          v-model="row.selected"
                          placeholder='请选择'
                          :options="row.options"
                          :disabled="role == 'androidview'"
                          @change="changse"
                          @click="transelation($index)"
                          :close-on-select="!row.multiple" clear-button></v-select>
              </div>
            </div>
            <!--   inputSeselct 类型 -->
            <div class="row" v-if="row.type == 'inputSelector'" style="margin-top: 6px" v-show="row.isshow">
              <label class="col-xs-4 control-label font text-left">{{ row.f_item_name }}<span
                v-if="row.checkmust">*</span></label>
              <div class="col-xs-8">
                <input-select class="col-xs-8"
                              :value.sync="row.selected"
                              v-model="row.selected"
                              :readonly="false"
                              :options="row.options"
                              @change="changse"
                              @click="transelation($index)"></input-select>
              </div>
            </div>
            <!--  下拉框类型并且没有path路径 -->
            <div class="form-group col-sm-12" v-if="row.type == 'selector' && row.f_path != ''"
                 style="margin-top: 40px">
              <div class="auto">
                <div class="panel">
                  <div class="panel-body panel-self" style="background-color: #F8F8F8;width: 100%;height: 260px">
                    <div class="row" style="height: 240px;top: 1px">
                      <div class="col-sm-4">
                        <img-self :src="row.f_path" :alt="row.f_item_name" width="150" height="200"></img-self>
                      </div>
                    </div>
                    <div class="row text-right div-photo">
                      <button type="button" name="button" class="btn btn-primary btn-photo"
                              @click="takePic($index, row.f_item_name)" v-if="role != 'androidview'">拍照
                      </button>
                      &nbsp;&nbsp;&nbsp;&nbsp;<img src="../../assets/remove.png" :class="style__"
                                                   v-if="role != 'androidview'" @click="delfile($index, row.f_path)"
                                                   style="width: 20px;"></img>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <div class="form-group col-sm-12"
                 v-if="row.type == 'selector' && row.tooltip != undefined  && row.tooltip != '' "
                 style="margin-top: 40px">
              <div class="auto">
                <div class="panel">
                  <div class="panel-body panel-self" style="background-color: #F8F8F8;width: 100%;height: auto">
                    {{ row.tooltip }}
                  </div>
                </div>
              </div>
            </div>
            <!-- 时间类型 -->
            <div class="form-group col-sm-12" v-if="row.type == 'date'" style="margin-top: 6px" v-show="row.isshow">
              <label class="col-xs-4 control-label font text-left">{{ row.f_item_name }}<span
                v-if="row.checkmust">*</span></label>
              <div class="col-xs-8">
                <input type="date" v-model="row.f_item_value" @click="transelation($index)"
                       :disabled="row.f_item_name == '到期时间'" class="form-control" id="f_item_name"/>
              </div>
            </div>
          </div>
        </form>
      </div>
    </div>
    <div slot="modal-footer" class="modal-footer">
      <button type="button" class="btn btn-cancel" @click="cancel()">取消</button>
      <button type="button" class="btn btn-save" @click="save()">确定</button>
    </div>
  </modal>


</template>

<script>
import Vue from 'vue'
import * as Util from '../Util'
import Datepicker from 'vue-client/src/vue-strap/src/Datepicker'
import {HttpResetClass} from "vue-client";

export default {
  title: '设备项信息',
  data() {
    return {
      isBack: false,
      paper: this.$parent.$parent.$parent.data,
      templateInfo: this.$parent.$parent.$parent.templateInfo,
      item: this.$parent.$parent.$parent.item,
      f_table_base: {},
      f_items: [],
      page: {},
      other: '',
      meterNumberReasonsBool: false, //表编号修正输入框是否显示 为true显示输入框并显示原因选择
      meterTitlesReasonBool: false, //表封号修正输入框是否显示 为true显示输入框并显示原因选择
      selectindex: null,
      lives: [{label: '是', value: '是'}, {label: '否', value: '否'}],
      f_live_dispose: '否'
    }
  },
  /**
   *   config: 配置文件
   *   role：inspect
   *   device: 当前循环的devices的item
   *   idx:  当前操作的device的id
   *   show: 显示和关闭
   *   operation: edit、add
   *
   */
  props: ['config', 'device', 'idx', 'show', 'operation', 'role'],
  components: {
    Datepicker
  },
  ready() {
    // 初始化时表号修改原因如果有值则让表号修改原因显示让表号可修改 表封号修改原因同理
    console.log('this.paper.f_number_change_reason==>' + this.paper.f_number_change_reason)
    console.log('this.paper.f_title_change_reason==>' + this.paper.f_title_change_reason)

    this.paper.f_number_change_reason ? (this.meterNumberReasonsBool = true) : (this.meterNumberReasonsBool = false)
    this.paper.f_title_change_reason ? (this.meterTitlesReasonBool = true) : (this.meterTitlesReasonBool = false)
    // 点火通气模板数据
    console.log('templateInfo =>  ' + JSON.stringify(this.templateInfo))
    console.log('deviec--role=>' + this.role)
    if (Vue.config.safecheck != undefined) {
      if (Vue.config.safecheck.ApproveConfig != undefined) {
        if (Vue.config.safecheck.ApproveConfig.livedispose != undefined) {
          this.livedispose = Vue.config.safecheck.ApproveConfig.livedispose
        }
      }
    }

    /** 开始 创建页面所需数据  **/

    this.$set('piece', this.paper['device' + this.device.n][this.idx])

    console.log('set之后的piece====》' + JSON.stringify(this.piece))
    console.log('this.config====》' + JSON.stringify(this.config))
    let n = 0
    for (let item in this.config[this.device.device].items) {
      let index = this.config[this.device.device].items[item].index - 1
      this.$set('page.options' + index, [])
      console.log('this.config[this.device.device].items=' + JSON.stringify(this.config[this.device.device].items))
      console.log('item=' + JSON.stringify(item)) // 时间
      console.log('this.device.device=' + JSON.stringify(this.device.device)) // 报警器
      let f_item_value
      if (this.config[this.device.device].items[item].type == 'selector' || this.config[this.device.device].items[item].type == 'checkbox') {
        f_item_value = []
        if (this.device.device == '灶具' || this.device.device == '热水器' || this.device.device == '壁挂锅炉' || this.device.device == '抽油机' || this.device.device == '报警器') {
          // 循环当前选中的安检大项中的配置文件 如壁挂炉、燃气表（this.device.device）等 用于判断该安检大项的 是否安装 有否 的默认值
          let DefaultValueThis = ''
          for (let item_temp in this.config[this.device.device].items) {
            if (item_temp == '有否' || item_temp == '是否安装') {
              for (let defitem in this.config[this.device.device].items[item_temp].options) {
                let defopt = this.config[this.device.device].items[item_temp].options[defitem]
                if (defopt.isdefault) {
                  DefaultValueThis = defopt.data
                }
              }
            }
          }
          console.log('当前选中的大项为' + this.device.device + '当前有否或是否安装的默认值为' + DefaultValueThis)
          // 当是否安装为是 有否为有  循环每一项配置信息中的选项（并赋值，否则初始化时不予赋值）
          if (DefaultValueThis == '是' || DefaultValueThis == '有') {
            for (let defitem in this.config[this.device.device].items[item].options) {
              let defopt = this.config[this.device.device].items[item].options[defitem]
              if (defopt.isdefault) {
                console.log('defopt', defopt)
                f_item_value[0] = defopt.data
              }
            }
          }
        } else {
          for (let defitem in this.config[this.device.device].items[item].options) {
            let defopt = this.config[this.device.device].items[item].options[defitem]
            if (defopt.isdefault) {
              console.log('defopt', defopt)
              f_item_value[0] = defopt.data
            }
          }
        }
      } else if (this.config[this.device.device].items[item].type == 'radio') {
        //为radio添加默认值
        f_item_value = ''
        console.log('进入单选-', JSON.stringify(this.config[this.device.device].items[item]))
        for (let defitem in this.config[this.device.device].items[item].options) {
          console.log('选项1111-', JSON.stringify(defitem))
          let defopt = this.config[this.device.device].items[item].options[defitem]
          if (defopt.isdefault) {
            console.log('defopt', JSON.stringify(defopt))
            f_item_value = defopt.data
          }
        }
      } else {
        let value = this.getTemplateValue(this.device.device, item)
        console.log('value => ' + value)
        f_item_value = this.chooseInit(value, this.config[this.device.device].items[item].data)
      }
      console.log('f_item_value ====== > ' + JSON.stringify(f_item_value))
      let checkmust = this.config[this.device.device].items[item].checkmust
      if (this.item.f_no_checkplan === '开户安检单') {
        if (item === '现场照片' || item === 'KF告知书照片' || item === 'KF告知书编号') {
          checkmust = true
        }
      }
      let it = {
        type: this.config[this.device.device].items[item].type,
        f_item_name: item,
        checkmust: checkmust,
        f_item_value: f_item_value,
        f_is_defect: '',
        multiple: this.config[this.device.device].items[item].multiple == true ? this.config[this.device.device].items[item].multiple : false,
        isshow: this.config[this.device.device].items[item].isshow == false ? this.config[this.device.device].items[item].isshow : true,
        f_path: '',
        tooltip: '',
        f_live_dispose: '',
        needPhoto: false
      }
      // 将it对象绑定给当前循环的item上
      this.$set('f_items[' + index + ']', it)
      if (this.config[this.device.device].items[item].type == 'selector' || this.config[this.device.device].items[item].type == 'inputSelector') {
        for (let i in this.config[this.device.device].items[item].options) {
          this.page['options' + index].push({
            label: this.config[this.device.device].items[item].options[i].data,
            value: this.config[this.device.device].items[item].options[i].data
          })
        }
        if (this.config[this.device.device].items[item].type == 'selector') {
          // 将当前循环的selector后的f_item_value 双向绑定给当前循环的selected属性
          this.$set('f_items[' + index + '].selected', f_item_value)
        } else if (this.config[this.device.device].items[item].type == 'inputSelector') {
          this.$set('f_items[' + index + '].selected', f_item_value)
        }

        this.$set('f_items[' + index + '].options', this.page['options' + index])

        if (this.item.f_no_checkplan === '点火通气单') {
          // 加载配置文件信息
          for (let i in this.config[this.device.device].items[item].options) {
            if (this.config[this.device.device].items[item].options[i].isdefault == true) {
              console.log('this.config[this.device.device].items[item].options[i].data===>' + JSON.stringify(this.config[this.device.device].items[item].options[i].data))
              if (this.config[this.device.device].items[item].type == 'selector') {
                this.f_items[index].selected.push(this.config[this.device.device].items[item].options[i].data)
              } else if (this.config[this.device.device].items[item].type == 'inputSelector') {
                this.$set('f_items[' + index + '].selected', this.config[this.device.device].items[item].options[i].data)
              }
            }
          }
          // 加载模板信息
          let value = this.getTemplateValue(this.device.device, item)
          console.log('点火通气单返回value => ' + value)
          if (value) {
            if (this.config[this.device.device].items[item].type == 'selector') {
              console.log('点火通气赋值模板信息' + item + '原来的值为' + JSON.stringify(this.f_items[index].selected))
              this.f_items[index].selected.push(value)
              console.log('赋值之后的值为' + JSON.stringify(this.f_items[index].selected))
            } else if (this.config[this.device.device].items[item].type == 'inputSelector') {
              this.$set('f_items[' + index + '].selected', value)
            }
          }
        }
        console.log('lllllllllllllllllllthis.f_items===>' + JSON.stringify(this.f_items))
      }
      n = n + 1
    }
    // TODO 更新值
    //   if (this.f_no_checkplan === '点火通气单' && i === '报警器' && !initialized) {
    //       let info = this.getTemplateByType('报警器')
    //       for (let item in info) {
    //           let tempItem = this.config[i].items[info[item].f_name]
    //           console.log('tempItem=>' + JSON.stringify(tempItem))
    //           let option = this.findOption(tempItem, info[item].f_value)
    //           console.log('option=>' + JSON.stringify(option))
    //
    //           // f_defect_level: option?option.level:option,
    //           let value = tempItem.type === 'selector' ? [info[item].f_value] : info[item].f_value
    //           items.push({
    //               // 需要找到对应的值
    //               f_is_defect: option ? option.isdefect : false,
    //               f_item_name: info[item].f_name,
    //               f_item_value: value,
    //               f_path: "",
    //               type: tempItem.type
    //           })
    //       }
    //   }
    if (JSON.stringify(this.piece) == '{}') {
      this.$set('piece.f_items', this.f_items)
      this.$set('piece.f_device_type', this.device.device)
    } else {
      for (let f in this.f_items) {
        for (let p in this.piece.f_items) {
          if (this.f_items[f].f_item_name == this.piece.f_items[p].f_item_name) {
            this.f_items[f] = Object.assign(this.f_items[f], this.piece.f_items[p])
            if (this.f_items[f].type == 'selector' || this.f_items[f].type == 'inputSelector') {
              console.log('this.piece.f_items[p].f_item_value==>', this.piece.f_items[p].f_item_value)
              console.log('this.f_items[f].selected==>', this.f_items[f].selected)
              this.f_items[f].selected = this.piece.f_items[p].f_item_value
              this.f_items[f].item_default = this.piece.f_items[p].f_item_value //将piece的默认值备份到此字段
              console.log('this.f_items[f].selected==>', this.f_items[f].selected)
              /*if (this.f_items[f].f_item_name == '表封号修正原因') { if (this.f_items[f].f_item_value == '表封号不符，无法核实') { }  }   */
              /*if (this.f_items[f].f_item_name == '基表读数') {
                //tag)
                this.f_table_base.index = f
                this.$watch('f_items[' + f + '].f_item_value', function () {
                  this.tablebaseChange()
                })
              }*/
            }
          }
        }

        for (let em in this.config[this.device.device].items) {
          if (this.config[this.device.device].items[em].type == 'selector' && em == this.f_items[f].f_item_name) {
            this.f_items[f].options = []
            for (let k in this.config[this.device.device].items[em].options) {
              this.f_items[f].options.push({
                label: this.config[this.device.device].items[em].options[k].data,
                value: this.config[this.device.device].items[em].options[k].data
              })
            }
          }
        }
      }
      console.log('循环完f_items====》' + JSON.stringify(this.f_items))
      this.$set('piece.f_items', this.f_items)
      for (let n in this.f_items) {
        if (this.f_items[n].type == 'selector' || this.f_items[n].type == 'inputSelector') {
          this.updateItemStatus(n, this.f_items[n].selected)
        }
      }
    }
    this.towatch()
  },

  methods: {
    tablebaseChange() {
      console.log(`----------f_table_base---------${this.f_table_base}`)
    },
    getTemplateValue(type, name) {
      let item = this.templateInfo.find((item) => {
        return item.f_type === type && item.f_name === name
      })
      console.log('templateItem = >' + JSON.stringify(item))
      return item ? item.f_value : ''
    },
    chooseInit(templateValue, configValue) {
      console.log('templateValue => ' + templateValue + ' configValue' + configValue)
      if (templateValue == null || templateValue === '') return configValue
      return templateValue ? templateValue : ''
    },
    changse(val) {
      console.log('下拉框值发生改变val===>' + JSON.stringify(val))
      if (val == undefined) {
        return
      }
      console.log('val不是undefined' + JSON.stringify(this.selectindex))
      if (this.selectindex != null) {
        this.f_items[this.selectindex].f_item_value = val
      }
    },
    changlive(val) {
      if (val == undefined) {
        return
      }
      if (this.selectindex != null) {
        this.f_items[this.selectindex].f_live_dispose = val
      }
    },
    updateItemStatus(n, val) {
      let shImage = false
      let needTic = false
      let needPhoto = false
      if (val != undefined) {
        // 获取实际的选中值，处理数组或字符串的情况
        let selectedValue = ''
        if (Array.isArray(val)) {
          selectedValue = val.length > 0 ? val[0] : ''
        } else {
          selectedValue = val
        }

        for (let item in this.config[this.device.device].items) {
          let type = this.config[this.device.device].items[item].type
          let multiple = this.config[this.device.device].items[item].multiple
          let options = this.config[this.device.device].items[item].options
          if ((type == 'selector' || type == 'inputSelector') && item == this.f_items[n].f_item_name) {
            for (let i in options) {
              let isMatch = false
              if (type == 'selector' && multiple == false) {
                isMatch = (options[i].data == selectedValue)
              } else if (type == 'inputSelector') {
                isMatch = (options[i].data == selectedValue)
              } else if (type == 'selector' && multiple == true) {
                isMatch = (val.indexOf(options[i].data) > -1)
              }

              if (isMatch) {
                if (options[i].isdefect == true) {
                  shImage = true
                }
                if (options[i].isdefect == false || this.f_items[n].f_item_value == '') {
                  shImage = false
                }

                if (options[i].needTic == true) {
                  needTic = true
                }
                if (options[i].needPhoto == true) {
                  needPhoto = true
                }

                if (shImage) {
                  this.$set('f_items[' + n + '].f_is_defect', true)
                  this.$set('f_items[' + n + '].f_defect_level', options[i].level)
                  // 只有当图片为空或为默认图片时，才重置为默认图片，防止覆盖已拍摄的照片
                  if (!this.f_items[n].f_path || this.f_items[n].f_path === Vue.nopic) {
                    this.$set('f_items[' + n + '].f_path', Vue.nopic)
                  }
                  this.$set('f_items[' + n + '].f_live_dispose', '否')
                  this.$set('f_items[' + n + '].tooltip', options[i].tooltip)
                } else {
                  // 如果需要打勾或者需要拍照，都要显示照片区域
                  if (needTic || needPhoto) {
                    if (!this.f_items[n].f_path || this.f_items[n].f_path === Vue.nopic) {
                      this.$set('f_items[' + n + '].f_path', Vue.nopic)
                    }
                  } else {
                    this.$set('f_items[' + n + '].f_path', '')
                  }
                  this.$set('f_items[' + n + '].f_is_defect', '')
                  this.$set('f_items[' + n + '].f_defect_level', '')
                  this.$set('f_items[' + n + '].f_live_dispose', '')
                  this.$set('f_items[' + n + '].tooltip', '')
                }
              }
            }
            this.$set('f_items[' + n + '].needPhoto', needPhoto)
          }
        }
      }
    },
    transelation(val) {
      console.log('transelation-val=====>' + JSON.stringify(val))
      this.selectindex = val
    },
    towatch() {
      // 辅助函数：判断值是否为空 (用于保护用户已选的数据)
      // 返回 true 表示是空的，可以赋值；返回 false 表示有值，禁止覆盖
      const isEmptyValue = (val) => {
        if (val instanceof Array) {
          return val.length === 0 || (val.length === 1 && (val[0] === '' || val[0] === null || val[0] === undefined));
        }
        if (val instanceof Object) {
          // 简单判断对象是否为空对象 {}
          return Object.keys(val).length === 0;
        }
        return val === '' || val === null || val === undefined;
      };

      for (let n in this.f_items) {
        if (this.f_items[n].type == 'selector' || this.f_items[n].type == 'inputSelector') {

          this.$watch('f_items[' + n + '].selected', (val) => {
            console.log('Watch触发:', this.f_items[n].f_item_name, '值:', val);

            // --- 逻辑块 1: 处理 "其他" 选项 ---
            if (this.f_items[n].f_item_name == '表具故障' ||
              this.f_items[n].f_item_name == '立管漏气位置' ||
              this.f_items[n].f_item_name == '灶具连接管隐患类型' ||
              this.f_items[n].f_item_name == '表后管隐患类型') {

              let hasOther = false;
              if (Array.isArray(val)) hasOther = val.indexOf('其他') > -1;
              else if (typeof val === 'string') hasOther = val.indexOf('其他') > -1;

              for (let item in this.f_items) {
                let f_item = this.f_items[item];
                if (f_item.f_item_name == '其他') {
                  f_item.isshow = hasOther;
                  // 如果隐藏了，可以选择是否清空，这里保持原逻辑：隐藏时不强制清空值，除非业务强要求
                  if (!hasOther && !isEmptyValue(f_item.selected)) {
                    // 可选：如果业务要求隐藏必须清空，取消下面注释
                    // f_item.selected = Array.isArray(f_item.selected) ? [] : '';
                    // f_item.f_item_value = Array.isArray(f_item.f_item_value) ? [] : '';
                  }
                }
              }
            }

            // --- 逻辑块 2: 处理 "漏气" 联动 (立管/热水器/壁挂炉等) ---
            if (['立管', '表后管', '热水器', '壁挂锅炉'].indexOf(this.piece.f_device_type) > -1) {
              if (this.f_items[n].f_item_name && this.f_items[n].f_item_name.indexOf('隐患类型') > -1) {
                let hasLeak = false;
                if (Array.isArray(val)) hasLeak = val.indexOf('漏气') > -1;
                else if (typeof val === 'string') hasLeak = val.indexOf('漏气') > -1;

                for (let item in this.f_items) {
                  let f_item = this.f_items[item];
                  if (f_item.f_item_name && f_item.f_item_name.indexOf('漏气位置') > -1) {
                    f_item.isshow = hasLeak;

                    // 【保护】：如果隐藏了，且业务要求清空，则清空；否则保留
                    if (!hasLeak) {
                      // 原逻辑是隐藏，未明确说清空值。如果之前有值，建议保留以便下次显示。
                      // 如果必须清空，请在此处添加清空逻辑
                    }
                  }

                  // 清理路径逻辑
                  if (f_item.f_item_name && f_item.f_item_name.indexOf('隐患类型') > -1) {
                    let sVal = f_item.selected;
                    let vVal = f_item.f_item_value;
                    let sEmpty = isEmptyValue(sVal);
                    let vEmpty = isEmptyValue(vVal);

                    if (sEmpty || vEmpty) {
                      f_item.f_path = '';
                    }
                  }
                }
              }
            }

            // --- 逻辑块 3: 报警器 (有否) ---
            if (this.piece.f_device_type == '报警器') {
              if (this.f_items[n].f_item_name == '有否') {
                let selectedVal = Array.isArray(val) ? val[0] : val;

                if (selectedVal == '有') {
                  for (let item in this.f_items) {
                    if (this.f_items[item].f_item_name != '有否') {
                      let f_item = this.f_items[item];

                      // 【核心保护】：如果已经有值了，跳过默认值赋值，只显示即可
                      if (!isEmptyValue(f_item.selected)) {
                        f_item.isshow = true;
                        f_item.f_path = '';
                        continue; // 跳过后续赋值逻辑
                      }

                      // 以下仅在值为空时执行默认值计算
                      let valueDefault;
                      let configItem = this.config[this.piece.f_device_type] ? this.config[this.piece.f_device_type].items[f_item.f_item_name] : null;
                      if (!configItem) {
                        f_item.isshow = true;
                        continue;
                      }

                      if ((f_item.type == 'selector' || f_item.type == 'checkbox' || f_item.type == 'inputSelector') && f_item.multiple == true) {
                        valueDefault = [];
                        if(configItem.options) {
                          for (let defitem in configItem.options) {
                            let defopt = configItem.options[defitem];
                            if (f_item.item_default) valueDefault[0] = f_item.item_default;
                            else if (defopt.isdefault) valueDefault[0] = defopt.data;
                          }
                        }
                      } else if ((f_item.type == 'selector' || f_item.type == 'checkbox' || f_item.type == 'inputSelector') && f_item.multiple == false) {
                        valueDefault = '';
                        if(configItem.options) {
                          for (let defitem in configItem.options) {
                            let defopt = configItem.options[defitem];
                            if (f_item.item_default) valueDefault = f_item.item_default;
                            else if (defopt.isdefault) valueDefault = defopt.data;
                          }
                        }
                      } else if (f_item.type == 'radio') {
                        valueDefault = '';
                        if(configItem.options) {
                          for (let defitem in configItem.options) {
                            let defopt = configItem.options[defitem];
                            if (f_item.item_default) valueDefault = f_item.item_default;
                            else if (defopt.isdefault) valueDefault = defopt.data;
                          }
                        }
                      }

                      if (valueDefault == '惠众') f_item.selected = [valueDefault];
                      else f_item.selected = valueDefault;

                      f_item.isshow = true;
                      f_item.f_path = '';
                    }
                  }
                } else {
                  // 选 "否"：必须清空，这是业务逻辑要求的，不需要保护
                  for (let item in this.f_items) {
                    if (this.f_items[item].f_item_name != '有否') {
                      let f_item = this.f_items[item];
                      f_item.isshow = false;

                      if (f_item.selected instanceof Array) {
                        f_item.selected = [];
                        f_item.f_item_value = [];
                      } else if (f_item.selected instanceof Object) {
                        f_item.selected = {};
                        f_item.f_item_value = {};
                      } else {
                        f_item.selected = '';
                        f_item.f_item_value = '';
                      }
                      f_item.f_path = '';
                    }
                  }
                }
              }
            }

            // --- 逻辑块 4: 是否安装 (热水器/灶具等) - 【重点修复区域】 ---
            if (['灶具', '热水器', '壁挂锅炉', '抽油机'].indexOf(this.piece.f_device_type) > -1) {
              if (this.f_items[n].f_item_name == '是否安装') {
                let installVal = Array.isArray(val) ? val[0] : val;

                if (installVal == '是') {
                  for (let item in this.f_items) {
                    let f_item = this.f_items[item];
                    // 跳过自身 和 漏气位置 (漏气位置由隐患类型控制)
                    if (f_item.f_item_name != '是否安装' && f_item.f_item_name.indexOf('漏气位置') == -1) {

                      // 【核心保护】：如果已经有值，绝对不要覆盖！
                      if (!isEmptyValue(f_item.selected)) {
                        f_item.isshow = true;
                        f_item.f_path = '';
                        continue; // 跳过默认值计算和赋值
                      }

                      // 以下仅在值为空时执行
                      let valueDefault;
                      let configItem = this.config[this.piece.f_device_type] ? this.config[this.piece.f_device_type].items[f_item.f_item_name] : null;
                      if (!configItem) {
                        f_item.isshow = true;
                        continue;
                      }

                      if ((f_item.type == 'selector' || f_item.type == 'checkbox' || f_item.type == 'inputSelector') && f_item.multiple == true) {
                        valueDefault = [];
                        if(configItem.options) {
                          for (let defitem in configItem.options) {
                            let defopt = configItem.options[defitem];
                            if (f_item.item_default) valueDefault[0] = f_item.item_default;
                            else if (defopt.isdefault) valueDefault[0] = defopt.data;
                          }
                        }
                      } else if ((f_item.type == 'selector' || f_item.type == 'checkbox' || f_item.type == 'inputSelector') && f_item.multiple == false) {
                        valueDefault = '';
                        if(configItem.options) {
                          for (let defitem in configItem.options) {
                            let defopt = configItem.options[defitem];
                            if (f_item.item_default) valueDefault = f_item.item_default;
                            else if (defopt.isdefault) valueDefault = defopt.data;
                          }
                        }
                      } else if (f_item.type == 'radio') {
                        valueDefault = '';
                        if(configItem.options) {
                          for (let defitem in configItem.options) {
                            let defopt = configItem.options[defitem];
                            if (f_item.item_default) valueDefault = f_item.item_default;
                            else if (defopt.isdefault) valueDefault = defopt.data;
                          }
                        }
                      }

                      f_item.isshow = true;
                      f_item.f_path = '';
                      f_item.selected = valueDefault;
                    }
                  }
                } else {
                  // 选 "否"：必须清空
                  for (let item in this.f_items) {
                    let f_item = this.f_items[item];
                    if (f_item.f_item_name != '是否安装') {
                      f_item.isshow = false;
                      if (f_item.selected instanceof Array) {
                        f_item.selected = [];
                        f_item.f_item_value = [];
                      } else if (f_item.selected instanceof Object) {
                        f_item.selected = {};
                        f_item.f_item_value = {};
                      } else {
                        f_item.selected = '';
                        f_item.f_item_value = '';
                      }
                      f_item.f_path = '';
                    }
                  }
                }
              }
            }

            // --- 逻辑块 5: 灶具连接管 ---
            if (this.piece.f_device_type == '灶具连接管') {
              if (this.f_items[n].f_item_name == '灶具连接管安装类型') {
                let pipeType = Array.isArray(val) ? val[0] : val;
                if (pipeType == '胶皮管' || pipeType == '金属软管') {
                  for (let item in this.f_items) {
                    if (this.f_items[item].f_item_name == '灶具连接管隐患类型') {
                      this.f_items[item].isshow = true;
                    }
                  }
                } else {
                  for (let item in this.f_items) {
                    if (this.f_items[item].f_item_name != '灶具连接管安装类型') {
                      this.f_items[item].isshow = false;
                    }
                  }
                }
              }
            }

            // --- 逻辑块 6: 其他 (开放式厨房) ---
            if (this.piece.f_device_type == '其他') {
              if (this.f_items[n].f_item_name == '其他') {
                let hasOpenKitchen = false;
                if(Array.isArray(val)) hasOpenKitchen = val.indexOf('开放式厨房') > -1;
                else if(typeof val === 'string') hasOpenKitchen = val.indexOf('开放式厨房') > -1;

                for (let item in this.f_items) {
                  let fname = this.f_items[item].f_item_name;
                  if (fname == '现场照片' || fname == 'KF告知书照片' || fname == 'KF告知书编号') {
                    this.f_items[item].isshow = hasOpenKitchen;
                    if (!hasOpenKitchen) {
                      this.f_items[item].f_item_value = '';
                      this.f_items[item].f_path = '';
                    } else {
                      if (fname == 'KF告知书编号' && (!this.f_items[item].f_item_value || this.f_items[item].f_item_value == '')) {
                        this.f_items[item].f_item_value = 'KF';
                      }
                    }
                  }
                }
              }
            }

            // --- 简单赋值逻辑 ---
            if (this.f_items[n].f_item_name == '表编号修正原因' && val && val[0]) {
              this.paper.f_number_change_reason = val[0];
            }
            if (this.f_items[n].f_item_name == '表封号修正原因' && val && val[0]) {
              this.paper.f_title_change_reason = val[0];
            }

            this.updateItemStatus(n, val);
          });

        } else if (this.f_items[n].type == 'date') {
          if (this.f_items[n].f_item_name == '安装时间') {
            this.$watch('f_items[' + n + '].f_item_value', (val) => {
              console.log('日期变更:', val);
              for (let item in this.f_items) {
                let f_item = this.f_items[item];
                if (f_item.f_item_name == '到期时间') {
                  f_item.f_item_value = Util.addYear(val);

                  let isExpired = Util.compare(f_item.f_item_value);

                  for (let it in this.f_items) {
                    let f_it = this.f_items[it];
                    if (f_it.f_item_name && f_it.f_item_name.indexOf('隐患类型') > -1) {
                      this.selectindex = it;

                      let selectedArr = f_it.selected || [];
                      let hasExpired = false;
                      if(Array.isArray(selectedArr) && selectedArr.indexOf('超期使用') > -1) hasExpired = true;
                      if(!Array.isArray(selectedArr) && typeof selectedArr === 'string' && selectedArr.indexOf('超期使用') > -1) hasExpired = true;

                      if (isExpired && !hasExpired) {
                        if(!Array.isArray(f_it.selected)) f_it.selected = [];
                        if(f_it.selected.indexOf('超期使用') === -1) {
                          f_it.selected.push('超期使用');
                        }
                        // 同步 f_item_value
                        if(!Array.isArray(f_it.f_item_value)) f_it.f_item_value = [];
                        if(f_it.f_item_value.indexOf('超期使用') === -1) {
                          f_it.f_item_value.push('超期使用');
                        }
                      } else if (!isExpired && hasExpired) {
                        // 移除超期使用
                        if (Array.isArray(f_it.selected)) {
                          f_it.selected = f_it.selected.filter(itm => itm !== '超期使用');
                        }
                        if (Array.isArray(f_it.f_item_value)) {
                          f_it.f_item_value = f_it.f_item_value.filter(itm => itm !== '超期使用');
                        }
                        f_it.f_path = '';
                      }
                    }
                  }
                }
              }
            });
          }
        } else {
          // --- 普通输入框监听 (燃气表计算) ---
          this.$watch('f_items[' + n + '].f_item_value', (val) => {
            if (this.piece.f_device_type == '燃气表') {
              let ICcard, money, gas, Filetype, meterbase, referenceGas, referencebalGas, totalGas;

              // 获取引用
              for (let item in this.f_items) {
                let fname = this.f_items[item].f_item_name;
                if (fname == 'IC卡表类型') ICcard = this.f_items[item];
                if (fname == '表型') Filetype = this.f_items[item];
                if (fname == '剩余金额') money = this.f_items[item];
                if (fname == '剩余气量') gas = this.f_items[item];
                if (fname == '基表读数') meterbase = this.f_items[item];
                if (fname == '剩余气量参考') referenceGas = this.f_items[item];
                if (fname == '剩余金额参考') referencebalGas = this.f_items[item];
                if (fname == '总购气量') totalGas = this.f_items[item];
                if (fname == '表封号') {
                  if(Util && Util.isReturnCA) this.f_items[item].f_item_value = Util.isReturnCA(this.f_items[item].f_item_value);
                }
              }

              if (this.f_items[n].f_item_name == '基表读数' && meterbase) {
                // HTTP 请求逻辑保持不变
                let http1 = new HttpResetClass();
                if(this.$androidUtil) {
                  http1.load('POST', `${this.$androidUtil.getProxyUrl()}/NewSaleRest//rs/logic/getMeterGas`, {
                    data: { card_id: this.$parent.$parent.$parent.data.f_card_id }
                  }, {resolveMsg: null, rejectMsg: null}).then((ress) => {
                    // 确保 then 内部 this 指向正确 (箭头函数已处理)
                    if(ress.data && ress.data[0]) {
                      this.$showAlert(ress.data[0]);
                      let r = ress.data[0];
                      let f_price = 2.05;
                      let baseVal = parseFloat(meterbase.f_item_value) || 0;
                      let newBase = parseFloat(r.f_newmeter_base) || 0;
                      let diff = baseVal - newBase;

                      if (this.$parent.$parent.$parent.meter_type == '气量卡表') {
                        let dataq = (r.sumgas + r.returngas) - diff;
                        if(referenceGas) referenceGas.f_item_value = dataq;
                        if(referencebalGas) referencebalGas.f_item_value = (dataq * f_price).toFixed(2);
                      } else {
                        let gasw = ((r.sumgas + r.returngas) - diff).toFixed(2);
                        if(referenceGas) referenceGas.f_item_value = gasw;
                        let dataw = ((r.sumamount + r.returnfee) - diff * f_price).toFixed(2);
                        if(referencebalGas) referencebalGas.f_item_value = dataw;
                      }
                    }
                  });
                }
              }

              if ((this.f_items[n].f_item_name == '剩余金额' || this.f_items[n].f_item_name == '剩余气量') && this.$parent.$parent.$parent.f_price > 0) {
                if (this.f_items[n].f_item_name == '剩余气量' && gas && money) {
                  money.f_item_value = Util.muldivfloat(gas.f_item_value, this.$parent.$parent.$parent.f_price, '*').toFixed(2);
                }
                if (this.f_items[n].f_item_name == '剩余金额' && money && gas) {
                  gas.f_item_value = Util.muldivfloat(money.f_item_value, this.$parent.$parent.$parent.f_price, '/').toFixed(2);
                }
              }
            }
          });
        }
      }
      console.log('Watch 注册完成');
    },
    cameraCallBack(prop, fileName) {
      HostApp.__this__.$set('f_items[' + prop + '].f_path', fileName + '?' + Math.random())
      console.log(HostApp.__this__.f_items[prop].f_path)
      HostApp.__callback__ = null
      HostApp.__this__ = null
    },
    saoyisao() {
      HostApp.__this__ = this
      HostApp.scanCode({callback: 'javascript:HostApp.__this__.getCode();'})
    },
    getCode() {
      let res
      let data = HostApp.getCode().data
      console.log('data====>' + JSON.stringify(data))
      if (data && data.indexOf('物联网') > -1) {
        res = data.split('|')
        console.log('扫码结果解析res======>' + JSON.stringify(res))
        if (this.piece.f_device_type == '燃气表') {
          console.log('this.paper[\'device\'+this.device.n][this.idx]===>' + JSON.stringify(this.paper['device' + this.device.n][this.idx]))
          for (let item in this.f_items) {
            if (this.f_items[item].f_item_name == '表编号') {
              this.f_items[item].f_item_value = '0001' + res[1]
            }
            if (this.f_items[item].f_item_name == '表型') {
              this.f_items[item].selected = []
              this.f_items[item].f_item_value = '莱德物联网表'
              this.f_items[item].selected.push('莱德物联网表')
            }
            if (this.f_items[item].f_item_name == '左右表') {
              this.f_items[item].selected = []
              this.f_items[item].f_item_value = res[4]
              this.f_items[item].selected.push(res[4])
            }
            if (this.f_items[item].f_item_name == '生产时间') {
              this.f_items[item].f_item_value = res[5].substring(0, 10)
            }
          }
        }
      } else {
        this.$showMessage('无法识别的二维码！')
      }

    },
    takePic(prop, title) {
      HostApp.__callback__ = this.cameraCallBack
      HostApp.__this__ = this
      console.log('this.f_items[prop]:' + prop)
      let fileName
      if (!this.f_items[prop].f_path || this.f_items[prop].f_path.includes('nopic.png')) {
        fileName = Util.guid() + '-' + 'device' + this.device.n + '-' + this.idx + '-' + 'f_items' + prop + '.jpg'
      } else {
        fileName = Util.getFileName(this.f_items[prop].f_path)
      }
      HostApp._open_a_page({
        type: 'boomerang',
        page: 'com.aofeng.hybrid.android.peripheral.CameraActivity',
        param: {
          file: fileName,
          requestCode: 111,
          callback: 'javascript:HostApp.__callback__("' + prop + '", "%s");',
          watermark: title + '\t时间：' + Util.toStandardTimeString() + '\t' + Vue.user.name
        }
      })
    },
    goBackValidation() {
      this.$goto('devices', {}, 'paper-router')
    },
    delfile(prop, fileName) {
      console.log('照片路径')
      console.log(JSON.stringify(fileName))
      if (fileName == Vue.nopic) {
        return
      } else {
        HostApp.delfile(fileName)
        this.f_items[prop].f_path = Vue.nopic
      }
    },
    isKHKitchen(name) {
      return name === '现场照片' || name === 'KF告知书照片' || name === 'KF告知书编号'
    },
    handleInput(row) {
      if (row.f_item_name === 'KF告知书编号') {
        if (!row.f_item_value || !row.f_item_value.startsWith('KF')) {
          row.f_item_value = 'KF'
        }
      }
    },
    save() {
      let nullCount = 0
      let metertitles
      let meterType
      //判断当前是否有选中项
      for (let row in this.f_items) {
        if (this.piece.f_device_type == '燃气表') {
          if (this.f_items[row].f_item_name == '表封') {
            metertitles = this.f_items[row]
            console.log('metertitles' + JSON.stringify(metertitles))
          }
          console.log('this.f_items[row].f_item_name===>' + JSON.stringify(this.f_items[row].f_item_name))
          if (this.f_items[row].f_item_name === '表型') {
            meterType = this.f_items[row]
            console.log('meterType' + JSON.stringify(meterType))
          }
        }
        if (this.f_items[row].selected && this.f_items[row].selected != '' && this.f_items[row].selected instanceof Array) {
          console.log('selected是数组')
          this.f_items[row].f_item_value = this.f_items[row].selected
        } else if (this.f_items[row].selected && this.f_items[row].selected != '') {
          console.log('selected不是数组')
          this.f_items[row].f_item_value = this.f_items[row].selected
        }
        if (this.f_items[row].f_item_value instanceof Array && this.f_items[row].f_item_value.length != 0) {
          nullCount = nullCount + 1
        } else if (this.f_items[row].f_item_value != '') {
          nullCount = nullCount + 1
        }
      }
      if (nullCount == 0) {
        this.$showMessage('未添加任何内容！')
      } else {
        let picture = []
        for (let row in this.f_items) {
          console.log('this.f_items[row].f_item_nam===>===>==>' + JSON.stringify(this.f_items[row].f_item_name))
          // 增加开户安检单必填验证
          if (this.item.f_no_checkplan === '开户安检单' && this.f_items[row].isshow) {
            if (this.f_items[row].f_item_name === '现场照片' || this.f_items[row].f_item_name === 'KF告知书照片') {
              if (!this.f_items[row].f_path || this.f_items[row].f_path === Vue.nopic) {
                return this.$showMessage('请上传' + this.f_items[row].f_item_name)
              }
            }
            if (this.f_items[row].f_item_name === 'KF告知书编号') {
              if (!this.f_items[row].f_item_value || this.f_items[row].f_item_value === 'KF') {
                return this.$showMessage('请填写KF告知书编号')
              }
              if (!(/^KF[0-9]{11}$/.test(this.f_items[row].f_item_value))) {
                return this.$showMessage('KF告知书编号必须是KF开头并跟随11位数字！')
              }
            }
          }

          if (this.f_items[row].needPhoto) {
            if (this.f_items[row].isshow) {
              if (!this.f_items[row].f_path || this.f_items[row].f_path === Vue.nopic || this.f_items[row].f_path === '') {
                return this.$showMessage('请拍摄' + this.f_items[row].f_item_name + '照片')
              }
            }
          }
          if (this.f_items[row].f_item_name == '表封号') {
            if (metertitles.f_item_value == '塑质' || metertitles.f_item_value == '无') {
              console.log('塑质或无，可不填表封号')
            } else if (metertitles.f_item_value == '钢质') {
              if (this.f_items[row].f_item_value || this.f_items[row].f_item_value != null || this.f_items[row].f_item_value != '') {
                if (!(/^CA[0-9]{10}$/.test(this.f_items[row].f_item_value))) {
                  return this.$showMessage('表封号必须是CA开头并跟随10位数字！')
                }
              } else {
                return this.$showMessage('请填写表封号')
              }
            }
          } else if (this.f_items[row].f_item_name === '表编号') {
            console.log(`判断表号长度meterType${meterType}`)
            if (this.f_items[row].f_item_value) {
              if ((meterType.selected[0] === '莱德非接触' || meterType.selected[0] === '067非接触') && this.f_items[row].f_item_value.length !== 10) {
                this.$showMessage('射频表表号长度必须是10位！')
                return
              }
            }
          }
          let a = {}
          a.f_path = this.f_items[row].f_path
          a.name = this.f_items[row].f_item_name
          picture.push(a)
        }
        this.$parent.showDevice = false
        this.$dispatch('finishChoose', picture)
        console.log('完成')
      }

    },
    showMeterNumberReason(name) {
      if (name === '表编号') {
        this.meterNumberReasonsBool = true
      }
      if (name === '表封号') {
        this.meterTitlesReasonBool = true
      }
    },
    cancel() {
      // let index = this.f_items[this.selectindex].f_item_value.indexOf('其他')
      //TODO 其他上传时在去组织数据
      // if(index > -1){
      //   for (let i in this.f_items){
      //     if(this.f_items[this.selectindex])
      //   }
      //   this.f_items[this.selectindex].f_item_value.splice(index,1,this.other)
      // }
      if (this.operation == 'edit') {
        for (let row of this.f_items) {
          if (row.f_item_value != '') {
            this.$parent.showDevice = false
            return
          }
        }
      } else if (this.operation == 'add') {
        this.$parent.paper['device' + this.device.n].pop()
        this.$parent.showDevice = false
      }
    }
  }
}

</script>
<style>
.modal {
  overflow: auto !important;
}

.modal-open {
  overflow: auto !important;
}

.font {
  font: 15px PingFang-SC-Medium;
  color: #666666;
}

.div-photo {
  width: auto;
  height: auto;
  /* margin-top: 10px; */
  position: absolute;
  bottom: 10px;
  right: 10px;
}

.btn-cancel {
  border: 1px solid #499edf;
  background-color: #f5fbff;
  border-radius: 7px;
  color: #499edf;
  font: 15px PingFang-SC-Bold;
}

.btn-save {
  background-color: #499edf;
  border-radius: 7px;
  font: 15px PingFang-SC-Bold;
  color: #ffffff;
}

</style>
