123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457 |
- <template>
- <div class="login">
- <img
- src="https://www.idea-co-sf.com/gardenProduct/image/bj01.png"
- alt=""
- class="logobig2"
- />
- <!-- <div class="logintype" v-if="loginStatus">-->
- <!-- <div-->
- <!-- @click="changeLoginType('企业用户')"-->
- <!-- :class="loginType == '企业用户' ? 'checkbox ischecked' : 'checkbox'"-->
- <!-- >-->
- <!-- 企业用户-->
- <!-- </div>-->
- <!-- <div-->
- <!-- @click="changeLoginType('管理用户')"-->
- <!-- :class="loginType == '管理用户' ? 'checkbox ischecked' : 'checkbox'"-->
- <!-- >-->
- <!-- 管理用户-->
- <!-- </div>-->
- <!-- </div>-->
- <div class="loginBody">
- <div class="loginTypeBox">
- <div class="loginTypeItem" @click="changeLoginType('企业用户')">
- <span
- class="loginTypeName"
- :class="loginType === '企业用户' ? 'ischecked' : ''"
- >企业用户</span
- >
- <div class="bottomLine" v-show="loginType === '企业用户'"></div>
- </div>
- <div class="loginTypeItem" @click="changeLoginType('管理用户')">
- <span
- class="loginTypeName"
- :class="loginType === '管理用户' ? 'ischecked' : ''"
- >管理用户</span
- >
- <div class="bottomLine" v-show="loginType === '管理用户'"></div>
- </div>
- </div>
- <div class="loginBox">
- <div class="inputBox">
- <img
- src="https://www.idea-co-sf.com/gardenProduct/image/comicon.svg"
- alt=""
- style="height: 60rpx; left: 32rpx"
- />
- <input
- type="text"
- placeholder="请输入用户名"
- v-model="loginForm.userName"
- class="inputCont"
- placeholder-class="b-palceholder"
- />
- </div>
- <div class="inputBox">
- <img
- src="https://www.idea-co-sf.com/gardenProduct/image/pswicon.svg"
- alt=""
- style="height: 60rpx; left: 32rpx"
- />
- <input
- type="password"
- placeholder="请输入密码"
- v-model="loginForm.password"
- class="inputCont"
- placeholder-class="b-palceholder"
- />
- </div>
- <div class="inputBox">
- <img
- src="https://www.idea-co-sf.com/gardenProduct/image/yzmicon.svg"
- alt=""
- style="height: 60rpx; left: 32rpx"
- />
- <input
- type="text"
- placeholder="请输入验证码"
- class="yanzhengma"
- v-model="loginForm.code"
- placeholder-class="b-palceholder"
- />
- <img
- :src="loginForm.captchaImage"
- @click="captchaImageRefresh(loginForm)"
- class="yanzhengImg"
- />
- </div>
- <!-- <div class="pswBox" @click="forgetPsw()">-->
- <!-- <p>忘记密码?</p>-->
- <!-- </div>-->
- <div>
- <button class="loginbtn" @click="loginClick">提交</button>
- </div>
- </div>
- <div class="bottomTips">
- <label class="radio">
- <radio value="r1" checked="true" color="rgba(3, 101, 249, 1)" />
- 已阅读并同意<span style="color: rgba(3, 101, 249, 1)"
- >《服务协议条款及隐私政策》</span
- >
- </label>
- </div>
- <!-- <van-dialog id="van-toast" />-->
- </div>
- </div>
- </template>
- <script>
- import Dialog from "../..//wxcomponents/weapp/dist/dialog/dialog.js";
- import { login, loginByCompany } from "@/js_sdk/http.js";
- export default {
- data() {
- return {
- loginStatus: true,
- loginType: "企业用户",
- loginForm: {
- userName: "",
- password: "",
- code: "",
- type: "FRAME",
- captchaId: "",
- captchaImage: "",
- rememberMe: true,
- },
- };
- },
- mounted() {
- // login()
- this.captchaImageRefresh(this.loginForm);
- },
- onLoad(options) {
- if (options.loginType) {
- this.loginType = options.loginType;
- }
- },
- methods: {
- changeLoginType(e) {
- console.log(this.loginType);
- this.loginStatus = false;
- this.loginType = e;
- this.loginStatus = true;
- },
- getPhoneNumber(e) {
- wx.login({
- success(res) {
- // console.log(res);
- let data = {
- loginCode: res.code,
- phoneCode: e.detail.code,
- };
- loginByWeixin2(data).then((e) => {
- // console.log(e.data.user);
- wx.setStorageSync("USERINFO", JSON.stringify(e.data.user));
- uni.switchTab({
- url: "/pages/index/index",
- });
- });
- },
- });
- },
- goqy() {
- uni.navigateTo({
- url: "/pages/subPackages/gocompnay/index",
- });
- },
- gozhfw() {
- wx.navigateToMiniProgram({
- appId: "wx15404cced62d7b37",
- success(res) {
- // 打开成功
- },
- fail(e) {
- console.log(e);
- },
- });
- },
- captchaImageRefresh: function (_form) {
- _form.captchaId = this.$common.uuid(8);
- _form.captchaImage =
- this.$constant.BASE_URI +
- "/captcha/captchaImage?type=math&captchaId=" +
- _form.captchaId +
- "&s=" +
- Math.random();
- },
- forgetPsw() {
- wx.showModal({
- title: "提示!",
- content: "管理端修改密码需要拨打客服电话咨询,是否拨打?",
- success: function (res) {
- if (res.confirm) {
- uni.makePhoneCall({
- phoneNumber: "", //电话号码
- success: function (e) {},
- fail: function (e) {},
- });
- }
- },
- });
- },
- loginClick() {
- if (this.loginType === "企业用户") {
- this.UserLogin();
- } else {
- this.login();
- }
- },
- UserLogin() {
- const _this = this;
- if (!this.loginForm.userName || !this.loginForm.password) {
- uni.showModal({
- title: "提示",
- content: "请输入账号和密码",
- icon: "error",
- showCancel: false,
- });
- return;
- }
- wx.login({
- success(e) {
- console.log(e);
- _this.loginForm.loginCode = e.code;
- loginByCompany(_this.loginForm).then((res) => {
- if (res.msg == "正常") {
- uni.showToast({
- title: "登录成功",
- icon: "none",
- mask: true,
- duration: 2000,
- });
- wx.setStorageSync("USERINFO", JSON.stringify(res.user_));
- uni.switchTab({
- url: "/pages/index/index",
- });
- } else {
- uni.showToast({
- title: res.errmsg,
- icon: "none",
- mask: true,
- duration: 2000,
- });
- _this.captchaImageRefresh(_this.loginForm);
- }
- });
- },
- });
- // this.$auth.setUserType(this.$auth.TYPE_FRAME);
- },
- login() {
- const _this = this;
- if (!this.loginForm.userName || !this.loginForm.password) {
- uni.showModal({
- title: "提示",
- content: "请输入账号和密码",
- icon: "error",
- showCancel: false,
- });
- return;
- }
- wx.login({
- success(e) {
- console.log(e);
- _this.loginForm.loginCode = e.code;
- login(_this.loginForm).then((res) => {
- console.log(res);
- if (res.errmsg == "成功") {
- uni.showToast({
- title: "登录成功",
- icon: "none",
- mask: true,
- duration: 2000,
- });
- console.log(res.data.user);
- wx.setStorageSync("USERINFO", JSON.stringify(res.data.user));
- uni.switchTab({
- url: "/pages/index/index",
- });
- } else {
- uni.showToast({
- title: res.errmsg,
- icon: "none",
- mask: true,
- duration: 2000,
- });
- _this.captchaImageRefresh(_this.loginForm);
- }
- });
- },
- });
- // this.$auth.setUserType(this.$auth.TYPE_FRAME);
- },
- onShareAppMessage: function () {},
- },
- };
- </script>
- <style lang="scss">
- .login {
- background: white;
- height: 100%;
- overflow: hidden;
- .logTit {
- width: 80vw;
- left: 10vw;
- top: 60vw;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- position: absolute;
- z-index: 1;
- color: rgba(51, 51, 51, 1);
- font-size: 4vw;
- p {
- color: rgba(102, 102, 102, 1);
- font-size: 4vw;
- margin-top: 0.5vw;
- }
- .titletxt {
- font-size: 48rpx;
- font-family: Taipei Sans TC Beta-Bold, Taipei Sans TC Beta;
- font-weight: bold;
- color: #333333;
- }
- .titletxt2 {
- font-size: 32rpx;
- font-family: PingFang SC-Regular, PingFang SC;
- font-weight: 400;
- color: #666666;
- }
- }
- .logobig2 {
- width: 100vw;
- height: 400rpx;
- position: absolute;
- left: 0;
- z-index: 0;
- }
- .loginBox {
- width: 86vw;
- left: 7vw;
- top: 156rpx;
- position: absolute;
- }
- .inputBox {
- position: relative;
- display: flex;
- align-items: center;
- margin-bottom: 30rpx;
- img {
- position: absolute;
- width: 7vw;
- // padding-top: 40px;
- }
- .yanzhengImg {
- right: 0 !important;
- width: 20vw;
- height: 10vw;
- z-index: 10;
- }
- .yanzhengImgBox {
- height: 50px;
- display: flex;
- align-items: center;
- }
- input {
- background: black;
- width: 100%;
- height: 76rpx;
- padding: 5rpx 0 5rpx 92rpx;
- border: 1rpx solid rgba(29, 24, 188, 0.05);
- margin: 5rpx 0;
- font-size: 32rpx;
- background: rgba(243, 245, 249, 1) !important;
- border-radius: 16rpx;
- }
- .b-palceholder {
- color: rgba(179, 179, 179, 1);
- }
- .yanzhengma {
- width: 100%;
- }
- }
- .pswBox {
- width: 100%;
- display: flex;
- justify-content: flex-end;
- margin: 20px 0;
- color: rgba(29, 24, 188, 1);
- }
- .van-button {
- margin-top: 15rpx;
- border-radius: 60px;
- }
- .loginbtn {
- margin-top: 50rpx;
- border-radius: 16rpx !important;
- padding: 24rpx;
- background: rgba(3, 101, 249, 1);
- color: white;
- font-size: 36rpx;
- }
- .bottomTips {
- width: 100vw;
- position: fixed;
- bottom: 100rpx;
- text-align: center;
- color: #999999;
- font-size: 28rpx;
- }
- @media screen and (max-height: 454px) {
- .bottomTips {
- display: none;
- }
- }
- .loginBody {
- background: white;
- border-radius: 16px 16px 0 0;
- position: relative;
- top: 336rpx;
- height: 1112rpx;
- .loginTypeBox {
- display: flex;
- justify-content: space-evenly;
- font-size: 40rpx;
- padding-top: 48rpx;
- color: rgba(86, 93, 106, 1);
- }
- .loginTypeItem {
- position: relative;
- .bottomLine {
- width: 40px;
- height: 6px;
- background: linear-gradient(90deg, #0365f9 0%, #85b5ff 100%);
- border-radius: 3px 3px 3px 3px;
- position: absolute;
- bottom: 0;
- z-index: 0;
- left: 40rpx;
- }
- .loginTypeName {
- position: relative;
- z-index: 1;
- }
- .ischecked {
- color: rgba(6, 35, 59, 1);
- font-weight: 600;
- }
- }
- }
- }
- </style>
|