Merge branch 'master' of ssh://47.110.145.204:2222/godwithdh/wx_h5

src/router/health.js

@@ -44,5 +44,28 @@ module.exports = [
                 }
             }
         ]
+    },
+    {//健康打卡
+        name:"main",
+        component:()=>import("@/view/main.vue"),
+        path:"/main",
+        children:[
+            {
+                path:"/healthCard/punchClock",
+                name:"punchClock",
+                component:()=>import("@/view/healthCard/punchClock.vue"),
+                meta:{
+                    title:"打卡列表"
+                }
+            },
+            {
+                path:"/healthCard/punchClockDetail/:id/:openId",
+                name:"punchClockDetail",
+                component:()=>import("@/view/healthCard/punchClockDetail.vue"),
+                meta:{
+                    title:"打卡健康"
+                }
+            }
+        ]
     }
 ]
\ No newline at end of file

src/router/index.js

@@ -345,21 +345,6 @@ let tipRoutes = [
         },
       },
     ]
-  },
-  {//健康打卡
-    name:"main",
-    component:()=>import("@/view/main.vue"),
-    path:"/main",
-    children:[
-      {
-        path:"/healthCard/punchClock",
-        name:"punchClock",
-        component:()=>import("@/view/healthCard/punchClock.vue"),
-        meta:{
-          title:"打卡列表"
-        }
-      }
-    ]
   }
 ];
 

src/view/healthCard/config.js

+import Vue from "vue"
+export default new Vue({
+    
+})
\ No newline at end of file

src/view/healthCard/punchClock.vue

@@ -17,7 +17,7 @@
             border-radius: 50px;
             padding: 7px 16px;
             color: #fff;
-            background: linear-gradient(45deg, #0CCF99, #19BAC1);
+            background: linear-gradient(45deg, #0081ff, #1cbbb4);
             box-shadow: 2px 2px 3px rgba(23,189,187,0.4);
         }
     }
@@ -30,14 +30,54 @@
             display: flex;
             justify-content: space-between;
             height: 30px;
-            >span:nth-child(2){
+            >span{
                 display: flex;
                 align-items: center;
+                &.iconfont{
+                    color: #888;
+                    width: 40px;
+                    font-size:13px;
+                    padding: 5px;
+                    box-sizing: border-box;
+                }
+                &:not(.iconfont){
                 color: #555;
                 font-size: 14px;
                 }
             }
         }
+        >table{
+            width:100%;
+            tr{
+                &:first-child{
+                    background: #f2f2f2;
+                    color: #777;
+                }
+                >td{
+                    text-align: center;
+                    height:30px;
+                    line-height: 30px;
+                    >div{
+                        &.now{
+                            color:#55B2B4;
+                        }
+                        >img{
+                            width: 15px;
+                            position: absolute;
+                        }
+                    }
+                }
+            }
+        }
+        >.foot{
+            text-align: center;
+            height: 30px;
+            line-height: 30px;
+            background: #f6f6f6;
+            color: #777;
+            border-top: 1px solid #ddd;
+        }
+    }
 }
 </style>
 <template>
@@ -47,24 +87,111 @@
               <span>0</span>
               天连续打卡
           </div>
-          <div class="card">今日健康打卡</div>
+          <div class="card" @click="toDetail">今日健康打卡</div>
       </div>
       <div class="calendar">
             <div class="head">
-              <span></span>
-              <span>2020年2月</span>
-              <span></span>
+                    <span class="iconfont icon-back" @click="setCalendar(-1)"></span>
+                    <span>{{nowMonth}}</span>
+                    <span class="iconfont icon-back" @click="setCalendar(1)" style="transform: rotate(180deg);"></span>
+            </div>
+            <table>
+                <tr>
+                    <td>日</td>
+                    <td>一</td>
+                    <td>二</td>
+                    <td>三</td>
+                    <td>四</td>
+                    <td>五</td>
+                    <td>六</td>
+                </tr>
+                <tr v-for="(v1,k1) in calendarList" :key="k1">
+                    <td v-for="(v2,k2) in v1" :key="k2">
+                        <div :class="{now:v2.isNow}">
+                            {{v2.value}}
+                            <!-- <img v-if="" src="./image/tick.png" /> -->
                         </div>
