jiangping
2024-05-16 a4945c89ee72aa8b6f2c0a75653a3256a2b30b4f
company/src/views/login.vue
@@ -28,29 +28,58 @@
                    </div>
                </template>
            </div>
          <div style="text-align: left;margin-bottom: 15px;font-size: 14px">
            <el-checkbox :true-label="1" :false-label="0"   v-model="readed"/>
              我已阅读和同意《<span @click="agreeType=0;title1='服务协议';visible1=true" style="color: dodgerblue;cursor: pointer">服务协议</span>》和
            《<span  @click="agreeType=1;title1='隐私协议';visible1=true" style="color: dodgerblue;cursor: pointer">隐私协议</span>》
          </div>
            <el-button :loading="loading" @click="login">登&nbsp;&nbsp;录</el-button>
        </div>
        <el-dialog
            class="center-title"
            :title="title1"
            width="70%"
            height="70%"
            text="用户协议"
            :visible.sync="visible1"
        >
          <div class="agree-list" v-if="agreeType==0" v-html="agreement0">
    </div>
          <div class="agree-list"  v-else v-html="agreement1">
          </div>
          <template  v-slot:footer>
            <el-button type="primary"   @click="readed=1;visible1=false">同意</el-button>
            <el-button @click="visible1=false">返回</el-button>
</template>
        </el-dialog>
    </div>
</template>
<script>
    import { mapMutations } from 'vuex'
    import { getCaptcha, loginByPassword, loginByPhone } from '@/api/system/common'
    import { sendSms } from '@/api/business/smsEmail'
import { getAgreement } from '@/api/system/dict'
    export default {
        name: 'Login',
        data () {
            return {
      title1:'服务协议',
                systemTitle: process.env.VUE_APP_SYSTEM_TITLE,
                loading: false,
                username: '',
                password: '',
                phone: '',
      visible1:false,
                code: '',
      readed: 0,
      agreeType:'',
                active: 1,
                num: 0,
                timer: null,
      agreement0: '这是服务协议',
      agreement1: '这是隐私协议',
                // 验证码
                captcha: {
                    loading: false,
@@ -69,12 +98,20 @@
                this.phone = ''
                this.code = ''
            },
    getAgree () {
      getAgreement({}).then(res => {
        if (res && res.length >= 2) {
          this.agreement0 = res[0]
          this.agreement1 = res[1]
        }
      })
    },
            send() {
                if (!this.phone) {
                    this.$message.warning('请先输入手机号')
                    return
                }
                var reg = /^1[3456789]\d{9}$/;
      var reg = /^1[3456789]\d{9}$/
                if (!reg.test(this.phone)) {
                    this.$message.warning('手机号不合法')
                    return
@@ -100,6 +137,10 @@
            // 登录
            login () {
                if (this.loading) {
        return
      }
      if (this.readed != 1) {
        this.$message.error('请先阅读和同意《服务协议》和《隐私协议》')
                    return
                }
                if (this.active === 1) {
@@ -184,6 +225,7 @@
        },
        created () {
            this.refreshCaptcha()
    this.getAgree()
            document.title=this.systemTitle
        }
    }
@@ -191,6 +233,11 @@
<style scoped lang="scss">
    @import "@/assets/style/variables.scss";
    .agree-list{
      height: 550px;
      //max-height: 50%;
      overflow: auto;
    }
    $input-gap: 30px;
    .wrap {
        display: flex;
@@ -265,7 +312,7 @@
                }
            }
            .info-input {
                margin-bottom: 60px;
                margin-bottom: 15px;
                /deep/ .el-input {
                    margin-top: 30px;
                    &:first-child {
@@ -313,4 +360,14 @@
            }
        }
    }
   ::v-deep .center-title .el-dialog__title {
      text-align: center;
      width: 100%;
      font-size: 18px;
      font-weight: bold;
    }
    ::v-deep  .el-dialog__header{
      text-align: center;
    }
</style>