添加导航图标

src/assets/navIcon/AppointmentIcon.vue

@@ -0,0 +1,25 @@
+<template>
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g id="Frame" clip-path="url(#clip0_15079_25235)">
+    <g id="Group 89">
+    <path id="Vector" 
+        d="M12.1826 2.31543C12.9431 2.31549 13.6722 2.61755 14.21 3.15527C14.7477 3.693 15.0497 4.42216 15.0498 5.18262V12.2266C15.0498 12.9871 14.7477 13.7171 14.21 14.2549C13.6723 14.7925 12.943 15.0947 12.1826 15.0947H3.81738C3.05703 15.0947 2.32775 14.7925 1.79004 14.2549C1.25226 13.7171 0.950195 12.9871 0.950195 12.2266V5.18262C0.950256 4.42216 1.25231 3.693 1.79004 3.15527C2.32777 2.61755 3.05693 2.31549 3.81738 2.31543H12.1826ZM3.81738 3.47168C3.36368 3.47174 2.92824 3.65183 2.60742 3.97266C2.2866 4.29348 2.10651 4.72891 2.10645 5.18262V12.2266C2.10645 12.6802 2.28671 13.1157 2.60742 13.4365C2.92824 13.7573 3.36368 13.9374 3.81738 13.9375H12.1826C12.6363 13.9374 13.0718 13.7573 13.3926 13.4365C13.7133 13.1157 13.8936 12.6802 13.8936 12.2266V5.18262C13.8935 4.72891 13.7134 4.29348 13.3926 3.97266C13.0718 3.65183 12.6363 3.47174 12.1826 3.47168H3.81738Z" 
+        fill="var(--nav-color)" stroke="var(--nav-color)" stroke-width="0.1"/>
+    <path id="Vector_2" 
+        d="M14.6978 6.98145V8.1377H1.21436V6.98145H14.6978ZM4.9624 0.90625C5.11573 0.906284 5.26316 0.966773 5.37158 1.0752C5.47999 1.18364 5.54053 1.33103 5.54053 1.48438V4.30176C5.54053 4.45505 5.47993 4.6025 5.37158 4.71094C5.26316 4.81936 5.11573 4.87985 4.9624 4.87988C4.80903 4.87988 4.66168 4.81939 4.55322 4.71094C4.4448 4.60249 4.38428 4.45511 4.38428 4.30176V1.48438C4.38428 1.331 4.44477 1.18365 4.55322 1.0752C4.66167 0.966777 4.80905 0.90625 4.9624 0.90625ZM10.9497 0.90625C11.1031 0.906253 11.2504 0.966745 11.3589 1.0752C11.4673 1.18365 11.5278 1.33101 11.5278 1.48438V4.30176C11.5278 4.45508 11.4673 4.6025 11.3589 4.71094C11.2504 4.81939 11.1031 4.87988 10.9497 4.87988C10.7963 4.87988 10.649 4.81939 10.5405 4.71094C10.4321 4.60249 10.3716 4.45509 10.3716 4.30176V1.48438C10.3716 1.331 10.4321 1.18365 10.5405 1.0752C10.649 0.966743 10.7963 0.90625 10.9497 0.90625Z"
+        fill="var(--nav-color)" stroke="var(--nav-color)" stroke-width="0.1"/>
+    </g>
+    </g>
+    <defs>
+    <clipPath id="clip0_15079_25235">
+    <rect width="16" height="16" fill="white"/>
+    </clipPath>
+    </defs>
+</svg>
+</template>
+
+<style lang="scss" scoped>
+svg{
+    --nav-color:#666666;
+}
+</style>

src/assets/navIcon/FollowIcon.vue

