feat: 设置页去掉社媒填写
This commit is contained in:
@@ -55,8 +55,6 @@ export default {
|
|||||||
usernameTip: 'Your public username on Stylish Parade.',
|
usernameTip: 'Your public username on Stylish Parade.',
|
||||||
role: 'ROLE',
|
role: 'ROLE',
|
||||||
roleTip: 'Select up to 2 labels that suit you.',
|
roleTip: 'Select up to 2 labels that suit you.',
|
||||||
socialLinks: 'SOCIAL LINKS',
|
|
||||||
linkNumber: 'Link {index}'
|
|
||||||
},
|
},
|
||||||
security: {
|
security: {
|
||||||
title: 'Security',
|
title: 'Security',
|
||||||
|
|||||||
@@ -56,8 +56,6 @@ export default {
|
|||||||
usernameTip: '这是你在 Stylish Parade 上公开显示的用户名。',
|
usernameTip: '这是你在 Stylish Parade 上公开显示的用户名。',
|
||||||
role: '身份标签',
|
role: '身份标签',
|
||||||
roleTip: '最多选择 2 个符合你的标签。',
|
roleTip: '最多选择 2 个符合你的标签。',
|
||||||
socialLinks: '社交链接',
|
|
||||||
linkNumber: '链接 {index}'
|
|
||||||
},
|
},
|
||||||
security: {
|
security: {
|
||||||
title: '安全',
|
title: '安全',
|
||||||
|
|||||||
@@ -69,33 +69,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="read-tip">{{ t('Settings.profile.roleTip') }}</div>
|
<div class="read-tip">{{ t('Settings.profile.roleTip') }}</div>
|
||||||
|
|
||||||
<div class="social-links read-social-links">
|
|
||||||
<div class="title">{{ t('Settings.profile.socialLinks') }}</div>
|
|
||||||
<div class="links-list flex flex-col">
|
|
||||||
<div
|
|
||||||
class="links-item flex align-center"
|
|
||||||
v-for="(item, index) in displayData.links"
|
|
||||||
:key="`view-${index}`"
|
|
||||||
>
|
|
||||||
<div class="link-index">
|
|
||||||
{{ t('Settings.profile.linkNumber', { index: index + 1 }) }}
|
|
||||||
</div>
|
|
||||||
<div v-show="!isEditing" class="link-href flex-1 readonly">{{ item }}</div>
|
|
||||||
<div v-show="isEditing" class="link-href flex-1">
|
|
||||||
<el-input v-model="draftData.links[index]" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<button
|
|
||||||
v-show="isEditing"
|
|
||||||
type="button"
|
|
||||||
class="add-link-btn"
|
|
||||||
@click="handleAddLink"
|
|
||||||
>
|
|
||||||
+
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -309,7 +282,6 @@ interface SettingsData {
|
|||||||
email: string
|
email: string
|
||||||
username: string
|
username: string
|
||||||
role: RoleValue[]
|
role: RoleValue[]
|
||||||
links: string[]
|
|
||||||
language: LanguageValue
|
language: LanguageValue
|
||||||
region: RegionValue
|
region: RegionValue
|
||||||
}
|
}
|
||||||
@@ -324,7 +296,7 @@ const { t, locale } = useI18n({ useScope: 'global' })
|
|||||||
|
|
||||||
const languageLocaleMap: Record<LanguageValue, 'ENGLISH' | 'CHINESE_SIMPLIFIED'> = {
|
const languageLocaleMap: Record<LanguageValue, 'ENGLISH' | 'CHINESE_SIMPLIFIED'> = {
|
||||||
english: 'ENGLISH',
|
english: 'ENGLISH',
|
||||||
chinese: 'CHINESE_SIMPLIFIED',
|
chinese: 'CHINESE_SIMPLIFIED'
|
||||||
}
|
}
|
||||||
|
|
||||||
const roleList = computed(() =>
|
const roleList = computed(() =>
|
||||||
@@ -354,7 +326,6 @@ const createDefaultData = (): SettingsData => ({
|
|||||||
email: 'alex.chen@gmail.com',
|
email: 'alex.chen@gmail.com',
|
||||||
username: '@alexandra_chen',
|
username: '@alexandra_chen',
|
||||||
role: ['student', 'graphicDesigner'],
|
role: ['student', 'graphicDesigner'],
|
||||||
links: ['https://instagram.com/username', 'https://...'],
|
|
||||||
language: 'english',
|
language: 'english',
|
||||||
region: 'hongKongSar'
|
region: 'hongKongSar'
|
||||||
})
|
})
|
||||||
@@ -365,7 +336,6 @@ const cloneSettingsData = (data: SettingsData): SettingsData => ({
|
|||||||
email: data.email,
|
email: data.email,
|
||||||
username: data.username,
|
username: data.username,
|
||||||
role: [...data.role],
|
role: [...data.role],
|
||||||
links: [...data.links],
|
|
||||||
language: data.language,
|
language: data.language,
|
||||||
region: data.region
|
region: data.region
|
||||||
})
|
})
|
||||||
@@ -437,10 +407,6 @@ const handleEdit = () => {
|
|||||||
isEditing.value = true
|
isEditing.value = true
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleAddLink = () => {
|
|
||||||
draftData.value.links.push('')
|
|
||||||
}
|
|
||||||
|
|
||||||
const resetSecurityEmail = () => {
|
const resetSecurityEmail = () => {
|
||||||
securityDraft.value.newEmail = ''
|
securityDraft.value.newEmail = ''
|
||||||
resetEmailVerificationState()
|
resetEmailVerificationState()
|
||||||
@@ -512,7 +478,6 @@ const buildNextData = () => {
|
|||||||
username: draftData.value.username.trim(),
|
username: draftData.value.username.trim(),
|
||||||
email: nextEmail,
|
email: nextEmail,
|
||||||
role: draftData.value.role,
|
role: draftData.value.role,
|
||||||
links: draftData.value.links.map((item) => item.trim()).filter(Boolean),
|
|
||||||
language: draftData.value.language,
|
language: draftData.value.language,
|
||||||
region: draftData.value.region
|
region: draftData.value.region
|
||||||
}
|
}
|
||||||
@@ -529,8 +494,7 @@ const handleSave = async () => {
|
|||||||
saving.value = true
|
saving.value = true
|
||||||
try {
|
try {
|
||||||
sourceData.value = cloneSettingsData({
|
sourceData.value = cloneSettingsData({
|
||||||
...nextData,
|
...nextData
|
||||||
links: nextData.links.length ? nextData.links : ['']
|
|
||||||
})
|
})
|
||||||
|
|
||||||
if (nextData.language !== previousLanguage) {
|
if (nextData.language !== previousLanguage) {
|
||||||
@@ -785,71 +749,6 @@ watch(
|
|||||||
margin-top: 3rem;
|
margin-top: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.social-links {
|
|
||||||
margin-top: 5.8rem;
|
|
||||||
font-family: 'KaiseiOpti-Medium';
|
|
||||||
|
|
||||||
.title {
|
|
||||||
margin-bottom: 2rem;
|
|
||||||
font-size: 1.4rem;
|
|
||||||
color: #585858;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.read-social-links {
|
|
||||||
margin-top: 4.8rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.links-list {
|
|
||||||
row-gap: 0.8rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.links-item {
|
|
||||||
column-gap: 3.4rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.link-index {
|
|
||||||
font-family: 'KaiseiOpti-Regular';
|
|
||||||
font-size: 1.4rem;
|
|
||||||
line-height: 2rem;
|
|
||||||
color: #979797;
|
|
||||||
}
|
|
||||||
|
|
||||||
.link-href {
|
|
||||||
color: #979797;
|
|
||||||
|
|
||||||
&.readonly {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 0.8rem 2rem;
|
|
||||||
font-family: 'KaiseiOpti-Regular';
|
|
||||||
font-size: 1.4rem;
|
|
||||||
line-height: 2rem;
|
|
||||||
color: #9f9f9f;
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.el-input) {
|
|
||||||
height: 4rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.el-input__inner) {
|
|
||||||
font-family: 'KaiseiOpti-Regular';
|
|
||||||
font-size: 1.4rem;
|
|
||||||
color: #9f9f9f;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.add-link-btn {
|
|
||||||
width: 4rem;
|
|
||||||
height: 4rem;
|
|
||||||
border: 0.1rem solid #f0ebe5;
|
|
||||||
background: #f6f6f6;
|
|
||||||
color: #b4aea6;
|
|
||||||
font-size: 2rem;
|
|
||||||
line-height: 1;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.security-container {
|
.security-container {
|
||||||
.security-row + .security-row {
|
.security-row + .security-row {
|
||||||
margin-top: 2.8rem;
|
margin-top: 2.8rem;
|
||||||
|
|||||||
Reference in New Issue
Block a user