feat: 调整首页背景，隐藏注册登录的手机验证码功能

txw-mhzc-web/src/pages/index/views/home2/index.vue

@@ -4,10 +4,10 @@
     <div class="container">
       <!-- 顶部背景轮播 -->
       <div class="top-box" id="section-hero">
-        <t-swiper class="top-banner-swiper" animation="fade" :height="topBannerHeight" :interval="6000" :duration="500"
+        <t-swiper class="top-banner-swiper" animation="fade" :height="topBannerHeight" :interval="10000" :duration="500"
-          :loop="true" :autoplay="true" theme="dark">
+          :loop="true" :autoplay="true" theme="dark" :navigation="{ showSlideBtn: 'never' }">
-          <t-swiper-item v-for="(src, idx) in topBannerImages" :key="idx">
+          <t-swiper-item v-for="(video, idx) in topBannerVideos" :key="idx">
-            <div class="banner-slide" :style="{ backgroundImage: `url(${src})` }" />
+            <video class="banner-video" :src="video" autoplay muted loop playsinline />
           </t-swiper-item>
         </t-swiper>
 
@@ -281,10 +281,9 @@ export default {
         hyzx: [],   // 行业资讯
         ptgg: []    // 平台公告
       },
-      topBannerImages: [
+      topBannerVideos: [
-        require('@/pages/index/assets/home-top-bg1.jpg'),
+        require('@/pages/index/views/home2/assets/home-bg-0.mp4'),
-        // require('@/pages/index/assets/home-top-bg2.jpg'),
+        require('@/pages/index/views/home2/assets/home-bg-1.mp4'),
-        // require('@/pages/index/assets/home-top-bg3.jpg'),
       ],
       capabilityList: [
         { name: '碳核算平台', icon: require('@/pages/index/assets/home-thspt-icon.png'), anchor: 'content-1' },
@@ -680,6 +679,12 @@ export default {
   z-index: 0;
 }
 
+.banner-video {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
 .banner-slide {
   width: 100%;
   height: 100%;
@@ -700,7 +705,7 @@ export default {
 
 /* 指示条默认在底部，会被 .top-box-bottom-over 渐变盖住，上移避开 300px 渐变区 */
 .top-box ::v-deep .t-swiper__navigation {
-  bottom: 340px;
+  display: none;
 }
 
 .container {

txw-mhzc-web/src/pages/index/views/login/components/components-login.vue

@@ -1,12 +1,12 @@
 <template>
   <!-- 表单 -->
   <div class="field">
-    <t-space style="width: 100%">
+    <!-- <t-space style="width: 100%">
       <t-tabs class="loginTabs" v-model="loginForm.loginType" size="large">
         <t-tab-panel class="mmdl" value="password" label="密码登录" :destroyOnHide="false"> </t-tab-panel>
         <t-tab-panel value="phone" label="验证码登录" :destroyOnHide="false"> </t-tab-panel>
       </t-tabs>
-    </t-space>
+    </t-space> -->
     <div>
       <t-form
         ref="loginForm"
@@ -19,7 +19,7 @@
         <!-- 账号密码登录 -->
         <Passwordlogin v-if="loginForm.loginType === 'password'" />
         <!-- 短信验证码登录 -->
-        <Phonelogin v-if="loginForm.loginType === 'phone'" />
+        <!-- <Phonelogin v-if="loginForm.loginType === 'phone'" /> -->
         <!-- <div class="check-container remember-pwd">
           <t-checkbox>记住账号</t-checkbox>
           <span v-show="loginForm.loginType === 'password'" class="tip">忘记密码？</span>

txw-mhzc-web/src/pages/index/views/login/components/zhuce.vue

@@ -2,14 +2,8 @@
   <!-- 表单 -->
   <div class="field">
     <div>
-      <t-form
+      <t-form ref="loginForm" :class="['item-container', `login-${loginForm.loginType}`]" :data="loginForm"
-        ref="loginForm"
+        label-width="0" @submit="onSubmit" class="login-box">
-        :class="['item-container', `login-${loginForm.loginType}`]"
-        :data="loginForm"
-        label-width="0"
-        @submit="onSubmit"
-        class="login-box"
-      >
         <!-- 短信验证码登录 -->
         <div>
           <!-- <t-form-item name="mobile">
@@ -22,51 +16,24 @@
               {{ countDown === 0 ? '发送验证码' : `${countDown}秒后可重发` }}
             </t-button>
           </t-form-item> -->
-          <t-form-item name="name">
-            <t-input v-model="loginForm.zsxm1" size="large" placeholder="请输入您的真实姓名"> </t-input>
-          </t-form-item>
-          <t-form-item name="password">
-            <t-input
-              v-model="loginForm.password"
-              type="password"
-              size="large"
-              placeholder="请输入密码"
-              @keyup.enter.native="onSubmit"
-            >
-            </t-input>
-          </t-form-item>
           <t-form-item name="dlzh">
             <t-input v-model="loginForm.dlzh" size="large" placeholder="请输入您的手机号"> </t-input>
           </t-form-item>
-
+          <t-form-item name="password">
-          <t-form-item class="verification-code" name="mobileCode">
+            <t-input v-model="loginForm.password" type="password" size="large" placeholder="请输入密码"
-            <t-input v-model="loginForm.sms" size="large" placeholder="请输入验证码" key="verifyCode" />
+              @keyup.enter.native="onSubmit">
-            <t-button :disabled="countDown > 0" @click="handleCounter">
+            </t-input>
-              {{ countDown === 0 ? '发送验证码' : `${countDown}秒后可重发` }}
-            </t-button>
           </t-form-item>
-          <t-form-item name="captchaVerification" user-select:none>
+          <t-form-item name="name">
-            <div class="drag" ref="dragDiv" v-if="iscxhk">
+            <t-input v-model="loginForm.zsxm1" size="large" placeholder="请输入您的真实姓名"> </t-input>
-              <div class="drag_bg"></div>
+          </t-form-item>
-              <div class="drag_text">{{ confirmWords }}</div>
+
-              <div
+          <!-- 图形验证码 -->
-                ref="moveDiv"
+          <t-form-item name="captchaCode">
-                @mousedown="mouseDown($event)"
+            <div class="captcha-wrapper">
-                :class="{ handler_ok_bg: confirmSuccess }"
+              <t-input v-model="loginForm.captchaCode" placeholder="请输入验证码" :maxlength="4" size="large"
-                class="handler handler_bg"
+                @enterkey="onSubmit" />
-                style="position: absolute; top: 0; left: 0"
+              <img v-if="captchaImage" :src="captchaImage" @click="refreshCaptcha" class="captcha-img" alt="验证码" />
-              ></div>
-            </div>
-            <div class="drag" ref="dragDiv" v-else>
-              <div class="drag_bg"></div>
-              <div class="drag_text">{{ confirmWords }}</div>
-              <div
-                ref="moveDiv"
-                @mousedown="mouseDown($event)"
-                :class="{ handler_ok_bg: confirmSuccess }"
-                class="handler handler_bg"
-                style="position: absolute; top: 0; left: 0"
-              ></div>
             </div>
           </t-form-item>
         </div>
@@ -86,16 +53,12 @@
 import { removePassword, removeRememberMe, removeUsername } from '@/utils/auth';
 import { UserIcon, LockOnIcon } from 'tdesign-icons-vue';
 import { MessagePlugin } from 'tdesign-vue';
-import { getVerify, sendMsg } from '@/pages/index/api/login';
+import { getCaptcha } from '@/pages/index/api/login';
 
 const FORM_RULES = {
-  // mobile: [{ required: true, message: '手机号必填', type: 'error' }],
-
   zsxm1: [{ required: true, message: '真实姓名必填', type: 'error' }],
   dlzh: [{ required: true, message: '账号必填', type: 'error' }],
   password: [{ required: true, message: '密码必填', type: 'error' }],
-  sms: [{ required: true, message: '验证码必填', type: 'error' }],
-  // mobileCode: [{ required: true, message: '验证码必填', type: 'error' }],
 };
 export default {
   components: {
@@ -104,35 +67,22 @@ export default {
   },
   data() {
     return {
-      beginClientX: 0 /* 距离屏幕左端距离 */,
+      // 图形验证码相关
-      mouseMoveState: false /* 触发拖动状态  判断 */,
+      captchaUuid: '',
-      maxWidth: '' /* 拖动最大宽度，依据滑块宽度算出来的 */,
+      captchaImage: '',
-      confirmWords: '发送验证码前，请先拖动滑块' /* 滑块文字 */,
-      confirmSuccess: false /* 验证成功判断 */,
-      width: 350,
-      height: 42,
-      textSize: '18px',
       FORM_RULES,
       loginForm: {
         loginType: 'password',
         dlzh: '',
         password: '',
         zsxm1: '',
+        captchaVerification: '',
+        captchaCode: '',
       },
-      countDown: 0,
-      intervalTimer: null,
-      isCounting: false, // 新增：标记是否正在倒计时
-      iscxhk:false,
-      ishkzs:false,
-      ishqyzm:false,
     };
   },
-  beforeDestroy() {
-    clearInterval(this.intervalTimer);
-  },
   methods: {
     async onSubmit() {
-      if (this.loginForm.loginType === 'password') {
       if (!this.loginForm.dlzh) {
         MessagePlugin.info({
           content: '请输入手机号',
@@ -154,261 +104,90 @@ export default {
         });
         return;
       }
-        if (!this.loginForm.sms) {
+      if (!this.captchaUuid) {
-          MessagePlugin.info({
-            content: '请输入验证码',
-            duration: 1000,
-          });
-          return;
-        }
-        if(!this.ishqyzm){
         MessagePlugin.info({
           content: '请先获取验证码',
           duration: 1000,
         });
         return;
       }
-      } else {
+      if (!this.loginForm.captchaCode || this.loginForm.captchaCode.length !== 4) {
+        MessagePlugin.info({
+          content: '请输入4位验证码',
+          duration: 1000,
+        });
+        return;
       }
 
-      const { href } = window.location;
       this.loading = true;
       removeUsername();
       removePassword();
       removeRememberMe();
-      // 发起登陆
       this.$store
         .dispatch('zhuce', this.loginForm)
         .then(() => {
-          console.log('111111');
-          // this.$router.replace('/demo/demo').catch(() => '');
-          // 本地之外
-          // window.location.href = href.replace('sso/login', 'htgl/mhsy');
-          // 本地
-          // window.location.href = `/view/mhzc/glxtSy`;
           this.$emit('zhucecg', true);
         })
         .catch((error) => {
-          console.log('22222');
+          this.refreshCaptcha();
-          // 登录失败时，如果正在倒计时，停止计时器并重置滑块
-          // if (this.isCounting) {
-          //   this.stopAndResetTimer();
-          //   this.reSetSlider();
-          // }
-            if (this.isCounting) {
-    this.stopAndResetTimer();
-  }
           return;
-          // if (error === 1004003) {
-          //   this.reSetSlider();
-          // }
         });
     },
-handleCounter() {
+    // 刷新图形验证码
-  if (!this.loginForm.dlzh) {
+    refreshCaptcha() {
-    MessagePlugin.info({
+      getCaptcha().then((res) => {
-      content: '请输入手机号',
+        this.captchaUuid = res.data.uuid;
-      duration: 1000,
+        this.captchaImage = res.data.imageBase64;
+        this.loginForm.captchaVerification = res.data.uuid;
+        this.loginForm.captchaCode = '';
       });
-    return;
-  }
-  if (!this.confirmSuccess) {
-    MessagePlugin.info({
-      content: '请先完成滑块验证',
-      duration: 1000,
-    });
-    return;
-  }
-  this.startCountDown();
-  let params = {
-    captchaVerification: this.loginForm.captchaVerification,
-    sjhm1: this.loginForm.dlzh,
-  }
-  sendMsg(params).then((res) => {
-    MessagePlugin.info({
-      content: '发送成功',
-      duration: 1000,
-    });
-    this.ishqyzm = true;
-  }).catch((error) => {
-    MessagePlugin.warning({
-      content: '发送失败',
-      duration: 1000,
-    });
-    // 发送失败时停止计时器并重置滑块（取消注释）
-    this.stopAndResetTimer();
-    // this.reSetSlider(); // 这个不需要了，因为 stopAndResetTimer() 已经调用了 reSetSlider()
-  })
-},
-    
-    // 新增：开始倒计时方法
-    startCountDown() {
-      this.countDown = 60;
-      this.isCounting = true;
-      clearInterval(this.intervalTimer); // 清除之前的定时器
-      this.intervalTimer = setInterval(() => {
-        if (this.countDown > 0) {
-          this.countDown -= 1;
-        } else {
-          this.stopAndResetTimer();
-        }
-      }, 1000);
-    },
-    
-    // 新增：停止计时器并重置状态
-stopAndResetTimer() {
-  clearInterval(this.intervalTimer);
-  this.iscxhk = !this.iscxhk;
-  this.intervalTimer = null;
-  this.countDown = 0;
-  this.isCounting = false;
-  // 添加滑块重置逻辑
-  this.reSetSlider();
-},
-    
-    // mousedown 事件
-    mouseDown(e) {
-      if (!this.confirmSuccess) {
-        e.preventDefault && e.preventDefault(); // 阻止文字选中等 浏览器默认事件
-        this.mouseMoveState = true;
-        this.beginClientX = e.clientX;
-      }
-    },
-    // 验证成功函数
-    successFunction() {
-      getVerify().then((res) => {
-        this.loginForm.captchaVerification = res.data;
-        this.confirmSuccess = true;
-        this.confirmWords = '验证通过';
-      });
-      this.removeMouseListeners();
-    },
-    
-    // 新增：移除鼠标监听事件
-    removeMouseListeners() {
-      if (window.addEventListener) {
-        document.getElementsByTagName('html')[0].removeEventListener('mousemove', this.mouseMoveFn);
-        document.getElementsByTagName('html')[0].removeEventListener('mouseup', this.moseUpFn);
-      } else {
-        document.getElementsByTagName('html')[0].removeEventListener('mouseup', () => {});
-      }
-      document.getElementsByClassName('drag_text')[0].style.color = '#fff';
-      document.getElementsByClassName('handler')[0].style.left = `${this.maxWidth}px`;
-      document.getElementsByClassName('drag_bg')[0].style.width = `${this.maxWidth}px`;
-    },
-    
-    // mousemove事件
-    mouseMoveFn(e) {
-      if (this.mouseMoveState) {
-        const width = e.clientX - this.beginClientX;
-        if (width > 0 && width <= this.maxWidth) {
-          document.getElementsByClassName('handler')[0].style.left = `${width}px`;
-          document.getElementsByClassName('drag_bg')[0].style.width = `${width}px`;
-        } else if (width > this.maxWidth) {
-          this.successFunction();
-        }
-      }
-    },
-    // mouseup事件
-    moseUpFn(e) {
-      this.mouseMoveState = false;
-      const width = e.clientX - this.beginClientX;
-      if (width < this.maxWidth) {
-        document.getElementsByClassName('handler')[0].style.left = `${0}px`;
-        document.getElementsByClassName('drag_bg')[0].style.width = `${0}px`;
-      }
-    },
-    reSet() {
-      this.formData.sfzhm = '';
-      this.formData.xm = '';
-      this.reSetSlider();
-    },
-    reSetSlider() {
-      this.confirmSuccess = false;
-      this.mouseMoveState = false;
-      this.confirmWords = '请按住滑块，拖动到最右边';
-      document.getElementsByClassName('handler')[0].style.left = `${0}px`;
-      document.getElementsByClassName('drag_bg')[0].style.width = `${0}px`;
-      document.getElementsByClassName('drag_text')[0].style.color = 'black';
-      
-      // 重新添加监听事件
-      this.addMouseListeners();
-    },
-    
-    // 新增：添加鼠标监听事件
-    addMouseListeners() {
-      document.getElementsByTagName('html')[0].addEventListener('mousemove', this.mouseMoveFn);
-      document.getElementsByTagName('html')[0].addEventListener('mouseup', this.moseUpFn);
     },
   },
   mounted() {
-    // 计算滑块滑动最大值
+    this.refreshCaptcha();
-    this.maxWidth = this.$refs.dragDiv.clientWidth - this.$refs.moveDiv.clientWidth;
-    // 添加监听事件
-    this.addMouseListeners();
   },
 };
 </script>
 <style lang="less" scoped>
 @import url('../index.less');
+
 ::v-deep .t-tabs {
   .t-tabs__nav-wrap {
     margin: 0 auto;
   }
+
   .t-tabs__nav-item {
     padding: 0 40px;
   }
+
   .t-tabs__content {
     padding: 15px;
   }
 }
-.drag {
+
-  position: relative;
-  width: 350px;
-  height: 40px;
-  line-height: 40px;
-  text-align: center;
-  background-color: #e8e8e8;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-}
-.handler {
-  width: 40px;
-  height: 38px;
-  cursor: move;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-}
-.handler_bg {
-  background: #fff
-    url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTEyNTVEMURGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTEyNTVEMUNGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MTc5NzNmZS02OTQxLTQyOTYtYTIwNi02NDI2YTNkOWU5YmUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+YiRG4AAAALFJREFUeNpi/P//PwMlgImBQkA9A+bOnfsIiBOxKcInh+yCaCDuByoswaIOpxwjciACFegBqZ1AvBSIS5OTk/8TkmNEjwWgQiUgtQuIjwAxUF3yX3xyGIEIFLwHpKyAWB+I1xGSwxULIGf9A7mQkBwTlhBXAFLHgPgqEAcTkmNCU6AL9d8WII4HOvk3ITkWJAXWUMlOoGQHmsE45ViQ2KuBuASoYC4Wf+OUYxz6mQkgwAAN9mIrUReCXgAAAABJRU5ErkJggg==')
-    no-repeat center;
-}
-.handler_ok_bg {
-  background: #fff
-    url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDlBRDI3NjVGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDlBRDI3NjRGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDphNWEzMWNhMC1hYmViLTQxNWEtYTEwZS04Y2U5NzRlN2Q4YTEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+k+sHwwAAASZJREFUeNpi/P//PwMyKD8uZw+kUoDYEYgloMIvgHg/EM/ptHx0EFk9I8wAoEZ+IDUPiIMY8IN1QJwENOgj3ACo5gNAbMBAHLgAxA4gQ5igAnNJ0MwAVTsX7IKyY7L2UNuJAf+AmAmJ78AEDTBiwGYg5gbifCSxFCZoaBMCy4A4GOjnH0D6DpK4IxNSVIHAfSDOAeLraJrjgJp/AwPbHMhejiQnwYRmUzNQ4VQgDQqXK0ia/0I17wJiPmQNTNBEAgMlQIWiQA2vgWw7QppBekGxsAjIiEUSBNnsBDWEAY9mEFgMMgBk00E0iZtA7AHEctDQ58MRuA6wlLgGFMoMpIG1QFeGwAIxGZo8GUhIysmwQGSAZgwHaEZhICIzOaBkJkqyM0CAAQDGx279Jf50AAAAAABJRU5ErkJggg==')
-    no-repeat center;
-  border-bottom-left-radius: 0;
-  border-top-left-radius: 0;
-}
-.drag_bg {
-  width: 0;
-  height: 38px;
-  background-color: #7ac23c;
-  border-radius: 4px 0 0 4px;
-}
-.drag_text {
-  position: absolute;
-  top: 0;
-  width: 100%;
-  text-align: center;
-  user-select: none;
-}
 .login-box {
   margin-left: 50%;
   transform: translateX(-50%);
 }
+
 .btn-container {
   margin-top: 16px;
 }
+
+/* 图形验证码样式 */
+.captcha-wrapper {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  width: 350px;
+  height: 40px;
+}
+
+.captcha-img {
+  width: 120px;
+  height: 40px;
+  cursor: pointer;
+  border-radius: 4px;
+  border: 1px solid #ccc;
+}
 </style>

txw-mhzc/txw-mhzc-service-biz/src/main/java/com/css/txw/mhzc/constants/ErrorCodeConstants.java

@@ -42,6 +42,6 @@ public interface ErrorCodeConstants {
 
     ErrorCode YHXX_IS_EXISTS = new ErrorCode(1004020, "账号已存在");
 
-
+    ErrorCode REGISTER_CAPTCHA_CODE_ERROR = new ErrorCode(1004021, "验证码错误，请重新输入");
 
 }

txw-mhzc/txw-mhzc-service-biz/src/main/java/com/css/txw/mhzc/pojo/vo/UserRegisterReqVO.java

@@ -13,7 +13,9 @@ public class UserRegisterReqVO {
     private String password;
     @Schema(description = "真实姓名")
     private String zsxm1;
+    @Schema(description = "验证码UUID")
+    private String captchaVerification;
     @Schema(description = "验证码")
-    private String sms;
+    private String captchaCode;
 
 }

txw-mhzc/txw-mhzc-service-biz/src/main/java/com/css/txw/mhzc/service/impl/TxwMhzcYhxxbServiceImpl.java

@@ -3,6 +3,7 @@ package com.css.txw.mhzc.service.impl;
 import static com.css.ggzc.framework.common.exception.util.ServiceExceptionUtil.exception;
 import static com.css.txw.mhzc.constants.ErrorCodeConstants.OAUTH2_LOGIN_SJHM_NOT_EXISTS;
 import static com.css.txw.mhzc.constants.ErrorCodeConstants.YHXX_IS_EXISTS;
+import static com.css.txw.mhzc.constants.ErrorCodeConstants.REGISTER_CAPTCHA_CODE_ERROR;
 
 import java.util.Date;
 import java.util.List;
@@ -15,10 +16,9 @@ import org.springframework.stereotype.Service;
 import com.baomidou.mybatisplus.core.conditions.update.LambdaUpdateWrapper;
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
-import com.css.ggzc.framework.cache.utils.CacheUtils;
+import com.css.ggzc.framework.common.pojo.CommonResult;
 import com.css.ggzc.framework.common.util.gy.GyUtils;
 import com.css.ggzc.framework.common.util.object.BeanUtils;
-import com.css.ggzc.framework.redis.utils.RedisUtils;
 import com.css.ggzc.framework.session.SessionUtils;
 import com.css.txw.mhzc.mapper.TxwMhzcYhqygxbMapper;
 import com.css.txw.mhzc.mapper.TxwMhzcYhxxbMapper;
@@ -35,6 +35,7 @@ import com.css.txw.mhzc.pojo.vo.UserVO;
 import com.css.txw.mhzc.properties.MhzcProperties;
 import com.css.txw.mhzc.service.TxwMhzcQyxxbService;
 import com.css.txw.mhzc.service.TxwMhzcYhxxbService;
+import com.css.txw.sso.api.ISsoApi;
 
 import cn.hutool.core.util.IdUtil;
 import cn.hutool.crypto.digest.MD5;
@@ -61,6 +62,9 @@ public class TxwMhzcYhxxbServiceImpl extends ServiceImpl<TxwMhzcYhxxbMapper, Txw
     @Resource
     private MhzcProperties mhzcProperties;
 
+    @Resource
+    private ISsoApi ssoApi;
+
     @Override
     public YhxxbDTO initSessionByYhuuid(YhxxReqDTO reqDTO) {
         TxwMhzcYhxxbDO yhxxbDO = yhxxbMapper.getYhxxByYhuuid(reqDTO.getYhuuid());
@@ -139,11 +143,13 @@ public class TxwMhzcYhxxbServiceImpl extends ServiceImpl<TxwMhzcYhxxbMapper, Txw
 
     @Override
     public String register(UserRegisterReqVO reqVO) {
-        String sms = reqVO.getSms();
         String dlzh = reqVO.getDlzh();
-        String s = RedisUtils.get(formatKey(dlzh + sms));
+        // 图形验证码校验
-        if (this.mhzcProperties.isRegisterSmsCheck() && (GyUtils.isNull(s) || !dlzh.equals(s))) {
+        if (this.mhzcProperties.isRegisterSmsCheck()) {
-            throw exception(OAUTH2_LOGIN_SJHM_NOT_EXISTS);
+            CommonResult<Boolean> result = ssoApi.checkCaptcha(reqVO.getCaptchaVerification(), reqVO.getCaptchaCode());
+            if (result == null || !result.getData()) {
+                throw exception(REGISTER_CAPTCHA_CODE_ERROR);
+            }
         }
         TxwMhzcYhxxbDO yhxxByDlzh = yhxxbMapper.getYhxxByDlzhNoYxbzNoSdbz(dlzh);
         if (!GyUtils.isNull(yhxxByDlzh)) {
@@ -203,11 +209,6 @@ public class TxwMhzcYhxxbServiceImpl extends ServiceImpl<TxwMhzcYhxxbMapper, Txw
         return reqVO;
 	}
 
-	private static String formatKey(String sms) {
-        String VERIFY_TOKEN = "sms_token:%s";
-        return String.format(VERIFY_TOKEN, sms);
-    }
-
     @Override
     public SessionVO init() {
         SessionVO sessionVO = new SessionVO();

txw-sso/txw-sso-service-api/src/main/java/com/css/txw/sso/api/ISsoApi.java

@@ -2,9 +2,13 @@ package com.css.txw.sso.api;
 
 import com.css.txw.sso.constants.SsoApiConstants;
 import org.springframework.cloud.openfeign.FeignClient;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestParam;
+import com.css.ggzc.framework.common.pojo.CommonResult;
 
 @FeignClient(name = SsoApiConstants.NAME)
 public interface ISsoApi {
 
-
+    @PostMapping(SsoApiConstants.PREFIX + "/verify/checkCaptcha")
+    CommonResult<Boolean> checkCaptcha(@RequestParam("uuid") String uuid, @RequestParam("code") String code);
 }

txw-sso/txw-sso-service-biz/src/main/java/com/css/txw/sso/controller/verify/VerifyController.java

@@ -8,6 +8,7 @@ import io.swagger.v3.oas.annotations.Operation;
 import io.swagger.v3.oas.annotations.tags.Tag;
 import org.springframework.web.bind.annotation.PostMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.bind.annotation.RestController;
 
 import java.util.Map;
@@ -41,6 +42,15 @@ public class VerifyController {
         return verifyService.getCaptcha(remoteId);
     }
 
+    @Operation(summary = "校验图形验证码")
+    @PermitAll
+    @PostMapping("/checkCaptcha")
+    public CommonResult<Boolean> checkCaptcha(@RequestParam("uuid") String uuid,
+                                              @RequestParam("code") String code) {
+        Boolean result = verifyService.checkCaptcha(uuid, code);
+        return CommonResult.success(result);
+    }
+
     public static String getRemoteId(HttpServletRequest request) {
         String ip = ServletUtils.getClientIP(request);
         String ua = request.getHeader("user-agent");