<template>
    <div class="home_wrapper">
    <van-nav-bar
      title="地块信息维护"
      left-arrow
      placeholder
      safe-area-inset-top
      @click-left="onClickLeft"
    />

      <van-form @submit="onSubmit">
        <div class="main">
          <p class="title"><i></i>地块信息</p>
            <van-field v-model="form.deptName" label="区域位置" placeholder="请输入" input-align="right" label-width="auto" />
<!--            <van-field v-model="form.bsm" label="标识码" placeholder="请输入" input-align="right" label-width="auto" />-->
<!--            <van-field v-model="form.ysdm" label="要素代码" placeholder="请输入" input-align="right" label-width="auto" />-->
            <van-field v-model="form.dkbm" label="地块编码" placeholder="请输入" input-align="right" label-width="auto" />
            <van-field v-model="form.dkmc" label="地块名称" placeholder="请输入" input-align="right" label-width="auto" required :rules="[{ required: true }]" />
            <van-field readonly @click="showOwnershipPicker = true" v-model="form.syqxzText" label="所有权性质" placeholder="请输入" input-align="right" label-width="auto" />
            <van-popup v-model="showOwnershipPicker" round position="bottom">
              <van-picker
                show-toolbar
                :columns="dict.type.ownership_type"
                value-key="label"
                @cancel="showOwnershipPicker = false"
                @confirm="onConfirmSyqxz"
              />
            </van-popup>
            <van-field readonly @click="showDklbPicker = true" v-model="form.dklbText" label="地块类别" placeholder="请输入" input-align="right" label-width="auto" />
            <van-popup v-model="showDklbPicker" round position="bottom">
              <van-picker
                show-toolbar
                :columns="dict.type.land_type"
                value-key="label"
                @cancel="showDklbPicker = false"
                @confirm="onConfirmDklb"
              />
            </van-popup>
            <van-field readonly @click="showTdlylxPicker = true" v-model="form.tdlylxText" label="土地利用类型" placeholder="请输入" input-align="right" label-width="auto" />
            <van-popup v-model="showTdlylxPicker" round position="bottom">
              <van-picker
                show-toolbar
                :columns="dict.type.land_use"
                value-key="label"
                @cancel="showTdlylxPicker = false"
                @confirm="onConfirmTdlylx"
              />
            </van-popup>
            <van-field readonly @click="showDldjPicker = true" v-model="form.dldjText" label="地力等级" placeholder="请输入" input-align="right" label-width="auto" />
            <van-popup v-model="showDldjPicker" round position="bottom">
              <van-picker
                show-toolbar
                :columns="dict.type.land_grade_type"
                value-key="label"
                @cancel="showDldjPicker = false"
                @confirm="onConfirmDldj"
              />
            </van-popup>
            <van-field readonly @click="showTdytPicker = true" v-model="form.tdytText" label="土地用途" placeholder="请输入" input-align="right" label-width="auto" />
            <van-popup v-model="showTdytPicker" round position="bottom">
              <van-picker
                show-toolbar
                :columns="dict.type.land_use_type"
                value-key="label"
                @cancel="showTdytPicker = false"
                @confirm="onConfirmTdyt"
              />
            </van-popup>
            <van-field readonly @click="showSfjbntPicker = true" v-model="form.sfjbntText" label="是否基本农田" placeholder="请输入" input-align="right" label-width="auto" />
            <van-popup v-model="showSfjbntPicker" round position="bottom">
              <van-picker
                show-toolbar
                :columns="dict.type.is_common"
                value-key="label"
                @cancel="showSfjbntPicker = false"
                @confirm="onConfirmSfjbnt"
              />
            </van-popup>
            <van-field v-model="form.dkdz" label="地块东至" placeholder="请输入" input-align="right" label-width="auto" />
            <van-field v-model="form.dkxz" label="地块西至" placeholder="请输入" input-align="right" label-width="auto" />
            <van-field v-model="form.dknz" label="地块南至" placeholder="请输入" input-align="right" label-width="auto" />
            <van-field v-model="form.dkbz" label="地块北至" placeholder="请输入" input-align="right" label-width="auto" />
            <van-field v-model="form.dkbzxx" label="备注信息" placeholder="请输入" input-align="right" label-width="auto" />
            <van-field v-model="form.zjrxm" label="指界人姓名" placeholder="请输入" input-align="right" label-width="auto" />
            <van-field v-model="form.txmj" label="图显面积" placeholder="请输入" input-align="right" label-width="auto" />
            <van-field v-model="form.scmjm" label="实测面积" placeholder="请输入" input-align="right" label-width="auto" />
            <van-field readonly @click="showSfzwdPicker = true" v-model="form.sfzwdText" label="是否账外地" placeholder="请输入" input-align="right" label-width="auto" />
            <van-popup v-model="showSfzwdPicker" round position="bottom">
              <van-picker
                show-toolbar
                :columns="dict.type.is_common"
                value-key="label"
                @cancel="showSfzwdPicker = false"
                @confirm="onConfirmSfzwd"
              />
            </van-popup>
            <van-field readonly @click="showSurveyStatusPicker = true" v-model="form.surveyStatusText" label="调查状态" placeholder="请输入" input-align="right" label-width="auto" />
            <van-popup v-model="showSurveyStatusPicker" round position="bottom">
              <van-picker
                show-toolbar
                :columns="dict.type.survey_status"
                value-key="label"
                @cancel="showSurveyStatusPicker = false"
                @confirm="onConfirmSurveyStatus"
              />
            </van-popup>
        </div>

        <van-button round block type="primary" native-type="submit" class="subClass">提交</van-button>
      </van-form>

    </div>
