修改 客户标签样式 个人信息添加邮箱 修复关闭全部页面404

src/views/crmpc/customer/index.vue

@@ -22,12 +22,20 @@
         <span class="filter-label">{{ item.name }}</span>
         <div class="filter-tags">
           <span
+            :class="['tag-itemall', { 'tag-active': tagActiveMap[item.id] === '' }]"
+            @click="handleTagClick(item.id, '')"
+            >全部</span
+          >
+          <span
+            class="tag-items"
             v-for="item1 in item.tags"
             :key="item1.id"
-            :class="['tag-item', { 'tag-active': tagActiveMap[item.id] === item1.id }]"
             @click="handleTagClick(item.id, item1.id)"
           >
-            {{ item1.name }}({{ item1.count }})
+            <span :class="['tag-item', { 'tag-active': tagActiveMap[item.id] === item1.id }]">
+              {{ item1.name }}
+            </span>
+            <el-badge :value="item1.count" :max="99" class="itemtag" type="primary"> </el-badge>
           </span>
         </div>
       </div>
@@ -38,12 +46,20 @@
             <span class="filter-label">{{ item.name }}</span>
             <div class="filter-tags">
               <span
+                :class="['tag-itemall', { 'tag-active': tagActiveMap[item.id] === '' }]"
+                @click="handleTagClick(item.id, '')"
+                >全部</span
+              >
+              <span
+                class="tag-items"
                 v-for="item1 in item.tags"
                 :key="item1.id"
-                :class="['tag-item', { 'tag-active': tagActiveMap[item.id] === item1.id }]"
                 @click="handleTagClick(item.id, item1.id)"
               >
-                {{ item1.name }}({{ item1.count }})
+                <span :class="['tag-item', { 'tag-active': tagActiveMap[item.id] === item1.id }]">
+                  {{ item1.name }}
+                </span>
+                <el-badge :value="item1.count" :max="99" class="itemtag" type="primary"> </el-badge>
               </span>
             </div>
           </div>
@@ -156,12 +172,19 @@
     { label: '近三天', value: '1' },
     { label: '近七天', value: '2' }
   ]
+  // 获取列表数据
+  const tagActiveMap = reactive<{ [groupId: string]: string }>({})
   //获取标签
   type TagGroup = { id: string; name: string; tags: { id: string; name: string; count: number }[] }
   const tagGroups = ref<TagGroup[]>([])
   const tagGrouplistfn = async () => {
     const res = await CrmService.tagGrouplist({ scene: 'customers' })
     tagGroups.value = res || []
+    tagGroups.value.forEach((group) => {
+      if (group.tags && Array.isArray(group.tags)) {
+        tagActiveMap[group.id] = ''
+      }
+    })
   }
   // 计算前3组和更多组
   // eslint-disable-next-line vue/valid-define-props
@@ -179,8 +202,6 @@
     pagination.currentPage = 1
     gettableList()
   })
-  // 获取列表数据
-  const tagActiveMap = reactive<{ [groupId: string]: string }>({})
   const gettableList = async () => {
     loading.value = true
     try {
@@ -242,11 +263,11 @@
   }
   // 标签选中状态，key为组id，值为选中的标签id
   function handleTagClick(groupId: string, tagId: string) {
-    if (tagActiveMap[groupId] === tagId) {
-      tagActiveMap[groupId] = '' // 取消选中
-    } else {
-      tagActiveMap[groupId] = tagId // 选中
-    }
+    // if (tagActiveMap[groupId] === tagId) {
+    //   tagActiveMap[groupId] = '' // 取消选中
+    // } else {
+    tagActiveMap[groupId] = tagId // 选中
+    // }
     pagination.currentPage = 1
     gettableList()
   }
@@ -270,6 +291,13 @@
 </script>
 
 <style scoped lang="scss">
+  :deep(.el-badge) {
+    --el-badge-size: 16px;
+  }
+  .itemtag {
+    margin-top: -16px;
+    margin-left: -13px;
+  }
   :deep(.el-table__header th) {
     background: #f7f9fa !important;
     color: #333;
@@ -350,10 +378,6 @@
     color: #333;
     font-weight: 500;
     font-size: 14px;
-
-    span {
-      margin-right: 20px;
-    }
   }
 
   .customer-tabs {
@@ -395,19 +419,30 @@
   .fade-leave-to {
     opacity: 0;
   }
-
-  .tag-item {
+  .tag-items {
     cursor: pointer;
     border-radius: 4px;
     padding: 5px 10px;
-    margin-right: 8px;
     transition: background 0.2s;
     min-width: 100px;
     display: inline-block;
+    margin-right: 30px;
+  }
+  .tag-item {
+    border-radius: 4px;
+    padding: 5px 10px;
+  }
+  .tag-itemall {
+    border-radius: 4px;
+    padding: 5px 10px;
+    margin-right: 20px;
   }
-
   .tag-active {
     background: #3471ff;
     color: #fff;
   }
+  .tag-active :deep(.el-badge__content) {
+    color: #3471ff !important; /* 文字颜色 */
+    background-color: #fff !important; /* 背景色 */
+  }
 </style>

src/views/system/user-center/index.vue

@@ -11,7 +11,7 @@
             "
           />
           <h2 class="name">{{ userInfo.name }}</h2>
-          <p class="des">sn:{{ userInfo.sn }}</p>
+          <p class="des">SN:{{ userInfo.sn }}</p>
           <div class="outer-info">
             <div class="info-row">
               <span class="info-label">电 话：</span>
@@ -80,7 +80,7 @@
 
             <ElRow>
               <ElFormItem label="联系方式" prop="phone">
-                <ElInput v-model="form.phone" :disabled="!isEdit" />
+                <ElInput v-model="form.phone" disabled />
               </ElFormItem>
               <ElFormItem label="职务" prop="position" class="right-input">
                 <ElInput v-model="form.position" :disabled="!isEdit" />
@@ -107,6 +107,11 @@
                 </el-select>
               </ElFormItem>
             </ElRow>
+            <ElRow>
+              <ElFormItem label="邮箱" prop="email">
+                <ElInput v-model="form.email" :disabled="!isEdit" />
+              </ElFormItem>
+            </ElRow>
             <ElRow>
               <ElFormItem
                 label="二维码"