mirror of
https://github.com/vbenjs/gf-vben-admin.git
synced 2025-02-02 19:08:40 +08:00
fix: fix darkModeSwitch switch failure
This commit is contained in:
parent
c5f2577f51
commit
34a80542de
@ -6,7 +6,7 @@
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent, computed } from 'vue';
|
||||
import { defineComponent, computed, unref } from 'vue';
|
||||
import { SvgIcon } from '/@/components/Icon';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import { useRootSetting } from '/@/hooks/setting/useRootSetting';
|
||||
@ -26,7 +26,7 @@
|
||||
const getClass = computed(() => [
|
||||
prefixCls,
|
||||
{
|
||||
[`${prefixCls}--dark`]: isDark,
|
||||
[`${prefixCls}--dark`]: unref(isDark),
|
||||
},
|
||||
]);
|
||||
|
||||
|
@ -1,4 +1,6 @@
|
||||
import CountButton from './src/CountButton.vue';
|
||||
import CountdownInput from './src/CountdownInput.vue';
|
||||
import { withInstall } from '/@/utils';
|
||||
import countButton from './src/CountButton.vue';
|
||||
import countdownInput from './src/CountdownInput.vue';
|
||||
|
||||
export { CountdownInput, CountButton };
|
||||
export const CountdownInput = withInstall(countdownInput);
|
||||
export const CountButton = withInstall(countButton);
|
||||
|
@ -1,42 +1,44 @@
|
||||
<template>
|
||||
<Button v-bind="$attrs" :disabled="isStart" @click="handleStart" :loading="loading">
|
||||
{{
|
||||
!isStart
|
||||
? t('component.countdown.normalText')
|
||||
: t('component.countdown.sendText', [currentCount])
|
||||
}}
|
||||
{{ getButtonText }}
|
||||
</Button>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref, PropType, watchEffect } from 'vue';
|
||||
|
||||
import { defineComponent, ref, watchEffect, computed, unref } from 'vue';
|
||||
import { Button } from 'ant-design-vue';
|
||||
|
||||
import { useCountdown } from './useCountdown';
|
||||
import { isFunction } from '/@/utils/is';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { propTypes } from '/@/utils/propTypes';
|
||||
|
||||
const props = {
|
||||
value: { type: [Object, Number, String, Array] },
|
||||
count: { type: Number, default: 60 },
|
||||
beforeStartFunc: {
|
||||
type: Function as PropType<() => Promise<boolean>>,
|
||||
default: null,
|
||||
},
|
||||
};
|
||||
|
||||
export default defineComponent({
|
||||
name: 'CountButton',
|
||||
components: { Button },
|
||||
props: {
|
||||
value: propTypes.any,
|
||||
count: propTypes.number.def(60),
|
||||
beforeStartFunc: {
|
||||
type: Function as PropType<() => boolean>,
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
props,
|
||||
setup(props) {
|
||||
const loading = ref(false);
|
||||
|
||||
const { currentCount, isStart, start, reset } = useCountdown(props.count);
|
||||
const { t } = useI18n();
|
||||
|
||||
const getButtonText = computed(() => {
|
||||
return !unref(isStart)
|
||||
? t('component.countdown.normalText')
|
||||
: t('component.countdown.sendText', [unref(currentCount)]);
|
||||
});
|
||||
|
||||
watchEffect(() => {
|
||||
props.value === undefined && reset();
|
||||
});
|
||||
|
||||
/**
|
||||
* @description: Judge whether there is an external function before execution, and decide whether to start after execution
|
||||
*/
|
||||
@ -54,7 +56,7 @@
|
||||
start();
|
||||
}
|
||||
}
|
||||
return { handleStart, isStart, currentCount, loading, t };
|
||||
return { handleStart, currentCount, loading, getButtonText, isStart };
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
@ -7,31 +7,30 @@
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent, PropType } from 'vue';
|
||||
|
||||
import { Input } from 'ant-design-vue';
|
||||
import CountButton from './CountButton.vue';
|
||||
|
||||
import { propTypes } from '/@/utils/propTypes';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
|
||||
import { useRuleFormItem } from '/@/hooks/component/useFormItem';
|
||||
|
||||
const props = {
|
||||
value: { type: String },
|
||||
size: { type: String, validator: (v) => ['default', 'large', 'small'].includes(v) },
|
||||
count: { type: Number, default: 60 },
|
||||
sendCodeApi: {
|
||||
type: Function as PropType<() => Promise<boolean>>,
|
||||
default: null,
|
||||
},
|
||||
};
|
||||
|
||||
export default defineComponent({
|
||||
name: 'CountDownInput',
|
||||
components: { [Input.name]: Input, CountButton },
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
value: propTypes.string,
|
||||
size: propTypes.oneOf(['default', 'large', 'small']),
|
||||
count: propTypes.number.def(60),
|
||||
sendCodeApi: {
|
||||
type: Function as PropType<() => boolean>,
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
props,
|
||||
setup(props) {
|
||||
const { prefixCls } = useDesign('countdown-input');
|
||||
const [state] = useRuleFormItem(props);
|
||||
|
||||
return { prefixCls, state };
|
||||
},
|
||||
});
|
||||
|
@ -1,16 +1,19 @@
|
||||
import Icon from './Icon/index';
|
||||
import { Icon } from './Icon';
|
||||
import { Button } from './Button';
|
||||
import {
|
||||
// Need
|
||||
Button as AntButton,
|
||||
Input,
|
||||
} from 'ant-design-vue';
|
||||
|
||||
import { App } from 'vue';
|
||||
|
||||
const compList = [Icon, Button, AntButton.Group];
|
||||
const compList = [Icon, AntButton.Group];
|
||||
|
||||
export function registerGlobComp(app: App) {
|
||||
compList.forEach((comp: any) => {
|
||||
app.component(comp.name || comp.displayName, comp);
|
||||
});
|
||||
|
||||
app.use(Input).use(Button);
|
||||
}
|
||||
|
@ -80,26 +80,8 @@
|
||||
{
|
||||
smooth: true,
|
||||
data: [
|
||||
111,
|
||||
222,
|
||||
4000,
|
||||
18000,
|
||||
33333,
|
||||
55555,
|
||||
66666,
|
||||
33333,
|
||||
14000,
|
||||
36000,
|
||||
66666,
|
||||
44444,
|
||||
22222,
|
||||
11111,
|
||||
4000,
|
||||
2000,
|
||||
500,
|
||||
333,
|
||||
222,
|
||||
111,
|
||||
111, 222, 4000, 18000, 33333, 55555, 66666, 33333, 14000, 36000, 66666, 44444,
|
||||
22222, 11111, 4000, 2000, 500, 333, 222, 111,
|
||||
],
|
||||
type: 'line',
|
||||
areaStyle: {},
|
||||
@ -110,26 +92,8 @@
|
||||
{
|
||||
smooth: true,
|
||||
data: [
|
||||
33,
|
||||
66,
|
||||
88,
|
||||
333,
|
||||
3333,
|
||||
5000,
|
||||
18000,
|
||||
3000,
|
||||
1200,
|
||||
13000,
|
||||
22000,
|
||||
11000,
|
||||
2221,
|
||||
1201,
|
||||
390,
|
||||
198,
|
||||
60,
|
||||
30,
|
||||
22,
|
||||
11,
|
||||
33, 66, 88, 333, 3333, 5000, 18000, 3000, 1200, 13000, 22000, 11000, 2221, 1201,
|
||||
390, 198, 60, 30, 22, 11,
|
||||
],
|
||||
type: 'line',
|
||||
areaStyle: {},
|
||||
|
Loading…
Reference in New Issue
Block a user