下载中心修改完成,添加下载接口

components/supportCom/downloads.vue

@@ -42,8 +42,8 @@
     </div>
     <div class="downloads-more">
       <div class="more-text">
-        没有找到您需要的资料？
-        请联系我们，我们将竭诚为您服务。
+        没有找到您需要的资料？请
+        联系我们，我们将竭诚为您服务。
       </div>
     </div>
   </div>
@@ -89,13 +89,26 @@ export default {
     },
     switchType(key){
       if (this.nowKey !== key){
+        this.$root.$emit('loadDownloadItem',key);
         this.nowKey = key;
         let items = this.downloads.find(item=>item.key === key);
-        this.subItems = items?items.subItems:[];
-        this.nowTitle = `${items?items.title:''}`;
+        console.log(items);
+        if(!items.length){
+          // 如果没有则等下一tick重新获取数据
+          setTimeout(()=>{
+            let items = this.downloads.find(item=>item.key === key);
+            this.subItems = items?items.subItems:[];
+            this.nowTitle = `${items?items.title:''}`;
+          },300);
+        }else{
+          this.subItems = items?items.subItems:[];
+          this.nowTitle = `${items?items.title:''}`;
+        }
+
       }
     },
     filterTypeChangeHandle(){
+      console.log('触发更新')
       // 等待700毫秒,防抖
       if (this.waitTimer){
         clearTimeout(this.waitTimer);
@@ -263,4 +276,14 @@ export default {
   justify-content: flex-end;
   align-items: center;
 }
+.downloads-more{
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: flex-start;
+  margin-top: 20px;
+  cursor: default;
+}
 </style>

pages/about/index.vue

@@ -0,0 +1,27 @@
+<template>
+  <div class="about-us">
+    <lucency-header :lang="lang" page-key="solution" />
+    <default-footer :lang="lang"/>
+
+    <site-bar wechat-src="/image/wechat.jpg"></site-bar>
+  </div>
+</template>
+
+<script>
+import langMap from "@/map/langMap";
+import defaultFooter from "~/components/footer/defaultFooter";
+export default {
+  name: "aboutIndex",
+  props:['uLang'],
+  data(){
+    return {
+      langType: langMap.lang,
+      lang: this.uLang?this.uLang:langMap.lang.cn,
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

pages/support/index.vue

@@ -18,9 +18,38 @@
 </template>
 
 <script>
+import qs from "qs";
+
+
 import lucencyHeader from "~/components/header/lucencyHeader";
 import langMap from "@/map/langMap";
 import handle from "@/until/handle";
+import {unescapeHtml} from "@/until/unescapeHtml";
+
+function getFileIcon(fileName){
+  // 获取文件后缀
+  if(!fileName){
+    return 'unknownfile';
+  }
+  const fileSuffix = fileName.split('.').pop();
+  switch (fileSuffix) {
+    case 'doc':
+      return 'doc';
+    case 'docx':
+      return 'doc';
+    case 'pdf':
+      return 'pdf';
+    case 'png':
+      return 'img';
+    case 'jpg':
+      return 'img';
+    case 'jpeg':
+      return 'img';
+    default:
+      return 'unknownfile';
+
+  }
+}
 export default {
   name: "index",
   props:['uLang'],
@@ -96,6 +125,7 @@ export default {
 
   mounted() {
     this.$root.$on('changeLang',this.switchLang);
+    this.$root.$on('loadDownloadItem',this.loadDownloadItems);
     this.loadDownloads();
   },
 
@@ -112,20 +142,57 @@ export default {
       }
     },
     async loadDownloads(){
-      // todo 从后台获取下载列表数据
       let err, res;
-      [err, res] = await handle(this.$axios.$get('/api/downloadItem.php'));
+      [err, res] = await handle(this.$axios.$get('/api/getDownloads.php'));
       if(err) {
         console.log(err);
         return 0;
       }
       if(res.rcode === 1){
-        this.downloadsType = res.data;
+
+        // this.downloadsType = res.data;
+        this.downloadsType = res.data.map(item=>{
+          item.key = item.id;
+          return item;
+        });
       }else{
         console.log(res.msg);
         console.log(res);
       }
 
+    },
+    async loadDownloadItems(downloadId){
+      console.log(`获取下载项${downloadId}`)
+      let err, res;
+      const queryData = {
+        id: downloadId
+      };
+      let url = '/api/getDownloadItems.php';
+      let data = qs.stringify(queryData);
+      [err, res] = await handle(this.$axios.post(
+        url,
+        data
+      ));
+      if(err){
+        console.log(err);
+        return null;
+      }
+      let result = res.data;
+      console.log(result)
+      if(result.rcode === 1){
+        // 匹配对应的id
+        let downloadItem = this.downloadsType.find(item => item.id === downloadId);
+        let arr = result.data?result.data:[];
+        downloadItem.subItems = arr.map(item=>{
+          item.title = unescapeHtml(item.remark);
+          item.icon = getFileIcon(item.files);
+          item.src = item.files;
+          return item;
+        });
+      }else{
+        console.error(result.msg);
+        console.log(result);
+      }
     }
   },
 }

phpAPi/getDownloadItems.php

@@ -0,0 +1,49 @@
+<?php
+include('../conn_mysqli.php');
+include('../phpMode/rcodeMap.php');
+
+// 目前基于设备管理的下载项
+$page = isset($_POST['page']) ? max(1, min(10, intval($_POST['page']))) : 1;
+// 设置 $limit 的默认值为20，并限定取值范围在1-100之间
+$limit = isset($_POST['limit']) ? max(1, min(100, intval($_POST['limit']))) : 20;
+$offset = ($page - 1) * $limit;
+$id = $_POST['id'];
+header('Content-Type:text/json;charset=utf-8;');
+$resObj = array(
+  'rcode' => Rcode_OK,
+  'data' => "",
+  'msg' => 'ok'
+);
+
+if(!isset($_POST['id'])){
+  $resObj['rcode'] = Rcode_NotParam;
+  $resObj['data'] = "";
+  $resObj['msg'] = "id is must set";
+  echo json_encode($resObj);
+  exit;
+}
+
+try {
+  set_time_limit(50);
+  $conn = createConn();
+  $sql = "";
+  $stmt = null;
+  // 获取id为
+  $sql = 'select * from mysql85931094_db.hfy_downloads where p_id = ?   order by id desc limit ?,?';
+  $stmt = mysqli_prepare($conn, $sql);
+  mysqli_stmt_bind_param($stmt, "sdd",$id, $offset, $limit);
+  mysqli_stmt_execute($stmt);
+  $res = mysqli_stmt_get_result($stmt);
+  while ($row = mysqli_fetch_assoc($res)) {
+    $rs[] = $row;
+  }
+  mysqli_close($conn);
+  $resObj['data'] = $rs;
+  echo json_encode($resObj);
+}catch(Exception $e)
+{
+//  echo 'Message: ' .$e->getMessage();
+  $resObj['rcode'] = Rcode_ServerError;
+  $resObj['msg'] = 'server error';
+  echo json_encode($resObj);
+}

phpAPi/getDownloads.php

@@ -0,0 +1,41 @@
+<?php
+include('../conn_mysqli.php');
+include('../phpMode/rcodeMap.php');
+
+// 目前基于设备管理的下载项
+$page = isset($_GET['page']) ? max(1, min(10, intval($_GET['page']))) : 1;
+// 设置 $limit 的默认值为20，并限定取值范围在1-100之间
+$limit = isset($_GET['limit']) ? max(1, min(100, intval($_GET['limit']))) : 20;
+$offset = ($page - 1) * $limit;
+
+header('Content-Type:text/json;charset=utf-8;');
+$resObj = array(
+  'rcode' => Rcode_OK,
+  'data' => "",
+  'msg' => 'ok'
+);
+
+try {
+  set_time_limit(50);
+  $conn = createConn();
+  $sql = "";
+  $stmt = null;
+  $sql = 'select * from mysql85931094_db.hfy_download  order by id desc limit ?,?';
+  $stmt = mysqli_prepare($conn, $sql);
+  mysqli_stmt_bind_param($stmt, "dd", $offset, $limit);
+  mysqli_stmt_execute($stmt);
+  $res = mysqli_stmt_get_result($stmt);
+
+  while ($row = mysqli_fetch_assoc($res)) {
+    $rs[] = $row;
+  }
+  mysqli_close($conn);
+  $resObj['data'] = $rs;
+  echo json_encode($resObj);
+}catch(Exception $e)
+{
+//  echo 'Message: ' .$e->getMessage();
+  $resObj['rcode'] = Rcode_ServerError;
+  $resObj['msg'] = 'server error';
+  echo json_encode($resObj);
+}