</template>

<script>
  // import { getMenuApp } from "@/api/app/index";
  import Cookies from "js-cookie";
  import { getLand, updateLand } from "@/api/resource/land"
  export default {
    dicts: ['ownership_type', 'land_use_type', 'survey_status', 'is_common', 'land_grade_type', 'land_type', 'land_use'],
    name: "appEdit",
    data() {
      return {
        showOwnershipPicker: false,
        showDklbPicker: false,
        showTdlylxPicker: false,
        showDldjPicker: false,
        showTdytPicker: false,
        showSfjbntPicker: false,
        showSfzwdPicker: false,
        showSurveyStatusPicker: false,
        value:'',
        form:{}
      };
    },
    created() {
      this.getDetail()
    },
    methods: {
      onClickLeft(){
        history.back(-1);
      },
      getDetail(){
        getLand(this.$route.query.fid).then(response => {

          response.data.syqxzText = this.selectDictLabel(this.dict.type.ownership_type,response.data.syqxz);
          response.data.dklbText = this.selectDictLabel(this.dict.type.land_type,response.data.dklb);
          response.data.tdlylxText = this.selectDictLabel(this.dict.type.land_use,response.data.tdlylx);
          response.data.dldjText = this.selectDictLabel(this.dict.type.land_grade_type,response.data.dldj);
          response.data.tdytText = this.selectDictLabel(this.dict.type.land_use_type,response.data.tdyt);
          response.data.sfjbntText = this.selectDictLabel(this.dict.type.is_common,response.data.sfjbnt);
          response.data.sfzwdText = this.selectDictLabel(this.dict.type.is_common,response.data.sfzwd);
          response.data.surveyStatusText = this.selectDictLabel(this.dict.type.survey_status,response.data.surveyStatus);
          this.form = response.data;
        });
      },
      onConfirmSyqxz(value) {
        this.form.syqxzText = value.label;
        this.form.syqxz = value.value;
        this.showOwnershipPicker = false;
      },
      onConfirmDklb(value) {
        this.form.dklbText = value.label;
        this.form.dklb = value.value;
        this.showDklbPicker = false;
      },
      onConfirmTdlylx(value) {
        this.form.tdlylxText = value.label;
        this.form.tdlylx = value.value;
        this.showTdlylxPicker = false;
      },
      onConfirmDldj(value) {
        this.form.dldjText = value.label;
        this.form.dldj = value.value;
        this.showDldjPicker = false;
      },
      onConfirmTdyt(value) {
        this.form.tdytText = value.label;
        this.form.tdyt = value.value;
        this.showTdytPicker = false;
      },
      onConfirmSfjbnt(value) {
        this.form.sfjbntText = value.label;
        this.form.sfjbnt = value.value;
        this.showSfjbntPicker = false;
      },
      onConfirmSfzwd(value) {
        this.form.sfzwdText = value.label;
        this.form.sfzwd = value.value;
        this.showSfzwdPicker = false;
      },
      onConfirmSurveyStatus(value) {
        this.form.surveyStatusText = value.label;
        this.form.surveyStatus = value.value;
        this.showSurveyStatusPicker = false;
      },
      /** 提交按钮 */
      onSubmit() {
        updateLand(this.form).then(response => {
          if (response.code == 200){
            this.$modal.msgSuccess("修改成功")
            setTimeout(function(){
              history.back(-1);
            },2000)
          }
        })
      },
    },
  };
</script>

<style scoped lang="scss">
  p{margin: 0;}
  .home_wrapper{
    width: 100vw;
    min-height: 100vh;
    background: #F6F9FB;
    padding-bottom: 5vh;
  }
  .van-nav-bar{
    background: linear-gradient( 173deg, #91E2D3 0%, #CDFCF0 100%);
    ::v-deep.van-icon{
      color: #000000;
    }
  }
  .main{
    width: 94%;
    margin: 3vw auto;
    padding: 3vw;
    background-color: #ffffff;
    border-radius: 10px;
    overflow: hidden;

  }
  .title{
    display: flex;
    align-items: center;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    i{
      width: 5px;
      height: 20px;
      display: block;
      background-color: #29D2AF;
      margin-right: 10px;
    }
  }
  .subClass{
    background: linear-gradient( 270deg, #53E4A5 0%, #24DBDB 100%);
    border-radius: 50px 50px 50px 50px;
    border: none;
    width: 90%;
    margin: 3vw auto;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 18px;
  }

</style>
