仓库管理h5

src/api/login.js

@@ -7,6 +7,12 @@ export const userLogin = (data) => {
       data,
     });
   };
-
+export const userSend = (data) => {
+    return request({
+      url: "/user/send",
+      method: "POST",
+      data,
+    });
+  };
 
   

src/pages/detail/index.vue

@@ -32,6 +32,7 @@
           color="#BCBCBC"
           throttleTime="5"
           :loading="loading"
+          v-if="!isDetail"
           >取消</up-button
         >
         <up-button
@@ -39,6 +40,7 @@
           color="#EFC54E"
           throttleTime="5"
           :loading="loading"
+          v-if="!isDetail"
           >确认</up-button
         >
         <up-button

src/pages/index/index.vue

@@ -18,12 +18,19 @@
         <span style="display: flex; align-items: center;">
           <up-image :show-loading="true" :src="src" width="100px" height="100px" @click="click"></up-image>
           <span style="display: flex; flex-direction: column; margin-left: 10px;">
-            <span style="font-weight: bold;">画作名称</span>
+            <span style="font-weight: bold;" >画作名称</span>
             <span style="color:#BCBCBC;font-size: 16px;">画作编号：</span>
             <span style="color:#BCBCBC;font-size: 16px;">画家编号：</span>
             <span style="color:#BCBCBC;font-size: 16px;">画家姓名：</span>
             <span style="color:#BCBCBC;font-size: 16px;">平尺（寸）：</span>
           </span>
+          <span style="margin-bottom: 180rpx;">
+          <up-radio-group 
+            v-model="value"
+            placement="right">
+	          <up-radio  label=""></up-radio>
+          </up-radio-group>
+        </span>
         </span>
       </view>
     
@@ -99,6 +106,7 @@ page {
     background-color: #fff;
     box-shadow: 0 0 6px rgba(219, 218, 218, 0.5);
   }
+  
 }
 .button-container {
     display: flex;

src/pages/login/index.vue

@@ -7,9 +7,9 @@
         <span style="color: #efc54e">仓库管理</span>
       </view>
       <view>使用你的手机号登录</view>
-      <view class="login" v-if="!isCode">
-        <view class="login-input">
-          <up-input placeholder="请输入手机号" clearable>
+      <view class="login" >
+        <view class="login-input" v-if="!haveCode">
+          <up-input placeholder="请输入手机号" v-model="state.TelNum" clearable>
             <template #prefix>
               <up-text
                 text="手机号"
@@ -20,8 +20,12 @@
             </template>
           </up-input>
         </view>
-        <view class="login-input" >
-          <up-input placeholder="请输入密码" :password="true">
+        <span
+          style="text-align: right; color: #e3af1c;"
+          @click="goToPassword" v-if="isCode&&!haveCode"
+          >密码登录</span>
+        <view class="login-input" v-if="!isCode">
+          <up-input placeholder="请输入密码" :password="true" v-model="state.Password">
             <template #prefix>
               <up-text
                 text="密码"
@@ -33,7 +37,7 @@
           </up-input>
         </view>
       </view>
-      <view v-else>
+      <view v-if="haveCode">
         <view class="code-box">
           <span style="color: #888888">已发送验证码至 </span>
           <span>123123123</span>
@@ -65,35 +69,67 @@
         v-if="!isCode"
         >登录</up-button
       >
+      <up-button
+        style="width: 626rpx; margin: auto; height: 96rpx;margin-top: 90rpx;"
+        color="#EFC54E"
+        throttleTime="5"
+        :loading="loading"
+        @click="obtainCode"
+        v-if="isCode&&!haveCode"
+        >获取验证码</up-button
+      >
     </view>
   </view>
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref,reactive } from "vue";
 import useToast from "@/hooks/toast/useToast.js";
 import {
-  userLogin
+  userLogin,userSend
 } from "@/api/login.js";
-console.log(userLogin())
+const state = reactive({
+  TelNum:'15190039212',
+  Password:'',
+  
+})
 const { showMessage } = useToast();
 const loading = ref(false);
 const isCode = ref(false);
-const code = ref("");
+const haveCode = ref(false);
 // const show = () => {
 //   showMessage({ type: "default", message: "验证码已发送" });
 // };
 const toCode = () => {
   isCode.value = true;
 };
+const obtainCode = async () => {
+  console.log('获取验证码')
+  loading.value = true;
+    const res = await userSend({
+      TelNum: state.TelNum ?? '',
+    });
+    if (res.status === 0) {
+      haveCode.value = true;
+      showMessage({ type: "default", message: "验证码已发送" });
+    } else {
+      showMessage({ type: "error", message: res.msg });
+    }
+    loading.value = false;
+};
 const goToPassword = () =>{
   isCode.value=false;
+  haveCode.value = false;
 }
 
 // 登录方法
