feat: views

pull/1/MERGE
xingyu 2023-03-21 22:47:30 +08:00
parent 6a2eebe486
commit 4e341517d9
17 changed files with 174 additions and 39 deletions

View File

@ -15,9 +15,7 @@
</template> </template>
<Dropdown :trigger="['hover']" :dropMenuList="getDropdownList" popconfirm v-if="dropDownActions && getDropdownList.length > 0"> <Dropdown :trigger="['hover']" :dropMenuList="getDropdownList" popconfirm v-if="dropDownActions && getDropdownList.length > 0">
<slot name="more"></slot> <slot name="more"></slot>
<a-button type="link" size="small" v-if="!$slots.more"> <a-button type="link" v-if="!$slots.more"> <MoreOutlined class="icon-more" /> </a-button>
<MoreOutlined class="icon-more" />
</a-button>
</Dropdown> </Dropdown>
</div> </div>
</template> </template>

View File

@ -36,6 +36,7 @@ export function useTableForm(
if (handleSearchInfoFn && isFunction(handleSearchInfoFn)) { if (handleSearchInfoFn && isFunction(handleSearchInfoFn)) {
info = handleSearchInfoFn(info) || info info = handleSearchInfoFn(info) || info
} }
console.info(info)
fetch({ searchInfo: info, page: 1 }) fetch({ searchInfo: info, page: 1 })
} }

View File

@ -6,7 +6,7 @@
</BasicTitle> </BasicTitle>
<div class="flex items-center flex-1 cursor-pointer justify-self-stretch" v-if="search || toolbar"> <div class="flex items-center flex-1 cursor-pointer justify-self-stretch" v-if="search || toolbar">
<div :class="getInputSearchCls" v-if="search"> <div :class="getInputSearchCls" v-if="search">
<InputSearch :placeholder="t('common.searchText')" size="small" allowClear v-model:value="searchValue" /> <InputSearch :placeholder="t('common.searchText')" allowClear v-model:value="searchValue" />
</div> </div>
<Dropdown @click.prevent v-if="toolbar"> <Dropdown @click.prevent v-if="toolbar">
<Icon icon="ion:ellipsis-vertical" /> <Icon icon="ion:ellipsis-vertical" />

View File

@ -1,7 +1,7 @@
<template> <template>
<div :class="prefixCls"> <div :class="prefixCls">
<span> {{ title }}</span> <span> {{ title }}</span>
<InputNumber v-bind="$attrs" size="small" :class="`${prefixCls}-input-number`" @change="handleChange" /> <InputNumber v-bind="$attrs" :class="`${prefixCls}-input-number`" @change="handleChange" />
</div> </div>
</template> </template>
<script lang="ts" setup name="InputNumberItem"> <script lang="ts" setup name="InputNumberItem">

View File

@ -1,14 +1,7 @@
<template> <template>
<div :class="prefixCls"> <div :class="prefixCls">
<span> {{ title }}</span> <span> {{ title }}</span>
<Select <Select v-bind="getBindValue" :class="`${prefixCls}-select`" @change="handleChange as any" :disabled="disabled" :options="options" />
v-bind="getBindValue"
:class="`${prefixCls}-select`"
@change="handleChange as any"
:disabled="disabled"
size="small"
:options="options"
/>
</div> </div>
</template> </template>
<script lang="ts" setup name="SelectItem"> <script lang="ts" setup name="SelectItem">

View File

@ -2,7 +2,6 @@
<div :class="getWrapClass"> <div :class="getWrapClass">
<Tabs <Tabs
type="editable-card" type="editable-card"
size="small"
:animated="false" :animated="false"
:hideAdd="true" :hideAdd="true"
:tabBarGutter="3" :tabBarGutter="3"

View File