+                    </td>
+                </tr>
+            </table>
+            <!-- <div class="foot">
+                展开日历
+            </div> -->
       </div>
   </div>
 </template>
 
 <script>
+import util from "@/libs/util.js"
+import config from "./config"
 export default {
     name: 'punchClock',
     data () {
         return {
+            nowDate:new Date(),
+            calendarList:[],
+            id:"",
+            openId:"",
+        }
+    },
+    created(){
+        window.health=this
+        console.log(config)
+        this.id=this.$route.query.id
+        this.openId=this.$route.query.openId
+        this.setCalendar(0)
+    },
+    methods:{
+        setCalendar(number){//设置日期
+            this.nowDate.setDate(1)
+            var date=this.nowDate=new Date(this.nowDate.setMonth(this.nowDate.getMonth()+number))
+            date.setMonth(date.getMonth()+1)
+            date.setDate(0)
+            this.calendarList=[]
+            this.getDate(this.nowDate.getDay(),1,date.getDate())
+        },
+        getDate(week,day,days){
+            var weeks=[]
+            for(var i=0;i<7;i++){
+                if(i<week||day>days){
+                    weeks.push({})
+                }else{
+                    weeks.push({
+                        value:day,
+                        isNow:this.isNow(day)
+                    })
+                    day++
+                }
+            }
+            this.calendarList.push(weeks);
 
+            if(day>=days)return;
+            this.getDate(0,day,days)
+        },
+        isNow(day){
+            if(this.nowDate.getFullYear()!=new Date().getFullYear()){
+                return false
+            }else if(this.nowDate.getMonth()!=new Date().getMonth()){
+                return false
+            }else if(day!=new Date().getDate()){
+                return false
+            }else {
+                return true
+            }
+        },
+        toDetail(){
+            wx.miniProgram.postMessage({data:345})
+            return
+            if(this.openId){
+                this.$router.push({path:"/healthCard/punchClockDetail",query:{id:this.id,openId:this.openId}})
+            }else{
+                wx.miniProgram.postMessage("asdf")
+            }
+        }
+    },
+    computed:{
+        nowMonth(){
+            return util.dateFormat(this.nowDate,"yyyy年MM月")
         }
     }
 }

src/view/healthCard/punchClockDetail.vue

