mirror of
https://github.com/Tencent/tdesign-vue-next-starter.git
synced 2024-12-22 16:36:32 +08:00
feat: 将现有代码迁移至TS严格模式 - 禁止any类型 (#519)
* feat: 新增type enum类型 * feat: 开启禁止any类型规则 * types: 优化通知标签类型 * types: 补充标签页移除方法类型 * types: 补充请求工具类型 * types: 补充store相关类型 * types: 补充路由相关类型 * types: 补充钩子类型 * types: 补充页面组件类型 * types: 补充布局类型 * fix: 修复编译问题
This commit is contained in:
parent
09fdbb3465
commit
f9f9e91438
|
@ -1,2 +1,11 @@
|
|||
// commit-lint config
|
||||
module.exports = { extends: ['@commitlint/config-conventional'] };
|
||||
module.exports = {
|
||||
extends: ['@commitlint/config-conventional'],
|
||||
rules: {
|
||||
'type-enum': [
|
||||
2,
|
||||
'always',
|
||||
['build', 'chore', 'ci', 'docs', 'feat', 'fix', 'perf', 'refactor', 'revert', 'style', 'test', 'types'],
|
||||
],
|
||||
},
|
||||
};
|
||||
|
|
|
@ -34,12 +34,14 @@ export const CONTRACT_PAYMENT_TYPES = {
|
|||
RECEIPT: 1,
|
||||
};
|
||||
|
||||
// 通知的优先级对应的TAG类型
|
||||
export const NOTIFICATION_TYPES = {
|
||||
low: 'primary',
|
||||
middle: 'warning',
|
||||
high: 'danger',
|
||||
};
|
||||
// 标签类型
|
||||
type TagTheme = 'default' | 'success' | 'primary' | 'warning' | 'danger';
|
||||
// 通知的优先级对应的标签类型
|
||||
export const NOTIFICATION_TYPES: Map<string, TagTheme> = new Map([
|
||||
['low', 'primary'],
|
||||
['middle', 'warning'],
|
||||
['high', 'danger'],
|
||||
]);
|
||||
|
||||
// 通用请求头
|
||||
export enum ContentTypeEnum {
|
||||
|
|
|
@ -39,7 +39,7 @@ export const useChart = (domId: string): Ref<echarts.ECharts> => {
|
|||
* @returns
|
||||
*/
|
||||
export const useCounter = (duration = 60): [Ref<number>, () => void] => {
|
||||
let intervalTimer;
|
||||
let intervalTimer: ReturnType<typeof setInterval>;
|
||||
onUnmounted(() => {
|
||||
clearInterval(intervalTimer);
|
||||
});
|
||||
|
|
|
@ -141,7 +141,7 @@ const changeCollapsed = () => {
|
|||
});
|
||||
};
|
||||
|
||||
const handleNav = (url) => {
|
||||
const handleNav = (url: string) => {
|
||||
router.push(url);
|
||||
};
|
||||
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
:min-column-width="128"
|
||||
:popup-props="{
|
||||
overlayClassName: 'route-tabs-dropdown',
|
||||
onVisibleChange: (visible, ctx) => handleTabMenuClick(visible, ctx, routeItem.path),
|
||||
onVisibleChange: (visible: boolean, ctx: PopupVisibleChangeContext) => handleTabMenuClick(visible, ctx, routeItem.path),
|
||||
visible: activeTabPath === routeItem.path,
|
||||
}"
|
||||
>
|
||||
|
@ -70,12 +70,13 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import type { PopupVisibleChangeContext } from 'tdesign-vue-next';
|
||||
import { computed, nextTick, ref } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
||||
import { prefix } from '@/config/global';
|
||||
import { useSettingStore, useTabsRouterStore } from '@/store';
|
||||
import type { TRouterInfo } from '@/types/interface';
|
||||
import type { TRouterInfo, TTabRemoveOptions } from '@/types/interface';
|
||||
|
||||
import LBreadcrumb from './Breadcrumb.vue';
|
||||
import LContent from './Content.vue';
|
||||
|
@ -95,12 +96,12 @@ const handleChangeCurrentTab = (path: string) => {
|
|||
router.push({ path, query: route.query });
|
||||
};
|
||||
|
||||
const handleRemove = ({ value: path, index }) => {
|
||||
const handleRemove = (options: TTabRemoveOptions) => {
|
||||
const { tabRouters } = tabsRouterStore;
|
||||
const nextRouter = tabRouters[index + 1] || tabRouters[index - 1];
|
||||
const nextRouter = tabRouters[options.index + 1] || tabRouters[options.index - 1];
|
||||
|
||||
tabsRouterStore.subtractCurrentTabRouter({ path, routeIdx: index });
|
||||
if (path === route.path) router.push({ path: nextRouter.path, query: nextRouter.query });
|
||||
tabsRouterStore.subtractCurrentTabRouter({ path: options.value as string, routeIdx: options.index });
|
||||
if ((options.value as string) === route.path) router.push({ path: nextRouter.path, query: nextRouter.query });
|
||||
};
|
||||
|
||||
const handleRefresh = (route: TRouterInfo, routeIdx: number) => {
|
||||
|
@ -147,7 +148,7 @@ const handleOperationEffect = (type: 'other' | 'ahead' | 'behind', routeIndex: n
|
|||
|
||||
activeTabPath.value = null;
|
||||
};
|
||||
const handleTabMenuClick = (visible: boolean, ctx, path: string) => {
|
||||
const handleTabMenuClick = (visible: boolean, ctx: PopupVisibleChangeContext, path: string) => {
|
||||
if (ctx.trigger === 'document') activeTabPath.value = null;
|
||||
if (visible) activeTabPath.value = path;
|
||||
};
|
||||
|
|
|
@ -16,6 +16,7 @@ import { computed } from 'vue';
|
|||
import { useRoute } from 'vue-router';
|
||||
|
||||
import { usePermissionStore, useSettingStore } from '@/store';
|
||||
import type { MenuRoute } from '@/types/interface';
|
||||
|
||||
import LSideNav from './SideNav.vue';
|
||||
|
||||
|
@ -26,7 +27,7 @@ const { routers: menuRouters } = storeToRefs(permissionStore);
|
|||
|
||||
const sideMenu = computed(() => {
|
||||
const { layout, splitMenu } = settingStore;
|
||||
let newMenuRouters = menuRouters.value;
|
||||
let newMenuRouters = menuRouters.value as Array<MenuRoute>;
|
||||
if (layout === 'mix' && splitMenu) {
|
||||
newMenuRouters.forEach((menu) => {
|
||||
if (route.path.indexOf(menu.path) === 0) {
|
||||
|
|
|
@ -120,7 +120,7 @@ const initStyleConfig = () => {
|
|||
const styleConfig = STYLE_CONFIG;
|
||||
for (const key in styleConfig) {
|
||||
if (Object.prototype.hasOwnProperty.call(styleConfig, key)) {
|
||||
styleConfig[key] = settingStore[key];
|
||||
(styleConfig[key as keyof typeof STYLE_CONFIG] as any) = settingStore[key as keyof typeof STYLE_CONFIG];
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import dayjs from 'dayjs';
|
||||
import { EChartsOption } from 'echarts';
|
||||
|
||||
import { TChartColor } from '@/config/color';
|
||||
import { getRandomArray } from '@/utils/charts';
|
||||
|
@ -307,7 +308,7 @@ export function getPieChartDataSet({
|
|||
textColor,
|
||||
placeholderColor,
|
||||
containerColor,
|
||||
}: { radius?: number } & Record<string, string>) {
|
||||
}: { radius?: number } & Record<string, string>): EChartsOption {
|
||||
return {
|
||||
color: getChartListColor(),
|
||||
tooltip: {
|
||||
|
|
|
@ -83,14 +83,14 @@ export const TABLE_COLUMNS_DATA = [
|
|||
ellipsis: true,
|
||||
colKey: 'index',
|
||||
title: '申请号',
|
||||
sorter: (a, b) => a.index.substr(3) - b.index.substr(3),
|
||||
sorter: (a: any, b: any) => a.index.substr(3) - b.index.substr(3),
|
||||
},
|
||||
{
|
||||
width: 200,
|
||||
ellipsis: true,
|
||||
colKey: 'pdName',
|
||||
title: '产品名称',
|
||||
sorter: (a, b) => a.pdName.length - b.pdName.length,
|
||||
sorter: (a: any, b: any) => a.pdName.length - b.pdName.length,
|
||||
},
|
||||
{
|
||||
width: 200,
|
||||
|
@ -103,7 +103,7 @@ export const TABLE_COLUMNS_DATA = [
|
|||
ellipsis: true,
|
||||
colKey: 'purchaseNum',
|
||||
title: '采购数量',
|
||||
sorter: (a, b) => a.purchaseNum - b.purchaseNum,
|
||||
sorter: (a: any, b: any) => a.purchaseNum - b.purchaseNum,
|
||||
},
|
||||
{
|
||||
width: 160,
|
||||
|
@ -116,7 +116,7 @@ export const TABLE_COLUMNS_DATA = [
|
|||
ellipsis: true,
|
||||
colKey: 'updateTime',
|
||||
title: '创建时间',
|
||||
sorter: (a, b) => Date.parse(a.updateTime) - Date.parse(b.updateTime),
|
||||
sorter: (a: any, b: any) => Date.parse(a.updateTime) - Date.parse(b.updateTime),
|
||||
},
|
||||
{
|
||||
align: 'left' as const,
|
||||
|
|
|
@ -170,16 +170,16 @@ onMounted(() => {
|
|||
});
|
||||
|
||||
const visible = ref(false);
|
||||
const sortChange = (val) => {
|
||||
const sortChange = (val: unknown) => {
|
||||
console.log(val);
|
||||
};
|
||||
const rehandleChange = (changeParams, triggerAndData) => {
|
||||
const rehandleChange = (changeParams: unknown, triggerAndData: unknown) => {
|
||||
console.log('统一Change', changeParams, triggerAndData);
|
||||
};
|
||||
const listClick = () => {
|
||||
visible.value = true;
|
||||
};
|
||||
const deleteClickOp = (columns) => {
|
||||
const deleteClickOp = (columns: { rowIndex: number }) => {
|
||||
data.value.splice(columns.rowIndex, 1);
|
||||
};
|
||||
const onConfirm = () => {
|
||||
|
|
|
@ -87,7 +87,7 @@ export const TABLE_COLUMNS = [
|
|||
ellipsis: true,
|
||||
colKey: 'name',
|
||||
title: '项目名称',
|
||||
sorter: (a, b) => a.name.substr(10) - b.name.substr(10),
|
||||
sorter: (a: any, b: any) => a.name.substr(10) - b.name.substr(10),
|
||||
},
|
||||
{
|
||||
width: '280',
|
||||
|
@ -101,7 +101,7 @@ export const TABLE_COLUMNS = [
|
|||
ellipsis: true,
|
||||
colKey: 'updateTime',
|
||||
title: '创建时间',
|
||||
sorter: (a, b) => Date.parse(a.updateTime) - Date.parse(b.updateTime),
|
||||
sorter: (a: any, b: any) => Date.parse(a.updateTime) - Date.parse(b.updateTime),
|
||||
},
|
||||
{
|
||||
align: 'left' as const,
|
||||
|
|
|
@ -147,8 +147,6 @@ onMounted(() => {
|
|||
dataChart.setOption(get2ColBarChartDataSet({ ...chartColors.value }));
|
||||
});
|
||||
|
||||
const intervalTimer = null;
|
||||
|
||||
/// / chartSize update
|
||||
const updateContainer = () => {
|
||||
monitorChart.resize({
|
||||
|
@ -163,7 +161,6 @@ const updateContainer = () => {
|
|||
|
||||
onUnmounted(() => {
|
||||
window.removeEventListener('resize', updateContainer);
|
||||
clearInterval(intervalTimer);
|
||||
});
|
||||
|
||||
const onAlertChange = () => {
|
||||
|
@ -182,10 +179,10 @@ watch(
|
|||
},
|
||||
);
|
||||
|
||||
const sortChange = (val) => {
|
||||
const sortChange = (val: unknown) => {
|
||||
console.log(val);
|
||||
};
|
||||
const rehandleChange = (changeParams, triggerAndData) => {
|
||||
const rehandleChange = (changeParams: unknown, triggerAndData: unknown) => {
|
||||
console.log('统一Change', changeParams, triggerAndData);
|
||||
};
|
||||
const listClick = () => {
|
||||
|
@ -194,7 +191,7 @@ const listClick = () => {
|
|||
const onConfirm = () => {
|
||||
visible.value = false;
|
||||
};
|
||||
const deleteClickOp = (e) => {
|
||||
const deleteClickOp = (e: { rowIndex: number }) => {
|
||||
data.value.splice(e.rowIndex, 1);
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<t-list v-if="msgDataList.length > 0" class="secondary-msg-list" :split="true">
|
||||
<t-list-item v-for="(item, index) in msgDataList" :key="index">
|
||||
<p :class="['content', { unread: item.status }]" @click="setReadStatus(item)">
|
||||
<t-tag size="medium" :theme="NOTIFICATION_TYPES[item.quality]" variant="light">
|
||||
<t-tag size="medium" :theme="NOTIFICATION_TYPES.get(item.quality)" variant="light">
|
||||
{{ item.type }}
|
||||
</t-tag>
|
||||
{{ item.content }}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { FormRule } from 'tdesign-vue-next';
|
||||
import type { FormRule, UploadFile } from 'tdesign-vue-next';
|
||||
|
||||
export const FORM_RULES: Record<string, FormRule[]> = {
|
||||
name: [{ required: true, message: '请输入合同名称', type: 'error' }],
|
||||
|
@ -23,7 +23,7 @@ export const INITIAL_DATA = {
|
|||
payment: '1',
|
||||
amount: 0,
|
||||
comment: '',
|
||||
files: [],
|
||||
files: [] as Array<UploadFile>,
|
||||
};
|
||||
|
||||
export const TYPE_OPTIONS = [
|
||||
|
|
|
@ -164,6 +164,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import type { SubmitContext, UploadFailContext, UploadFile } from 'tdesign-vue-next';
|
||||
import { MessagePlugin } from 'tdesign-vue-next';
|
||||
import { ref } from 'vue';
|
||||
|
||||
|
@ -174,12 +175,12 @@ const formData = ref({ ...INITIAL_DATA });
|
|||
const onReset = () => {
|
||||
MessagePlugin.warning('取消新建');
|
||||
};
|
||||
const onSubmit = ({ validateResult }) => {
|
||||
if (validateResult === true) {
|
||||
const onSubmit = (ctx: SubmitContext) => {
|
||||
if (ctx.validateResult === true) {
|
||||
MessagePlugin.success('新建成功');
|
||||
}
|
||||
};
|
||||
const beforeUpload = (file) => {
|
||||
const beforeUpload = (file: UploadFile) => {
|
||||
if (!/\.(pdf)$/.test(file.name)) {
|
||||
MessagePlugin.warning('请上传pdf文件');
|
||||
return false;
|
||||
|
@ -190,11 +191,11 @@ const beforeUpload = (file) => {
|
|||
}
|
||||
return true;
|
||||
};
|
||||
const handleFail = ({ file }) => {
|
||||
MessagePlugin.error(`文件 ${file.name} 上传失败`);
|
||||
const handleFail = (options: UploadFailContext) => {
|
||||
MessagePlugin.error(`文件 ${options.file.name} 上传失败`);
|
||||
};
|
||||
// 用于格式化接口响应值,error 会被用于上传失败的提示文字;url 表示文件/图片地址
|
||||
const formatResponse = (res) => {
|
||||
const formatResponse = (res: any) => {
|
||||
return { ...res, error: '上传失败,请重试', url: res.url };
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
:data="formData1"
|
||||
:rules="FORM_RULES"
|
||||
label-align="right"
|
||||
@submit="(result) => onSubmit(result, 1)"
|
||||
@submit="(result: SubmitContext) => onSubmit(result, 1)"
|
||||
>
|
||||
<t-form-item label="合同名称" name="name">
|
||||
<t-select v-model="formData1.name" :style="{ width: '480px' }" class="demo-select-base" clearable>
|
||||
|
@ -59,7 +59,7 @@
|
|||
:rules="FORM_RULES"
|
||||
label-align="left"
|
||||
@reset="onReset(0)"
|
||||
@submit="(result) => onSubmit(result, 2)"
|
||||
@submit="(result: SubmitContext) => onSubmit(result, 2)"
|
||||
>
|
||||
<t-form-item label="发票抬头" name="title">
|
||||
<t-input v-model="formData2.title" :style="{ width: '480px' }" placeholder="请输入发票抬头" />
|
||||
|
@ -96,7 +96,7 @@
|
|||
:rules="FORM_RULES"
|
||||
label-align="left"
|
||||
@reset="onReset(1)"
|
||||
@submit="(result) => onSubmit(result, 6)"
|
||||
@submit="(result: SubmitContext) => onSubmit(result, 6)"
|
||||
>
|
||||
<t-form-item label="收货人" name="consignee">
|
||||
<t-input v-model="formData3.consignee" :style="{ width: '480px' }" placeholder="请输入收货人" />
|
||||
|
@ -147,7 +147,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Data, SubmitContext } from 'tdesign-vue-next';
|
||||
import { SubmitContext } from 'tdesign-vue-next';
|
||||
import { computed, ref } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
|
@ -179,7 +179,7 @@ const amount = computed(() => {
|
|||
return '--';
|
||||
});
|
||||
|
||||
const onSubmit = (result: SubmitContext<Data>, val: number) => {
|
||||
const onSubmit = (result: SubmitContext, val: number) => {
|
||||
if (result.validateResult === true) {
|
||||
activeForm.value = val;
|
||||
}
|
||||
|
|
|
@ -160,10 +160,10 @@ const rowKey = 'index';
|
|||
const rehandleSelectChange = (val: number[]) => {
|
||||
selectedRowKeys.value = val;
|
||||
};
|
||||
const rehandlePageChange = (curr, pageInfo) => {
|
||||
const rehandlePageChange = (curr: unknown, pageInfo: unknown) => {
|
||||
console.log('分页变化', curr, pageInfo);
|
||||
};
|
||||
const rehandleChange = (changeParams, triggerAndData) => {
|
||||
const rehandleChange = (changeParams: unknown, triggerAndData: unknown) => {
|
||||
console.log('统一Change', changeParams, triggerAndData);
|
||||
};
|
||||
const handleClickDetail = () => {
|
||||
|
|
|
@ -73,15 +73,26 @@ import { MessagePlugin } from 'tdesign-vue-next';
|
|||
import { computed, onMounted, ref } from 'vue';
|
||||
|
||||
import { getCardList } from '@/api/list';
|
||||
import type { CardProductType } from '@/components/product-card/index.vue';
|
||||
import ProductCard from '@/components/product-card/index.vue';
|
||||
|
||||
import DialogForm from './components/DialogForm.vue';
|
||||
|
||||
const INITIAL_DATA = {
|
||||
interface FormData {
|
||||
name: string;
|
||||
status: string;
|
||||
description: string;
|
||||
type: number;
|
||||
mark: string;
|
||||
amount: number;
|
||||
[key: string]: unknown;
|
||||
}
|
||||
|
||||
const INITIAL_DATA: FormData = {
|
||||
name: '',
|
||||
status: '',
|
||||
description: '',
|
||||
type: '',
|
||||
type: 0,
|
||||
mark: '',
|
||||
amount: 0,
|
||||
};
|
||||
|
@ -127,7 +138,7 @@ const onPageSizeChange = (size: number) => {
|
|||
const onCurrentChange = (current: number) => {
|
||||
pagination.value.current = current;
|
||||
};
|
||||
const handleDeleteItem = (product) => {
|
||||
const handleDeleteItem = (product: CardProductType) => {
|
||||
confirmVisible.value = true;
|
||||
deleteProduct.value = product;
|
||||
};
|
||||
|
@ -141,9 +152,16 @@ const onCancel = () => {
|
|||
deleteProduct.value = undefined;
|
||||
formData.value = { ...INITIAL_DATA };
|
||||
};
|
||||
const handleManageProduct = (product) => {
|
||||
const handleManageProduct = (product: CardProductType) => {
|
||||
formDialogVisible.value = true;
|
||||
formData.value = { ...product, status: product?.isSetup ? '1' : '0' };
|
||||
formData.value = {
|
||||
name: product.name,
|
||||
status: product?.isSetup ? '1' : '0',
|
||||
description: product.description,
|
||||
type: product.type,
|
||||
mark: '',
|
||||
amount: 0,
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
|
@ -122,7 +122,7 @@ import { useSettingStore } from '@/store';
|
|||
|
||||
const store = useSettingStore();
|
||||
|
||||
const COLUMNS: PrimaryTableCol<TableRowData>[] = [
|
||||
const COLUMNS: PrimaryTableCol[] = [
|
||||
{
|
||||
title: '合同名称',
|
||||
fixed: 'left',
|
||||
|
@ -167,8 +167,8 @@ const COLUMNS: PrimaryTableCol<TableRowData>[] = [
|
|||
|
||||
const searchForm = {
|
||||
name: '',
|
||||
no: undefined,
|
||||
status: undefined,
|
||||
no: '',
|
||||
status: typeof CONTRACT_STATUS,
|
||||
type: '',
|
||||
};
|
||||
|
||||
|
@ -233,24 +233,24 @@ onMounted(() => {
|
|||
fetchData();
|
||||
});
|
||||
|
||||
const handleClickDelete = ({ row }) => {
|
||||
deleteIdx.value = row.rowIndex;
|
||||
const handleClickDelete = (slot: { row: { rowIndex: number } }) => {
|
||||
deleteIdx.value = slot.row.rowIndex;
|
||||
confirmVisible.value = true;
|
||||
};
|
||||
const onReset = (val) => {
|
||||
const onReset = (val: unknown) => {
|
||||
console.log(val);
|
||||
};
|
||||
const onSubmit = (val) => {
|
||||
const onSubmit = (val: unknown) => {
|
||||
console.log(val);
|
||||
};
|
||||
const rehandlePageChange = (pageInfo: PageInfo, newDataSource: TableRowData[]) => {
|
||||
console.log('分页变化', pageInfo, newDataSource);
|
||||
};
|
||||
const rehandleChange = (changeParams, triggerAndData) => {
|
||||
const rehandleChange = (changeParams: unknown, triggerAndData: unknown) => {
|
||||
console.log('统一Change', changeParams, triggerAndData);
|
||||
};
|
||||
const rehandleClickOp = ({ text, row }) => {
|
||||
console.log(text, row);
|
||||
const rehandleClickOp = (ctx: unknown) => {
|
||||
console.log(ctx);
|
||||
};
|
||||
|
||||
const headerAffixedTop = computed(
|
||||
|
|
|
@ -24,6 +24,7 @@ export default {
|
|||
|
||||
<script setup lang="ts">
|
||||
import { SearchIcon } from 'tdesign-icons-vue-next';
|
||||
import type { TreeNodeModel } from 'tdesign-vue-next';
|
||||
import { ref } from 'vue';
|
||||
|
||||
import CommonTable from '../components/CommonTable.vue';
|
||||
|
@ -35,9 +36,8 @@ const filterText = ref();
|
|||
const expanded = ['0', '0-0', '0-1', '0-2', '0-3', '0-4'];
|
||||
|
||||
const onInput = () => {
|
||||
filterByText.value = (node) => {
|
||||
const rs = node.label.indexOf(filterText.value) >= 0;
|
||||
return rs;
|
||||
filterByText.value = (node: TreeNodeModel) => {
|
||||
return node.label.indexOf(filterText.value) >= 0;
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -80,7 +80,7 @@
|
|||
|
||||
<script setup lang="ts">
|
||||
import QrcodeVue from 'qrcode.vue';
|
||||
import type { FormInstanceFunctions, FormRule } from 'tdesign-vue-next';
|
||||
import type { FormInstanceFunctions, FormRule, SubmitContext } from 'tdesign-vue-next';
|
||||
import { MessagePlugin } from 'tdesign-vue-next';
|
||||
import { ref } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
@ -131,8 +131,8 @@ const sendCode = () => {
|
|||
});
|
||||
};
|
||||
|
||||
const onSubmit = async ({ validateResult }) => {
|
||||
if (validateResult === true) {
|
||||
const onSubmit = async (ctx: SubmitContext) => {
|
||||
if (ctx.validateResult === true) {
|
||||
try {
|
||||
await userStore.login(formData.value);
|
||||
|
||||
|
|
|
@ -71,7 +71,8 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { FormRule, MessagePlugin } from 'tdesign-vue-next';
|
||||
import type { FormRule, SubmitContext } from 'tdesign-vue-next';
|
||||
import { MessagePlugin } from 'tdesign-vue-next';
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { useCounter } from '@/hooks';
|
||||
|
@ -105,8 +106,8 @@ const [countDown, handleCounter] = useCounter();
|
|||
|
||||
const emit = defineEmits(['registerSuccess']);
|
||||
|
||||
const onSubmit = ({ validateResult }) => {
|
||||
if (validateResult === true) {
|
||||
const onSubmit = (ctx: SubmitContext) => {
|
||||
if (ctx.validateResult === true) {
|
||||
if (!formData.value.checked) {
|
||||
MessagePlugin.error('请同意TDesign服务协议和TDesign 隐私声明');
|
||||
return;
|
||||
|
@ -116,7 +117,7 @@ const onSubmit = ({ validateResult }) => {
|
|||
}
|
||||
};
|
||||
|
||||
const switchType = (val) => {
|
||||
const switchType = (val: string) => {
|
||||
form.value.reset();
|
||||
type.value = val;
|
||||
};
|
||||
|
|
|
@ -1,4 +1,10 @@
|
|||
export const USER_INFO_LIST = [
|
||||
export interface UserInfoListType {
|
||||
title: string;
|
||||
content: string;
|
||||
span?: number;
|
||||
}
|
||||
|
||||
export const USER_INFO_LIST: Array<UserInfoListType> = [
|
||||
{
|
||||
title: '手机',
|
||||
content: '+86 13923734567',
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
</t-button>
|
||||
</template>
|
||||
<t-row class="content" justify="space-between">
|
||||
<t-col v-for="(item, index) in USER_INFO_LIST" :key="index" class="contract" :span="item.span || 3">
|
||||
<t-col v-for="(item, index) in USER_INFO_LIST" :key="index" class="contract" :span="item.span ?? 3">
|
||||
<div class="contract-title">
|
||||
{{ item.title }}
|
||||
</div>
|
||||
|
@ -98,6 +98,7 @@ import { LineChart } from 'echarts/charts';
|
|||
import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components';
|
||||
import * as echarts from 'echarts/core';
|
||||
import { CanvasRenderer } from 'echarts/renderers';
|
||||
import type { DateRangeValue } from 'tdesign-vue-next';
|
||||
import { computed, nextTick, onMounted, onUnmounted, watch } from 'vue';
|
||||
|
||||
import ProductAIcon from '@/assets/assets-product-1.svg';
|
||||
|
@ -118,8 +119,13 @@ let lineChart: echarts.ECharts;
|
|||
const store = useSettingStore();
|
||||
const chartColors = computed(() => store.chartColors);
|
||||
|
||||
const onLineChange = (value) => {
|
||||
lineChart.setOption(getFolderLineDataSet(value));
|
||||
const onLineChange = (value: DateRangeValue) => {
|
||||
lineChart.setOption(
|
||||
getFolderLineDataSet({
|
||||
dateTime: value as string[],
|
||||
...chartColors.value,
|
||||
}),
|
||||
);
|
||||
};
|
||||
|
||||
const initChart = () => {
|
||||
|
@ -154,7 +160,7 @@ onUnmounted(() => {
|
|||
window.removeEventListener('resize', updateContainer);
|
||||
});
|
||||
|
||||
const getIcon = (type) => {
|
||||
const getIcon = (type: string) => {
|
||||
switch (type) {
|
||||
case 'a':
|
||||
return ProductAIcon;
|
||||
|
|
|
@ -40,7 +40,7 @@ export function mapModuleRouterList(modules: Record<string, unknown>): Array<Rou
|
|||
}
|
||||
|
||||
export const getRoutesExpanded = () => {
|
||||
const expandedRoutes = [];
|
||||
const expandedRoutes: Array<string> = [];
|
||||
|
||||
fixedRouterList.forEach((item) => {
|
||||
if (item.meta && item.meta.expanded) {
|
||||
|
|
|
@ -8,10 +8,10 @@ import router, { allRoutes } from '@/router';
|
|||
import { store } from '@/store';
|
||||
|
||||
function filterPermissionsRouters(routes: Array<RouteRecordRaw>, roles: Array<unknown>) {
|
||||
const res = [];
|
||||
const removeRoutes = [];
|
||||
const res: Array<RouteRecordRaw> = [];
|
||||
const removeRoutes: Array<RouteRecordRaw> = [];
|
||||
routes.forEach((route) => {
|
||||
const children = [];
|
||||
const children: Array<RouteRecordRaw> = [];
|
||||
route.children?.forEach((childRouter) => {
|
||||
const roleCode = childRouter.meta?.roleCode || childRouter.name;
|
||||
if (roles.indexOf(roleCode) !== -1) {
|
||||
|
@ -38,7 +38,7 @@ export const usePermissionStore = defineStore('permission', {
|
|||
async initRoutes(roles: Array<unknown>) {
|
||||
let accessedRouters = [];
|
||||
|
||||
let removeRoutes = [];
|
||||
let removeRoutes: Array<RouteRecordRaw> = [];
|
||||
// special token
|
||||
if (roles.includes('all')) {
|
||||
accessedRouters = allRoutes;
|
||||
|
|
|
@ -15,6 +15,7 @@ const state = {
|
|||
};
|
||||
|
||||
export type TState = typeof state;
|
||||
export type TStateKey = keyof typeof state;
|
||||
|
||||
export const useSettingStore = defineStore('setting', {
|
||||
state: () => state,
|
||||
|
@ -72,8 +73,8 @@ export const useSettingStore = defineStore('setting', {
|
|||
},
|
||||
updateConfig(payload: Partial<TState>) {
|
||||
for (const key in payload) {
|
||||
if (payload[key] !== undefined) {
|
||||
this[key] = payload[key];
|
||||
if (payload[key as TStateKey] !== undefined) {
|
||||
this[key] = payload[key as TStateKey];
|
||||
}
|
||||
if (key === 'mode') {
|
||||
this.changeMode(payload[key]);
|
||||
|
|
|
@ -50,7 +50,7 @@ export const useTabsRouterStore = defineStore('tabsRouter', {
|
|||
// 处理关闭右侧
|
||||
subtractTabRouterBehind(newRoute: TRouterInfo) {
|
||||
const { routeIdx } = newRoute;
|
||||
const homeIdx: number = this.tabRouters.findIndex((route) => route.isHome);
|
||||
const homeIdx: number = this.tabRouters.findIndex((route: TRouterInfo) => route.isHome);
|
||||
let tabRouterList: Array<TRouterInfo> = this.tabRouterList.slice(0, routeIdx + 1);
|
||||
if (routeIdx < homeIdx) {
|
||||
tabRouterList = tabRouterList.concat(homeRoute);
|
||||
|
@ -60,7 +60,7 @@ export const useTabsRouterStore = defineStore('tabsRouter', {
|
|||
// 处理关闭左侧
|
||||
subtractTabRouterAhead(newRoute: TRouterInfo) {
|
||||
const { routeIdx } = newRoute;
|
||||
const homeIdx: number = this.tabRouters.findIndex((route) => route.isHome);
|
||||
const homeIdx: number = this.tabRouters.findIndex((route: TRouterInfo) => route.isHome);
|
||||
let tabRouterList: Array<TRouterInfo> = this.tabRouterList.slice(routeIdx);
|
||||
if (routeIdx > homeIdx) {
|
||||
tabRouterList = homeRoute.concat(tabRouterList);
|
||||
|
@ -70,7 +70,7 @@ export const useTabsRouterStore = defineStore('tabsRouter', {
|
|||
// 处理关闭其他
|
||||
subtractTabRouterOther(newRoute: TRouterInfo) {
|
||||
const { routeIdx } = newRoute;
|
||||
const homeIdx: number = this.tabRouters.findIndex((route) => route.isHome);
|
||||
const homeIdx: number = this.tabRouters.findIndex((route: TRouterInfo) => route.isHome);
|
||||
this.tabRouterList = routeIdx === homeIdx ? homeRoute : homeRoute.concat([this.tabRouterList?.[routeIdx]]);
|
||||
},
|
||||
removeTabRouterList() {
|
||||
|
|
|
@ -2,8 +2,9 @@ import { defineStore } from 'pinia';
|
|||
|
||||
import { TOKEN_NAME } from '@/config/global';
|
||||
import { store, usePermissionStore } from '@/store';
|
||||
import type { UserInfo } from '@/types/interface';
|
||||
|
||||
const InitUserInfo = {
|
||||
const InitUserInfo: UserInfo = {
|
||||
name: '', // 用户名,用于展示在页面右上角头像处
|
||||
roles: [], // 前端权限模型使用 如果使用请配置modules/permission-fe.ts使用
|
||||
};
|
||||
|
|
12
src/types/interface.d.ts
vendored
12
src/types/interface.d.ts
vendored
|
@ -1,3 +1,4 @@
|
|||
import type { TabValue } from 'tdesign-vue-next';
|
||||
import { LocationQueryRaw, RouteRecordName } from 'vue-router';
|
||||
|
||||
import STYLE_CONFIG from '@/config/style';
|
||||
|
@ -26,6 +27,11 @@ export type CommonObjType = {
|
|||
[key: string]: string | number;
|
||||
};
|
||||
|
||||
export interface UserInfo {
|
||||
name: string;
|
||||
roles: string[];
|
||||
}
|
||||
|
||||
export interface NotificationItem {
|
||||
id: string;
|
||||
content: string;
|
||||
|
@ -51,3 +57,9 @@ export interface TTabRouterType {
|
|||
isRefreshing: boolean;
|
||||
tabRouterList: Array<TRouterInfo>;
|
||||
}
|
||||
|
||||
export interface TTabRemoveOptions {
|
||||
value: TabValue;
|
||||
index: number;
|
||||
e: MouseEvent;
|
||||
}
|
||||
|
|
|
@ -44,7 +44,7 @@ export function formatRequestDate(params: Recordable) {
|
|||
}
|
||||
|
||||
// 将对象转为Url参数
|
||||
export function setObjToUrlParams(baseUrl: string, obj: object): string {
|
||||
export function setObjToUrlParams(baseUrl: string, obj: { [index: string]: any }): string {
|
||||
let parameters = '';
|
||||
for (const key in obj) {
|
||||
parameters += `${key}=${encodeURIComponent(obj[key])}&`;
|
||||
|
|
|
@ -15,7 +15,8 @@
|
|||
"baseUrl": "./",
|
||||
"paths": {
|
||||
"@/*": ["src/*"]
|
||||
}
|
||||
},
|
||||
"noImplicitAny": true
|
||||
},
|
||||
"include": [
|
||||
"**/*.ts",
|
||||
|
|
Loading…
Reference in New Issue
Block a user