@xmszm/core 0.0.1

package/src/table/test.md

@@ -0,0 +1,248 @@
+```vue
+<template>
+  <div class="page-box">
+    <n-space justify="space-between">
+      <CommonQuery :query="listQuery" :options="keyQuery" @submit="pageState.search()" @reset="pageState.reset()" />
+    </n-space>
+    <div style="margin-bottom: 15px; margin-top: 10px">
+      <n-space>
+        <n-button type="primary" @click="onAddOrEdit(null, 'add')">新增资讯</n-button>
+        <n-button type="primary" :disabled="checkedRowKeysRef.length === 0" @click="onSendBatch()"
+          >批量发布资讯</n-button
+        >
+      </n-space>
+    </div>
+    <div class="page-main">
+      <DataTable
+        ref="tableRef"
+        v-model:checked-row-keys="checkedRowKeysRef"
+        :loading="pageState.loading"
+        :data="pageState.list"
+        :pagination="pageState"
+        :columns="columns"
+        :opr-columns="oprColumns"
+        :select-columns="selectColumns"
+        :row-key="(row) => row.id"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="jsx">
+import { onMounted, ref } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
+import { useNaivePage } from '@/use/useNaivePage.jsx'
+import { useDeleteConfirm, useInfoConfirm } from '@/use/dialog.js'
+import { getList, save, add, remove, sendBatch } from '@/api/spreadPlatform/information.js'
+import { DataTable, commonDialogMethod, createActionColumnJsx } from 'core'
+
+const router = useRouter()
+const route = useRoute()
+
+// way:'select'的 options可以根据enum 通过 options = ObjectToArray(enum) 转换
+
+
+const keyQuery = [
+  {
+    label: '名称',
+    key: 'name',
+    queryType: 'likeQuery'
+  },
+  {
+    label: '类型',
+    key: 'type',
+    queryType: 'andQuery',
+    way: 'select',
+    options: [
+      { label: '类型1', value: 1 },
+      { label: '类型2', value: 2 }
+    ]
+  },
+  {
+    label: '状态',
+    key: 'status',
+    queryType: 'andQuery',
+    way: 'select',
+    options: [
+      { label: '启用', value: 1 },
+      { label: '禁用', value: 0 }
+    ]
+  }
+]
+onMounted(() => {
+  pageState.search()
+})
+const infoContent = ref('确认要批量发布吗？')
+function ReqGetList() {
+  pageState.showLoading()
+  getList(listQuery)
+    .then((res) => {
+      pageState.list = res.data.records
+      pageState.itemCount = res.data.total
+    })
+    .finally(() => {
+      pageState.hideLoading()
+    })
+}
+const checkedRowKeysRef = ref([])
+
+const columns = [
+  {
+    key: 'sort',
+    title: '排序',
+    render(row, index) {
+      return index + 1
+    }
+  },
+
+  {
+    key: 'name',
+    title: '资讯标题'
+  },
+  {
+    key: 'link',
+    title: '链接'
+  },
+  {
+    title: '来源平台',
+    key: 'source'
+  },
+  {
+    title: '发布',
+    key: 'sendStatus',
+    render: (row) => (row?.sendStatus ? '已发布' : '未发布')
+  },
+  {
+    title: '发布日期',
+    key: 'sendTime'
+  },
+  {
+    title: '显示',
+    key: 'status',
+    render: (row) => (
+      <NSwitch
+        v-model:value={row.status}
+        onUpdateValue={(v) => {
+          pageState.showLoading()
+          save({
+            id: row.id,
+            status: v
+          })
+            .then((res) => {
+              $message.success('操作成功')
+            })
+            .catch(() => {
+              row.status = !v
+            })
+            .finally(() => pageState.hideLoading())
+        }}
+      />
+    )
+  }
+]
+const oprColumns = createActionColumnJsx(
+  [
+    {
+      label: '编辑',
+      type: 'primary',
+
+      onClick: (row) => onAddOrEdit(row, 'edit'),
+      permission: []
+    },
+
+    {
+      label: '删除',
+      type: 'error',
+      mode: 'pop',
+      onClick: (row) =>
+        remove({ id: row.id }).then(() => {
+          $message.success('操作成功')
+          pageState.fetchData()
+        }),
+      permission: []
+    }
+  ],
+  {
+    width: 200
+  }
+)
+const selectColumns = {
+  type: 'selection'
+  width: 50
+}
+
+const { pageState, listQuery } = useNaivePage(ReqGetList)
+
+function onSendBatch() {
+  commonDialogMethod({
+    title: '批量发布',
+    mode: null,
+    options: [
+      {
+        render: () => '确认要批量发布吗？'
+      }
+    ],
+    interfaceFn: (_, { close }) =>
+      sendBatch(checkedRowKeysRef.value).then(() => {
+        $message.success('操作成功')
+        pageState.fetchData()
+        checkedRowKeysRef.value = []
+        close()
+      })
+  })
+}
+
+function onAddOrEdit(row = {}, mode = 'add') {
+  const { model, modeEnum } = commonDialogMethod(
+    {
+      title: '资讯',
+      mode,
+      options: [
+        {
+          label: '标题',
+          key: 'name',
+          required: true
+        },
+        {
+          label: '链接',
+          key: 'link',
+          required: true
+        },
+        {
+          label: '来源平台',
+          key: 'source',
+          required: true
+        },
+        {
+          label: '排序',
+          key: 'sort',
+          way: 'inputNumber'
+        },
+        {
+          label: '是否展示',
+          key: 'status',
+          way: 'switch'
+        }
+      ],
+      valueData: { status: true, sort: pageState.itemCount, ...row },
+      interfaceFn: (data, { close }) =>
+        (data?.id ? save : add)(data).then(() => {
+          pageState.fetchData()
+          $message.succees(`${modeEnum[mode]}成功`)
+          close()
+        })
+    },
+    {
+      style: {
+        width: '600px'
+      }
+    }
+  )
+}
+</script>
+
+<style scoped lang="less">
+.xxx-page {
+}
+</style>
+```

