From c8d75ab72a51bc3d8d591114f6b2a051bc13a733 Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Mon, 16 Dec 2024 16:58:21 +0800
Subject: [PATCH] =?UTF-8?q?feat(project):=20=E6=B7=BB=E5=8A=A0=20AppSign?=
 =?UTF-8?q?=20=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 实现了一个新的登录页面组件，包含左侧背景和右侧登录表单
- 集成了 logo、系统名称、描述等动态内容
- 添加了微信扫码登录功能
- 优化了响应式布局，适配不同屏幕尺寸
---
 project/xumu/sign/AppSign.vue | 155 ++++++++++++++++++++++++++++++++++
 1 file changed, 155 insertions(+)
 create mode 100644 project/xumu/sign/AppSign.vue

diff --git a/project/xumu/sign/AppSign.vue b/project/xumu/sign/AppSign.vue
new file mode 100644
index 00000000..a2121ded
--- /dev/null
+++ b/project/xumu/sign/AppSign.vue
@@ -0,0 +1,155 @@
+<template>
+  <section class="AppSign">
+    <div class="left signLeftBg">
+      <el-row type="flex" align="middle">
+        <img class="AiIcon" v-if="/[\\\/]/.test(logo.icon)" :src="logo.icon" alt="" />
+        <ai-icon v-else type="logo" :icon="logo.icon" />
+        <div v-if="logo.text" class="logoText mar-l8" v-text="logo.text" />
+      </el-row>
+      <div class="signLeftContent">
+        <div class="titlePane">
+          <b v-text="system.name" />
+          <div v-text="system.title" />
+        </div>
+        <div class="subTitle" v-for="(t, i) in subTitles" :key="i" v-html="t" />
+      </div>
+    </div>
+    <div class="right">
+      <div class="projectName mar-b48" :title="system.fullTitle">{{ system.fullTitle }}</div>
+      <ai-sign isSignIn @login="login" :instance="instance" visible
+        :showScanLogin="system.edition == 'standard' || !system.edition" />
+      <el-row type="flex" align="middle" class="bottomRecord">
+        <div v-if="system.recordDesc" v-text="system.recordDesc" />
+        <el-link v-if="system.recordNo" v-text="system.recordNo" :href="system.recordURL" />
+        <div v-if="system.ssl" v-html="system.ssl" />
+      </el-row>
+    </div>
+  </section>
+</template>
+
+<script>
+import { mapMutations, mapState } from 'vuex'
+
+export default {
+  name: "AppSign",
+  computed: {
+    ...mapState(['user', 'sys']),
+    instance: v => v.$request,
+    system: v => v.sys?.info || {
+      fullTitle: '武汉中卫慧通科技有限公司'
+    },
+    subTitles() {
+      let list = [
+        "构建全域数字大脑，助力政府科学决策",
+        "全域统一应用入口，移动办公高效协同",
+        "直接触达居民微信，政民互动“零距离”"
+      ]
+      return (typeof this.system.desc == "object" ? this.system.desc : JSON.parse(this.system.desc || null)) || list
+    },
+    logo: v => !!v.system.loginLogo ? { icon: v.system.loginLogo, text: v.system.loginLogoText } : { icon: v.system.logo, text: v.system.logoText },
+    isDev: () => process.env.NODE_ENV == "development",
+    isAdmin: v => v.$route.hash == "#sinoecare" //用来判断是否是管理员登录
+  },
+  created() {
+    if (this.user.token) {
+      this.handleGotoHome()
+    } else {
+      const { code } = this.$route.query
+      if (code) {
+        this.toLogin(code)
+      }
+    }
+  },
+  methods: {
+    ...mapMutations(['setToken']),
+    login(data) {
+      if (data?.access_token) {
+        this.setToken([data.token_type, data.access_token].join(" "))
+        this.handleGotoHome()
+      }
+    },
+    handleGotoHome() {
+      this.$message.success("登录成功!")
+      if (this.$route.hash == "#dv") {
+        this.$router.push({ name: "数据大屏入口", hash: "#dv" })
+      } else {
+        this.$router.push({ name: "Home" })
+      }
+    },
+    toLogin(code) {
+      this.instance.post(`/auth/wechatcp-qr/token`, {
+        code: code,
+        type: 'cpuser'
+      }, {
+        auth: {
+          username: 'villcloud',
+          password: "villcloud"
+        },
+        params: {
+          grant_type: 'password',
+          scope: 'server'
+        }
+      }).then(this.login)
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppSign {
+  display: flex;
+  box-sizing: border-box;
+  height: 100%;
+
+  .AiIcon {
+    font-size: 40px;
+    height: 40px;
+  }
+
+  .logoText {
+    font-size: 20px;
+  }
+
+  :deep(.left) {
+    width: 480px;
+    flex-shrink: 0;
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+    padding-left: 64px;
+    padding-top: 40px;
+    box-sizing: border-box;
+    color: #fff;
+    font-size: 16px;
+
+    .iconcunwei1 {
+      font-size: 36px;
+    }
+  }
+
+  :deep(.right) {
+    flex: 1;
+    min-width: 0;
+    background-color: #F6F8FB;
+    background-image: url("../assets/loginRightTop.png"), url("../assets/loginRightBottom.png");
+    background-repeat: no-repeat;
+    background-position: calc(100% - 80px) 0, calc(100% - 40px) 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+
+    .bottomRecord {
+      font-size: 12px;
+      color: #999;
+      gap: 16px;
+      position: fixed;
+      bottom: 20px;
+
+      .el-link {
+        font-size: inherit;
+      }
+    }
+  }
+
+}
+</style>