npm - create-jnrs-template-vue - Versions diffs - 1.2.3 → 1.2.4 - Mend

create-jnrs-template-vue 1.2.3 → 1.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (30) hide show

package/jnrs-template-vue/.env.development CHANGED Viewed

@@ -5,7 +5,7 @@ VITE_USE_MOCK = true
 # 后端接口基地址 - 开发环境
 # VITE_BASE_URL = '192.168.1.120:6001'
-VITE_BASE_URL = '192.168.1.120:5010'
+VITE_BASE_URL = '192.168.1.112:5010'
 # 应用运行主机（置空默认为 localhost）
 VITE_APP_HOST = ''

package/jnrs-template-vue/index.html CHANGED Viewed

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>create-jnrs-template</title>
+    <title>jnrs-template-vue</title>
   </head>
   <body>
     <div id="app"></div>

package/jnrs-template-vue/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "jnrs-template-vue",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "description": "JNRS 信息化管理系统模板",
   "author": "Talia-Tan",
   "private": true,
@@ -19,8 +19,8 @@
   },
   "dependencies": {
     "@element-plus/icons-vue": "^2.3.2",
-    "@jnrs/shared": "1.1.8",
-    "@jnrs/vue-core": "1.2.3",
+    "@jnrs/shared": "1.1.9",
+    "@jnrs/vue-core": "1.2.4",
     "@vueuse/core": "^14.1.0",
     "element-plus": "^2.11.9",
     "pinia": "^3.0.4",

package/jnrs-template-vue/public/system/menu.json CHANGED Viewed

@@ -15,16 +15,25 @@
           "path": "/unitTest",
           "name": "UnitTest",
           "meta": {
-            "title": "功能测试页面",
+            "title": "基础功能测试",
             "todoCount": 8
           },
           "component": "/demos/unitTest/index"
         },
