<template>
  <div class="app-container">
    <van-nav-bar
      left-arrow
      fixed
      placeholder
      @click-left="$router.back(-1)"
    >
      <template #title>
        <p style="font-weight: bold;">查看付款账户信息</p>
      </template>
    </van-nav-bar>
    <p class="main_title">基础信息</p>
    <div class="main_box" v-if="form">
      <van-field readonly label="账户类型" v-model="accountType" input-align="right" label-width="auto" />
      <van-field readonly label="所属银行" v-model="bankType" input-align="right" label-width="auto" />
      <van-field readonly label="账户分类" v-if="accountType=='银行存款'&&(bankType=='中国银行'||bankType=='山东省农村信用社（农商行）')" v-model="villageAccountType" input-align="right" label-width="auto" />
      <van-field readonly label="所属镇账户" v-if="accountType=='银行存款'&&villageAccountType!='村实体账户'" v-model="taccountId" input-align="right" label-width="auto" />
      <van-field readonly label="账簿号" v-if="accountType=='银行存款'&&villageAccountType=='多级账簿'" v-model="accountNo" input-align="right" label-width="auto" />
      <van-cell title="管控类型" v-if="accountType=='银行存款'&&villageAccountType=='多级账簿'&&bankType=='山东省农村信用社（农商行）'" >
        <template #right-icon>
          {{form.managementControlType == '1' ? '账簿余额':'中心账簿'}}
        </template>
      </van-cell>
      <van-field readonly label="中心账套" v-if="accountType=='银行存款'&&form.managementControlType=='2'" v-model="centralBookId" input-align="right" label-width="auto" />
      <van-field readonly label="会计科目" v-if="accountType=='银行存款'&&form.managementControlType=='2'" v-model="centralSubjectId" input-align="right" label-width="auto" />
      <van-field readonly label="账户名称" v-model="form.accountName" input-align="right" label-width="auto"/>
      <van-field readonly label="银行账户" v-if="accountType=='银行存款'" v-model="form.bankAccountNumber" input-align="right" label-width="auto"/>
      <van-field readonly label="开户银行" v-if="accountType=='银行存款'" v-model="form.bankName" input-align="right" label-width="auto"/>
      <van-field readonly label="联行号" v-if="accountType=='银行存款'" v-model="form.paymentLines" input-align="right" label-width="auto"/>
      <van-field readonly label="关联科目" v-model="subjectValue" input-align="right" label-width="auto" />
      <van-field readonly label="科目名称" v-if="accountType=='银行存款'" v-model="form.subjectNameAll" input-align="right" label-width="auto" />
      <van-field readonly label="支付口令" v-if="accountType=='银行存款'" v-model="form.site" input-align="right" label-width="auto"/>
      <van-field readonly label="手机号" v-if="accountType=='银行存款'&&bankType=='建设银行'" v-model="form.alternateField1" input-align="right" label-width="auto"/>
      <van-field readonly label="账户类别" v-model="bankAccountType" input-align="right" label-width="auto"/>
      <van-field readonly label="开户银行地址" v-if="accountType=='银行存款'" v-model="form.site" input-align="right" label-width="auto"/>
      <van-field readonly label="账户密码" v-if="accountType=='银行存款'" v-model="form.accountPassword" input-align="right" label-width="auto"/>
      <van-field readonly label="初始余额" v-model="form.initialBalance" input-align="right" label-width="auto"/>
      <van-field readonly label="内部账号" v-if="accountType=='银行存款'&&bankType=='农业银行'" v-model="alternateField1" input-align="right" label-width="auto"/>
      <van-field readonly label="内部户名" v-if="accountType=='银行存款'&&bankType=='农业银行'" v-model="alternateField2" input-align="right" label-width="auto"/>
      <van-field readonly label="账簿号" v-if="accountType=='银行存款'&&bankType=='农业银行'" v-model="alternateField3" input-align="right" label-width="auto"/>
      <van-cell title="是否停用" v-if="accountType=='银行存款'" >
        <template #right-icon>
          {{form.status == 'Y' ? '是':'否'}}
        </template>
      </van-cell>
    </div>
    <p class="main_title" v-if="accountType=='银行存款'" >账簿信息</p>
    <div class="main_box" v-if="accountType=='银行存款'" >
      <van-cell title="账簿是否限额">
        <template #right-icon>
          {{form.status == 'Y' ? '是':'否'}}
        </template>
      </van-cell>
      <van-field readonly label="单笔交易限额" v-model="form.initialBalance" input-align="right" label-width="auto"/>
      <van-cell title="账簿是否透支">
        <template #right-icon>
          {{form.status == 'Y' ? '是':'否'}}
        </template>
      </van-cell>
      <van-field readonly label="投掷类型" v-model="form.initialBalance" input-align="right" label-width="auto"/>
      <van-field readonly label="透支额度（元）" v-model="form.initialBalance" input-align="right" label-width="auto"/>
    </div>
  </div>
</template>

<script>
  import { getAccount , getSubjectDetail } from "@/api/onlineHome/bankAgriculture/paymentAccount";
  export default {
    name: "paymentAccountDetail",
    data() {
      return {
        showAccountType:false,
        showSubjectId:false,

        minDate: new Date(),
        maxDate: new Date(2025, 10, 1),
        currentDate: new Date(),
        jgList:{},

        accountType:'',
        bankType:'',
        villageAccountType:'',
        taccountId:'',
        accountNo:'',
        managementControlType:'',
        centralBookId:'',
        centralSubjectId:'',
        bankAccountType:'',
        alternateField1:'',
        alternateField2:'',
        alternateField3:'',
        subjectValue:'',
        wfydlx:'',

        wfydlxDictionaries:[],
        jglxDictionaries:[],
        subjectDictionaries:[],
        typeDictionaries:[],
        subjectDeatil:[],

        form:{}
      };
    },
    created() {
      this.getDetail();
    },
    methods: {
      getDetail(){
        getAccount(this.$route.query.id).then((response) => {
          // 账户类型
          this.houseGetDicts("account_type_cashier").then((res) => {
            for (var i = 0; i < res.data.length; i++) {
              this.typeDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
            }
            this.accountType = this.selectDictLabel(res.data, response.data.accountType);
          });
          getSubjectDetail().then((res) => {
            for (var i = 0; i < res.rows.length; i++) {
              this.subjectDictionaries.push({text: res.rows[i].subjectNameAll, value: res.rows[i].subjectId});
            }
            this.subjectValue = this.selectSubject(res.rows , response.data.subjectId);
          });
          this.form = response.data;
        });
      },
      selectSubject(datas, value) {
        var actions = [];
        Object.keys(datas).some((key) => {
          if (datas[key].subjectId == ('' + value)) {
            actions.push(datas[key].subjectNameAll);
            return true;
          }
        })
        return actions.join('');
      },
    },
  }
</script>

<style scoped lang="scss">
  .app-container {
    padding: 2% 0;
  }
  .main_title{
    font-size: 0.4rem;
    color: #1D6FE9;
    margin: 0.2rem 6%;
    margin-top: 0;
    position: relative;
  }
  .main_box{
    width: 96%;
    margin: 0 auto;
    border-radius: 6px;
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
    overflow: hidden;
    background-color: #FFF;
  }
  .submitButton{
    width: 80%;
    margin: 0 auto;
    background-color: #1D6FE9;
  }

  .addFamily{
    position: absolute;
    top: -2px;
    right: 0;
    border-radius: 50%;
  }
</style>