@@ -0,0 +1,26 @@
+<template>
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g id="Frame 1000005197" clip-path="url(#clip0_15021_19914)">
+    <g id="Group 90">
+    <circle id="Ellipse 31" cx="8" cy="8" r="6.5" stroke="var(--nav-color)"/>
+    <g id="Exclude">
+    <path d="M5.66699 4.5C6.21089 4.50008 6.6001 4.8117 6.75488 5.27734H9.94434C10.7993 5.27768 11.4998 5.97803 11.5 6.83301C11.5 7.68817 10.7994 8.38834 9.94434 8.38867H6.05469C5.82206 8.38873 5.66528 8.46766 5.51074 8.62207C5.35604 8.77678 5.27735 8.93405 5.27734 9.16699C5.27754 9.63247 5.58845 9.94407 6.05566 9.94434H9.24512C9.39981 9.47848 9.86716 9.16709 10.333 9.16699C10.9553 9.16702 11.4999 9.7107 11.5 10.333C11.5 10.9554 10.9554 11.5 10.333 11.5C9.78911 11.4999 9.3999 11.1883 9.24512 10.7227H6.05566C5.20071 10.7223 4.50024 10.022 4.5 9.16699C4.50002 8.31183 5.20057 7.61166 6.05566 7.61133H9.94434C10.3336 7.611 10.7207 7.29867 10.7207 6.83301C10.7205 6.36753 10.4098 6.05593 9.94434 6.05566H6.75488C6.60019 6.52153 6.21105 6.83292 5.66699 6.83301C5.04467 6.83298 4.50013 6.2893 4.5 5.66699C4.50003 5.04461 5.04461 4.50003 5.66699 4.5Z" 
+        fill="var(--nav-color)"/>
+    <path d="M5.66699 4.5C6.21089 4.50008 6.6001 4.8117 6.75488 5.27734H9.94434C10.7993 5.27768 11.4998 5.97803 11.5 6.83301C11.5 7.68817 10.7994 8.38834 9.94434 8.38867H6.05469C5.82206 8.38873 5.66528 8.46766 5.51074 8.62207C5.35604 8.77678 5.27735 8.93405 5.27734 9.16699C5.27754 9.63247 5.58845 9.94407 6.05566 9.94434H9.24512C9.39981 9.47848 9.86716 9.16709 10.333 9.16699C10.9553 9.16702 11.4999 9.7107 11.5 10.333C11.5 10.9554 10.9554 11.5 10.333 11.5C9.78911 11.4999 9.3999 11.1883 9.24512 10.7227H6.05566C5.20071 10.7223 4.50024 10.022 4.5 9.16699C4.50002 8.31183 5.20057 7.61166 6.05566 7.61133H9.94434C10.3336 7.611 10.7207 7.29867 10.7207 6.83301C10.7205 6.36753 10.4098 6.05593 9.94434 6.05566H6.75488C6.60019 6.52153 6.21105 6.83292 5.66699 6.83301C5.04467 6.83298 4.50013 6.2893 4.5 5.66699C4.50003 5.04461 5.04461 4.50003 5.66699 4.5Z" 
+        stroke="var(--nav-color)"/>
+    </g>
+    </g>
+    </g>
+    <defs>
+    <clipPath id="clip0_15021_19914">
+    <rect width="16" height="16" fill="white"/>
+    </clipPath>
+    </defs>
+</svg>
+</template>
+
+<style lang="scss" scoped>
+svg{
+    --nav-color:#666666;
+}
+</style>

src/assets/navIcon/MyCustomerIcon.vue

