Merge branch 'develop' of https://gitea.gentronhealth.com/wangjunping/his into develop

openhis-ui-vue3/src/settings.js

@@ -3,6 +3,10 @@ export default {
    * 网页标题
    */
   title: import.meta.env.VITE_APP_TITLE,
+  /**
+   * 系统名称
+   */
+  systemName: import.meta.env.VITE_APP_SYSTEM_NAME || 'XXX医院信息管理系统',
   /**
    * 侧边栏主题 深色主题theme-dark，浅色主题theme-light
    */

openhis-ui-vue3/src/views/login.vue

@@ -1,12 +1,14 @@
 <template>
   <div class="login">
     <!--  顶部  -->
-    <!-- <div class="el-login-top">
-      <el-image :src="logoNew"></el-image>
-    </div> -->
     <el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
-      <h1 class="title">医院信息管理系统</h1>
+    <div class="el-login-top">
+      <el-image :src="logoNew"></el-image>
+    </div>
+      <h1 class="title">{{ currentTenantName || settings.systemName }}</h1>
+      <p class="login-subtitle">请使用您的账号密码安全登录系统</p>
       <el-form-item prop="username">
+        <p class="label">用户名</p>
         <el-input
           v-model="loginForm.username"
           type="text"
@@ -21,25 +23,35 @@
         </el-input>
       </el-form-item>
       <el-form-item prop="password">
+        <p class="label">密码</p>
         <el-input
           v-model="loginForm.password"
-          type="password"
+          :type="passwordVisible ? 'text' : 'password'"
           size="large"
           auto-complete="off"
           placeholder="密码"
           @keyup.enter="handleLogin"
-          show-password
         >
           <template #prefix
             ><svg-icon icon-class="password" class="el-input__icon input-icon"
           /></template>
+          <template #suffix>
+            <span 
+              class="password-toggle"
+              @click="togglePasswordVisibility"
+              style="cursor: pointer; color: #606266; font-size: 14px; padding: 0 10px;"
+            >
+              {{ passwordVisible ? '隐藏' : '显示' }}
+            </span>
+          </template>
         </el-input>
       </el-form-item>
       <el-form-item prop="tenantId">
+        <p class="label">医疗机构</p>
         <el-select
           v-model="loginForm.tenantId"
           size="large"
-          placeholder="所属医院"
+          placeholder="请选择医疗机构"
           clearable
           filterable
         >
@@ -51,6 +63,11 @@
           />
         </el-select>
       </el-form-item>
+      <el-form-item class="login-options">
+        <el-checkbox v-model="loginForm.rememberMe" class="remember-me">记住我</el-checkbox>
+        <el-link type="primary" class="forgot-password" @click="handleForgotPassword">忘记密码？</el-link>
+      </el-form-item>
+      
       <!-- <el-form-item prop="tenantId"> -->
         <!-- <span class="descriptions-item-label" style="margin: 0 10px 0 0">连接医保</span> -->
         <!-- <el-switch v-model="loginForm.invokeYb" @change="topNavChange" size="large"/> -->
@@ -87,8 +104,17 @@
           <router-link class="link-type" :to="'/register'">立即注册</router-link>
         </div>
       </el-form-item>
+      <div class="footer">
+            © 2025 XXX医院信息系统 | 版本 v2.5.1
+            <!-- 公司版权信息（新增） -->
+            <div class="company-copyright">
+                技术支持：上海经创贺联信息技术有限公司
+            </div>
+        </div>
     </el-form>
+    
     <!--  底部  -->
+    
     <div class="el-login-footer">
       <div class="el-login-footer-link">
         <span><el-link :underline="false">his账号用户协议</el-link></span>
@@ -109,12 +135,15 @@
 </template>
 
 <script setup>
+import { getCurrentInstance, ref, reactive, computed, onMounted, watch } from 'vue';
+import settings from '@/settings';
 import { getCodeImg, sign, getUserBindTenantList } from '@/api/login';
 import { invokeYbPlugin } from '@/api/public';
 import Cookies from 'js-cookie';
 import { encrypt, decrypt } from '@/utils/jsencrypt';
 import useUserStore from '@/store/modules/user';
-import logoNew from '@/assets/logo/logoBlack.png';
+import { ElMessage } from 'element-plus';
+import logoNew from '@/assets/logo/LOGO.jpg';
 const userStore = useUserStore();
 const route = useRoute();
 const router = useRouter();
@@ -131,6 +160,7 @@ const loginForm = ref({
 });
 
 const tenantOptions = ref([]);
+const currentTenantName = ref('');
 
 const loginRules = {
   username: [{ required: true, trigger: 'blur', message: '请输入您的账号' }],
@@ -146,6 +176,21 @@ const captchaEnabled = ref(true);
 // 注册开关
 const register = ref(false);
 const redirect = ref(undefined);
+const passwordVisible = ref(false);
+
+function togglePasswordVisibility() {
+  passwordVisible.value = !passwordVisible.value;
+}
+
+// 处理忘记密码功能
+function handleForgotPassword() {
+  // 这里可以添加忘记密码的逻辑，例如跳转到忘记密码页面或显示忘记密码弹窗
+  // 目前先显示一个提示
+  ElMessage({
+    message: '忘记密码功能正在开发中',
+    type: 'info'
+  });
+}
 
 watch(
   route,
@@ -155,7 +200,7 @@ watch(
   { immediate: true }
 );
 
-// 页面加载时从 localStorage 获取 invokeYb 的值
+// 页面加载时从 localStorage 获取 invokeYb 的值和从 Cookies 获取记住的登录信息
 onMounted(() => {
   const storedInvokeYb = localStorage.getItem('invokeYb');
   if (storedInvokeYb !== null) {
@@ -164,6 +209,38 @@ onMounted(() => {
     // 如果 localStorage 中没有值，则设置默认值并保存
     localStorage.setItem('invokeYb', 'true');
   }
+  
+  // 从 Cookies 中恢复记住的登录信息
+  const rememberMe = Cookies.get('rememberMe');
+  if (rememberMe && rememberMe === 'true') {
+    const username = Cookies.get('username');
+    const password = Cookies.get('password');
+    if (username) {
+      loginForm.value.username = username;
+      loginForm.value.rememberMe = true;
+      // 解密密码
+      if (password) {
+        try {
+          loginForm.value.password = decrypt(password);
+        } catch (e) {
+          console.error('密码解密失败:', e);
+        }
+      }
+    }
+  }
+  
+  // 获取医疗机构列表
+  getUserBindTenantList().then((res) => {
+    tenantOptions.value = res.data.map(item => ({
+      label: item.tenantName,
+      value: item.id
+    }));
+    // 如果只有一个医疗机构，自动选中
+    if (tenantOptions.value.length === 1) {
+      loginForm.value.tenantId = tenantOptions.value[0].value;
+      currentTenantName.value = tenantOptions.value[0].label;
+    }
+  });
 });
 
 function handleLogin() {
@@ -279,6 +356,14 @@ function getCode() {
   });
 }
 
+// 监听租户选择变化
+watch(() => loginForm.value.tenantId, (newTenantId) => {
+  const selectedTenant = tenantOptions.value.find(item => item.value === newTenantId);
+  if (selectedTenant) {
+    currentTenantName.value = selectedTenant.label;
+  }
+});
+
 // 切换医保连接开关时更新 localStorage
 function topNavChange(value) {
   localStorage.setItem('invokeYb', value.toString());
@@ -303,6 +388,7 @@ function getTenantList(username) {
           label: item.tenantName,
         }));
         loginForm.value.tenantId = tenantOptions.value[0].value; //默认选中第一个
+        currentTenantName.value = tenantOptions.value[0].label;
       }
     }
   });
