mirror of
https://gitee.com/likeadmin/likeadmin_java.git
synced 2026-05-22 22:49:19 +08:00
登录配置相关,调整登录逻辑,底部导航配置相关
This commit is contained in:
@@ -7,6 +7,5 @@ export interface Link {
|
||||
path: string
|
||||
name?: string
|
||||
type: string
|
||||
isTab: boolean
|
||||
query?: Record<string, any>
|
||||
}
|
||||
|
||||
@@ -1,14 +1,18 @@
|
||||
<template>
|
||||
<div class="link-picker flex-1" @click="popupRef?.open()">
|
||||
<div class="link-picker flex-1" @click="!disabled && popupRef?.open()">
|
||||
<el-input
|
||||
class="cursor-pointer"
|
||||
:model-value="modelValue?.name ?? modelValue?.path"
|
||||
placeholder="请选择链接"
|
||||
readonly
|
||||
:disabled="disabled"
|
||||
>
|
||||
<template #suffix>
|
||||
<icon v-if="!modelValue?.path" name="el-icon-ArrowRight" />
|
||||
<icon v-else name="el-icon-Close" @click.stop="emit('update:modelValue', {})" />
|
||||
<icon
|
||||
v-else
|
||||
name="el-icon-Close"
|
||||
@click.stop="!disabled && emit('update:modelValue', {})"
|
||||
/>
|
||||
</template>
|
||||
</el-input>
|
||||
<popup ref="popupRef" width="700px" title="链接选择" @confirm="handleConfirm">
|
||||
@@ -24,6 +28,10 @@ import Popup from '@/components/popup/index.vue'
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Object
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
const emit = defineEmits<{
|
||||
@@ -47,3 +55,24 @@ watch(
|
||||
}
|
||||
)
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.link-picker {
|
||||
:deep(.el-input) {
|
||||
&.is-disabled {
|
||||
.el-input__inner {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.el-input__suffix {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
.el-input__inner {
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-input__suffix {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -35,20 +35,17 @@ const linkList = ref([
|
||||
{
|
||||
path: '/pages/index/index',
|
||||
name: '商城首页',
|
||||
type: LinkTypeEnum.SHOP_PAGES,
|
||||
isTab: true
|
||||
type: LinkTypeEnum.SHOP_PAGES
|
||||
},
|
||||
{
|
||||
path: '/pages/news/news',
|
||||
name: '文章资讯',
|
||||
type: LinkTypeEnum.SHOP_PAGES,
|
||||
isTab: true
|
||||
type: LinkTypeEnum.SHOP_PAGES
|
||||
},
|
||||
{
|
||||
path: '/pages/user/user',
|
||||
name: '个人中心',
|
||||
type: LinkTypeEnum.SHOP_PAGES,
|
||||
isTab: true
|
||||
type: LinkTypeEnum.SHOP_PAGES
|
||||
},
|
||||
{
|
||||
path: '/pages/collection/collection',
|
||||
|
||||
@@ -57,7 +57,11 @@
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话:">
|
||||
{{ formData.mobile || '-' }}
|
||||
<popover-input class="ml-[10px]" @confirm="handleEdit($event, 'mobile')">
|
||||
<popover-input
|
||||
class="ml-[10px]"
|
||||
type="number"
|
||||
@confirm="handleEdit($event, 'mobile')"
|
||||
>
|
||||
<el-button type="primary" link v-perms="['user:edit']">
|
||||
<icon name="el-icon-EditPen" />
|
||||
</el-button>
|
||||
@@ -104,6 +108,7 @@ const getDetails = async () => {
|
||||
}
|
||||
|
||||
const handleEdit = async (value: string, field: string) => {
|
||||
if (!value) return
|
||||
await userEdit({
|
||||
id: route.query.id,
|
||||
field,
|
||||
|
||||
@@ -28,54 +28,76 @@
|
||||
<el-tabs model-value="content">
|
||||
<el-tab-pane label="导航图片" name="content">
|
||||
<div class="mb-[18px]">
|
||||
<del-wrap
|
||||
v-for="(item, index) in tabbar.list"
|
||||
:key="index"
|
||||
@close="handleDelete(index)"
|
||||
class="max-w-[400px]"
|
||||
<draggable
|
||||
class="draggable"
|
||||
v-model="tabbar.list"
|
||||
animation="300"
|
||||
draggable=".draggable"
|
||||
:move="onMove"
|
||||
>
|
||||
<div class="bg-fill-light w-full p-4 mt-4">
|
||||
<el-form-item label="导航图标">
|
||||
<material-picker
|
||||
v-model="item.unselected"
|
||||
upload-class="bg-body"
|
||||
size="60px"
|
||||
>
|
||||
<template #upload>
|
||||
<div class="upload-btn w-[60px] h-[60px]">
|
||||
<icon name="el-icon-Plus" :size="16" />
|
||||
<span class="text-xs leading-5">
|
||||
未选中
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</material-picker>
|
||||
<material-picker
|
||||
v-model="item.selected"
|
||||
upload-class="bg-body"
|
||||
size="60px"
|
||||
>
|
||||
<template #upload>
|
||||
<div class="upload-btn w-[60px] h-[60px]">
|
||||
<icon name="el-icon-Plus" :size="16" />
|
||||
<span class="text-xs leading-5">
|
||||
选中
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</material-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="导航名称">
|
||||
<el-input
|
||||
v-model="item.name"
|
||||
placeholder="请输入名称"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="链接地址">
|
||||
<link-picker v-model="item.link" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</del-wrap>
|
||||
<template v-slot:item="{ element, index }">
|
||||
<del-wrap
|
||||
@close="handleDelete(index)"
|
||||
class="max-w-[400px]"
|
||||
:class="{ draggable: index != 0 }"
|
||||
>
|
||||
<div class="bg-fill-light w-full p-4 mt-4">
|
||||
<el-form-item label="导航图标">
|
||||
<material-picker
|
||||
v-model="element.unselected"
|
||||
upload-class="bg-body"
|
||||
size="60px"
|
||||
>
|
||||
<template #upload>
|
||||
<div
|
||||
class="upload-btn w-[60px] h-[60px]"
|
||||
>
|
||||
<icon
|
||||
name="el-icon-Plus"
|
||||
:size="16"
|
||||
/>
|
||||
<span class="text-xs leading-5">
|
||||
未选中
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</material-picker>
|
||||
<material-picker
|
||||
v-model="element.selected"
|
||||
upload-class="bg-body"
|
||||
size="60px"
|
||||
>
|
||||
<template #upload>
|
||||
<div
|
||||
class="upload-btn w-[60px] h-[60px]"
|
||||
>
|
||||
<icon
|
||||
name="el-icon-Plus"
|
||||
:size="16"
|
||||
/>
|
||||
<span class="text-xs leading-5">
|
||||
选中
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</material-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="导航名称">
|
||||
<el-input
|
||||
v-model="element.name"
|
||||
placeholder="请输入名称"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="链接地址">
|
||||
<link-picker
|
||||
v-model="element.link"
|
||||
:disabled="index == 0"
|
||||
/>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</del-wrap>
|
||||
</template>
|
||||
</draggable>
|
||||
</div>
|
||||
|
||||
<el-form-item v-if="tabbar.list?.length < max" label-width="0">
|
||||
@@ -111,6 +133,8 @@
|
||||
<script lang="ts" setup>
|
||||
import { getDecorateTabbar, setDecorateTabbar } from '@/api/decoration'
|
||||
import feedback from '@/utils/feedback'
|
||||
import Draggable from 'vuedraggable'
|
||||
|
||||
const max = 5
|
||||
const min = 2
|
||||
const tabbar = reactive({
|
||||
@@ -119,6 +143,12 @@ const tabbar = reactive({
|
||||
selectedColor: ''
|
||||
},
|
||||
list: [
|
||||
{
|
||||
name: '',
|
||||
selected: '',
|
||||
unselected: '',
|
||||
link: {}
|
||||
},
|
||||
{
|
||||
name: '',
|
||||
selected: '',
|
||||
@@ -147,9 +177,16 @@ const handleDelete = (index: number) => {
|
||||
tabbar.list.splice(index, 1)
|
||||
}
|
||||
|
||||
const onMove = (e: any) => {
|
||||
if (e.relatedContext.index == 0) {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
const getData = async () => {
|
||||
const data = await getDecorateTabbar()
|
||||
tabbar.list = data.list
|
||||
tabbar.list = data.list.map((item: any) => ({ ...item, link: JSON.parse(item.link) }))
|
||||
tabbar.style = data.style
|
||||
}
|
||||
const setData = async () => {
|
||||
|
||||
Reference in New Issue
Block a user