小程序-功能完善

miniprogram-taro/src/app.config.js

@@ -13,5 +13,41 @@ export default defineAppConfig({
     navigationBarBackgroundColor: '#000',
     navigationBarTitleText: 'WeChat',
     navigationBarTextStyle: 'white'
-  }
+  },
+  "tabBar": {
+    "selectedColor": "#FF8966",
+    "list": [
+      {
+        "pagePath": "pages/index/index",
+        "text": "首页",
+        "iconPath": "image/icon/_home.png",
+        "selectedIconPath": "image/icon/home.png"
+      },
+      {
+        "pagePath": "pages/residents/code",
+        "text": "进出码",
+        "iconPath": "image/icon/_code.png",
+        "selectedIconPath": "image/icon/code.png"
+      },
+      // {
+      //   "pagePath": "pages/report/report",
+      //   "text": "日报",
+      //   "iconPath": "/icon/_report.png",
+      //   "selectedIconPath": "/icon/report.png"
+      // },
+      // {
+      //   "pagePath": "pages/apply/apply",
+      //   "text": "申请",
+      //   "iconPath": "/icon/_apply.png",
+      //   "selectedIconPath": "/icon/apply.png"
+      // },
+      // {
+      //   "pagePath": "pages/person/person",
+      //   "text": "我的",
+      //   "selectedColor": "#FF8966",
+      //   "iconPath": "/icon/_person.png",
+      //   "selectedIconPath": "/icon/person.png"
+      // }
+    ]
+  },
 })

miniprogram-taro/src/app.js

@@ -11,7 +11,6 @@ const App = createApp({
 App.use(setGlobalDataPlugin, {
   globalData: {
     baseUrl: "http://localhost:8080", // 不带最后的 /
-    userInfo: null
   }
 })
 

miniprogram-taro/src/pages/index/index.vue

@@ -1,7 +1,10 @@
 <template>
   <view style="background-color: #F6F6F6;height: 100%;">
     <image src="../../image/home.jpg" style="width: 100%;height: 130px;"></image>
-    <view style="display: block;" wx:if="{{isStudent}}">
+    <view style="display: block; padding-left: 30px; padding-top: 12px;">
+      <text>欢迎你，{{ displayUsername }}！</text>
+    </view>
+    <view style="display: block;" v-if="isUser">
       <view style="display: flex;text-align: center;margin-top: 20px;">
         <view style="width: 25%;">
           <image src="../../image/icon/code.png" style="width: 40px;height: 40px;" @tap='goCode'></image>
@@ -36,7 +39,7 @@
         </view>
       </view>
     </view>
-    <view style="display: block;" wx:if="{{isManager}}">
+    <view style="display: block;" v-if="isAdmin">
       <view style="display: flex;text-align: center;margin-top: 20px;">
         <view style="width: 25%;">
           <image src="../../image/icon/danger.png" style="width: 40px;height: 40px;" bindtap='goCode'></image>
@@ -84,29 +87,37 @@ import './index.css'
 export default {
   setup() {
   },
+  data() {
+    return {
+      userInfo: null,
+      displayUsername: "",
+      isUser: false,
+      isAdmin: false,
+    }
+  },
   mounted() {
     eventCenter.once(getCurrentInstance().router.onShow, () => {
       console.log('onShow')
-      if (!wx.getStorageSync("userInfo")) {
+      this.userInfo = Taro.getStorageSync("userInfo");
+      this.displayUsername = this.userInfo?.username ?? "请登录";
+      if (!this.userInfo) {
         console.log("用户未登录")
         Taro.redirectTo({
-          url: '/pages/index/login',
-          // success: function (res) {
-          //   // 通过eventChannel向被打开页面传送数据
-          //   res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'test' })
-          // }
+          url: '/pages/index/login'
         })
+      } else {
+        this.isUser = this.userInfo.userType == "user";
+        this.isAdmin = this.userInfo.userType == "admin";
       }
     })
   },
   methods: {
     goCode() {
-      Taro.navigateTo({
-        url: '/pages/residents/code',
-        // success: function (res) {
-        //   // 通过eventChannel向被打开页面传送数据
-        //   res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'test' })
-        // }
+      // Taro.navigateTo({
+      //   url: '/pages/residents/code'
+      // })
+      Taro.switchTab({
+        url: '/pages/residents/code'
       })
     }
   }

miniprogram-taro/src/pages/residents/code.css

@@ -0,0 +1,8 @@
+.time-text {
+  font-weight: bold;
+}
+
+#qrcode {
+  width: 70vw;
+  height: 70vw;
+}

miniprogram-taro/src/pages/residents/code.vue

@@ -2,6 +2,11 @@
   <view style="background-color: #F6F6F6;height: 100%;">
     <image src="../../image/home.jpg" style="width: 100%;height: 130px;"></image>
   </view>
+  <view style="text-align: center; margin-top: 100px;">
+    <view><text>{{ stuId }} {{ name }}</text></view>
+    <image id="qrcode" src="{{imgUrl}}"></image>
+    <view><text class="time-text">{{ time }}</text></view>
+  </view>
 </template>
 
 <script>

miniprogram-taro/src/utils/utils.js

@@ -0,0 +1,28 @@
+const formatTime = date => {
+  const year = date.getFullYear()
+  const month = date.getMonth() + 1
+  const day = date.getDate()
+  const hour = date.getHours()
+  const minute = date.getMinutes()
+  const second = date.getSeconds()
+
+  return `${[year, month, day].map(formatNumber).join('/')} ${[hour, minute, second].map(formatNumber).join(':')}`
+}
+
+const formatNumber = n => {
+  n = n.toString()
+  return n[1] ? n : `0${n}`
+}
+
+const formatDate = date => {
+  const year = date.getFullYear()
+  const month = date.getMonth() + 1
+  const day = date.getDate()
+
+  return [year, month, day].map(formatNumber).join('-')
+}
+
+module.exports = {
+  formatTime,
+  formatDate
+}