af-mobile-client-vue3 1.0.54

package/src/main.ts

@@ -0,0 +1,48 @@
+import { createApp } from 'vue'
+import { createHead } from '@unhead/vue'
+import bootstrap from '@af-mobile-client-vue3/bootstrap'
+import App from '@af-mobile-client-vue3/App.vue'
+import router from '@af-mobile-client-vue3/router'
+import pinia from '@af-mobile-client-vue3/stores'
+import 'virtual:uno.css'
+import '@af-mobile-client-vue3/styles/app.less'
+import 'vant/lib/index.css'
+import 'vant/lib/tabbar/index.css'
+import 'vant/lib/tabbar-item/index.css'
+
+// svg icon
+import 'virtual:svg-icons-register'
+
+// Vant 桌面端适配
+import '@vant/touch-emulator'
+
+/* --------------------------------
+Vant 中有个别组件是以函数的形式提供的，
+包括 Toast，Dialog，Notify 和 ImagePreview 组件。
+在使用函数组件时，unplugin-vue-components
+无法自动引入对应的样式，因此需要手动引入样式。
+------------------------------------- */
+import 'vant/es/toast/style'
+import 'vant/es/dialog/style'
+import 'vant/es/notify/style'
+import 'vant/es/image-preview/style'
+import Plugins from '@af-mobile-client-vue3/plugins'
+
+const app = createApp(App)
+const head = createHead()
+
+app.use(head)
+app.use(router)
+app.use(pinia)
+app.use(Plugins)
+
+async function main() {
+  await bootstrap(router)
+  app.mount('#system-app')
+}
+main().then((_r) => {})
+
+// 👇 将卸载操作放入 unmount 函数，就是上面步骤2中的卸载函数
+window.unmount = () => {
+  app.unmount()
+}

package/src/plugins/AppData.ts

@@ -0,0 +1,38 @@
+import type { App } from 'vue'
+import { manageApi } from '@af-mobile-client-vue3/services/api/manage'
+import { indexedDB } from '@af-mobile-client-vue3/utils/indexedDB'
+import { handleTree } from '@af-mobile-client-vue3/utils/dataUtil'
+import { createStorage } from '@af-mobile-client-vue3/utils/Storage'
+import { APP_WEB_CONFIG_KEY } from '@af-mobile-client-vue3/stores/mutation-type'
+
+const Storage = createStorage({ storage: localStorage })
+
+export const GetAppDataService = {
+  install(app: App<Element>) {
+    app.provide('$appdata', GetAppDataService)
+  },
+  async load() {
+  },
+  // 返回树形省市区
+  async getDivisionsOhChinaForTree() {
+    // 获取省市区数据
+    return new Promise((resolve, reject) => {
+      try {
+        indexedDB.getByWeb('divisionsOhChina', manageApi.getDivisionsOhChina, {}, (res) => {
+          resolve(res)
+        }, (processRes) => {
+          return handleTree(processRes, 'code', 'parentcode', null)
+        })
+      }
+      catch (e) {
+        reject(e)
+      }
+    })
+  },
+  getWebConfigByKey(key: string) {
+    const object = Storage.get(APP_WEB_CONFIG_KEY)
+    return object[key]
+  },
+}
+
+export default GetAppDataService

package/src/plugins/GetLoginInfoService.ts

@@ -0,0 +1,10 @@
+import type { App } from 'vue'
+
+const GetLoginInfoService = {
+  install(app: App<Element>) {
+    app.provide('$login', GetLoginInfoService)
+  },
+  f: {},
+}
+
+export default GetLoginInfoService

package/src/plugins/index.ts

@@ -0,0 +1,11 @@
+import type { App } from 'vue'
+import GetLoginInfoService from '@af-mobile-client-vue3/plugins/GetLoginInfoService'
+import GetAppDataService from '@af-mobile-client-vue3/plugins/AppData'
+
+const Plugins = {
+  install(app: App<Element>) {
+    app.use(GetLoginInfoService)
+    app.use(GetAppDataService)
+  },
+}
+export default Plugins

package/src/router/README.md

