<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 readonly v-model="form.deptName" label="区域位置名称" placeholder="请输入" input-align="right" label-width="auto" />
        <van-field readonly required :rules="[{ required: true }]" v-model="form.dkbm" label="地块编码" placeholder="请输入" input-align="right" label-width="auto" />
        <van-field readonly :rules="[{ required: true }]" v-model="form.dkmc" label="地块名称" placeholder="请输入" input-align="right" label-width="auto" required />
        <van-field readonly v-model="form.dkdz" label="地块东至" placeholder="请输入" input-align="right" label-width="auto" />
        <van-field readonly v-model="form.dkxz" label="地块西至" placeholder="请输入" input-align="right" label-width="auto" />
        <van-field readonly v-model="form.dknz" label="地块南至" placeholder="请输入" input-align="right" label-width="auto" />
        <van-field readonly v-model="form.dkbz" label="地块北至" placeholder="请输入" input-align="right" label-width="auto" />

        <van-field required :rules="[{ required: true }]" v-model="form.jymj" label="经营面积" placeholder="请输入" input-align="right" label-width="auto" />

        <van-field required :rules="[{ required: true }]" readonly @click="showJyfsPicker = true" v-model="form.jyfsText" label="经营方式" placeholder="请输入" input-align="right" label-width="auto" />
        <van-popup v-model="showJyfsPicker" round position="bottom">
          <van-picker show-toolbar :columns="dict.type.jyfs" value-key="label" @cancel="showJyfsPicker = false" @confirm="onConfirmJyfs"/>
        </van-popup>

        <van-field readonly @click="showJydxlxPicker = true" v-model="form.jydxlxText" label="经营对象类型" placeholder="请输入" input-align="right" label-width="auto" />
        <van-popup v-model="showJydxlxPicker" round position="bottom">
          <van-picker show-toolbar :columns="dict.type.jydxlx" value-key="label" @cancel="showJydxlxPicker = false" @confirm="onConfirmJydxlx"/>
        </van-popup>

        <van-field required :rules="[{ required: true }]" v-model="form.jydxmc" label="经营对象名称" placeholder="请输入" input-align="right" label-width="auto" />

        <van-field readonly @click="showJydxzjlxPicker = true" v-model="form.jydxzjlxText" label="经营对象证件类型" placeholder="请输入" input-align="right" label-width="auto" />
        <van-popup v-model="showJydxzjlxPicker" round position="bottom">
          <van-picker show-toolbar :columns="dict.type.zjlx" value-key="label" @cancel="showJydxzjlxPicker = false" @confirm="onConfirmJydxzjlx"/>
        </van-popup>

        <van-field v-model="form.jydxzjhm" label="经营对象证件号码" placeholder="请输入" input-align="right" label-width="auto" />

        <van-field readonly @click="showSfqdhtPicker = true" v-model="form.sfqdhtText" label="是否签订合同" placeholder="请输入" input-align="right" label-width="auto" />
        <van-popup v-model="showSfqdhtPicker" round position="bottom">
          <van-picker show-toolbar :columns="dict.type.is_common" value-key="label" @cancel="showSfqdhtPicker = false" @confirm="onConfirmSfqdht"/>
        </van-popup>

        <van-field required :rules="[{ required: true }]" readonly @click="showJykssjPicker = true" v-model="form.jykssj" label="经营开始时间" placeholder="请输入" input-align="right" label-width="auto" />
        <van-popup v-model="showJykssjPicker" round position="bottom">
          <van-datetime-picker v-model="jykssj" type="date" title="选择年月日" :min-date="minDate" :max-date="maxDate" @cancel="showJykssjPicker = false" @confirm="onConfirmJykssj"/>
        </van-popup>

        <van-field required :rules="[{ required: true }]" readonly @click="showJyjssjPicker = true" v-model="form.jyjssj" label="经营结束时间" placeholder="请输入" input-align="right" label-width="auto" />
        <van-popup v-model="showJyjssjPicker" round position="bottom">
          <van-datetime-picker v-model="jyjssj" type="date" title="选择年月日" :min-date="minDate" :max-date="maxDate" @cancel="showJyjssjPicker = false" @confirm="onConfirmJyjssj"/>
        </van-popup>

        <van-field required :rules="[{ required: true }]" v-model="form.cbje" label="承包金额(元)" placeholder="请输入" input-align="right" label-width="auto" />
        <van-field v-model="form.dxje" label="兑现金额(元)" placeholder="请输入" input-align="right" label-width="auto" />
        <van-field v-model="form.sqje" label="尚欠金额(元)" placeholder="请输入" input-align="right" label-width="auto" />
        <van-field v-model="form.nsy" label="年收益(元)" placeholder="请输入" input-align="right" label-width="auto" />
        <van-field v-model="form.bzxx" label="备注信息" placeholder="请输入" input-align="right" label-width="auto" />

        <!--<van-field readonly required :rules="[{ required: true }]" @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>-->
        <field-select v-model="form.surveyStatusText" label="调查状态" value-key="dictLabel" data-key="dictValue" placeholder="请选择" requiredx remote-url="/system/dict/data/type/survey_status" :on-remote-response="'data'"/>

        <van-field readonly label="实物图" placeholder="" input-align="right" label-width="auto" />
        <image-upload v-model="form.dkImg"/>

      </div>

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

    </div>
