afs

.env

@@ -2,3 +2,5 @@ VITE_APP_TITLE='科瑞石油技术门户网站'
 
 VITE_DINGTALK_APP_ID='dingmr9ez0ecgbmscfeb'
 
+VITE_DD_CORPID='dingc0dfd4cc2e69187d35c2f4657eb6378f'
+VITE_DD_CLIENTID='dingh3nuuagvbkahgvjh'

auto-imports.d.ts

@@ -6,5 +6,5 @@
 // biome-ignore lint: disable
 export {}
 declare global {
-
+  const ElLoading: typeof import('element-plus/es').ElLoading
 }

src/api/user.ts

@@ -47,3 +47,15 @@ export const ssoLogin = (data: any) => {
     data,
   });
 };
+
+export const dingTalkLogin = (data: {
+  code: string;
+  type: number;
+  state: number;
+}) => {
+  return request.post({
+    url: "/system/auth/h5SocialLogin",
+    data,
+    headers: { "tenant-id": 1 },
+  });
+};

src/components/home/header.vue

@@ -31,6 +31,7 @@
               icon="mdi:bell"
               class="w-5 h-5 text-gray-600 hover:text-[#409EFF]"
             />
+            <span class="text-sm text-gray-600">消息代办</span>
           </div>
           <template #dropdown>
             <el-dropdown-menu class="notification-dropdown">

src/views/index.vue

@@ -66,6 +66,11 @@
 </template>
 
 <script setup lang="ts">
+import { onMounted, ref } from "vue";
+import * as authUtil from "@/utils/auth";
+import * as dd from "dingtalk-jsapi";
+import { ElLoading } from "element-plus";
+import { dingTalkLogin } from "@/api/user";
 import Header from "@components/home/header.vue";
 import CardItem from "@components/home/CardItem.vue";
 import Footer from "@components/home/Footer.vue";
@@ -75,6 +80,8 @@ import img3 from "@/assets/images/3.jpg";
 import bgVideo from "@/assets/bg.mp4";
 import bg2 from "@/assets/images/e4.png";
 import g1 from "@/assets/images/g1.png";
+import { useRouter } from "vue-router";
+const router = useRouter();
 
 type Card = {
   name: string;
@@ -140,6 +147,74 @@ const cards: Card[] = [
     ],
   },
 ];
+
+const loading2 = ref<any>(null);
+const redirect = ref<string>("");
+
+async function loginWithDingTalk() {
+  const ddCorpId = import.meta.env.VITE_DD_CORPID;
+  const ddClientId = import.meta.env.VITE_DD_CLIENTID;
+
+  if (!ddCorpId || !ddClientId) return;
+
+  dd.requestAuthCode({
+    corpId: ddCorpId,
+    clientId: ddClientId,
+    success: (res: any) => {
+      const { code } = res;
+      dingTalkLogin({ code, type: 10, state: new Date().getTime() }).then(
+        async (res) => {
+          console.log("res :>> ", res);
+          loading2.value = ElLoading.service({
+            lock: true,
+            text: "正在加载系统中...",
+            background: "rgba(0, 0, 0, 0.7)",
+          });
+
+          authUtil.setToken(res);
+
+          if (!redirect.value) {
+            redirect.value = "/";
+          }
+          if (redirect.value.indexOf("sso") !== -1) {
+            window.location.href = window.location.href.replace(
+              "/login?redirect=",
+              "",
+            );
+          } else {
+            router
+              .push({
+                path: redirect.value,
+              })
+              .then(() => {
+                loading2.value.close();
+              });
+          }
+        },
+      );
+    },
+    fail: (err: any) => {
+      console.log("err :>> ", err);
+    },
+    complete: () => {
+      console.log("11 :>> ", 11);
+    },
+  });
+}
+
+function dingTalkAutoLogin() {
+  const ua = window.navigator.userAgent.toLowerCase();
+
+  console.log("ua :>> ", ua);
+
+  if (!ua.includes("dingtalk") && !ua.includes("dingtalkwork")) return;
+
+  loginWithDingTalk();
+}
+
+onMounted(() => {
+  dingTalkAutoLogin();
+});
 </script>
 
 <style scoped></style>