-const logining = () => {
+const logining = async () => {
   loading.value = true;
-  
+  const res = await userLogin({
+    TelNum:state.TelNum ?? '' ,
+    Password:state.Password ?? '',
+  });
+  if(res.status === 0){
   uni.navigateTo({
     url: '/pages/index/index',
     success: () => {
@@ -104,6 +140,8 @@ const logining = () => {
       showMessage({ type: "default", message: "跳转失败" });
     }
   });
+  loading.value = false;
+}
 };
 </script>
 
@@ -149,9 +187,6 @@ page {
         height: 96rpx;
       }
     }
-    .code-box {
-      margin-top: 84rpx;
-    }
   }
 }
 </style>

src/pages/painting/index.vue

@@ -15,7 +15,7 @@
             A1
           </span>
           <span style="text-align: center;margin-top: 20rpx;">
-            A1列1行
+            A列1行
           </span>
         </view>
       

utils/service/index.js

@@ -8,6 +8,7 @@ const request = new Request({
   interceptors: {
     //实例的请求拦截器
     requestInterceptors: (config) => {
+      console.log('config',config)
       config.headers["Content-Type"] =
         config.method === "get"
           ? "application/x-www-form-urlencoded"
@@ -27,7 +28,14 @@ const request = new Request({
       if (response.data.status === 1) {
         showMessage({ type: "error", message: response.data.msg });
       }
+      if(response.data.code === 200){
+        uni.setStorageSync("token", response.data.Token);
+        uni.setStorageSync("userInfo", response.data.AccountInfo);
+        response.config.headers["Authorization"] = response.data.Token;
+        return request.request(response.config);
+      }
       if (response.data.code === 401) {
+        
         uni.navigateTo({
           url: "/pages/login/index",
         });
@@ -35,7 +43,7 @@ const request = new Request({
       if ([200, 201, 204].includes(response.status)) {
         return response.config.responseType === "blob" ? response : response;
       } else {
-        showMessage({ type: "error", message: response.data.msg });
+        // showMessage({ type: "error", message: response.data.msg });
         return Promise.reject(
           new Error(response.data.msg || "An error occurred.")
         );

utils/service/request/index.js

@@ -1,4 +1,4 @@
-import axios from "axios";
+import axios from 'axios';
 class Request {
   // axios 实例
   instance;
@@ -12,35 +12,24 @@ class Request {
     this.abortControllerMap = new Map();
     this.interceptorsObj = config.interceptors;
     // 拦截器执行顺序 接口请求 -> 实例请求 -> 全局请求 -> 实例响应 -> 全局响应 -> 接口响应
-    this.instance.interceptors.request.use(
-      (res) => {
-        const controller = new AbortController();
-        const url = res.url || "";
-        res.signal = controller.signal;
-        this.abortControllerMap.set(url, controller);
-        return res;
-      },
-      (err) => err
-    );
+    this.instance.interceptors.request.use((res) => {
+      const controller = new AbortController();
+      const url = res.url || '';
+      res.signal = controller.signal;
+      this.abortControllerMap.set(url, controller);
+      return res;
+    }, (err) => err);
     // 使用实例拦截器
-    this.instance.interceptors.request.use(
-      this.interceptorsObj?.requestInterceptors,
-      this.interceptorsObj?.requestInterceptorsCatch
-    );
-    this.instance.interceptors.response.use(
-      this.interceptorsObj?.responseInterceptors,
-      this.interceptorsObj?.responseInterceptorsCatch
-    );
+    this.instance.interceptors.request.use(this.interceptorsObj?.requestInterceptors, this.interceptorsObj?.requestInterceptorsCatch);
+    this.instance.interceptors.response.use(this.interceptorsObj?.responseInterceptors, this.interceptorsObj?.responseInterceptorsCatch);
     // 全局响应拦截器保证最后执行
     this.instance.interceptors.response.use(
       // 因为我们接口的数据都在res.data下，所以我们直接返回res.data
       (res) => {
-        const url = res.config.url || "";
+        const url = res.config.url || '';
         this.abortControllerMap.delete(url);
         return res.data;
-      },
-      (err) => err
-    );
+      }, (err) => err);
   }
   request(config) {
     return new Promise((resolve, reject) => {
@@ -85,3 +74,4 @@ class Request {
   }
 }
 export default Request;
+