package/src/table/utils/ellipsis.js

@@ -0,0 +1,22 @@
+export const ellipsis = {
+  style: {
+    cursor: 'pointer',
+  },
+  tooltip: {
+    flip: true,
+    arrowPointToCenter: true,
+    contentStyle: {
+      minWidth: '100px',
+      maxWidth: '300px',
+      maxHeight: '300px',
+      overflowY: 'auto',
+      whiteSpace: 'pre-line',
+      boxSizing: 'border-box',
+      margin: '0 -14px',
+      padding: '0 14px',
+    },
+    arrowStyle: {
+      backgroundColor: '--n-color',
+    },
+  },
+}

package/src/utils/array.js

@@ -0,0 +1,26 @@
+import { unref } from 'vue'
+import {
+  labelField as globalLabelField,
+  valueField as globalValueField,
+} from '../enum/options'
+
+export function ArrayToObject(
+  arr = [],
+  { labelField = globalLabelField, valueField = globalValueField } = {
+    labelField: globalLabelField,
+    valueField: globalValueField,
+  },
+) {
+  return unref(arr).reduce((o, n) => {
+    o[n[valueField]] = {
+      ...n,
+      [labelField]: n[labelField],
+      [valueField]: n[valueField],
+    }
+    return o
+  }, {})
+}
+
+export function toArray(v) {
+  return Array.isArray(v) ? v : [v]
+}

package/src/utils/auth.js

