From 834fbb139406ddc66ea91e5e897515c979405ccb Mon Sep 17 00:00:00 2001
From: rongweikang <1174906669@qq.com>
Date: Fri, 2 Feb 2024 20:52:29 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=8A=A4=E7=90=86=E6=8A=A5?=
 =?UTF-8?q?=E5=91=8A=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app.config.ts                           |   1 +
 src/pages/face_report/face_report.config.js |   3 +
 src/pages/face_report/face_report.less      | 211 ++++++++++++++++++++
 src/pages/face_report/face_report.tsx       | 203 +++++++++++++++++++
 4 files changed, 418 insertions(+)
 create mode 100644 src/pages/face_report/face_report.config.js
 create mode 100644 src/pages/face_report/face_report.less
 create mode 100644 src/pages/face_report/face_report.tsx

diff --git a/src/app.config.ts b/src/app.config.ts
index f9bce9b..02e72dc 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -26,6 +26,7 @@ export default defineAppConfig({
     "pages/recording/recording",
     "pages/webViewPage/webViewPage",
     'pages/template/template',
+    'pages/face_report/face_report',
   ],
   "tabBar": {
     "custom": true,
diff --git a/src/pages/face_report/face_report.config.js b/src/pages/face_report/face_report.config.js
new file mode 100644
index 0000000..04e6a32
--- /dev/null
+++ b/src/pages/face_report/face_report.config.js
@@ -0,0 +1,3 @@
+export default definePageConfig({
+  navigationBarTitleText: "模板页",
+});
diff --git a/src/pages/face_report/face_report.less b/src/pages/face_report/face_report.less
new file mode 100644
index 0000000..b968567
--- /dev/null
+++ b/src/pages/face_report/face_report.less
@@ -0,0 +1,211 @@
+page {
+  background: #f8f8f8;
+}
+
+.time {
+  font-size: 36rpx;
+  font-weight: 500;
+  color: #000000;
+  margin: 38rpx 0;
+}
+
+.m-x-30 {
+  margin-right: 30rpx;
+  margin-left: 30rpx;
+}
+
+.statistic {
+  height: 200rpx;
+  background: #ffffff;
+  border-radius: 30rpx;
+  text-align: center;
+  margin-bottom: 20rpx;
+}
+
+.statistic_item {
+  flex: 1;
+  border-right: 1rpx solid #dddddd;
+}
+
+.statistic_title {
+  font-size: 48rpx;
+  font-weight: 600;
+  color: #000000;
+  margin-bottom: 26rpx;
+  height: 37rpx;
+  line-height: 1;
+}
+
+.num {
+  font-size: 26rpx;
+  font-weight: 500;
+  margin-left: 13rpx;
+}
+
+.statistic_desc {
+  font-size: 26rpx;
+  font-weight: 500;
+  color: #999999;
+  line-height: 36rpx;
+}
+
+.statistic_item:last-child {
+  border: none;
+}
+
+.main {
+  border-radius: 30rpx;
+  overflow: hidden;
+  padding-bottom: calc(153rpx + env(safe-area-inset-bottom));
+}
+
+.main_title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #000;
+  margin: 48rpx 0 34rpx;
+}
+
+.footer {
+  position: fixed;
+  z-index: 99;
+  bottom: 0;
+  width: 100%;
+  height: 153rpx;
+  box-shadow: 0rpx -3rpx 7rpx 1rpx rgba(173, 191, 207, 0.21);
+  background: #ffffff;
+}
+
+.btn {
+  width: 540rpx;
+  height: 90rpx;
+  background: #000000;
+  border-radius: 45rpx;
+  color: #fff;
+  text-align: center;
+  line-height: 90rpx;
+  font-weight: bold;
+  font-size: 32rpx;
+  margin: 0 30rpx 0 49rpx;
+}
+
+.text {
+  flex: 1;
+  height: 31rpx;
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #000000;
+  line-height: 31rpx;
+}
+
+.text image {
+  width: 10rpx;
+  height: 20rpx;
+  margin-left: 15rpx;
+}
+
+.products_item {
+  width: 690rpx;
+  height: 330rpx;
+  background: #fff;
+  padding: 30rpx 33rpx 38rpx;
+  border-radius: 30rpx;
+  box-sizing: border-box;
+  margin-bottom: 20rpx;
+}
+
+.products_item:last-child {
+  border: none;
+}
+
+.products_top {
+  font-size: 28rpx;
+  font-weight: bold;
+  color: #000000;
+  margin-bottom: 36rpx;
+}
+
+.products_top .add_time {
+  padding-right: 23rpx;
+}
+
+.tag {
+  width: 90rpx;
+  height: 36rpx;
+  line-height: 36rpx;
+  background: #e5f9ee;
+  border-radius: 18rpx;
+  text-align: center;
+  font-size: 24rpx;
+  font-weight: 500;
+  color: #57bc81;
+}
+
+.tag_active {
+  background: #f8f8f8;
+  color: #999;
+}
+
+.cover {
+  width: 141rpx;
+  height: 140rpx;
+  border-radius: 20rpx;
+  margin-right: 37rpx;
+}
+
+.content {
+  display: flex;
+  flex-flow: column;
+  justify-content: space-between;
+ 
+}
+
+.content_top{
+    height: 140rpx;
+    display: flex;
+    flex-flow: column;
+    justify-content: space-between;
+}
+
+.title {
+  font-size: 28rpx;
+  font-weight: bold;
+  color: #000000;
+  margin: 3rpx 0 25rpx;
+}
+
+.desc {
+  font-size: 24rpx;
+  font-weight: 500;
+  color: #999999;
+}
+
+.desc:last-child {
+  margin-top: 10rpx;
+}
+
+.progress {
+  display: flex;
+  margin-top: 10rpx;
+  font-size: 24rpx;
+  font-family: PingFang SC;
+  font-weight: 500;
+  color: #999999;
+  align-items: center;
+
+  .van-progress {
+    width: 213rpx;
+    .van-progress__portion {
+      background: linear-gradient(90deg, #ffe9c7, #eecda1);
+      border-radius: 6rpx;
+      height: 12rpx;
+      .van-progress__pivot {
+        display: none;
+      }
+    }
+  }
+
+  .percent {
+    margin-left: 52rpx;
+  }
+}
diff --git a/src/pages/face_report/face_report.tsx b/src/pages/face_report/face_report.tsx
new file mode 100644
index 0000000..e5c4cb1
--- /dev/null
+++ b/src/pages/face_report/face_report.tsx
@@ -0,0 +1,203 @@
+import Taro from "@tarojs/taro";
+import classNamenames from "classNamenames";
+
+import { Component, PropsWithChildren, useEffect, useState } from "react";
+import { Progress } from '@antmjs/vantui'
+
+import { Block, View, Text, Image, Input, Button } from "@tarojs/components";
+/** 自定义组件 **/
+import Navbar from "../../components/navbar/navbar";
+import PopupAlert from "../../components/popup/popup-alert";
+import { InstrumentInfo } from '../../utils/Interface'
+
+/** 自定义组件 **/
+import "./face_report.less";
+
+export default class Index extends Component<any, any> {
+  constructor(props) {
+    super(props);
+    this.state = {
+      name: "template模板页",
+
+    };
+  }
+
+  componentDidMount() { }
+
+  componentWillUnmount() { }
+
+
+
+  async onLoad() { 
+    this.getClockStatistics()
+  }
+
+  componentDidShow() { }
+
+  componentDidHide() { }
+
+  async initData() { }
+
+  render() {
+    let { name } = this.state;
+    return (
+      <Block>
+        <Navbar isBack titleSlot='护理报告'></Navbar>
+        {/* <View className="time m-x-30">{{reportData.curDate}}</View> */}
+        {/* <View className="time m-x-30"></View> */}
+        <View className='statistic m-x-30 flex aitems'>
+          {/* <block wx:if="{{ reportData.instrument_type !== 5 && reportData.instrument_type !== 4 }}"> */}
+          <View className='statistic_item'>
+            <View className='statistic_title'>
+              <text>3</text>
+              <text className='num'>天</text>
+            </View>
+            {/* <View wx:if="{{ reportData.instrument_id == 74 || reportData.instrument_id == 73  }}" className="statistic_desc">
+                本月护理天数
+            </View> */}
+            <View className='statistic_desc'>
+              本月护理天数
+            </View>
+            {/* <View className="statistic_desc">{{options.type == 'led' ? '本月光照天数': '本月促渗天数'}}</View> */}
+            <View className='statistic_desc'>本月光照天数</View>
+
+          </View>
+          <View className='statistic_item'>
+            <View className='statistic_title'>28:00</View>
+            {/* <View className="statistic_desc">{{options.type == 'led' ? '本月护理时间': '本月促渗时间'}}</View> */}
+            <View className='statistic_desc'>本月护理时间</View>
+          </View>
+          {/* </block> */}
+          {/* <block wx:if="{{ reportData.instrument_type == 4 || reportData.instrument_type == 5 }}"> */}
+          <View className='statistic_item'>
+            <View className='statistic_title'>
+              <text>8</text>
+              <text className='num'>天</text>
+            </View>
+            <View className='statistic_desc'>
+              本月护理天数
+            </View>
+          </View>
+          <View className='statistic_item'>
+            <View className='statistic_title'>28:00</View>
+            <View className='statistic_desc'>本月护理时间</View>
+          </View>
+          {/* </block> */}
+        </View>
+        <View className='main m-x-30'>
+          {/* <block wx:if="{{ reportData.instrument_type !== 4 && reportData.instrument_type !== 5 }}"> */}
+          <View className='products_item' style='border: none'>
+            <View className='products_top flex aitems'>
+              <View className='add_time'>2024.01.15</View>
+              <View className="{{reportData.nurseLog.online === 2 ? 'tag tag_active' : 'tag'}}">在线</View>
+            </View>
+            <View className='products_middle flex'>
+              <Image className='cover' src={require('../../img/test/1706667011027.jpg')} mode='aspectFill'></Image>
+              <View className='content'>
+                <View className='content_top'>
+                  <View className='title'>光能厂美侧板</View>
+                  <View className='desc_box'>
+                    <View className='desc'>模式：维护修复</View>
+                    <View className='desc'>护理时间：10:00</View>
+                  </View>
+                </View>
+                <View className='progress'>
+                  完成度：
+                  <Progress percentage='80' strokeWidth='12' pivotText='' color='linearGradient(to right, #eecda1, #ffe9c7) !important' />
+                  <View className='percent'> 80%</View>
+                </View>
+              </View>
+            </View>
+          </View>
+          <View className='main_title' >历史记录</View>
+          <View className='products_item'>
+            <View className='products_top flex aitems'>
+              <View className='add_time'>2024.01.01</View>
+              <View className="{{item.online === 2 ? 'tag tag_active' : 'tag'}}">在线</View>
+            </View>
+            <View className='products_middle flex'>
+              <Image className='cover' src={require('../../img/test/1706667011027.jpg')} mode='aspectFill'></Image>
+              <View className='content'>
+                <View className='content_top'>
+                  <View className='title'>光能厂美侧板</View>
+                  <View className='desc_box'>
+                    <View className='desc'>模式：维护修复</View>
+                    <View className='desc'>护理时间：10:00</View>
+                  </View>
+                </View>
+                <View className='progress'>
+                  完成度：
+                  <Progress percentage='80' strokeWidth='12' pivotText='' color='linearGradient(to right, #eecda1, #ffe9c7) !important' />
+                  <View className='percent'> 80%</View>
+                </View>
+              </View>
+            </View>
+
+          </View>
+          {/* </block> */}
+          {/* <block wx:if="{{ reportData.instrument_type == 4 || reportData.instrument_type == 5 }}"> */}
+          <View className='products_item' style='border: none'>
+            <View className='products_top flex aitems'>
+              <View className='add_time'>2024.01.01</View>
+              <View className="{{reportData.online === 2 ? 'tag tag_active' : 'tag'}}">在线</View>
+            </View>
+            <View className='products_middle flex'>
+              <Image className='cover' src={require('../../img/test/1706667011027.jpg')} mode='aspectFill'></Image>
+              <View className='content'>
+                <View className='content_top'>
+                  <View className='title'>光能厂美侧板</View>
+                  <View className='desc_box'>
+                    <View className='desc'>模式：维护修复</View>
+                    <View className='desc'>护理时间：10:00</View>
+                  </View>
+                </View>
+                <View className='progress'>
+                  完成度：
+                  <Progress percentage='80' strokeWidth='12' pivotText='' color='linearGradient(to right, #eecda1, #ffe9c7) !important' />
+                  <View className='percent'> 80%</View>
+                </View>
+              </View>
+
+            </View>
+          </View>
+          <View className='main_title' >历史记录</View>
+          <View className='products_item' >
+            <View className='products_top flex aitems'>
+              <View className='add_time'>2024.01.01</View>
+              <View className="{{item.online === 2 ? 'tag tag_active' : 'tag'}}">在线</View>
+            </View>
+            <View className='products_middle flex'>
+              <Image className='cover' src={require('../../img/test/1706667011027.jpg')} mode='aspectFill'></Image>
+              <View className='content'>
+                <View className='content_top'>
+                  <View className='title'>光能厂美侧板</View>
+                  <View className='desc_box'>
+                    <View className='desc'>模式：维护修复</View>
+                    <View className='desc'>护理时间：10:00</View>
+                  </View>
+                </View>
+                <View className='progress'>
+                  完成度：
+                  <Progress percentage='80' strokeWidth='12' pivotText='' color='linearGradient(to right, #eecda1, #ffe9c7) !important' />
+                  <View className='percent'> 80%</View>
+                </View>
+              </View>
+            </View>
+          </View>
+          {/* </block> */}
+        </View>
+
+        <View className='footer flex aitems' >
+          <View className='btn'>前往打卡</View>
+          <View className='text flex aitems'>
+            <View>跳过</View>
+            <Image src='/img/right.png' mode='aspectFill'></Image>
+          </View>
+        </View>
+
+        {/* <clockInDialog id="clockInDialog" instrumentId="{{reportData.instrument_id}}"  isCustom="{{ true }}" bind:submitFun="confirmSubmit"/> */}
+
+      </Block>
+    );
+  }
+}