@@ -0,0 +1,20 @@
+<template>
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g id="Frame" clip-path="url(#clip0_15021_19889)">
+    <path id="Vector" 
+        d="M6.31997 7.27986C7.91997 7.27986 9.27997 5.99986 9.27997 4.31986C9.27997 2.71986 7.99997 1.35986 6.31997 1.35986C4.71997 1.35986 3.35997 2.63986 3.35997 4.31986C3.35997 5.91986 4.71997 7.27986 6.31997 7.27986ZM6.31997 2.55986C7.27997 2.55986 8.07997 3.35986 8.07997 4.31986C8.07997 5.27986 7.27997 6.07986 6.31997 6.07986C5.35997 6.07986 4.55997 5.27986 4.55997 4.31986C4.55997 3.35986 5.35997 2.55986 6.31997 2.55986ZM11.2 1.83986C10.88 1.67986 10.56 1.75986 10.4 2.07986C10.24 2.39986 10.32 2.71986 10.64 2.87986C11.2 3.19986 11.44 3.75986 11.44 4.39986C11.44 5.03986 11.12 5.59986 10.64 5.91986C10.32 6.07986 10.24 6.47986 10.4 6.71986C10.48 6.87986 10.72 7.03986 10.88 7.03986C10.96 7.03986 11.12 7.03986 11.2 6.95986C12.08 6.39986 12.64 5.43986 12.64 4.47986C12.64 3.51986 12.08 2.31986 11.2 1.83986ZM10.16 9.11986C9.43997 8.79986 8.63997 8.79986 7.03997 8.79986H5.59997C3.99997 8.79986 3.19997 8.79986 2.47997 9.11986C1.83997 9.43986 1.35997 9.91986 1.03997 10.5599C0.719971 11.1999 0.719971 11.9999 0.719971 13.5999V13.9999C0.719971 14.3199 0.959971 14.6399 1.35997 14.6399H11.36C11.68 14.6399 12 14.3999 12 13.9999V13.5999C12 11.9999 12 11.1999 11.68 10.4799C11.28 9.91986 10.8 9.43986 10.16 9.11986ZM1.91997 13.4399C1.91997 12.1599 1.91997 11.5199 2.15997 11.1199C2.31997 10.7199 2.63997 10.3999 3.03997 10.2399C3.51997 9.99986 4.15997 9.99986 5.59997 9.99986H7.03997C8.39997 9.99986 9.11997 9.99986 9.59997 10.2399C9.99997 10.3999 10.32 10.7199 10.48 11.1199C10.72 11.5199 10.72 12.1599 10.72 13.4399H1.91997ZM14.88 10.4799C14.56 9.83986 14.08 9.35986 13.44 9.03986C13.12 8.87986 12.8 9.03986 12.64 9.27986C12.48 9.59986 12.64 9.91986 12.88 10.0799C13.28 10.2399 13.6 10.5599 13.76 10.9599C14 11.4399 14 12.0799 14 13.5199V13.9199C14 14.2399 14.24 14.5599 14.64 14.5599C15.04 14.5599 15.28 14.3199 15.28 13.9199V13.5999C15.28 11.9999 15.28 11.1999 14.88 10.4799Z" 
+        fill="var(--nav-color)"/>
+    </g>
+    <defs>
+    <clipPath id="clip0_15021_19889">
+    <rect width="16" height="16" fill="white"/>
+    </clipPath>
+    </defs>
+</svg>
+</template>
+
+<style lang="scss" scoped>
+svg{
+    --nav-color:#666666;
+}
+</style>

src/assets/navIcon/PublicCustomerIcon.vue

