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

2026-04-30 07:23:08 +08:00 · 2026-04-30 07:23:08 +08:00 · 0d5d50f130
commit 0d5d50f130
parent 32368454fb
11 changed files with 131 additions and 330 deletions
--- a/txw-mhzc-web/src/pages/index/views/home2/assets/home-bg-0.mp4
+++ b/txw-mhzc-web/src/pages/index/views/home2/assets/home-bg-0.mp4
--- a/txw-mhzc-web/src/pages/index/views/home2/assets/home-bg-1.mp4
+++ b/txw-mhzc-web/src/pages/index/views/home2/assets/home-bg-1.mp4
--- a/txw-mhzc-web/src/pages/index/views/home2/index.vue
+++ b/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"
-          :loop="true" :autoplay="true" theme="dark">
-          <t-swiper-item v-for="(src, idx) in topBannerImages" :key="idx">
-            <div class="banner-slide" :style="{ backgroundImage: `url(${src})` }" />
+        <t-swiper class="top-banner-swiper" animation="fade" :height="topBannerHeight" :interval="10000" :duration="500"
+          :loop="true" :autoplay="true" theme="dark" :navigation="{ showSlideBtn: 'never' }">
+          <t-swiper-item v-for="(video, idx) in topBannerVideos" :key="idx">
+            <video class="banner-video" :src="video" autoplay muted loop playsinline />
          </t-swiper-item>
        </t-swiper>

@ -281,10 +281,9 @@ export default {
        hyzx: [],   // 行业资讯
        ptgg: []    // 平台公告
      },