@@ -389,27 +475,81 @@ getCookie();
 getTenantList(loginForm.value.username);
 </script>
 
+<style>
+html, body {
+  height: auto;
+  min-height: 100vh;
+  overflow-y: auto;
+  margin: 0;
+  padding: 0;
+}
+</style>
+
 <style lang="scss" scoped>
 .login {
   display: flex;
   justify-content: center;
-  align-items: center;
+  background: #f8f9fa; 
-  height: 100%;
+  min-height: 100vh;
+  padding-bottom: 100px; /* 为底部固定footer留出空间 */
   //background-image: url("../assets/images/login-background.jpg");
   background-size: cover;
 }
 .title {
-  margin: 0px auto 30px auto;
+  margin: 10px auto 15px auto;
   text-align: center;
   color: #000;
   font-family: 'Microsoft Yahei,STHeiti,Simsun,STSong,Helvetica Neue,Helvetica,Arial,sans-serif';
 }
+.label{
+  display: block;
+  margin-bottom: 6px;
+  font-size: 14px;
+  font-weight: 500;
+  color: var(--text);
+}
 
+.login-options {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 8px 0 10px 0;
+  width: 100%; /* 确保容器占满宽度 */
+}
+
+.remember-me {
+  margin: 0;
+  color: var(--text);
+}
+
+.forgot-password {
+  font-size: 14px;
+  color: var(--primary);
+  cursor: pointer;
+  text-align: right; /* 确保文本右对齐 */
+  margin-left: auto; /* 确保元素右对齐 */
+}
+ .footer {
+            margin-top: 32px;
+            font-size: 12px;
+            color: var(--text-secondary);
+        }
+
+.login-subtitle {
+  font-size: 14px;
+  color: var(--text-secondary);
+  margin-bottom: 20px;
+}
 .login-form {
-  border-radius: 6px;
+  border-radius: 16px;
+  box-shadow: 0 4px 12px var(--shadow);
+  border: 1px solid var(--border);
   background: #ffffff;
-  width: 400px;
+  width: 100%;
+  max-width: 400px;
+  padding: 40px;
   padding: 25px 25px 5px 25px;
+  text-align: center;
   .el-input {
     height: 50px; // 修改输入框高度
     input {
@@ -438,24 +578,20 @@ getTenantList(loginForm.value.username);
   }
 }
 .el-login-top {
-  height: 80px;
+  text-align: center;
-  line-height: 40px;
+  margin: 0 auto 10px;
-  position: fixed;
+  .el-image {
-  top: 0;
+    max-width: 120px;
-  width: 100%;
+    max-height: 120px;
-  text-align: left;
+  }
-  color: #000;
-  font-family: Arial;
-  font-size: 12px;
-  letter-spacing: 1px;
-  background-color: #f1f1f1;
-  padding: 20px;
 }
 .el-login-footer {
-  height: 100px;
+  height: 80px;
-  line-height: 40px;
+  line-height: 30px;
   position: fixed;
   bottom: 0;
+  left: 0;
+  right: 0;
   width: 100%;
   text-align: center;
   color: #000;
@@ -463,8 +599,7 @@ getTenantList(loginForm.value.username);
   font-size: 12px;
   letter-spacing: 1px;
   background-color: #f1f1f1;
-
+  z-index: 100; /* 确保footer在最上层 */
-  color: #000;
   span {
     margin: 0 10px;
   }
@@ -490,6 +625,13 @@ getTenantList(loginForm.value.username);
   width: 24px !important; // 调整图标的宽度
   height: 24px !important; // 调整图标的高度
   font-size: 24px !important; // 调整图标的字体大小
+  color: #606266 !important; // 确保图标颜色可见
+  cursor: pointer !important; // 确保鼠标悬停时显示指针
+}
+
+:deep(.password-toggle) {
+  line-height: 50px !important; // 确保文字垂直居中
+  user-select: none; // 禁止选中文字
 }
 :deep(.el-select__wrapper) {
   background-color: #f5f7fa !important;
@@ -498,4 +640,8 @@ getTenantList(loginForm.value.username);
   font-size: 18px !important;
   height: 50px !important; // 修改输入框高度
 }
+
+:deep(.el-form-item) {
+  margin-bottom: 15px !important; // 减小输入框之间的距离
+}
 </style>