添加普通二维码方式

src/pages/index/index.tsx

-import { ComponentClass } from 'react';
-import Taro, { Component, Config } from '@tarojs/taro';
-import { View, Image } from '@tarojs/components';
-
-import scanIcon from '../../images/icon_s@2x.png';
-
-import './index.scss';
-import { registerAndLogin } from '../../api/customer';
-import { getDeviceConfig } from '../../api/device';
-import { UserState, updateUserInfo } from '../../store/rootReducers/userinfo';
-import { connect } from '@tarojs/redux';
-import { Customer } from '../../types/Customer/Customer';
+import { ComponentClass } from "react";
+import Taro, { Component, Config } from "@tarojs/taro";
+import { View, Image } from "@tarojs/components";
+
+import scanIcon from "../../images/icon_s@2x.png";
+
+import "./index.scss";
+import { registerAndLogin } from "../../api/customer";
+import { getDeviceConfig } from "../../api/device";
+import { UserState, updateUserInfo } from "../../store/rootReducers/userinfo";
+import { connect } from "@tarojs/redux";
+import { Customer } from "../../types/Customer/Customer";
 import {
   DeviceState,
   updateDeviceData,
-  resetDeviceData,
-} from '../../store/rootReducers/device';
-import PrepayConfig from '../../types/Order/Order';
-import { updatePayData } from '../../store/rootReducers/prepayConfig';
+  resetDeviceData
+} from "../../store/rootReducers/device";
+import PrepayConfig from "../../types/Order/Order";
+import { updatePayData } from "../../store/rootReducers/prepayConfig";
+import { getPathParams } from "@/utils/path";
 
 type DeviceEntity = {
   serviceId: number;
@@ -49,7 +50,7 @@ interface Index {
 
 @connect(
   ({ userinfo }) => ({
-    userinfo,
+    userinfo
   }),
   dispatch => ({
     updateUserInfo(data: UserState) {
@@ -63,30 +64,43 @@ interface Index {
     },
     resetDeviceData() {
       dispatch(resetDeviceData());
-    },
-  }),
+    }
+  })
 )
 class Index extends Component {
   config: Config = {
-    navigationBarTitleText: '多彩自助服务',
+    navigationBarTitleText: "多彩自助服务"
   };
 
   constructor(props) {
     super(props);
     this.state = {
-      errorText: '',
+      errorText: ""
     };
   }
 
   componentWillMount() {
     this.loginHandle().then(() => {
+      let codeStr = this.$router.params.q;
       let queryArr = Object.keys(this.$router.params);
       console.log(this.$router.params);
 
-      let scene: string = queryArr.length > 0 ? queryArr[0] : '';
-      console.log('scene:', scene);
+      let scene: string = queryArr.length > 0 ? queryArr[0] : "";
+      console.log("scene:", scene);
 
-      if (scene) {
+      if (codeStr) {
+        // Taro.showLoading();
+        let params = getPathParams(codeStr);
+        console.log("code", params);
+        if (params["code"]) {
+          let entity = this.getDeviceEntity(params["code"]);
+          if (entity) {
+            this.getDeviceConfigHandle(entity);
+          }
+        } else {
+          this.scanErrorWeQRcode();
+        }
+      } else if (scene) {
         Taro.showLoading();
         let entity = this.getDeviceEntity(scene);
         if (entity) {
@@ -94,7 +108,7 @@ class Index extends Component {
         }
       } else {
         Taro.redirectTo({
-          url: '/pages/scanEnter/scanEnter',
+          url: "/pages/scanEnter/scanEnter"
         });
       }
     });
@@ -105,7 +119,7 @@ class Index extends Component {
     let equipmentNum = paramStr.slice(2);
     return {
       serviceId,
-      equipmentNum,
+      equipmentNum
     };
   }
 
@@ -113,18 +127,18 @@ class Index extends Component {
     const { updateUserInfo } = this.props;
 
     return Taro.login().then(res => {
-      console.log('login info:', res);
+      console.log("login info:", res);
 
       const { code } = res;
       return registerAndLogin({
-        code,
+        code
         // userName: '',
       }).then(res => {
         const { token, customerId, isAuth } = res;
         updateUserInfo({
           token,
           customerId,
-          isAuth,
+          isAuth
         });
       });
     });
@@ -133,24 +147,24 @@ class Index extends Component {
   scanHandle() {
     Taro.scanCode({
       onlyFromCamera: true,
-      scanType: ['qrCode'],
+      scanType: ["qrCode"]
     })
       .then(res => {
         console.log(res);
         const { path, result } = res;
         if (path) {
-          let queryArr = path.split('?');
-          let queryStr = queryArr.length >= 2 ? queryArr[1] : '';
+          let queryArr = path.split("?");
+          let queryStr = queryArr.length >= 2 ? queryArr[1] : "";
           console.log(result, queryArr, queryStr);
           const entity = this.getDeviceEntity(queryStr);
           this.getDeviceConfigHandle(entity);
         } else {
           Taro.showToast({
-            title: '请扫描正确的小程序',
-            icon: 'none',
+            title: "请扫描正确的小程序",
+            icon: "none"
           });
           this.setState({
-            errorText: '请扫描正确的小程序',
+            errorText: "请扫描正确的小程序"
           });
         }
       })
@@ -165,19 +179,19 @@ class Index extends Component {
       userinfo,
       updateDeviceData,
       updatePayData,
-      resetDeviceData,
+      resetDeviceData
     } = this.props;
     return getDeviceConfig({
       customerId: userinfo.customerId,
       equipmentNum: equipmentNum,
-      serviceId: serviceId,
+      serviceId: serviceId
     })
       .then(res => {
         Taro.hideLoading();
         console.log(res);
         const { deviceInfoResponse, prepayConfigs } = res;
         if (deviceInfoResponse.isUsed) {
-          console.log('设备使用中');
+          console.log("设备使用中");
           return;
         }
         if (deviceInfoResponse) {
@@ -192,17 +206,17 @@ class Index extends Component {
           updatePayData([]);
         }
         Taro.redirectTo({
-          url: '/pages/pay/pay',
+          url: "/pages/pay/pay"
         });
       })
       .catch(err => {
         console.error(err);
         Taro.showToast({
-          title: err.msg || '请扫描正确的设备码',
-          icon: 'none',
+          title: err.msg || "请扫描正确的设备码",
+          icon: "none"
         });
         this.setState({
-          errorText: err.msg || '请扫描正确的设备码',
+          errorText: err.msg || "请扫描正确的设备码"
         });
       });
   }
@@ -219,10 +233,20 @@ class Index extends Component {
     this.scanHandle();
   }
 
+  scanErrorWeQRcode() {
+    Taro.showToast({
+      title: "请扫描正确的小程序",
+      icon: "none"
+    });
+    this.setState({
+      errorText: "请扫描正确的小程序"
+    });
+  }
+
   render() {
     const { errorText } = this.state;
     return (
-      <View className='index'>
+      <View className="index">
         {errorText}
         {/* <Button
           className='scan-icon'

src/pages/pay/pay.tsx

@@ -857,7 +857,7 @@ class Pay extends Component {
               <Text>适用费率</Text>
               <View className='Pay-info-rate'>
                 {device.rates.map(item => (
-                  <View key={item.name} className='Pay-info-rate-item'>
+                  <View key='name' className='Pay-info-rate-item'>
                     <Text className='Pay-info-rate-name'>{item.name}</Text>
                     <Text className='Pay-info-rate-mark'>{item.mark}</Text>
                   </View>
@@ -884,7 +884,7 @@ class Pay extends Component {
             prepayConfig.length &&
             prepayConfig.map(payConfig => (
               <View
-                key={payConfig.id}
+                key='id'
                 className={`Pay-money-item ${
                   payConfig.id == payId ? 'seleted' : ''
                 }`}

src/pages/scanEnter/scanEnter.tsx

-import { ComponentClass } from 'react';
-import Taro, { Component, Config } from '@tarojs/taro';
-import { View, Image } from '@tarojs/components';
-
-import scanIcon from '../../images/icon_s@2x.png';
-
-import './scanEnter.scss';
-import { registerAndLogin } from '../../api/customer';
-import { getDeviceConfig } from '../../api/device';
-import { UserState, updateUserInfo } from '../../store/rootReducers/userinfo';
-import { connect } from '@tarojs/redux';
-import { Customer } from '../../types/Customer/Customer';
+import { ComponentClass } from "react";
+import Taro, { Component, Config } from "@tarojs/taro";
+import { View, Image } from "@tarojs/components";
+
+import scanIcon from "../../images/icon_s@2x.png";
+
+import "./scanEnter.scss";
+import { registerAndLogin } from "../../api/customer";
+import { getDeviceConfig } from "../../api/device";
+import { UserState, updateUserInfo } from "../../store/rootReducers/userinfo";
+import { connect } from "@tarojs/redux";
+import { Customer } from "../../types/Customer/Customer";
 import {
   DeviceState,
   updateDeviceData,
-  resetDeviceData,
-} from '../../store/rootReducers/device';
-import PrepayConfig from '../../types/Order/Order';
-import { updatePayData } from '../../store/rootReducers/prepayConfig';
+  resetDeviceData
+} from "../../store/rootReducers/device";
+import PrepayConfig from "../../types/Order/Order";
+import { updatePayData } from "../../store/rootReducers/prepayConfig";
+import { getPathParams } from "@/utils/path";
 
 type DeviceEntity = {
   serviceId: number;
@@ -46,7 +47,7 @@ interface ScanEnter {
 
 @connect(
   ({ userinfo }) => ({
-    userinfo,
+    userinfo
   }),
   dispatch => ({
     updateUserInfo(data: UserState) {
@@ -60,12 +61,12 @@ interface ScanEnter {
     },
     resetDeviceData() {
       dispatch(resetDeviceData());
-    },
-  }),
+    }
+  })
 )
 class ScanEnter extends Component {
   config: Config = {
-    navigationBarTitleText: '多彩自助服务',
+    navigationBarTitleText: "多彩自助服务"
   };
 
   componentWillMount() {
@@ -89,7 +90,7 @@ class ScanEnter extends Component {
     let equipmentNum = paramStr.slice(2);
     return {
       serviceId,
-      equipmentNum,
+      equipmentNum
     };
   }
 
@@ -97,17 +98,17 @@ class ScanEnter extends Component {
     const { updateUserInfo } = this.props;
 
     return Taro.login().then(res => {
-      console.log('login info:', res);
+      console.log("login info:", res);
       const { code } = res;
       return registerAndLogin({
-        code,
+        code
         // userName: '',
       }).then(res => {
         const { token, customerId, isAuth } = res;
         updateUserInfo({
           token,
           customerId,
-          isAuth,
+          isAuth
         });
       });
     });
@@ -116,21 +117,26 @@ class ScanEnter extends Component {
   scanHandle() {
     Taro.scanCode({
       onlyFromCamera: true,
-      scanType: ['qrCode'],
+      scanType: ["qrCode"]
     })
       .then(res => {
         console.log(res);
         const { path, result } = res;
+        let param = getPathParams(result);
         if (path) {
-          let queryArr = path.split('?');
-          let queryStr = queryArr.length >= 2 ? queryArr[1] : '';
+          let queryArr = path.split("?");
+          let queryStr = queryArr.length >= 2 ? queryArr[1] : "";
           console.log(result, queryArr, queryStr);
           const entity = this.getDeviceEntity(queryStr);
           this.getDeviceConfigHandle(entity);
+        } else if (param["code"]) {
+          console.log(param["code"]);
+          const entity = this.getDeviceEntity(param["code"]);
+          this.getDeviceConfigHandle(entity);
         } else {
           Taro.showToast({
-            title: '请扫描正确的小程序',
-            icon: 'none',
+            title: "请扫描正确的小程序",
+            icon: "none"
           });
         }
       })
@@ -145,19 +151,19 @@ class ScanEnter extends Component {
       userinfo,
       updateDeviceData,
       updatePayData,
-      resetDeviceData,
+      resetDeviceData
     } = this.props;
     return getDeviceConfig({
       customerId: userinfo.customerId,
       equipmentNum: equipmentNum,
-      serviceId: serviceId,
+      serviceId: serviceId
     })
       .then(res => {
         Taro.hideLoading();
         console.log(res);
         const { deviceInfoResponse, prepayConfigs } = res;
         if (deviceInfoResponse.isUsed) {
-          console.log('设备使用中');
+          console.log("设备使用中");
           return;
         }
         if (deviceInfoResponse) {
@@ -172,14 +178,14 @@ class ScanEnter extends Component {
           updatePayData([]);
         }
         Taro.navigateTo({
-          url: '/pages/pay/pay',
+          url: "/pages/pay/pay"
         });
       })
       .catch(err => {
         console.error(err);
         Taro.showToast({
-          title: err.msg || '请扫描正确的设备码',
-          icon: 'none',
+          title: err.msg || "请扫描正确的设备码",
+          icon: "none"
         });
       });
   }
@@ -198,18 +204,18 @@ class ScanEnter extends Component {
 
   render() {
     return (
-      <View className='ScanEnter'>
+      <View className="ScanEnter">
         {/* <Button
           className='scan-icon'
           onGetUserInfo={this.getUserInfoHandle}
           open-type='getUserInfo'>
           <Image src={scanIcon} />
         </Button> */}
-        <View className='scan-icon' onClick={this.clickHandle}>
+        <View className="scan-icon" onClick={this.clickHandle}>
           <Image src={scanIcon} />
         </View>
-        <View className='scan-text'>马上扫一扫</View>
-        <View className='scan-text'>使用多彩自助服务</View>
+        <View className="scan-text">马上扫一扫</View>
+        <View className="scan-text">使用多彩自助服务</View>
       </View>
     );
   }

src/utils/path.ts

+export const getPathParams = (path: string) => {
+  let paramsArr = decodeURIComponent(path).split("?");
+  if (paramsArr.length > 1) {
+    let params = {};
+    paramsArr = paramsArr[1].split("&");
+    for (let index = 0; index < paramsArr.length; index++) {
+      const element = paramsArr[index].split("=");
+      if (element.length) {
+        params[element[0]] = element[1];
+      }
+    }
+    return params;
+  } else {
+    return {};
+  }
+};