feat: mock动态开关

mock/tools.ts

@@ -13,7 +13,7 @@ function getTools() {
     {
       id: 1,
       value: 'MD5在线加密',
-      img: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+      logo: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
       desc: 'MD5在线加密,长度包含32位、16位',
       url: '/MD5',
       cateId: 2,
@@ -22,7 +22,7 @@ function getTools() {
     {
       id: 1,
       value: 'Json在线转换',
-      img: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+      logo: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
       desc: '在线编辑json, 语法检查',
       url: '/json',
       cateId: 2,
@@ -31,7 +31,7 @@ function getTools() {
     {
       id: 1,
       value: '正则测试工具',
-      img: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+      logo: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
       desc: '正则表达式测试工具, 常用正则表达式',
       url: '/reg',
       cateId: 2,
@@ -40,7 +40,7 @@ function getTools() {
     {
       id: 1,
       value: 'Unicode转中文',
-      img: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+      logo: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
       desc: 'Unicode和中文的相互转换',
       url: '/unicode',
       cateId: 2,
@@ -49,7 +49,7 @@ function getTools() {
     {
       id: 1,
       value: '字数统计',
-      img: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+      logo: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
       desc: '在线统计字符串的字数、段落、标点符号数量',
       url: '/wordCount',
       cateId: 3,
@@ -58,7 +58,7 @@ function getTools() {
     {
       id: 1,
       value: 'IP查询',
-      img: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+      logo: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
       desc: '在线查询ip地址、ip归属地',
       url: '/ip',
       cateId: 6,
@@ -67,7 +67,7 @@ function getTools() {
     {
       id: 1,
       value: '常用进制转换',
-      img: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+      logo: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
       desc: '在线进制转换工具,可在2到64进制之间相互转换',
       url: '/scaletran',
       cateId: 4,
@@ -76,7 +76,7 @@ function getTools() {
     {
       id: 1,
       value: '在线图片处理',
-      img: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+      logo: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
       desc: '在线图片裁剪，标注，滤镜，画等操作',
       url: '/signimage',
       cateId: 5,
@@ -90,34 +90,34 @@ function getToolsCate() {
   return [
     {
       id: 0,
-      value: '全部工具',
+      title: '全部工具',
     },
     {
       id: 2,
-      value: '开发运维'
+      title: '开发运维'
     },
     {
       id: 3,
-      value: '文本处理'
+      title: '文本处理'
     },
     {
       id: 4,
-      value: '教育学术'
+      title: '教育学术'
     },
     {
       id: 5,
-      value: '设计工具'
+      title: '设计工具'
     },
     {
       id: 6,
-      value: '查询相关'
+      title: '查询相关'
     }
   ]
 }
 
 export default [
   {
-    url: '/api/tools',
+    url: '/v1/tools',
     method: 'get',//请求方式
     response: (request) => {
       //接收参数
@@ -141,7 +141,7 @@ export default [
     },
   },
   {
-    url: '/api/tool/cates',
+    url: '/v1/tool/cates',
     method: 'get',//请求方式
     response: ({ body }) => {
       //获取请求体携带过来的用户名与密码

src/api/tools/type.ts

@@ -8,8 +8,8 @@ export interface ToolsReqData {
 //tools
 export interface ToolsInfo {
   id: number,
-  value: string,
+  title: string,
-  img: string,
+  logo: string,
   desc: string,
   url: string,
   cate: string
@@ -18,7 +18,7 @@ export interface ToolsInfo {
 //tools cate
 export interface ToolCate {
   id: number,
-  value: string,
+  title: string,
   img: string,
   desc: string,
   url: string,

src/components/Home/Home.vue

@@ -30,10 +30,10 @@ onMounted(() => {
     <div class="mr-3 flex justify-between flex-wrap self-card-div" :gutter="10">
         <router-link v-for="(item, index) in toolsStore.list" :key="index" :to="item.url" class="flex flex-col mt-3 border-solid rounded border-gray border w-[32.5%] p-2 bg-gray-50 hover:shadow-md">
           <div class="flex items-center border-b pb-2">
-            <el-image :src="item.img" class="w-10 h-10 min-h-[2.5rem] min-w-[2.5rem] rounded-full"></el-image>
+            <el-image :src="item.logo" class="w-10 h-10 min-h-[2.5rem] min-w-[2.5rem] rounded-full"></el-image>
             <div class="flex flex-col ml-2 w-full">
               <div class="flex">
-                <div class="font-semibold text-lg ">{{ item.value }}</div>
+                <div class="font-semibold text-lg ">{{ item.title }}</div>
               </div>
               <div class="flex justify-between">
                 <el-text size="small">{{ item.cate }}</el-text>

src/components/Layout/Header/Header.vue

@@ -84,12 +84,19 @@ onMounted(() => {
               <!-- cates -->
               <div class="mr-3">
                 <ul class="flex bg-gray-100  h-10 rounded leading-10 pl-3">
+                  <li class="flex items-center mr-3">
+                    <el-text></el-text>
+                    <div 
+                      class="hover:text-blue-400 hover:underline hover:decoration-2 hover:underline-offset-[6px] text-sm" :class="searchParam.cateId == 0 ? 'text-blue-400 underline decoration-2 underline-offset-[6px]' : ''"
+                      @click="chooseCate(0)"
+                    >全部工具</div>
+                  </li>
                   <li v-for="(item, index) in toolsStore.cates" :key="index" class="flex items-center">
                     <el-text>{{ index != 0 ? '&nbsp;&nbsp;&nbsp;&nbsp;' : '' }} </el-text>
                     <div 
                       class="hover:text-blue-400 hover:underline hover:decoration-2 hover:underline-offset-[6px] text-sm" :class="searchParam.cateId == item.id ? 'text-blue-400 underline decoration-2 underline-offset-[6px]' : ''"
                       @click="chooseCate(item.id)"
-                    >{{ item.value }}</div>
+                    >{{ item.title }}</div>
                   </li>
                 </ul>
               </div> 

src/utils/request.ts

@@ -2,7 +2,8 @@ import axios from "axios";
 import { ElMessage } from "element-plus";
 //创建axios实例
 let request = axios.create({
-    baseURL: import.meta.env.VITE_APP_BASE_API,
+    //判断mock是否启用
+    baseURL: import.meta.env.VITE_IS_MOCK == 'true' ? import.meta.env.VITE_APP_BASE_API :  import.meta.env.VITE_SERVE + import.meta.env.VITE_APP_BASE_API,
     timeout: 5000
 })
 //请求拦截器

vite.config.ts

@@ -19,7 +19,7 @@ export default defineConfig(({command, mode}) => {
       }),
       //mock
       viteMockServe({
-        localEnabled: command === 'serve',
+        localEnabled: env.VITE_IS_MOCK == 'true' ? command === 'serve' : false,
       }),
       //修改html插件
       createHtmlPlugin({