小程序添加体温上报页面

miniprogram/src/pages/residents/report.config.js

@@ -0,0 +1,3 @@
+export default definePageConfig({
+  navigationBarTitleText: '体温上报',
+})

miniprogram/src/pages/residents/report.vue

@@ -0,0 +1,179 @@
+
+<style>
+.form {
+  padding: 20px 30px;
+}
+
+.row {
+  margin: 30px 0;
+  border-bottom: 2px solid grey;
+}
+
+.rowItem {
+  margin: 0;
+  padding: 0;
+  display: inline-block;
+
+  vertical-align: middle;
+  height: 1.6rem;
+}
+
+.rowLeft {
+  width: 30%;
+}
+
+.rowRight {
+  width: 70%;
+}
+
+.rowRightElement {
+  width: 100%;
+}
+
+.center {
+  text-align: center;
+}
+
+.controlBtn {
+  width: 250px;
+  margin: 0 30px;
+}
+</style>
+
+<template>
+  <view class="form">
+
+    <view class="row">
+      <view class="rowItem rowLeft center">
+        <text>姓名</text>
+      </view>
+      <view class="rowItem rowRight center">
+        <input class="rowRightElement" :value="formData.userRealname" disabled="true" />
+      </view>
+    </view>
+
+    <view class="row">
+      <view class="rowItem rowLeft center">
+        <text>填报时间</text>
+      </view>
+      <view class="rowItem rowRight center">
+        <input class="rowRightElement" :value="formData.time" disabled="true" />
+      </view>
+    </view>
+
+    <view class="row">
+      <view class="rowItem rowLeft center">
+        <text>地址</text>
+      </view>
+      <view class="rowItem rowRight center" @tap="chooseLocation">
+        <input class="rowRightElement" placeholder="点击获取当前位置" v-model="formData.address" disabled="true"
+          maxlength="500" />
+      </view>
+    </view>
+
+    <view class="row">
+      <view class="rowItem rowLeft center">
+        <text>今日体温</text>
+      </view>
+      <view class="rowItem rowRight center">
+        <radio-group class="rowRightElement" @change="(e) => formData.temperature = e.detail.value">
+          <radio value="0" checked="true" />正常&nbsp;
+          <radio value="1" />异常(≥37.3°)
+        </radio-group>
+      </view>
+    </view>
+
+    <view class="tips-area">
+      <view class="tips" style="color: red;">
+        * 本人承诺以上所填报的内容全部真实，并愿意承担相应责任。
+      </view>
+    </view>
+
+    <view style="text-align: center;">
+      <button class="controlBtn" size="mini" type="none" @tap="myreport">历史填报</button>
+      <button class="controlBtn" size="mini" type="primary" @tap="report">提交</button>
+    </view>
+
+    <textarea v-if="this.debugMode" maxlength="-1" disabled="true" auto-height="true" style="width: 100%"
+      :value="JSON.stringify(formData, null, 8)"></textarea>
+  </view>
+</template>
+
+<script>
+import Taro from '@tarojs/taro'
+import utils from '../../utils/utils'
+
+export default {
+  data() {
+    return {
+      ...Taro.getApp().globalData,
+      userInfo: null,
+      timeInterval: null,
+      formData: {
+        userId: '',
+        userRealname: '',
+        address: '',
+        time: '',
+        timestamp: '',
+        temperature: 0,
+      }
+    }
+  },
+
+  onShow() {
+    console.log('onShow')
+    this.userInfo = Taro.getStorageSync("userInfo")
+    this.formData.userId = this.userInfo.id
+    this.formData.userRealname = this.userInfo.realname
+    this.updateTime();
+    this.timeInterval = setInterval(this.updateTime, 1000);
+  },
+
+  onHide() {
+    console.log('onHide')
+    clearInterval(this.timeInterval)
+  },
+
+  methods: {
+    updateTime() {
+      this.formData.timestamp = Date.now();
+      this.formData.time = utils.formatTime(new Date(this.formData.timestamp));
+    },
+    chooseLocation: async function () {
+      Taro.showLoading({ title: '正在定位' })
+      await new Promise((resolve) => {
+        Taro.getSetting({
+          success(res) {
+            if (!res.authSetting['scope.userLocation']) {
+              Taro.authorize({
+                scope: 'scope.userLocationBackground',
+                success() {
+                  resolve();
+                }
+              })
+            } else {
+              resolve();
+            }
+          }
+        })
+      });
+      var that = this;
+      Taro.chooseLocation({
+        success: function (res) {
+          that.formData.address = res.address;
+        },
+        fail: function () {
+          if (!that.formData.address) {
+            Taro.showToast({
+              title: "请获取当前位置",
+              icon: 'error'
+            })
+          }
+        },
+      })
+      Taro.hideLoading()
+    },
+
+  }
+}
+</script>