@@ -0,0 +1,8 @@
+# `File-based Routing`
+
+Routes will be auto-generated for Vue files in the  **src/views** dir with the same file structure.
+Check out [`unplugin-vue-router`](https://github.com/posva/unplugin-vue-router) for more details.
+
+在 **src/views** 目录下的 Vue 文件会自动生成相同结构的路由。
+
+查看[`unplugin-vue-router`](https://github.com/posva/unplugin-vue-router)了解更多细节。

package/src/router/guards.ts

@@ -0,0 +1,60 @@
+import { showToast } from 'vant'
+import useUserStore from '@af-mobile-client-vue3/stores/modules/user'
+import { hasAuthority } from '@af-mobile-client-vue3/utils/authority-utils'
+
+// 不需要登录拦截的路由配置
+const loginIgnore = {
+  names: ['404', '403'], // 根据路由名称匹配
+  paths: ['/login', '/XReportFormIframeView', '/invoiceShow'], // 根据路由fullPath匹配
+  /**
+   * 判断路由是否包含在该配置中
+   * @param route vue-router 的 route 对象
+   */
+  includes(route) {
+    return this.names.includes(route.name) || this.paths.includes(route.path)
+  },
+}
+
+/**
+ * 登录守卫
+ * @param to
+ * @param form
+ * @param next
+ * @param options
+ */
+function loginGuard(to, from, next?) {
+  if (!loginIgnore.includes(to) && !useUserStore().getToken()) {
+    showToast({
+      message: '登录态已失效，请重新登录',
+      position: 'bottom',
+    })
+    next({ path: '/login' })
+  }
+  else {
+    if (to.path === '/login' && useUserStore().getToken())
+      next({ path: '/' })
+
+    next()
+  }
+}
+
+/**
+ * 权限守卫
+ * @param to
+ * @param form
+ * @param next
+ */
+function authorityGuard(to, from, next?) {
+  const permissions = useUserStore().getPermissions()
+  const roles = useUserStore().getRoles()
+  if (!hasAuthority(to, permissions, roles))
+    next({ path: '/' })
+
+  else
+    next()
+}
+
+export default {
+  beforeEach: [loginGuard, authorityGuard],
+  afterEach: [],
+}

package/src/router/index.ts

@@ -0,0 +1,60 @@
+// https://router.vuejs.org/zh/
+import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router'
+import 'nprogress/nprogress.css'
+import type { RouteLocationNormalized } from 'vue-router'
+import setPageTitle from '@af-mobile-client-vue3/utils/set-page-title'
+import useCachedViewStore from '@af-mobile-client-vue3/stores/modules/cachedView'
+import useRouteTransitionNameStore from '@af-mobile-client-vue3/stores/modules/routeTransitionName'
+import routes from '@af-mobile-client-vue3/router/routes'
+const baseUrl = import.meta.env.VITE_APP_PUBLIC_PATH
+// 创建路由实例并传递 `routes` 配置
+const router = createRouter({
+  history: import.meta.env.NODE_ENV === 'development' ? createWebHistory(baseUrl) : createWebHashHistory(baseUrl),
+  routes,
+})
+
+export interface toRouteType extends RouteLocationNormalized {
+  meta: {
+    title?: string
+    noCache?: boolean
+    index?: number
+  }
+}
+
+router.beforeEach((to: toRouteType, _from: toRouteType, next) => {
+  const toDepth = to.path.split('/').length
+  const fromDepth = _from.path.split('/').length
+  // 路由过渡动画
+  const routeTransitionNameStore = useRouteTransitionNameStore()
+  let name: string
+  if (toDepth > fromDepth || to.name === '404') {
+    console.warn('in')
+    // 进入动画
+    name = 'slide-fadein-left'
+  }
+  else if (toDepth < fromDepth) {
+    // 返回动画
+    name = 'slide-fadein-right'
+  }
+  else {
+    const toIndex = to.meta.index ? to.meta.index : 0
+    const fromIndex = _from.meta.index ? _from.meta.index : 0
+    if (toIndex > fromIndex)
+      name = 'slide-right'
+    else if (toIndex < fromIndex)
+      name = 'slide-left'
+    else
+      name = ''
+  }
+  routeTransitionNameStore.setName(name)
+  // 路由缓存
+  useCachedViewStore().addCachedView(to)
+  // 页面 title
+  setPageTitle(to.meta.title)
+  next()
+})
+
+router.afterEach(() => {})
+
+// 导出路由实例，并在 `main.ts` 挂载
+export default router

package/src/router/invoiceRoutes.ts

@@ -0,0 +1,33 @@
+import type { RouteRecordRaw } from 'vue-router'
+import PageLayout from '@af-mobile-client-vue3/layout/PageLayout.vue'
+import NotFound from '@af-mobile-client-vue3/views/common/NotFound.vue'
+import invoiceShow from '@af-mobile-client-vue3/views/invoiceShow/index.vue'
+
+const routes: Array<RouteRecordRaw> = [
+  {
+    path: '/',
+    name: 'root',
+    component: PageLayout,
+    redirect: { name: 'Component' },
+    children: [
+      {
+        path: '/invoiceShow',
+        name: 'invoiceShow',
+        component: invoiceShow,
+      },
+    ],
+  },
+  {
+    path: '/404',
+    name: '404',
+    component: NotFound,
+  },
+  {
+    path: '/:pathMatch(.*)',
+    redirect: {
+      name: '404',
+    },
+  },
+]
+
+export default routes

package/src/router/routes.ts

@@ -0,0 +1,84 @@
+import type { RouteRecordRaw } from 'vue-router'
+import ComponentView from '@af-mobile-client-vue3/views/component/index.vue'
+import XCellListView from '@af-mobile-client-vue3/views/component/XCellListView/index.vue'
+import XCellDetailView from '@af-mobile-client-vue3/views/component/XCellDetailView/index.vue'
+import XReportFormView from '@af-mobile-client-vue3/views/component/XReportFormView/index.vue'
+import XFormView from '@af-mobile-client-vue3/views/component/XFormView/index.vue'
+import EvaluateRecordView from '@af-mobile-client-vue3/views/component/EvaluateRecordView/index.vue'
+import XReportFormIframeView from '@af-mobile-client-vue3/views/component/XReportFormIframeView/index.vue'
+import PageLayout from '@af-mobile-client-vue3/layout/PageLayout.vue'
+import login from '@af-mobile-client-vue3/views/user/login/index.vue'
+import NotFound from '@af-mobile-client-vue3/views/common/NotFound.vue'
+import SingleLayout from '@af-mobile-client-vue3/layout/SingleLayout.vue'
+
+const routes: Array<RouteRecordRaw> = [
+  {
+    path: '/',
+    name: 'root',
+    component: PageLayout,
+    redirect: { name: 'Component' },
+    children: [
+      {
+        path: '/XReportFormIframeView',
+        name: 'XReportFormIframeView',
+        component: XReportFormIframeView,
+      },
+    ],
+  },
+  {
+    path: '/Component',
+    name: 'Component',
+    component: SingleLayout,
+    redirect: { name: 'ComponentView' },
+    children: [
+      {
+        path: '/Component/main',
+        name: 'ComponentView',
+        component: ComponentView,
+      },
+      {
+        path: '/Component/XCellListView',
+        name: 'XCellListView',
+        component: XCellListView,
+      },
+      {
+        path: '/Component/XCellDetailView/:id',
+        name: 'XCellDetailView',
+        component: XCellDetailView,
+      },
+      {
+        path: '/Component/XReportFormView',
+        name: 'XReportFormView',
+        component: XReportFormView,
+      },
+      {
+        path: '/Component/XFormView/:id/:openid',
+        name: 'XFormView',
+        component: XFormView,
+      },
+      {
+        path: '/Component/EvaluateRecordView',
+        name: 'EvaluateRecordView',
+        component: EvaluateRecordView
+      }
+    ],
+  },
+  {
+    path: '/login',
+    name: 'login',
+    component: login,
+  },
+  {
+    path: '/404',
+    name: '404',
+    component: NotFound,
+  },
+  {
+    path: '/:pathMatch(.*)',
+    redirect: {
+      name: '404',
+    },
+  },
+]
+
+export default routes

package/src/services/api/Login.ts

@@ -0,0 +1,6 @@
+const loginApi = {
+  Login: '/af-auth/login',
+  Logout: '/af-auth/logout',
+}
+
+export { loginApi }

package/src/services/api/common.ts

@@ -0,0 +1,98 @@
+import { indexedDB } from '@af-mobile-client-vue3/utils/indexedDB'
+import { post, postWithConfig } from '@af-mobile-client-vue3/services/restTools'
+
+const commonApi = {
+  // 获取配置
+  getConfig: 'logic/openapi/getLiuliConfiguration',
+  // 通用查询
+  query: 'logic/commonQuery',
+  // 编辑前查询
+  queryWithResource: 'logic/commonQueryWithResource',
+  // 通用新增/修改
+  addOrModify: 'logic/commonAddOrModify',
+  // 通用删除
+  delete: 'logic/commonDelete',
+}
+
+export function getConfigByName(configName: string, callback: Function): void
+/**
+ * 根据配置名获取配置内容
+ * @param configName 配置名称
+ * @param callback 回调函数
+ * @param serviceName 服务名
+ */
+export function getConfigByName(configName: string, callback: Function, serviceName?: string): void {
+  const namespaceName = serviceName || import.meta.env.VITE_APP_SYSTEM_NAME
+  indexedDB.getByWeb(configName, `/${namespaceName}/${commonApi.getConfig}`, { configName }, callback, null)
+}
+
+/**
+ * 临时使用
+ * 获取琉璃配置，不走indexedDB缓存
+ * @param configName
+ * @param serviceName
+ */
+export function getConfigByNameWithoutIndexedDB(configName: string, serviceName = import.meta.env.VITE_APP_SYSTEM_NAME) {
+  return post(`/${serviceName}/${commonApi.getConfig}`, { configName })
+}
+
+/**
+ * 通用执行业务逻辑
+ */
+export function runLogic(logicName: string, parameter: object, serviceName = import.meta.env.VITE_APP_SYSTEM_NAME) {
+  return post(`/${serviceName}/logic/${logicName}`, parameter)
+}
+
+/**
+ * 通用查询
+ */
+export function query(parameter: object, serviceName = import.meta.env.VITE_APP_SYSTEM_NAME) {
+  return post(`/${serviceName}/${commonApi.query}`, parameter)
+}
+
+/**
+ * 编辑前查询
+ */
+export function queryWithResource(parameter: object, serviceName = import.meta.env.VITE_APP_SYSTEM_NAME) {
+  return post(`/${serviceName}/${commonApi.queryWithResource}`, parameter)
+}
+
+/**
+ * 通用新增/修改
+ */
+export function addOrModify(parameter: object, tableName = 't_files', serviceName = import.meta.env.VITE_APP_SYSTEM_NAME) {
+  return post(`/${serviceName}/entity/${tableName}`, parameter)
+}
+
+/**
+ * 通用新增/修改
+ */
+export function addOrModifyEntity(parameter: object, tableName: String, serviceName = import.meta.env.VITE_APP_SYSTEM_NAME) {
+  return post(`/${serviceName}/entity/save/${tableName}`, parameter)
+}
+
+/**
+ * 通用删除
+ */
+export function remove(parameter: object, serviceName = import.meta.env.VITE_APP_SYSTEM_NAME) {
+  return post(`/${serviceName}/${commonApi.delete}`, parameter)
+}
+
+/**
+ * @description: 上传
+ */
+export function upload(parameter, serviceName = import.meta.env.VITE_APP_SYSTEM_NAME, config) {
+  return postWithConfig(`/${serviceName}/resource/upload`, parameter, config)
+}
+
+/**
+ * @description: 删除
+ */
+export function deleteFile(parameter, serviceName = import.meta.env.VITE_APP_SYSTEM_NAME) {
+  return post(`/${serviceName}/entity/t_files`, parameter)
+}
+
+export function openApiLogic(parameter, logicName: string, serviceName = import.meta.env.VITE_APP_SYSTEM_NAME) {
+  return post(`/${serviceName}/logic/openapi/${logicName}`, parameter)
+}
+export { commonApi }

package/src/services/api/index.ts

@@ -0,0 +1,7 @@
+import { commonApi } from '@af-mobile-client-vue3/services/api/common'
+import { loginApi } from '@af-mobile-client-vue3/services/api/Login'
+
+export default {
+  commonApi,
+  loginApi,
+}

package/src/services/api/manage.ts

@@ -0,0 +1,8 @@
+const manageApi = {
+  // 查询：获取省市区街道三级分类
+  getDivisionsOhChina: '/af-system/logic/getDivisionsOhChina',
+}
+
+export {
+  manageApi,
+}

package/src/services/restTools.ts

@@ -0,0 +1,37 @@
+import { http } from '@af-mobile-client-vue3/utils/http'
+import type { BasicResponseModel } from '@af-mobile-client-vue3/api/user'
+
+/**
+ * GET请求
+ * @param url 请求地址
+ * @param params 路径参数
+ */
+export function get(url: string, params?: any) {
+  return http.request<BasicResponseModel>({
+    url,
+    method: 'GET',
+    params,
+  })
+}
+
+/**
+ * POST请求
+ * @param url 请求地址
+ * @param data 请求参数
+ */
+export function post(url: string, data: any) {
+  return http.request<BasicResponseModel>({
+    url,
+    method: 'POST',
+    data,
+  })
+}
+
+export function postWithConfig(url: string, data: any, config: any) {
+  return http.request<BasicResponseModel>({
+    url,
+    method: 'POST',
+    data,
+    headers: { ...config },
+  })
+}

package/src/settings.ts

@@ -0,0 +1 @@
+export const pageDefaultTitle = '智慧燃气'

package/src/stores/index.ts

@@ -0,0 +1,7 @@
+import { createPinia } from 'pinia'
+import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
+
+const pinia = createPinia()
+pinia.use(piniaPluginPersistedstate)
+
+export default pinia

package/src/stores/modules/cachedView.ts

@@ -0,0 +1,31 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import type { toRouteType } from '@af-mobile-client-vue3/router'
+
+const useCachedViewStore = defineStore('cached-view', () => {
+  // 缓存页面 keepAlive
+  const cachedViewList = ref([] as string[])
+  const addCachedView = (view: toRouteType) => {
+    // 不重复添加
+    if (cachedViewList.value.includes(view.name as string))
+      return
+    if (!view?.meta?.noCache)
+      cachedViewList.value.push(view.name as string)
+  }
+  const delCachedView = (view: toRouteType) => {
+    const index = cachedViewList.value.indexOf(view.name as string)
+    index > -1 && cachedViewList.value.splice(index, 1)
+  }
+  const delAllCachedViews = () => {
+    cachedViewList.value = [] as string[]
+  }
+
+  return {
+    cachedViewList,
+    addCachedView,
+    delCachedView,
+    delAllCachedViews,
+  }
+})
+
+export default useCachedViewStore

package/src/stores/modules/counter.ts

@@ -0,0 +1,19 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+
+const useCounterStore = defineStore('counter', () => {
+  const counter = ref(0)
+
+  const increment = () => {
+    counter.value++
+  }
+
+  return {
+    counter,
+    increment,
+  }
+}, {
+  persist: true,
+})
+
+export default useCounterStore

package/src/stores/modules/routeTransitionName.ts

@@ -0,0 +1,26 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+
+const useRouteTransitionNameStore = defineStore('route-transition-name', () => {
+  // 过渡动画名称
+  const routeTransitionName = ref('')
+  // homeLayout动画名称
+  const routeTransitionHomeName = ref('')
+
+  const setName = (name: string) => {
+    routeTransitionName.value = name
+  }
+
+  const setHomeName = (name: string) => {
+    routeTransitionHomeName.value = name
+  }
+
+  return {
+    routeTransitionName,
+    routeTransitionHomeName,
+    setName,
+    setHomeName,
+  }
+})
+
+export default useRouteTransitionNameStore

package/src/stores/modules/setting.ts

@@ -0,0 +1,28 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+
+export interface WebConfig {
+  systemName: string
+  routerName: string
+  systemDesc: string
+  homePage: string
+  defaultAvatarUrl: string
+}
+
+//  存放 webConfig 中的 setting 配置
+export const useSettingStore = defineStore('setting', () => {
+  const setting = ref<WebConfig>(undefined)
+  const setSetting = (newSetting: WebConfig) => {
+    setting.value = newSetting
+  }
+  const getSetting = () => {
+    return setting.value
+  }
+
+  return {
+    setSetting,
+    getSetting,
+  }
+})
+
+export default useSettingStore