-      topBannerImages: [
-        require('@/pages/index/assets/home-top-bg1.jpg'),
-        // require('@/pages/index/assets/home-top-bg2.jpg'),
-        // require('@/pages/index/assets/home-top-bg3.jpg'),
+      topBannerVideos: [
+        require('@/pages/index/views/home2/assets/home-bg-0.mp4'),
+        require('@/pages/index/views/home2/assets/home-bg-1.mp4'),
      ],
      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 {
--- a/txw-mhzc-web/src/pages/index/views/login/components/components-login.vue
+++ b/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>
--- a/txw-mhzc-web/src/pages/index/views/login/components/zhuce.vue
+++ b/txw-mhzc-web/src/pages/index/views/login/components/zhuce.vue
@ -2,14 +2,8 @@
  <!-- 表单 -->
  <div class="field">
    <div>
-      <t-form
-        ref="loginForm"
-        :class="['item-container', `login-${loginForm.loginType}`]"
-        :data="loginForm"
-        label-width="0"
-        @submit="onSubmit"
-        class="login-box"
-      >
+      <t-form ref="loginForm" :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 class="verification-code" name="mobileCode">
-            <t-input v-model="loginForm.sms" size="large" placeholder="请输入验证码" key="verifyCode" />
-            <t-button :disabled="countDown > 0" @click="handleCounter">
-              {{ countDown === 0 ? '发送验证码' : `${countDown}秒后可重发` }}
-            </t-button>
+          <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="captchaVerification" user-select:none>
-            <div class="drag" ref="dragDiv" v-if="iscxhk">
-              <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>
-            <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>
+          <t-form-item name="name">
+            <t-input v-model="loginForm.zsxm1" size="large" placeholder="请输入您的真实姓名"> </t-input>
+          </t-form-item>
+
+          <!-- 图形验证码 -->
+          <t-form-item name="captchaCode">
+            <div class="captcha-wrapper">
+              <t-input v-model="loginForm.captchaCode" placeholder="请输入验证码" :maxlength="4" size="large"
+                @enterkey="onSubmit" />
+              <img v-if="captchaImage" :src="captchaImage" @click="refreshCaptcha" class="captcha-img" alt="验证码" />
            </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,311 +67,127 @@ export default {
  },
  data() {
    return {
-      beginClientX: 0 /* 距离屏幕左端距离 */,
-      mouseMoveState: false /* 触发拖动状态  判断 */,
-      maxWidth: '' /* 拖动最大宽度，依据滑块宽度算出来的 */,
-      confirmWords: '发送验证码前，请先拖动滑块' /* 滑块文字 */,
-      confirmSuccess: false /* 验证成功判断 */,
-      width: 350,
-      height: 42,
-      textSize: '18px',
+      // 图形验证码相关
+      captchaUuid: '',
+      captchaImage: '',
      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: '请输入手机号',
-            duration: 1000,
-          });
-          return;
-        }
-        if (!this.loginForm.password) {
-          MessagePlugin.info({
-            content: '请输入密码',
-            duration: 1000,
-          });
-          return;
-        }
-        if (!this.loginForm.zsxm1) {
-          MessagePlugin.info({
-            content: '请输入真实姓名',
-            duration: 1000,
-          });
-          return;
-        }
-        if (!this.loginForm.sms) {
-          MessagePlugin.info({
-            content: '请输入验证码',
-            duration: 1000,
-          });
-          return;
-        }
-        if(!this.ishqyzm){
-         MessagePlugin.info({
+      if (!this.loginForm.dlzh) {
+        MessagePlugin.info({
+          content: '请输入手机号',
+          duration: 1000,
+        });
+        return;
+      }
+      if (!this.loginForm.password) {
+        MessagePlugin.info({
+          content: '请输入密码',
+          duration: 1000,
+        });
+        return;
+      }
+      if (!this.loginForm.zsxm1) {
+        MessagePlugin.info({
+          content: '请输入真实姓名',
+          duration: 1000,
+        });
+        return;
+      }
+      if (!this.captchaUuid) {
+        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');
-          // 登录失败时，如果正在倒计时，停止计时器并重置滑块
-          // if (this.isCounting) {
-          //   this.stopAndResetTimer();
-          //   this.reSetSlider();
-          // }
-            if (this.isCounting) {
-    this.stopAndResetTimer();
-  }
-  return;
-          // if (error === 1004003) {
-          //   this.reSetSlider();
-          // }
+          this.refreshCaptcha();
+          return;
        });
    },
-handleCounter() {
-  if (!this.loginForm.dlzh) {
-    MessagePlugin.info({
-      content: '请输入手机号',
-      duration: 1000,
-    });
-    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 = '验证通过';
+    // 刷新图形验证码
+    refreshCaptcha() {
+      getCaptcha().then((res) => {
+        this.captchaUuid = res.data.uuid;
+        this.captchaImage = res.data.imageBase64;
+        this.loginForm.captchaVerification = res.data.uuid;
+        this.loginForm.captchaCode = '';
      });
-      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.maxWidth = this.$refs.dragDiv.clientWidth - this.$refs.moveDiv.clientWidth;
-    // 添加监听事件
-    this.addMouseListeners();
+    this.refreshCaptcha();
  },
 };
 </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>
--- a/txw-mhzc/txw-mhzc-service-biz/src/main/java/com/css/txw/mhzc/constants/ErrorCodeConstants.java
+++ b/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, "验证码错误，请重新输入");

 }
--- a/txw-mhzc/txw-mhzc-service-biz/src/main/java/com/css/txw/mhzc/pojo/vo/UserRegisterReqVO.java
+++ b/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;

 }
--- a/txw-mhzc/txw-mhzc-service-biz/src/main/java/com/css/txw/mhzc/service/impl/TxwMhzcYhxxbServiceImpl.java
+++ b/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))) {
-            throw exception(OAUTH2_LOGIN_SJHM_NOT_EXISTS);
+        // 图形验证码校验
+        if (this.mhzcProperties.isRegisterSmsCheck()) {
+            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();
--- a/txw-sso/txw-sso-service-api/src/main/java/com/css/txw/sso/api/ISsoApi.java
+++ b/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);
 }
--- a/txw-sso/txw-sso-service-api/target/classes/com/css/txw/sso/api/ISsoApi.class
+++ b/txw-sso/txw-sso-service-api/target/classes/com/css/txw/sso/api/ISsoApi.class
--- a/txw-sso/txw-sso-service-biz/src/main/java/com/css/txw/sso/controller/verify/VerifyController.java
+++ b/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");