Merge branch 'master' of https://hel.hand-china.com/komatsu/komatsu-lease-app

src/components/RepayPlan.vue

@@ -18,7 +18,7 @@
               <td>首期租金</td>
             </tr>
             <tr class="secend_value">
-              <td>￥{{ currencyObj.fristCurrency }}</td>
+              <td>￥{{ currencyObj.headerCurrency }}</td>
               <td>￥{{ currencyObj.fristCurrency }}</td>
             </tr>
           </table>
@@ -60,7 +60,7 @@ defineProps({
       fristCurrency: '0.00',
       times: '0'
     }
-  }, 
+  },
 })
 
 const onClickRight = () => {

src/main.js

@@ -19,3 +19,4 @@ app.use(Notify)
 app.use(Toast)
 // app.use(vConsole)
 app.mount('#app')
+

src/modules/calculator/views/index.vue

@@ -66,6 +66,7 @@ const clickRight = async (testQuatationId) => {
   listValue = [];
   await getList()
 }
+
 </script>
 
 <style scoped lang="less">

src/modules/makeRepayment/api/index.js

 import { get, put, post, File, deleteReq } from '@/utils/http'
 
-const baseURL = import.meta.env.VITE_HTTP_BASE_URL
+const baseURL = import.meta.env.DEV ? '/api' : import.meta.env.VITE_HTTP_BASE_URL
+
 const api = {
-    // getMakingList (data) { // 查询合同制作列表
-    //   return get(
-    //     `${baseURL}/hlct/v1/0/contracts/toMake`,
-    //     {...data}
-    //   )
-    // },
+    // 首页查询
+    getRepayPlantList(data = {}) {
+        return post(`${baseURL}/app/api/app/repayment/details`, data)
+    },
+    // 明细查询
+    getRepayPlanDetail(data ={}){
+        return post(`${baseURL}/app/api/app/project/repayment/details`, data)
+    },
+    //还款计划明细
+    getRepaymentDetails(data={}){
+        return post(`${baseURL}/app/api/app/project/repayment/details`, data)
+    }
 };
 
 export default api;
+
+

src/modules/makeRepayment/views/index.vue

@@ -8,7 +8,7 @@
       <Notice detail="只可对已关联的项目还款" />
 
       <PullRefresh v-model="refreshing" @refresh="onRefresh" class="scroll">
-        <List :finished="finished" finished-text="没有更多了" @load="loadApproval">
+        <List :finished="finished" finished-text="没有更多了">
           <ListItem v-for="item in listValue" :other_title="item.other_title" :title="item.title" :values="item.values"
                     @click="jump" />
         </List>
@@ -27,7 +27,7 @@ import { useRouter } from "vue-router";
 
 const searchVal = $ref('');
 
-const listValue = $ref([
+let listValue = $ref([
   {
     title: '202204-DB001-001',
     other_title: "2022-07-18",
@@ -40,12 +40,26 @@ const listValue = $ref([
   },
 ])
 
-const refreshing = $ref(true);
+let refreshing = $ref(true);
 const finished = $ref(true);
 
-const onRefresh = () => {
+const getList = async () => {
   // 下拉重置参数，重新加载
+  let list = await api.getRepayPlantList({userId: window.localStorage.getItem('userId')});
+  if(list.result === 'SUCCESS'){
+    list  = list.data.map(item => ({
+      ...item,
+      title: item.contractNumber,
+      other_title: item.applyDate?.split(' ')[0],
+      values: [["剩余应还金额", "状态", "融资金额"], [item.residueAmount, item.contractStatusN, item.financeAmount]]
+    }))
+  }else {
+    list = [];
+  }
+  listValue = list;
+  refreshing = false;
 };
+// getList();
 
 const loadApproval = () => {
 

src/modules/makeRepayment/views/plan.vue

@@ -3,24 +3,24 @@
     <template #list>
       <div class="repay_list">
         <div class="left">
-          <div class="times-box" v-for="i in 30">
+          <div class="times-box" v-for="i in currencyObj.times">
             <div class="times">{{ i }}期</div>
           </div>
         </div>
         <div class="right">
-          <div class="item" v-for="i in 30">
+          <div class="item" v-for="item in cashflow">
             <div class="left-item">
               <span>租金</span>
-              <span>2022-06-20</span>
+              <span>{{item.chargeDueDate}}</span>
             </div>
             <div class="center-item">
               <p>
                 <span>应付金额</span>
-                <span>￥9,000.00</span>
+                <span>{{item.dueAmount}}</span>
               </p>
               <p>
                 <span>待付金额</span>
-                <span>￥0.00</span>
+                <span>{{item.obligation}}</span>
               </p>
             </div>
             <div class="right-item">
@@ -50,14 +50,16 @@ import Pay from '../components/Pay.vue'
 import { Icon, Dialog } from 'vant'
 import {ref} from "vue";
 import {useRouter} from "vue-router";
+import api from "../api";
 
 const showDialog = ref(false);
-const currencyObj = $ref({
-  financingCurrency: '200,000.00',
-  headerCurrency: '5,000.00',
-  fristCurrency: '10,000.00',
-  times: '12'
+let currencyObj = $ref({
+  // financingCurrency: '200,000.00',
+  // headerCurrency: '5,000.00',
+  // fristCurrency: '10,000.00',
+  // times: '12'
 })
+let cashflow = []
 const payInfo = ref({});
 let showModal = ref(false);
 
@@ -83,6 +85,23 @@ const router = useRouter();
 const goDamagesDetail = () => {
   router.push({ name: 'makeRepayment-views-liquidatedDamagesDetails' })
 }
+
+const getRepayPlanInfo = async () => {
+  const result = await api.getRepayPlanDetail({"contractId": "777"})
+  if(result.message === '请求成功'){
+    const rows = result.rows[0];
+    currencyObj = {
+      financingCurrency: rows.financeAmount,
+      headerCurrency: rows.firstGold,
+      fristCurrency: rows.firstRentGold,
+      times: rows.cashflow.length
+    }
+    rows.cashflow = rows.cashflow.map(item => { item.calcDate = item.calcDate?.split(" ")[0]; return item })
+    cashflow = rows.cashflow
+    console.log(cashflow);
+  }
+}
+getRepayPlanInfo()
 </script>
 
 <style lang="less" scoped>

src/modules/projectList/api/index.js

 import { get, put, post, File, deleteReq } from '@/utils/http'
 
-const baseURL = import.meta.env.VITE_HTTP_BASE_URL
+const baseURL = import.meta.env.DEV ? '/api' : import.meta.env.VITE_HTTP_BASE_URL
+
 const api = {
-    // getMakingList (data) { // 查询合同制作列表
-    //   return get(
-    //     `${baseURL}/hlct/v1/0/contracts/toMake`,
-    //     {...data}
-    //   )
-    // },
+    // 首页查询
+    getProjectList(data = {}) {
+        return post(`${baseURL}/app/api/app/financing/intention/query`, data)
+    },
+    // 明细查询
+    getProjectDetail(data ={}){
+        return post(`${baseURL}/app/api/app/project/query`, data)
+    },
+    //还款计划明细
+    getRepaymentDetails(data={}){
+        return post(`${baseURL}/app/api/app/project/repayment/details`, data)
+    }
 };
 
 export default api;
+

src/modules/projectList/views/index.vue

@@ -5,7 +5,7 @@
     <section class="list">
       <Search v-model="value" placeholder="请输入项目编号/机型/代理店" />
       <Notice detail="只对已关联的项目进行查询" />
-      <PullRefresh v-model="refreshing" @refresh="onRefresh" class="scroll">
+      <PullRefresh v-model="refreshing" @refresh="getList" class="scroll">
         <List :finished="finished" finished-text="没有更多了" @load="loadApproval">
           <ListItem v-for="item in listValue" :other_title="item.other_title" :title="item.title" :values="item.values"
                     @click="jump" />
@@ -26,20 +26,38 @@ import Plus from '@/components/Plus.vue'
 import api from "../api";
 import { useRouter } from "vue-router";
 
-const listValue = $ref([
-  {
-    title: '2204-DB001-001',
-    other_title: "2022-07-18",
-    values: [["机型", "状态", "代理店"], ["HB2015-1MO", "正常", "江苏-宁隆"]]
-  }
-])
+// const listValue = $ref([
+//   {
+//     title: '2204-DB001-001',
+//     other_title: "2022-07-18",
+//     values: [["机型", "状态", "代理店"], ["HB2015-1MO", "正常", "江苏-宁隆"]]
+//   }
+// ])
 
-const refreshing = $ref(true);
+let refreshing = $ref(true);
 const finished = $ref(true);
 
-const onRefresh = () => {
+let listValue = $ref([]);
+
+
+const getList = async () => {
   // 下拉重置参数，重新加载
+  let list = await api.getProjectList({userId: window.localStorage.getItem('userId')});
+  if(list.result === 'SUCCESS'){
+    list  = list.data.map(item => ({
+      ...item,
+      title: item.intentionNumber,
+      other_title: item.creationDate.split(' ')[0],
+      values: [["机型", "状态", "代理店"], [item.model, item.intentionStatusN, item.agentBpName]]
+    }))
+  }else {
+    list = [];
+  }
+  listValue = list.reverse();
+  refreshing = false;
 };
+getList();
+
 
 const loadApproval = () => {
 

src/modules/projectList/views/plan.vue

+<template>
+  <RepayPlan navTitle="还款计划" :currencyObj="currencyObj" @leftClick="backToLast">
+    <template #list>
+      <div class="repay_list">
+        <div class="left">
+          <div class="times-box" v-for="i in currencyObj.times">
+            <div class="times">{{ i }}期</div>
+          </div>
+        </div>
+        <div class="right">
+          <div class="item" v-for="item in cashflow">
+            <div class="left-item">
+              <span>租金</span>
+<!--              <span>{{ item.chargeDueDate}}</span>  这个是实际字段-->
+              <span>{{ item.calcDate}}</span>
+            </div>
+            <div class="center-item">
+              <p>
+<!--                <span>应付金额</span>-->
+                <span>{{item.dueAmount}}</span>
+              </p>
+              <p>
+<!--                <span>待付金额</span>-->
+<!--                <span>￥0.00</span>-->
+              </p>
+            </div>
+            <div class="right-item">
+              <span>明细</span>
+              <span class="flag-button paying" v-if="item.writeOffFlag === 'NOT'">
+               <Icon name="clock-o" style="margin-right: 1px;" />{{item.writeOffFlagN}}
+              </span>
+              <span class="flag-button paid" v-else-if="item.writeOffFlag === 'FULL'">
+                <Icon name="passed" style="margin-right: 1px;" />{{item.writeOffFlagN}}
+              </span>
+              <span class="flag-button overtime" v-else>
+                <Icon style="margin-right: 1px;" name="info-o" />{{item.writeOffFlagN}}
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </template>
+    <template #footer>
+
+    </template>
+  </RepayPlan>
+</template>
+
+<script setup>
+import RepayPlan from '@/components/RepayPlan.vue'
+import { Icon } from 'vant'
+import {useRouter} from 'vue-router'
+import api from "../api";
+
+const router = useRouter()
+let currencyObj = $ref({
+  // financingCurrency: '200,000.00',
+  // headerCurrency: '5,000.00',
+  // fristCurrency: '10,000.00',
+  // times: '12'
+})
+let cashflow = []
+
+const getRepayPlanInfo = async () => {
+  const result = await api.getRepaymentDetails({"contractId": "777"})
+  if(result.message === '请求成功'){
+    const rows = result.rows[0];
+    currencyObj = {
+      financingCurrency: rows.financeAmount,
+      headerCurrency: rows.firstGold,
+      fristCurrency: rows.firstRentGold,
+      times: rows.cashflow.length
+    }
+    rows.cashflow = rows.cashflow.map(item => { item.calcDate = item.calcDate?.split(" ")[0]; return item })
+    cashflow = rows.cashflow
+    console.log(cashflow);
+  }
+}
+getRepayPlanInfo()
+
+const backToLast = () => {
+  router.replace({
+     name: 'projectList-views-projectForm'
+  })
+}
+</script>
+
+<style lang="less" scoped>
+@lineColr: #dcdddf;
+
+.repay_list {
+  display: flex;
+  width: 100%;
+  height: 98%;
+  overflow-y: auto;
+  scrollbar-width: none;
+  /* firefox */
+}
+
+.repay_list::-webkit-scrollbar {
+  display: none;
+  /* Chrome Safari */
+}
+
+@leftW: 45px;
+
+.left {
+  flex: 0 1 @leftW;
+}
+
+.times-box {
+  display: flex;
+  height: 100px;
+  flex-direction: column;
+  justify-content: center;
+  background-image: linear-gradient(@lineColr 0%, @lineColr 16%, transparent 16%, transparent 33%, @lineColr 33%, @lineColr 83%, transparent 83%, transparent 100%);
+  /* 35%设置虚线点y轴上的长度 */
+  background-position: 50% 50%;
+  /* right配置右边框位置的虚线 */
+  background-size: 1px 20px;
+  /* 第一个参数设置虚线点x轴上的长度；第二个参数设置虚线点的间距 */
+  background-repeat: repeat-y;
+}
+
+
+.times-box:nth-child(1) {
+  margin-top: 25px;
+  height: 70px;
+  justify-content: flex-start;
+}
+
+.times-box:nth-last-child(1) {
+  // bottom: 80px;
+  height: 70px;
+  justify-content: flex-end;
+}
+
+.times {
+  height: @leftW;
+  width: @leftW;
+  display: flex;
+  justify-content: center;
+  line-height: @leftW;
+  color: #fff;
+  background-color: #019ae5;
+  border-radius: 5px;
+}
+
+.right {
+  flex: 1 0 auto;
+  padding-left: 20px;
+}
+
+.item {
+  display: flex;
+  justify-content: space-around;
+  box-sizing: border-box;
+  margin-top: 15px;
+  margin-bottom: 30px;
+  width: 98%;
+  height: 70px;
+  border: 1px solid #dedede;
+  background-color: #eef5fd;
+  border-radius: 5px;
+  padding: 10px 5px 3px 10px;
+  font-size: 13px;
+
+  &>div {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+  }
+}
+
+
+
+.left-item {
+  flex: 1 0 30%;
+
+  span:nth-child(1) {
+    font-weight: 600;
+  }
+
+  span:nth-child(2) {
+    color: gray;
+  }
+}
+
+
+
+.center-item {
+  flex: 1 0 45%;
+
+  p {
+    color: gray;
+    display: flex;
+    justify-content: space-between;
+
+    span:nth-child(1) {
+      font-weight: 600;
+    }
+  }
+
+  &>p:nth-child(1) span:nth-child(1) {
+    color: #019ae5;
+  }
+}
+
+.right-item {
+  flex: 1 0 25%;
+  text-align: center;
+
+  span:nth-child(1) {
+    color: #019ae5;
+
+  }
+
+  span:nth-child(2) {
+    color: gray;
+  }
+}
+
+.flag-button {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 80%;
+  margin: 0 auto;
+  height: 40%;
+  border-radius: 10px;
+  font-size: 12px;
+}
+
+.paying{
+  background-color: gray;
+  color: #fff !important;
+  border: 1px solid #e2e3e4;
+}
+
+.paid{
+  background-color: #eeeeee;
+  color: gray !important;
+  border: 1px solid #e2e3e4;
+}
+
+.overtime {
+  background-color: #eeeeee;
+  color: orange !important;
+  border: 1px solid #e2e3e4;
+}
+
+.nopay {
+  background-color: #bec2c5;
+  color: white !important;
+  border: 1px solid #bec2c5;
+}
+
+.pay {
+  background-color: #f0f0f0;
+  color: gray !important;
+  border: 1px solid #eaeaea;
+}
+</style>

src/modules/projectList/views/projectForm.vue

@@ -6,8 +6,10 @@
       <section class="form-area">
         <AuForm v-model="formBaseConfig" :key="form" moduleName="项目基本信息"/>
         <GuarantorList :values="listArr" moduleName="担保方信息" />
-        <AuForm v-model="formGuarantorConfig" :key="form" moduleName="开票信息"/>
-        <Cell title="还款计划" is-link class="cell-title" to="/repayplan/views/plan"/>
+        <AuForm v-model="formBillingInfoConfig" :key="form" moduleName="开票信息"/>
+        <AuForm v-model="formleaseInfoConfig" :key="form" moduleName="租赁物信息"/>
+        <Cell title="还款计划" is-link class="cell-title" @click="gotoRepayPlan"/>
+<!--        to="/repayplan/views/plan"/-->
       </section>
     </div>
   </div>
@@ -19,22 +21,15 @@ import { NavBar, Button, Field, Cell } from "vant";
 import AuForm from '@/components/AuForm.vue';
 import AuFormClass from "@/components/useAuForm";
 import GuarantorList from '../components/GuarantorList.vue'
+import { onActivated } from "vue";
+import api from "../api";
+import { useRouter } from "vue-router";
 
-const form = $ref();
-const listArr = $ref([
-  {
-    sortId: 1,
-    name: '李某某'
-  },
-  {
-    sortId: 2,
-    name: '担保人2'
-  },
-])
-const formBaseConfig = $ref(new AuFormClass([
+
+const formBaseConfigArr = [
   {
     title: '合同编号',
-    propName: 'paymentReqDate',
+    propName: 'projectNumber',
     type: 'input',
     value: '',
     isRequired: false,
@@ -42,36 +37,201 @@ const formBaseConfig = $ref(new AuFormClass([
   },
   {
     title: '项目编号',
-    propName: 'paymentReqDat3e',
+    propName: 'itemProjectNumber',
     type: 'input',
-    value: '1000',
+    value: '',
     isRequired: false,
     disabled: true,
   },
   {
     title: '代理店',
-    propName: 'paymentReqDat3e',
+    propName: 'decryptAgencyBpName',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '申请日期',
+    propName: 'applyDate',
     type: 'input',
     value: '',
+    isRequired: false,
     disabled: true
   },
   {
     title: '租赁类型',
-    propName: 'paymentReqDat3e',
+    propName: 'refV06N',
     type: 'input',
     value: '',
     isRequired: false,
     disabled: true
   },
   {
-    title: '首付款金额',
-    propName: 'paymentReqDat3e',
+    title: '物件属性',
+    propName: 'leaseProperties',
     type: 'input',
     value: '',
     isRequired: false,
     disabled: true
   },
-]))
+  {
+    title: '开户行',
+    propName: 'bankAccountName',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '开户行名称',
+    propName: 'bankBranchName',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '开户行账号',
+    propName: 'bankAccountNum',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+]
+const formBillingInfoArr = [
+  {
+    title: '纳税人类型',
+    propName: 'taxpayerType',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true,
+  },
+  {
+    title: '纳税人识别',
+    propName: 'taxRegistryNum',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true,
+  },
+  {
+    title: '发票抬头',
+    propName: 'invoiceTitle',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '发票电话',
+    propName: 'invoiceBpPhoneNum',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '发票地址',
+    propName: 'invoiceBpAddressPhoneNum',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '发票开户行',
+    propName: 'invoiceBpBankAccount',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '发票账号',
+    propName: 'invoiceBpAccount',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  }
+]
+const formleaseInfoArr = [
+  {
+    title: '金融产品',
+    propName: 'productReqNumber',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true,
+  },
+  {
+    title: '测算方式',
+    propName: 'calculationMethod',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true,
+  },
+  {
+    title: '租赁物分类',
+    propName: 'leaseTypeN',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '物件名称',
+    propName: 'fullName',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '机型',
+    propName: 'model',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '机号',
+    propName: 'machineNumber',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  },
+  {
+    title: '物件价格',
+    propName: 'leaseValue',
+    type: 'input',
+    value: '',
+    isRequired: false,
+    disabled: true
+  }
+]
+const form = $ref();
+let listArr = $ref([
+  // {
+  //   sortId: '序号',
+  //   bpName: '担保方名称'
+  // },
+  // {
+  //   sortId: 1,
+  //   bpName: '李某某'
+  // },
+  // {
+  //   sortId: 2,
+  //   bpName: '担保人2'
+  // },
+])
+const formBaseConfig = $ref(new AuFormClass(formBaseConfigArr))
 const formGuarantorConfig = $ref(new AuFormClass([
   {
     title: '纳税人类别',
@@ -114,6 +274,98 @@ const formGuarantorConfig = $ref(new AuFormClass([
     disabled: true
   },
 ]))
+const formBillingInfoConfig = $ref(new AuFormClass(formBillingInfoArr))
+const formleaseInfoConfig = $ref(new AuFormClass(formleaseInfoArr))
+let contractId = $ref(null);
+
+const projectInfoDetail = async () => {
+  // 下拉重置参数，重新加载
+  let result = await api.getProjectDetail({"contractId": "777"});
+  console.log('list===', result);
+  if(result.success) {
+    let rows = result.rows;
+    let baseInfo = [];
+    let guarantorInfo = [];
+    let billingInfo = [];
+    let leaseInfo = [];
+    if (rows[0]?.basicInformationList.length !== 0) {
+      baseInfo = rows[0].basicInformationList[0];
+      formBaseConfig.replace(formBaseConfigArr.map(item => {
+        item.value = baseInfo[item.propName] || '';
+        return item
+      }))
+      contractId= baseInfo.contractId;
+    }
+
+    if(rows[0]?.guarantorInformationList.length !== 0){
+      guarantorInfo = rows[0].guarantorInformationList
+      listArr = guarantorInfo.map((item, index) =>({
+        sortId: index +1,
+        bpName: item.bpName
+      }))
+      listArr.unshift({
+          sortId: '序号',
+          bpName: '担保方名称'
+      })
+    }
+
+    if(rows[0]?.billingInformationList.length !== 0){
+      billingInfo = rows[0].billingInformationList[0];
+      formBillingInfoConfig.replace(formBillingInfoArr.map(item => {
+        item.value = billingInfo[item.propName] || '';
+        return item
+      }))
+    }
+
+    if(rows[0]?.leaseInformationList.length !== 0){
+      leaseInfo = rows[0].leaseInformationList[0]
+      formleaseInfoConfig.replace(formleaseInfoArr.map(item => {
+        item.value = leaseInfo[item.propName] || '';
+        return item
+      }))
+    }
+
+  }
+
+};
+
+projectInfoDetail();
+
+
+// const setup = (props,ctx) => {
+//   // const router = useRouter();
+//   //router是全局路由对象，route= userRoute()是当前路由对象
+//   let router = useRouter();
+//   let gotoRepayPlan = () => {
+//     console.log('hhaha')
+//     router.push({
+//       //传递参数使用query的话，指定path或者name都行，但使用params的话，只能使用name指定
+//       // path:'/home',
+//       // query:{
+//       //   num:1
+//       // }
+//       name: 'repayPlan-views-plan',
+//       params: {
+//         contractId: '777'
+//       }
+//     });
+//   }
+//     return{
+//       gotoRepayPlan
+//     }
+// }
+const router = useRouter();
+const gotoRepayPlan = () =>{
+  console.log(contractId);
+  router.push({
+    name: 'projectList-views-plan',
+    query: {
+      contractId: contractId
+    }
+  })
+}
+
+
 </script>
 
 <style lang="less" scoped>

src/modules/repayPlan/api/index.js

+import { get, put, post, File, deleteReq } from '@/utils/http'
+
+const baseURL = import.meta.env.DEV ? '/api' : import.meta.env.VITE_HTTP_BASE_URL
+
+const api = {
+    //还款计划明细
+    getRepaymentDetails(data={}){
+        return post(`${baseURL}/app/api/app/project/repayment/details`, data)
+    }
+};
+
+export default api;
+

src/modules/repayPlan/views/plan.vue

@@ -3,15 +3,15 @@
     <template #list>
       <div class="repay_list">
         <div class="left">
-          <div class="times-box" v-for="i in 30">
+          <div class="times-box" v-for="i in currencyObj.times">
             <div class="times">{{ i }}期</div>
           </div>
         </div>
         <div class="right">
-          <div class="item" v-for="i in 30">
+          <div class="item" v-for="item in cashflow">
             <div class="left-item">
               <span>租金</span>
-              <span>2022-06-20</span>
+              <span>{{ item.chargeDueDate}}</span>
             </div>
             <div class="center-item">
               <p>
@@ -26,7 +26,7 @@
             <div class="right-item">
               <span>明细</span>
               <span class="flag-button overtime">
-                <Icon style="margin-right: 1px;" name="info-o" />逾期
+                <Icon style="margin-right: 1px;" name="info-o" />{{item.writeOffFlagN}}
               </span>
             </div>
           </div>
@@ -42,13 +42,36 @@
 <script setup>
 import RepayPlan from '@/components/RepayPlan.vue'
 import { Icon } from 'vant'
+import {useRoute} from 'vue-router'
+import api from "../api";
 
-const currencyObj = $ref({
-  financingCurrency: '200,000.00',
-  headerCurrency: '5,000.00',
-  fristCurrency: '10,000.00',
-  times: '12'
+
+let currencyObj = $ref({
+  // financingCurrency: '200,000.00',
+  // headerCurrency: '5,000.00',
+  // fristCurrency: '10,000.00',
+  // times: '12'
 })
+let cashflow = []
+//writeOffFlag: "NOT"
+// writeOffFlagN: "待付"
+
+const getRepayPlanInfo = async () => {
+  const result = await api.getRepaymentDetails({"contractId": "777"})
+  if(result.message === '请求成功'){
+    const rows = result.rows[0];
+    currencyObj = {
+      financingCurrency: rows.financeAmount,
+      headerCurrency: rows.firstGold,
+      fristCurrency: rows.firstRentGold,
+      times: rows.cashflow.length
+    }
+    // rows.cashflow = rows.cashflow.map(item => { item.chargeDueDate = item.chargeDueDate.split(" ")[0]; return item })
+    cashflow = rows.cashflow
+    console.log(cashflow);
+  }
+}
+getRepayPlanInfo()
 </script>
 
 <style lang="less" scoped>

src/utils/http.js

@@ -234,7 +234,7 @@ export function put(url, param = {}) {
   })
 }
 
-// delete 请求 
+// delete 请求
 export function deleteReq(url, param = {}) {
   // param.user_id = window.localStorage.user_id
   // param.access_token = window.localStorage.access_token