#DAYU200体验官#丢失儿童寻找系统原创精华

剩余价值

发布于 2022-7-6 12:33

浏览

6收藏

丢失儿童寻找系统

项目背景

根据“团圆”系统数据显示，儿童失踪原因主要有被拐卖、离家出走、迷路走失、意外身亡等原因。走失事件往往容易转变为拐卖等恶劣的刑事案件，有很多孩子，或者遇到了拐卖儿童的人贩子，或者受到了意外伤害，最终给家庭带来毁灭性灾难。现在社会中层出不穷的骗入手段、骗子不断更新的骗人技巧，不得不让每一位孩子的家长担心自己孩子的安危。根据《中国走失人口白皮书(2020)》，在整个2020年期间，我国走失人次达到了100万。其中未成年人占7.4%，也就是说，儿童走失人口近74000人，而失踪后找回来的大概只占到0.1%。按照国务委员、公安部部长、国务院反拐部国际联席会议总召集人赵克志，公安部党委书记、分管日常工作的副部长王小洪部署要求，公安部决定自3月1日起至12月31日开展打击拐卖妇女儿童犯罪专项行动。我们的产品应运而生，能够帮助专项行动打出声威、打出实效，切实维护妇女儿童合法权益。

团队介绍

追寻者团队于2021年6月在郑州轻工业大学梅科尔工作室成立，致力于寻找丢失儿童，使其阖家团圆。团队成员之间优势互补、配合默契，分别负责算法设计、前后端开发、App开发、硬件开发，在各自负责的领域发光发热。在深度学习和机器视觉方面，本团队成员具有浓厚的兴趣和较为丰富的学习经验，致力于跨年龄人脸识别技术的学习和探索，将丢失儿童的识别和身份确认作为项目发展方向。身为大学生的我们将社会责任牢记心中，在努力提升自身知识储备和能力的同时，为寻找丢失儿童事业竭尽心力。梅科尔工作室的老师和同学们在极为有限的条件下让价值最大化，工作室在老龄化、老年人康复、特殊人群关爱等方向发展良好，总计参与到60余个医疗项目的联合创新开发中。
#DAYU200体验官#丢失儿童寻找系统-鸿蒙开发者社区

项目简介

项目采用pytorch和华为开源自研AI框架MindSpore，可以根据警方或他人提供的图片判断其是否为丢失儿童。同时还可以根据丢失儿童的时间长短，通过用户上传儿童的照片进行预估并生成当下的照片，更加便于家庭和警方寻找丢失儿童，帮助丢失儿童早日回归家庭。
项目主要分为算法端、硬件端、基于HarmonyOS的App以及Vue前端，主要用到的软件有pycharm、idea、anaconda等。
算法端分为跨年龄人脸识别算法和人脸变老预测算法。跨年龄人脸识别算法通过使用MTCNN（多任务卷积神经网络）设计三层级联架构的 CNN 算法进行检测，提取出不受年龄干扰的身份特征，以此达到跨年龄人脸识别。人脸变老预测算法以GAN 为基础，并按照年龄、性别和语义分割对其进行标记，预测一个人在未来的样貌，或者他在过去的样貌。
网页端是Vue前端，源代码在gitee上开源，用户可通过网站查看上传、搜寻以及查看丢失儿童信息，并且可以与我们进行联系和反馈。网页端偏向信息查看等功能，更多的操作需要进一步在App进行使用。
移动端目前为App。相对于微信小程序来说，App可以离线进行部分功能操作，提高了产品的适应面。通过网络连接将信息存储到服务器中，以达到多端信息互通。

技术架构

#DAYU200体验官#丢失儿童寻找系统-鸿蒙开发者社区

开发环境

DevEco Studio for OpenHarmony3.0.0.900
OpenHarmony版本：3.1_Release
开发板：DAYU200

开发过程

首页

#DAYU200体验官#丢失儿童寻找系统-鸿蒙开发者社区
hml源码：

