<template>
  <div class="jtfccx-edit">
    <div class="jtfccx-edit-con">
      <b class="title">申请信息</b>
      <el-form :model="form" label-width="120px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="查询用途" label-width="90px">
              <el-input v-model="form.djSqcxDO.cxyt" class="width200px"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="16">
            <el-form-item label="与产权人的关系">
              <el-radio-group v-model="form.djSqcxDO.ycqrgx">
                <el-radio label="1">房屋权利人</el-radio>
                <el-radio label="2">产权利害关系人</el-radio>
                <el-radio label="3">委托人</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <lb-table :column="sqrColumns" key="sqr1" :data="form.sqrList" :maxHeight="200" heightNumSetting
        :pagination="false">
      </lb-table>

      <b class="title">权利人</b>
      <lb-table :column="qlrColumns" key="ql2r" :data="form.qlrList" :maxHeight="200" heightNumSetting
        :pagination="false">
      </lb-table>
      <div v-show="isSearch">
        <b class="title">查询结果</b>
        <p>查询编号：{{ form.djSqcxDO.cxbh }}</p>
        <lb-table :column="cxjgColumns" :data="form.cxjgList" :maxHeight="200" heightNumSetting :pagination="false">
        </lb-table>
      </div>
    </div>
    <el-divider></el-divider>
    <div class="submit-button" style="padding-bottom:50px">
      <el-button v-show="isSearch == false" @click="resetClick">重置</el-button>
      <el-button type="primary" v-show="isSearch == false" @click="queryChick">查询</el-button>
      <el-button type="primary" v-show="isSearch && form.cxjgList.length > 0" @click="printResult">
        房产结果打印（{{ form.djSqcxDO.dycs }}）
      </el-button>
      <el-button type="primary" v-show="isSearch && form.cxjgList.length == 0" @click="printResult">
        无房证明打印（{{ form.djSqcxDO.dycs }}）
      </el-button>
      <el-button @click="closeDialog">关闭</el-button>
    </div>
    <!-- 打印模板需要此模块 -->
    <object id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" v-show="false">
      <embed id="LODOP_EM" type="application/x-print-lodop" width=820 height=450 pluginspage="install_lodop32.exe" />
    </object>
  </div>
</template>
<script>
import { addJtfcCxjgXx, getJtfcInfo, printJtcfInfo } from "@/api/sqcx";
import { getPrintTemplateByCode } from "@/api/system";
import { datas, sendThis } from "./addjtfcdata";
import { getLodop } from "@/utils/LodopFuncs"
import { mapGetters } from "vuex";
export default {
  computed: {
    ...mapGetters(["dictData"]),
  },
  props: {
    formData: {
      type: Object,
      default: () => { },
    },
  },
  mounted () {
    sendThis(this);
  },
  data () {
    return {
      //是否查询
      isSearch: false,
      //查询结果列表字段
      cxjgColumns: datas.columns(),
      //申请人列表字段
      sqrColumns: datas.sqrCol(),
      //权利人列表字段
      qlrColumns: datas.qlrCol(),
      newData: {
        sqrxm: "",
        sqrzjlxbm: "",
        sqrzjhm: "",
        lxdh: "",
        inputErr: false,
      },
      form: {
        djSqcxDO: { ycqrgx: "1", cxyt: "" },
        sqrList: [],
        qlrList: [],
        cxjgList: [],
        dyjlList: [],
      },
    };
  },
  mounted () {
    this.form.sqrList = []
    this.form.qlrList = []
    this.isSearch = false
    if (this.formData.sqcxBsm == "") {
      this.add("sqr");
      this.add("qlr");
    } else {
      this.loadData();
    }
  },
  watch: {
    "form.djSqcxDO.ycqrgx" (val) {
      if (val == "1") {
        this.form.qlrList = _.cloneDeep(this.form.sqrList);
      } else {
        this.form.qlrList = [];
        this.add("qlr");
      }
    },
    "form.sqrList" (val) {
      if (this.form.djSqcxDO.ycqrgx == '1') {
        this.form.qlrList = _.cloneDeep(this.form.sqrList)
      }
    }
  },
  methods: {
    closeDialog () {
      this.$emit("input", false);
      this.form = {
        djSqcxDO: { ycqrgx: "1", cxyt: "" },
        sqrList: [],
        qlrList: [],
        cxjgList: [],
        dyjlList: [],
      }
    },
    //加载详细信息
    loadData () {
      this.$startLoading();
      getJtfcInfo({ sqcxBsm: this.formData.sqcxBsm }).then((res) => {
        this.$endLoading();
        if (res.code == 200) {
          this.form = res.result;
          this.isSearch = true;
        }
      });
    },
    //查询结果
    queryChick () {
      this.$startLoading();
      addJtfcCxjgXx(this.form).then((res) => {
        this.$endLoading();
        if (res.code == 200) {
          this.form = res.result;
          this.isSearch = true;
          this.$parent.queryClick();
        }
      });
    },
    //重置
    resetClick () {
      this.form.djSqcxDO = { ycqrgx: "1", cxyt: "" };
      this.form.sqrList = _.cloneDeep([this.newData]);
      this.form.qlrList = _.cloneDeep([this.newData]);
      this.form.cxjgList = [];
      this.form.dyjlList = [];
      this.isSearch = false;
    },
    handleRead (scope) { },
    //添加申请人或权利人
    add (type) {
      if (type == "sqr") {
        this.form.sqrList.push(_.cloneDeep(this.newData));
      } else {
        this.form.qlrList.push(_.cloneDeep(this.newData));
      }
    },
    //移除申请人或权利人
    remove (index, row, type) {
      if (type == "sqr") {
        this.form.sqrList.splice(index, 1);
      } else {
        this.form.qlrList.splice(index, 1);
      }
    },
    //电话号码校验
    teltest (row) {
      const reg = /^1([38]\d|5[0-35-9]|7[3678])\d{8}$/;
      if (row.lxdh == "" || row.lxdh.length <= 10 || !reg.test(row.lxdh)) {
        row.inputErr = true;
        return false;
      } else {
        row.inputErr = false;
        return true;
      }
    },
    //打印
    printResult () {
      this.openPrintPrew();
      var formdata = new FormData();
      formdata.append("sqcxBsm", this.form.djSqcxDO.bsmSqcx);
      formdata.append("dylx", '1');
      printJtcfInfo(formdata).then(res => {
        if (res.code == 200) {
          this.form.djSqcxDO.dycs = this.form.djSqcxDO.dycs + 1
        }
      });
    },
    //打开打印预览
    openPrintPrew () {
      //根据编号获取对应信息
      getPrintTemplateByCode({ tmpno: 'jtfcdys' }).then(res => {
        if (res.code == 200) {
          let LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM'));
          LODOP.ADD_PRINT_DATA("ProgramData", res.result.tmpcontent); //装载模板
          LODOP.PREVIEW();
        }
      })
    }
  },
};
</script>
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
@import "~@/styles/public.scss";

.title {
  padding-bottom: 10px;
  margin-bottom: 10px;
  display: block;
  border-bottom: 1px solid $borderColor;
}

.jtfccx-edit {
  @include flex;
  flex-direction: column;
  overflow-y: hidden;
  max-height: 87vh;
  padding: 0 2px;

  .jtfccx-edit-con {
    flex: 1;
    height: 100%;
    overflow-y: scroll;
  }

  .submit-button {
    text-align: center;
    height: 52px;
    padding-top: 10px;
    background-color: #fff;
  }
}
</style>