增加注册接口

whyczyk

2022-05-18 aebf1e1b37328ec369cc96ffe8eb504805a5ccef

增加注册接口

 src/main.js

@@ -44,6 +44,8 @@
  Cascader,
  TreeSelect,
  DatetimePicker,
  RadioGroup,
  Radio
} from 'vant';

import App from './App.vue'
@@ -63,7 +65,7 @@

Vue.config.productionTip = false

Vue.use(Toast).use(Notify).use(Picker).use(Form).use(Image).use(Dialog).use(Tabbar).use(TabbarItem).use(CellGroup).use(Cell).use(Icon).use(Button).use(NavBar).use(Grid).use(GridItem).use(Row).use(Col).use(Collapse).use(CollapseItem).use(Steps).use(Step).use(Divider).use(Switch).use(Tag).use(Search).use(Field).use(Uploader).use(Popup).use(CheckboxGroup).use(Checkbox).use(PullRefresh).use(ActionSheet).use(List).use(Tab).use(Tabs).use(Empty).use(ImagePreview).use(IndexBar).use(IndexAnchor).use(SwipeCell).use(Cascader).use(TreeSelect).use(DatetimePicker);
Vue.use(Toast).use(Notify).use(Picker).use(Form).use(Image).use(Dialog).use(Tabbar).use(TabbarItem).use(CellGroup).use(Cell).use(Icon).use(Button).use(NavBar).use(Grid).use(GridItem).use(Row).use(Col).use(Collapse).use(CollapseItem).use(Steps).use(Step).use(Divider).use(Switch).use(Tag).use(Search).use(Field).use(Uploader).use(Popup).use(CheckboxGroup).use(Checkbox).use(PullRefresh).use(ActionSheet).use(List).use(Tab).use(Tabs).use(Empty).use(ImagePreview).use(IndexBar).use(IndexAnchor).use(SwipeCell).use(Cascader).use(TreeSelect).use(DatetimePicker).use(RadioGroup).use(Radio);

Vue.prototype.$G = G;
Vue.prototype.$notify = Notify;

 src/pages/login/js/api.js

@@ -12,6 +12,23 @@
        url: `LoginAction_login?uinf.UName=${username}&uinf.Upassword=${encodeURIComponent(encodeURIComponent(formatPassword(password)))}&uinf.UNote=${verity}&uinf.UId=0`,
        data: null
    });
}
/**
 * 注册账号
 * 参数 "uinf.UName="+用户名+"&uinf.Upassword="+密码+"&uinf.UId="+是否记住密码(0,1)
 * 密码需要使用hex_md5加密
 */
export const register = (UName, USnId, USex, UMobilephone) => {
    return axios({
        method: "post",
        url: `User_infAction!register`,
        data: "addjson=" + JSON.stringify({
            UName,
            USnId: encodeURIComponent(encodeURIComponent(formatPassword(USnId))),
            USex,
            UMobilephone
        })
    });
};

