fix: 解决类型检测报错

This commit is contained in:
kailong321200875 2023-07-26 15:15:13 +08:00
parent 82245ee6d0
commit 28bf8bee45
5 changed files with 259 additions and 259 deletions

View File

@ -620,6 +620,7 @@ export interface FormSchema {
| InputPasswordComponentProps | InputPasswordComponentProps
| TreeSelectComponentProps | TreeSelectComponentProps
| UploadComponentProps | UploadComponentProps
| any
/** /**
* formItem组件属性element-plus文档 * formItem组件属性element-plus文档

View File

@ -3,7 +3,7 @@ import { PropType } from 'vue'
import { Highlight } from '@/components/Highlight' import { Highlight } from '@/components/Highlight'
import { useDesign } from '@/hooks/web/useDesign' import { useDesign } from '@/hooks/web/useDesign'
import { propTypes } from '@/utils/propTypes' import { propTypes } from '@/utils/propTypes'
import { TipSchema } from '@/types/infoTip' import { InfoTipSchema } from './types'
const { getPrefixCls } = useDesign() const { getPrefixCls } = useDesign()
@ -12,7 +12,7 @@ const prefixCls = getPrefixCls('infotip')
defineProps({ defineProps({
title: propTypes.string.def(''), title: propTypes.string.def(''),
schema: { schema: {
type: Array as PropType<Array<string | TipSchema>>, type: Array as PropType<Array<string | InfoTipSchema>>,
required: true, required: true,
default: () => [] default: () => []
}, },

View File

@ -1,84 +1,85 @@
<script setup lang="ts"> <script setup lang="ts">
import { ContentWrap } from '@/components/ContentWrap' // import { ContentWrap } from '@/components/ContentWrap'
import { useI18n } from '@/hooks/web/useI18n' // import { useI18n } from '@/hooks/web/useI18n'
import { Table } from '@/components/Table' // import { Table } from '@/components/Table'
import { getUserListApi } from '@/api/login' // import { getUserListApi } from '@/api/login'
import { UserType } from '@/api/login/types' // import { UserType } from '@/api/login/types'
import { ref, h } from 'vue' // import { ref, h } from 'vue'
import { ElButton } from 'element-plus' // import { ElButton } from 'element-plus'
import { TableColumn, TableSlotDefault } from '@/types/table' // import { TableColumn, TableSlotDefault } from '@/types/table'
interface Params { // interface Params {
pageIndex?: number // pageIndex?: number
pageSize?: number // pageSize?: number
} // }
const { t } = useI18n() // const { t } = useI18n()
const columns: TableColumn[] = [ // const columns: TableColumn[] = [
{ // {
field: 'index', // field: 'index',
label: t('userDemo.index'), // label: t('userDemo.index'),
type: 'index' // type: 'index'
}, // },
{ // {
field: 'username', // field: 'username',
label: t('userDemo.username') // label: t('userDemo.username')
}, // },
{ // {
field: 'password', // field: 'password',
label: t('userDemo.password') // label: t('userDemo.password')
}, // },
{ // {
field: 'role', // field: 'role',
label: t('userDemo.role') // label: t('userDemo.role')
}, // },
{ // {
field: 'remark', // field: 'remark',
label: t('userDemo.remark'), // label: t('userDemo.remark'),
formatter: (row: UserType) => { // formatter: (row: UserType) => {
return h( // return h(
'span', // 'span',
row.username === 'admin' ? t('userDemo.remarkMessage1') : t('userDemo.remarkMessage2') // row.username === 'admin' ? t('userDemo.remarkMessage1') : t('userDemo.remarkMessage2')
) // )
} // }
}, // },
{ // {
field: 'action', // field: 'action',
label: t('userDemo.action') // label: t('userDemo.action')
} // }
] // ]
const loading = ref(true) // const loading = ref(true)
let tableDataList = ref<UserType[]>([]) // let tableDataList = ref<UserType[]>([])
const getTableList = async (params?: Params) => { // const getTableList = async (params?: Params) => {
const res = await getUserListApi({ // const res = await getUserListApi({
params: params || { // params: params || {
pageIndex: 1, // pageIndex: 1,
pageSize: 10 // pageSize: 10
} // }
}) // })
// .catch(() => {}) // // .catch(() => {})
// .finally(() => { // // .finally(() => {
// loading.value = false // // loading.value = false
// }) // // })
if (res) { // if (res) {
tableDataList.value = res.data.list // tableDataList.value = res.data.list
loading.value = false // loading.value = false
} // }
} // }
getTableList() // getTableList()
const actionFn = (data: TableSlotDefault) => { // const actionFn = (data: TableSlotDefault) => {
console.log(data) // console.log(data)
} // }
</script> </script>
<template> <template>
<ContentWrap :title="t('userDemo.title')" :message="t('userDemo.message')"> <div>role</div>
<!-- <ContentWrap :title="t('userDemo.title')" :message="t('userDemo.message')">
<Table :columns="columns" :data="tableDataList" :loading="loading" :selection="false"> <Table :columns="columns" :data="tableDataList" :loading="loading" :selection="false">
<template #action="data"> <template #action="data">
<ElButton type="primary" @click="actionFn(data as TableSlotDefault)"> <ElButton type="primary" @click="actionFn(data as TableSlotDefault)">
@ -86,5 +87,5 @@ const actionFn = (data: TableSlotDefault) => {
</ElButton> </ElButton>
</template> </template>
</Table> </Table>
</ContentWrap> </ContentWrap> -->
</template> </template>

View File

@ -7,7 +7,7 @@ import { reactive, unref } from 'vue'
import { ElTag, ElButton } from 'element-plus' import { ElTag, ElButton } from 'element-plus'
import { useTable } from '@/hooks/web/useTable' import { useTable } from '@/hooks/web/useTable'
const { tableRegister, tableState, tableMethods } = useTable({ const { tableRegister, tableState } = useTable({
fetchDataApi: async () => { fetchDataApi: async () => {
const { currentPage, pageSize } = tableState const { currentPage, pageSize } = tableState
const res = await getTreeTableListApi({ const res = await getTreeTableListApi({
@ -21,7 +21,6 @@ const { tableRegister, tableState, tableMethods } = useTable({
} }
}) })
const { loading, dataList, total, currentPage, pageSize } = tableState const { loading, dataList, total, currentPage, pageSize } = tableState
const { sortableChange } = tableMethods
const { t } = useI18n() const { t } = useI18n()
@ -106,7 +105,6 @@ const actionFn = (data: TableSlotDefault) => {
total: total total: total
}" }"
@register="tableRegister" @register="tableRegister"
@sortable-change="sortableChange"
/> />
</ContentWrap> </ContentWrap>
</template> </template>

View File

@ -1,200 +1,200 @@
<script setup lang="ts"> <script setup lang="ts">
import { ContentWrap } from '@/components/ContentWrap' // import { ContentWrap } from '@/components/ContentWrap'
import { Search } from '@/components/Search' // import { Search } from '@/components/Search'
import { useI18n } from '@/hooks/web/useI18n' // import { useI18n } from '@/hooks/web/useI18n'
import { ElButton, ElTag } from 'element-plus' // import { ElButton, ElTag } from 'element-plus'
import { Table } from '@/components/Table' // import { Table } from '@/components/Table'
import { getTableListApi, delTableListApi } from '@/api/table' // import { getTableListApi, delTableListApi } from '@/api/table'
import { useTable } from '@/hooks/web/useTable' // import { useTable } from '@/hooks/web/useTable'
import { TableData } from '@/api/table/types' // import { TableData } from '@/api/table/types'
import { h, ref, reactive } from 'vue' // import { h, ref, reactive } from 'vue'
import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas' // import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
import { useDictStore } from '@/store/modules/dict' // import { useDictStore } from '@/store/modules/dict'
import { getDictOneApi } from '@/api/common' // import { getDictOneApi } from '@/api/common'
import { TableColumn } from '@/types/table' // import { TableColumn } from '@/types/table'
const dictStore = useDictStore() // const dictStore = useDictStore()
const { register, tableObject, methods } = useTable<TableData>({ // const { register, tableObject, methods } = useTable<TableData>({
getListApi: getTableListApi, // getListApi: getTableListApi,
delListApi: delTableListApi, // delListApi: delTableListApi,
response: { // response: {
list: 'list', // list: 'list',
total: 'total' // total: 'total'
} // }
}) // })
const { getList, setSearchParams } = methods // const { getList, setSearchParams } = methods
getList() // getList()
const { t } = useI18n() // const { t } = useI18n()
const crudSchemas = reactive<CrudSchema[]>([ // const crudSchemas = reactive<CrudSchema[]>([
{ // {
field: 'index', // field: 'index',
label: t('tableDemo.index'), // label: t('tableDemo.index'),
type: 'index', // type: 'index',
form: { // form: {
show: false // show: false
}, // },
detail: { // detail: {
show: false // show: false
} // }
}, // },
{ // {
field: 'title', // field: 'title',
label: t('tableDemo.title'), // label: t('tableDemo.title'),
search: { // search: {
show: true // show: true
}, // },
form: { // form: {
colProps: { // colProps: {
span: 24 // span: 24
} // }
}, // },
detail: { // detail: {
span: 24 // span: 24
} // }
}, // },
{ // {
field: 'author', // field: 'author',
label: t('tableDemo.author') // label: t('tableDemo.author')
}, // },
{ // {
field: 'display_time', // field: 'display_time',
label: t('tableDemo.displayTime'), // label: t('tableDemo.displayTime'),
form: { // form: {
component: 'DatePicker', // component: 'DatePicker',
componentProps: { // componentProps: {
type: 'datetime', // type: 'datetime',
valueFormat: 'YYYY-MM-DD HH:mm:ss' // valueFormat: 'YYYY-MM-DD HH:mm:ss'
} // }
} // }
}, // },
{ // {
field: 'importance', // field: 'importance',
label: t('tableDemo.importance'), // label: t('tableDemo.importance'),
formatter: (_: Recordable, __: TableColumn, cellValue: number) => { // formatter: (_: Recordable, __: TableColumn, cellValue: number) => {
return h( // return h(
ElTag, // ElTag,
{ // {
type: cellValue === 1 ? 'success' : cellValue === 2 ? 'warning' : 'danger' // type: cellValue === 1 ? 'success' : cellValue === 2 ? 'warning' : 'danger'
}, // },
() => // () =>
cellValue === 1 // cellValue === 1
? t('tableDemo.important') // ? t('tableDemo.important')
: cellValue === 2 // : cellValue === 2
? t('tableDemo.good') // ? t('tableDemo.good')
: t('tableDemo.commonly') // : t('tableDemo.commonly')
) // )
}, // },
search: { // search: {
show: true, // show: true,
component: 'Select', // component: 'Select',
componentProps: { // componentProps: {
options: dictStore.getDictObj.importance // options: dictStore.getDictObj.importance
} // }
}, // },
form: { // form: {
component: 'Select', // component: 'Select',
componentProps: { // componentProps: {
options: [ // options: [
{ // {
label: '重要', // label: '',
value: 3 // value: 3
}, // },
{ // {
label: '良好', // label: '',
value: 2 // value: 2
}, // },
{ // {
label: '一般', // label: '',
value: 1 // value: 1
} // }
] // ]
} // }
} // }
}, // },
{ // {
field: 'importance2', // field: 'importance2',
label: `${t('tableDemo.importance')}2`, // label: `${t('tableDemo.importance')}2`,
search: { // search: {
show: true, // show: true,
component: 'Select', // component: 'Select',
dictName: 'importance' // dictName: 'importance'
} // }
}, // },
{ // {
field: 'importance3', // field: 'importance3',
label: `${t('tableDemo.importance')}3`, // label: `${t('tableDemo.importance')}3`,
search: { // search: {
show: true, // show: true,
component: 'Select', // component: 'Select',
api: async () => { // api: async () => {
const res = await getDictOneApi() // const res = await getDictOneApi()
return res.data // return res.data
} // }
} // }
}, // },
{ // {
field: 'pageviews', // field: 'pageviews',
label: t('tableDemo.pageviews'), // label: t('tableDemo.pageviews'),
form: { // form: {
component: 'InputNumber', // component: 'InputNumber',
value: 0 // value: 0
} // }
}, // },
{ // {
field: 'content', // field: 'content',
label: t('exampleDemo.content'), // label: t('exampleDemo.content'),
table: { // table: {
show: false // show: false
}, // },
form: { // form: {
component: 'Editor', // component: 'Editor',
colProps: { // colProps: {
span: 24 // span: 24
} // }
}, // },
detail: { // detail: {
span: 24 // span: 24
} // }
}, // },
{ // {
field: 'action', // field: 'action',
width: '260px', // width: '260px',
label: t('tableDemo.action'), // label: t('tableDemo.action'),
form: { // form: {
show: false // show: false
}, // },
detail: { // detail: {
show: false // show: false
} // }
} // }
]) // ])
const { allSchemas } = useCrudSchemas(crudSchemas) // const { allSchemas } = useCrudSchemas(crudSchemas)
const delLoading = ref(false) // const delLoading = ref(false)
const delData = async (row: TableData | null, multiple: boolean) => { // const delData = async (row: TableData | null, multiple: boolean) => {
tableObject.currentRow = row // tableObject.currentRow = row
const { delList, getSelections } = methods // const { delList, getSelections } = methods
const selections = await getSelections() // const selections = await getSelections()
delLoading.value = true // delLoading.value = true
await delList( // await delList(
multiple ? selections.map((v) => v.id) : [tableObject.currentRow?.id as string], // multiple ? selections.map((v) => v.id) : [tableObject.currentRow?.id as string],
multiple // multiple
).finally(() => { // ).finally(() => {
delLoading.value = false // delLoading.value = false
}) // })
} // }
</script> </script>
<template> <template>
<ContentWrap> <ContentWrap>
<Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" /> <!-- <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
<div class="mb-10px"> <div class="mb-10px">
<ElButton :loading="delLoading" type="danger" @click="delData(null, true)"> <ElButton :loading="delLoading" type="danger" @click="delData(null, true)">
@ -218,6 +218,6 @@ const delData = async (row: TableData | null, multiple: boolean) => {
{{ t('exampleDemo.del') }} {{ t('exampleDemo.del') }}
</ElButton> </ElButton>
</template> </template>
</Table> </Table> -->
</ContentWrap> </ContentWrap>
</template> </template>