<template>
  <!-- 提现账号 -->
  <div class="joinpayMchCheckPage flex-col">
    <s-header :name="'提现账号详情'" :noback="false"></s-header>
    <div class="joinpayMchCheckBox flex-col" v-if="infoData">
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">商户名称:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.altMchName}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">商户类型:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.altMerchantType === 10 ? '个人' : ''}}
            {{infoData.altMerchantType === 11 ? '个体工商户' : ''}}
            {{infoData.altMerchantType === 12 ? '企业' : ''}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">联系人姓名:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.busiContactName}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">法人/个人姓名:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.legalPerson}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">法人/个人手机号:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.phoneNo}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">法人/个人身份证号:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.idCardNo}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">身份证有效期:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.idCardExpiry}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">账号类型:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.bankAccountType === '1' ? '借记卡' : ''}}
            {{infoData.bankAccountType === '4' ? '对公账户' : ''}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">银行账户名称:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.bankAccountName}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">银行账号:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.bankAccountNo}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">联行号:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.bankChannelNo}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">结算方式:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.settMode === '1' ? '由汇聚自动结算' : ''}}
            {{infoData.settMode === '2' ? '由商户平台手工结算' : ''}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">结算周期:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.riskDay}}日
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">经营范围:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.manageScope}}
          </div>
        </div>
      </div>
      <div class="van-cell van-field">
        <div class="van-cell__title van-field__label">
          <label for="van-field-3-input">经营地址:</label>
        </div>
        <div class="van-cell__value van-field__value">
          <div class="van-field__body">
            {{infoData.manageAddr}}
          </div>
        </div>
      </div>
      <div class="itemRow" style="display: flex; justify-content: center; padding: 0.5rem;">
        <van-button
          span="5"
          round
          type="primary"
          style="height: 2em; padding: 0 2em; margin: 0 1em; background: rgb(255 0 0 / 20%); color: #ff0000; border-color: #ff0000;"
          @click="changeStatusFun('2')"
        >
          拒绝
        </van-button>
        <van-button
          span="5"
          round
          type="primary"
          style="height: 2em; padding: 0 2em; margin: 0 1em; background: rgb(25 137 250 / 20%); color: #1989fa;"
          @click="changeStatusFun('1')"
        >
          同意
        </van-button>
      </div>
    </div>
    <nav-bar></nav-bar>
  </div>
</template>

<script>
import { Toast } from "vant";
import { onMounted, ref } from 'vue';
import { useRoute, useRouter } from "vue-router";
import navBar from "@/components/NavBar";
import sHeader from "@/components/SimpleHeader";
import { getLoginUser } from "@/common/js/utils";
import { gettJoinpayMchCheckInfo, changetJoinpayMchCheckStatus } from "@/service/taskMessage";

export default {
  components: { sHeader, navBar },
  setup() {
    const user = getLoginUser();
    const route = useRoute();
    const router = useRouter();
    let infoId = '';
    let infoType = '';
    let infoData = ref(null);
    // 初始化页面获取列表
    onMounted(async () => {
      infoId = route.query.infoId;
      infoType = route.query.infoType;
      getInfoData();
    });
    const getInfoData = async () => {
      const { data } = await gettJoinpayMchCheckInfo({id: infoId, type: infoType});
      if (data.code === '00000') {
        infoData.value = data.data;
      } else {Toast.fail(data.message);}
      console.log('getInfoData', infoData);
    }
    const changeStatusFun = async (status) => {
      const { data } = await changetJoinpayMchCheckStatus({ adminId: user.id, type: infoType, id: infoId, status: status, });
      if (data.code === '00000') {
        Toast.fail('操作成功');
        router.push({ path: '/taskJoinPayMchCheck' })
      } else {Toast.fail(data.message);}
    }
    return {
      infoData,
      changeStatusFun
    };
  },
};
</script>

<style lang="less" scoped>
@import "../../../../common/style/common.less";
@import "./index.less";
</style>
