添加登录

.env

@@ -6,10 +6,10 @@ VITE_VERSION = 2.4.2.4
 VITE_PORT = 3006
 
 # 网站地址前缀
-VITE_BASE_URL = /art-design-pro/
+VITE_BASE_URL = /
 
 # API 地址前缀
-VITE_API_URL = https://m1.apifoxmock.com/m1/6400575-6097373-default
+VITE_API_URL = https://mzl.dev.hnxinyouhe.com
 
 # 权限模式（ frontend ｜ backend ）
 VITE_ACCESS_MODE = frontend

.env.development

@@ -5,7 +5,10 @@ VITE_BASE_URL = /
 
 # API 地址前缀
 # VITE_API_URL = https://m1.apifoxmock.com/m1/6400575-6097373-default
-VITE_API_URL = http://219.157.255.213:25702
+# VITE_API_URL = http://219.157.255.213:25702
+VITE_API_URL = https://mzl.dev.hnxinyouhe.com
+# VITE_API_URL = https://fdesk.hnxinyouhe.com
+
 
 # Delete console
 VITE_DROP_CONSOLE = false

.env.production

@@ -1,10 +1,10 @@
 # 【生产】环境变量
 
 # 网站地址前缀
-VITE_BASE_URL = /art-design-pro/
+VITE_BASE_URL = /
 
 # API 地址前缀
-VITE_API_URL = https://m1.apifoxmock.com/m1/6400575-6097373-default
+VITE_API_URL = https://mzl.dev.hnxinyouhe.com
 
 # Delete console
 VITE_DROP_CONSOLE = true

index.html

@@ -10,5 +10,6 @@
   <body>
     <div id="app"></div>
     <script type="module" src="/src/main.ts"></script>
+    <script src="https://lf-package-cn.feishucdn.com/obj/feishu-static/lark/passport/qrcode/LarkSSOSDKWebQRCode-1.0.3.js"></script>
   </body>
 </html>

src/App.vue

