Browse Source

feat: 接口联调

ashui 1 month ago
parent
commit
1b925d2a49
4 changed files with 32 additions and 22 deletions
  1. 2 2
      css/dialog.css
  2. 5 0
      css/index.css
  3. 1 1
      index.html
  4. 24 19
      js/index.js

+ 2 - 2
css/dialog.css

@@ -89,9 +89,9 @@
   height: 36px;
 }
 
-.table-row:not(:last-of-type) {
+/* .table-row:not(:last-of-type) {
   border-bottom: 1px solid rgba(229, 229, 229, 1);
-}
+} */
 
 .table-row span {
   display: flex;

+ 5 - 0
css/index.css

@@ -67,6 +67,11 @@ h3.title {
   border-radius: 16px;
 }
 
+.cwzb-container .period {
+  font-size: 13px;
+  color: rgba(0, 0, 0, 0.65);
+}
+
 .card-conntaier {
   display: flex;
   justify-content: space-between;

+ 1 - 1
index.html

@@ -19,7 +19,7 @@
   </header>
   <div class="content-container">
     <section class="cwzb-container">
-      <h3 class="title">财务指标</h3>
+      <h3 class="title">财务指标 <span class="period"></span></h3>
       <div class="card-conntaier">
         <div class="kcxj item-box">
           <div class="img-box">

+ 24 - 19
js/index.js

@@ -5,6 +5,7 @@ const textStyle = {
   color: '#333',
   fontWeight: 500,
 }
+const dialogTitle = ['库存现金', '银行存款', '应收账款', '应付账款']
 // const hostApi = 'https://dev.jsptax.com'
 const hostApi = 'https://daizhang.jsptax.com'
 
@@ -32,6 +33,7 @@ function showCwzbClickFunc() {
 
 function showDialog(i) {
   console.log('showDialog')
+  document.querySelector('.dialog-title').innerHTML = dialogTitle[i]
   dialogCon.style.display = 'block'
   const footer = document.querySelector('.table-footer')
   if (listData[i].length > 5) {
@@ -46,15 +48,12 @@ function showDialog(i) {
   } else {
     footer.style['border-top'] = 'unset'
   }
-  document.querySelector('.data-list-container').innerHTML = listData[i].map(item => {
-    return `
-        <div class="table-row">
-          <span>${item.subjectName}</span>
-          <span>${item.beginAmount}</span>
-          <span>${item.endAmount}</span>
-        </div>
-      `
-  }).join('')
+
+  const listNodeStr = listData[i].map(item => {
+    return `<div class="table-row"><span>${item.subjectName}</span><span>${item.beginAmount}</span><span>${item.endAmount}</span></div>`
+  })
+  console.log(listNodeStr, '11111111111111')
+  document.querySelector('.data-list-container').innerHTML = listNodeStr.join('')
   const total = listData[i].reduce((acc, cur) => {
     acc.begin += cur.beginAmount
     acc.end += cur.endAmount
@@ -309,15 +308,19 @@ async function getIndexData () {
     acc[key] = value
     return acc
   }, {})
-  const response = await fetch(hostApi + '/api/public/wzfCzList', {
-    method: 'POST',
-    mode: 'cors',
-    headers: {
-      "Content-Type": "application/json",
-      // 'Content-Type': 'application/x-www-form-urlencoded',
-    },
-    body: JSON.stringify(params)
-  })
+  const response = await fetch(
+    hostApi + '/api/public/wzfCzList',
+    // '/api/public/wzfCzList',
+    {
+      method: 'POST',
+      mode: 'cors',
+      headers: {
+        "Content-Type": "application/json",
+        // 'Content-Type': 'application/x-www-form-urlencoded',
+      },
+      body: JSON.stringify(params)
+    }
+  )
   const res = await response.json()
   if (res.errNo === 0) {
     document.querySelector('.company-name').innerHTML = res.data.comName
@@ -325,7 +328,9 @@ async function getIndexData () {
     document.querySelector('.yhck .num').innerHTML = res.data.amount.yhckAmount
     document.querySelector('.yszk .num').innerHTML = res.data.amount.yszkAmount
     document.querySelector('.yfzk .num').innerHTML = res.data.amount.yfzkAmount
-    document.querySelector('.table-header-top .period').innerHTML = cal1Year()[0]
+    const period = cal1Year()[0]
+    document.querySelector('.table-header-top .period').innerHTML = period
+    document.querySelector('.cwzb-container .period').innerHTML = period
     initSzqkCharts(res.data)
     initNsqkCharts(res.data)
     listData = [res.data.kcxjList, res.data.yhckList, res.data.yszkList, res.data.yfzkList,]