修改 客户标签样式 个人信息添加邮箱 修复关闭全部页面404
This commit is contained in:
@@ -4,7 +4,7 @@ import { HOME_PAGE } from '@/router/routesAlias'
|
|||||||
import { router } from '@/router'
|
import { router } from '@/router'
|
||||||
import { LocationQueryRaw, Router } from 'vue-router'
|
import { LocationQueryRaw, Router } from 'vue-router'
|
||||||
import { WorkTab } from '@/types'
|
import { WorkTab } from '@/types'
|
||||||
|
import { useUserStore } from '@/store/modules/user'
|
||||||
interface WorktabState {
|
interface WorktabState {
|
||||||
current: Partial<WorkTab>
|
current: Partial<WorkTab>
|
||||||
opened: WorkTab[]
|
opened: WorkTab[]
|
||||||
@@ -144,6 +144,7 @@ export const useWorktabStore = defineStore(
|
|||||||
* 关闭指定的选项卡
|
* 关闭指定的选项卡
|
||||||
*/
|
*/
|
||||||
const removeTab = (path: string): void => {
|
const removeTab = (path: string): void => {
|
||||||
|
const { home_page } = useUserStore()
|
||||||
const targetTab = getTab(path)
|
const targetTab = getTab(path)
|
||||||
const targetIndex = findTabIndex(path)
|
const targetIndex = findTabIndex(path)
|
||||||
|
|
||||||
@@ -167,9 +168,9 @@ export const useWorktabStore = defineStore(
|
|||||||
|
|
||||||
// 如果关闭后无标签页,跳转首页
|
// 如果关闭后无标签页,跳转首页
|
||||||
if (!hasOpenedTabs.value) {
|
if (!hasOpenedTabs.value) {
|
||||||
if (path !== HOME_PAGE) {
|
if (path !== home_page) {
|
||||||
current.value = {}
|
current.value = {}
|
||||||
safeRouterPush({ path: HOME_PAGE })
|
safeRouterPush({ path: home_page })
|
||||||
}
|
}
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -287,12 +288,12 @@ export const useWorktabStore = defineStore(
|
|||||||
*/
|
*/
|
||||||
const removeAll = (): void => {
|
const removeAll = (): void => {
|
||||||
const hasFixedTabs = opened.value.some((tab) => tab.fixedTab)
|
const hasFixedTabs = opened.value.some((tab) => tab.fixedTab)
|
||||||
|
const { home_page } = useUserStore()
|
||||||
// 获取可关闭的标签页
|
// 获取可关闭的标签页
|
||||||
const closableTabs = opened.value.filter((tab) => {
|
const closableTabs = opened.value.filter((tab) => {
|
||||||
if (!isTabClosable(tab)) return false
|
if (!isTabClosable(tab)) return false
|
||||||
// 如果有固定标签,则所有可关闭的都可以关闭;否则保留首页
|
// 如果有固定标签,则所有可关闭的都可以关闭;否则保留首页
|
||||||
return hasFixedTabs || tab.path !== HOME_PAGE
|
return hasFixedTabs || tab.path !== home_page
|
||||||
})
|
})
|
||||||
|
|
||||||
if (closableTabs.length === 0) {
|
if (closableTabs.length === 0) {
|
||||||
@@ -305,18 +306,18 @@ export const useWorktabStore = defineStore(
|
|||||||
|
|
||||||
// 保留不可关闭的标签页和首页(当没有固定标签时)
|
// 保留不可关闭的标签页和首页(当没有固定标签时)
|
||||||
opened.value = opened.value.filter((tab) => {
|
opened.value = opened.value.filter((tab) => {
|
||||||
return !isTabClosable(tab) || (!hasFixedTabs && tab.path === HOME_PAGE)
|
return !isTabClosable(tab) || (!hasFixedTabs && tab.path === home_page)
|
||||||
})
|
})
|
||||||
|
|
||||||
// 处理激活状态
|
// 处理激活状态
|
||||||
if (!hasOpenedTabs.value) {
|
if (!hasOpenedTabs.value) {
|
||||||
current.value = {}
|
current.value = {}
|
||||||
safeRouterPush({ path: HOME_PAGE })
|
safeRouterPush({ path: home_page })
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
// 选择激活的标签页:优先首页,其次第一个可用标签
|
// 选择激活的标签页:优先首页,其次第一个可用标签
|
||||||
const homeTab = opened.value.find((tab) => tab.path === HOME_PAGE)
|
const homeTab = opened.value.find((tab) => tab.path === home_page)
|
||||||
const targetTab = homeTab || opened.value[0]
|
const targetTab = homeTab || opened.value[0]
|
||||||
|
|
||||||
current.value = targetTab
|
current.value = targetTab
|
||||||
|
|||||||
@@ -22,12 +22,20 @@
|
|||||||
<span class="filter-label">{{ item.name }}</span>
|
<span class="filter-label">{{ item.name }}</span>
|
||||||
<div class="filter-tags">
|
<div class="filter-tags">
|
||||||
<span
|
<span
|
||||||
|
:class="['tag-itemall', { 'tag-active': tagActiveMap[item.id] === '' }]"
|
||||||
|
@click="handleTagClick(item.id, '')"
|
||||||
|
>全部</span
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
class="tag-items"
|
||||||
v-for="item1 in item.tags"
|
v-for="item1 in item.tags"
|
||||||
:key="item1.id"
|
:key="item1.id"
|
||||||
:class="['tag-item', { 'tag-active': tagActiveMap[item.id] === item1.id }]"
|
|
||||||
@click="handleTagClick(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>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -38,12 +46,20 @@
|
|||||||
<span class="filter-label">{{ item.name }}</span>
|
<span class="filter-label">{{ item.name }}</span>
|
||||||
<div class="filter-tags">
|
<div class="filter-tags">
|
||||||
<span
|
<span
|
||||||
|
:class="['tag-itemall', { 'tag-active': tagActiveMap[item.id] === '' }]"
|
||||||
|
@click="handleTagClick(item.id, '')"
|
||||||
|
>全部</span
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
class="tag-items"
|
||||||
v-for="item1 in item.tags"
|
v-for="item1 in item.tags"
|
||||||
:key="item1.id"
|
:key="item1.id"
|
||||||
:class="['tag-item', { 'tag-active': tagActiveMap[item.id] === item1.id }]"
|
|
||||||
@click="handleTagClick(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>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -156,12 +172,19 @@
|
|||||||
{ label: '近三天', value: '1' },
|
{ label: '近三天', value: '1' },
|
||||||
{ label: '近七天', value: '2' }
|
{ label: '近七天', value: '2' }
|
||||||
]
|
]
|
||||||
|
// 获取列表数据
|
||||||
|
const tagActiveMap = reactive<{ [groupId: string]: string }>({})
|
||||||
//获取标签
|
//获取标签
|
||||||
type TagGroup = { id: string; name: string; tags: { id: string; name: string; count: number }[] }
|
type TagGroup = { id: string; name: string; tags: { id: string; name: string; count: number }[] }
|
||||||
const tagGroups = ref<TagGroup[]>([])
|
const tagGroups = ref<TagGroup[]>([])
|
||||||
const tagGrouplistfn = async () => {
|
const tagGrouplistfn = async () => {
|
||||||
const res = await CrmService.tagGrouplist({ scene: 'customers' })
|
const res = await CrmService.tagGrouplist({ scene: 'customers' })
|
||||||
tagGroups.value = res || []
|
tagGroups.value = res || []
|
||||||
|
tagGroups.value.forEach((group) => {
|
||||||
|
if (group.tags && Array.isArray(group.tags)) {
|
||||||
|
tagActiveMap[group.id] = ''
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
// 计算前3组和更多组
|
// 计算前3组和更多组
|
||||||
// eslint-disable-next-line vue/valid-define-props
|
// eslint-disable-next-line vue/valid-define-props
|
||||||
@@ -179,8 +202,6 @@
|
|||||||
pagination.currentPage = 1
|
pagination.currentPage = 1
|
||||||
gettableList()
|
gettableList()
|
||||||
})
|
})
|
||||||
// 获取列表数据
|
|
||||||
const tagActiveMap = reactive<{ [groupId: string]: string }>({})
|
|
||||||
const gettableList = async () => {
|
const gettableList = async () => {
|
||||||
loading.value = true
|
loading.value = true
|
||||||
try {
|
try {
|
||||||
@@ -242,11 +263,11 @@
|
|||||||
}
|
}
|
||||||
// 标签选中状态,key为组id,值为选中的标签id
|
// 标签选中状态,key为组id,值为选中的标签id
|
||||||
function handleTagClick(groupId: string, tagId: string) {
|
function handleTagClick(groupId: string, tagId: string) {
|
||||||
if (tagActiveMap[groupId] === tagId) {
|
// if (tagActiveMap[groupId] === tagId) {
|
||||||
tagActiveMap[groupId] = '' // 取消选中
|
// tagActiveMap[groupId] = '' // 取消选中
|
||||||
} else {
|
// } else {
|
||||||
tagActiveMap[groupId] = tagId // 选中
|
tagActiveMap[groupId] = tagId // 选中
|
||||||
}
|
// }
|
||||||
pagination.currentPage = 1
|
pagination.currentPage = 1
|
||||||
gettableList()
|
gettableList()
|
||||||
}
|
}
|
||||||
@@ -270,6 +291,13 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
:deep(.el-badge) {
|
||||||
|
--el-badge-size: 16px;
|
||||||
|
}
|
||||||
|
.itemtag {
|
||||||
|
margin-top: -16px;
|
||||||
|
margin-left: -13px;
|
||||||
|
}
|
||||||
:deep(.el-table__header th) {
|
:deep(.el-table__header th) {
|
||||||
background: #f7f9fa !important;
|
background: #f7f9fa !important;
|
||||||
color: #333;
|
color: #333;
|
||||||
@@ -350,10 +378,6 @@
|
|||||||
color: #333;
|
color: #333;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
|
||||||
span {
|
|
||||||
margin-right: 20px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.customer-tabs {
|
.customer-tabs {
|
||||||
@@ -395,19 +419,30 @@
|
|||||||
.fade-leave-to {
|
.fade-leave-to {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
|
.tag-items {
|
||||||
.tag-item {
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
padding: 5px 10px;
|
padding: 5px 10px;
|
||||||
margin-right: 8px;
|
|
||||||
transition: background 0.2s;
|
transition: background 0.2s;
|
||||||
min-width: 100px;
|
min-width: 100px;
|
||||||
display: inline-block;
|
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 {
|
.tag-active {
|
||||||
background: #3471ff;
|
background: #3471ff;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
.tag-active :deep(.el-badge__content) {
|
||||||
|
color: #3471ff !important; /* 文字颜色 */
|
||||||
|
background-color: #fff !important; /* 背景色 */
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -11,7 +11,7 @@
|
|||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
<h2 class="name">{{ userInfo.name }}</h2>
|
<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="outer-info">
|
||||||
<div class="info-row">
|
<div class="info-row">
|
||||||
<span class="info-label">电 话:</span>
|
<span class="info-label">电 话:</span>
|
||||||
@@ -80,7 +80,7 @@
|
|||||||
|
|
||||||
<ElRow>
|
<ElRow>
|
||||||
<ElFormItem label="联系方式" prop="phone">
|
<ElFormItem label="联系方式" prop="phone">
|
||||||
<ElInput v-model="form.phone" :disabled="!isEdit" />
|
<ElInput v-model="form.phone" disabled />
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
<ElFormItem label="职务" prop="position" class="right-input">
|
<ElFormItem label="职务" prop="position" class="right-input">
|
||||||
<ElInput v-model="form.position" :disabled="!isEdit" />
|
<ElInput v-model="form.position" :disabled="!isEdit" />
|
||||||
@@ -107,6 +107,11 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
</ElRow>
|
</ElRow>
|
||||||
|
<ElRow>
|
||||||
|
<ElFormItem label="邮箱" prop="email">
|
||||||
|
<ElInput v-model="form.email" :disabled="!isEdit" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElRow>
|
||||||
<ElRow>
|
<ElRow>
|
||||||
<ElFormItem
|
<ElFormItem
|
||||||
label="二维码"
|
label="二维码"
|
||||||
|
|||||||
Reference in New Issue
Block a user