+        {
+          "path": "/simpleTable",
+          "name": "SimpleTable",
+          "meta": {
+            "title": "简单数据表格模板",
+            "todoCount": 0
+          },
+          "component": "/demos/simpleTable/index"
+        },
         {
           "path": "/crud",
           "name": "Crud",
           "meta": {
-            "title": "增删改查模板页面",
+            "title": "完整增删改查模板",
             "todoCount": 0
           },
           "component": "/demos/crud/index"

package/jnrs-template-vue/src/api/demos/index.ts CHANGED Viewed

@@ -1,5 +1,7 @@
 import type { Pagination, PageTableData, FileContainer } from '@/types'
 import { axiosRequest } from '@jnrs/vue-core/request'
+import { extractFieldId } from '@/utils/file'
+import { objectToFormData } from '@/utils/packages'
 /**
  * 项目
@@ -26,6 +28,7 @@ export interface ProjectItem extends FileContainer {
 type AddProjectOmitKeys =
   | 'id'
   | 'programCode'
+  | 'program'
   | 'code'
   | 'manager'
   | 'plannedFinishDate'
@@ -36,7 +39,7 @@ type AddProjectOmitKeys =
 export type AddProjectItem = Omit<ProjectItem, AddProjectOmitKeys> & {
   id?: string
-  managerId?: Record<string, unknown>
+  managerId?: Record<string, unknown> | unknown
   newAttachmentFile: []
   newImageFiles: []
 }
@@ -64,7 +67,7 @@ export const NotFoundApi = () => {
  * 测试 无权限
  * @param showErrorMsg 是否显示错误信息
  */
-export const NoAuth = (showErrorMsg: boolean) => {
+export const NoAuthApi = (showErrorMsg: boolean) => {
   return axiosRequest({
     url: '/mock/auth/no',
     method: 'post',
@@ -83,31 +86,35 @@ export const DetailsApi = (): Promise<FileContainer> => {
 }
 /**
- * 表单新增
+ * 表单新增（包含文件上传类需使用 formData 类型）
  */
-export const DemosFormApi = (data: FormData) => {
+export const EditApi = (data: AddProjectItem) => {
+  const formData = objectToFormData({
+    ...data,
+    managerId: extractFieldId(data.managerId, 'managerId')
+  })
   return axiosRequest({
     url: '/mock/demos/save',
     method: 'post',
-    data
+    data: formData
   })
 }
 /**
  * 数据详情
  */
-export const DemosTableApi = (query: ProjectQuery): Promise<PageTableData<ProjectItem>> => {
+export const TableApi = (data?: ProjectQuery): Promise<PageTableData<ProjectItem>> => {
   return axiosRequest({
     url: '/mock/demos/table',
     method: 'get',
-    data: query
+    data
   })
 }
 /**
  * 下载数据导入模板
  */
-export const DemosImportTemplateApi = (): Promise<Blob> => {
+export const ImportTemplateApi = (): Promise<Blob> => {
   return axiosRequest({
     url: '/mock/project/template',
     method: 'post'
@@ -117,7 +124,7 @@ export const DemosImportTemplateApi = (): Promise<Blob> => {
 /**
  * 项目数据导入
  */
-export const DemosImportDataApi = (data: FormData) => {
+export const ImportDataApi = (data: { file: File }) => {
   return axiosRequest({
     url: '/mock/project/import',
     method: 'post',
@@ -128,7 +135,7 @@ export const DemosImportDataApi = (data: FormData) => {
 /**
  * 项目数据导出
  */
-export const DemosExportApi = (data: Record<string, unknown>): Promise<Blob> => {
+export const ExportApi = (data: Record<string, unknown>): Promise<Blob> => {
   return axiosRequest({
     url: '/mock/project/export',
     method: 'post',

package/jnrs-template-vue/src/api/system/index.ts CHANGED Viewed

@@ -1,6 +1,7 @@
-import { axiosRequest } from '@jnrs/vue-core/request'
 import type { Dict, DictItem, User, Role } from '@jnrs/shared'
 import type { MenuItem } from '@jnrs/vue-core'
+import { axiosRequest } from '@jnrs/vue-core/request'
+import { objectToFormData } from '@/utils/packages'
 // 菜单
 export const MenuApi = (): Promise<MenuItem[]> => {
@@ -47,6 +48,15 @@ export const UserInfoApi = (): Promise<User> => {
   })
 }
+// 修改头像
+export const AvatarChangeApi = (data: File) => {
+  return axiosRequest({
+    url: '/api/user/avatar',
+    method: 'post',
+    data: objectToFormData({ file: data })
+  })
+}
 // 修改密码
 interface PasswordChange {
   userId: number

package/jnrs-template-vue/src/assets/styles/index.scss CHANGED Viewed

@@ -3,27 +3,3 @@
 @use './root.scss';
 @use './common.scss';
 @use './animation.scss';
-body {
-  width: 100vw;
-  height: 100vh;
-  color: var(--jnrs-font-primary);
-  background: var(--jnrs-background-primary);
-}
-#app {
-  min-width: 1280px;
-  height: 100%;
-}
-/*
- * 禁止用户选中页面元素
- */
-.no-select {
-  -khtml-user-drag: none;
-  -webkit-user-drag: none;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-}

package/jnrs-template-vue/src/assets/styles/init.scss CHANGED Viewed

@@ -27,3 +27,27 @@ img {
   object-fit: cover;
   object-position: center center;
 }
+body {
+  width: 100vw;
+  height: 100vh;
+  color: var(--jnrs-font-primary);
+  background: var(--jnrs-background-primary);
+}
+#app {
+  min-width: 1280px;
+  height: 100%;
+}
+/*
+ * 禁止用户选中页面元素
+ */
+.no-select {
+  -khtml-user-drag: none;
+  -webkit-user-drag: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}

package/jnrs-template-vue/src/assets/styles/root.scss CHANGED Viewed

@@ -1,3 +1,7 @@
+/*
+ * root 样式
+ */
 :root {
   // Layout 头部高度
   --jnrs-head-height: 50px;

package/jnrs-template-vue/src/components/common/CardTable.vue ADDED Viewed

@@ -0,0 +1,89 @@
+<!--
+ @Author : TanRui
+ @WeChat : Tan578853789
+ @File   : CardTable.vue
+ @Date   : 2026/01/06
+ @Desc.  : 卡片数据表格组件
+ -->
+<script setup lang="ts">
+import type { PageTableData, Pagination } from '@/types'
+import { ref, onActivated } from 'vue'
+import { JnPagination, JnTable } from '@jnrs/vue-core/components'
+import { debounce } from '@jnrs/shared/lodash'
+interface Props {
+  /**
+   * 获取数据表格 api 函数
+   */
+  getTableDataApi?: (...args: any[]) => Promise<PageTableData<any>>
+}
+const { getTableDataApi } = defineProps<Props>()
+const loading = ref(false)
+const tableData = ref()
+const total = ref(0)
+const pagination = ref<Pagination>({ pageNo: 1, pageSize: 10 })
+const getTable = debounce(async () => {
+  if (!getTableDataApi) {
+    return false
+  }
+  loading.value = true
+  try {
+    const res = await getTableDataApi({
+      ...pagination.value
+    })
+    tableData.value = res.list.map((item) => ({
+      ...item,
+      newImageFiles: item.imageDocument?.attachments ?? undefined,
+      newAttachmentFile: item.attachmentDocument?.attachments ?? undefined
+    }))
+    console.log(456)
+    total.value = res.count
+  } catch (error) {
+    console.error(error)
+  } finally {
+    loading.value = false
+  }
+}, 300)
+onActivated(() => {
+  console.log(123)
+  getTable()
+})
+</script>
+<template>
+  <el-card class="cardTable" v-loading="loading">
+    <template #header>
+      <div class="cardTable_header">
+        <slot name="header"></slot>
+      </div>
+    </template>
+    <JnTable
+      :data="tableData"
+      :pagination="pagination"
+      :autoHeight="true"
+      :showScrollbar="true"
+      :showIndexColumn="true"
+    >
+      <slot name="table"></slot>
+    </JnTable>
+    <JnPagination :total="total" v-model="pagination" @change="getTable" />
+  </el-card>
+</template>
+<style lang="scss" scoped>
+.cardTable {
+  .cardTable_header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+}
+</style>

package/jnrs-template-vue/src/components/common/DictTag.vue CHANGED Viewed

@@ -58,13 +58,17 @@ const computedColor = computed(() => {
 <style lang="scss" scoped>
 .dictTag {
-  padding: 2px 8px;
-  border-radius: 8px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 1px 8px;
+  border-radius: 4px;
   white-space: nowrap;
+  transform: scale(0.8);
   .dictTag_label_showColor {
-    font-size: 0.8em;
-    filter: invert(0.6) brightness(0.6);
+    font-size: 1.1em;
+    filter: invert(0.5) brightness(0.5);
   }
 }
 </style>

package/jnrs-template-vue/src/components/common/ImageView.vue CHANGED Viewed

@@ -13,9 +13,14 @@ interface Props {
    * 要加载的文件列表 ｜ 文件名唯一标识 uniqueFileName
    */
   loadKeys: Attachment[] | string | undefined
+  /**
+   * 是否清理文件副作用
+   */
+  clearSideEffects: boolean
 }
-const { loadKeys } = defineProps<Props>()
+const { loadKeys, clearSideEffects = false } = defineProps<Props>()
 // 第一张显示的图片
 const posterUrl = ref('')
@@ -28,10 +33,12 @@ const revokeFns = ref<(() => void)[]>([])
 // 清理当前所有 Object URL
 const clearUrls = () => {
-  revokeFns.value.forEach((revoke) => revoke())
-  revokeFns.value = []
-  fileList.value = []
-  posterUrl.value = ''
+  if (clearSideEffects) {
+    revokeFns.value.forEach((revoke) => revoke())
+    revokeFns.value = []
+    fileList.value = []
+    posterUrl.value = ''
+  }
 }
 // 加载文件
@@ -105,7 +112,7 @@ const loadFilesRaw = async (keys: Props['loadKeys']) => {
   }
 }
-const loadFiles = debounce(loadFilesRaw, 300)
+const loadFiles = debounce(loadFilesRaw, 500)
 watch(
   () => loadKeys,
@@ -116,7 +123,9 @@ watch(
 )
 onActivated(() => {
-  loadFiles(loadKeys)
+  if (clearSideEffects) {
+    loadFiles(loadKeys)
+  }
 })
 // 副作用清理

package/jnrs-template-vue/src/components/common/PdfView.vue CHANGED Viewed

@@ -12,9 +12,14 @@ interface Props {
    * 要加载的文件列表 ｜ 文件名唯一标识 uniqueFileName
    */
   loadKeys: Attachment[] | string | undefined
+  /**
+   * 是否清理文件副作用
+   */
+  clearSideEffects: boolean
 }
-const { loadKeys } = defineProps<Props>()
+const { loadKeys, clearSideEffects = false } = defineProps<Props>()
 // 存储每个 URL 对应的 URL 对象
 const fileList = ref<FileItem[]>([])
@@ -24,9 +29,11 @@ const revokeFns = ref<(() => void)[]>([])
 // 清理当前所有 Object URL
 const clearUrls = () => {
-  revokeFns.value.forEach((revoke) => revoke())
-  revokeFns.value = []
-  fileList.value = []
+  if (clearSideEffects) {
+    revokeFns.value.forEach((revoke) => revoke())
+    revokeFns.value = []
+    fileList.value = []
+  }
 }
 const loadFiles = async (keys: Props['loadKeys']) => {
@@ -87,7 +94,9 @@ watch(
 )
 onActivated(() => {
-  loadFiles(loadKeys)
+  if (clearSideEffects) {
+    loadFiles(loadKeys)
+  }
 })
 // 副作用清理

package/jnrs-template-vue/src/components/select/SelectManager.vue CHANGED Viewed

@@ -7,12 +7,12 @@
  -->
 <script setup lang="ts">
-import { DemosTableApi } from '@/api/demos/index'
+import { TableApi } from '@/api/demos/index'
 import { JnSelectTemplate } from '@jnrs/vue-core/components'
 </script>
 <template>
-  <JnSelectTemplate tableName="项目经理" :keyValue="{ label: 'manager', value: 'managerId' }" :listApi="DemosTableApi">
+  <JnSelectTemplate tableName="项目经理" :keyValue="{ label: 'manager', value: 'managerId' }" :listApi="TableApi">
     <template #table>
       <el-table-column prop="manager" label="项目经理" align="center" sortable />
     </template>

package/jnrs-template-vue/src/layout/SideMenu.vue CHANGED Viewed

@@ -68,7 +68,6 @@ $mainFontColor: rgba(255, 255, 255, 0.8);
       font-weight: normal;
       font-family: AlimamaShuHeiTi-Bold;
       white-space: nowrap;
-      letter-spacing: 2px;
       transform: translate(-50%, -50%);
       transition: all 0.3s ease;
       filter: opacity(1);

package/jnrs-template-vue/src/layout/TopHeader.vue CHANGED Viewed

@@ -1,21 +1,17 @@
 <script setup lang="ts">
-import { ref, computed } from 'vue'
+import { ref } from 'vue'
 import { storeToRefs } from 'pinia'
 import { ElMessageBox } from 'element-plus'
 import { handleRouter } from '@jnrs/vue-core/router'
 import { GlobalSetting } from '@jnrs/vue-core/components'
 import { useSystemStore, useAuthStore, useMenuStore } from '@jnrs/vue-core/pinia'
 import { LogoutApi } from '@/api/system'
-import { getDictLabel, getDictColor } from '@/utils/packages'
 import ImageView from '@/components/common/ImageView.vue'
+import DictTag from '@/components/common/DictTag.vue'
 const { userInfo, clearAuth } = useAuthStore()
 const { clearMenu } = useMenuStore()
-const roleLabel = computed(() => getDictLabel('role', userInfo?.role || ''))
-const roleColor = computed(() => getDictColor('role', userInfo?.role || ''))
 const systemStore = useSystemStore()
 const { documentFullscreen } = storeToRefs(systemStore)
 const { toggleFullScreen } = systemStore
@@ -29,8 +25,8 @@ const handleLogout = async () => {
       type: 'warning'
     })
     await LogoutApi()
-    await clearAuth()
-    await clearMenu()
+    clearAuth()
+    clearMenu()
     handleRouter({ name: 'Login' }, 'replace')
   } catch {}
 }
@@ -68,16 +64,12 @@ const showGlobalSetting = () => {
           <span class="userMenu_reference">
             <ImageView class="userMenu_avatar" :loadKeys="userInfo?.avatarFileName" />
             <span>{{ userInfo?.name }}</span>
-            <span class="userMenu_roleName" :style="{ color: roleColor }" v-if="userInfo?.role">[{{ roleLabel }}]</span>
+            <DictTag dictName="role" :value="userInfo.role" v-if="userInfo?.role" />
             <el-icon class="userMenu_icon"><arrow-down /></el-icon>
           </span>
         </template>
         <div class="userMenu_dropdown">
           <ImageView class="userMenu_dropdown_avatar" :loadKeys="userInfo?.avatarFileName" />
-          <b>
-            <span>{{ userInfo?.name }}</span>
-            <span class="userMenu_roleName" :style="{ color: roleColor }" v-if="userInfo?.role">[{{ roleLabel }}]</span>
-          </b>
           <div class="loginDateTime" v-if="userInfo?.loginDateTime">
             <span>登录时间</span>
             <p>{{ userInfo?.loginDateTime }}</p>
@@ -132,13 +124,14 @@ $topHoverSize: 35px;
     display: flex;
     align-items: center;
     margin-left: 16px;
-    transition: all 0.25s ease;
     cursor: pointer;
     &:hover {
       span {
+        transition: all 0.25s ease;
         color: var(--jnrs-color-primary) !important;
       }
       .userMenu_icon {
+        transition: all 0.25s ease;
         color: var(--jnrs-color-primary);
       }
     }

package/jnrs-template-vue/src/types/webSocket.ts ADDED Viewed

@@ -0,0 +1,19 @@
+export interface MsgIdMessage {
+  msgId: string
+  d: unknown
+}
+export interface TypeDataMessage {
+  type: string | number
+  data: unknown
+}
+// 类型守卫函数 MsgId 结构
+export function isMsgIdMessage(msg: unknown): msg is MsgIdMessage {
+  return typeof msg === 'object' && msg !== null && 'msgId' in msg && 'd' in msg
+}
+// 类型守卫函数 Type 结构
+export function isTypeDataMessage(msg: unknown): msg is TypeDataMessage {
+  return typeof msg === 'object' && msg !== null && 'type' in msg && 'data' in msg
+}

package/jnrs-template-vue/src/utils/file.ts CHANGED Viewed

@@ -6,7 +6,6 @@
  * @Desc.  : 文件处理相关函数
  */
-// import { blobToUrl } from '@jnrs/shared'
 import { useObjectUrl } from '@vueuse/core'
 import { FileApi } from '@/api/common'
@@ -19,3 +18,39 @@ export const getFileUrl = async (uniqueFileName: string) => {
   const blob = await FileApi(uniqueFileName)
   return useObjectUrl(blob)
 }
+/**
+ * 从可能为原始值或对象的输入中提取指定字段的值
+ * @param value - 输入值（可能是 string/number/对象）
+ * @param fieldName - 要提取的对象字段名（默认 'id'）
+ * @returns 提取出的 string | number 值，或 undefined
+ */
+export function extractFieldId(value: unknown, fieldName: string = 'id'): string | number | undefined {
+  // 1. 排除 null 和 undefined
+  if (value == null) return undefined
+  // 2. 如果是原始 ID 类型，直接返回
+  if (typeof value === 'string' || typeof value === 'number') {
+    return value
+  }
+  // 3. 必须是普通对象（非数组、非 Date 等）
+  if (typeof value !== 'object' || Array.isArray(value)) {
+    return undefined
+  }
+  // 4. 检查对象是否包含目标字段
+  if (!(fieldName in value)) {
+    return undefined
+  }
+  // 5. 安全获取字段值（使用 keyof 断言确保类型安全）
+  const fieldValue = (value as Record<string, unknown>)[fieldName]
+  // 6. 只接受 string 或 number 类型
+  if (typeof fieldValue === 'string' || typeof fieldValue === 'number') {
+    return fieldValue
+  }
+  return undefined
+}