update

src/components/assembly/indexList.vue

@@ -37,7 +37,7 @@ function routerpush(isLink:boolean=false) {
 <style scoped>
 .item {
   width: 20%;
-  height: 27%;
+  height: 267px;
   margin: 30px;
   cursor: pointer;
 }

src/views/index.vue

@@ -30,8 +30,15 @@
     </div>
 
     <div class="itemlist">
-      <list v-for="res in routerList" :hash="res.hash" :path="res.path" :is-link="res.isLink" :title="res.title"
-        :key="res.id" :url="res.url"></list>
+      <div class="category" v-for="(value, key) in categoryList">
+        <h2 class="category-title">{{ key }}</h2>
+        <div class="category-item">
+          <list v-for="res in value" :hash="res.hash" :path="res.path" :is-link="res.isLink" :title="res.title"
+            :key="res.id" :url="res.url"></list>
+        </div>
+      </div>
+      <!-- <list v-for="res in routerList" :hash="res.hash" :path="res.path" :is-link="res.isLink" :title="res.title"
+        :key="res.id" :url="res.url"></list> -->
     </div>
   </div>
 </template>
@@ -41,7 +48,7 @@ import { ref, reactive, onMounted, onUnmounted } from "vue";
 import list from "@/components/assembly/indexList.vue";
 import { useI18n } from "vue-i18n";
 import { getStoredLanguage, saveStoredLanguage, languageHash } from "@/utils/languageStorage";
-import { useRoute,useRouter } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 import { getScreenByHash } from "@/http/rule/index"
 import { imgurlAddXhr } from "@/utils/devSever"
 let langicon = require("@/assets/svg/language.svg")
@@ -72,8 +79,16 @@ function changelang(val) {
   saveStoredLanguage(languageHash(val))
   location.reload()
 }
-
-
+function convertChineseToArabic(str) {
+  const nums = {
+    零: 0, 一: 1, 二: 2, 两: 2, 三: 3, 四: 4, 五: 5, 六: 6, 七: 7, 八: 8, 九: 9
+  };
+  let result = str.replace(/[零一二两三四五六七八九]/g, (match) => {
+    return nums[match];
+  });
+  return parseInt(result, 10);
+}
+const categoryList: any = ref({})
 async function reqScreenByHash() {
   let hash = sessionStorage.getItem('screen_hash')
   let res: any = await getScreenByHash({ hash });
@@ -88,10 +103,28 @@ async function reqScreenByHash() {
         path: item.path,
         title: item.title,
         url: isTrue ? item.img : imgurlAddXhr(item.img),
-        hash: hash
+        hash: hash,
+        screenType: item.screenType
       }
     })
 
+    routerList.value.forEach(element => {
+      if (element.screenType !== null) {
+        if (categoryList.value.hasOwnProperty(element.screenType)) {
+          categoryList.value[element.screenType].push(element)
+        } else {
+          categoryList.value[element.screenType] = [element]
+        }
+      } else {
+        if (categoryList.value.hasOwnProperty('其他')) {
+          categoryList.value['其他'].push(element)
+        } else {
+          categoryList.value['其他'] = [element]
+        }
+      }
+    });
+    console.log(categoryList.value);
+
   }
 
 }
@@ -123,11 +156,28 @@ onUnmounted(() => { });
   width: 1920px;
   color: #20aec5;
   background-color: #100c2a;
+  overflow: scroll !important;
+}
+
+.category {
+  width: 1920px;
+}
+
+.category-title {
+  padding-left: 40px;
+  font-size: 32px;
+  text-align: left;
+  font-weight: bold;
+  color: whitesmoke;
+
+}
+.category-item {
+  width: 1920px;
   display: flex;
-  justify-content: center;
+  justify-content: flex-start;
   align-items: center;
   flex-wrap: wrap;
-  overflow: auto !important;
+
 }
 
 .title {

vue.config.js

@@ -21,8 +21,8 @@ module.exports = defineConfig(
     devServer: {
       proxy: {
         [process.env.VUE_APP_BASE_API]: {
-          // target: 'http://192.168.110.167:9015',          // 想要请求的url地址
-          target: 'http://8.130.165.100:9015',
+          target: 'http://192.168.10.98:9015',          // 想要请求的url地址
+          // target: 'http://8.130.165.100:9015',
           // target: 'http://192.168.110.19:8080',
           ws: true,                 // 是否要开启代理
           changeOrigin: true,