<element name='comp' src='../../components/tabbar/tabbar.hml'></element>
<div class="container">
    <div class="text">
        <text>丢失儿童寻找</text>
    </div>
    <div class="container1">
        <swiper autoplay="true" class="swiper">
            <image src="{{$item}}" for="{{imageList}}" class="img"></image>
        </swiper>
    </div>
    <div class="text1">
        <div class="line_y"></div>
        <text>今日推荐</text>
    </div>
    <image class="img1" src="../../common/images/a1.jpg"></image>
    <image class="img1" src="../../common/images/a3.jpg"></image>
    <comp index="0"></comp>
</div>
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.

css源码：

.container {
    flex-direction: column;
    align-items: center;
}
.text {
    display: flex;
    position: fixed;
    padding: 5px 250px 15px 251px;
    background-color: #000000;
}
.text text {
    margin-left: 75px;
    line-height: 50px;
    color: #FFFFFF;
    font-size: 24px;
    align-content: center;
}
.container1 {
    flex-direction: column;
    margin-top: 70px;
    width: 100%;
    display: flex;
    align-items: center;
}
.swiper {
    flex-direction: column;
    align-content: center;
    align-items: center;
    width: 100%;
    height: 270px;
    border: 1px solid #000000;
}
.img {
    object-fit: fill;
}
.text1 {
    margin-top: 6px;
    display: flex;
    align-items: center;
    position: relative;
    padding: 10px 10px 10px 12px;
}
.text1 text {
    margin-left: 10px;
    line-height: 30px;
    font-size: 25px;
    color: #656565;
}
.line_y {
    width: 4px;
    height: 60px;
    background-color: #09bb07;
}
.img1 {
    margin-top: 3px;
    object-fit: fill;
    height: 330px;
    border: 1px solid gray;
    padding: 1px;
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.

js源码：

export default {
    data: {
        title: "",
        imageList:['/common/images/2.jpg','/common/images/1.jpg','/common/images/3.jpg']
    },
    onInit() {
        this.title = this.$t('strings.world');
    },
    swipeToIndex(index) {
        this.$element('swiperImage').swipeTo({index: index});
    }
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.

信息上传

#DAYU200体验官#丢失儿童寻找系统-鸿蒙开发者社区
hml源码：

<element name='comp' src='../../components/tabbar/tabbar.hml'></element>
<div class="container">
    <div class="text">
        <text>丢失儿童寻找</text>
    </div>
    <text class="title">走失人员信息</text>
    <div class="input-item">
        <div class="color">
            <text class="input-title">姓名</text>
            <input class="input" type="text" placeholder="请输入文本"></input>
        </div>
    </div>
    <div class="input-item">
        <div class="color">
            <text class="length-title input-title">年龄</text>
            <input class="input" type="text" placeholder="请输入走失时的年龄" maxlength="20" showcounter="false"></input>
        </div>
    </div>
    <div class="input-item">
        <div class="color">
            <text class="input-title">性别</text>
            <div class="radio-div">
                <select @change="changeFruit">
                    <option value="bananaValue">
                        男
                    </option>
                    <option value="appleValue" selected="true">
                        女
                    </option>
                </select>
            </div>
        </div>
    </div>
    <div class="input-item">
        <div class="color">
            <text class="input-title">走失日期</text>
            <input class="input" type="date" placeholder="如：2021-11-27"></input>
        </div>
    </div>
    <div class="container2">
        <text class="title2">您的详细信息</text>
        <div class="input-item">
            <div class="color">
                <text class="input-title">姓名</text>
                <input class="input" type="text" placeholder="请输入文本"></input>
            </div>
        </div>

        <div class="input-item">
            <div class="color">
                <text class="input-title">性别</text>
                <div class="radio-div2">
                    <select @change="changeFruit">
                        <option value="bananaValue">
                            男
                        </option>
                        <option value="appleValue" selected="true">
                            女
                        </option>
                    </select>
                </div>
            </div>
        </div>
        <div class="input-item">
            <div class="color">
                <text class="input-title">走失人员与您的关系</text>
                <div class="checkbox-div">
                    <select @change="changeFruit">
                        <option value="bananaValue">
                            父子
                        </option>
                        <option value="appleValue" selected="true">
                            母子
                        </option>
                        <option value="pearValue">
                            父女
                        </option>
                        <option value="pearValue2">
                            母女
                        </option>
                    </select>
                </div>
            </div>
        </div>

        <div class="input-item">
            <div class="color">
                <text class="input-title">是否报警</text>
                <switch showtext="true" texton="是" textoff="否" checked="true" @change="switchChange">
                </switch>
            </div>
        </div>

        <div class="input-item">
            <div class="color">
                <text class="input-title">您的邮箱</text>
                <input class="input" type="email" placeholder="方便我们联系您"></input>
            </div>
        </div>

        <div class="input-item">
            <div class="color">
                <text class="message-title input-title">请输入手机号</text>
                <input class="message-input" type="number" placeholder="请输入手机号码"></input>
            </div>
        </div>


        <div class="color">
            <input class="message-input" type="number" placeholder="请输入验证码"></input>
            <input class="message-button" type="button" value="获取验证码"></input>
        </div>


    </div>

    <div class="input-item">
        <div class="color">
            <image class="img" src="../../common/images/camera.png"></image>
            <button class="message-button" type="capsule" value="上传图片" @click="jump"></button>

        </div>
    </div>
    <div class="input-item">
        <input class="confirm-button" type="button" value="确认"></input>
        <div class="text2">致力于帮助丢失儿童家庭寻找丢失儿童，让宝贝早日回家</div>
        <button class="message-button" type="capsule" value="提交" @click="jump2"></button>
    </div>

    <comp index="1"></comp>

</div>
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
91.
92.
93.
94.
95.
96.
97.
98.
99.
100.
101.
102.
103.
104.
105.
106.
107.
108.
109.
110.
111.
112.
113.
114.
115.
116.
117.
118.
119.
120.
121.
122.
123.
124.
125.
126.
127.
128.
129.
130.
131.
132.

css源码：

.container {
    width: 100%;
    flex-direction: column;
    padding: 0 0 5% 0;
    background-color: #F7F8FA;
}
.container2{
    width: 100%;
    flex-direction: column;
    padding: 0 0 5% 0;
    background-color: #F7F8FA;
}
.radio{
    font-size: 24px;
}
.title {
    color: #6D7278;
    font-size: 24px;
    font-family: HarmonyHeiTi;
    margin: 80px 0 10px 14px;
}
.title2 {
    color: #6D7278;
    font-size: 24px;
    font-family: HarmonyHeiTi;
    margin: 20px 0 10px 14px;
}
.color {
    margin: 0 4% 0 4% ;
    width: 92%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.title,.input-title,.message-title,.length-title {
    width: 32%;
}
.input-item {
    width: 100%;
}
.input-title {
    color: #121317;
    font-family: HarmonyHeiTi;
}
.input {
    width: 70%;
}
.message-input {
    width: 45%;
}
.message-button {
    font-size: 15px;
    width: 31%;
    height: 30px;
    border-radius: 5px;
    margin-top: 5px;
}
.checkbox-div,.radio-div,.radio-div2 {
    padding: 0 38px 0 2px;
    font-size: 20px;
}
.search-item {
    border-radius: 25px;
    margin:6px 4% 6px 4%;
}
.search {
    width: 80%;
    height: 33px;
}
.button {
    width: 88px;
    height: 27px;
    margin: 4px 4px 4px 0;
}
.search,.message-input,.input,.input-title {
    font-size: 20px;
}
.input-item,.input,.message-input {
    background-color: white;
}
.input,.message-input,.search {
    placeholder-color: rgba(0,0,0,0.1);
}
.message-button,.button {
    background-color: #317AFF;
    font-size: 20px;
}
.search,.search-item {
    background-color: #F1F3F5;
}
.checkbox {
    color: #317AFF;
}
.confirm-button{
    margin-top: 20%;
    margin-left: 30% ;
    width: 60%;
    background-color: #317AFF;
    font-size: 20px;

}
.message-button{
    margin-left: 10% ;
}
switch{
    texton-color:#002aff;
    textoff-color:silver;
    text-padding:15px;
}
.img{
    width: 20%;
    margin-top: 5px;
    margin-left: 20px;
}
.text2 {
    margin-top: 70px;
    display: flex;
    align-items: center;
    position: relative;
    padding: 40px 10px 10px 12px;

}
.text2 text {
    font-size: 20px;
    color: #000000;
}

.text {
    display: flex;
    position: fixed;
    padding: 5px 250px 15px 251px;
    background-color: #000000;
}
.text text {
    margin-left: 75px;
    line-height: 50px;
    color: #FFFFFF;
    font-size: 24px;
    align-content: center;
}

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
91.
92.
93.
94.
95.
96.
97.
98.
99.
100.
101.
102.
103.
104.
105.
106.
107.
108.
109.
110.
111.
112.
113.
114.
115.
116.
117.
118.
119.
120.
121.
122.
123.
124.
125.
126.
127.
128.
129.
130.
131.
132.
133.
134.
135.
136.
137.
138.
139.

js源码：

import router from '@system.router';
export default {
    data: {
        title: ""
    },
    onInit() {
        this.title = this.$t('strings.world');
    }，
    jump(){
        router.push({
            uri: 'pages/takePhoto/index',
        });

    },
    jump2(){
        router.push({
            uri: 'pages/submit/index',
        });

    }
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.

关于我们

#DAYU200体验官#丢失儿童寻找系统-鸿蒙开发者社区
hml源码：

<element name='comp' src='../../components/tabbar/tabbar.hml'></element>
<div class="container">
    <div class="text">
        <text>丢失儿童寻找</text>
    </div>
    <image class="img" src="../../common/images/gy1.jpg"></image>
    <div class="text1">
        <div class="line_y"></div>
        <text>团队介绍</text>
    </div>
    <div class="text2">
        <text>致力于帮助丢失儿童家庭寻找丢失儿童，让宝贝早日回家。

统一服务电话：

                 400-0000-000</text>
    </div>
    <button class="button" value="点击拨打客服电话" onclick="calling"></button>
    <comp index="3"></comp>
</div>
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.

css源码：

.container {
    flex-direction: column;
    align-items: center;
}
.text {
    display: flex;
    position: fixed;
    padding: 5px 259px 15px 260px;
    background-color: #000000;
}
.text text {
    margin-left: 75px;
    line-height: 50px;
    color: #FFFFFF;
    font-size: 21px;
}
.img {
    margin-top: 71px;
}
.text1 {
    height: 60px;
    margin-top: 10px;
    display: flex;
    align-items: center;
    position: relative;
    padding: 10px 10px 10px 12px;
    background-color: #ccc;
}
.text1 text {
    margin-left: 10px;
    line-height: 30px;
    font-size: 25px;
    color: #656565;
}
.line_y {
    width: 4px;
    height: 35px;
    background-color: #09bb07;
}
.text2 {
    display: flex;
    align-items: center;
    position: relative;
    padding: 40px 10px 10px 12px;
}
.text2 text {
    font-size: 21px;
    color: #656565;
}
.button {
    margin-top: 20px;
    border-radius: 7px;
    margin-bottom: 150px;
    width: 100%;
    height: 55px;
    border: 1px solid #ccc;
    background-color: #FFFFFF;
    text-color: #1C1C1C;
    font-size: 25px;
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.

js源码：

export default {
    data: {
        title: ""
    },
    onInit() {
        this.title = this.$t('strings.world');
    }
}
1.
2.
3.
4.
5.
6.
7.
8.

导航栏

export default [
    {
        img:'common/images/icon1.png',
        simg:'common/images/icon2.png',
        name:'首页'
    },
    {
        img:'common/images/upload.png',
        simg:'common/images/upload-1.png',
        name:'信息上传'
    },
    {
        img:'common/images/icon3.png',
        simg:'common/images/icon4.png',
        name:'更多功能'
    },
    {
        img:'common/images/us.png',
        simg:'common/images/us-1.png',
        name:'关于我们'
    },
]
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.