@@ -23,6 +23,7 @@
 
   onBeforeMount(() => {
     setThemeTransitionClass(true)
+    useUserStore().restoreTokenTimer()
   })
 
   onMounted(() => {

src/api/menuApi.ts

@@ -1,7 +1,7 @@
 import { asyncRoutes } from '@/router/routes/asyncRoutes'
 import { menuDataToRouter } from '@/router/utils/menuToRouter'
 import { AppRouteRecord } from '@/types/router'
-
+import { useUserStore } from '@/store/modules/user'
 interface MenuResponse {
   menuList: AppRouteRecord[]
 }
@@ -10,10 +10,15 @@ interface MenuResponse {
 export const menuService = {
   async getMenuList(delay = 300): Promise<MenuResponse> {
     try {
+      const userStore = useUserStore()
       // 模拟接口返回的菜单数据
-      const menuData = asyncRoutes
+      const menuData = userStore.info.menu
+      const menuData1 = asyncRoutes
       // 处理菜单数据
-      const menuList = menuData.map((route) => menuDataToRouter(route))
+      // const menuList1 = menuData1.map((route) => menuDataToRouter(route))
+      const menuList = menuData.map((route: any) => menuDataToRouter(route))
+      // console.log(menuList1)
+      // console.log(menuList)
       // 模拟接口延迟
       await new Promise((resolve) => setTimeout(resolve, delay))
 

src/api/usersApi.ts

@@ -1,19 +1,53 @@
 import request from '@/utils/http'
 
 export class UserService {
+  //获取公司
+  static getCompanyList() {
+    return request.get<Api.Brand.BrandInfo>({
+      url: '/common/preset/corps'
+    })
+  }
+  //注册
+  static register(params: any) {
+    return request.post<Api.Auth.registerResponse>({
+      url: '/common/auth/register',
+      params
+      // showErrorMessage: false // 不显示错误消息
+    })
+  }
+  //获取 飞书信息
+  static getfeishuAppList(params: { corp_id: string }) {
+    return request.get<Api.Brand.BrandInfo>({
+      url: '/common/preset/feishu/app',
+      params
+    })
+  }
   // 登录
   static login(params: Api.Auth.LoginParams) {
     return request.post<Api.Auth.LoginResponse>({
-      url: '/api/auth/login',
+      url: '/common/auth/login',
       params
       // showErrorMessage: false // 不显示错误消息
     })
   }
+  // 刷新token
+  static refreshToken(params: { refresh_token: string }) {
+    return request.post<any>({
+      url: '/common/auth/refresh/token',
+      params
+    })
+  }
+  //飞书凭证 
+  static getfeishuscope() {
+    return request.get<Api.Auth.Authfeishuscope>({
+      url: '/common/auth/feishu/scope'
+    })
+  }
 
   // 获取用户信息
   static getUserInfo() {
     return request.get<Api.User.UserInfo>({
-      url: '/api/user/info'
+      url: '/common/user/info'
     })
   }
 
@@ -24,4 +58,12 @@ export class UserService {
       params
     })
   }
+
+  //角色 列表
+  static getRoleList(params: Api.Common.PaginatingParams) {
+    return request.get<Api.Role.RoleListData>({
+      url: '/admin/role/list',
+      params
+    })
+  }
 }

src/api/workApi.ts

@@ -8,6 +8,13 @@ export class WorkService {
       params
     })
   }
+  // 获取我的工单列表
+  static getWorkselfList(params: Api.Common.PaginatingParams) {
+    return request.get<Api.Work.WorkListData>({
+      url: '/ticket/ticket/self',
+      params
+    })
+  }
   //添加工单
   static WorkAdd(params: Api.Work.AddParams) {
     return request.post<Api.Work.AddResponse>({

src/components/core/layouts/art-header-bar/index.vue

@@ -24,7 +24,7 @@
         </div>
 
         <!-- 快速入口 -->
-        <ArtFastEnter v-if="width >= 1200" />
+        <!-- <ArtFastEnter v-if="width >= 1200" /> -->
 
         <!-- 面包屑 -->
         <ArtBreadcrumb
@@ -41,7 +41,7 @@
 
       <div class="right">
         <!-- 搜索 -->
-        <div class="search-wrap">
+        <!-- <div class="search-wrap">
           <div class="search-input" @click="openSearchDialog">
             <div class="left">
               <i class="iconfont-sys">&#xe710;</i>
@@ -53,7 +53,7 @@
               <span>k</span>
             </div>
           </div>
-        </div>
+        </div> -->
 
         <!-- 全屏按钮 -->
         <div class="btn-box screen-box" @click="toggleFullScreen">
@@ -65,19 +65,19 @@
           </div>
         </div>
         <!-- 通知 -->
-        <div class="btn-box notice-btn" @click="visibleNotice">
+        <!-- <div class="btn-box notice-btn" @click="visibleNotice">
           <div class="btn notice-button">
             <i class="iconfont-sys notice-btn">&#xe6c2;</i>
             <span class="count notice-btn"></span>
           </div>
-        </div>
+        </div> -->
         <!-- 聊天 -->
-        <div class="btn-box chat-btn" @click="openChat">
+        <!-- <div class="btn-box chat-btn" @click="openChat">
           <div class="btn chat-button">
             <i class="iconfont-sys">&#xe89a;</i>
             <span class="dot"></span>
           </div>
-        </div>
+        </div> -->
         <!-- 语言 -->
         <div class="btn-box" v-if="showLanguage">
           <el-dropdown @command="changeLanguage" popper-class="langDropDownStyle">
@@ -150,7 +150,7 @@
                   </div>
                 </div>
                 <ul class="user-menu">
-                  <li @click="goPage('/system/user-center')">
+                  <!-- <li @click="goPage('/system/user-center')">
                     <i class="menu-icon iconfont-sys">&#xe734;</i>
                     <span class="menu-txt">{{ $t('topBar.user.userCenter') }}</span>
                   </li>
@@ -161,7 +161,7 @@
                   <li @click="toGithub()">
                     <i class="menu-icon iconfont-sys">&#xe8d6;</i>
                     <span class="menu-txt">{{ $t('topBar.user.github') }}</span>
-                  </li>
+                  </li> -->
                   <li @click="lockScreen()">
                     <i class="menu-icon iconfont-sys">&#xe817;</i>
                     <span class="menu-txt">{{ $t('topBar.user.lockScreen') }}</span>

src/components/core/views/login/LoginLeftView.vue

@@ -2,14 +2,15 @@
   <div class="login-left-view">
     <div class="logo">
       <ArtLogo class="icon" />
-      <h1 class="title">{{ AppConfig.systemInfo.name }}</h1>
+      <!-- <h1 class="title">{{ AppConfig.systemInfo.name }}</h1> -->
+      <h1 class="title">新友合系统管理平台</h1>
     </div>
-    <img class="left-bg" src="@imgs/login/lf_bg.webp" />
+    <img class="left-bg" src="@imgs/login/lf_bg.png" />
     <img class="left-img" src="@imgs/login/lf_icon2.webp" />
 
     <div class="text-wrap">
-      <h1> {{ $t('login.leftView.title') }} </h1>
-      <p> {{ $t('login.leftView.subTitle') }} </p>
+      <!-- <h1> {{ $t('login.leftView.title') }} </h1> -->
+      <!-- <p> {{ $t('login.leftView.subTitle') }} </p> -->
     </div>
   </div>
 </template>

src/composables/useCommon.ts

@@ -8,7 +8,8 @@ export function useCommon() {
 
   // 是否是前端控制模式
   const isFrontendMode = computed(() => {
-    return import.meta.env.VITE_ACCESS_MODE === 'frontend'
+    // /（frontend | backend）frontend：前端控制模式 backend：后端控制模式
+    return import.meta.env.VITE_ACCESS_MODE === 'backend'
   })
 
   // 刷新页面

src/config/index.ts

@@ -9,7 +9,7 @@ import { configImages } from './assets/images'
 const appConfig: SystemConfig = {
   // 系统信息
   systemInfo: {
-    name: 'Art Design Pro' // 系统名称
+    name: 'XYH系统管理' // 系统名称
   },
   // Element Plus 主题
   elementPlusTheme: {

src/locales/langs/en.json

@@ -145,7 +145,8 @@
     "success": {
       "title": "Login successful",
       "message": "Welcome back"
-    }
+    },
+    "otherLogin": "Other login methods"
   },
   "forgetPassword": {
     "title": "Forgot password?",

src/locales/langs/zh.json

@@ -141,7 +141,8 @@
     "success": {
       "title": "登录成功",
       "message": "欢迎回来"
-    }
+    },
+    "otherLogin": "其他登录方式"
   },
   "forgetPassword": {
     "title": "忘记密码？",

src/router/index copy 2.ts

@@ -0,0 +1,21 @@
+import type { App } from 'vue'
+import { createRouter, createWebHashHistory } from 'vue-router'
+import { staticRoutes } from './routes/staticRoutes'
+import { configureNProgress } from './utils/utils'
+import { setupBeforeEachGuard } from './guards/beforeEach'
+import { setupAfterEachGuard } from './guards/afterEach'
+
+// 创建路由实例
+export const router = createRouter({
+  history: createWebHashHistory(),
+  routes: staticRoutes, // 静态路由
+  scrollBehavior: () => ({ left: 0, top: 0 }) // 滚动行为
+})
+
+// 初始化路由
+export function initRouter(app: App<Element>): void {
+  configureNProgress() // 顶部进度条
+  setupBeforeEachGuard(router) // 路由前置守卫
+  setupAfterEachGuard(router) // 路由后置守卫
+  app.use(router)
+}

src/router/index.ts

@@ -1,5 +1,5 @@
 import type { App } from 'vue'
-import { createRouter, createWebHashHistory } from 'vue-router'
+import { createRouter, createWebHistory } from 'vue-router'
 import { staticRoutes } from './routes/staticRoutes'
 import { configureNProgress } from './utils/utils'
 import { setupBeforeEachGuard } from './guards/beforeEach'
@@ -7,7 +7,7 @@ import { setupAfterEachGuard } from './guards/afterEach'
 
 // 创建路由实例
 export const router = createRouter({
-  history: createWebHashHistory(),
+  history: createWebHistory(),
   routes: staticRoutes, // 静态路由
   scrollBehavior: () => ({ left: 0, top: 0 }) // 滚动行为
 })

src/router/routes/asyncRoutes.ts

@@ -56,6 +56,7 @@ export const asyncRoutes: AppRouteRecord[] = [
     path: '/work',
     name: 'Work',
     component: RoutesAlias.Home,
+    // component:'/work',
     meta: {
       title: 'menus.work.title',
       icon: '',
@@ -64,7 +65,7 @@ export const asyncRoutes: AppRouteRecord[] = [
     children: [
       {
         path: 'order',
-        name: 'Order',
+        name: '工单列表',
         component: RoutesAlias.Order,
         meta: {
           title: 'menus.work.order',

src/router/routes/staticRoutes.ts

@@ -29,6 +29,12 @@ export const staticRoutes: AppRouteRecordRaw[] = [
     component: () => import('@views/auth/forget-password/index.vue'),
     meta: { title: 'menus.forgetPassword.title', isHideTab: true, noLogin: true, setTheme: true }
   },
+  {
+    path: '/auth/feishu-callback',
+    name: 'FeishuCallback',
+    component: () => import('@/views/auth/feishu-callback.vue'),
+    meta: { title: '飞书回调', noLogin: true, isHideTab: true }
+  },
   {
     path: '/exception',
     component: Home,

src/router/routesAlias.ts

@@ -55,4 +55,5 @@ export enum RoutesAlias {
 }
 
 // 主页路由
-export const HOME_PAGE = RoutesAlias.Dashboard
+// export const HOME_PAGE = RoutesAlias.Dashboard
+export const HOME_PAGE = '/work/order'

src/store/modules/user.ts

@@ -8,6 +8,8 @@ import { AppRouteRecord } from '@/types/router'
 import { setPageTitle } from '@/router/utils/utils'
 import { resetRouterState } from '@/router/guards/beforeEach'
 import { RoutesAlias } from '@/router/routesAlias'
+import { UserService } from '@/api/usersApi' // 新增导入
+let refreshTimeout: ReturnType<typeof setTimeout> | null = null // 定时器变量
 
 // 用户
 export const useUserStore = defineStore(
@@ -21,6 +23,10 @@ export const useUserStore = defineStore(
     const searchHistory = ref<AppRouteRecord[]>([])
     const accessToken = ref('')
     const refreshToken = ref('')
+    const companyid = ref('')
+    const companyabbr = ref('')
+    const loginType = ref<'feishu' | 'upwd'>('upwd')
+    const tokenExpireAt = ref<number>(0)
 
     const getUserInfo = computed(() => info.value)
     const getSettingState = computed(() => useSettingStore().$state)
@@ -38,7 +44,9 @@ export const useUserStore = defineStore(
       setPageTitle(router.currentRoute.value)
       language.value = lang
     }
-
+    const setLoginType = (type: 'feishu' | 'upwd') => {
+      loginType.value = type
+    }
     const setSearchHistory = (list: AppRouteRecord[]) => {
       searchHistory.value = list
     }
@@ -51,11 +59,47 @@ export const useUserStore = defineStore(
       lockPassword.value = password
     }
 
-    const setToken = (newAccessToken: string, newRefreshToken?: string) => {
+    const setToken = (newAccessToken: string, newRefreshToken?: string, expiresIn?: number) => {
       accessToken.value = newAccessToken
       if (newRefreshToken) {
         refreshToken.value = newRefreshToken
       }
+      if (expiresIn) {
+        // 记录绝对过期时间
+        const expireAt = Date.now() + expiresIn * 1000
+        tokenExpireAt.value = expireAt
+        localStorage.setItem('token_expire_at', String(expireAt))
+        scheduleTokenRefresh(expiresIn)
+      }
+    }
+    const setCompany= (id: string, abbr: string) => {
+      companyid.value = id
+      companyabbr.value = abbr
+    }
+    function restoreTokenTimer() {
+      const expireAt = Number(localStorage.getItem('token_expire_at') || '0')
+      if (accessToken.value && expireAt > Date.now()) {
+        const leftSeconds = Math.floor((expireAt - Date.now()) / 1000)
+        scheduleTokenRefresh(leftSeconds)
+      }
+    }
+
+    function scheduleTokenRefresh(expiresIn: number) {
+      if (refreshTimeout) clearTimeout(refreshTimeout)
+      // 提前1分钟刷新
+      const refreshTime = (expiresIn - 60) * 1000
+      if (refreshTime > 0) {
+        refreshTimeout = setTimeout(refreshTokenAction, refreshTime)
+      }
+    }
+
+    async function refreshTokenAction() {
+      try {
+        const { data } = await UserService.refreshToken({ refresh_token: refreshToken.value })
+        setToken(data.access_token, data.refresh_token, data.expires_in)
+      } catch (e) {
+        logOut()
+      }
     }
 
     const logOut = () => {
@@ -65,6 +109,7 @@ export const useUserStore = defineStore(
       lockPassword.value = ''
       accessToken.value = ''
       refreshToken.value = ''
+      if (refreshTimeout) clearTimeout(refreshTimeout) // 清理定时器
       useWorktabStore().opened = []
       sessionStorage.removeItem('iframeRoutes')
       resetRouterState(router)
@@ -77,9 +122,13 @@ export const useUserStore = defineStore(
       isLock,
       lockPassword,
       info,
+      companyid,
+      companyabbr,
       searchHistory,
+      loginType,
       accessToken,
       refreshToken,
+      tokenExpireAt,
       getUserInfo,
       getSettingState,
       getWorktabState,
@@ -90,7 +139,10 @@ export const useUserStore = defineStore(
       setLockStatus,
       setLockPassword,
       setToken,
-      logOut
+      setCompany,
+      setLoginType,
+      logOut,
+      restoreTokenTimer
     }
   },
   {

src/typings/api.d.ts

@@ -35,14 +35,22 @@ declare namespace Api {
   namespace Auth {
     /** 登录参数 */
     interface LoginParams {
-      userName: string
-      password: string
+      account?: string
+      password?: string
+      feishu_code?: string
     }
 
     /** 登录响应 */
     interface LoginResponse {
-      token: string
-      refreshToken: string
+      data: any
+    }
+    /** 登录响应 */
+    interface registerResponse {
+      code: any
+    }
+    /** 授权响应 */
+    interface Authfeishuscope {
+      auth_url: any
     }
   }
 
@@ -57,6 +65,7 @@ declare namespace Api {
       avatar?: string
       email?: string
       phone?: string
+      menu?: any
     }
 
     /** 用户列表数据 */
@@ -130,4 +139,21 @@ declare namespace Api {
       total: number
     }
   }
+  /** 角色 */
+  namespace Role {
+    /** 品牌信息 */
+    interface RoleInfo {
+      data: never[]
+      id: number
+      name: string
+    }
+
+    /** 品牌列表数据 */
+    interface RoleListData {
+      records: RoleInfo[]
+      current: number
+      size: number
+      total: number
+    }
+  }
 }

src/utils/http/error.ts

@@ -6,7 +6,7 @@ import { $t } from '@/locales'
 // 错误响应接口
 export interface ErrorResponse {
   code: number
-  msg: string
+  message: string
   data?: unknown
 }
 
@@ -94,7 +94,7 @@ export function handleError(error: AxiosError<ErrorResponse>): never {
   }
 
   const statusCode = error.response?.status
-  const errorMessage = error.response?.data?.msg || error.message
+  const errorMessage = error.response?.data?.message || error.message
   const requestConfig = error.config
 
   // 处理网络错误
@@ -106,9 +106,10 @@ export function handleError(error: AxiosError<ErrorResponse>): never {
   }
 
   // 处理 HTTP 状态码错误
-  const message = statusCode
-    ? getErrorMessage(statusCode)
-    : errorMessage || $t('httpMsg.requestFailed')
+  // const message = statusCode
+  //   ? getErrorMessage(statusCode)
+  //   : errorMessage || $t('httpMsg.requestFailed')
+  const message = errorMessage
   throw new HttpError(message, statusCode || ApiStatus.error, {
     data: error.response.data,
     url: requestConfig?.url,
@@ -126,7 +127,7 @@ export function showError(error: HttpError, showMessage: boolean = true): void {
     ElMessage.error(error.message)
   }
   // 记录错误日志
-  console.error('[HTTP Error]', error.toLogData())
+  // console.error('[HTTP Error]', error.toLogData())
 }
 
 /**

src/utils/http/index.ts

@@ -45,10 +45,15 @@ axiosInstance.interceptors.request.use(
   (request: InternalAxiosRequestConfig) => {
     const { accessToken } = useUserStore()
     const { language } = useUserStore()
-    request.headers.set('lang', language)
+    const { loginType } = useUserStore()
+    const { companyabbr } = useUserStore()
+    request.headers.set('Fdesk-Language', language)
+    request.headers.set('Fdesk-Corp-Abbr', companyabbr)
+    request.headers.set('Fdesk-System-Code', 'fdesk')
+    request.headers.set('Fdesk-Login-Type', loginType)
     // 设置 token 和 请求头
     if (accessToken) {
-      request.headers.set('Authorization', accessToken)
+      request.headers.set('Fdesk-Auth-Token','Bearer '+accessToken)
       request.headers.set('Content-Type', 'application/json')
     }
 
@@ -76,6 +81,7 @@ axiosInstance.interceptors.response.use(
     }
   },
   (error) => {
+
     return Promise.reject(handleError(error))
   }
 )

src/utils/http/status.ts

@@ -2,8 +2,8 @@
  * 接口状态码
  */
 export enum ApiStatus {
-  // success = 200, // 成功
-  success = 0, // 成功
+  success = 200, // 成功
+  // success = 0, // 成功
   error = 400, // 错误
   unauthorized = 401, // 未授权
   forbidden = 403, // 禁止访问

src/views/auth/feishu-callback.vue

@@ -0,0 +1,57 @@
+<template>
+  <div class="feishu-callback">
+    <div v-if="loading">正在登录，请稍候...</div>
+    <div v-else-if="error">{{ error }}</div>
+    <div v-else>登录成功，正在跳转...</div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { useUserStore } from '@/store/modules/user'
+import { UserService } from '@/api/usersApi'
+
+const loading = ref(true)
+const error = ref('')
+const userStore = useUserStore()
+const router = useRouter()
+onMounted(async () => {
+  const urlParams = new URLSearchParams(window.location.search)
+  const code = urlParams.get('code')
+  const state = urlParams.get('state')
+  if (!code) {
+    error.value = '未获取到飞书授权 code'
+    loading.value = false
+    return
+  }
+  try {
+    // 调用后端接口换 token，接口路径请根据实际情况调整
+    const { data } = await UserService.login({
+        feishu_code: code
+    })
+     // 存储token和用户信息
+    userStore.setToken(data.access_token, data.refresh_token, data.expires_in)
+    const userInfo = await UserService.getUserInfo()
+    userStore.setUserInfo(userInfo)
+    userStore.setLoginStatus(true)
+    router.replace('/')
+  } catch (e: any) {
+    error.value = e?.response?.data?.message || '登录失败，请重试'
+    router.replace('/')
+  } finally {
+    loading.value = false
+  }
+})
+</script>
+
+<style scoped>
+.feishu-callback {
+  min-height: 200px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 18px;
+  color: #333;
+}
+</style> 

src/views/auth/login/index.vue

@@ -27,6 +27,24 @@
             </ElDropdownMenu>
           </template>
         </ElDropdown>
+        <ElDropdown @command="changeCompany" popper-class="langDropDownStyle">
+          <div class="btn language-btn">
+            <i class="iconfont-sys icon-language">&#xe8af;</i>公司
+          </div>
+          <template #dropdown>
+            <ElDropdownMenu>
+              <div v-for="cany in companyList" :key="cany.id" class="lang-btn-item">
+                <ElDropdownItem
+                  :command="cany.id"
+                  :class="{ 'is-selected': companyid === cany.value }"
+                >
+                  <span class="menu-txt">{{ cany.name }}</span>
+                  <i v-if="companyid === cany.id" class="iconfont-sys icon-check">&#xe621;</i>
+                </ElDropdownItem>
+              </div>
+            </ElDropdownMenu>
+          </template>
+        </ElDropdown>
       </div>
       <div class="header">
         <ArtLogo class="icon" />
@@ -34,85 +52,114 @@
       </div>
       <div class="login-wrap">
         <div class="form">
-          <h3 class="title">{{ $t('login.title') }}</h3>
-          <p class="sub-title">{{ $t('login.subTitle') }}</p>
-          <ElForm
-            ref="formRef"
-            :model="formData"
-            :rules="rules"
-            @keyup.enter="handleSubmit"
-            style="margin-top: 25px"
-          >
-            <ElFormItem prop="account">
-              <ElSelect v-model="formData.account" @change="setupAccount" class="account-select">
-                <ElOption
-                  v-for="account in accounts"
-                  :key="account.key"
-                  :label="account.label"
-                  :value="account.key"
-                >
-                  <span>{{ account.label }}</span>
-                </ElOption>
-              </ElSelect>
-            </ElFormItem>
-            <ElFormItem prop="username">
-              <ElInput :placeholder="$t('login.placeholder[0]')" v-model.trim="formData.username" />
-            </ElFormItem>
-            <ElFormItem prop="password">
-              <ElInput
-                :placeholder="$t('login.placeholder[1]')"
-                v-model.trim="formData.password"
-                type="password"
-                radius="8px"
-                autocomplete="off"
-                show-password
-              />
-            </ElFormItem>
-            <div class="drag-verify">
-              <div class="drag-verify-content" :class="{ error: !isPassing && isClickPass }">
-                <ArtDragVerify
-                  ref="dragVerify"
-                  v-model:value="isPassing"
-                  :width="width < 500 ? 328 : 438"
-                  :text="$t('login.sliderText')"
-                  textColor="var(--art-gray-800)"
-                  :successText="$t('login.sliderSuccessText')"
-                  :progressBarBg="getCssVar('--el-color-primary')"
-                  background="var(--art-gray-200)"
-                  handlerBg="var(--art-main-bg-color)"
+          <!-- 登录方式切换 tab -->
+          <div class="login-type-tabs">
+            <span :class="{active: activeLoginType === 'password'}" @click="activeLoginType = 'password'">账号密码登录</span>
+            <span :class="{active: activeLoginType === 'qrcode'}" @click="activeLoginType = 'qrcode'">飞书登录</span>
+          </div>
+          <div v-if="activeLoginType === 'password'">
+            <!-- 原有账号密码登录表单内容 -->
+            <!-- <h3 class="title">{{ $t('login.title') }}</h3> -->
+            <!-- <p class="sub-title">{{ $t('login.subTitle') }}</p> -->
+            <ElForm
+              ref="formRef"
+              :model="formData"
+              :rules="rules"
+              @keyup.enter="handleSubmit"
+              style="margin-top: 25px"
+            >
+              <!-- <ElFormItem prop="account">
+                <ElSelect v-model="formData.account" @change="setupAccount" class="account-select">
+                  <ElOption
+                    v-for="account in accounts"
+                    :key="account.key"
+                    :label="account.label"
+                    :value="account.key"
+                  >
+                    <span>{{ account.label }}</span>
+                  </ElOption>
+                </ElSelect>
+              </ElFormItem> -->
+              <ElFormItem prop="username">
+                <ElInput :placeholder="$t('login.placeholder[0]')" v-model.trim="formData.username" />
+              </ElFormItem>
+              <ElFormItem prop="password">
+                <ElInput
+                  :placeholder="$t('login.placeholder[1]')"
+                  v-model.trim="formData.password"
+                  type="password"
+                  radius="8px"
+                  autocomplete="off"
+                  show-password
                 />
+              </ElFormItem>
+              <div class="drag-verify">
+                <div class="drag-verify-content" :class="{ error: !isPassing && isClickPass }">
+                  <ArtDragVerify
+                    ref="dragVerify"
+                    v-model:value="isPassing"
+                    :width="width < 500 ? 328 : 438"
+                    :text="$t('login.sliderText')"
+                    textColor="var(--art-gray-800)"
+                    :successText="$t('login.sliderSuccessText')"
+                    :progressBarBg="getCssVar('--el-color-primary')"
+                    background="var(--art-gray-200)"
+                    handlerBg="var(--art-main-bg-color)"
+                  />
+                </div>
+                <p class="error-text" :class="{ 'show-error-text': !isPassing && isClickPass }">{{
+                  $t('login.placeholder[2]')
+                }}</p>
               </div>
-              <p class="error-text" :class="{ 'show-error-text': !isPassing && isClickPass }">{{
-                $t('login.placeholder[2]')
-              }}</p>
-            </div>
 
-            <div class="forget-password">
-              <ElCheckbox v-model="formData.rememberPassword">{{
-                $t('login.rememberPwd')
-              }}</ElCheckbox>
-              <RouterLink :to="RoutesAlias.ForgetPassword">{{ $t('login.forgetPwd') }}</RouterLink>
-            </div>
+              <div class="forget-password">
+                <ElCheckbox v-model="formData.rememberPassword">{{
+                  $t('login.rememberPwd')
+                }}</ElCheckbox>
+                <!-- <RouterLink :to="RoutesAlias.ForgetPassword">{{ $t('login.forgetPwd') }}</RouterLink> -->
+              </div>
 
-            <div style="margin-top: 30px">
+              <div style="margin-top: 30px">
+                <ElButton
+                  class="login-btn"
+                  type="primary"
+                  @click="handleSubmit"
+                  :loading="loading"
+                  v-ripple
+                >
+                  {{ $t('login.btnText') }}
+                </ElButton>
+              </div>
+
+              <div class="footer">
+                <p>
+                  {{ $t('login.noAccount') }}
+                  <RouterLink :to="RoutesAlias.Register">{{ $t('login.register') }}</RouterLink>
+                </p>
+              </div>
+            </ElForm>
+          </div>
+          <div v-else>
+            <div  class="qrcode-login"  v-if="!iscompany">请先选择公司</div>
+            <div v-else>
+              <div  class="qrcode-login" v-if="isInFeishu" >
+              <img class="left-bg" src="@imgs/login/feishu.png" />
               <ElButton
                 class="login-btn"
                 type="primary"
-                @click="handleSubmit"
-                :loading="loading"
+                @click="feishuSubmit"
                 v-ripple
               >
-                {{ $t('login.btnText') }}
+              {{ $t('login.btnText') }}
               </ElButton>
             </div>
-
-            <div class="footer">
-              <p>
-                {{ $t('login.noAccount') }}
-                <RouterLink :to="RoutesAlias.Register">{{ $t('login.register') }}</RouterLink>
-              </p>
+            <div  class="qrcode-login" v-else>
+              <div id="login_container"></div>
+              <p class="qrcode-tip">请使用飞书App扫码登录</p>
             </div>
-          </ElForm>
+            </div>
+            
+          </div>
         </div>
       </div>
     </div>
@@ -130,6 +177,7 @@
   import { LanguageEnum, SystemThemeEnum } from '@/enums/appEnum'
   import { useI18n } from 'vue-i18n'
   import { HttpError } from '@/utils/http/error'
+  import { onMounted, ref, watch, nextTick } from 'vue'
 
   defineOptions({ name: 'Login' })
 
@@ -180,10 +228,14 @@
   const router = useRouter()
   const isPassing = ref(false)
   const isClickPass = ref(false)
-
+  const activeLoginType = ref<'password' | 'qrcode'>('qrcode')
+  const isInFeishu = /Lark|Feishu/i.test(navigator.userAgent);
+  // const isInFeishu = true;
   const systemName = AppConfig.systemInfo.name
   const formRef = ref<FormInstance>()
-
+  const companyid = ref('')
+  const iscompany = ref(false)  
+  const feishuresponse=ref()
   const formData = reactive({
     account: '',
     username: '',
@@ -198,17 +250,75 @@
 
   const loading = ref(false)
   const { width } = useWindowSize()
-
-  onMounted(() => {
-    setupAccount('super')
-  })
-
-  // 设置账号
-  const setupAccount = (key: AccountKey) => {
-    const selectedAccount = accounts.value.find((account: Account) => account.key === key)
-    formData.account = key
-    formData.username = selectedAccount?.userName ?? ''
-    formData.password = selectedAccount?.password ?? ''
+  const feishulogin = async () => {
+    userStore.setLoginType('feishu')
+    if (isInFeishu) {
+      
+      // 飞书特定的逻辑
+    } else {
+      // 普通浏览器的逻辑
+      await nextTick()
+      // 等待 SDK 加载
+      const waitForQRLogin = () =>
+        new Promise<void>((resolve) => {
+          const check = () => {
+            // @ts-ignore
+            if (window.QRLogin) resolve()
+            else setTimeout(check, 100)
+          }
+          check()
+        })
+      await waitForQRLogin()
+      // @ts-ignore
+      const container = document.getElementById('login_container')
+      if (container) container.innerHTML = ''
+      // @ts-ignore
+      // 飞书二维码登录参数（请替换为你的实际参数）
+      const fclient_id = feishuresponse.value?.app_id
+      const redirect_uri = feishuresponse.value?.r_url
+      const state = feishuresponse.value?.state
+      const feishuGotoUrl = 'https://passport.feishu.cn/suite/passport/oauth/authorize?client_id='+fclient_id+'&redirect_uri='+redirect_uri+'&response_type=code&state='+state;
+      // @ts-ignore
+      const QRLoginObj = window.QRLogin({
+        id: 'login_container',
+        goto: feishuGotoUrl,
+        width: '250',
+        height: '250',
+        style: 'width:350px;height:350px;border:none'
+      })
+      const handleMessage = function (event: MessageEvent) {
+        if (QRLoginObj.matchOrigin(event.origin) && QRLoginObj.matchData(event.data)) {
+          const loginTmpCode = event.data.tmp_code
+          window.location.href = `${feishuGotoUrl}&tmp_code=${loginTmpCode}`
+        }
+      }
+      window.addEventListener('message', handleMessage, false)
+    }
+  }
+   watch(
+    (activeLoginType as import('vue').Ref<string>),
+    async (val) => {
+      if (val === 'qrcode') {
+        userStore.setLoginType('feishu')
+        if(companyid.value!=''){
+          feishulogin()
+        }
+      }else{
+        userStore.setLoginType('upwd')
+      }
+    },
+    { immediate: true }
+  )
+  //飞书登录
+   const feishuSubmit = async () => {
+    try {
+      const { auth_url } = await UserService.getfeishuscope()
+        window.location.href = auth_url
+    } catch (error) {
+      ElMessage.error('登录失败，请稍后重试')
+    } finally {
+      resetDragVerify()
+    }
   }
 
   // 登录
@@ -231,18 +341,18 @@
       // 登录请求
       const { username, password } = formData
 
-      const { token, refreshToken } = await UserService.login({
-        userName: username,
+      const {  data } = await UserService.login({
+        account: username,
         password
       })
 
       // 验证token
-      if (!token) {
+      if (!data.access_token) {
         throw new Error('Login failed - no token received')
       }
 
       // 存储token和用户信息
-      userStore.setToken(token, refreshToken)
+      userStore.setToken(data.access_token, data.refresh_token, data.expires_in)
       const userInfo = await UserService.getUserInfo()
       userStore.setUserInfo(userInfo)
       userStore.setLoginStatus(true)
@@ -282,7 +392,9 @@
       })
     }, 150)
   }
-
+  onMounted(() => {
+    getcompanyList()
+  })
   // 切换语言
   const { locale } = useI18n()
 
@@ -291,6 +403,33 @@
     locale.value = lang
     userStore.setLanguage(lang)
   }
+  //获取公司 getCompanyList
+  const companyList = ref<any>()
+  const getcompanyList = async () => {
+    try {
+      // 这里调用获取品牌列表的接口
+      const response = await UserService.getCompanyList()
+      companyList.value = response || []
+    } catch (error) { }
+  }
+  //切换公司
+  
+  const changeCompany = (company: any) => {
+    if (companyid.value === company) return
+    const companyt = companyList.value.find((c: any) => c.id === company)
+    companyid.value = company
+    iscompany.value = company
+    userStore.setCompany(company,companyt?.abbr)
+    getfeishuAppList()
+  }
+  const getfeishuAppList = async () => {
+    try {
+      // 这里调用获取品牌列表的接口
+      feishuresponse.value = await UserService.getfeishuAppList({ corp_id: companyid.value })
+      feishulogin()
+      console.log(feishuresponse)
+    } catch (error) { }
+  }
 
   // 切换主题
   import { useTheme } from '@/composables/useTheme'
@@ -304,4 +443,27 @@
 
 <style lang="scss" scoped>
   @use './index';
+  .login-type-tabs {
+    display: flex;
+    justify-content: center;
+    margin-bottom: 20px;
+    span {
+      padding: 8px 24px;
+      cursor: pointer;
+      border-bottom: 2px solid transparent;
+      &.active {
+        color: #409eff;
+        border-bottom: 2px solid #409eff;
+      }
+    }
+  }
+  .qrcode-login {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .qrcode-tip {
+      margin-top: 16px;
+      color: #888;
+    }
+  }
 </style>

src/views/auth/register/index.vue

@@ -39,7 +39,7 @@
               />
             </ElFormItem>
 
-            <ElFormItem prop="agreement">
+            <!-- <ElFormItem prop="agreement">
               <ElCheckbox v-model="formData.agreement">
                 {{ $t('register.agreeText') }}
                 <router-link
@@ -48,7 +48,7 @@
                   >{{ $t('register.privacyPolicy') }}</router-link
                 >
               </ElCheckbox>
-            </ElFormItem>
+            </ElFormItem> -->
 
             <div style="margin-top: 15px">
               <ElButton
@@ -81,6 +81,7 @@
   import { ElMessage } from 'element-plus'
   import type { FormInstance, FormRules } from 'element-plus'
   import { useI18n } from 'vue-i18n'
+  import { UserService } from '@/api/usersApi'
 
   defineOptions({ name: 'Register' })
 
@@ -150,13 +151,27 @@
     try {
       await formRef.value.validate()
       loading.value = true
+      // 注册请求
+      const { username, password,confirmPassword } = formData
 
-      // 模拟注册请求
-      setTimeout(() => {
-        loading.value = false
+      const { code } = await UserService.register({
+        account: username,
+        password,
+        confirm_password:confirmPassword
+      })
+      // 验证token
+      loading.value = false
+      if (code!= 200) {
+        throw new Error('Login failed - no token received')
+      }else{
         ElMessage.success('注册成功')
         toLogin()
-      }, 1000)
+      }
+      
+      // 模拟注册请求
+      // setTimeout(() => {
+      
+      // }, 1000)
     } catch (error) {
       console.log('验证失败', error)
     }

src/views/system/role/index.vue

@@ -11,22 +11,21 @@
       </ElCol>
     </ElRow>
 
-    <ArtTable :data="roleList" index>
+    <ArtTable ref="tableRef" row-key="id" :loading="loading" :data="roleList" :currentPage="pagination.currentPage"
+      :pageSize="pagination.pageSize" :total="pagination.total" @size-change="handleSizeChange"
+      @current-change="handleCurrentChange">
       <template #default>
-        <ElTableColumn label="角色名称" prop="roleName" />
-        <ElTableColumn label="角色编码" prop="roleCode" />
-        <ElTableColumn label="描述" prop="des" />
+        <ElTableColumn label="角色名称" prop="name" />
+        <ElTableColumn label="角色编码" prop="id" />
+        <ElTableColumn label="描述" prop="desc" />
         <ElTableColumn label="启用" prop="enable">
           <template #default="scope">
-            <ElTag :type="scope.row.enable ? 'primary' : 'info'">
-              {{ scope.row.enable ? '启用' : '禁用' }}
+            <ElTag :type="scope.row.status ? 'primary' : 'info'">
+              {{ scope.row.status ? '启用' : '禁用' }}
             </ElTag>
           </template>
         </ElTableColumn>
-        <ElTableColumn label="创建时间" prop="date">
-          <template #default="scope">
-            {{ formatDate(scope.row.date) }}
-          </template>
+        <ElTableColumn label="创建时间" prop="created_at">
         </ElTableColumn>
         <ElTableColumn fixed="right" label="操作" width="200px">
           <template #default="scope">
@@ -122,9 +121,10 @@
   import { ElMessage, ElMessageBox } from 'element-plus'
   import type { FormInstance, FormRules } from 'element-plus'
   import { formatMenuTitle } from '@/router/utils/utils'
+  import { UserService } from '@/api/usersApi'
   // import { ButtonMoreItem } from '@/components/core/forms/ArtButtonMore.vue'
   import { Role, ROLE_LIST_DATA } from '@/mock/temp/formData'
-
+  const loading = ref(false)
   defineOptions({ name: 'Role' })
 
   const dialogVisible = ref(false)
@@ -133,7 +133,11 @@
   const treeRef = ref()
   const isExpandAll = ref(true)
   const isSelectAll = ref(false)
-
+  const pagination = reactive({
+    currentPage: 1,
+    pageSize: 10,
+    total: 0
+  })
   // 处理菜单数据，将 authList 转换为子节点
   const processedMenuList = computed(() => {
     const processNode = (node: any) => {
@@ -188,10 +192,39 @@
     getTableData()
   })
 
-  const getTableData = () => {
-    roleList.value = ROLE_LIST_DATA
-  }
+  // const getTableData = () => {
+  //   roleList.value = ROLE_LIST_DATA
+  // }
+  // 获取列表数据
+const getTableData = async () => {
+  loading.value = true
+  try {
+    const { currentPage, pageSize } = pagination
 
+    const { records, current, size, total } = await UserService.getRoleList({
+      current: currentPage,
+      size: pageSize
+    })
+    roleList.value = records.map((item: any, index: number) => ({
+      ...item
+    }))
+    Object.assign(pagination, { currentPage: current, pageSize: size, total })
+  } catch (error) {
+    console.error('获取用户列表失败:', error)
+  } finally {
+    loading.value = false
+  }
+}
+// 处理表格分页变化
+const handleSizeChange = (newPageSize: number) => {
+  pagination.pageSize = newPageSize
+  getTableData()
+}
+
+const handleCurrentChange = (newCurrentPage: number) => {
+  pagination.currentPage = newCurrentPage
+  getTableData()
+}
   const dialogType = ref('add')
 
   const showDialog = (type: string, row?: any) => {
@@ -213,16 +246,6 @@
     }
   }
 
-  // const buttonMoreClick = (item: ButtonMoreItem, row: any) => {
-  //   if (item.key === 'permission') {
-  //     showPermissionDialog()
-  //   } else if (item.key === 'edit') {
-  //     showDialog('edit', row)
-  //   } else if (item.key === 'delete') {
-  //     deleteRole()
-  //   }
-  // }
-
   const showPermissionDialog = () => {
     permissionDialog.value = true
   }

src/views/work/myOrder/index.vue

@@ -0,0 +1,662 @@
+<template>
+  <div class="page-content">
+    <ElRow>
+      <!-- <ElCol :xs="24" :sm="12" :lg="6">
+        <ElInput placeholder="工单编号"></ElInput>
+      </ElCol> -->
+      <div style="width: 12px"></div>
+      <ElCol :xs="24" :sm="12" :lg="6" class="el-col2">
+        <!-- <ElButton v-ripple>搜索</ElButton> -->
+        <ElButton v-if="hasAuth('work_order_self@add')" @click="showDialog('add')" v-ripple>新增</ElButton>
+      </ElCol>
+    </ElRow>
+
+    <ArtTable ref="tableRef" row-key="id" :loading="loading" :data="tableData" :currentPage="pagination.currentPage"
+      :pageSize="pagination.pageSize" :total="pagination.total" @size-change="handleSizeChange"
+      @current-change="handleCurrentChange">
+      <template #default>
+        <ElTableColumn label="工单编号" prop="code" />
+        <ElTableColumn label="问题分类" prop="categorie_id">
+          <template #default="scope">
+            <div v-html="scope.row.categorie?scope.row.categorie.name:''"></div>
+          </template>
+        </ElTableColumn>
+        <ElTableColumn label="问题描述" prop="content">
+          <template #default="scope">
+            <div v-html="scope.row.content"></div>
+          </template>
+        </ElTableColumn>
+        <ElTableColumn label="状态" prop="status">
+          <template #default="scope">
+            <ElTag :type="scope.row.status == 1 ? 'info' : scope.row.status == 2 ?'primary' :scope.row.status == 4 ?'success' : 'danger'">
+              {{ scope.row.status == 1 ? '待受理' : scope.row.status == 2 ? '处理中' : 
+                scope.row.status == 4 ? "已完成":'关闭' }}
+            </ElTag>
+          </template>
+        </ElTableColumn>
+        <ElTableColumn label="创建时间" prop="created_at" />
+        <ElTableColumn fixed="right" label="操作" width="240px">
+          <template #default="scope">
+            <ElRow>
+              <el-button v-if="scope.row.status == 1&&hasAuth('work_order_self@edit')" link @click="showDialog('edit', scope.row)"> 编辑 </el-button>
+              <el-button v-if="hasAuth('work_order_self@status')" link @click="statusEdit(scope.row)"> 状态编辑 </el-button>
+              <el-button v-if="hasAuth('work_order_self@conversation_list')" link @click="openChat(scope.row)"> 查看/回复 </el-button>
+              <!-- <el-button link @click="deleteRole()"> 删除 </el-button> -->
+            </ElRow>
+          </template>
+        </ElTableColumn>
+      </template>
+    </ArtTable>
+
+    <ElDialog v-model="dialogVisible" :title="dialogType === 'add' ? '新增' : '编辑'" width="60%" align-center>
+      <ElForm ref="formRef" :model="form" label-width="160px">
+        <ElFormItem label="问题分类" prop="categorie_id">
+          <ElSelect v-model="form.categorie_id">
+            <ElOption v-for="type in categorieSelectList" :key="type.id" :value="type.id" :label="type.name" />
+          </ElSelect>
+        </ElFormItem>
+        <ElFormItem label="问题描述" prop="content">
+          <!-- <ElInput v-model="form.des" type="textarea" :rows="3" /> -->
+          <!-- 富文本编辑器 -->
+          <ArtWangEditor class="el-top" v-model="editorHtml" />
+        </ElFormItem>
+        <ElFormItem label="上传附件" prop="attachment">
+          <ElUpload 
+            v-model:file-list="fileList" 
+            class="upload-demo" 
+            :action="actionImageUplode" 
+            :on-success="handleUploadSuccess"
+            multiple 
+            :limit="3">
+            <el-button type="primary">Click to upload</el-button>
+          </ElUpload>
+          <!-- 附件预览区 -->
+          <div class="attachment-preview" v-if="fileList.length">
+            <div class="attachment-list">
+              <div v-for="(file, idx) in fileList" :key="file.name" class="attachment-item">
+                <template v-if="/\.(jpg|jpeg|png|gif|webp|bmp)$/i.test(file.name)">
+                  <img :src="file.file_url?file.file_url:file.response.data.file_url" :alt="file.name" class="attachment-thumb" @click="handleImageClick(imageList.findIndex(url => url === file.file_url?file.file_url:file.response.data.file_url))" />
+                </template>
+                <template v-else-if="/\.(mp4|webm|ogg)$/i.test(file.name)">
+                  <video :src="file.file_url?file.file_url:file.response.data.file_url" controls class="attachment-thumb" @click.prevent="handleVideoClick(file.file_url?file.file_url:file.response.data.file_url)"></video>
+                </template>
+                <template v-else>
+                  <a :href="file.file_url?file.file_url:file.response.data.file_url" target="_blank">{{ file.name }}</a>
+                </template>
+                <div class="attachment-filename">{{ file.name }}</div>
+              </div>
+            </div>
+          </div>
+        </ElFormItem>
+      </ElForm>
+      <template #footer>
+        <div class="dialog-footer">
+          <ElButton @click="dialogVisible = false">取消</ElButton>
+          <ElButton type="primary" @click="handleSubmit(formRef)">提交</ElButton>
+        </div>
+      </template>
+    </ElDialog>
+    <el-drawer v-model="isDrawerVisible" :size="isMobile ? '100%' : '480px'" :with-header="false">
+      <div class="chat-container">
+        <div class="header">
+          <div class="header-left">
+            <span class="name">工单记录</span>
+          </div>
+          <div class="header-right">
+            <el-icon class="icon-close" :size="20" @click="closeChat">
+              <Close />
+            </el-icon>
+          </div>
+        </div>
+        <!-- 聊天消息区域 -->
+        <div class="chat-messages" ref="messageContainer">
+          <template v-for="(message, index) in messages" :key="index">
+            <div :class="['message-item', message.isMe ? 'message-right' : 'message-left']">
+              <el-avatar :size="32" :src="message.isMe ? meAvatar : aiAvatar" class="message-avatar" />
+              <div class="message-content">
+                <div class="message-info">
+                  <span class="sender-name">{{ message.user_id }}</span>
+                  <span class="message-time">{{ message.updated_at }}</span>
+                </div>
+                <div class="message-text">{{ message.content }}</div>
+              </div>
+            </div>
+          </template>
+        </div>
+        <div class="chat-input" v-if="hasAuth('work_order_self@conversation_add')">
+          <el-input v-model="messageText" type="textarea" :rows="3" placeholder="输入消息" resize="none"
+            @keyup.enter.prevent="sendMessage" />
+          <ElInput v-model="ticket_id" type="hidden" />
+          <div class="chat-input-actions">
+            <el-button type="primary" @click="sendMessage" v-ripple>发送</el-button>
+          </div>
+        </div>
+
+      </div>
+    </el-drawer>
+
+    <ElDialog v-model="dialogVisiblestatus" title="工单状态" width="40%" align-center>
+      <ElForm ref="formRef" :model="statusform" label-width="120px">
+        <ElFormItem label="状态" prop="status">
+          <ElSelect v-model="statusform.status">
+            <ElOption v-for="type in statusList" :key="type.value" :value="type.value" :label="type.text" />
+          </ElSelect>
+        </ElFormItem>
+        <ElFormItem label="描述" prop="msg">
+          <ElInput v-model="statusform.msg" type="textarea" :rows="3" />
+        </ElFormItem>
+      </ElForm>
+      <template #footer>
+        <div class="dialog-footer">
+          <ElButton @click="dialogVisiblestatus = false">取消</ElButton>
+          <ElButton type="primary" @click="statusSubmit()">提交</ElButton>
+        </div>
+      </template>
+    </ElDialog>
+
+    <!-- 图片预览弹窗 -->
+    <ElImageViewer v-if="imageViewerVisible" :url-list="imageList" :initial-index="imageViewerIndex" @close="imageViewerVisible = false" />
+    <!-- 视频预览弹窗 -->
+    <ElDialog v-model="videoDialogVisible" width="60%" top="10vh" :show-close="true" append-to-body>
+      <video v-if="currentVideoUrl" :src="currentVideoUrl" controls autoplay style="width:100%;max-height:70vh;display:block;"></video>
+    </ElDialog>
+
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { FormInstance } from 'element-plus'
+import { Order } from '@/mock/temp/formData'
+import { WorkService } from '@/api/workApi'
+import { ElImageViewer } from 'element-plus'
+import { useAuth } from "@/composables/useAuth";
+const { hasAuth } = useAuth();
+defineOptions({ name: 'Order' })
+let actionImageUplode = `${import.meta.env.VITE_API_URL}/ticket/upload`
+const loading = ref(false)
+const editorHtml = ref('') // 编辑器内容
+const dialogVisible = ref(false)
+const dialogVisiblestatus = ref(false)
+const typeList = ref<any[]>([])
+const formRef = ref<FormInstance>()
+const { width } = useWindowSize()
+const isMobile = computed(() => width.value < 500)
+// 抽屉显示状态
+const isDrawerVisible = ref(false)
+import meAvatar from '@/assets/img/avatar/avatar5.webp'
+import aiAvatar from '@/assets/img/avatar/avatar10.webp'
+// 消息相关数据
+const messages = ref<any[]>([])
+const messageText = ref('')
+// 滚动到底部
+const messageContainer = ref<HTMLElement | null>(null)
+const scrollToBottom = () => {
+  setTimeout(() => {
+    if (messageContainer.value) {
+      messageContainer.value.scrollTop = messageContainer.value.scrollHeight
+    }
+  }, 100)
+}
+const openChat = (row: any) => {
+  isDrawerVisible.value = true
+  getConversationList(row.id)
+}
+
+const closeChat = () => {
+  isDrawerVisible.value = false
+}
+//获取状态 下拉框 getStatus
+const statusList = ref<any>()
+const getstatusList = async () => {
+  try {
+    // 这里调用获取品牌列表的接口
+    const response = await WorkService.getStatus()
+    statusList.value = response || []
+  } catch (error) { }
+}
+//获取工单分类
+const categorieSelectList = ref<any>()
+const getcategorieSelectList = async () => {
+  try {
+    // 这里调用获取品牌列表的接口
+    const response = await WorkService.getcategorieselect()
+    categorieSelectList.value = response || []
+  } catch (error) { }
+}
+
+
+
+const fileList = ref<any[]>([])
+const form = reactive<Order>({
+  id: '',
+  categorie_id: '',
+  content: '',
+  attachment: []
+})
+const pagination = reactive({
+  currentPage: 1,
+  pageSize: 10,
+  total: 0
+})
+const paginationmsg = reactive({
+  currentPage: 1,
+  pageSize: 10,
+  total: 0
+})
+// 表格数据
+const tableData = ref<any[]>([])
+
+// 表格实例引用
+const tableRef = ref()
+
+onMounted(() => {
+  getWorkList()
+})
+
+// 获取列表数据
+const getWorkList = async () => {
+  loading.value = true
+  try {
+    const { currentPage, pageSize } = pagination
+
+    const { data, current, size, total } = await WorkService.getWorkselfList({
+      current: currentPage,
+      size: pageSize
+    })
+    tableData.value = data.map((item: any, index: number) => ({
+      ...item
+    }))
+    Object.assign(pagination, { currentPage: current, pageSize: size, total })
+  } catch (error) {
+    console.error('获取用户列表失败:', error)
+  } finally {
+    loading.value = false
+  }
+}
+
+//获取工单记录 getconversationList
+const ticket_id =ref()
+const getConversationList = async (id:any) => {
+  loading.value = true
+  try {
+    const { currentPage, pageSize } = paginationmsg
+    ticket_id.value = id
+    const { data, current, size, total } = await WorkService.getconversationList({
+      current: currentPage,
+      size: pageSize,
+      ticket_id: id
+    })
+    messages.value = data.map((item: any, index: number) => ({
+      ...item
+    }))
+    Object.assign(paginationmsg, { currentPage: current, pageSize: size, total })
+  } catch (error) {
+    console.error('获取用户列表失败:', error)
+  } finally {
+    loading.value = false
+  }
+}
+// 发送工单记录消息
+const sendMessage = async () => {
+  const text = messageText.value.trim()
+  const ids = ticket_id.value
+  if (!text) return
+  
+  const { message } = await WorkService.conversationAdd({
+    content: text,
+    ticket_id: ids,
+  })
+  ElMessage.success(message)
+  messageText.value = ''
+  getConversationList(ids)
+  scrollToBottom()
+}    
+
+
+const dialogType = ref('add')
+
+const showDialog = (type: string, row?: any) => {
+  dialogVisible.value = true
+  dialogType.value = type
+  getcategorieSelectList()
+  if (type === 'edit' && row) {
+    form.id = row.id
+    form.categorie_id = row.categorie_id
+    form.content = row.content
+    editorHtml.value = row.content
+    // 回显附件
+    fileList.value = (row.attachments || []).map((item: { original_name: any; storage_path_full: any }) => ({
+      name: item.original_name,
+      file_url: item.storage_path_full,
+      status: 'success',
+      response: { data: item }
+    }))
+    // 如果你有 uploadedFiles 也要同步
+    uploadedFiles.value = row.attachments || []
+  } else {
+    // 新增时清空表单和上传文件
+    form.categorie_id = ''
+    form.content = ''
+    editorHtml.value = ''
+    fileList.value = []
+    uploadedFiles.value = []
+  }
+}
+
+const statusform = reactive({
+  id: '',
+  status: '',
+  msg: ''
+})
+
+const statusEdit = (row: any) => {
+  getstatusList()
+  dialogVisiblestatus.value = true
+  statusform.id = row.id
+}
+const deleteRole = () => {
+  ElMessageBox.confirm('确定删除该角色吗？', '删除确认', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'error'
+  }).then(() => {
+    ElMessage.success('删除成功')
+  })
+}
+const delCodeTrim = (content: string): string => {
+  return content.replace(/(\s*)<\/code>/g, '</code>')
+}
+//添加工单
+
+const uploadedFiles = ref<any[]>([])
+const handleUploadSuccess = (response: any, uploadFile: any, uploadFiles: any[]) => {
+  // 只处理上传成功的文件
+  uploadedFiles.value = uploadFiles.filter(item => item.status === 'success').map(item => {
+      const data = item.response?.data
+      if (data) {
+        return {
+          id: data.id?data.id:'',
+          original_name: data.original_name,
+          storage_path: data.storage_path?data.storage_path:data.file_name
+        }
+      }
+      return null
+    })
+    .filter(Boolean)
+}
+const handleSubmit = async (formEl: FormInstance | undefined) => {
+  const { categorie_id} = form
+  editorHtml.value = delCodeTrim(editorHtml.value)
+  if(dialogType.value === 'add'){
+    const { message } = await WorkService.WorkAdd({
+      content: editorHtml.value,
+      categorie_id: categorie_id,
+      attachment:uploadedFiles.value
+    })
+    ElMessage.success(message)
+    dialogVisible.value = false
+    getWorkList()
+  }else{
+    const { message } = await WorkService.Workedit({
+      id:form.id,
+      content: editorHtml.value,
+      categorie_id: categorie_id,
+      attachment:uploadedFiles.value
+    })
+    ElMessage.success(message)
+    dialogVisible.value = false
+    getWorkList()
+  }
+  
+
+}
+// 处理表格分页变化
+const handleSizeChange = (newPageSize: number) => {
+  pagination.pageSize = newPageSize
+  getWorkList()
+}
+
+const handleCurrentChange = (newCurrentPage: number) => {
+  pagination.currentPage = newCurrentPage
+  getWorkList()
+}
+//修改状态
+const statusSubmit = async () => {
+  // loading.value = true
+  const { msg, status, id } = statusform
+  const { message } = await WorkService.Workstatus({
+    id,
+    msg,
+    status
+  })
+  ElMessage.success(message)
+  dialogVisiblestatus.value = false
+  getWorkList()
+}
+
+// 图片预览相关
+const imageViewerVisible = ref(false)
+const imageViewerIndex = ref(0)
+const imageList = computed(() => fileList.value.filter(file => /\.(jpg|jpeg|png|gif|webp|bmp)$/i.test(file.name)).map(file => file.file_url?file.file_url:file.response.data.file_url))
+function handleImageClick(idx: number) {
+  imageViewerIndex.value = idx
+  imageViewerVisible.value = true
+}
+// 视频预览相关
+const videoDialogVisible = ref(false)
+const currentVideoUrl = ref('')
+function handleVideoClick(url: string) {
+  currentVideoUrl.value = url
+  videoDialogVisible.value = true
+}
+</script>
+
+<style lang="scss" scoped>
+.page-content {
+  .svg-icon {
+    width: 1.8em;
+    height: 1.8em;
+    overflow: hidden;
+    vertical-align: -8px;
+    fill: currentcolor;
+  }
+}
+
+.header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 20px;
+
+  .header-left {
+    .name {
+      font-size: 16px;
+      font-weight: 500;
+    }
+  }
+
+  .header-right {
+    .icon-close {
+      cursor: pointer;
+    }
+  }
+}
+
+.chat-container {
+  display: flex;
+  flex-direction: column;
+  height: calc(100% - 70px);
+
+  .chat-messages {
+    flex: 1;
+    padding: 30px 16px;
+    overflow-y: auto;
+    border-top: 1px solid var(--el-border-color-lighter);
+
+    &::-webkit-scrollbar {
+      width: 5px !important;
+    }
+
+    .message-item {
+      display: flex;
+      flex-direction: row;
+      gap: 8px;
+      align-items: flex-start;
+      width: 100%;
+      margin-bottom: 30px;
+
+      .message-text {
+        font-size: 14px;
+        color: var(--art-gray-900);
+        border-radius: 6px;
+      }
+
+      &.message-left {
+        justify-content: flex-start;
+
+        .message-content {
+          align-items: flex-start;
+
+          .message-info {
+            flex-direction: row;
+          }
+
+          .message-text {
+            background-color: #f8f5ff;
+          }
+        }
+      }
+
+      &.message-right {
+        flex-direction: row-reverse;
+
+        .message-content {
+          align-items: flex-end;
+
+          .message-info {
+            flex-direction: row-reverse;
+          }
+
+          .message-text {
+            background-color: #e9f3ff;
+          }
+        }
+      }
+
+      .message-avatar {
+        flex-shrink: 0;
+      }
+
+      .message-content {
+        display: flex;
+        flex-direction: column;
+        max-width: 70%;
+
+        .message-info {
+          display: flex;
+          gap: 8px;
+          margin-bottom: 4px;
+          font-size: 12px;
+
+          .message-time {
+            color: var(--el-text-color-secondary);
+          }
+
+          .sender-name {
+            font-weight: 500;
+          }
+        }
+
+        .message-text {
+          padding: 10px 14px;
+          line-height: 1.4;
+        }
+      }
+    }
+  }
+
+  .chat-input {
+    padding: 16px 16px 0;
+
+    .input-actions {
+      display: flex;
+      gap: 8px;
+      padding: 8px 0;
+    }
+
+    .chat-input-actions {
+      display: flex;
+      align-items: center; // 修正为单数
+      justify-content: right;
+      margin-top: 12px;
+
+      // 确保发送按钮与输入框对齐
+      el-button {
+        min-width: 80px;
+      }
+    }
+  }
+}
+
+.dark {
+  .chat-container {
+    .chat-messages {
+      .message-item {
+        &.message-left {
+          .message-text {
+            background-color: #232323 !important;
+          }
+        }
+
+        &.message-right {
+          .message-text {
+            background-color: #182331 !important;
+          }
+        }
+      }
+    }
+  }
+}
+
+.attachment-preview {
+  margin-top: 12px;
+  .attachment-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 16px;
+  }
+  .attachment-item {
+    width: 130px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    background: #fafbfc;
+    border-radius: 8px;
+    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
+    padding: 10px 8px 6px 8px;
+    transition: box-shadow 0.2s, transform 0.2s;
+    cursor: pointer;
+    &:hover {
+      box-shadow: 0 4px 16px rgba(0,0,0,0.10);
+      transform: translateY(-2px) scale(1.03);
+    }
+  }
+  .attachment-thumb {
+    max-width: 110px;
+    max-height: 90px;
+    border-radius: 4px;
+    border: 1px solid #eee;
+    margin-bottom: 6px;
+    object-fit: cover;
+    background: #fff;
+  }
+  .attachment-filename {
+    font-size: 12px;
+    color: #666;
+    text-align: center;
+    word-break: break-all;
+    margin-top: 2px;
+  }
+}
+</style>

src/views/work/order/index.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="page-content">
     <ElRow>
-      <ElCol :xs="24" :sm="12" :lg="6">
+      <!-- <ElCol :xs="24" :sm="12" :lg="6">
         <ElInput placeholder="工单编号"></ElInput>
-      </ElCol>
+      </ElCol> -->
       <div style="width: 12px"></div>
       <ElCol :xs="24" :sm="12" :lg="6" class="el-col2">
-        <ElButton v-ripple>搜索</ElButton>
-        <ElButton @click="showDialog('add')" v-ripple>新增</ElButton>
+        <!-- <ElButton v-ripple>搜索</ElButton> -->
+        <ElButton v-if="hasAuth('work_order@add')" @click="showDialog('add')" v-ripple>新增</ElButton>
       </ElCol>
     </ElRow>
 
@@ -35,12 +35,12 @@
           </template>
         </ElTableColumn>
         <ElTableColumn label="创建时间" prop="created_at" />
-        <ElTableColumn fixed="right" label="操作" width="260px">
+        <ElTableColumn fixed="right" label="操作" width="240px">
           <template #default="scope">
             <ElRow>
-              <el-button v-if="scope.row.status == 1" link @click="showDialog('edit', scope.row)"> 编辑 </el-button>
-              <el-button link @click="statusEdit(scope.row)"> 状态编辑 </el-button>
-              <el-button link @click="openChat(scope.row)"> 查看/回复 </el-button>
+              <el-button v-if="scope.row.status == 1&&hasAuth('work_order@edit')" link @click="showDialog('edit', scope.row)"> 编辑 </el-button>
+              <el-button v-if="hasAuth('work_order@status')" link @click="statusEdit(scope.row)"> 状态编辑 </el-button>
+              <el-button v-if="hasAuth('work_order@conversation_list')" link @click="openChat(scope.row)"> 查看/回复 </el-button>
               <!-- <el-button link @click="deleteRole()"> 删除 </el-button> -->
             </ElRow>
           </template>
@@ -123,7 +123,7 @@
             </div>
           </template>
         </div>
-        <div class="chat-input">
+        <div class="chat-input"  v-if="hasAuth('work_order@conversation_add')">
           <el-input v-model="messageText" type="textarea" :rows="3" placeholder="输入消息" resize="none"
             @keyup.enter.prevent="sendMessage" />
           <ElInput v-model="ticket_id" type="hidden" />
@@ -170,6 +170,8 @@ import type { FormInstance } from 'element-plus'
 import { Order } from '@/mock/temp/formData'
 import { WorkService } from '@/api/workApi'
 import { ElImageViewer } from 'element-plus'
+import { useAuth } from "@/composables/useAuth";
+const { hasAuth } = useAuth();
 defineOptions({ name: 'Order' })
 let actionImageUplode = `${import.meta.env.VITE_API_URL}/ticket/upload`
 const loading = ref(false)
@@ -367,10 +369,10 @@ const delCodeTrim = (content: string): string => {
 }
 //添加工单
 
-const uploadedFiles = ref([])
-const handleUploadSuccess = (response: any, file: any, fileList: { filter: (arg0: (item: any) => boolean) => { (): any; new(): any; map: { (arg0: (item: any) => { original_name: any; storage_path: any } | null): { (): any; new(): any; filter: { (arg0: BooleanConstructor): never[]; new(): any } }; new(): any } } }) => {
+const uploadedFiles = ref<any[]>([])
+const handleUploadSuccess = (response: any, uploadFile: any, uploadFiles: any[]) => {
   // 只处理上传成功的文件
-  uploadedFiles.value = fileList.filter(item => item.status === 'success').map(item => {
+  uploadedFiles.value = uploadFiles.filter(item => item.status === 'success').map(item => {
       const data = item.response?.data
       if (data) {
         return {

src/views/work/type/index.vue

@@ -1,12 +1,12 @@
 <template>
     <div class="page-content">
       <ElRow>
-        <ElCol :xs="24" :sm="12" :lg="6">
+        <!-- <ElCol :xs="24" :sm="12" :lg="6">
           <ElInput placeholder="名称"></ElInput>
-        </ElCol>
+        </ElCol> -->
         <div style="width: 12px"></div>
         <ElCol :xs="24" :sm="12" :lg="6" class="el-col2">
-          <ElButton v-ripple>搜索</ElButton>
+          <!-- <ElButton v-ripple>搜索</ElButton> -->
           <ElButton @click="showDialog('add')" v-ripple>新增</ElButton>
         </ElCol>
       </ElRow>

vite.config.ts

@@ -34,7 +34,10 @@ export default ({ mode }) => {
           rewrite: (path) => path.replace(/^\/api/, '')
         }
       },
-      host: true
+      host: true,
+      allowedHosts: [
+        'web.dp.muzili.top'
+      ]
     },
     // 路径别名
     resolve: {