@@ -0,0 +1,23 @@
+<template>
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g id="Frame" clip-path="url(#clip0_15021_19885)">
+    <path id="Vector" 
+        d="M1.59003 12.978L4.99237 13.8755C5.51655 14.0126 6.06885 14.0119 6.59296 13.8735L9.24432 13.1733C9.89705 13.0005 10.5848 13.0005 11.2375 13.1733L14.6838 14.0825C14.946 14.1523 15.1034 14.4184 15.0334 14.6792V14.6802C14.9617 14.9388 14.6912 15.0927 14.4289 15.0229L11.0734 14.1372C10.5302 13.9947 9.95843 13.9947 9.41522 14.1372L6.67206 14.8569C6.08064 15.0121 5.45577 15.0105 4.86444 14.854L1.33514 13.9185C1.07124 13.8487 0.915411 13.5825 0.985535 13.3218L1.02167 13.23C1.12497 13.0281 1.36047 12.917 1.59003 12.978ZM7.99139 0.968262C9.46086 0.968262 10.6535 2.16091 10.6535 3.63037C10.6533 5.10107 9.46073 6.29248 7.99139 6.29248C6.52084 6.29226 5.33043 5.09953 5.33026 3.63037C5.33026 2.16105 6.52212 0.968485 7.99139 0.968262ZM8.00995 1.91846C7.0736 1.91846 6.31464 2.67742 6.31464 3.61377C6.31469 4.55007 7.07363 5.30908 8.00995 5.30908C8.94608 5.30887 9.70423 4.54994 9.70428 3.61377C9.70428 2.67889 8.94609 1.91867 8.00995 1.91846Z" 
+        fill="var(--nav-color)" stroke="var(--nav-color)" stroke-width="0.1"/>
+    <path id="Vector_2" 
+        d="M7.99445 7.07568C10.7184 7.07568 12.9613 9.14863 13.2523 11.814C13.2623 11.9066 13.3281 11.9829 13.4173 12.0063L14.6663 12.3354L14.7601 12.3706C14.9363 12.4575 15.0433 12.6403 15.0316 12.8345L15.0159 12.9321C14.9444 13.1909 14.6738 13.3456 14.4114 13.2759L11.055 12.3892C10.5118 12.2467 9.93993 12.2467 9.39679 12.3892L6.6546 13.1108C6.06324 13.266 5.43827 13.2644 4.84698 13.1079L1.31769 12.1724C1.05523 12.1026 0.897617 11.8366 0.966125 11.5747L1.00226 11.4819C1.10559 11.2802 1.34118 11.1701 1.57062 11.231L2.53351 11.4829C2.65787 11.5154 2.78337 11.4383 2.8089 11.314L2.86066 11.0884C3.44288 8.7817 5.51769 7.07568 7.98956 7.07568H7.99445ZM7.98956 8.07959C5.95947 8.07959 4.25796 9.50032 3.80988 11.4116L3.76984 11.5981C3.74879 11.7127 3.82009 11.8247 3.93292 11.855L4.97296 12.1274C5.49717 12.2645 6.05039 12.2649 6.57452 12.1265L9.22589 11.4263C9.8787 11.2534 10.5663 11.2534 11.2191 11.4263L11.8782 11.5991C12.0425 11.6414 12.1926 11.4929 12.1517 11.3296C11.6779 9.46138 9.99593 8.07971 7.99347 8.07959H7.98956Z" 
+        fill="var(--nav-color)" stroke="var(--nav-color)" stroke-width="0.1"/>
+    </g>
+    <defs>
+    <clipPath id="clip0_15021_19885">
+    <rect width="16" height="16" fill="white"/>
+    </clipPath>
+    </defs>
+</svg>
+</template>
+
+<style lang="scss" scoped>
+svg{
+    --nav-color:#666666;
+}
+</style>

src/assets/navIcon/UserManageIcon.vue

@@ -0,0 +1,20 @@
+<template>
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g id="Frame" clip-path="url(#clip0_15021_19892)">
+    <path id="Vector" 
+        d="M7.71969 2.10629C6.09031 2.10629 4.76929 3.42731 4.76929 5.05669C4.76929 6.68606 6.09014 8.00726 7.71969 8.00726C9.34924 8.00726 10.6701 6.68624 10.6701 5.05686C10.6701 3.42748 9.34906 2.10629 7.71969 2.10629ZM14.0263 9.1284C14.3319 9.1284 14.5794 9.37613 14.5794 9.68155C14.5794 9.96158 14.3712 10.1931 14.1012 10.2297L14.0261 10.2347H11.0759C10.7703 10.2347 10.5227 9.98697 10.5227 9.68155C10.5227 9.40152 10.7309 9.17004 11.0009 9.13341L11.076 9.1284H14.0263ZM14.0263 11.0905C14.3319 11.0905 14.5794 11.3382 14.5794 11.6436C14.5794 11.9237 14.3712 12.1552 14.1012 12.1918L14.0261 12.1968H11.0759C10.7703 12.1968 10.5227 11.9491 10.5227 11.6436C10.5227 11.3636 10.7309 11.1321 11.0009 11.0955L11.076 11.0905H14.0263ZM14.0263 13.0526C14.3319 13.0526 14.5794 13.3003 14.5794 13.6057C14.5794 13.8858 14.3712 14.1172 14.1012 14.1539L14.0261 14.1589H11.0759C10.7703 14.1589 10.5227 13.9112 10.5227 13.6057C10.5227 13.3257 10.7309 13.0942 11.0009 13.0576L11.076 13.0526H14.0263ZM7.71969 1C9.96025 1 11.7765 2.81629 11.7765 5.05686C11.7765 7.22159 10.0812 8.9902 7.94582 9.1075C7.94236 9.1075 7.93873 9.10819 7.93493 9.10871L7.85979 9.11372H5.61749C3.96237 9.11372 2.61112 10.4149 2.53062 12.0501L2.52682 12.2044V12.9716C2.52682 13.4489 2.8896 13.8415 3.35464 13.8889L3.44896 13.8937H8.7377C9.04329 13.8937 9.29085 14.1414 9.29085 14.4469C9.29085 14.7269 9.08268 14.9584 8.81267 14.995L8.73753 15H3.44896C2.37014 15 1.48808 14.1578 1.42416 13.0951L1.42053 12.9716V12.2044C1.42053 10.101 2.96803 8.3588 4.98644 8.05442C4.17296 7.31246 3.66283 6.24417 3.66283 5.05686C3.66283 2.81629 5.47912 1 7.71969 1Z" 
+        fill="var(--nav-color)"/>
+    </g>
+    <defs>
+    <clipPath id="clip0_15021_19892">
+    <rect width="16" height="16" fill="white"/>
+    </clipPath>
+    </defs>
+</svg>
+</template>
+
+<style lang="scss" scoped>
+svg{
+    --nav-color:#666666;
+}
+</style>

