选点、登录

src/assets/styles/element-ui.scss

@@ -98,7 +98,7 @@
 }
 
 .dialog-footer {
-  padding: 10px 24.5px !important;
+  padding: 5px 10px !important;
   border-top: 1px solid #E8E8E8;
   display: flex;
   justify-content: center;

src/assets/styles/index.scss

@@ -290,7 +290,7 @@ aside {
   background-color: #ffffff;
   display: flex;
   justify-content: center;
-  padding: 0 24px 24px;
+  padding: 0 12px 12px;
   z-index: 99;
   .common-dialog-content {
     border-bottom: 1px solid #e6f2ff;
@@ -536,8 +536,8 @@ aside {
 }
 
 .common-btn-primary {
-  width: 212px;
-  height: 136px;
+  width: 85px;
+  height: 50px;
   background: url('@/assets/images/common/btnPrimary.png') no-repeat;
   background-size: 100% 100%;
   color: #ffffff;
@@ -545,7 +545,7 @@ aside {
   justify-content: center;
   align-items: center;
   cursor: pointer;
-  font-size: 38px;
+  font-size: 14px;
 }
 .common-btn-primary2 {
   width: 332px;
@@ -596,8 +596,8 @@ aside {
   font-size: 38px;
 }
 .common-btn {
-  width: 148px;
-  height: 72px;
+  width: 59px;
+  height: 23px;
   background: url('@/assets/images/common/btn.png') no-repeat;
   background-size: 100% 100%;
   color: #ffffff;
@@ -605,7 +605,7 @@ aside {
   justify-content: center;
   align-items: center;
   cursor: pointer;
-  font-size: 38px;
+  font-size: 14px;
 }
 
 .common-table {

src/components/Dialog/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="modelValue || customShow" class="common-dialog" :style="{ width: computedWidth }">
+  <div v-if="modelValue || customShow" class="common-dialog" :style="{ width: computedWidth, height: computedHeight }">
     <div :class="type === 'xs' ? 'dialog-header2' : 'dialog-header'">
       <div v-if="!hideTitle" class="dialog-title">
         {{ title ? title : '弹窗' }}
@@ -66,17 +66,18 @@ const computedWidth = computed(() => {
 const computedHeight = computed(() => {
   if (!!props.height) {
     return props.height;
-  } else if (props.type === 'xs') {
-    return '435px';
-  } else if (props.type === 'sm') {
-    return '1250px';
-  } else if (props.type === 'lg') {
-    return '1256px';
-  } else if (props.type === 'xl') {
-    return '1250px';
-  } else {
-    return '1560px';
   }
+  // else if (props.type === 'xs') {
+  //   return '435px';
+  // } else if (props.type === 'sm') {
+  //   return '1250px';
+  // } else if (props.type === 'lg') {
+  //   return '1256px';
+  // } else if (props.type === 'xl') {
+  //   return '1250px';
+  // } else {
+  //   return '1560px';
+  // }
 });
 // 关闭弹窗
 const closeDialog = () => {
@@ -97,7 +98,7 @@ const confirm = () => {
 <style lang="scss" scoped>
 .common-dialog {
   border: 4px solid #2c81ff;
-  padding-bottom: 40px;
+  padding-bottom: 10px;
   color: #ffffff;
   background-color: rgba(5, 18, 53, 0.85);
   box-shadow: inset 0 0 40px 10px rgba(26, 144, 255, 0.5);
@@ -106,15 +107,14 @@ const confirm = () => {
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 99;
-  font-size: 38px;
+  font-size: 14px;
   display: flex;
   flex-direction: column;
   .dialog-header,
   .dialog-header2 {
     position: relative;
-    min-height: 175px;
-    line-height: 135px;
-    padding: 0 40px;
+    min-height: 47px;
+    line-height: 28px;
     .dialog-title {
       width: 500px;
       color: transparent;
@@ -128,10 +128,10 @@ const confirm = () => {
     }
     .dialog-close {
       position: absolute;
-      top: 20px;
-      right: 60px;
-      width: 20px;
-      height: 20px;
+      top: 6px;
+      right: 10px;
+      width: 12px;
+      height: 12px;
       background: url('@/assets/images/common/close.png') no-repeat;
       background-size: 100% 100%;
       cursor: pointer;
@@ -155,8 +155,8 @@ const confirm = () => {
       position: absolute;
       bottom: 0;
       left: 0;
-      width: 1100px;
-      height: 180px;
+      width: 287px;
+      height: 47px;
       background: url('@/assets/images/common/line1.png') no-repeat;
       background-size: 100% 100%;
     }
@@ -205,11 +205,11 @@ const confirm = () => {
     overflow-y: auto;
     overflow-x: hidden;
     flex: 1;
-    padding: 0 40px;
+    padding: 0 10px;
   }
   .dialog-footer {
-    padding: 0 30px;
-    height: 150px;
+    padding: 0 10px;
+    height: 50px;
     display: flex;
     justify-content: flex-end;
     align-items: center;
@@ -219,31 +219,31 @@ const confirm = () => {
 .triangle2,
 .triangle3,
 .triangle4 {
-  width: 32px;
-  height: 32px;
+  width: 12px;
+  height: 12px;
   background-size: 100% 100%;
   background-repeat: no-repeat;
   display: block;
   position: absolute;
 }
 .triangle1 {
-  top: 20px;
-  left: 20px;
+  top: 6px;
+  left: 6px;
   background-image: url('@/assets/images/common/triangle1.png');
 }
 .triangle2 {
-  top: 20px;
-  right: 20px;
+  top: 6px;
+  right: 6px;
   background-image: url('@/assets/images/common/triangle2.png');
 }
 .triangle3 {
-  bottom: 20px;
-  left: 20px;
+  bottom: 6px;
+  left: 6px;
   background-image: url('@/assets/images/common/triangle3.png');
 }
 .triangle4 {
-  bottom: 20px;
-  right: 20px;
+  bottom: 6px;
+  right: 6px;
   background-image: url('@/assets/images/common/triangle4.png');
 }
 .common-btn-danger {

src/layout/components/Navbar.vue

@@ -224,6 +224,7 @@ watch(
     position: absolute;
     bottom: 0;
     left: 0;
+    pointer-events: none;
   }
   &::after {
     content: '';
@@ -234,6 +235,7 @@ watch(
     position: absolute;
     bottom: 0;
     right: 0;
+    pointer-events: none;
   }
   .hamburger-container {
     line-height: 50px;

src/views/login.vue

@@ -1,64 +1,64 @@
 <template>
   <div class="login">
     <el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
-      <h3 class="title">智慧应急工作台</h3>
-      <el-form-item v-if="tenantEnabled" prop="tenantId">
-        <el-select v-model="loginForm.tenantId" filterable placeholder="请选择/输入公司名称" style="width: 100%">
-          <el-option v-for="item in tenantList" :key="item.tenantId" :label="item.companyName" :value="item.tenantId"></el-option>
-          <template #prefix><svg-icon icon-class="company" class="el-input__icon input-icon" /></template>
-        </el-select>
-      </el-form-item>
-      <el-form-item prop="username">
-        <el-input v-model="loginForm.username" type="text" size="large" auto-complete="off" placeholder="账号">
-          <template #prefix><svg-icon icon-class="user" class="el-input__icon input-icon" /></template>
-        </el-input>
-      </el-form-item>
-      <el-form-item prop="password">
-        <el-input v-model="loginForm.password" type="password" size="large" auto-complete="off" placeholder="密码" @keyup.enter="handleLogin">
-          <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template>
-        </el-input>
-      </el-form-item>
-      <el-form-item v-if="captchaEnabled" prop="code">
-        <el-input v-model="loginForm.code" size="large" auto-complete="off" placeholder="验证码" style="width: 63%" @keyup.enter="handleLogin">
-          <template #prefix><svg-icon icon-class="validCode" class="el-input__icon input-icon" /></template>
-        </el-input>
-        <div class="login-code">
-          <img :src="codeUrl" class="login-code-img" @click="getCode" />
+      <div class="title">欢迎登录</div>
+      <div class="title2">智慧应急工作台</div>
+      <div class="login-box">
+        <div class="login-tabs">
+          <div v-for="(item, index) in tabs" :key="index" :class="tabActive === index ? 'login-tab tab-active' : 'login-tab'">{{ item }}</div>
         </div>
-      </el-form-item>
-      <el-checkbox v-model="loginForm.rememberMe" style="margin: 0 0 25px 0">记住密码</el-checkbox>
-      <!--
-      <el-form-item style="float: right">
-        <el-button circle title="微信登录" @click="doSocialLogin('wechat')">
-          <svg-icon icon-class="wechat" />
-        </el-button>
-        <el-button circle title="MaxKey登录" @click="doSocialLogin('maxkey')">
-          <svg-icon icon-class="maxkey" />
-        </el-button>
-        <el-button circle title="TopIam登录" @click="doSocialLogin('topiam')">
-          <svg-icon icon-class="topiam" />
-        </el-button>
-        <el-button circle title="Gitee登录" @click="doSocialLogin('gitee')">
-          <svg-icon icon-class="gitee" />
-        </el-button>
-        <el-button circle title="Github登录" @click="doSocialLogin('github')">
-          <svg-icon icon-class="github" />
-        </el-button>
-      </el-form-item>
-      -->
-      <el-form-item style="width: 100%">
-        <el-button :loading="loading" size="large" type="primary" style="width: 100%" @click.prevent="handleLogin">
-          <span v-if="!loading">登 录</span>
-          <span v-else>登 录 中...</span>
-        </el-button>
-        <div v-if="register" style="float: right">
-          <router-link class="link-type" :to="'/register'">立即注册</router-link>
-        </div>
-      </el-form-item>
+        <el-form-item prop="username">
+          <el-input v-model="loginForm.username" type="text" size="large" auto-complete="off" placeholder="账号">
+            <template #prefix><i class="icon-user" /></template>
+          </el-input>
+        </el-form-item>
+        <el-form-item prop="password">
+          <el-input v-model="loginForm.password" type="password" size="large" auto-complete="off" placeholder="密码" @keyup.enter="handleLogin">
+            <template #prefix><i class="icon-password" /></template>
+          </el-input>
+        </el-form-item>
+        <el-form-item v-if="captchaEnabled" prop="code">
+          <el-input v-model="loginForm.code" size="large" auto-complete="off" placeholder="验证码" style="width: 63%" @keyup.enter="handleLogin">
+            <template #prefix><i class="icon-verify" /></template>
+          </el-input>
+          <div class="login-code">
+            <img :src="codeUrl" class="login-code-img" @click="getCode" />
+          </div>
+        </el-form-item>
+<!--        <el-checkbox v-model="loginForm.rememberMe" style="margin: 0 0 25px 0">记住密码</el-checkbox>-->
+        <!--
+        <el-form-item style="float: right">
+          <el-button circle title="微信登录" @click="doSocialLogin('wechat')">
+            <svg-icon icon-class="wechat" />
+          </el-button>
+          <el-button circle title="MaxKey登录" @click="doSocialLogin('maxkey')">
+            <svg-icon icon-class="maxkey" />
+          </el-button>
+          <el-button circle title="TopIam登录" @click="doSocialLogin('topiam')">
+            <svg-icon icon-class="topiam" />
+          </el-button>
+          <el-button circle title="Gitee登录" @click="doSocialLogin('gitee')">
+            <svg-icon icon-class="gitee" />
+          </el-button>
+          <el-button circle title="Github登录" @click="doSocialLogin('github')">
+            <svg-icon icon-class="github" />
+          </el-button>
+        </el-form-item>
+        -->
+        <el-form-item style="width: 100%">
+          <el-button :loading="loading" size="large" type="primary" style="width: 100%" @click.prevent="handleLogin">
+            <span v-if="!loading">登 录</span>
+            <span v-else>登 录 中...</span>
+          </el-button>
+          <div v-if="register" style="float: right">
+            <router-link class="link-type" :to="'/register'">立即注册</router-link>
+          </div>
+        </el-form-item>
+      </div>
     </el-form>
     <!--  底部  -->
     <div class="el-login-footer">
-      <span v-if="false">Copyright © 2018-2024 疯狂的狮子Li All Rights Reserved.</span>
+      <span v-if="false"></span>
     </div>
   </div>
 </template>
@@ -73,7 +73,9 @@ import { HttpStatus } from '@/enums/RespEnum';
 
 const userStore = useUserStore();
 const router = useRouter();
-
+const tabActive = ref(0);
+// '粤政易扫码登录',
+const tabs = reactive(['账号密码登录']);
 const loginForm = ref<LoginData>({
   tenantId: '000000',
   username: 'admin',
@@ -117,18 +119,18 @@ const handleLogin = () => {
     if (valid) {
       loading.value = true;
       // 勾选了需要记住密码设置在 localStorage 中设置记住用户名和密码
-      if (loginForm.value.rememberMe) {
-        localStorage.setItem('tenantId', String(loginForm.value.tenantId));
-        localStorage.setItem('username', String(loginForm.value.username));
-        localStorage.setItem('password', String(loginForm.value.password));
-        localStorage.setItem('rememberMe', String(loginForm.value.rememberMe));
-      } else {
-        // 否则移除
-        localStorage.removeItem('tenantId');
-        localStorage.removeItem('username');
-        localStorage.removeItem('password');
-        localStorage.removeItem('rememberMe');
-      }
+      // if (loginForm.value.rememberMe) {
+      //   localStorage.setItem('tenantId', String(loginForm.value.tenantId));
+      //   localStorage.setItem('username', String(loginForm.value.username));
+      //   localStorage.setItem('password', String(loginForm.value.password));
+      //   localStorage.setItem('rememberMe', String(loginForm.value.rememberMe));
+      // } else {
+      //   // 否则移除
+      //   localStorage.removeItem('tenantId');
+      //   localStorage.removeItem('username');
+      //   localStorage.removeItem('password');
+      //   localStorage.removeItem('rememberMe');
+      // }
       // 调用action的登录方法
       const [err] = await to(userStore.login(loginForm.value));
       if (!err) {
@@ -221,17 +223,26 @@ onMounted(() => {
 }
 
 .title {
-  margin: 0px auto 30px auto;
-  text-align: center;
-  color: #707070;
+  font-size: 24px;
+  font-weight: bold;
+  color: #25282e;
+}
+
+.title2 {
+  font-size: 36px;
+  font-weight: bold;
+  margin: 6px 0 20px;
+  color: #25282e;
 }
 
 .login-form {
-  border-radius: 6px;
-  background: #ffffff;
   width: 400px;
-  padding: 25px 25px 5px 25px;
-
+  .login-box {
+    border-radius: 6px;
+    box-shadow: 0 0 4px #d4e9fe;
+    width: 400px;
+    padding: 25px 25px 5px 25px;
+  }
   .el-input {
     height: 40px;
 
@@ -281,4 +292,64 @@ onMounted(() => {
   height: 40px;
   padding-left: 12px;
 }
+
+.login-tabs {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 40px;
+  line-height: 40px;
+  border-bottom: 1px solid #eeeeee;
+  margin-bottom: 15px;
+  .login-tab {
+  }
+  .tab-active {
+    color: #5695eb;
+    position: relative;
+    &::before {
+      content: '';
+      width: 100%;
+      height: 1px;
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      background-color: #5695eb;
+    }
+  }
+}
+:deep(.el-input--large) {
+  .el-input__wrapper {
+    padding: 1px 5px !important;
+  }
+}
+
+.icon-user {
+  background: url('@/assets/images/user2.png') no-repeat;
+}
+.icon-password {
+  background: url('@/assets/images/password.png') no-repeat;
+}
+.icon-verify {
+  background: url('@/assets/images/verify.png') no-repeat;
+}
+.icon-user,
+.icon-password,
+.icon-verify {
+  width: 24px;
+  height: 24px;
+  background-size: 100% 100%;
+  margin-right: 10px;
+  position: relative;
+  &::after {
+    content: '';
+    display: inline-block;
+    width: 1px;
+    height: 18px;
+    background-color: #d9d9d9;
+    position: absolute;
+    top: 3px;
+    right: -5px;
+  }
+}
 </style>

src/views/routineCommandMap/PositionMap.vue

@@ -1,18 +1,18 @@
 <template>
-  <Dialog type="sm" title="请选择事发地点" customShow @close="handleClose" @confirm="submit">
+  <Dialog type="md" title="请选择事发地点" height="780px" customShow @close="handleClose" @confirm="submit">
     <el-form ref="queryFormRef" :model="form" :rules="rules">
       <div class="form">
         <div class="line">
-          <div class="form-item" style="margin-right: 20px">
+          <div class="form-item" style="margin-right: 10px">
             <div class="text">详细地址</div>
             <el-input v-model="form.address" class="custom-input" placeholder="请输入" />
             <div v-if="searchPop" class="scroll_box">
-              <div style="height: 60px; line-height: 60px">
+              <div style="height: 30px; line-height: 30px">
                 <span style="font-weight: bold">搜索结果列表</span>
-                <i class="el-icon-close" style="float: right; font-size: 20px; cursor: pointer" @click="closeSearchList()" />
+                <i class="el-icon-close" style="float: right; font-size: 12px; cursor: pointer" @click="closeSearchList()" />
               </div>
 
-              <el-scrollbar class="scroll" style="height: 250px">
+              <el-scrollbar class="scroll">
                 <div v-for="(item, index) in searchList" v-show="searchList.length" :key="index" class="item" @click="handlePanTo(index)">
                   <el-image class="img" :src="item.img" :alt="item.name" lazy>
                     <template #error>
@@ -287,8 +287,8 @@ function handleClose() {
 let queryFormRef = ref();
 let containerRef = ref();
 function handleResize() {
-  const containerWidth = containerRef.value.clientWidth * (document.body.clientWidth / 8960);
-  const containerHeight = containerRef.value.clientHeight * (document.body.clientHeight / 2520);
+  const containerWidth = containerRef.value.clientWidth * (document.body.clientWidth / 1920);
+  const containerHeight = containerRef.value.clientHeight * (document.body.clientHeight / 1080);
   width.value = containerWidth + 'px';
   height.value = containerHeight + 'px';
   map.resize();
@@ -339,24 +339,24 @@ function submit() {
 }
 
 .scroll_box {
-  width: calc(100% - 165px);
+  width: calc(100% - 65px);
   background: #0a2c5c;
   position: absolute;
-  left: 165px;
-  top: 80px;
+  left: 66px;
+  top: 38px;
   z-index: 9;
-  padding: 20px;
+  padding: 10px;
   border-radius: 3px;
   .close {
     position: absolute;
     right: 10px;
     top: 10px;
     cursor: pointer;
-    font-size: 40px;
+    font-size: 14px;
   }
   :deep(.el-pagination__total) {
     color: #a7ccdf;
-    font-size: 32px;
+    font-size: 14px;
   }
 
   :deep(.el-pagination) {
@@ -365,16 +365,12 @@ function submit() {
       background-color: transparent;
       border: none;
       .el-icon {
-        font-size: 22px;
+        font-size: 12px;
         color: #a7ccdf;
       }
     }
     .el-pager li {
-      width: 64px;
-      height: 64px;
-      line-height: 64px;
       text-align: center;
-      font-size: 32px;
       color: #a7ccdf;
       background-color: #0e3064;
       border: 1px solid #0c57a7;
@@ -392,11 +388,11 @@ function submit() {
 }
 .scroll {
   width: 100%;
-  height: auto !important;
+  height: 500px;
 
   .item {
     display: flex;
-    font-size: 32px;
+    font-size: 14px;
     cursor: pointer;
     padding: 8px;
 
@@ -405,10 +401,10 @@ function submit() {
     }
 
     .img {
-      width: 80px;
-      height: 80px;
-      min-width: 80px;
-      margin-right: 15px;
+      width: 60px;
+      height: 60px;
+      min-width: 60px;
+      margin-right: 8px;
     }
     :deep(.image-slot) {
       width: 100%;
@@ -451,19 +447,23 @@ function submit() {
     width: 100%;
     display: flex;
     align-items: center;
-    margin-bottom: 30px;
+    margin-bottom: 10px;
     .form-item {
       flex: 1;
       display: flex;
       align-items: center;
       position: relative;
       .text {
-        font-size: 36px;
+        font-size: 14px;
         color: #eaf3fc;
         white-space: nowrap;
-        margin-right: 20px;
+        margin-right: 10px;
       }
     }
   }
 }
+:deep(.amap-logo),
+:deep(.amap-copyright) {
+  display: none !important;
+}
 </style>