+<style lang="less">
+#punchClockDetail{
+    overflow-x: hidden;
+    >img{
+        width:100%;
+    }
+    >.list{
+        background: #fff;
+        margin: 10px 0;
+        padding: 10px;
+        font-size: 15px;
+        .v-input--radio-group{
+            margin-top: 0;
+            margin-bottom: -15px;
+            .v-input__control{
+                width:100%;
+                .v-input__slot{
+                    margin:0;
+                    .v-input--radio-group__input{
+                        >div{
+                            label{
+                                padding:4px 0;
+                                flex-grow: 1;
+                                font-size: 14px;
+                            }
+                            &:not(:last-child){
+                                label{
+                                    border-bottom:1px solid #ddd;
+                                }
+                            }
+                            >.v-radio{
+                                display:flex;
+                                >div{
+                                    flex-shrink: 0;
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        >textarea{
+            width:100%;
+            min-height: 55px;
+        }
+    }
+    >button{
+        width:calc(100% - 10px);
+        margin: 0 5px;
+        background:#5E9AFE;
+        color:#fff;
+        padding:10px 0;
+        margin-bottom:5px;
+    }
+}
+</style>
+<template>
+    <div id="punchClockDetail">
+        <img src="./image/health.jpg" />
+        <div class="list">
+            <div class="tip">1. 目前健康状况</div>
+            <v-radio-group v-model="value.sStatus">
+                <div><v-radio value="健康" label="健康"/></div>
+                <div><v-radio value="有发烧、咳嗽等症状" label="有发烧、咳嗽等症状"/></div>
+                <div><v-radio value="其他" label="其他"/></div>
+            </v-radio-group>
+        </div>
+        <div class="list">
+            <div class="tip">2. 目前所在城市</div>
+            <x-address
+                @on-hide="logHide"
+                @on-show="logShow"
+                title=""
+                v-model="address"
+                :list="addressData" 
+                @on-shadow-change="onShadowChange" 
+                placeholder="请选择地址"
+                value-text-align="left"
+                :show.sync="showAddress"/>
+        </div>
+        <div class="list">
+            <div class="tip">3. 是否接触过疑似或确诊的新型肺炎患者</div>
+            <v-radio-group v-model="value.bTouch">
+                <div><v-radio :value="0" label="否"/></div>
+                <div><v-radio :value="1" label="是"/></div>
+            </v-radio-group>
+        </div>
+        <div class="list">
+            <div class="tip">4. 接触日期</div>
+            <datetime
+                title=""
+                format='YYYY-MM-DD'
+                placeholder="请选择"
+                value-text-align="left"
+                :show.sync="isShowDate"
+                v-model="value.dTouchDate"
+                />
+        </div>
+        <div class="list">
+            <div class="tip">5. 体温</div>
+            <xInput
+                title=""
+                placeholder="输入体温"
+                v-model="value.nTemperature"
+                type="number" />
+        </div>
+        <div class="list">
+            <div class="tip">4. 是否自我隔离</div>
+            <v-radio-group v-model="value.bQuarantine">
+                <div><v-radio :value="0" label="否"/></div>
+                <div><v-radio :value="1" label="是"/></div>
+            </v-radio-group>
+        </div>
+        <div class="list">
+            <div class="tip">5. 是否就医</div>
+            <v-radio-group v-model="value.bHospital">
+                <div><v-radio :value="0" label="否"/></div>
+                <div><v-radio :value="1" label="是"/></div>
+            </v-radio-group>
+        </div>
+        <div class="list">
+            <div class="tip">6. 是否去过疫区(湖北,武汉)</div>
+            <v-radio-group v-model="value.bHaveBeen">
+                <div><v-radio :value="0" label="否"/></div>
+                <div><v-radio :value="1" label="是"/></div>
+            </v-radio-group>
+        </div>
+        <div class="list">
+            <div class="tip">7. 出行明细</div>
+            <textarea placeholder="请输入" autoHeight="true" v-model="value.sHaveBeenDetail"/>
+        </div>
+        <div class="list">
+            <div class="tip">8. 其他情况</div>
+            <textarea placeholder="请输入" autoHeight="true" v-model="value.sRemark"/>
+        </div>
+        <button @click="upData">提交</button>
+    </div>
+</template>
+
+<script>
+import util from "@/libs/util.js"
+import { XAddress,ChinaAddressV4Data,Datetime,XInput } from 'vux'
+import config from "./config"
+export default {
+    name: 'punchClockDetail',
+    components:{XAddress,Datetime,XInput},
+    data () {
+        return {
+            address:[],
+            addressData:ChinaAddressV4Data,
+            showAddress:false,
+            isShowDate:false,
+            value:{
+                iEmploeeId:"",      //员工主键
+                dCheckDate:"",      //打卡日期
+                sStatus:"",         //状态
+                nTemperature:'',    //体温
+                sAddress:"",        //地址
+                sAddressFull:"",    //详细地址
+                bTouch:"",          //是否接触过
+                dTouchDate:"",      //接触日期
+                bQuarantine:"",     //是否自我隔离
+                bHospital:"",       //是否自我就医
+                bHaveBeen:"",       //是否去过疫区
+                sHaveBeenDetail:"", //出行明细
+                sRemark:"",         //其他情况
+                tCreateTime:"",     //创建日期
+                sCreateAppid:"",    //openID
+            }
+        }
+    },
+    created(){
+        this.value.iEmploeeId=this.$route.params.id
+        this.value.sCreateAppid=this.$route.params.openId
+        this.value.dCheckDate=this.value.tCreateTime=util.dateFormat(new Date(),"yyyy-MM-dd hh:mm:ss")
+    },
+    methods:{
+        logHide(){},
+        logShow(){},
+        onShadowChange(){},
+        upData(){//保存数据
+            console.log(this.value)
+        },
+    },
+}
+</script>
\ No newline at end of file