SSM實現疫情打卡小程式
個人網站：http://xiaocaoshare.com/
2.需求分析
小程式：
學生和疫情防護人員
管理後臺
分為管理員、疫情防護人員、學生
主要功能為：
學生管理、疫情防護人員管理、院系資訊管理、疫情地區等級管理、系統管理等
3.技術架構
SSM+原生微信小程式+Vue
開發工具：
IDEA或eclipse
4.前端部分頁面程式碼展示
登入頁面
<view class="content data-v-4ff48042">
<view class="logo data-v-4ff48042">
<image
style="{{'box-shadow:'+('0 0 8rpx #ffaa33')+';'+('border-color:'+('#ccc')+';')+('border-radius:'+('20rpx')+';')+('border-width:'+('0px')+';')+('width:'+('160rpx')+';')+('border-style:'+('solid')+';')+('url:'+('http://codegen.caihongy.cn/20210327/7498aa8e3dbe4329b7b7a8caeae478cf.png')+';')+('is-show:'+(true)+';')+('height:'+('160rpx')+';')}}"
src="http://codegen.caihongy.cn/20210327/7498aa8e3dbe4329b7b7a8caeae478cf.png" mode="aspectFill"
class="data-v-4ff48042"></image>
</view>
<view class="uni-form-item uni-column data-v-4ff48042"><input class="uni-input data-v-4ff48042"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="請輸入賬號"
data-event-opts="{{[['input',[['__set_model',['','username','$event',[]]]]]]}}" value="{{username}}"
bindinput="__e" /></view>
<view class="uni-form-item uni-column data-v-4ff48042"><input class="uni-input data-v-4ff48042"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="password" name placeholder="請輸入密碼"
data-event-opts="{{[['input',[['__set_model',['','password','$event',[]]]]]]}}" value="{{password}}"
bindinput="__e" /></view>
<view class="uni-form-item uni-column data-v-4ff48042">
<picker value="{{index}}" range="{{options}}" data-event-opts="{{[['change',[['optionsChange',['$event']]]]]}}"
bindchange="__e" class="data-v-4ff48042">
<view class="uni-picker-type data-v-4ff48042"
style="{{'line-height:'+('80rpx')+';'+('font-size:'+('28rpx')+';')+('color:'+('rgba(255, 107, 19, 1)')+';')+('text-align:'+('left')+';')}}">
{{options[index]}}</view>
</picker>
</view>
<view class="data-v-4ff48042"><button
style="{{'border-color:'+('#ccc')+';'+('background-color:'+('rgba(255, 107, 19, 1)')+';')+('border-radius:'+('20rpx')+';')+('color:'+('rgba(255, 255, 255, 1)')+';')+('border-width:'+('0px')+';')+('font-size:'+('32rpx')+';')+('border-style:'+('solid')+';')+('height:'+('88rpx')+';')}}"
type="primary" data-event-opts="{{[['tap',[['onLoginTap',['$event']]]]]}}" bindtap="__e"
class="data-v-4ff48042">登入</button></view>
<view class="links data-v-4ff48042">
<view data-event-opts="{{[['tap',[['onRegisterTap',['xuesheng']]]]]}}" class="link-highlight data-v-4ff48042"
style="{{'color:'+('rgba(255, 107, 19, 1)')+';'+('font-size:'+('24rpx')+';')}}" bindtap="__e">註冊學生</view>
<view class="data-v-4ff48042">|</view>
<view data-event-opts="{{[['tap',[['onRegisterTap',['yiqingfangkongrenyuan']]]]]}}"
class="link-highlight data-v-4ff48042"
style="{{'color:'+('rgba(255, 107, 19, 1)')+';'+('font-size:'+('24rpx')+';')}}" bindtap="__e">註冊疫情防控人員</view>
<view class="data-v-4ff48042">|</view>
<view data-event-opts="{{[['tap',[['onForgetTap',['$event']]]]]}}"
style="{{'color:'+('rgba(255, 170, 51, 1)')+';'+('font-size:'+('24rpx')+';')}}" bindtap="__e"
class="data-v-4ff48042">忘記密碼？</view>
</view>
</view>
註冊頁面
<view class="content data-v-7316b56a">
<block wx:if="{{false}}">
<view class="logo data-v-7316b56a">
<image
style="{{'box-shadow:'+('0 0 8rpx #ffaa33')+';'+('border-color:'+('#ccc')+';')+('border-radius:'+('40rpx')+';')+('border-width:'+('0px')+';')+('width:'+('160rpx')+';')+('border-style:'+('solid')+';')+('url:'+('http://codegen.caihongy.cn/20210327/a116aa442827428698066a8d90b2e692.png')+';')+('is-show:'+(false)+';')+('height:'+('160rpx')+';')}}"
src="http://codegen.caihongy.cn/20210327/a116aa442827428698066a8d90b2e692.png" mode="aspectFill"
class="data-v-7316b56a"></image>
</view>
</block>
<block wx:if="{{tableName=='xuesheng'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="學號"
data-event-opts="{{[['input',[['__set_model',['$0','xuehao','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.xuehao}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='xuesheng'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="密碼"
data-event-opts="{{[['input',[['__set_model',['$0','mima','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.mima}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='xuesheng'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="姓名"
data-event-opts="{{[['input',[['__set_model',['$0','xingming','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.xingming}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='xuesheng'}}">
<view class="uni-form-item uni-column data-v-7316b56a">
<picker value="{{xueshengxingbieIndex}}" range="{{xueshengxingbieOptions}}"
data-event-opts="{{[['change',[['xueshengxingbieChange',['$event']]]]]}}" bindchange="__e"
class="data-v-7316b56a">
<view class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}">
{{ruleForm.xingbie?ruleForm.xingbie:"請選擇性別"}}</view>
</picker>
</view>
</block>
<block wx:if="{{tableName=='xuesheng'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="年齡"
data-event-opts="{{[['input',[['__set_model',['$0','nianling','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.nianling}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='xuesheng'}}">
<view class="uni-form-item uni-column data-v-7316b56a">
<picker value="{{xueshengsuozaiyuanxiIndex}}" range="{{xueshengsuozaiyuanxiOptions}}"
data-event-opts="{{[['change',[['xueshengsuozaiyuanxiChange',['$event']]]]]}}" bindchange="__e"
class="data-v-7316b56a">
<view class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}">
{{ruleForm.suozaiyuanxi?ruleForm.suozaiyuanxi:"請選擇所在院系"}}</view>
</picker>
</view>
</block>
<block wx:if="{{tableName=='xuesheng'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="電話"
data-event-opts="{{[['input',[['__set_model',['$0','dianhua','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.dianhua}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='xuesheng'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="郵箱"
data-event-opts="{{[['input',[['__set_model',['$0','youxiang','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.youxiang}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='xuesheng'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="身份證"
data-event-opts="{{[['input',[['__set_model',['$0','shenfenzheng','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.shenfenzheng}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='yiqingfangkongrenyuan'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="員工編號"
data-event-opts="{{[['input',[['__set_model',['$0','yuangongbianhao','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.yuangongbianhao}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='yiqingfangkongrenyuan'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="密碼"
data-event-opts="{{[['input',[['__set_model',['$0','mima','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.mima}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='yiqingfangkongrenyuan'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="防控人員姓名"
data-event-opts="{{[['input',[['__set_model',['$0','fangkongrenyuanxingming','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.fangkongrenyuanxingming}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='yiqingfangkongrenyuan'}}">
<view class="uni-form-item uni-column data-v-7316b56a">
<picker value="{{yiqingfangkongrenyuanxingbieIndex}}" range="{{yiqingfangkongrenyuanxingbieOptions}}"
data-event-opts="{{[['change',[['yiqingfangkongrenyuanxingbieChange',['$event']]]]]}}" bindchange="__e"
class="data-v-7316b56a">
<view class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}">
{{ruleForm.xingbie?ruleForm.xingbie:"請選擇性別"}}</view>
</picker>
</view>
</block>
<block wx:if="{{tableName=='yiqingfangkongrenyuan'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="年齡"
data-event-opts="{{[['input',[['__set_model',['$0','nianling','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.nianling}}" bindinput="__e" /></view>
</block>
<block wx:if="{{tableName=='yiqingfangkongrenyuan'}}">
<view class="uni-form-item uni-column data-v-7316b56a">
<picker value="{{yiqingfangkongrenyuansuozaiyuanxiIndex}}" range="{{yiqingfangkongrenyuansuozaiyuanxiOptions}}"
data-event-opts="{{[['change',[['yiqingfangkongrenyuansuozaiyuanxiChange',['$event']]]]]}}" bindchange="__e"
class="data-v-7316b56a">
<view class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}">
{{ruleForm.suozaiyuanxi?ruleForm.suozaiyuanxi:"請選擇所在院系"}}</view>
</picker>
</view>
</block>
<block wx:if="{{tableName=='yiqingfangkongrenyuan'}}">
<view class="uni-form-item uni-column data-v-7316b56a"><input class="uni-input data-v-7316b56a"
style="{{'border-color:'+('rgba(255, 170, 51, 1)')+';'+('background-color:'+('#fff')+';')+('border-radius:'+('8rpx')+';')+('color:'+('rgba(0, 0, 0, 1)')+';')+('text-align:'+('left')+';')+('border-width:'+('2rpx')+';')+('font-size:'+('28rpx')+';')+('border-style:'+('solid')+';')+('height:'+('80rpx')+';')}}"
type="text" name placeholder="聯絡電話"
data-event-opts="{{[['input',[['__set_model',['$0','lianxidianhua','$event',[]],['ruleForm']]]]]}}"
value="{{ruleForm.lianxidianhua}}" bindinput="__e" /></view>
</block>
<view class="data-v-7316b56a"><button
style="{{'border-color:'+('#ccc')+';'+('background-color:'+('rgba(255, 107, 19, 1)')+';')+('border-radius:'+('20rpx')+';')+('color:'+('rgba(255, 255, 255, 1)')+';')+('border-width:'+('0px')+';')+('font-size:'+('32rpx')+';')+('border-style:'+('solid')+';')+('height:'+('88rpx')+';')}}"
type="primary" data-event-opts="{{[['tap',[['register',['$event']]]]]}}" bindtap="__e"
class="data-v-7316b56a">註冊</button></view>
</view>
系統演示地址：
連結：連結：https://pan.baidu.com/s/1_bcsLAqK9i78IqSjdRwd_Q
提取碼：4t2t
需要原始碼的可以直接加QQ: 3083155908，本人專業代做畢業設計，論文，需要的私聊