Skip to content

杨炀 / ztx_wx_admin

Go to a project
Toggle navigation
Toggle navigation pinning
198a047a by 杨炀
Options

add:登录

1 parent a7520530
Inline Side-by-side
Showing 21 changed files with 145 additions and 32 deletions
pages.json
...@@ -241,11 +241,9 @@ ...@@ -241,11 +241,9 @@
241 "enablePullDownRefresh": false 241 "enablePullDownRefresh": false
242 } 242 }
243 243
244 } 244 }, {
245 ,{ 245 "path": "pages/index/login",
246 "path" : "pages/index/login", 246 "style": {
247 "style" :
248 {
249 "navigationBarTitleText": "登录", 247 "navigationBarTitleText": "登录",
250 "enablePullDownRefresh": false 248 "enablePullDownRefresh": false
251 } 249 }
...@@ -253,7 +251,7 @@ ...@@ -253,7 +251,7 @@
253 } 251 }
254 ], 252 ],
255 "globalStyle": { 253 "globalStyle": {
256 "navigationStyle": "default", 254 "navigationStyle": "custom",
257 "navigationBarTextStyle": "white", 255 "navigationBarTextStyle": "white",
258 "navigationBarTitleText": "中跆协-工作台" 256 "navigationBarTitleText": "中跆协-工作台"
259 } 257 }
......
pages/index/index.vue
...@@ -113,6 +113,11 @@ ...@@ -113,6 +113,11 @@
113 if (app.globalData.isLogin) { 113 if (app.globalData.isLogin) {
114 init(); 114 init();
115 } else { 115 } else {
116 let path = '/pages/index/login';
117 uni.navigateTo({
118 url: path
119 });
120
116 app.firstLoadCallback = () => { 121 app.firstLoadCallback = () => {
117 init(); 122 init();
118 }; 123 };
...@@ -224,30 +229,6 @@ ...@@ -224,30 +229,6 @@
224 phoneNumber: venue.value.venueTelno 229 phoneNumber: venue.value.venueTelno
225 }); 230 });
226 } 231 }
227
228 function gogo() {
229 //拉起导航软件
230 proxy._mapContext.openMapApp({
231 latitude: parseFloat(latitude.value),
232 longitude: parseFloat(longitude.value),
233 destination: venue.value.venueAddress, //目标地址详情
234 success() {
235 console.log('success');
236 },
237 fail() {
238 console.log('fail');
239 uni.showToast({
240 title: '请安装导航软件',
241 icon: 'none',
242 duration: 2000
243 });
244 },
245 complete() {
246 console.log('complete');
247 }
248 });
249 }
250
251 function closeMaptypeList() { 232 function closeMaptypeList() {
252 this.showH5maptype = false; 233 this.showH5maptype = false;
253 } 234 }
......
pages/index/login.vue
1 <template> 1 <template>
2 <view> 2 <view>
3 登录 3 <view class="page-bg">
4 <image class="ren1" src="@/static/login/ren1.png"/>
5 <!-- 登录 -->
6 <view class="retop">
7 <image class="logotop" src="@/static/login/logo@2x.png"></image>
8 <view class="loginbox">
9 <view class="loginNav">
10 <view class="n1" :class="isActive==0?'active':''" @click="changeActive(0)">密码登录</view>
11 <view class="n2" :class="isActive==1?'active':''" @click="changeActive(1)">短信登录</view>
12 </view>
13 <!-- 密码登录 -->
14 <view class="formbox">
15 <form v-if="isActive==0">
16 <view class="round-input-item">
17 <image class="icon" src="@/static/login/tag01@2x.png"></image>
18 <input placeholder="账号"/>
19 </view>
20 <view class="round-input-item">
21 <image class="icon" src="@/static/login/tag02@2x.png"></image>
22 <input placeholder="密码"/>
23 </view>
24 <view class="round-input-item">
25 <image class="icon" src="@/static/login/tag03@2x.png"></image>
26 <input placeholder="图形验证码"/>
27 <image/>
28 </view>
29
30 </form>
31 <!-- 短信登录 -->
32 <form v-if="isActive==1">
33 <view class="round-input-item">
34 <image class="icon" src="@/static/login/tag01@2x.png"></image>
35 <input placeholder="请输入手机号"/>
36 </view>
37 <view class="round-input-item">
38 <image class="icon" src="@/static/login/tag02@2x.png"></image>
39 <input placeholder="图形验证码"/>
40 <image/>
41 </view>
42 <view class="round-input-item">
43 <image class="icon" src="@/static/login/tag04@2x.png"></image>
44 <input placeholder="短信验证码"/>
45 <text>获取验证码</text>
46 </view>
47
48 </form>
49
50 <view class="flex-item">
51 <view class="member" @click="changeAgree(isRember)">
52 <image v-if="isRember" src="@/static/login/xz_dwn@2x.png"/>
53 <image v-else src="@/static/login/xz@2x.png"/>
54 记住密码
55 </view>
56 <view class="text-red">忘记密码</view>
57 </view>
58 <view class="center-item">
59 <button class="btn-red">登录</button>
60 </view>
61 <view class="center-item">
62 <text class="text-red">没有账号，去注册</text>
63 </view>
64
65 </view>
66
67
68 </view>
69 </view>
70 <image class="ren2" src="@/static/login/ren2.png"/>
71 <view class="fixedagree">
72 <image @click="changeAgree(agree)" v-if="agree" src="@/static/login/xz_dwn@2x.png"></image>
73 <image v-else src="@/static/login/xz2@2x.png"></image>
74 <view>登录即代表您同意<text>《用户协议》</text><text>《隐私策略》</text></view>
75 </view>
76 </view>
4 </view> 77 </view>
5 </template> 78 </template>
6 79
7 <script setup> 80 <script setup>
81 import { ref } from 'vue'
82 const isActive = ref(0)
83 const agree = ref(false)
84 const isRember = ref(true)
8 85
86 function changeActive(n){
87 isActive.value = n
88 }
89 function changeAgree(item){
90 item = !item
91 }
9 </script> 92 </script>
10 93
11 <style> 94 <style scoped lang="scss">
95 .logotop{width: 510rpx;height: 215rpx;margin:5vh auto 40rpx;display: block;}
96 .ren1{width: 300rpx;height: 560rpx;position: absolute;right: 0;top: 0;}
97 .ren2{width: 456rpx;height:600rpx;position: relative;top: 20rpx;}
98 .retop{position: relative;z-index: 1;}
99 .page-bg{background: url('@/static/login/bg.png') no-repeat center;
100 background-size: cover;
101 height: 100vh;overflow: hidden;position: relative;
102 }
103 .loginbox{
104 .loginNav{width: 700rpx;margin:0 auto -53rpx;height: 133rpx;overflow: hidden;position: relative;
105 view{text-align: center;height: 133rpx;box-sizing: border-box;padding: 26rpx 0 0;}
106 .n1{background: url('@/static/login/tab1.png') no-repeat top left;background-size:contain;opacity: 0.7;
107 width: 407rpx;position: absolute;left: 0;}
108 .n2{background: url('@/static/login/tab2.png') no-repeat top right;background-size:contain;opacity: 0.7;
109 width: 399rpx;position: absolute;right: 0;}
110 .active{color: #AD181F;opacity: 1;
111 &::after{content: '';position: absolute;width: 25rpx;height: 4rpx;background: #AD181F;border-radius: 2rpx;
112 left: 0;right: 0;margin: auto;bottom: 50rpx;
113 }
114 }
115 }
116 }
117 .formbox{background: #fff;width: 700rpx;padding: 50rpx;margin: auto;border-radius: 20rpx;}
118 .flex-item{display: flex;justify-content: space-between;margin:30rpx 0;
119 font-size: 28rpx;
120 image{width: 30rpx;height: 30rpx;margin-right:16rpx;}
121 }
122 .member{color: #4C5359;display: flex;align-items: center;}
123 .center-item{text-align: center;margin: 30rpx 0 0;font-size: 30rpx;
124 .btn-red{border-radius: 40rpx;width: 600rpx;line-height: 80rpx;font-size: 36rpx;}
125 }
126 .btn-red{background: #AD181F;color: #fff;}
127 .text-red{color: #AD181F;}
128 .round-input-item{overflow: hidden;background: RGBA(247, 247, 248, 1);border-radius: 40rpx;
129 padding: 0 0 0 30rpx;
130 height: 80rpx;margin-bottom: 30rpx;display: flex;align-items: center;
131 image{width: 180rpx;height: 80rpx;
132 &.icon{width: 30rpx;height: 30rpx;margin-right:16rpx;}
133 }
134 input{border-left: 1rpx solid RGBA(214, 216, 219, 1);padding: 0 0 0 20rpx;font-size: 30rpx;
135 }
136 input::-webkit-input-placeholder{color:RGBA(158, 166, 174, 1);font-size: 30rpx;}
137 input::placeholder{color:RGBA(158, 166, 174, 1);font-size: 30rpx;}
138 input::-moz-placeholder{color:RGBA(158, 166, 174, 1);font-size: 30rpx;}
139
140 text{font-size: 28rpx;color: #014A9F;}
141 }
12 142
143 .fixedagree{position: fixed;bottom: 5vh;color: rgba(255, 255, 255, 0.7);display: flex;
144 font-size: 24rpx;width: 100vw;justify-content: center;
145 image{width: 40rpx;height: 40rpx;margin-right: 20rpx;}
146 }
13 </style> 147 </style>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!