Merge branch 'master' of http://git.ycjcjy.com/pet_identity/miniapp

src/app.config.js

@@ -2,7 +2,8 @@ export default {
   pages: [
     'pages/index/index',
     'pages/main/index',
-    'pages/NoticeInfo/index',
+    'pages/noticeList/index',
+    'pages/noticeInfo/index',
     'pages/setUser/index',
     'pages/setDogLicense/index',
     'pages/dogLicenseList/index',

src/pages/NoticeInfo/index.jsx

@@ -1,15 +1,25 @@
-import { View, Text, Image } from '@tarojs/components'
-import Taro from '@tarojs/taro';
+import { View, RichText, ScrollView } from '@tarojs/components'
 
 import './style.less'
 
 export default (props) => {
 
-
+  let htmlSnip=`<p style="text-align: center;"><strong>通知2士大夫敢死队</strong></p>
+  <p style="text-indent: 2em;" data-spm-anchor-id="C73544894212.P59511941341.0.i0">在今天举行的上海市新冠肺炎疫情防控新闻发布会上，相关部门介绍，全市高三、高二年级学生从6月6日，初三年级学生从6月13日起返校复学；中小学其他各年级学生继续居家在线学习至学期结束，学校可在学期结束前安排一次学生返校活动。有关部门将按照规范完成校园消杀，确保校园安全干净，为学校配备专门的核酸采样和检测力量，实施校园网格化管理等措施。</p>
+  <p style="text-indent: 2em;">上海复工复产加快推动，上海四家整车厂、中国船舶集团旗下的三大船企都实现复工复产。上海还将根据疫情防控形势，在6月推动工业、服务业和外资外贸企业等应复尽复。</p>
+  <p style="text-indent: 2em; text-align: right;">2022年5月26日</p>
+  <p style="text-indent: 2em; text-align: right;">南京防疫办公室</p>`
+  
+  htmlSnip = htmlSnip.replace(/<\/p>/g, '</p><p style="height: 1em">&nbsp;</p>')
+  
   return (
-    <View className='index-UserQRcode'>
-      我是公告嗷嗷嗷嗷嗷
+    <ScrollView scrollY style={{height:'100vh'}}>
+    <View className='noticeInfo'>
+      <View className='title'>我是标题</View>
+      <View className='date'>2022-6-9 13:33</View>
+      <RichText nodes={htmlSnip}></RichText>
     </View>
+    </ScrollView>
   )
 }
 

src/pages/NoticeInfo/style.less

@@ -0,0 +1,11 @@
+.noticeInfo{
+  padding: 32px;
+  .title{
+    font-size: 40px;
+    font-weight: bold;
+  }
+  .date{
+    color: gray;
+    margin-bottom: 32px;
+  }
+}

src/pages/index/index.jsx

@@ -38,14 +38,18 @@ export default (props) => {
       url: '/pages/main/index'
     })
   }
-
+  goMain
+  const goNoticeList=()=>{
+    Taro.navigateTo({url:'/pages/noticeList/index'})
+  }
+  const goDetail=()=>{
+    Taro.navigateTo({url:'/pages/noticeInfo/index'})
+  }
   const goDogLicenseList = (e) => {
     Taro.navigateTo({
       url: '/pages/dogLicenseList/index'
     })
   }