@@ -0,0 +1,118 @@
+import { useRoute, useRouter } from 'vue-router'
+import { toArray } from './array'
+
+export function cellectChildenPermission(o) {
+  if (o?.children?.length) {
+    const pn = []
+    o.children.forEach((v) => {
+      cellectChildenPermission(v)
+      let arr = []
+      if (typeof v?.meta?.permission === 'string')
+        arr = [v.meta.permission]
+      else if (Array.isArray(v.meta?.permission))
+        arr.push(...v.meta.permission)
+      else if (typeof v.meta?.permission === 'object')
+        arr.push(...mergaMethod(allMethod(v.meta.permission)))
+      else if (!v?.meta?.permission)
+        arr = null
+      v.meta.permission = arr
+      pn.push(...new Set(arr))
+    })
+    if (!o?.meta?.permission)
+      o.meta.permission = pn
+    else o.meta.permission = [...new Set(o.meta.permission.concat(pn))]
+  }
+
+  return o
+}
+export function mergaMethod(...arg) {
+  const arr = arg?.map(v => (Array.isArray(v) ? v : v?.ALL))
+  return [].concat(...arr)
+}
+
+export function allMethod(data) {
+  if (!data)
+    return []
+  return Object.keys(data).reduce((a, b) => {
+    if (typeof data[b] !== 'string') {
+      a.concat(allMethod(data[b]))
+    }
+    else {
+      a.push(data[b])
+    }
+    return a
+  }, [])
+}
+
+export function useAuthPermission(...arg) {
+  return {
+    ...getRouteMeta('auth', arg),
+  }
+}
+
+export function useApiConfig(...arg) {
+  return {
+    ...getRouteMeta('api', arg),
+  }
+}
+
+/**
+ *
+ * @param {*} str 接口字符串
+ * @param {*} op 接口参数替换
+ * @returns
+ * return handleParams(data?.id ? updateTask : createTask, {
+      '{processId}': unref(processId),
+      '{id}': data?.id,
+    })[data?.id ? '$Put' : '$Post']({
+      ...data,
+    }).then(() => {
+      reLoad()
+      $message.success(`${modeEnum[str]?.sub}成功`)
+      cancel()
+      if (isNext.value)
+        onAdd()
+    })
+ */
+
+export function handleParams(str, op = {}) {
+  const arr = Object.keys(op)
+  if (arr.length) {
+    arr.forEach((v) => {
+      const reg = new RegExp(`${v}`, 'g')
+      str = str?.replace(reg, op[v])
+    })
+  }
+  return str
+}
+
+function getRouteMeta(name, arg) {
+  const route = useRoute()
+  const router = useRouter()
+  const meta = handleMeta(route?.meta?.[name] ?? {})
+  const routeNameArr = toArray(arg[0])
+
+  if (routeNameArr?.length) {
+    const routeArr = router
+      .getRoutes()
+      .filter(v => routeNameArr.includes(v.name))
+    routeArr.forEach((v) => {
+      if (v.meta?.[name])
+        meta[v.name] = handleMeta(v.meta[name])
+    })
+  }
+  return {
+    ...meta,
+  }
+}
+
+function handleMeta(o = {}) {
+  return Object.keys(o).reduce((a, b) => {
+    const data = o[b]
+    if (typeof data === 'object')
+      a[b] = data?.key
+    else if (typeof data === 'string')
+      a[b] = String(data)
+    return a
+  }, {})
+}

package/src/utils/object.js

@@ -0,0 +1,32 @@
+import {
+  labelField as globalLabelField,
+  valueField as globalValueField,
+} from '../enum/options'
+
+export function ObjectToArray(
+  obj,
+  { labelField = globalLabelField, valueField = globalValueField } = {},
+) {
+  return Object.keys(obj).reduce((o, n) => {
+    const data = toObject(obj[n], n)
+    const params = {
+      ...data,
+    }
+    params[labelField] = data?.[labelField]
+    params[valueField] = data?.[valueField]
+    return o.concat(params)
+  }, [])
+}
+
+export function toObject(label, value) {
+  const params = {
+    [globalLabelField]: unref(label),
+    [globalValueField]: Number.isNaN(Number(value)) ? value : Number(value),
+  }
+  return typeof unref(label) === 'object'
+    ? {
+        ...unref(label),
+        [globalValueField]: Number.isNaN(Number(value)) ? value : Number(value),
+      }
+    : params
+}

package/src/utils/time.js