</template>

<script>
  import { getLandDetail } from "@/api/resource/land"
  import { getOperationDetail, updateOperation, addOperation } from "@/api/resource/operation"
  import { getInfoByImportCode } from "@/api/system/dept";
  import FieldSelect from "@/components/form/FieldSelect.vue";

  export default {
    dicts: ['zjlx', 'survey_status', 'is_common', 'jydxlx', 'jyfs'],
    name: "appEdit",
    components: {FieldSelect},
    data() {
      return {
        showJyfsPicker: false,
        showSfqdhtPicker: false,
        showJydxlxPicker: false,
        showJydxzjlxPicker: false,
        showJykssjPicker: false,
        showJyjssjPicker: false,
        showSurveyStatusPicker: false,
        minDate: new Date(2020, 0, 1),
        maxDate: new Date(2025, 10, 1),
        importCode: null,
        form: {
          dkbm: null,
          dkmc: null,
          dkdz: null,
          dkxz: null,
          dknz: null,
          dkbz: null,
          jymj: null,
          jyfs: null,
          jydxlx: null,
          jydxmc: null,
          jydxzjlx: null,
          jydxzjhm: null,
          sfqdht: null,
          jykssj: null,
          jyjssj: null,
          cbje: null,
          dxje: null,
          sqje: null,
          nsy: null,
          bzxx: null,
          dkImg: null,
          surveyStatus: null,
          importCode: null,
          deptName: null,
        },
        jykssj:new Date(),
        jyjssj:new Date(),
        openPic: [],
        openPic2: [],
      };
    },
    created() {
      this.getDetail()
    },
    methods: {
      onClickLeft(){
        history.back(-1);
      },
      getDetail(){
        getOperationDetail(this.$route.query.dkbm).then(response => {
          if (response.data){
            response.data.jyfsText = this.selectDictLabel(this.dict.type.jyfs,response.data.jyfs);
            response.data.jydxlxText = this.selectDictLabel(this.dict.type.jydxlx,response.data.jydxlx);
            response.data.jydxzjlxText = this.selectDictLabel(this.dict.type.zjlx,response.data.jydxzjlx);
            response.data.sfqdhtText = this.selectDictLabel(this.dict.type.is_common,response.data.sfqdht);
            response.data.surveyStatusText = this.selectDictLabel(this.dict.type.survey_status,response.data.surveyStatus);
            this.jykssj = new Date(response.data.jykssj);
            this.jyjssj = new Date(response.data.jyjssj);
            this.form = response.data
          }else{
            getLandDetail(this.$route.query.dkbm).then(response => {
              //this.form = response.data
              this.form.deptName = response.data.deptName;
              this.form.importCode = response.data.importCode;
              this.importCode = response.data.importCode;
              this.form.dkbm = response.data.dkbm;
              this.form.dkmc = response.data.dkmc;
              this.form.dkdz = response.data.dkdz;
              this.form.dkxz = response.data.dkxz;
              this.form.dknz = response.data.dknz;
              this.form.dkbz = response.data.dkbz;
              this.form.jymj = response.data.scmjm;
              this.form.jyfsText = '家庭承包';
              this.form.jyfs = '110';
              this.form.jydxlxText = '农户';
              this.form.jydxlx = '1';
              this.form.jydxzjlxText = '居民身份证';
              this.form.jydxzjlx = '1';
              this.form.sfqdhtText = '是';
              this.form.sfqdht = '1';
              this.form.surveyStatusText = '已调查';
              this.form.surveyStatus = '2';

              getInfoByImportCode(response.data.importCode).then((res) => {
                this.form.deptId = res.data.deptId
              });
            });
          }
        });
      },
      onConfirmJydxlx(value) {
        this.form.jydxlxText = value.label;
        this.form.jydxlx = value.value;
        this.showJydxlxPicker = false;
      },
      onConfirmJyfs(value) {
        this.form.jyfsText = value.label;
        this.form.jyfs = value.value;
        this.showJyfsPicker = false;
      },
      onConfirmJydxzjlx(value) {
        this.form.jydxzjlxText = value.label;
        this.form.jydxzjlx = value.value;
        this.showJydxzjlxPicker = false;
      },
      onConfirmSfqdht(value) {
        this.form.sfqdhtText = value.label;
        this.form.sfqdht = value.value;
        this.showSfqdhtPicker = false;
      },
      onConfirmJykssj(data) {
        this.form.jykssj = this.format(data, 'yyyy-MM-dd');
        this.showJykssjPicker = false;
      },
      onConfirmJyjssj(data) {
        this.form.jyjssj = this.format(data, 'yyyy-MM-dd');
        this.showJyjssjPicker = false;
      },
      onConfirmSurveyStatus(value) {
        this.form.surveyStatusText = value.label;
        this.form.surveyStatus = value.value;
        this.showSurveyStatusPicker = false;
      },
      /** 提交按钮 */
      onSubmit() {
        if (!this.form.id){
          addOperation(this.form).then(response => {
            this.$modal.msgSuccess("新增成功")
            setTimeout(function(){
              history.back(-1);
            },2000)
          })
        }else{
          updateOperation(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>
