guzijian / garbage-removal · Commits

Commit 116fac558d59c02329385d3db3faaff0778ac92b

Authored by lichao
1 parent c8d9dda1
build: skipped

提交

Inline Side-by-side
Showing 10 changed files with 960 additions and 378 deletions
garbage-removal/src/main.js
  View file @116fac5
... ... @@ -28,7 +28,7 @@ list.forEach(item => { //用遍历的方式分别为,uni.navigateTo,uni.redirect
28 28 // 重定向到登录页面
29 29 uni.setStorageSync("cancelFlag", false);
30 30 uni.reLaunch({
31   - url: "/pages/login/index",
  31 + url: "/pages/login/code",
32 32 })
33 33 } else if (res.cancel) {
34 34 console.log('用户点击取消');
... ...
garbage-removal/src/pages.json
  View file @116fac5
... ... @@ -21,10 +21,18 @@
21 21 "navigationBarTitleText": "",
22 22 "enablePullDownRefresh": false
23 23 }
24   - },{
  24 + },
  25 + {
  26 + "path": "pages/sign-up/index",
  27 + "style": {
  28 + "navigationBarTitleText": "",
  29 + "enablePullDownRefresh": false
  30 + }
  31 + }
  32 + ,{
25 33 "path": "pages/login/code",
26 34 "style": {
27   - "navigationBarTitleText": "输入验证码",
  35 + "navigationBarTitleText": "登录",
28 36 "enablePullDownRefresh": false
29 37 }
30 38 },{
... ...
garbage-removal/src/pages/home/index.vue
  View file @116fac5
... ... @@ -29,7 +29,7 @@
29 29 <view class="company-list-box" v-if="(addressInfo && userType == '用户')||userType == '运输企业负责人'||userType == '清运车辆驾驶员'">
30 30 <view class="company-list-header">
31 31  
32   - <view class="search-box" v-if="(addressInfo && userType == '用户')">
  32 + <view class="search-box" v-if="(addressInfo && userType == '用户') ||userType == '运输企业负责人'">
33 33 <u-search
34 34 v-model="searchKeyword"
35 35 :show-action="true"
... ... @@ -311,7 +311,7 @@ const handleCleanClick = () =&gt; {
311 311 // 重定向到登录页面
312 312 uni.setStorageSync("cancelFlag", false);
313 313 uni.reLaunch({
314   - url: "/pages/login/index",
  314 + url: "/pages/login/code",
315 315 })
316 316 } else if (res.cancel) {
317 317 console.log('用户点击取消');
... ...
garbage-removal/src/pages/login/code.vue
  View file @116fac5
  1 +
1 2 <template>
2   - <view class="wrap">
3   - <view class="key-input">
4   - <view class="title">输入验证码</view>
5   - <view class="tips">验证码已发送至 +{{ startIphoneNumber }}</view>
6   - <u-message-input :value="value" :focus="true" @change="change" @finish="finish" mode="bottomLine"
7   - :maxlength="maxlength"></u-message-input>
8   - <text v-if="verifyFlag" class="error">验证码错误，请重新输入</text>
9   - <view class="captcha">
10   - <text :class="{ noCaptcha: show }" @tap="noCaptcha">收不到验证码点这里</text>
11   - <text :class="{ regain: !show }">{{ second }}秒后重新获取验证码</text>
12   - </view>
13   - </view>
14   - </view>
  3 + <view class="wrap">
  4 + <view class="key-input">
  5 + <view class="title">欢迎登录</view>
  6 +
  7 + <!-- 登录方式切换 -->
  8 + <view class="login-type-switch">
  9 + <text
  10 + :class="{ active: loginType === 'code' }"
  11 + @click="switchLoginType('code')"
  12 + >
  13 + 验证码登录
  14 + </text>
  15 + <text
  16 + :class="{ active: loginType === 'password' }"
  17 + @click="switchLoginType('password')"
  18 + >
  19 + 密码登录
  20 + </text>
  21 + </view>
  22 +
  23 + <!-- 手机号输入 -->
  24 + <view class="input-wrapper">
  25 + <u-icon name="account" size="36" color="#909399" class="input-icon"></u-icon>
  26 + <input
  27 + class="login-input"
  28 + type="text"
  29 + v-model="iphoneNumber"
  30 + placeholder="请输入手机号"
  31 + placeholder-class="placeholder-style"
  32 + />
  33 + </view>
  34 +
  35 + <!-- 验证码登录 -->
  36 + <view v-if="loginType === 'code'">
  37 + <view class="tips">验证码已发送至 +{{ startIphoneNumber || iphoneNumber }}</view>
  38 + <u-message-input
  39 + :value="codeValue"
  40 + :focus="true"
  41 + @change="handleCodeChange"
  42 + @finish="finish"
  43 + mode="bottomLine"
  44 + :maxlength="maxlength"
  45 + ></u-message-input>
  46 + <text v-if="verifyFlag" class="error">验证码错误，请重新输入</text>
  47 + <view class="captcha">
  48 + <text :class="{ noCaptcha: show }" @tap="getCaptcha">获取验证码</text>
  49 + <text :class="{ regain: !show }" v-if="!show">{{ second }}秒后重新获取</text>
  50 + </view>
  51 + </view>
  52 +
  53 + <!-- 密码登录 -->
  54 + <view v-else>
  55 + <view class="input-wrapper">
  56 + <u-icon name="lock" size="36" color="#909399" class="input-icon"></u-icon>
  57 + <input
  58 + class="login-input"
  59 + type="password"
  60 + v-model="password"
  61 + placeholder="请输入密码"
  62 + placeholder-class="placeholder-style"
  63 + />
  64 + </view>
  65 + <button @tap="loginWithPassword" class="login-btn">登录</button>
  66 + </view>
  67 +
  68 + <view class="alternative">
  69 + <text class="link" @click="toRegister">立即注册</text>
  70 + <text class="link" @click="forgetPassword">忘记密码?</text>
  71 + </view>
  72 + </view>
  73 + </view>
15 74 </template>
16 75  
17   -<script setup>
18   -import { sendCode, userLogin } from "@/apis/user.js";
  76 +<script setup>import { sendCode, userLogin } from "@/apis/user.js";
19 77 import { setRequestToken } from '@/utils/request/request.js';
20 78 import { useMainStore } from '@/stores/index.js';
21 79 import { onLoad } from "@dcloudio/uni-app";
22 80 import { getCurrentInstance, ref } from "vue";
  81 +
23 82 const { proxy } = getCurrentInstance();
24 83 const store = useMainStore();
25   -const verifyFlag = ref(false)
26   -const iphoneNumber = ref("")
27   -const startIphoneNumber = ref("")
28   -const maxlength = ref(4)
29   -const value = ref("")
30   -const second = ref(10);
31   -const show = ref(false)
32 84  
33   -onLoad((options) => {
34   - iphoneNumber.value = options.iphoneNumber;
35   - startIphoneNumber.value = handleIphoneNumber("" + options.iphoneNumber);
36   - getCaptcha(iphoneNumber.value)
37   -})
38   -const handleIphoneNumber = (tel) => {
39   - return tel.replace(tel.substring(3, 7), "****");
40   -}
  85 +// 登录方式：code-验证码登录，password-密码登录
  86 +const loginType = ref('code');
41 87  
42   -const getCaptcha = (iphoneNumber) => {
43   - value.value = ''
44   - second.value = 10
45   - show.value = false;
46   - sendCode(iphoneNumber).then(res => {
47   - proxy.$u.toast(res.data.data)
48   - })
49   - let interval = setInterval(() => {
50   - second.value--;
51   - if (second.value <= 0) {
52   - show.value = true
53   - clearInterval(interval);
54   - }
55   - }, 1000);
  88 +// 验证码登录相关
  89 +const verifyFlag = ref(false);
  90 +const iphoneNumber = ref("");
  91 +const startIphoneNumber = ref("");
  92 +const maxlength = ref(4);
  93 +const codeValue = ref("");
  94 +const second = ref(0);
  95 +const show = ref(true);
56 96  
57   -}
58   -// 收不到验证码选择时的选择
59   -const noCaptcha = () => {
60   - uni.showActionSheet({
61   - itemList: ['重新获取验证码'],
62   - success: function (res) {
63   - getCaptcha(iphoneNumber.value)
64   - },
65   - fail: function (res) {
66   -
67   - }
68   - });
69   -}
  97 +// 密码登录相关
  98 +const password = ref("");
70 99  
71   -// 校验验证码
72   -const checkVerifyNum = (code) => {
73   - userLogin({ loginType: 0, tel: iphoneNumber.value, code: code }).then(res => {
74   - console.log(res);
75   - // 登录成功
76   - if (res.data.code===200) {
77   - verifyFlag.value = false;
78   - store.tempToken = res.data.data.token
79   - if (res.data.data.token) {
80   - setRequestToken(res.data.data.token)
81   - }
82   - store.userInfo = {};
83   - store.userName = res.data.data.name !=null ? res.data.data.name : "";
84   - store.userInfo.userName = res.data.data.name;
85   - store.userPhone = res.data.data.loginPhone;
86   - if(res.data.data.testUser){
87   - // uni.navigateTo({
88   - // url: `/pages/wode-info/wode-info-choose/index?ruleVos= ${encodeURIComponent(JSON.stringify(res.data.data.ruleVos))}&userName=${encodeURIComponent(res.data.data.name)}`""
89   - // });
90   - if (store.tempToken) {
91   - store.token = store.tempToken
92   - store.tempToken = "";
93   - }
94   - const ruleVos = res.data.data.ruleVos;
95   - if(ruleVos!=null && ruleVos.length>0){
96   - // console.log(store.userInfo);
97   - //默认用户
98   - store.userType = ruleVos[0].userType;
99   - store.userInfo.userType = ruleVos[0].userType;
100   - store.userInfo.ruleVos = ruleVos;
101   - //判断是哪种角色
102   - for(let rule of ruleVos){
103   - store.userInfo.transportCompanyName = null;
104   - // console.log(rule)
105   - if(rule.userType==="处置场所负责人"){
106   - store.userType = rule.userType;
107   - store.userInfo.userType = rule.userType;
108   - store.userInfo.transportCompanyName = rule.transportCompanyName;
109   - uni.$u.route({
110   - type: "switchTab",
111   - url: `pages/order/index`,
112   - })
113   - }
114   - if(rule.userType==="运输企业负责人"){
115   - store.userType = rule.userType;
116   - store.userInfo.userType = rule.userType;
117   - store.userInfo.transportCompanyName = rule.transportCompanyName;
118   - }
119   - if(rule.userType==="清运车辆驾驶员"){
120   - store.userType = rule.userType;
121   - store.userInfo.userType = rule.userType;
122   - store.userInfo.transportCompanyName = rule.transportCompanyName;
123   - }
124   - }
125   - }
126   - uni.$u.route({
127   - type: "switchTab",
128   - url: `/pages/home/index`,
129   - })
130   - }else{
131   - uni.$u.toast("该手机无法登录，不是投放点管理员");
132   - }
133   -
134   - } else {
135   - verifyFlag.value = true;
136   - uni.$u.toast(res.data.msg);
137   - }
138   - })
139   -}
  100 +// 切换登录方式
  101 +const switchLoginType = (type) => {
  102 + loginType.value = type;
  103 +};
140 104  
141   -// change事件侦听
142   -const change = (value) => {
143   - // console.log("value:", value);
144   -}
  105 +// 获取验证码
  106 +const getCaptcha = () => {
  107 + if (!proxy.$u.test.mobile(iphoneNumber.value)) {
  108 + proxy.$u.toast("请输入正确的手机号");
  109 + return;
  110 + }
  111 +
  112 + codeValue.value = '';
  113 + second.value = 60;
  114 + show.value = false;
  115 +
  116 + sendCode(iphoneNumber.value).then(res => {
  117 + proxy.$u.toast(res.data.data);
  118 + });
  119 +
  120 + let interval = setInterval(() => {
  121 + second.value--;
  122 + if (second.value <= 0) {
  123 + show.value = true;
  124 + clearInterval(interval);
  125 + }
  126 + }, 1000);
  127 +};
145 128  
146   -// 输入完验证码最后一位执行
  129 +// 验证码输入变化
  130 +const handleCodeChange = (value) => {
  131 + codeValue.value = value;
  132 +};
  133 +
  134 +// 验证码输入完成
147 135 const finish = (value) => {
148   - if (value.length == 4) {
149   - checkVerifyNum(value);
150   - }
151   -}
  136 + if (value.length == 4) {
  137 + checkVerifyNum(value);
  138 + }
  139 +};
  140 +
  141 +// 验证码登录
  142 +const checkVerifyNum = (code) => {
  143 + userLogin({ loginType: 0, tel: iphoneNumber.value, code: code }).then(res => {
  144 + handleLoginSuccess(res);
  145 + });
  146 +};
  147 +
  148 +// 密码登录
  149 +const loginWithPassword = () => {
  150 + if (!proxy.$u.test.mobile(iphoneNumber.value)) {
  151 + proxy.$u.toast("请输入正确的手机号");
  152 + return;
  153 + }
  154 +
  155 + if (!password.value) {
  156 + proxy.$u.toast("请输入密码");
  157 + return;
  158 + }
  159 +
  160 + userLogin({
  161 + loginType: 0,
  162 + tel: iphoneNumber.value,
  163 + password: password.value
  164 + }).then(res => {
  165 + handleLoginSuccess(res);
  166 + });
  167 +};
  168 +
  169 +// 处理登录成功
  170 +const handleLoginSuccess = (res) => {
  171 + if (res.data.code === 200) {
  172 + verifyFlag.value = false;
  173 +
  174 + // 设置token和用户信息
  175 + store.tempToken = res.data.data.token;
  176 + if (res.data.data.token) {
  177 + setRequestToken(res.data.data.token);
  178 + uni.setStorageSync("Authorization", res.data.data.token);
  179 + }
  180 +
  181 + store.userInfo = {};
  182 + store.userName = res.data.data.name != null ? res.data.data.name : "";
  183 + store.userInfo.userName = res.data.data.name;
  184 + store.userPhone = res.data.data.loginPhone;
  185 +
  186 + console.log(res.data.data)
  187 + if(res.data.data.testUser){
  188 + if (store.tempToken) {
  189 + store.token = store.tempToken;
  190 + store.tempToken = "";
  191 + }
  192 +
  193 + const ruleVos = res.data.data.ruleVos;
  194 + if(ruleVos != null && ruleVos.length > 0){
  195 + store.userType = ruleVos[0].userType;
  196 + store.userInfo.userType = ruleVos[0].userType;
  197 + store.userInfo.ruleVos = ruleVos;
  198 +
  199 + let hasSpecialRole = false;
  200 + for(let rule of ruleVos){
  201 + store.userInfo.transportCompanyName = null;
  202 +
  203 + if(rule.userType === "处置场所负责人"){
  204 + store.userType = rule.userType;
  205 + store.userInfo.userType = rule.userType;
  206 + store.userInfo.transportCompanyName = rule.transportCompanyName;
  207 + hasSpecialRole = true;
  208 +
  209 + uni.$u.route({
  210 + type: "switchTab",
  211 + url: `pages/order/index`,
  212 + });
  213 + return;
  214 + }
  215 +
  216 + if(rule.userType === "运输企业负责人"){
  217 + store.userType = rule.userType;
  218 + store.userInfo.userType = rule.userType;
  219 + store.userInfo.transportCompanyName = rule.transportCompanyName;
  220 + }
  221 +
  222 + if(rule.userType === "清运车辆驾驶员"){
  223 + store.userType = rule.userType;
  224 + store.userInfo.userType = rule.userType;
  225 + store.userInfo.transportCompanyName = rule.transportCompanyName;
  226 + }
  227 + }
  228 +
  229 + if (!hasSpecialRole) {
  230 + uni.$u.route({
  231 + type: "switchTab",
  232 + url: `/pages/home/index`,
  233 + });
  234 + }
  235 + } else {
  236 + uni.$u.route({
  237 + type: "switchTab",
  238 + url: `/pages/home/index`,
  239 + });
  240 + }
  241 + } else {
  242 + uni.$u.toast("该手机无法登录，不是投放点管理员");
  243 + }
  244 + } else {
  245 + verifyFlag.value = true;
  246 + uni.$u.toast(res.data.msg);
  247 + }
  248 +};
  249 +
  250 +// 跳转到注册页面
  251 +const toRegister = () => {
  252 + uni.$u.route({
  253 + url: 'pages/sign-up/index'
  254 + });
  255 +};
  256 +
  257 +// 忘记密码
  258 +const forgetPassword = () => {
  259 + // 实现忘记密码逻辑
  260 + console.log("忘记密码");
  261 +};
  262 +
  263 +onLoad((options) => {
  264 + // 如果从其他页面传入手机号
  265 + if (options.iphoneNumber) {
  266 + iphoneNumber.value = options.iphoneNumber;
  267 + startIphoneNumber.value = handleIphoneNumber("" + options.iphoneNumber);
  268 + }
  269 +});
  270 +
  271 +const handleIphoneNumber = (tel) => {
  272 + return tel.replace(tel.substring(3, 7), "****");
  273 +};
152 274 </script>
153 275  
154   -<style lang="scss" scoped>
155   -.wrap {
156   - padding: 80rpx;
  276 +<style lang="scss" scoped>.wrap {
  277 + padding: 80rpx;
157 278 }
158 279  
159   -.box {
160   - margin: 30rpx 0;
161   - font-size: 30rpx;
162   - color: 555;
  280 +.title {
  281 + font-size: 50rpx;
  282 + color: #333;
  283 + text-align: center;
  284 + margin-bottom: 40rpx;
163 285 }
164 286  
165   -.key-input {
166   - padding: 30rpx 0;
  287 +.login-type-switch {
  288 + display: flex;
  289 + justify-content: center;
  290 + margin-bottom: 40rpx;
  291 +
  292 + text {
  293 + padding: 10rpx 20rpx;
  294 + margin: 0 10rpx;
  295 + border-radius: 20rpx;
  296 + cursor: pointer;
  297 +
  298 + &.active {
  299 + background-color: #19a97c;
  300 + color: white;
  301 + }
  302 + }
  303 +}
167 304  
168   - -webkit-user-select: text !important;
  305 +.input-wrapper {
  306 + display: flex;
  307 + align-items: center;
  308 + border-bottom: 1px solid #e4e7ed;
  309 + padding: 20rpx 0;
  310 + margin-bottom: 30rpx;
169 311  
170   - text {
171   - display: none;
172   - }
  312 + .input-icon {
  313 + margin-right: 20rpx;
  314 + }
173 315  
174   - .error {
175   - display: block;
176   - color: red;
177   - font-size: 30rpx;
178   - margin: 20rpx 0;
179   - }
  316 + .login-input {
  317 + flex: 1;
  318 + font-size: 28rpx;
  319 + color: #303133;
  320 + padding: 10rpx 0;
  321 +
  322 + &::placeholder {
  323 + color: #c0c4cc;
  324 + }
  325 + }
180 326 }
181 327  
182   -.title {
183   - font-size: 50rpx;
184   - color: #333;
  328 +.placeholder-style {
  329 + color: #c0c4cc;
  330 + font-size: 26rpx;
185 331 }
186 332  
187   -.key-input .tips {
188   - font-size: 30rpx;
189   - color: #333;
190   - margin-top: 20rpx;
191   - margin-bottom: 60rpx;
  333 +.tips {
  334 + font-size: 28rpx;
  335 + color: #333;
  336 + margin: 20rpx 0;
192 337 }
193 338  
194 339 .captcha {
195   - color: $u-warning;
196   - font-size: 30rpx;
197   - margin-top: 40rpx;
  340 + color: $u-warning;
  341 + font-size: 28rpx;
  342 + margin-top: 40rpx;
  343 + display: flex;
  344 + justify-content: space-between;
  345 +
  346 + .noCaptcha {
  347 + display: block;
  348 + cursor: pointer;
  349 + }
  350 +
  351 + .regain {
  352 + display: block;
  353 + }
  354 +}
  355 +
  356 +.error {
  357 + display: block;
  358 + color: red;
  359 + font-size: 28rpx;
  360 + margin: 20rpx 0;
  361 +}
  362 +
  363 +.login-btn {
  364 + background-color: #19a97c;
  365 + color: #ffffff;
  366 + border: none;
  367 + font-size: 30rpx;
  368 + padding: 12rpx 0;
  369 + border-radius: 50rpx;
  370 + margin-top: 60rpx;
  371 + width: 100%;
  372 +
  373 + &::after {
  374 + border: none;
  375 + }
  376 +}
198 377  
199   - .noCaptcha {
200   - display: block;
201   - }
  378 +.alternative {
  379 + color: $u-tips-color;
  380 + display: flex;
  381 + justify-content: space-between;
  382 + margin-top: 60rpx;
202 383  
203   - .regain {
204   - display: block;
205   - }
  384 + .link {
  385 + color: $u-warning;
  386 + cursor: pointer;
  387 + }
206 388 }
207 389 -</style>
  390 +</style>
208 391 \ No newline at end of file
... ...
garbage-removal/src/pages/login/index.vue
  View file @116fac5
1 1 <template>
2   - <view class="wrap">
3   - <view class="top"></view>
4   - <u-toast ref="uToastRef"></u-toast>
5   - <view class="content">
6   - <view class="title">欢迎登录</view>
7   - <input class="u-border-bottom" type="number" v-model="tel" placeholder="请输入手机号" />
8   - <!-- <view class="tips">未注册的手机号验证后自动创建账号</view> -->
9   - <button @tap="submit" :style="[inputStyle]" class="getCaptcha">获取短信验证码</button>
10   - <view class="alternative">
11   - </view>
12   - </view>
13   - <view class="buttom">
14   - <!-- <view class="loginType">
15   - <view class="wechat item">
16   - <button class="box" open-type="getPhoneNumber" @getphonenumber="handleWeixinLogin">
17   - <view class="icon"><u-icon size="60" name="weixin-fill" color="rgb(83,194,64)"></u-icon>
18   - </view>
19   - 微信登录
20   - </button>
21   - </view>
22   - </view> -->
23   - <view class="hint">
24   - <view style="display: flex; justify-content: flex-start;" @click="radioChange">
25   - <u-checkbox-group v-model="agree" placement="row" @change="groupChange">
26   - <!-- 选中颜色为绿色 -->
27   - <u-checkbox shape="square" activeColor="#19a97c" :size="28"
28   - :customStyle="{ marginBottom: '0px', marginTop: '1px' }" :key="0" :name="true">
29   - </u-checkbox>
30   - </u-checkbox-group>
31   - </view>
32   - <view class="prompt-txt">
33   - 登录代表同意
34   - <text class="link" @click="handleUserAgreement">用户协议、隐私政策，</text>
35   - 并授权使用您的账号信息（如昵称、头像、收获地址）以便您统一管理。
36   - </view>
37   - </view>
38   - </view>
39   - </view>
  2 + <view class="wrap">
  3 + <view class="top"></view>
  4 + <u-toast ref="uToastRef"></u-toast>
  5 + <view class="content">
  6 + <view class="title">欢迎登录</view>
  7 +
  8 + <!-- 手机号输入框 -->
  9 + <view class="input-wrapper">
  10 + <u-icon name="account" size="36" color="#909399" class="input-icon"></u-icon>
  11 + <input
  12 + class="login-input"
  13 + type="text"
  14 + v-model="tel"
  15 + placeholder="请输入手机号"
  16 + placeholder-class="placeholder-style"
  17 + />
  18 + </view>
  19 +
  20 + <!-- 密码输入框 -->
  21 + <view class="input-wrapper">
  22 + <u-icon name="lock" size="36" color="#909399" class="input-icon"></u-icon>
  23 + <input
  24 + class="login-input"
  25 + type="password"
  26 + v-model="password"
  27 + placeholder="请输入密码"
  28 + placeholder-class="placeholder-style"
  29 + />
  30 + </view>
  31 +
  32 + <button @tap="submit" :style="[inputStyle]" class="getCaptcha">登录</button>
  33 + <view class="alternative">
  34 + <text class="link" @click="toRegister">立即注册</text>
  35 + <text class="link" @click="forgetPassword">忘记密码?</text>
  36 + </view>
  37 + </view>
  38 + <view class="buttom">
  39 + <view class="hint">
  40 + <view style="display: flex; justify-content: flex-start;" @click="radioChange">
  41 + <u-checkbox-group v-model="agree" placement="row" @change="groupChange">
  42 + <u-checkbox shape="square" activeColor="#19a97c" :size="28"
  43 + :customStyle="{ marginBottom: '0px', marginTop: '1px' }" :key="0" :name="true">
  44 + </u-checkbox>
  45 + </u-checkbox-group>
  46 + </view>
  47 + <view class="prompt-txt">
  48 + 登录代表同意
  49 + <text class="link" @click="handleUserAgreement">用户协议、隐私政策，</text>
  50 + 并授权使用您的账号信息（如昵称、头像、收获地址）以便您统一管理。
  51 + </view>
  52 + </view>
  53 + </view>
  54 + </view>
40 55 </template>
41 56  
42 57 <script>
43 58 import { userLogin } from "@/apis/user.js";
  59 +import { useMainStore } from '@/stores/index.js';
44 60 export default {
45   - data() {
46   - return {
47   - tel: '',
48   - agree: []
49   - }
50   - },
51   - computed: {
52   - inputStyle() {
53   - let style = {};
54   - if (this.tel) {
55   - style.color = "#fff";
56   - style.backgroundColor = this.$u.color['success'];
57   - }
58   - return style;
59   - }
60   - },
61   - methods: {
62   - groupChange(e) {
63   - console.log(e);
64   - },
65   - submit() {
66   - if (this.$u.test.mobile(this.tel)) {
67   - if (this.agree[0]) {
68   - this.$u.route({
69   - url: `pages/login/code?iphoneNumber=${this.tel}`,
70   - })
71   - } else {
72   - let that = this
73   - uni.showModal({
74   - title: '提示',
75   - content: '需要同意登录协议',
76   - success: function (res) {
77   - if (res.confirm) {
78   - that.agree[0] = true
79   - } else if (res.cancel) {
80   - }
81   - }
82   - })
83   - }
84   - } else {
85   - this.$refs.uToastRef.show({
86   - type: 'default',
87   - title: '默认主题',
88   - message: "手机号不对",
89   - complete() {
90   -
91   - }
92   - })
93   - }
94   - },
95   - handleUserAgreement() {
96   - console.log("user click agreement");
97   - },
98   - radioChange() {
99   - this.agree[0] = !this.agree[0]
100   - },
101   - handleWeixinLogin(wxInfo) {
102   - uni.login({
103   - provider: 'weixin',
104   - success: res => {
105   - userLogin({ loginType: type, encryptedData: wxInfo.detail.encryptedData, iv: wxInfo.detail.iv, wxCode: res.code })
106   - .then(res => {
107   - console.log(res);
108   - })
109   - }
110   - });
111   - }
112   - }
  61 + data() {
  62 + return {
  63 + tel: '',
  64 + nickname: '',
  65 + password: '',
  66 + agree: []
  67 + }
  68 + },
  69 + computed: {
  70 + inputStyle() {
  71 + let style = {};
  72 + if (this.username && this.password) {
  73 + style.color = "#fff";
  74 + style.backgroundColor = this.$u.color['success'];
  75 + }
  76 + return style;
  77 + }
  78 + },
  79 + methods: {
  80 + toRegister() {
  81 + this.$u.route({
  82 + url: 'pages/sign-up/index'
  83 + });
  84 + },
  85 + groupChange(e) {
  86 + console.log(e);
  87 + },
  88 + submit() {
  89 + if (this.$u.test.mobile(this.tel)) {
  90 + if (this.agree[0]) {
  91 + userLogin({
  92 + loginType: 0,
  93 + tel: this.tel,
  94 + password: this.password
  95 + }).then(res => {
  96 + if (res.data.code === 200) {
  97 + console.log('登录成功', res);
  98 + uni.setStorageSync("cancelFlag", false);
  99 + this.$u.route({
  100 + type: "switchTab",
  101 + url: `/pages/home/index`,
  102 + });
  103 + } else if (res.data.code === 500) {
  104 + this.$refs.uToastRef.show({
  105 + type: 'error',
  106 + message: "用户不存在"
  107 + });
  108 + } else {
  109 + console.log(res.data);
  110 + }
  111 + }).catch(err => {
  112 + this.$refs.uToastRef.show({
  113 + type: 'error',
  114 + message: "网络错误，请稍后再试"
  115 + });
  116 + });
  117 + } else {
  118 + let that = this;
  119 + uni.showModal({
  120 + title: '提示',
  121 + content: '需要同意登录协议',
  122 + success: function (res) {
  123 + if (res.confirm) {
  124 + that.agree[0] = true;
  125 + } else if (res.cancel) {
  126 + }
  127 + }
  128 + });
  129 + }
  130 + } else {
  131 + this.$refs.uToastRef.show({
  132 + type: 'default',
  133 + title: '默认主题',
  134 + message: "手机号不对",
  135 + complete() {
  136 + }
  137 + });
  138 + }
  139 + },
  140 + handleUserAgreement() {
  141 + console.log("user click agreement");
  142 + },
  143 + radioChange() {
  144 + this.agree[0] = !this.agree[0]
  145 + },
  146 + handleWeixinLogin(wxInfo) {
  147 + uni.login({
  148 + provider: 'weixin',
  149 + success: res => {
  150 + userLogin({ loginType: type, encryptedData: wxInfo.detail.encryptedData, iv: wxInfo.detail.iv, wxCode: res.code })
  151 + .then(res => {
  152 + console.log(res);
  153 + })
  154 + }
  155 + });
  156 + }
  157 + }
113 158 }
114 159 </script>
115 160  
116 161 <style lang="scss" scoped>
117 162 .wrap {
118   - font-size: 28rpx;
119   -
120   - .content {
121   - width: 600rpx;
122   - margin: 80rpx auto 0;
123   -
124   - .title {
125   - text-align: left;
126   - font-size: 60rpx;
127   - font-weight: 500;
128   - margin-bottom: 100rpx;
129   - }
130   -
131   - input {
132   - text-align: left;
133   - margin-bottom: 10rpx;
134   - padding-bottom: 6rpx;
135   - }
136   -
137   - .tips {
138   - color: $u-info;
139   - margin-bottom: 60rpx;
140   - margin-top: 8rpx;
141   - font-size: 12px;
142   - }
143   -
144   - .getCaptcha {
145   - background-color: #19a97c;
146   - color: #ffffff;
147   - border: none;
148   - font-size: 30rpx;
149   - padding: 12rpx 0;
150   -
151   - &::after {
152   - border: none;
153   - }
154   - }
155   -
156   - .alternative {
157   - color: $u-tips-color;
158   - display: flex;
159   - justify-content: space-between;
160   - margin-top: 30rpx;
161   - }
162   - }
163   -
164   - .buttom {
165   - .loginType {
166   - display: flex;
167   - padding: 350rpx 150rpx 150rpx 150rpx;
168   - justify-content: center;
169   -
170   - .item {
171   - .box {
172   - display: flex;
173   - flex-direction: column;
174   - align-items: center;
175   - color: $u-content-color;
176   - justify-content: center;
177   - font-size: 28rpx;
178   - background-color: #ffffff00;
179   - border-radius: 0 !important;
180   - border: 0 solid #ffffff00 !important;
181   - padding: 0 !important;
182   - margin: 0 !important;
183   -
184   - &::after {
185   - border: none;
186   - }
187   -
188   - }
189   -
190   - }
191   -
192   - }
193   -
194   - .hint {
195   - padding: 20rpx 40rpx;
196   - font-size: 28rpx;
197   - color: $u-tips-color;
198   - display: flex;
199   - justify-content: flex-start;
200   -
201   - .prompt-txt {
202   - .link {
203   - color: $u-warning;
204   - }
205   - }
206   -
207   -
208   - }
209   - }
  163 + font-size: 28rpx;
  164 +
  165 + .content {
  166 + width: 600rpx;
  167 + margin: 80rpx auto 0;
  168 +
  169 + .title {
  170 + text-align: left;
  171 + font-size: 60rpx;
  172 + font-weight: 500;
  173 + margin-bottom: 100rpx;
  174 + }
  175 +
  176 + // 输入框容器样式
  177 + .input-wrapper {
  178 + display: flex;
  179 + align-items: center;
  180 + border-bottom: 1px solid #e4e7ed;
  181 + padding: 20rpx 0;
  182 + margin-bottom: 30rpx;
  183 +
  184 + .input-icon {
  185 + margin-right: 20rpx;
  186 + }
  187 +
  188 + .login-input {
  189 + flex: 1;
  190 + font-size: 28rpx;
  191 + color: #303133;
  192 + padding: 10rpx 0;
  193 +
  194 + &::placeholder {
  195 + color: #c0c4cc;
  196 + }
  197 + }
  198 + }
  199 +
  200 + .placeholder-style {
  201 + color: #c0c4cc;
  202 + font-size: 26rpx;
  203 + }
  204 +
  205 + .tips {
  206 + color: $u-info;
  207 + margin-bottom: 60rpx;
  208 + margin-top: 8rpx;
  209 + font-size: 12px;
  210 + }
  211 +
  212 + .getCaptcha {
  213 + background-color: #19a97c;
  214 + color: #ffffff;
  215 + border: none;
  216 + font-size: 30rpx;
  217 + padding: 12rpx 0;
  218 + border-radius: 50rpx;
  219 + margin-top: 60rpx;
  220 +
  221 + &::after {
  222 + border: none;
  223 + }
  224 + }
  225 +
  226 + .alternative {
  227 + color: $u-tips-color;
  228 + display: flex;
  229 + justify-content: space-between;
  230 + margin-top: 30rpx;
  231 +
  232 + .link {
  233 + color: $u-warning;
  234 + }
  235 + }
  236 + }
  237 +
  238 + .buttom {
  239 + .loginType {
  240 + display: flex;
  241 + padding: 350rpx 150rpx 150rpx 150rpx;
  242 + justify-content: center;
  243 +
  244 + .item {
  245 + .box {
  246 + display: flex;
  247 + flex-direction: column;
  248 + align-items: center;
  249 + color: $u-content-color;
  250 + justify-content: center;
  251 + font-size: 28rpx;
  252 + background-color: #ffffff00;
  253 + border-radius: 0 !important;
  254 + border: 0 solid #ffffff00 !important;
  255 + padding: 0 !important;
  256 + margin: 0 !important;
  257 +
  258 + &::after {
  259 + border: none;
  260 + }
  261 + }
  262 + }
  263 + }
  264 +
  265 + .hint {
  266 + padding: 20rpx 40rpx;
  267 + font-size: 28rpx;
  268 + color: $u-tips-color;
  269 + display: flex;
  270 + justify-content: flex-start;
  271 +
  272 + .prompt-txt {
  273 + .link {
  274 + color: $u-warning;
  275 + }
  276 + }
  277 + }
  278 + }
210 279 }
211 280 </style>
... ...
garbage-removal/src/pages/order/index.vue
  View file @116fac5
... ... @@ -6,13 +6,45 @@
6 6 </view>
7 7 </template>
8 8 <script setup>
9   -import { useMainStore } from "@/stores/index.js";
10   -import { computed } from 'vue';
  9 +import {useMainStore} from "@/stores/index.js";
  10 +import {computed} from 'vue';
  11 +import {onShow} from '@dcloudio/uni-app';
11 12 import OrderDisposal from './order-disposal/index.vue';
12 13 import OrderDriver from './order-driver/index.vue';
13 14 import OrderOther from './order-other/index.vue';
  15 +import {queryOrderList} from "@/apis/order.js";
  16 +
14 17 const mainStore = useMainStore()
15 18 const userType = computed(() => mainStore.userType)
  19 +
  20 +
  21 +// 根据订单类型获取订单总数
  22 +const getOrderCountByType = async (type) => {
  23 + try {
  24 + return await queryOrderList({
  25 + type: type,
  26 + pageNo: 1,
  27 + pageSize: 1
  28 + });
  29 + } catch (error) {
  30 + console.error('获取订单数量失败:', error);
  31 + throw error;
  32 + }
  33 +}
  34 +
  35 +onShow(() => {
  36 + // 调用获取订单数量的接口
  37 + getOrderCountByType(0).then(res => {
  38 + // 设置角标显示为实际的订单总数
  39 + uni.setTabBarBadge({
  40 + index: 1, // 订单tab在tabBar中的索引
  41 + text: String(res.data.data.total) // 使用实际的订单总数
  42 + });
  43 + }).catch(error => {
  44 + console.error('获取订单数量失败:', error);
  45 + });
  46 +});
  47 +
16 48 </script>
17 49 <style lang="scss" scoped>
18 50 .container {
... ...
garbage-removal/src/pages/order/order-disposal/index.vue
  View file @116fac5
... ... @@ -24,12 +24,14 @@
24 24 :inactiveStyle="{ color: '#ffffff' }" ref="uTabsElement" :list="displayList" :current="current"
25 25 @change="tabsChange" :scrollable="false"></u-tabs>
26 26 </template>
  27 +
27 28 <swiper class="swiper" :current="swiperCurrent" @translation="translation"
28 29 @animationfinish="animationfinish">
29 30 <swiper-item class="swiper-item" v-for="( item, index ) in list " :key="index">
30 31 <swiper-list-item :tabIndex="index" :currentIndex="swiperCurrent"></swiper-list-item>
31 32 </swiper-item>
32 33 </swiper>
  34 +
33 35 </z-paging-swiper>
34 36  
35 37 </view>
... ...
garbage-removal/src/pages/sign-up/index.vue 0 → 100644
  View file @116fac5
  1 +<template>
  2 + <view class="wrap">
  3 + <view class="top"></view>
  4 + <u-toast ref="uToastRef"></u-toast>
  5 + <view class="content">
  6 + <view class="title">用户注册</view>
  7 +
  8 + <!-- 手机号输入框 -->
  9 + <view class="input-wrapper">
  10 + <u-icon name="phone" size="36" color="#909399" class="input-icon"></u-icon>
  11 + <input
  12 + class="login-input"
  13 + type="number"
  14 + v-model="tel"
  15 + placeholder="请输入手机号"
  16 + placeholder-class="placeholder-style"
  17 + />
  18 + </view>
  19 +
  20 + <!-- 用户名输入框 -->
  21 + <view class="input-wrapper">
  22 + <u-icon name="account" size="36" color="#909399" class="input-icon"></u-icon>
  23 + <input
  24 + class="login-input"
  25 + type="text"
  26 + v-model="nickname"
  27 + placeholder="请输入用户名"
  28 + placeholder-class="placeholder-style"
  29 + />
  30 + </view>
  31 +
  32 + <!-- 密码输入框 -->
  33 + <view class="input-wrapper">
  34 + <u-icon name="lock" size="36" color="#909399" class="input-icon"></u-icon>
  35 + <input
  36 + class="login-input"
  37 + type="password"
  38 + v-model="password"
  39 + placeholder="请输入密码"
  40 + placeholder-class="placeholder-style"
  41 + />
  42 + </view>
  43 +
  44 + <!-- 确认密码输入框 -->
  45 + <view class="input-wrapper">
  46 + <u-icon name="lock" size="36" color="#909399" class="input-icon"></u-icon>
  47 + <input
  48 + class="login-input"
  49 + type="password"
  50 + v-model="confirmPassword"
  51 + placeholder="请确认密码"
  52 + placeholder-class="placeholder-style"
  53 + />
  54 + </view>
  55 +
  56 + <button @tap="submit" :style="[inputStyle]" class="getCaptcha">注册</button>
  57 + <view class="alternative">
  58 + <text class="link" @click="toLogin">已有账号？立即登录</text>
  59 + </view>
  60 + </view>
  61 + <view class="buttom">
  62 + <view class="hint">
  63 + <view style="display: flex; justify-content: flex-start;" @click="radioChange">
  64 + <u-checkbox-group v-model="agree" placement="row" @change="groupChange">
  65 + <u-checkbox shape="square" activeColor="#19a97c" :size="28"
  66 + :customStyle="{ marginBottom: '0px', marginTop: '1px' }" :key="0" :name="true">
  67 + </u-checkbox>
  68 + </u-checkbox-group>
  69 + </view>
  70 + <view class="prompt-txt">
  71 + 注册代表同意
  72 + <text class="link" @click="handleUserAgreement">用户协议、隐私政策，</text>
  73 + 并授权使用您的账号信息（如昵称、头像、收获地址）以便您统一管理。
  74 + </view>
  75 + </view>
  76 + </view>
  77 + </view>
  78 +</template>
  79 +
  80 +<script>
  81 +import { userLogin } from "@/apis/user.js";
  82 +
  83 +export default {
  84 + data() {
  85 + return {
  86 + tel: '',
  87 + nickname: '',
  88 + password: '',
  89 + confirmPassword: '',
  90 + agree: []
  91 + }
  92 + },
  93 + computed: {
  94 + inputStyle() {
  95 + let style = {};
  96 + if (this.tel && this.nickname && this.password && this.confirmPassword) {
  97 + style.color = "#fff";
  98 + style.backgroundColor = this.$u.color['success'];
  99 + }
  100 + return style;
  101 + }
  102 + },
  103 + methods: {
  104 + groupChange(e) {
  105 + console.log(e);
  106 + },
  107 + submit() {
  108 + // 验证必填字段
  109 + if (!this.tel || !this.nickname || !this.password || !this.confirmPassword) {
  110 + this.$refs.uToastRef.show({
  111 + type: 'default',
  112 + message: "请填写所有必填项",
  113 + });
  114 + return;
  115 + }
  116 +
  117 + // 验证手机号格式
  118 + if (!this.$u.test.mobile(this.tel)) {
  119 + this.$refs.uToastRef.show({
  120 + type: 'default',
  121 + message: "手机号格式不正确",
  122 + });
  123 + return;
  124 + }
  125 +
  126 + // 验证密码长度
  127 + if (this.password.length < 6) {
  128 + this.$refs.uToastRef.show({
  129 + type: 'default',
  130 + message: "密码长度不能少于6位",
  131 + });
  132 + return;
  133 + }
  134 +
  135 + // 验证密码确认
  136 + if (this.password !== this.confirmPassword) {
  137 + this.$refs.uToastRef.show({
  138 + type: 'default',
  139 + message: "两次输入的密码不一致",
  140 + });
  141 + return;
  142 + }
  143 +
  144 + if (!this.agree[0]) {
  145 + let that = this;
  146 + uni.showModal({
  147 + title: '提示',
  148 + content: '需要同意用户协议才能注册',
  149 + success: function (res) {
  150 + if (res.confirm) {
  151 + that.agree[0] = true;
  152 + }
  153 + }
  154 + });
  155 + return;
  156 + }
  157 +
  158 + this.doRegister();
  159 + },
  160 + doRegister() {
  161 + userLogin({
  162 + loginType: 0,
  163 + signin: 1,
  164 + tel: this.tel,
  165 + nikename: this.nickname,
  166 + password: this.password
  167 + }).then(res => {
  168 + console.log('注册成功', res);
  169 + this.$refs.uToastRef.show({
  170 + type: 'success',
  171 + message: "注册成功",
  172 + complete: () => {
  173 + setTimeout(() => {
  174 + this.$u.route({
  175 + url: 'pages/login/code'
  176 + });
  177 + }, 1000);
  178 + }
  179 + });
  180 + }).catch(err => {
  181 + console.log('注册失败', err);
  182 + this.$refs.uToastRef.show({
  183 + type: 'error',
  184 + message: err.message || "注册失败"
  185 + });
  186 + });
  187 + },
  188 + handleUserAgreement() {
  189 + console.log("user click agreement");
  190 + },
  191 + radioChange() {
  192 + this.agree[0] = !this.agree[0];
  193 + },
  194 + toLogin() {
  195 + this.$u.route({
  196 + url: 'pages/login/code'
  197 + });
  198 + }
  199 + }
  200 +}
  201 +</script>
  202 +
  203 +<style lang="scss" scoped>.wrap {
  204 + font-size: 28rpx;
  205 +
  206 + .content {
  207 + width: 600rpx;
  208 + margin: 80rpx auto 0;
  209 +
  210 + .title {
  211 + text-align: left;
  212 + font-size: 60rpx;
  213 + font-weight: 500;
  214 + margin-bottom: 100rpx;
  215 + }
  216 +
  217 + // 输入框容器样式
  218 + .input-wrapper {
  219 + display: flex;
  220 + align-items: center;
  221 + border-bottom: 1px solid #e4e7ed;
  222 + padding: 20rpx 0;
  223 + margin-bottom: 30rpx;
  224 +
  225 + .input-icon {
  226 + margin-right: 20rpx;
  227 + }
  228 +
  229 + .login-input {
  230 + flex: 1;
  231 + font-size: 28rpx;
  232 + color: #303133;
  233 + padding: 10rpx 0;
  234 +
  235 + &::placeholder {
  236 + color: #c0c4cc;
  237 + }
  238 + }
  239 + }
  240 +
  241 + .placeholder-style {
  242 + color: #c0c4cc;
  243 + font-size: 26rpx;
  244 + }
  245 +
  246 + .getCaptcha {
  247 + background-color: #19a97c;
  248 + color: #ffffff;
  249 + border: none;
  250 + font-size: 30rpx;
  251 + padding: 12rpx 0;
  252 + border-radius: 50rpx;
  253 + margin-top: 60rpx;
  254 +
  255 + &::after {
  256 + border: none;
  257 + }
  258 + }
  259 +
  260 + .alternative {
  261 + color: $u-tips-color;
  262 + display: flex;
  263 + justify-content: center;
  264 + margin-top: 30rpx;
  265 +
  266 + .link {
  267 + color: $u-warning;
  268 + }
  269 + }
  270 + }
  271 +
  272 + .buttom {
  273 + .hint {
  274 + padding: 20rpx 40rpx;
  275 + font-size: 28rpx;
  276 + color: $u-tips-color;
  277 + display: flex;
  278 + justify-content: flex-start;
  279 +
  280 + .prompt-txt {
  281 + .link {
  282 + color: $u-warning;
  283 + }
  284 + }
  285 + }
  286 + }
  287 +}
  288 +</style>
0 289 \ No newline at end of file
... ...
garbage-removal/src/pages/wode/index.vue
  View file @116fac5
... ... @@ -116,7 +116,7 @@ const handleLoginOut = () =&gt; {
116 116 uni.$u.toast("已退出")
117 117 uni.$u.route({
118 118 type: "reLaunch",
119   - url: "pages/login/index"
  119 + url: "pages/login/code"
120 120 })
121 121 }
122 122 })
... ...
garbage-removal/src/utils/request/request.js
  View file @116fac5
... ... @@ -115,7 +115,7 @@ const reSetLoginStatus = () =&gt; {
115 115  
116 116 uni.setStorageSync("cancelFlag", false);
117 117 uni.reLaunch({
118   - url: "/pages/login/index",
  118 + url: "/pages/login/code",
119 119 })
120 120  
121 121 } else if (res.cancel) {
... ...