科室选择

package.json

@@ -41,6 +41,7 @@
     "@tarojs/react": "3.3.6",
     "@tarojs/runtime": "3.3.6",
     "@tarojs/taro": "3.3.6",
+    "dayjs": "^1.11.1",
     "react": "^17.0.0",
     "react-dom": "^17.0.0"
   },

src/app.js

@@ -1,4 +1,5 @@
 import { Component } from 'react'
+import { View } from '@tarojs/components';
 import '@antmjs/vantui/lib/index.less';
 import './app.less'
 
@@ -14,7 +15,10 @@ class App extends Component {
 
   // this.props.children 是将要会渲染的页面
   render () {
-    return this.props.children
+    return <View className='index'>
+      {this.props.children}
+    </View>
+
   }
 }
 

src/pages/DepartmentSelection/index.jsx

@@ -0,0 +1,25 @@
+import { View, Text } from "@tarojs/components"
+import { useEffect, useState } from "react"
+import Taro, { useDidShow } from "@tarojs/taro"
+import { Button } from "@antmjs/vantui"
+
+// import BottomMoadl from '@/components/BottomMoadl/index'
+
+
+
+
+
+
+import './style.less'
+
+export default (props) => {
+
+
+
+  return (
+    <View className='page-index'>
+
+
+    </View>
+  )
+}

src/pages/DepartmentSelection/style.less

@@ -0,0 +1,59 @@
+.orders-listBox-RihtboxBoxOrderViewText:before {
+  content: "";
+  display: block;
+  position: absolute;
+  width: 100%;
+  bottom: -10px;
+  left: 0;
+  border-bottom: 20px dotted rgb(255, 255, 255);
+}
+
+.orders-listBox-RihtboxBoxOrderViewText {
+  width: 85vw;
+  margin: 35px auto 44px auto;
+  padding: 62px 30px 93px 30px;
+  background: #ffffff;
+  box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.12);
+  border-radius: 40px 40px 0px 0px;
+  position: relative;
+
+  .View-LiftTextTop {
+    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+    padding-bottom: 20px;
+    padding-top: 0;
+  }
+  View:nth-child(6) {
+    padding-bottom: 40px;
+
+    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+  }
+  > View {
+    padding: 15px 0;
+    font-size: 32px;
+    font-weight: bold;
+    color: #666666;
+    > Text {
+      color: #222222;
+    }
+
+    .feiyongStyle {
+      justify-content: space-between;
+      display: flex;
+      color: #222222;
+      &-charges {
+        background: linear-gradient(180deg, #fa7878 0%, #b61515 100%);
+        -webkit-background-clip: text;
+        -webkit-text-fill-color: transparent;
+      }
+      &-stateStyle {
+      }
+    }
+  }
+}
+
+.BottomtBut {
+  width: 99vw;
+  position: absolute;
+  bottom: 5vh;
+  display: flex;
+}

src/pages/index/index.jsx

@@ -1,7 +1,10 @@
-import { View, Text, Button } from '@tarojs/components'
+import { View, Text, Image } from '@tarojs/components'
 import { useEffect, useRef, useState } from 'react'
-
+import dayjs from 'dayjs'
+import { Icon } from "@antmjs/vantui";
+import Taro from '@tarojs/taro';
 // import userBck from '../../assets/userBck.png'
+import barcodeimg from '../../assets/barcodeimg.png'
 
 
 import './style.less'
@@ -12,18 +15,10 @@ export default (props) => {
 
   const [showTime, setShowTime] = useState("")
   const timer = useRef();
+  const userId = '320888800110023011';
   useEffect(() => {
     setInterval(() => {
-      const ymd = new Date()
-      const time = ymd.toTimeString().slice(0, 8)
-      var year = ymd.getFullYear();
-      var month = ymd.getMonth();
-      var day = ymd.getDate();
-      const times = `${year}-${month}-${day} ${time}`
-      // //获取时分秒
-      // var h = time.getHours();
-      // var m = time.getMinutes();
-      // var s = time.getSeconds();
+      const times = dayjs(new Date().getTime()).format('YYYY-MM-DD HH:mm:ss');
 
       setShowTime(times)
     }, 1000)
@@ -36,9 +31,9 @@ export default (props) => {
   const goUserInfo = () => {
 
     // 跳转到目的页面，在当前页面打开
-    // Taro.redirectTo({
-    //   url: '/pages/setUserInfo/index'
-    // })
+    Taro.redirectTo({
+      url: '/pages/setUserInfo/index'
+    })
 
   }
 
@@ -51,14 +46,17 @@ export default (props) => {
       <View className='index-UserQRcode-headerInfo' >
         <View className='index-UserQRcode-headerInfo-User'>
           <View className='index-UserQRcode-headerInfo-User-NameInfo'>姓名：鲍张抄</View>
-          <View className='index-UserQRcode-headerInfo-User-setNameInfo'>+修改信息</View>
+          <View onClick={goUserInfo} className='index-UserQRcode-headerInfo-User-setNameInfo'><Icon name='edit' />修改信息</View>
         </View>
-        <View className='index-UserQRcode-headerInfo-UserID'>身份证：320888800110023011</View>
+        <View className='index-UserQRcode-headerInfo-UserID'>身份证：{userId.replace(/^(\d{6})\d+(\d{4})$/, "$1******$2")}</View>
       </View>
       <View className='index-UserQRcode-cententQR'>
         <View className='index-UserQRcode-cententQR-Times'>
           {showTime}
         </View>
+        <View className='index-UserQRcode-cententQR-Barcode'>
+          <Image src={barcodeimg} />
+        </View>
       </View>
     </View>
   )

src/pages/index/style.less

@@ -1,6 +1,9 @@
 .index-UserQRcode {
   width: 100vw;
+  height: 100vh;
   margin: 0 auto;
+  background-color: #f2f1f6;
+
   &-headerInfo {
     color: white;
     height: 35vh;
@@ -30,17 +33,29 @@
 
   &-cententQR {
     width: 95%;
-    height: 40vh;
-    box-shadow: 0px 8px 38px 0px rgba(0, 0, 0, 0.12);
+    height: 65vh;
+    // box-shadow: 0px 8px 38px 0px rgba(0, 0, 0, 0.12);
     border-radius: 15px;
     background-color: white;
     margin: 0 auto;
     position: relative;
     top: -15vh;
     &-Times {
+      padding-top: 3vh;
       text-align: center;
       font-weight: 800;
       font-size: 8vw;
     }
+    &-Barcode {
+      width: 80%;
+      height: 18vh;
+      margin: 0 auto;
+      position: relative;
+      top: 30%;
+      > Image {
+        width: 100%;
+        height: 100%;
+      }
+    }
   }
 }