export const getLoginVerity = () => {

 src/pages/login/login.vue

@@ -3,24 +3,52 @@
        <div class="logo-bg"></div>
        <div class="login-con">
            <div class="appName">{{ platformName }}</div>
            <div class="login-title">登录</div>
            <div class="lineInput">
                <img src="../../assets/img/login-ico1.png" class="ico1">
                <van-field v-model="userName" placeholder="请输入账号" />
            <div class="login-title">
                <div :class="{'active':active===0}" class="tab" @click="tabClick(0)">登录</div>
                <div :class="{'active':active===1}" class="tab" @click="tabClick(1)">注册</div>
            </div>
            <div class="lineInput">
                <img src="../../assets/img/login-ico2.png" class="ico2">
                <van-field v-model="password" placeholder="请输入密码" type="password" />
            <div v-if="active==0">
                <div class="lineInput">
                    <img src="../../assets/img/login-ico1.png" class="ico1" />
                    <van-field v-model="userName" placeholder="请输入账号" />
                </div>
                <div class="lineInput">
                    <img src="../../assets/img/login-ico2.png" class="ico2" />
                    <van-field v-model="password" placeholder="请输入密码" type="password" />
                </div>
                <div class="subBtn" @click="submit">登录</div>
            </div>
            <div class="subBtn" @click="submit">登录</div>
        </div>
            <div v-if="active==1">
                <div class="lineInput">
                    <img src="../../assets/img/login-ico1.png" class="ico1" />
                    <van-field v-model="register.UName" placeholder="请输入账号" />
                </div>
                <div class="lineInput">
                    <img src="../../assets/img/login-ico2.png" class="ico2" />
                    <van-field v-model="register.USnId" placeholder="请输入密码" type="password" />
                </div>
                <div class="lineInput">
                    <img src="../../assets/img/login-ico1.png" class="ico1" />
                    <van-field v-model="register.UMobilephone" placeholder="请输入手机号" />
                </div>
                <div class="sexLine">
                    <div class="tips">选择性别</div>
                    <van-radio-group v-model="register.USex" direction="horizontal">
                        <van-radio name="男">男</van-radio>
                        <van-radio name="女">女</van-radio>
                    </van-radio-group>
                </div>

                <div class="subBtn" @click="toRegister">注册</div>
            </div>
        </div>
    </div>
</template>

<script>
import {
    login,
    register,
    searchPlatformName,
    getLoginVerity,
    getRealTabsConfig
@@ -32,6 +60,13 @@
            password: '',
            verifyCode: '',
            platformName: "",
            active: 0,
            register: {
                UName: '',
                USnId: '',
                USex: '男',
                UMobilephone: '',
            }
        }
    },
    mounted() {
@@ -39,6 +74,9 @@
        this.searchPlatformName();
    },
    methods: {
        tabClick(num) {
            this.active = num
        },
        searchPlatformName() {
            searchPlatformName()
                .then((res) => {
@@ -55,6 +93,49 @@
                    this.platformName = "蓄电池后台监控管理平台";
                    sessionStorage.setItem("platformName", this.platformName);
                });
        },
        //注册
        toRegister() {
            let self = this;
            if (self.register.UName == '') {
                self.$toast('请输入账号!')
                return
            }
            if (self.register.USnId == '') {
                self.$toast('请输入密码!')
                return
            }
            if (self.register.USex == '') {
                self.$toast('请选择性别!')
                return
            }
            if (self.register.UMobilephone == '') {
                self.$toast('请输入手机号!')
                return
            }
            // 开启等待框
            this.$toast.loading({
                message: '注册中...',
                duration: 0
            })
            console.log('self.register', self.register)
            register(self.register.UName, self.register.USnId, self.register.USex, self.register.UMobilephone).then(res => {
                let rs = JSON.parse(res.data.result);
                if (rs.code == 1) {
                    self.$toast("注册成功!");
                    this.active = 0;
                    this.register = {
                        UName: '',
                        USnId: '',
                        USex: '男',
                        UMobilephone: '',
                    }
                } else {
                    self.$toast("注册失败!");
                }
            }).catch(error => {
                self.$toast("注册失败");
            });
        },
        // 登录
        submit() {
@@ -79,6 +160,7 @@
                console.log(error)
                // 关闭等待
                // console.log(error);
                self.changeVerifyCode();
                self.$toast("网络异常");
            });
        },
@@ -160,15 +242,23 @@
}

.login-title {
    width: 110px;
    height: 76px;
    line-height: 76px;
    margin-bottom: 68px;
}

.login-title .tab {
    font-size: 50px;
    font-weight: bold;
    color: #333;
    border-bottom: 8px solid #4b88f9;
    color: rgb(185, 185, 185);
    text-align: center;
    margin-bottom: 68px;
    margin-right: 60px;
    float: left;
}

.login-title .tab.active {
    border-bottom: 8px solid #4b88f9;
    color: #333;
}

.lineInput {
@@ -197,6 +287,16 @@
    background-color: transparent;
}

.sexLine {
    width: 100%;
    height: 88px;
    border-radius: 44px;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.subBtn {
    width: 100%;
    height: 88px;