src/store/index.ts

@@ -4,6 +4,13 @@ import type { App } from 'vue'
 
 import {getFieldListExcludeAreaApi,getOpenProvinceCityListApi} from '@/api/parameterConfig'
 
+import AppointmentIcon from '@/assets/navIcon/AppointmentIcon.vue'
+import PublicCustomerIcon from '@/assets/navIcon/PublicCustomerIcon.vue'
+import MyCustomerIcon from '@/assets/navIcon/MyCustomerIcon.vue'
+import FollowIcon from '@/assets/navIcon/FollowIcon.vue'
+import UserManageIcon from '@/assets/navIcon/UserManageIcon.vue'
+import ParameterConfigIcon from '@/assets/navIcon/ParameterConfigIcon.vue'
+
 // 定义 RootState 接口（可扩展）
 interface RootState {
   count: number,
@@ -30,54 +37,54 @@ const store = createStore<RootState>({
       {
         title: '预约待办',
         route: '/main',
-        svgIcon:undefined,
+        svgIcon:AppointmentIcon,
       },
       {
         title: '公海客户',
         route: '/main/highSeasCustomer',
-        svgIcon:undefined,
+        svgIcon:PublicCustomerIcon,
       },
       {
         title: '我的客户',
         route: '/main/myCustomer',
-        svgIcon:undefined,
+        svgIcon:MyCustomerIcon,
       },
       {
         title: '客户跟进',
         route: '/main/customerFollowUp',
-        svgIcon:undefined,
+        svgIcon:FollowIcon,
       },
       {
         title: '参数配置',
         route: '/main/parameterConfig',
-        svgIcon:undefined,
+        svgIcon:ParameterConfigIcon,
       },
       {
         title: '用户权限',
         route: '/main/userPrivilegeManagement',
-        svgIcon:undefined,
+        svgIcon:UserManageIcon,
       },
     ],
     siderNav:[
       {
         title: '预约待办',
         route: '/main',
-        svgIcon:undefined,
+        svgIcon:AppointmentIcon,
       },
       {
         title: '公海客户',
         route: '/main/highSeasCustomer',
-        svgIcon:undefined,
+        svgIcon:PublicCustomerIcon,
       },
       {
         title: '我的客户',
         route: '/main/myCustomer',
-        svgIcon:undefined,
+        svgIcon:MyCustomerIcon,
       },
       {
         title: '客户跟进',
         route: '/main/customerFollowUp',
-        svgIcon:undefined,
+        svgIcon:FollowIcon,
       },
     ],