@ -124,8 +124,11 @@ export class VAxios {
}) })
requestList = [] requestList = []
// TODO // TODO
// res = await Promise.all([this.axiosInstance(config)])[0]
console.info('刷新令牌end', res) console.info('刷新令牌end', res)
return new Promise((resolve) => {
resolve(this.axiosInstance(config))
})
// res = await Promise.all([this.axiosInstance(config)])[0]
} catch (e) { } catch (e) {
console.info(e) console.info(e)
requestList.forEach((cb: any) => { requestList.forEach((cb: any) => {

View File

@ -56,7 +56,7 @@ const [registerTable, { getForm, reload }] = useTable({
showTableSetting: true, showTableSetting: true,
showIndexColumn: false, showIndexColumn: false,
actionColumn: { actionColumn: {
width: 120, width: 160,
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
fixed: 'right' fixed: 'right'

View File

@ -63,7 +63,7 @@ const [register, { expandAll, collapseAll, getForm, reload }] = useTable({
showIndexColumn: false, showIndexColumn: false,
canResize: false, canResize: false,
actionColumn: { actionColumn: {
width: 120, width: 160,
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
fixed: 'right' fixed: 'right'

View File

@ -53,7 +53,7 @@ const [registerTable, { reload }] = useTable({
showTableSetting: true, showTableSetting: true,
showIndexColumn: false, showIndexColumn: false,
actionColumn: { actionColumn: {
width: 120, width: 160,
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
fixed: 'right' fixed: 'right'

View File

@ -1,3 +1,43 @@
<template> <template>
<div>开发中</div> <div>
<BasicTable @register="registerTable">
<template #toolbar>
<a-button type="warning" @click="handleExport"> </a-button>
</template>
</BasicTable>
</div>
</template> </template>
<script lang="ts" setup name="OperateLog">
import { BasicTable, useTable } from '@/components/Table'
import { OperateLogPageReqVO, exportOperateLogApi, getOperateLogPageApi } from '@/api/system/operatelog'
import { columns, searchFormSchema } from './operateLog.data'
import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage'
const { t } = useI18n()
const { createConfirm, createMessage } = useMessage()
const [registerTable, { getForm }] = useTable({
title: '操作日志列表',
api: getOperateLogPageApi,
columns,
formConfig: {
labelWidth: 120,
schemas: searchFormSchema
},
useSearchForm: true,
showTableSetting: true,
showIndexColumn: false
})
async function handleExport() {
createConfirm({
title: '导出',
iconType: 'warning',
content: '是否要导出数据?',
async onOk() {
await exportOperateLogApi(getForm().getFieldsValue() as OperateLogPageReqVO)
createMessage.success(t('common.exportSuccessText'))
}
})
}
</script>

View File

@ -0,0 +1,106 @@
import { getIntDictOptions } from './../../../utils/dict'
import { BasicColumn, FormSchema, useRender } from '@/components/Table'
import { DICT_TYPE } from '@/utils/dict'
import { h } from 'vue'
export const columns: BasicColumn[] = [
{
title: '日志编号',
dataIndex: 'id',
width: 100
},
{
title: '操作模块',
dataIndex: 'module',
width: 120
},
{
title: '操作名',
dataIndex: 'name',
width: 180
},
{
title: '操作类型',
dataIndex: 'type',
width: 180,
customRender: ({ text }) => {
return useRender.renderDict(text, DICT_TYPE.SYSTEM_OPERATE_TYPE)
}
},
{
title: '操作人',
dataIndex: 'userNickname',
width: 120
},
{
title: 'userAgent',
dataIndex: 'userAgent',
width: 400
},
{
title: '操作结果',
dataIndex: 'resultCode',
width: 180,
customRender: ({ text }) => {
return h('span', text === 0 ? '成功' : '失败')
}
},
{
title: '操作日期',
dataIndex: 'startTime',
width: 180,
customRender: ({ text }) => {
return useRender.renderDate(text)
}
},
{
title: '执行时长',
dataIndex: 'duration',
width: 180,
customRender: ({ text }) => {
return h('span', text + 'ms')
}
}
]
export const searchFormSchema: FormSchema[] = [
{
label: '系统模块',
field: 'title',
component: 'Input',
colProps: { span: 8 }
},
{
label: '操作人员',
field: 'operName',
component: 'Input',
colProps: { span: 8 }
},
{
label: '类型',
field: 'type',
component: 'Select',
componentProps: {
options: getIntDictOptions(DICT_TYPE.SYSTEM_OPERATE_TYPE)
},
colProps: { span: 8 }
},
{
label: '状态',
field: 'success',
component: 'Select',
componentProps: {
options: [
{ value: true, key: true, label: '成功' },
{ value: false, key: false, label: '失败' }
]
},
colProps: { span: 8 }
},
{
label: '操作时间',
field: 'startTime',
component: 'RangePicker',
colProps: { span: 8 }
}
]

View File

@ -56,7 +56,7 @@ const [registerTable, { getForm, reload }] = useTable({
showTableSetting: true, showTableSetting: true,
showIndexColumn: false, showIndexColumn: false,
actionColumn: { actionColumn: {
width: 120, width: 160,
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
fixed: 'right' fixed: 'right'

View File

@ -13,7 +13,9 @@
icon: 'clarity:note-edit-line', icon: 'clarity:note-edit-line',
label: '修改', label: '修改',
onClick: handleEdit.bind(null, record) onClick: handleEdit.bind(null, record)
}, }
]"
:dropDownActions="[
{ {
icon: 'clarity:note-edit-line', icon: 'clarity:note-edit-line',
label: '菜单权限', label: '菜单权限',
@ -66,7 +68,7 @@ const [registerTable, { getForm, reload }] = useTable({
showTableSetting: true, showTableSetting: true,
showIndexColumn: false, showIndexColumn: false,
actionColumn: { actionColumn: {
width: 240, width: 160,
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
fixed: 'right' fixed: 'right'

View File

@ -61,7 +61,7 @@ const [registerTable, { getForm, reload }] = useTable({
showTableSetting: true, showTableSetting: true,
showIndexColumn: false, showIndexColumn: false,
actionColumn: { actionColumn: {
width: 120, width: 160,
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
fixed: 'right' fixed: 'right'

View File

@ -30,7 +30,7 @@
</template> </template>
</template> </template>
</BasicTable> </BasicTable>
<UserModel @register="registerModal" @success="handleSuccess" /> <UserModel @register="registerModal" @success="reload()" />
</div> </div>
</template> </template>
<script lang="ts" setup name="User"> <script lang="ts" setup name="User">
@ -49,7 +49,7 @@ const { createConfirm, createMessage } = useMessage()
const [registerModal, { openModal }] = useModal() const [registerModal, { openModal }] = useModal()
const searchInfo = reactive<Recordable>({}) const searchInfo = reactive<Recordable>({})
const [registerTable, { getForm, reload, updateTableDataRecord }] = useTable({ const [registerTable, { getForm, reload }] = useTable({
title: '账号列表', title: '账号列表',
api: getUserPageApi, api: getUserPageApi,
columns, columns,
@ -62,7 +62,7 @@ const [registerTable, { getForm, reload, updateTableDataRecord }] = useTable({
showTableSetting: true, showTableSetting: true,
showIndexColumn: false, showIndexColumn: false,
actionColumn: { actionColumn: {
width: 120, width: 160,
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
fixed: 'right' fixed: 'right'
@ -100,17 +100,6 @@ async function handleDelete(record: Recordable) {
reload() reload()
} }
function handleSuccess({ isUpdate, values }) {
if (isUpdate) {
//
// updateTableDataRecordrowKeystringrecordkeys
const result = updateTableDataRecord(values.id, values)
console.log(result)
} else {
reload()
}
}
function handleSelect(deptId = '') { function handleSelect(deptId = '') {
searchInfo.deptId = deptId searchInfo.deptId = deptId
reload() reload()

View File

@ -73,6 +73,9 @@ export const searchFormSchema: FormSchema[] = [
label: '创建时间', label: '创建时间',
field: 'createTime', field: 'createTime',
component: 'RangePicker', component: 'RangePicker',
componentProps: {
format: 'YYYY-MM-DD HH:mm:ss'
},
colProps: { span: 8 } colProps: { span: 8 }
} }
] ]
@ -121,7 +124,7 @@ export const formSchema: FormSchema[] = [
label: '用户名称', label: '用户名称',
field: 'username', field: 'username',
component: 'Input', component: 'Input',
ifShow: ({ values }) => values.id === undefined dynamicDisabled: ({ values }) => values.id !== undefined
}, },
{ {
label: '用户密码', label: '用户密码',
@ -144,7 +147,8 @@ export const formSchema: FormSchema[] = [
componentProps: { componentProps: {
api: () => listSimplePostsApi(), api: () => listSimplePostsApi(),
labelField: 'name', labelField: 'name',
valueField: 'id' valueField: 'id',
mode: 'tags'
} }
}, },
{ {