@@ -0,0 +1,7 @@
+import dayjs from 'dayjs'
+
+export function timeFormat(v, str = 'YYYY-MM-DD', extend = { emptyText: '' }) {
+  if (!v)
+    return extend?.emptyText || ''
+  return dayjs(Number.isNaN(Number(v)) ? v : Number(v)).format(str)
+}

package/src/utils/upload.js

@@ -0,0 +1,46 @@
+/**
+ * 上传数据类型
+ * @import {AxiosRequestConfig} 'axios'
+ * @typedef {object} UploadData
+ * @property {string} url - 文件上传后的访问地址
+ * // 可根据实际需求扩展更多字段
+ * @typedef {Promise<import('axios').AxiosResponse<UploadData>>} UploadDataPromise
+ */
+
+import { BASE_URL } from '@/utils/request'
+
+/**
+ * 实际的上传实现函数
+ * @type {null | ((AxiosRequestConfig) => UploadDataPromise)}
+ */
+let uploadMethod = null
+
+/**
+ * 注册上传方法
+ * @param {function(AxiosRequestConfig): UploadDataPromise} fn - 实际的上传实现函数
+ */
+export function registryUpload(fn) {
+  uploadMethod = fn
+}
+
+/**
+ * 自定义上传方法，调用已注册的上传实现
+ * @param {AxiosRequestConfig} args - 上传参数
+ * @returns {UploadDataPromise} 上传结果Promise
+ */
+export function customUpload(...args) {
+  if (typeof uploadMethod !== 'function') {
+    throw new TypeError('请先通过 registryUpload(fn) 注册上传实现')
+  }
+  return uploadMethod(...args)
+}
+
+export function getFileUrl(url, ossSize = null) {
+  if (url && !url?.startsWith('http')) {
+    return !ossSize
+      ? `${BASE_URL}${url}`
+      : `${BASE_URL}${url}?x-oss-process=style/w${ossSize}`
+  }
+  return url
+}
+

package/types/index.d.ts

@@ -0,0 +1,67 @@
+import type { Component } from 'vue'
+
+export interface CommonDialogResult {
+  cancel(): void
+  setValue(v: any, key?: string): void
+  model: any
+  modeEnum: Record<string, { sub?: string; read?: boolean }>
+}
+
+export function commonDialogMethod(
+  options?: Record<string, any>,
+  dialogProps?: Record<string, any>,
+): CommonDialogResult
+
+export const DataForm: Component
+export const Options: Component
+export const CommonQuery: Component
+export const DataTable: Component
+export const OprButton: Component
+export const Pop: Component
+
+export function createActionColumnJsx(...args: any[]): any
+export function initRules(args: {
+  options?: any[]
+  model?: any
+  labelField?: string
+  formOpr?: Record<string, any>
+}): any
+
+export function getAllOptions(...args: any[]): any
+export function getOptions(...args: any[]): any
+export function setupOptions(...args: any[]): any
+
+export function toArray<T = any>(v: T | T[]): T[]
+export function ArrayToObject<T = any>(
+  arr?: T[],
+  fields?: { labelField?: string; valueField?: string },
+): Record<string, T>
+export function ObjectToArray<T extends Record<string, any> = any>(
+  obj?: T,
+  fields?: { labelField?: string; valueField?: string },
+): any[]
+
+export function customUpload(...args: any[]): Promise<any>
+export function registryUpload(fn: (...args: any[]) => Promise<any>): void
+export function getFileUrl(url?: string, ossSize?: number | null): string | undefined
+
+export function cellectChildenPermission(route: any): any
+export function handleParams(str?: string, op?: Record<string, any>): string
+export function useApiConfig(...args: any[]): Record<string, any>
+export function useAuthPermission(...args: any[]): Record<string, any>
+export function initRouteMeta(routes: any[], base?: string): any[]
+
+export const ellipsis: any
+export const orderEnum: Record<string, any>
+export const globalLabelField: string
+export const globalValueField: string
+
+declare module 'core' {
+  export * from './index.d'
+}
+
+declare module 'core/*' {
+  const mod: any
+  export = mod
+}
+