liukai
/
admin-web-template
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

refactor: 重构产品数据获取方式

main
刘凯 1 year ago
parent
0a3a2b152c
commit
3de811e9d9
5 changed files with 167 additions and 169 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 222
      src/views/monitor-ops/log/data.ts
  2. 6
      src/views/monitor-ops/log/index.vue
  3. 4
      src/views/subscription/list/SubscriptionFormModal.vue
  4. 98
      src/views/subscription/list/data.ts
  5. 6
      src/views/subscription/list/index.vue

222
src/views/monitor-ops/log/data.ts
Unescape View File

@ -2,130 +2,126 @@ import { h } from 'vue'
import { Tag } from 'ant-design-vue'
import dayjs from 'dayjs'
import type { BasicColumn, FormSchema } from '@/components/Table'
import { getAllProducts } from '@/api/product'
import type { Product } from '@/api/product/types'
import { useSystemEnumStoreWithOut } from '@/store/modules/systemEnum'
import { useSystemEnumStore } from '@/store/modules/systemEnum'
import { useSharedProducts } from '@/views/subscription/list/data'
let productsCache: Pick<Product, 'id' | 'productName'>[] = []
async function getCachedProducts() {
if (productsCache.length)
return productsCache
export function useColumns(): BasicColumn[] {
const { products } = useSharedProducts()
const { getSystemEnumLabel } = useSystemEnumStore()
try {
return productsCache = await getAllProducts()
}
catch {
return []
}
}
const { getSystemEnumLabel, getSystemEnums } = useSystemEnumStoreWithOut()
export const columns: BasicColumn[] = [
{
title: '所属产品',
dataIndex: 'productId',
customRender({ value }) {
return productsCache.find(item => item.id === value)?.productName
return [
{
title: '所属产品',
dataIndex: 'productId',
customRender({ value }) {
return products.value.find(item => item.id === value)?.productName
},
},
},
{
title: '设备序列号',
dataIndex: 'deviceSn',
},
{
title: 'TraceID',
dataIndex: 'traceId',
},
{
title: '消息内容',
dataIndex: 'messageId',
width: 120,
},
{
title: '业务类型',
dataIndex: 'bizType',
width: 150,
customRender({ value }) {
return h(Tag, () => getSystemEnumLabel('eDeviceLogBizType', value))
{
title: '设备序列号',
dataIndex: 'deviceSn',
},
},
{
title: '操作',
dataIndex: 'operation',
},
{
title: '时间',
dataIndex: 'createTime',
},
{
title: '状态',
dataIndex: 'code',
width: 120,
customRender({ value }) {
return h('b', {
style: {
color: value === 200 ? '#16a34a' : '#dc2626',
},
}, value)
{
title: 'TraceID',
dataIndex: 'traceId',
},
},
]
export const searchFormSchema: FormSchema[] = [
{
field: 'productId',
label: '所属产品',
component: 'ApiSelect',
componentProps: {
api: getCachedProducts,
valueField: 'id',
labelField: 'productName',
showSearch: true,
{
title: '消息内容',
dataIndex: 'messageId',
width: 120,
},
colProps: {
span: 6,
{
title: '业务类型',
dataIndex: 'bizType',
width: 150,
customRender({ value }) {
return h(Tag, () => getSystemEnumLabel('eDeviceLogBizType', value))
},
},
},
{
field: 'deviceSn',
label: '设备序列号',
component: 'Input',
colProps: {
span: 6,
{
title: '操作',
dataIndex: 'operation',
},
},
{
field: 'traceId',
label: 'TraceId',
component: 'Input',
colProps: {
span: 6,
{
title: '时间',
dataIndex: 'createTime',
},
},
{
field: 'bizType',
label: '业务类型',
component: 'Select',
componentProps: {
options: getSystemEnums('eDeviceLogBizType'),
{
title: '状态',
dataIndex: 'code',
width: 120,
customRender({ value }) {
return h('b', {
style: {
color: value === 200 ? '#16a34a' : '#dc2626',
},
}, value)
},
},
colProps: {
span: 6,
]
}
export function useSearchFormSchema(): FormSchema[] {
const { products } = useSharedProducts()
const { getSystemEnums } = useSystemEnumStore()
return [
{
field: 'productId',
label: '所属产品',
component: 'Select',
componentProps: {
options: products as any,
showSearch: true,
fieldNames: {
label: 'productName',
value: 'id',
},
},
colProps: {
span: 6,
},
},
{
field: 'deviceSn',
label: '设备序列号',
component: 'Input',
colProps: {
span: 6,
},
},
},
{
field: 'time',
label: '日志时间',
component: 'RangePicker',
componentProps: {
showTime: true,
disabledDate(current) {
return current && current > dayjs().endOf('day')
{
field: 'traceId',
label: 'TraceId',
component: 'Input',
colProps: {
span: 6,
},
},
colProps: {
span: 6,
{
field: 'bizType',
label: '业务类型',
component: 'Select',
componentProps: {
options: getSystemEnums('eDeviceLogBizType'),
},
colProps: {
span: 6,
},
},
},
]
{
field: 'time',
label: '日志时间',
component: 'RangePicker',
componentProps: {
showTime: true,
disabledDate(current) {
return current && current > dayjs().endOf('day')
},
},
colProps: {
span: 6,
},
},
]
}

6
src/views/monitor-ops/log/index.vue
Unescape View File

@ -1,5 +1,5 @@
<script lang="ts" setup>
import { columns, searchFormSchema } from './data'
import { useColumns, useSearchFormSchema } from './data'
import MessageContentModal from './MessageContentModal.vue'
import { getLogList } from '@/api/monitor-ops/log'
import { BasicTable, useTable } from '@/components/Table'
@ -16,10 +16,10 @@ const [register] = useTable({
queryEndTime: params.time && params.time[1],
})
},
columns,
columns: useColumns(),
formConfig: {
labelWidth: 90,
schemas: searchFormSchema,
schemas: useSearchFormSchema(),
},
bordered: true,
canResize: false,

4
src/views/subscription/list/SubscriptionFormModal.vue
Unescape View File

@ -1,6 +1,6 @@
<script lang="ts" setup>
import { ref } from 'vue'
import { getFormSchema } from './data'
import { useFormSchema } from './data'
import { useMessage } from '@/hooks/web/useMessage'
import { BasicForm, useForm } from '@/components/Form'
import { BasicModal, useModalInner } from '@/components/Modal'
@ -15,7 +15,7 @@ const isUpdate = ref(false)
const [registerForm, { setFieldsValue, validate }] = useForm({
labelWidth: 100,
baseColProps: { span: 24 },
schemas: getFormSchema(isUpdate),
schemas: useFormSchema(isUpdate),
showActionButtonGroup: false,
actionColOptions: { span: 23 },
})

98
src/views/subscription/list/data.ts
Unescape View File

@ -1,63 +1,60 @@
import type { Ref } from 'vue'
import { h } from 'vue'
import type { Ref } from 'vue'
import { Space, Tag } from 'ant-design-vue'
import { createSharedComposable, useAsyncState } from '@vueuse/core'
import type { BasicColumn, FormSchema } from '@/components/Table'
import { useSystemEnumStore } from '@/store/modules/systemEnum'
import { getAllProducts } from '@/api/product'
import type { Product } from '@/api/product/types'
const { getSystemEnums } = useSystemEnumStore()
let productsCache: Pick<Product, 'id' | 'productName'>[] = []
async function getCachedProducts() {
if (productsCache.length)
return productsCache
export const useSharedProducts = createSharedComposable(() => {
const { state } = useAsyncState(getAllProducts, [])
return { products: state }
})
try {
return productsCache = await getAllProducts()
}
catch {
return []
}
}
export function useColumns(): BasicColumn[] {
const { getSystemEnums } = useSystemEnumStore()
const { products } = useSharedProducts()
export const columns: BasicColumn[] = [
{
title: '产品名称',
dataIndex: 'productId',
customRender({ value }) {
return productsCache.find(item => item.id === value)?.productName
return [
{
title: '产品名称',
dataIndex: 'productId',
customRender({ value }) {
return products.value.find(item => item.id === value)?.productName
},
},
},
{
title: '推送消息类型',
dataIndex: 'messageType',
customRender({ value }) {
const values = value.split(',')
const types = getSystemEnums('eSubscribeMessageType')
return h(
Space,
() => types
.map(item => values.includes(item.value.toString()) ? item.label : null)
.filter(Boolean)
.map(name => h(Tag, () => name)),
)
{
title: '推送消息类型',
dataIndex: 'messageType',
customRender({ value }) {
const values = value.split(',')
const types = getSystemEnums('eSubscribeMessageType')
return h(
Space,
() => types
.map(item => values.includes(item.value.toString()) ? item.label : null)
.filter(Boolean)
.map(name => h(Tag, () => name)),
)
},
},
{
title: '创建时间',
dataIndex: 'createTime',
},
},
{
title: '创建时间',
dataIndex: 'createTime',
},
]
]
}
export function useSearchFormSchema(productId?: string): FormSchema[] {
const { products } = useSharedProducts()
export function getSearchFormSchema(productId?: string): FormSchema[] {
return [
{
field: 'productId',
label: '产品名称',
component: 'ApiSelect',
component: 'Select',
componentProps: {
api: getCachedProducts,
options: products as any,
showSearch: true,
fieldNames: {
label: 'productName',
@ -72,7 +69,10 @@ export function getSearchFormSchema(productId?: string): FormSchema[] {
]
}
export function getFormSchema(isUpload: Ref<boolean>): FormSchema[] {
export function useFormSchema(isUpload: Ref<boolean>): FormSchema[] {
const { products } = useSharedProducts()
const { getSystemEnums } = useSystemEnumStore()
return [
{
field: 'productId',
@ -81,10 +81,12 @@ export function getFormSchema(isUpload: Ref<boolean>): FormSchema[] {
required: true,
component: 'ApiSelect',
componentProps: {
api: getCachedProducts,
valueField: 'id',
labelField: 'productName',
options: products as any,
showSearch: true,
fieldNames: {
label: 'productName',
value: 'id',
},
},
dynamicDisabled: () => isUpload.value,
},

6
src/views/subscription/list/index.vue
Unescape View File

@ -1,6 +1,6 @@
<script lang="ts" setup>
import { PlusOutlined } from '@ant-design/icons-vue'
import { columns, getSearchFormSchema } from './data'
import { useColumns, useSearchFormSchema } from './data'
import SubscriptionFormModal from './SubscriptionFormModal.vue'
import { BasicTable, TableAction, useTable } from '@/components/Table'
import { deleteSubscription, getSubscriptionList } from '@/api/subscription/list'
@ -17,10 +17,10 @@ const { hasPermission } = usePermission()
const [register, { reload }] = useTable({
api: getSubscriptionList,
columns,
columns: useColumns(),
formConfig: {
labelWidth: 80,
schemas: getSearchFormSchema(history.state.productId),
schemas: useSearchFormSchema(history.state.productId),
},
bordered: true,
canResize: false,

Write Preview
Loading…
Cancel
Save