WFC/fe.wfc.user
2
0
Fork 0
Code Activity

适配暗黑色

Browse Source
This commit is contained in:
lai
2025-02-20 14:40:21 +08:00
parent 725c77da78
commit 8368a082ea
6 changed files with 35 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/views/_builtin/login/modules/pwd-login.vue
View File

@@ -98,18 +98,19 @@ async function getCheckCode() {
<template> <template>
<AForm ref="formRef" :model="model" :rules="rules"> <AForm ref="formRef" :model="model" :rules="rules">
<AFormItem name="username"> <AFormItem name="username">
<AInput v-model:value="model.username" size="large" :placeholder="$t('page.login.common.userNamePlaceholder')" /> <AInput v-model:value="model.username" size="large" :placeholder="$t('page.login.common.userNamePlaceholder')" autocomplete="off"/>
</AFormItem> </AFormItem>
<AFormItem name="password"> <AFormItem name="password">
<AInputPassword <AInputPassword
v-model:value="model.password" v-model:value="model.password"
size="large" size="large"
autocomplete="off"
:placeholder="$t('page.login.common.passwordPlaceholder')" :placeholder="$t('page.login.common.passwordPlaceholder')"
/> />
</AFormItem> </AFormItem>
<AFormItem> <AFormItem>
<div class="flex gap-4"> <div class="flex gap-4">
<AInput v-model:value="model.code" size="large" :placeholder="$t('page.login.common.checkCode')"> <AInput v-model:value="model.code" size="large" :placeholder="$t('page.login.common.checkCode')" autocomplete="off" >
<template #suffix></template> <template #suffix></template>
</AInput> </AInput>
<AImage :preview="false" :src="codeImg" @click="getCheckCode" /> <AImage :preview="false" :src="codeImg" @click="getCheckCode" />

13
src/views/_builtin/login/modules/register.vue
View File

@@ -353,12 +353,12 @@ const showSteps = computed(() => !isMobile.value);
<ARow :gutter="[8,2]"> <ARow :gutter="[8,2]">
<ACol :span="24" :lg="24"> <ACol :span="24" :lg="24">
<AFormItem name="username" :label="t('page.login.register.username')"> <AFormItem name="username" :label="t('page.login.register.username')">
<AInput v-model:value="basicModel.username" /> <AInput v-model:value="basicModel.username" autocomplete="off"/>
</AFormItem> </AFormItem>
</ACol> </ACol>
<ACol :span="24" :lg="24"> <ACol :span="24" :lg="24">
<AFormItem name="fullName" :label="t('page.login.register.fullName')"> <AFormItem name="fullName" :label="t('page.login.register.fullName')" >
<AInput v-model:value="basicModel.fullName" /> <AInput v-model:value="basicModel.fullName" autocomplete="off"/>
</AFormItem> </AFormItem>
</ACol> </ACol>
<ACol :xs="12" :sm="12" :lg="24"> <ACol :xs="12" :sm="12" :lg="24">
@@ -386,6 +386,7 @@ const showSteps = computed(() => !isMobile.value);
:placeholder="t('page.login.common.phonePlaceholder')" :placeholder="t('page.login.common.phonePlaceholder')"
@input="handlePhoneInput" @input="handlePhoneInput"
:maxLength="20" :maxLength="20"
autocomplete="off"
allow-clear allow-clear
/> />
</AFormItem> </AFormItem>
@@ -417,7 +418,7 @@ const showSteps = computed(() => !isMobile.value);
readonly readonly
class="mb-16px" class="mb-16px"
size="small" size="small"
:style="{ fontSize: '14px', lineHeight: '1.6' }" :style="{ fontSize: '14px', lineHeight: '1.6', backgroundColor: 'rgba(255, 255, 255, 0.1)' }"
/> />
<div class="mb-16px"> <div class="mb-16px">
<ACheckbox <ACheckbox
@@ -448,10 +449,11 @@ const showSteps = computed(() => !isMobile.value);
:wrapper-col="{ span: 16 }" :wrapper-col="{ span: 16 }"
class="compact-form" class="compact-form"
> >
<AFormItem name="email" :label="t('page.login.register.email')"> <AFormItem name="email" :label="t('page.login.register.email')" >
<AInput <AInput
v-model:value="securityModel.email" v-model:value="securityModel.email"
:placeholder="t('page.login.common.emailPlaceholder')" :placeholder="t('page.login.common.emailPlaceholder')"
autocomplete="off"
/> />
</AFormItem> </AFormItem>
<AFormItem name="code" :label="t('page.login.register.code')"> <AFormItem name="code" :label="t('page.login.register.code')">
@@ -459,6 +461,7 @@ const showSteps = computed(() => !isMobile.value);
<AInput <AInput
v-model:value="securityModel.code" v-model:value="securityModel.code"
:placeholder="t('page.login.common.codePlaceholder')" :placeholder="t('page.login.common.codePlaceholder')"
autocomplete="off"
/> />
<AButton <AButton
size="small" size="small"

4
src/views/_builtin/login/modules/reset-pwd.vue
View File

@@ -97,11 +97,11 @@ async function handleSubmit() {
<template> <template>
<AForm ref="formRef" :model="model" :rules="rules"> <AForm ref="formRef" :model="model" :rules="rules">
<AFormItem name="email"> <AFormItem name="email">
<AInput v-model:value="model.email" size="large" :placeholder="t('page.login.common.emailPlaceholder')" /> <AInput v-model:value="model.email" size="large" :placeholder="t('page.login.common.emailPlaceholder')" autocomplete="off"/>
</AFormItem> </AFormItem>
<AFormItem name="code"> <AFormItem name="code">
<div class="w-full flex-y-center gap-8px"> <div class="w-full flex-y-center gap-8px">
<AInput v-model:value="model.code" size="large" :placeholder="t('page.login.common.codePlaceholder')" /> <AInput v-model:value="model.code" size="large" :placeholder="t('page.login.common.codePlaceholder')" autocomplete="off"/>
<AButton <AButton
size="small" size="small"
:disabled="isCounting" :disabled="isCounting"

6
src/views/recharge/balancerecharge/index.vue
View File

@@ -202,7 +202,7 @@ const handlePaymentConfirm = async (paymentMethod: 'alipay' | 'wxpay') => {
:disabled="!paymentAmount || paymentAmount <= 0" :disabled="!paymentAmount || paymentAmount <= 0"
@click="handleRecharge" @click="handleRecharge"
> >
¥{{ paymentAmount.toFixed(2) }} {{ t('page.carddata.pay') }} <span style="color: var(--text-color, var(--ant-text-color))"> ¥{{ paymentAmount.toFixed(2) }} {{ t('page.carddata.pay') }} </span>
</AButton> </AButton>
</div> </div>
@@ -231,7 +231,7 @@ const handlePaymentConfirm = async (paymentMethod: 'alipay' | 'wxpay') => {
.recharge-option.selected, .recharge-option.selected,
.special-option.selected { .special-option.selected {
border-color: #1890ff; border-color: #1890ff;
background-color: #e6f7ff; background: rgba(63, 97, 207, 0.1);
} }
.special-option { .special-option {
@@ -281,7 +281,7 @@ const handlePaymentConfirm = async (paymentMethod: 'alipay' | 'wxpay') => {
} }
.payment-section { .payment-section {
background-color: #fff; background-color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
} }

26
src/views/recharge/package/index.vue
View File

@@ -372,7 +372,7 @@ onMounted(async () => {
</div> </div>
<!-- 套餐详情 --> <!-- 套餐详情 -->
<div class="package-details"> <a-card>
<h3 class="section-title">{{ t('page.setmeal.mealdetail') }}</h3> <h3 class="section-title">{{ t('page.setmeal.mealdetail') }}</h3>
<div class="details-list"> <div class="details-list">
<div class="detail-item"> <div class="detail-item">
@@ -426,7 +426,7 @@ onMounted(async () => {
</button> </button>
</div> </div>
</div> </div>
</div> </a-card>
<!-- 订单确认弹窗 --> <!-- 订单确认弹窗 -->
<OrderConfirmModal <OrderConfirmModal
@@ -447,7 +447,8 @@ onMounted(async () => {
} }
.price-header { .price-header {
background: #fff1f0; border-color: #ff4d4f;
background: rgba(218, 7, 7, 0.1);
padding: 20px; padding: 20px;
border-radius: 12px; border-radius: 12px;
margin-bottom: 16px; margin-bottom: 16px;
@@ -473,14 +474,14 @@ onMounted(async () => {
.subtitle { .subtitle {
font-size: 14px; font-size: 14px;
color: #666; color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
} }
.section-title { .section-title {
font-size: 16px; font-size: 16px;
font-weight: 500; font-weight: 500;
margin-bottom: 16px; margin-bottom: 16px;
color: #333; color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
position: relative; position: relative;
padding-left: 12px; padding-left: 12px;
} }
@@ -505,7 +506,7 @@ onMounted(async () => {
} }
.option-card { .option-card {
background: white; background: var(--primary-color, var(--ant-primary-color));
padding: 16px; padding: 16px;
border-radius: 8px; border-radius: 8px;
text-align: center; text-align: center;
@@ -522,7 +523,8 @@ onMounted(async () => {
.option-card.selected { .option-card.selected {
border-color: #ff4d4f; border-color: #ff4d4f;
background: #fff1f0; background: rgba(218, 7, 7, 0.1);
} }
.recommended-tag { .recommended-tag {
@@ -554,12 +556,12 @@ onMounted(async () => {
.label { .label {
width: 80px; width: 80px;
color: #666; color: var(--primary-color, var(--ant-primary-color));
} }
.value { .value {
flex: 1; flex: 1;
color: #333; color: var(--primary-color, var(--ant-primary-color));
} }
.value.highlight { .value.highlight {
@@ -596,18 +598,18 @@ onMounted(async () => {
font-size: 16px; font-size: 16px;
font-weight: 500; font-weight: 500;
margin-bottom: 8px; margin-bottom: 8px;
color: #333; color: var(--primary-color, var(--ant-primary-color));
} }
.traffic { .traffic {
font-size: 14px; font-size: 14px;
color: #666; color: var(--primary-color, var(--ant-primary-color));
margin-top: 8px; margin-top: 8px;
} }
.device-count { .device-count {
font-size: 14px; font-size: 14px;
color: #666; color: var(--primary-color, var(--ant-primary-color));
margin-top: 4px; margin-top: 4px;
} }

8
src/views/recharge/rechargeservice/index.vue
View File

@@ -56,6 +56,7 @@ const handleClick: MenuProps['onClick'] = e => {
</script> </script>
<template> <template>
<a-card>
<div class="recharge-container"> <div class="recharge-container">
<div class="recharge-content-wrapper"> <div class="recharge-content-wrapper">
<!-- 返回按钮 --> <!-- 返回按钮 -->
@@ -84,12 +85,13 @@ const handleClick: MenuProps['onClick'] = e => {
</div> </div>
</div> </div>
</div> </div>
</a-card>
</template> </template>
<style scoped> <style scoped>
.recharge-container { .recharge-container {
min-height: 100vh; min-height: 100vh;
background-color: #f5f5f7; background-color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
padding: 16px; padding: 16px;
} }
@@ -103,13 +105,13 @@ const handleClick: MenuProps['onClick'] = e => {
} }
.recharge-menu { .recharge-menu {
background-color: #fff; background-color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
border-radius: 8px; border-radius: 8px;
margin-bottom: 16px; margin-bottom: 16px;
} }
.recharge-content { .recharge-content {
background-color: #fff; background-color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
border-radius: 8px; border-radius: 8px;
padding: 16px; padding: 16px;
min-height: 400px; min-height: 400px;