<!--
 * @Author: jiangzaicheng jiangzaicheng_jzc@163.com
 * @Date: 2022-07-07 16:13:13
 * @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
 * @LastEditTime: 2022-08-18 14:19:37
 * @FilePath: \mcep-h5\src\components\common\Bottom.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->

<template>
  <div class="body">
    <div class="rarle">
      <tatle-bar :tatle="tatleName"></tatle-bar>
    </div>
    <div>
      <van-tabs color="#3672F1">
        <van-tab title="申请详情">
          <div class="layout">
            <van-row type="flex" class="CoolName">
              <van-col span="24" class="coollayout">个人信息</van-col>
            </van-row>
            <div class="layoutbody">
              <van-row type="flex" class="layoutName">
                <van-col span="24">
                  <van-cell-group>
                    <van-field label="姓名" :value="name" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
              <van-row type="flex" class="layoutName">
                <van-col span="24">
                  <van-cell-group>
                    <van-field label="身份证号" :value="idcard" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
              <van-row type="flex" class="layoutName">
                <van-col span="24">
                  <van-cell-group>
                    <van-field label="手机号码" :value="phone" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
            </div>
            <van-row type="flex" class="CoolName">
              <van-col span="24" class="coollayout">借款信息</van-col>
            </van-row>
            <div class="layoutbody">
              <van-row type="flex" class="layoutName">
                <van-col span="24">
<!--                  <van-cell-group>-->
<!--                    <van-field label="贷款账号" :value="varieties" readonly input-align="right" />-->
<!--                  </van-cell-group>-->
                  <van-cell-group>
                    <van-field label="贷款品种" :value="loanType" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
              <van-row type="flex" class="layoutName">
                <van-col span="24">
                  <van-cell-group>
                    <van-field label="借款金额" :value="amount" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
<!--              <van-row type="flex" class="layoutName">-->
<!--                <van-col span="24">-->
<!--                  <van-cell-group>-->
<!--                    <van-field label="借款到期日" :value="borrow" readonly input-align="right" />-->
<!--                  </van-cell-group>-->
<!--                </van-col>-->
<!--              </van-row>-->
              <van-row type="flex" class="layoutName">
                <van-col span="24">
                  <van-cell-group>
                    <van-field label="借款用途" :value="purposes" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
              <van-row type="flex" class="layoutName">
                <van-col span="24">
                  <van-cell-group>
                    <van-field label="业务办理地区" :value="businessArea" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
<!--              <van-row type="flex" class="layoutName">-->
<!--                <van-col span="24">-->
<!--                  <van-cell-group>-->
<!--                    <van-field label="担保方式" :value="area" readonly input-align="right" />-->
<!--                  </van-cell-group>-->
<!--                </van-col>-->
<!--              </van-row>-->
<!--              <van-row type="flex" class="layoutName">-->
<!--                <van-col span="24">-->
<!--                  <van-cell-group>-->
<!--                    <van-field label="还款方式" :value="intentions" readonly input-align="right" />-->
<!--                  </van-cell-group>-->
<!--                </van-col>-->
<!--              </van-row>-->
<!--              <van-row type="flex" class="layoutName">-->
<!--                <van-col span="24">-->
<!--                  <van-cell-group>-->
<!--                    <van-field label="借款利率" :value="customer" readonly input-align="right" />-->
<!--                  </van-cell-group>-->
<!--                </van-col>-->
<!--              </van-row>-->
              <van-row type="flex" class="layoutName">
                <van-col span="24">
                  <van-cell-group>
                    <van-field label="意向机构" :value="intentionOrg" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
              <van-row type="flex" class="layoutName">
                <van-col span="24">
                  <van-cell-group>
                    <van-field label="客户经理" :value="manager" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
              <van-row type="flex" class="layoutName">
                <van-col span="24">
                  <van-cell-group>
                    <van-field label="客户经理联系方式" label-width="120" :value="managerPhone" readonly input-align="right" />
                  </van-cell-group>
                </van-col>
              </van-row>
            </div>
          </div>
        </van-tab>
<!--        <van-tab title="业务进度" v-if="status === statusl">-->
          <van-tab title="业务进度" v-if="true">
          <van-steps direction="vertical" :active="0">
            <van-step>
              <van-row type="flex" class="layoutStep" gutter="10">
                <van-col span="4" class="coolllo">童菲可</van-col>
                <van-col span="6" class="coolllo">总行审批岗</van-col>
                <van-col span="12" class="coolllo">2021/02/21 03:14:12</van-col>
              </van-row>
            </van-step>
            <van-step>
              <van-row type="flex" class="layoutStep" gutter="10">
                <van-col span="4" class="coolllo">孙先辉</van-col>
                <van-col span="6" class="coolllo">支行行长</van-col>
                <van-col span="12" class="coolllo">2021/02/21 03:14:12</van-col>
              </van-row>
              <van-row type="flex" class="layoutStep" gutter="10">
                <van-col span="24" class="coolllo">同意</van-col>
              </van-row>
            </van-step>
            <van-step>
              <van-row type="flex" class="layoutStep" gutter="10">
                <van-col span="4" class="coolllo">李新林</van-col>
                <van-col span="6" class="coolllo">支行审批岗</van-col>
                <van-col span="12" class="coolllo">2021/02/21 03:14:12</van-col>
              </van-row>
              <van-row type="flex" class="layoutStep" gutter="10">
                <van-col span="24" class="coolllo">同意</van-col>
              </van-row>
            </van-step>
            <van-step>
              <van-row type="flex" class="layoutStep" gutter="10">
                <van-col span="4" class="coolllo">赵飞</van-col>
                <van-col span="6" class="coolllo">客户经理</van-col>
                <van-col span="12" class="coolllo">2021/02/21 03:14:12</van-col>
              </van-row>
              <van-row type="flex" class="layoutStep" gutter="10">
                <van-col span="24" class="coolllo">同意</van-col>
              </van-row>
            </van-step>
          </van-steps>
        </van-tab>
      </van-tabs>
    </div>
  </div>
</template>

<script lang="ts">
import { number } from "mathjs";
import { Component, Vue, Prop, Watch, Emit } from "vue-property-decorator";
/*
* title
*/
@Component({
  name: "AccommodDetails"
})
export default class AccommodDetails extends Vue {
  managerPhone="12222222222"
  manager="赵恒请"
  intentionOrg="哈尔滨农信社松北区枝江大道分社"
  businessArea="黑龙江省-哈尔滨市-松北区"
  loanType="一般经营性贷款"
  tatleName = "我的贷款"
  //状态
  status = 2;
  statusl: any ;
  //身份证
  idcard = "23232111978211"
  //姓名
  name = "刘明明"
  //电话
  phone = "15665025053"
  //贷款详情
  varieties = "230000009000000"
  //借款金融
  amount = "500万"
  //到期日
  borrow = "2022-02-01"
  //借款用途
  purposes = "经营"
  //担保方式
  area = "抵押"
  //意向机构
  intentions = "等额本息"
  //借款利率
  customer = "2.54%"
  created() {
    // debugger
    this.statusl = this.$route.params.status
  }


}


</script>
<style scoped lang="scss">
.layout {
  background: rgba(249, 249, 249, 1);
}

.coollayout {
  margin: 3%;
}

.CoolName {
  font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
  font-weight: 700;
  font-style: normal;
  font-size: 16px;
}

.layoutName {
  font-family: 'Arial Normal', 'Arial';
  font-weight: 400;
  font-style: normal;
  font-size: 13px;
  color: #333333;
}
</style>