-
-
   return (
     <ScrollView scrollY style={{
       height: '100vh'
@@ -83,7 +87,7 @@ export default (props) => {
         </View>
 
         <View className='message-box'>
-          <Notice />
+          <Notice onMoreClick={goNoticeList} onClick={goDetail} />
         </View>
       </View>
     </ScrollView>

src/pages/noticeList/index.config.js

@@ -0,0 +1,8 @@
+export default {
+  navigationBarTitleText: "公告列表",
+  disableScroll: true,
+  navigationBarBackgroundColor: "#FBD804",
+  navigationBarTextStyle: "black",
+  backgroundColor: "#FBD804",
+  usingComponents: {},
+};

src/pages/noticeList/index.jsx

@@ -0,0 +1,111 @@
+import { ScrollView, View } from '@tarojs/components'
+import Taro from '@tarojs/taro';
+import './style.less'
+
+export default (props) => {
+  const onClick = () => { 
+    Taro.navigateTo({url:'/pages/noticeInfo/index'})
+  }
+  return (
+    <ScrollView scrollY style={{ height: '100vh' }}>
+      <View className='noticeList'>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View className='notice-item-body'>
+            <View className='notice-item-title'>这是我第一个通知</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View className='notice-item-body'>
+            <View className='notice-item-title'>这是我第一个通知江苏省南京市江宁区南京南站</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View>
+            <View className='notice-item-title'>这是我第一个通知</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View className='notice-item-body'>
+            <View className='notice-item-title'>这是我第一个通知</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View className='notice-item-body'>
+            <View className='notice-item-title'>这是我第一个通知江苏省南京市江宁区南京南站</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View>
+            <View className='notice-item-title'>这是我第一个通知</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View className='notice-item-body'>
+            <View className='notice-item-title'>这是我第一个通知</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View className='notice-item-body'>
+            <View className='notice-item-title'>这是我第一个通知江苏省南京市江宁区南京南站</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View>
+            <View className='notice-item-title'>这是我第一个通知</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View className='notice-item-body'>
+            <View className='notice-item-title'>这是我第一个通知</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View className='notice-item-body'>
+            <View className='notice-item-title'>这是我第一个通知江苏省南京市江宁区南京南站</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+        <View className='notice-item-row' onClick={onClick}>
+          <View className='iconfont icon-notice' />
+          <View>
+            <View className='notice-item-title'>这是我第一个通知</View>
+            <View className='notice-item-time'>2022.05.26</View>
+          </View>
+          <View className='iconfont icon-action' />
+        </View>
+      </View>
+    </ScrollView>
+  )
+}

src/pages/noticeList/style.less

@@ -0,0 +1,74 @@
+.noticeList{
+  padding: 32px;
+  @font-face {
+    font-family: 'iconfont';  /* Project id 2904679 */
+    src: url('//at.alicdn.com/t/font_2904679_ix6j11q9hir.woff2?t=1653563318275') format('woff2'),
+      url('//at.alicdn.com/t/font_2904679_ix6j11q9hir.woff?t=1653563318275') format('woff'),
+      url('//at.alicdn.com/t/font_2904679_ix6j11q9hir.ttf?t=1653563318275') format('truetype');  }
+  .iconfont {
+    font-family: "iconfont" !important;
+    font-size: 16px;
+    font-style: normal;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+  .icon-notice{
+    font-size: 80px;
+    width: 80px;
+    flex:none;
+    margin-right: 16px;
+    color: rgb(31 , 136, 217);
+  }
+  .icon-notice:before {
+    content: "\e60d";
+  }
+  .icon-action{
+    font-size: 40px;
+    width: 40px;
+    margin-left: 16px;
+    flex:none;
+  }
+  .icon-action:before {
+    content: "\e60e";
+  }
+  .notice-item-row {
+    align-items: center;
+    background-color: white;
+    display: flex;
+    border-radius: 16px;
+    padding: 32px;
+    & + .notice-item-row {
+      margin-top: 32px;
+    } 
+    .notice-item-title {
+      width: calc(100vw - 280px);
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      font-weight: bold;
+    } 
+    .notice-item-time{
+      font-size: 0.5em;
+      margin-top: 8px;
+    }
+    .icon-notice{
+      font-size: 80px;
+      width: 80px;
+      flex:none;
+      margin-right: 16px;
+      color: rgb(31 , 136, 217);
+    }
+    .icon-notice:before {
+      content: "\e60d";
+    }
+    .icon-action{
+      font-size: 40px;
+      width: 40px;
+      margin-left: 16px;
+      flex:none;
+    }
+    .icon-action:before {
+      content: "\e60e";
+    }  
+  } 
+}